diff --git a/.github/ISSUE_TEMPLATE.md b/.github/ISSUE_TEMPLATE/bug_report.md
similarity index 83%
rename from .github/ISSUE_TEMPLATE.md
rename to .github/ISSUE_TEMPLATE/bug_report.md
index 3a375bcbe9..9c0577106e 100644
--- a/.github/ISSUE_TEMPLATE.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@@ -1,10 +1,19 @@
+---
+name: Bug report
+about: Report a bug
+title: ''
+labels: type:bug
+assignees: ''
+
+---
+
 <!--
 
-Note: If you are using www.overleaf.com and have a problem, 
+Note: If you are using www.overleaf.com and have a problem,
       or if you would like to request a new feature please contact
       the support team at support@overleaf.com
-      
-      This form should only be used to report bugs in the 
+
+      This form should only be used to report bugs in the
       Community Edition release of Overleaf.
 
 -->
diff --git a/README.md b/README.md
index 4895254926..33e7a8956b 100644
--- a/README.md
+++ b/README.md
@@ -14,39 +14,52 @@
   <a href="#license">License</a>
 </p>
 
-<img src="doc/screenshot.png" alt="A screenshot of a project being edited in Overleaf Community Edition">
+<img src="doc/screenshot.png" alt="A screenshot of a project being edited in Overleaf Extended Community Edition">
 <p align="center">
-  Figure 1: A screenshot of a project being edited in Overleaf Community Edition.
+  Figure 1: A screenshot of a project being edited in Overleaf Extended Community Edition.
 </p>
 
 ## Community Edition
 
-[Overleaf](https://www.overleaf.com) is an open-source online real-time collaborative LaTeX editor. We run a hosted version at [www.overleaf.com](https://www.overleaf.com), but you can also run your own local version, and contribute to the development of Overleaf.
+[Overleaf](https://www.overleaf.com) is an open-source online real-time collaborative LaTeX editor. Overleaf runs a hosted version at [www.overleaf.com](https://www.overleaf.com), but you can also run your own local version, and contribute to the development of Overleaf.
+
+## Extended Community Edition
+
+The present "extended" version of Overleaf CE includes:
+
+- Template Gallery
+- Sandboxed Compiles with TeX Live image selection
+- LDAP authentication
+- SAML authentication
+- OpenID Connect authentication
+- Real-time track changes and comments
+- Autocomplete of reference keys
+- Symbol Palette
+- "From External URL" feature
+
+> [!CAUTION]
+> Overleaf Community Edition is intended for use in environments where **all** users are trusted. Community Edition is **not** appropriate for scenarios where isolation of users is required due to Sandbox Compiles not being available. When not using Sandboxed Compiles, users have full read and write access to the `sharelatex` container resources (filesystem, network, environment variables) when running LaTeX compiles. 
+Therefore, in any environment where not all users can be fully trusted, it is strongly recommended to enable the Sandboxed Compiles feature available in the Extended Community Edition.
+
+For more information on Sandbox Compiles check out Overleaf [documentation](https://docs.overleaf.com/on-premises/configuration/overleaf-toolkit/server-pro-only-configuration/sandboxed-compiles).
 
 ## Enterprise
 
-If you want help installing and maintaining Overleaf in your lab or workplace, we offer an officially supported version called [Overleaf Server Pro](https://www.overleaf.com/for/enterprises). It also includes more features for security (SSO with LDAP or SAML), administration and collaboration (e.g. tracked changes). [Find out more!](https://www.overleaf.com/for/enterprises)
-
-## Keeping up to date
-
-Sign up to the [mailing list](https://mailchi.mp/overleaf.com/community-edition-and-server-pro) to get updates on Overleaf releases and development.
+If you want help installing and maintaining Overleaf in your lab or workplace, Overleaf offers an officially supported version called [Overleaf Server Pro](https://www.overleaf.com/for/enterprises).
 
 ## Installation
 
-We have detailed installation instructions in the [Overleaf Toolkit](https://github.com/overleaf/toolkit/).
-
-## Upgrading
-
-If you are upgrading from a previous version of Overleaf, please see the [Release Notes section on the Wiki](https://github.com/overleaf/overleaf/wiki#release-notes) for all of the versions between your current version and the version you are upgrading to.
+Detailed installation instructions can be found in the [Overleaf Toolkit](https://github.com/overleaf/toolkit/).
+Configuration details and release history for the Extended Community Edition can be found on the [Extended CE Wiki Page](https://github.com/yu-i-i/overleaf-cep/wiki).
 
 ## Overleaf Docker Image
 
 This repo contains two dockerfiles, [`Dockerfile-base`](server-ce/Dockerfile-base), which builds the
-`sharelatex/sharelatex-base` image, and [`Dockerfile`](server-ce/Dockerfile) which builds the
-`sharelatex/sharelatex` (or "community") image.
+`sharelatex/sharelatex-base:ext-ce` image, and [`Dockerfile`](server-ce/Dockerfile) which builds the
+`sharelatex/sharelatex:ext-ce` image.
 
 The Base image generally contains the basic dependencies like `wget`, plus `texlive`.
-We split this out because it's a pretty heavy set of
+This is split out because it's a pretty heavy set of
 dependencies, and it's nice to not have to rebuild all of that every time.
 
 The `sharelatex/sharelatex` image extends the base image and adds the actual Overleaf code
@@ -54,20 +67,16 @@ and services.
 
 Use `make build-base` and `make build-community` from `server-ce/` to build these images.
 
-We use the [Phusion base-image](https://github.com/phusion/baseimage-docker)
-(which is extended by our `base` image) to provide us with a VM-like container
+The [Phusion base-image](https://github.com/phusion/baseimage-docker)
+(which is extended by the `base` image) provides a VM-like container
 in which to run the Overleaf services. Baseimage uses the `runit` service
-manager to manage services, and we add our init-scripts from the `server-ce/runit`
-folder.
-
-
-## Contributing
-
-Please see the [CONTRIBUTING](CONTRIBUTING.md) file for information on contributing to the development of Overleaf.
+manager to manage services, and init scripts from the `server-ce/runit`
+folder are added.
 
 ## Authors
 
-[The Overleaf Team](https://www.overleaf.com/about)
+[The Overleaf Team](https://www.overleaf.com/about)  
+[yu-i-i](https://github.com/yu-i-i/overleaf-cep) — Extensions for CE unless otherwise noted
 
 ## License
 
diff --git a/develop/README.md b/develop/README.md
index 568259c4e3..8e3f89862c 100644
--- a/develop/README.md
+++ b/develop/README.md
@@ -42,7 +42,7 @@ To do this, use the included `bin/dev` script:
 bin/dev
 ```
 
-This will start all services using `nodemon`, which will automatically monitor the code and restart the services as necessary.
+This will start all services using `node --watch`, which will automatically monitor the code and restart the services as necessary.
 
 To improve performance, you can start only a subset of the services in development mode by providing a space-separated list to the `bin/dev` script:
 
@@ -77,6 +77,7 @@ each service:
 | `filestore`        | 9235 |
 | `notifications`    | 9236 |
 | `real-time`        | 9237 |
+| `references`       | 9238 |
 | `history-v1`       | 9239 |
 | `project-history`  | 9240 |
 
diff --git a/develop/dev.env b/develop/dev.env
index aae91497db..b003e4e0eb 100644
--- a/develop/dev.env
+++ b/develop/dev.env
@@ -6,14 +6,18 @@ DOCUMENT_UPDATER_HOST=document-updater
 FILESTORE_HOST=filestore
 GRACEFUL_SHUTDOWN_DELAY_SECONDS=0
 HISTORY_V1_HOST=history-v1
+HISTORY_REDIS_HOST=redis
 LISTEN_ADDRESS=0.0.0.0
 MONGO_HOST=mongo
 MONGO_URL=mongodb://mongo/sharelatex?directConnection=true
 NOTIFICATIONS_HOST=notifications
 PROJECT_HISTORY_HOST=project-history
+QUEUES_REDIS_HOST=redis
 REALTIME_HOST=real-time
 REDIS_HOST=redis
+REFERENCES_HOST=references
 SESSION_SECRET=foo
+V1_HISTORY_HOST=history-v1
 WEBPACK_HOST=webpack
 WEB_API_PASSWORD=overleaf
 WEB_API_USER=overleaf
diff --git a/develop/docker-compose.dev.yml b/develop/docker-compose.dev.yml
index 4432a24162..65e15ef07b 100644
--- a/develop/docker-compose.dev.yml
+++ b/develop/docker-compose.dev.yml
@@ -112,8 +112,19 @@ services:
       - ../services/real-time/app.js:/overleaf/services/real-time/app.js
       - ../services/real-time/config:/overleaf/services/real-time/config
 
+  references:
+    command: ["node", "--watch", "app.js"]
+    environment:
+      - NODE_OPTIONS=--inspect=0.0.0.0:9229
+    ports:
+      - "127.0.0.1:9238:9229"
+    volumes:
+      - ../services/references/app:/overleaf/services/references/app
+      - ../services/references/config:/overleaf/services/references/config
+      - ../services/references/app.js:/overleaf/services/references/app.js
+
   web:
-    command: ["node", "--watch", "app.js", "--watch-locales"]
+    command: ["node", "--watch", "app.mjs", "--watch-locales"]
     environment:
       - NODE_OPTIONS=--inspect=0.0.0.0:9229
     ports:
diff --git a/develop/docker-compose.yml b/develop/docker-compose.yml
index d0dc8ec6da..e5b84c38b3 100644
--- a/develop/docker-compose.yml
+++ b/develop/docker-compose.yml
@@ -1,6 +1,5 @@
 volumes:
   clsi-cache:
-  clsi-output:
   filestore-public-files:
   filestore-template-files:
   filestore-uploads:
@@ -26,15 +25,16 @@ services:
     env_file:
       - dev.env
     environment:
-      - DOCKER_RUNNER=true
       - TEXLIVE_IMAGE=texlive-full # docker build texlive -t texlive-full
-      - COMPILES_HOST_DIR=${PWD}/compiles
+      - SANDBOXED_COMPILES=true
+      - SANDBOXED_COMPILES_HOST_DIR_COMPILES=${PWD}/compiles
+      - SANDBOXED_COMPILES_HOST_DIR_OUTPUT=${PWD}/output
     user: root
     volumes:
       - ${PWD}/compiles:/overleaf/services/clsi/compiles
+      - ${PWD}/output:/overleaf/services/clsi/output
       - ${DOCKER_SOCKET_PATH:-/var/run/docker.sock}:/var/run/docker.sock
       - clsi-cache:/overleaf/services/clsi/cache
-      - clsi-output:/overleaf/services/clsi/output
 
   contacts:
     build:
@@ -123,7 +123,7 @@ services:
       dockerfile: services/real-time/Dockerfile
     env_file:
       - dev.env
-
+ 
   redis:
     image: redis:5
     ports:
@@ -131,6 +131,13 @@ services:
     volumes:
       - redis-data:/data
 
+  references:
+    build:
+      context: ..
+      dockerfile: services/references/Dockerfile
+    env_file:
+      - dev.env
+
   web:
     build:
       context: ..
@@ -140,7 +147,7 @@ services:
       - dev.env
     environment:
       - APP_NAME=Overleaf Community Edition
-      - ENABLED_LINKED_FILE_TYPES=project_file,project_output_file
+      - ENABLED_LINKED_FILE_TYPES=project_file,project_output_file,url
       - EMAIL_CONFIRMATION_DISABLED=true
       - NODE_ENV=development
       - OVERLEAF_ALLOW_PUBLIC_ACCESS=true
@@ -161,6 +168,7 @@ services:
       - notifications
       - project-history
       - real-time
+      - references
 
   webpack:
     build:
diff --git a/doc/logo.png b/doc/logo.png
index 106926b095..f154ac0cca 100644
Binary files a/doc/logo.png and b/doc/logo.png differ
diff --git a/doc/screenshot.png b/doc/screenshot.png
index 1c1f339630..92633192a5 100644
Binary files a/doc/screenshot.png and b/doc/screenshot.png differ
diff --git a/docker-compose.yml b/docker-compose.yml
index 08d6db6fe7..962adfb5d8 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -32,7 +32,7 @@ services:
             OVERLEAF_REDIS_HOST: redis
             REDIS_HOST: redis
 
-            ENABLED_LINKED_FILE_TYPES: 'project_file,project_output_file'
+            ENABLED_LINKED_FILE_TYPES: 'project_file,project_output_file,url'
 
             # Enables Thumbnail generation using ImageMagick
             ENABLE_CONVERSIONS: 'true'
@@ -73,11 +73,19 @@ services:
             ## Server Pro ##
             ################
 
-            ## Sandboxed Compiles: https://github.com/overleaf/overleaf/wiki/Server-Pro:-Sandboxed-Compiles
+            ## The Community Edition is intended for use in environments where all users are trusted and is not appropriate for
+            ## scenarios where isolation of users is required. Sandboxed Compiles are not available in the Community Edition,
+            ## so the following environment variables must be commented out to avoid compile issues.
+            ##
+            ## Sandboxed Compiles: https://docs.overleaf.com/on-premises/configuration/overleaf-toolkit/server-pro-only-configuration/sandboxed-compiles
             SANDBOXED_COMPILES: 'true'
-            SANDBOXED_COMPILES_SIBLING_CONTAINERS: 'true'
             ### Bind-mount source for /var/lib/overleaf/data/compiles inside the container.
-            SANDBOXED_COMPILES_HOST_DIR: '/home/user/sharelatex_data/data/compiles'
+            SANDBOXED_COMPILES_HOST_DIR_COMPILES: '/home/user/sharelatex_data/data/compiles'
+            ### Bind-mount source for /var/lib/overleaf/data/output inside the container.
+            SANDBOXED_COMPILES_HOST_DIR_OUTPUT: '/home/user/sharelatex_data/data/output'
+            ### Backwards compatibility (before Server Pro 5.5)
+            DOCKER_RUNNER: 'true'
+            SANDBOXED_COMPILES_SIBLING_CONTAINERS: 'true'
 
             ## Works with test LDAP server shown at bottom of docker compose
             # OVERLEAF_LDAP_URL: 'ldap://ldap:389'
diff --git a/libraries/access-token-encryptor/.dockerignore b/libraries/access-token-encryptor/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/access-token-encryptor/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/access-token-encryptor/.gitignore b/libraries/access-token-encryptor/.gitignore
deleted file mode 100644
index 66936c4121..0000000000
--- a/libraries/access-token-encryptor/.gitignore
+++ /dev/null
@@ -1,46 +0,0 @@
-compileFolder
-
-Compiled source #
-###################
-*.com
-*.class
-*.dll
-*.exe
-*.o
-*.so
-
-# Packages #
-############
-# it's better to unpack these files and commit the raw source
-# git has its own built in compression methods
-*.7z
-*.dmg
-*.gz
-*.iso
-*.jar
-*.rar
-*.tar
-*.zip
-
-# Logs and databases #
-######################
-*.log
-*.sql
-*.sqlite
-
-# OS generated files #
-######################
-.DS_Store?
-ehthumbs.db
-Icon?
-Thumbs.db
-
-/node_modules/*
-data/*/*
-
-**.swp
-
-/log.json
-hash_folder
-
-.npmrc
diff --git a/libraries/access-token-encryptor/.nvmrc b/libraries/access-token-encryptor/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/access-token-encryptor/.nvmrc
+++ b/libraries/access-token-encryptor/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/access-token-encryptor/buildscript.txt b/libraries/access-token-encryptor/buildscript.txt
index 967c3063ad..8f08720e7e 100644
--- a/libraries/access-token-encryptor/buildscript.txt
+++ b/libraries/access-token-encryptor/buildscript.txt
@@ -1,10 +1,10 @@
 access-token-encryptor
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/fetch-utils/.dockerignore b/libraries/fetch-utils/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/fetch-utils/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/fetch-utils/.gitignore b/libraries/fetch-utils/.gitignore
deleted file mode 100644
index edb0f85350..0000000000
--- a/libraries/fetch-utils/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/fetch-utils/.nvmrc b/libraries/fetch-utils/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/fetch-utils/.nvmrc
+++ b/libraries/fetch-utils/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/fetch-utils/buildscript.txt b/libraries/fetch-utils/buildscript.txt
index 716d3f0d5c..7008a533a6 100644
--- a/libraries/fetch-utils/buildscript.txt
+++ b/libraries/fetch-utils/buildscript.txt
@@ -1,10 +1,10 @@
 fetch-utils
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/fetch-utils/index.js b/libraries/fetch-utils/index.js
index 643dcc752b..60e8180c7d 100644
--- a/libraries/fetch-utils/index.js
+++ b/libraries/fetch-utils/index.js
@@ -23,11 +23,11 @@ async function fetchJson(url, opts = {}) {
 }
 
 async function fetchJsonWithResponse(url, opts = {}) {
-  const { fetchOpts } = parseOpts(opts)
+  const { fetchOpts, detachSignal } = parseOpts(opts)
   fetchOpts.headers = fetchOpts.headers ?? {}
   fetchOpts.headers.Accept = fetchOpts.headers.Accept ?? 'application/json'
 
-  const response = await performRequest(url, fetchOpts)
+  const response = await performRequest(url, fetchOpts, detachSignal)
   if (!response.ok) {
     const body = await maybeGetResponseBody(response)
     throw new RequestFailedError(url, opts, response, body)
@@ -53,8 +53,8 @@ async function fetchStream(url, opts = {}) {
 }
 
 async function fetchStreamWithResponse(url, opts = {}) {
-  const { fetchOpts, abortController } = parseOpts(opts)
-  const response = await performRequest(url, fetchOpts)
+  const { fetchOpts, abortController, detachSignal } = parseOpts(opts)
+  const response = await performRequest(url, fetchOpts, detachSignal)
 
   if (!response.ok) {
     const body = await maybeGetResponseBody(response)
@@ -76,8 +76,8 @@ async function fetchStreamWithResponse(url, opts = {}) {
  * @throws {RequestFailedError} if the response has a failure status code
  */
 async function fetchNothing(url, opts = {}) {
-  const { fetchOpts } = parseOpts(opts)
-  const response = await performRequest(url, fetchOpts)
+  const { fetchOpts, detachSignal } = parseOpts(opts)
+  const response = await performRequest(url, fetchOpts, detachSignal)
   if (!response.ok) {
     const body = await maybeGetResponseBody(response)
     throw new RequestFailedError(url, opts, response, body)
@@ -108,9 +108,9 @@ async function fetchRedirect(url, opts = {}) {
  * @throws {RequestFailedError} if the response has a non redirect status code or missing Location header
  */
 async function fetchRedirectWithResponse(url, opts = {}) {
-  const { fetchOpts } = parseOpts(opts)
+  const { fetchOpts, detachSignal } = parseOpts(opts)
   fetchOpts.redirect = 'manual'
-  const response = await performRequest(url, fetchOpts)
+  const response = await performRequest(url, fetchOpts, detachSignal)
   if (response.status < 300 || response.status >= 400) {
     const body = await maybeGetResponseBody(response)
     throw new RequestFailedError(url, opts, response, body)
@@ -142,8 +142,8 @@ async function fetchString(url, opts = {}) {
 }
 
 async function fetchStringWithResponse(url, opts = {}) {
-  const { fetchOpts } = parseOpts(opts)
-  const response = await performRequest(url, fetchOpts)
+  const { fetchOpts, detachSignal } = parseOpts(opts)
+  const response = await performRequest(url, fetchOpts, detachSignal)
   if (!response.ok) {
     const body = await maybeGetResponseBody(response)
     throw new RequestFailedError(url, opts, response, body)
@@ -178,13 +178,14 @@ function parseOpts(opts) {
 
   const abortController = new AbortController()
   fetchOpts.signal = abortController.signal
+  let detachSignal = () => {}
   if (opts.signal) {
-    abortOnSignal(abortController, opts.signal)
+    detachSignal = abortOnSignal(abortController, opts.signal)
   }
   if (opts.body instanceof Readable) {
     abortOnDestroyedRequest(abortController, fetchOpts.body)
   }
-  return { fetchOpts, abortController }
+  return { fetchOpts, abortController, detachSignal }
 }
 
 function setupJsonBody(fetchOpts, json) {
@@ -208,6 +209,9 @@ function abortOnSignal(abortController, signal) {
     abortController.abort(signal.reason)
   }
   signal.addEventListener('abort', listener)
+  return () => {
+    signal.removeEventListener('abort', listener)
+  }
 }
 
 function abortOnDestroyedRequest(abortController, stream) {
@@ -226,11 +230,12 @@ function abortOnDestroyedResponse(abortController, response) {
   })
 }
 
-async function performRequest(url, fetchOpts) {
+async function performRequest(url, fetchOpts, detachSignal) {
   let response
   try {
     response = await fetch(url, fetchOpts)
   } catch (err) {
+    detachSignal()
     if (fetchOpts.body instanceof Readable) {
       fetchOpts.body.destroy()
     }
@@ -239,6 +244,7 @@ async function performRequest(url, fetchOpts) {
       method: fetchOpts.method ?? 'GET',
     })
   }
+  response.body.on('close', detachSignal)
   if (fetchOpts.body instanceof Readable) {
     response.body.on('close', () => {
       if (!fetchOpts.body.readableEnded) {
diff --git a/libraries/fetch-utils/test/unit/FetchUtilsTests.js b/libraries/fetch-utils/test/unit/FetchUtilsTests.js
index e9fd0ff231..691e90778d 100644
--- a/libraries/fetch-utils/test/unit/FetchUtilsTests.js
+++ b/libraries/fetch-utils/test/unit/FetchUtilsTests.js
@@ -1,6 +1,9 @@
 const { expect } = require('chai')
+const fs = require('node:fs')
+const events = require('node:events')
 const { FetchError, AbortError } = require('node-fetch')
 const { Readable } = require('node:stream')
+const { pipeline } = require('node:stream/promises')
 const { once } = require('node:events')
 const { TestServer } = require('./helpers/TestServer')
 const selfsigned = require('selfsigned')
@@ -203,6 +206,31 @@ describe('fetch-utils', function () {
       ).to.be.rejectedWith(AbortError)
       expect(stream.destroyed).to.be.true
     })
+
+    it('detaches from signal on success', async function () {
+      const signal = AbortSignal.timeout(10_000)
+      for (let i = 0; i < 20; i++) {
+        const s = await fetchStream(this.url('/hello'), { signal })
+        expect(events.getEventListeners(signal, 'abort')).to.have.length(1)
+        await pipeline(s, fs.createWriteStream('/dev/null'))
+        expect(events.getEventListeners(signal, 'abort')).to.have.length(0)
+      }
+    })
+
+    it('detaches from signal on error', async function () {
+      const signal = AbortSignal.timeout(10_000)
+      for (let i = 0; i < 20; i++) {
+        try {
+          await fetchStream(this.url('/500'), { signal })
+        } catch (err) {
+          if (err instanceof RequestFailedError && err.response.status === 500)
+            continue
+          throw err
+        } finally {
+          expect(events.getEventListeners(signal, 'abort')).to.have.length(0)
+        }
+      }
+    })
   })
 
   describe('fetchNothing', function () {
@@ -391,9 +419,16 @@ async function* infiniteIterator() {
 async function abortOnceReceived(func, server) {
   const controller = new AbortController()
   const promise = func(controller.signal)
+  expect(events.getEventListeners(controller.signal, 'abort')).to.have.length(1)
   await once(server.events, 'request-received')
   controller.abort()
-  return await promise
+  try {
+    return await promise
+  } finally {
+    expect(events.getEventListeners(controller.signal, 'abort')).to.have.length(
+      0
+    )
+  }
 }
 
 async function expectRequestAborted(req) {
diff --git a/libraries/logger/.dockerignore b/libraries/logger/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/logger/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/logger/.gitignore b/libraries/logger/.gitignore
deleted file mode 100644
index 2006c875a4..0000000000
--- a/libraries/logger/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-node_modules
-
-.npmrc
diff --git a/libraries/logger/.nvmrc b/libraries/logger/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/logger/.nvmrc
+++ b/libraries/logger/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/logger/buildscript.txt b/libraries/logger/buildscript.txt
index 7db4c0c4c3..e2520c4800 100644
--- a/libraries/logger/buildscript.txt
+++ b/libraries/logger/buildscript.txt
@@ -1,10 +1,10 @@
 logger
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/metrics/.dockerignore b/libraries/metrics/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/metrics/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/metrics/.gitignore b/libraries/metrics/.gitignore
deleted file mode 100644
index 2006c875a4..0000000000
--- a/libraries/metrics/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-node_modules
-
-.npmrc
diff --git a/libraries/metrics/.nvmrc b/libraries/metrics/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/metrics/.nvmrc
+++ b/libraries/metrics/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/metrics/buildscript.txt b/libraries/metrics/buildscript.txt
index 2919cb8335..d1e272c356 100644
--- a/libraries/metrics/buildscript.txt
+++ b/libraries/metrics/buildscript.txt
@@ -1,10 +1,10 @@
 metrics
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/metrics/initialize.js b/libraries/metrics/initialize.js
index 1028ee06c3..f1a77666c7 100644
--- a/libraries/metrics/initialize.js
+++ b/libraries/metrics/initialize.js
@@ -5,6 +5,8 @@
  * before any other module to support code instrumentation.
  */
 
+const metricsModuleImportStartTime = performance.now()
+
 const APP_NAME = process.env.METRICS_APP_NAME || 'unknown'
 const BUILD_VERSION = process.env.BUILD_VERSION
 const ENABLE_PROFILE_AGENT = process.env.ENABLE_PROFILE_AGENT === 'true'
@@ -103,3 +105,5 @@ function recordProcessStart() {
   const metrics = require('.')
   metrics.inc('process_startup')
 }
+
+module.exports = { metricsModuleImportStartTime }
diff --git a/libraries/metrics/package.json b/libraries/metrics/package.json
index 384e58cfe5..19b566c2b0 100644
--- a/libraries/metrics/package.json
+++ b/libraries/metrics/package.json
@@ -9,7 +9,7 @@
   "main": "index.js",
   "dependencies": {
     "@google-cloud/opentelemetry-cloud-trace-exporter": "^2.1.0",
-    "@google-cloud/profiler": "^6.0.0",
+    "@google-cloud/profiler": "^6.0.3",
     "@opentelemetry/api": "^1.4.1",
     "@opentelemetry/auto-instrumentations-node": "^0.39.1",
     "@opentelemetry/exporter-trace-otlp-http": "^0.41.2",
diff --git a/libraries/mongo-utils/.dockerignore b/libraries/mongo-utils/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/mongo-utils/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/mongo-utils/.gitignore b/libraries/mongo-utils/.gitignore
deleted file mode 100644
index edb0f85350..0000000000
--- a/libraries/mongo-utils/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/mongo-utils/.nvmrc b/libraries/mongo-utils/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/mongo-utils/.nvmrc
+++ b/libraries/mongo-utils/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/mongo-utils/batchedUpdate.js b/libraries/mongo-utils/batchedUpdate.js
index 5e97f45aca..41af41f0d4 100644
--- a/libraries/mongo-utils/batchedUpdate.js
+++ b/libraries/mongo-utils/batchedUpdate.js
@@ -16,6 +16,7 @@ let VERBOSE_LOGGING
 let BATCH_RANGE_START
 let BATCH_RANGE_END
 let BATCH_MAX_TIME_SPAN_IN_MS
+let BATCHED_UPDATE_RUNNING = false
 
 /**
  * @typedef {import("mongodb").Collection} Collection
@@ -34,6 +35,7 @@ let BATCH_MAX_TIME_SPAN_IN_MS
  * @property {string} [BATCH_RANGE_START]
  * @property {string} [BATCH_SIZE]
  * @property {string} [VERBOSE_LOGGING]
+ * @property {(progress: string) => Promise<void>} [trackProgress]
  */
 
 /**
@@ -209,59 +211,71 @@ async function batchedUpdate(
   update,
   projection,
   findOptions,
-  batchedUpdateOptions
+  batchedUpdateOptions = {}
 ) {
-  ID_EDGE_PAST = await getIdEdgePast(collection)
-  if (!ID_EDGE_PAST) {
-    console.warn(
-      `The collection ${collection.collectionName} appears to be empty.`
-    )
-    return 0
+  // only a single batchedUpdate can run at a time due to global variables
+  if (BATCHED_UPDATE_RUNNING) {
+    throw new Error('batchedUpdate is already running')
   }
-  refreshGlobalOptionsForBatchedUpdate(batchedUpdateOptions)
-
-  findOptions = findOptions || {}
-  findOptions.readPreference = READ_PREFERENCE_SECONDARY
-
-  projection = projection || { _id: 1 }
-  let nextBatch
-  let updated = 0
-  let start = BATCH_RANGE_START
-
-  while (start !== BATCH_RANGE_END) {
-    let end = getNextEnd(start)
-    nextBatch = await getNextBatch(
-      collection,
-      query,
-      start,
-      end,
-      projection,
-      findOptions
-    )
-    if (nextBatch.length > 0) {
-      end = nextBatch[nextBatch.length - 1]._id
-      updated += nextBatch.length
-
-      if (VERBOSE_LOGGING) {
-        console.log(
-          `Running update on batch with ids ${JSON.stringify(
-            nextBatch.map(entry => entry._id)
-          )}`
-        )
-      } else {
-        console.error(`Running update on batch ending ${renderObjectId(end)}`)
-      }
-
-      if (typeof update === 'function') {
-        await update(nextBatch)
-      } else {
-        await performUpdate(collection, nextBatch, update)
-      }
+  try {
+    BATCHED_UPDATE_RUNNING = true
+    ID_EDGE_PAST = await getIdEdgePast(collection)
+    if (!ID_EDGE_PAST) {
+      console.warn(
+        `The collection ${collection.collectionName} appears to be empty.`
+      )
+      return 0
     }
-    console.error(`Completed batch ending ${renderObjectId(end)}`)
-    start = end
+    refreshGlobalOptionsForBatchedUpdate(batchedUpdateOptions)
+    const { trackProgress = async progress => console.warn(progress) } =
+      batchedUpdateOptions
+
+    findOptions = findOptions || {}
+    findOptions.readPreference = READ_PREFERENCE_SECONDARY
+
+    projection = projection || { _id: 1 }
+    let nextBatch
+    let updated = 0
+    let start = BATCH_RANGE_START
+
+    while (start !== BATCH_RANGE_END) {
+      let end = getNextEnd(start)
+      nextBatch = await getNextBatch(
+        collection,
+        query,
+        start,
+        end,
+        projection,
+        findOptions
+      )
+      if (nextBatch.length > 0) {
+        end = nextBatch[nextBatch.length - 1]._id
+        updated += nextBatch.length
+
+        if (VERBOSE_LOGGING) {
+          console.log(
+            `Running update on batch with ids ${JSON.stringify(
+              nextBatch.map(entry => entry._id)
+            )}`
+          )
+        }
+        await trackProgress(
+          `Running update on batch ending ${renderObjectId(end)}`
+        )
+
+        if (typeof update === 'function') {
+          await update(nextBatch)
+        } else {
+          await performUpdate(collection, nextBatch, update)
+        }
+      }
+      await trackProgress(`Completed batch ending ${renderObjectId(end)}`)
+      start = end
+    }
+    return updated
+  } finally {
+    BATCHED_UPDATE_RUNNING = false
   }
-  return updated
 }
 
 /**
diff --git a/libraries/mongo-utils/buildscript.txt b/libraries/mongo-utils/buildscript.txt
index ee90b005fb..ff07040970 100644
--- a/libraries/mongo-utils/buildscript.txt
+++ b/libraries/mongo-utils/buildscript.txt
@@ -1,10 +1,10 @@
 mongo-utils
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/o-error/.dockerignore b/libraries/o-error/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/o-error/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/o-error/.gitignore b/libraries/o-error/.gitignore
deleted file mode 100644
index cf2f0ad3fb..0000000000
--- a/libraries/o-error/.gitignore
+++ /dev/null
@@ -1,5 +0,0 @@
-.nyc_output
-coverage
-node_modules/
-
-.npmrc
diff --git a/libraries/o-error/.nvmrc b/libraries/o-error/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/o-error/.nvmrc
+++ b/libraries/o-error/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/o-error/buildscript.txt b/libraries/o-error/buildscript.txt
index b50683a5d6..6a9334411a 100644
--- a/libraries/o-error/buildscript.txt
+++ b/libraries/o-error/buildscript.txt
@@ -1,10 +1,10 @@
 o-error
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/o-error/index.cjs b/libraries/o-error/index.cjs
index ef08b45f16..0bb7da653a 100644
--- a/libraries/o-error/index.cjs
+++ b/libraries/o-error/index.cjs
@@ -1,20 +1,34 @@
+// @ts-check
+
 /**
  * Light-weight helpers for handling JavaScript Errors in node.js and the
  * browser.
  */
 class OError extends Error {
+  /**
+   * The error that is the underlying cause of this error
+   *
+   * @type {unknown}
+   */
+  cause
+
+  /**
+   * List of errors encountered as the callback chain is unwound
+   *
+   * @type {TaggedError[] | undefined}
+   */
+  _oErrorTags
+
   /**
    * @param {string} message as for built-in Error
    * @param {Object} [info] extra data to attach to the error
-   * @param {Error} [cause] the internal error that caused this error
+   * @param {unknown} [cause] the internal error that caused this error
    */
   constructor(message, info, cause) {
     super(message)
     this.name = this.constructor.name
     if (info) this.info = info
     if (cause) this.cause = cause
-    /** @private @type {Array<TaggedError> | undefined} */
-    this._oErrorTags // eslint-disable-line
   }
 
   /**
@@ -31,7 +45,7 @@ class OError extends Error {
   /**
    * Wrap the given error, which caused this error.
    *
-   * @param {Error} cause the internal error that caused this error
+   * @param {unknown} cause the internal error that caused this error
    * @return {this}
    */
   withCause(cause) {
@@ -65,13 +79,16 @@ class OError extends Error {
    *   }
    * }
    *
-   * @param {Error} error the error to tag
+   * @template {unknown} E
+   * @param {E} error the error to tag
    * @param {string} [message] message with which to tag `error`
    * @param {Object} [info] extra data with wich to tag `error`
-   * @return {Error} the modified `error` argument
+   * @return {E} the modified `error` argument
    */
   static tag(error, message, info) {
-    const oError = /** @type{OError} */ (error)
+    const oError = /** @type {{ _oErrorTags: TaggedError[] | undefined }} */ (
+      error
+    )
 
     if (!oError._oErrorTags) oError._oErrorTags = []
 
@@ -102,7 +119,7 @@ class OError extends Error {
    *
    * If an info property is repeated, the last one wins.
    *
-   * @param {Error | null | undefined} error any error (may or may not be an `OError`)
+   * @param {unknown} error any error (may or may not be an `OError`)
    * @return {Object}
    */
   static getFullInfo(error) {
@@ -129,7 +146,7 @@ class OError extends Error {
    * Return the `stack` property from `error`, including the `stack`s for any
    * tagged errors added with `OError.tag` and for any `cause`s.
    *
-   * @param {Error | null | undefined} error any error (may or may not be an `OError`)
+   * @param {unknown} error any error (may or may not be an `OError`)
    * @return {string}
    */
   static getFullStack(error) {
@@ -143,7 +160,7 @@ class OError extends Error {
       stack += `\n${oError._oErrorTags.map(tag => tag.stack).join('\n')}`
     }
 
-    const causeStack = oError.cause && OError.getFullStack(oError.cause)
+    const causeStack = OError.getFullStack(oError.cause)
     if (causeStack) {
       stack += '\ncaused by:\n' + indent(causeStack)
     }
diff --git a/libraries/o-error/test/o-error-util.test.js b/libraries/o-error/test/o-error-util.test.js
index c86cec44a2..b29dd4900a 100644
--- a/libraries/o-error/test/o-error-util.test.js
+++ b/libraries/o-error/test/o-error-util.test.js
@@ -268,6 +268,11 @@ describe('utils', function () {
       expect(OError.getFullInfo(null)).to.deep.equal({})
     })
 
+    it('works when given a string', function () {
+      const err = 'not an error instance'
+      expect(OError.getFullInfo(err)).to.deep.equal({})
+    })
+
     it('works on a normal error', function () {
       const err = new Error('foo')
       expect(OError.getFullInfo(err)).to.deep.equal({})
diff --git a/libraries/o-error/test/o-error.test.js b/libraries/o-error/test/o-error.test.js
index 84244ec92e..db87f56992 100644
--- a/libraries/o-error/test/o-error.test.js
+++ b/libraries/o-error/test/o-error.test.js
@@ -35,6 +35,14 @@ describe('OError', function () {
     expect(err2.cause.message).to.equal('cause 2')
   })
 
+  it('accepts non-Error causes', function () {
+    const err1 = new OError('foo', {}, 'not-an-error')
+    expect(err1.cause).to.equal('not-an-error')
+
+    const err2 = new OError('foo').withCause('not-an-error')
+    expect(err2.cause).to.equal('not-an-error')
+  })
+
   it('handles a custom error type with a cause', function () {
     function doSomethingBadInternally() {
       throw new Error('internal error')
diff --git a/libraries/object-persistor/.dockerignore b/libraries/object-persistor/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/object-persistor/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/object-persistor/.gitignore b/libraries/object-persistor/.gitignore
deleted file mode 100644
index 6a20893208..0000000000
--- a/libraries/object-persistor/.gitignore
+++ /dev/null
@@ -1,4 +0,0 @@
-/node_modules
-*.swp
-
-.npmrc
diff --git a/libraries/object-persistor/.nvmrc b/libraries/object-persistor/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/object-persistor/.nvmrc
+++ b/libraries/object-persistor/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/object-persistor/buildscript.txt b/libraries/object-persistor/buildscript.txt
index c74883c30d..897e789700 100644
--- a/libraries/object-persistor/buildscript.txt
+++ b/libraries/object-persistor/buildscript.txt
@@ -1,10 +1,10 @@
 object-persistor
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/object-persistor/src/FSPersistor.js b/libraries/object-persistor/src/FSPersistor.js
index 01aab72800..38a81407df 100644
--- a/libraries/object-persistor/src/FSPersistor.js
+++ b/libraries/object-persistor/src/FSPersistor.js
@@ -305,8 +305,10 @@ module.exports = class FSPersistor extends AbstractPersistor {
 
   async _listDirectory(path) {
     if (this.useSubdirectories) {
+      // eslint-disable-next-line @typescript-eslint/return-await
       return await glob(Path.join(path, '**'))
     } else {
+      // eslint-disable-next-line @typescript-eslint/return-await
       return await glob(`${path}_*`)
     }
   }
diff --git a/libraries/object-persistor/src/PerProjectEncryptedS3Persistor.js b/libraries/object-persistor/src/PerProjectEncryptedS3Persistor.js
index 7bd4bb93e5..a0230128fe 100644
--- a/libraries/object-persistor/src/PerProjectEncryptedS3Persistor.js
+++ b/libraries/object-persistor/src/PerProjectEncryptedS3Persistor.js
@@ -33,6 +33,10 @@ const AES256_KEY_LENGTH = 32
  * @property {() => Promise<Array<RootKeyEncryptionKey>>} getRootKeyEncryptionKeys
  */
 
+/**
+ * @typedef {import('./types').ListDirectoryResult} ListDirectoryResult
+ */
+
 /**
  * Helper function to make TS happy when accessing error properties
  * AWSError is not an actual class, so we cannot use instanceof.
@@ -391,9 +395,9 @@ class PerProjectEncryptedS3Persistor extends S3Persistor {
  * A general "cache" for project keys is another alternative. For now, use a helper class.
  */
 class CachedPerProjectEncryptedS3Persistor {
-  /** @type SSECOptions */
+  /** @type SSECOptions  */
   #projectKeyOptions
-  /** @type PerProjectEncryptedS3Persistor */
+  /** @type PerProjectEncryptedS3Persistor  */
   #parent
 
   /**
@@ -424,6 +428,16 @@ class CachedPerProjectEncryptedS3Persistor {
     return await this.#parent.getObjectSize(bucketName, path)
   }
 
+  /**
+   *
+   * @param {string} bucketName
+   * @param {string} path
+   * @return {Promise<ListDirectoryResult>}
+   */
+  async listDirectory(bucketName, path) {
+    return await this.#parent.listDirectory(bucketName, path)
+  }
+
   /**
    * @param {string} bucketName
    * @param {string} path
diff --git a/libraries/object-persistor/src/S3Persistor.js b/libraries/object-persistor/src/S3Persistor.js
index 2835a271ff..1849838ba4 100644
--- a/libraries/object-persistor/src/S3Persistor.js
+++ b/libraries/object-persistor/src/S3Persistor.js
@@ -20,6 +20,18 @@ const { URL } = require('node:url')
 const { WriteError, ReadError, NotFoundError } = require('./Errors')
 const zlib = require('node:zlib')
 
+/**
+ * @typedef {import('aws-sdk/clients/s3').ListObjectsV2Output} ListObjectsV2Output
+ */
+
+/**
+ * @typedef {import('aws-sdk/clients/s3').Object} S3Object
+ */
+
+/**
+ * @typedef {import('./types').ListDirectoryResult} ListDirectoryResult
+ */
+
 /**
  * Wrapper with private fields to avoid revealing them on console, JSON.stringify or similar.
  */
@@ -266,26 +278,12 @@ class S3Persistor extends AbstractPersistor {
    * @return {Promise<void>}
    */
   async deleteDirectory(bucketName, key, continuationToken) {
-    let response
-    const options = { Bucket: bucketName, Prefix: key }
-    if (continuationToken) {
-      options.ContinuationToken = continuationToken
-    }
-
-    try {
-      response = await this._getClientForBucket(bucketName)
-        .listObjectsV2(options)
-        .promise()
-    } catch (err) {
-      throw PersistorHelper.wrapError(
-        err,
-        'failed to list objects in S3',
-        { bucketName, key },
-        ReadError
-      )
-    }
-
-    const objects = response.Contents?.map(item => ({ Key: item.Key || '' }))
+    const { contents, response } = await this.listDirectory(
+      bucketName,
+      key,
+      continuationToken
+    )
+    const objects = contents.map(item => ({ Key: item.Key || '' }))
     if (objects?.length) {
       try {
         await this._getClientForBucket(bucketName)
@@ -316,6 +314,36 @@ class S3Persistor extends AbstractPersistor {
     }
   }
 
+  /**
+   *
+   * @param {string} bucketName
+   * @param {string} key
+   * @param {string} [continuationToken]
+   * @return {Promise<ListDirectoryResult>}
+   */
+  async listDirectory(bucketName, key, continuationToken) {
+    let response
+    const options = { Bucket: bucketName, Prefix: key }
+    if (continuationToken) {
+      options.ContinuationToken = continuationToken
+    }
+
+    try {
+      response = await this._getClientForBucket(bucketName)
+        .listObjectsV2(options)
+        .promise()
+    } catch (err) {
+      throw PersistorHelper.wrapError(
+        err,
+        'failed to list objects in S3',
+        { bucketName, key },
+        ReadError
+      )
+    }
+
+    return { contents: response.Contents ?? [], response }
+  }
+
   /**
    * @param {string} bucketName
    * @param {string} key
diff --git a/libraries/object-persistor/src/types.d.ts b/libraries/object-persistor/src/types.d.ts
new file mode 100644
index 0000000000..5640685a5f
--- /dev/null
+++ b/libraries/object-persistor/src/types.d.ts
@@ -0,0 +1,6 @@
+import type { ListObjectsV2Output, Object } from 'aws-sdk/clients/s3'
+
+export type ListDirectoryResult = {
+  contents: Array<Object>
+  response: ListObjectsV2Output
+}
diff --git a/libraries/overleaf-editor-core/.dockerignore b/libraries/overleaf-editor-core/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/overleaf-editor-core/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/overleaf-editor-core/.gitignore b/libraries/overleaf-editor-core/.gitignore
deleted file mode 100644
index 869500a2c7..0000000000
--- a/libraries/overleaf-editor-core/.gitignore
+++ /dev/null
@@ -1,5 +0,0 @@
-/coverage
-/node_modules
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/overleaf-editor-core/.nvmrc b/libraries/overleaf-editor-core/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/overleaf-editor-core/.nvmrc
+++ b/libraries/overleaf-editor-core/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/overleaf-editor-core/buildscript.txt b/libraries/overleaf-editor-core/buildscript.txt
index e49dc289bf..c0391ca30a 100644
--- a/libraries/overleaf-editor-core/buildscript.txt
+++ b/libraries/overleaf-editor-core/buildscript.txt
@@ -1,10 +1,10 @@
 overleaf-editor-core
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/overleaf-editor-core/index.js b/libraries/overleaf-editor-core/index.js
index df3548c2ed..33b3dcf5dc 100644
--- a/libraries/overleaf-editor-core/index.js
+++ b/libraries/overleaf-editor-core/index.js
@@ -18,6 +18,7 @@ const MoveFileOperation = require('./lib/operation/move_file_operation')
 const SetCommentStateOperation = require('./lib/operation/set_comment_state_operation')
 const EditFileOperation = require('./lib/operation/edit_file_operation')
 const EditNoOperation = require('./lib/operation/edit_no_operation')
+const EditOperationTransformer = require('./lib/operation/edit_operation_transformer')
 const SetFileMetadataOperation = require('./lib/operation/set_file_metadata_operation')
 const NoOperation = require('./lib/operation/no_operation')
 const Operation = require('./lib/operation')
@@ -43,6 +44,8 @@ const TrackingProps = require('./lib/file_data/tracking_props')
 const Range = require('./lib/range')
 const CommentList = require('./lib/file_data/comment_list')
 const LazyStringFileData = require('./lib/file_data/lazy_string_file_data')
+const StringFileData = require('./lib/file_data/string_file_data')
+const EditOperationBuilder = require('./lib/operation/edit_operation_builder')
 
 exports.AddCommentOperation = AddCommentOperation
 exports.Author = Author
@@ -58,6 +61,7 @@ exports.DeleteCommentOperation = DeleteCommentOperation
 exports.File = File
 exports.FileMap = FileMap
 exports.LazyStringFileData = LazyStringFileData
+exports.StringFileData = StringFileData
 exports.History = History
 exports.Label = Label
 exports.AddFileOperation = AddFileOperation
@@ -65,6 +69,8 @@ exports.MoveFileOperation = MoveFileOperation
 exports.SetCommentStateOperation = SetCommentStateOperation
 exports.EditFileOperation = EditFileOperation
 exports.EditNoOperation = EditNoOperation
+exports.EditOperationBuilder = EditOperationBuilder
+exports.EditOperationTransformer = EditOperationTransformer
 exports.SetFileMetadataOperation = SetFileMetadataOperation
 exports.NoOperation = NoOperation
 exports.Operation = Operation
diff --git a/libraries/overleaf-editor-core/lib/change.js b/libraries/overleaf-editor-core/lib/change.js
index e36cda9ad3..cfc3447251 100644
--- a/libraries/overleaf-editor-core/lib/change.js
+++ b/libraries/overleaf-editor-core/lib/change.js
@@ -13,7 +13,7 @@ const V2DocVersions = require('./v2_doc_versions')
 
 /**
  * @import Author from "./author"
- * @import { BlobStore } from "./types"
+ * @import { BlobStore, RawChange, ReadonlyBlobStore } from "./types"
  */
 
 /**
@@ -54,7 +54,7 @@ class Change {
   /**
    * For serialization.
    *
-   * @return {Object}
+   * @return {RawChange}
    */
   toRaw() {
     function toRaw(object) {
@@ -219,7 +219,7 @@ class Change {
    * If this Change contains any File objects, load them.
    *
    * @param {string} kind see {File#load}
-   * @param {BlobStore} blobStore
+   * @param {ReadonlyBlobStore} blobStore
    * @return {Promise<void>}
    */
   async loadFiles(kind, blobStore) {
diff --git a/libraries/overleaf-editor-core/lib/file_data/clear_tracking_props.js b/libraries/overleaf-editor-core/lib/file_data/clear_tracking_props.js
index ba7f0bf00b..b3ddbab7d8 100644
--- a/libraries/overleaf-editor-core/lib/file_data/clear_tracking_props.js
+++ b/libraries/overleaf-editor-core/lib/file_data/clear_tracking_props.js
@@ -1,7 +1,7 @@
 // @ts-check
 
 /**
- * @import { ClearTrackingPropsRawData } from '../types'
+ * @import { ClearTrackingPropsRawData, TrackingDirective } from '../types'
  */
 
 class ClearTrackingProps {
@@ -11,12 +11,27 @@ class ClearTrackingProps {
 
   /**
    * @param {any} other
-   * @returns {boolean}
+   * @returns {other is ClearTrackingProps}
    */
   equals(other) {
     return other instanceof ClearTrackingProps
   }
 
+  /**
+   * @param {TrackingDirective} other
+   * @returns {other is ClearTrackingProps}
+   */
+  canMergeWith(other) {
+    return other instanceof ClearTrackingProps
+  }
+
+  /**
+   * @param {TrackingDirective} other
+   */
+  mergeWith(other) {
+    return this
+  }
+
   /**
    * @returns {ClearTrackingPropsRawData}
    */
diff --git a/libraries/overleaf-editor-core/lib/file_data/lazy_string_file_data.js b/libraries/overleaf-editor-core/lib/file_data/lazy_string_file_data.js
index bc11b3e98d..abc720d10c 100644
--- a/libraries/overleaf-editor-core/lib/file_data/lazy_string_file_data.js
+++ b/libraries/overleaf-editor-core/lib/file_data/lazy_string_file_data.js
@@ -11,7 +11,7 @@ const EditOperation = require('../operation/edit_operation')
 const EditOperationBuilder = require('../operation/edit_operation_builder')
 
 /**
- *  @import { BlobStore, ReadonlyBlobStore, RangesBlob, RawFileData, RawLazyStringFileData } from '../types'
+ *  @import { BlobStore, ReadonlyBlobStore, RangesBlob, RawHashFileData, RawLazyStringFileData } from '../types'
  */
 
 class LazyStringFileData extends FileData {
@@ -159,11 +159,11 @@ class LazyStringFileData extends FileData {
 
   /** @inheritdoc
    * @param {BlobStore} blobStore
-   * @return {Promise<RawFileData>}
+   * @return {Promise<RawHashFileData>}
    */
   async store(blobStore) {
     if (this.operations.length === 0) {
-      /** @type RawFileData */
+      /** @type RawHashFileData */
       const raw = { hash: this.hash }
       if (this.rangesHash) {
         raw.rangesHash = this.rangesHash
@@ -171,9 +171,11 @@ class LazyStringFileData extends FileData {
       return raw
     }
     const eager = await this.toEager(blobStore)
+    const raw = await eager.store(blobStore)
+    this.hash = raw.hash
+    this.rangesHash = raw.rangesHash
     this.operations.length = 0
-    /** @type RawFileData */
-    return await eager.store(blobStore)
+    return raw
   }
 }
 
diff --git a/libraries/overleaf-editor-core/lib/file_data/string_file_data.js b/libraries/overleaf-editor-core/lib/file_data/string_file_data.js
index 2613c30ebc..c78c1e0414 100644
--- a/libraries/overleaf-editor-core/lib/file_data/string_file_data.js
+++ b/libraries/overleaf-editor-core/lib/file_data/string_file_data.js
@@ -8,7 +8,7 @@ const CommentList = require('./comment_list')
 const TrackedChangeList = require('./tracked_change_list')
 
 /**
- * @import { StringFileRawData, RawFileData, BlobStore, CommentRawData } from "../types"
+ * @import { StringFileRawData, RawHashFileData, BlobStore, CommentRawData } from "../types"
  * @import { TrackedChangeRawData, RangesBlob } from "../types"
  * @import EditOperation from "../operation/edit_operation"
  */
@@ -88,6 +88,14 @@ class StringFileData extends FileData {
     return content
   }
 
+  /**
+   * Return docstore view of a doc: each line separated
+   * @return {string[]}
+   */
+  getLines() {
+    return this.getContent({ filterTrackedDeletes: true }).split('\n')
+  }
+
   /** @inheritdoc */
   getByteLength() {
     return Buffer.byteLength(this.content)
@@ -131,7 +139,7 @@ class StringFileData extends FileData {
   /**
    * @inheritdoc
    * @param {BlobStore} blobStore
-   * @return {Promise<RawFileData>}
+   * @return {Promise<RawHashFileData>}
    */
   async store(blobStore) {
     const blob = await blobStore.putString(this.content)
diff --git a/libraries/overleaf-editor-core/lib/file_data/tracked_change.js b/libraries/overleaf-editor-core/lib/file_data/tracked_change.js
index d0e6517d0f..e789a427b0 100644
--- a/libraries/overleaf-editor-core/lib/file_data/tracked_change.js
+++ b/libraries/overleaf-editor-core/lib/file_data/tracked_change.js
@@ -84,6 +84,21 @@ class TrackedChange {
       )
     )
   }
+
+  /**
+   * Return an equivalent tracked change whose extent is limited to the given
+   * range
+   *
+   * @param {Range} range
+   * @returns {TrackedChange | null} - the result or null if the intersection is empty
+   */
+  intersectRange(range) {
+    const intersection = this.range.intersect(range)
+    if (intersection == null) {
+      return null
+    }
+    return new TrackedChange(intersection, this.tracking)
+  }
 }
 
 module.exports = TrackedChange
diff --git a/libraries/overleaf-editor-core/lib/file_data/tracked_change_list.js b/libraries/overleaf-editor-core/lib/file_data/tracked_change_list.js
index 263b37ab50..b302865c70 100644
--- a/libraries/overleaf-editor-core/lib/file_data/tracked_change_list.js
+++ b/libraries/overleaf-editor-core/lib/file_data/tracked_change_list.js
@@ -2,9 +2,11 @@
 const Range = require('../range')
 const TrackedChange = require('./tracked_change')
 const TrackingProps = require('../file_data/tracking_props')
+const { InsertOp, RemoveOp, RetainOp } = require('../operation/scan_op')
 
 /**
  * @import { TrackingDirective, TrackedChangeRawData } from "../types"
+ * @import TextOperation from "../operation/text_operation"
  */
 
 class TrackedChangeList {
@@ -58,6 +60,22 @@ class TrackedChangeList {
     return this._trackedChanges.filter(change => range.contains(change.range))
   }
 
+  /**
+   * Returns tracked changes that overlap with the given range
+   * @param {Range} range
+   * @returns {TrackedChange[]}
+   */
+  intersectRange(range) {
+    const changes = []
+    for (const change of this._trackedChanges) {
+      const intersection = change.intersectRange(range)
+      if (intersection != null) {
+        changes.push(intersection)
+      }
+    }
+    return changes
+  }
+
   /**
    * Returns the tracking props for a given range.
    * @param {Range} range
@@ -89,6 +107,8 @@ class TrackedChangeList {
 
   /**
    * Collapses consecutive (and compatible) ranges
+   *
+   * @private
    * @returns {void}
    */
   _mergeRanges() {
@@ -117,12 +137,28 @@ class TrackedChangeList {
   }
 
   /**
+   * Apply an insert operation
    *
    * @param {number} cursor
    * @param {string} insertedText
    * @param {{tracking?: TrackingProps}} opts
    */
   applyInsert(cursor, insertedText, opts = {}) {
+    this._applyInsert(cursor, insertedText, opts)
+    this._mergeRanges()
+  }
+
+  /**
+   * Apply an insert operation
+   *
+   * This method will not merge ranges at the end
+   *
+   * @private
+   * @param {number} cursor
+   * @param {string} insertedText
+   * @param {{tracking?: TrackingProps}} [opts]
+   */
+  _applyInsert(cursor, insertedText, opts = {}) {
     const newTrackedChanges = []
     for (const trackedChange of this._trackedChanges) {
       if (
@@ -171,15 +207,29 @@ class TrackedChangeList {
       newTrackedChanges.push(newTrackedChange)
     }
     this._trackedChanges = newTrackedChanges
-    this._mergeRanges()
   }
 
   /**
+   * Apply a delete operation to the list of tracked changes
    *
    * @param {number} cursor
    * @param {number} length
    */
   applyDelete(cursor, length) {
+    this._applyDelete(cursor, length)
+    this._mergeRanges()
+  }
+
+  /**
+   * Apply a delete operation to the list of tracked changes
+   *
+   * This method will not merge ranges at the end
+   *
+   * @private
+   * @param {number} cursor
+   * @param {number} length
+   */
+  _applyDelete(cursor, length) {
     const newTrackedChanges = []
     for (const trackedChange of this._trackedChanges) {
       const deletedRange = new Range(cursor, length)
@@ -205,15 +255,31 @@ class TrackedChangeList {
       }
     }
     this._trackedChanges = newTrackedChanges
+  }
+
+  /**
+   * Apply a retain operation to the list of tracked changes
+   *
+   * @param {number} cursor
+   * @param {number} length
+   * @param {{tracking?: TrackingDirective}} [opts]
+   */
+  applyRetain(cursor, length, opts = {}) {
+    this._applyRetain(cursor, length, opts)
     this._mergeRanges()
   }
 
   /**
+   * Apply a retain operation to the list of tracked changes
+   *
+   * This method will not merge ranges at the end
+   *
+   * @private
    * @param {number} cursor
    * @param {number} length
    * @param {{tracking?: TrackingDirective}} opts
    */
-  applyRetain(cursor, length, opts = {}) {
+  _applyRetain(cursor, length, opts = {}) {
     // If there's no tracking info, leave everything as-is
     if (!opts.tracking) {
       return
@@ -269,6 +335,31 @@ class TrackedChangeList {
       newTrackedChanges.push(newTrackedChange)
     }
     this._trackedChanges = newTrackedChanges
+  }
+
+  /**
+   * Apply a text operation to the list of tracked changes
+   *
+   * Ranges are merged only once at the end, for performance and to avoid
+   * problematic edge cases where intermediate ranges get incorrectly merged.
+   *
+   * @param {TextOperation} operation
+   */
+  applyTextOperation(operation) {
+    // this cursor tracks the destination document that gets modified as
+    // operations are applied to it.
+    let cursor = 0
+    for (const op of operation.ops) {
+      if (op instanceof InsertOp) {
+        this._applyInsert(cursor, op.insertion, { tracking: op.tracking })
+        cursor += op.insertion.length
+      } else if (op instanceof RemoveOp) {
+        this._applyDelete(cursor, op.length)
+      } else if (op instanceof RetainOp) {
+        this._applyRetain(cursor, op.length, { tracking: op.tracking })
+        cursor += op.length
+      }
+    }
     this._mergeRanges()
   }
 }
diff --git a/libraries/overleaf-editor-core/lib/file_data/tracking_props.js b/libraries/overleaf-editor-core/lib/file_data/tracking_props.js
index 75ec95c566..82d731a232 100644
--- a/libraries/overleaf-editor-core/lib/file_data/tracking_props.js
+++ b/libraries/overleaf-editor-core/lib/file_data/tracking_props.js
@@ -62,6 +62,35 @@ class TrackingProps {
       this.ts.getTime() === other.ts.getTime()
     )
   }
+
+  /**
+   * Are these tracking props compatible with the other tracking props for merging
+   * ranges?
+   *
+   * @param {TrackingDirective} other
+   * @returns {other is TrackingProps}
+   */
+  canMergeWith(other) {
+    if (!(other instanceof TrackingProps)) {
+      return false
+    }
+    return this.type === other.type && this.userId === other.userId
+  }
+
+  /**
+   * Merge two tracking props
+   *
+   * Assumes that `canMerge(other)` returns true
+   *
+   * @param {TrackingDirective} other
+   */
+  mergeWith(other) {
+    if (!this.canMergeWith(other)) {
+      throw new Error('Cannot merge with incompatible tracking props')
+    }
+    const ts = this.ts <= other.ts ? this.ts : other.ts
+    return new TrackingProps(this.type, this.userId, ts)
+  }
 }
 
 module.exports = TrackingProps
diff --git a/libraries/overleaf-editor-core/lib/history.js b/libraries/overleaf-editor-core/lib/history.js
index d9d1253f34..6a97a6f8a9 100644
--- a/libraries/overleaf-editor-core/lib/history.js
+++ b/libraries/overleaf-editor-core/lib/history.js
@@ -7,7 +7,7 @@ const Change = require('./change')
 const Snapshot = require('./snapshot')
 
 /**
- * @import { BlobStore } from "./types"
+ * @import { BlobStore, ReadonlyBlobStore } from "./types"
  */
 
 class History {
@@ -85,7 +85,7 @@ class History {
    * If this History contains any File objects, load them.
    *
    * @param {string} kind see {File#load}
-   * @param {BlobStore} blobStore
+   * @param {ReadonlyBlobStore} blobStore
    * @return {Promise<void>}
    */
   async loadFiles(kind, blobStore) {
diff --git a/libraries/overleaf-editor-core/lib/operation/edit_operation_builder.js b/libraries/overleaf-editor-core/lib/operation/edit_operation_builder.js
index febdebc034..7d5bb81aae 100644
--- a/libraries/overleaf-editor-core/lib/operation/edit_operation_builder.js
+++ b/libraries/overleaf-editor-core/lib/operation/edit_operation_builder.js
@@ -36,6 +36,20 @@ class EditOperationBuilder {
     }
     throw new Error('Unsupported operation in EditOperationBuilder.fromJSON')
   }
+
+  /**
+   * @param {unknown} raw
+   * @return {raw is RawEditOperation}
+   */
+  static isValid(raw) {
+    return (
+      isTextOperation(raw) ||
+      isRawAddCommentOperation(raw) ||
+      isRawDeleteCommentOperation(raw) ||
+      isRawSetCommentStateOperation(raw) ||
+      isRawEditNoOperation(raw)
+    )
+  }
 }
 
 /**
diff --git a/libraries/overleaf-editor-core/lib/operation/index.js b/libraries/overleaf-editor-core/lib/operation/index.js
index ebc6f73907..ae7f2bcf01 100644
--- a/libraries/overleaf-editor-core/lib/operation/index.js
+++ b/libraries/overleaf-editor-core/lib/operation/index.js
@@ -13,7 +13,7 @@ let EditFileOperation = null
 let SetFileMetadataOperation = null
 
 /**
- * @import { BlobStore } from "../types"
+ * @import { ReadonlyBlobStore } from "../types"
  * @import Snapshot from "../snapshot"
  */
 
@@ -80,7 +80,7 @@ class Operation {
    * If this operation references any files, load the files.
    *
    * @param {string} kind see {File#load}
-   * @param {BlobStore} blobStore
+   * @param {ReadOnlyBlobStore} blobStore
    * @return {Promise<void>}
    */
   async loadFiles(kind, blobStore) {}
diff --git a/libraries/overleaf-editor-core/lib/operation/scan_op.js b/libraries/overleaf-editor-core/lib/operation/scan_op.js
index 4f179f24b4..fd322459cc 100644
--- a/libraries/overleaf-editor-core/lib/operation/scan_op.js
+++ b/libraries/overleaf-editor-core/lib/operation/scan_op.js
@@ -175,7 +175,7 @@ class InsertOp extends ScanOp {
       return false
     }
     if (this.tracking) {
-      if (!this.tracking.equals(other.tracking)) {
+      if (!other.tracking || !this.tracking.canMergeWith(other.tracking)) {
         return false
       }
     } else if (other.tracking) {
@@ -198,7 +198,10 @@ class InsertOp extends ScanOp {
       throw new Error('Cannot merge with incompatible operation')
     }
     this.insertion += other.insertion
-    // We already have the same tracking info and commentIds
+    if (this.tracking != null && other.tracking != null) {
+      this.tracking = this.tracking.mergeWith(other.tracking)
+    }
+    // We already have the same commentIds
   }
 
   /**
@@ -306,9 +309,13 @@ class RetainOp extends ScanOp {
       return false
     }
     if (this.tracking) {
-      return this.tracking.equals(other.tracking)
+      if (!other.tracking || !this.tracking.canMergeWith(other.tracking)) {
+        return false
+      }
+    } else if (other.tracking) {
+      return false
     }
-    return !other.tracking
+    return true
   }
 
   /**
@@ -319,6 +326,9 @@ class RetainOp extends ScanOp {
       throw new Error('Cannot merge with incompatible operation')
     }
     this.length += other.length
+    if (this.tracking != null && other.tracking != null) {
+      this.tracking = this.tracking.mergeWith(other.tracking)
+    }
   }
 
   /**
diff --git a/libraries/overleaf-editor-core/lib/operation/text_operation.js b/libraries/overleaf-editor-core/lib/operation/text_operation.js
index 148570fa42..61c7f124b4 100644
--- a/libraries/overleaf-editor-core/lib/operation/text_operation.js
+++ b/libraries/overleaf-editor-core/lib/operation/text_operation.js
@@ -314,25 +314,18 @@ class TextOperation extends EditOperation {
             str
           )
         }
-        file.trackedChanges.applyRetain(result.length, op.length, {
-          tracking: op.tracking,
-        })
         result += str.slice(inputCursor, inputCursor + op.length)
         inputCursor += op.length
       } else if (op instanceof InsertOp) {
         if (containsNonBmpChars(op.insertion)) {
           throw new InvalidInsertionError(str, op.toJSON())
         }
-        file.trackedChanges.applyInsert(result.length, op.insertion, {
-          tracking: op.tracking,
-        })
         file.comments.applyInsert(
           new Range(result.length, op.insertion.length),
           { commentIds: op.commentIds }
         )
         result += op.insertion
       } else if (op instanceof RemoveOp) {
-        file.trackedChanges.applyDelete(result.length, op.length)
         file.comments.applyDelete(new Range(result.length, op.length))
         inputCursor += op.length
       } else {
@@ -352,6 +345,8 @@ class TextOperation extends EditOperation {
       throw new TextOperation.TooLongError(operation, result.length)
     }
 
+    file.trackedChanges.applyTextOperation(this)
+
     file.content = result
   }
 
@@ -400,44 +395,36 @@ class TextOperation extends EditOperation {
     for (let i = 0, l = ops.length; i < l; i++) {
       const op = ops[i]
       if (op instanceof RetainOp) {
-        // Where we need to end up after the retains
-        const target = strIndex + op.length
-        // A previous retain could have overriden some tracking info. Now we
-        // need to restore it.
-        const previousRanges = previousState.trackedChanges.inRange(
-          new Range(strIndex, op.length)
-        )
-
-        let removeTrackingInfoIfNeeded
         if (op.tracking) {
-          removeTrackingInfoIfNeeded = new ClearTrackingProps()
-        }
+          // Where we need to end up after the retains
+          const target = strIndex + op.length
+          // A previous retain could have overriden some tracking info. Now we
+          // need to restore it.
+          const previousChanges = previousState.trackedChanges.intersectRange(
+            new Range(strIndex, op.length)
+          )
 
-        for (const trackedChange of previousRanges) {
-          if (strIndex < trackedChange.range.start) {
-            inverse.retain(trackedChange.range.start - strIndex, {
-              tracking: removeTrackingInfoIfNeeded,
+          for (const change of previousChanges) {
+            if (strIndex < change.range.start) {
+              inverse.retain(change.range.start - strIndex, {
+                tracking: new ClearTrackingProps(),
+              })
+              strIndex = change.range.start
+            }
+            inverse.retain(change.range.length, {
+              tracking: change.tracking,
             })
-            strIndex = trackedChange.range.start
+            strIndex += change.range.length
           }
-          if (trackedChange.range.end < strIndex + op.length) {
-            inverse.retain(trackedChange.range.length, {
-              tracking: trackedChange.tracking,
+          if (strIndex < target) {
+            inverse.retain(target - strIndex, {
+              tracking: new ClearTrackingProps(),
             })
-            strIndex = trackedChange.range.end
+            strIndex = target
           }
-          if (trackedChange.range.end !== strIndex) {
-            // No need to split the range at the end
-            const [left] = trackedChange.range.splitAt(strIndex)
-            inverse.retain(left.length, { tracking: trackedChange.tracking })
-            strIndex = left.end
-          }
-        }
-        if (strIndex < target) {
-          inverse.retain(target - strIndex, {
-            tracking: removeTrackingInfoIfNeeded,
-          })
-          strIndex = target
+        } else {
+          inverse.retain(op.length)
+          strIndex += op.length
         }
       } else if (op instanceof InsertOp) {
         inverse.remove(op.insertion.length)
diff --git a/libraries/overleaf-editor-core/lib/range.js b/libraries/overleaf-editor-core/lib/range.js
index bc47632f92..b3fb2bd78b 100644
--- a/libraries/overleaf-editor-core/lib/range.js
+++ b/libraries/overleaf-editor-core/lib/range.js
@@ -86,10 +86,32 @@ class Range {
   }
 
   /**
-   * @param {Range} range
+   * Does this range overlap another range?
+   *
+   * Overlapping means that the two ranges have at least one character in common
+   *
+   * @param {Range} other - the other range
    */
-  overlaps(range) {
-    return this.start < range.end && this.end > range.start
+  overlaps(other) {
+    return this.start < other.end && this.end > other.start
+  }
+
+  /**
+   * Does this range overlap the start of another range?
+   *
+   * @param {Range} other - the other range
+   */
+  overlapsStart(other) {
+    return this.start <= other.start && this.end > other.start
+  }
+
+  /**
+   * Does this range overlap the end of another range?
+   *
+   * @param {Range} other - the other range
+   */
+  overlapsEnd(other) {
+    return this.start < other.end && this.end >= other.end
   }
 
   /**
@@ -227,6 +249,26 @@ class Range {
     )
     return [rangeUpToCursor, rangeAfterCursor]
   }
+
+  /**
+   * Returns the intersection of this range with another range
+   *
+   * @param {Range} other - the other range
+   * @return {Range | null} the intersection or null if the intersection is empty
+   */
+  intersect(other) {
+    if (this.contains(other)) {
+      return other
+    } else if (other.contains(this)) {
+      return this
+    } else if (other.overlapsStart(this)) {
+      return new Range(this.pos, other.end - this.start)
+    } else if (other.overlapsEnd(this)) {
+      return new Range(other.pos, this.end - other.start)
+    } else {
+      return null
+    }
+  }
 }
 
 module.exports = Range
diff --git a/libraries/overleaf-editor-core/test/lazy_string_file_data.test.js b/libraries/overleaf-editor-core/test/lazy_string_file_data.test.js
index 4c9f4aa497..946e6cd5d1 100644
--- a/libraries/overleaf-editor-core/test/lazy_string_file_data.test.js
+++ b/libraries/overleaf-editor-core/test/lazy_string_file_data.test.js
@@ -193,4 +193,13 @@ describe('LazyStringFileData', function () {
     expect(fileData.getStringLength()).to.equal(longString.length)
     expect(fileData.getOperations()).to.have.length(1)
   })
+
+  it('truncates its operations after being stored', async function () {
+    const testHash = File.EMPTY_FILE_HASH
+    const fileData = new LazyStringFileData(testHash, undefined, 0)
+    fileData.edit(new TextOperation().insert('abc'))
+    const stored = await fileData.store(this.blobStore)
+    expect(fileData.hash).to.equal(stored.hash)
+    expect(fileData.operations).to.deep.equal([])
+  })
 })
diff --git a/libraries/overleaf-editor-core/test/range.test.js b/libraries/overleaf-editor-core/test/range.test.js
index daad8fd6ed..9a048d5c03 100644
--- a/libraries/overleaf-editor-core/test/range.test.js
+++ b/libraries/overleaf-editor-core/test/range.test.js
@@ -1,4 +1,3 @@
-// @ts-check
 'use strict'
 
 const { expect } = require('chai')
@@ -449,4 +448,44 @@ describe('Range', function () {
       expect(() => range.insertAt(16, 3)).to.throw()
     })
   })
+
+  describe('intersect', function () {
+    it('should handle partially overlapping ranges', function () {
+      const range1 = new Range(5, 10)
+      const range2 = new Range(3, 6)
+      const intersection1 = range1.intersect(range2)
+      expect(intersection1.pos).to.equal(5)
+      expect(intersection1.length).to.equal(4)
+      const intersection2 = range2.intersect(range1)
+      expect(intersection2.pos).to.equal(5)
+      expect(intersection2.length).to.equal(4)
+    })
+
+    it('should intersect with itself', function () {
+      const range = new Range(5, 10)
+      const intersection = range.intersect(range)
+      expect(intersection.pos).to.equal(5)
+      expect(intersection.length).to.equal(10)
+    })
+
+    it('should handle nested ranges', function () {
+      const range1 = new Range(5, 10)
+      const range2 = new Range(7, 2)
+      const intersection1 = range1.intersect(range2)
+      expect(intersection1.pos).to.equal(7)
+      expect(intersection1.length).to.equal(2)
+      const intersection2 = range2.intersect(range1)
+      expect(intersection2.pos).to.equal(7)
+      expect(intersection2.length).to.equal(2)
+    })
+
+    it('should handle disconnected ranges', function () {
+      const range1 = new Range(5, 10)
+      const range2 = new Range(20, 30)
+      const intersection1 = range1.intersect(range2)
+      expect(intersection1).to.be.null
+      const intersection2 = range2.intersect(range1)
+      expect(intersection2).to.be.null
+    })
+  })
 })
diff --git a/libraries/overleaf-editor-core/test/scan_op.test.js b/libraries/overleaf-editor-core/test/scan_op.test.js
index 80ab69114e..98f4834d48 100644
--- a/libraries/overleaf-editor-core/test/scan_op.test.js
+++ b/libraries/overleaf-editor-core/test/scan_op.test.js
@@ -107,7 +107,7 @@ describe('RetainOp', function () {
     expect(op1.equals(new RetainOp(3))).to.be.true
   })
 
-  it('cannot merge with another RetainOp if tracking info is different', function () {
+  it('cannot merge with another RetainOp if the tracking user is different', function () {
     const op1 = new RetainOp(
       4,
       new TrackingProps('insert', 'user1', new Date('2024-01-01T00:00:00.000Z'))
@@ -120,14 +120,14 @@ describe('RetainOp', function () {
     expect(() => op1.mergeWith(op2)).to.throw(Error)
   })
 
-  it('can merge with another RetainOp if tracking info is the same', function () {
+  it('can merge with another RetainOp if the tracking user is the same', function () {
     const op1 = new RetainOp(
       4,
       new TrackingProps('insert', 'user1', new Date('2024-01-01T00:00:00.000Z'))
     )
     const op2 = new RetainOp(
       4,
-      new TrackingProps('insert', 'user1', new Date('2024-01-01T00:00:00.000Z'))
+      new TrackingProps('insert', 'user1', new Date('2024-01-01T00:00:01.000Z'))
     )
     op1.mergeWith(op2)
     expect(
@@ -310,7 +310,7 @@ describe('InsertOp', function () {
     expect(() => op1.mergeWith(op2)).to.throw(Error)
   })
 
-  it('cannot merge with another InsertOp if tracking info is different', function () {
+  it('cannot merge with another InsertOp if tracking user is different', function () {
     const op1 = new InsertOp(
       'a',
       new TrackingProps('insert', 'user1', new Date('2024-01-01T00:00:00.000Z'))
@@ -323,7 +323,7 @@ describe('InsertOp', function () {
     expect(() => op1.mergeWith(op2)).to.throw(Error)
   })
 
-  it('can merge with another InsertOp if tracking and comment info is the same', function () {
+  it('can merge with another InsertOp if tracking user and comment info is the same', function () {
     const op1 = new InsertOp(
       'a',
       new TrackingProps(
@@ -338,7 +338,7 @@ describe('InsertOp', function () {
       new TrackingProps(
         'insert',
         'user1',
-        new Date('2024-01-01T00:00:00.000Z')
+        new Date('2024-01-01T00:00:01.000Z')
       ),
       ['1', '2']
     )
diff --git a/libraries/overleaf-editor-core/test/text_operation.test.js b/libraries/overleaf-editor-core/test/text_operation.test.js
index fa9bc62dc3..43b8c707a6 100644
--- a/libraries/overleaf-editor-core/test/text_operation.test.js
+++ b/libraries/overleaf-editor-core/test/text_operation.test.js
@@ -322,6 +322,47 @@ describe('TextOperation', function () {
         new TextOperation().retain(4).remove(4).retain(3)
       )
     })
+
+    it('undoing a tracked delete restores the tracked changes', function () {
+      expectInverseToLeadToInitialState(
+        new StringFileData(
+          'the quick brown fox jumps over the lazy dog',
+          undefined,
+          [
+            {
+              range: { pos: 5, length: 5 },
+              tracking: {
+                ts: '2023-01-01T00:00:00.000Z',
+                type: 'insert',
+                userId: 'user1',
+              },
+            },
+            {
+              range: { pos: 12, length: 3 },
+              tracking: {
+                ts: '2023-01-01T00:00:00.000Z',
+                type: 'delete',
+                userId: 'user1',
+              },
+            },
+            {
+              range: { pos: 18, length: 5 },
+              tracking: {
+                ts: '2023-01-01T00:00:00.000Z',
+                type: 'insert',
+                userId: 'user1',
+              },
+            },
+          ]
+        ),
+        new TextOperation()
+          .retain(7)
+          .retain(13, {
+            tracking: new TrackingProps('delete', 'user1', new Date()),
+          })
+          .retain(23)
+      )
+    })
   })
 
   describe('compose', function () {
diff --git a/libraries/promise-utils/.dockerignore b/libraries/promise-utils/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/promise-utils/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/promise-utils/.gitignore b/libraries/promise-utils/.gitignore
deleted file mode 100644
index edb0f85350..0000000000
--- a/libraries/promise-utils/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/promise-utils/.nvmrc b/libraries/promise-utils/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/promise-utils/.nvmrc
+++ b/libraries/promise-utils/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/promise-utils/buildscript.txt b/libraries/promise-utils/buildscript.txt
index ea5a4a8ef3..a9f0fb0c76 100644
--- a/libraries/promise-utils/buildscript.txt
+++ b/libraries/promise-utils/buildscript.txt
@@ -1,10 +1,10 @@
 promise-utils
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/ranges-tracker/.dockerignore b/libraries/ranges-tracker/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/ranges-tracker/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/ranges-tracker/.gitignore b/libraries/ranges-tracker/.gitignore
deleted file mode 100644
index eac200248b..0000000000
--- a/libraries/ranges-tracker/.gitignore
+++ /dev/null
@@ -1,13 +0,0 @@
-**.swp
-
-app.js
-app/js/
-test/unit/js/
-public/build/
-
-node_modules/
-
-/public/js/chat.js
-plato/
-
-.npmrc
diff --git a/libraries/ranges-tracker/.nvmrc b/libraries/ranges-tracker/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/ranges-tracker/.nvmrc
+++ b/libraries/ranges-tracker/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/ranges-tracker/buildscript.txt b/libraries/ranges-tracker/buildscript.txt
index 2b3aaa82d9..013d56f3ba 100644
--- a/libraries/ranges-tracker/buildscript.txt
+++ b/libraries/ranges-tracker/buildscript.txt
@@ -1,10 +1,10 @@
 ranges-tracker
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/redis-wrapper/.dockerignore b/libraries/redis-wrapper/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/redis-wrapper/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/redis-wrapper/.gitignore b/libraries/redis-wrapper/.gitignore
deleted file mode 100644
index eac200248b..0000000000
--- a/libraries/redis-wrapper/.gitignore
+++ /dev/null
@@ -1,13 +0,0 @@
-**.swp
-
-app.js
-app/js/
-test/unit/js/
-public/build/
-
-node_modules/
-
-/public/js/chat.js
-plato/
-
-.npmrc
diff --git a/libraries/redis-wrapper/.nvmrc b/libraries/redis-wrapper/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/redis-wrapper/.nvmrc
+++ b/libraries/redis-wrapper/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/redis-wrapper/RedisLocker.js b/libraries/redis-wrapper/RedisLocker.js
index b819ad2188..17ad514246 100644
--- a/libraries/redis-wrapper/RedisLocker.js
+++ b/libraries/redis-wrapper/RedisLocker.js
@@ -97,7 +97,8 @@ module.exports = class RedisLocker {
   }
 
   /**
-   * @param {Callback} callback
+   * @param {string} id
+   * @param {function(Error, boolean, string): void} callback
    */
   tryLock(id, callback) {
     if (callback == null) {
@@ -106,7 +107,7 @@ module.exports = class RedisLocker {
     const lockValue = this.randomLock()
     const key = this.getKey(id)
     const startTime = Date.now()
-    return this.rclient.set(
+    this.rclient.set(
       key,
       lockValue,
       'EX',
@@ -121,7 +122,7 @@ module.exports = class RedisLocker {
           const timeTaken = Date.now() - startTime
           if (timeTaken > MAX_REDIS_REQUEST_LENGTH) {
             // took too long, so try to free the lock
-            return this.releaseLock(id, lockValue, function (err, result) {
+            this.releaseLock(id, lockValue, function (err, result) {
               if (err != null) {
                 return callback(err)
               } // error freeing lock
@@ -139,7 +140,8 @@ module.exports = class RedisLocker {
   }
 
   /**
-   * @param {Callback} callback
+   * @param {string} id
+   * @param {function(Error, string): void} callback
    */
   getLock(id, callback) {
     if (callback == null) {
@@ -153,7 +155,7 @@ module.exports = class RedisLocker {
         return callback(e)
       }
 
-      return this.tryLock(id, (error, gotLock, lockValue) => {
+      this.tryLock(id, (error, gotLock, lockValue) => {
         if (error != null) {
           return callback(error)
         }
@@ -173,14 +175,15 @@ module.exports = class RedisLocker {
   }
 
   /**
-   * @param {Callback} callback
+   * @param {string} id
+   * @param {function(Error, boolean): void} callback
    */
   checkLock(id, callback) {
     if (callback == null) {
       callback = function () {}
     }
     const key = this.getKey(id)
-    return this.rclient.exists(key, (err, exists) => {
+    this.rclient.exists(key, (err, exists) => {
       if (err != null) {
         return callback(err)
       }
@@ -196,30 +199,26 @@ module.exports = class RedisLocker {
   }
 
   /**
-   * @param {Callback} callback
+   * @param {string} id
+   * @param {string} lockValue
+   * @param {function(Error, boolean): void} callback
    */
   releaseLock(id, lockValue, callback) {
     const key = this.getKey(id)
-    return this.rclient.eval(
-      UNLOCK_SCRIPT,
-      1,
-      key,
-      lockValue,
-      (err, result) => {
-        if (err != null) {
-          return callback(err)
-        } else if (result != null && result !== 1) {
-          // successful unlock should release exactly one key
-          logger.error(
-            { id, key, lockValue, redis_err: err, redis_result: result },
-            'unlocking error'
-          )
-          metrics.inc(this.metricsPrefix + '-unlock-error')
-          return callback(new Error('tried to release timed out lock'))
-        } else {
-          return callback(null, result)
-        }
+    this.rclient.eval(UNLOCK_SCRIPT, 1, key, lockValue, (err, result) => {
+      if (err != null) {
+        return callback(err)
+      } else if (result != null && result !== 1) {
+        // successful unlock should release exactly one key
+        logger.error(
+          { id, key, lockValue, redis_err: err, redis_result: result },
+          'unlocking error'
+        )
+        metrics.inc(this.metricsPrefix + '-unlock-error')
+        return callback(new Error('tried to release timed out lock'))
+      } else {
+        return callback(null, result)
       }
-    )
+    })
   }
 }
diff --git a/libraries/redis-wrapper/buildscript.txt b/libraries/redis-wrapper/buildscript.txt
index 311348bd7c..54d43d5092 100644
--- a/libraries/redis-wrapper/buildscript.txt
+++ b/libraries/redis-wrapper/buildscript.txt
@@ -1,10 +1,10 @@
 redis-wrapper
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/settings/.dockerignore b/libraries/settings/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/settings/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/settings/.gitignore b/libraries/settings/.gitignore
deleted file mode 100644
index 06d8e1ddb2..0000000000
--- a/libraries/settings/.gitignore
+++ /dev/null
@@ -1,5 +0,0 @@
-/.npmrc
-/node_modules
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/settings/.nvmrc b/libraries/settings/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/settings/.nvmrc
+++ b/libraries/settings/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/settings/buildscript.txt b/libraries/settings/buildscript.txt
index a731e6eb1c..9c7632f23f 100644
--- a/libraries/settings/buildscript.txt
+++ b/libraries/settings/buildscript.txt
@@ -1,10 +1,10 @@
 settings
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/stream-utils/.dockerignore b/libraries/stream-utils/.dockerignore
deleted file mode 100644
index c2658d7d1b..0000000000
--- a/libraries/stream-utils/.dockerignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/libraries/stream-utils/.gitignore b/libraries/stream-utils/.gitignore
deleted file mode 100644
index edb0f85350..0000000000
--- a/libraries/stream-utils/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/libraries/stream-utils/.nvmrc b/libraries/stream-utils/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/libraries/stream-utils/.nvmrc
+++ b/libraries/stream-utils/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/libraries/stream-utils/buildscript.txt b/libraries/stream-utils/buildscript.txt
index 0a8776469f..5af61cc683 100644
--- a/libraries/stream-utils/buildscript.txt
+++ b/libraries/stream-utils/buildscript.txt
@@ -1,10 +1,10 @@
 stream-utils
 --dependencies=None
---docker-repos=gcr.io/overleaf-ops
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
 --env-add=
 --env-pass-through=
 --esmock-loader=False
 --is-library=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/libraries/stream-utils/index.js b/libraries/stream-utils/index.js
index e4c7d60c94..7719d409a4 100644
--- a/libraries/stream-utils/index.js
+++ b/libraries/stream-utils/index.js
@@ -145,6 +145,24 @@ class LoggerStream extends Transform {
   }
 }
 
+class MeteredStream extends Transform {
+  #Metrics
+  #metric
+  #labels
+
+  constructor(Metrics, metric, labels) {
+    super()
+    this.#Metrics = Metrics
+    this.#metric = metric
+    this.#labels = labels
+  }
+
+  _transform(chunk, encoding, callback) {
+    this.#Metrics.count(this.#metric, chunk.byteLength, 1, this.#labels)
+    callback(null, chunk)
+  }
+}
+
 // Export our classes
 
 module.exports = {
@@ -153,6 +171,7 @@ module.exports = {
   LoggerStream,
   LimitedStream,
   TimeoutStream,
+  MeteredStream,
   SizeExceededError,
   AbortError,
 }
diff --git a/package-lock.json b/package-lock.json
index 9e3c53b799..d9d8285618 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "services/analytics",
         "services/chat",
         "services/clsi",
+        "services/clsi-cache",
         "services/clsi-perf",
         "services/contacts",
         "services/docstore",
@@ -40,8 +41,8 @@
         "@types/chai": "^4.3.0",
         "@types/chai-as-promised": "^7.1.8",
         "@types/mocha": "^10.0.6",
-        "@typescript-eslint/eslint-plugin": "^8.0.0",
-        "@typescript-eslint/parser": "^8.0.0",
+        "@typescript-eslint/eslint-plugin": "^8.30.1",
+        "@typescript-eslint/parser": "^8.30.1",
         "eslint": "^8.15.0",
         "eslint-config-prettier": "^8.5.0",
         "eslint-config-standard": "^17.0.0",
@@ -50,12 +51,15 @@
         "eslint-plugin-cypress": "^2.15.1",
         "eslint-plugin-import": "^2.26.0",
         "eslint-plugin-mocha": "^10.1.0",
-        "eslint-plugin-node": "^11.1.0",
+        "eslint-plugin-n": "^15.7.0",
         "eslint-plugin-prettier": "^4.0.0",
         "eslint-plugin-promise": "^6.0.0",
         "eslint-plugin-unicorn": "^56.0.0",
-        "prettier": "3.3.3",
-        "typescript": "^5.5.4"
+        "prettier": "3.6.2",
+        "typescript": "^5.8.3"
+      },
+      "engines": {
+        "npm": "11.4.2"
       }
     },
     "jobs/mirror-documentation": {
@@ -107,7 +111,7 @@
         "lodash": "^4.17.21"
       },
       "devDependencies": {
-        "@typescript-eslint/parser": "^6.7.5"
+        "@typescript-eslint/parser": "^8.30.1"
       }
     },
     "libraries/eslint-plugin/node_modules/@typescript-eslint/parser": {
@@ -208,7 +212,7 @@
       "version": "4.2.0",
       "dependencies": {
         "@google-cloud/opentelemetry-cloud-trace-exporter": "^2.1.0",
-        "@google-cloud/profiler": "^6.0.0",
+        "@google-cloud/profiler": "^6.0.3",
         "@opentelemetry/api": "^1.4.1",
         "@opentelemetry/auto-instrumentations-node": "^0.39.1",
         "@opentelemetry/exporter-trace-otlp-http": "^0.41.2",
@@ -231,6 +235,15 @@
         "@overleaf/logger": "*"
       }
     },
+    "libraries/metrics/node_modules/@opentelemetry/api": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.0.tgz",
+      "integrity": "sha512-3giAOQvZiH5F9bMlMiv8+GSPMeqg0dbaeo58/0SlA9sxSqZhnUtxzX9/2FzyhS9sWQf5S0GJE0AKBrFqjpeYcg==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
     "libraries/metrics/node_modules/yn": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
@@ -506,14 +519,6 @@
         "typescript": "^5.0.4"
       }
     },
-    "node_modules/@aashutoshrathi/word-wrap": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz",
-      "integrity": "sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/@adobe/css-tools": {
       "version": "4.4.2",
       "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.2.tgz",
@@ -1264,10 +1269,11 @@
       }
     },
     "node_modules/@babel/cli": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.24.8.tgz",
-      "integrity": "sha512-isdp+G6DpRyKc+3Gqxy2rjzgF7Zj9K0mzLNnxz+E/fgeag8qT3vVulX4gY9dGO1q0y+0lUv6V3a+uhUzMzrwXg==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.27.0.tgz",
+      "integrity": "sha512-bZfxn8DRxwiVzDO5CEeV+7IqXeCkzI4yYnrQbpwjT76CUyossQc6RYE7n+xfm0/2k40lPaCpW0FhxYs7EBAetw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@jridgewell/trace-mapping": "^0.3.25",
         "commander": "^6.2.0",
@@ -1286,7 +1292,7 @@
       },
       "optionalDependencies": {
         "@nicolo-ribaudo/chokidar-2": "2.1.8-no-fsevents.3",
-        "chokidar": "^3.4.0"
+        "chokidar": "^3.6.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.0.0-0"
@@ -1333,22 +1339,22 @@
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.9.tgz",
-      "integrity": "sha512-lWBYIrF7qK5+GjY5Uy+/hEgp8OJWOD/rpy74GplYRhEauvbHDeFB8t5hPOZxCZ0Oxf4Cc36tK51/l3ymJysrKw==",
+      "version": "7.26.10",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.10.tgz",
+      "integrity": "sha512-vMqyb7XCDMPvJFFOaT9kxtiRh42GwlZEg1/uIgtZshS5a/8OaduUfCi7kynKgc3Tw/6Uo2D+db9qBttghhmxwQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
         "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.9",
+        "@babel/generator": "^7.26.10",
         "@babel/helper-compilation-targets": "^7.26.5",
         "@babel/helper-module-transforms": "^7.26.0",
-        "@babel/helpers": "^7.26.9",
-        "@babel/parser": "^7.26.9",
+        "@babel/helpers": "^7.26.10",
+        "@babel/parser": "^7.26.10",
         "@babel/template": "^7.26.9",
-        "@babel/traverse": "^7.26.9",
-        "@babel/types": "^7.26.9",
+        "@babel/traverse": "^7.26.10",
+        "@babel/types": "^7.26.10",
         "convert-source-map": "^2.0.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -1370,14 +1376,14 @@
       "dev": true
     },
     "node_modules/@babel/generator": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.9.tgz",
-      "integrity": "sha512-kEWdzjOAUMW4hAyrzJ0ZaTOu9OmpyDIQicIh0zg0EEcEkYXZb2TjtBhnHi2ViX7PKwZqF4xwqfAm299/QMP3lg==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.0.tgz",
+      "integrity": "sha512-VybsKvpiN1gU1sdMZIp7FcqphVVKEwcuj02x73uvcHE0PTihx1nlBcowYWhDwjpoAXRv43+gDzyggGnn1XZhVw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/parser": "^7.26.9",
-        "@babel/types": "^7.26.9",
+        "@babel/parser": "^7.27.0",
+        "@babel/types": "^7.27.0",
         "@jridgewell/gen-mapping": "^0.3.5",
         "@jridgewell/trace-mapping": "^0.3.25",
         "jsesc": "^3.0.2"
@@ -1387,25 +1393,13 @@
       }
     },
     "node_modules/@babel/helper-annotate-as-pure": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.24.7.tgz",
-      "integrity": "sha512-BaDeOonYvhdKw+JoMVkAixAAJzG2jVPIwWoKBPdYuY9b452e2rPuI9QPYh3KpofZ3pW2akOmwZLOiOsHMiqRAg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.25.9.tgz",
+      "integrity": "sha512-gv7320KBUFJz1RnylIg5WWYPRXKZ884AGkYpgpWW02TH66Dl+HaC1t1CKd0z3R4b6hdYEcmrNZHUmfCP+1u3/g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.24.7"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-builder-binary-assignment-operator-visitor": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-builder-binary-assignment-operator-visitor/-/helper-builder-binary-assignment-operator-visitor-7.24.7.tgz",
-      "integrity": "sha512-xZeCVVdwb4MsDBkkyZ64tReWYrLRHlMN72vP7Bdm3OUOuyFZExhsHUUnuWnm2/XOlAJzR0LfPpB56WXZn0X/lA==",
-      "dev": true,
-      "dependencies": {
-        "@babel/traverse": "^7.24.7",
-        "@babel/types": "^7.24.7"
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1442,17 +1436,18 @@
       }
     },
     "node_modules/@babel/helper-create-class-features-plugin": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.25.0.tgz",
-      "integrity": "sha512-GYM6BxeQsETc9mnct+nIIpf63SAyzvyYN7UB/IlTyd+MBg06afFGp0mIeUqGyWgS2mxad6vqbMrHVlaL3m70sQ==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.27.0.tgz",
+      "integrity": "sha512-vSGCvMecvFCd/BdpGlhpXYNhhC4ccxyvQWpbGL4CWbvfEoLFWUZuSuf7s9Aw70flgQF+6vptvgK2IfOnKlRmBg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-member-expression-to-functions": "^7.24.8",
-        "@babel/helper-optimise-call-expression": "^7.24.7",
-        "@babel/helper-replace-supers": "^7.25.0",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
-        "@babel/traverse": "^7.25.0",
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-member-expression-to-functions": "^7.25.9",
+        "@babel/helper-optimise-call-expression": "^7.25.9",
+        "@babel/helper-replace-supers": "^7.26.5",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9",
+        "@babel/traverse": "^7.27.0",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -1463,13 +1458,14 @@
       }
     },
     "node_modules/@babel/helper-create-regexp-features-plugin": {
-      "version": "7.25.2",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.25.2.tgz",
-      "integrity": "sha512-+wqVGP+DFmqwFD3EH6TMTfUNeqDehV3E/dl+Sd54eaXqm17tEUNbEIn4sVivVowbvUpOtIGxdo3GoXyDH9N/9g==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-regexp-features-plugin/-/helper-create-regexp-features-plugin-7.27.0.tgz",
+      "integrity": "sha512-fO8l08T76v48BhpNRW/nQ0MxfnSdoSKUJBMjubOAYffsVuGG5qOfMq7N6Es7UJvi7Y8goXXo07EfcHZXDPuELQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "regexpu-core": "^5.3.1",
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "regexpu-core": "^6.2.0",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -1480,10 +1476,11 @@
       }
     },
     "node_modules/@babel/helper-define-polyfill-provider": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.2.tgz",
-      "integrity": "sha512-LV76g+C502biUK6AyZ3LK10vDpDyCzZnhZFXkH1L75zHPj68+qc8Zfpx2th+gzwA2MzyK+1g/3EPl62yFnVttQ==",
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.4.tgz",
+      "integrity": "sha512-jljfR1rGnXXNWnmQg2K3+bvhkxB51Rl32QRaOTuwwjviGrHzIbSc8+x9CpraDtbT7mfyjXObULP4w/adunNwAw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@babel/helper-compilation-targets": "^7.22.6",
         "@babel/helper-plugin-utils": "^7.22.5",
@@ -1496,13 +1493,14 @@
       }
     },
     "node_modules/@babel/helper-member-expression-to-functions": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.24.8.tgz",
-      "integrity": "sha512-LABppdt+Lp/RlBxqrh4qgf1oEH/WxdzQNDJIu5gC/W1GyvPVrOBiItmmM8wan2fm4oYqFuFfkXmlGpLQhPY8CA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.25.9.tgz",
+      "integrity": "sha512-wbfdZ9w5vk0C0oyHqAJbc62+vet5prjj01jjJ8sKn3j9h3MQQlflEdXYvuqRWjHnM12coDEqiC1IRCi0U/EKwQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/traverse": "^7.24.8",
-        "@babel/types": "^7.24.8"
+        "@babel/traverse": "^7.25.9",
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1541,35 +1539,38 @@
       }
     },
     "node_modules/@babel/helper-optimise-call-expression": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.24.7.tgz",
-      "integrity": "sha512-jKiTsW2xmWwxT1ixIdfXUZp+P5yURx2suzLZr5Hi64rURpDYdMW0pv+Uf17EYk2Rd428Lx4tLsnjGJzYKDM/6A==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-optimise-call-expression/-/helper-optimise-call-expression-7.25.9.tgz",
+      "integrity": "sha512-FIpuNaz5ow8VyrYcnXQTDRGvV6tTjkNtCK/RYNDXGSLlUD6cBuQTSw43CShGxjvfBTfcUA/r6UhUCbtYqkhcuQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.24.7"
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-plugin-utils": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.25.9.tgz",
-      "integrity": "sha512-kSMlyUVdWe25rEsRGviIgOWnoT/nfABVWlqt9N19/dIPWViAOW2s9wznP5tURbs/IDuNk4gPy3YdYRgH3uxhBw==",
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.26.5.tgz",
+      "integrity": "sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helper-remap-async-to-generator": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.25.0.tgz",
-      "integrity": "sha512-NhavI2eWEIz/H9dbrG0TuOicDhNexze43i5z7lEqwYm0WEZVTwnPpA0EafUTP7+6/W79HWIP2cTe3Z5NiSTVpw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-remap-async-to-generator/-/helper-remap-async-to-generator-7.25.9.tgz",
+      "integrity": "sha512-IZtukuUeBbhgOcaW2s06OXTzVNJR0ybm4W5xC1opWFFJMZbwRj5LCk+ByYH7WdZPZTt8KnFwA8pvjN2yqcPlgw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-wrap-function": "^7.25.0",
-        "@babel/traverse": "^7.25.0"
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-wrap-function": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1579,14 +1580,15 @@
       }
     },
     "node_modules/@babel/helper-replace-supers": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.25.0.tgz",
-      "integrity": "sha512-q688zIvQVYtZu+i2PsdIu/uWGRpfxzr5WESsfpShfZECkO+d2o+WROWezCi/Q6kJ0tfPa5+pUGUlfx2HhrA3Bg==",
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.26.5.tgz",
+      "integrity": "sha512-bJ6iIVdYX1YooY2X7w1q6VITt+LnUILtNk7zT78ykuwStx8BauCzxvFqFaHjOpW1bVnSUM1PN1f0p5P21wHxvg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-member-expression-to-functions": "^7.24.8",
-        "@babel/helper-optimise-call-expression": "^7.24.7",
-        "@babel/traverse": "^7.25.0"
+        "@babel/helper-member-expression-to-functions": "^7.25.9",
+        "@babel/helper-optimise-call-expression": "^7.25.9",
+        "@babel/traverse": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1595,27 +1597,15 @@
         "@babel/core": "^7.0.0"
       }
     },
-    "node_modules/@babel/helper-simple-access": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.24.7.tgz",
-      "integrity": "sha512-zBAIvbCMh5Ts+b86r/CjU+4XGYIs+R1j951gxI3KmmxBMhCg4oQMsv6ZXQ64XOm/cvzfU1FmoCyt6+owc5QMYg==",
-      "dev": true,
-      "dependencies": {
-        "@babel/traverse": "^7.24.7",
-        "@babel/types": "^7.24.7"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "node_modules/@babel/helper-skip-transparent-expression-wrappers": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.24.7.tgz",
-      "integrity": "sha512-IO+DLT3LQUElMbpzlatRASEyQtfhSE0+m465v++3jyyXeBTBUjtVZg28/gHeV5mrTJqvEKhKroBGAvhW+qPHiQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-skip-transparent-expression-wrappers/-/helper-skip-transparent-expression-wrappers-7.25.9.tgz",
+      "integrity": "sha512-K4Du3BFa3gvyhzgPcntrkDgZzQaq6uozzcpGbOO1OEJaI+EJdqWIMTLgFgQf6lrfiDFo5FU+BxKepI9RmZqahA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/traverse": "^7.24.7",
-        "@babel/types": "^7.24.7"
+        "@babel/traverse": "^7.25.9",
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1649,55 +1639,41 @@
       }
     },
     "node_modules/@babel/helper-wrap-function": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.25.0.tgz",
-      "integrity": "sha512-s6Q1ebqutSiZnEjaofc/UKDyC4SbzV5n5SrA2Gq8UawLycr3i04f1dX4OzoQVnexm6aOCh37SQNYlJ/8Ku+PMQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/helper-wrap-function/-/helper-wrap-function-7.25.9.tgz",
+      "integrity": "sha512-ETzz9UTjQSTmw39GboatdymDq4XIQbR8ySgVrylRhPOFpsd+JrKHIuF0de7GCWmem+T4uC5z7EZguod7Wj4A4g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/template": "^7.25.0",
-        "@babel/traverse": "^7.25.0",
-        "@babel/types": "^7.25.0"
+        "@babel/template": "^7.25.9",
+        "@babel/traverse": "^7.25.9",
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.9.tgz",
-      "integrity": "sha512-Mz/4+y8udxBKdmzt/UjPACs4G3j5SshJJEFFKxlCGPydG4JAHXxjWjAwjd09tf6oINvl1VfMJo+nB7H2YKQ0dA==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.0.tgz",
+      "integrity": "sha512-U5eyP/CTFPuNE3qk+WZMxFkp/4zUzdceQlfzf7DdGdhp+Fezd7HD+i8Y24ZuTMKX3wQBld449jijbGq6OdGNQg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/template": "^7.26.9",
-        "@babel/types": "^7.26.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/highlight": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.7.tgz",
-      "integrity": "sha512-EStJpq4OuY8xYfhGVXngigBJRWxftKX9ksiGDnmlY3o7B/V7KIAc9X4oiK87uPJSc/vs5L869bem5fhZa8caZw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-validator-identifier": "^7.24.7",
-        "chalk": "^2.4.2",
-        "js-tokens": "^4.0.0",
-        "picocolors": "^1.0.0"
+        "@babel/template": "^7.27.0",
+        "@babel/types": "^7.27.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.9.tgz",
-      "integrity": "sha512-81NWa1njQblgZbQHxWHpxxCzNsa3ZwvFqpUg7P+NNUU6f3UU2jBEg4OlF/J6rl8+PQGh1q6/zWScd001YwcA5A==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.0.tgz",
+      "integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.26.9"
+        "@babel/types": "^7.27.0"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -1707,13 +1683,14 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-firefox-class-in-computed-class-key": {
-      "version": "7.25.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.25.3.tgz",
-      "integrity": "sha512-wUrcsxZg6rqBXG05HG1FPYgsP6EvwF4WpBbxIpWIIYnH8wG0gzx3yZY3dtEHas4sTAOGkbTsc9EGPxwff8lRoA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.25.9.tgz",
+      "integrity": "sha512-ZkRyVkThtxQ/J6nv3JFYv1RYY+JT5BvU0y3k5bWrmuG4woXypRa4PXmm9RhOwodRkYFWqC0C0cqcJ4OqR7kW+g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/traverse": "^7.25.3"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1723,12 +1700,13 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-safari-class-field-initializer-scope": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.25.0.tgz",
-      "integrity": "sha512-Bm4bH2qsX880b/3ziJ8KD711LT7z4u8CFudmjqle65AZj/HNUFhEf90dqYv6O86buWvSBmeQDjv0Tn2aF/bIBA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-class-field-initializer-scope/-/plugin-bugfix-safari-class-field-initializer-scope-7.25.9.tgz",
+      "integrity": "sha512-MrGRLZxLD/Zjj0gdU15dfs+HH/OXvnw/U4jJD8vpcP2CJQapPEv1IWwjc/qMg7ItBlPwSv1hRBbb7LeuANdcnw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1738,12 +1716,13 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.25.0.tgz",
-      "integrity": "sha512-lXwdNZtTmeVOOFtwM/WDe7yg1PL8sYhRk/XH0FzbR2HDQ0xC+EnQ/JHeoMYSavtU115tnUk0q9CDyq8si+LMAA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.25.9.tgz",
+      "integrity": "sha512-2qUwwfAFpJLZqxd02YW9btUCZHl+RFvdDkNfZwaIJrvB8Tesjsk8pEQkTvGwZXLqXUx/2oyY3ySRhm6HOXuCug==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1753,14 +1732,15 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.24.7.tgz",
-      "integrity": "sha512-+izXIbke1T33mY4MSNnrqhPXDz01WYhEf3yF5NbnUtkiNnm+XBZJl3kNfoK6NKmYlz/D07+l2GWVK/QfDkNCuQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.25.9.tgz",
+      "integrity": "sha512-6xWgLZTJXwilVjlnV7ospI3xi+sl8lN8rXXbBD6vYn3UYDlGsag8wrZkKcSI8G6KgqKP7vNFaDgeDnfAABq61g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
-        "@babel/plugin-transform-optional-chaining": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9",
+        "@babel/plugin-transform-optional-chaining": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1770,13 +1750,14 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.25.0.tgz",
-      "integrity": "sha512-tggFrk1AIShG/RUQbEwt2Tr/E+ObkfwrPjR6BjbRvsx24+PSjK8zrq0GWPNCjo8qpRx4DuJzlcvWJqlm+0h3kw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.25.9.tgz",
+      "integrity": "sha512-aLnMXYPnzwwqhYSCyXfKkIkYgJ8zv9RK+roo9DkTXz38ynIhd9XCbN08s3MGvqL2MYGVUGdRQLL/JqBIeJhJBg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/traverse": "^7.25.0"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1834,69 +1815,6 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-syntax-async-generators": {
-      "version": "7.8.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generators-7.8.4.tgz",
-      "integrity": "sha512-tycmZxkGfZaxhMRbXlPXuVFpdWlXpir2W4AMhSJgRKzk/eDlIXOhb2LHWoLpDF7TEHylV5zNhykX6KAgHJmTNw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-class-properties": {
-      "version": "7.12.13",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-properties-7.12.13.tgz",
-      "integrity": "sha512-fm4idjKla0YahUNgFNLCB0qySdsoPiZP3iQE3rky0mBUtMZ23yDJ9SJdg6dXTSDnulOVqiF3Hgr9nbXvXTQZYA==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.12.13"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-class-static-block": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-class-static-block/-/plugin-syntax-class-static-block-7.14.5.tgz",
-      "integrity": "sha512-b+YyPmr6ldyNnM6sqYeMWE+bgJcJpO6yS4QD7ymxgH34GBPNDM/THBh8iunyvKIZztiwLH4CJZ0RxTk9emgpjw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-dynamic-import": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.8.3.tgz",
-      "integrity": "sha512-5gdGbFon+PszYzqs83S3E5mpi7/y/8M9eC90MRTZfduQOYW76ig6SOSPNe41IG5LoP3FGBn2N0RjVDSQiS94kQ==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-export-namespace-from": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-export-namespace-from/-/plugin-syntax-export-namespace-from-7.8.3.tgz",
-      "integrity": "sha512-MXf5laXo6c1IbEbegDmzGPwGNTsHZmEy6QGznu5Sh2UCWvueywb2ee+CCE4zQiZstxU9BMoQO9i6zUFSY0Kj0Q==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.3"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
     "node_modules/@babel/plugin-syntax-flow": {
       "version": "7.25.9",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.25.9.tgz",
@@ -1913,12 +1831,13 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-assertions": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.24.7.tgz",
-      "integrity": "sha512-Ec3NRUMoi8gskrkBe3fNmEQfxDvY8bgfQpz6jlk/41kX9eUjvpyqWU7PBP/pLAvMaSQjbMNKJmvX57jP+M6bPg==",
+      "version": "7.26.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.26.0.tgz",
+      "integrity": "sha512-QCWT5Hh830hK5EQa7XzuqIkQU9tT/whqbDz7kuaZMHFl1inRRg7JnuAEOQ0Ur0QUl0NufCk1msK2BeY79Aj/eg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1928,12 +1847,13 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-attributes": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.24.7.tgz",
-      "integrity": "sha512-hbX+lKKeUMGihnK8nvKqmXBInriT3GVjzXKFriV3YC6APGxMbP8RZNFwy91+hocLXq90Mta+HshoB31802bb8A==",
+      "version": "7.26.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.26.0.tgz",
+      "integrity": "sha512-e2dttdsJ1ZTpi3B9UYGLw41hifAubg19AtCu/2I/F1QNVclOBr1dYpTdmdyZ84Xiz43BS/tCUkMAZNLv12Pi+A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1954,25 +1874,14 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-syntax-json-strings": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.8.3.tgz",
-      "integrity": "sha512-lY6kdGpWHvjoe2vk4WrAapEuBR69EMxZl+RoGRhrFGNYVK8mOPAW8VfbT/ZgrFbXlDNiiaxQnAtgVCZ6jv30EA==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
     "node_modules/@babel/plugin-syntax-jsx": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.24.7.tgz",
-      "integrity": "sha512-6ddciUPe/mpMnOKv/U+RSd2vvVy+Yw/JfBB0ZHYjEZt9NLHmCUylNYlsbqCCS1Bffjlb0fCwC9Vqz+sBz6PsiQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.25.9.tgz",
+      "integrity": "sha512-ld6oezHQMZsZfp6pWtbjaNDF2tiiCYYDqQszHt5VV437lewP9aSi2Of99CK0D0XB21k7FLgnLcmQKyKzynfeAA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1981,42 +1890,6 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-syntax-logical-assignment-operators": {
-      "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz",
-      "integrity": "sha512-d8waShlpFDinQ5MtvGU9xDAOzKH47+FFoney2baFIoMr952hKOLp1HR7VszoZvOsV/4+RRszNY7D17ba0te0ig==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.10.4"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-nullish-coalescing-operator": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-nullish-coalescing-operator/-/plugin-syntax-nullish-coalescing-operator-7.8.3.tgz",
-      "integrity": "sha512-aSff4zPII1u2QD7y+F8oDsz19ew4IGEJg9SVW+bqwpwtfFleiQDMdzA/R+UlWDzfnHFCxxleFT0PMIrR36XLNQ==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-numeric-separator": {
-      "version": "7.10.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-numeric-separator/-/plugin-syntax-numeric-separator-7.10.4.tgz",
-      "integrity": "sha512-9H6YdfkcK/uOnY/K7/aA2xpzaAgkQn37yzWUMRK7OaPOqOpGS1+n0H5hxT9AUw9EsSjPW8SVyMJwYRtWs3X3ug==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.10.4"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
     "node_modules/@babel/plugin-syntax-object-rest-spread": {
       "version": "7.8.3",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest-spread-7.8.3.tgz",
@@ -2029,67 +1902,14 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-syntax-optional-catch-binding": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-catch-binding/-/plugin-syntax-optional-catch-binding-7.8.3.tgz",
-      "integrity": "sha512-6VPD0Pc1lpTqw0aKoeRTMiB+kWhAoT24PA+ksWSBrFtl5SIRVpZlwN3NNPQjehA2E/91FV3RjLWoVTglWcSV3Q==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-optional-chaining": {
-      "version": "7.8.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-optional-chaining/-/plugin-syntax-optional-chaining-7.8.3.tgz",
-      "integrity": "sha512-KoK9ErH1MBlCPxV0VANkXW2/dw4vlbGDrFgz8bmUsBGYkFRcbRwMh6cIJubdPrkxRwuGdtCk0v/wPTKbQgBjkg==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.8.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-private-property-in-object": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-private-property-in-object/-/plugin-syntax-private-property-in-object-7.14.5.tgz",
-      "integrity": "sha512-0wVnp9dxJ72ZUJDV27ZfbSj6iHLoytYZmh3rFcxNnvsJF3ktkzLDZPy/mA17HGsaQT3/DQsWYX1f1QGWkCoVUg==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
-    "node_modules/@babel/plugin-syntax-top-level-await": {
-      "version": "7.14.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-top-level-await/-/plugin-syntax-top-level-await-7.14.5.tgz",
-      "integrity": "sha512-hx++upLv5U1rgYfwe1xBQUhRmU41NEvpUvrp8jkrSCdvGSnM5/qdRMtylJ6PG5OFkBaHkbTAKTnd3/YyESRHFw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/helper-plugin-utils": "^7.14.5"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      },
-      "peerDependencies": {
-        "@babel/core": "^7.0.0-0"
-      }
-    },
     "node_modules/@babel/plugin-syntax-typescript": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.24.7.tgz",
-      "integrity": "sha512-c/+fVeJBB0FeKsFvwytYiUD+LBvhHjGSI0g446PRGdSVGZLRNArBUno2PETbAly3tpiNAQR5XaZ+JslxkotsbA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.25.9.tgz",
+      "integrity": "sha512-hjMgRy5hb8uJJjUcdWunWVcoi9bGpJp8p5Ol1229PoN6aytsLwNMgmdftO23wnCLMfVmTwZDWMPNq/D1SY60JQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2115,12 +1935,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-arrow-functions": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.24.7.tgz",
-      "integrity": "sha512-Dt9LQs6iEY++gXUwY03DNFat5C2NbO48jj+j/bSAz6b3HgPs39qcPiYt77fDObIcFwj3/C2ICX9YMwGflUoSHQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.25.9.tgz",
+      "integrity": "sha512-6jmooXYIwn9ca5/RylZADJ+EnSxVUS5sjeJ9UPk6RWRzXCmOJCy6dqItPJFpw2cuCangPK4OYr5uhGKcmrm5Qg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2130,15 +1951,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-generator-functions": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.25.0.tgz",
-      "integrity": "sha512-uaIi2FdqzjpAMvVqvB51S42oC2JEVgh0LDsGfZVDysWE8LrJtQC2jvKmOqEYThKyB7bDEb7BP1GYWDm7tABA0Q==",
+      "version": "7.26.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.26.8.tgz",
+      "integrity": "sha512-He9Ej2X7tNf2zdKMAGOsmg2MrFc+hfoAhd3po4cWfo/NWjzEAKa0oQruj1ROVUdl0e6fb6/kE/G3SSxE0lRJOg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-remap-async-to-generator": "^7.25.0",
-        "@babel/plugin-syntax-async-generators": "^7.8.4",
-        "@babel/traverse": "^7.25.0"
+        "@babel/helper-plugin-utils": "^7.26.5",
+        "@babel/helper-remap-async-to-generator": "^7.25.9",
+        "@babel/traverse": "^7.26.8"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2148,14 +1969,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-to-generator": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.24.7.tgz",
-      "integrity": "sha512-SQY01PcJfmQ+4Ash7NE+rpbLFbmqA2GPIgqzxfFTL4t1FKRq4zTms/7htKpoCUI9OcFYgzqfmCdH53s6/jn5fA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.25.9.tgz",
+      "integrity": "sha512-NT7Ejn7Z/LjUH0Gv5KsBCxh7BH3fbLTV0ptHvpeMvrt3cPThHfJfst9Wrb7S8EvJ7vRTFI7z+VAvFVEQn/m5zQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-imports": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-remap-async-to-generator": "^7.24.7"
+        "@babel/helper-module-imports": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-remap-async-to-generator": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2165,12 +1987,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoped-functions": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.24.7.tgz",
-      "integrity": "sha512-yO7RAz6EsVQDaBH18IDJcMB1HnrUn2FJ/Jslc/WtPPWcjhpUJXU/rjbwmluzp7v/ZzWcEhTMXELnnsz8djWDwQ==",
+      "version": "7.26.5",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.26.5.tgz",
+      "integrity": "sha512-chuTSY+hq09+/f5lMj8ZSYgCFpppV2CbYrhNFJ1BFoXpiWPnnAb7R0MqrafCpN8E1+YRrtM1MXZHJdIx8B6rMQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2180,12 +2003,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoping": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.25.0.tgz",
-      "integrity": "sha512-yBQjYoOjXlFv9nlXb3f1casSHOZkWr29NX+zChVanLg5Nc157CrbEX9D7hxxtTpuFy7Q0YzmmWfJxzvps4kXrQ==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.27.0.tgz",
+      "integrity": "sha512-u1jGphZ8uDI2Pj/HJj6YQ6XQLZCNjOlprjxB5SVz6rq2T6SwAR+CdrWK0CP7F+9rDVMXdB0+r6Am5G5aobOjAQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2195,13 +2019,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-properties": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.24.7.tgz",
-      "integrity": "sha512-vKbfawVYayKcSeSR5YYzzyXvsDFWU2mD8U5TFeXtbCPLFUqe7GyCgvO6XDHzje862ODrOwy6WCPmKeWHbCFJ4w==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.25.9.tgz",
+      "integrity": "sha512-bbMAII8GRSkcd0h0b4X+36GksxuheLFjP65ul9w6C3KgAamI3JqErNgSrosX6ZPj+Mpim5VvEbawXxJCyEUV3Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-class-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2211,14 +2036,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-static-block": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.24.7.tgz",
-      "integrity": "sha512-HMXK3WbBPpZQufbMG4B46A90PkuuhN9vBCb5T8+VAHqvAqvcLi+2cKoukcpmUYkszLhScU3l1iudhrks3DggRQ==",
+      "version": "7.26.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.26.0.tgz",
+      "integrity": "sha512-6J2APTs7BDDm+UMqP1useWqhcRAXo0WIoVj26N7kPFB6S73Lgvyka4KTZYIxtgYXiN5HTyRObA72N2iu628iTQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-class-static-block": "^7.14.5"
+        "@babel/helper-create-class-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2228,16 +2053,17 @@
       }
     },
     "node_modules/@babel/plugin-transform-classes": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.25.0.tgz",
-      "integrity": "sha512-xyi6qjr/fYU304fiRwFbekzkqVJZ6A7hOjWZd+89FVcBqPV3S9Wuozz82xdpLspckeaafntbzglaW4pqpzvtSw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.25.9.tgz",
+      "integrity": "sha512-mD8APIXmseE7oZvZgGABDyM34GUmK45Um2TXiBUt7PnuAxrgoSVf123qUzPxEr/+/BHrRn5NMZCdE2m/1F8DGg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-compilation-targets": "^7.24.8",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-replace-supers": "^7.25.0",
-        "@babel/traverse": "^7.25.0",
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-compilation-targets": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-replace-supers": "^7.25.9",
+        "@babel/traverse": "^7.25.9",
         "globals": "^11.1.0"
       },
       "engines": {
@@ -2248,13 +2074,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-computed-properties": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.24.7.tgz",
-      "integrity": "sha512-25cS7v+707Gu6Ds2oY6tCkUwsJ9YIDbggd9+cu9jzzDgiNq7hR/8dkzxWfKWnTic26vsI3EsCXNd4iEB6e8esQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.25.9.tgz",
+      "integrity": "sha512-HnBegGqXZR12xbcTHlJ9HGxw1OniltT26J5YpfruGqtUHlz/xKf/G2ak9e+t0rVqrjXa9WOhvYPz1ERfMj23AA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/template": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/template": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2264,12 +2091,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-destructuring": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.24.8.tgz",
-      "integrity": "sha512-36e87mfY8TnRxc7yc6M9g9gOB7rKgSahqkIKwLpz4Ppk2+zC2Cy1is0uwtuSG6AE4zlTOUa+7JGz9jCJGLqQFQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.25.9.tgz",
+      "integrity": "sha512-WkCGb/3ZxXepmMiX101nnGiU+1CAdut8oHyEOHxkKuS1qKpU2SMXE2uSvfz8PBuLd49V6LEsbtyPhWC7fnkgvQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2279,13 +2107,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-dotall-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.24.7.tgz",
-      "integrity": "sha512-ZOA3W+1RRTSWvyqcMJDLqbchh7U4NRGqwRfFSVbOLS/ePIP4vHB5e8T8eXcuqyN1QkgKyj5wuW0lcS85v4CrSw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.25.9.tgz",
+      "integrity": "sha512-t7ZQ7g5trIgSRYhI9pIJtRl64KHotutUJsh4Eze5l7olJv+mRSg4/MmbZ0tv1eeqRbdvo/+trvJD/Oc5DmW2cA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2295,12 +2124,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-duplicate-keys": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.24.7.tgz",
-      "integrity": "sha512-JdYfXyCRihAe46jUIliuL2/s0x0wObgwwiGxw/UbgJBr20gQBThrokO4nYKgWkD7uBaqM7+9x5TU7NkExZJyzw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.25.9.tgz",
+      "integrity": "sha512-LZxhJ6dvBb/f3x8xwWIuyiAHy56nrRG3PeYTpBkkzkYRRQ6tJLu68lEF5VIqMUZiAV7a8+Tb78nEoMCMcqjXBw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2310,13 +2140,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-duplicate-named-capturing-groups-regex": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.25.0.tgz",
-      "integrity": "sha512-YLpb4LlYSc3sCUa35un84poXoraOiQucUTTu8X1j18JV+gNa8E0nyUf/CjZ171IRGr4jEguF+vzJU66QZhn29g==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-named-capturing-groups-regex/-/plugin-transform-duplicate-named-capturing-groups-regex-7.25.9.tgz",
+      "integrity": "sha512-0UfuJS0EsXbRvKnwcLjFtJy/Sxc5J5jhLHnFhy7u4zih97Hz6tJkLU+O+FMMrNZrosUPxDi6sYxJ/EA8jDiAog==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.25.0",
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2326,13 +2157,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-dynamic-import": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.24.7.tgz",
-      "integrity": "sha512-sc3X26PhZQDb3JhORmakcbvkeInvxz+A8oda99lj7J60QRuPZvNAk9wQlTBS1ZynelDrDmTU4pw1tyc5d5ZMUg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.25.9.tgz",
+      "integrity": "sha512-GCggjexbmSLaFhqsojeugBpeaRIgWNTcgKVq/0qIteFEqY2A+b9QidYadrWlnbWQUrW5fn+mCvf3tr7OeBFTyg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-dynamic-import": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2342,13 +2173,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-exponentiation-operator": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.24.7.tgz",
-      "integrity": "sha512-Rqe/vSc9OYgDajNIK35u7ot+KeCoetqQYFXM4Epf7M7ez3lWlOjrDjrwMei6caCVhfdw+mIKD4cgdGNy5JQotQ==",
+      "version": "7.26.3",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.26.3.tgz",
+      "integrity": "sha512-7CAHcQ58z2chuXPWblnn1K6rLDnDWieghSOEmqQsrBenH0P9InCUtOJYD89pvngljmZlJcz3fcmgYsXFNGa1ZQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-builder-binary-assignment-operator-visitor": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2358,13 +2189,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-export-namespace-from": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.24.7.tgz",
-      "integrity": "sha512-v0K9uNYsPL3oXZ/7F9NNIbAj2jv1whUEtyA6aujhekLs56R++JDQuzRcP2/z4WX5Vg/c5lE9uWZA0/iUoFhLTA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.25.9.tgz",
+      "integrity": "sha512-2NsEz+CxzJIVOPx2o9UsW1rXLqtChtLoVnwYHHiB04wS5sgn7mrV45fWMBX0Kk+ub9uXytVYfNP2HjbVbCB3Ww==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-export-namespace-from": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2390,13 +2221,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.24.7.tgz",
-      "integrity": "sha512-wo9ogrDG1ITTTBsy46oGiN1dS9A7MROBTcYsfS8DtsImMkHk9JXJ3EWQM6X2SUw4x80uGPlwj0o00Uoc6nEE3g==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.26.9.tgz",
+      "integrity": "sha512-Hry8AusVm8LW5BVFgiyUReuoGzPUpdHQQqJY5bZnbbf+ngOHWuCuYFKw/BqaaWlvEUrF91HMhDtEaI1hZzNbLg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.26.5",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2406,14 +2238,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-function-name": {
-      "version": "7.25.1",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.25.1.tgz",
-      "integrity": "sha512-TVVJVdW9RKMNgJJlLtHsKDTydjZAbwIsn6ySBPQaEAUU5+gVvlJt/9nRmqVbsV/IBanRjzWoaAQKLoamWVOUuA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.25.9.tgz",
+      "integrity": "sha512-8lP+Yxjv14Vc5MuWBpJsoUCd3hD6V9DgBon2FVYL4jJgbnVQ9fTgYmonchzZJOVNgzEgbxp4OwAf6xz6M/14XA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.24.8",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/traverse": "^7.25.1"
+        "@babel/helper-compilation-targets": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2423,13 +2256,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-json-strings": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.24.7.tgz",
-      "integrity": "sha512-2yFnBGDvRuxAaE/f0vfBKvtnvvqU8tGpMHqMNpTN2oWMKIR3NqFkjaAgGwawhqK/pIN2T3XdjGPdaG0vDhOBGw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.25.9.tgz",
+      "integrity": "sha512-xoTMk0WXceiiIvsaquQQUaLLXSW1KJ159KP87VilruQm0LNNGxWzahxSS6T6i4Zg3ezp4vA4zuwiNUR53qmQAw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-json-strings": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2439,12 +2272,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-literals": {
-      "version": "7.25.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.25.2.tgz",
-      "integrity": "sha512-HQI+HcTbm9ur3Z2DkO+jgESMAMcYLuN/A7NRw9juzxAezN9AvqvUTnpKP/9kkYANz6u7dFlAyOu44ejuGySlfw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.25.9.tgz",
+      "integrity": "sha512-9N7+2lFziW8W9pBl2TzaNht3+pgMIRP74zizeCSrtnSKVdUl8mAjjOP2OOVQAfZ881P2cNjDj1uAMEdeD50nuQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2454,13 +2288,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-logical-assignment-operators": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.24.7.tgz",
-      "integrity": "sha512-4D2tpwlQ1odXmTEIFWy9ELJcZHqrStlzK/dAOWYyxX3zT0iXQB6banjgeOJQXzEc4S0E0a5A+hahxPaEFYftsw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.25.9.tgz",
+      "integrity": "sha512-wI4wRAzGko551Y8eVf6iOY9EouIDTtPb0ByZx+ktDGHwv6bHFimrgJM/2T021txPZ2s4c7bqvHbd+vXG6K948Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2470,12 +2304,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-member-expression-literals": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.24.7.tgz",
-      "integrity": "sha512-T/hRC1uqrzXMKLQ6UCwMT85S3EvqaBXDGf0FaMf4446Qx9vKwlghvee0+uuZcDUCZU5RuNi4781UQ7R308zzBw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.25.9.tgz",
+      "integrity": "sha512-PYazBVfofCQkkMzh2P6IdIUaCEWni3iYEerAsRWuVd8+jlM1S9S9cz1dF9hIzyoZ8IA3+OwVYIp9v9e+GbgZhA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2485,13 +2320,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-amd": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.24.7.tgz",
-      "integrity": "sha512-9+pB1qxV3vs/8Hdmz/CulFB8w2tuu6EB94JZFsjdqxQokwGa9Unap7Bo2gGBGIvPmDIVvQrom7r5m/TCDMURhg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.25.9.tgz",
+      "integrity": "sha512-g5T11tnI36jVClQlMlt4qKDLlWnG5pP9CSM4GhdRciTNMRgkfpo5cR6b4rGIOYPgRRuFAvwjPQ/Yk+ql4dyhbw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-module-transforms": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2501,14 +2337,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-commonjs": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.24.8.tgz",
-      "integrity": "sha512-WHsk9H8XxRs3JXKWFiqtQebdh9b/pTk4EgueygFzYlTKAg0Ud985mSevdNjdXdFBATSKVJGQXP1tv6aGbssLKA==",
+      "version": "7.26.3",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.26.3.tgz",
+      "integrity": "sha512-MgR55l4q9KddUDITEzEFYn5ZsGDXMSsU9E+kh7fjRXTIC3RHqfCo8RPRbyReYJh44HQ/yomFkqbOFohXvDCiIQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.24.8",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-simple-access": "^7.24.7"
+        "@babel/helper-module-transforms": "^7.26.0",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2518,15 +2354,16 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-systemjs": {
-      "version": "7.25.0",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.25.0.tgz",
-      "integrity": "sha512-YPJfjQPDXxyQWg/0+jHKj1llnY5f/R6a0p/vP4lPymxLu7Lvl4k2WMitqi08yxwQcCVUUdG9LCUj4TNEgAp3Jw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.25.9.tgz",
+      "integrity": "sha512-hyss7iIlH/zLHaehT+xwiymtPOpsiwIIRlCAOwBB04ta5Tt+lNItADdlXw3jAWZ96VJ2jlhl/c+PNIQPKNfvcA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.25.0",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-validator-identifier": "^7.24.7",
-        "@babel/traverse": "^7.25.0"
+        "@babel/helper-module-transforms": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-validator-identifier": "^7.25.9",
+        "@babel/traverse": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2536,13 +2373,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-umd": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.24.7.tgz",
-      "integrity": "sha512-3aytQvqJ/h9z4g8AsKPLvD4Zqi2qT+L3j7XoFFu1XBlZWEl2/1kWnhmAbxpLgPrHSY0M6UA02jyTiwUVtiKR6A==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.25.9.tgz",
+      "integrity": "sha512-bS9MVObUgE7ww36HEfwe6g9WakQ0KF07mQF74uuXdkoziUPfKyu/nIm663kz//e5O1nPInPFx36z7WJmJ4yNEw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-module-transforms": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-module-transforms": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2552,13 +2390,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-named-capturing-groups-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.24.7.tgz",
-      "integrity": "sha512-/jr7h/EWeJtk1U/uz2jlsCioHkZk1JJZVcc8oQsJ1dUlaJD83f4/6Zeh2aHt9BIFokHIsSeDfhUmju0+1GPd6g==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-named-capturing-groups-regex/-/plugin-transform-named-capturing-groups-regex-7.25.9.tgz",
+      "integrity": "sha512-oqB6WHdKTGl3q/ItQhpLSnWWOpjUJLsOCLVyeFgeTktkBSCiurvPOsyt93gibI9CmuKvTUEtWmG5VhZD+5T/KA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2568,12 +2407,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-new-target": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.24.7.tgz",
-      "integrity": "sha512-RNKwfRIXg4Ls/8mMTza5oPF5RkOW8Wy/WgMAp1/F1yZ8mMbtwXW+HDoJiOsagWrAhI5f57Vncrmr9XeT4CVapA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.25.9.tgz",
+      "integrity": "sha512-U/3p8X1yCSoKyUj2eOBIx3FOn6pElFOKvAAGf8HTtItuPyB+ZeOqfn+mvTtg9ZlOAjsPdK3ayQEjqHjU/yLeVQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2583,13 +2423,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-nullish-coalescing-operator": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.24.7.tgz",
-      "integrity": "sha512-Ts7xQVk1OEocqzm8rHMXHlxvsfZ0cEF2yomUqpKENHWMF4zKk175Y4q8H5knJes6PgYad50uuRmt3UJuhBw8pQ==",
+      "version": "7.26.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.26.6.tgz",
+      "integrity": "sha512-CKW8Vu+uUZneQCPtXmSBUC6NCAUdya26hWCElAWh5mVSlSRsmiCPUUDKb3Z0szng1hiAJa098Hkhg9o4SE35Qw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2599,13 +2439,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-numeric-separator": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.24.7.tgz",
-      "integrity": "sha512-e6q1TiVUzvH9KRvicuxdBTUj4AdKSRwzIyFFnfnezpCfP2/7Qmbb8qbU2j7GODbl4JMkblitCQjKYUaX/qkkwA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.25.9.tgz",
+      "integrity": "sha512-TlprrJ1GBZ3r6s96Yq8gEQv82s8/5HnCVHtEJScUj90thHQbwe+E5MLhi2bbNHBEJuzrvltXSru+BUxHDoog7Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-numeric-separator": "^7.10.4"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2630,15 +2470,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-rest-spread": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.24.7.tgz",
-      "integrity": "sha512-4QrHAr0aXQCEFni2q4DqKLD31n2DL+RxcwnNjDFkSG0eNQ/xCavnRkfCUjsyqGC2OviNJvZOF/mQqZBw7i2C5Q==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.25.9.tgz",
+      "integrity": "sha512-fSaXafEE9CVHPweLYw4J0emp1t8zYTXyzN3UuG+lylqkvYd7RMrsOQ8TYx5RF231be0vqtFC6jnx3UmpJmKBYg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.24.7"
+        "@babel/helper-compilation-targets": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/plugin-transform-parameters": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2648,13 +2488,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-super": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.24.7.tgz",
-      "integrity": "sha512-A/vVLwN6lBrMFmMDmPPz0jnE6ZGx7Jq7d6sT/Ev4H65RER6pZ+kczlf1DthF5N0qaPHBsI7UXiE8Zy66nmAovg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.25.9.tgz",
+      "integrity": "sha512-Kj/Gh+Rw2RNLbCK1VAWj2U48yxxqL2x0k10nPtSdRa0O2xnHXalD0s+o1A6a0W43gJ00ANo38jxkQreckOzv5A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-replace-supers": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-replace-supers": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2664,13 +2505,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-catch-binding": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.24.7.tgz",
-      "integrity": "sha512-uLEndKqP5BfBbC/5jTwPxLh9kqPWWgzN/f8w6UwAIirAEqiIVJWWY312X72Eub09g5KF9+Zn7+hT7sDxmhRuKA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.25.9.tgz",
+      "integrity": "sha512-qM/6m6hQZzDcZF3onzIhZeDHDO43bkNNlOX0i8n3lR6zLbu0GN2d8qfM/IERJZYauhAHSLHy39NF0Ctdvcid7g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-optional-catch-binding": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2680,14 +2521,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-chaining": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.8.tgz",
-      "integrity": "sha512-5cTOLSMs9eypEy8JUVvIKOu6NgvbJMnpG62VpIHrTmROdQ+L5mDAaI40g25k5vXti55JWNX5jCkq3HZxXBQANw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.25.9.tgz",
+      "integrity": "sha512-6AvV0FsLULbpnXeBjrY4dmWF8F7gf8QnvTEoO/wX/5xm/xE1Xo8oPuD3MPS+KS9f9XBEAWN7X1aWr4z9HdOr7A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
-        "@babel/plugin-syntax-optional-chaining": "^7.8.3"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2697,12 +2538,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-parameters": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.24.7.tgz",
-      "integrity": "sha512-yGWW5Rr+sQOhK0Ot8hjDJuxU3XLRQGflvT4lhlSY0DFvdb3TwKaY26CJzHtYllU0vT9j58hc37ndFPsqT1SrzA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.25.9.tgz",
+      "integrity": "sha512-wzz6MKwpnshBAiRmn4jR8LYz/g8Ksg0o80XmwZDlordjwEk9SxBzTWC7F5ef1jhbrbOW2DJ5J6ayRukrJmnr0g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2712,13 +2554,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-methods": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.24.7.tgz",
-      "integrity": "sha512-COTCOkG2hn4JKGEKBADkA8WNb35TGkkRbI5iT845dB+NyqgO8Hn+ajPbSnIQznneJTa3d30scb6iz/DhH8GsJQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.25.9.tgz",
+      "integrity": "sha512-D/JUozNpQLAPUVusvqMxyvjzllRaF8/nSrP1s2YGQT/W4LHK4xxsMcHjhOGTS01mp9Hda8nswb+FblLdJornQw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-class-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2728,15 +2571,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-property-in-object": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.24.7.tgz",
-      "integrity": "sha512-9z76mxwnwFxMyxZWEgdgECQglF2Q7cFLm0kMf8pGwt+GSJsY0cONKj/UuO4bOH0w/uAel3ekS4ra5CEAyJRmDA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.25.9.tgz",
+      "integrity": "sha512-Evf3kcMqzXA3xfYJmZ9Pg1OvKdtqsDMSWBDzZOPLvHiTt36E75jLDQo5w1gtRU95Q4E5PDttrTf25Fw8d/uWLw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-create-class-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/plugin-syntax-private-property-in-object": "^7.14.5"
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-create-class-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2746,12 +2589,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-property-literals": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.24.7.tgz",
-      "integrity": "sha512-EMi4MLQSHfd2nrCqQEWxFdha2gBCqU4ZcCng4WBGZ5CJL4bBRW0ptdqqDdeirGZcpALazVVNJqRmsO8/+oNCBA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.25.9.tgz",
+      "integrity": "sha512-IvIUeV5KrS/VPavfSM/Iu+RE6llrHrYIKY1yfCzyO/lMXHQ+p7uGhonmGVisv6tSBSVgWzMBohTcvkC9vQcQFA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2776,12 +2620,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-react-display-name": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.24.7.tgz",
-      "integrity": "sha512-H/Snz9PFxKsS1JLI4dJLtnJgCJRoo0AUm3chP6NYr+9En1JMKloheEiLIhlp5MDVznWo+H3AAC1Mc8lmUEpsgg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-display-name/-/plugin-transform-react-display-name-7.25.9.tgz",
+      "integrity": "sha512-KJfMlYIUxQB1CJfO3e0+h0ZHWOTLCPP115Awhaz8U0Zpq36Gl/cXlpoyMRnUWlhNUBAzldnCiAZNvCDj7CrKxQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2807,16 +2652,17 @@
       }
     },
     "node_modules/@babel/plugin-transform-react-jsx": {
-      "version": "7.25.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.25.2.tgz",
-      "integrity": "sha512-KQsqEAVBpU82NM/B/N9j9WOdphom1SZH3R+2V7INrQUH+V9EBFwZsEJl8eBIVeQE62FxJCc70jzEZwqU7RcVqA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.25.9.tgz",
+      "integrity": "sha512-s5XwpQYCqGerXl+Pu6VDL3x0j2d82eiV77UJ8a2mDHAW7j9SWRqQ2y1fNo1Z74CdcYipl5Z41zvjj4Nfzq36rw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-module-imports": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/plugin-syntax-jsx": "^7.24.7",
-        "@babel/types": "^7.25.2"
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-module-imports": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/plugin-syntax-jsx": "^7.25.9",
+        "@babel/types": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2826,12 +2672,45 @@
       }
     },
     "node_modules/@babel/plugin-transform-react-jsx-development": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.24.7.tgz",
-      "integrity": "sha512-QG9EnzoGn+Qar7rxuW+ZOsbWOt56FvvI93xInqsZDC5fsekx1AlIO4KIJ5M+D0p0SqSH156EpmZyXq630B8OlQ==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-development/-/plugin-transform-react-jsx-development-7.25.9.tgz",
+      "integrity": "sha512-9mj6rm7XVYs4mdLIpbZnHOYdpW42uoiBCTVowg7sP1thUOiANgMb4UtpRivR0pp5iL+ocvUv7X4mZgFRpJEzGw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/plugin-transform-react-jsx": "^7.24.7"
+        "@babel/plugin-transform-react-jsx": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-self": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.25.9.tgz",
+      "integrity": "sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-react-jsx-source": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.25.9.tgz",
+      "integrity": "sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2841,13 +2720,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-react-pure-annotations": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.24.7.tgz",
-      "integrity": "sha512-PLgBVk3fzbmEjBJ/u8kFzOqS9tUeDjiaWud/rRym/yjCo/M9cASPlnrd2ZmmZpQT40fOOrvR8jh+n8jikrOhNA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.25.9.tgz",
+      "integrity": "sha512-KQ/Takk3T8Qzj5TppkS1be588lkbTp5uj7w6a0LeQaTMSckU/wK0oJ/pih+T690tkgI5jfmg2TqDJvd41Sj1Cg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2857,12 +2737,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-regenerator": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.24.7.tgz",
-      "integrity": "sha512-lq3fvXPdimDrlg6LWBoqj+r/DEWgONuwjuOuQCSYgRroXDH/IdM1C0IZf59fL5cHLpjEH/O6opIRBbqv7ELnuA==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.27.0.tgz",
+      "integrity": "sha512-LX/vCajUJQDqE7Aum/ELUMZAY19+cDpghxrnyt5I1tV6X5PyC86AOoWXWFYFeIvauyeSA6/ktn4tQVn/3ZifsA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
+        "@babel/helper-plugin-utils": "^7.26.5",
         "regenerator-transform": "^0.15.2"
       },
       "engines": {
@@ -2872,13 +2753,31 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/plugin-transform-reserved-words": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.24.7.tgz",
-      "integrity": "sha512-0DUq0pHcPKbjFZCfTss/pGkYMfy3vFWydkUBd9r0GHpIyfs2eCDENvqadMycRS9wZCXR41wucAfJHJmwA0UmoQ==",
+    "node_modules/@babel/plugin-transform-regexp-modifiers": {
+      "version": "7.26.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regexp-modifiers/-/plugin-transform-regexp-modifiers-7.26.0.tgz",
+      "integrity": "sha512-vN6saax7lrA2yA/Pak3sCxuD6F5InBjn9IcrIKQPjpsLvuHYLVroTxjdlVRHjjBWxKOqIwpTXDkOssYT4BFdRw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/plugin-transform-reserved-words": {
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.25.9.tgz",
+      "integrity": "sha512-7DL7DKYjn5Su++4RXu8puKZm2XBPHyjWLUidaPEkCUBbE7IPcsrkRHggAOOKydH1dASWdcUBxrkOGNxUv5P3Jg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2888,12 +2787,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-shorthand-properties": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.24.7.tgz",
-      "integrity": "sha512-KsDsevZMDsigzbA09+vacnLpmPH4aWjcZjXdyFKGzpplxhbeB4wYtury3vglQkg6KM/xEPKt73eCjPPf1PgXBA==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.25.9.tgz",
+      "integrity": "sha512-MUv6t0FhO5qHnS/W8XCbHmiRWOphNufpE1IVxhK5kuN3Td9FT1x4rx4K42s3RYdMXCXpfWkGSbCSd0Z64xA7Ng==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2903,13 +2803,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-spread": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.24.7.tgz",
-      "integrity": "sha512-x96oO0I09dgMDxJaANcRyD4ellXFLLiWhuwDxKZX5g2rWP1bTPkBSwCYv96VDXVT1bD9aPj8tppr5ITIh8hBng==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.25.9.tgz",
+      "integrity": "sha512-oNknIB0TbURU5pqJFVbOOFspVlrpVwo2H1+HUIsVDvp5VauGGDP1ZEvO8Nn5xyMEs3dakajOxlmkNW7kNgSm6A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2919,12 +2820,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-sticky-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.24.7.tgz",
-      "integrity": "sha512-kHPSIJc9v24zEml5geKg9Mjx5ULpfncj0wRpYtxbvKyTtHCYDkVE3aHQ03FrpEo4gEe2vrJJS1Y9CJTaThA52g==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.25.9.tgz",
+      "integrity": "sha512-WqBUSgeVwucYDP9U/xNRQam7xV8W5Zf+6Eo7T2SRVUFlhRiMNFdFz58u0KZmCVVqs2i7SHgpRnAhzRNmKfi2uA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2934,12 +2836,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-template-literals": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.24.7.tgz",
-      "integrity": "sha512-AfDTQmClklHCOLxtGoP7HkeMw56k1/bTQjwsfhL6pppo/M4TOBSq+jjBUBLmV/4oeFg4GWMavIl44ZeCtmmZTw==",
+      "version": "7.26.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.26.8.tgz",
+      "integrity": "sha512-OmGDL5/J0CJPJZTHZbi2XpO0tyT2Ia7fzpW5GURwdtp2X3fMmN8au/ej6peC/T33/+CRiIpA8Krse8hFGVmT5Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2949,12 +2852,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-typeof-symbol": {
-      "version": "7.24.8",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.24.8.tgz",
-      "integrity": "sha512-adNTUpDCVnmAE58VEqKlAA6ZBlNkMnWD0ZcW76lyNFN3MJniyGFZfNwERVk8Ap56MCnXztmDr19T4mPTztcuaw==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.27.0.tgz",
+      "integrity": "sha512-+LLkxA9rKJpNoGsbLnAgOCdESl73vwYn+V6b+5wHbrE7OGKVDPHIQvbFSzqE6rwqaCw2RE+zdJrlLkcf8YOA0w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.8"
+        "@babel/helper-plugin-utils": "^7.26.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2964,16 +2868,17 @@
       }
     },
     "node_modules/@babel/plugin-transform-typescript": {
-      "version": "7.25.2",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.25.2.tgz",
-      "integrity": "sha512-lBwRvjSmqiMYe/pS0+1gggjJleUJi7NzjvQ1Fkqtt69hBa/0t1YuW/MLQMAPixfwaQOHUXsd6jeU3Z+vdGv3+A==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.27.0.tgz",
+      "integrity": "sha512-fRGGjO2UEGPjvEcyAZXRXAS8AfdaQoq7HnxAbJoAoW10B9xOKesmmndJv+Sym2a+9FHWZ9KbyyLCe9s0Sn5jtg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-annotate-as-pure": "^7.24.7",
-        "@babel/helper-create-class-features-plugin": "^7.25.0",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-skip-transparent-expression-wrappers": "^7.24.7",
-        "@babel/plugin-syntax-typescript": "^7.24.7"
+        "@babel/helper-annotate-as-pure": "^7.25.9",
+        "@babel/helper-create-class-features-plugin": "^7.27.0",
+        "@babel/helper-plugin-utils": "^7.26.5",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.25.9",
+        "@babel/plugin-syntax-typescript": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2983,12 +2888,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-escapes": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.24.7.tgz",
-      "integrity": "sha512-U3ap1gm5+4edc2Q/P+9VrBNhGkfnf+8ZqppY71Bo/pzZmXhhLdqgaUl6cuB07O1+AQJtCLfaOmswiNbSQ9ivhw==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.25.9.tgz",
+      "integrity": "sha512-s5EDrE6bW97LtxOcGj1Khcx5AaXwiMmi4toFWRDP9/y0Woo6pXC+iyPu/KuhKtfSrNFd7jJB+/fkOtZy6aIC6Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -2998,13 +2904,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-property-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.24.7.tgz",
-      "integrity": "sha512-uH2O4OV5M9FZYQrwc7NdVmMxQJOCCzFeYudlZSzUAHRFeOujQefa92E74TQDVskNHCzOXoigEuoyzHDhaEaK5w==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.25.9.tgz",
+      "integrity": "sha512-Jt2d8Ga+QwRluxRQ307Vlxa6dMrYEMZCgGxoPR8V52rxPyldHu3hdlHspxaqYmE7oID5+kB+UKUB/eWS+DkkWg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -3014,13 +2921,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.24.7.tgz",
-      "integrity": "sha512-hlQ96MBZSAXUq7ltkjtu3FJCCSMx/j629ns3hA3pXnBXjanNP0LHi+JpPeA81zaWgVK1VGH95Xuy7u0RyQ8kMg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.25.9.tgz",
+      "integrity": "sha512-yoxstj7Rg9dlNn9UQxzk4fcNivwv4nUYz7fYXBaKxvw/lnmPuOm/ikoELygbYq68Bls3D/D+NBPHiLwZdZZ4HA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -3030,13 +2938,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-sets-regex": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.24.7.tgz",
-      "integrity": "sha512-2G8aAvF4wy1w/AGZkemprdGMRg5o6zPNhbHVImRz3lss55TYCBd6xStN19rt8XJHq20sqV0JbyWjOWwQRwV/wg==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.25.9.tgz",
+      "integrity": "sha512-8BYqO3GeVNHtx69fdPshN3fnzUNLrWdHhk/icSwigksJGczKSizZ+Z6SBCxTs723Fr5VSNorTIK7a+R2tISvwQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-create-regexp-features-plugin": "^7.24.7",
-        "@babel/helper-plugin-utils": "^7.24.7"
+        "@babel/helper-create-regexp-features-plugin": "^7.25.9",
+        "@babel/helper-plugin-utils": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -3065,93 +2974,80 @@
       "hasInstallScript": true
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.25.3",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.25.3.tgz",
-      "integrity": "sha512-QsYW7UeAaXvLPX9tdVliMJE7MD7M6MLYVTovRTIwhoYQVFHR1rM4wO8wqAezYi3/BpSD+NzVCZ69R6smWiIi8g==",
+      "version": "7.26.9",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.26.9.tgz",
+      "integrity": "sha512-vX3qPGE8sEKEAZCWk05k3cpTAE3/nOYca++JA+Rd0z2NCNzabmYvEiSShKzm10zdquOIAVXsy2Ei/DTW34KlKQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/compat-data": "^7.25.2",
-        "@babel/helper-compilation-targets": "^7.25.2",
-        "@babel/helper-plugin-utils": "^7.24.8",
-        "@babel/helper-validator-option": "^7.24.8",
-        "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.25.3",
-        "@babel/plugin-bugfix-safari-class-field-initializer-scope": "^7.25.0",
-        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.25.0",
-        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.24.7",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.25.0",
+        "@babel/compat-data": "^7.26.8",
+        "@babel/helper-compilation-targets": "^7.26.5",
+        "@babel/helper-plugin-utils": "^7.26.5",
+        "@babel/helper-validator-option": "^7.25.9",
+        "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.25.9",
+        "@babel/plugin-bugfix-safari-class-field-initializer-scope": "^7.25.9",
+        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.25.9",
+        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.25.9",
+        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.25.9",
         "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
-        "@babel/plugin-syntax-async-generators": "^7.8.4",
-        "@babel/plugin-syntax-class-properties": "^7.12.13",
-        "@babel/plugin-syntax-class-static-block": "^7.14.5",
-        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-        "@babel/plugin-syntax-export-namespace-from": "^7.8.3",
-        "@babel/plugin-syntax-import-assertions": "^7.24.7",
-        "@babel/plugin-syntax-import-attributes": "^7.24.7",
-        "@babel/plugin-syntax-import-meta": "^7.10.4",
-        "@babel/plugin-syntax-json-strings": "^7.8.3",
-        "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4",
-        "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3",
-        "@babel/plugin-syntax-numeric-separator": "^7.10.4",
-        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-syntax-optional-catch-binding": "^7.8.3",
-        "@babel/plugin-syntax-optional-chaining": "^7.8.3",
-        "@babel/plugin-syntax-private-property-in-object": "^7.14.5",
-        "@babel/plugin-syntax-top-level-await": "^7.14.5",
+        "@babel/plugin-syntax-import-assertions": "^7.26.0",
+        "@babel/plugin-syntax-import-attributes": "^7.26.0",
         "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
-        "@babel/plugin-transform-arrow-functions": "^7.24.7",
-        "@babel/plugin-transform-async-generator-functions": "^7.25.0",
-        "@babel/plugin-transform-async-to-generator": "^7.24.7",
-        "@babel/plugin-transform-block-scoped-functions": "^7.24.7",
-        "@babel/plugin-transform-block-scoping": "^7.25.0",
-        "@babel/plugin-transform-class-properties": "^7.24.7",
-        "@babel/plugin-transform-class-static-block": "^7.24.7",
-        "@babel/plugin-transform-classes": "^7.25.0",
-        "@babel/plugin-transform-computed-properties": "^7.24.7",
-        "@babel/plugin-transform-destructuring": "^7.24.8",
-        "@babel/plugin-transform-dotall-regex": "^7.24.7",
-        "@babel/plugin-transform-duplicate-keys": "^7.24.7",
-        "@babel/plugin-transform-duplicate-named-capturing-groups-regex": "^7.25.0",
-        "@babel/plugin-transform-dynamic-import": "^7.24.7",
-        "@babel/plugin-transform-exponentiation-operator": "^7.24.7",
-        "@babel/plugin-transform-export-namespace-from": "^7.24.7",
-        "@babel/plugin-transform-for-of": "^7.24.7",
-        "@babel/plugin-transform-function-name": "^7.25.1",
-        "@babel/plugin-transform-json-strings": "^7.24.7",
-        "@babel/plugin-transform-literals": "^7.25.2",
-        "@babel/plugin-transform-logical-assignment-operators": "^7.24.7",
-        "@babel/plugin-transform-member-expression-literals": "^7.24.7",
-        "@babel/plugin-transform-modules-amd": "^7.24.7",
-        "@babel/plugin-transform-modules-commonjs": "^7.24.8",
-        "@babel/plugin-transform-modules-systemjs": "^7.25.0",
-        "@babel/plugin-transform-modules-umd": "^7.24.7",
-        "@babel/plugin-transform-named-capturing-groups-regex": "^7.24.7",
-        "@babel/plugin-transform-new-target": "^7.24.7",
-        "@babel/plugin-transform-nullish-coalescing-operator": "^7.24.7",
-        "@babel/plugin-transform-numeric-separator": "^7.24.7",
-        "@babel/plugin-transform-object-rest-spread": "^7.24.7",
-        "@babel/plugin-transform-object-super": "^7.24.7",
-        "@babel/plugin-transform-optional-catch-binding": "^7.24.7",
-        "@babel/plugin-transform-optional-chaining": "^7.24.8",
-        "@babel/plugin-transform-parameters": "^7.24.7",
-        "@babel/plugin-transform-private-methods": "^7.24.7",
-        "@babel/plugin-transform-private-property-in-object": "^7.24.7",
-        "@babel/plugin-transform-property-literals": "^7.24.7",
-        "@babel/plugin-transform-regenerator": "^7.24.7",
-        "@babel/plugin-transform-reserved-words": "^7.24.7",
-        "@babel/plugin-transform-shorthand-properties": "^7.24.7",
-        "@babel/plugin-transform-spread": "^7.24.7",
-        "@babel/plugin-transform-sticky-regex": "^7.24.7",
-        "@babel/plugin-transform-template-literals": "^7.24.7",
-        "@babel/plugin-transform-typeof-symbol": "^7.24.8",
-        "@babel/plugin-transform-unicode-escapes": "^7.24.7",
-        "@babel/plugin-transform-unicode-property-regex": "^7.24.7",
-        "@babel/plugin-transform-unicode-regex": "^7.24.7",
-        "@babel/plugin-transform-unicode-sets-regex": "^7.24.7",
+        "@babel/plugin-transform-arrow-functions": "^7.25.9",
+        "@babel/plugin-transform-async-generator-functions": "^7.26.8",
+        "@babel/plugin-transform-async-to-generator": "^7.25.9",
+        "@babel/plugin-transform-block-scoped-functions": "^7.26.5",
+        "@babel/plugin-transform-block-scoping": "^7.25.9",
+        "@babel/plugin-transform-class-properties": "^7.25.9",
+        "@babel/plugin-transform-class-static-block": "^7.26.0",
+        "@babel/plugin-transform-classes": "^7.25.9",
+        "@babel/plugin-transform-computed-properties": "^7.25.9",
+        "@babel/plugin-transform-destructuring": "^7.25.9",
+        "@babel/plugin-transform-dotall-regex": "^7.25.9",
+        "@babel/plugin-transform-duplicate-keys": "^7.25.9",
+        "@babel/plugin-transform-duplicate-named-capturing-groups-regex": "^7.25.9",
+        "@babel/plugin-transform-dynamic-import": "^7.25.9",
+        "@babel/plugin-transform-exponentiation-operator": "^7.26.3",
+        "@babel/plugin-transform-export-namespace-from": "^7.25.9",
+        "@babel/plugin-transform-for-of": "^7.26.9",
+        "@babel/plugin-transform-function-name": "^7.25.9",
+        "@babel/plugin-transform-json-strings": "^7.25.9",
+        "@babel/plugin-transform-literals": "^7.25.9",
+        "@babel/plugin-transform-logical-assignment-operators": "^7.25.9",
+        "@babel/plugin-transform-member-expression-literals": "^7.25.9",
+        "@babel/plugin-transform-modules-amd": "^7.25.9",
+        "@babel/plugin-transform-modules-commonjs": "^7.26.3",
+        "@babel/plugin-transform-modules-systemjs": "^7.25.9",
+        "@babel/plugin-transform-modules-umd": "^7.25.9",
+        "@babel/plugin-transform-named-capturing-groups-regex": "^7.25.9",
+        "@babel/plugin-transform-new-target": "^7.25.9",
+        "@babel/plugin-transform-nullish-coalescing-operator": "^7.26.6",
+        "@babel/plugin-transform-numeric-separator": "^7.25.9",
+        "@babel/plugin-transform-object-rest-spread": "^7.25.9",
+        "@babel/plugin-transform-object-super": "^7.25.9",
+        "@babel/plugin-transform-optional-catch-binding": "^7.25.9",
+        "@babel/plugin-transform-optional-chaining": "^7.25.9",
+        "@babel/plugin-transform-parameters": "^7.25.9",
+        "@babel/plugin-transform-private-methods": "^7.25.9",
+        "@babel/plugin-transform-private-property-in-object": "^7.25.9",
+        "@babel/plugin-transform-property-literals": "^7.25.9",
+        "@babel/plugin-transform-regenerator": "^7.25.9",
+        "@babel/plugin-transform-regexp-modifiers": "^7.26.0",
+        "@babel/plugin-transform-reserved-words": "^7.25.9",
+        "@babel/plugin-transform-shorthand-properties": "^7.25.9",
+        "@babel/plugin-transform-spread": "^7.25.9",
+        "@babel/plugin-transform-sticky-regex": "^7.25.9",
+        "@babel/plugin-transform-template-literals": "^7.26.8",
+        "@babel/plugin-transform-typeof-symbol": "^7.26.7",
+        "@babel/plugin-transform-unicode-escapes": "^7.25.9",
+        "@babel/plugin-transform-unicode-property-regex": "^7.25.9",
+        "@babel/plugin-transform-unicode-regex": "^7.25.9",
+        "@babel/plugin-transform-unicode-sets-regex": "^7.25.9",
         "@babel/preset-modules": "0.1.6-no-external-plugins",
         "babel-plugin-polyfill-corejs2": "^0.4.10",
-        "babel-plugin-polyfill-corejs3": "^0.10.4",
+        "babel-plugin-polyfill-corejs3": "^0.11.0",
         "babel-plugin-polyfill-regenerator": "^0.6.1",
-        "core-js-compat": "^3.37.1",
+        "core-js-compat": "^3.40.0",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -3193,17 +3089,18 @@
       }
     },
     "node_modules/@babel/preset-react": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/preset-react/-/preset-react-7.24.7.tgz",
-      "integrity": "sha512-AAH4lEkpmzFWrGVlHaxJB7RLH21uPQ9+He+eFLWHmF9IuFQVugz8eAsamaW0DXRrTfco5zj1wWtpdcXJUOfsag==",
+      "version": "7.26.3",
+      "resolved": "https://registry.npmjs.org/@babel/preset-react/-/preset-react-7.26.3.tgz",
+      "integrity": "sha512-Nl03d6T9ky516DGK2YMxrTqvnpUW63TnJMOMonj+Zae0JiPC5BC9xPMSL6L8fiSpA5vP88qfygavVQvnLp+6Cw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-validator-option": "^7.24.7",
-        "@babel/plugin-transform-react-display-name": "^7.24.7",
-        "@babel/plugin-transform-react-jsx": "^7.24.7",
-        "@babel/plugin-transform-react-jsx-development": "^7.24.7",
-        "@babel/plugin-transform-react-pure-annotations": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.25.9",
+        "@babel/helper-validator-option": "^7.25.9",
+        "@babel/plugin-transform-react-display-name": "^7.25.9",
+        "@babel/plugin-transform-react-jsx": "^7.25.9",
+        "@babel/plugin-transform-react-jsx-development": "^7.25.9",
+        "@babel/plugin-transform-react-pure-annotations": "^7.25.9"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -3213,16 +3110,17 @@
       }
     },
     "node_modules/@babel/preset-typescript": {
-      "version": "7.24.7",
-      "resolved": "https://registry.npmjs.org/@babel/preset-typescript/-/preset-typescript-7.24.7.tgz",
-      "integrity": "sha512-SyXRe3OdWwIwalxDg5UtJnJQO+YPcTfwiIY2B0Xlddh9o7jpWLvv8X1RthIeDOxQ+O1ML5BLPCONToObyVQVuQ==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/preset-typescript/-/preset-typescript-7.27.0.tgz",
+      "integrity": "sha512-vxaPFfJtHhgeOVXRKuHpHPAOgymmy8V8I65T1q53R7GCZlefKeCaTyDs3zOPHTTbmquvNlQYC5klEvWsBAtrBQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.24.7",
-        "@babel/helper-validator-option": "^7.24.7",
-        "@babel/plugin-syntax-jsx": "^7.24.7",
-        "@babel/plugin-transform-modules-commonjs": "^7.24.7",
-        "@babel/plugin-transform-typescript": "^7.24.7"
+        "@babel/helper-plugin-utils": "^7.26.5",
+        "@babel/helper-validator-option": "^7.25.9",
+        "@babel/plugin-syntax-jsx": "^7.25.9",
+        "@babel/plugin-transform-modules-commonjs": "^7.26.3",
+        "@babel/plugin-transform-typescript": "^7.27.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -3232,10 +3130,11 @@
       }
     },
     "node_modules/@babel/register": {
-      "version": "7.24.6",
-      "resolved": "https://registry.npmjs.org/@babel/register/-/register-7.24.6.tgz",
-      "integrity": "sha512-WSuFCc2wCqMeXkz/i3yfAAsxwWflEgbVkZzivgAmXl/MxrXeoYFZOOPllbC8R8WTF7u61wSRQtDVZ1879cdu6w==",
+      "version": "7.25.9",
+      "resolved": "https://registry.npmjs.org/@babel/register/-/register-7.25.9.tgz",
+      "integrity": "sha512-8D43jXtGsYmEeDvm4MWHYUpWf8iiXgWYx3fW7E7Wb7Oe6FWqJPl5K6TuFW0dOwNZzEE5rjlaSJYH9JjrUKJszA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "clone-deep": "^4.0.1",
         "find-cache-dir": "^2.0.0",
@@ -3250,16 +3149,11 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/@babel/regjsgen": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/@babel/regjsgen/-/regjsgen-0.8.0.tgz",
-      "integrity": "sha512-x/rqGMdzj+fWZvCOYForTghzbtqPDZ5gPwaoNGHdgDfF2QA/XZbCBp4Moo5scrkAMPhB7z26XM/AaHuIJdgauA==",
-      "dev": true
-    },
     "node_modules/@babel/runtime": {
-      "version": "7.23.2",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.2.tgz",
-      "integrity": "sha512-mM8eg4yl5D6i3lu2QKPuPH4FArvJ8KhTofbE7jwMUv9KX5mBvwPAqnV3MlyBNqdp9RyRKP6Yck8TrfYrPvX3bg==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.0.tgz",
+      "integrity": "sha512-VtPOkrdPHZsKc/clNqyi9WUA8TINkZ4cGk63UUE3u4pmB2k+ZMQRDuIOagv8UVd6j7k0T3+RRIb7beKTebNbcw==",
+      "license": "MIT",
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -3267,27 +3161,6 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@babel/runtime-corejs2": {
-      "version": "7.16.7",
-      "resolved": "https://registry.npmjs.org/@babel/runtime-corejs2/-/runtime-corejs2-7.16.7.tgz",
-      "integrity": "sha512-ec0BM0J/9M5Cncha++AlgvvDlk+uM+m6f7K0t74ClcYzsE8LgX4RstRreksMSCI82o3LJS//UswmA0pUWkJpqg==",
-      "dev": true,
-      "dependencies": {
-        "core-js": "^2.6.5",
-        "regenerator-runtime": "^0.13.4"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/runtime-corejs2/node_modules/core-js": {
-      "version": "2.6.12",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
-      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
-      "deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
-      "dev": true,
-      "hasInstallScript": true
-    },
     "node_modules/@babel/runtime-corejs3": {
       "version": "7.16.8",
       "resolved": "https://registry.npmjs.org/@babel/runtime-corejs3/-/runtime-corejs3-7.16.8.tgz",
@@ -3306,32 +3179,32 @@
       "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA=="
     },
     "node_modules/@babel/template": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.26.9.tgz",
-      "integrity": "sha512-qyRplbeIpNZhmzOysF/wFMuP9sctmh2cFzRAZOn1YapxBsE1i9bJIY586R/WBLfLcmcBlM8ROBiQURnnNy+zfA==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.0.tgz",
+      "integrity": "sha512-2ncevenBqXI6qRMukPlXwHKHchC7RyMuu4xv5JBXRfOGVcTy1mXCD12qrp7Jsoxll1EV3+9sE4GugBVRjT2jFA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.26.2",
-        "@babel/parser": "^7.26.9",
-        "@babel/types": "^7.26.9"
+        "@babel/parser": "^7.27.0",
+        "@babel/types": "^7.27.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.9.tgz",
-      "integrity": "sha512-ZYW7L+pL8ahU5fXmNbPF+iZFHCv5scFak7MZ9bwaRPLUhHh7QQEMjZUg0HevihoqCM5iSYHN61EyCoZvqC+bxg==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.0.tgz",
+      "integrity": "sha512-19lYZFzYVQkkHkl4Cy4WrAVcqBkgvV2YM2TU3xG6DIwO7O3ecbDPfW3yM3bjAGcqcQHi+CCtjMR3dIEHxsd6bA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.26.2",
-        "@babel/generator": "^7.26.9",
-        "@babel/parser": "^7.26.9",
-        "@babel/template": "^7.26.9",
-        "@babel/types": "^7.26.9",
+        "@babel/generator": "^7.27.0",
+        "@babel/parser": "^7.27.0",
+        "@babel/template": "^7.27.0",
+        "@babel/types": "^7.27.0",
         "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
@@ -3340,9 +3213,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.26.9",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.9.tgz",
-      "integrity": "sha512-Y3IR1cRnOxOCDvMmNiym7XpXQ93iGDDPHx+Zj+NM+rg0fBaShfQLkg+hKPaZCEvg5N/LeCo4+Rj/i3FuJsIQaw==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.0.tgz",
+      "integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
       "license": "MIT",
       "dependencies": {
         "@babel/helper-string-parser": "^7.25.9",
@@ -3352,6 +3225,12 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@balena/dockerignore": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@balena/dockerignore/-/dockerignore-1.0.2.tgz",
+      "integrity": "sha512-wMue2Sy4GAVTk6Ic4tJVcnfdau+gx2EnG7S+uAEe+TWJFqE4YoWN4/H8MSLj4eYJKxGg26lZwboEniNiNwZQ6Q==",
+      "license": "Apache-2.0"
+    },
     "node_modules/@bcoe/v8-coverage": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
@@ -3372,9 +3251,9 @@
       }
     },
     "node_modules/@codemirror/commands": {
-      "version": "6.8.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.8.0.tgz",
-      "integrity": "sha512-q8VPEFaEP4ikSlt6ZxjB3zW72+7osfAYW9i8Zu943uqbKuz6utc1+F170hyLUCUltXORjQXRyYQNfkckzA/bPQ==",
+      "version": "6.8.1",
+      "resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.8.1.tgz",
+      "integrity": "sha512-KlGVYufHMQzxbdQONiLyGQDUW0itrLZwq3CcY7xpv9ZLRHqzkBSoteocBHtMCoY7/Ci4xhzSrToIeLg7FxHuaw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3385,43 +3264,49 @@
       }
     },
     "node_modules/@codemirror/lang-css": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/lang-css/-/lang-css-6.0.0.tgz",
-      "integrity": "sha512-jBqc+BTuwhNOTlrimFghLlSrN6iFuE44HULKWoR4qKYObhOIl9Lci1iYj6zMIte1XTQmZguNvjXMyr43LUKwSw==",
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/@codemirror/lang-css/-/lang-css-6.3.1.tgz",
+      "integrity": "sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@codemirror/autocomplete": "^6.0.0",
         "@codemirror/language": "^6.0.0",
         "@codemirror/state": "^6.0.0",
-        "@lezer/css": "^1.0.0"
+        "@lezer/common": "^1.0.2",
+        "@lezer/css": "^1.1.7"
       }
     },
     "node_modules/@codemirror/lang-html": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/@codemirror/lang-html/-/lang-html-6.1.0.tgz",
-      "integrity": "sha512-gA7NmJxqvnhwza05CvR7W/39Ap9r/4Vs9uiC0IeFYo1hSlJzc/8N6Evviz6vTW1x8SpHcRYyqKOf6rpl6LfWtg==",
+      "version": "6.4.9",
+      "resolved": "https://registry.npmjs.org/@codemirror/lang-html/-/lang-html-6.4.9.tgz",
+      "integrity": "sha512-aQv37pIMSlueybId/2PVSP6NPnmurFDVmZwzc7jszd2KAF8qd4VBbvNYPXWQq90WIARjsdVkPbw29pszmHws3Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@codemirror/autocomplete": "^6.0.0",
         "@codemirror/lang-css": "^6.0.0",
         "@codemirror/lang-javascript": "^6.0.0",
-        "@codemirror/language": "^6.0.0",
+        "@codemirror/language": "^6.4.0",
         "@codemirror/state": "^6.0.0",
+        "@codemirror/view": "^6.17.0",
         "@lezer/common": "^1.0.0",
-        "@lezer/html": "^1.0.0"
+        "@lezer/css": "^1.1.0",
+        "@lezer/html": "^1.3.0"
       }
     },
     "node_modules/@codemirror/lang-javascript": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-6.0.1.tgz",
-      "integrity": "sha512-kjGbBEosl+ozDU5ruDV48w4v3H6KECTFiDjqMLT0KhVwESPfv3wOvnDrTT0uaMOg3YRGnBWsyiIoKHl/tNWWDg==",
+      "version": "6.2.4",
+      "resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-6.2.4.tgz",
+      "integrity": "sha512-0WVmhp1QOqZ4Rt6GlVGwKJN3KW7Xh4H2q8ZZNGZaP6lRdxXJzmjm4FqvmOojVj6khWJHIb9sp7U/72W7xQgqAA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@codemirror/autocomplete": "^6.0.0",
-        "@codemirror/language": "^6.0.0",
+        "@codemirror/language": "^6.6.0",
         "@codemirror/lint": "^6.0.0",
         "@codemirror/state": "^6.0.0",
-        "@codemirror/view": "^6.0.0",
+        "@codemirror/view": "^6.17.0",
         "@lezer/common": "^1.0.0",
         "@lezer/javascript": "^1.0.0"
       }
@@ -3443,9 +3328,9 @@
       }
     },
     "node_modules/@codemirror/language": {
-      "version": "6.10.8",
-      "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.10.8.tgz",
-      "integrity": "sha512-wcP8XPPhDH2vTqf181U8MbZnW+tDyPYy0UzVOa+oHORjyT+mhhom9vBd7dApJwoDz9Nb/a8kHjJIsuA/t8vNFw==",
+      "version": "6.11.0",
+      "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.11.0.tgz",
+      "integrity": "sha512-A7+f++LodNNc1wGgoRDTt78cOwWm9KVezApgjOMp1W4hM0898nsqBXwF+sbePE7ZRcjN7Sa1Z5m2oN27XkmEjQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3458,9 +3343,9 @@
       }
     },
     "node_modules/@codemirror/lint": {
-      "version": "6.8.4",
-      "resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.4.tgz",
-      "integrity": "sha512-u4q7PnZlJUojeRe8FJa/njJcMctISGgPQ4PnWsd9268R4ZTtU+tfFYmwkBvgcrK2+QQ8tYFVALVb5fVJykKc5A==",
+      "version": "6.8.5",
+      "resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.5.tgz",
+      "integrity": "sha512-s3n3KisH7dx3vsoeGMxsbRAgKe4O1vbrnKBClm99PU0fWxmxsx5rR2PfqQgIt+2MMJBHbiJ5rfIdLYfB9NNvsA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3492,9 +3377,9 @@
       }
     },
     "node_modules/@codemirror/view": {
-      "version": "6.36.3",
-      "resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.36.3.tgz",
-      "integrity": "sha512-N2bilM47QWC8Hnx0rMdDxO2x2ImJ1FvZWXubwKgjeoOrWwEiFrtpA7SFHcuZ+o2Ze2VzbkgbzWVj4+V18LVkeg==",
+      "version": "6.36.8",
+      "resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.36.8.tgz",
+      "integrity": "sha512-yoRo4f+FdnD01fFt4XpfpMCcCAo9QvZOtbrXExn4SqzH32YC6LgzqxfLZw/r6Ge65xyY03mK/UfUqrVw1gFiFg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4476,9 +4361,9 @@
       }
     },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.0.tgz",
-      "integrity": "sha512-O7vun9Sf8DFjH2UtqK8Ku3LkquL9SZL8OLY1T5NZkA34+wG3OQF7cl4Ql8vdNzM6fzBbYfLaiRLIOZ+2FOCgBQ==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.3.tgz",
+      "integrity": "sha512-W8bFfPA8DowP8l//sxjJLSLkD8iEjMc7cBVyP+u4cEv9sM7mdUCkgsj+t0n/BWPFtv7WWCN5Yzj0N6FJNUUqBQ==",
       "cpu": [
         "ppc64"
       ],
@@ -4493,9 +4378,9 @@
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.0.tgz",
-      "integrity": "sha512-PTyWCYYiU0+1eJKmw21lWtC+d08JDZPQ5g+kFyxP0V+es6VPPSUhM6zk8iImp2jbV6GwjX4pap0JFbUQN65X1g==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.3.tgz",
+      "integrity": "sha512-PuwVXbnP87Tcff5I9ngV0lmiSu40xw1At6i3GsU77U7cjDDB4s0X2cyFuBiDa1SBk9DnvWwnGvVaGBqoFWPb7A==",
       "cpu": [
         "arm"
       ],
@@ -4510,9 +4395,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.0.tgz",
-      "integrity": "sha512-grvv8WncGjDSyUBjN9yHXNt+cq0snxXbDxy5pJtzMKGmmpPxeAmAhWxXI+01lU5rwZomDgD3kJwulEnhTRUd6g==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.3.tgz",
+      "integrity": "sha512-XelR6MzjlZuBM4f5z2IQHK6LkK34Cvv6Rj2EntER3lwCBFdg6h2lKbtRjpTTsdEjD/WSe1q8UyPBXP1x3i/wYQ==",
       "cpu": [
         "arm64"
       ],
@@ -4527,9 +4412,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.0.tgz",
-      "integrity": "sha512-m/ix7SfKG5buCnxasr52+LI78SQ+wgdENi9CqyCXwjVR2X4Jkz+BpC3le3AoBPYTC9NHklwngVXvbJ9/Akhrfg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.3.tgz",
+      "integrity": "sha512-ogtTpYHT/g1GWS/zKM0cc/tIebFjm1F9Aw1boQ2Y0eUQ+J89d0jFY//s9ei9jVIlkYi8AfOjiixcLJSGNSOAdQ==",
       "cpu": [
         "x64"
       ],
@@ -4544,9 +4429,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.0.tgz",
-      "integrity": "sha512-mVwdUb5SRkPayVadIOI78K7aAnPamoeFR2bT5nszFUZ9P8UpK4ratOdYbZZXYSqPKMHfS1wdHCJk1P1EZpRdvw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.3.tgz",
+      "integrity": "sha512-eESK5yfPNTqpAmDfFWNsOhmIOaQA59tAcF/EfYvo5/QWQCzXn5iUSOnqt3ra3UdzBv073ykTtmeLJZGt3HhA+w==",
       "cpu": [
         "arm64"
       ],
@@ -4561,9 +4446,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.0.tgz",
-      "integrity": "sha512-DgDaYsPWFTS4S3nWpFcMn/33ZZwAAeAFKNHNa1QN0rI4pUjgqf0f7ONmXf6d22tqTY+H9FNdgeaAa+YIFUn2Rg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.3.tgz",
+      "integrity": "sha512-Kd8glo7sIZtwOLcPbW0yLpKmBNWMANZhrC1r6K++uDR2zyzb6AeOYtI6udbtabmQpFaxJ8uduXMAo1gs5ozz8A==",
       "cpu": [
         "x64"
       ],
@@ -4578,9 +4463,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.0.tgz",
-      "integrity": "sha512-VN4ocxy6dxefN1MepBx/iD1dH5K8qNtNe227I0mnTRjry8tj5MRk4zprLEdG8WPyAPb93/e4pSgi1SoHdgOa4w==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.3.tgz",
+      "integrity": "sha512-EJiyS70BYybOBpJth3M0KLOus0n+RRMKTYzhYhFeMwp7e/RaajXvP+BWlmEXNk6uk+KAu46j/kaQzr6au+JcIw==",
       "cpu": [
         "arm64"
       ],
@@ -4595,9 +4480,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.0.tgz",
-      "integrity": "sha512-mrSgt7lCh07FY+hDD1TxiTyIHyttn6vnjesnPoVDNmDfOmggTLXRv8Id5fNZey1gl/V2dyVK1VXXqVsQIiAk+A==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.3.tgz",
+      "integrity": "sha512-Q+wSjaLpGxYf7zC0kL0nDlhsfuFkoN+EXrx2KSB33RhinWzejOd6AvgmP5JbkgXKmjhmpfgKZq24pneodYqE8Q==",
       "cpu": [
         "x64"
       ],
@@ -4612,9 +4497,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.0.tgz",
-      "integrity": "sha512-vkB3IYj2IDo3g9xX7HqhPYxVkNQe8qTK55fraQyTzTX/fxaDtXiEnavv9geOsonh2Fd2RMB+i5cbhu2zMNWJwg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.3.tgz",
+      "integrity": "sha512-dUOVmAUzuHy2ZOKIHIKHCm58HKzFqd+puLaS424h6I85GlSDRZIA5ycBixb3mFgM0Jdh+ZOSB6KptX30DD8YOQ==",
       "cpu": [
         "arm"
       ],
@@ -4629,9 +4514,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.0.tgz",
-      "integrity": "sha512-9QAQjTWNDM/Vk2bgBl17yWuZxZNQIF0OUUuPZRKoDtqF2k4EtYbpyiG5/Dk7nqeK6kIJWPYldkOcBqjXjrUlmg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.3.tgz",
+      "integrity": "sha512-xCUgnNYhRD5bb1C1nqrDV1PfkwgbswTTBRbAd8aH5PhYzikdf/ddtsYyMXFfGSsb/6t6QaPSzxtbfAZr9uox4A==",
       "cpu": [
         "arm64"
       ],
@@ -4646,9 +4531,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.0.tgz",
-      "integrity": "sha512-43ET5bHbphBegyeqLb7I1eYn2P/JYGNmzzdidq/w0T8E2SsYL1U6un2NFROFRg1JZLTzdCoRomg8Rvf9M6W6Gg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.3.tgz",
+      "integrity": "sha512-yplPOpczHOO4jTYKmuYuANI3WhvIPSVANGcNUeMlxH4twz/TeXuzEP41tGKNGWJjuMhotpGabeFYGAOU2ummBw==",
       "cpu": [
         "ia32"
       ],
@@ -4663,9 +4548,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.0.tgz",
-      "integrity": "sha512-fC95c/xyNFueMhClxJmeRIj2yrSMdDfmqJnyOY4ZqsALkDrrKJfIg5NTMSzVBr5YW1jf+l7/cndBfP3MSDpoHw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.3.tgz",
+      "integrity": "sha512-P4BLP5/fjyihmXCELRGrLd793q/lBtKMQl8ARGpDxgzgIKJDRJ/u4r1A/HgpBpKpKZelGct2PGI4T+axcedf6g==",
       "cpu": [
         "loong64"
       ],
@@ -4680,9 +4565,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.0.tgz",
-      "integrity": "sha512-nkAMFju7KDW73T1DdH7glcyIptm95a7Le8irTQNO/qtkoyypZAnjchQgooFUDQhNAy4iu08N79W4T4pMBwhPwQ==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.3.tgz",
+      "integrity": "sha512-eRAOV2ODpu6P5divMEMa26RRqb2yUoYsuQQOuFUexUoQndm4MdpXXDBbUoKIc0iPa4aCO7gIhtnYomkn2x+bag==",
       "cpu": [
         "mips64el"
       ],
@@ -4697,9 +4582,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.0.tgz",
-      "integrity": "sha512-NhyOejdhRGS8Iwv+KKR2zTq2PpysF9XqY+Zk77vQHqNbo/PwZCzB5/h7VGuREZm1fixhs4Q/qWRSi5zmAiO4Fw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.3.tgz",
+      "integrity": "sha512-ZC4jV2p7VbzTlnl8nZKLcBkfzIf4Yad1SJM4ZMKYnJqZFD4rTI+pBG65u8ev4jk3/MPwY9DvGn50wi3uhdaghg==",
       "cpu": [
         "ppc64"
       ],
@@ -4714,9 +4599,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.0.tgz",
-      "integrity": "sha512-5S/rbP5OY+GHLC5qXp1y/Mx//e92L1YDqkiBbO9TQOvuFXM+iDqUNG5XopAnXoRH3FjIUDkeGcY1cgNvnXp/kA==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.3.tgz",
+      "integrity": "sha512-LDDODcFzNtECTrUUbVCs6j9/bDVqy7DDRsuIXJg6so+mFksgwG7ZVnTruYi5V+z3eE5y+BJZw7VvUadkbfg7QA==",
       "cpu": [
         "riscv64"
       ],
@@ -4731,9 +4616,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.0.tgz",
-      "integrity": "sha512-XM2BFsEBz0Fw37V0zU4CXfcfuACMrppsMFKdYY2WuTS3yi8O1nFOhil/xhKTmE1nPmVyvQJjJivgDT+xh8pXJA==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.3.tgz",
+      "integrity": "sha512-s+w/NOY2k0yC2p9SLen+ymflgcpRkvwwa02fqmAwhBRI3SC12uiS10edHHXlVWwfAagYSY5UpmT/zISXPMW3tQ==",
       "cpu": [
         "s390x"
       ],
@@ -4748,9 +4633,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.0.tgz",
-      "integrity": "sha512-9yl91rHw/cpwMCNytUDxwj2XjFpxML0y9HAOH9pNVQDpQrBxHy01Dx+vaMu0N1CKa/RzBD2hB4u//nfc+Sd3Cw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.3.tgz",
+      "integrity": "sha512-nQHDz4pXjSDC6UfOE1Fw9Q8d6GCAd9KdvMZpfVGWSJztYCarRgSDfOVBY5xwhQXseiyxapkiSJi/5/ja8mRFFA==",
       "cpu": [
         "x64"
       ],
@@ -4765,9 +4650,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.0.tgz",
-      "integrity": "sha512-RuG4PSMPFfrkH6UwCAqBzauBWTygTvb1nxWasEJooGSJ/NwRw7b2HOwyRTQIU97Hq37l3npXoZGYMy3b3xYvPw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.3.tgz",
+      "integrity": "sha512-1QaLtOWq0mzK6tzzp0jRN3eccmN3hezey7mhLnzC6oNlJoUJz4nym5ZD7mDnS/LZQgkrhEbEiTn515lPeLpgWA==",
       "cpu": [
         "arm64"
       ],
@@ -4782,9 +4667,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.0.tgz",
-      "integrity": "sha512-jl+qisSB5jk01N5f7sPCsBENCOlPiS/xptD5yxOx2oqQfyourJwIKLRA2yqWdifj3owQZCL2sn6o08dBzZGQzA==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.3.tgz",
+      "integrity": "sha512-i5Hm68HXHdgv8wkrt+10Bc50zM0/eonPb/a/OFVfB6Qvpiirco5gBA5bz7S2SHuU+Y4LWn/zehzNX14Sp4r27g==",
       "cpu": [
         "x64"
       ],
@@ -4799,9 +4684,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.0.tgz",
-      "integrity": "sha512-21sUNbq2r84YE+SJDfaQRvdgznTD8Xc0oc3p3iW/a1EVWeNj/SdUCbm5U0itZPQYRuRTW20fPMWMpcrciH2EJw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.3.tgz",
+      "integrity": "sha512-zGAVApJEYTbOC6H/3QBr2mq3upG/LBEXr85/pTtKiv2IXcgKV0RT0QA/hSXZqSvLEpXeIxah7LczB4lkiYhTAQ==",
       "cpu": [
         "arm64"
       ],
@@ -4816,9 +4701,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.0.tgz",
-      "integrity": "sha512-2gwwriSMPcCFRlPlKx3zLQhfN/2WjJ2NSlg5TKLQOJdV0mSxIcYNTMhk3H3ulL/cak+Xj0lY1Ym9ysDV1igceg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.3.tgz",
+      "integrity": "sha512-fpqctI45NnCIDKBH5AXQBsD0NDPbEFczK98hk/aa6HJxbl+UtLkJV2+Bvy5hLSLk3LHmqt0NTkKNso1A9y1a4w==",
       "cpu": [
         "x64"
       ],
@@ -4833,9 +4718,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.0.tgz",
-      "integrity": "sha512-bxI7ThgLzPrPz484/S9jLlvUAHYMzy6I0XiU1ZMeAEOBcS0VePBFxh1JjTQt3Xiat5b6Oh4x7UC7IwKQKIJRIg==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.3.tgz",
+      "integrity": "sha512-ROJhm7d8bk9dMCUZjkS8fgzsPAZEjtRJqCAmVgB0gMrvG7hfmPmz9k1rwO4jSiblFjYmNvbECL9uhaPzONMfgA==",
       "cpu": [
         "x64"
       ],
@@ -4850,9 +4735,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.0.tgz",
-      "integrity": "sha512-ZUAc2YK6JW89xTbXvftxdnYy3m4iHIkDtK3CLce8wg8M2L+YZhIvO1DKpxrd0Yr59AeNNkTiic9YLf6FTtXWMw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.3.tgz",
+      "integrity": "sha512-YWcow8peiHpNBiIXHwaswPnAXLsLVygFwCB3A7Bh5jRkIBFWHGmNQ48AlX4xDvQNoMZlPYzjVOQDYEzWCqufMQ==",
       "cpu": [
         "arm64"
       ],
@@ -4867,9 +4752,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.0.tgz",
-      "integrity": "sha512-eSNxISBu8XweVEWG31/JzjkIGbGIJN/TrRoiSVZwZ6pkC6VX4Im/WV2cz559/TXLcYbcrDN8JtKgd9DJVIo8GA==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.3.tgz",
+      "integrity": "sha512-qspTZOIGoXVS4DpNqUYUs9UxVb04khS1Degaw/MnfMe7goQ3lTfQ13Vw4qY/Nj0979BGvMRpAYbs/BAxEvU8ew==",
       "cpu": [
         "ia32"
       ],
@@ -4884,9 +4769,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.0.tgz",
-      "integrity": "sha512-ZENoHJBxA20C2zFzh6AI4fT6RraMzjYw4xKWemRTRmRVtN9c5DcH9r/f2ihEkMjOW5eGgrwCslG/+Y/3bL+DHQ==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.3.tgz",
+      "integrity": "sha512-ICgUR+kPimx0vvRzf+N/7L7tVSQeE3BYY+NhHRHXS1kBuPO7z2+7ea2HbhDyZdTephgvNvKrlDDKUexuCVBVvg==",
       "cpu": [
         "x64"
       ],
@@ -4901,23 +4786,28 @@
       }
     },
     "node_modules/@eslint-community/eslint-utils": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz",
-      "integrity": "sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==",
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz",
+      "integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==",
+      "license": "MIT",
       "dependencies": {
-        "eslint-visitor-keys": "^3.3.0"
+        "eslint-visitor-keys": "^3.4.3"
       },
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
       "peerDependencies": {
         "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
       }
     },
     "node_modules/@eslint-community/eslint-utils/node_modules/eslint-visitor-keys": {
-      "version": "3.4.1",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz",
-      "integrity": "sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==",
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "license": "Apache-2.0",
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
@@ -4970,9 +4860,10 @@
       }
     },
     "node_modules/@eslint/js": {
-      "version": "8.57.0",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz",
-      "integrity": "sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==",
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz",
+      "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==",
+      "license": "MIT",
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
@@ -4998,17 +4889,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@google-cloud/bigquery/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/@google-cloud/bigquery/node_modules/uuid": {
       "version": "8.3.2",
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
@@ -5036,17 +4916,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/@google-cloud/common/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/@google-cloud/logging": {
       "version": "11.1.0",
       "resolved": "https://registry.npmjs.org/@google-cloud/logging/-/logging-11.1.0.tgz",
@@ -5203,246 +5072,202 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
     "node_modules/@google-cloud/logging-min": {
-      "version": "10.4.0",
-      "resolved": "https://registry.npmjs.org/@google-cloud/logging-min/-/logging-min-10.4.0.tgz",
-      "integrity": "sha512-TcblDYAATO9hHcDcWYFh+vqt3pAV7Qddaih1JK3cpkzLa+BWjD5gAVAWww8W9Wr5yxOX+8CkssanH/xSS4n76Q==",
+      "version": "11.2.0",
+      "resolved": "https://registry.npmjs.org/@google-cloud/logging-min/-/logging-min-11.2.0.tgz",
+      "integrity": "sha512-o1mwzi1+9NMEjwYZJ0X3tK64obf9PzPVBAhzEJv65L0h7jVl3Fw7GswtsMUkdUvZexf96vAvlZZMvXB9jAIW2Q==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "@google-cloud/common": "^4.0.0",
-        "@google-cloud/paginator": "^4.0.0",
-        "@google-cloud/projectify": "^3.0.0",
-        "@google-cloud/promisify": "^3.0.0",
+        "@google-cloud/common": "^5.0.0",
+        "@google-cloud/paginator": "^5.0.0",
+        "@google-cloud/projectify": "^4.0.0",
+        "@google-cloud/promisify": "^4.0.0",
+        "@opentelemetry/api": "^1.7.0",
         "arrify": "^2.0.1",
         "dot-prop": "^6.0.0",
         "eventid": "^2.0.0",
         "extend": "^3.0.2",
-        "gcp-metadata": "^4.0.0",
-        "google-auth-library": "^8.0.2",
-        "google-gax": "^3.5.2",
+        "gcp-metadata": "^6.0.0",
+        "google-auth-library": "^9.0.0",
+        "google-gax": "^4.0.3",
         "on-finished": "^2.3.0",
         "pumpify": "^2.0.1",
         "stream-events": "^1.0.5",
         "uuid": "^9.0.0"
       },
       "engines": {
-        "node": ">=12.0.0"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/common": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-4.0.3.tgz",
-      "integrity": "sha512-fUoMo5b8iAKbrYpneIRV3z95AlxVJPrjpevxs4SKoclngWZvTXBSGpNisF5+x5m+oNGve7jfB1e6vNBZBUs7Fw==",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.2.tgz",
+      "integrity": "sha512-V7bmBKYQyu0eVG2BFejuUjlBt+zrya6vtsKdY+JxMM/dNntPF41vZ9+LhOshEUH01zOHEqBSvI7Dad7ZS6aUeA==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "@google-cloud/projectify": "^3.0.0",
-        "@google-cloud/promisify": "^3.0.0",
+        "@google-cloud/projectify": "^4.0.0",
+        "@google-cloud/promisify": "^4.0.0",
         "arrify": "^2.0.1",
         "duplexify": "^4.1.1",
-        "ent": "^2.2.0",
         "extend": "^3.0.2",
-        "google-auth-library": "^8.0.2",
-        "retry-request": "^5.0.0",
-        "teeny-request": "^8.0.0"
+        "google-auth-library": "^9.0.0",
+        "html-entities": "^2.5.2",
+        "retry-request": "^7.0.0",
+        "teeny-request": "^9.0.0"
       },
       "engines": {
-        "node": ">=12.0.0"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/paginator": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/@google-cloud/paginator/-/paginator-4.0.1.tgz",
-      "integrity": "sha512-6G1ui6bWhNyHjmbYwavdN7mpVPRBtyDg/bfqBTAlwr413On2TnFNfDxc9UhTJctkgoCDgQXEKiRPLPR9USlkbQ==",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/@google-cloud/paginator/-/paginator-5.0.2.tgz",
+      "integrity": "sha512-DJS3s0OVH4zFDB1PzjxAsHqJT6sKVbRwwML0ZBP9PbU7Yebtu/7SWMRzvO2J3nUi9pRNITCfu4LJeooM2w4pjg==",
+      "license": "Apache-2.0",
       "dependencies": {
         "arrify": "^2.0.0",
         "extend": "^3.0.2"
       },
       "engines": {
-        "node": ">=12.0.0"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/projectify": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-3.0.0.tgz",
-      "integrity": "sha512-HRkZsNmjScY6Li8/kb70wjGlDDyLkVk3KvoEo9uIoxSjYLJasGiCch9+PqRVDOCGUFvEIqyogl+BeqILL4OJHA==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-4.0.0.tgz",
+      "integrity": "sha512-MmaX6HeSvyPbWGwFq7mXdo0uQZLGBYCwziiLIGq5JVX+/bdI3SAq6bP98trV5eTWfLuvsMcIC1YJOF2vfteLFA==",
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">=12.0.0"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/promisify": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-3.0.1.tgz",
-      "integrity": "sha512-z1CjRjtQyBOYL+5Qr9DdYIfrdLBe746jRTYfaYU6MeXkqp7UfYs/jX16lFFVzZ7PGEJvqZNqYUEtb1mvDww4pA==",
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-4.1.0.tgz",
+      "integrity": "sha512-G/FQx5cE/+DqBbOpA5jKsegGwdPniU6PuIEMt+qxWgFxvxuFOzVmp6zYchtYuwAWV5/8Dgs0yAmjvNZv3uXLQg==",
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
-    "node_modules/@google-cloud/logging-min/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
+    "node_modules/@google-cloud/logging-min/node_modules/@opentelemetry/api": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.0.tgz",
+      "integrity": "sha512-3giAOQvZiH5F9bMlMiv8+GSPMeqg0dbaeo58/0SlA9sxSqZhnUtxzX9/2FzyhS9sWQf5S0GJE0AKBrFqjpeYcg==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8.0.0"
+      }
+    },
+    "node_modules/@google-cloud/logging-min/node_modules/agent-base": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
+      "integrity": "sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/@google-cloud/logging-min/node_modules/gaxios": {
+      "version": "6.7.1",
+      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.7.1.tgz",
+      "integrity": "sha512-LDODD4TMYx7XXdpwxAVRAIAuB0bzv0s+ywFonY46k126qzQHT9ygyoa9tncmOiQmmDrik65UYsEkv3lbfqQ3yQ==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
+        "extend": "^3.0.2",
+        "https-proxy-agent": "^7.0.1",
+        "is-stream": "^2.0.0",
+        "node-fetch": "^2.6.9",
+        "uuid": "^9.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      }
+    },
+    "node_modules/@google-cloud/logging-min/node_modules/gaxios/node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/gcp-metadata": {
-      "version": "4.3.1",
-      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-4.3.1.tgz",
-      "integrity": "sha512-x850LS5N7V1F3UcV7PoupzGsyD6iVwTVvsh3tbXfkctZnBnjW5yu5z1/3k3SehF7TyoTIe78rJs02GMMy+LF+A==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.1.1.tgz",
+      "integrity": "sha512-a4tiq7E0/5fTjxPAaH4jpjkSv/uCaU2p5KC6HVGrvl0cDjA8iBZv4vv1gyzlmK0ZUKqwpOyQMKzZQe3lTit77A==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "gaxios": "^4.0.0",
+        "gaxios": "^6.1.1",
+        "google-logging-utils": "^0.0.2",
         "json-bigint": "^1.0.0"
       },
       "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/gcp-metadata/node_modules/gaxios": {
-      "version": "4.3.3",
-      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-4.3.3.tgz",
-      "integrity": "sha512-gSaYYIO1Y3wUtdfHmjDUZ8LWaxJQpiavzbF5Kq53akSzvmVg0RfyOcFDbO1KJ/KCGRFz2qG+lS81F0nkr7cRJA==",
-      "dependencies": {
-        "abort-controller": "^3.0.0",
-        "extend": "^3.0.2",
-        "https-proxy-agent": "^5.0.0",
-        "is-stream": "^2.0.0",
-        "node-fetch": "^2.6.7"
-      },
-      "engines": {
-        "node": ">=10"
+        "node": ">=14"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/google-auth-library": {
-      "version": "8.9.0",
-      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-8.9.0.tgz",
-      "integrity": "sha512-f7aQCJODJFmYWN6PeNKzgvy9LI2tYmXnzpNDHEjG5sDNPgGb2FXQyTBnXeSH+PAtpKESFD+LmHw3Ox3mN7e1Fg==",
+      "version": "9.15.1",
+      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.15.1.tgz",
+      "integrity": "sha512-Jb6Z0+nvECVz+2lzSMt9u98UsoakXxA2HGHMCxh+so3n90XgYWkq5dur19JAJV7ONiJY22yBTyJB1TSkvPq9Ng==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "arrify": "^2.0.0",
         "base64-js": "^1.3.0",
         "ecdsa-sig-formatter": "^1.0.11",
-        "fast-text-encoding": "^1.0.0",
-        "gaxios": "^5.0.0",
-        "gcp-metadata": "^5.3.0",
-        "gtoken": "^6.1.0",
-        "jws": "^4.0.0",
-        "lru-cache": "^6.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/google-auth-library/node_modules/gcp-metadata": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-5.3.0.tgz",
-      "integrity": "sha512-FNTkdNEnBdlqF2oatizolQqNANMrcqJt6AAYt99B3y1aLLC8Hc5IOBb+ZnnzllodEEf6xMBp6wRcBbc16fa65w==",
-      "dependencies": {
-        "gaxios": "^5.0.0",
-        "json-bigint": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/google-gax": {
-      "version": "3.6.1",
-      "resolved": "https://registry.npmjs.org/google-gax/-/google-gax-3.6.1.tgz",
-      "integrity": "sha512-g/lcUjGcB6DSw2HxgEmCDOrI/CByOwqRvsuUvNalHUK2iPPPlmAIpbMbl62u0YufGMr8zgE3JL7th6dCb1Ry+w==",
-      "dependencies": {
-        "@grpc/grpc-js": "~1.8.0",
-        "@grpc/proto-loader": "^0.7.0",
-        "@types/long": "^4.0.0",
-        "@types/rimraf": "^3.0.2",
-        "abort-controller": "^3.0.0",
-        "duplexify": "^4.0.0",
-        "fast-text-encoding": "^1.0.3",
-        "google-auth-library": "^8.0.2",
-        "is-stream-ended": "^0.1.4",
-        "node-fetch": "^2.6.1",
-        "object-hash": "^3.0.0",
-        "proto3-json-serializer": "^1.0.0",
-        "protobufjs": "7.2.4",
-        "protobufjs-cli": "1.1.1",
-        "retry-request": "^5.0.0"
-      },
-      "bin": {
-        "compileProtos": "build/tools/compileProtos.js",
-        "minifyProtoJson": "build/tools/minify.js"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/google-p12-pem": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-4.0.1.tgz",
-      "integrity": "sha512-WPkN4yGtz05WZ5EhtlxNDWPhC4JIic6G8ePitwUWy4l+XPVYec+a0j0Ts47PDtW59y3RwAhUd9/h9ZZ63px6RQ==",
-      "dependencies": {
-        "node-forge": "^1.3.1"
-      },
-      "bin": {
-        "gp12-pem": "build/src/bin/gp12-pem.js"
-      },
-      "engines": {
-        "node": ">=12.0.0"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/gtoken": {
-      "version": "6.1.2",
-      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-6.1.2.tgz",
-      "integrity": "sha512-4ccGpzz7YAr7lxrT2neugmXQ3hP9ho2gcaityLVkiUecAiwiy60Ii8gRbZeOsXV19fYaRjgBSshs8kXw+NKCPQ==",
-      "dependencies": {
-        "gaxios": "^5.0.1",
-        "google-p12-pem": "^4.0.0",
+        "gaxios": "^6.1.1",
+        "gcp-metadata": "^6.1.0",
+        "gtoken": "^7.0.0",
         "jws": "^4.0.0"
       },
       "engines": {
-        "node": ">=12.0.0"
+        "node": ">=14"
       }
     },
-    "node_modules/@google-cloud/logging-min/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+    "node_modules/@google-cloud/logging-min/node_modules/gtoken": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.1.0.tgz",
+      "integrity": "sha512-pCcEwRi+TKpMlxAQObHDQ56KawURgyAf6jtIY046fJ5tIv3zDe/LEIubckAO8fj6JnAxLdmWkUfNyulQ2iKdEw==",
+      "license": "MIT",
       "dependencies": {
-        "yallist": "^4.0.0"
+        "gaxios": "^6.0.0",
+        "jws": "^4.0.0"
       },
       "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/@google-cloud/logging-min/node_modules/object-hash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
-      "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
-      "engines": {
-        "node": ">= 6"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/retry-request": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-5.0.2.tgz",
-      "integrity": "sha512-wfI3pk7EE80lCIXprqh7ym48IHYdwmAAzESdbU8Q9l7pnRCk9LEhpbOTNKjz6FARLm/Bl5m+4F0ABxOkYUujSQ==",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-7.0.2.tgz",
+      "integrity": "sha512-dUOvLMJ0/JJYEn8NrpOaGNE7X3vpI5XlZS/u0ANjqtcZVKnIxP7IgCFwrKTxENw29emmwug53awKtaMm4i9g5w==",
+      "license": "MIT",
       "dependencies": {
-        "debug": "^4.1.1",
-        "extend": "^3.0.2"
+        "@types/request": "^2.48.8",
+        "extend": "^3.0.2",
+        "teeny-request": "^9.0.0"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=14"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/teeny-request": {
-      "version": "8.0.3",
-      "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-8.0.3.tgz",
-      "integrity": "sha512-jJZpA5He2y52yUhA7pyAGZlgQpcB+xLjcN0eUFxr9c8hP/H7uOXbBNVo/O0C/xVfJLJs680jvkFgVJEEvk9+ww==",
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
+      "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+      "license": "Apache-2.0",
       "dependencies": {
         "http-proxy-agent": "^5.0.0",
         "https-proxy-agent": "^5.0.0",
-        "node-fetch": "^2.6.1",
+        "node-fetch": "^2.6.9",
         "stream-events": "^1.0.5",
         "uuid": "^9.0.0"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=14"
       }
     },
     "node_modules/@google-cloud/logging-min/node_modules/uuid": {
@@ -5453,15 +5278,11 @@
         "https://github.com/sponsors/broofa",
         "https://github.com/sponsors/ctavan"
       ],
+      "license": "MIT",
       "bin": {
         "uuid": "dist/bin/uuid"
       }
     },
-    "node_modules/@google-cloud/logging-min/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
-    },
     "node_modules/@google-cloud/logging/node_modules/@google-cloud/common": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.2.tgz",
@@ -5536,17 +5357,6 @@
         }
       }
     },
-    "node_modules/@google-cloud/logging/node_modules/duplexify": {
-      "version": "4.1.3",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.3.tgz",
-      "integrity": "sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.2"
-      }
-    },
     "node_modules/@google-cloud/logging/node_modules/gaxios": {
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.6.0.tgz",
@@ -5708,22 +5518,24 @@
       }
     },
     "node_modules/@google-cloud/profiler": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/@google-cloud/profiler/-/profiler-6.0.0.tgz",
-      "integrity": "sha512-EAxPbDiNRidAKOEnlUK3M+CcOlqG+REkUEZKirLtxFwzI/m7LmGqDzQvrVWTOSFSEYJ9qQRRnO+Q1osNGk3NUg==",
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@google-cloud/profiler/-/profiler-6.0.3.tgz",
+      "integrity": "sha512-Ey8li6Vc2CbfEzOTSZaqKolxPMGacxVUQuhChNT0Wi55a3nfImMiiuDgqYw1In/a9Q3Z62O7jUg2L8f1XwMN7Q==",
+      "license": "Apache-2.0",
       "dependencies": {
         "@google-cloud/common": "^5.0.0",
-        "@google-cloud/logging-min": "^10.0.0",
+        "@google-cloud/logging-min": "^11.0.0",
+        "@google-cloud/promisify": "~4.0.0",
         "@types/console-log-level": "^1.4.0",
         "@types/semver": "^7.0.0",
         "console-log-level": "^1.4.0",
         "delay": "^5.0.0",
         "extend": "^3.0.2",
         "gcp-metadata": "^6.0.0",
-        "parse-duration": "^1.0.0",
-        "pprof": "3.2.1",
+        "ms": "^2.1.3",
+        "pprof": "4.0.0",
         "pretty-ms": "^7.0.0",
-        "protobufjs": "~7.2.4",
+        "protobufjs": "~7.4.0",
         "semver": "^7.0.0",
         "teeny-request": "^9.0.0"
       },
@@ -5732,18 +5544,19 @@
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/@google-cloud/common": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.0.tgz",
-      "integrity": "sha512-IsbTVr7Ag+04GMT87X738vDs85QU1rMvaesm2wEQrtTbZAR92tGmUQ8/D/kdnYgAi98Q4zmfhF+T8Xs/Lw4zAA==",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.2.tgz",
+      "integrity": "sha512-V7bmBKYQyu0eVG2BFejuUjlBt+zrya6vtsKdY+JxMM/dNntPF41vZ9+LhOshEUH01zOHEqBSvI7Dad7ZS6aUeA==",
+      "license": "Apache-2.0",
       "dependencies": {
         "@google-cloud/projectify": "^4.0.0",
         "@google-cloud/promisify": "^4.0.0",
         "arrify": "^2.0.1",
         "duplexify": "^4.1.1",
-        "ent": "^2.2.0",
         "extend": "^3.0.2",
         "google-auth-library": "^9.0.0",
-        "retry-request": "^6.0.0",
+        "html-entities": "^2.5.2",
+        "retry-request": "^7.0.0",
         "teeny-request": "^9.0.0"
       },
       "engines": {
@@ -5754,6 +5567,7 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-4.0.0.tgz",
       "integrity": "sha512-MmaX6HeSvyPbWGwFq7mXdo0uQZLGBYCwziiLIGq5JVX+/bdI3SAq6bP98trV5eTWfLuvsMcIC1YJOF2vfteLFA==",
+      "license": "Apache-2.0",
       "engines": {
         "node": ">=14.0.0"
       }
@@ -5762,68 +5576,43 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-4.0.0.tgz",
       "integrity": "sha512-Orxzlfb9c67A15cq2JQEyVc7wEsmFBmHjZWZYQMUyJ1qivXyMwdyNOs9odi79hze+2zqdTtu1E19IM/FtqZ10g==",
+      "license": "Apache-2.0",
       "engines": {
         "node": ">=14"
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/agent-base": {
-      "version": "7.1.0",
-      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
-      "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
-      "dependencies": {
-        "debug": "^4.3.4"
-      },
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
+      "integrity": "sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==",
+      "license": "MIT",
       "engines": {
         "node": ">= 14"
       }
     },
-    "node_modules/@google-cloud/profiler/node_modules/debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
-      "dependencies": {
-        "ms": "2.1.2"
-      },
-      "engines": {
-        "node": ">=6.0"
-      },
-      "peerDependenciesMeta": {
-        "supports-color": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@google-cloud/profiler/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/@google-cloud/profiler/node_modules/gaxios": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.1.1.tgz",
-      "integrity": "sha512-bw8smrX+XlAoo9o1JAksBwX+hi/RG15J+NTSxmNPIclKC3ZVK6C2afwY8OSdRvOK0+ZLecUJYtj2MmjOt3Dm0w==",
+      "version": "6.7.1",
+      "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.7.1.tgz",
+      "integrity": "sha512-LDODD4TMYx7XXdpwxAVRAIAuB0bzv0s+ywFonY46k126qzQHT9ygyoa9tncmOiQmmDrik65UYsEkv3lbfqQ3yQ==",
+      "license": "Apache-2.0",
       "dependencies": {
         "extend": "^3.0.2",
         "https-proxy-agent": "^7.0.1",
         "is-stream": "^2.0.0",
-        "node-fetch": "^2.6.9"
+        "node-fetch": "^2.6.9",
+        "uuid": "^9.0.1"
       },
       "engines": {
         "node": ">=14"
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/gaxios/node_modules/https-proxy-agent": {
-      "version": "7.0.2",
-      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.2.tgz",
-      "integrity": "sha512-NmLNjm6ucYwtcUmL7JQC1ZQ57LmHP4lT15FQ8D61nak1rO6DH+fz5qNK2Ap5UN4ZapYICE3/0KodcLYSPsPbaA==",
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "license": "MIT",
       "dependencies": {
-        "agent-base": "^7.0.2",
+        "agent-base": "^7.1.2",
         "debug": "4"
       },
       "engines": {
@@ -5831,11 +5620,13 @@
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/gcp-metadata": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.0.0.tgz",
-      "integrity": "sha512-Ozxyi23/1Ar51wjUT2RDklK+3HxqDr8TLBNK8rBBFQ7T85iIGnXnVusauj06QyqCXRFZig8LZC+TUddWbndlpQ==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.1.1.tgz",
+      "integrity": "sha512-a4tiq7E0/5fTjxPAaH4jpjkSv/uCaU2p5KC6HVGrvl0cDjA8iBZv4vv1gyzlmK0ZUKqwpOyQMKzZQe3lTit77A==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "gaxios": "^6.0.0",
+        "gaxios": "^6.1.1",
+        "google-logging-utils": "^0.0.2",
         "json-bigint": "^1.0.0"
       },
       "engines": {
@@ -5843,26 +5634,27 @@
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/google-auth-library": {
-      "version": "9.1.0",
-      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.1.0.tgz",
-      "integrity": "sha512-1M9HdOcQNPV5BwSXqwwT238MTKodJFBxZ/V2JP397ieOLv4FjQdfYb9SooR7Mb+oUT2IJ92mLJQf804dyx0MJA==",
+      "version": "9.15.1",
+      "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.15.1.tgz",
+      "integrity": "sha512-Jb6Z0+nvECVz+2lzSMt9u98UsoakXxA2HGHMCxh+so3n90XgYWkq5dur19JAJV7ONiJY22yBTyJB1TSkvPq9Ng==",
+      "license": "Apache-2.0",
       "dependencies": {
         "base64-js": "^1.3.0",
         "ecdsa-sig-formatter": "^1.0.11",
-        "gaxios": "^6.0.0",
-        "gcp-metadata": "^6.0.0",
+        "gaxios": "^6.1.1",
+        "gcp-metadata": "^6.1.0",
         "gtoken": "^7.0.0",
-        "jws": "^4.0.0",
-        "lru-cache": "^6.0.0"
+        "jws": "^4.0.0"
       },
       "engines": {
         "node": ">=14"
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/gtoken": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.0.1.tgz",
-      "integrity": "sha512-KcFVtoP1CVFtQu0aSk3AyAt2og66PFhZAlkUOuWKwzMLoulHXG5W5wE5xAnHb+yl3/wEFoqGW7/cDGMU8igDZQ==",
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.1.0.tgz",
+      "integrity": "sha512-pCcEwRi+TKpMlxAQObHDQ56KawURgyAf6jtIY046fJ5tIv3zDe/LEIubckAO8fj6JnAxLdmWkUfNyulQ2iKdEw==",
+      "license": "MIT",
       "dependencies": {
         "gaxios": "^6.0.0",
         "jws": "^4.0.0"
@@ -5871,41 +5663,49 @@
         "node": ">=14.0.0"
       }
     },
-    "node_modules/@google-cloud/profiler/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+    "node_modules/@google-cloud/profiler/node_modules/protobufjs": {
+      "version": "7.4.0",
+      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.4.0.tgz",
+      "integrity": "sha512-mRUWCc3KUU4w1jU8sGxICXH/gNS94DvI1gxqDvBzhj1JpcsimQkYiOJfwsPUykUI5ZaspFbSgmBLER8IrQ3tqw==",
+      "hasInstallScript": true,
+      "license": "BSD-3-Clause",
       "dependencies": {
-        "yallist": "^4.0.0"
+        "@protobufjs/aspromise": "^1.1.2",
+        "@protobufjs/base64": "^1.1.2",
+        "@protobufjs/codegen": "^2.0.4",
+        "@protobufjs/eventemitter": "^1.1.0",
+        "@protobufjs/fetch": "^1.1.0",
+        "@protobufjs/float": "^1.0.2",
+        "@protobufjs/inquire": "^1.1.0",
+        "@protobufjs/path": "^1.1.2",
+        "@protobufjs/pool": "^1.1.0",
+        "@protobufjs/utf8": "^1.1.0",
+        "@types/node": ">=13.7.0",
+        "long": "^5.0.0"
       },
       "engines": {
-        "node": ">=10"
+        "node": ">=12.0.0"
       }
     },
-    "node_modules/@google-cloud/profiler/node_modules/ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
-    },
     "node_modules/@google-cloud/profiler/node_modules/retry-request": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-6.0.0.tgz",
-      "integrity": "sha512-24kaFMd3wCnT3n4uPnsQh90ZSV8OISpfTFXJ00Wi+/oD2OPrp63EQ8hznk6rhxdlpwx2QBhQSDz2Fg46ki852g==",
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-7.0.2.tgz",
+      "integrity": "sha512-dUOvLMJ0/JJYEn8NrpOaGNE7X3vpI5XlZS/u0ANjqtcZVKnIxP7IgCFwrKTxENw29emmwug53awKtaMm4i9g5w==",
+      "license": "MIT",
       "dependencies": {
-        "debug": "^4.1.1",
-        "extend": "^3.0.2"
+        "@types/request": "^2.48.8",
+        "extend": "^3.0.2",
+        "teeny-request": "^9.0.0"
       },
       "engines": {
         "node": ">=14"
       }
     },
     "node_modules/@google-cloud/profiler/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
+      "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -5917,6 +5717,7 @@
       "version": "9.0.0",
       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
       "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+      "license": "Apache-2.0",
       "dependencies": {
         "http-proxy-agent": "^5.0.0",
         "https-proxy-agent": "^5.0.0",
@@ -5936,15 +5737,11 @@
         "https://github.com/sponsors/broofa",
         "https://github.com/sponsors/ctavan"
       ],
+      "license": "MIT",
       "bin": {
         "uuid": "dist/bin/uuid"
       }
     },
-    "node_modules/@google-cloud/profiler/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
-    },
     "node_modules/@google-cloud/projectify": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-2.1.1.tgz",
@@ -6015,17 +5812,6 @@
         "node": ">=12"
       }
     },
-    "node_modules/@google-cloud/storage/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/@google-cloud/storage/node_modules/google-auth-library": {
       "version": "8.7.0",
       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-8.7.0.tgz",
@@ -6143,15 +5929,16 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
     "node_modules/@grpc/grpc-js": {
-      "version": "1.8.22",
-      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.8.22.tgz",
-      "integrity": "sha512-oAjDdN7fzbUi+4hZjKG96MR6KTEubAeMpQEb+77qy+3r0Ua5xTFuie6JOLr4ZZgl5g+W5/uRTS2M1V8mVAFPuA==",
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.13.4.tgz",
+      "integrity": "sha512-GsFaMXCkMqkKIvwCQjCrwH+GHbPKBjhwo/8ZuUkWHqbI73Kky9I+pQltrlT0+MWpedCoosda53lgjYfyEPgxBg==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "@grpc/proto-loader": "^0.7.0",
-        "@types/node": ">=12.12.47"
+        "@grpc/proto-loader": "^0.7.13",
+        "@js-sdsl/ordered-map": "^4.4.2"
       },
       "engines": {
-        "node": "^8.13.0 || >=10.10.0"
+        "node": ">=12.10.0"
       }
     },
     "node_modules/@grpc/proto-loader": {
@@ -6296,11 +6083,13 @@
       "integrity": "sha512-aKmlCO57XFZ26wso4rJsW4oTUnrgTFw2jh3io7CAtO9w4UltBNwRXvXIVzzyfkaaLRo3nluP/19msA8vDUUuKw=="
     },
     "node_modules/@humanwhocodes/config-array": {
-      "version": "0.11.14",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
-      "integrity": "sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==",
+      "version": "0.13.0",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
+      "integrity": "sha512-DZLEEqFWQFiyK6h5YIeynKx7JlvCYWL0cImfSRXZ9l4Sg2efkFGTuFf6vzXjK1cq6IYkU+Eg/JizXw+TD2vRNw==",
+      "deprecated": "Use @eslint/config-array instead",
+      "license": "Apache-2.0",
       "dependencies": {
-        "@humanwhocodes/object-schema": "^2.0.2",
+        "@humanwhocodes/object-schema": "^2.0.3",
         "debug": "^4.3.1",
         "minimatch": "^3.0.5"
       },
@@ -6325,17 +6114,12 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
-    "node_modules/@humanwhocodes/object-schema": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz",
-      "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
-      "dev": true
-    },
     "node_modules/@icons/material": {
       "version": "0.2.4",
       "resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
       "integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw==",
       "dev": true,
+      "license": "MIT",
       "peerDependencies": {
         "react": "*"
       }
@@ -6619,17 +6403,6 @@
       "resolved": "https://registry.npmjs.org/@jsdevtools/ono/-/ono-7.1.3.tgz",
       "integrity": "sha512-4JQNk+3mVzK3xh2rqd6RB4J46qUR19azEHBneZyTZM+c456qOrbbM/5xcR8huNCCcbVt7+UmizG6GuUvPvKUYg=="
     },
-    "node_modules/@jsdoc/salty": {
-      "version": "0.2.8",
-      "resolved": "https://registry.npmjs.org/@jsdoc/salty/-/salty-0.2.8.tgz",
-      "integrity": "sha512-5e+SFVavj1ORKlKaKr2BmTOekmXbelU7dC0cDkQLqag7xfuTPuGMUFx7KWJuv4bYZrTsoL2Z18VVCOKYxzoHcg==",
-      "dependencies": {
-        "lodash": "^4.17.21"
-      },
-      "engines": {
-        "node": ">=v12.0.0"
-      }
-    },
     "node_modules/@jsonjoy.com/base64": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@jsonjoy.com/base64/-/base64-1.1.2.tgz",
@@ -6648,9 +6421,9 @@
       }
     },
     "node_modules/@jsonjoy.com/json-pack": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.1.1.tgz",
-      "integrity": "sha512-osjeBqMJ2lb/j/M8NCPjs1ylqWIcTRTycIhVB5pt6LgzgeRSb0YRZ7j9RfA8wIUrsr/medIuhVyonXRZWLyfdw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@jsonjoy.com/json-pack/-/json-pack-1.2.0.tgz",
+      "integrity": "sha512-io1zEbbYcElht3tdlqEOFxZ0dMTYrHz9iMf0gqn1pPjZFTCgM5R4R5IMA20Chb2UPYYsxjzs8CgZ7Nb5n2K2rA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -6694,10 +6467,11 @@
       "dev": true
     },
     "node_modules/@leichtgewicht/ip-codec": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
-      "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==",
-      "dev": true
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
+      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@lezer/common": {
       "version": "1.2.3",
@@ -6707,20 +6481,23 @@
       "license": "MIT"
     },
     "node_modules/@lezer/css": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@lezer/css/-/css-1.0.0.tgz",
-      "integrity": "sha512-616VqgDKumHmYIuxs3tnX1irEQmoDHgF/TlP4O5ICWwyHwLMErq+8iKVuzTkOdBqvYAVmObqThcDEAaaMJjAdg==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@lezer/css/-/css-1.2.0.tgz",
+      "integrity": "sha512-8FLXsWpwKWMqQ6XjDP0DWbMP4YdeqhIcwN8IulcBinGpu30PG74zz0c6w+Yi2DeQD9/4FXfeLp+XP90NflIkGA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
+        "@lezer/common": "^1.2.0",
         "@lezer/highlight": "^1.0.0",
-        "@lezer/lr": "^1.0.0"
+        "@lezer/lr": "^1.3.0"
       }
     },
     "node_modules/@lezer/generator": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/@lezer/generator/-/generator-1.7.1.tgz",
-      "integrity": "sha512-MgPJN9Si+ccxzXl3OAmCeZuUKw4XiPl4y664FX/hnnyG9CTqUPq65N3/VGPA2jD23D7QgMTtNqflta+cPN+5mQ==",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/@lezer/generator/-/generator-1.7.3.tgz",
+      "integrity": "sha512-vAI2O1tPF8QMMgp+bdUeeJCneJNkOZvqsrtyb4ohnFVFdboSqPwBEacnt0HH4E+5h+qsIwTHUSAhffU4hzKl1A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@lezer/common": "^1.1.0",
         "@lezer/lr": "^1.3.0"
@@ -6739,23 +6516,27 @@
       }
     },
     "node_modules/@lezer/html": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@lezer/html/-/html-1.0.0.tgz",
-      "integrity": "sha512-wZHBcieArLTxEi198hqRBBHMySzDKo5suWaESdUw0t44IXp01vkSRwX2brG1qBbKdwJ+C6U0iMl00vWNiyAROg==",
+      "version": "1.3.10",
+      "resolved": "https://registry.npmjs.org/@lezer/html/-/html-1.3.10.tgz",
+      "integrity": "sha512-dqpT8nISx/p9Do3AchvYGV3qYc4/rKr3IBZxlHmpIKam56P47RSHkSF5f13Vu9hebS1jM0HmtJIwLbWz1VIY6w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
+        "@lezer/common": "^1.2.0",
         "@lezer/highlight": "^1.0.0",
         "@lezer/lr": "^1.0.0"
       }
     },
     "node_modules/@lezer/javascript": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-1.0.1.tgz",
-      "integrity": "sha512-t7fpf3+gi/jiAtW+Gv734TbKdpPg6b8qATH01/jprW9H2oR++Tb688IHwJvZbk9F4GjpCEv86beuHMpUyC1b5g==",
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-1.5.1.tgz",
+      "integrity": "sha512-ATOImjeVJuvgm3JQ/bpo2Tmv55HSScE2MTPnKRMRIPx2cLhHGyX2VnqpHhtIV1tVzIjZDbcWQm+NCTF40ggZVw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@lezer/highlight": "^1.0.0",
-        "@lezer/lr": "^1.0.0"
+        "@lezer/common": "^1.2.0",
+        "@lezer/highlight": "^1.1.3",
+        "@lezer/lr": "^1.3.0"
       }
     },
     "node_modules/@lezer/lr": {
@@ -6768,9 +6549,9 @@
       }
     },
     "node_modules/@lezer/markdown": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/@lezer/markdown/-/markdown-1.3.2.tgz",
-      "integrity": "sha512-Wu7B6VnrKTbBEohqa63h5vxXjiC4pO5ZQJ/TDbhJxPQaaIoRD/6UVDhSDtVsCwVZV12vvN9KxuLL3ATMnlG0oQ==",
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/@lezer/markdown/-/markdown-1.4.3.tgz",
+      "integrity": "sha512-kfw+2uMrQ/wy/+ONfrH83OkdFNM0ye5Xq96cLlaCy7h5UT9FO54DU4oRoIc0CSBh5NWmWuiIJA7NGLMJbQ+Oxg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6800,14 +6581,15 @@
       }
     },
     "node_modules/@mapbox/node-pre-gyp": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.8.tgz",
-      "integrity": "sha512-CMGKi28CF+qlbXh26hDe6NxCd7amqeAzEqnS6IHeO6LoaKyM/n+Xw3HT1COdq8cuioOdlKdqn/hCmqPUOMOywg==",
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.11.tgz",
+      "integrity": "sha512-Yhlar6v9WQgUp/He7BdgzOz8lqMQ8sU+jkCq7Wx8Myc5YFJLbEe7lgui/V7G1qB1DJykHSGwreceSaD60Y0PUQ==",
+      "license": "BSD-3-Clause",
       "dependencies": {
-        "detect-libc": "^1.0.3",
+        "detect-libc": "^2.0.0",
         "https-proxy-agent": "^5.0.0",
         "make-dir": "^3.1.0",
-        "node-fetch": "^2.6.5",
+        "node-fetch": "^2.6.7",
         "nopt": "^5.0.0",
         "npmlog": "^5.0.1",
         "rimraf": "^3.0.2",
@@ -6851,20 +6633,6 @@
         "semver": "bin/semver.js"
       }
     },
-    "node_modules/@mapbox/node-pre-gyp/node_modules/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/@mapbox/node-pre-gyp/node_modules/semver": {
       "version": "7.5.4",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
@@ -7005,9 +6773,9 @@
       ]
     },
     "node_modules/@napi-rs/canvas": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.65.tgz",
-      "integrity": "sha512-YcFhXQcp+b2d38zFOJNbpyPHnIL7KAEkhJQ+UeeKI5IpE9B8Cpf/M6RiHPQXSsSqnYbrfFylnW49dyh2oeSblQ==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.68.tgz",
+      "integrity": "sha512-LQESrePLEBLvhuFkXx9jjBXRC2ClYsO5mqQ1m/puth5z9SOuM3N/B3vDuqnC3RJFktDktyK9khGvo7dTkqO9uQ==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -7015,22 +6783,22 @@
         "node": ">= 10"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas-android-arm64": "0.1.65",
-        "@napi-rs/canvas-darwin-arm64": "0.1.65",
-        "@napi-rs/canvas-darwin-x64": "0.1.65",
-        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.65",
-        "@napi-rs/canvas-linux-arm64-gnu": "0.1.65",
-        "@napi-rs/canvas-linux-arm64-musl": "0.1.65",
-        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.65",
-        "@napi-rs/canvas-linux-x64-gnu": "0.1.65",
-        "@napi-rs/canvas-linux-x64-musl": "0.1.65",
-        "@napi-rs/canvas-win32-x64-msvc": "0.1.65"
+        "@napi-rs/canvas-android-arm64": "0.1.68",
+        "@napi-rs/canvas-darwin-arm64": "0.1.68",
+        "@napi-rs/canvas-darwin-x64": "0.1.68",
+        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.68",
+        "@napi-rs/canvas-linux-arm64-gnu": "0.1.68",
+        "@napi-rs/canvas-linux-arm64-musl": "0.1.68",
+        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.68",
+        "@napi-rs/canvas-linux-x64-gnu": "0.1.68",
+        "@napi-rs/canvas-linux-x64-musl": "0.1.68",
+        "@napi-rs/canvas-win32-x64-msvc": "0.1.68"
       }
     },
     "node_modules/@napi-rs/canvas-android-arm64": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.65.tgz",
-      "integrity": "sha512-ZYwqFYEKcT5Zr8lbiaJNJj/poLaeK2TncolY914r+gD2TJNeP7ZqvE7A2SX/1C9MB4E3DQEwm3YhL3WEf0x3MQ==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.68.tgz",
+      "integrity": "sha512-h1KcSR4LKLfRfzeBH65xMxbWOGa1OtMFQbCMVlxPCkN1Zr+2gK+70pXO5ktojIYcUrP6KDcOwoc8clho5ccM/w==",
       "cpu": [
         "arm64"
       ],
@@ -7045,9 +6813,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-arm64": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.65.tgz",
-      "integrity": "sha512-Pg1pfiJEyDIsX+V0QaJPRWvXbw5zmWAk3bivFCvt/5pwZb37/sT6E/RqPHT9NnqpDyKW6SriwY9ypjljysUA1Q==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.68.tgz",
+      "integrity": "sha512-/VURlrAD4gDoxW1GT/b0nP3fRz/fhxmHI/xznTq2FTwkQLPOlLkDLCvTmQ7v6LtGKdc2Ed6rvYpRan+JXThInQ==",
       "cpu": [
         "arm64"
       ],
@@ -7062,9 +6830,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-x64": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.65.tgz",
-      "integrity": "sha512-3Tr+/HjdJN7Z/VKIcsxV2DvDIibZCExgfYTgljCkUSFuoI7iNkOE6Dc1Q6j212EB9PeO8KmfrViBqHYT6IwWkA==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.68.tgz",
+      "integrity": "sha512-tEpvGR6vCLTo1Tx9wmDnoOKROpw57wiCWwCpDOuVlj/7rqEJOUYr9ixW4aRJgmeGBrZHgevI0EURys2ER6whmg==",
       "cpu": [
         "x64"
       ],
@@ -7079,9 +6847,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm-gnueabihf": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.65.tgz",
-      "integrity": "sha512-3KP+dYObH7CVkZMZWwk1WX9jRjL+EKdQtD43H8MOI+illf+dwqLlecdQ4d9bQRIxELKJ8dyPWY4fOp/Ngufrdg==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.68.tgz",
+      "integrity": "sha512-U9xbJsumPOiAYeAFZMlHf62b9dGs2HJ6Q5xt7xTB0uEyPeurwhgYBWGgabdsEidyj38YuzI/c3LGBbSQB3vagw==",
       "cpu": [
         "arm"
       ],
@@ -7096,9 +6864,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-gnu": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.65.tgz",
-      "integrity": "sha512-Ka3StKz7Dq7kjTF3nNJCq43UN/VlANS7qGE3dWkn1d+tQNsCRy/wRmyt1TUFzIjRqcTFMQNRbgYq84+53UBA0A==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.68.tgz",
+      "integrity": "sha512-KFkn8wEm3mPnWD4l8+OUUkxylSJuN5q9PnJRZJgv15RtCA1bgxIwTkBhI/+xuyVMcHqON9sXq7cDkEJtHm35dg==",
       "cpu": [
         "arm64"
       ],
@@ -7113,9 +6881,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-musl": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.65.tgz",
-      "integrity": "sha512-O4xMASm2JrmqYoiDyxVWi+z5C14H+oVEag2rZ5iIA67dhWqYZB+iO7wCFpBYRj31JPBR29FOsu6X9zL+DwBFdw==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.68.tgz",
+      "integrity": "sha512-IQzts91rCdOALXBWQxLZRCEDrfFTGDtNRJMNu+2SKZ1uT8cmPQkPwVk5rycvFpvgAcmiFiOSCp1aRrlfU8KPpQ==",
       "cpu": [
         "arm64"
       ],
@@ -7130,9 +6898,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-riscv64-gnu": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.65.tgz",
-      "integrity": "sha512-dblWDaA59ZU8bPbkfM+riSke7sFbNZ70LEevUdI5rgiFEUzYUQlU34gSBzemTACj5rCWt1BYeu0GfkLSjNMBSw==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.68.tgz",
+      "integrity": "sha512-e9AS5UttoIKqXSmBzKZdd3NErSVyOEYzJfNOCGtafGk1//gibTwQXGlSXmAKuErqMp09pyk9aqQRSYzm1AQfBw==",
       "cpu": [
         "riscv64"
       ],
@@ -7147,9 +6915,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-gnu": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.65.tgz",
-      "integrity": "sha512-wsp+atutw13OJXGU3DDkdngtBDoEg01IuK5xMe0L6VFPV8maGkh17CXze078OD5QJOc6kFyw3DDscMLOPF8+oA==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.68.tgz",
+      "integrity": "sha512-Pa/I36VE3j57I3Obhrr+J48KGFfkZk2cJN/2NmW/vCgmoF7kCP6aTVq5n+cGdGWLd/cN9CJ9JvNwEoMRDghu0g==",
       "cpu": [
         "x64"
       ],
@@ -7164,9 +6932,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-musl": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.65.tgz",
-      "integrity": "sha512-odX+nN+IozWzhdj31INcHz3Iy9+EckNw+VqsZcaUxZOTu7/3FmktRNI6aC1qe5minZNv1m05YOS1FVf7fvmjlA==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.68.tgz",
+      "integrity": "sha512-9c6rkc5195wNxuUHJdf4/mmnq433OQey9TNvQ9LspJazvHbfSkTij8wtKjASVQsJyPDva4fkWOeV/OQ7cLw0GQ==",
       "cpu": [
         "x64"
       ],
@@ -7181,9 +6949,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-win32-x64-msvc": {
-      "version": "0.1.65",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.65.tgz",
-      "integrity": "sha512-RZQX3luWnlNWgdMnLMQ1hyfQraeAn9lnxWWVCHuUM4tAWEV8UDdeb7cMwmJW7eyt8kAosmjeHt3cylQMHOxGFg==",
+      "version": "0.1.68",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.68.tgz",
+      "integrity": "sha512-Fc5Dez23u0FoSATurT6/w1oMytiRnKWEinHivdMvXpge6nG4YvhrASrtqMk8dGJMVQpHr8QJYF45rOrx2YU2Aw==",
       "cpu": [
         "x64"
       ],
@@ -7204,6 +6972,18 @@
       "dev": true,
       "optional": true
     },
+    "node_modules/@noble/hashes": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
+      "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+      "license": "MIT",
+      "engines": {
+        "node": "^14.21.3 || >=16"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
     "node_modules/@node-oauth/formats": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@node-oauth/formats/-/formats-1.0.0.tgz",
@@ -8723,6 +8503,10 @@
       "resolved": "services/clsi",
       "link": true
     },
+    "node_modules/@overleaf/clsi-cache": {
+      "resolved": "services/clsi-cache",
+      "link": true
+    },
     "node_modules/@overleaf/clsi-perf": {
       "resolved": "services/clsi-perf",
       "link": true
@@ -8854,6 +8638,15 @@
       "resolved": "services/web",
       "link": true
     },
+    "node_modules/@paralleldrive/cuid2": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@paralleldrive/cuid2/-/cuid2-2.2.2.tgz",
+      "integrity": "sha512-ZOBkgDwEdoYVlSeRbYYXs0S9MejQofiVYoTbKzy/6GQa39/q5tQU2IX46+shYnUkpEl3wc+J6wRlar7r2EK2xA==",
+      "license": "MIT",
+      "dependencies": {
+        "@noble/hashes": "^1.1.5"
+      }
+    },
     "node_modules/@phosphor-icons/react": {
       "version": "2.1.7",
       "resolved": "https://registry.npmjs.org/@phosphor-icons/react/-/react-2.1.7.tgz",
@@ -8878,9 +8671,9 @@
       }
     },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin": {
-      "version": "0.5.15",
-      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.15.tgz",
-      "integrity": "sha512-LFWllMA55pzB9D34w/wXUCf8+c+IYKuJDgxiZ3qMhl64KRMBHYM1I3VdGaD2BV5FNPV2/S2596bppxHbv2ZydQ==",
+      "version": "0.5.16",
+      "resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.16.tgz",
+      "integrity": "sha512-kLQc9xz6QIqd2oIYyXRUiAp79kGpFBm3fEM9ahfG1HI0WI5gdZ2OVHWdmZYnwODt7ISck+QuQ6sBPrtvUBML7Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8964,9 +8757,9 @@
       "license": "MIT"
     },
     "node_modules/@pmmmwh/react-refresh-webpack-plugin/node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.2.tgz",
+      "integrity": "sha512-Gn/JaSk/Mt9gYubxTtSn/QCV4em9mpAPiR1rqy/Ocu19u/G9J5WWdNoUT4SiV6mFC3y6cxyFcFwdzPM3FgxGAQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -9100,6 +8893,33 @@
         "url": "https://opencollective.com/popperjs"
       }
     },
+    "node_modules/@prettier/plugin-pug": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/@prettier/plugin-pug/-/plugin-pug-3.4.0.tgz",
+      "integrity": "sha512-Jzd5rE/ellJz3vqfxyVewPsCHXw1dmIzJ3AXhAnqVBKQOj2u73ZS2oUacji8CbQSsYyCy7GXFjXWDlDTMG1x2g==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/Shinigami92"
+        },
+        {
+          "type": "paypal",
+          "url": "https://www.paypal.com/donate/?hosted_button_id=L7GY729FBKTZY"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "pug-lexer": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=9.0.0"
+      },
+      "peerDependencies": {
+        "prettier": "^3.0.0"
+      }
+    },
     "node_modules/@protobufjs/aspromise": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz",
@@ -9155,10 +8975,11 @@
       "integrity": "sha1-p3c2C1s5oaLlEG+OhY8v0tBgxXA="
     },
     "node_modules/@react-aria/ssr": {
-      "version": "3.9.4",
-      "resolved": "https://registry.npmjs.org/@react-aria/ssr/-/ssr-3.9.4.tgz",
-      "integrity": "sha512-4jmAigVq409qcJvQyuorsmBR4+9r3+JEC60wC+Y0MZV0HCtTmm8D9guYXlJMdx0SSkgj0hHAyFm/HvPNFofCoQ==",
+      "version": "3.9.8",
+      "resolved": "https://registry.npmjs.org/@react-aria/ssr/-/ssr-3.9.8.tgz",
+      "integrity": "sha512-lQDE/c9uTfBSDOjaZUJS8xP2jCKVk4zjQeIlCH90xaLhHDgbpCdns3xvFpJJujfj3nI4Ll9K7A+ONUBDCASOuw==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "@swc/helpers": "^0.5.0"
       },
@@ -9166,31 +8987,35 @@
         "node": ">= 12"
       },
       "peerDependencies": {
-        "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
+        "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
       }
     },
     "node_modules/@react-dnd/asap": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-5.0.2.tgz",
       "integrity": "sha512-WLyfoHvxhs0V9U+GTsGilGgf2QsPl6ZZ44fnv0/b8T3nQyvzxidxsg/ZltbWssbsRDlYW8UKSQMTGotuTotZ6A==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@react-dnd/invariant": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/@react-dnd/invariant/-/invariant-4.0.2.tgz",
       "integrity": "sha512-xKCTqAK/FFauOM9Ta2pswIyT3D8AQlfrYdOi/toTPEhqCuAs1v5tcJ3Y08Izh1cJ5Jchwy9SeAXmMg6zrKs2iw==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@react-dnd/shallowequal": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
       "integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@remix-run/router": {
-      "version": "1.19.1",
-      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.19.1.tgz",
-      "integrity": "sha512-S45oynt/WH19bHbIXjtli6QmwNYvaz+vtnubvNpNDvUOoA/OWh6j1OikIP3G+v5GHdxyC6EXoChG3HgYGEUfcg==",
+      "version": "1.23.0",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.23.0.tgz",
+      "integrity": "sha512-O3rHJzAQKamUz1fvE0Qaw0xSFqsA/yafi2iqeE0pvdFtCO1viYx8QL6f3Ln/aCCTLxs68SLf0KPM9eSeM8yBnA==",
+      "license": "MIT",
       "engines": {
         "node": ">=14.0.0"
       }
@@ -9237,6 +9062,7 @@
       "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.4.16.tgz",
       "integrity": "sha512-f7aCv7c+nU/3mF7NWLtVVr0Ra80RqsO89hO72r+Y/nvQr5+q0UFGkocElTH6MJApvReVh6JHUFYn2cw1WdHF3w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "dequal": "^2.0.3"
       },
@@ -9245,19 +9071,20 @@
       }
     },
     "node_modules/@restart/ui": {
-      "version": "1.6.9",
-      "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.9.tgz",
-      "integrity": "sha512-mUbygUsJcRurjZCt1f77gg4DpheD1D+Sc7J3JjAkysUj7t8m4EBJVOqWC9788Qtbc69cJ+HlJc6jBguKwS8Mcw==",
+      "version": "1.9.4",
+      "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.9.4.tgz",
+      "integrity": "sha512-N4C7haUc3vn4LTwVUPlkJN8Ach/+yIMvRuTVIhjilNHqegY60SGLrzud6errOMNJwSnmYFnt1J0H/k8FE3A4KA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.21.0",
-        "@popperjs/core": "^2.11.6",
+        "@babel/runtime": "^7.26.0",
+        "@popperjs/core": "^2.11.8",
         "@react-aria/ssr": "^3.5.0",
-        "@restart/hooks": "^0.4.9",
-        "@types/warning": "^3.0.0",
+        "@restart/hooks": "^0.5.0",
+        "@types/warning": "^3.0.3",
         "dequal": "^2.0.3",
         "dom-helpers": "^5.2.0",
-        "uncontrollable": "^8.0.1",
+        "uncontrollable": "^8.0.4",
         "warning": "^4.0.3"
       },
       "peerDependencies": {
@@ -9265,14 +9092,17 @@
         "react-dom": ">=16.14.0"
       }
     },
-    "node_modules/@restart/ui/node_modules/dom-helpers": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
-      "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
+    "node_modules/@restart/ui/node_modules/@restart/hooks": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.5.1.tgz",
+      "integrity": "sha512-EMoH04NHS1pbn07iLTjIjgttuqb7qu4+/EyhAx27MHpoENcB2ZdSsLTNxmKD+WEPnZigo62Qc8zjGnNxoSE/5Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.8.7",
-        "csstype": "^3.0.2"
+        "dequal": "^2.0.3"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0"
       }
     },
     "node_modules/@restart/ui/node_modules/uncontrollable": {
@@ -9280,18 +9110,297 @@
       "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-8.0.4.tgz",
       "integrity": "sha512-ulRWYWHvscPFc0QQXvyJjY6LIXU56f0h8pQFvhxiKk5V1fcI8gp9Ht9leVAhrVjzqMw0BgjspBINx9r6oyJUvQ==",
       "dev": true,
+      "license": "MIT",
       "peerDependencies": {
         "react": ">=16.14.0"
       }
     },
-    "node_modules/@restart/ui/node_modules/warning": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.40.0.tgz",
+      "integrity": "sha512-+Fbls/diZ0RDerhE8kyC6hjADCXA1K4yVNlH0EYfd2XjyH0UGgzaQ8MlT0pCXAThfxv3QUAczHaL+qSv1E4/Cg==",
+      "cpu": [
+        "arm"
+      ],
       "dev": true,
-      "dependencies": {
-        "loose-envify": "^1.0.0"
-      }
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.40.0.tgz",
+      "integrity": "sha512-PPA6aEEsTPRz+/4xxAmaoWDqh67N7wFbgFUJGMnanCFs0TV99M0M8QhhaSCks+n6EbQoFvLQgYOGXxlMGQe/6w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.40.0.tgz",
+      "integrity": "sha512-GwYOcOakYHdfnjjKwqpTGgn5a6cUX7+Ra2HeNj/GdXvO2VJOOXCiYYlRFU4CubFM67EhbmzLOmACKEfvp3J1kQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.40.0.tgz",
+      "integrity": "sha512-CoLEGJ+2eheqD9KBSxmma6ld01czS52Iw0e2qMZNpPDlf7Z9mj8xmMemxEucinev4LgHalDPczMyxzbq+Q+EtA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.40.0.tgz",
+      "integrity": "sha512-r7yGiS4HN/kibvESzmrOB/PxKMhPTlz+FcGvoUIKYoTyGd5toHp48g1uZy1o1xQvybwwpqpe010JrcGG2s5nkg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.40.0.tgz",
+      "integrity": "sha512-mVDxzlf0oLzV3oZOr0SMJ0lSDd3xC4CmnWJ8Val8isp9jRGl5Dq//LLDSPFrasS7pSm6m5xAcKaw3sHXhBjoRw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.40.0.tgz",
+      "integrity": "sha512-y/qUMOpJxBMy8xCXD++jeu8t7kzjlOCkoxxajL58G62PJGBZVl/Gwpm7JK9+YvlB701rcQTzjUZ1JgUoPTnoQA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.40.0.tgz",
+      "integrity": "sha512-GoCsPibtVdJFPv/BOIvBKO/XmwZLwaNWdyD8TKlXuqp0veo2sHE+A/vpMQ5iSArRUz/uaoj4h5S6Pn0+PdhRjg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.40.0.tgz",
+      "integrity": "sha512-L5ZLphTjjAD9leJzSLI7rr8fNqJMlGDKlazW2tX4IUF9P7R5TMQPElpH82Q7eNIDQnQlAyiNVfRPfP2vM5Avvg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.40.0.tgz",
+      "integrity": "sha512-ATZvCRGCDtv1Y4gpDIXsS+wfFeFuLwVxyUBSLawjgXK2tRE6fnsQEkE4csQQYWlBlsFztRzCnBvWVfcae/1qxQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loongarch64-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.40.0.tgz",
+      "integrity": "sha512-wG9e2XtIhd++QugU5MD9i7OnpaVb08ji3P1y/hNbxrQ3sYEelKJOq1UJ5dXczeo6Hj2rfDEL5GdtkMSVLa/AOg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.40.0.tgz",
+      "integrity": "sha512-vgXfWmj0f3jAUvC7TZSU/m/cOE558ILWDzS7jBhiCAFpY2WEBn5jqgbqvmzlMjtp8KlLcBlXVD2mkTSEQE6Ixw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.40.0.tgz",
+      "integrity": "sha512-uJkYTugqtPZBS3Z136arevt/FsKTF/J9dEMTX/cwR7lsAW4bShzI2R0pJVw+hcBTWF4dxVckYh72Hk3/hWNKvA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.40.0.tgz",
+      "integrity": "sha512-rKmSj6EXQRnhSkE22+WvrqOqRtk733x3p5sWpZilhmjnkHkpeCgWsFFo0dGnUGeA+OZjRl3+VYq+HyCOEuwcxQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.40.0.tgz",
+      "integrity": "sha512-SpnYlAfKPOoVsQqmTFJ0usx0z84bzGOS9anAC0AZ3rdSo3snecihbhFTlJZ8XMwzqAcodjFU4+/SM311dqE5Sw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.40.0.tgz",
+      "integrity": "sha512-RcDGMtqF9EFN8i2RYN2W+64CdHruJ5rPqrlYw+cgM3uOVPSsnAQps7cpjXe9be/yDp8UC7VLoCoKC8J3Kn2FkQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.40.0.tgz",
+      "integrity": "sha512-HZvjpiUmSNx5zFgwtQAV1GaGazT2RWvqeDi0hV+AtC8unqqDSsaFjPxfsO6qPtKRRg25SisACWnJ37Yio8ttaw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.40.0.tgz",
+      "integrity": "sha512-UtZQQI5k/b8d7d3i9AZmA/t+Q4tk3hOC0tMOMSq2GlMYOfxbesxG4mJSeDp0EHs30N9bsfwUvs3zF4v/RzOeTQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.40.0.tgz",
+      "integrity": "sha512-+m03kvI2f5syIqHXCZLPVYplP8pQch9JHyXKZ3AGMKlg8dCyr2PKHjwRLiW53LTrN/Nc3EqHOKxUxzoSPdKddA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.40.0.tgz",
+      "integrity": "sha512-lpPE1cLfP5oPzVjKMx10pgBmKELQnFJXHgvtHCtuJWOv8MxqdEIMNtgHgBFf7Ea2/7EuVwa9fodWUfXAlXZLZQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rtsao/scc": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@rtsao/scc/-/scc-1.1.0.tgz",
+      "integrity": "sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@sentry-internal/tracing": {
       "version": "7.46.0",
@@ -10083,14 +10192,15 @@
       }
     },
     "node_modules/@storybook/addon-a11y": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-a11y/-/addon-a11y-8.6.4.tgz",
-      "integrity": "sha512-B3/d2cRlnpAlE3kh+OBaly6qrWN9DEqwDyZsNeobaiXnNp11xoHZP2OWjEwXldc0pKls41jeOksXyXrILfvTng==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-a11y/-/addon-a11y-8.6.12.tgz",
+      "integrity": "sha512-H28zHiL8uuv29XsVNf9VjNWsCeht/l66GPYHT7aom1jh+f3fS9+sutrCGEBC/T7cnRpy8ZyuHCtihUqS+RI4pg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/addon-highlight": "8.6.4",
-        "@storybook/test": "8.6.4",
+        "@storybook/addon-highlight": "8.6.12",
+        "@storybook/global": "^5.0.0",
+        "@storybook/test": "8.6.12",
         "axe-core": "^4.2.0"
       },
       "funding": {
@@ -10098,13 +10208,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-actions": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-8.6.4.tgz",
-      "integrity": "sha512-mCcyfkeb19fJX0dpQqqZCnWBwjVn0/27xcpR0mbm/KW2wTByU6bKFFujgrHsX3ONl97IcIaUnmwwUwBr1ebZXw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-actions/-/addon-actions-8.6.12.tgz",
+      "integrity": "sha512-B5kfiRvi35oJ0NIo53CGH66H471A3XTzrfaa6SxXEJsgxxSeKScG5YeXcCvLiZfvANRQ7QDsmzPUgg0o3hdMXw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10119,7 +10229,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-actions/node_modules/uuid": {
@@ -10137,9 +10247,9 @@
       }
     },
     "node_modules/@storybook/addon-backgrounds": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-backgrounds/-/addon-backgrounds-8.6.4.tgz",
-      "integrity": "sha512-lRYGumlYdd1RptQJvOTRMx/q2pDmg2MO5GX4la7VfI8KrUyeuC1ZOSRDEcXeTuAZWJztqmtymg6bB7cAAoxCFA==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-backgrounds/-/addon-backgrounds-8.6.12.tgz",
+      "integrity": "sha512-lmIAma9BiiCTbJ8YfdZkXjpnAIrOUcgboLkt1f6XJ78vNEMnLNzD9gnh7Tssz1qrqvm34v9daDjIb+ggdiKp3Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10152,13 +10262,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-controls": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-controls/-/addon-controls-8.6.4.tgz",
-      "integrity": "sha512-oMMP9Bj0RMfYmaitjFt6oBSjKH4titUqP+wE6PrZ3v+Om56f4buqfNKXRf80As2OrsZn0pjj95muWzVVHqIhyQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-controls/-/addon-controls-8.6.12.tgz",
+      "integrity": "sha512-9VSRPJWQVb9wLp21uvpxDGNctYptyUX0gbvxIWOHMH3R2DslSoq41lsC/oQ4l4zSHVdL+nq8sCTkhBxIsjKqdQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10171,20 +10281,20 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-docs": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-8.6.4.tgz",
-      "integrity": "sha512-+kbcjvEAH0Xs+k+raAwfC0WmJilWhxBYnLLeazP3m5AkVI3sIjbzuuZ78NR0DCdRkw9BpuuXMHv5o4tIvLIUlw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-8.6.12.tgz",
+      "integrity": "sha512-kEezQjAf/p3SpDzLABgg4fbT48B6dkT2LiZCKTRmCrJVtuReaAr4R9MMM6Jsph6XjbIj/SvOWf3CMeOPXOs9sg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@mdx-js/react": "^3.0.0",
-        "@storybook/blocks": "8.6.4",
-        "@storybook/csf-plugin": "8.6.4",
-        "@storybook/react-dom-shim": "8.6.4",
+        "@storybook/blocks": "8.6.12",
+        "@storybook/csf-plugin": "8.6.12",
+        "@storybook/react-dom-shim": "8.6.12",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "ts-dedent": "^2.0.0"
@@ -10194,25 +10304,25 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-essentials": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-essentials/-/addon-essentials-8.6.4.tgz",
-      "integrity": "sha512-3pF0ZDl5EICqe0eOupPQq6PxeupwkLsfTWANuuJUYTJur82kvJd3Chb7P9vqw0A0QBx6106mL6PIyjrFJJMhLg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-essentials/-/addon-essentials-8.6.12.tgz",
+      "integrity": "sha512-Y/7e8KFlttaNfv7q2zoHMPdX6hPXHdsuQMAjYl5NG9HOAJREu4XBy4KZpbcozRe4ApZ78rYsN/MO1EuA+bNMIA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/addon-actions": "8.6.4",
-        "@storybook/addon-backgrounds": "8.6.4",
-        "@storybook/addon-controls": "8.6.4",
-        "@storybook/addon-docs": "8.6.4",
-        "@storybook/addon-highlight": "8.6.4",
-        "@storybook/addon-measure": "8.6.4",
-        "@storybook/addon-outline": "8.6.4",
-        "@storybook/addon-toolbars": "8.6.4",
-        "@storybook/addon-viewport": "8.6.4",
+        "@storybook/addon-actions": "8.6.12",
+        "@storybook/addon-backgrounds": "8.6.12",
+        "@storybook/addon-controls": "8.6.12",
+        "@storybook/addon-docs": "8.6.12",
+        "@storybook/addon-highlight": "8.6.12",
+        "@storybook/addon-measure": "8.6.12",
+        "@storybook/addon-outline": "8.6.12",
+        "@storybook/addon-toolbars": "8.6.12",
+        "@storybook/addon-viewport": "8.6.12",
         "ts-dedent": "^2.0.0"
       },
       "funding": {
@@ -10220,13 +10330,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-highlight": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-highlight/-/addon-highlight-8.6.4.tgz",
-      "integrity": "sha512-jFREXnSE/7VuBR8kbluN+DBVkMXEV7MGuCe8Ytb1/D2Q0ohgJe395dfVgEgSMXErOwsn//NV/NgJp6JNXH2DrA==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-highlight/-/addon-highlight-8.6.12.tgz",
+      "integrity": "sha512-9FITVxdoycZ+eXuAZL9ElWyML/0fPPn9UgnnAkrU7zkMi+Segq/Tx7y+WWanC5zfWZrXAuG6WTOYEXeWQdm//w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10237,19 +10347,19 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-interactions": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-interactions/-/addon-interactions-8.6.4.tgz",
-      "integrity": "sha512-MZAAZjyvmJXCvM35zEiPpXz7vK+fimovt+WZKAMayAbXy5fT+7El0c9dDyTQ2norNKNj9QU/8hiU/1zARSUELQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-interactions/-/addon-interactions-8.6.12.tgz",
+      "integrity": "sha512-cTAJlTq6uVZBEbtwdXkXoPQ4jHOAGKQnYSezBT4pfNkdjn/FnEeaQhMBDzf14h2wr5OgBnJa6Lmd8LD9ficz4A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@storybook/global": "^5.0.0",
-        "@storybook/instrumenter": "8.6.4",
-        "@storybook/test": "8.6.4",
+        "@storybook/instrumenter": "8.6.12",
+        "@storybook/test": "8.6.12",
         "polished": "^4.2.2",
         "ts-dedent": "^2.2.0"
       },
@@ -10258,13 +10368,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-links": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-8.6.4.tgz",
-      "integrity": "sha512-TaSIteYLJ12+dVBk7fW96ZvNIFizKs+Vo/YuNAe4xTzFJRrjLkFj9htLVi/dusMfn7lYo5DHIns08LuM+po1Dg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-8.6.12.tgz",
+      "integrity": "sha512-AfKujFHoAxhxq4yu+6NwylltS9lf5MPs1eLLXvOlwo3l7Y/c68OdxJ7j68vLQhs9H173WVYjKyjbjFxJWf/YYg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10277,7 +10387,7 @@
       },
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       },
       "peerDependenciesMeta": {
         "react": {
@@ -10286,9 +10396,9 @@
       }
     },
     "node_modules/@storybook/addon-measure": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-measure/-/addon-measure-8.6.4.tgz",
-      "integrity": "sha512-IpVL1rTy1tO8sy140eU3GdVB1QJ6J62+V6GSstcmqTLxDJQk5jFfg7hVbPEAZZ2sPFmeyceP9AMoBBo0EB355A==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-measure/-/addon-measure-8.6.12.tgz",
+      "integrity": "sha512-tACmwqqOvutaQSduw8SMb62wICaT1rWaHtMN3vtWXuxgDPSdJQxLP+wdVyRYMAgpxhLyIO7YRf++Hfha9RHgFg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10300,13 +10410,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-outline": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-outline/-/addon-outline-8.6.4.tgz",
-      "integrity": "sha512-28nAslKTy0zWMdxAZcipMDYrEp1TkXVooAsqMGY5AMXMiORi1ObjhmjTLhVt1dXp+aDg0X+M3B6PqoingmHhqQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-outline/-/addon-outline-8.6.12.tgz",
+      "integrity": "sha512-1ylwm+n1s40S91No0v9T4tCjZORu3GbnjINlyjYTDLLhQHyBQd3nWR1Y1eewU4xH4cW9SnSLcMQFS/82xHqU6A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10318,7 +10428,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-styling-webpack": {
@@ -10335,9 +10445,9 @@
       }
     },
     "node_modules/@storybook/addon-toolbars": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-toolbars/-/addon-toolbars-8.6.4.tgz",
-      "integrity": "sha512-PU2lvgwCKDn93zpp5MEog103UUmSSugcxDf18xaoa9D15Qtr+YuQHd2hXbxA7+dnYL9lA7MLYsstfxE91ieM4Q==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-toolbars/-/addon-toolbars-8.6.12.tgz",
+      "integrity": "sha512-HEcSzo1DyFtIu5/ikVOmh5h85C1IvK9iFKSzBR6ice33zBOaehVJK+Z5f487MOXxPsZ63uvWUytwPyViGInj+g==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -10345,13 +10455,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-viewport": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-viewport/-/addon-viewport-8.6.4.tgz",
-      "integrity": "sha512-O5Ij+SRVg6grY6JOL5lOpsFyopZxuZEl2GHfh2SUf9hfowNS0QAgFpJupqXkwZzRSrlf9uKrLkjB6ulLgN2gOQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-viewport/-/addon-viewport-8.6.12.tgz",
+      "integrity": "sha512-EXK2LArAnABsPP0leJKy78L/lbMWow+EIJfytEP5fHaW4EhMR6h7Hzaqzre6U0IMMr/jVFa1ci+m0PJ0eQc2bw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10362,13 +10472,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/addon-webpack5-compiler-babel": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/@storybook/addon-webpack5-compiler-babel/-/addon-webpack5-compiler-babel-3.0.5.tgz",
-      "integrity": "sha512-9dlc5PrehEFUHqkgj8x+aKtOY9XH9Zk6WBbtpgY/JCQ7waJ2VvhyDnrgJeXfek+WYlSkJElnta6SlqP+XRG0PQ==",
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@storybook/addon-webpack5-compiler-babel/-/addon-webpack5-compiler-babel-3.0.6.tgz",
+      "integrity": "sha512-J4uVxEfkd2iAxPxcT90iebt5wuLSd0EYuMJa94t1jVUGlvZZAvnmqXAqscRITNU37nOr0c9yZ2YVS/sFOZyOVw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10380,9 +10490,9 @@
       }
     },
     "node_modules/@storybook/blocks": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.6.4.tgz",
-      "integrity": "sha512-+oPXwT3KzJzsdkQuGEzBqOKTIFlb6qmlCWWbDwAnP0SEqYHoTVRTAIa44icFP0EZeIe+ypFVAm1E7kWTLmw1hQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.6.12.tgz",
+      "integrity": "sha512-DohlTq6HM1jDbHYiXL4ZvZ00VkhpUp5uftzj/CZDLY1fYHRjqtaTwWm2/OpceivMA8zDitLcq5atEZN+f+siTg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10396,7 +10506,7 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       },
       "peerDependenciesMeta": {
         "react": {
@@ -10408,13 +10518,13 @@
       }
     },
     "node_modules/@storybook/builder-webpack5": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/builder-webpack5/-/builder-webpack5-8.6.4.tgz",
-      "integrity": "sha512-6fhjt3uiBZeapRbF477bkJ+ln+yA8vOz0qR86XTq79VrYY5AbBL6F8swVMk9LG1t49vYPR/UuPjYBxsUNKK8MQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/builder-webpack5/-/builder-webpack5-8.6.12.tgz",
+      "integrity": "sha512-Z7RsQ/1+HbxdbM69JrEFcTL+pnVKUTMmeURMn5/eOvYTGjBtM18vbQTj0LjCUDIjC+v9U+uX8ZJEUVxFbGcxBw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/core-webpack": "8.6.4",
+        "@storybook/core-webpack": "8.6.12",
         "@types/semver": "^7.3.4",
         "browser-assert": "^1.2.1",
         "case-sensitive-paths-webpack-plugin": "^2.4.0",
@@ -10444,7 +10554,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       },
       "peerDependenciesMeta": {
         "typescript": {
@@ -10497,9 +10607,9 @@
       "license": "MIT"
     },
     "node_modules/@storybook/builder-webpack5/node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.2.tgz",
+      "integrity": "sha512-Gn/JaSk/Mt9gYubxTtSn/QCV4em9mpAPiR1rqy/Ocu19u/G9J5WWdNoUT4SiV6mFC3y6cxyFcFwdzPM3FgxGAQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -10573,18 +10683,18 @@
       }
     },
     "node_modules/@storybook/cli": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/cli/-/cli-8.6.4.tgz",
-      "integrity": "sha512-iVw4B2Pe4/ERDkDeaXtXamFXatNgvtiA6G9p3wUpVSlxjgKW/JbjSwKAMTCsgDIj4dCMm8i0fzmiYXeg5Yprng==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/cli/-/cli-8.6.12.tgz",
+      "integrity": "sha512-USOPHgQsckHguxqYItm7+i9lohjiPsCrNKBMl40XPU3dc1LqENBOF1JtJnOLTGegjUxRox7oaqrM10b9rkafWA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/core": "^7.24.4",
         "@babel/types": "^7.24.0",
-        "@storybook/codemod": "8.6.4",
+        "@storybook/codemod": "8.6.12",
         "@types/semver": "^7.3.4",
         "commander": "^12.1.0",
-        "create-storybook": "8.6.4",
+        "create-storybook": "8.6.12",
         "cross-spawn": "^7.0.3",
         "envinfo": "^7.7.3",
         "fd-package-json": "^1.2.0",
@@ -10597,7 +10707,7 @@
         "p-limit": "^6.2.0",
         "prompts": "^2.4.0",
         "semver": "^7.3.7",
-        "storybook": "8.6.4",
+        "storybook": "8.6.12",
         "tiny-invariant": "^1.3.1",
         "ts-dedent": "^2.0.0"
       },
@@ -10898,9 +11008,9 @@
       "license": "ISC"
     },
     "node_modules/@storybook/cli/node_modules/yocto-queue": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.2.0.tgz",
-      "integrity": "sha512-KHBC7z61OJeaMGnF3wqNZj+GGNXOyypZviiKpQeiHirG5Ib1ImwcLBH70rbMSkKfSmUNBsdf2PwaEJtKvgmkNw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-1.2.1.tgz",
+      "integrity": "sha512-AyeEbWOu/TAXdxlV9wmGcR0+yh2j3vYPGOECcIj2S7MkrLyC7ne+oye2BKTItt0ii2PHk4cDy+95+LshzbXnGg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10911,16 +11021,16 @@
       }
     },
     "node_modules/@storybook/codemod": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/codemod/-/codemod-8.6.4.tgz",
-      "integrity": "sha512-HVB7py6vKB9OMzQ02aAhcqmyT/IDlYrT1960HO6LWRhcpztnBlOHAAlhM91DN8yqN0K47B+GsaN5eDzCT8ggBw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/codemod/-/codemod-8.6.12.tgz",
+      "integrity": "sha512-RFIGUI+dkFqrcuOyxNY97WuW7dskmuGL9yGALQsNmyGC490VUJ3scLOAgBChWBjsDfnN8uSb0Kvt/fB4OOyCmw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@babel/core": "^7.24.4",
         "@babel/preset-env": "^7.24.4",
         "@babel/types": "^7.24.0",
-        "@storybook/core": "8.6.4",
+        "@storybook/core": "8.6.12",
         "@types/cross-spawn": "^6.0.2",
         "cross-spawn": "^7.0.3",
         "es-toolkit": "^1.22.0",
@@ -11091,9 +11201,9 @@
       }
     },
     "node_modules/@storybook/components": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-8.6.4.tgz",
-      "integrity": "sha512-91VEVFWOgHkEFoNFMk6gs1AuOE9Yp7N283BXQOW+AgP+atpzED6t/fIBPGqJ2ewAuzLJ+cFOrasSzoNwVfg3Jg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/components/-/components-8.6.12.tgz",
+      "integrity": "sha512-FiaE8xvCdvKC2arYusgtlDNZ77b8ysr8njAYQZwwaIHjy27TbR2tEpLDCmUwSbANNmivtc/xGEiDDwcNppMWlQ==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11105,13 +11215,13 @@
       }
     },
     "node_modules/@storybook/core": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/core/-/core-8.6.4.tgz",
-      "integrity": "sha512-glDbjEBi3wokw1T+KQtl93irHO9N0LCwgylWfWVXYDdQjUJ7pGRQGnw73gPX7Ds9tg3myXFC83GjmY94UYSMbA==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/core/-/core-8.6.12.tgz",
+      "integrity": "sha512-t+ZuDzAlsXKa6tLxNZT81gEAt4GNwsKP/Id2wluhmUWD/lwYW0uum1JiPUuanw8xD6TdakCW/7ULZc7aQUBLCQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/theming": "8.6.4",
+        "@storybook/theming": "8.6.12",
         "better-opn": "^3.0.2",
         "browser-assert": "^1.2.1",
         "esbuild": "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0",
@@ -11137,9 +11247,9 @@
       }
     },
     "node_modules/@storybook/core-webpack": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/core-webpack/-/core-webpack-8.6.4.tgz",
-      "integrity": "sha512-/E+NDs4Ls2KQhQJyEbqyddvcevPGCNbBIRoR691gq2lnZV7lYFfhpGfYlXL1uSoA3WUWmql/gBsa2/O3vB+HKg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/core-webpack/-/core-webpack-8.6.12.tgz",
+      "integrity": "sha512-TiE+KOm0hxb/p0JxeGHKxqTNX+xnTOFsBh6uloCSuvodutJ5pR/XpxKVxwo1gtSc0Uq3qpgbMhW6qYlYQetnKA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11150,7 +11260,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/core/node_modules/semver": {
@@ -11167,9 +11277,9 @@
       }
     },
     "node_modules/@storybook/csf-plugin": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/csf-plugin/-/csf-plugin-8.6.4.tgz",
-      "integrity": "sha512-7UpEp4PFTy1iKjZiRaYMG7zvnpLIRPyD0+lUJUlLYG4UIemV3onvnIi1Je1tSZ4hfTup+ulom7JLztVSHZGRMg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/csf-plugin/-/csf-plugin-8.6.12.tgz",
+      "integrity": "sha512-6s8CnP1aoKPb3XtC0jRLUp8M5vTA8RhGAwQDKUsFpCC7g89JR9CaKs9FY2ZSzsNbjR15uASi7b3K8BzeYumYQg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11180,7 +11290,7 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/global": {
@@ -11191,9 +11301,9 @@
       "license": "MIT"
     },
     "node_modules/@storybook/icons": {
-      "version": "1.3.2",
-      "resolved": "https://registry.npmjs.org/@storybook/icons/-/icons-1.3.2.tgz",
-      "integrity": "sha512-t3xcbCKkPvqyef8urBM0j/nP6sKtnlRkVgC+8JTbTAZQjaTmOjes3byEgzs89p4B/K6cJsg9wLW2k3SknLtYJw==",
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/@storybook/icons/-/icons-1.4.0.tgz",
+      "integrity": "sha512-Td73IeJxOyalzvjQL+JXx72jlIYHgs+REaHiREOqfpo3A2AYYG71AUbcv+lg7mEDIweKVCxsMQ0UKo634c8XeA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -11205,9 +11315,9 @@
       }
     },
     "node_modules/@storybook/instrumenter": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/instrumenter/-/instrumenter-8.6.4.tgz",
-      "integrity": "sha512-8OtIWLhayTUdqJEeXiPm6l3LTdSkWgQzzV2l2HIe4Adedeot+Rkwu6XHmyRDpnb0+Ish6zmMDqtJBxC2PQsy6Q==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/instrumenter/-/instrumenter-8.6.12.tgz",
+      "integrity": "sha512-VK5fYAF8jMwWP/u3YsmSwKGh+FeSY8WZn78flzRUwirp2Eg1WWjsqPRubAk7yTpcqcC/km9YMF3KbqfzRv2s/A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11219,13 +11329,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/manager-api": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/manager-api/-/manager-api-8.6.4.tgz",
-      "integrity": "sha512-w/Nn/VznfbIg2oezDfzZNwSTDY5kBZbzxVBHLCnIcyu2AKt2Yto3pfGi60SikFcTrsClaAKT7D92kMQ9qdQNQQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/manager-api/-/manager-api-8.6.12.tgz",
+      "integrity": "sha512-O0SpISeJLNTQvhSBOsWzzkCgs8vCjOq1578rwqHlC6jWWm4QmtfdyXqnv7rR1Hk08kQ+Dzqh0uhwHx0nfwy4nQ==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11237,24 +11347,28 @@
       }
     },
     "node_modules/@storybook/node-logger": {
-      "version": "8.0.4",
-      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-8.0.4.tgz",
-      "integrity": "sha512-cALLHuX53vLQsoJamGRlquh2pfhPq9copXou2JTmFT6mrCcipo77SzhBDfeeuhaGv6vUWPfmGjPBEHXWGPe4+g==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-8.6.12.tgz",
+      "integrity": "sha512-Jk7mQWsu60BptBwYJAd69kMmsEqBAbGDuA/fqban+8vfNiSKgR3PRkhis0DsGEk53bpAEfbkCcyvYRCrrq4M3Q==",
       "dev": true,
+      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/storybook"
+      },
+      "peerDependencies": {
+        "storybook": "^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0"
       }
     },
     "node_modules/@storybook/preset-react-webpack": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/preset-react-webpack/-/preset-react-webpack-8.6.4.tgz",
-      "integrity": "sha512-rFd1NvSE2ZP5ZFEqH7wdXXlvnyNChSMp+w4FyGSCgFQOwQKZhhWPPyloi3gGSWztFV9qpzC/ri7TTvG6ptqPPw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/preset-react-webpack/-/preset-react-webpack-8.6.12.tgz",
+      "integrity": "sha512-aCCHjR/jsVPVThRH7nK70wS0Od44M6hqkkakg3xr7LETZZGj99heen6t4VHvz8gcQYT9l6R/oZwCl7f/PQ3ZBQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/core-webpack": "8.6.4",
-        "@storybook/react": "8.6.4",
+        "@storybook/core-webpack": "8.6.12",
+        "@storybook/react": "8.6.12",
         "@storybook/react-docgen-typescript-plugin": "1.0.6--canary.9.0c3f3b7.0",
         "@types/semver": "^7.3.4",
         "find-up": "^5.0.0",
@@ -11275,7 +11389,7 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       },
       "peerDependenciesMeta": {
         "typescript": {
@@ -11312,9 +11426,9 @@
       }
     },
     "node_modules/@storybook/preview-api": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/preview-api/-/preview-api-8.6.4.tgz",
-      "integrity": "sha512-5HBfxggzxGz0dg2c61NpPiQJav7UAmzsQlzmI5SzWOS6lkaylcDG8giwKzASVCXVWBxNji9qIDFM++UH090aDg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/preview-api/-/preview-api-8.6.12.tgz",
+      "integrity": "sha512-84FE3Hrs0AYKHqpDZOwx1S/ffOfxBdL65lhCoeI8GoWwCkzwa9zEP3kvXBo/BnEDO7nAfxvMhjASTZXbKRJh5Q==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11326,18 +11440,18 @@
       }
     },
     "node_modules/@storybook/react": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-8.6.4.tgz",
-      "integrity": "sha512-pfv4hMhu3AScOh0l86uIzmXLSQ0XA/e0reIVwQcxKht6miaKArhx9GkS4mMp6SO23ZoV5G/nfLgUaMVPVE0ZPg==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/react/-/react-8.6.12.tgz",
+      "integrity": "sha512-NzxlHLA5DkDgZM/dMwTYinuzRs6rsUPmlqP+NIv6YaciQ4NGnTYyOC7R/SqI6HHFm8ZZ5eMYvpfiFmhZ9rU+rQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/components": "8.6.4",
+        "@storybook/components": "8.6.12",
         "@storybook/global": "^5.0.0",
-        "@storybook/manager-api": "8.6.4",
-        "@storybook/preview-api": "8.6.4",
-        "@storybook/react-dom-shim": "8.6.4",
-        "@storybook/theming": "8.6.4"
+        "@storybook/manager-api": "8.6.12",
+        "@storybook/preview-api": "8.6.12",
+        "@storybook/react-dom-shim": "8.6.12",
+        "@storybook/theming": "8.6.12"
       },
       "engines": {
         "node": ">=18.0.0"
@@ -11347,10 +11461,10 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "@storybook/test": "8.6.4",
+        "@storybook/test": "8.6.12",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-        "storybook": "^8.6.4",
+        "storybook": "^8.6.12",
         "typescript": ">= 4.2.x"
       },
       "peerDependenciesMeta": {
@@ -11417,9 +11531,9 @@
       }
     },
     "node_modules/@storybook/react-dom-shim": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-8.6.4.tgz",
-      "integrity": "sha512-kTGJ3aFdmfCFzYaDFGmZWfTXr9xhbUaf0tJ6+nEjc4tME6mFwMI+tTUT6U/J6mJhZuc2DjvIRA7bM0x77dIDqw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/react-dom-shim/-/react-dom-shim-8.6.12.tgz",
+      "integrity": "sha512-51QvoimkBzYs8s3rCYnY5h0cFqLz/Mh0vRcughwYaXckWzDBV8l67WBO5Xf5nBsukCbWyqBVPpEQLww8s7mrLA==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11429,19 +11543,19 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-        "storybook": "^8.6.4"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/react-webpack5": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/react-webpack5/-/react-webpack5-8.6.4.tgz",
-      "integrity": "sha512-kH439Atpp94+hWF/xftOJ4ZCy7bnNWuLSni7sWvOGkYZpzzzkLXfACanvK6ZY9wUxAh0bbdGfbc3McMvIWfYlw==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/react-webpack5/-/react-webpack5-8.6.12.tgz",
+      "integrity": "sha512-wZOjPQ00gu85iQoKgwz5uvM3+bhXrQDVR0ppVAj7vVy6cvLEsJXmqNLHbXPCZuKPmvwzYr1QkslMLCIkF8OGdA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/builder-webpack5": "8.6.4",
-        "@storybook/preset-react-webpack": "8.6.4",
-        "@storybook/react": "8.6.4"
+        "@storybook/builder-webpack5": "8.6.12",
+        "@storybook/preset-react-webpack": "8.6.12",
+        "@storybook/react": "8.6.12"
       },
       "engines": {
         "node": ">=18.0.0"
@@ -11453,7 +11567,7 @@
       "peerDependencies": {
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta",
-        "storybook": "^8.6.4",
+        "storybook": "^8.6.12",
         "typescript": ">= 4.2.x"
       },
       "peerDependenciesMeta": {
@@ -11463,14 +11577,14 @@
       }
     },
     "node_modules/@storybook/test": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/test/-/test-8.6.4.tgz",
-      "integrity": "sha512-JPjfbaMMuCBT47pg3/MDD9vYFF5OGPAOWEB9nJWJ9IjYAb2Nd8OYJQIDoYJQNT+aLkTVLtvzGnVNwdxpouAJcQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/test/-/test-8.6.12.tgz",
+      "integrity": "sha512-0BK1Eg+VD0lNMB1BtxqHE3tP9FdkUmohtvWG7cq6lWvMrbCmAmh3VWai3RMCCDOukPFpjabOr8BBRLVvhNpv2w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@storybook/global": "^5.0.0",
-        "@storybook/instrumenter": "8.6.4",
+        "@storybook/instrumenter": "8.6.12",
         "@testing-library/dom": "10.4.0",
         "@testing-library/jest-dom": "6.5.0",
         "@testing-library/user-event": "14.5.2",
@@ -11482,96 +11596,13 @@
         "url": "https://opencollective.com/storybook"
       },
       "peerDependencies": {
-        "storybook": "^8.6.4"
-      }
-    },
-    "node_modules/@storybook/test/node_modules/@testing-library/dom": {
-      "version": "10.4.0",
-      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
-      "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@babel/code-frame": "^7.10.4",
-        "@babel/runtime": "^7.12.5",
-        "@types/aria-query": "^5.0.1",
-        "aria-query": "5.3.0",
-        "chalk": "^4.1.0",
-        "dom-accessibility-api": "^0.5.9",
-        "lz-string": "^1.5.0",
-        "pretty-format": "^27.0.2"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/@storybook/test/node_modules/@types/aria-query": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
-      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/@storybook/test/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/@storybook/test/node_modules/aria-query": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
-      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
-      "dev": true,
-      "license": "Apache-2.0",
-      "dependencies": {
-        "dequal": "^2.0.3"
-      }
-    },
-    "node_modules/@storybook/test/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/chalk?sponsor=1"
-      }
-    },
-    "node_modules/@storybook/test/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "has-flag": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
+        "storybook": "^8.6.12"
       }
     },
     "node_modules/@storybook/theming": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-8.6.4.tgz",
-      "integrity": "sha512-g9Ns4uenC9oAWETaJ/tEKEIPMdS+CqjNWZz5Wbw1bLNhXwADZgKrVqawzZi64+bYYtQ+i8VCTjPoFa6s2eHiDQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-8.6.12.tgz",
+      "integrity": "sha512-6VjZg8HJ2Op7+KV7ihJpYrDnFtd9D1jrQnUS8LckcpuBXrIEbaut5+34ObY8ssQnSqkk2GwIZBBBQYQBCVvkOw==",
       "dev": true,
       "license": "MIT",
       "funding": {
@@ -11582,36 +11613,14 @@
         "storybook": "^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0"
       }
     },
-    "node_modules/@stripe/react-stripe-js": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/@stripe/react-stripe-js/-/react-stripe-js-3.5.0.tgz",
-      "integrity": "sha512-oo5J2SNbuAUjE9XmQv/SOD7vgZCa1Y9OcZyRAfvQPkyrDrru35sg5c64ANdHEmOWUibism3+25rKdARSw3HOfA==",
-      "license": "MIT",
-      "dependencies": {
-        "prop-types": "^15.7.2"
-      },
-      "peerDependencies": {
-        "@stripe/stripe-js": ">=1.44.1 <7.0.0",
-        "react": ">=16.8.0 <20.0.0",
-        "react-dom": ">=16.8.0 <20.0.0"
-      }
-    },
-    "node_modules/@stripe/stripe-js": {
-      "version": "5.10.0",
-      "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-5.10.0.tgz",
-      "integrity": "sha512-PTigkxMdMUP6B5ISS7jMqJAKhgrhZwjprDqR1eATtFfh0OpKVNp110xiH+goeVdrJ29/4LeZJR4FaHHWstsu0A==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=12.16"
-      }
-    },
     "node_modules/@swc/helpers": {
-      "version": "0.5.11",
-      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.11.tgz",
-      "integrity": "sha512-YNlnKRWF2sVojTpIyzwou9XoTNbzbzONwRhOoniEioF1AtaitTvVZblaQRrAzChWQ1bLYyYSWzM18y4WwgzJ+A==",
+      "version": "0.5.17",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.17.tgz",
+      "integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
-        "tslib": "^2.4.0"
+        "tslib": "^2.8.0"
       }
     },
     "node_modules/@testing-library/cypress": {
@@ -11650,12 +11659,6 @@
         "node": ">=14"
       }
     },
-    "node_modules/@testing-library/cypress/node_modules/@types/aria-query": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.2.tgz",
-      "integrity": "sha512-PHKZuMN+K5qgKIWhBodXzQslTo5P+K/6LqeKXS6O/4liIDdZqaX5RXrCK++LAw+y/nptN48YmUMFiQHRSWYwtQ==",
-      "dev": true
-    },
     "node_modules/@testing-library/cypress/node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -11700,22 +11703,23 @@
       }
     },
     "node_modules/@testing-library/dom": {
-      "version": "8.13.0",
-      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-8.13.0.tgz",
-      "integrity": "sha512-9VHgfIatKNXQNaZTtLnalIy0jNZzY35a4S3oi08YAt9Hv1VsfZ/DfA45lM8D/UhtHBGJ4/lGwp0PZkVndRkoOQ==",
+      "version": "10.4.0",
+      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.0.tgz",
+      "integrity": "sha512-pemlzrSESWbdAloYml3bAJMEfNh1Z7EduzqPKprCH5S341frlpYnUEW0H72dLxa6IsYr+mPno20GiSm+h9dEdQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@babel/code-frame": "^7.10.4",
         "@babel/runtime": "^7.12.5",
-        "@types/aria-query": "^4.2.0",
-        "aria-query": "^5.0.0",
+        "@types/aria-query": "^5.0.1",
+        "aria-query": "5.3.0",
         "chalk": "^4.1.0",
         "dom-accessibility-api": "^0.5.9",
-        "lz-string": "^1.4.4",
+        "lz-string": "^1.5.0",
         "pretty-format": "^27.0.2"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       }
     },
     "node_modules/@testing-library/dom/node_modules/ansi-styles": {
@@ -11733,6 +11737,16 @@
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
+    "node_modules/@testing-library/dom/node_modules/aria-query": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
+      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "dequal": "^2.0.3"
+      }
+    },
     "node_modules/@testing-library/dom/node_modules/chalk": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
@@ -11833,69 +11847,33 @@
       }
     },
     "node_modules/@testing-library/react": {
-      "version": "12.1.5",
-      "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-12.1.5.tgz",
-      "integrity": "sha512-OfTXCJUFgjd/digLUuPxa0+/3ZxsQmE7ub9kcbW/wi96Bh3o/p5vrETcBGfP17NWPGqeYYl5LTRpwyGoMC4ysg==",
+      "version": "16.3.0",
+      "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.0.tgz",
+      "integrity": "sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.12.5",
-        "@testing-library/dom": "^8.0.0",
-        "@types/react-dom": "<18.0.0"
+        "@babel/runtime": "^7.12.5"
       },
       "engines": {
-        "node": ">=12"
+        "node": ">=18"
       },
       "peerDependencies": {
-        "react": "<18.0.0",
-        "react-dom": "<18.0.0"
-      }
-    },
-    "node_modules/@testing-library/react-hooks": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@testing-library/react-hooks/-/react-hooks-8.0.1.tgz",
-      "integrity": "sha512-Aqhl2IVmLt8IovEVarNDFuJDVWVvhnr9/GCU6UUnrYXwgDFF9h2L2o2P9KBni1AST5sT6riAyoukFLyjQUgD/g==",
-      "dev": true,
-      "dependencies": {
-        "@babel/runtime": "^7.12.5",
-        "react-error-boundary": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "peerDependencies": {
-        "@types/react": "^16.9.0 || ^17.0.0",
-        "react": "^16.9.0 || ^17.0.0",
-        "react-dom": "^16.9.0 || ^17.0.0",
-        "react-test-renderer": "^16.9.0 || ^17.0.0"
+        "@testing-library/dom": "^10.0.0",
+        "@types/react": "^18.0.0 || ^19.0.0",
+        "@types/react-dom": "^18.0.0 || ^19.0.0",
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0"
       },
       "peerDependenciesMeta": {
         "@types/react": {
           "optional": true
         },
-        "react-dom": {
-          "optional": true
-        },
-        "react-test-renderer": {
+        "@types/react-dom": {
           "optional": true
         }
       }
     },
-    "node_modules/@testing-library/react-hooks/node_modules/react-error-boundary": {
-      "version": "3.1.4",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz",
-      "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==",
-      "dev": true,
-      "dependencies": {
-        "@babel/runtime": "^7.12.5"
-      },
-      "engines": {
-        "node": ">=10",
-        "npm": ">=6"
-      },
-      "peerDependencies": {
-        "react": ">=16.13.1"
-      }
-    },
     "node_modules/@testing-library/user-event": {
       "version": "14.5.2",
       "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.5.2.tgz",
@@ -11918,10 +11896,11 @@
       }
     },
     "node_modules/@transloadit/prettier-bytes": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.0.7.tgz",
-      "integrity": "sha512-VeJbUb0wEKbcwaSlj5n+LscBl9IPgLPkHVGBkh00cztv6X4L/TJXK58LzFuBKX7/GAfiGhIwH67YTLTlzvIzBA==",
-      "dev": true
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.3.5.tgz",
+      "integrity": "sha512-xF4A3d/ZyX2LJWeQZREZQw+qFX4TGQ8bGVP97OLRt6sPO6T0TNHBFTuRHOJh7RNmYOBmQ9MHxpolD9bXihpuVA==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@trysound/sax": {
       "version": "0.2.0",
@@ -11951,10 +11930,11 @@
       }
     },
     "node_modules/@types/aria-query": {
-      "version": "4.2.2",
-      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-4.2.2.tgz",
-      "integrity": "sha512-HnYpAE1Y6kRyKM/XkEuiRQhTHvkzMBurTHnpFLYLBGPIylZNPs9jJcuOOYWxPLJCSEtmZT0Y8rHDokKN7rRTig==",
-      "dev": true
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
+      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@types/aws-lambda": {
       "version": "8.10.119",
@@ -11976,9 +11956,9 @@
       }
     },
     "node_modules/@types/babel__generator": {
-      "version": "7.6.8",
-      "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.6.8.tgz",
-      "integrity": "sha512-ASsj+tpEDsEiFr1arWrlN6V3mdfjRMZt6LtK/Vp/kreFLnr5QH5+DhvD5nINYZXzwJvXeGq+05iUXcAzVrqWtw==",
+      "version": "7.27.0",
+      "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.27.0.tgz",
+      "integrity": "sha512-ufFd2Xi92OAVPYsy+P4n7/U7e68fex0+Ee8gSG9KX7eo084CWiQ4sdxktvdl0bOPupXtVJPY19zk6EwWqUQ8lg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11997,9 +11977,9 @@
       }
     },
     "node_modules/@types/babel__traverse": {
-      "version": "7.20.6",
-      "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.20.6.tgz",
-      "integrity": "sha512-r1bzfrm0tomOI8g1SzvCaQHo6Lcv6zu0EA+W2kHrt8dyrHQxGzBBL4kdkzIS+jBMV+EYcMAEAqXqYaLJq5rOZg==",
+      "version": "7.20.7",
+      "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.20.7.tgz",
+      "integrity": "sha512-dkO5fhS7+/oos4ciWxyEyjWe48zmG6wbCheo/G2ZnHx4fs3EU6YC6UM8rk56gAjNJ9P3MTH2jo5jb92/K6wbng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12020,6 +12000,7 @@
       "resolved": "https://registry.npmjs.org/@types/bonjour/-/bonjour-3.5.13.tgz",
       "integrity": "sha512-z9fJ5Im06zvUL548KvYNecEVlA7cVDkGUi6kZusb04mpyEFKCIZJvloCcmpmLaIahDpOQGHaHmG6imtPMmPXGQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/node": "*"
       }
@@ -12088,6 +12069,7 @@
       "resolved": "https://registry.npmjs.org/@types/connect-history-api-fallback/-/connect-history-api-fallback-1.5.4.tgz",
       "integrity": "sha512-n6Cr2xS1h4uAulPRdlw6Jl6s1oG8KrVilPN2yUITEs+K48EzMJJ3W1xy8K5eWuFvjp3R74AOIGSmp2UfBJ8HFw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/express-serve-static-core": "*",
         "@types/node": "*"
@@ -12106,7 +12088,8 @@
     "node_modules/@types/cookie": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
-      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA=="
+      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
+      "license": "MIT"
     },
     "node_modules/@types/cookiejar": {
       "version": "2.1.2",
@@ -12185,9 +12168,9 @@
       }
     },
     "node_modules/@types/estree": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz",
-      "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.7.tgz",
+      "integrity": "sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==",
       "dev": true,
       "license": "MIT"
     },
@@ -12219,14 +12202,12 @@
         "@types/send": "*"
       }
     },
-    "node_modules/@types/glob": {
-      "version": "8.1.0",
-      "resolved": "https://registry.npmjs.org/@types/glob/-/glob-8.1.0.tgz",
-      "integrity": "sha512-IO+MJPVhoqz+28h1qLAcBEH2+xHMK6MTyHJc7MTnnYb6wsoLR29POVGJ7LycmVXIqyy/4/2ShP5sUwTXuOwb/w==",
-      "dependencies": {
-        "@types/minimatch": "^5.1.2",
-        "@types/node": "*"
-      }
+    "node_modules/@types/glob-to-regexp": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@types/glob-to-regexp/-/glob-to-regexp-0.4.4.tgz",
+      "integrity": "sha512-nDKoaKJYbnn1MZxUY0cA1bPmmgZbg0cTq7Rh13d0KWYNOiKbqoR+2d89SnRPszGh7ROzSwZ/GOjZ4jPbmmZ6Eg==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@types/hapi__catbox": {
       "version": "10.2.4",
@@ -12265,9 +12246,10 @@
       }
     },
     "node_modules/@types/hoist-non-react-statics": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
-      "integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.6.tgz",
+      "integrity": "sha512-lPByRJUer/iN/xa4qpyL0qmL11DqNW81iU/IG1S3uvRUq4oKagz8VCxZjiWkumgt66YT3vOdDgZ0o32sGKtCEw==",
+      "license": "MIT",
       "dependencies": {
         "@types/react": "*",
         "hoist-non-react-statics": "^3.3.0"
@@ -12387,11 +12369,6 @@
         "@types/node": "*"
       }
     },
-    "node_modules/@types/linkify-it": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
-      "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q=="
-    },
     "node_modules/@types/lodash": {
       "version": "4.14.178",
       "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.178.tgz",
@@ -12403,20 +12380,6 @@
       "resolved": "https://registry.npmjs.org/@types/long/-/long-4.0.1.tgz",
       "integrity": "sha512-5tXH6Bx/kNGd3MgffdmP4dy2Z+G4eaXw0SE81Tq3BNadtnMR5/ySMzX4SLEzHJzSmPNn4HIdpQsBvXMUykr58w=="
     },
-    "node_modules/@types/markdown-it": {
-      "version": "14.1.1",
-      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.1.tgz",
-      "integrity": "sha512-4NpsnpYl2Gt1ljyBGrKMxFYAYvpqbnnkgP/i/g+NLpjEUa3obn1XJCur9YbEXKDAkaXqsR1LbDnGEJ0MmKFxfg==",
-      "dependencies": {
-        "@types/linkify-it": "^5",
-        "@types/mdurl": "^2"
-      }
-    },
-    "node_modules/@types/mdurl": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
-      "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg=="
-    },
     "node_modules/@types/mdx": {
       "version": "2.0.13",
       "resolved": "https://registry.npmjs.org/@types/mdx/-/mdx-2.0.13.tgz",
@@ -12442,11 +12405,6 @@
       "resolved": "https://registry.npmjs.org/@types/mime-db/-/mime-db-1.43.1.tgz",
       "integrity": "sha512-kGZJY+R+WnR5Rk+RPHUMERtb2qBRViIHCBdtUrY+NmwuGb8pQdfTqQiCKPrxpdoycl8KWm2DLdkpoSdt479XoQ=="
     },
-    "node_modules/@types/minimatch": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz",
-      "integrity": "sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA=="
-    },
     "node_modules/@types/mocha": {
       "version": "10.0.6",
       "resolved": "https://registry.npmjs.org/@types/mocha/-/mocha-10.0.6.tgz",
@@ -12558,9 +12516,10 @@
       }
     },
     "node_modules/@types/prop-types": {
-      "version": "15.7.4",
-      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz",
-      "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ=="
+      "version": "15.7.14",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz",
+      "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==",
+      "license": "MIT"
     },
     "node_modules/@types/qs": {
       "version": "6.9.7",
@@ -12573,75 +12532,63 @@
       "integrity": "sha512-EEhsLsD6UsDM1yFhAvy0Cjr6VwmpMWqFBCb9w07wVugF7w9nfajxLuVmngTIpgS6svCnm6Vaw+MZhoDCKnOfsw=="
     },
     "node_modules/@types/react": {
-      "version": "17.0.40",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.40.tgz",
-      "integrity": "sha512-UrXhD/JyLH+W70nNSufXqMZNuUD2cXHu6UjCllC6pmOQgBX4SGXOH8fjRka0O0Ee0HrFxapDD8Bwn81Kmiz6jQ==",
+      "version": "18.3.20",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.20.tgz",
+      "integrity": "sha512-IPaCZN7PShZK/3t6Q87pfTkRm6oLTd4vztyoj+cbHUF1g3FfVb2tFIL79uCRKEfv16AhqDMBywP2VW3KIZUvcg==",
+      "license": "MIT",
       "dependencies": {
         "@types/prop-types": "*",
-        "@types/scheduler": "*",
         "csstype": "^3.0.2"
       }
     },
-    "node_modules/@types/react-bootstrap": {
-      "version": "0.32.36",
-      "resolved": "https://registry.npmjs.org/@types/react-bootstrap/-/react-bootstrap-0.32.36.tgz",
-      "integrity": "sha512-xldfs2zixagAFEafy/XzRvZH1NtjRnLfbgL0cZ2a0Eykz+iILE/Xa46tnUFcLln6ZBq1Qp9uArhIbkkuhBU30g==",
-      "dev": true,
-      "dependencies": {
-        "@types/react": "*"
-      }
-    },
     "node_modules/@types/react-color": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-3.0.6.tgz",
-      "integrity": "sha512-OzPIO5AyRmLA7PlOyISlgabpYUa3En74LP8mTMa0veCA719SvYQov4WLMsHvCgXP+L+KI9yGhYnqZafVGG0P4w==",
+      "version": "3.0.13",
+      "resolved": "https://registry.npmjs.org/@types/react-color/-/react-color-3.0.13.tgz",
+      "integrity": "sha512-2c/9FZ4ixC5T3JzN0LP5Cke2Mf0MKOP2Eh0NPDPWmuVH3NjPyhEjqNMQpN1Phr5m74egAy+p2lYNAFrX1z9Yrg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@types/react": "*",
         "@types/reactcss": "*"
+      },
+      "peerDependencies": {
+        "@types/react": "*"
       }
     },
     "node_modules/@types/react-dom": {
-      "version": "17.0.13",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.13.tgz",
-      "integrity": "sha512-wEP+B8hzvy6ORDv1QBhcQia4j6ea4SFIBttHYpXKPFZRviBvknq0FRh3VrIxeXUmsPkwuXVZrVGG7KUVONmXCQ==",
+      "version": "18.3.6",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.6.tgz",
+      "integrity": "sha512-nf22//wEbKXusP6E9pfOCDwFdHAX4u172eaJI4YkDRQEZiorm6KfYnSC2SWLDMVWUOWPERmJnN0ujeAfTBLvrw==",
       "dev": true,
-      "dependencies": {
-        "@types/react": "*"
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "^18.0.0"
       }
     },
     "node_modules/@types/react-google-recaptcha": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmjs.org/@types/react-google-recaptcha/-/react-google-recaptcha-2.1.5.tgz",
-      "integrity": "sha512-iWTjmVttlNgp0teyh7eBXqNOQzVq2RWNiFROWjraOptRnb1OcHJehQnji0sjqIRAk9K0z8stjyhU+OLpPb0N6w==",
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/@types/react-google-recaptcha/-/react-google-recaptcha-2.1.9.tgz",
+      "integrity": "sha512-nT31LrBDuoSZJN4QuwtQSF3O89FVHC4jLhM+NtKEmVF5R1e8OY0Jo4//x2Yapn2aNHguwgX5doAq8Zo+Ehd0ug==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/react": "*"
       }
     },
     "node_modules/@types/react-linkify": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@types/react-linkify/-/react-linkify-1.0.0.tgz",
-      "integrity": "sha512-2NKXPQGaHNfh/dCqkVC55k1tAhQyNoNZa31J50nIneMVwHqUI00FAP+Lyp8e0BarPf84kn4GRVAhtWX9XJBzSQ==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/@types/react-linkify/-/react-linkify-1.0.4.tgz",
+      "integrity": "sha512-NOMw4X3kjvjY0lT5kXQdxZCXpPNi2hOuuqG+Kz+5EOQpi9rDUJJDitdE1j2JRNmrTnNIjrLnYG0HKyuOWN/uKA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/react": "*"
       }
     },
-    "node_modules/@types/react-overlays": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/@types/react-overlays/-/react-overlays-1.1.3.tgz",
-      "integrity": "sha512-oOq5NWbyfNz2w2sKvjkHdvGQSMA+VDVfI5UOfGPR0wkik2welad1RDVnVgH15jKf58jrZNBa1Ee4SVBgCGFxCg==",
-      "dev": true,
-      "dependencies": {
-        "@types/react": "*",
-        "@types/react-transition-group": "*"
-      }
-    },
     "node_modules/@types/react-redux": {
-      "version": "7.1.33",
-      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.33.tgz",
-      "integrity": "sha512-NF8m5AjWCkert+fosDsN3hAlHzpjSiXlVy9EgQEmLoBhaNXbmyeGs/aj5dQzKuF+/q+S7JQagorGDW8pJ28Hmg==",
+      "version": "7.1.34",
+      "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.34.tgz",
+      "integrity": "sha512-GdFaVjEbYv4Fthm2ZLvj1VSCedV7TqE5y1kNwnjSdBOTXuRSgowux6J8TAct15T3CKBr63UMk+2CO7ilRhyrAQ==",
+      "license": "MIT",
       "dependencies": {
         "@types/hoist-non-react-statics": "^3.3.0",
         "@types/react": "*",
@@ -12650,20 +12597,22 @@
       }
     },
     "node_modules/@types/react-transition-group": {
-      "version": "4.4.10",
-      "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.10.tgz",
-      "integrity": "sha512-hT/+s0VQs2ojCX823m60m5f0sL5idt9SO6Tj6Dg+rdphGPIeJbJ6CxvBYkgkGKrYeDjvIpKTR38UzmtHJOGW3Q==",
+      "version": "4.4.12",
+      "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.12.tgz",
+      "integrity": "sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==",
       "dev": true,
-      "dependencies": {
+      "license": "MIT",
+      "peerDependencies": {
         "@types/react": "*"
       }
     },
     "node_modules/@types/reactcss": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.6.tgz",
-      "integrity": "sha512-qaIzpCuXNWomGR1Xq8SCFTtF4v8V27Y6f+b9+bzHiv087MylI/nTCqqdChNeWS7tslgROmYB7yeiruWX7WnqNg==",
+      "version": "1.2.13",
+      "resolved": "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.13.tgz",
+      "integrity": "sha512-gi3S+aUi6kpkF5vdhUsnkwbiSEIU/BEJyD7kBy2SudWBUuKmJk8AQKE0OVcQQeEy40Azh0lV6uynxlikYIJuwg==",
       "dev": true,
-      "dependencies": {
+      "license": "MIT",
+      "peerDependencies": {
         "@types/react": "*"
       }
     },
@@ -12710,20 +12659,6 @@
       "integrity": "sha512-XISRgDJ2Tc5q4TRqvgJtzsRkFYNJzZrhTdtMoGVBttwzzQJkPnS3WWTFc7kuDRoPtPakl+T+OfdEUjYJj7Jbow==",
       "dev": true
     },
-    "node_modules/@types/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-F3OznnSLAUxFrCEu/L5PY8+ny8DtcFRjx7fZZ9bycvXRi3KPTRS9HOitGZwvPg0juRhXFWIeKX58cnX5YqLohQ==",
-      "dependencies": {
-        "@types/glob": "*",
-        "@types/node": "*"
-      }
-    },
-    "node_modules/@types/scheduler": {
-      "version": "0.16.2",
-      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz",
-      "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew=="
-    },
     "node_modules/@types/semver": {
       "version": "7.5.0",
       "resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.5.0.tgz",
@@ -12743,6 +12678,7 @@
       "resolved": "https://registry.npmjs.org/@types/serve-index/-/serve-index-1.9.4.tgz",
       "integrity": "sha512-qLpGZ/c2fhSs5gnYsQxtDEq3Oy8SXPClIXkW5ghvAvsNuVSA8k+gCONcUCS/UjLEYvYps+e8uBtfgXgvhwfNug==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/express": "*"
       }
@@ -12813,6 +12749,7 @@
       "resolved": "https://registry.npmjs.org/@types/sockjs/-/sockjs-0.3.36.tgz",
       "integrity": "sha512-MK9V6NzAS1+Ud7JV9lJLFqW85VbC9dq3LmwZCuBe4wBDgKC0Kj/jd8Xl+nSviU+Qc3+m7umHHyHg//2KSa0a0Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/node": "*"
       }
@@ -12862,7 +12799,8 @@
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.3.tgz",
       "integrity": "sha512-D1XC7WK8K+zZEveUPY+cf4+kgauk8N4eHr/XIHXGlGYkHLud6hK9lYfZk1ry1TNh798cZUCgb6MqGEG8DkJt6Q==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/@types/webidl-conversions": {
       "version": "7.0.3",
@@ -12877,20 +12815,12 @@
         "@types/webidl-conversions": "*"
       }
     },
-    "node_modules/@types/workerpool": {
-      "version": "6.4.7",
-      "resolved": "https://registry.npmjs.org/@types/workerpool/-/workerpool-6.4.7.tgz",
-      "integrity": "sha512-DI2U4obcMzFViyNjLw0xXspim++qkAJ4BWRdYPVMMFtOpTvMr6PAk3UTZEoSqnZnvgUkJ3ck97Ybk+iIfuJHMg==",
-      "dev": true,
-      "dependencies": {
-        "@types/node": "*"
-      }
-    },
     "node_modules/@types/ws": {
-      "version": "8.5.12",
-      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.12.tgz",
-      "integrity": "sha512-3tPRkv1EtkDpzlgyKyI8pGsGZAGPEaXeu0DOj5DI25Ja91bdAYddYHbADRYVrZMRbfW+1l5YwXVDKohDJNQxkQ==",
+      "version": "8.18.1",
+      "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.18.1.tgz",
+      "integrity": "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/node": "*"
       }
@@ -12954,20 +12884,21 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.0.1.tgz",
-      "integrity": "sha512-5g3Y7GDFsJAnY4Yhvk8sZtFfV6YNF2caLzjrRPUBzewjPCaj0yokePB4LJSobyCzGMzjZZYFbwuzbfDHlimXbQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.35.1.tgz",
+      "integrity": "sha512-9XNTlo7P7RJxbVeICaIIIEipqxLKguyh+3UbXuT2XQuFp6d8VOeDEGuz5IiX0dgZo8CiI6aOFLg4e8cF71SFVg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.10.0",
-        "@typescript-eslint/scope-manager": "8.0.1",
-        "@typescript-eslint/type-utils": "8.0.1",
-        "@typescript-eslint/utils": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1",
+        "@typescript-eslint/scope-manager": "8.35.1",
+        "@typescript-eslint/type-utils": "8.35.1",
+        "@typescript-eslint/utils": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1",
         "graphemer": "^1.4.0",
-        "ignore": "^5.3.1",
+        "ignore": "^7.0.0",
         "natural-compare": "^1.4.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -12977,23 +12908,20 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "@typescript-eslint/parser": "^8.0.0 || ^8.0.0-alpha.0",
-        "eslint": "^8.57.0 || ^9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+        "@typescript-eslint/parser": "^8.35.1",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.0.1.tgz",
-      "integrity": "sha512-NpixInP5dm7uukMiRyiHjRKkom5RIFA4dfiHvalanD2cF0CLUuQqxfg8PtEUo9yqJI2bBhF+pcSafqnG3UBnRQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.35.1.tgz",
+      "integrity": "sha512-s/Bpd4i7ht2934nG+UoSPlYXd08KYz3bmjLEb7Ye1UVob0d1ENiT3lY8bsCmik4RqfSbPw9xJJHbugpPpP5JUg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1"
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13004,10 +12932,11 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.0.1.tgz",
-      "integrity": "sha512-PpqTVT3yCA/bIgJ12czBuE3iBlM3g4inRSC5J0QOdQFAn07TYrYEQBBKgXH1lQpglup+Zy6c1fxuwTk4MTNKIw==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
@@ -13017,13 +12946,14 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.0.1.tgz",
-      "integrity": "sha512-W5E+o0UfUcK5EgchLZsyVWqARmsM7v54/qEq6PY3YI5arkgmCzHiuk0zKSJJbm71V0xdRna4BGomkCTXz2/LkQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.35.1.tgz",
+      "integrity": "sha512-VRwixir4zBWCSTP/ljEo091lbpypz57PoeAQ9imjG+vbeof9LplljsL1mos4ccG6H9IjfrVGM359RozUnuFhpw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "eslint-visitor-keys": "^3.4.3"
+        "@typescript-eslint/types": "8.35.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13034,27 +12964,52 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@typescript-eslint/parser": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.0.1.tgz",
-      "integrity": "sha512-5IgYJ9EO/12pOUwiBKFkpU7rS3IU21mtXzB81TNwq2xEybcmAZrE9qwDtsb5uQd9aVO9o0fdabFyAmKveXyujg==",
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
       "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
+      }
+    },
+    "node_modules/@typescript-eslint/parser": {
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.35.1.tgz",
+      "integrity": "sha512-3MyiDfrfLeK06bi/g9DqJxP5pV74LNv4rFTyvGDmT3x2p1yp1lOd+qYZfiRPIOf/oON+WRZR5wxxuF85qOar+w==",
+      "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.0.1",
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/typescript-estree": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1",
+        "@typescript-eslint/scope-manager": "8.35.1",
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/typescript-estree": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -13065,22 +13020,19 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "eslint": "^8.57.0 || ^9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.0.1.tgz",
-      "integrity": "sha512-NpixInP5dm7uukMiRyiHjRKkom5RIFA4dfiHvalanD2cF0CLUuQqxfg8PtEUo9yqJI2bBhF+pcSafqnG3UBnRQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.35.1.tgz",
+      "integrity": "sha512-s/Bpd4i7ht2934nG+UoSPlYXd08KYz3bmjLEb7Ye1UVob0d1ENiT3lY8bsCmik4RqfSbPw9xJJHbugpPpP5JUg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1"
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13091,10 +13043,11 @@
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/types": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.0.1.tgz",
-      "integrity": "sha512-PpqTVT3yCA/bIgJ12czBuE3iBlM3g4inRSC5J0QOdQFAn07TYrYEQBBKgXH1lQpglup+Zy6c1fxuwTk4MTNKIw==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
@@ -13104,19 +13057,22 @@
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.0.1.tgz",
-      "integrity": "sha512-8V9hriRvZQXPWU3bbiUV4Epo7EvgM6RTs+sUmxp5G//dBGy402S7Fx0W0QkB2fb4obCF8SInoUzvTYtc3bkb5w==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.35.1.tgz",
+      "integrity": "sha512-Vvpuvj4tBxIka7cPs6Y1uvM7gJgdF5Uu9F+mBJBPY4MhvjrjWGK4H0lVgLJd/8PWZ23FTqsaJaLEkBCFUk8Y9g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1",
+        "@typescript-eslint/project-service": "8.35.1",
+        "@typescript-eslint/tsconfig-utils": "8.35.1",
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1",
         "debug": "^4.3.4",
-        "globby": "^11.1.0",
+        "fast-glob": "^3.3.2",
         "is-glob": "^4.0.3",
         "minimatch": "^9.0.4",
         "semver": "^7.6.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13125,20 +13081,19 @@
         "type": "opencollective",
         "url": "https://opencollective.com/typescript-eslint"
       },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.0.1.tgz",
-      "integrity": "sha512-W5E+o0UfUcK5EgchLZsyVWqARmsM7v54/qEq6PY3YI5arkgmCzHiuk0zKSJJbm71V0xdRna4BGomkCTXz2/LkQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.35.1.tgz",
+      "integrity": "sha512-VRwixir4zBWCSTP/ljEo091lbpypz57PoeAQ9imjG+vbeof9LplljsL1mos4ccG6H9IjfrVGM359RozUnuFhpw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "eslint-visitor-keys": "^3.4.3"
+        "@typescript-eslint/types": "8.35.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13148,31 +13103,24 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@typescript-eslint/parser/node_modules/array-union": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/@typescript-eslint/parser/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "balanced-match": "^1.0.0"
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/debug": {
-      "version": "4.3.4",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
-      "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "ms": "2.1.2"
+        "ms": "^2.1.3"
       },
       "engines": {
         "node": ">=6.0"
@@ -13184,42 +13132,24 @@
       }
     },
     "node_modules/@typescript-eslint/parser/node_modules/eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@typescript-eslint/parser/node_modules/globby": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
-      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
-      "dev": true,
-      "dependencies": {
-        "array-union": "^2.1.0",
-        "dir-glob": "^3.0.1",
-        "fast-glob": "^3.2.9",
-        "ignore": "^5.2.0",
-        "merge2": "^1.4.1",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/@typescript-eslint/parser/node_modules/minimatch": {
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
       "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
+      "license": "ISC",
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -13230,17 +13160,12 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@typescript-eslint/parser/node_modules/ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/parser/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -13248,13 +13173,71 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/parser/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+    "node_modules/@typescript-eslint/parser/node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.35.1.tgz",
+      "integrity": "sha512-VYxn/5LOpVxADAuP3NrnxxHYfzVtQzLKeldIhDhzC8UHaiQvYlXvKuVho1qLduFbJjjy5U5bkGwa3rUGUb1Q6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.35.1",
+        "@typescript-eslint/types": "^8.35.1",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service/node_modules/@typescript-eslint/types": {
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service/node_modules/debug": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
@@ -13274,16 +13257,34 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.0.1.tgz",
-      "integrity": "sha512-+/UT25MWvXeDX9YaHv1IS6KI1fiuTto43WprE7pgSMswHbn1Jm9GEM4Txp+X74ifOWV8emu2AWcbLhpJAvD5Ng==",
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.35.1.tgz",
+      "integrity": "sha512-K5/U9VmT9dTHoNowWZpz+/TObS3xqC5h0xAIjXPw+MNcKV9qg6eSatEnmeAwkjHijhACH0/N7bkhKvbt1+DXWQ==",
       "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.35.1.tgz",
+      "integrity": "sha512-HOrUBlfVRz5W2LIKpXzZoy6VTZzMu2n8q9C2V/cFngIC5U1nStJgv0tMV4sZPzdf4wQm9/ToWUFPMN9Vq9VJQQ==",
+      "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/typescript-estree": "8.0.1",
-        "@typescript-eslint/utils": "8.0.1",
+        "@typescript-eslint/typescript-estree": "8.35.1",
+        "@typescript-eslint/utils": "8.35.1",
         "debug": "^4.3.4",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13292,17 +13293,17 @@
         "type": "opencollective",
         "url": "https://opencollective.com/typescript-eslint"
       },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.0.1.tgz",
-      "integrity": "sha512-PpqTVT3yCA/bIgJ12czBuE3iBlM3g4inRSC5J0QOdQFAn07TYrYEQBBKgXH1lQpglup+Zy6c1fxuwTk4MTNKIw==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
@@ -13312,19 +13313,22 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.0.1.tgz",
-      "integrity": "sha512-8V9hriRvZQXPWU3bbiUV4Epo7EvgM6RTs+sUmxp5G//dBGy402S7Fx0W0QkB2fb4obCF8SInoUzvTYtc3bkb5w==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.35.1.tgz",
+      "integrity": "sha512-Vvpuvj4tBxIka7cPs6Y1uvM7gJgdF5Uu9F+mBJBPY4MhvjrjWGK4H0lVgLJd/8PWZ23FTqsaJaLEkBCFUk8Y9g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1",
+        "@typescript-eslint/project-service": "8.35.1",
+        "@typescript-eslint/tsconfig-utils": "8.35.1",
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1",
         "debug": "^4.3.4",
-        "globby": "^11.1.0",
+        "fast-glob": "^3.3.2",
         "is-glob": "^4.0.3",
         "minimatch": "^9.0.4",
         "semver": "^7.6.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13333,20 +13337,19 @@
         "type": "opencollective",
         "url": "https://opencollective.com/typescript-eslint"
       },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.0.1.tgz",
-      "integrity": "sha512-W5E+o0UfUcK5EgchLZsyVWqARmsM7v54/qEq6PY3YI5arkgmCzHiuk0zKSJJbm71V0xdRna4BGomkCTXz2/LkQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.35.1.tgz",
+      "integrity": "sha512-VRwixir4zBWCSTP/ljEo091lbpypz57PoeAQ9imjG+vbeof9LplljsL1mos4ccG6H9IjfrVGM359RozUnuFhpw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "eslint-visitor-keys": "^3.4.3"
+        "@typescript-eslint/types": "8.35.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13356,31 +13359,24 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@typescript-eslint/type-utils/node_modules/array-union": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/@typescript-eslint/type-utils/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "balanced-match": "^1.0.0"
       }
     },
     "node_modules/@typescript-eslint/type-utils/node_modules/debug": {
-      "version": "4.3.6",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.6.tgz",
-      "integrity": "sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==",
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "ms": "2.1.2"
+        "ms": "^2.1.3"
       },
       "engines": {
         "node": ">=6.0"
@@ -13392,42 +13388,24 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils/node_modules/eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@typescript-eslint/type-utils/node_modules/globby": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
-      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
-      "dev": true,
-      "dependencies": {
-        "array-union": "^2.1.0",
-        "dir-glob": "^3.0.1",
-        "fast-glob": "^3.2.9",
-        "ignore": "^5.2.0",
-        "merge2": "^1.4.1",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/@typescript-eslint/type-utils/node_modules/minimatch": {
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
       "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
+      "license": "ISC",
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -13438,17 +13416,12 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@typescript-eslint/type-utils/node_modules/ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/type-utils/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -13456,13 +13429,17 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/type-utils/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+    "node_modules/@typescript-eslint/type-utils/node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
       }
     },
     "node_modules/@typescript-eslint/types": {
@@ -13604,15 +13581,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.0.1.tgz",
-      "integrity": "sha512-CBFR0G0sCt0+fzfnKaciu9IBsKvEKYwN9UZ+eeogK1fYHg4Qxk1yf/wLQkLXlq8wbU2dFlgAesxt8Gi76E8RTA==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.35.1.tgz",
+      "integrity": "sha512-lhnwatFmOFcazAsUm3ZnZFpXSxiwoa1Lj50HphnDe1Et01NF4+hrdXONSUHIcbVu2eFb1bAf+5yjXkGVkXBKAQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@eslint-community/eslint-utils": "^4.4.0",
-        "@typescript-eslint/scope-manager": "8.0.1",
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/typescript-estree": "8.0.1"
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.35.1",
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/typescript-estree": "8.35.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13622,17 +13600,19 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "eslint": "^8.57.0 || ^9.0.0"
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.0.1.tgz",
-      "integrity": "sha512-NpixInP5dm7uukMiRyiHjRKkom5RIFA4dfiHvalanD2cF0CLUuQqxfg8PtEUo9yqJI2bBhF+pcSafqnG3UBnRQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.35.1.tgz",
+      "integrity": "sha512-s/Bpd4i7ht2934nG+UoSPlYXd08KYz3bmjLEb7Ye1UVob0d1ENiT3lY8bsCmik4RqfSbPw9xJJHbugpPpP5JUg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1"
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13643,10 +13623,11 @@
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/types": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.0.1.tgz",
-      "integrity": "sha512-PpqTVT3yCA/bIgJ12czBuE3iBlM3g4inRSC5J0QOdQFAn07TYrYEQBBKgXH1lQpglup+Zy6c1fxuwTk4MTNKIw==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
@@ -13656,19 +13637,22 @@
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.0.1.tgz",
-      "integrity": "sha512-8V9hriRvZQXPWU3bbiUV4Epo7EvgM6RTs+sUmxp5G//dBGy402S7Fx0W0QkB2fb4obCF8SInoUzvTYtc3bkb5w==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.35.1.tgz",
+      "integrity": "sha512-Vvpuvj4tBxIka7cPs6Y1uvM7gJgdF5Uu9F+mBJBPY4MhvjrjWGK4H0lVgLJd/8PWZ23FTqsaJaLEkBCFUk8Y9g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "@typescript-eslint/visitor-keys": "8.0.1",
+        "@typescript-eslint/project-service": "8.35.1",
+        "@typescript-eslint/tsconfig-utils": "8.35.1",
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1",
         "debug": "^4.3.4",
-        "globby": "^11.1.0",
+        "fast-glob": "^3.3.2",
         "is-glob": "^4.0.3",
         "minimatch": "^9.0.4",
         "semver": "^7.6.0",
-        "ts-api-utils": "^1.3.0"
+        "ts-api-utils": "^2.1.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13677,20 +13661,19 @@
         "type": "opencollective",
         "url": "https://opencollective.com/typescript-eslint"
       },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.0.1.tgz",
-      "integrity": "sha512-W5E+o0UfUcK5EgchLZsyVWqARmsM7v54/qEq6PY3YI5arkgmCzHiuk0zKSJJbm71V0xdRna4BGomkCTXz2/LkQ==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.35.1.tgz",
+      "integrity": "sha512-VRwixir4zBWCSTP/ljEo091lbpypz57PoeAQ9imjG+vbeof9LplljsL1mos4ccG6H9IjfrVGM359RozUnuFhpw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.0.1",
-        "eslint-visitor-keys": "^3.4.3"
+        "@typescript-eslint/types": "8.35.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13700,31 +13683,24 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/array-union": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
-      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/@typescript-eslint/utils/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "balanced-match": "^1.0.0"
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/debug": {
-      "version": "4.3.6",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.6.tgz",
-      "integrity": "sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==",
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "ms": "2.1.2"
+        "ms": "^2.1.3"
       },
       "engines": {
         "node": ">=6.0"
@@ -13736,42 +13712,24 @@
       }
     },
     "node_modules/@typescript-eslint/utils/node_modules/eslint-visitor-keys": {
-      "version": "3.4.3",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
-      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       },
       "funding": {
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/globby": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
-      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
-      "dev": true,
-      "dependencies": {
-        "array-union": "^2.1.0",
-        "dir-glob": "^3.0.1",
-        "fast-glob": "^3.2.9",
-        "ignore": "^5.2.0",
-        "merge2": "^1.4.1",
-        "slash": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/@typescript-eslint/utils/node_modules/minimatch": {
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
       "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
+      "license": "ISC",
       "dependencies": {
         "brace-expansion": "^2.0.1"
       },
@@ -13782,17 +13740,12 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/ms": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
-      "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==",
-      "dev": true
-    },
     "node_modules/@typescript-eslint/utils/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -13800,13 +13753,17 @@
         "node": ">=10"
       }
     },
-    "node_modules/@typescript-eslint/utils/node_modules/slash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
-      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+    "node_modules/@typescript-eslint/utils/node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=8"
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
@@ -13843,6 +13800,154 @@
       "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
       "integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ=="
     },
+    "node_modules/@uppy/companion-client": {
+      "version": "3.8.2",
+      "resolved": "https://registry.npmjs.org/@uppy/companion-client/-/companion-client-3.8.2.tgz",
+      "integrity": "sha512-WLjZ0Y6Fe7lzwU1YPvvQ/YqooejcgIZkT2TC39xr+QQ7Y1FwJECsyUdlKwgi1ee8TNpjoCrj3Q1Hjel/+p0VhA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@uppy/utils": "^5.9.0",
+        "namespace-emitter": "^2.0.1",
+        "p-retry": "^6.1.0"
+      },
+      "peerDependencies": {
+        "@uppy/core": "^3.13.1"
+      }
+    },
+    "node_modules/@uppy/core": {
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/@uppy/core/-/core-3.13.1.tgz",
+      "integrity": "sha512-iQGAUO4ziQRpfv7kix6tO6JOWqjI0K4vt8AynvHWzDPZxYSba3zd6RojGNPsYWSR7Xv+dRXYx+GU8oTiK1FRUA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@transloadit/prettier-bytes": "^0.3.4",
+        "@uppy/store-default": "^3.2.2",
+        "@uppy/utils": "^5.9.0",
+        "lodash": "^4.17.21",
+        "mime-match": "^1.0.2",
+        "namespace-emitter": "^2.0.1",
+        "nanoid": "^4.0.0",
+        "preact": "^10.5.13"
+      }
+    },
+    "node_modules/@uppy/informer": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@uppy/informer/-/informer-3.1.0.tgz",
+      "integrity": "sha512-vmpTLqzSLmZSuIVDZV0o19yXVqyTh5/uCbKUEiyfBhR726kQiuYQLP/ZHaKcvW3c1ESQGbNg53iNHbFBqF681w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@uppy/utils": "^5.7.4",
+        "preact": "^10.5.13"
+      },
+      "peerDependencies": {
+        "@uppy/core": "^3.9.3"
+      }
+    },
+    "node_modules/@uppy/provider-views": {
+      "version": "3.13.0",
+      "resolved": "https://registry.npmjs.org/@uppy/provider-views/-/provider-views-3.13.0.tgz",
+      "integrity": "sha512-Z2oI88A+GC2zIPk8beoeFN/miHKkhtF58mYjvb5miGCMMZM7p7LRj98sgb5OOdKsGrfeiuTavtgL424BvcVd8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@uppy/utils": "^5.9.0",
+        "classnames": "^2.2.6",
+        "nanoid": "^4.0.0",
+        "p-queue": "^7.3.4",
+        "preact": "^10.5.13"
+      },
+      "peerDependencies": {
+        "@uppy/core": "^3.13.0"
+      }
+    },
+    "node_modules/@uppy/provider-views/node_modules/eventemitter3": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
+      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@uppy/provider-views/node_modules/p-queue": {
+      "version": "7.4.1",
+      "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-7.4.1.tgz",
+      "integrity": "sha512-vRpMXmIkYF2/1hLBKisKeVYJZ8S2tZ0zEAmIJgdVKP2nq0nh4qCdf8bgw+ZgKrkh71AOCaqzwbJJk1WtdcF3VA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eventemitter3": "^5.0.1",
+        "p-timeout": "^5.0.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@uppy/provider-views/node_modules/p-timeout": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-5.1.0.tgz",
+      "integrity": "sha512-auFDyzzzGZZZdHz3BtET9VEz0SE/uMEAx7uWfGPucfzEwwe/xH0iVeZibQmANYE/hp9T2+UUZT5m+BKyrDp3Ew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@uppy/status-bar": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/@uppy/status-bar/-/status-bar-3.3.3.tgz",
+      "integrity": "sha512-TCcnBjTDbq/AmnGOcWbCpQNsv05Z6Y36zdmTCt/xNe2/gTVAYAzGRoGOrkeb6jf/E4AAi25VyOolSqL2ibB8Kw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@transloadit/prettier-bytes": "^0.3.4",
+        "@uppy/utils": "^5.9.0",
+        "classnames": "^2.2.6",
+        "preact": "^10.5.13"
+      },
+      "peerDependencies": {
+        "@uppy/core": "^3.11.2"
+      }
+    },
+    "node_modules/@uppy/store-default": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@uppy/store-default/-/store-default-3.2.2.tgz",
+      "integrity": "sha512-OiSgT++Jj4nLK0N9WTeod3UNjCH81OXE5BcMJCd9oWzl2d0xPNq2T/E9Y6O72XVd+6Y7+tf5vZlPElutfMB3KQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@uppy/thumbnail-generator": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@uppy/thumbnail-generator/-/thumbnail-generator-3.1.0.tgz",
+      "integrity": "sha512-tDKK/cukC0CrM0F/OlHFmvpGGUq+Db4YfakhIGPKtT7ZO8aWOiIu5JIvaYUnKRxGq3RGsk4zhkxYXuoxVzzsGA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@uppy/utils": "^5.7.5",
+        "exifr": "^7.0.0"
+      },
+      "peerDependencies": {
+        "@uppy/core": "^3.10.0"
+      }
+    },
+    "node_modules/@uppy/utils": {
+      "version": "5.9.0",
+      "resolved": "https://registry.npmjs.org/@uppy/utils/-/utils-5.9.0.tgz",
+      "integrity": "sha512-9Ubddd3orCOLYjf0KobwgJ+aTrABSxk9t4X/QdM4qJHVZuMIftkaMplrViRUO+kvIBCXEZDIP2AmS060siDNGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "lodash": "^4.17.21",
+        "preact": "^10.5.13"
+      }
+    },
     "node_modules/@vitest/expect": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-2.0.5.tgz",
@@ -13965,6 +14070,103 @@
         "url": "https://opencollective.com/vitest"
       }
     },
+    "node_modules/@vitest/runner": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-3.1.2.tgz",
+      "integrity": "sha512-bhLib9l4xb4sUMPXnThbnhX2Yi8OutBMA8Yahxa7yavQsFDtwY/jrUZwpKp2XH9DhRFJIeytlyGpXCqZ65nR+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/utils": "3.1.2",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner/node_modules/@vitest/pretty-format": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.1.2.tgz",
+      "integrity": "sha512-R0xAiHuWeDjTSB3kQ3OQpT8Rx3yhdOAIm/JM4axXxnG7Q/fS8XUwggv/A4xzbQA+drYRjzkMnpYnOGAc4oeq8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner/node_modules/@vitest/utils": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-3.1.2.tgz",
+      "integrity": "sha512-5GGd0ytZ7BH3H6JTj9Kw7Prn1Nbg0wZVrIvou+UWxm54d+WoXXgAgjFJ8wn3LdagWLFSEfpPeyYrByZaGEZHLg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "3.1.2",
+        "loupe": "^3.1.3",
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner/node_modules/loupe": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.1.3.tgz",
+      "integrity": "sha512-kkIp7XSkP78ZxJEsSxW3712C6teJVoeHHwgo9zJ380de7IYyJ2ISlxojcH2pC5OFLewESmnRi/+XCDIEEVyoug==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@vitest/runner/node_modules/tinyrainbow": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-2.0.0.tgz",
+      "integrity": "sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@vitest/snapshot": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-3.1.2.tgz",
+      "integrity": "sha512-Q1qkpazSF/p4ApZg1vfZSQ5Yw6OCQxVMVrLjslbLFA1hMDrT2uxtqMaw8Tc/jy5DLka1sNs1Y7rBcftMiaSH/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "3.1.2",
+        "magic-string": "^0.30.17",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/snapshot/node_modules/@vitest/pretty-format": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.1.2.tgz",
+      "integrity": "sha512-R0xAiHuWeDjTSB3kQ3OQpT8Rx3yhdOAIm/JM4axXxnG7Q/fS8XUwggv/A4xzbQA+drYRjzkMnpYnOGAc4oeq8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/snapshot/node_modules/tinyrainbow": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-2.0.0.tgz",
+      "integrity": "sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/@vitest/spy": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-2.0.5.tgz",
@@ -14875,33 +15077,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/ansi-styles": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
-      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
-      "dev": true,
-      "dependencies": {
-        "color-convert": "^1.9.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/ansi-styles/node_modules/color-convert": {
-      "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
-      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
-      "dev": true,
-      "dependencies": {
-        "color-name": "1.1.3"
-      }
-    },
-    "node_modules/ansi-styles/node_modules/color-name": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
-      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
-      "dev": true
-    },
     "node_modules/anymatch": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
@@ -15072,13 +15247,13 @@
       }
     },
     "node_modules/array-buffer-byte-length": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
-      "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+      "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.5",
-        "is-array-buffer": "^3.0.4"
+        "call-bound": "^1.0.3",
+        "is-array-buffer": "^3.0.5"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15099,16 +15274,20 @@
       "dev": true
     },
     "node_modules/array-includes": {
-      "version": "3.1.6",
-      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.6.tgz",
-      "integrity": "sha512-sgTbLvL6cNnw24FnbaDyjmvddQ2ML8arZsgaJhoABMoplz/4QRhtrYS+alr1BUM1Bwp6dhx8vVCBSLG+StwOFw==",
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.9.tgz",
+      "integrity": "sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4",
-        "get-intrinsic": "^1.1.3",
-        "is-string": "^1.0.7"
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.0",
+        "es-object-atoms": "^1.1.1",
+        "get-intrinsic": "^1.3.0",
+        "is-string": "^1.1.1",
+        "math-intrinsics": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15145,15 +15324,60 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/array.prototype.flat": {
+    "node_modules/array.prototype.findlast": {
       "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.2.5.tgz",
-      "integrity": "sha512-KaYU+S+ndVqyUnignHftkwc58o3uVU1jzczILJ1tN2YaIZpFIKBiP/x/j97E5MVPsaCloPbqWLB/8qCTVvT2qg==",
+      "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz",
+      "integrity": "sha512-CVvd6FHg1Z3POpBLxO6E6zr+rSKEQ9L6rZHAaY7lLfhKsWYUBBOuMs0e9o24oopj6H+geRCX0YJ+TJLBK2eHyQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.3",
-        "es-abstract": "^1.19.0"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.findlastindex": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.6.tgz",
+      "integrity": "sha512-F/TKATkzseUExPlfvmwQKGITM3DGTK+vkAsCZoDc5daVygbJBnjEUCbgkAvVFsgfXfX4YIqZ/27G3k3tdXrTxQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "es-shim-unscopables": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flat": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz",
+      "integrity": "sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15163,15 +15387,16 @@
       }
     },
     "node_modules/array.prototype.flatmap": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.1.tgz",
-      "integrity": "sha512-8UGn9O1FDVvMNB0UlLv4voxRMze7+FpHyF5mSMRjWHUMlpoDViniy05870VlxhfgTnLbpuwTzvD76MTtWxB/mQ==",
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz",
+      "integrity": "sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4",
-        "es-shim-unscopables": "^1.0.0"
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15181,32 +15406,35 @@
       }
     },
     "node_modules/array.prototype.tosorted": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.1.tgz",
-      "integrity": "sha512-pZYPXPRl2PqWcsUs6LOMn+1f1532nEoPTYowBtqLwAW+W8vSVhkIGnmOX1t/UQjD6YGI0vcD2B1U7ZFGQH9jnQ==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.4.tgz",
+      "integrity": "sha512-p6Fx8B7b7ZhL/gmUsAy0D15WhvDccw3mnGNbZpi3pmeJdxtWsj2jEaI4Y6oo3XiHfzuSgPwKc04MYt6KgvC/wA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4",
-        "es-shim-unscopables": "^1.0.0",
-        "get-intrinsic": "^1.1.3"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.3",
+        "es-errors": "^1.3.0",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/arraybuffer.prototype.slice": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
-      "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+      "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
       "license": "MIT",
       "dependencies": {
         "array-buffer-byte-length": "^1.0.1",
-        "call-bind": "^1.0.5",
+        "call-bind": "^1.0.8",
         "define-properties": "^1.2.1",
-        "es-abstract": "^1.22.3",
-        "es-errors": "^1.2.1",
-        "get-intrinsic": "^1.2.3",
-        "is-array-buffer": "^3.0.4",
-        "is-shared-array-buffer": "^1.0.2"
+        "es-abstract": "^1.23.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "is-array-buffer": "^3.0.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15228,6 +15456,15 @@
       "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
       "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
     },
+    "node_modules/asn1": {
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
+      "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": "~2.1.0"
+      }
+    },
     "node_modules/assert-never": {
       "version": "1.2.1",
       "resolved": "https://registry.npmjs.org/assert-never/-/assert-never-1.2.1.tgz",
@@ -15272,10 +15509,11 @@
       }
     },
     "node_modules/ast-types-flow": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.7.tgz",
-      "integrity": "sha1-9wtzXGvKGlycItmCw+Oef+ujva0=",
-      "dev": true
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/ast-types-flow/-/ast-types-flow-0.0.8.tgz",
+      "integrity": "sha512-OH/2E5Fg20h2aPrbe+QL8JZQFko0YZaF+j4mnQ7BGhfavO7OpSLa8a0y9sBwomHdSbkhTS8TQNayBfnW5DwbvQ==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/astral-regex": {
       "version": "2.0.0",
@@ -15291,6 +15529,15 @@
       "resolved": "https://registry.npmjs.org/async/-/async-3.2.5.tgz",
       "integrity": "sha512-baNZyqaaLhyLVKm/DlvdW051MSgO6b8eVfIezl9E5PqWxFgzLm/wQntEW4zOytVburDEr0JlALEpdOFwvErLsg=="
     },
+    "node_modules/async-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+      "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/async-lock": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/async-lock/-/async-lock-1.4.1.tgz",
@@ -15450,10 +15697,11 @@
       "integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA=="
     },
     "node_modules/axe-core": {
-      "version": "4.7.1",
-      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.7.1.tgz",
-      "integrity": "sha512-sCXXUhA+cljomZ3ZAwb8i1p3oOlkABzPy08ZDAoGcYuvtBPlQ1Ytde129ArXyHWDhfeewq7rlx9F+cUx2SSlkg==",
+      "version": "4.10.3",
+      "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.10.3.tgz",
+      "integrity": "sha512-Xm7bpRXnDSX2YE2YFfBk2FnF0ep6tmG7xPh8iHee8MIcrgq762Nkce856dYtJYLkuIoYZvGfTs/PbZhideTcEg==",
       "dev": true,
+      "license": "MPL-2.0",
       "engines": {
         "node": ">=4"
       }
@@ -15475,14 +15723,21 @@
       "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
     },
     "node_modules/axobject-query": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.1.1.tgz",
-      "integrity": "sha512-goKlv8DZrK9hUh975fnHzhNIO4jUnFCfv/dszV5VwUGDFjI6vQ2VwoyjYjYNEbBE8AH87TduWP5uyDR1D+Iteg==",
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
+      "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
       "dev": true,
-      "dependencies": {
-        "deep-equal": "^2.0.5"
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
       }
     },
+    "node_modules/b4a": {
+      "version": "1.6.7",
+      "resolved": "https://registry.npmjs.org/b4a/-/b4a-1.6.7.tgz",
+      "integrity": "sha512-OnAYlL5b7LEkALw87fUVafQw5rVR9RjwGd4KUwNQ6DrrNmaVaUCgLipfVlzrPQ4tWOR9P0IXGNOx50jYCCdSJg==",
+      "license": "Apache-2.0"
+    },
     "node_modules/babel-core": {
       "version": "7.0.0-bridge.0",
       "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-7.0.0-bridge.0.tgz",
@@ -15770,13 +16025,14 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.10.4",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.10.4.tgz",
-      "integrity": "sha512-25J6I8NGfa5YkCDogHRID3fVCadIR8/pGl1/spvCkzb6lVn6SR3ojpx9nOn9iEBcUsjY24AmdKm5khcfKdylcg==",
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.11.1.tgz",
+      "integrity": "sha512-yGCqvBT4rwMczo28xkH/noxJ6MZ4nJfkVYdoDaC/utLtWrXxv27HVrzAeSbqR8SxDsp46n0YF47EbHoixy6rXQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.6.1",
-        "core-js-compat": "^3.36.1"
+        "@babel/helper-define-polyfill-provider": "^0.6.3",
+        "core-js-compat": "^3.40.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
@@ -15845,6 +16101,78 @@
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
     },
+    "node_modules/bare-events": {
+      "version": "2.5.4",
+      "resolved": "https://registry.npmjs.org/bare-events/-/bare-events-2.5.4.tgz",
+      "integrity": "sha512-+gFfDkR8pj4/TrWCGUGWmJIkBwuxPS5F+a5yWjOHQt2hHvNZd5YLzadjmDUtFmMM4y429bnKLa8bYBMHcYdnQA==",
+      "license": "Apache-2.0",
+      "optional": true
+    },
+    "node_modules/bare-fs": {
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.1.5.tgz",
+      "integrity": "sha512-1zccWBMypln0jEE05LzZt+V/8y8AQsQQqxtklqaIyg5nu6OAYFhZxPXinJTSG+kU5qyNmeLgcn9AW7eHiCHVLA==",
+      "license": "Apache-2.0",
+      "optional": true,
+      "dependencies": {
+        "bare-events": "^2.5.4",
+        "bare-path": "^3.0.0",
+        "bare-stream": "^2.6.4"
+      },
+      "engines": {
+        "bare": ">=1.16.0"
+      },
+      "peerDependencies": {
+        "bare-buffer": "*"
+      },
+      "peerDependenciesMeta": {
+        "bare-buffer": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/bare-os": {
+      "version": "3.6.1",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.6.1.tgz",
+      "integrity": "sha512-uaIjxokhFidJP+bmmvKSgiMzj2sV5GPHaZVAIktcxcpCyBFFWO+YlikVAdhmUo2vYFvFhOXIAlldqV29L8126g==",
+      "license": "Apache-2.0",
+      "optional": true,
+      "engines": {
+        "bare": ">=1.14.0"
+      }
+    },
+    "node_modules/bare-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/bare-path/-/bare-path-3.0.0.tgz",
+      "integrity": "sha512-tyfW2cQcB5NN8Saijrhqn0Zh7AnFNsnczRcuWODH0eYAXBsJ5gVxAUuNr7tsHSC6IZ77cA0SitzT+s47kot8Mw==",
+      "license": "Apache-2.0",
+      "optional": true,
+      "dependencies": {
+        "bare-os": "^3.0.1"
+      }
+    },
+    "node_modules/bare-stream": {
+      "version": "2.6.5",
+      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.6.5.tgz",
+      "integrity": "sha512-jSmxKJNJmHySi6hC42zlZnq00rga4jjxcgNZjY9N5WlOe/iOoGRtdwGsHzQv2RlH2KOYMwGUXhf2zXd32BA9RA==",
+      "license": "Apache-2.0",
+      "optional": true,
+      "dependencies": {
+        "streamx": "^2.21.0"
+      },
+      "peerDependencies": {
+        "bare-buffer": "*",
+        "bare-events": "*"
+      },
+      "peerDependenciesMeta": {
+        "bare-buffer": {
+          "optional": true
+        },
+        "bare-events": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/base": {
       "version": "0.11.2",
       "resolved": "https://registry.npmjs.org/base/-/base-0.11.2.tgz",
@@ -15863,11 +16191,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/base-x": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/base-x/-/base-x-4.0.0.tgz",
-      "integrity": "sha512-FuwxlW4H5kh37X/oW59pwTzzTKRzfrrQwhmyspRM7swOEZcHtDZSCt45U6oKgtuFE+WYPblePMVIPR4RZrh/hw=="
-    },
     "node_modules/base/node_modules/define-property": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/define-property/-/define-property-1.0.0.tgz",
@@ -15964,8 +16287,9 @@
     "node_modules/batch": {
       "version": "0.6.1",
       "resolved": "https://registry.npmjs.org/batch/-/batch-0.6.1.tgz",
-      "integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY=",
-      "dev": true
+      "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/bcrypt": {
       "version": "5.0.1",
@@ -16096,6 +16420,7 @@
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz",
       "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "license": "MIT",
       "dependencies": {
         "file-uri-to-path": "1.0.0"
       }
@@ -16211,10 +16536,11 @@
       }
     },
     "node_modules/bonjour-service": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.1.tgz",
-      "integrity": "sha512-oSzCS2zV14bh2kji6vNe7vrpJYCHGvcZnlffFQ1MEoX/WOeQ/teD8SYWKR942OI3INjq8OMNJlbPK5LLLUxFDw==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.3.0.tgz",
+      "integrity": "sha512-3YuAUiSkWykd+2Azjgyxei8OWf8thdn8AITIog2M4UICzoqfjlqr64WIjEXZllf/W6vK1goqleSR6brGomxQqA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "multicast-dns": "^7.2.5"
@@ -16237,9 +16563,9 @@
     },
     "node_modules/bootstrap-5": {
       "name": "bootstrap",
-      "version": "5.3.3",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz",
-      "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==",
+      "version": "5.3.6",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.6.tgz",
+      "integrity": "sha512-jX0GAcRzvdwISuvArXn3m7KZscWWFAf1MKBcnzaN02qWMb3jpMoUX4/qgeiGzqyIb4ojulRzs89UCUmGcFSzTA==",
       "dev": true,
       "funding": [
         {
@@ -16251,6 +16577,7 @@
           "url": "https://opencollective.com/bootstrap"
         }
       ],
+      "license": "MIT",
       "peerDependencies": {
         "@popperjs/core": "^2.11.8"
       }
@@ -16300,9 +16627,9 @@
       "license": "ISC"
     },
     "node_modules/browserslist": {
-      "version": "4.24.0",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.0.tgz",
-      "integrity": "sha512-Rmb62sR1Zpjql25eSanFGEhAxcFwfA1K0GuQcLoaJBAcENegrQut3hYdhXFF1obQfiDyqIW/cLM5HSJ/9k884A==",
+      "version": "4.24.4",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.4.tgz",
+      "integrity": "sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==",
       "dev": true,
       "funding": [
         {
@@ -16318,11 +16645,12 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "license": "MIT",
       "dependencies": {
-        "caniuse-lite": "^1.0.30001663",
-        "electron-to-chromium": "^1.5.28",
-        "node-releases": "^2.0.18",
-        "update-browserslist-db": "^1.1.0"
+        "caniuse-lite": "^1.0.30001688",
+        "electron-to-chromium": "^1.5.73",
+        "node-releases": "^2.0.19",
+        "update-browserslist-db": "^1.1.1"
       },
       "bin": {
         "browserslist": "cli.js"
@@ -16406,6 +16734,15 @@
         "node": ">= 0.10.x"
       }
     },
+    "node_modules/buildcheck": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/buildcheck/-/buildcheck-0.0.6.tgz",
+      "integrity": "sha512-8f9ZJCUXyT1M35Jx7MkBgmBMo3oHTTBIPLiY9xyL0pl3T5RwcPEY8cUHr5LBNfu/fk6c2T4DJZuVM/8ZZT2D2A==",
+      "optional": true,
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
     "node_modules/builtin-modules": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-3.3.0.tgz",
@@ -16419,37 +16756,21 @@
       }
     },
     "node_modules/builtins": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/builtins/-/builtins-4.1.0.tgz",
-      "integrity": "sha512-1bPRZQtmKaO6h7qV1YHXNtr6nCK28k0Zo95KM4dXfILcZZwoHJBN1m3lfLv9LPkcOZlrSr+J1bzMaZFO98Yq0w==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/builtins/-/builtins-5.1.0.tgz",
+      "integrity": "sha512-SW9lzGTLvWTP1AY8xeAMZimqDrIaSdLQUcVr9DMef51niJ022Ri87SwRRKYm4A6iHfkPaiVUu/Duw2Wc4J7kKg==",
       "dev": true,
-      "peer": true,
+      "license": "MIT",
       "dependencies": {
         "semver": "^7.0.0"
       }
     },
-    "node_modules/builtins/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "peer": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/builtins/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
-      "peer": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -16457,13 +16778,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/builtins/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true,
-      "peer": true
-    },
     "node_modules/bull": {
       "version": "3.29.3",
       "resolved": "https://registry.npmjs.org/bull/-/bull-3.29.3.tgz",
@@ -16600,21 +16914,6 @@
         "node": ">=10.12.0"
       }
     },
-    "node_modules/c8/node_modules/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "dev": true,
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/c8/node_modules/yargs": {
       "version": "16.2.0",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
@@ -16642,6 +16941,16 @@
         "node": ">=10"
       }
     },
+    "node_modules/cac": {
+      "version": "6.7.14",
+      "resolved": "https://registry.npmjs.org/cac/-/cac-6.7.14.tgz",
+      "integrity": "sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/cache-base": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cache-base/-/cache-base-1.0.1.tgz",
@@ -16684,15 +16993,44 @@
       }
     },
     "node_modules/call-bind": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
-      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+      "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
+      "license": "MIT",
       "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
         "es-define-property": "^1.0.0",
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2",
         "get-intrinsic": "^1.2.4",
-        "set-function-length": "^1.2.1"
+        "set-function-length": "^1.2.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -16776,9 +17114,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001667",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001667.tgz",
-      "integrity": "sha512-7LTwJjcRkzKFmtqGsibMeuXmvFDfZq/nzIjnmgCGzKKRVzjD72selLDK1oPF/Oxzmt4fNcPvTDvGqSDG4tCALw==",
+      "version": "1.0.30001714",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001714.tgz",
+      "integrity": "sha512-mtgapdwDLSSBnCI3JokHM7oEQBLxiJKVRtg10AxM1AyeiKcM96f0Mkbqeq+1AbiCtvMcHRulAAEMu693JrSWqg==",
       "dev": true,
       "funding": [
         {
@@ -16793,7 +17131,8 @@
           "type": "github",
           "url": "https://github.com/sponsors/ai"
         }
-      ]
+      ],
+      "license": "CC-BY-4.0"
     },
     "node_modules/canvas": {
       "version": "2.11.2",
@@ -16827,17 +17166,6 @@
       "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
       "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw="
     },
-    "node_modules/catharsis": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/catharsis/-/catharsis-0.9.0.tgz",
-      "integrity": "sha512-prMTQVpcns/tzFgFVkVp6ak6RykZyWb3gu8ckUpd6YkTlacOd3DXGJjIpD4Q6zJirizvaiAjSSHlOsA+6sNh2A==",
-      "dependencies": {
-        "lodash": "^4.17.15"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
     "node_modules/celebrate": {
       "version": "15.0.3",
       "resolved": "https://registry.npmjs.org/celebrate/-/celebrate-15.0.3.tgz",
@@ -17001,50 +17329,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/chalk": {
-      "version": "2.4.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-      "dev": true,
-      "dependencies": {
-        "ansi-styles": "^3.2.1",
-        "escape-string-regexp": "^1.0.5",
-        "supports-color": "^5.3.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/chalk/node_modules/escape-string-regexp": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true,
-      "engines": {
-        "node": ">=0.8.0"
-      }
-    },
-    "node_modules/chalk/node_modules/has-flag": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-      "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/chalk/node_modules/supports-color": {
-      "version": "5.5.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-      "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-      "dev": true,
-      "dependencies": {
-        "has-flag": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/character-entities": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/character-entities/-/character-entities-2.0.2.tgz",
@@ -17191,7 +17475,8 @@
     "node_modules/chownr": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.1.4.tgz",
-      "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg=="
+      "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==",
+      "license": "ISC"
     },
     "node_modules/chrome-trace-event": {
       "version": "1.0.3",
@@ -17541,13 +17826,18 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/combobo": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/combobo/-/combobo-2.0.4.tgz",
+      "integrity": "sha512-FRaTwjtUKNAyBglThL+52VDYD7Jvodb1E1nimBwybqu5ckooZn24e65hYiXSofMp/9dsPEkoAc6v5DSaQ0ENZg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/commander": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
-      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "engines": {
-        "node": ">= 6"
-      }
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
+      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ==",
+      "license": "MIT"
     },
     "node_modules/common-path-prefix": {
       "version": "3.0.0",
@@ -17662,46 +17952,20 @@
       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
     },
     "node_modules/concat-stream": {
-      "version": "1.6.2",
-      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
-      "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-2.0.0.tgz",
+      "integrity": "sha512-MWufYdFw53ccGjCA+Ol7XJYpAlW6/prSMzuPOTRnJGcGzuhLn4Scrz7qf6o8bROZ514ltazcIFJZevcfbo0x7A==",
       "engines": [
-        "node >= 0.8"
+        "node >= 6.0"
       ],
+      "license": "MIT",
       "dependencies": {
         "buffer-from": "^1.0.0",
         "inherits": "^2.0.3",
-        "readable-stream": "^2.2.2",
+        "readable-stream": "^3.0.2",
         "typedarray": "^0.0.6"
       }
     },
-    "node_modules/concat-stream/node_modules/isarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ=="
-    },
-    "node_modules/concat-stream/node_modules/readable-stream": {
-      "version": "2.3.8",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
-      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
-      "dependencies": {
-        "core-util-is": "~1.0.0",
-        "inherits": "~2.0.3",
-        "isarray": "~1.0.0",
-        "process-nextick-args": "~2.0.0",
-        "safe-buffer": "~5.1.1",
-        "string_decoder": "~1.1.1",
-        "util-deprecate": "~1.0.1"
-      }
-    },
-    "node_modules/concat-stream/node_modules/string_decoder": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
-      "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-      "dependencies": {
-        "safe-buffer": "~5.1.0"
-      }
-    },
     "node_modules/confbox": {
       "version": "0.1.8",
       "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz",
@@ -17709,17 +17973,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/config": {
-      "version": "1.31.0",
-      "resolved": "https://registry.npmjs.org/config/-/config-1.31.0.tgz",
-      "integrity": "sha512-Ep/l9Rd1J9IPueztJfpbOqVzuKHQh4ZODMNt9xqTYdBBNRXbV4oTu34kCkkfdRVcDq0ohtpaeXGgb+c0LQxFRA==",
-      "dependencies": {
-        "json5": "^1.0.1"
-      },
-      "engines": {
-        "node": ">= 4.0.0"
-      }
-    },
     "node_modules/config-chain": {
       "version": "1.1.13",
       "resolved": "https://registry.npmjs.org/config-chain/-/config-chain-1.1.13.tgz",
@@ -17730,16 +17983,12 @@
         "proto-list": "~1.2.1"
       }
     },
-    "node_modules/config/node_modules/json5": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
-      "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-      "dependencies": {
-        "minimist": "^1.2.0"
-      },
-      "bin": {
-        "json5": "lib/cli.js"
-      }
+    "node_modules/confusing-browser-globals": {
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/confusing-browser-globals/-/confusing-browser-globals-1.0.11.tgz",
+      "integrity": "sha512-JsPKdmh8ZkmnHxDk55FZ1TqVLvEQTvoByJZRN9jzI0UjxK/QgAmsphz7PGtqgPieQZ/CQcHWXCR7ATDNhGe+YA==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/connect-flash": {
       "version": "0.1.1",
@@ -17754,6 +18003,7 @@
       "resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-2.0.0.tgz",
       "integrity": "sha512-U73+6lQFmfiNPrYbXqr6kZ1i1wiRqXnp2nhMsINseWXO8lDau0LGEffJ8kQi4EjLZympVgRdvqjAgiZ1tgzDDA==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=0.8"
       }
@@ -17767,9 +18017,9 @@
       }
     },
     "node_modules/consola": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/consola/-/consola-3.4.0.tgz",
-      "integrity": "sha512-EiPU8G6dQG0GFHNR8ljnZFki/8a+cQwEQ+7wpxdChl02Q8HXlwEZWD5lqAF8vC2sEC3Tehr8hy7vErz88LHyUA==",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/consola/-/consola-3.4.2.tgz",
+      "integrity": "sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -18099,9 +18349,9 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.38.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.38.1.tgz",
-      "integrity": "sha512-OP35aUorbU3Zvlx7pjsFdu1rGNnD4pgw/CWoYzRY3t2EzoVT7shKHY1dlAy3f41cGIO7ZDPQimhGFTlEYkG/Hw==",
+      "version": "3.41.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.41.0.tgz",
+      "integrity": "sha512-SJ4/EHwS36QMJd6h/Rg+GyR4A5xE0FSI3eZ+iBVpfqf1x0eTSg1smWLHrA+2jQThZSh97fmSgFSU8B61nxosxA==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -18111,12 +18361,13 @@
       }
     },
     "node_modules/core-js-compat": {
-      "version": "3.38.1",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.38.1.tgz",
-      "integrity": "sha512-JRH6gfXxGmrzF3tZ57lFx97YARxCXPaMzPo6jELZhv88pBH5VXpQ+y0znKGlFnzuaihqhLbefxSJxWJMPtfDzw==",
+      "version": "3.41.0",
+      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.41.0.tgz",
+      "integrity": "sha512-RFsU9LySVue9RTwdDVX/T0e2Y6jRYWXERKElIjpuEOEnxaXffI0X7RUwVzfYLfzuLXSNJDYoRYUAmRUcyln20A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "browserslist": "^4.23.3"
+        "browserslist": "^4.24.4"
       },
       "funding": {
         "type": "opencollective",
@@ -18168,16 +18419,17 @@
       }
     },
     "node_modules/cpu-features": {
-      "version": "0.0.2",
-      "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.2.tgz",
-      "integrity": "sha512-/2yieBqvMcRj8McNzkycjW2v3OIUOibBfd2dLEJ0nWts8NobAxwiyw9phVNS6oDL8x8tz9F7uNVFEVpJncQpeA==",
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.10.tgz",
+      "integrity": "sha512-9IkYqtX3YHPCzoVg1Py+o9057a3i0fp7S530UWokCSaFVTc7CwXPRiOjRjBQQ18ZCNafx78YfnG+HALxtVmOGA==",
       "hasInstallScript": true,
       "optional": true,
       "dependencies": {
-        "nan": "^2.14.1"
+        "buildcheck": "~0.0.6",
+        "nan": "^2.19.0"
       },
       "engines": {
-        "node": ">=8.0.0"
+        "node": ">=10.0.0"
       }
     },
     "node_modules/crc-32": {
@@ -18192,9 +18444,9 @@
       }
     },
     "node_modules/create-storybook": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/create-storybook/-/create-storybook-8.6.4.tgz",
-      "integrity": "sha512-YwxtA+CtGHWYvQrFh1dat3Q/kXWHekok0MAqaorD9/Mf/cpybA8afHDsdq2PDq0LXg0Od3QI4Ha04+eaB6F8gA==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/create-storybook/-/create-storybook-8.6.12.tgz",
+      "integrity": "sha512-2Yb2LuWNvOEATWjj/pDAfkGhGiTLdV1nqJZLjB6F08ItcyBSeGuFybimrac72zFq4u0GI8LkjzEg/J3B1NI4tA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -18248,22 +18500,6 @@
         "node": ">=0.8"
       }
     },
-    "node_modules/cross-env": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-4.0.0.tgz",
-      "integrity": "sha512-dofkcyPqOy/AR14nbYSpk+TZ4IJZqg2as+/mQNkzh+7Xba2I1I1eyg/1G2dtSpD2LHjcEWwnGquiH2OP5LoeOw==",
-      "license": "MIT",
-      "dependencies": {
-        "cross-spawn": "^5.1.0",
-        "is-windows": "^1.0.0"
-      },
-      "bin": {
-        "cross-env": "dist/bin/cross-env.js"
-      },
-      "engines": {
-        "node": ">=4.0"
-      }
-    },
     "node_modules/cross-fetch": {
       "version": "3.1.8",
       "resolved": "https://registry.npmjs.org/cross-fetch/-/cross-fetch-3.1.8.tgz",
@@ -18462,11 +18698,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/css-mediaquery": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz",
-      "integrity": "sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q=="
-    },
     "node_modules/css-minimizer-webpack-plugin": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/css-minimizer-webpack-plugin/-/css-minimizer-webpack-plugin-5.0.1.tgz",
@@ -18803,9 +19034,10 @@
       "dev": true
     },
     "node_modules/csstype": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz",
-      "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ=="
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+      "license": "MIT"
     },
     "node_modules/csurf": {
       "version": "1.11.0",
@@ -19229,14 +19461,14 @@
       }
     },
     "node_modules/data-view-buffer": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz",
-      "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+      "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.6",
+        "call-bound": "^1.0.3",
         "es-errors": "^1.3.0",
-        "is-data-view": "^1.0.1"
+        "is-data-view": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -19246,29 +19478,29 @@
       }
     },
     "node_modules/data-view-byte-length": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz",
-      "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+      "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bound": "^1.0.3",
         "es-errors": "^1.3.0",
-        "is-data-view": "^1.0.1"
+        "is-data-view": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
       },
       "funding": {
-        "url": "https://github.com/sponsors/ljharb"
+        "url": "https://github.com/sponsors/inspect-js"
       }
     },
     "node_modules/data-view-byte-offset": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz",
-      "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+      "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.6",
+        "call-bound": "^1.0.2",
         "es-errors": "^1.3.0",
         "is-data-view": "^1.0.1"
       },
@@ -19647,21 +19879,20 @@
       }
     },
     "node_modules/detect-libc": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
-      "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=",
-      "bin": {
-        "detect-libc": "bin/detect-libc.js"
-      },
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+      "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">=0.10"
+        "node": ">=8"
       }
     },
     "node_modules/detect-node": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz",
       "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/devlop": {
       "version": "1.1.0",
@@ -19680,7 +19911,6 @@
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.4.tgz",
       "integrity": "sha512-rXSP0bf+5n0Qonsb+SVVfNfIsimO4HEtmnIpPHY8Q1UCzKlQrDMfdobr8nJOOsRgWCyMRqeSBQzmWUMq7zvVig==",
-      "dev": true,
       "dependencies": {
         "asap": "^2.0.0",
         "wrappy": "1"
@@ -19727,21 +19957,12 @@
         "node": ">=8"
       }
     },
-    "node_modules/diskusage": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/diskusage/-/diskusage-1.1.3.tgz",
-      "integrity": "sha512-EAyaxl8hy4Ph07kzlzGTfpbZMNAAAHXSZtNEMwdlnSd1noHzvA6HsgKt4fEMSvaEXQYLSphe5rPMxN4WOj0hcQ==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "es6-promise": "^4.2.5",
-        "nan": "^2.14.0"
-      }
-    },
     "node_modules/dnd-core": {
       "version": "16.0.1",
       "resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-16.0.1.tgz",
       "integrity": "sha512-HK294sl7tbw6F6IeuK16YSBUoorvHpY8RHO+9yFfaJyCDVb6n7PRcezrOEOa2SBCqiYpemh5Jx20ZcjKdFAVng==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@react-dnd/asap": "^5.0.1",
         "@react-dnd/invariant": "^4.0.1",
@@ -19749,10 +19970,11 @@
       }
     },
     "node_modules/dns-packet": {
-      "version": "5.6.0",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.0.tgz",
-      "integrity": "sha512-rza3UH1LwdHh9qyPXp8lkwpjSNk/AMD3dPytUoRoqnypDUhY0xvbdmVhWOfxO68frEfV9BU8V12Ez7ZsHGZpCQ==",
+      "version": "5.6.1",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
+      "integrity": "sha512-l4gcSouhcgIKRvyy99RNVOgxXiicE+2jZoNmaNmZ6JXiGajBOJAesk1OBlJuM5k2c+eudGdLxDqXuPCKIj6kpw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@leichtgewicht/ip-codec": "^2.0.1"
       },
@@ -19761,31 +19983,87 @@
       }
     },
     "node_modules/docker-modem": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-3.0.3.tgz",
-      "integrity": "sha512-Tgkn2a+yiNP9FoZgMa/D9Wk+D2Db///0KOyKSYZRJa8w4+DzKyzQMkczKSdR/adQ0x46BOpeNkoyEOKjPhCzjw==",
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-5.0.6.tgz",
+      "integrity": "sha512-ens7BiayssQz/uAxGzH8zGXCtiV24rRWXdjNha5V4zSOcxmAZsfGVm/PPFbwQdqEkDnhG+SyR9E3zSHUbOKXBQ==",
+      "license": "Apache-2.0",
       "dependencies": {
         "debug": "^4.1.1",
         "readable-stream": "^3.5.0",
         "split-ca": "^1.0.1",
-        "ssh2": "^1.4.0"
+        "ssh2": "^1.15.0"
       },
       "engines": {
         "node": ">= 8.0"
       }
     },
     "node_modules/dockerode": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-3.3.1.tgz",
-      "integrity": "sha512-AS2mr8Lp122aa5n6d99HkuTNdRV1wkkhHwBdcnY6V0+28D3DSYwhxAk85/mM9XwD3RMliTxyr63iuvn5ZblFYQ==",
+      "version": "4.0.7",
+      "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-4.0.7.tgz",
+      "integrity": "sha512-R+rgrSRTRdU5mH14PZTCPZtW/zw3HDWNTS/1ZAQpL/5Upe/ye5K9WQkIysu4wBoiMwKynsz0a8qWuGsHgEvSAA==",
+      "license": "Apache-2.0",
       "dependencies": {
-        "docker-modem": "^3.0.0",
-        "tar-fs": "~2.0.1"
+        "@balena/dockerignore": "^1.0.2",
+        "@grpc/grpc-js": "^1.11.1",
+        "@grpc/proto-loader": "^0.7.13",
+        "docker-modem": "^5.0.6",
+        "protobufjs": "^7.3.2",
+        "tar-fs": "~2.1.2",
+        "uuid": "^10.0.0"
       },
       "engines": {
         "node": ">= 8.0"
       }
     },
+    "node_modules/dockerode/node_modules/protobufjs": {
+      "version": "7.5.3",
+      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.5.3.tgz",
+      "integrity": "sha512-sildjKwVqOI2kmFDiXQ6aEB0fjYTafpEvIBs8tOR8qI4spuL9OPROLVu2qZqi/xgCfsHIwVqlaF8JBjWFHnKbw==",
+      "hasInstallScript": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@protobufjs/aspromise": "^1.1.2",
+        "@protobufjs/base64": "^1.1.2",
+        "@protobufjs/codegen": "^2.0.4",
+        "@protobufjs/eventemitter": "^1.1.0",
+        "@protobufjs/fetch": "^1.1.0",
+        "@protobufjs/float": "^1.0.2",
+        "@protobufjs/inquire": "^1.1.0",
+        "@protobufjs/path": "^1.1.2",
+        "@protobufjs/pool": "^1.1.0",
+        "@protobufjs/utf8": "^1.1.0",
+        "@types/node": ">=13.7.0",
+        "long": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/dockerode/node_modules/tar-fs": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.3.tgz",
+      "integrity": "sha512-090nwYJDmlhwFwEW3QQl+vaNnxsO2yVsd45eTKRBzSzu+hlb1w2K9inVq5b0ngXuLVqQ4ApvsUHHnu/zQNkWAg==",
+      "license": "MIT",
+      "dependencies": {
+        "chownr": "^1.1.1",
+        "mkdirp-classic": "^0.5.2",
+        "pump": "^3.0.0",
+        "tar-stream": "^2.1.4"
+      }
+    },
+    "node_modules/dockerode/node_modules/uuid": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+      "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/doctrine": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
@@ -19818,12 +20096,14 @@
       }
     },
     "node_modules/dom-helpers": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
-      "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
+      "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.1.2"
+        "@babel/runtime": "^7.8.7",
+        "csstype": "^3.0.2"
       }
     },
     "node_modules/dom-serializer": {
@@ -19946,21 +20226,36 @@
       "integrity": "sha512-iGCHkfUc5kFekGiqhe8B/mdaurD+lakO9txNnTvKtA6PISrw86LgqHvRzWYPyoE2Ph5aMIrCw9/uko6XHTKCwA=="
     },
     "node_modules/downshift": {
-      "version": "6.1.7",
-      "resolved": "https://registry.npmjs.org/downshift/-/downshift-6.1.7.tgz",
-      "integrity": "sha512-cVprZg/9Lvj/uhYRxELzlu1aezRcgPWBjTvspiGTVEU64gF5pRdSRKFVLcxqsZC637cLAGMbL40JavEfWnqgNg==",
+      "version": "9.0.9",
+      "resolved": "https://registry.npmjs.org/downshift/-/downshift-9.0.9.tgz",
+      "integrity": "sha512-ygOT8blgiz5liDuEFAIaPeU4dDEa+w9p6PHVUisPIjrkF5wfR59a52HpGWAVVMoWnoFO8po2mZSScKZueihS7g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.14.8",
-        "compute-scroll-into-view": "^1.0.17",
-        "prop-types": "^15.7.2",
-        "react-is": "^17.0.2",
-        "tslib": "^2.3.0"
+        "@babel/runtime": "^7.24.5",
+        "compute-scroll-into-view": "^3.1.0",
+        "prop-types": "^15.8.1",
+        "react-is": "18.2.0",
+        "tslib": "^2.6.2"
       },
       "peerDependencies": {
         "react": ">=16.12.0"
       }
     },
+    "node_modules/downshift/node_modules/compute-scroll-into-view": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/compute-scroll-into-view/-/compute-scroll-into-view-3.1.1.tgz",
+      "integrity": "sha512-VRhuHOLoKYOy4UbilLbUzbYg93XLjv2PncJC50EuTWPA3gaja1UjBsUP/D/9/juV3vQFr6XBEzn9KCAHdUvOHw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/downshift/node_modules/react-is": {
+      "version": "18.2.0",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
+      "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/dropbox": {
       "version": "10.34.0",
       "resolved": "https://registry.npmjs.org/dropbox/-/dropbox-10.34.0.tgz",
@@ -19996,6 +20291,32 @@
         "node": ">=0.10"
       }
     },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/duplexify": {
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.3.tgz",
+      "integrity": "sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==",
+      "license": "MIT",
+      "dependencies": {
+        "end-of-stream": "^1.4.1",
+        "inherits": "^2.0.3",
+        "readable-stream": "^3.1.1",
+        "stream-shift": "^1.0.2"
+      }
+    },
     "node_modules/duration": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/duration/-/duration-0.2.2.tgz",
@@ -20128,10 +20449,11 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.34",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.34.tgz",
-      "integrity": "sha512-/TZAiChbAflBNjCg+VvstbcwAtIL/VdMFO3NgRFIzBjpvPzWOTIbbO8kNb6RwU4bt9TP7K+3KqBKw/lOU+Y+GA==",
-      "dev": true
+      "version": "1.5.137",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.137.tgz",
+      "integrity": "sha512-/QSJaU2JyIuTbbABAo/crOs+SuAZLS+fVVS10PVrIT9hrRkmZl8Hb0xPSkKRUUWHQtYzXHpQUW3Dy5hwMzGZkA==",
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/email-addresses": {
       "version": "5.0.0",
@@ -20308,62 +20630,71 @@
       "resolved": "https://registry.npmjs.org/error-stack-parser/-/error-stack-parser-2.1.4.tgz",
       "integrity": "sha512-Sk5V6wVazPhq5MhpO+AUxJn5x7XSXGl1R93Vn7i+zS15KDVxQijejNCrz8340/2bgLBjR9GtEG8ZVKONDjcqGQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "stackframe": "^1.3.4"
       }
     },
     "node_modules/es-abstract": {
-      "version": "1.23.3",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz",
-      "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==",
+      "version": "1.24.0",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.0.tgz",
+      "integrity": "sha512-WSzPgsdLtTcQwm4CROfS5ju2Wa1QQcVeT37jFjYzdFz1r9ahadC8B8/a4qxJxM+09F18iumCdRmlr96ZYkQvEg==",
       "license": "MIT",
       "dependencies": {
-        "array-buffer-byte-length": "^1.0.1",
-        "arraybuffer.prototype.slice": "^1.0.3",
+        "array-buffer-byte-length": "^1.0.2",
+        "arraybuffer.prototype.slice": "^1.0.4",
         "available-typed-arrays": "^1.0.7",
-        "call-bind": "^1.0.7",
-        "data-view-buffer": "^1.0.1",
-        "data-view-byte-length": "^1.0.1",
-        "data-view-byte-offset": "^1.0.0",
-        "es-define-property": "^1.0.0",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "data-view-buffer": "^1.0.2",
+        "data-view-byte-length": "^1.0.2",
+        "data-view-byte-offset": "^1.0.1",
+        "es-define-property": "^1.0.1",
         "es-errors": "^1.3.0",
-        "es-object-atoms": "^1.0.0",
-        "es-set-tostringtag": "^2.0.3",
-        "es-to-primitive": "^1.2.1",
-        "function.prototype.name": "^1.1.6",
-        "get-intrinsic": "^1.2.4",
-        "get-symbol-description": "^1.0.2",
-        "globalthis": "^1.0.3",
-        "gopd": "^1.0.1",
+        "es-object-atoms": "^1.1.1",
+        "es-set-tostringtag": "^2.1.0",
+        "es-to-primitive": "^1.3.0",
+        "function.prototype.name": "^1.1.8",
+        "get-intrinsic": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "get-symbol-description": "^1.1.0",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
         "has-property-descriptors": "^1.0.2",
-        "has-proto": "^1.0.3",
-        "has-symbols": "^1.0.3",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
         "hasown": "^2.0.2",
-        "internal-slot": "^1.0.7",
-        "is-array-buffer": "^3.0.4",
+        "internal-slot": "^1.1.0",
+        "is-array-buffer": "^3.0.5",
         "is-callable": "^1.2.7",
-        "is-data-view": "^1.0.1",
+        "is-data-view": "^1.0.2",
         "is-negative-zero": "^2.0.3",
-        "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.3",
-        "is-string": "^1.0.7",
-        "is-typed-array": "^1.1.13",
-        "is-weakref": "^1.0.2",
-        "object-inspect": "^1.13.1",
+        "is-regex": "^1.2.1",
+        "is-set": "^2.0.3",
+        "is-shared-array-buffer": "^1.0.4",
+        "is-string": "^1.1.1",
+        "is-typed-array": "^1.1.15",
+        "is-weakref": "^1.1.1",
+        "math-intrinsics": "^1.1.0",
+        "object-inspect": "^1.13.4",
         "object-keys": "^1.1.1",
-        "object.assign": "^4.1.5",
-        "regexp.prototype.flags": "^1.5.2",
-        "safe-array-concat": "^1.1.2",
-        "safe-regex-test": "^1.0.3",
-        "string.prototype.trim": "^1.2.9",
-        "string.prototype.trimend": "^1.0.8",
+        "object.assign": "^4.1.7",
+        "own-keys": "^1.0.1",
+        "regexp.prototype.flags": "^1.5.4",
+        "safe-array-concat": "^1.1.3",
+        "safe-push-apply": "^1.0.0",
+        "safe-regex-test": "^1.1.0",
+        "set-proto": "^1.0.0",
+        "stop-iteration-iterator": "^1.1.0",
+        "string.prototype.trim": "^1.2.10",
+        "string.prototype.trimend": "^1.0.9",
         "string.prototype.trimstart": "^1.0.8",
-        "typed-array-buffer": "^1.0.2",
-        "typed-array-byte-length": "^1.0.1",
-        "typed-array-byte-offset": "^1.0.2",
-        "typed-array-length": "^1.0.6",
-        "unbox-primitive": "^1.0.2",
-        "which-typed-array": "^1.1.15"
+        "typed-array-buffer": "^1.0.3",
+        "typed-array-byte-length": "^1.0.3",
+        "typed-array-byte-offset": "^1.0.4",
+        "typed-array-length": "^1.0.7",
+        "unbox-primitive": "^1.1.0",
+        "which-typed-array": "^1.1.19"
       },
       "engines": {
         "node": ">= 0.4"
@@ -20373,12 +20704,10 @@
       }
     },
     "node_modules/es-define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
-      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
-      "dependencies": {
-        "get-intrinsic": "^1.2.4"
-      },
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.4"
       }
@@ -20411,17 +20740,45 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/es-iterator-helpers": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/es-iterator-helpers/-/es-iterator-helpers-1.2.1.tgz",
+      "integrity": "sha512-uDn+FE1yrDzyC0pCo961B2IHbdM8y/ACZsKD4dG6WqrjV53BADjwa7D+1aom2rsNVfLyDgU/eigvlJGJ08OQ4w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.6",
+        "es-errors": "^1.3.0",
+        "es-set-tostringtag": "^2.0.3",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.6",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "internal-slot": "^1.1.0",
+        "iterator.prototype": "^1.1.4",
+        "safe-array-concat": "^1.1.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-module-lexer": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.4.tgz",
-      "integrity": "sha512-MVNK56NiMrOwitFB7cqDwq0CQutbw+0BvLshJSse0MUNU+y1FC3bUS/AQg7oUng+/wKrrki7JfmwtVHkVfPLlw==",
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.7.0.tgz",
+      "integrity": "sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/es-object-atoms": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
-      "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
       "license": "MIT",
       "dependencies": {
         "es-errors": "^1.3.0"
@@ -20431,36 +20788,42 @@
       }
     },
     "node_modules/es-set-tostringtag": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
-      "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
       "license": "MIT",
       "dependencies": {
-        "get-intrinsic": "^1.2.4",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
         "has-tostringtag": "^1.0.2",
-        "hasown": "^2.0.1"
+        "hasown": "^2.0.2"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/es-shim-unscopables": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.0.0.tgz",
-      "integrity": "sha512-Jm6GPcCdC30eMLbZ2x8z2WuRwAws3zTBBKuusffYVUrNj/GVSUAZ+xKMaUpfNDR5IbyNA5LJbaecoUVbmUcB1w==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz",
+      "integrity": "sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "has": "^1.0.3"
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/es-to-primitive": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
-      "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+      "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
+      "license": "MIT",
       "dependencies": {
-        "is-callable": "^1.1.4",
-        "is-date-object": "^1.0.1",
-        "is-symbol": "^1.0.2"
+        "is-callable": "^1.2.7",
+        "is-date-object": "^1.0.5",
+        "is-symbol": "^1.0.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -20470,9 +20833,9 @@
       }
     },
     "node_modules/es-toolkit": {
-      "version": "1.32.0",
-      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.32.0.tgz",
-      "integrity": "sha512-ZfSfHP1l6ubgW/B/FRtqb9bYdMvI6jizbOSfbwwJNcOQ1QE6TFsC3jpQkZ900uUPSR3t3SU5Ds7UWKnYz+uP8Q==",
+      "version": "1.35.0",
+      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.35.0.tgz",
+      "integrity": "sha512-kVHyrRoC0eLc1hWJ6npG8nNFtOG+nWfcMI+XE0RaFO0gxd6Ions8r0O/U64QyZgY7IeidUnS5oZlRZYUgMGCAg==",
       "dev": true,
       "license": "MIT",
       "workspaces": [
@@ -20532,9 +20895,9 @@
       }
     },
     "node_modules/esbuild": {
-      "version": "0.25.0",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.0.tgz",
-      "integrity": "sha512-BXq5mqc8ltbaN34cDqWuYKyNhX8D/Z0J1xdtdQ8UcIIIyJyz+ZMKUt58tF3SrZ85jcfN/PZYhjR5uDQAYNVbuw==",
+      "version": "0.25.3",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.3.tgz",
+      "integrity": "sha512-qKA6Pvai73+M2FtftpNKRxJ78GIjmFXFxd/1DVBqGo/qNhLSfv+G12n9pNoWdytJC8U00TrViOwpjT0zgqQS8Q==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -20545,31 +20908,31 @@
         "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.25.0",
-        "@esbuild/android-arm": "0.25.0",
-        "@esbuild/android-arm64": "0.25.0",
-        "@esbuild/android-x64": "0.25.0",
-        "@esbuild/darwin-arm64": "0.25.0",
-        "@esbuild/darwin-x64": "0.25.0",
-        "@esbuild/freebsd-arm64": "0.25.0",
-        "@esbuild/freebsd-x64": "0.25.0",
-        "@esbuild/linux-arm": "0.25.0",
-        "@esbuild/linux-arm64": "0.25.0",
-        "@esbuild/linux-ia32": "0.25.0",
-        "@esbuild/linux-loong64": "0.25.0",
-        "@esbuild/linux-mips64el": "0.25.0",
-        "@esbuild/linux-ppc64": "0.25.0",
-        "@esbuild/linux-riscv64": "0.25.0",
-        "@esbuild/linux-s390x": "0.25.0",
-        "@esbuild/linux-x64": "0.25.0",
-        "@esbuild/netbsd-arm64": "0.25.0",
-        "@esbuild/netbsd-x64": "0.25.0",
-        "@esbuild/openbsd-arm64": "0.25.0",
-        "@esbuild/openbsd-x64": "0.25.0",
-        "@esbuild/sunos-x64": "0.25.0",
-        "@esbuild/win32-arm64": "0.25.0",
-        "@esbuild/win32-ia32": "0.25.0",
-        "@esbuild/win32-x64": "0.25.0"
+        "@esbuild/aix-ppc64": "0.25.3",
+        "@esbuild/android-arm": "0.25.3",
+        "@esbuild/android-arm64": "0.25.3",
+        "@esbuild/android-x64": "0.25.3",
+        "@esbuild/darwin-arm64": "0.25.3",
+        "@esbuild/darwin-x64": "0.25.3",
+        "@esbuild/freebsd-arm64": "0.25.3",
+        "@esbuild/freebsd-x64": "0.25.3",
+        "@esbuild/linux-arm": "0.25.3",
+        "@esbuild/linux-arm64": "0.25.3",
+        "@esbuild/linux-ia32": "0.25.3",
+        "@esbuild/linux-loong64": "0.25.3",
+        "@esbuild/linux-mips64el": "0.25.3",
+        "@esbuild/linux-ppc64": "0.25.3",
+        "@esbuild/linux-riscv64": "0.25.3",
+        "@esbuild/linux-s390x": "0.25.3",
+        "@esbuild/linux-x64": "0.25.3",
+        "@esbuild/netbsd-arm64": "0.25.3",
+        "@esbuild/netbsd-x64": "0.25.3",
+        "@esbuild/openbsd-arm64": "0.25.3",
+        "@esbuild/openbsd-x64": "0.25.3",
+        "@esbuild/sunos-x64": "0.25.3",
+        "@esbuild/win32-arm64": "0.25.3",
+        "@esbuild/win32-ia32": "0.25.3",
+        "@esbuild/win32-x64": "0.25.3"
       }
     },
     "node_modules/esbuild-register": {
@@ -20604,9 +20967,10 @@
       }
     },
     "node_modules/escalade": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
-      "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
+      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
+      "license": "MIT",
       "engines": {
         "node": ">=6"
       }
@@ -20649,15 +21013,17 @@
       }
     },
     "node_modules/eslint": {
-      "version": "8.57.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz",
-      "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==",
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.1.tgz",
+      "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
+      "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
+      "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
         "@eslint/eslintrc": "^2.1.4",
-        "@eslint/js": "8.57.0",
-        "@humanwhocodes/config-array": "^0.11.14",
+        "@eslint/js": "8.57.1",
+        "@humanwhocodes/config-array": "^0.13.0",
         "@humanwhocodes/module-importer": "^1.0.1",
         "@nodelib/fs.walk": "^1.2.8",
         "@ungap/structured-clone": "^1.2.0",
@@ -20703,10 +21069,11 @@
       }
     },
     "node_modules/eslint-config-prettier": {
-      "version": "8.5.0",
-      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.5.0.tgz",
-      "integrity": "sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==",
+      "version": "8.10.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.10.0.tgz",
+      "integrity": "sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "eslint-config-prettier": "bin/cli.js"
       },
@@ -20715,9 +21082,9 @@
       }
     },
     "node_modules/eslint-config-standard": {
-      "version": "17.0.0",
-      "resolved": "https://registry.npmjs.org/eslint-config-standard/-/eslint-config-standard-17.0.0.tgz",
-      "integrity": "sha512-/2ks1GKyqSOkH7JFvXJicu0iMpoojkwB+f5Du/1SC0PtBL+s8v30k9njRZ21pm2drKYm2342jFnGWzttxPmZVg==",
+      "version": "17.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz",
+      "integrity": "sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q==",
       "dev": true,
       "funding": [
         {
@@ -20733,10 +21100,14 @@
           "url": "https://feross.org/support"
         }
       ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
       "peerDependencies": {
         "eslint": "^8.0.1",
         "eslint-plugin-import": "^2.25.2",
-        "eslint-plugin-n": "^15.0.0",
+        "eslint-plugin-n": "^15.0.0 || ^16.0.0 ",
         "eslint-plugin-promise": "^6.0.0"
       }
     },
@@ -20765,13 +21136,15 @@
       }
     },
     "node_modules/eslint-import-resolver-node": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.6.tgz",
-      "integrity": "sha512-0En0w03NRVMn9Uiyn8YRPDKvWjxCWkslUEhGNTdGx15RvPJYQ+lbOlqrlNI2vEAs4pDYK4f/HN2TbDmk5TP0iw==",
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz",
+      "integrity": "sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "debug": "^3.2.7",
-        "resolve": "^1.20.0"
+        "is-core-module": "^2.13.0",
+        "resolve": "^1.22.4"
       }
     },
     "node_modules/eslint-import-resolver-node/node_modules/debug": {
@@ -20784,16 +21157,21 @@
       }
     },
     "node_modules/eslint-module-utils": {
-      "version": "2.7.3",
-      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.7.3.tgz",
-      "integrity": "sha512-088JEC7O3lDZM9xGe0RerkOMd0EjFl+Yvd1jPWIkMT5u3H9+HC34mWWPnqPrN13gieT9pBOO+Qt07Nb/6TresQ==",
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.12.1.tgz",
+      "integrity": "sha512-L8jSWTze7K2mTg0vos/RuLRS5soomksDPoJLXIslC7c8Wmut3bx7CPpJijDcBZtxQ5lrbUdM+s0OlNbz0DCDNw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "debug": "^3.2.7",
-        "find-up": "^2.1.0"
+        "debug": "^3.2.7"
       },
       "engines": {
         "node": ">=4"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
       }
     },
     "node_modules/eslint-module-utils/node_modules/debug": {
@@ -20805,90 +21183,25 @@
         "ms": "^2.1.1"
       }
     },
-    "node_modules/eslint-module-utils/node_modules/find-up": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
-      "integrity": "sha1-RdG35QbHF93UgndaK3eSCjwMV6c=",
-      "dev": true,
-      "dependencies": {
-        "locate-path": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/eslint-module-utils/node_modules/locate-path": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-2.0.0.tgz",
-      "integrity": "sha1-K1aLJl7slExtnA3pw9u7ygNUzY4=",
-      "dev": true,
-      "dependencies": {
-        "p-locate": "^2.0.0",
-        "path-exists": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/eslint-module-utils/node_modules/p-limit": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-1.3.0.tgz",
-      "integrity": "sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==",
-      "dev": true,
-      "dependencies": {
-        "p-try": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/eslint-module-utils/node_modules/p-locate": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-2.0.0.tgz",
-      "integrity": "sha1-IKAQOyIqcMj9OcwuWAaA893l7EM=",
-      "dev": true,
-      "dependencies": {
-        "p-limit": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/eslint-module-utils/node_modules/p-try": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/p-try/-/p-try-1.0.0.tgz",
-      "integrity": "sha1-y8ec26+P1CKOE/Yh8rGiN8GyB7M=",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/eslint-module-utils/node_modules/path-exists": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
-      "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/eslint-plugin-chai-expect": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-chai-expect/-/eslint-plugin-chai-expect-3.0.0.tgz",
-      "integrity": "sha512-NS0YBcToJl+BRKBSMCwRs/oHJIX67fG5Gvb4tGked+9Wnd1/PzKijd82B2QVKcSSOwRe+pp4RAJ2AULeck4eQw==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-chai-expect/-/eslint-plugin-chai-expect-3.1.0.tgz",
+      "integrity": "sha512-a9F8b38hhJsR7fgDEfyMxppZXCnCW6OOHj7cQfygsm9guXqdSzfpwrHX5FT93gSExDqD71HQglF1lLkGBwhJ+g==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": "10.* || 12.* || >= 14.*"
+        "node": "10.* || 12.* || || 14.* || 16.* || >= 18.*"
       },
       "peerDependencies": {
-        "eslint": ">=2.0.0 <= 8.x"
+        "eslint": ">=2.0.0 <= 9.x"
       }
     },
     "node_modules/eslint-plugin-chai-friendly": {
-      "version": "0.7.2",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-chai-friendly/-/eslint-plugin-chai-friendly-0.7.2.tgz",
-      "integrity": "sha512-LOIfGx5sZZ5FwM1shr2GlYAWV9Omdi+1/3byuVagvQNoGUuU0iHhp7AfjA1uR+4dJ4Isfb4+FwBJgQajIw9iAg==",
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-chai-friendly/-/eslint-plugin-chai-friendly-0.7.4.tgz",
+      "integrity": "sha512-PGPjJ8diYgX1mjLxGJqRop2rrGwZRKImoEOwUOgoIhg0p80MkTaqvmFLe5TF7/iagZHggasvIfQlUyHIhK/PYg==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       },
@@ -20897,10 +21210,11 @@
       }
     },
     "node_modules/eslint-plugin-cypress": {
-      "version": "2.15.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-2.15.1.tgz",
-      "integrity": "sha512-eLHLWP5Q+I4j2AWepYq0PgFEei9/s5LvjuSqWrxurkg1YZ8ltxdvMNmdSf0drnsNo57CTgYY/NIHHLRSWejR7w==",
+      "version": "2.15.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-cypress/-/eslint-plugin-cypress-2.15.2.tgz",
+      "integrity": "sha512-CtcFEQTDKyftpI22FVGpx8bkpKyYXBlNge6zSo0pl5/qJvBAnzaD76Vu2AsP16d6mTj478Ldn2mhgrWV+Xr0vQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "globals": "^13.20.0"
       },
@@ -20909,10 +21223,11 @@
       }
     },
     "node_modules/eslint-plugin-cypress/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "type-fest": "^0.20.2"
       },
@@ -20928,7 +21243,6 @@
       "resolved": "https://registry.npmjs.org/eslint-plugin-es/-/eslint-plugin-es-4.1.0.tgz",
       "integrity": "sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "eslint-utils": "^2.0.0",
         "regexpp": "^3.0.0"
@@ -20944,39 +21258,47 @@
       }
     },
     "node_modules/eslint-plugin-import": {
-      "version": "2.26.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.26.0.tgz",
-      "integrity": "sha512-hYfi3FXaM8WPLf4S1cikh/r4IxnO6zrhZbEGz2b660EJRbuxgpDS5gkCuYgGWg2xxh2rBuIr4Pvhve/7c31koA==",
+      "version": "2.32.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.32.0.tgz",
+      "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "array-includes": "^3.1.4",
-        "array.prototype.flat": "^1.2.5",
-        "debug": "^2.6.9",
+        "@rtsao/scc": "^1.1.0",
+        "array-includes": "^3.1.9",
+        "array.prototype.findlastindex": "^1.2.6",
+        "array.prototype.flat": "^1.3.3",
+        "array.prototype.flatmap": "^1.3.3",
+        "debug": "^3.2.7",
         "doctrine": "^2.1.0",
-        "eslint-import-resolver-node": "^0.3.6",
-        "eslint-module-utils": "^2.7.3",
-        "has": "^1.0.3",
-        "is-core-module": "^2.8.1",
+        "eslint-import-resolver-node": "^0.3.9",
+        "eslint-module-utils": "^2.12.1",
+        "hasown": "^2.0.2",
+        "is-core-module": "^2.16.1",
         "is-glob": "^4.0.3",
         "minimatch": "^3.1.2",
-        "object.values": "^1.1.5",
-        "resolve": "^1.22.0",
-        "tsconfig-paths": "^3.14.1"
+        "object.fromentries": "^2.0.8",
+        "object.groupby": "^1.0.3",
+        "object.values": "^1.2.1",
+        "semver": "^6.3.1",
+        "string.prototype.trimend": "^1.0.9",
+        "tsconfig-paths": "^3.15.0"
       },
       "engines": {
         "node": ">=4"
       },
       "peerDependencies": {
-        "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8"
+        "eslint": "^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9"
       }
     },
     "node_modules/eslint-plugin-import/node_modules/debug": {
-      "version": "2.6.9",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
-      "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
+      "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "ms": "2.0.0"
+        "ms": "^2.1.1"
       }
     },
     "node_modules/eslint-plugin-import/node_modules/doctrine": {
@@ -20984,6 +21306,7 @@
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
       "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "esutils": "^2.0.2"
       },
@@ -20991,56 +21314,63 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/eslint-plugin-import/node_modules/ms": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
-    },
     "node_modules/eslint-plugin-jsx-a11y": {
-      "version": "6.7.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.7.1.tgz",
-      "integrity": "sha512-63Bog4iIethyo8smBklORknVjB0T2dwB8Mr/hIC+fBS0uyHdYYpzM/Ed+YC8VxTjlXHEWFOdmgwcDn1U2L9VCA==",
+      "version": "6.10.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-jsx-a11y/-/eslint-plugin-jsx-a11y-6.10.2.tgz",
+      "integrity": "sha512-scB3nz4WmG75pV8+3eRUQOHZlNSUhFNq37xnpgRkCCELU3XMvXAxLk1eqWWyE22Ki4Q01Fnsw9BA3cJHDPgn2Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.20.7",
-        "aria-query": "^5.1.3",
-        "array-includes": "^3.1.6",
-        "array.prototype.flatmap": "^1.3.1",
-        "ast-types-flow": "^0.0.7",
-        "axe-core": "^4.6.2",
-        "axobject-query": "^3.1.1",
+        "aria-query": "^5.3.2",
+        "array-includes": "^3.1.8",
+        "array.prototype.flatmap": "^1.3.2",
+        "ast-types-flow": "^0.0.8",
+        "axe-core": "^4.10.0",
+        "axobject-query": "^4.1.0",
         "damerau-levenshtein": "^1.0.8",
         "emoji-regex": "^9.2.2",
-        "has": "^1.0.3",
-        "jsx-ast-utils": "^3.3.3",
-        "language-tags": "=1.0.5",
+        "hasown": "^2.0.2",
+        "jsx-ast-utils": "^3.3.5",
+        "language-tags": "^1.0.9",
         "minimatch": "^3.1.2",
-        "object.entries": "^1.1.6",
-        "object.fromentries": "^2.0.6",
-        "semver": "^6.3.0"
+        "object.fromentries": "^2.0.8",
+        "safe-regex-test": "^1.0.3",
+        "string.prototype.includes": "^2.0.1"
       },
       "engines": {
         "node": ">=4.0"
       },
       "peerDependencies": {
-        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
+        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9"
+      }
+    },
+    "node_modules/eslint-plugin-jsx-a11y/node_modules/aria-query": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
+      "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/eslint-plugin-jsx-a11y/node_modules/emoji-regex": {
       "version": "9.2.2",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
       "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/eslint-plugin-mocha": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-mocha/-/eslint-plugin-mocha-10.1.0.tgz",
-      "integrity": "sha512-xLqqWUF17llsogVOC+8C6/jvQ+4IoOREbN7ZCHuOHuD6cT5cDD4h7f2LgsZuzMAiwswWE21tO7ExaknHVDrSkw==",
+      "version": "10.5.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-mocha/-/eslint-plugin-mocha-10.5.0.tgz",
+      "integrity": "sha512-F2ALmQVPT1GoP27O1JTZGrV9Pqg8k79OeIuvw63UxMtQKREZtmkK1NFgkZQ2TW7L2JSSFKHFPTtHu5z8R9QNRw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "eslint-utils": "^3.0.0",
-        "rambda": "^7.1.0"
+        "globals": "^13.24.0",
+        "rambda": "^7.4.0"
       },
       "engines": {
         "node": ">=14.0.0"
@@ -21054,6 +21384,7 @@
       "resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-3.0.0.tgz",
       "integrity": "sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "eslint-visitor-keys": "^2.0.0"
       },
@@ -21067,21 +21398,37 @@
         "eslint": ">=5"
       }
     },
-    "node_modules/eslint-plugin-n": {
-      "version": "15.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-n/-/eslint-plugin-n-15.2.0.tgz",
-      "integrity": "sha512-lWLg++jGwC88GDGGBX3CMkk0GIWq0y41aH51lavWApOKcMQcYoL3Ayd0lEdtD3SnQtR+3qBvWQS3qGbR2BxRWg==",
+    "node_modules/eslint-plugin-mocha/node_modules/globals": {
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
-      "peer": true,
+      "license": "MIT",
       "dependencies": {
-        "builtins": "^4.0.0",
+        "type-fest": "^0.20.2"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint-plugin-n": {
+      "version": "15.7.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-n/-/eslint-plugin-n-15.7.0.tgz",
+      "integrity": "sha512-jDex9s7D/Qial8AGVIHq4W7NswpUD5DPDL2RH8Lzd9EloWUuvUkHfv4FRLMipH5q2UtyurorBkPeNi1wVWNh3Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "builtins": "^5.0.1",
         "eslint-plugin-es": "^4.1.0",
         "eslint-utils": "^3.0.0",
         "ignore": "^5.1.1",
-        "is-core-module": "^2.3.0",
-        "minimatch": "^3.0.4",
-        "resolve": "^1.10.1",
-        "semver": "^6.3.0"
+        "is-core-module": "^2.11.0",
+        "minimatch": "^3.1.2",
+        "resolve": "^1.22.1",
+        "semver": "^7.3.8"
       },
       "engines": {
         "node": ">=12.22.0"
@@ -21098,7 +21445,6 @@
       "resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-3.0.0.tgz",
       "integrity": "sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==",
       "dev": true,
-      "peer": true,
       "dependencies": {
         "eslint-visitor-keys": "^2.0.0"
       },
@@ -21112,55 +21458,30 @@
         "eslint": ">=5"
       }
     },
-    "node_modules/eslint-plugin-node": {
-      "version": "11.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-node/-/eslint-plugin-node-11.1.0.tgz",
-      "integrity": "sha512-oUwtPJ1W0SKD0Tr+wqu92c5xuCeQqB3hSCHasn/ZgjFdA9iDGNkNf2Zi9ztY7X+hNuMib23LNGRm6+uN+KLE3g==",
+    "node_modules/eslint-plugin-n/node_modules/semver": {
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
-      "dependencies": {
-        "eslint-plugin-es": "^3.0.0",
-        "eslint-utils": "^2.0.0",
-        "ignore": "^5.1.1",
-        "minimatch": "^3.0.4",
-        "resolve": "^1.10.1",
-        "semver": "^6.1.0"
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
       },
       "engines": {
-        "node": ">=8.10.0"
-      },
-      "peerDependencies": {
-        "eslint": ">=5.16.0"
-      }
-    },
-    "node_modules/eslint-plugin-node/node_modules/eslint-plugin-es": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-es/-/eslint-plugin-es-3.0.1.tgz",
-      "integrity": "sha512-GUmAsJaN4Fc7Gbtl8uOBlayo2DqhwWvEzykMHSCZHU3XdJ+NSzzZcVhXh3VxX5icqQ+oQdIEawXX8xkR3mIFmQ==",
-      "dev": true,
-      "dependencies": {
-        "eslint-utils": "^2.0.0",
-        "regexpp": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=8.10.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/mysticatea"
-      },
-      "peerDependencies": {
-        "eslint": ">=4.19.1"
+        "node": ">=10"
       }
     },
     "node_modules/eslint-plugin-prettier": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.0.0.tgz",
-      "integrity": "sha512-98MqmCJ7vJodoQK359bqQWaxOE0CS8paAz/GgjaZLyex4TTk3g9HugoO89EqWCrFiOqn9EVvcoo7gZzONCWVwQ==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz",
+      "integrity": "sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "prettier-linter-helpers": "^1.0.0"
       },
       "engines": {
-        "node": ">=6.0.0"
+        "node": ">=12.0.0"
       },
       "peerDependencies": {
         "eslint": ">=7.28.0",
@@ -21173,51 +21494,60 @@
       }
     },
     "node_modules/eslint-plugin-promise": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.0.0.tgz",
-      "integrity": "sha512-7GPezalm5Bfi/E22PnQxDWH2iW9GTvAlUNTztemeHb6c1BniSyoeTrM87JkC0wYdi6aQrZX9p2qEiAno8aTcbw==",
+      "version": "6.6.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-6.6.0.tgz",
+      "integrity": "sha512-57Zzfw8G6+Gq7axm2Pdo3gW/Rx3h9Yywgn61uE/3elTCOePEHVrn2i5CdfBwA1BLK0Q0WqctICIUSqXZW/VprQ==",
       "dev": true,
+      "license": "ISC",
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
       "peerDependencies": {
-        "eslint": "^7.0.0 || ^8.0.0"
+        "eslint": "^7.0.0 || ^8.0.0 || ^9.0.0"
       }
     },
     "node_modules/eslint-plugin-react": {
-      "version": "7.32.2",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.32.2.tgz",
-      "integrity": "sha512-t2fBMa+XzonrrNkyVirzKlvn5RXzzPwRHtMvLAtVZrt8oxgnTQaYbU6SXTOO1mwQgp1y5+toMSKInnzGr0Knqg==",
+      "version": "7.37.5",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.5.tgz",
+      "integrity": "sha512-Qteup0SqU15kdocexFNAJMvCJEfa2xUKNV4CC1xsVMrIIqEy3SQ/rqyxCWNzfrd3/ldy6HMlD2e0JDVpDg2qIA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "array-includes": "^3.1.6",
-        "array.prototype.flatmap": "^1.3.1",
-        "array.prototype.tosorted": "^1.1.1",
+        "array-includes": "^3.1.8",
+        "array.prototype.findlast": "^1.2.5",
+        "array.prototype.flatmap": "^1.3.3",
+        "array.prototype.tosorted": "^1.1.4",
         "doctrine": "^2.1.0",
+        "es-iterator-helpers": "^1.2.1",
         "estraverse": "^5.3.0",
+        "hasown": "^2.0.2",
         "jsx-ast-utils": "^2.4.1 || ^3.0.0",
         "minimatch": "^3.1.2",
-        "object.entries": "^1.1.6",
-        "object.fromentries": "^2.0.6",
-        "object.hasown": "^1.1.2",
-        "object.values": "^1.1.6",
+        "object.entries": "^1.1.9",
+        "object.fromentries": "^2.0.8",
+        "object.values": "^1.2.1",
         "prop-types": "^15.8.1",
-        "resolve": "^2.0.0-next.4",
-        "semver": "^6.3.0",
-        "string.prototype.matchall": "^4.0.8"
+        "resolve": "^2.0.0-next.5",
+        "semver": "^6.3.1",
+        "string.prototype.matchall": "^4.0.12",
+        "string.prototype.repeat": "^1.0.0"
       },
       "engines": {
         "node": ">=4"
       },
       "peerDependencies": {
-        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8"
+        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7"
       }
     },
     "node_modules/eslint-plugin-react-hooks": {
-      "version": "4.6.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz",
-      "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==",
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.2.tgz",
+      "integrity": "sha512-QzliNJq4GinDBcD8gPB5v0wh6g8q3SUi6EFF0x8N/BL9PoVs0atuGc47ozMRyOWAKdwaZ5OnbOEa3WR+dSGKuQ==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=10"
       },
@@ -21230,6 +21560,7 @@
       "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
       "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "esutils": "^2.0.2"
       },
@@ -21238,12 +21569,13 @@
       }
     },
     "node_modules/eslint-plugin-react/node_modules/resolve": {
-      "version": "2.0.0-next.4",
-      "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.4.tgz",
-      "integrity": "sha512-iMDbmAWtfU+MHpxt/I5iWI7cY6YVEZUQ3MBgPQ++XD1PELuJHIl82xBmObyP2KyQmkNB2dsqF7seoQQiAn5yDQ==",
+      "version": "2.0.0-next.5",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.5.tgz",
+      "integrity": "sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "is-core-module": "^2.9.0",
+        "is-core-module": "^2.13.0",
         "path-parse": "^1.0.7",
         "supports-preserve-symlinks-flag": "^1.0.0"
       },
@@ -21255,9 +21587,9 @@
       }
     },
     "node_modules/eslint-plugin-testing-library": {
-      "version": "7.1.1",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-testing-library/-/eslint-plugin-testing-library-7.1.1.tgz",
-      "integrity": "sha512-nszC833aZPwB6tik1nMkbFqmtgIXTT0sfJEYs0zMBKMlkQ4to2079yUV96SvmLh00ovSBJI4pgcBC1TiIP8mXg==",
+      "version": "7.5.3",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-testing-library/-/eslint-plugin-testing-library-7.5.3.tgz",
+      "integrity": "sha512-sZk5hIrx0p1ehvdS2qHefKwXHiEysiQN+FMGCzES6xRNUgwI3q4KdWMeAwpPDP9u0RDkNzJpebRUnNch1sJh+A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -21273,14 +21605,14 @@
       }
     },
     "node_modules/eslint-plugin-testing-library/node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.21.0.tgz",
-      "integrity": "sha512-G3IBKz0/0IPfdeGRMbp+4rbjfSSdnGkXsM/pFZA8zM9t9klXDnB/YnKOBQ0GoPmoROa4bCq2NeHgJa5ydsQ4mA==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.35.1.tgz",
+      "integrity": "sha512-s/Bpd4i7ht2934nG+UoSPlYXd08KYz3bmjLEb7Ye1UVob0d1ENiT3lY8bsCmik4RqfSbPw9xJJHbugpPpP5JUg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.21.0",
-        "@typescript-eslint/visitor-keys": "8.21.0"
+        "@typescript-eslint/types": "8.35.1",
+        "@typescript-eslint/visitor-keys": "8.35.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -21291,9 +21623,9 @@
       }
     },
     "node_modules/eslint-plugin-testing-library/node_modules/@typescript-eslint/types": {
-      "version": "8.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.21.0.tgz",
-      "integrity": "sha512-PAL6LUuQwotLW2a8VsySDBwYMm129vFm4tMVlylzdoTybTHaAi0oBp7Ac6LhSrHHOdLM3efH+nAR6hAWoMF89A==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.35.1.tgz",
+      "integrity": "sha512-q/O04vVnKHfrrhNAscndAn1tuQhIkwqnaW+eu5waD5IPts2eX1dgJxgqcPx5BX109/qAz7IG6VrEPTOYKCNfRQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -21304,66 +21636,15 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/eslint-plugin-testing-library/node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.21.0.tgz",
-      "integrity": "sha512-x+aeKh/AjAArSauz0GiQZsjT8ciadNMHdkUSwBB9Z6PrKc/4knM4g3UfHml6oDJmKC88a6//cdxnO/+P2LkMcg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@typescript-eslint/types": "8.21.0",
-        "@typescript-eslint/visitor-keys": "8.21.0",
-        "debug": "^4.3.4",
-        "fast-glob": "^3.3.2",
-        "is-glob": "^4.0.3",
-        "minimatch": "^9.0.4",
-        "semver": "^7.6.0",
-        "ts-api-utils": "^2.0.0"
-      },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.8.4 <5.8.0"
-      }
-    },
-    "node_modules/eslint-plugin-testing-library/node_modules/@typescript-eslint/utils": {
-      "version": "8.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.21.0.tgz",
-      "integrity": "sha512-xcXBfcq0Kaxgj7dwejMbFyq7IOHgpNMtVuDveK7w3ZGwG9owKzhALVwKpTF2yrZmEwl9SWdetf3fxNzJQaVuxw==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@eslint-community/eslint-utils": "^4.4.0",
-        "@typescript-eslint/scope-manager": "8.21.0",
-        "@typescript-eslint/types": "8.21.0",
-        "@typescript-eslint/typescript-estree": "8.21.0"
-      },
-      "engines": {
-        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/typescript-eslint"
-      },
-      "peerDependencies": {
-        "eslint": "^8.57.0 || ^9.0.0",
-        "typescript": ">=4.8.4 <5.8.0"
-      }
-    },
     "node_modules/eslint-plugin-testing-library/node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.21.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.21.0.tgz",
-      "integrity": "sha512-BkLMNpdV6prozk8LlyK/SOoWLmUFi+ZD+pcqti9ILCbVvHGk1ui1g4jJOc2WDLaeExz2qWwojxlPce5PljcT3w==",
+      "version": "8.35.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.35.1.tgz",
+      "integrity": "sha512-VRwixir4zBWCSTP/ljEo091lbpypz57PoeAQ9imjG+vbeof9LplljsL1mos4ccG6H9IjfrVGM359RozUnuFhpw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.21.0",
-        "eslint-visitor-keys": "^4.2.0"
+        "@typescript-eslint/types": "8.35.1",
+        "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -21373,38 +21654,10 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "node_modules/eslint-plugin-testing-library/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/eslint-plugin-testing-library/node_modules/debug": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
-      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ms": "^2.1.3"
-      },
-      "engines": {
-        "node": ">=6.0"
-      },
-      "peerDependenciesMeta": {
-        "supports-color": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/eslint-plugin-testing-library/node_modules/eslint-visitor-keys": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz",
-      "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -21414,53 +21667,12 @@
         "url": "https://opencollective.com/eslint"
       }
     },
-    "node_modules/eslint-plugin-testing-library/node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/eslint-plugin-testing-library/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/eslint-plugin-testing-library/node_modules/ts-api-utils": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.0.0.tgz",
-      "integrity": "sha512-xCt/TOAc+EOHS1XPnijD3/yzpH6qg2xppZO1YDqGoVsNXfQfzHpOdNuXwrwOU8u4ITXJyDCTyt8w5g1sZv9ynQ==",
+    "node_modules/eslint-plugin-unicorn": {
+      "version": "56.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-56.0.1.tgz",
+      "integrity": "sha512-FwVV0Uwf8XPfVnKSGpMg7NtlZh0G0gBarCaFcMUOoqPxXryxdYxTRRv4kH6B9TFCVIrjRXG+emcxIk2ayZilog==",
       "dev": true,
       "license": "MIT",
-      "engines": {
-        "node": ">=18.12"
-      },
-      "peerDependencies": {
-        "typescript": ">=4.8.4"
-      }
-    },
-    "node_modules/eslint-plugin-unicorn": {
-      "version": "56.0.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-56.0.0.tgz",
-      "integrity": "sha512-aXpddVz/PQMmd69uxO98PA4iidiVNvA0xOtbpUoz1WhBd4RxOQQYqN618v68drY0hmy5uU2jy1bheKEVWBjlPw==",
-      "dev": true,
       "dependencies": {
         "@babel/helper-validator-identifier": "^7.24.7",
         "@eslint-community/eslint-utils": "^4.4.0",
@@ -21490,9 +21702,9 @@
       }
     },
     "node_modules/eslint-plugin-unicorn/node_modules/ci-info": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-4.0.0.tgz",
-      "integrity": "sha512-TdHqgGf9odd8SXNuxtUBVx8Nv+qZOejE6qyqiy5NtbYYQOeFa6zmHkxlPzmaLxWWHsU6nJmB7AETdVPi+2NBUg==",
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-4.2.0.tgz",
+      "integrity": "sha512-cYY9mypksY8NRqgDB1XD1RiJL338v/551niynFTGkZOO2LHuB2OmOYxDIe/ttN9AHwrqdum1360G3ald0W9kCg==",
       "dev": true,
       "funding": [
         {
@@ -21500,15 +21712,17 @@
           "url": "https://github.com/sponsors/sibiraj-s"
         }
       ],
+      "license": "MIT",
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/eslint-plugin-unicorn/node_modules/globals": {
-      "version": "15.11.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-15.11.0.tgz",
-      "integrity": "sha512-yeyNSjdbyVaWurlwCpcA6XNBrHTMIeDdj0/hnvX/OLJ9ekOXYbLsLinH/MucQyGvNnXhidTdNhTtJaffL2sMfw==",
+      "version": "15.15.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-15.15.0.tgz",
+      "integrity": "sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=18"
       },
@@ -21521,6 +21735,7 @@
       "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.10.0.tgz",
       "integrity": "sha512-qx+xQGZVsy55CH0a1hiVwHmqjLryfh7wQyF5HO07XJ9f7dQMY/gPQHhlyDkIzJKC+x2fUCpCcUODUUUFrm7SHA==",
       "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
         "jsesc": "~0.5.0"
       },
@@ -21538,10 +21753,11 @@
       }
     },
     "node_modules/eslint-plugin-unicorn/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
+      "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
       },
@@ -21554,6 +21770,7 @@
       "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
       "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "min-indent": "^1.0.0"
       },
@@ -21620,6 +21837,7 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -21634,6 +21852,7 @@
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
       "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
       "dependencies": {
         "ansi-styles": "^4.1.0",
         "supports-color": "^7.1.0"
@@ -21649,6 +21868,7 @@
       "version": "7.2.2",
       "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
       "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
+      "license": "BSD-2-Clause",
       "dependencies": {
         "esrecurse": "^4.3.0",
         "estraverse": "^5.2.0"
@@ -21664,6 +21884,7 @@
       "version": "3.4.3",
       "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
       "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "license": "Apache-2.0",
       "engines": {
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
@@ -21675,6 +21896,7 @@
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
       "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
+      "license": "ISC",
       "dependencies": {
         "is-glob": "^4.0.3"
       },
@@ -21683,9 +21905,10 @@
       }
     },
     "node_modules/eslint/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
+      "license": "MIT",
       "dependencies": {
         "type-fest": "^0.20.2"
       },
@@ -21696,26 +21919,11 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/eslint/node_modules/optionator": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.3.tgz",
-      "integrity": "sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==",
-      "dependencies": {
-        "@aashutoshrathi/word-wrap": "^1.2.3",
-        "deep-is": "^0.1.3",
-        "fast-levenshtein": "^2.0.6",
-        "levn": "^0.4.1",
-        "prelude-ls": "^1.2.1",
-        "type-check": "^0.4.0"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
     "node_modules/eslint/node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
       "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
       "dependencies": {
         "has-flag": "^4.0.0"
       },
@@ -22044,6 +22252,13 @@
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
+    "node_modules/exifr": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/exifr/-/exifr-7.1.3.tgz",
+      "integrity": "sha512-g/aje2noHivrRSLbAUtBPWFbxKdKhgj/xr1vATDdUXPOFYJlQ62Ft0oy+72V6XLIpDJfHs6gXLbBLAolqOXYRw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/expand-brackets": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@@ -22123,35 +22338,14 @@
       "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
       "dev": true
     },
-    "node_modules/expect": {
-      "version": "1.20.2",
-      "resolved": "https://registry.npmjs.org/expect/-/expect-1.20.2.tgz",
-      "integrity": "sha512-vUOB6rNLhhRgchrNzJZH72FXDgiHmmEqX07Nlb1363HyZm/GFzkNMq0X0eIygMtdc4f2okltziddtVM4D5q0Jw==",
+    "node_modules/expect-type": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.2.1.tgz",
+      "integrity": "sha512-/kP8CAwxzLVEeFrMm4kMmy4CCDlpipyA7MYLVrdJIkV0fYF0UaigQHRsxHiuY/GEea+bh4KSv3TIlgr+2UL6bw==",
       "dev": true,
-      "dependencies": {
-        "define-properties": "~1.1.2",
-        "has": "^1.0.1",
-        "is-equal": "^1.5.1",
-        "is-regex": "^1.0.3",
-        "object-inspect": "^1.1.0",
-        "object-keys": "^1.0.9",
-        "tmatch": "^2.0.1"
-      }
-    },
-    "node_modules/expect/node_modules/define-properties": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.4.tgz",
-      "integrity": "sha512-uckOqKcfaVvtBdsVkdPv3XjveQJsNQqmhXgRi8uhvWWuPYZCNlzT8qAyblUgNoXdHdjMTzAqeGjAoli8f+bzPA==",
-      "dev": true,
-      "dependencies": {
-        "has-property-descriptors": "^1.0.0",
-        "object-keys": "^1.1.1"
-      },
+      "license": "Apache-2.0",
       "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
+        "node": ">=12.0.0"
       }
     },
     "node_modules/express": {
@@ -22584,8 +22778,7 @@
     "node_modules/fast-fifo": {
       "version": "1.3.2",
       "resolved": "https://registry.npmjs.org/fast-fifo/-/fast-fifo-1.3.2.tgz",
-      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
-      "dev": true
+      "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="
     },
     "node_modules/fast-glob": {
       "version": "3.3.3",
@@ -22629,8 +22822,7 @@
     "node_modules/fast-safe-stringify": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/fast-safe-stringify/-/fast-safe-stringify-2.1.1.tgz",
-      "integrity": "sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==",
-      "dev": true
+      "integrity": "sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA=="
     },
     "node_modules/fast-text-encoding": {
       "version": "1.0.3",
@@ -22694,6 +22886,7 @@
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
       "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "websocket-driver": ">=0.5.1"
       },
@@ -22755,45 +22948,6 @@
         "node": ">=4.0.0"
       }
     },
-    "node_modules/fetch-mock": {
-      "version": "9.11.0",
-      "resolved": "https://registry.npmjs.org/fetch-mock/-/fetch-mock-9.11.0.tgz",
-      "integrity": "sha512-PG1XUv+x7iag5p/iNHD4/jdpxL9FtVSqRMUQhPab4hVDt80T1MH5ehzVrL2IdXO9Q2iBggArFvPqjUbHFuI58Q==",
-      "dev": true,
-      "dependencies": {
-        "@babel/core": "^7.0.0",
-        "@babel/runtime": "^7.0.0",
-        "core-js": "^3.0.0",
-        "debug": "^4.1.1",
-        "glob-to-regexp": "^0.4.0",
-        "is-subset": "^0.1.1",
-        "lodash.isequal": "^4.5.0",
-        "path-to-regexp": "^2.2.1",
-        "querystring": "^0.2.0",
-        "whatwg-url": "^6.5.0"
-      },
-      "engines": {
-        "node": ">=4.0.0"
-      },
-      "funding": {
-        "type": "charity",
-        "url": "https://www.justgiving.com/refugee-support-europe"
-      },
-      "peerDependencies": {
-        "node-fetch": "*"
-      },
-      "peerDependenciesMeta": {
-        "node-fetch": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/fetch-mock/node_modules/path-to-regexp": {
-      "version": "3.3.0",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-3.3.0.tgz",
-      "integrity": "sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==",
-      "dev": true
-    },
     "node_modules/figures": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/figures/-/figures-3.2.0.tgz",
@@ -22863,7 +23017,8 @@
     "node_modules/file-uri-to-path": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
-      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw=="
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "license": "MIT"
     },
     "node_modules/filelist": {
       "version": "1.0.4",
@@ -23084,6 +23239,7 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/findit2/-/findit2-2.2.3.tgz",
       "integrity": "sha512-lg/Moejf4qXovVutL0Lz4IsaPoNYMuxt4PA0nGqFxnJ1CTTGGlEO2wKgoDpwknhvZ8k4Q2F+eesgkLbG2Mxfog==",
+      "license": "MIT",
       "engines": {
         "node": ">=0.8.22"
       }
@@ -23109,20 +23265,6 @@
         "node": "^10.12.0 || >=12.0.0"
       }
     },
-    "node_modules/flat-cache/node_modules/rimraf": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
-      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
-      "dependencies": {
-        "glob": "^7.1.3"
-      },
-      "bin": {
-        "rimraf": "bin.js"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/flatted": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
@@ -23175,11 +23317,18 @@
       }
     },
     "node_modules/for-each": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
-      "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+      "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
+      "license": "MIT",
       "dependencies": {
-        "is-callable": "^1.1.3"
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/for-in": {
@@ -23341,6 +23490,7 @@
       "resolved": "https://registry.npmjs.org/formidable/-/formidable-1.2.6.tgz",
       "integrity": "sha512-KcpbcpuLNOwrEjnbpMC0gS+X8ciDoZE1kkqzat4a8vrprf+s9pKNQ/QIwWfbfs4ltgmFl3MD177SNTkve3BwGQ==",
       "deprecated": "Please upgrade to latest, formidable@v2 or formidable@v3! Check these notes: https://bit.ly/2ZEqIau",
+      "license": "MIT",
       "funding": {
         "url": "https://ko-fi.com/tunnckoCore/commissions"
       }
@@ -23356,6 +23506,7 @@
           "url": "https://opencollective.com/formik"
         }
       ],
+      "license": "Apache-2.0",
       "dependencies": {
         "deepmerge": "^2.1.1",
         "hoist-non-react-statics": "^3.3.0",
@@ -23374,6 +23525,7 @@
       "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
       "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -23382,7 +23534,8 @@
       "version": "1.14.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
       "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
-      "dev": true
+      "dev": true,
+      "license": "0BSD"
     },
     "node_modules/forwarded": {
       "version": "0.2.0",
@@ -23490,11 +23643,12 @@
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
     },
     "node_modules/fsevents": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
-      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
       "dev": true,
       "hasInstallScript": true,
+      "license": "MIT",
       "optional": true,
       "os": [
         "darwin"
@@ -23512,14 +23666,17 @@
       }
     },
     "node_modules/function.prototype.name": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz",
-      "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==",
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.8.tgz",
+      "integrity": "sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "functions-have-names": "^1.2.3"
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "functions-have-names": "^1.2.3",
+        "hasown": "^2.0.2",
+        "is-callable": "^1.2.7"
       },
       "engines": {
         "node": ">= 0.4"
@@ -23528,12 +23685,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/functional-red-black-tree": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
-      "integrity": "sha512-dsKNQNdj6xA3T+QlADDA7mOSlX0qiMINjn0cgr+eGHGsbSHzTabcIogz2+p/iqP1Xs6EP/sS2SbqH+brGTbq0g==",
-      "dev": true
-    },
     "node_modules/functions-have-names": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz",
@@ -23631,15 +23782,21 @@
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
-      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "license": "MIT",
       "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
         "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
         "function-bind": "^1.1.2",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0"
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -23667,6 +23824,19 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/get-stream": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz",
@@ -23683,14 +23853,14 @@
       }
     },
     "node_modules/get-symbol-description": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
-      "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+      "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.5",
+        "call-bound": "^1.0.3",
         "es-errors": "^1.3.0",
-        "get-intrinsic": "^1.2.4"
+        "get-intrinsic": "^1.2.6"
       },
       "engines": {
         "node": ">= 0.4"
@@ -23910,11 +24080,13 @@
       }
     },
     "node_modules/globalthis": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.3.tgz",
-      "integrity": "sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+      "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
+      "license": "MIT",
       "dependencies": {
-        "define-properties": "^1.1.3"
+        "define-properties": "^1.2.1",
+        "gopd": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -24077,17 +24249,6 @@
         }
       }
     },
-    "node_modules/google-gax/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/google-gax/node_modules/gaxios": {
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.6.0.tgz",
@@ -24265,6 +24426,15 @@
         "uuid": "dist/bin/uuid"
       }
     },
+    "node_modules/google-logging-utils": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/google-logging-utils/-/google-logging-utils-0.0.2.tgz",
+      "integrity": "sha512-NEgUnEcBiP5HrPzufUkBzJOD/Sxsco3rLNo1F1TNf7ieU8ryUzBhqba8r756CjLX7rn3fHl6iLEwPYuqpoKgQQ==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/google-p12-pem": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-3.1.3.tgz",
@@ -24452,11 +24622,12 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
     "node_modules/gopd": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-      "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
-      "dependencies": {
-        "get-intrinsic": "^1.1.3"
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -24476,6 +24647,7 @@
       "version": "2.1.8",
       "resolved": "https://registry.npmjs.org/graphlib/-/graphlib-2.1.8.tgz",
       "integrity": "sha512-jcLLfkpoVGmH7/InMC/1hIvOPSUh38oJtGhvrOFGzioE1DZ+0YW16RgmOJhHiuWTvGiJQ9Z1Ik43JvkRPRvE+A==",
+      "license": "MIT",
       "dependencies": {
         "lodash": "^4.17.15"
       }
@@ -24561,7 +24733,8 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/handle-thing/-/handle-thing-2.0.1.tgz",
       "integrity": "sha512-9Qn4yBxelxoh2Ow62nP+Ka/kMnOXRi8BXnRaUwezLNhqelnN49xKz4F/dPP8OYLxLxq6JDtZb2i9XznUQbNPTg==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/handlebars": {
       "version": "4.7.8",
@@ -24655,18 +24828,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/has": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
-      "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==",
-      "dev": true,
-      "dependencies": {
-        "function-bind": "^1.1.1"
-      },
-      "engines": {
-        "node": ">= 0.4.0"
-      }
-    },
     "node_modules/has-bigints": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz",
@@ -24695,10 +24856,13 @@
       }
     },
     "node_modules/has-proto": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
-      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+      "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
       "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.0"
+      },
       "engines": {
         "node": ">= 0.4"
       },
@@ -24707,9 +24871,10 @@
       }
     },
     "node_modules/has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.4"
       },
@@ -24941,8 +25106,9 @@
     "node_modules/hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
-      "integrity": "sha1-h3dMCUnlE/QuhFdbPEVoH63ioLI=",
+      "integrity": "sha512-zJxVehUdMGIKsRaNt7apO2Gqp0BdqW5yaiGHXXmbpvxgBYVZnAql+BJb4RO5ad2MgpbZKn5G6nMnegrH1FcNYQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "inherits": "^2.0.1",
         "obuf": "^1.0.0",
@@ -24953,14 +25119,16 @@
     "node_modules/hpack.js/node_modules/isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-      "dev": true
+      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/hpack.js/node_modules/readable-stream": {
-      "version": "2.3.7",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-      "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
+      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "core-util-is": "~1.0.0",
         "inherits": "~2.0.3",
@@ -24976,6 +25144,7 @@
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.1.0"
       }
@@ -25072,6 +25241,7 @@
       "resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
       "integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "void-elements": "3.1.0"
       }
@@ -25134,8 +25304,9 @@
     "node_modules/http-deceiver": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
-      "integrity": "sha1-+nFolEq5pRnTN8sL7HKE3D5yPYc=",
-      "dev": true
+      "integrity": "sha512-LmpOGxTfbpgtGVxJrj5k7asXHCgNZp5nLfp+hWc8QQRqtb7fUy6kRY3BO1h9ddF6yIPYUARgxGOwB42DnxIaNw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/http-errors": {
       "version": "2.0.0",
@@ -25204,10 +25375,11 @@
       "dev": true
     },
     "node_modules/http-parser-js": {
-      "version": "0.5.5",
-      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.5.tgz",
-      "integrity": "sha512-x+JVEkO2PoM8qqpbPbOL3cqHPwerep7OwzK7Ay+sMQjKzaKCqWvjoXm5tqMP9tXWWTnTzAjIhXg+J99XYuPhPA==",
-      "dev": true
+      "version": "0.5.10",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.10.tgz",
+      "integrity": "sha512-Pysuw9XpUq5dVc/2SMHpuTY01RFl8fttgcyunjL7eEMhGM3cI4eOmiCycJDVCo/7O7ClfQD3SaI6ftDzqOXYMA==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/http-proxy": {
       "version": "1.18.1",
@@ -25238,9 +25410,9 @@
       }
     },
     "node_modules/http-proxy-middleware": {
-      "version": "2.0.7",
-      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.7.tgz",
-      "integrity": "sha512-fgVY8AV7qU7z/MmXJ/rxwbrtQH4jBQ9m7kp3llF0liB7glmFeVZFBepQb32T3y8n8k2+AEYuMPCpinYW+/CuRA==",
+      "version": "2.0.9",
+      "resolved": "https://registry.npmjs.org/http-proxy-middleware/-/http-proxy-middleware-2.0.9.tgz",
+      "integrity": "sha512-c1IyJYLYppU574+YI7R4QyX2ystMtVXZwIdzazUIPIJsHuWNd+mho2j+bKoHftndicGj9yh+xjd+l0yj7VeT1Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -25336,11 +25508,6 @@
         "node": ">=10.18"
       }
     },
-    "node_modules/hyphenate-style-name": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz",
-      "integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ=="
-    },
     "node_modules/i18next": {
       "version": "23.10.0",
       "resolved": "https://registry.npmjs.org/i18next/-/i18next-23.10.0.tgz",
@@ -25665,14 +25832,14 @@
       }
     },
     "node_modules/internal-slot": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
-      "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+      "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
       "license": "MIT",
       "dependencies": {
         "es-errors": "^1.3.0",
-        "hasown": "^2.0.0",
-        "side-channel": "^1.0.4"
+        "hasown": "^2.0.2",
+        "side-channel": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -25691,6 +25858,7 @@
       "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
       "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "loose-envify": "^1.0.0"
       }
@@ -25849,13 +26017,14 @@
       }
     },
     "node_modules/is-array-buffer": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
-      "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+      "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1"
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
       },
       "engines": {
         "node": ">= 0.4"
@@ -25870,25 +26039,17 @@
       "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=",
       "dev": true
     },
-    "node_modules/is-arrow-function": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/is-arrow-function/-/is-arrow-function-2.0.3.tgz",
-      "integrity": "sha512-iDStzcT1FJMzx+TjCOK//uDugSe/Mif/8a+T0htydQ3qkJGvSweTZpVYz4hpJH0baloSPiAFQdA8WslAgJphvQ==",
-      "dev": true,
-      "dependencies": {
-        "is-callable": "^1.0.4"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      }
-    },
     "node_modules/is-async-function": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.0.0.tgz",
-      "integrity": "sha512-Y1JXKrfykRJGdlDwdKlLpLyMIiWqWvuSd17TvZk68PLAOGOoF4Xyav1z0Xhoi+gCYjZVeC5SI+hYFOfvXmGRCA==",
-      "dev": true,
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+      "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+      "license": "MIT",
       "dependencies": {
-        "has-tostringtag": "^1.0.0"
+        "async-function": "^1.0.0",
+        "call-bound": "^1.0.3",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -25898,11 +26059,15 @@
       }
     },
     "node_modules/is-bigint": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
-      "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+      "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
+      "license": "MIT",
       "dependencies": {
-        "has-bigints": "^1.0.1"
+        "has-bigints": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -25921,12 +26086,13 @@
       }
     },
     "node_modules/is-boolean-object": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
-      "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+      "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "has-tostringtag": "^1.0.0"
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -25968,11 +26134,15 @@
       }
     },
     "node_modules/is-core-module": {
-      "version": "2.13.1",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.13.1.tgz",
-      "integrity": "sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==",
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
+      "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==",
+      "license": "MIT",
       "dependencies": {
-        "hasown": "^2.0.0"
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -25991,11 +26161,13 @@
       }
     },
     "node_modules/is-data-view": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz",
-      "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+      "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
       "license": "MIT",
       "dependencies": {
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
         "is-typed-array": "^1.1.13"
       },
       "engines": {
@@ -26006,11 +26178,13 @@
       }
     },
     "node_modules/is-date-object": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz",
-      "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+      "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
+      "license": "MIT",
       "dependencies": {
-        "has-tostringtag": "^1.0.0"
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26046,42 +26220,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/is-equal": {
-      "version": "1.7.0",
-      "resolved": "https://registry.npmjs.org/is-equal/-/is-equal-1.7.0.tgz",
-      "integrity": "sha512-hErktGR9jmoYXNWlbrwGjc8eHh09mbY6TWSTTFtnMcKaCuSMN8z+Ni5ma/8mkbVpe4CbB7V6kN1MkCg9bCx5bA==",
-      "dev": true,
-      "dependencies": {
-        "es-get-iterator": "^1.1.3",
-        "es-to-primitive": "^1.2.1",
-        "functions-have-names": "^1.2.3",
-        "has-bigints": "^1.0.2",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0",
-        "is-arrow-function": "^2.0.3",
-        "is-bigint": "^1.0.4",
-        "is-boolean-object": "^1.1.2",
-        "is-callable": "^1.2.7",
-        "is-date-object": "^1.0.5",
-        "is-generator-function": "^1.0.10",
-        "is-number-object": "^1.0.7",
-        "is-regex": "^1.1.4",
-        "is-string": "^1.0.7",
-        "is-symbol": "^1.0.4",
-        "isarray": "^2.0.5",
-        "object-inspect": "^1.13.1",
-        "object.entries": "^1.1.7",
-        "object.getprototypeof": "^1.0.5",
-        "which-boxed-primitive": "^1.0.2",
-        "which-collection": "^1.0.1"
-      },
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/is-expression": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/is-expression/-/is-expression-4.0.0.tgz",
@@ -26112,12 +26250,15 @@
       }
     },
     "node_modules/is-finalizationregistry": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.0.2.tgz",
-      "integrity": "sha512-0by5vtUJs8iFQb5TYUHHPudOR+qXYIMKtiUzvLIZITZUjknFmziyBJuLhVRc+Ds0dREFlskDNJKYIdIzu/9pfw==",
-      "dev": true,
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+      "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2"
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -26220,10 +26361,13 @@
       }
     },
     "node_modules/is-map": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.2.tgz",
-      "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==",
-      "dev": true,
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+      "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -26285,11 +26429,13 @@
       }
     },
     "node_modules/is-number-object": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
-      "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+      "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
+      "license": "MIT",
       "dependencies": {
-        "has-tostringtag": "^1.0.0"
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26348,12 +26494,15 @@
       "integrity": "sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ=="
     },
     "node_modules/is-regex": {
-      "version": "1.1.4",
-      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz",
-      "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
+      "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "has-tostringtag": "^1.0.0"
+        "call-bound": "^1.0.2",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26363,10 +26512,13 @@
       }
     },
     "node_modules/is-set": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.2.tgz",
-      "integrity": "sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==",
-      "dev": true,
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+      "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -26375,15 +26527,16 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/is-shallow-equal/-/is-shallow-equal-1.0.1.tgz",
       "integrity": "sha512-lq5RvK+85Hs5J3p4oA4256M1FEffzmI533ikeDHvJd42nouRRx5wBzt36JuviiGe5dIPyHON/d0/Up+PBo6XkQ==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/is-shared-array-buffer": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
-      "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+      "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7"
+        "call-bound": "^1.0.3"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26403,17 +26556,14 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/is-stream-ended": {
-      "version": "0.1.4",
-      "resolved": "https://registry.npmjs.org/is-stream-ended/-/is-stream-ended-0.1.4.tgz",
-      "integrity": "sha512-xj0XPvmr7bQFTvirqnFr50o0hQIh6ZItDqloxt5aJrR4NQsYeSsyFQERYGCAzfindAcnKjINnwEEgLx4IqVzQw=="
-    },
     "node_modules/is-string": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz",
-      "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+      "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
+      "license": "MIT",
       "dependencies": {
-        "has-tostringtag": "^1.0.0"
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26422,18 +26572,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/is-subset": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-subset/-/is-subset-0.1.1.tgz",
-      "integrity": "sha1-ilkRfZMt4d4A8kX83TnOQ/HpOaY=",
-      "dev": true
-    },
     "node_modules/is-symbol": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz",
-      "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+      "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
+      "license": "MIT",
       "dependencies": {
-        "has-symbols": "^1.0.2"
+        "call-bound": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "safe-regex-test": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26443,12 +26590,12 @@
       }
     },
     "node_modules/is-typed-array": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
-      "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+      "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
       "license": "MIT",
       "dependencies": {
-        "which-typed-array": "^1.1.14"
+        "which-typed-array": "^1.1.16"
       },
       "engines": {
         "node": ">= 0.4"
@@ -26489,33 +26636,43 @@
       "integrity": "sha512-X/kiF3Xndj6WI7l/yLyzR7V1IbQd6L4S4cewSL0fRciemPmHbaXIKR2qtf+zseH+lbMG0vFp4HvCUe7amGZVhw=="
     },
     "node_modules/is-weakmap": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz",
-      "integrity": "sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==",
-      "dev": true,
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+      "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/is-weakref": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz",
-      "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+      "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2"
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/is-weakset": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.2.tgz",
-      "integrity": "sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==",
-      "dev": true,
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+      "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -26531,6 +26688,7 @@
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
       "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -26706,6 +26864,24 @@
         "node": ">=8"
       }
     },
+    "node_modules/iterator.prototype": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.5.tgz",
+      "integrity": "sha512-H0dkQoCa3b2VEeKQBOxFph+JAbcrQdE7KC0UkqwpLmv2EC4P41QXP+rqo9wYodACiG5/WM5s9oDApTU8utwj9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.6",
+        "get-proto": "^1.0.0",
+        "has-symbols": "^1.1.0",
+        "set-function-name": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/jackspeak": {
       "version": "3.4.3",
       "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
@@ -27014,14 +27190,6 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
-    "node_modules/js2xmlparser": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/js2xmlparser/-/js2xmlparser-4.0.2.tgz",
-      "integrity": "sha512-6n4D8gLlLf1n5mNLQPRfViYzu9RATblzPEtm1SthMX1Pjao0r9YI9nw7ZIfRxQMERS87mcswrg+r/OYrPRX6jA==",
-      "dependencies": {
-        "xmlcreate": "^2.0.4"
-      }
-    },
     "node_modules/jsbn": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
@@ -27093,34 +27261,6 @@
         "node": ">=6.0.0"
       }
     },
-    "node_modules/jsdoc": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/jsdoc/-/jsdoc-4.0.3.tgz",
-      "integrity": "sha512-Nu7Sf35kXJ1MWDZIMAuATRQTg1iIPdzh7tqJ6jjvaU/GfDf+qi5UV8zJR3Mo+/pYFvm8mzay4+6O5EWigaQBQw==",
-      "dependencies": {
-        "@babel/parser": "^7.20.15",
-        "@jsdoc/salty": "^0.2.1",
-        "@types/markdown-it": "^14.1.1",
-        "bluebird": "^3.7.2",
-        "catharsis": "^0.9.0",
-        "escape-string-regexp": "^2.0.0",
-        "js2xmlparser": "^4.0.2",
-        "klaw": "^3.0.0",
-        "markdown-it": "^14.1.0",
-        "markdown-it-anchor": "^8.6.7",
-        "marked": "^4.0.10",
-        "mkdirp": "^1.0.4",
-        "requizzle": "^0.2.3",
-        "strip-json-comments": "^3.1.0",
-        "underscore": "~1.13.2"
-      },
-      "bin": {
-        "jsdoc": "jsdoc.js"
-      },
-      "engines": {
-        "node": ">=12.0.0"
-      }
-    },
     "node_modules/jsdoc-type-pratt-parser": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/jsdoc-type-pratt-parser/-/jsdoc-type-pratt-parser-4.1.0.tgz",
@@ -27131,25 +27271,6 @@
         "node": ">=12.0.0"
       }
     },
-    "node_modules/jsdoc/node_modules/escape-string-regexp": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
-      "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/jsdoc/node_modules/mkdirp": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
-      "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
-      "bin": {
-        "mkdirp": "bin/cmd.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/jsdom": {
       "version": "19.0.0",
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-19.0.0.tgz",
@@ -27291,6 +27412,7 @@
       "version": "3.0.15",
       "resolved": "https://registry.npmjs.org/json-refs/-/json-refs-3.0.15.tgz",
       "integrity": "sha512-0vOQd9eLNBL18EGl5yYaO44GhixmImes2wiYn9Z3sag3QnehWrYWlB9AFtMxCL2Bj3fyxgDYkxGFEU/chlYssw==",
+      "license": "MIT",
       "dependencies": {
         "commander": "~4.1.1",
         "graphlib": "^2.1.8",
@@ -27312,14 +27434,25 @@
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
       "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+      "license": "MIT",
       "dependencies": {
         "sprintf-js": "~1.0.2"
       }
     },
+    "node_modules/json-refs/node_modules/commander": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
+      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/json-refs/node_modules/js-yaml": {
       "version": "3.14.1",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
       "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==",
+      "license": "MIT",
       "dependencies": {
         "argparse": "^1.0.7",
         "esprima": "^4.0.0"
@@ -27332,6 +27465,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
       "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "license": "MIT",
       "engines": {
         "node": ">=8"
       }
@@ -27395,7 +27529,6 @@
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
       "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
-      "dev": true,
       "bin": {
         "json5": "lib/cli.js"
       },
@@ -27532,13 +27665,16 @@
       }
     },
     "node_modules/jsx-ast-utils": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.3.tgz",
-      "integrity": "sha512-fYQHZTZ8jSfmWZ0iyzfwiU4WDX4HpHbMCZ3gPlWYiCl3BoeOTsqKBqnTVfH2rYT7eP5c3sVbeSPHnnJOaTrWiw==",
+      "version": "3.3.5",
+      "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz",
+      "integrity": "sha512-ZZow9HBI5O6EPgSJLUb8n2NKgmVWTwCvHGwFuJlMjvLFqlGG6pjirPhtdsseaLZjSibD8eegzmYpUZwoIlj2cQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "array-includes": "^3.1.5",
-        "object.assign": "^4.1.3"
+        "array-includes": "^3.1.6",
+        "array.prototype.flat": "^1.3.1",
+        "object.assign": "^4.1.4",
+        "object.values": "^1.1.6"
       },
       "engines": {
         "node": ">=4.0"
@@ -27592,12 +27728,6 @@
         "node": ">=12.0.0"
       }
     },
-    "node_modules/keycode": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.2.1.tgz",
-      "integrity": "sha512-Rdgz9Hl9Iv4QKi8b0OlCRQEzp4AgVxyCtz5S/+VIHezDmrDhkp2N2TqBWOLz0/gbeREXOOiI9/4b8BY9uw2vFg==",
-      "dev": true
-    },
     "node_modules/keyv": {
       "version": "4.5.4",
       "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
@@ -27617,14 +27747,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/klaw": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/klaw/-/klaw-3.0.0.tgz",
-      "integrity": "sha512-0Fo5oir+O9jnXu5EefYbVK+mHMBeEVEy2cmctR1O1NECcCkPRreJKrS6Qt/j3KC2C148Dfo9i3pCmCMsdqGr0g==",
-      "dependencies": {
-        "graceful-fs": "^4.1.9"
-      }
-    },
     "node_modules/klaw-sync": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
@@ -27735,12 +27857,16 @@
       "dev": true
     },
     "node_modules/language-tags": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/language-tags/-/language-tags-1.0.5.tgz",
-      "integrity": "sha1-0yHbxNowuovzAk4ED6XBRmH5GTo=",
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/language-tags/-/language-tags-1.0.9.tgz",
+      "integrity": "sha512-MbjN408fEndfiQXbFQ1vnd+1NoLDsnQW41410oQBXiyXDMYH5z505juWa4KUE1LqxRC7DgOgZDbKLxHIwm27hA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "language-subtag-registry": "~0.3.2"
+        "language-subtag-registry": "^0.3.20"
+      },
+      "engines": {
+        "node": ">=0.10"
       }
     },
     "node_modules/latexqc": {
@@ -27748,10 +27874,11 @@
       "link": true
     },
     "node_modules/launch-editor": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.8.0.tgz",
-      "integrity": "sha512-vJranOAJrI/llyWGRQqiDM+adrw+k83fvmmx3+nV47g3+36xM15jE+zyZ6Ffel02+xSvuM0b2GDRosXZkbb6wA==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.10.0.tgz",
+      "integrity": "sha512-D7dBRJo/qcGX9xlvt/6wUYzQxjh5G1RvZPgPv8vi4KRU99DVQL/oW7tnVOCCTm2HGeo3C5HvGE5Yrh6UBoZ0vA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "picocolors": "^1.0.0",
         "shell-quote": "^1.8.1"
@@ -28009,19 +28136,6 @@
       "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
       "dev": true
     },
-    "node_modules/linkify-it": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
-      "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",
-      "dependencies": {
-        "uc.micro": "^2.0.0"
-      }
-    },
-    "node_modules/linkify-it/node_modules/uc.micro": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
-      "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A=="
-    },
     "node_modules/listr2": {
       "version": "3.14.0",
       "resolved": "https://registry.npmjs.org/listr2/-/listr2-3.14.0.tgz",
@@ -28124,12 +28238,14 @@
     "node_modules/lodash._arraypool": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._arraypool/-/lodash._arraypool-2.4.1.tgz",
-      "integrity": "sha1-6I7suS4ruEyQZWEv2VigcZzUf5Q="
+      "integrity": "sha512-tC2aLC7bbkDXKNrjDu9OLiVx9pFIvjinID2eD9PzNdAQGZScWUd/h8faqOw5d6oLsOvFRCRbz1ASoB+deyMVUw==",
+      "license": "MIT"
     },
     "node_modules/lodash._basebind": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._basebind/-/lodash._basebind-2.4.1.tgz",
-      "integrity": "sha1-6UC5690nwyfgqNqxtVkWxTQelXU=",
+      "integrity": "sha512-VGHm6DH+1UiuafQdE/DNMqxOcSyhRu0xO9+jPDq7xITRn5YOorGrHVQmavMVXCYmTm80YRTZZCn/jTW7MokwLg==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basecreate": "~2.4.1",
         "lodash._setbinddata": "~2.4.1",
@@ -28140,7 +28256,8 @@
     "node_modules/lodash._baseclone": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._baseclone/-/lodash._baseclone-2.4.1.tgz",
-      "integrity": "sha1-MPgj5X4X43NdODvWK2Czh1Q7QYY=",
+      "integrity": "sha512-+zJVXs0VxC/Au+/7foiKzw8UaWvfSfPh20XhqK/6HFQiUeclL5fz05zY7G9yDAFItAKKZwB4cgpzGvxiwuG1wQ==",
+      "license": "MIT",
       "dependencies": {
         "lodash._getarray": "~2.4.1",
         "lodash._releasearray": "~2.4.1",
@@ -28155,7 +28272,8 @@
     "node_modules/lodash._basecreate": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._basecreate/-/lodash._basecreate-2.4.1.tgz",
-      "integrity": "sha1-+Ob1tXip405UEXm1a47uv0oofgg=",
+      "integrity": "sha512-8JJ3FnMPm54t3BwPLk8q8mPyQKQXm/rt9df+awr4NGtyJrtcCXM3Of1I86S6jVy1b4yAyFBb8wbKPEauuqzRmQ==",
+      "license": "MIT",
       "dependencies": {
         "lodash._isnative": "~2.4.1",
         "lodash.isobject": "~2.4.1",
@@ -28165,7 +28283,8 @@
     "node_modules/lodash._basecreatecallback": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._basecreatecallback/-/lodash._basecreatecallback-2.4.1.tgz",
-      "integrity": "sha1-fQsmdknLKeehOdAQO3wR+uhOSFE=",
+      "integrity": "sha512-SLczhg860fGW7AKlYcuOFstDtJuQhaANlJ4Y/jrOoRxhmVtK41vbJDH3OefVRSRkSCQo4HI82QVkAVsoGa5gSw==",
+      "license": "MIT",
       "dependencies": {
         "lodash._setbinddata": "~2.4.1",
         "lodash.bind": "~2.4.1",
@@ -28176,7 +28295,8 @@
     "node_modules/lodash._basecreatewrapper": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._basecreatewrapper/-/lodash._basecreatewrapper-2.4.1.tgz",
-      "integrity": "sha1-TTHy595+E0+/KAN2K4FQsyUZZm8=",
+      "integrity": "sha512-x2ja1fa/qmzbizuXgVM4QAP9svtMbdxjG8Anl9bCeDAwLOVQ1vLrA0hLb/NkpbGi9evjtkl0aWLTEoOlUdBPQA==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basecreate": "~2.4.1",
         "lodash._setbinddata": "~2.4.1",
@@ -28187,7 +28307,8 @@
     "node_modules/lodash._createwrapper": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._createwrapper/-/lodash._createwrapper-2.4.1.tgz",
-      "integrity": "sha1-UdaVeXPaTtVW43KQ2MGhjFPeFgc=",
+      "integrity": "sha512-5TCfLt1haQpsa7bgLYRKNNE4yqhO4ZxIayN1btQmazMchO6Q8JYFRMqbJ3W+uNmMm4R0Jw7KGkZX5YfDDnywuw==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basebind": "~2.4.1",
         "lodash._basecreatewrapper": "~2.4.1",
@@ -28198,7 +28319,8 @@
     "node_modules/lodash._getarray": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._getarray/-/lodash._getarray-2.4.1.tgz",
-      "integrity": "sha1-+vH3+BD6mFolHCGHQESBCUg55e4=",
+      "integrity": "sha512-iIrScwY3atGvLVbQL/+CNUznaPwBJg78S/JO4cTUFXRkRsZgEBhscB27cVoT4tsIOUyFu/5M/0umfHNGJ6wYwg==",
+      "license": "MIT",
       "dependencies": {
         "lodash._arraypool": "~2.4.1"
       }
@@ -28206,22 +28328,26 @@
     "node_modules/lodash._isnative": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._isnative/-/lodash._isnative-2.4.1.tgz",
-      "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
+      "integrity": "sha512-BOlKGKNHhCHswGOWtmVb5zBygyxN7EmTuzVOSQI6QSoGhG+kvv71gICFS1TBpnqvT1n53txK8CDK3u5D2/GZxQ==",
+      "license": "MIT"
     },
     "node_modules/lodash._maxpoolsize": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._maxpoolsize/-/lodash._maxpoolsize-2.4.1.tgz",
-      "integrity": "sha1-nUgvRjuOZq++WcLBTtsRcGAXIzQ="
+      "integrity": "sha512-xKDem1BxoIfcCtaJHotjtyfdIvZO9qrF+mv3G1+ngQmaI3MJt3Qm46i9HLk/CbzABbavUrr1/EomQT8KxtsrYA==",
+      "license": "MIT"
     },
     "node_modules/lodash._objecttypes": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._objecttypes/-/lodash._objecttypes-2.4.1.tgz",
-      "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
+      "integrity": "sha512-XpqGh1e7hhkOzftBfWE7zt+Yn9mVHFkDhicVttvKLsoCMLVVL+xTQjfjB4X4vtznauxv0QZ5ZAeqjvat0dh62Q==",
+      "license": "MIT"
     },
     "node_modules/lodash._releasearray": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._releasearray/-/lodash._releasearray-2.4.1.tgz",
-      "integrity": "sha1-phOWMNdtFTawfdyAliiJsIL2pkE=",
+      "integrity": "sha512-wwCwWX8PK/mYR5VZjcU5JFl6py/qrfLGMxzpKOfSqgA1PaZ6Z625CZLCxH1KsqyxSkOFmNm+mEYjeDpXlM4hrg==",
+      "license": "MIT",
       "dependencies": {
         "lodash._arraypool": "~2.4.1",
         "lodash._maxpoolsize": "~2.4.1"
@@ -28230,7 +28356,8 @@
     "node_modules/lodash._setbinddata": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._setbinddata/-/lodash._setbinddata-2.4.1.tgz",
-      "integrity": "sha1-98IAzRuS7yNrOZ7s9zxkjReqlNI=",
+      "integrity": "sha512-Vx0XKzpg2DFbQw4wrp1xSWd2sfl3W/BG6bucSRZmftS1AzbWRemCmBQDxyQTNhlLNec428PXkuuja+VNBZgu2A==",
+      "license": "MIT",
       "dependencies": {
         "lodash._isnative": "~2.4.1",
         "lodash.noop": "~2.4.1"
@@ -28239,7 +28366,8 @@
     "node_modules/lodash._shimkeys": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._shimkeys/-/lodash._shimkeys-2.4.1.tgz",
-      "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM=",
+      "integrity": "sha512-lBrglYxLD/6KAJ8IEa5Lg+YHgNAL7FyKqXg4XOUI+Du/vtniLs1ZqS+yHNKPkK54waAgkdUnDOYaWf+rv4B+AA==",
+      "license": "MIT",
       "dependencies": {
         "lodash._objecttypes": "~2.4.1"
       }
@@ -28247,12 +28375,14 @@
     "node_modules/lodash._slice": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash._slice/-/lodash._slice-2.4.1.tgz",
-      "integrity": "sha1-dFz0GlNZexj2iImFREBe+isG2Q8="
+      "integrity": "sha512-+odPJa4PE2UgYnQgJgkLs0UD03QU78R2ivhrFnG9GdtYOZdE6ObxOj7KiUEUlqOOgatFT+ZqSypFjDSduTigKg==",
+      "license": "MIT"
     },
     "node_modules/lodash.assign": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-2.4.1.tgz",
-      "integrity": "sha1-hMOVlt1xGBqXsGUpE6fJZ15Jsao=",
+      "integrity": "sha512-AqQ4AJz5buSx9ELXWt5dONwJyVPd4NTADMKhoVYWCugjoVf172/LpvVhwmSJn4g8/Dc0S8hxTe8rt5Dob3X9KQ==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basecreatecallback": "~2.4.1",
         "lodash._objecttypes": "~2.4.1",
@@ -28262,7 +28392,8 @@
     "node_modules/lodash.bind": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.bind/-/lodash.bind-2.4.1.tgz",
-      "integrity": "sha1-XRn6AFyMTSNvr0dCx7eh/Kvikmc=",
+      "integrity": "sha512-hn2VWYZ+N9aYncRad4jORvlGgpFrn+axnPIWRvFxjk6CWcZH5b5alI8EymYsHITI23Z9wrW/+ORq+azrVFpOfw==",
+      "license": "MIT",
       "dependencies": {
         "lodash._createwrapper": "~2.4.1",
         "lodash._slice": "~2.4.1"
@@ -28276,7 +28407,8 @@
     "node_modules/lodash.clonedeep": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-2.4.1.tgz",
-      "integrity": "sha1-8pIDtAsS/uCkXTYxZIJZvrq8eGg=",
+      "integrity": "sha512-zj5vReFLkR+lJOBKP1wyteZ13zut/KSmXtdCBgxcy/m4UTitcBxpeVZT7gwk8BQrztPI5dIgO4bhBppXV4rpTQ==",
+      "license": "MIT",
       "dependencies": {
         "lodash._baseclone": "~2.4.1",
         "lodash._basecreatecallback": "~2.4.1"
@@ -28306,7 +28438,8 @@
     "node_modules/lodash.foreach": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.foreach/-/lodash.foreach-2.4.1.tgz",
-      "integrity": "sha1-/j/Do0yGyUyrb5UiVgKCdB4BYwk=",
+      "integrity": "sha512-AvOobAkE7qBtIiHU5QHQIfveWH5Usr9pIcFIzBv7u4S6bvb3FWpFrh9ltqBY7UeL5lw6e8d+SggiUXQVyh+FpA==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basecreatecallback": "~2.4.1",
         "lodash.forown": "~2.4.1"
@@ -28315,7 +28448,8 @@
     "node_modules/lodash.forown": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.forown/-/lodash.forown-2.4.1.tgz",
-      "integrity": "sha1-eLQer+FAX6lmRZ6kGT/VAtCEUks=",
+      "integrity": "sha512-VC+CKm/zSs5t3i/MHv71HZoQphuqOvez1xhjWBwHU5zAbsCYrqwHr+MyQyMk14HzA3hSRNA5lCqDMSw5G2Qscg==",
+      "license": "MIT",
       "dependencies": {
         "lodash._basecreatecallback": "~2.4.1",
         "lodash._objecttypes": "~2.4.1",
@@ -28336,7 +28470,8 @@
     "node_modules/lodash.identity": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.identity/-/lodash.identity-2.4.1.tgz",
-      "integrity": "sha1-ZpTP+mX++TH3wxzobHRZfPVg9PE="
+      "integrity": "sha512-VRYX+8XipeLjorag5bz3YBBRJ+5kj8hVBzfnaHgXPZAVTYowBdY5l0M5ZnOmlAMCOXBFabQtm7f5VqjMKEji0w==",
+      "license": "MIT"
     },
     "node_modules/lodash.includes": {
       "version": "4.3.0",
@@ -28351,7 +28486,8 @@
     "node_modules/lodash.isarray": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-2.4.1.tgz",
-      "integrity": "sha1-tSoybB9i9tfac6MdVAHfbvRPD6E=",
+      "integrity": "sha512-yRDd0z+APziDqbk0MqR6Qfwj/Qn3jLxFJbI9U8MuvdTnqIXdZ5YXyGLnwuzCpZmjr26F1GNOjKLMMZ10i/wy6A==",
+      "license": "MIT",
       "dependencies": {
         "lodash._isnative": "~2.4.1"
       }
@@ -28364,12 +28500,15 @@
     "node_modules/lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-      "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
+      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+      "deprecated": "This package is deprecated. Use require('node:util').isDeepStrictEqual instead.",
+      "license": "MIT"
     },
     "node_modules/lodash.isfunction": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.isfunction/-/lodash.isfunction-2.4.1.tgz",
-      "integrity": "sha1-LP1XXHPkmKtX4xm3f6Aq3vE6lNE="
+      "integrity": "sha512-6XcAB3izeQxPOQQNAJbbdjXbvWEt2Pn9ezPrjr4CwoLwmqsLVbsiEXD19cmmt4mbzOCOCdHzOQiUivUOJLra7w==",
+      "license": "MIT"
     },
     "node_modules/lodash.isinteger": {
       "version": "4.0.4",
@@ -28384,7 +28523,8 @@
     "node_modules/lodash.isobject": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-2.4.1.tgz",
-      "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU=",
+      "integrity": "sha512-sTebg2a1PoicYEZXD5PBdQcTlIJ6hUslrlWr7iV0O7n+i4596s2NQ9I5CaZ5FbXSfya/9WQsrYLANUJv9paYVA==",
+      "license": "MIT",
       "dependencies": {
         "lodash._objecttypes": "~2.4.1"
       }
@@ -28402,7 +28542,8 @@
     "node_modules/lodash.keys": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-2.4.1.tgz",
-      "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc=",
+      "integrity": "sha512-ZpJhwvUXHSNL5wYd1RM6CUa2ZuqorG9ngoJ9Ix5Cce+uX7I5O/E06FCJdhSZ33b5dVyeQDnIlWH7B2s5uByZ7g==",
+      "license": "MIT",
       "dependencies": {
         "lodash._isnative": "~2.4.1",
         "lodash._shimkeys": "~2.4.1",
@@ -28423,7 +28564,8 @@
     "node_modules/lodash.noop": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.noop/-/lodash.noop-2.4.1.tgz",
-      "integrity": "sha1-T7VPgWZS5a4Q6PcvcXo4jHMmU4o="
+      "integrity": "sha512-uNcV98/blRhInPUGQEnj9ekXXfG+q+rfoNSFZgl/eBfog9yBDW9gfUv2AHX/rAF7zZRlzWhbslGhbGQFZlCkZA==",
+      "license": "MIT"
     },
     "node_modules/lodash.once": {
       "version": "4.1.1",
@@ -28433,13 +28575,14 @@
     "node_modules/lodash.sortby": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
-      "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=",
-      "dev": true
+      "integrity": "sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==",
+      "license": "MIT"
     },
     "node_modules/lodash.support": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/lodash.support/-/lodash.support-2.4.1.tgz",
-      "integrity": "sha1-Mg4LZwMWc8KNeiu12eAzGkUkBRU=",
+      "integrity": "sha512-6SwqWwGFHhTXEiqB/yQgu8FYd//tm786d49y7kizHVCJH7zdzs191UQn3ES3tkkDbUddNRfkCRYqJFHtbLnbCw==",
+      "license": "MIT",
       "dependencies": {
         "lodash._isnative": "~2.4.1"
       }
@@ -28448,7 +28591,8 @@
       "version": "4.4.2",
       "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
       "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==",
-      "dev": true
+      "dev": true,
+      "peer": true
     },
     "node_modules/lodash.union": {
       "version": "4.6.0",
@@ -28801,47 +28945,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/markdown-it": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
-      "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
-      "dependencies": {
-        "argparse": "^2.0.1",
-        "entities": "^4.4.0",
-        "linkify-it": "^5.0.0",
-        "mdurl": "^2.0.0",
-        "punycode.js": "^2.3.1",
-        "uc.micro": "^2.1.0"
-      },
-      "bin": {
-        "markdown-it": "bin/markdown-it.mjs"
-      }
-    },
-    "node_modules/markdown-it-anchor": {
-      "version": "8.6.7",
-      "resolved": "https://registry.npmjs.org/markdown-it-anchor/-/markdown-it-anchor-8.6.7.tgz",
-      "integrity": "sha512-FlCHFwNnutLgVTflOYHPW2pPcl2AACqVzExlkGQNsi4CJgqOHN7YTgDd4LuhgN1BFO3TS0vLAruV1Td6dwWPJA==",
-      "peerDependencies": {
-        "@types/markdown-it": "*",
-        "markdown-it": "*"
-      }
-    },
-    "node_modules/markdown-it/node_modules/entities": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
-      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
-      "engines": {
-        "node": ">=0.12"
-      },
-      "funding": {
-        "url": "https://github.com/fb55/entities?sponsor=1"
-      }
-    },
-    "node_modules/markdown-it/node_modules/uc.micro": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
-      "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A=="
-    },
     "node_modules/marked": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/marked/-/marked-4.1.0.tgz",
@@ -28863,19 +28966,21 @@
         "remove-accents": "0.4.2"
       }
     },
-    "node_modules/matchmediaquery": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/matchmediaquery/-/matchmediaquery-0.4.2.tgz",
-      "integrity": "sha512-wrZpoT50ehYOudhDjt/YvUJc6eUzcdFPdmbizfgvswCKNHD1/OBOHYJpHie+HXpu6bSkEGieFMYk6VuutaiRfA==",
-      "dependencies": {
-        "css-mediaquery": "^0.1.2"
-      }
-    },
     "node_modules/material-colors": {
       "version": "1.2.6",
       "resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
       "integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg==",
-      "dev": true
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
     },
     "node_modules/mathjax": {
       "version": "3.2.2",
@@ -28913,11 +29018,6 @@
       "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==",
       "dev": true
     },
-    "node_modules/mdurl": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz",
-      "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w=="
-    },
     "node_modules/media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -28938,6 +29038,13 @@
         "node": ">= 4.0.0"
       }
     },
+    "node_modules/memoize-one": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz",
+      "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/memoizee": {
       "version": "0.4.15",
       "resolved": "https://registry.npmjs.org/memoizee/-/memoizee-0.4.15.tgz",
@@ -29488,7 +29595,6 @@
       "version": "2.6.0",
       "resolved": "https://registry.npmjs.org/mime/-/mime-2.6.0.tgz",
       "integrity": "sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==",
-      "dev": true,
       "bin": {
         "mime": "cli.js"
       },
@@ -29497,9 +29603,10 @@
       }
     },
     "node_modules/mime-db": {
-      "version": "1.51.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.51.0.tgz",
-      "integrity": "sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g==",
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.6"
       }
@@ -29507,18 +29614,20 @@
     "node_modules/mime-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/mime-match/-/mime-match-1.0.2.tgz",
-      "integrity": "sha1-P4fDHprxpf1IX7nbE0Qosju7e6g=",
+      "integrity": "sha512-VXp/ugGDVh3eCLOBCiHZMYWQaTNUHv2IJrut+yXA6+JbLPXHglHwfS/5A5L0ll+jkCY7fIzRJcH6OIunF+c6Cg==",
       "dev": true,
+      "license": "ISC",
       "dependencies": {
         "wildcard": "^1.1.0"
       }
     },
     "node_modules/mime-types": {
-      "version": "2.1.34",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.34.tgz",
-      "integrity": "sha512-6cP692WwGIs9XXdOO4++N+7qjqv0rqxxVvJ3VHPh/Sc9mVZcQP+ZGhkKiTvWMQRr2tbHkJP/Yn7Y0npb3ZBs4A==",
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "license": "MIT",
       "dependencies": {
-        "mime-db": "1.51.0"
+        "mime-db": "1.52.0"
       },
       "engines": {
         "node": ">= 0.6"
@@ -29640,7 +29749,8 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
       "integrity": "sha512-UtJcAD4yEaGtjPezWuO9wC4nwUnVH/8/Im3yEHQP4b67cXlD/Qr9hdITCU1xDbSEXg2XKNaP8jsReV7vQd00/A==",
-      "dev": true
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/minimatch": {
       "version": "3.1.2",
@@ -29754,7 +29864,8 @@
     "node_modules/mkdirp-classic": {
       "version": "0.5.3",
       "resolved": "https://registry.npmjs.org/mkdirp-classic/-/mkdirp-classic-0.5.3.tgz",
-      "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A=="
+      "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==",
+      "license": "MIT"
     },
     "node_modules/mlly": {
       "version": "1.7.4",
@@ -30219,21 +30330,21 @@
       }
     },
     "node_modules/multer": {
-      "version": "1.4.5-lts.1",
-      "resolved": "https://registry.npmjs.org/multer/-/multer-1.4.5-lts.1.tgz",
-      "integrity": "sha512-ywPWvcDMeH+z9gQq5qYHCCy+ethsk4goepZ45GLD63fOu0YcNecQxi64nDs3qluZB+murG3/D4dJ7+dGctcCQQ==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/multer/-/multer-2.0.1.tgz",
+      "integrity": "sha512-Ug8bXeTIUlxurg8xLTEskKShvcKDZALo1THEX5E41pYCD2sCVub5/kIRIGqWNoqV6szyLyQKV6mD4QUrWE5GCQ==",
       "license": "MIT",
       "dependencies": {
         "append-field": "^1.0.0",
-        "busboy": "^1.0.0",
-        "concat-stream": "^1.5.2",
-        "mkdirp": "^0.5.4",
+        "busboy": "^1.6.0",
+        "concat-stream": "^2.0.0",
+        "mkdirp": "^0.5.6",
         "object-assign": "^4.1.1",
-        "type-is": "^1.6.4",
-        "xtend": "^4.0.0"
+        "type-is": "^1.6.18",
+        "xtend": "^4.0.2"
       },
       "engines": {
-        "node": ">= 6.0.0"
+        "node": ">= 10.16.0"
       }
     },
     "node_modules/multicast-dns": {
@@ -30241,6 +30352,7 @@
       "resolved": "https://registry.npmjs.org/multicast-dns/-/multicast-dns-7.2.5.tgz",
       "integrity": "sha512-2eznPJP8z2BFLX50tf0LuODrpINqP1RVIm/CObbTcBRITQgmC/TjcREF1NeTBzIcR5XO/ukWo+YHOjBbFwIupg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "dns-packet": "^5.2.2",
         "thunky": "^1.0.2"
@@ -30300,12 +30412,14 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/namespace-emitter/-/namespace-emitter-2.0.1.tgz",
       "integrity": "sha512-N/sMKHniSDJBjfrkbS/tpkPj4RAbvW3mr8UAzvlMHyun93XEm83IAvhWtJVHo+RHn/oO8Job5YN4b+wRjSVp5g==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/nan": {
-      "version": "2.17.0",
-      "resolved": "https://registry.npmjs.org/nan/-/nan-2.17.0.tgz",
-      "integrity": "sha512-2ZTgtl0nJsO0KQCjEpxcIr5D+Yv90plTitZt9JBfQvVJDS5seMl3FOvsh3+9CoYWXf/1l5OaZzzF6nDm4cagaQ=="
+      "version": "2.22.2",
+      "resolved": "https://registry.npmjs.org/nan/-/nan-2.22.2.tgz",
+      "integrity": "sha512-DANghxFkS1plDdRsX0X9pm0Z6SJNN6gBdtXfanwoZ8hooC5gosGFSBGRYHUVPz1asKA/kMRqDRdHrluZ61SpBQ==",
+      "license": "MIT"
     },
     "node_modules/nanoclone": {
       "version": "0.2.1",
@@ -30313,6 +30427,25 @@
       "integrity": "sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA==",
       "dev": true
     },
+    "node_modules/nanoid": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-4.0.2.tgz",
+      "integrity": "sha512-7ZtY5KTCNheRGfEFxnedV5zFiORN1+Y1N6zvPTnHQd8ENUvfaDBeuJDZb2bN/oXwXxu3qkTXDzy57W5vAmDTBw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.js"
+      },
+      "engines": {
+        "node": "^14 || ^16 || >=18"
+      }
+    },
     "node_modules/nanomatch": {
       "version": "1.2.13",
       "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",
@@ -30338,7 +30471,8 @@
     "node_modules/native-promise-only": {
       "version": "0.8.1",
       "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
-      "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
+      "integrity": "sha512-zkVhZUA3y8mbz652WrL5x0fB0ehrBkulWT3TomAQ9iDtyXZvzKeEA6GPxAItBYeNYl5yngKRX612qHOhvMkDeg==",
+      "license": "MIT"
     },
     "node_modules/native-request": {
       "version": "1.1.0",
@@ -30557,26 +30691,17 @@
         "node-gyp-build-optional-packages-test": "build-test.js"
       }
     },
-    "node_modules/node-gyp-build-optional-packages/node_modules/detect-libc": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.3.tgz",
-      "integrity": "sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==",
-      "license": "Apache-2.0",
-      "optional": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/node-int64": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/node-int64/-/node-int64-0.4.0.tgz",
       "integrity": "sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw=="
     },
     "node_modules/node-releases": {
-      "version": "2.0.18",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz",
-      "integrity": "sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==",
-      "dev": true
+      "version": "2.0.19",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz",
+      "integrity": "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/nodemailer": {
       "version": "6.9.9",
@@ -30901,9 +31026,13 @@
       }
     },
     "node_modules/object-inspect": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
-      "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -30945,14 +31074,16 @@
       }
     },
     "node_modules/object.assign": {
-      "version": "4.1.5",
-      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz",
-      "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==",
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+      "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.5",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
         "define-properties": "^1.2.1",
-        "has-symbols": "^1.0.3",
+        "es-object-atoms": "^1.0.0",
+        "has-symbols": "^1.1.0",
         "object-keys": "^1.1.1"
       },
       "engines": {
@@ -30963,28 +31094,32 @@
       }
     },
     "node_modules/object.entries": {
-      "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.7.tgz",
-      "integrity": "sha512-jCBs/0plmPsOnrKAfFQXRG2NFjlhZgjjcBLSmTnEhU8U6vVTsVe8ANeQJCHTl3gSsI4J+0emOoCgoKlmQPMgmA==",
+      "version": "1.1.9",
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.9.tgz",
+      "integrity": "sha512-8u/hfXFRBD1O0hPUjioLhoWFHRmt6tKA4/vZPyckBr18l1KE9uHrFaFaUi8MDRTpi4uak2goyPTSNJLXX2k2Hw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.1.1"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/object.fromentries": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.6.tgz",
-      "integrity": "sha512-VciD13dswC4j1Xt5394WR4MzmAQmlgN72phd/riNp9vtD7tp4QQWJ0R4wvclXcafgcYK8veHRed2W6XeGBvcfg==",
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.8.tgz",
+      "integrity": "sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -31009,35 +31144,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/object.getprototypeof": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/object.getprototypeof/-/object.getprototypeof-1.0.5.tgz",
-      "integrity": "sha512-4G0QiXpoIppBUz5efmxTm/HTbVN2ioGjk/PbsaNvwISFX+saj8muGp6vNuzIdsosFxM4V/kpUVNvy/+9+DVBZQ==",
+    "node_modules/object.groupby": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/object.groupby/-/object.groupby-1.0.3.tgz",
+      "integrity": "sha512-+Lhy3TQTuzXI5hevh8sBGqbmurHbbIjAi0Z4S63nthVLmLxfbj4T54a4CfZrXIrt9iP4mVAPYMo/v99taj3wjQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "reflect.getprototypeof": "^1.0.4"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2"
       },
       "engines": {
         "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
-    "node_modules/object.hasown": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/object.hasown/-/object.hasown-1.1.2.tgz",
-      "integrity": "sha512-B5UIT3J1W+WuWIU55h0mjlwaqxiE5vYENJXIXZ4VFe05pNYrkKuK0U/6aFcb0pKywYJh7IhfoqUfKVmrJJHZHw==",
-      "dev": true,
-      "dependencies": {
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/object.pick": {
@@ -31053,14 +31172,16 @@
       }
     },
     "node_modules/object.values": {
-      "version": "1.1.6",
-      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.1.6.tgz",
-      "integrity": "sha512-FVVTkD1vENCsAcwNs9k6jea2uHC/X0+JcjG8YA60FN5CMaJmG95wT9jek/xX9nornqGRrBkKtzuAu2wuHpKqvw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.1.tgz",
+      "integrity": "sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4"
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -31080,7 +31201,8 @@
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
       "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/octonode": {
       "version": "0.9.5",
@@ -31181,47 +31303,17 @@
       }
     },
     "node_modules/optionator": {
-      "version": "0.8.3",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz",
-      "integrity": "sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==",
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
+      "license": "MIT",
       "dependencies": {
-        "deep-is": "~0.1.3",
-        "fast-levenshtein": "~2.0.6",
-        "levn": "~0.3.0",
-        "prelude-ls": "~1.1.2",
-        "type-check": "~0.3.2",
-        "word-wrap": "~1.2.3"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/optionator/node_modules/levn": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
-      "integrity": "sha512-0OO4y2iOHix2W6ujICbKIaEQXvFQHue65vUG3pb5EUomzPI90z9hsA1VsO/dbIIpC53J8gxM9Q4Oho0jrCM/yA==",
-      "dependencies": {
-        "prelude-ls": "~1.1.2",
-        "type-check": "~0.3.2"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/optionator/node_modules/prelude-ls": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
-      "integrity": "sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==",
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
-    "node_modules/optionator/node_modules/type-check": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
-      "integrity": "sha512-ZCmOJdvOWDBYJlzAoFkC+Q0+bUyEOS1ltgp1MGU03fqHG+dbi9tBFU2Rd9QKiDZFAYrhPh2JUf7rZRIuHRKtOg==",
-      "dependencies": {
-        "prelude-ls": "~1.1.2"
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
       },
       "engines": {
         "node": ">= 0.8.0"
@@ -31267,6 +31359,23 @@
       "resolved": "libraries/overleaf-editor-core",
       "link": true
     },
+    "node_modules/own-keys": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+      "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+      "license": "MIT",
+      "dependencies": {
+        "get-intrinsic": "^1.2.6",
+        "object-keys": "^1.1.1",
+        "safe-push-apply": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/p-event": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/p-event/-/p-event-4.2.0.tgz",
@@ -31477,11 +31586,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/parse-duration": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/parse-duration/-/parse-duration-1.1.0.tgz",
-      "integrity": "sha512-z6t9dvSJYaPoQq7quMzdEagSFtpGu+utzHqqxmpVWNNZRIXnvqyCvn9XsTdh7c/w0Bqmdz3RB3YnRaKtpRtEXQ=="
-    },
     "node_modules/parse-json": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
@@ -31831,12 +31935,80 @@
       }
     },
     "node_modules/path-loader": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/path-loader/-/path-loader-1.0.10.tgz",
-      "integrity": "sha512-CMP0v6S6z8PHeJ6NFVyVJm6WyJjIwFvyz2b0n2/4bKdS/0uZa/9sKUlYZzubrn3zuDRU0zIuEDX9DZYQ2ZI8TA==",
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/path-loader/-/path-loader-1.0.12.tgz",
+      "integrity": "sha512-n7oDG8B+k/p818uweWrOixY9/Dsr89o2TkCm6tOTex3fpdo2+BFDgR+KpB37mGKBRsBAlR8CIJMFN0OEy/7hIQ==",
+      "license": "MIT",
       "dependencies": {
         "native-promise-only": "^0.8.1",
-        "superagent": "^3.8.3"
+        "superagent": "^7.1.6"
+      }
+    },
+    "node_modules/path-loader/node_modules/debug": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+      "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/path-loader/node_modules/formidable": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/formidable/-/formidable-2.1.5.tgz",
+      "integrity": "sha512-Oz5Hwvwak/DCaXVVUtPn4oLMLLy1CdclLKO1LFgU7XzDpVMUU5UjlSLpGMocyQNNk8F6IJW9M/YdooSn2MRI+Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@paralleldrive/cuid2": "^2.2.2",
+        "dezalgo": "^1.0.4",
+        "once": "^1.4.0",
+        "qs": "^6.11.0"
+      },
+      "funding": {
+        "url": "https://ko-fi.com/tunnckoCore/commissions"
+      }
+    },
+    "node_modules/path-loader/node_modules/semver": {
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/path-loader/node_modules/superagent": {
+      "version": "7.1.6",
+      "resolved": "https://registry.npmjs.org/superagent/-/superagent-7.1.6.tgz",
+      "integrity": "sha512-gZkVCQR1gy/oUXr+kxJMLDjla434KmSOKbx5iGD30Ql+AkJQ/YlPKECJy2nhqOsHLjGHzoDTXNSjhnvWhzKk7g==",
+      "deprecated": "Please upgrade to v9.0.0+ as we have fixed a public vulnerability with formidable dependency. Note that v9.0.0+ requires Node.js v14.18.0+. See https://github.com/ladjs/superagent/pull/1800 for insight. This project is supported and maintained by the team at Forward Email @ https://forwardemail.net",
+      "license": "MIT",
+      "dependencies": {
+        "component-emitter": "^1.3.0",
+        "cookiejar": "^2.1.3",
+        "debug": "^4.3.4",
+        "fast-safe-stringify": "^2.1.1",
+        "form-data": "^4.0.0",
+        "formidable": "^2.0.1",
+        "methods": "^1.1.2",
+        "mime": "2.6.0",
+        "qs": "^6.10.3",
+        "readable-stream": "^3.6.0",
+        "semver": "^7.3.7"
+      },
+      "engines": {
+        "node": ">=6.4.0 <13 || >=14"
       }
     },
     "node_modules/path-parse": {
@@ -31939,16 +32111,16 @@
       }
     },
     "node_modules/pdfjs-dist": {
-      "version": "4.10.38",
-      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-4.10.38.tgz",
-      "integrity": "sha512-/Y3fcFrXEAsMjJXeL9J8+ZG9U01LbuWaYypvDW2ycW1jL269L3js3DVBjDJ0Up9Np1uqDXsDrRihHANhZOlwdQ==",
+      "version": "5.1.91",
+      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.1.91.tgz",
+      "integrity": "sha512-qSIADdagooJB4wWCBnrBJjRvASevmxL0BwafvOuKJG5uTQdYoFBrhrRYnucKNiSc9qS6JIk0hC5y1yktFljXkA==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
         "node": ">=20"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas": "^0.1.65"
+        "@napi-rs/canvas": "^0.1.67"
       }
     },
     "node_modules/pend": {
@@ -32060,9 +32232,10 @@
       }
     },
     "node_modules/picocolors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.1.tgz",
-      "integrity": "sha512-anP1Z8qwhkbmu7MFP5iTt+wQKXgwzf7zTyGlcdzabySa9vd0Xt392U0rVmz9poOaBj0uHJKyyo9/upk0HrEQew=="
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "license": "ISC"
     },
     "node_modules/picomatch": {
       "version": "2.3.1",
@@ -32287,7 +32460,7 @@
     "node_modules/policyfile": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/policyfile/-/policyfile-0.0.4.tgz",
-      "integrity": "sha1-1rgurZiueeviKOLa9ZAzEeyYLk0=",
+      "integrity": "sha512-UfDtlscNialXfmVEwEPm0t/5qtM0xPK025eYWd/ilv89hxLIhVQmt3QIzMHincLO2MBtZyww0386pt13J4aIhQ==",
       "engines": {
         "node": "*"
       }
@@ -32324,9 +32497,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.38",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
-      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
+      "version": "8.5.3",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.3.tgz",
+      "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
       "funding": [
         {
           "type": "opencollective",
@@ -32341,10 +32514,11 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.7",
-        "picocolors": "^1.0.0",
-        "source-map-js": "^1.2.0"
+        "nanoid": "^3.3.8",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
       },
       "engines": {
         "node": "^10 || ^12 || >=14"
@@ -33570,15 +33744,16 @@
       "dev": true
     },
     "node_modules/postcss/node_modules/nanoid": {
-      "version": "3.3.7",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
-      "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==",
+      "version": "3.3.11",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
       "funding": [
         {
           "type": "github",
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "license": "MIT",
       "bin": {
         "nanoid": "bin/nanoid.cjs"
       },
@@ -33622,45 +33797,49 @@
       }
     },
     "node_modules/pprof": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/pprof/-/pprof-3.2.1.tgz",
-      "integrity": "sha512-KnextTM3EHQ2zqN8fUjB0VpE+njcVR7cOfo7DjJSLKzIbKTPelDtokI04ScR/Vd8CLDj+M99tsaKV+K6FHzpzA==",
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/pprof/-/pprof-4.0.0.tgz",
+      "integrity": "sha512-Yhfk7Y0G1MYsy97oXxmSG5nvbM1sCz9EALiNhW/isAv5Xf7svzP+1RfGeBlS6mLSgRJvgSLh6Mi5DaisQuPttw==",
       "hasInstallScript": true,
+      "license": "Apache-2.0",
       "dependencies": {
-        "@mapbox/node-pre-gyp": "^1.0.0",
+        "@mapbox/node-pre-gyp": "^1.0.9",
         "bindings": "^1.2.1",
         "delay": "^5.0.0",
         "findit2": "^2.2.3",
-        "nan": "^2.14.0",
+        "nan": "^2.17.0",
         "p-limit": "^3.0.0",
-        "pify": "^5.0.0",
         "protobufjs": "~7.2.4",
-        "source-map": "^0.7.3",
+        "source-map": "~0.8.0-beta.0",
         "split": "^1.0.1"
       },
       "engines": {
-        "node": ">=10.4.1"
-      }
-    },
-    "node_modules/pprof/node_modules/pify": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/pify/-/pify-5.0.0.tgz",
-      "integrity": "sha512-eW/gHNMlxdSP6dmG6uJip6FXN0EQBwm2clYYd8Wul42Cwu/DK8HEftzsapcNdYe2MfLiIwZqsDk2RDEsTE79hA==",
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
+        "node": ">=14.0.0"
       }
     },
     "node_modules/pprof/node_modules/source-map": {
-      "version": "0.7.4",
-      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz",
-      "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==",
+      "version": "0.8.0-beta.0",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.8.0-beta.0.tgz",
+      "integrity": "sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "whatwg-url": "^7.0.0"
+      },
       "engines": {
         "node": ">= 8"
       }
     },
+    "node_modules/preact": {
+      "version": "10.26.5",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.26.5.tgz",
+      "integrity": "sha512-fmpDkgfGU6JYux9teDWLhj9mKN55tyepwYbxHgQuIxbWQzgFg5vk7Mrrtfx7xRxq798ynkY4DDDxZr235Kk+4w==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/preact"
+      }
+    },
     "node_modules/precond": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/precond/-/precond-0.2.3.tgz",
@@ -33678,10 +33857,11 @@
       }
     },
     "node_modules/prettier": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
-      "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
+      "version": "3.6.2",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz",
+      "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "prettier": "bin/prettier.cjs"
       },
@@ -33788,15 +33968,6 @@
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
     },
-    "node_modules/progress": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
-      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
     "node_modules/prom-client": {
       "version": "14.1.1",
       "resolved": "https://registry.npmjs.org/prom-client/-/prom-client-14.1.1.tgz",
@@ -33884,6 +34055,7 @@
       "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
       "integrity": "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "react-is": "^16.3.2",
         "warning": "^4.0.0"
@@ -33896,16 +34068,8 @@
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "dev": true
-    },
-    "node_modules/prop-types-extra/node_modules/warning": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
       "dev": true,
-      "dependencies": {
-        "loose-envify": "^1.0.0"
-      }
+      "license": "MIT"
     },
     "node_modules/prop-types/node_modules/react-is": {
       "version": "16.13.1",
@@ -33933,17 +34097,6 @@
       "integrity": "sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==",
       "dev": true
     },
-    "node_modules/proto3-json-serializer": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/proto3-json-serializer/-/proto3-json-serializer-1.1.1.tgz",
-      "integrity": "sha512-AwAuY4g9nxx0u52DnSMkqqgyLHaW/XaPLtaAo3y/ZCfeaQB/g4YDH4kb8Wc/mWzWvu0YjOznVnfn373MVZZrgw==",
-      "dependencies": {
-        "protobufjs": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=12.0.0"
-      }
-    },
     "node_modules/protobufjs": {
       "version": "7.2.5",
       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.2.5.tgz",
@@ -33967,151 +34120,6 @@
         "node": ">=12.0.0"
       }
     },
-    "node_modules/protobufjs-cli": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/protobufjs-cli/-/protobufjs-cli-1.1.1.tgz",
-      "integrity": "sha512-VPWMgIcRNyQwWUv8OLPyGQ/0lQY/QTQAVN5fh+XzfDwsVw1FZ2L3DM/bcBf8WPiRz2tNpaov9lPZfNcmNo6LXA==",
-      "dependencies": {
-        "chalk": "^4.0.0",
-        "escodegen": "^1.13.0",
-        "espree": "^9.0.0",
-        "estraverse": "^5.1.0",
-        "glob": "^8.0.0",
-        "jsdoc": "^4.0.0",
-        "minimist": "^1.2.0",
-        "semver": "^7.1.2",
-        "tmp": "^0.2.1",
-        "uglify-js": "^3.7.7"
-      },
-      "bin": {
-        "pbjs": "bin/pbjs",
-        "pbts": "bin/pbts"
-      },
-      "engines": {
-        "node": ">=12.0.0"
-      },
-      "peerDependencies": {
-        "protobufjs": "^7.0.0"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/brace-expansion": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
-      "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/chalk?sponsor=1"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/escodegen": {
-      "version": "1.14.3",
-      "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.14.3.tgz",
-      "integrity": "sha512-qFcX0XJkdg+PB3xjZZG/wKSuT1PnQWx57+TVSjIMmILd2yC/6ByYElPwJnslDsuWuSAp4AwJGumarAAmJch5Kw==",
-      "dependencies": {
-        "esprima": "^4.0.1",
-        "estraverse": "^4.2.0",
-        "esutils": "^2.0.2",
-        "optionator": "^0.8.1"
-      },
-      "bin": {
-        "escodegen": "bin/escodegen.js",
-        "esgenerate": "bin/esgenerate.js"
-      },
-      "engines": {
-        "node": ">=4.0"
-      },
-      "optionalDependencies": {
-        "source-map": "~0.6.1"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/escodegen/node_modules/estraverse": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
-      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-      "engines": {
-        "node": ">=4.0"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/glob": {
-      "version": "8.1.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
-      "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==",
-      "deprecated": "Glob versions prior to v9 are no longer supported",
-      "dependencies": {
-        "fs.realpath": "^1.0.0",
-        "inflight": "^1.0.4",
-        "inherits": "2",
-        "minimatch": "^5.0.1",
-        "once": "^1.3.0"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/minimatch": {
-      "version": "5.1.6",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
-      "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
-      "dependencies": {
-        "brace-expansion": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/semver": {
-      "version": "7.6.2",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
-      "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/protobufjs-cli/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dependencies": {
-        "has-flag": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -34284,17 +34292,6 @@
         "pump": "^3.0.0"
       }
     },
-    "node_modules/pumpify/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
@@ -34303,14 +34300,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/punycode.js": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz",
-      "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/qrcode": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.0.tgz",
@@ -34527,12 +34516,6 @@
         }
       ]
     },
-    "node_modules/queue-tick": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/queue-tick/-/queue-tick-1.0.1.tgz",
-      "integrity": "sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==",
-      "dev": true
-    },
     "node_modules/quick-lru": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-1.1.0.tgz",
@@ -34611,12 +34594,12 @@
       }
     },
     "node_modules/react": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz",
-      "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
+      "license": "MIT",
       "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       },
       "engines": {
         "node": ">=0.10.0"
@@ -34627,6 +34610,7 @@
       "resolved": "https://registry.npmjs.org/react-async-script/-/react-async-script-1.2.0.tgz",
       "integrity": "sha512-bCpkbm9JiAuMGhkqoAiC0lLkb40DJ0HOEJIku+9JDjxX3Rcs+ztEOG13wbrOskt3n2DTrjshhaQ/iay+SnGg5Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "hoist-non-react-statics": "^3.3.0",
         "prop-types": "^15.5.0"
@@ -34636,27 +34620,35 @@
       }
     },
     "node_modules/react-bootstrap": {
-      "version": "0.33.1",
-      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-0.33.1.tgz",
-      "integrity": "sha512-qWTRravSds87P8WC82tETy2yIso8qDqlIm0czsrduCaYAFtHuyLu0XDbUlfLXeRzqgwm5sRk2wRaTNoiVkk/YQ==",
+      "version": "2.10.10",
+      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.10.10.tgz",
+      "integrity": "sha512-gMckKUqn8aK/vCnfwoBpBVFUGT9SVQxwsYrp9yDHt0arXMamxALerliKBxr1TPbntirK/HGrUAHYbAeQTa9GHQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime-corejs2": "^7.0.0",
-        "classnames": "^2.2.5",
-        "dom-helpers": "^3.2.0",
+        "@babel/runtime": "^7.24.7",
+        "@restart/hooks": "^0.4.9",
+        "@restart/ui": "^1.9.4",
+        "@types/prop-types": "^15.7.12",
+        "@types/react-transition-group": "^4.4.6",
+        "classnames": "^2.3.2",
+        "dom-helpers": "^5.2.1",
         "invariant": "^2.2.4",
-        "keycode": "^2.2.0",
-        "prop-types": "^15.6.1",
-        "prop-types-extra": "^1.0.1",
-        "react-overlays": "^0.9.0",
-        "react-prop-types": "^0.4.0",
-        "react-transition-group": "^2.0.0",
-        "uncontrollable": "^7.0.2",
-        "warning": "^3.0.0"
+        "prop-types": "^15.8.1",
+        "prop-types-extra": "^1.1.0",
+        "react-transition-group": "^4.4.5",
+        "uncontrollable": "^7.2.1",
+        "warning": "^4.0.3"
       },
       "peerDependencies": {
-        "react": ">=16.3.0",
-        "react-dom": ">=16.3.0"
+        "@types/react": ">=16.14.8",
+        "react": ">=16.14.0",
+        "react-dom": ">=16.14.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        }
       }
     },
     "node_modules/react-chartjs-2": {
@@ -34664,6 +34656,7 @@
       "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.0.1.tgz",
       "integrity": "sha512-u38C9OxynlNCBp+79grgXRs7DSJ9w8FuQ5/HO5FbYBbri8HSZW+9SWgjVshLkbXBfXnMGWakbHEtvN0nL2UG7Q==",
       "dev": true,
+      "license": "MIT",
       "peerDependencies": {
         "chart.js": "^4.0.0",
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
@@ -34674,6 +34667,7 @@
       "resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
       "integrity": "sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@icons/material": "^0.2.4",
         "lodash": "^4.17.15",
@@ -34687,6 +34681,20 @@
         "react": "*"
       }
     },
+    "node_modules/react-cookie": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-7.2.0.tgz",
+      "integrity": "sha512-mqhPERUyfOljq5yJ4woDFI33bjEtigsl8JDJdPPeNhr0eSVZmBc/2Vdf8mFxOUktQxhxTR1T+uF0/FRTZyBEgw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hoist-non-react-statics": "^3.3.5",
+        "hoist-non-react-statics": "^3.3.2",
+        "universal-cookie": "^7.0.0"
+      },
+      "peerDependencies": {
+        "react": ">= 16.3.0"
+      }
+    },
     "node_modules/react-deep-force-update": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/react-deep-force-update/-/react-deep-force-update-1.1.2.tgz",
@@ -34698,6 +34706,7 @@
       "resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-16.0.1.tgz",
       "integrity": "sha512-QeoM/i73HHu2XF9aKksIUuamHPDvRglEwdHL4jsp784BgUuWcg6mzfxT0QDdQz8Wj0qyRKx2eMg8iZtWvU4E2Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@react-dnd/invariant": "^4.0.1",
         "@react-dnd/shallowequal": "^4.0.1",
@@ -34728,6 +34737,7 @@
       "resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-16.0.1.tgz",
       "integrity": "sha512-Wu3dw5aDJmOGw8WjH1I1/yTH+vlXEL4vmjk5p+MHxP8HuHJS1lAGeIdG/hze1AvNeXWo/JgULV87LyQOr+r5jw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "dnd-core": "^16.0.1"
       }
@@ -34765,29 +34775,26 @@
       }
     },
     "node_modules/react-dom": {
-      "version": "17.0.2",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz",
-      "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
+      "license": "MIT",
       "dependencies": {
         "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "scheduler": "^0.20.2"
+        "scheduler": "^0.23.2"
       },
       "peerDependencies": {
-        "react": "17.0.2"
+        "react": "^18.3.1"
       }
     },
     "node_modules/react-error-boundary": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-2.3.2.tgz",
-      "integrity": "sha512-ZMzi7s4pj/6A/6i9RS4tG7g1PdF2Rgr4/7FTQ8sbKHex19uNji0j+xq0OS//c6TUgQRKoL6P51BNNNFmYpRMhw==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-5.0.0.tgz",
+      "integrity": "sha512-tnjAxG+IkpLephNcePNA7v6F/QpWLH8He65+DmedchDwg162JZqx4NmbXj0mlAYVVEd81OW7aFhmbsScYfiAFQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.11.2"
-      },
-      "engines": {
-        "node": ">=10",
-        "npm": ">=6"
+        "@babel/runtime": "^7.12.5"
       },
       "peerDependencies": {
         "react": ">=16.13.1"
@@ -34797,13 +34804,15 @@
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz",
       "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/react-google-recaptcha": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-3.1.0.tgz",
       "integrity": "sha512-cYW2/DWas8nEKZGD7SCu9BSuVz8iOcOLHChHyi7upUuVhkpkhYG/6N3KDiTQ3XAiZ2UAZkfvYKMfAHOzBOcGEg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "prop-types": "^15.5.0",
         "react-async-script": "^1.2.0"
@@ -34817,6 +34826,7 @@
       "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-13.3.1.tgz",
       "integrity": "sha512-JAtYREK879JXaN9GdzfBI4yJeo/XyLeXWUsRABvYXiFUakhZJ40l+kaTo+i+A/3cKIED41kS/HAbZ5BzFtq/Og==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.22.5",
         "html-parse-stringify": "^3.0.1"
@@ -34843,13 +34853,15 @@
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/react-linkify": {
       "version": "1.0.0-alpha",
       "resolved": "https://registry.npmjs.org/react-linkify/-/react-linkify-1.0.0-alpha.tgz",
       "integrity": "sha512-7gcIUvJkAXXttt1fmBK9cwn+1jTa4hbKLGCZ9J1U6EOkyb2/+LKL1Z28d9rtDLMnpvImlNlLPdTPooorl5cpmg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "linkify-it": "^2.0.3",
         "tlds": "^1.199.0"
@@ -34860,40 +34872,11 @@
       "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.2.0.tgz",
       "integrity": "sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "uc.micro": "^1.0.1"
       }
     },
-    "node_modules/react-overlays": {
-      "version": "0.9.3",
-      "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-0.9.3.tgz",
-      "integrity": "sha512-u2T7nOLnK+Hrntho4p0Nxh+BsJl0bl4Xuwj/Y0a56xywLMetgAfyjnDVrudLXsNcKGaspoC+t3C1V80W9QQTdQ==",
-      "dev": true,
-      "dependencies": {
-        "classnames": "^2.2.5",
-        "dom-helpers": "^3.2.1",
-        "prop-types": "^15.5.10",
-        "prop-types-extra": "^1.0.1",
-        "react-transition-group": "^2.2.1",
-        "warning": "^3.0.0"
-      },
-      "peerDependencies": {
-        "react": ">=16.3.0",
-        "react-dom": ">=16.3.0"
-      }
-    },
-    "node_modules/react-prop-types": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/react-prop-types/-/react-prop-types-0.4.0.tgz",
-      "integrity": "sha1-+ZsL+0AGkpya8gUefBQUpcdbk9A=",
-      "dev": true,
-      "dependencies": {
-        "warning": "^3.0.0"
-      },
-      "peerDependencies": {
-        "react": ">=0.14.0"
-      }
-    },
     "node_modules/react-proxy": {
       "version": "1.1.8",
       "resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz",
@@ -34908,6 +34891,7 @@
       "version": "7.2.9",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.9.tgz",
       "integrity": "sha512-Gx4L3uM182jEEayZfRbI/G11ZpYdNAnBs70lFVMNdHJI76XYtR+7m0MN+eAs7UHBPhWXcnFPaS+9owSCJQHNpQ==",
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.15.4",
         "@types/react-redux": "^7.1.20",
@@ -34942,34 +34926,19 @@
       "resolved": "https://registry.npmjs.org/react-resizable-panels/-/react-resizable-panels-2.1.1.tgz",
       "integrity": "sha512-+cUV/yZBYfiBj+WJtpWDJ3NtR4zgDZfHt3+xtaETKE+FCvp+RK/NJxacDQKxMHgRUTSkfA6AnGljQ5QZNsCQoA==",
       "dev": true,
+      "license": "MIT",
       "peerDependencies": {
         "react": "^16.14.0 || ^17.0.0 || ^18.0.0",
         "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0"
       }
     },
-    "node_modules/react-responsive": {
-      "version": "10.0.0",
-      "resolved": "https://registry.npmjs.org/react-responsive/-/react-responsive-10.0.0.tgz",
-      "integrity": "sha512-N6/UiRLGQyGUqrarhBZmrSmHi2FXSD++N5VbSKsBBvWfG0ZV7asvUBluSv5lSzdMyEVjzZ6Y8DL4OHABiztDOg==",
-      "dependencies": {
-        "hyphenate-style-name": "^1.0.0",
-        "matchmediaquery": "^0.4.2",
-        "prop-types": "^15.6.1",
-        "shallow-equal": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "peerDependencies": {
-        "react": ">=16.8.0"
-      }
-    },
     "node_modules/react-router": {
-      "version": "6.26.1",
-      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.26.1.tgz",
-      "integrity": "sha512-kIwJveZNwp7teQRI5QmwWo39A5bXRyqpH0COKKmPnyD2vBvDwgFXSqDUYtt1h+FEyfnE8eXr7oe0MxRzVwCcvQ==",
+      "version": "6.30.0",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.30.0.tgz",
+      "integrity": "sha512-D3X8FyH9nBcTSHGdEKurK7r8OYE1kKFn3d/CF+CoxbSHkxU7o37+Uh7eAHRXr6k2tSExXYO++07PeXJtA/dEhQ==",
+      "license": "MIT",
       "dependencies": {
-        "@remix-run/router": "1.19.1"
+        "@remix-run/router": "1.23.0"
       },
       "engines": {
         "node": ">=14.0.0"
@@ -34979,12 +34948,13 @@
       }
     },
     "node_modules/react-router-dom": {
-      "version": "6.26.1",
-      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.26.1.tgz",
-      "integrity": "sha512-veut7m41S1fLql4pLhxeSW3jlqs+4MtjRLj0xvuCEXsxusJCbs6I8yn9BxzzDX2XDgafrccY6hwjmd/bL54tFw==",
+      "version": "6.30.0",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.30.0.tgz",
+      "integrity": "sha512-x30B78HV5tFk8ex0ITwzC9TTZMua4jGyA9IUlH1JLQYQTFyxr/ZxwOJq7evg1JX1qGVUcvhsmQSKdPncQrjTgA==",
+      "license": "MIT",
       "dependencies": {
-        "@remix-run/router": "1.19.1",
-        "react-router": "6.26.1"
+        "@remix-run/router": "1.23.0",
+        "react-router": "6.30.0"
       },
       "engines": {
         "node": ">=14.0.0"
@@ -35005,19 +34975,20 @@
       }
     },
     "node_modules/react-transition-group": {
-      "version": "2.9.0",
-      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
-      "integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
+      "version": "4.4.5",
+      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
+      "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
       "dev": true,
+      "license": "BSD-3-Clause",
       "dependencies": {
-        "dom-helpers": "^3.4.0",
+        "@babel/runtime": "^7.5.5",
+        "dom-helpers": "^5.0.1",
         "loose-envify": "^1.4.0",
-        "prop-types": "^15.6.2",
-        "react-lifecycles-compat": "^3.0.4"
+        "prop-types": "^15.6.2"
       },
       "peerDependencies": {
-        "react": ">=15.0.0",
-        "react-dom": ">=15.0.0"
+        "react": ">=16.6.0",
+        "react-dom": ">=16.6.0"
       }
     },
     "node_modules/reactcss": {
@@ -35025,6 +34996,7 @@
       "resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
       "integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "lodash": "^4.0.1"
       }
@@ -35262,6 +35234,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/redis": {
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/redis/-/redis-0.7.3.tgz",
+      "integrity": "sha512-0Pgb0jOLfn6eREtEIRn/ifyZJjl2H+wUY4F/Pe7T4UhmoSrZ/1HU5ZqiBpDk8I8Wbyv2N5DpXKzbEtMj3drprg==",
+      "optional": true,
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/redis-commands": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/redis-commands/-/redis-commands-1.7.0.tgz",
@@ -35357,17 +35338,19 @@
       }
     },
     "node_modules/reflect.getprototypeof": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz",
-      "integrity": "sha512-ECkTw8TmJwW60lOTR+ZkODISW6RQ8+2CL3COqtiJKLd6MmB45hN51HprHFziKLGkAuTGQhBb91V8cy+KHlaCjw==",
-      "dev": true,
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+      "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "globalthis": "^1.0.3",
-        "which-builtin-type": "^1.1.3"
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.7",
+        "get-proto": "^1.0.1",
+        "which-builtin-type": "^1.2.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -35380,13 +35363,15 @@
       "version": "1.4.2",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz",
       "integrity": "sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/regenerate-unicode-properties": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-10.1.0.tgz",
-      "integrity": "sha512-d1VudCLoIGitcU/hEg2QqvyGZQmdC0Lf8BqdOMXGFSvJP4bNV1+XqbPQeHHLD51Jh4QJJ225dlIFvY4Ly6MXmQ==",
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-10.2.0.tgz",
+      "integrity": "sha512-DqHn3DwbmmPVzeKj9woBadqmXxLvQoQIwu7nopMc72ztvxVmVk2SBhSnx67zuye5TP+lJsb/TBQsjLKhnDf3MA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "regenerate": "^1.4.2"
       },
@@ -35404,6 +35389,7 @@
       "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.15.2.tgz",
       "integrity": "sha512-hfMp2BoF0qOk3uc5V20ALGDS2ddjQaLrdl7xrGXvAIow7qeWRM2VA2HuCHkUKk9slq3VwEwLNK3DFBqDfPGYtg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.8.4"
       }
@@ -35437,15 +35423,17 @@
       }
     },
     "node_modules/regexp.prototype.flags": {
-      "version": "1.5.2",
-      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
-      "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+      "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.6",
+        "call-bind": "^1.0.8",
         "define-properties": "^1.2.1",
         "es-errors": "^1.3.0",
-        "set-function-name": "^2.0.1"
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "set-function-name": "^2.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -35454,6 +35442,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/regexparam": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/regexparam/-/regexparam-3.0.0.tgz",
+      "integrity": "sha512-RSYAtP31mvYLkAHrOlh25pCNQ5hWnT106VukGaaFfuJrZFkGRX5GhUAdPqpSDXxOhA2c4akmRuplv1mRqnBn6Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/regexpp": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-3.2.0.tgz",
@@ -35467,15 +35465,16 @@
       }
     },
     "node_modules/regexpu-core": {
-      "version": "5.3.2",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-5.3.2.tgz",
-      "integrity": "sha512-RAM5FlZz+Lhmo7db9L298p2vHP5ZywrVXmVXpmAD9GuL5MPH6t9ROw1iA/wfHkQ76Qe7AaPF0nGuim96/IrQMQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-6.2.0.tgz",
+      "integrity": "sha512-H66BPQMrv+V16t8xtmq+UC0CBpiTBA60V8ibS1QVReIp8T1z8hwFxqcGzm9K6lgsN7sB5edVH8a+ze6Fqm4weA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@babel/regjsgen": "^0.8.0",
         "regenerate": "^1.4.2",
-        "regenerate-unicode-properties": "^10.1.0",
-        "regjsparser": "^0.9.1",
+        "regenerate-unicode-properties": "^10.2.0",
+        "regjsgen": "^0.8.0",
+        "regjsparser": "^0.12.0",
         "unicode-match-property-ecmascript": "^2.0.0",
         "unicode-match-property-value-ecmascript": "^2.1.0"
       },
@@ -35483,25 +35482,37 @@
         "node": ">=4"
       }
     },
-    "node_modules/regjsparser": {
-      "version": "0.9.1",
-      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.9.1.tgz",
-      "integrity": "sha512-dQUtn90WanSNl+7mQKcXAgZxvUe7Z0SqXlgzv0za4LwiUhyzBC58yQO3liFoUgu8GiJVInAhJjkj1N0EtQ5nkQ==",
+    "node_modules/regjsgen": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.8.0.tgz",
+      "integrity": "sha512-RvwtGe3d7LvWiDQXeQw8p5asZUmfU1G/l6WbUXeHta7Y2PEIvBTwH6E2EfmYUK8pxcxEdEmaomqyp0vZZ7C+3Q==",
       "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/regjsparser": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.12.0.tgz",
+      "integrity": "sha512-cnE+y8bz4NhMjISKbgeVJtqNbtf5QpjZP+Bslo+UqkIt9QPnX9q095eiRRASJG1/tz6dlNr6Z5NsBiWYokp6EQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
       "dependencies": {
-        "jsesc": "~0.5.0"
+        "jsesc": "~3.0.2"
       },
       "bin": {
         "regjsparser": "bin/parser"
       }
     },
     "node_modules/regjsparser/node_modules/jsesc": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
-      "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==",
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.0.2.tgz",
+      "integrity": "sha512-xKqzzWXDttJuOcawBt4KnKHHIf5oQ/Cxax+0PWFG+DFDgHNAdi+TXECADI+RYiFUMmx8792xsMbbgXj4CwnP4g==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=6"
       }
     },
     "node_modules/relateurl": {
@@ -35570,6 +35581,7 @@
       "resolved": "https://registry.npmjs.org/request/-/request-2.88.2.tgz",
       "integrity": "sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw==",
       "deprecated": "request has been deprecated, see https://github.com/request/request/issues/3142",
+      "license": "Apache-2.0",
       "dependencies": {
         "aws-sign2": "~0.7.0",
         "aws4": "^1.8.0",
@@ -35627,15 +35639,15 @@
       }
     },
     "node_modules/request/node_modules/tough-cookie": {
-      "version": "2.5.0",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.5.0.tgz",
-      "integrity": "sha512-nlLsUzgm1kfLXSXfRZMc1KLAugd4hqJHDTvc2hDIwS3mZAfMEuMbc03SujMF+GEcpaX/qboeycw6iO8JwVv2+g==",
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-5.1.2.tgz",
+      "integrity": "sha512-FVDYdxtnj0G6Qm/DhNPSb8Ju59ULcup3tuJxkFb5K8Bv2pUXILbf0xZWU8PX8Ov19OXljbUyveOFwRMwkXzO+A==",
+      "license": "BSD-3-Clause",
       "dependencies": {
-        "psl": "^1.1.28",
-        "punycode": "^2.1.1"
+        "tldts": "^6.1.32"
       },
       "engines": {
-        "node": ">=0.8"
+        "node": ">=16"
       }
     },
     "node_modules/requestretry": {
@@ -35686,14 +35698,6 @@
       "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
       "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8="
     },
-    "node_modules/requizzle": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/requizzle/-/requizzle-0.2.4.tgz",
-      "integrity": "sha512-JRrFk1D4OQ4SqovXOgdav+K8EAhSB/LJZqCz8tbX0KObcdeM15Ss59ozWMBWmmINMagCwmqn4ZNryUGpBsl6Jw==",
-      "dependencies": {
-        "lodash": "^4.17.21"
-      }
-    },
     "node_modules/reselect": {
       "version": "4.1.8",
       "resolved": "https://registry.npmjs.org/reselect/-/reselect-4.1.8.tgz",
@@ -35833,11 +35837,67 @@
       "integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==",
       "dev": true
     },
+    "node_modules/rimraf": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+      "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+      "deprecated": "Rimraf versions prior to v4 are no longer supported",
+      "license": "ISC",
+      "dependencies": {
+        "glob": "^7.1.3"
+      },
+      "bin": {
+        "rimraf": "bin.js"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/rndm": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/rndm/-/rndm-1.2.0.tgz",
       "integrity": "sha1-8z/pz7Urv9UgqhgyO8ZdsRCht2w="
     },
+    "node_modules/rollup": {
+      "version": "4.40.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.40.0.tgz",
+      "integrity": "sha512-Noe455xmA96nnqH5piFtLobsGbCij7Tu+tb3c1vYjNbTkfzGqXqQXG3wJaYXkRZuQ0vEYN4bhwg7QnIrqB5B+w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.7"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.40.0",
+        "@rollup/rollup-android-arm64": "4.40.0",
+        "@rollup/rollup-darwin-arm64": "4.40.0",
+        "@rollup/rollup-darwin-x64": "4.40.0",
+        "@rollup/rollup-freebsd-arm64": "4.40.0",
+        "@rollup/rollup-freebsd-x64": "4.40.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.40.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.40.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.40.0",
+        "@rollup/rollup-linux-arm64-musl": "4.40.0",
+        "@rollup/rollup-linux-loongarch64-gnu": "4.40.0",
+        "@rollup/rollup-linux-powerpc64le-gnu": "4.40.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.40.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.40.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.40.0",
+        "@rollup/rollup-linux-x64-gnu": "4.40.0",
+        "@rollup/rollup-linux-x64-musl": "4.40.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.40.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.40.0",
+        "@rollup/rollup-win32-x64-msvc": "4.40.0",
+        "fsevents": "~2.3.2"
+      }
+    },
     "node_modules/route-recognizer": {
       "version": "0.3.4",
       "resolved": "https://registry.npmjs.org/route-recognizer/-/route-recognizer-0.3.4.tgz",
@@ -35889,14 +35949,15 @@
       }
     },
     "node_modules/safe-array-concat": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
-      "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
+      "integrity": "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
-        "get-intrinsic": "^1.2.4",
-        "has-symbols": "^1.0.3",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "has-symbols": "^1.1.0",
         "isarray": "^2.0.5"
       },
       "engines": {
@@ -35917,6 +35978,22 @@
       "integrity": "sha512-gH8eh2nZudPQO6TytOvbxnuhYBOvDBBLW52tz5q6X58lJcd/tkmqFR+5Z9adS8aJtURSXWThWy/xJtJwixErvg==",
       "optional": true
     },
+    "node_modules/safe-push-apply": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+      "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/safe-regex": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz",
@@ -35927,14 +36004,14 @@
       }
     },
     "node_modules/safe-regex-test": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
-      "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
+      "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.6",
+        "call-bound": "^1.0.2",
         "es-errors": "^1.3.0",
-        "is-regex": "^1.1.4"
+        "is-regex": "^1.2.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -36218,12 +36295,12 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-      "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
+      "license": "MIT",
       "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
+        "loose-envify": "^1.1.0"
       }
     },
     "node_modules/schema-utils": {
@@ -36256,8 +36333,9 @@
     "node_modules/select-hose": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
-      "integrity": "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo=",
-      "dev": true
+      "integrity": "sha512-mEugaLK+YfkijB4fx0e6kImuJdCIt2LxCRcbEYPqRGCs4F2ogyfZU5IAZRdjCP8JPq2AtdNoC/Dux63d9Kiryg==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/selfsigned": {
       "version": "2.4.1",
@@ -36538,8 +36616,9 @@
     "node_modules/serve-index": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/serve-index/-/serve-index-1.9.1.tgz",
-      "integrity": "sha1-03aNabHn2C5c4FD/9bRTvqEqkjk=",
+      "integrity": "sha512-pXHfKNP4qujrtteMrSBb0rc8HJ9Ms/GrXwcUtUtD5s4ewDJI8bT3Cz2zTVRMKtri49pLx2e0Ya8ziP5Ya2pZZw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "accepts": "~1.3.4",
         "batch": "0.6.1",
@@ -36558,6 +36637,7 @@
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
       "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "ms": "2.0.0"
       }
@@ -36565,8 +36645,9 @@
     "node_modules/serve-index/node_modules/http-errors": {
       "version": "1.6.3",
       "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.6.3.tgz",
-      "integrity": "sha1-i1VoC7S+KDoLW/TqLjhYC+HZMg0=",
+      "integrity": "sha512-lks+lVC8dgGyh97jxvxeYTWQFvh4uw4yC12gVl63Cg30sjPX4wuGcdkICVXDAESr6OJGjqGA8Iz5mkeN6zlD7A==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "depd": "~1.1.2",
         "inherits": "2.0.3",
@@ -36580,20 +36661,23 @@
     "node_modules/serve-index/node_modules/inherits": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
-      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
-      "dev": true
+      "integrity": "sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==",
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/serve-index/node_modules/ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
+      "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/serve-index/node_modules/setprototypeof": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.1.0.tgz",
       "integrity": "sha512-BvE/TwpZX4FXExxOxZyRGQQv651MSwmWKZGqvmPcRIjDqWub67kTKuIMx43cZZrS/cBBzwBcNDWoFxt2XEFIpQ==",
-      "dev": true
+      "dev": true,
+      "license": "ISC"
     },
     "node_modules/serve-static": {
       "version": "1.16.2",
@@ -36645,13 +36729,29 @@
       }
     },
     "node_modules/set-function-name": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
-      "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
+      "license": "MIT",
       "dependencies": {
-        "define-data-property": "^1.0.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
         "functions-have-names": "^1.2.3",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/set-proto": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+      "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -36724,11 +36824,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/shallow-equal": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-3.1.0.tgz",
-      "integrity": "sha512-pfVOw8QZIXpMbhBWvzBISicvToTiM5WBF1EeAUZDDSb5Dt29yl4AYbyywbJFSEsRUMr7gJaxqCdr4L3tQf9wVg=="
-    },
     "node_modules/shebang-command": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -36749,10 +36844,14 @@
       }
     },
     "node_modules/shell-quote": {
-      "version": "1.8.1",
-      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.1.tgz",
-      "integrity": "sha512-6j1W9l1iAs/4xYBI1SYOVZyFcCis9b4KCLQ8fgAGG07QvzaRLVVRQvAy85yNmmZSjYjg4MWh4gNvlPujU/5LpA==",
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/shell-quote/-/shell-quote-1.8.2.tgz",
+      "integrity": "sha512-AzqKpGKjrj7EM6rKVQEPpB288oCfnrEIuyoT9cyF4nmGa7V8Zk6f7RRqYisX8X9m+Q7bd632aZW4ky7EhbQztA==",
       "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -36763,14 +36862,69 @@
       "integrity": "sha512-sQTKC1Re/rM6XyFM6fIAGHRPVGvyXfgzIDvzoq608vM+jeyVD0Tu1E6Np0Kc2zAIFWIj963V2800iF/9LPieQw=="
     },
     "node_modules/side-channel": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
-      "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
         "es-errors": "^1.3.0",
-        "get-intrinsic": "^1.2.4",
-        "object-inspect": "^1.13.1"
+        "object-inspect": "^1.13.3",
+        "side-channel-list": "^1.0.0",
+        "side-channel-map": "^1.0.1",
+        "side-channel-weakmap": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-list": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
+      "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-map": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-weakmap": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3",
+        "side-channel-map": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -36785,6 +36939,13 @@
       "integrity": "sha512-Rtlj66/b0ICeFzYTuNvX/EF1igRbbnGSvEyT79McoZa/DeGhMyC5pWKOEsZKnpkqtSeovd5FL/bjHWC3CIIvCQ==",
       "license": "MIT"
     },
+    "node_modules/siginfo": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
+      "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/sigmund": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz",
@@ -37204,8 +37365,8 @@
       }
     },
     "node_modules/socket.io": {
-      "version": "0.9.19-overleaf-10",
-      "resolved": "git+ssh://git@github.com/overleaf/socket.io.git#7ac322c2a5b26a4647834868d78afbb0db1f8849",
+      "version": "0.9.19-overleaf-12",
+      "resolved": "git+ssh://git@github.com/overleaf/socket.io.git#7814a16800a7accb646bd34ed0995cd474fb82f6",
       "dependencies": {
         "base64id": "0.1.0",
         "policyfile": "0.0.4"
@@ -37237,20 +37398,12 @@
         "ultron": "1.0.x"
       }
     },
-    "node_modules/socket.io/node_modules/redis": {
-      "version": "0.7.3",
-      "resolved": "https://registry.npmjs.org/redis/-/redis-0.7.3.tgz",
-      "integrity": "sha512-0Pgb0jOLfn6eREtEIRn/ifyZJjl2H+wUY4F/Pe7T4UhmoSrZ/1HU5ZqiBpDk8I8Wbyv2N5DpXKzbEtMj3drprg==",
-      "optional": true,
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/sockjs": {
       "version": "0.3.24",
       "resolved": "https://registry.npmjs.org/sockjs/-/sockjs-0.3.24.tgz",
       "integrity": "sha512-GJgLTZ7vYb/JtPSSZ10hsOYIvEYsjbNU+zPdIHcUaWVNUEPivzxku31865sSSud0Da0W4lEeOPlmw93zLQchuQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "faye-websocket": "^0.11.3",
         "uuid": "^8.3.2",
@@ -37262,6 +37415,7 @@
       "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz",
       "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "uuid": "dist/bin/uuid"
       }
@@ -37308,9 +37462,10 @@
       }
     },
     "node_modules/source-map-js": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
-      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -37348,7 +37503,8 @@
     "node_modules/spark-md5": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/spark-md5/-/spark-md5-3.0.2.tgz",
-      "integrity": "sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw=="
+      "integrity": "sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw==",
+      "license": "(WTFPL OR MIT)"
     },
     "node_modules/sparse-bitfield": {
       "version": "3.0.3",
@@ -37395,6 +37551,7 @@
       "resolved": "https://registry.npmjs.org/spdy/-/spdy-4.0.2.tgz",
       "integrity": "sha512-r46gZQZQV+Kl9oItvl1JZZqJKGr+oEkB08A6BzkiR7593/7IbtuncXHd2YoYeTsG4157ZssMu9KYvUHLcjcDoA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "debug": "^4.1.0",
         "handle-thing": "^2.0.0",
@@ -37411,6 +37568,7 @@
       "resolved": "https://registry.npmjs.org/spdy-transport/-/spdy-transport-3.0.0.tgz",
       "integrity": "sha512-hsLVFE5SjA6TCisWeJXFKniGGOpBgMLmerfO2aCyCU5s7nJ/rpAepqmFifv/GCbSbueEeAJJnmSQ2rKC/g8Fcw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "debug": "^4.1.0",
         "detect-node": "^2.0.4",
@@ -37424,6 +37582,7 @@
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/split/-/split-1.0.1.tgz",
       "integrity": "sha512-mTyOoPbrivtXnwnIxZRFYRrPNtEFKlpB2fvjSnCQUiAA6qAZzqwna5envK4uk6OIeP17CsdF3rSBGYVBsU0Tkg==",
+      "license": "MIT",
       "dependencies": {
         "through": "2"
       },
@@ -37434,7 +37593,8 @@
     "node_modules/split-ca": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/split-ca/-/split-ca-1.0.1.tgz",
-      "integrity": "sha1-bIOv82kvphJW4M0ZfgXp3hV2kaY="
+      "integrity": "sha512-Q5thBSxp5t8WPTTJQS59LrGqOZqOsrhDGDVm8azCqIBjSBd7nd9o2PM+mDulQQkh8h//4U6hFZnc/mul8t5pWQ==",
+      "license": "ISC"
     },
     "node_modules/split-string": {
       "version": "3.1.0",
@@ -37470,28 +37630,20 @@
       }
     },
     "node_modules/ssh2": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.6.0.tgz",
-      "integrity": "sha512-lxc+uvXqOxyQ99N2M7k5o4pkYDO5GptOTYduWw7hIM41icxvoBcCNHcj+LTKrjkL0vFcAl+qfZekthoSFRJn2Q==",
+      "version": "1.16.0",
+      "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.16.0.tgz",
+      "integrity": "sha512-r1X4KsBGedJqo7h8F5c4Ybpcr5RjyP+aWIG007uBPRjmdQWfEiVLzSK71Zji1B9sKxwaCvD8y8cwSkYrlLiRRg==",
       "hasInstallScript": true,
       "dependencies": {
-        "asn1": "^0.2.4",
+        "asn1": "^0.2.6",
         "bcrypt-pbkdf": "^1.0.2"
       },
       "engines": {
         "node": ">=10.16.0"
       },
       "optionalDependencies": {
-        "cpu-features": "0.0.2",
-        "nan": "^2.15.0"
-      }
-    },
-    "node_modules/ssh2/node_modules/asn1": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
-      "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
-      "dependencies": {
-        "safer-buffer": "~2.1.0"
+        "cpu-features": "~0.0.10",
+        "nan": "^2.20.0"
       }
     },
     "node_modules/sshpk": {
@@ -37518,14 +37670,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/sshpk/node_modules/asn1": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
-      "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
-      "dependencies": {
-        "safer-buffer": "~2.1.0"
-      }
-    },
     "node_modules/sshpk/node_modules/assert-plus": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
@@ -37543,11 +37687,19 @@
         "node": "*"
       }
     },
+    "node_modules/stackback": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
+      "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/stackframe": {
       "version": "1.3.4",
       "resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.3.4.tgz",
       "integrity": "sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/standard-as-callback": {
       "version": "2.1.0",
@@ -37600,26 +37752,34 @@
         "node": ">= 0.6"
       }
     },
-    "node_modules/stop-iteration-iterator": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.0.0.tgz",
-      "integrity": "sha512-iCGQj+0l0HOdZ2AEeBADlsRC+vsnDsZsbdSiH1yNSjcfKM7fdpCMfqAL/dwF5BLiw/XhRft/Wax6zQbhq2BcjQ==",
+    "node_modules/std-env": {
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.9.0.tgz",
+      "integrity": "sha512-UGvjygr6F6tpH7o2qyqR6QYpwraIjKSdtzyBdyytFOHmPZY917kwdwLG0RbOjWOnKmnm3PeHjaoLLMie7kPLQw==",
       "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/stop-iteration-iterator": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+      "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+      "license": "MIT",
       "dependencies": {
-        "internal-slot": "^1.0.4"
+        "es-errors": "^1.3.0",
+        "internal-slot": "^1.1.0"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/storybook": {
-      "version": "8.6.4",
-      "resolved": "https://registry.npmjs.org/storybook/-/storybook-8.6.4.tgz",
-      "integrity": "sha512-XXh1Acvf1r3BQX0BDLQw6yhZ7yUGvYxIcKOBuMdetnX7iXtczipJTfw0uyFwk0ltkKEE9PpJvivYmARF3u64VQ==",
+      "version": "8.6.12",
+      "resolved": "https://registry.npmjs.org/storybook/-/storybook-8.6.12.tgz",
+      "integrity": "sha512-Z/nWYEHBTLK1ZBtAWdhxC0l5zf7ioJ7G4+zYqtTdYeb67gTnxNj80gehf8o8QY9L2zA2+eyMRGLC2V5fI7Z3Tw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@storybook/core": "8.6.4"
+        "@storybook/core": "8.6.12"
       },
       "bin": {
         "getstorybook": "bin/index.cjs",
@@ -37687,13 +37847,16 @@
       }
     },
     "node_modules/streamx": {
-      "version": "2.15.1",
-      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.15.1.tgz",
-      "integrity": "sha512-fQMzy2O/Q47rgwErk/eGeLu/roaFWV0jVsogDmrszM9uIw8L5OA+t+V93MgYlufNptfjmYR1tOMWhei/Eh7TQA==",
-      "dev": true,
+      "version": "2.22.0",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.22.0.tgz",
+      "integrity": "sha512-sLh1evHOzBy/iWRiR6d1zRcLao4gGZr3C1kzNz4fopCOKJb6xD9ub8Mpi9Mr1R6id5o43S+d93fI48UC5uM9aw==",
+      "license": "MIT",
       "dependencies": {
-        "fast-fifo": "^1.1.0",
-        "queue-tick": "^1.0.1"
+        "fast-fifo": "^1.3.2",
+        "text-decoder": "^1.1.0"
+      },
+      "optionalDependencies": {
+        "bare-events": "^2.2.0"
       }
     },
     "node_modules/string_decoder": {
@@ -37756,35 +37919,73 @@
         "node": ">=8"
       }
     },
-    "node_modules/string.prototype.matchall": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.8.tgz",
-      "integrity": "sha512-6zOCOcJ+RJAQshcTvXPHoxoQGONa3e/Lqx90wUA+wEzX78sg5Bo+1tQo4N0pohS0erG9qtCqJDjNCQBjeWVxyg==",
+    "node_modules/string.prototype.includes": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/string.prototype.includes/-/string.prototype.includes-2.0.1.tgz",
+      "integrity": "sha512-o7+c9bW6zpAdJHTtujeePODAhkuicdAryFsfVKwA+wGw89wJ4GTY484WTucM9hLtDEOpOvI+aHnzqnC5lHp4Rg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.1.4",
-        "es-abstract": "^1.20.4",
-        "get-intrinsic": "^1.1.3",
-        "has-symbols": "^1.0.3",
-        "internal-slot": "^1.0.3",
-        "regexp.prototype.flags": "^1.4.3",
-        "side-channel": "^1.0.4"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/string.prototype.matchall": {
+      "version": "4.0.12",
+      "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.12.tgz",
+      "integrity": "sha512-6CC9uyBL+/48dYizRf7H7VAYCMCNTBeM78x/VTUe9bFEaxBepPJDa1Ow99LqI/1yF7kuy7Q3cQsYMrcjGUcskA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.6",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.6",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "internal-slot": "^1.1.0",
+        "regexp.prototype.flags": "^1.5.3",
+        "set-function-name": "^2.0.2",
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/string.prototype.trim": {
-      "version": "1.2.9",
-      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
-      "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==",
+    "node_modules/string.prototype.repeat": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.repeat/-/string.prototype.repeat-1.0.0.tgz",
+      "integrity": "sha512-0u/TldDbKD8bFCQ/4f5+mNRrXwZ8hg2w7ZR8wa16e8z9XpePWl3eGEcUD0OXpEH/VJH/2G3gjUtR3ZOiBe2S/w==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "define-properties": "^1.1.3",
+        "es-abstract": "^1.17.5"
+      }
+    },
+    "node_modules/string.prototype.trim": {
+      "version": "1.2.10",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz",
+      "integrity": "sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "define-data-property": "^1.1.4",
         "define-properties": "^1.2.1",
-        "es-abstract": "^1.23.0",
-        "es-object-atoms": "^1.0.0"
+        "es-abstract": "^1.23.5",
+        "es-object-atoms": "^1.0.0",
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -37794,15 +37995,19 @@
       }
     },
     "node_modules/string.prototype.trimend": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz",
-      "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==",
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz",
+      "integrity": "sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
         "define-properties": "^1.2.1",
         "es-object-atoms": "^1.0.0"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -37893,19 +38098,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/stripe": {
-      "version": "17.7.0",
-      "resolved": "https://registry.npmjs.org/stripe/-/stripe-17.7.0.tgz",
-      "integrity": "sha512-aT2BU9KkizY9SATf14WhhYVv2uOapBWX0OFWF4xvcj1mPaNotlSc2CsxpS4DS46ZueSppmCF5BX1sNYBtwBvfw==",
-      "license": "MIT",
-      "dependencies": {
-        "@types/node": ">=8.1.0",
-        "qs": "^6.11.0"
-      },
-      "engines": {
-        "node": ">=12.*"
-      }
-    },
     "node_modules/strnum": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/strnum/-/strnum-1.0.5.tgz",
@@ -38304,7 +38496,8 @@
       "version": "3.8.3",
       "resolved": "https://registry.npmjs.org/superagent/-/superagent-3.8.3.tgz",
       "integrity": "sha512-GLQtLMCoEIK4eDv6OGtkOoSMt3D+oq0y3dsxMuYuDvaNUvuT8eFBuLmfR0iYYzHC1e8hpzC6ZsxbuP6DIalMFA==",
-      "deprecated": "Please upgrade to v7.0.2+ of superagent.  We have fixed numerous issues with streams, form-data, attach(), filesystem errors not bubbling up (ENOENT on attach()), and all tests are now passing.  See the releases tab for more information at <https://github.com/visionmedia/superagent/releases>. Thanks to @shadowgate15, @spence-s, and @niftylettuce. Superagent is sponsored by Forward Email at <https://forwardemail.net>.",
+      "deprecated": "Please upgrade to v9.0.0+ as we have fixed a public vulnerability with formidable dependency. Note that v9.0.0+ requires Node.js v14.18.0+. See https://github.com/ladjs/superagent/pull/1800 for insight. This project is supported and maintained by the team at Forward Email @ https://forwardemail.net",
+      "license": "MIT",
       "dependencies": {
         "component-emitter": "^1.2.0",
         "cookiejar": "^2.1.0",
@@ -38325,32 +38518,58 @@
       "version": "3.2.7",
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
       "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
+      "license": "MIT",
       "dependencies": {
         "ms": "^2.1.1"
       }
     },
     "node_modules/superagent/node_modules/form-data": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.1.tgz",
-      "integrity": "sha512-m21N3WOmEEURgk6B9GLOE4RuWOFf28Lhh9qGYeNlGq4VDXUlJy2th2slBNU8Gp8EzloYZOibZJ7t5ecIrFSjVA==",
+      "version": "2.5.3",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.3.tgz",
+      "integrity": "sha512-XHIrMD0NpDrNM/Ckf7XJiBbLl57KEhT3+i3yY+eWm+cqYZJQTZrKo8Y8AWKnuV5GT4scfuUGt9LzNoIx3dU1nQ==",
+      "license": "MIT",
       "dependencies": {
         "asynckit": "^0.4.0",
-        "combined-stream": "^1.0.6",
-        "mime-types": "^2.1.12"
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "mime-types": "^2.1.35",
+        "safe-buffer": "^5.2.1"
       },
       "engines": {
         "node": ">= 0.12"
       }
     },
+    "node_modules/superagent/node_modules/form-data/node_modules/safe-buffer": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/superagent/node_modules/isarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+      "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
+      "license": "MIT"
     },
     "node_modules/superagent/node_modules/mime": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+      "license": "MIT",
       "bin": {
         "mime": "cli.js"
       },
@@ -38359,9 +38578,10 @@
       }
     },
     "node_modules/superagent/node_modules/readable-stream": {
-      "version": "2.3.7",
-      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
-      "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
+      "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
+      "license": "MIT",
       "dependencies": {
         "core-util-is": "~1.0.0",
         "inherits": "~2.0.3",
@@ -38376,6 +38596,7 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+      "license": "MIT",
       "dependencies": {
         "safe-buffer": "~5.1.0"
       }
@@ -38599,11 +38820,6 @@
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.3.2.tgz",
       "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
     },
-    "node_modules/swagger-client/node_modules/traverse": {
-      "version": "0.6.6",
-      "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.6.6.tgz",
-      "integrity": "sha1-y99WD9e5r2MlAv7UD5GMFX6pcTc="
-    },
     "node_modules/swagger-client/node_modules/url": {
       "version": "0.11.0",
       "resolved": "https://registry.npmjs.org/url/-/url-0.11.0.tgz",
@@ -38616,7 +38832,8 @@
     "node_modules/swagger-converter": {
       "version": "0.1.7",
       "resolved": "https://registry.npmjs.org/swagger-converter/-/swagger-converter-0.1.7.tgz",
-      "integrity": "sha1-oJdRnG8e5N1n4wjZtT3cnCslf5c=",
+      "integrity": "sha512-O2hZbWqq8x6j0uZ4qWj5dw45WPoAxKsJLJZqOgTqRtPNi8IqA+rDkDV/48S8qanS3KGv1QcVoPNLivMbyHHdAQ==",
+      "license": "MIT",
       "dependencies": {
         "lodash.clonedeep": "^2.4.1"
       }
@@ -38667,12 +38884,6 @@
         "lodash": "^4.17.14"
       }
     },
-    "node_modules/swagger-tools/node_modules/commander": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
-      "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ==",
-      "license": "MIT"
-    },
     "node_modules/swagger-tools/node_modules/debug": {
       "version": "3.2.7",
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
@@ -38698,7 +38909,8 @@
     "node_modules/swagger-tools/node_modules/path-to-regexp": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-3.3.0.tgz",
-      "integrity": "sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw=="
+      "integrity": "sha512-qyCH421YQPS2WFDxDjftfc1ZR5WKQzVzqsp4n9M2kQhVOo/ByahFoUNJfl58kOcEGfQ//7weFTDhm+ss8Ecxgw==",
+      "license": "MIT"
     },
     "node_modules/symbol-tree": {
       "version": "3.2.4",
@@ -38711,6 +38923,7 @@
       "resolved": "https://registry.npmjs.org/table/-/table-6.8.2.tgz",
       "integrity": "sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "ajv": "^8.0.1",
         "lodash.truncate": "^4.4.2",
@@ -38727,6 +38940,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz",
       "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.1",
         "json-schema-traverse": "^1.0.0",
@@ -38742,7 +38956,8 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
-      "dev": true
+      "dev": true,
+      "peer": true
     },
     "node_modules/tapable": {
       "version": "2.2.1",
@@ -38770,14 +38985,28 @@
       }
     },
     "node_modules/tar-fs": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.0.1.tgz",
-      "integrity": "sha512-6tzWDMeroL87uF/+lin46k+Q+46rAJ0SyPGz7OW7wTgblI273hsBqk2C1j0/xNadNLKDTUL9BukSjB7cwgmlPA==",
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.9.tgz",
+      "integrity": "sha512-XF4w9Xp+ZQgifKakjZYmFdkLoSWd34VGKcsTCwlNWM7QG3ZbaxnTsaBwnjFZqHRf/rROxaR8rXnbtwdvaDI+lA==",
+      "license": "MIT",
       "dependencies": {
-        "chownr": "^1.1.1",
-        "mkdirp-classic": "^0.5.2",
         "pump": "^3.0.0",
-        "tar-stream": "^2.0.0"
+        "tar-stream": "^3.1.5"
+      },
+      "optionalDependencies": {
+        "bare-fs": "^4.0.1",
+        "bare-path": "^3.0.0"
+      }
+    },
+    "node_modules/tar-fs/node_modules/tar-stream": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
+      "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
+      "license": "MIT",
+      "dependencies": {
+        "b4a": "^1.6.4",
+        "fast-fifo": "^1.2.0",
+        "streamx": "^2.15.0"
       }
     },
     "node_modules/tar-stream": {
@@ -39039,6 +39268,15 @@
         "node": ">=8"
       }
     },
+    "node_modules/text-decoder": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.2.3.tgz",
+      "integrity": "sha512-3/o9z3X0X0fTupwsYvR03pJ/DjWuqqrfwBgTQzdWDiQSm9KitAyz/9WqsT2JQW7KV2m+bC2ol/zqpW37NHxLaA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "b4a": "^1.6.4"
+      }
+    },
     "node_modules/text-table": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
@@ -39205,7 +39443,8 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
       "integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/tildify": {
       "version": "2.0.0",
@@ -39265,13 +39504,22 @@
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
       "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinybench": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
+      "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/tinycolor2": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.6.0.tgz",
       "integrity": "sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/tinyexec": {
       "version": "0.3.2",
@@ -39280,6 +39528,61 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/tinyglobby": {
+      "version": "0.2.13",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz",
+      "integrity": "sha512-mEwzpUgrLySlveBwEVDMKk5B57bhLPYovRfPAXD5gA/98Opn0rCDj3GtLwFvCvH5RK9uPCExUROW5NjDwvqkxw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.4.4",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/tinyglobby/node_modules/fdir": {
+      "version": "6.4.4",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
+      "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/tinyglobby/node_modules/picomatch": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
+      "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/tinypool": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-1.0.2.tgz",
+      "integrity": "sha512-al6n+QEANGFOMf/dmUMsuS5/r9B06uwlyNjZZql/zv8J7ybHCgoihBNORZCY2mzUuAnomQa2JdhyHKzZxPCrFA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      }
+    },
     "node_modules/tinyrainbow": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-1.2.0.tgz",
@@ -39301,24 +39604,38 @@
       }
     },
     "node_modules/tlds": {
-      "version": "1.228.0",
-      "resolved": "https://registry.npmjs.org/tlds/-/tlds-1.228.0.tgz",
-      "integrity": "sha512-Q0TU9zh5hDs2CpRFNM7SOW3K7OSgUgJC/cMrq9t44ei4tu+G3KV8BZyIJuYVvryJHH96mKgc9WXdhgKVvGD7jg==",
+      "version": "1.256.0",
+      "resolved": "https://registry.npmjs.org/tlds/-/tlds-1.256.0.tgz",
+      "integrity": "sha512-ZmyVB9DAw+FFTmLElGYJgdZFsKLYd/I59Bg9NHkCGPwAbVZNRilFWDMAdX8UG+bHuv7kfursd5XGqo/9wi26lA==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "tlds": "bin.js"
       }
     },
-    "node_modules/tmatch": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/tmatch/-/tmatch-2.0.1.tgz",
-      "integrity": "sha512-OHn/lzGWAsh5MBNTXUiHc595HAbIASCs6M+hDrkMObbSzsXej0SCKrQxr4J6EmRHbdo3qwyetPzuzEktkZiy4g==",
-      "dev": true
+    "node_modules/tldts": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.86.tgz",
+      "integrity": "sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==",
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^6.1.86"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/tldts-core": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.86.tgz",
+      "integrity": "sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==",
+      "license": "MIT"
     },
     "node_modules/tmp": {
       "version": "0.2.3",
       "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.3.tgz",
       "integrity": "sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==",
+      "dev": true,
       "engines": {
         "node": ">=14.14"
       }
@@ -39505,21 +39822,21 @@
     "node_modules/tr46": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/tr46/-/tr46-1.0.1.tgz",
-      "integrity": "sha1-qLE/1r/SSJUZZ0zN5VujaTtwbQk=",
-      "dev": true,
+      "integrity": "sha512-dTpowEjclQ7Kgx5SdBkqRzVhERQXov8/l9Ft9dVM9fmg0W0KQSVaXX9T4i6twCPNtYiZM53lpSSUAwJbFPOHxA==",
+      "license": "MIT",
       "dependencies": {
         "punycode": "^2.1.0"
       }
     },
     "node_modules/traverse": {
-      "version": "0.6.9",
-      "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.6.9.tgz",
-      "integrity": "sha512-7bBrcF+/LQzSgFmT0X5YclVqQxtv7TDJ1f8Wj7ibBu/U6BMLeOpUxuZjV7rMc44UtKxlnMFigdhFAIszSX1DMg==",
+      "version": "0.6.11",
+      "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.6.11.tgz",
+      "integrity": "sha512-vxXDZg8/+p3gblxB6BhhG5yWVn1kGRlaL8O78UDXc3wRnPizB5g83dcvWV1jpDMIPnjZjOFuxlMmE82XJ4407w==",
       "license": "MIT",
       "dependencies": {
-        "gopd": "^1.0.1",
-        "typedarray.prototype.slice": "^1.0.3",
-        "which-typed-array": "^1.1.15"
+        "gopd": "^1.2.0",
+        "typedarray.prototype.slice": "^1.0.5",
+        "which-typed-array": "^1.1.18"
       },
       "engines": {
         "node": ">= 0.4"
@@ -39568,13 +39885,14 @@
       }
     },
     "node_modules/tsconfig-paths": {
-      "version": "3.14.1",
-      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz",
-      "integrity": "sha512-fxDhWnFSLt3VuTwtvJt5fpwxBHg5AdKWMsgcPOOIilyjymcYVZoCQF8fvFRezCNfblEXmi+PcM1eYHeOAgXCOQ==",
+      "version": "3.15.0",
+      "resolved": "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz",
+      "integrity": "sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@types/json5": "^0.0.29",
-        "json5": "^1.0.1",
+        "json5": "^1.0.2",
         "minimist": "^1.2.6",
         "strip-bom": "^3.0.0"
       }
@@ -39592,9 +39910,10 @@
       }
     },
     "node_modules/tslib": {
-      "version": "2.5.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.2.tgz",
-      "integrity": "sha512-5svOrSA2w3iGFDs1HibEVBGbDrAY82bFQ3HZ3ixB+88nsbsWQoKqDRb5UBYAUPEzbBn6dAp5gRNXglySbx1MlA=="
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
     },
     "node_modules/tsscmp": {
       "version": "1.0.6",
@@ -39675,30 +39994,30 @@
       }
     },
     "node_modules/typed-array-buffer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
-      "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bound": "^1.0.3",
         "es-errors": "^1.3.0",
-        "is-typed-array": "^1.1.13"
+        "is-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/typed-array-byte-length": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
-      "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+      "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bind": "^1.0.8",
         "for-each": "^0.3.3",
-        "gopd": "^1.0.1",
-        "has-proto": "^1.0.3",
-        "is-typed-array": "^1.1.13"
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
@@ -39708,17 +40027,18 @@
       }
     },
     "node_modules/typed-array-byte-offset": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
-      "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+      "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
       "license": "MIT",
       "dependencies": {
         "available-typed-arrays": "^1.0.7",
-        "call-bind": "^1.0.7",
+        "call-bind": "^1.0.8",
         "for-each": "^0.3.3",
-        "gopd": "^1.0.1",
-        "has-proto": "^1.0.3",
-        "is-typed-array": "^1.1.13"
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.15",
+        "reflect.getprototypeof": "^1.0.9"
       },
       "engines": {
         "node": ">= 0.4"
@@ -39728,17 +40048,17 @@
       }
     },
     "node_modules/typed-array-length": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz",
-      "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.7.tgz",
+      "integrity": "sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==",
       "license": "MIT",
       "dependencies": {
         "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
         "gopd": "^1.0.1",
-        "has-proto": "^1.0.3",
         "is-typed-array": "^1.1.13",
-        "possible-typed-array-names": "^1.0.0"
+        "possible-typed-array-names": "^1.0.0",
+        "reflect.getprototypeof": "^1.0.6"
       },
       "engines": {
         "node": ">= 0.4"
@@ -39753,17 +40073,19 @@
       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
     },
     "node_modules/typedarray.prototype.slice": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/typedarray.prototype.slice/-/typedarray.prototype.slice-1.0.3.tgz",
-      "integrity": "sha512-8WbVAQAUlENo1q3c3zZYuy5k9VzBQvp8AX9WOtbvyWlLM1v5JaSRmjubLjzHF4JFtptjH/5c/i95yaElvcjC0A==",
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/typedarray.prototype.slice/-/typedarray.prototype.slice-1.0.5.tgz",
+      "integrity": "sha512-q7QNVDGTdl702bVFiI5eY4l/HkgCM6at9KhcFbgUAzezHFbOVy4+0O/lCjsABEQwbZPravVfBIiBVGo89yzHFg==",
       "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.7",
+        "call-bind": "^1.0.8",
         "define-properties": "^1.2.1",
-        "es-abstract": "^1.23.0",
+        "es-abstract": "^1.23.9",
         "es-errors": "^1.3.0",
-        "typed-array-buffer": "^1.0.2",
-        "typed-array-byte-offset": "^1.0.2"
+        "get-proto": "^1.0.1",
+        "math-intrinsics": "^1.1.0",
+        "typed-array-buffer": "^1.0.3",
+        "typed-array-byte-offset": "^1.0.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -39773,10 +40095,11 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.5.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz",
-      "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==",
+      "version": "5.8.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
+      "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
       "dev": true,
+      "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -39794,12 +40117,13 @@
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
       "integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==",
-      "dev": true
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/ufo": {
-      "version": "1.5.4",
-      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.5.4.tgz",
-      "integrity": "sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==",
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.6.1.tgz",
+      "integrity": "sha512-9a4/uxlTWJ4+a5i0ooc1rU7C7YOw3wT+UGqdeNNHWnOF9qcMBgLRS+4IYUqbczewFx4mLEig6gawh7X6mFlEkA==",
       "dev": true,
       "license": "MIT"
     },
@@ -39807,6 +40131,8 @@
       "version": "3.15.0",
       "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.15.0.tgz",
       "integrity": "sha512-x+xdeDWq7FiORDvyIJ0q/waWd4PhjBNOm5dQUOq2AKC0IEjxOS66Ha9tctiVDGcRQuh69K7fgU5oRuTK4cysSg==",
+      "dev": true,
+      "optional": true,
       "bin": {
         "uglifyjs": "bin/uglifyjs"
       },
@@ -39848,14 +40174,18 @@
       }
     },
     "node_modules/unbox-primitive": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz",
-      "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+      "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
+      "license": "MIT",
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bound": "^1.0.3",
         "has-bigints": "^1.0.2",
-        "has-symbols": "^1.0.3",
-        "which-boxed-primitive": "^1.0.2"
+        "has-symbols": "^1.1.0",
+        "which-boxed-primitive": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -39866,6 +40196,7 @@
       "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.2.1.tgz",
       "integrity": "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.6.3",
         "@types/react": ">=16.9.11",
@@ -39896,10 +40227,11 @@
       }
     },
     "node_modules/unicode-canonical-property-names-ecmascript": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
-      "integrity": "sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz",
+      "integrity": "sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=4"
       }
@@ -39909,6 +40241,7 @@
       "resolved": "https://registry.npmjs.org/unicode-match-property-ecmascript/-/unicode-match-property-ecmascript-2.0.0.tgz",
       "integrity": "sha512-5kaZCrbp5mmbz5ulBkDkbY0SsPOjKqVS35VpL9ulMPfSl0J0Xsm+9Evphv9CoIZFwre7aJoa94AY6seMKGVN5Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "unicode-canonical-property-names-ecmascript": "^2.0.0",
         "unicode-property-aliases-ecmascript": "^2.0.0"
@@ -39918,10 +40251,11 @@
       }
     },
     "node_modules/unicode-match-property-value-ecmascript": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.1.0.tgz",
-      "integrity": "sha512-qxkjQt6qjg/mYscYMC0XKRn3Rh0wFPlfxB0xkt9CfyTvpX1Ra0+rAmdX2QyAobptSEvuy4RtpPRui6XkV+8wjA==",
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/unicode-match-property-value-ecmascript/-/unicode-match-property-value-ecmascript-2.2.0.tgz",
+      "integrity": "sha512-4IehN3V/+kkr5YeSSDDQG8QLqO26XpL2XP3GQtqwlT/QYSECAwFztxVHjlbh0+gjJ3XmNLS0zDsbgs9jWKExLg==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=4"
       }
@@ -39931,6 +40265,7 @@
       "resolved": "https://registry.npmjs.org/unicode-property-aliases-ecmascript/-/unicode-property-aliases-ecmascript-2.1.0.tgz",
       "integrity": "sha512-6t3foTQI9qne+OZoVQB/8x8rk2k1eVy1gRXhV3oFQ5T6R1dqQ1xtin3XqSlx3+ATBkliTaR/hHyJBm+LVPNM8w==",
       "dev": true,
+      "license": "MIT",
       "engines": {
         "node": ">=4"
       }
@@ -39972,6 +40307,25 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/universal-cookie": {
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-7.2.2.tgz",
+      "integrity": "sha512-fMiOcS3TmzP2x5QV26pIH3mvhexLIT0HmPa3V7Q7knRfT9HG6kTwq02HZGLPw0sAOXrAmotElGRvTLCMbJsvxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/cookie": "^0.6.0",
+        "cookie": "^0.7.2"
+      }
+    },
+    "node_modules/universal-cookie/node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/universalify": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
@@ -40079,9 +40433,9 @@
       }
     },
     "node_modules/update-browserslist-db": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.0.tgz",
-      "integrity": "sha512-EdRAaAyk2cUE1wOf2DkEhzxqOQvFOoRJFNS6NeyJ01Gp2beMRpBAINjM2iDXE3KCuKhwnvHIQCJm6ThL2Z+HzQ==",
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.3.tgz",
+      "integrity": "sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==",
       "dev": true,
       "funding": [
         {
@@ -40097,9 +40451,10 @@
           "url": "https://github.com/sponsors/ai"
         }
       ],
+      "license": "MIT",
       "dependencies": {
-        "escalade": "^3.1.2",
-        "picocolors": "^1.0.1"
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
       },
       "bin": {
         "update-browserslist-db": "cli.js"
@@ -40278,12 +40633,6 @@
         "uuid": "bin/uuid"
       }
     },
-    "node_modules/v8-compile-cache": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.4.0.tgz",
-      "integrity": "sha512-ocyWc3bAHBB/guyqJQVI5o4BZkPhznPYUG2ea80Gond/BgNWpap8TOmLSeeQG7bnh2KMISxskdADG59j7zruhw==",
-      "dev": true
-    },
     "node_modules/v8-to-istanbul": {
       "version": "9.1.0",
       "resolved": "https://registry.npmjs.org/v8-to-istanbul/-/v8-to-istanbul-9.1.0.tgz",
@@ -40511,6 +40860,177 @@
       "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
       "dev": true
     },
+    "node_modules/vite-node": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-3.1.2.tgz",
+      "integrity": "sha512-/8iMryv46J3aK13iUXsei5G/A3CUlW4665THCPS+K8xAaqrVWiGB4RfXMQXCLjpK9P2eK//BczrVkn5JLAk6DA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cac": "^6.7.14",
+        "debug": "^4.4.0",
+        "es-module-lexer": "^1.6.0",
+        "pathe": "^2.0.3",
+        "vite": "^5.0.0 || ^6.0.0"
+      },
+      "bin": {
+        "vite-node": "vite-node.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/vite-node/node_modules/debug": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vite-node/node_modules/fdir": {
+      "version": "6.4.4",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
+      "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vite-node/node_modules/jiti": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
+      "integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
+    "node_modules/vite-node/node_modules/picomatch": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
+      "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/vite-node/node_modules/vite": {
+      "version": "6.3.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.2.tgz",
+      "integrity": "sha512-ZSvGOXKGceizRQIZSz7TGJ0pS3QLlVY/9hwxVh17W3re67je1RKYzFHivZ/t0tubU78Vkyb9WnHPENSBCzbckg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.25.0",
+        "fdir": "^6.4.3",
+        "picomatch": "^4.0.2",
+        "postcss": "^8.5.3",
+        "rollup": "^4.34.9",
+        "tinyglobby": "^0.2.12"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "jiti": ">=1.21.0",
+        "less": "*",
+        "lightningcss": "^1.21.0",
+        "sass": "*",
+        "sass-embedded": "*",
+        "stylus": "*",
+        "sugarss": "*",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vite-node/node_modules/yaml": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.7.1.tgz",
+      "integrity": "sha512-10ULxpnOCQXxJvBgxsn9ptjq6uviG/htZKk9veJGhlqn3w/DxQ631zFF+nlQXLwmImeS5amR2dl2U8sg6U9jsQ==",
+      "dev": true,
+      "license": "ISC",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/void-elements": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
@@ -40562,10 +41082,11 @@
       }
     },
     "node_modules/warning": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
-      "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w=",
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "loose-envify": "^1.0.0"
       }
@@ -40588,6 +41109,7 @@
       "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz",
       "integrity": "sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "minimalistic-assert": "^1.0.0"
       }
@@ -40892,9 +41414,9 @@
       }
     },
     "node_modules/webpack-dev-middleware/node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.2.tgz",
+      "integrity": "sha512-Gn/JaSk/Mt9gYubxTtSn/QCV4em9mpAPiR1rqy/Ocu19u/G9J5WWdNoUT4SiV6mFC3y6cxyFcFwdzPM3FgxGAQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -40912,15 +41434,16 @@
       }
     },
     "node_modules/webpack-dev-server": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-5.2.0.tgz",
-      "integrity": "sha512-90SqqYXA2SK36KcT6o1bvwvZfJFcmoamqeJY7+boioffX9g9C0wjjJRGUrQIuh43pb0ttX7+ssavmj/WN2RHtA==",
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-5.2.1.tgz",
+      "integrity": "sha512-ml/0HIj9NLpVKOMq+SuBPLHcmbG+TGIjXRHsYfZwocUBIqEvws8NnS/V9AFQ5FKP+tgn5adwVwRrTEpGL33QFQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@types/bonjour": "^3.5.13",
         "@types/connect-history-api-fallback": "^1.5.4",
         "@types/express": "^4.17.21",
+        "@types/express-serve-static-core": "^4.17.21",
         "@types/serve-index": "^1.9.4",
         "@types/serve-static": "^1.15.5",
         "@types/sockjs": "^0.3.36",
@@ -41058,9 +41581,9 @@
       "license": "MIT"
     },
     "node_modules/webpack-dev-server/node_modules/open": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/open/-/open-10.1.0.tgz",
-      "integrity": "sha512-mnkeQ1qP5Ue2wd+aivTD3NHd/lZ96Lu0jgf0pwktLPtx6cTZiH7tyeGRRHs0zX0rbrahXPnXlUnbeXyaBBuIaw==",
+      "version": "10.1.1",
+      "resolved": "https://registry.npmjs.org/open/-/open-10.1.1.tgz",
+      "integrity": "sha512-zy1wx4+P3PfhXSEPJNtZmJXfhkkIaxU1VauWIrDZw1O7uJRDRJtKr9n3Ic4NgbA16KyOxOXO2ng9gYwCdXuSXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -41077,9 +41600,9 @@
       }
     },
     "node_modules/webpack-dev-server/node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.2.tgz",
+      "integrity": "sha512-Gn/JaSk/Mt9gYubxTtSn/QCV4em9mpAPiR1rqy/Ocu19u/G9J5WWdNoUT4SiV6mFC3y6cxyFcFwdzPM3FgxGAQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -41256,6 +41779,7 @@
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
       "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
       "dev": true,
+      "license": "Apache-2.0",
       "dependencies": {
         "http-parser-js": ">=0.5.1",
         "safe-buffer": ">=5.1.0",
@@ -41270,6 +41794,7 @@
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
       "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
       "dev": true,
+      "license": "Apache-2.0",
       "engines": {
         "node": ">=0.8.0"
       }
@@ -41308,10 +41833,10 @@
       }
     },
     "node_modules/whatwg-url": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-6.5.0.tgz",
-      "integrity": "sha512-rhRZRqx/TLJQWUpQ6bmrt2UV4f0HCQ463yQuONJqC6fO2VoEb1pTYddbe59SkYq87aoM5A3bdhMZiUiVws+fzQ==",
-      "dev": true,
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
+      "integrity": "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==",
+      "license": "MIT",
       "dependencies": {
         "lodash.sortby": "^4.7.0",
         "tr46": "^1.0.1",
@@ -41322,7 +41847,7 @@
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==",
-      "dev": true
+      "license": "BSD-2-Clause"
     },
     "node_modules/which": {
       "version": "2.0.2",
@@ -41339,38 +41864,43 @@
       }
     },
     "node_modules/which-boxed-primitive": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz",
-      "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+      "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
+      "license": "MIT",
       "dependencies": {
-        "is-bigint": "^1.0.1",
-        "is-boolean-object": "^1.1.0",
-        "is-number-object": "^1.0.4",
-        "is-string": "^1.0.5",
-        "is-symbol": "^1.0.3"
+        "is-bigint": "^1.1.0",
+        "is-boolean-object": "^1.2.1",
+        "is-number-object": "^1.1.1",
+        "is-string": "^1.1.1",
+        "is-symbol": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/which-builtin-type": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.1.3.tgz",
-      "integrity": "sha512-YmjsSMDBYsM1CaFiayOVT06+KJeXf0o5M/CAd4o1lTadFAtacTUM49zoYxr/oroopFDfhvN6iEcBxUyc3gvKmw==",
-      "dev": true,
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+      "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
+      "license": "MIT",
       "dependencies": {
-        "function.prototype.name": "^1.1.5",
-        "has-tostringtag": "^1.0.0",
+        "call-bound": "^1.0.2",
+        "function.prototype.name": "^1.1.6",
+        "has-tostringtag": "^1.0.2",
         "is-async-function": "^2.0.0",
-        "is-date-object": "^1.0.5",
-        "is-finalizationregistry": "^1.0.2",
+        "is-date-object": "^1.1.0",
+        "is-finalizationregistry": "^1.1.0",
         "is-generator-function": "^1.0.10",
-        "is-regex": "^1.1.4",
+        "is-regex": "^1.2.1",
         "is-weakref": "^1.0.2",
         "isarray": "^2.0.5",
-        "which-boxed-primitive": "^1.0.2",
-        "which-collection": "^1.0.1",
-        "which-typed-array": "^1.1.9"
+        "which-boxed-primitive": "^1.1.0",
+        "which-collection": "^1.0.2",
+        "which-typed-array": "^1.1.16"
       },
       "engines": {
         "node": ">= 0.4"
@@ -41380,15 +41910,18 @@
       }
     },
     "node_modules/which-collection": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz",
-      "integrity": "sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==",
-      "dev": true,
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+      "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
+      "license": "MIT",
       "dependencies": {
-        "is-map": "^2.0.1",
-        "is-set": "^2.0.1",
-        "is-weakmap": "^2.0.1",
-        "is-weakset": "^2.0.1"
+        "is-map": "^2.0.3",
+        "is-set": "^2.0.3",
+        "is-weakmap": "^2.0.2",
+        "is-weakset": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -41401,15 +41934,17 @@
       "dev": true
     },
     "node_modules/which-typed-array": {
-      "version": "1.1.15",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz",
-      "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==",
+      "version": "1.1.19",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.19.tgz",
+      "integrity": "sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==",
       "license": "MIT",
       "dependencies": {
         "available-typed-arrays": "^1.0.7",
-        "call-bind": "^1.0.7",
-        "for-each": "^0.3.3",
-        "gopd": "^1.0.1",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "for-each": "^0.3.5",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
         "has-tostringtag": "^1.0.2"
       },
       "engines": {
@@ -41419,6 +41954,23 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/why-is-node-running": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
+      "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "siginfo": "^2.0.0",
+        "stackback": "0.0.2"
+      },
+      "bin": {
+        "why-is-node-running": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/wide-align": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
@@ -41469,8 +42021,9 @@
     "node_modules/wildcard": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-1.1.2.tgz",
-      "integrity": "sha1-pwIEUwhNjNLv5wup02liY94XEKU=",
-      "dev": true
+      "integrity": "sha512-DXukZJxpHA8LuotRwL0pP1+rS6CS7FF2qStDDE1C7DDg2rLud2PXRMuEDYIPhgEezwnlHNL4c+N6MfMTjCGTng==",
+      "dev": true,
+      "license": "MIT"
     },
     "node_modules/with": {
       "version": "7.0.2",
@@ -41730,11 +42283,6 @@
       "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
       "dev": true
     },
-    "node_modules/xmlcreate": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/xmlcreate/-/xmlcreate-2.0.4.tgz",
-      "integrity": "sha512-nquOebG4sngPmGPICTS5EnxqhKbCmz5Ox5hsszI2T6U5qdrJizBc+0ilYSEjTSzU0yZcmvppztXe/5Al5fUwdg=="
-    },
     "node_modules/xmlhttprequest": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/xmlhttprequest/-/xmlhttprequest-1.8.0.tgz",
@@ -41912,6 +42460,7 @@
       "version": "3.25.1",
       "resolved": "https://registry.npmjs.org/z-schema/-/z-schema-3.25.1.tgz",
       "integrity": "sha512-7tDlwhrBG+oYFdXNOjILSurpfQyuVgkRe3hB2q8TEssamDHB7BbLWYkYO98nTn0FibfdFroFKDjndbgufAgS/Q==",
+      "license": "MIT",
       "dependencies": {
         "core-js": "^2.5.7",
         "lodash.get": "^4.0.0",
@@ -41925,23 +42474,19 @@
         "commander": "^2.7.1"
       }
     },
-    "node_modules/z-schema/node_modules/commander": {
-      "version": "2.20.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
-      "optional": true
-    },
     "node_modules/z-schema/node_modules/core-js": {
       "version": "2.6.12",
       "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
       "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
-      "deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
-      "hasInstallScript": true
+      "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
+      "hasInstallScript": true,
+      "license": "MIT"
     },
     "node_modules/z-schema/node_modules/validator": {
       "version": "10.11.0",
       "resolved": "https://registry.npmjs.org/validator/-/validator-10.11.0.tgz",
       "integrity": "sha512-X/p3UZerAIsbBfN/IwahhYaBbY68EN/UQBWHtsbXGT5bfrH/p4NQzUCG1kF/rtKaNpnJ7jAu6NGTdSNtyNIXMw==",
+      "license": "MIT",
       "engines": {
         "node": ">= 0.10"
       }
@@ -41959,15 +42504,6 @@
         "node": ">= 10"
       }
     },
-    "node_modules/zlib": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/zlib/-/zlib-1.0.5.tgz",
-      "integrity": "sha512-40fpE2II+Cd3k8HWTWONfeKE2jL+P42iWJ1zzps5W51qcTsOUKM5Q5m2PFb0CLxlmFAaUuUdJGc3OfZy947v0w==",
-      "hasInstallScript": true,
-      "engines": {
-        "node": ">=0.2.0"
-      }
-    },
     "services/analytics": {
       "name": "@overleaf/analytics",
       "dependencies": {
@@ -42070,21 +42606,21 @@
         "@overleaf/o-error": "*",
         "@overleaf/promise-utils": "*",
         "@overleaf/settings": "*",
+        "@overleaf/stream-utils": "*",
         "archiver": "5.3.2",
         "async": "^3.2.5",
         "body-parser": "^1.20.3",
         "bunyan": "^1.8.15",
-        "diskusage": "^1.1.3",
-        "dockerode": "^3.1.0",
+        "dockerode": "^4.0.7",
         "express": "^4.21.2",
         "lodash": "^4.17.21",
         "p-limit": "^3.1.0",
         "request": "^2.88.2",
         "send": "^0.19.0",
+        "tar-fs": "^3.0.9",
         "workerpool": "^6.1.5"
       },
       "devDependencies": {
-        "@types/workerpool": "^6.1.0",
         "chai": "^4.3.6",
         "chai-as-promised": "^7.1.1",
         "mocha": "^11.1.0",
@@ -42097,6 +42633,28 @@
         "typescript": "^5.0.4"
       }
     },
+    "services/clsi-cache": {
+      "name": "@overleaf/clsi-cache",
+      "dependencies": {
+        "@overleaf/fetch-utils": "*",
+        "@overleaf/logger": "*",
+        "@overleaf/metrics": "*",
+        "@overleaf/o-error": "*",
+        "@overleaf/promise-utils": "*",
+        "@overleaf/settings": "*",
+        "@overleaf/stream-utils": "*",
+        "body-parser": "^1.20.3",
+        "bunyan": "^1.8.15",
+        "celebrate": "^15.0.3",
+        "express": "^4.21.2",
+        "p-limit": "^3.1.0"
+      },
+      "devDependencies": {
+        "chai": "^4.3.6",
+        "chai-as-promised": "^7.1.1",
+        "mocha": "^11.1.0"
+      }
+    },
     "services/clsi-perf": {
       "name": "@overleaf/clsi-perf",
       "dependencies": {
@@ -42233,6 +42791,7 @@
     "services/docstore": {
       "name": "@overleaf/docstore",
       "dependencies": {
+        "@overleaf/fetch-utils": "*",
         "@overleaf/logger": "*",
         "@overleaf/metrics": "*",
         "@overleaf/o-error": "*",
@@ -42320,6 +42879,7 @@
         "lodash": "^4.17.21",
         "minimist": "^1.2.8",
         "mongodb-legacy": "6.1.3",
+        "overleaf-editor-core": "*",
         "request": "^2.88.2",
         "requestretry": "^7.1.0"
       },
@@ -42416,8 +42976,7 @@
         "@overleaf/metrics": "*",
         "express": "^4.21.2",
         "is-valid-hostname": "^1.0.2",
-        "tar-stream": "^2.2.0",
-        "zlib": "^1.0.5"
+        "tar-stream": "^2.2.0"
       },
       "devDependencies": {
         "chai": "^4.3.6",
@@ -42543,6 +43102,7 @@
       "license": "Proprietary",
       "dependencies": {
         "@google-cloud/secret-manager": "^5.6.0",
+        "@overleaf/fetch-utils": "*",
         "@overleaf/logger": "*",
         "@overleaf/metrics": "*",
         "@overleaf/mongo-utils": "*",
@@ -42560,7 +43120,7 @@
         "bunyan": "^1.8.12",
         "check-types": "^11.1.2",
         "command-line-args": "^3.0.3",
-        "config": "^1.19.0",
+        "config": "^3.3.12",
         "express": "^4.21.2",
         "fs-extra": "^9.0.1",
         "generic-pool": "^2.1.1",
@@ -42572,6 +43132,7 @@
         "mongodb": "6.12.0",
         "overleaf-editor-core": "*",
         "p-limit": "^6.2.0",
+        "p-queue": "^8.1.0",
         "pg": "^8.7.1",
         "pg-query-stream": "^4.2.4",
         "swagger-tools": "^0.10.4",
@@ -42654,6 +43215,18 @@
         "command-line-args": "bin.js"
       }
     },
+    "services/history-v1/node_modules/config": {
+      "version": "3.3.12",
+      "resolved": "https://registry.npmjs.org/config/-/config-3.3.12.tgz",
+      "integrity": "sha512-Vmx389R/QVM3foxqBzXO8t2tUikYZP64Q6vQxGrsMpREeJc/aWRnPRERXWsYzOHAumx/AOoILWe6nU3ZJL+6Sw==",
+      "license": "MIT",
+      "dependencies": {
+        "json5": "^2.2.3"
+      },
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
     "services/history-v1/node_modules/cron-parser": {
       "version": "4.9.0",
       "resolved": "https://registry.npmjs.org/cron-parser/-/cron-parser-4.9.0.tgz",
@@ -42827,7 +43400,7 @@
         "bootstrap": "^5.3.3",
         "compression": "^1.7.1",
         "cookie-parser": "^1.4.6",
-        "cross-env": "^4.0.0",
+        "cross-env": "^7.0.3",
         "es6-promise": "^4.2.8",
         "express": "^4.21.2",
         "express-basic-auth": "^1.2.0",
@@ -42838,13 +43411,12 @@
         "jsonwebtoken": "^9.0.2",
         "method-override": "^2.3.10",
         "prop-types": "^15.8.1",
-        "react": "^17.0.2",
+        "react": "^18.3.1",
         "react-cookie": "^7.2.0",
-        "react-dom": "^17.0.2",
+        "react-dom": "^18.3.1",
         "react-dropzone": "^14.2.3",
         "react-helmet": "^6.1.0",
         "react-redux": "^7.2.2",
-        "react-responsive": "^10.0.0",
         "react-router-dom": "^6.26.1",
         "redux": "^4.2.1",
         "redux-logger": "^3.0.1",
@@ -42862,24 +43434,21 @@
         "@babel/preset-env": "^7.25.3",
         "@babel/preset-react": "^7.24.7",
         "@babel/register": "^7.24.6",
-        "@testing-library/react": "^12.1.5",
+        "@testing-library/react": "^16.3.0",
+        "@vitejs/plugin-react": "^4.3.4",
         "babel-loader": "^9.1.3",
         "babel-plugin-react-transform": "^2.0.2",
         "babel-plugin-transform-react-remove-prop-types": "^0.3.3",
-        "chai": "^4.3.10",
-        "chai-as-promised": "^7.1.1",
+        "combobo": "^2.0.4",
         "css-loader": "^6.8.1",
         "cssnano": "^6.0.0",
-        "eslint": "^7.21.0",
-        "eslint-config-prettier": "^8.5.0",
-        "eslint-config-standard": "^16.0.3",
+        "eslint": "^8.57.0",
+        "eslint-config-prettier": "^10.1.5",
+        "eslint-config-standard": "^17.0.0",
         "eslint-plugin-react": "^7.32.2",
-        "eslint-plugin-unicorn": "^56.0.0",
-        "expect": "^1.15.2",
+        "eslint-plugin-unicorn": "^56.0.1",
         "file-loader": "^6.2.0",
-        "jsdom": "^20.0.0",
         "mini-css-extract-plugin": "^2.7.6",
-        "mocha": "^11.1.0",
         "nodemon": "^3.0.1",
         "postcss": "^8.4.31",
         "postcss-import": "^15.1.0",
@@ -42889,10 +43458,9 @@
         "react-transform-hmr": "^1.0.4",
         "redux-mock-store": "1.5.0",
         "sandboxed-module": "^2.0.4",
-        "sinon": "^19.0.2",
-        "sinon-chai": "^3.7.0",
         "style-loader": "^3.3.3",
         "url-loader": "^4.1.1",
+        "vitest": "^3.1.2",
         "webpack": "^5.98.0",
         "webpack-cli": "^5.1.4",
         "webpack-dev-middleware": "^6.1.2",
@@ -42903,101 +43471,120 @@
         "node": ">=18"
       }
     },
-    "services/latexqc/node_modules/@babel/code-frame": {
-      "version": "7.12.11",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.11.tgz",
-      "integrity": "sha512-Zt1yodBx1UcyiePMSkWnU4hPqhwq7hGi2nFL1LeA3EUl+q2LQx16MISgJ0+z7dnmgvP9QtIleuETGOiOH1RcIw==",
+    "services/latexqc/node_modules/@types/debug": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
+      "integrity": "sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==",
       "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
       "dependencies": {
-        "@babel/highlight": "^7.10.4"
+        "@types/ms": "*"
       }
     },
-    "services/latexqc/node_modules/@eslint/eslintrc": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.3.tgz",
-      "integrity": "sha512-J6KFFz5QCYUJq3pf0mjEcCJVERbzv71PUIDczuh9JkwGEzced6CO5ADLHB1rbf/+oPBtoPfMYNOpGDzCANlbXw==",
+    "services/latexqc/node_modules/@vitejs/plugin-react": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.4.1.tgz",
+      "integrity": "sha512-IpEm5ZmeXAP/osiBXVVP5KjFMzbWOonMs0NaQQl+xYnUAcq4oHUBsF2+p4MgKWG4YMmFYJU8A6sxRPuowllm6w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "ajv": "^6.12.4",
-        "debug": "^4.1.1",
-        "espree": "^7.3.0",
-        "globals": "^13.9.0",
-        "ignore": "^4.0.6",
-        "import-fresh": "^3.2.1",
-        "js-yaml": "^3.13.1",
-        "minimatch": "^3.0.4",
-        "strip-json-comments": "^3.1.1"
+        "@babel/core": "^7.26.10",
+        "@babel/plugin-transform-react-jsx-self": "^7.25.9",
+        "@babel/plugin-transform-react-jsx-source": "^7.25.9",
+        "@types/babel__core": "^7.20.5",
+        "react-refresh": "^0.17.0"
       },
       "engines": {
-        "node": "^10.12.0 || >=12.0.0"
-      }
-    },
-    "services/latexqc/node_modules/@humanwhocodes/config-array": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz",
-      "integrity": "sha512-FagtKFz74XrTl7y6HCzQpwDfXP0yhxe9lHLD1UZxjvZIcbyRz8zTFF/yYNfSfzU414eDwZ1SrO0Qvtyf+wFMQg==",
-      "deprecated": "Use @eslint/config-array instead",
-      "dev": true,
-      "dependencies": {
-        "@humanwhocodes/object-schema": "^1.2.0",
-        "debug": "^4.1.1",
-        "minimatch": "^3.0.4"
+        "node": "^14.18.0 || >=16.0.0"
       },
-      "engines": {
-        "node": ">=10.10.0"
+      "peerDependencies": {
+        "vite": "^4.2.0 || ^5.0.0 || ^6.0.0"
       }
     },
-    "services/latexqc/node_modules/@sinonjs/commons": {
-      "version": "3.0.1",
-      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
-      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
+    "services/latexqc/node_modules/@vitest/expect": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-3.1.2.tgz",
+      "integrity": "sha512-O8hJgr+zREopCAqWl3uCVaOdqJwZ9qaDwUP7vy3Xigad0phZe9APxKhPcDNqYYi0rX5oMvwJMSCAXY2afqeTSA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "type-detect": "4.0.8"
+        "@vitest/spy": "3.1.2",
+        "@vitest/utils": "3.1.2",
+        "chai": "^5.2.0",
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
       }
     },
-    "services/latexqc/node_modules/@sinonjs/commons/node_modules/type-detect": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
-      "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
+    "services/latexqc/node_modules/@vitest/mocker": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-3.1.2.tgz",
+      "integrity": "sha512-kOtd6K2lc7SQ0mBqYv/wdGedlqPdM/B38paPY+OwJ1XiNi44w3Fpog82UfOibmHaV9Wod18A09I9SCKLyDMqgw==",
       "dev": true,
-      "engines": {
-        "node": ">=4"
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "3.1.2",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.17"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9",
+        "vite": "^5.0.0 || ^6.0.0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
       }
     },
-    "services/latexqc/node_modules/@sinonjs/fake-timers": {
-      "version": "13.0.2",
-      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-13.0.2.tgz",
-      "integrity": "sha512-4Bb+oqXZTSTZ1q27Izly9lv8B9dlV61CROxPiVtywwzv5SnytJqhvYe6FclHYuXml4cd1VHPo1zd5PmTeJozvA==",
+    "services/latexqc/node_modules/@vitest/pretty-format": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.1.2.tgz",
+      "integrity": "sha512-R0xAiHuWeDjTSB3kQ3OQpT8Rx3yhdOAIm/JM4axXxnG7Q/fS8XUwggv/A4xzbQA+drYRjzkMnpYnOGAc4oeq8w==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@sinonjs/commons": "^3.0.1"
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
       }
     },
-    "services/latexqc/node_modules/@sinonjs/samsam": {
-      "version": "8.0.2",
-      "resolved": "https://registry.npmjs.org/@sinonjs/samsam/-/samsam-8.0.2.tgz",
-      "integrity": "sha512-v46t/fwnhejRSFTGqbpn9u+LQ9xJDse10gNnPgAcxgdoCDMXj/G2asWAC/8Qs+BAZDicX+MNZouXT1A7c83kVw==",
+    "services/latexqc/node_modules/@vitest/spy": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-3.1.2.tgz",
+      "integrity": "sha512-OEc5fSXMws6sHVe4kOFyDSj/+4MSwst0ib4un0DlcYgQvRuYQ0+M2HyqGaauUMnjq87tmUaMNDxKQx7wNfVqPA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@sinonjs/commons": "^3.0.1",
-        "lodash.get": "^4.4.2",
-        "type-detect": "^4.1.0"
+        "tinyspy": "^3.0.2"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
       }
     },
-    "services/latexqc/node_modules/@sinonjs/text-encoding": {
-      "version": "0.7.3",
-      "resolved": "https://registry.npmjs.org/@sinonjs/text-encoding/-/text-encoding-0.7.3.tgz",
-      "integrity": "sha512-DE427ROAphMQzU4ENbliGYrBSYPXF+TtLg9S8vzeA+OF4ZKzoDdzfL8sxuMUGS/lgRhM6j1URSk9ghf7Xo1tyA==",
-      "dev": true
-    },
-    "services/latexqc/node_modules/@types/hoist-non-react-statics": {
-      "version": "3.3.5",
-      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz",
-      "integrity": "sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==",
+    "services/latexqc/node_modules/@vitest/utils": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-3.1.2.tgz",
+      "integrity": "sha512-5GGd0ytZ7BH3H6JTj9Kw7Prn1Nbg0wZVrIvou+UWxm54d+WoXXgAgjFJ8wn3LdagWLFSEfpPeyYrByZaGEZHLg==",
+      "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@types/react": "*",
-        "hoist-non-react-statics": "^3.3.0"
+        "@vitest/pretty-format": "3.1.2",
+        "loupe": "^3.1.3",
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
       }
     },
     "services/latexqc/node_modules/acorn-globals": {
@@ -43005,6 +43592,8 @@
       "resolved": "https://registry.npmjs.org/acorn-globals/-/acorn-globals-7.0.1.tgz",
       "integrity": "sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "acorn": "^8.1.0",
         "acorn-walk": "^8.0.2"
@@ -43015,6 +43604,8 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
       "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -43027,6 +43618,8 @@
       "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.3.tgz",
       "integrity": "sha512-MxXdReSRhGO7VlFe1bRG/oI7/mdLV9B9JJT0N8vZOhF7gFRR5l3M8W9G8JxmKV+JC5mGqJ0QvqfSOLsCPa4nUw==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "acorn": "^8.11.0"
       },
@@ -43039,6 +43632,8 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
       "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -43046,28 +43641,14 @@
         "node": ">=0.4.0"
       }
     },
-    "services/latexqc/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+    "services/latexqc/node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
       "dev": true,
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
-    "services/latexqc/node_modules/argparse": {
-      "version": "1.0.10",
-      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
-      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
-      "dev": true,
-      "dependencies": {
-        "sprintf-js": "~1.0.2"
+        "node": ">=12"
       }
     },
     "services/latexqc/node_modules/attr-accept": {
@@ -43098,45 +43679,48 @@
       }
     },
     "services/latexqc/node_modules/chai": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/chai/-/chai-4.5.0.tgz",
-      "integrity": "sha512-RITGBfijLkBddZvnn8jdqoTypxvqbOLYQkGGxXzeFjVHvudaPw0HNFD9x928/eUwYWd2dPCugVqspGALTZZQKw==",
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-5.2.0.tgz",
+      "integrity": "sha512-mCuXncKXk5iCLhfhwTc0izo0gtEmpz5CtG2y8GiOINBlMVS6v8TMRc5TaLWKS6692m9+dVVfzgeVxR5UxWHTYw==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "assertion-error": "^1.1.0",
-        "check-error": "^1.0.3",
-        "deep-eql": "^4.1.3",
-        "get-func-name": "^2.0.2",
-        "loupe": "^2.3.6",
-        "pathval": "^1.1.1",
-        "type-detect": "^4.1.0"
+        "assertion-error": "^2.0.1",
+        "check-error": "^2.1.1",
+        "deep-eql": "^5.0.1",
+        "loupe": "^3.1.0",
+        "pathval": "^2.0.0"
       },
       "engines": {
-        "node": ">=4"
+        "node": ">=12"
       }
     },
-    "services/latexqc/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+    "services/latexqc/node_modules/check-error": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.1.tgz",
+      "integrity": "sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==",
       "dev": true,
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/chalk?sponsor=1"
+        "node": ">= 16"
       }
     },
-    "services/latexqc/node_modules/cookie": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.6.0.tgz",
-      "integrity": "sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==",
+    "services/latexqc/node_modules/cross-env": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/cross-env/-/cross-env-7.0.3.tgz",
+      "integrity": "sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==",
+      "license": "MIT",
+      "dependencies": {
+        "cross-spawn": "^7.0.1"
+      },
+      "bin": {
+        "cross-env": "src/bin/cross-env.js",
+        "cross-env-shell": "src/bin/cross-env-shell.js"
+      },
       "engines": {
-        "node": ">= 0.6"
+        "node": ">=10.14",
+        "npm": ">=6",
+        "yarn": ">=1"
       }
     },
     "services/latexqc/node_modules/debug": {
@@ -43165,31 +43749,22 @@
       "license": "MIT"
     },
     "services/latexqc/node_modules/deep-eql": {
-      "version": "4.1.4",
-      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.1.4.tgz",
-      "integrity": "sha512-SUwdGfqdKOwxCPeVYjwSyRpJ7Z+fhpwIAtmCUdZIWZ/YP5R9WAsyuSgpLVDi9bjWoN2LXHNss/dk3urXtdQxGg==",
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-5.0.2.tgz",
+      "integrity": "sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==",
       "dev": true,
-      "dependencies": {
-        "type-detect": "^4.0.0"
-      },
+      "license": "MIT",
       "engines": {
         "node": ">=6"
       }
     },
-    "services/latexqc/node_modules/diff": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/diff/-/diff-7.0.0.tgz",
-      "integrity": "sha512-PJWHUb1RFevKCwaFA9RlG5tCd+FO5iRh9A8HEtkmBH2Li03iJriB6m6JIN4rGz3K3JLawI7/veA1xzRKP6ISBw==",
-      "dev": true,
-      "engines": {
-        "node": ">=0.3.1"
-      }
-    },
     "services/latexqc/node_modules/entities": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
       "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "engines": {
         "node": ">=0.12"
       },
@@ -43197,138 +43772,35 @@
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
     },
-    "services/latexqc/node_modules/eslint": {
-      "version": "7.32.0",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-7.32.0.tgz",
-      "integrity": "sha512-VHZ8gX+EDfz+97jGcgyGCyRia/dPOd6Xh9yPv8Bl1+SoaIwD+a/vlrOmGRUyOYu7MwUhc7CxqeaDZU13S4+EpA==",
+    "services/latexqc/node_modules/eslint-config-prettier": {
+      "version": "10.1.5",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.5.tgz",
+      "integrity": "sha512-zc1UmCpNltmVY34vuLRV61r1K27sWuX39E+uyUnY8xS2Bex88VV9cugG+UZbRSRGtGyFboj+D8JODyme1plMpw==",
       "dev": true,
-      "dependencies": {
-        "@babel/code-frame": "7.12.11",
-        "@eslint/eslintrc": "^0.4.3",
-        "@humanwhocodes/config-array": "^0.5.0",
-        "ajv": "^6.10.0",
-        "chalk": "^4.0.0",
-        "cross-spawn": "^7.0.2",
-        "debug": "^4.0.1",
-        "doctrine": "^3.0.0",
-        "enquirer": "^2.3.5",
-        "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^5.1.1",
-        "eslint-utils": "^2.1.0",
-        "eslint-visitor-keys": "^2.0.0",
-        "espree": "^7.3.1",
-        "esquery": "^1.4.0",
-        "esutils": "^2.0.2",
-        "fast-deep-equal": "^3.1.3",
-        "file-entry-cache": "^6.0.1",
-        "functional-red-black-tree": "^1.0.1",
-        "glob-parent": "^5.1.2",
-        "globals": "^13.6.0",
-        "ignore": "^4.0.6",
-        "import-fresh": "^3.0.0",
-        "imurmurhash": "^0.1.4",
-        "is-glob": "^4.0.0",
-        "js-yaml": "^3.13.1",
-        "json-stable-stringify-without-jsonify": "^1.0.1",
-        "levn": "^0.4.1",
-        "lodash.merge": "^4.6.2",
-        "minimatch": "^3.0.4",
-        "natural-compare": "^1.4.0",
-        "optionator": "^0.9.1",
-        "progress": "^2.0.0",
-        "regexpp": "^3.1.0",
-        "semver": "^7.2.1",
-        "strip-ansi": "^6.0.0",
-        "strip-json-comments": "^3.1.0",
-        "table": "^6.0.9",
-        "text-table": "^0.2.0",
-        "v8-compile-cache": "^2.0.3"
-      },
+      "license": "MIT",
       "bin": {
-        "eslint": "bin/eslint.js"
-      },
-      "engines": {
-        "node": "^10.12.0 || >=12.0.0"
+        "eslint-config-prettier": "bin/cli.js"
       },
       "funding": {
-        "url": "https://opencollective.com/eslint"
+        "url": "https://opencollective.com/eslint-config-prettier"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
       }
     },
-    "services/latexqc/node_modules/eslint-config-standard": {
-      "version": "16.0.3",
-      "resolved": "https://registry.npmjs.org/eslint-config-standard/-/eslint-config-standard-16.0.3.tgz",
-      "integrity": "sha512-x4fmJL5hGqNJKGHSjnLdgA6U6h1YW/G2dW9fA+cyVur4SK6lyue8+UgNKWlZtUDTXvgKDD/Oa3GQjmB5kjtVvg==",
+    "services/latexqc/node_modules/fdir": {
+      "version": "6.4.4",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
+      "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
       "dev": true,
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/feross"
-        },
-        {
-          "type": "patreon",
-          "url": "https://www.patreon.com/feross"
-        },
-        {
-          "type": "consulting",
-          "url": "https://feross.org/support"
+      "license": "MIT",
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
         }
-      ],
-      "peerDependencies": {
-        "eslint": "^7.12.1",
-        "eslint-plugin-import": "^2.22.1",
-        "eslint-plugin-node": "^11.1.0",
-        "eslint-plugin-promise": "^4.2.1 || ^5.0.0"
-      }
-    },
-    "services/latexqc/node_modules/eslint-plugin-promise": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-promise/-/eslint-plugin-promise-5.2.0.tgz",
-      "integrity": "sha512-SftLb1pUG01QYq2A/hGAWfDRXqYD82zE7j7TopDOyNdU+7SvvoXREls/+PRTY17vUXzXnZA/zfnyKgRH6x4JJw==",
-      "dev": true,
-      "peer": true,
-      "engines": {
-        "node": "^10.12.0 || >=12.0.0"
-      },
-      "peerDependencies": {
-        "eslint": "^7.0.0"
-      }
-    },
-    "services/latexqc/node_modules/espree": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-7.3.1.tgz",
-      "integrity": "sha512-v3JCNCE64umkFpmkFGqzVKsOT0tN1Zr+ueqLZfpV1Ob8e+CEgPWa+OxCoGH3tnhimMKIaBm4m/vaRpJ/krRz2g==",
-      "dev": true,
-      "dependencies": {
-        "acorn": "^7.4.0",
-        "acorn-jsx": "^5.3.1",
-        "eslint-visitor-keys": "^1.3.0"
-      },
-      "engines": {
-        "node": "^10.12.0 || >=12.0.0"
-      }
-    },
-    "services/latexqc/node_modules/espree/node_modules/eslint-visitor-keys": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz",
-      "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "services/latexqc/node_modules/globals": {
-      "version": "13.24.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
-      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
-      "dev": true,
-      "dependencies": {
-        "type-fest": "^0.20.2"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "services/latexqc/node_modules/helmet": {
@@ -43344,6 +43816,8 @@
       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
       "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "agent-base": "6",
         "debug": "4"
@@ -43352,26 +43826,16 @@
         "node": ">= 6"
       }
     },
-    "services/latexqc/node_modules/ignore": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-4.0.6.tgz",
-      "integrity": "sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==",
+    "services/latexqc/node_modules/jiti": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
+      "integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
       "dev": true,
-      "engines": {
-        "node": ">= 4"
-      }
-    },
-    "services/latexqc/node_modules/js-yaml": {
-      "version": "3.14.1",
-      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
-      "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==",
-      "dev": true,
-      "dependencies": {
-        "argparse": "^1.0.7",
-        "esprima": "^4.0.0"
-      },
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
       "bin": {
-        "js-yaml": "bin/js-yaml.js"
+        "jiti": "lib/jiti-cli.mjs"
       }
     },
     "services/latexqc/node_modules/jsdom": {
@@ -43379,6 +43843,8 @@
       "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-20.0.3.tgz",
       "integrity": "sha512-SYhBvTh89tTfCD/CRdSOm13mOBa42iTaTyfyEWBdKcGdPxPtLFBXuHR8XHb33YNYaP+lLbmSvBTsnoesCNJEsQ==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "abab": "^2.0.6",
         "acorn": "^8.8.1",
@@ -43424,6 +43890,8 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.12.1.tgz",
       "integrity": "sha512-tcpGyI9zbizT9JbV6oYE477V6mTlXvvi0T0G3SNIYE2apm/G5huBa1+K89VGeovbg+jycCrfhl3ADxErOuO6Jg==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -43437,11 +43905,12 @@
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true
     },
-    "services/latexqc/node_modules/just-extend": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-6.2.0.tgz",
-      "integrity": "sha512-cYofQu2Xpom82S6qD778jBDpwvvy39s1l/hrYij2u9AMdQcGRpaBu6kY4mVhuno5kJVi1DAz4aiphA2WI1/OAw==",
-      "dev": true
+    "services/latexqc/node_modules/loupe": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.1.3.tgz",
+      "integrity": "sha512-kkIp7XSkP78ZxJEsSxW3712C6teJVoeHHwgo9zJ380de7IYyJ2ISlxojcH2pC5OFLewESmnRi/+XCDIEEVyoug==",
+      "dev": true,
+      "license": "MIT"
     },
     "services/latexqc/node_modules/method-override": {
       "version": "2.3.10",
@@ -43470,41 +43939,13 @@
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
       "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A=="
     },
-    "services/latexqc/node_modules/nise": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/nise/-/nise-6.1.1.tgz",
-      "integrity": "sha512-aMSAzLVY7LyeM60gvBS423nBmIPP+Wy7St7hsb+8/fc1HmeoHJfLO8CKse4u3BtOZvQLJghYPI2i/1WZrEj5/g==",
-      "dev": true,
-      "dependencies": {
-        "@sinonjs/commons": "^3.0.1",
-        "@sinonjs/fake-timers": "^13.0.1",
-        "@sinonjs/text-encoding": "^0.7.3",
-        "just-extend": "^6.2.0",
-        "path-to-regexp": "^8.1.0"
-      }
-    },
-    "services/latexqc/node_modules/optionator": {
-      "version": "0.9.4",
-      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
-      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
-      "dev": true,
-      "dependencies": {
-        "deep-is": "^0.1.3",
-        "fast-levenshtein": "^2.0.6",
-        "levn": "^0.4.1",
-        "prelude-ls": "^1.2.1",
-        "type-check": "^0.4.0",
-        "word-wrap": "^1.2.5"
-      },
-      "engines": {
-        "node": ">= 0.8.0"
-      }
-    },
     "services/latexqc/node_modules/parse5": {
       "version": "7.1.2",
       "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz",
       "integrity": "sha512-Czj1WaSVpaoj0wbhMzLmWD69anp2WH7FXMB9n1Sy8/ZFF9jolSQVMu1Ij5WIyGmcBmhk7EOndpO4mIpihVqAXw==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "entities": "^4.4.0"
       },
@@ -43512,26 +43953,27 @@
         "url": "https://github.com/inikulin/parse5?sponsor=1"
       }
     },
-    "services/latexqc/node_modules/path-to-regexp": {
-      "version": "8.2.0",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.2.0.tgz",
-      "integrity": "sha512-TdrF7fW9Rphjq4RjrW0Kp2AW0Ahwu9sRGTkS6bvDi0SCwZlEZYmcfDbEsTz8RVk0EHIS/Vd1bv3JhG+1xZuAyQ==",
+    "services/latexqc/node_modules/pathval": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/pathval/-/pathval-2.0.0.tgz",
+      "integrity": "sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=16"
+        "node": ">= 14.16"
       }
     },
-    "services/latexqc/node_modules/react-cookie": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/react-cookie/-/react-cookie-7.2.0.tgz",
-      "integrity": "sha512-mqhPERUyfOljq5yJ4woDFI33bjEtigsl8JDJdPPeNhr0eSVZmBc/2Vdf8mFxOUktQxhxTR1T+uF0/FRTZyBEgw==",
-      "dependencies": {
-        "@types/hoist-non-react-statics": "^3.3.5",
-        "hoist-non-react-statics": "^3.3.2",
-        "universal-cookie": "^7.0.0"
+    "services/latexqc/node_modules/picomatch": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
+      "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
       },
-      "peerDependencies": {
-        "react": ">= 16.3.0"
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
     "services/latexqc/node_modules/react-dropzone": {
@@ -43577,11 +44019,23 @@
         "react": "^16.3.0 || ^17.0.0 || ^18.0.0"
       }
     },
+    "services/latexqc/node_modules/react-refresh": {
+      "version": "0.17.0",
+      "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz",
+      "integrity": "sha512-z6F7K9bV85EfseRCp2bzrpyQ0Gkw1uLoCel9XBVWPg/TjRj94SkJzUTGfOa4bs7iJvBWtQG0Wq7wnI0syw3EBQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "services/latexqc/node_modules/saxes": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
       "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "xmlchars": "^2.2.0"
       },
@@ -43637,46 +44091,14 @@
         "ajv": "^8.8.2"
       }
     },
-    "services/latexqc/node_modules/semver": {
-      "version": "7.6.3",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz",
-      "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==",
+    "services/latexqc/node_modules/tinyrainbow": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-2.0.0.tgz",
+      "integrity": "sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==",
       "dev": true,
-      "bin": {
-        "semver": "bin/semver.js"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=10"
-      }
-    },
-    "services/latexqc/node_modules/sinon": {
-      "version": "19.0.2",
-      "resolved": "https://registry.npmjs.org/sinon/-/sinon-19.0.2.tgz",
-      "integrity": "sha512-euuToqM+PjO4UgXeLETsfQiuoyPXlqFezr6YZDFwHR3t4qaX0fZUe1MfPMznTL5f8BWrVS89KduLdMUsxFCO6g==",
-      "dev": true,
-      "dependencies": {
-        "@sinonjs/commons": "^3.0.1",
-        "@sinonjs/fake-timers": "^13.0.2",
-        "@sinonjs/samsam": "^8.0.1",
-        "diff": "^7.0.0",
-        "nise": "^6.1.1",
-        "supports-color": "^7.2.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/sinon"
-      }
-    },
-    "services/latexqc/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
-      "dependencies": {
-        "has-flag": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=8"
+        "node": ">=14.0.0"
       }
     },
     "services/latexqc/node_modules/tr46": {
@@ -43684,6 +44106,8 @@
       "resolved": "https://registry.npmjs.org/tr46/-/tr46-3.0.0.tgz",
       "integrity": "sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "punycode": "^2.1.1"
       },
@@ -43691,22 +44115,150 @@
         "node": ">=12"
       }
     },
-    "services/latexqc/node_modules/type-detect": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.1.0.tgz",
-      "integrity": "sha512-Acylog8/luQ8L7il+geoSxhEkazvkslg7PSNKOX59mbB9cOveP5aq9h74Y7YU8yDpJwetzQQrfIwtf4Wp4LKcw==",
+    "services/latexqc/node_modules/vite": {
+      "version": "6.3.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.2.tgz",
+      "integrity": "sha512-ZSvGOXKGceizRQIZSz7TGJ0pS3QLlVY/9hwxVh17W3re67je1RKYzFHivZ/t0tubU78Vkyb9WnHPENSBCzbckg==",
       "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.25.0",
+        "fdir": "^6.4.3",
+        "picomatch": "^4.0.2",
+        "postcss": "^8.5.3",
+        "rollup": "^4.34.9",
+        "tinyglobby": "^0.2.12"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
       "engines": {
-        "node": ">=4"
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "jiti": ">=1.21.0",
+        "less": "*",
+        "lightningcss": "^1.21.0",
+        "sass": "*",
+        "sass-embedded": "*",
+        "stylus": "*",
+        "sugarss": "*",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
       }
     },
-    "services/latexqc/node_modules/universal-cookie": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/universal-cookie/-/universal-cookie-7.2.0.tgz",
-      "integrity": "sha512-PvcyflJAYACJKr28HABxkGemML5vafHmiL4ICe3e+BEKXRMt0GaFLZhAwgv637kFFnnfiSJ8e6jknrKkMrU+PQ==",
+    "services/latexqc/node_modules/vitest": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-3.1.2.tgz",
+      "integrity": "sha512-WaxpJe092ID1C0mr+LH9MmNrhfzi8I65EX/NRU/Ld016KqQNRgxSOlGNP1hHN+a/F8L15Mh8klwaF77zR3GeDQ==",
+      "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "@types/cookie": "^0.6.0",
-        "cookie": "^0.6.0"
+        "@vitest/expect": "3.1.2",
+        "@vitest/mocker": "3.1.2",
+        "@vitest/pretty-format": "^3.1.2",
+        "@vitest/runner": "3.1.2",
+        "@vitest/snapshot": "3.1.2",
+        "@vitest/spy": "3.1.2",
+        "@vitest/utils": "3.1.2",
+        "chai": "^5.2.0",
+        "debug": "^4.4.0",
+        "expect-type": "^1.2.1",
+        "magic-string": "^0.30.17",
+        "pathe": "^2.0.3",
+        "std-env": "^3.9.0",
+        "tinybench": "^2.9.0",
+        "tinyexec": "^0.3.2",
+        "tinyglobby": "^0.2.13",
+        "tinypool": "^1.0.2",
+        "tinyrainbow": "^2.0.0",
+        "vite": "^5.0.0 || ^6.0.0",
+        "vite-node": "3.1.2",
+        "why-is-node-running": "^2.3.0"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@types/debug": "^4.1.12",
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "@vitest/browser": "3.1.2",
+        "@vitest/ui": "3.1.2",
+        "happy-dom": "*",
+        "jsdom": "*"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@types/debug": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        }
       }
     },
     "services/latexqc/node_modules/w3c-xmlserializer": {
@@ -43714,6 +44266,8 @@
       "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz",
       "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "xml-name-validator": "^4.0.0"
       },
@@ -43754,6 +44308,8 @@
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-11.0.0.tgz",
       "integrity": "sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==",
       "dev": true,
+      "optional": true,
+      "peer": true,
       "dependencies": {
         "tr46": "^3.0.0",
         "webidl-conversions": "^7.0.0"
@@ -43762,6 +44318,21 @@
         "node": ">=12"
       }
     },
+    "services/latexqc/node_modules/yaml": {
+      "version": "2.7.1",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.7.1.tgz",
+      "integrity": "sha512-10ULxpnOCQXxJvBgxsn9ptjq6uviG/htZKk9veJGhlqn3w/DxQ631zFF+nlQXLwmImeS5amR2dl2U8sg6U9jsQ==",
+      "dev": true,
+      "license": "ISC",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "services/notifications": {
       "name": "@overleaf/notifications",
       "license": "ISC",
@@ -43796,6 +44367,7 @@
         "@overleaf/promise-utils": "*",
         "@overleaf/redis-wrapper": "*",
         "@overleaf/settings": "*",
+        "@overleaf/stream-utils": "*",
         "async": "^3.2.5",
         "aws-sdk": "^2.650.0",
         "body-parser": "^1.20.3",
@@ -43882,7 +44454,7 @@
         "lodash": "^4.17.21",
         "proxy-addr": "^2.0.7",
         "request": "^2.88.2",
-        "socket.io": "github:overleaf/socket.io#0.9.19-overleaf-10",
+        "socket.io": "github:overleaf/socket.io#0.9.19-overleaf-12",
         "socket.io-client": "github:overleaf/socket.io-client#0.9.17-overleaf-5"
       },
       "devDependencies": {
@@ -44253,16 +44825,16 @@
         "@overleaf/promise-utils": "*",
         "@overleaf/redis-wrapper": "*",
         "@overleaf/settings": "*",
+        "@overleaf/stream-utils": "*",
         "@phosphor-icons/react": "^2.1.7",
         "@slack/webhook": "^7.0.2",
-        "@stripe/react-stripe-js": "^3.1.1",
-        "@stripe/stripe-js": "^5.6.0",
+        "@stripe/stripe-js": "^7.3.0",
         "@xmldom/xmldom": "^0.7.13",
         "accepts": "^1.3.7",
         "ajv": "^8.12.0",
         "archiver": "^5.3.0",
         "async": "^3.2.5",
-        "base-x": "^4.0.0",
+        "base-x": "^4.0.1",
         "basic-auth": "^2.0.1",
         "bcrypt": "^5.0.0",
         "body-parser": "^1.20.3",
@@ -44308,7 +44880,7 @@
         "moment": "^2.29.4",
         "mongodb-legacy": "6.1.3",
         "mongoose": "8.9.5",
-        "multer": "overleaf/multer#e1df247fbf8e7590520d20ae3601eaef9f3d2e9e",
+        "multer": "overleaf/multer#4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23",
         "nocache": "^2.1.0",
         "node-fetch": "^2.7.0",
         "nodemailer": "^6.7.0",
@@ -44333,7 +44905,7 @@
         "request": "^2.88.2",
         "requestretry": "^7.1.0",
         "sanitize-html": "^2.8.1",
-        "stripe": "^17.7.0",
+        "stripe": "^18.1.0",
         "tough-cookie": "^4.0.0",
         "tsscmp": "^1.0.6",
         "uid-safe": "^2.1.5",
@@ -44346,52 +44918,52 @@
         "yauzl": "^2.10.0"
       },
       "devDependencies": {
-        "@babel/cli": "^7.24.8",
-        "@babel/core": "^7.25.2",
-        "@babel/preset-env": "^7.25.3",
-        "@babel/preset-react": "^7.24.7",
-        "@babel/preset-typescript": "^7.24.7",
-        "@babel/register": "^7.24.6",
+        "@babel/cli": "^7.27.0",
+        "@babel/core": "^7.26.10",
+        "@babel/preset-env": "^7.26.9",
+        "@babel/preset-react": "^7.26.3",
+        "@babel/preset-typescript": "^7.27.0",
+        "@babel/register": "^7.25.9",
         "@codemirror/autocomplete": "github:overleaf/codemirror-autocomplete#6445cd056671c98d12d1c597ba705e11327ec4c5",
-        "@codemirror/commands": "^6.8.0",
+        "@codemirror/commands": "^6.8.1",
         "@codemirror/lang-markdown": "^6.3.2",
-        "@codemirror/language": "^6.10.8",
-        "@codemirror/lint": "^6.8.4",
+        "@codemirror/language": "^6.11.0",
+        "@codemirror/lint": "^6.8.5",
         "@codemirror/search": "github:overleaf/codemirror-search#04380a528c339cd4b78fb10b3ef017f657ec17bd",
         "@codemirror/state": "^6.5.2",
-        "@codemirror/view": "^6.36.3",
+        "@codemirror/view": "^6.36.8",
         "@juggle/resize-observer": "^3.3.1",
         "@lezer/common": "^1.2.3",
-        "@lezer/generator": "^1.7.1",
+        "@lezer/generator": "^1.7.3",
         "@lezer/highlight": "^1.2.1",
         "@lezer/lr": "^1.4.2",
-        "@lezer/markdown": "^1.3.2",
+        "@lezer/markdown": "^1.4.3",
         "@overleaf/codemirror-tree-view": "^0.1.3",
         "@overleaf/dictionaries": "https://github.com/overleaf/dictionaries/archive/refs/tags/v0.0.3.tar.gz",
         "@overleaf/ranges-tracker": "*",
         "@overleaf/stream-utils": "*",
-        "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
+        "@pmmmwh/react-refresh-webpack-plugin": "^0.5.16",
         "@pollyjs/adapter-node-http": "^6.0.6",
         "@pollyjs/core": "^6.0.6",
         "@pollyjs/persister-fs": "^6.0.6",
+        "@prettier/plugin-pug": "^3.4.0",
         "@replit/codemirror-emacs": "overleaf/codemirror-emacs#4394c03858f27053f8768258e9493866e06e938e",
         "@replit/codemirror-indentation-markers": "overleaf/codemirror-indentation-markers#78264032eb286bc47871569ae87bff5ca1c6c161",
         "@replit/codemirror-vim": "overleaf/codemirror-vim#1bef138382d948018f3f9b8a4d7a70ab61774e4b",
         "@sentry/browser": "7.46.0",
-        "@storybook/addon-a11y": "^8.6.4",
-        "@storybook/addon-essentials": "^8.6.4",
-        "@storybook/addon-interactions": "^8.6.4",
-        "@storybook/addon-links": "^8.6.4",
+        "@storybook/addon-a11y": "^8.6.12",
+        "@storybook/addon-essentials": "^8.6.12",
+        "@storybook/addon-interactions": "^8.6.12",
+        "@storybook/addon-links": "^8.6.12",
         "@storybook/addon-styling-webpack": "^1.0.1",
-        "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
-        "@storybook/cli": "^8.6.4",
-        "@storybook/react": "^8.6.4",
-        "@storybook/react-webpack5": "^8.6.4",
-        "@storybook/theming": "^8.6.4",
+        "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
+        "@storybook/cli": "^8.6.12",
+        "@storybook/react": "^8.6.12",
+        "@storybook/react-webpack5": "^8.6.12",
+        "@storybook/theming": "^8.6.12",
         "@testing-library/cypress": "^10.0.1",
-        "@testing-library/dom": "^9.3.0",
-        "@testing-library/react": "^12.1.5",
-        "@testing-library/react-hooks": "^8.0.1",
+        "@testing-library/dom": "^10.4.0",
+        "@testing-library/react": "^16.3.0",
         "@testing-library/user-event": "^14.4.3",
         "@types/bootstrap": "^5.2.10",
         "@types/bootstrap-5": "npm:@types/bootstrap@^5.2.10",
@@ -44402,13 +44974,11 @@
         "@types/express": "^4.17.13",
         "@types/mocha": "^9.1.0",
         "@types/mocha-each": "^2.0.0",
-        "@types/react": "^17.0.40",
-        "@types/react-bootstrap": "^0.32.36",
-        "@types/react-color": "^3.0.6",
-        "@types/react-dom": "^17.0.13",
-        "@types/react-google-recaptcha": "^2.1.5",
-        "@types/react-linkify": "^1.0.0",
-        "@types/react-overlays": "^1.1.3",
+        "@types/react": "^18.3.20",
+        "@types/react-color": "^3.0.13",
+        "@types/react-dom": "^18.3.6",
+        "@types/react-google-recaptcha": "^2.1.9",
+        "@types/react-linkify": "^1.0.4",
         "@types/recurly__recurly-js": "^4.22.0",
         "@types/sinon-chai": "^3.2.8",
         "@types/uuid": "^9.0.8",
@@ -44420,6 +44990,7 @@
         "@uppy/react": "^3.2.1",
         "@uppy/utils": "^5.7.0",
         "@uppy/xhr-upload": "^3.6.0",
+        "@vitest/eslint-plugin": "1.1.44",
         "5to6-codemod": "^1.8.0",
         "abort-controller": "^3.0.0",
         "acorn": "^7.1.1",
@@ -44431,7 +45002,7 @@
         "babel-plugin-module-resolver": "^5.0.2",
         "backbone": "^1.6.0",
         "bootstrap": "^3.4.1",
-        "bootstrap-5": "npm:bootstrap@^5.3.3",
+        "bootstrap-5": "npm:bootstrap@^5.3.6",
         "c8": "^7.2.0",
         "chai": "^4.3.6",
         "chai-as-promised": "^7.1.1",
@@ -44441,9 +45012,10 @@
         "chartjs-plugin-datalabels": "^2.2.0",
         "cheerio": "^1.0.0-rc.3",
         "classnames": "^2.2.6",
+        "confusing-browser-globals": "^1.0.11",
         "cookie-signature": "^1.2.1",
         "copy-webpack-plugin": "^11.0.0",
-        "core-js": "^3.38.1",
+        "core-js": "^3.41.0",
         "css-loader": "^6.8.1",
         "css-minimizer-webpack-plugin": "^5.0.1",
         "cypress": "13.13.2",
@@ -44452,7 +45024,7 @@
         "daterangepicker": "2.1.27",
         "diff": "^5.1.0",
         "dompurify": "^3.2.4",
-        "downshift": "^6.1.0",
+        "downshift": "^9.0.9",
         "es6-promise": "^4.2.8",
         "escodegen": "^2.0.0",
         "eslint-config-standard-jsx": "^11.0.0",
@@ -44461,13 +45033,13 @@
         "eslint-plugin-react-hooks": "^4.6.0",
         "eslint-plugin-testing-library": "^7.1.1",
         "eslint-plugin-unicorn": "^56.0.0",
-        "esmock": "^2.6.7",
         "events": "^3.3.0",
         "fake-indexeddb": "^6.0.0",
-        "fetch-mock": "^9.10.2",
+        "fetch-mock": "^12.5.2",
         "formik": "^2.2.9",
         "fuse.js": "^3.0.0",
         "glob": "^7.1.6",
+        "globals": "^16.2.0",
         "handlebars": "^4.7.8",
         "handlebars-loader": "^1.7.3",
         "html-webpack-plugin": "^5.5.3",
@@ -44489,25 +45061,23 @@
         "nock": "^13.5.6",
         "nvd3": "^1.8.6",
         "overleaf-editor-core": "*",
-        "pdfjs-dist": "4.10.38",
+        "pdfjs-dist": "5.1.91",
         "pirates": "^4.0.1",
         "postcss": "^8.4.31",
         "postcss-loader": "^7.3.3",
         "prop-types": "^15.7.2",
         "qrcode": "^1.4.4",
-        "react": "^17.0.2",
-        "react-bootstrap": "^0.33.1",
-        "react-bootstrap-5": "npm:react-bootstrap@^2.10.5",
+        "react": "^18.3.1",
+        "react-bootstrap": "^2.10.10",
         "react-chartjs-2": "^5.0.1",
         "react-color": "^2.19.3",
         "react-dnd": "^16.0.1",
         "react-dnd-html5-backend": "^16.0.1",
-        "react-dom": "^17.0.2",
-        "react-error-boundary": "^2.3.1",
+        "react-dom": "^18.3.1",
+        "react-error-boundary": "^5.0.0",
         "react-google-recaptcha": "^3.1.0",
         "react-i18next": "^13.3.1",
         "react-linkify": "^1.0.0-alpha",
-        "react-overlays": "^0.9.3",
         "react-refresh": "^0.14.0",
         "react-resizable-panels": "^2.1.1",
         "resolve-url-loader": "^5.0.0",
@@ -44519,36 +45089,25 @@
         "sinon": "^7.5.0",
         "sinon-chai": "^3.7.0",
         "sinon-mongoose": "^2.3.0",
-        "storybook": "^8.6.4",
+        "storybook": "^8.6.12",
         "stylelint-config-standard-scss": "^13.1.0",
         "terser-webpack-plugin": "^5.3.9",
         "thread-loader": "^4.0.2",
         "timekeeper": "^2.2.0",
         "to-string-loader": "^1.2.0",
         "tty-browserify": "^0.0.1",
-        "typescript": "^5.0.4",
+        "typescript": "^5.8.3",
         "uuid": "^9.0.1",
+        "vitest": "^3.1.2",
         "w3c-keyname": "^2.2.8",
         "webpack": "^5.98.0",
         "webpack-assets-manifest": "^5.2.1",
         "webpack-cli": "^5.1.4",
-        "webpack-dev-server": "^5.2.0",
+        "webpack-dev-server": "^5.2.1",
         "webpack-merge": "^5.10.0",
         "yup": "^0.32.11"
       }
     },
-    "services/web/node_modules/@babel/runtime": {
-      "version": "7.25.7",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.7.tgz",
-      "integrity": "sha512-FjoyLe754PMiYsFaN5C94ttGiOmBNYTf6pLr4xXHAT5uctHb092PBszndLDR5XA/jghQvn4n7JMHl7dmTgbm9w==",
-      "dev": true,
-      "dependencies": {
-        "regenerator-runtime": "^0.14.0"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
     "services/web/node_modules/@google-cloud/bigquery": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/@google-cloud/bigquery/-/bigquery-6.0.3.tgz",
@@ -44738,30 +45297,26 @@
         "lodash": "^4.17.15"
       }
     },
-    "services/web/node_modules/@testing-library/dom": {
-      "version": "9.3.0",
-      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.3.0.tgz",
-      "integrity": "sha512-Dffe68pGwI6WlLRYR2I0piIkyole9cSBH5jGQKCGMRpHW5RHCqAUaqc2Kv0tUyd4dU4DLPKhJIjyKOnjv4tuUw==",
-      "dev": true,
-      "dependencies": {
-        "@babel/code-frame": "^7.10.4",
-        "@babel/runtime": "^7.12.5",
-        "@types/aria-query": "^5.0.1",
-        "aria-query": "^5.0.0",
-        "chalk": "^4.1.0",
-        "dom-accessibility-api": "^0.5.9",
-        "lz-string": "^1.5.0",
-        "pretty-format": "^27.0.2"
-      },
+    "services/web/node_modules/@stripe/stripe-js": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-7.3.0.tgz",
+      "integrity": "sha512-xnCyFIEI5SQnQrKkCxVj7nS5fWTZap+zuIGzmmxLMdlmgahFJaihK4zogqE8YyKKTLtrp/EldkEijSgtXsRVDg==",
+      "license": "MIT",
       "engines": {
-        "node": ">=14"
+        "node": ">=12.16"
       }
     },
-    "services/web/node_modules/@types/aria-query": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz",
-      "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==",
-      "dev": true
+    "services/web/node_modules/@types/debug": {
+      "version": "4.1.12",
+      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
+      "integrity": "sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "@types/ms": "*"
+      }
     },
     "services/web/node_modules/@types/express": {
       "version": "4.17.21",
@@ -44781,44 +45336,149 @@
       "integrity": "sha512-Z61JK7DKDtdKTWwLeElSEBcWGRLY8g95ic5FoQqI9CMx0ns/Ghep3B4DfcEimiKMvtamNVULVNKEsiwV3aQmXw==",
       "dev": true
     },
-    "services/web/node_modules/@uppy/companion-client": {
-      "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/@uppy/companion-client/-/companion-client-3.7.0.tgz",
-      "integrity": "sha512-37qJNMkqo01SM9h2gkFbV6e+aXM02s2zAda2dGsRLRsjvl/Tx69NlmxJ3xqG/7HWRnYcbBWtspb7y0tt1i/afg==",
+    "services/web/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.32.1.tgz",
+      "integrity": "sha512-7IsIaIDeZn7kffk7qXC3o6Z4UblZJKV3UBpkvRNpr5NSyLji7tvTcvmnMNYuYLyh26mN8W723xpo3i4MlD33vA==",
       "dev": true,
+      "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "@uppy/utils": "^5.7.0",
-        "namespace-emitter": "^2.0.1",
-        "p-retry": "^6.1.0"
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "services/web/node_modules/@uppy/core": {
-      "version": "3.8.0",
-      "resolved": "https://registry.npmjs.org/@uppy/core/-/core-3.8.0.tgz",
-      "integrity": "sha512-C93vVhid929+VLGjaD9CZOLJDg8GkEGMUGveFp3Tyo/wujiG+sB3fOF+c6TzKpzPLfNtVpskU1BnI7tZrq1LWw==",
+    "services/web/node_modules/@typescript-eslint/types": {
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.32.1.tgz",
+      "integrity": "sha512-YmybwXUJcgGqgAp6bEsgpPXEg6dcCyPyCSr0CAAueacR/CCBi25G3V8gGQ2kRzQRBNol7VQknxMs9HvVa9Rvfg==",
       "dev": true,
-      "dependencies": {
-        "@transloadit/prettier-bytes": "0.0.9",
-        "@uppy/store-default": "^3.2.0",
-        "@uppy/utils": "^5.7.0",
-        "lodash": "^4.17.21",
-        "mime-match": "^1.0.2",
-        "namespace-emitter": "^2.0.1",
-        "nanoid": "^4.0.0",
-        "preact": "^10.5.13"
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
       }
     },
-    "services/web/node_modules/@uppy/core/node_modules/@transloadit/prettier-bytes": {
-      "version": "0.0.9",
-      "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.0.9.tgz",
-      "integrity": "sha512-pCvdmea/F3Tn4hAtHqNXmjcixSaroJJ+L3STXlYJdir1g1m2mRQpWbN8a4SvgQtaw2930Ckhdx8qXdXBFMKbAA==",
-      "dev": true
+    "services/web/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.32.1.tgz",
+      "integrity": "sha512-Y3AP9EIfYwBb4kWGb+simvPaqQoT5oJuzzj9m0i6FCY6SPvlomY2Ei4UEMm7+FXtlNJbor80ximyslzaQF6xhg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/visitor-keys": "8.32.1",
+        "debug": "^4.3.4",
+        "fast-glob": "^3.3.2",
+        "is-glob": "^4.0.3",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "ts-api-utils": "^2.1.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "services/web/node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "peer": true,
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "services/web/node_modules/@typescript-eslint/utils": {
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.32.1.tgz",
+      "integrity": "sha512-DsSFNIgLSrc89gpq1LJB7Hm1YpuhK086DRDJSNrewcGvYloWW1vZLHBTIvarKZDcAORIy/uWNx8Gad+4oMpkSA==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.32.1",
+        "@typescript-eslint/types": "8.32.1",
+        "@typescript-eslint/typescript-estree": "8.32.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <5.9.0"
+      }
+    },
+    "services/web/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.32.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.32.1.tgz",
+      "integrity": "sha512-ar0tjQfObzhSaW3C3QNmTc5ofj0hDoNQ5XWrCy6zDyabdr0TWhCkClp+rywGNj/odAFBVzzJrK4tEq5M4Hmu4w==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@typescript-eslint/types": "8.32.1",
+        "eslint-visitor-keys": "^4.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "services/web/node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz",
+      "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "peer": true,
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
     },
     "services/web/node_modules/@uppy/dashboard": {
       "version": "3.7.1",
       "resolved": "https://registry.npmjs.org/@uppy/dashboard/-/dashboard-3.7.1.tgz",
       "integrity": "sha512-qtCMXd2Ymrw0qNGSTlEEMyyDkGUCm+wX5/VrmV9lnfT7JtlSfotUK0K6KvkBeu2v1Chsu27C6Xlq6RddZMR2xQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@transloadit/prettier-bytes": "0.0.7",
         "@uppy/informer": "^3.0.4",
@@ -44837,11 +45497,19 @@
         "@uppy/core": "^3.7.1"
       }
     },
+    "services/web/node_modules/@uppy/dashboard/node_modules/@transloadit/prettier-bytes": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.0.7.tgz",
+      "integrity": "sha512-VeJbUb0wEKbcwaSlj5n+LscBl9IPgLPkHVGBkh00cztv6X4L/TJXK58LzFuBKX7/GAfiGhIwH67YTLTlzvIzBA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "services/web/node_modules/@uppy/drag-drop": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@uppy/drag-drop/-/drag-drop-3.0.3.tgz",
       "integrity": "sha512-0bCgQKxg+9vkxQipTgrX9yQIuK9a0hZrkipm1+Ynq6jTeig49b7II1bWYnoKdiYhi6nRE4UnDJf4z09yCAU7rA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@uppy/utils": "^5.4.3",
         "preact": "^10.5.13"
@@ -44855,19 +45523,7 @@
       "resolved": "https://registry.npmjs.org/@uppy/file-input/-/file-input-3.0.4.tgz",
       "integrity": "sha512-D7Nw9GgpABYTcC8SZluDyxd+ppe7+gJejNbPZqMpQyW1S/ME3me55dkDQaVWn8yrgv7347zO2ciue9Rfmko+rQ==",
       "dev": true,
-      "dependencies": {
-        "@uppy/utils": "^5.5.2",
-        "preact": "^10.5.13"
-      },
-      "peerDependencies": {
-        "@uppy/core": "^3.6.0"
-      }
-    },
-    "services/web/node_modules/@uppy/informer": {
-      "version": "3.0.4",
-      "resolved": "https://registry.npmjs.org/@uppy/informer/-/informer-3.0.4.tgz",
-      "integrity": "sha512-gzocdxn8qAFsW2EryehwjghladaBgv6Isjte53FTBV7o/vjaHPP6huKGbYpljyuQi8i9V+KrmvNGslofssgJ4g==",
-      "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@uppy/utils": "^5.5.2",
         "preact": "^10.5.13"
@@ -44881,6 +45537,7 @@
       "resolved": "https://registry.npmjs.org/@uppy/progress-bar/-/progress-bar-3.0.4.tgz",
       "integrity": "sha512-sxv/mG7Uc9uyTnRvfcXBhO+TWd+UqjuW5aHXCKWwTkMgDShHR0T46sEk12q+jwgbFwyeFg3p0GU3hgUxqxiEUQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@uppy/utils": "^5.5.2",
         "preact": "^10.5.13"
@@ -44889,64 +45546,12 @@
         "@uppy/core": "^3.6.0"
       }
     },
-    "services/web/node_modules/@uppy/provider-views": {
-      "version": "3.8.0",
-      "resolved": "https://registry.npmjs.org/@uppy/provider-views/-/provider-views-3.8.0.tgz",
-      "integrity": "sha512-sTtx5bgsg2WVR+MyF0gnnM3Z7g3CyFx+Stlz//AvB6g27EMqtqO4zwDR3mestMrETkWYov5bhhqUbt2BaeANpA==",
-      "dev": true,
-      "dependencies": {
-        "@uppy/utils": "^5.7.0",
-        "classnames": "^2.2.6",
-        "nanoid": "^4.0.0",
-        "p-queue": "^7.3.4",
-        "preact": "^10.5.13"
-      },
-      "peerDependencies": {
-        "@uppy/core": "^3.8.0"
-      }
-    },
-    "services/web/node_modules/@uppy/provider-views/node_modules/eventemitter3": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
-      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "services/web/node_modules/@uppy/provider-views/node_modules/p-queue": {
-      "version": "7.4.1",
-      "resolved": "https://registry.npmjs.org/p-queue/-/p-queue-7.4.1.tgz",
-      "integrity": "sha512-vRpMXmIkYF2/1hLBKisKeVYJZ8S2tZ0zEAmIJgdVKP2nq0nh4qCdf8bgw+ZgKrkh71AOCaqzwbJJk1WtdcF3VA==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "eventemitter3": "^5.0.1",
-        "p-timeout": "^5.0.2"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
-    "services/web/node_modules/@uppy/provider-views/node_modules/p-timeout": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/p-timeout/-/p-timeout-5.1.0.tgz",
-      "integrity": "sha512-auFDyzzzGZZZdHz3BtET9VEz0SE/uMEAx7uWfGPucfzEwwe/xH0iVeZibQmANYE/hp9T2+UUZT5m+BKyrDp3Ew==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "services/web/node_modules/@uppy/react": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/@uppy/react/-/react-3.2.1.tgz",
       "integrity": "sha512-PoLplDF6YDI7f06T8ORnJhav6CcKNSYWJETXqItZR3jcXIve6pdcCuskqd+l0yiYWf4J2IdyLQXtzgGfIJl7xQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@uppy/utils": "^5.6.0",
         "prop-types": "^15.6.1"
@@ -44978,61 +45583,12 @@
         }
       }
     },
-    "services/web/node_modules/@uppy/status-bar": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/@uppy/status-bar/-/status-bar-3.2.5.tgz",
-      "integrity": "sha512-bRSxBPio5B+Kuf6w8ll+/i9VUwG8f0FnbZ1yQvCr8J9vxhd0Z5hvwhX4NP8uzHC6ZPJHlEQOTsxzGQ6y+Mdm0A==",
-      "dev": true,
-      "dependencies": {
-        "@transloadit/prettier-bytes": "0.0.9",
-        "@uppy/utils": "^5.5.2",
-        "classnames": "^2.2.6",
-        "preact": "^10.5.13"
-      },
-      "peerDependencies": {
-        "@uppy/core": "^3.6.0"
-      }
-    },
-    "services/web/node_modules/@uppy/status-bar/node_modules/@transloadit/prettier-bytes": {
-      "version": "0.0.9",
-      "resolved": "https://registry.npmjs.org/@transloadit/prettier-bytes/-/prettier-bytes-0.0.9.tgz",
-      "integrity": "sha512-pCvdmea/F3Tn4hAtHqNXmjcixSaroJJ+L3STXlYJdir1g1m2mRQpWbN8a4SvgQtaw2930Ckhdx8qXdXBFMKbAA==",
-      "dev": true
-    },
-    "services/web/node_modules/@uppy/store-default": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/@uppy/store-default/-/store-default-3.2.0.tgz",
-      "integrity": "sha512-Y7t0peUG89ZKa30vM4qlRIC6uKxIfOANeMT9Nzjwcxvzz8l7es22jG3eAj9WF2F7YSu7xdsH8ODs6SIrJJ8gow==",
-      "dev": true
-    },
-    "services/web/node_modules/@uppy/thumbnail-generator": {
-      "version": "3.0.6",
-      "resolved": "https://registry.npmjs.org/@uppy/thumbnail-generator/-/thumbnail-generator-3.0.6.tgz",
-      "integrity": "sha512-gsi/BQBiunHneXCbo8VglFbhEb0CoQXQjCyGNKoEq/deEcbXhBBDxkiGcgv83l5GZJl2jLiKWqXnXAXREkldrQ==",
-      "dev": true,
-      "dependencies": {
-        "@uppy/utils": "^5.5.2",
-        "exifr": "^7.0.0"
-      },
-      "peerDependencies": {
-        "@uppy/core": "^3.6.0"
-      }
-    },
-    "services/web/node_modules/@uppy/utils": {
-      "version": "5.7.0",
-      "resolved": "https://registry.npmjs.org/@uppy/utils/-/utils-5.7.0.tgz",
-      "integrity": "sha512-AJj7gAx5YfMgyevwOxVdIP2h4Nw/O6h57wKA6gj+Lce6tMORcqzGt4yQiKBsrBI0bPyFWCbzA3vX5t0//1JCBA==",
-      "dev": true,
-      "dependencies": {
-        "lodash": "^4.17.21",
-        "preact": "^10.5.13"
-      }
-    },
     "services/web/node_modules/@uppy/xhr-upload": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/@uppy/xhr-upload/-/xhr-upload-3.6.0.tgz",
       "integrity": "sha512-HgWr+CvJzJXAp639AiZatdEWmRdhhN5LrjTZurAkvm9nPQarpi1bo0DChO+1bpkXWOR/1VarBbZOr8lNecEn7Q==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "@uppy/companion-client": "^3.7.0",
         "@uppy/utils": "^5.7.0",
@@ -45042,6 +45598,130 @@
         "@uppy/core": "^3.8.0"
       }
     },
+    "services/web/node_modules/@vitest/eslint-plugin": {
+      "version": "1.1.44",
+      "resolved": "https://registry.npmjs.org/@vitest/eslint-plugin/-/eslint-plugin-1.1.44.tgz",
+      "integrity": "sha512-m4XeohMT+Dj2RZfxnbiFR+Cv5dEC0H7C6TlxRQT7GK2556solm99kxgzJp/trKrZvanZcOFyw7aABykUTfWyrg==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "@typescript-eslint/utils": ">= 8.24.0",
+        "eslint": ">= 8.57.0",
+        "typescript": ">= 5.0.0",
+        "vitest": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        },
+        "vitest": {
+          "optional": true
+        }
+      }
+    },
+    "services/web/node_modules/@vitest/expect": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-3.1.4.tgz",
+      "integrity": "sha512-xkD/ljeliyaClDYqHPNCiJ0plY5YIcM0OlRiZizLhlPmpXWpxnGMyTZXOHFhFeG7w9P5PBeL4IdtJ/HeQwTbQA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "3.1.4",
+        "@vitest/utils": "3.1.4",
+        "chai": "^5.2.0",
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/@vitest/expect/node_modules/chai": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-5.2.0.tgz",
+      "integrity": "sha512-mCuXncKXk5iCLhfhwTc0izo0gtEmpz5CtG2y8GiOINBlMVS6v8TMRc5TaLWKS6692m9+dVVfzgeVxR5UxWHTYw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "assertion-error": "^2.0.1",
+        "check-error": "^2.1.1",
+        "deep-eql": "^5.0.1",
+        "loupe": "^3.1.0",
+        "pathval": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "services/web/node_modules/@vitest/pretty-format": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-3.1.4.tgz",
+      "integrity": "sha512-cqv9H9GvAEoTaoq+cYqUTCGscUjKqlJZC7PRwY5FMySVj5J+xOm1KQcCiYHJOEzOKRUhLH4R2pTwvFlWCEScsg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/@vitest/runner": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-3.1.4.tgz",
+      "integrity": "sha512-djTeF1/vt985I/wpKVFBMWUlk/I7mb5hmD5oP8K9ACRmVXgKTae3TUOtXAEBfslNKPzUQvnKhNd34nnRSYgLNQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/utils": "3.1.4",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/@vitest/snapshot": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-3.1.4.tgz",
+      "integrity": "sha512-JPHf68DvuO7vilmvwdPr9TS0SuuIzHvxeaCkxYcCD4jTk67XwL45ZhEHFKIuCm8CYstgI6LZ4XbwD6ANrwMpFg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "3.1.4",
+        "magic-string": "^0.30.17",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/@vitest/spy": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-3.1.4.tgz",
+      "integrity": "sha512-Xg1bXhu+vtPXIodYN369M86K8shGLouNjoVI78g8iAq2rFoHFdajNvJJ5A/9bPMFcfQqdaCpOgWKEoMQg/s0Yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyspy": "^3.0.2"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/@vitest/utils": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-3.1.4.tgz",
+      "integrity": "sha512-yriMuO1cfFhmiGc8ataN51+9ooHRuURdfAZfwFd3usWynjzpLslZdYnRegTv32qdgtJTsj15FoeZe2g15fY1gg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "3.1.4",
+        "loupe": "^3.1.3",
+        "tinyrainbow": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
     "services/web/node_modules/agent-base": {
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
@@ -45066,41 +45746,21 @@
         "url": "https://github.com/sponsors/epoberezkin"
       }
     },
-    "services/web/node_modules/ajv-keywords": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
-      "integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
+    "services/web/node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
       "dev": true,
-      "dependencies": {
-        "fast-deep-equal": "^3.1.3"
-      },
-      "peerDependencies": {
-        "ajv": "^8.8.2"
-      }
-    },
-    "services/web/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+        "node": ">=12"
       }
     },
-    "services/web/node_modules/aria-query": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
-      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
-      "dev": true,
-      "dependencies": {
-        "dequal": "^2.0.3"
-      }
+    "services/web/node_modules/base-x": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/base-x/-/base-x-4.0.1.tgz",
+      "integrity": "sha512-uAZ8x6r6S3aUM9rbHGVOIsR15U/ZSc82b3ymnCPsT45Gk1DDvhDPdIgB5MrhirZWt+5K0EEPQH985kNqZgNPFw==",
+      "license": "MIT"
     },
     "services/web/node_modules/brace-expansion": {
       "version": "2.0.1",
@@ -45133,20 +45793,14 @@
         "ieee754": "^1.2.1"
       }
     },
-    "services/web/node_modules/chalk": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+    "services/web/node_modules/check-error": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.1.tgz",
+      "integrity": "sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==",
       "dev": true,
-      "dependencies": {
-        "ansi-styles": "^4.1.0",
-        "supports-color": "^7.1.0"
-      },
+      "license": "MIT",
       "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/chalk?sponsor=1"
+        "node": ">= 16"
       }
     },
     "services/web/node_modules/csv": {
@@ -45195,34 +45849,14 @@
         }
       }
     },
-    "services/web/node_modules/dom-helpers": {
-      "version": "5.2.1",
-      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
-      "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
-      "dev": true,
-      "dependencies": {
-        "@babel/runtime": "^7.8.7",
-        "csstype": "^3.0.2"
-      }
-    },
-    "services/web/node_modules/duplexify": {
-      "version": "4.1.2",
-      "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
-      "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
-      "dependencies": {
-        "end-of-stream": "^1.4.1",
-        "inherits": "^2.0.3",
-        "readable-stream": "^3.1.1",
-        "stream-shift": "^1.0.0"
-      }
-    },
-    "services/web/node_modules/esmock": {
-      "version": "2.6.7",
-      "resolved": "https://registry.npmjs.org/esmock/-/esmock-2.6.7.tgz",
-      "integrity": "sha512-4DmjZ0qQIG+NQV1njHvWrua/cZEuJq56A3pSELT2BjNuol1aads7BluofCbLErdO41Ic1XCd2UMepVLpjL64YQ==",
+    "services/web/node_modules/deep-eql": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-5.0.2.tgz",
+      "integrity": "sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==",
       "dev": true,
+      "license": "MIT",
       "engines": {
-        "node": ">=14.16.0"
+        "node": ">=6"
       }
     },
     "services/web/node_modules/events": {
@@ -45233,11 +45867,49 @@
         "node": ">=0.8.x"
       }
     },
-    "services/web/node_modules/exifr": {
-      "version": "7.1.3",
-      "resolved": "https://registry.npmjs.org/exifr/-/exifr-7.1.3.tgz",
-      "integrity": "sha512-g/aje2noHivrRSLbAUtBPWFbxKdKhgj/xr1vATDdUXPOFYJlQ62Ft0oy+72V6XLIpDJfHs6gXLbBLAolqOXYRw==",
-      "dev": true
+    "services/web/node_modules/fdir": {
+      "version": "6.4.4",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.4.tgz",
+      "integrity": "sha512-1NZP+GK4GfuAv3PqKvxQRDMjdSRZjnkq7KfhlNrCNNlZ0ygQFpebfrnfnq/W7fpUnAv9aGWmY1zKx7FYL3gwhg==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "services/web/node_modules/fetch-mock": {
+      "version": "12.5.2",
+      "resolved": "https://registry.npmjs.org/fetch-mock/-/fetch-mock-12.5.2.tgz",
+      "integrity": "sha512-b5KGDFmdmado2MPQjZl6ix3dAG3iwCitb0XQwN72y2s9VnWZ3ObaGNy+bkpm1390foiLDybdJ7yjRGKD36kATw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/glob-to-regexp": "^0.4.4",
+        "dequal": "^2.0.3",
+        "glob-to-regexp": "^0.4.1",
+        "regexparam": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=18.11.0"
+      }
+    },
+    "services/web/node_modules/globals": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-16.2.0.tgz",
+      "integrity": "sha512-O+7l9tPdHCU320IigZZPj5zmRCFG9xHmx9cU8FqU2Rp+JN714seHV+2S9+JslCpY4gJwU2vOGox0wzgae/MCEg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
     },
     "services/web/node_modules/google-auth-library": {
       "version": "8.7.0",
@@ -45342,6 +46014,18 @@
       "integrity": "sha512-D2S+3GLxWH+uhrNEcoh/fnmYeP8E8/zHl644d/jdA0g2uyXvy3sb0qxotE+ne0LtccHknQzWwZEzhak7oJ0COQ==",
       "dev": true
     },
+    "services/web/node_modules/jiti": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
+      "integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
     "services/web/node_modules/json-schema-traverse": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
@@ -45353,6 +46037,13 @@
       "integrity": "sha512-gKO5uExCXvSm6zbF562EvM+rd1kQDnB9AZBbiQVzf1ZmdDpxUSvpnAaVOP83N/31mRK8Ml8/VE8DMvsAZQ+7wg==",
       "dev": true
     },
+    "services/web/node_modules/loupe": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/loupe/-/loupe-3.1.3.tgz",
+      "integrity": "sha512-kkIp7XSkP78ZxJEsSxW3712C6teJVoeHHwgo9zJ380de7IYyJ2ISlxojcH2pC5OFLewESmnRi/+XCDIEEVyoug==",
+      "dev": true,
+      "license": "MIT"
+    },
     "services/web/node_modules/lru-cache": {
       "version": "7.10.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-7.10.1.tgz",
@@ -45361,12 +46052,6 @@
         "node": ">=12"
       }
     },
-    "services/web/node_modules/memoize-one": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz",
-      "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==",
-      "dev": true
-    },
     "services/web/node_modules/method-override": {
       "version": "2.3.10",
       "resolved": "https://registry.npmjs.org/method-override/-/method-override-2.3.10.tgz",
@@ -45409,39 +46094,21 @@
       }
     },
     "services/web/node_modules/multer": {
-      "version": "1.4.5-lts.1",
-      "resolved": "git+ssh://git@github.com/overleaf/multer.git#e1df247fbf8e7590520d20ae3601eaef9f3d2e9e",
-      "integrity": "sha512-3fJSnWF3iBZJ6Z9y8AjFVY+O4DUKspxSnzXidb3zCKqBYyEKRrpGp7OXjT9th2gWPd+9u64ZyRWUf+YRYn1GCw==",
+      "version": "2.0.1",
+      "resolved": "git+ssh://git@github.com/overleaf/multer.git#4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23",
+      "integrity": "sha512-kkvPK48OQibR5vIoTQBbZp1uWVCvT9MrW3Y0mqdhFYJP/HVJujb4eSCEU0yj+hyf0Y+H/BKCmPdM4fJnzqAO4w==",
       "license": "MIT",
       "dependencies": {
         "append-field": "^1.0.0",
-        "busboy": "^1.0.0",
-        "concat-stream": "^1.5.2",
-        "mkdirp": "^0.5.4",
+        "busboy": "^1.6.0",
+        "concat-stream": "^2.0.0",
+        "mkdirp": "^0.5.6",
         "object-assign": "^4.1.1",
-        "type-is": "^1.6.4",
-        "xtend": "^4.0.0"
+        "type-is": "^1.6.18",
+        "xtend": "^4.0.2"
       },
       "engines": {
-        "node": ">= 6.0.0"
-      }
-    },
-    "services/web/node_modules/nanoid": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-4.0.2.tgz",
-      "integrity": "sha512-7ZtY5KTCNheRGfEFxnedV5zFiORN1+Y1N6zvPTnHQd8ENUvfaDBeuJDZb2bN/oXwXxu3qkTXDzy57W5vAmDTBw==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "bin": {
-        "nanoid": "bin/nanoid.js"
-      },
-      "engines": {
-        "node": "^14 || ^16 || >=18"
+        "node": ">= 10.16.0"
       }
     },
     "services/web/node_modules/nise": {
@@ -45494,23 +46161,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "services/web/node_modules/p-retry": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-6.2.0.tgz",
-      "integrity": "sha512-JA6nkq6hKyWLLasXQXUrO4z8BUZGUt/LjlJxx8Gb2+2ntodU/SS63YZ8b0LUTbQ8ZB9iwOfhEPhg4ykKnn2KsA==",
-      "dev": true,
-      "dependencies": {
-        "@types/retry": "0.12.2",
-        "is-network-error": "^1.0.0",
-        "retry": "^0.13.1"
-      },
-      "engines": {
-        "node": ">=16.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "services/web/node_modules/path-to-regexp": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.9.0.tgz",
@@ -45520,69 +46170,29 @@
         "isarray": "0.0.1"
       }
     },
-    "services/web/node_modules/preact": {
-      "version": "10.19.3",
-      "resolved": "https://registry.npmjs.org/preact/-/preact-10.19.3.tgz",
-      "integrity": "sha512-nHHTeFVBTHRGxJXKkKu5hT8C/YWBkPso4/Gad6xuj5dbptt9iF9NZr9pHbPhBrnT2klheu7mHTxTZ/LjwJiEiQ==",
+    "services/web/node_modules/pathval": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/pathval/-/pathval-2.0.0.tgz",
+      "integrity": "sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==",
       "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.16"
+      }
+    },
+    "services/web/node_modules/picomatch": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz",
+      "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
       "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/preact"
+        "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "services/web/node_modules/react-bootstrap-5": {
-      "name": "react-bootstrap",
-      "version": "2.10.5",
-      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.10.5.tgz",
-      "integrity": "sha512-XueAOEn64RRkZ0s6yzUTdpFtdUXs5L5491QU//8ZcODKJNDLt/r01tNyriZccjgRImH1REynUc9pqjiRMpDLWQ==",
-      "dev": true,
-      "dependencies": {
-        "@babel/runtime": "^7.24.7",
-        "@restart/hooks": "^0.4.9",
-        "@restart/ui": "^1.6.9",
-        "@types/react-transition-group": "^4.4.6",
-        "classnames": "^2.3.2",
-        "dom-helpers": "^5.2.1",
-        "invariant": "^2.2.4",
-        "prop-types": "^15.8.1",
-        "prop-types-extra": "^1.1.0",
-        "react-transition-group": "^4.4.5",
-        "uncontrollable": "^7.2.1",
-        "warning": "^4.0.3"
-      },
-      "peerDependencies": {
-        "@types/react": ">=16.14.8",
-        "react": ">=16.14.0",
-        "react-dom": ">=16.14.0"
-      },
-      "peerDependenciesMeta": {
-        "@types/react": {
-          "optional": true
-        }
-      }
-    },
-    "services/web/node_modules/react-bootstrap-5/node_modules/react-transition-group": {
-      "version": "4.4.5",
-      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
-      "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
-      "dev": true,
-      "dependencies": {
-        "@babel/runtime": "^7.5.5",
-        "dom-helpers": "^5.0.1",
-        "loose-envify": "^1.4.0",
-        "prop-types": "^15.6.2"
-      },
-      "peerDependencies": {
-        "react": ">=16.6.0",
-        "react-dom": ">=16.6.0"
-      }
-    },
-    "services/web/node_modules/regenerator-runtime": {
-      "version": "0.14.1",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
-      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
-      "dev": true
-    },
     "services/web/node_modules/retry-request": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-5.0.2.tgz",
@@ -45606,24 +46216,18 @@
         "stack-trace": "0.0.10"
       }
     },
-    "services/web/node_modules/schema-utils": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.0.tgz",
-      "integrity": "sha512-Gf9qqc58SpCA/xdziiHz35F4GNIWYWZrEshUc/G/r5BnLph6xpKuLeoJoQuj5WfBIx/eQLf+hmVPYHaxJu7V2g==",
+    "services/web/node_modules/semver": {
+      "version": "7.7.2",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+      "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
       "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@types/json-schema": "^7.0.9",
-        "ajv": "^8.9.0",
-        "ajv-formats": "^2.1.1",
-        "ajv-keywords": "^5.1.0"
+      "license": "ISC",
+      "peer": true,
+      "bin": {
+        "semver": "bin/semver.js"
       },
       "engines": {
-        "node": ">= 10.13.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
+        "node": ">=10"
       }
     },
     "services/web/node_modules/sinon": {
@@ -45694,16 +46298,24 @@
       "resolved": "https://registry.npmjs.org/stream-transform/-/stream-transform-3.2.1.tgz",
       "integrity": "sha512-ApK+WTJ5bCOf0A2tlec1qhvr8bGEBM/sgXXB7mysdCYgZJO5DZeaV3h3G+g0HnAQ372P5IhiGqnW29zoLOfTzQ=="
     },
-    "services/web/node_modules/supports-color": {
-      "version": "7.2.0",
-      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
+    "services/web/node_modules/stripe": {
+      "version": "18.1.0",
+      "resolved": "https://registry.npmjs.org/stripe/-/stripe-18.1.0.tgz",
+      "integrity": "sha512-MLDiniPTHqcfIT3anyBPmOEcaiDhYa7/jRaNypQ3Rt2SJnayQZBvVbFghIziUCZdltGAndm/ZxVOSw6uuSCDig==",
+      "license": "MIT",
       "dependencies": {
-        "has-flag": "^4.0.0"
+        "qs": "^6.11.0"
       },
       "engines": {
-        "node": ">=8"
+        "node": ">=12.*"
+      },
+      "peerDependencies": {
+        "@types/node": ">=12.x.x"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
       }
     },
     "services/web/node_modules/teeny-request": {
@@ -45746,39 +46358,28 @@
         "node": ">= 6"
       }
     },
-    "services/web/node_modules/terser-webpack-plugin": {
-      "version": "5.3.11",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.11.tgz",
-      "integrity": "sha512-RVCsMfuD0+cTt3EwX8hSl2Ks56EbFHWmhluwcqoPKtBnfjiT6olaq7PRIRfhyU8nnC2MrnDrBLfrD/RGE+cVXQ==",
+    "services/web/node_modules/tinyrainbow": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-2.0.0.tgz",
+      "integrity": "sha512-op4nsTR47R6p0vMUUoYl/a+ljLFVtlfaXkLQmqfLR1qHma1h/ysYk4hEXZ880bf2CYgTskvTa/e196Vd5dDQXw==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.25",
-        "jest-worker": "^27.4.5",
-        "schema-utils": "^4.3.0",
-        "serialize-javascript": "^6.0.2",
-        "terser": "^5.31.1"
-      },
       "engines": {
-        "node": ">= 10.13.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/webpack"
+        "node": ">=14.0.0"
+      }
+    },
+    "services/web/node_modules/ts-api-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz",
+      "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": ">=18.12"
       },
       "peerDependencies": {
-        "webpack": "^5.1.0"
-      },
-      "peerDependenciesMeta": {
-        "@swc/core": {
-          "optional": true
-        },
-        "esbuild": {
-          "optional": true
-        },
-        "uglify-js": {
-          "optional": true
-        }
+        "typescript": ">=4.8.4"
       }
     },
     "services/web/node_modules/uuid": {
@@ -45793,13 +46394,292 @@
         "uuid": "dist/bin/uuid"
       }
     },
-    "services/web/node_modules/warning": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+    "services/web/node_modules/vite-node": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/vite-node/-/vite-node-3.1.4.tgz",
+      "integrity": "sha512-6enNwYnpyDo4hEgytbmc6mYWHXDHYEn0D1/rw4Q+tnHUGtKTJsn8T1YkX6Q18wI5LCrS8CTYlBaiCqxOy2kvUA==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
-        "loose-envify": "^1.0.0"
+        "cac": "^6.7.14",
+        "debug": "^4.4.0",
+        "es-module-lexer": "^1.7.0",
+        "pathe": "^2.0.3",
+        "vite": "^5.0.0 || ^6.0.0"
+      },
+      "bin": {
+        "vite-node": "vite-node.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "services/web/node_modules/vite-node/node_modules/vite": {
+      "version": "6.3.5",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
+      "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.25.0",
+        "fdir": "^6.4.4",
+        "picomatch": "^4.0.2",
+        "postcss": "^8.5.3",
+        "rollup": "^4.34.9",
+        "tinyglobby": "^0.2.13"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "jiti": ">=1.21.0",
+        "less": "*",
+        "lightningcss": "^1.21.0",
+        "sass": "*",
+        "sass-embedded": "*",
+        "stylus": "*",
+        "sugarss": "*",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "services/web/node_modules/vitest": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-3.1.4.tgz",
+      "integrity": "sha512-Ta56rT7uWxCSJXlBtKgIlApJnT6e6IGmTYxYcmxjJ4ujuZDI59GUQgVDObXXJujOmPDBYXHK1qmaGtneu6TNIQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/expect": "3.1.4",
+        "@vitest/mocker": "3.1.4",
+        "@vitest/pretty-format": "^3.1.4",
+        "@vitest/runner": "3.1.4",
+        "@vitest/snapshot": "3.1.4",
+        "@vitest/spy": "3.1.4",
+        "@vitest/utils": "3.1.4",
+        "chai": "^5.2.0",
+        "debug": "^4.4.0",
+        "expect-type": "^1.2.1",
+        "magic-string": "^0.30.17",
+        "pathe": "^2.0.3",
+        "std-env": "^3.9.0",
+        "tinybench": "^2.9.0",
+        "tinyexec": "^0.3.2",
+        "tinyglobby": "^0.2.13",
+        "tinypool": "^1.0.2",
+        "tinyrainbow": "^2.0.0",
+        "vite": "^5.0.0 || ^6.0.0",
+        "vite-node": "3.1.4",
+        "why-is-node-running": "^2.3.0"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@types/debug": "^4.1.12",
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "@vitest/browser": "3.1.4",
+        "@vitest/ui": "3.1.4",
+        "happy-dom": "*",
+        "jsdom": "*"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@types/debug": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        }
+      }
+    },
+    "services/web/node_modules/vitest/node_modules/@vitest/mocker": {
+      "version": "3.1.4",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-3.1.4.tgz",
+      "integrity": "sha512-8IJ3CvwtSw/EFXqWFL8aCMu+YyYXG2WUSrQbViOZkWTKTVicVwZ/YiEZDSqD00kX+v/+W+OnxhNWoeVKorHygA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "3.1.4",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.17"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9",
+        "vite": "^5.0.0 || ^6.0.0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
+      }
+    },
+    "services/web/node_modules/vitest/node_modules/chai": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-5.2.0.tgz",
+      "integrity": "sha512-mCuXncKXk5iCLhfhwTc0izo0gtEmpz5CtG2y8GiOINBlMVS6v8TMRc5TaLWKS6692m9+dVVfzgeVxR5UxWHTYw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "assertion-error": "^2.0.1",
+        "check-error": "^2.1.1",
+        "deep-eql": "^5.0.1",
+        "loupe": "^3.1.0",
+        "pathval": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "services/web/node_modules/vitest/node_modules/vite": {
+      "version": "6.3.5",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
+      "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.25.0",
+        "fdir": "^6.4.4",
+        "picomatch": "^4.0.2",
+        "postcss": "^8.5.3",
+        "rollup": "^4.34.9",
+        "tinyglobby": "^0.2.13"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0",
+        "jiti": ">=1.21.0",
+        "less": "*",
+        "lightningcss": "^1.21.0",
+        "sass": "*",
+        "sass-embedded": "*",
+        "stylus": "*",
+        "sugarss": "*",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
       }
     },
     "services/web/node_modules/xml-crypto": {
@@ -45829,6 +46709,21 @@
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
+    "services/web/node_modules/yaml": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.0.tgz",
+      "integrity": "sha512-4lLa/EcQCB0cJkyts+FpIRx5G/llPxfP6VQU5KByHEhLxY3IJCH0f0Hy1MHI8sClTvsIb8qwRJ6R/ZdlDJ/leQ==",
+      "dev": true,
+      "license": "ISC",
+      "optional": true,
+      "peer": true,
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14.6"
+      }
+    },
     "tools/saas-e2e": {
       "name": "@overleaf/saas-e2e",
       "devDependencies": {
diff --git a/package.json b/package.json
index ae25e19029..44fffc4664 100644
--- a/package.json
+++ b/package.json
@@ -8,8 +8,8 @@
     "@types/chai": "^4.3.0",
     "@types/chai-as-promised": "^7.1.8",
     "@types/mocha": "^10.0.6",
-    "@typescript-eslint/eslint-plugin": "^8.0.0",
-    "@typescript-eslint/parser": "^8.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.30.1",
+    "@typescript-eslint/parser": "^8.30.1",
     "eslint": "^8.15.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-config-standard": "^17.0.0",
@@ -18,28 +18,24 @@
     "eslint-plugin-cypress": "^2.15.1",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-mocha": "^10.1.0",
-    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-n": "^15.7.0",
     "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-unicorn": "^56.0.0",
-    "prettier": "3.3.3",
-    "typescript": "^5.5.4"
+    "prettier": "3.6.2",
+    "typescript": "^5.8.3"
+  },
+  "engines": {
+    "npm": "11.4.2"
   },
   "overrides": {
-    "cross-env": {
-      "cross-spawn": "^7.0.6"
-    },
-    "fetch-mock": {
-      "path-to-regexp": "3.3.0"
-    },
-    "google-gax": {
-      "protobufjs": "^7.2.5"
-    },
-    "swagger-tools": {
-      "body-parser": "1.20.3",
-      "multer": "1.4.5-lts.1",
+    "swagger-tools@0.10.4": {
       "path-to-regexp": "3.3.0",
-      "qs": "6.13.0"
+      "body-parser": "1.20.3",
+      "multer": "2.0.1"
+    },
+    "request@2.88.2": {
+      "tough-cookie": "5.1.2"
     }
   },
   "scripts": {
@@ -55,6 +51,7 @@
     "services/analytics",
     "services/chat",
     "services/clsi",
+    "services/clsi-cache",
     "services/clsi-perf",
     "services/contacts",
     "services/docstore",
diff --git a/patches/@node-saml+node-saml+4.0.5.patch b/patches/@node-saml+node-saml+4.0.5.patch
new file mode 100644
index 0000000000..81fd700b31
--- /dev/null
+++ b/patches/@node-saml+node-saml+4.0.5.patch
@@ -0,0 +1,23 @@
+diff --git a/node_modules/@node-saml/node-saml/lib/saml.js b/node_modules/@node-saml/node-saml/lib/saml.js
+index fba15b9..a5778cb 100644
+--- a/node_modules/@node-saml/node-saml/lib/saml.js
++++ b/node_modules/@node-saml/node-saml/lib/saml.js
+@@ -336,7 +336,8 @@ class SAML {
+         const requestOrResponse = request || response;
+         (0, utility_1.assertRequired)(requestOrResponse, "either request or response is required");
+         let buffer;
+-        if (this.options.skipRequestCompression) {
++       // logout requestOrResponse must be compressed anyway
++        if (this.options.skipRequestCompression && operation !== "logout") {
+             buffer = Buffer.from(requestOrResponse, "utf8");
+         }
+         else {
+@@ -495,7 +496,7 @@ class SAML {
+         try {
+             xml = Buffer.from(container.SAMLResponse, "base64").toString("utf8");
+             doc = await (0, xml_1.parseDomFromString)(xml);
+-            const inResponseToNodes = xml_1.xpath.selectAttributes(doc, "/*[local-name()='Response']/@InResponseTo");
++            const inResponseToNodes = xml_1.xpath.selectAttributes(doc, "/*[local-name()='Response' or local-name()='LogoutResponse']/@InResponseTo");
+             if (inResponseToNodes) {
+                 inResponseTo = inResponseToNodes.length ? inResponseToNodes[0].nodeValue : null;
+                 await this.validateInResponseTo(inResponseTo);
diff --git a/patches/ldapauth-fork+4.3.3.patch b/patches/ldapauth-fork+4.3.3.patch
new file mode 100644
index 0000000000..4d31210c9d
--- /dev/null
+++ b/patches/ldapauth-fork+4.3.3.patch
@@ -0,0 +1,64 @@
+diff --git a/node_modules/ldapauth-fork/lib/ldapauth.js b/node_modules/ldapauth-fork/lib/ldapauth.js
+index 85ecf36a8b..a7d07e0f78 100644
+--- a/node_modules/ldapauth-fork/lib/ldapauth.js
++++ b/node_modules/ldapauth-fork/lib/ldapauth.js
+@@ -69,6 +69,7 @@ function LdapAuth(opts) {
+   this.opts.bindProperty || (this.opts.bindProperty = 'dn');
+   this.opts.groupSearchScope || (this.opts.groupSearchScope = 'sub');
+   this.opts.groupDnProperty || (this.opts.groupDnProperty = 'dn');
++  this.opts.tlsStarted = false;
+
+   EventEmitter.call(this);
+
+@@ -108,21 +109,7 @@ function LdapAuth(opts) {
+   this._userClient.on('error', this._handleError.bind(this));
+
+   var self = this;
+-  if (this.opts.starttls) {
+-    // When starttls is enabled, this callback supplants the 'connect' callback
+-    this._adminClient.starttls(this.opts.tlsOptions, this._adminClient.controls, function(err) {
+-      if (err) {
+-        self._handleError(err);
+-      } else {
+-        self._onConnectAdmin();
+-      }
+-    });
+-    this._userClient.starttls(this.opts.tlsOptions, this._userClient.controls, function(err) {
+-      if (err) {
+-        self._handleError(err);
+-      }
+-    });
+-  } else if (opts.reconnect) {
++  if (opts.reconnect && !this.opts.starttls) {
+     this.once('_installReconnectListener', function() {
+       self.log && self.log.trace('install reconnect listener');
+       self._adminClient.on('connect', function() {
+@@ -384,6 +371,28 @@ LdapAuth.prototype._findGroups = function(user, callback) {
+  */
+ LdapAuth.prototype.authenticate = function(username, password, callback) {
+   var self = this;
++  if (this.opts.starttls && !this.opts.tlsStarted) {
++    // When starttls is enabled, this callback supplants the 'connect' callback
++    this._adminClient.starttls(this.opts.tlsOptions, this._adminClient.controls, function (err) {
++      if (err) {
++        self._handleError(err);
++      } else {
++        self._onConnectAdmin(function(){self._handleAuthenticate(username, password, callback);});
++      }
++    });
++    this._userClient.starttls(this.opts.tlsOptions, this._userClient.controls, function (err) {
++      if (err) {
++        self._handleError(err);
++      }
++    });
++  } else {
++    self._handleAuthenticate(username, password, callback);
++  }
++};
++
++LdapAuth.prototype._handleAuthenticate = function (username, password, callback) {
++  this.opts.tlsStarted = true;
++  var self = this;
+
+   if (typeof password === 'undefined' || password === null || password === '') {
+     return callback(new Error('no password given'));
diff --git a/patches/pdfjs-dist+5.1.91.patch b/patches/pdfjs-dist+5.1.91.patch
new file mode 100644
index 0000000000..24f6e2adc9
--- /dev/null
+++ b/patches/pdfjs-dist+5.1.91.patch
@@ -0,0 +1,22 @@
+diff --git a/node_modules/pdfjs-dist/build/pdf.worker.mjs b/node_modules/pdfjs-dist/build/pdf.worker.mjs
+index 6c5c6f1..bb6b7d1 100644
+--- a/node_modules/pdfjs-dist/build/pdf.worker.mjs
++++ b/node_modules/pdfjs-dist/build/pdf.worker.mjs
+@@ -1830,7 +1830,7 @@ async function __wbg_init(module_or_path) {
+     }
+   }
+   if (typeof module_or_path === 'undefined') {
+-    module_or_path = new URL('qcms_bg.wasm', import.meta.url);
++    module_or_path = new URL(/* webpackIgnore: true */ 'qcms_bg.wasm', import.meta.url);
+   }
+   const imports = __wbg_get_imports();
+   if (typeof module_or_path === 'string' || typeof Request === 'function' && module_or_path instanceof Request || typeof URL === 'function' && module_or_path instanceof URL) {
+@@ -5358,7 +5358,7 @@ var OpenJPEG = (() => {
+       if (Module["locateFile"]) {
+         return locateFile("openjpeg.wasm");
+       }
+-      return new URL("openjpeg.wasm", import.meta.url).href;
++      return new URL(/* webpackIgnore: true */ "openjpeg.wasm", import.meta.url).href;
+     }
+     function getBinarySync(file) {
+       if (file == wasmBinaryFile && wasmBinary) {
diff --git a/server-ce/Dockerfile b/server-ce/Dockerfile
index 0c33505550..5f32eb67cb 100644
--- a/server-ce/Dockerfile
+++ b/server-ce/Dockerfile
@@ -115,9 +115,3 @@ ENV LOG_LEVEL="info"
 EXPOSE 80
 
 ENTRYPOINT ["/sbin/my_init"]
-
-# Store the revision
-# ------------------
-# This should be the last step to optimize docker image caching.
-ARG MONOREPO_REVISION
-RUN echo "monorepo-server-ce,$MONOREPO_REVISION" > /var/www/revisions.txt
diff --git a/server-ce/Dockerfile-base b/server-ce/Dockerfile-base
index ca3c45cc1d..e130d7a414 100644
--- a/server-ce/Dockerfile-base
+++ b/server-ce/Dockerfile-base
@@ -2,7 +2,7 @@
 # Overleaf Base Image (sharelatex/sharelatex-base)
 # --------------------------------------------------
 
-FROM phusion/baseimage:noble-1.0.0
+FROM phusion/baseimage:noble-1.0.2
 
 # Makes sure LuaTex cache is writable
 # -----------------------------------
@@ -10,7 +10,7 @@ ENV TEXMFVAR=/var/lib/overleaf/tmp/texmf-var
 
 # Update to ensure dependencies are updated
 # ------------------------------------------
-ENV REBUILT_AFTER="2025-03-27"
+ENV REBUILT_AFTER="2025-05-19"
 
 # Install dependencies
 # --------------------
@@ -30,7 +30,7 @@ RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
 # install Node.js https://github.com/nodesource/distributions#nodejs
 &&  mkdir -p /etc/apt/keyrings \
 &&  curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg \
-&&  echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_20.x nodistro main" | tee /etc/apt/sources.list.d/nodesource.list \
+&&  echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_22.x nodistro main" | tee /etc/apt/sources.list.d/nodesource.list \
 &&  apt-get update \
 &&  apt-get install -y nodejs \
     \
diff --git a/server-ce/Makefile b/server-ce/Makefile
index eb6ea772f1..8e2fe7d14f 100644
--- a/server-ce/Makefile
+++ b/server-ce/Makefile
@@ -24,6 +24,7 @@ build-base:
 	  --cache-from $(OVERLEAF_BASE_BRANCH) \
 	  --tag $(OVERLEAF_BASE_TAG) \
 	  --tag $(OVERLEAF_BASE_BRANCH) \
+	  --network=host \
 	  $(MONOREPO_ROOT)
 
 
@@ -33,12 +34,13 @@ build-community:
 	  --build-arg BUILDKIT_INLINE_CACHE=1 \
 	  --progress=plain \
 	  --build-arg OVERLEAF_BASE_TAG \
-	  --build-arg MONOREPO_REVISION \
+	  --label "com.overleaf.ce.revision=$(MONOREPO_REVISION)" \
 	  --cache-from $(OVERLEAF_LATEST) \
 	  --cache-from $(OVERLEAF_BRANCH) \
 	  --file Dockerfile \
 	  --tag $(OVERLEAF_TAG) \
 	  --tag $(OVERLEAF_BRANCH) \
+	  --network=host \
 	  $(MONOREPO_ROOT)
 
 SHELLCHECK_OPTS = \
diff --git a/server-ce/config/crontab-history b/server-ce/config/crontab-history
index cfa12f9fc8..ac6dcc1c7b 100644
--- a/server-ce/config/crontab-history
+++ b/server-ce/config/crontab-history
@@ -1,3 +1,4 @@
 */20 * * * *  root  /overleaf/cron/project-history-periodic-flush.sh >> /var/log/overleaf/cron-project-history-periodic-flush.log 2>&1
 30 * * * *    root  /overleaf/cron/project-history-retry-soft.sh >> /var/log/overleaf/project-history-retry-soft.log 2>&1
 45 * * * *    root  /overleaf/cron/project-history-retry-hard.sh >> /var/log/overleaf/project-history-retry-hard.log 2>&1
+0 3 * * *     root  /overleaf/cron/project-history-flush-all.sh >> /var/log/overleaf/project-history-flush-all.log 2>&1
diff --git a/server-ce/config/custom-environment-variables.json b/server-ce/config/custom-environment-variables.json
index 450e92fed9..f65f74ae2b 100644
--- a/server-ce/config/custom-environment-variables.json
+++ b/server-ce/config/custom-environment-variables.json
@@ -45,5 +45,17 @@
   "clusterWorkers": "CLUSTER_WORKERS",
   "maxFileUploadSize": "MAX_FILE_UPLOAD_SIZE",
   "httpsOnly": "HTTPS_ONLY",
-  "httpRequestTimeout": "OVERLEAF_HISTORY_V1_HTTP_REQUEST_TIMEOUT"
+  "httpRequestTimeout": "OVERLEAF_HISTORY_V1_HTTP_REQUEST_TIMEOUT",
+  "redis": {
+    "history": {
+      "host": "OVERLEAF_REDIS_HOST",
+      "password": "OVERLEAF_REDIS_PASS",
+      "port": "OVERLEAF_REDIS_PORT"
+    },
+    "lock": {
+      "host": "OVERLEAF_REDIS_HOST",
+      "password": "OVERLEAF_REDIS_PASS",
+      "port": "OVERLEAF_REDIS_PORT"
+    }
+  }
 }
diff --git a/server-ce/config/env.sh b/server-ce/config/env.sh
index b12ca242d3..81cebe4caa 100644
--- a/server-ce/config/env.sh
+++ b/server-ce/config/env.sh
@@ -9,5 +9,6 @@ export HISTORY_V1_HOST=127.0.0.1
 export NOTIFICATIONS_HOST=127.0.0.1
 export PROJECT_HISTORY_HOST=127.0.0.1
 export REALTIME_HOST=127.0.0.1
+export REFERENCES_HOST=127.0.0.1
 export WEB_HOST=127.0.0.1
 export WEB_API_HOST=127.0.0.1
diff --git a/server-ce/config/settings.js b/server-ce/config/settings.js
index 0cf2c5a7ec..47d34fd870 100644
--- a/server-ce/config/settings.js
+++ b/server-ce/config/settings.js
@@ -79,6 +79,7 @@ const settings = {
       host: process.env.OVERLEAF_REDIS_HOST || 'dockerhost',
       port: process.env.OVERLEAF_REDIS_PORT || '6379',
       password: process.env.OVERLEAF_REDIS_PASS || undefined,
+      tls: process.env.OVERLEAF_REDIS_TLS === 'true' ? {} : undefined,
       key_schema: {
         // document-updater
         blockingKey({ doc_id }) {
@@ -139,6 +140,7 @@ const settings = {
     api: redisConfig,
     pubsub: redisConfig,
     project_history: redisConfig,
+    references: redisConfig,
 
     project_history_migration: {
       host: redisConfig.host,
@@ -182,7 +184,10 @@ const settings = {
   siteUrl: (siteUrl = process.env.OVERLEAF_SITE_URL || 'http://localhost'),
 
   // Status page URL as displayed on the maintenance/500 pages.
-  statusPageUrl: process.env.OVERLEAF_STATUS_PAGE_URL,
+  statusPageUrl: process.env.OVERLEAF_STATUS_PAGE_URL ?
+    // Add https:// protocol prefix if not set (Allow plain-text http:// for Server Pro/CE).
+    (process.env.OVERLEAF_STATUS_PAGE_URL.startsWith('http://') || process.env.OVERLEAF_STATUS_PAGE_URL.startsWith('https://')) ? process.env.OVERLEAF_STATUS_PAGE_URL : `https://${process.env.OVERLEAF_STATUS_PAGE_URL}`
+    : undefined,
 
   // The name this is used to describe your Overleaf Community Edition Installation
   appName: process.env.OVERLEAF_APP_NAME || 'Overleaf Community Edition',
diff --git a/server-ce/cron/deactivate-projects.sh b/server-ce/cron/deactivate-projects.sh
index fab0fbfbf6..a391f99a5b 100755
--- a/server-ce/cron/deactivate-projects.sh
+++ b/server-ce/cron/deactivate-projects.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "-------------------------"
 echo "Deactivating old projects"
diff --git a/server-ce/cron/delete-projects.sh b/server-ce/cron/delete-projects.sh
index e1ea5ac5e6..7cd4577171 100755
--- a/server-ce/cron/delete-projects.sh
+++ b/server-ce/cron/delete-projects.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "-------------------------"
 echo "Expiring deleted projects"
diff --git a/server-ce/cron/delete-users.sh b/server-ce/cron/delete-users.sh
index fe97bffeea..30872ac556 100755
--- a/server-ce/cron/delete-users.sh
+++ b/server-ce/cron/delete-users.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "----------------------"
 echo "Expiring deleted users"
diff --git a/server-ce/cron/project-history-flush-all.sh b/server-ce/cron/project-history-flush-all.sh
new file mode 100755
index 0000000000..8fe9eea5fc
--- /dev/null
+++ b/server-ce/cron/project-history-flush-all.sh
@@ -0,0 +1,14 @@
+#!/usr/bin/env bash
+
+set -eu
+
+echo "---------------------------------"
+echo "Flush all project-history changes"
+echo "---------------------------------"
+date
+
+source /etc/container_environment.sh
+source /etc/overleaf/env.sh
+cd /overleaf/services/project-history && node scripts/flush_all.js
+
+echo "Done flushing all project-history changes"
diff --git a/server-ce/cron/project-history-periodic-flush.sh b/server-ce/cron/project-history-periodic-flush.sh
index 76feae410e..1b8efff6cc 100755
--- a/server-ce/cron/project-history-periodic-flush.sh
+++ b/server-ce/cron/project-history-periodic-flush.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "--------------------------"
 echo "Flush project-history queue"
diff --git a/server-ce/cron/project-history-retry-hard.sh b/server-ce/cron/project-history-retry-hard.sh
index 651a6615f2..df9b4703a5 100755
--- a/server-ce/cron/project-history-retry-hard.sh
+++ b/server-ce/cron/project-history-retry-hard.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "-----------------------------------"
 echo "Retry project-history errors (hard)"
diff --git a/server-ce/cron/project-history-retry-soft.sh b/server-ce/cron/project-history-retry-soft.sh
index 70c597021b..cbb6e714ca 100755
--- a/server-ce/cron/project-history-retry-soft.sh
+++ b/server-ce/cron/project-history-retry-soft.sh
@@ -1,6 +1,6 @@
 #!/usr/bin/env bash
 
-set -eux
+set -eu
 
 echo "-----------------------------------"
 echo "Retry project-history errors (soft)"
diff --git a/server-ce/hotfix/5.4.1/Dockerfile b/server-ce/hotfix/5.4.1/Dockerfile
new file mode 100644
index 0000000000..46bde4013c
--- /dev/null
+++ b/server-ce/hotfix/5.4.1/Dockerfile
@@ -0,0 +1,14 @@
+FROM sharelatex/sharelatex:5.4.0
+
+RUN apt update && apt install -y linux-libc-dev \
+    && unattended-upgrade --verbose --no-minimal-upgrade-steps \
+    && rm -rf /var/lib/apt/lists/*
+COPY package-lock.json.diff .
+RUN patch package-lock.json < package-lock.json.diff
+RUN npm install --omit=dev
+
+
+# fix tls configuration in redis
+COPY issue_24996.patch .
+RUN patch -p0 /etc/overleaf/settings.js < issue_24996.patch \
+    && rm issue_24996.patch
diff --git a/server-ce/hotfix/5.4.1/issue_24996.patch b/server-ce/hotfix/5.4.1/issue_24996.patch
new file mode 100644
index 0000000000..3067aab968
--- /dev/null
+++ b/server-ce/hotfix/5.4.1/issue_24996.patch
@@ -0,0 +1,10 @@
+--- settings.js
++++ settings.js
+@@ -79,6 +79,7 @@ const settings = {
+       host: process.env.OVERLEAF_REDIS_HOST || 'dockerhost',
+       port: process.env.OVERLEAF_REDIS_PORT || '6379',
+       password: process.env.OVERLEAF_REDIS_PASS || undefined,
++      tls: process.env.OVERLEAF_REDIS_TLS === 'true' ? {} : undefined,
+       key_schema: {
+         // document-updater
+         blockingKey({ doc_id }) {
diff --git a/server-ce/hotfix/5.4.1/package-lock.json.diff b/server-ce/hotfix/5.4.1/package-lock.json.diff
new file mode 100644
index 0000000000..f4f7ae4788
--- /dev/null
+++ b/server-ce/hotfix/5.4.1/package-lock.json.diff
@@ -0,0 +1,2024 @@
+151c151
+<         "@google-cloud/profiler": "^6.0.0",
+---
+>         "@google-cloud/profiler": "^6.0.3",
+173a174,507
+>     "libraries/metrics/node_modules/@google-cloud/logging-min": {
+>       "version": "11.2.0",
+>       "resolved": "https://registry.npmjs.org/@google-cloud/logging-min/-/logging-min-11.2.0.tgz",
+>       "integrity": "sha512-o1mwzi1+9NMEjwYZJ0X3tK64obf9PzPVBAhzEJv65L0h7jVl3Fw7GswtsMUkdUvZexf96vAvlZZMvXB9jAIW2Q==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@google-cloud/common": "^5.0.0",
+>         "@google-cloud/paginator": "^5.0.0",
+>         "@google-cloud/projectify": "^4.0.0",
+>         "@google-cloud/promisify": "^4.0.0",
+>         "@opentelemetry/api": "^1.7.0",
+>         "arrify": "^2.0.1",
+>         "dot-prop": "^6.0.0",
+>         "eventid": "^2.0.0",
+>         "extend": "^3.0.2",
+>         "gcp-metadata": "^6.0.0",
+>         "google-auth-library": "^9.0.0",
+>         "google-gax": "^4.0.3",
+>         "on-finished": "^2.3.0",
+>         "pumpify": "^2.0.1",
+>         "stream-events": "^1.0.5",
+>         "uuid": "^9.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@google-cloud/paginator": {
+>       "version": "5.0.2",
+>       "resolved": "https://registry.npmjs.org/@google-cloud/paginator/-/paginator-5.0.2.tgz",
+>       "integrity": "sha512-DJS3s0OVH4zFDB1PzjxAsHqJT6sKVbRwwML0ZBP9PbU7Yebtu/7SWMRzvO2J3nUi9pRNITCfu4LJeooM2w4pjg==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "arrify": "^2.0.0",
+>         "extend": "^3.0.2"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@google-cloud/profiler": {
+>       "version": "6.0.3",
+>       "resolved": "https://registry.npmjs.org/@google-cloud/profiler/-/profiler-6.0.3.tgz",
+>       "integrity": "sha512-Ey8li6Vc2CbfEzOTSZaqKolxPMGacxVUQuhChNT0Wi55a3nfImMiiuDgqYw1In/a9Q3Z62O7jUg2L8f1XwMN7Q==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@google-cloud/common": "^5.0.0",
+>         "@google-cloud/logging-min": "^11.0.0",
+>         "@google-cloud/promisify": "~4.0.0",
+>         "@types/console-log-level": "^1.4.0",
+>         "@types/semver": "^7.0.0",
+>         "console-log-level": "^1.4.0",
+>         "delay": "^5.0.0",
+>         "extend": "^3.0.2",
+>         "gcp-metadata": "^6.0.0",
+>         "ms": "^2.1.3",
+>         "pprof": "4.0.0",
+>         "pretty-ms": "^7.0.0",
+>         "protobufjs": "~7.4.0",
+>         "semver": "^7.0.0",
+>         "teeny-request": "^9.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@google-cloud/profiler/node_modules/protobufjs": {
+>       "version": "7.4.0",
+>       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.4.0.tgz",
+>       "integrity": "sha512-mRUWCc3KUU4w1jU8sGxICXH/gNS94DvI1gxqDvBzhj1JpcsimQkYiOJfwsPUykUI5ZaspFbSgmBLER8IrQ3tqw==",
+>       "hasInstallScript": true,
+>       "license": "BSD-3-Clause",
+>       "dependencies": {
+>         "@protobufjs/aspromise": "^1.1.2",
+>         "@protobufjs/base64": "^1.1.2",
+>         "@protobufjs/codegen": "^2.0.4",
+>         "@protobufjs/eventemitter": "^1.1.0",
+>         "@protobufjs/fetch": "^1.1.0",
+>         "@protobufjs/float": "^1.0.2",
+>         "@protobufjs/inquire": "^1.1.0",
+>         "@protobufjs/path": "^1.1.2",
+>         "@protobufjs/pool": "^1.1.0",
+>         "@protobufjs/utf8": "^1.1.0",
+>         "@types/node": ">=13.7.0",
+>         "long": "^5.0.0"
+>       },
+>       "engines": {
+>         "node": ">=12.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@mapbox/node-pre-gyp": {
+>       "version": "1.0.11",
+>       "resolved": "https://registry.npmjs.org/@mapbox/node-pre-gyp/-/node-pre-gyp-1.0.11.tgz",
+>       "integrity": "sha512-Yhlar6v9WQgUp/He7BdgzOz8lqMQ8sU+jkCq7Wx8Myc5YFJLbEe7lgui/V7G1qB1DJykHSGwreceSaD60Y0PUQ==",
+>       "license": "BSD-3-Clause",
+>       "dependencies": {
+>         "detect-libc": "^2.0.0",
+>         "https-proxy-agent": "^5.0.0",
+>         "make-dir": "^3.1.0",
+>         "node-fetch": "^2.6.7",
+>         "nopt": "^5.0.0",
+>         "npmlog": "^5.0.1",
+>         "rimraf": "^3.0.2",
+>         "semver": "^7.3.5",
+>         "tar": "^6.1.11"
+>       },
+>       "bin": {
+>         "node-pre-gyp": "bin/node-pre-gyp"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@mapbox/node-pre-gyp/node_modules/agent-base": {
+>       "version": "6.0.2",
+>       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
+>       "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "debug": "4"
+>       },
+>       "engines": {
+>         "node": ">= 6.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@mapbox/node-pre-gyp/node_modules/https-proxy-agent": {
+>       "version": "5.0.1",
+>       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
+>       "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "agent-base": "6",
+>         "debug": "4"
+>       },
+>       "engines": {
+>         "node": ">= 6"
+>       }
+>     },
+>     "libraries/metrics/node_modules/@opentelemetry/api": {
+>       "version": "1.9.0",
+>       "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.0.tgz",
+>       "integrity": "sha512-3giAOQvZiH5F9bMlMiv8+GSPMeqg0dbaeo58/0SlA9sxSqZhnUtxzX9/2FzyhS9sWQf5S0GJE0AKBrFqjpeYcg==",
+>       "license": "Apache-2.0",
+>       "engines": {
+>         "node": ">=8.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/agent-base": {
+>       "version": "7.1.3",
+>       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
+>       "integrity": "sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 14"
+>       }
+>     },
+>     "libraries/metrics/node_modules/detect-libc": {
+>       "version": "2.0.4",
+>       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
+>       "integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
+>       "license": "Apache-2.0",
+>       "engines": {
+>         "node": ">=8"
+>       }
+>     },
+>     "libraries/metrics/node_modules/gaxios": {
+>       "version": "6.7.1",
+>       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.7.1.tgz",
+>       "integrity": "sha512-LDODD4TMYx7XXdpwxAVRAIAuB0bzv0s+ywFonY46k126qzQHT9ygyoa9tncmOiQmmDrik65UYsEkv3lbfqQ3yQ==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "extend": "^3.0.2",
+>         "https-proxy-agent": "^7.0.1",
+>         "is-stream": "^2.0.0",
+>         "node-fetch": "^2.6.9",
+>         "uuid": "^9.0.1"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "libraries/metrics/node_modules/gcp-metadata": {
+>       "version": "6.1.1",
+>       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.1.1.tgz",
+>       "integrity": "sha512-a4tiq7E0/5fTjxPAaH4jpjkSv/uCaU2p5KC6HVGrvl0cDjA8iBZv4vv1gyzlmK0ZUKqwpOyQMKzZQe3lTit77A==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "gaxios": "^6.1.1",
+>         "google-logging-utils": "^0.0.2",
+>         "json-bigint": "^1.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "libraries/metrics/node_modules/google-auth-library": {
+>       "version": "9.15.1",
+>       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.15.1.tgz",
+>       "integrity": "sha512-Jb6Z0+nvECVz+2lzSMt9u98UsoakXxA2HGHMCxh+so3n90XgYWkq5dur19JAJV7ONiJY22yBTyJB1TSkvPq9Ng==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "base64-js": "^1.3.0",
+>         "ecdsa-sig-formatter": "^1.0.11",
+>         "gaxios": "^6.1.1",
+>         "gcp-metadata": "^6.1.0",
+>         "gtoken": "^7.0.0",
+>         "jws": "^4.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "libraries/metrics/node_modules/gtoken": {
+>       "version": "7.1.0",
+>       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.1.0.tgz",
+>       "integrity": "sha512-pCcEwRi+TKpMlxAQObHDQ56KawURgyAf6jtIY046fJ5tIv3zDe/LEIubckAO8fj6JnAxLdmWkUfNyulQ2iKdEw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "gaxios": "^6.0.0",
+>         "jws": "^4.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/https-proxy-agent": {
+>       "version": "7.0.6",
+>       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+>       "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "agent-base": "^7.1.2",
+>         "debug": "4"
+>       },
+>       "engines": {
+>         "node": ">= 14"
+>       }
+>     },
+>     "libraries/metrics/node_modules/make-dir": {
+>       "version": "3.1.0",
+>       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
+>       "integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "semver": "^6.0.0"
+>       },
+>       "engines": {
+>         "node": ">=8"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/sindresorhus"
+>       }
+>     },
+>     "libraries/metrics/node_modules/make-dir/node_modules/semver": {
+>       "version": "6.3.1",
+>       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+>       "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+>       "license": "ISC",
+>       "bin": {
+>         "semver": "bin/semver.js"
+>       }
+>     },
+>     "libraries/metrics/node_modules/pprof": {
+>       "version": "4.0.0",
+>       "resolved": "https://registry.npmjs.org/pprof/-/pprof-4.0.0.tgz",
+>       "integrity": "sha512-Yhfk7Y0G1MYsy97oXxmSG5nvbM1sCz9EALiNhW/isAv5Xf7svzP+1RfGeBlS6mLSgRJvgSLh6Mi5DaisQuPttw==",
+>       "hasInstallScript": true,
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@mapbox/node-pre-gyp": "^1.0.9",
+>         "bindings": "^1.2.1",
+>         "delay": "^5.0.0",
+>         "findit2": "^2.2.3",
+>         "nan": "^2.17.0",
+>         "p-limit": "^3.0.0",
+>         "protobufjs": "~7.2.4",
+>         "source-map": "~0.8.0-beta.0",
+>         "split": "^1.0.1"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "libraries/metrics/node_modules/semver": {
+>       "version": "7.7.1",
+>       "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.1.tgz",
+>       "integrity": "sha512-hlq8tAfn0m/61p4BVRcPzIGr6LKiMwo4VM6dGi6pt4qcRkmNzTcWq6eCEjEh+qXjkMDvPlOFFSGwQjoEa6gyMA==",
+>       "license": "ISC",
+>       "bin": {
+>         "semver": "bin/semver.js"
+>       },
+>       "engines": {
+>         "node": ">=10"
+>       }
+>     },
+>     "libraries/metrics/node_modules/source-map": {
+>       "version": "0.8.0-beta.0",
+>       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.8.0-beta.0.tgz",
+>       "integrity": "sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==",
+>       "license": "BSD-3-Clause",
+>       "dependencies": {
+>         "whatwg-url": "^7.0.0"
+>       },
+>       "engines": {
+>         "node": ">= 8"
+>       }
+>     },
+>     "libraries/metrics/node_modules/uuid": {
+>       "version": "9.0.1",
+>       "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+>       "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+>       "funding": [
+>         "https://github.com/sponsors/broofa",
+>         "https://github.com/sponsors/ctavan"
+>       ],
+>       "license": "MIT",
+>       "bin": {
+>         "uuid": "dist/bin/uuid"
+>       }
+>     },
+>     "libraries/metrics/node_modules/webidl-conversions": {
+>       "version": "4.0.2",
+>       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-4.0.2.tgz",
+>       "integrity": "sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==",
+>       "license": "BSD-2-Clause"
+>     },
+>     "libraries/metrics/node_modules/whatwg-url": {
+>       "version": "7.1.0",
+>       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
+>       "integrity": "sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "lodash.sortby": "^4.7.0",
+>         "tr46": "^1.0.1",
+>         "webidl-conversions": "^4.0.2"
+>       }
+>     },
+3205a3540,3545
+>     "node_modules/@balena/dockerignore": {
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/@balena/dockerignore/-/dockerignore-1.0.2.tgz",
+>       "integrity": "sha512-wMue2Sy4GAVTk6Ic4tJVcnfdau+gx2EnG7S+uAEe+TWJFqE4YoWN4/H8MSLj4eYJKxGg26lZwboEniNiNwZQ6Q==",
+>       "license": "Apache-2.0"
+>     },
+4095a4436,4550
+>     "node_modules/@google-cloud/common": {
+>       "version": "5.0.2",
+>       "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.2.tgz",
+>       "integrity": "sha512-V7bmBKYQyu0eVG2BFejuUjlBt+zrya6vtsKdY+JxMM/dNntPF41vZ9+LhOshEUH01zOHEqBSvI7Dad7ZS6aUeA==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@google-cloud/projectify": "^4.0.0",
+>         "@google-cloud/promisify": "^4.0.0",
+>         "arrify": "^2.0.1",
+>         "duplexify": "^4.1.1",
+>         "extend": "^3.0.2",
+>         "google-auth-library": "^9.0.0",
+>         "html-entities": "^2.5.2",
+>         "retry-request": "^7.0.0",
+>         "teeny-request": "^9.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/agent-base": {
+>       "version": "7.1.3",
+>       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.3.tgz",
+>       "integrity": "sha512-jRR5wdylq8CkOe6hei19GGZnxM6rBGwFl3Bg0YItGDimvjGtAvdZk4Pu6Cl4u4Igsws4a1fd1Vq3ezrhn4KmFw==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 14"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/gaxios": {
+>       "version": "6.7.1",
+>       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.7.1.tgz",
+>       "integrity": "sha512-LDODD4TMYx7XXdpwxAVRAIAuB0bzv0s+ywFonY46k126qzQHT9ygyoa9tncmOiQmmDrik65UYsEkv3lbfqQ3yQ==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "extend": "^3.0.2",
+>         "https-proxy-agent": "^7.0.1",
+>         "is-stream": "^2.0.0",
+>         "node-fetch": "^2.6.9",
+>         "uuid": "^9.0.1"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/gcp-metadata": {
+>       "version": "6.1.1",
+>       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.1.1.tgz",
+>       "integrity": "sha512-a4tiq7E0/5fTjxPAaH4jpjkSv/uCaU2p5KC6HVGrvl0cDjA8iBZv4vv1gyzlmK0ZUKqwpOyQMKzZQe3lTit77A==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "gaxios": "^6.1.1",
+>         "google-logging-utils": "^0.0.2",
+>         "json-bigint": "^1.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/google-auth-library": {
+>       "version": "9.15.1",
+>       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.15.1.tgz",
+>       "integrity": "sha512-Jb6Z0+nvECVz+2lzSMt9u98UsoakXxA2HGHMCxh+so3n90XgYWkq5dur19JAJV7ONiJY22yBTyJB1TSkvPq9Ng==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "base64-js": "^1.3.0",
+>         "ecdsa-sig-formatter": "^1.0.11",
+>         "gaxios": "^6.1.1",
+>         "gcp-metadata": "^6.1.0",
+>         "gtoken": "^7.0.0",
+>         "jws": "^4.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/gtoken": {
+>       "version": "7.1.0",
+>       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.1.0.tgz",
+>       "integrity": "sha512-pCcEwRi+TKpMlxAQObHDQ56KawURgyAf6jtIY046fJ5tIv3zDe/LEIubckAO8fj6JnAxLdmWkUfNyulQ2iKdEw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "gaxios": "^6.0.0",
+>         "jws": "^4.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14.0.0"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/https-proxy-agent": {
+>       "version": "7.0.6",
+>       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+>       "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "agent-base": "^7.1.2",
+>         "debug": "4"
+>       },
+>       "engines": {
+>         "node": ">= 14"
+>       }
+>     },
+>     "node_modules/@google-cloud/common/node_modules/uuid": {
+>       "version": "9.0.1",
+>       "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+>       "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+>       "funding": [
+>         "https://github.com/sponsors/broofa",
+>         "https://github.com/sponsors/ctavan"
+>       ],
+>       "license": "MIT",
+>       "bin": {
+>         "uuid": "dist/bin/uuid"
+>       }
+>     },
+4251,4529d4705
+<     "node_modules/@google-cloud/logging-min": {
+<       "version": "10.4.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/logging-min/-/logging-min-10.4.0.tgz",
+<       "integrity": "sha512-TcblDYAATO9hHcDcWYFh+vqt3pAV7Qddaih1JK3cpkzLa+BWjD5gAVAWww8W9Wr5yxOX+8CkssanH/xSS4n76Q==",
+<       "dependencies": {
+<         "@google-cloud/common": "^4.0.0",
+<         "@google-cloud/paginator": "^4.0.0",
+<         "@google-cloud/projectify": "^3.0.0",
+<         "@google-cloud/promisify": "^3.0.0",
+<         "arrify": "^2.0.1",
+<         "dot-prop": "^6.0.0",
+<         "eventid": "^2.0.0",
+<         "extend": "^3.0.2",
+<         "gcp-metadata": "^4.0.0",
+<         "google-auth-library": "^8.0.2",
+<         "google-gax": "^3.5.2",
+<         "on-finished": "^2.3.0",
+<         "pumpify": "^2.0.1",
+<         "stream-events": "^1.0.5",
+<         "uuid": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/common": {
+<       "version": "4.0.3",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-4.0.3.tgz",
+<       "integrity": "sha512-fUoMo5b8iAKbrYpneIRV3z95AlxVJPrjpevxs4SKoclngWZvTXBSGpNisF5+x5m+oNGve7jfB1e6vNBZBUs7Fw==",
+<       "dependencies": {
+<         "@google-cloud/projectify": "^3.0.0",
+<         "@google-cloud/promisify": "^3.0.0",
+<         "arrify": "^2.0.1",
+<         "duplexify": "^4.1.1",
+<         "ent": "^2.2.0",
+<         "extend": "^3.0.2",
+<         "google-auth-library": "^8.0.2",
+<         "retry-request": "^5.0.0",
+<         "teeny-request": "^8.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/paginator": {
+<       "version": "4.0.1",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/paginator/-/paginator-4.0.1.tgz",
+<       "integrity": "sha512-6G1ui6bWhNyHjmbYwavdN7mpVPRBtyDg/bfqBTAlwr413On2TnFNfDxc9UhTJctkgoCDgQXEKiRPLPR9USlkbQ==",
+<       "dependencies": {
+<         "arrify": "^2.0.0",
+<         "extend": "^3.0.2"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/projectify": {
+<       "version": "3.0.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-3.0.0.tgz",
+<       "integrity": "sha512-HRkZsNmjScY6Li8/kb70wjGlDDyLkVk3KvoEo9uIoxSjYLJasGiCch9+PqRVDOCGUFvEIqyogl+BeqILL4OJHA==",
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/@google-cloud/promisify": {
+<       "version": "3.0.1",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-3.0.1.tgz",
+<       "integrity": "sha512-z1CjRjtQyBOYL+5Qr9DdYIfrdLBe746jRTYfaYU6MeXkqp7UfYs/jX16lFFVzZ7PGEJvqZNqYUEtb1mvDww4pA==",
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/duplexify": {
+<       "version": "4.1.2",
+<       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
+<       "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
+<       "dependencies": {
+<         "end-of-stream": "^1.4.1",
+<         "inherits": "^2.0.3",
+<         "readable-stream": "^3.1.1",
+<         "stream-shift": "^1.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/gcp-metadata": {
+<       "version": "4.3.1",
+<       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-4.3.1.tgz",
+<       "integrity": "sha512-x850LS5N7V1F3UcV7PoupzGsyD6iVwTVvsh3tbXfkctZnBnjW5yu5z1/3k3SehF7TyoTIe78rJs02GMMy+LF+A==",
+<       "dependencies": {
+<         "gaxios": "^4.0.0",
+<         "json-bigint": "^1.0.0"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/gcp-metadata/node_modules/gaxios": {
+<       "version": "4.3.3",
+<       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-4.3.3.tgz",
+<       "integrity": "sha512-gSaYYIO1Y3wUtdfHmjDUZ8LWaxJQpiavzbF5Kq53akSzvmVg0RfyOcFDbO1KJ/KCGRFz2qG+lS81F0nkr7cRJA==",
+<       "dependencies": {
+<         "abort-controller": "^3.0.0",
+<         "extend": "^3.0.2",
+<         "https-proxy-agent": "^5.0.0",
+<         "is-stream": "^2.0.0",
+<         "node-fetch": "^2.6.7"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/google-auth-library": {
+<       "version": "8.9.0",
+<       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-8.9.0.tgz",
+<       "integrity": "sha512-f7aQCJODJFmYWN6PeNKzgvy9LI2tYmXnzpNDHEjG5sDNPgGb2FXQyTBnXeSH+PAtpKESFD+LmHw3Ox3mN7e1Fg==",
+<       "dependencies": {
+<         "arrify": "^2.0.0",
+<         "base64-js": "^1.3.0",
+<         "ecdsa-sig-formatter": "^1.0.11",
+<         "fast-text-encoding": "^1.0.0",
+<         "gaxios": "^5.0.0",
+<         "gcp-metadata": "^5.3.0",
+<         "gtoken": "^6.1.0",
+<         "jws": "^4.0.0",
+<         "lru-cache": "^6.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/google-auth-library/node_modules/gcp-metadata": {
+<       "version": "5.3.0",
+<       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-5.3.0.tgz",
+<       "integrity": "sha512-FNTkdNEnBdlqF2oatizolQqNANMrcqJt6AAYt99B3y1aLLC8Hc5IOBb+ZnnzllodEEf6xMBp6wRcBbc16fa65w==",
+<       "dependencies": {
+<         "gaxios": "^5.0.0",
+<         "json-bigint": "^1.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/google-gax": {
+<       "version": "3.6.1",
+<       "resolved": "https://registry.npmjs.org/google-gax/-/google-gax-3.6.1.tgz",
+<       "integrity": "sha512-g/lcUjGcB6DSw2HxgEmCDOrI/CByOwqRvsuUvNalHUK2iPPPlmAIpbMbl62u0YufGMr8zgE3JL7th6dCb1Ry+w==",
+<       "dependencies": {
+<         "@grpc/grpc-js": "~1.8.0",
+<         "@grpc/proto-loader": "^0.7.0",
+<         "@types/long": "^4.0.0",
+<         "@types/rimraf": "^3.0.2",
+<         "abort-controller": "^3.0.0",
+<         "duplexify": "^4.0.0",
+<         "fast-text-encoding": "^1.0.3",
+<         "google-auth-library": "^8.0.2",
+<         "is-stream-ended": "^0.1.4",
+<         "node-fetch": "^2.6.1",
+<         "object-hash": "^3.0.0",
+<         "proto3-json-serializer": "^1.0.0",
+<         "protobufjs": "7.2.4",
+<         "protobufjs-cli": "1.1.1",
+<         "retry-request": "^5.0.0"
+<       },
+<       "bin": {
+<         "compileProtos": "build/tools/compileProtos.js",
+<         "minifyProtoJson": "build/tools/minify.js"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/google-p12-pem": {
+<       "version": "4.0.1",
+<       "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-4.0.1.tgz",
+<       "integrity": "sha512-WPkN4yGtz05WZ5EhtlxNDWPhC4JIic6G8ePitwUWy4l+XPVYec+a0j0Ts47PDtW59y3RwAhUd9/h9ZZ63px6RQ==",
+<       "dependencies": {
+<         "node-forge": "^1.3.1"
+<       },
+<       "bin": {
+<         "gp12-pem": "build/src/bin/gp12-pem.js"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/gtoken": {
+<       "version": "6.1.2",
+<       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-6.1.2.tgz",
+<       "integrity": "sha512-4ccGpzz7YAr7lxrT2neugmXQ3hP9ho2gcaityLVkiUecAiwiy60Ii8gRbZeOsXV19fYaRjgBSshs8kXw+NKCPQ==",
+<       "dependencies": {
+<         "gaxios": "^5.0.1",
+<         "google-p12-pem": "^4.0.0",
+<         "jws": "^4.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/lru-cache": {
+<       "version": "6.0.0",
+<       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+<       "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+<       "dependencies": {
+<         "yallist": "^4.0.0"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/object-hash": {
+<       "version": "3.0.0",
+<       "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
+<       "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
+<       "engines": {
+<         "node": ">= 6"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/retry-request": {
+<       "version": "5.0.2",
+<       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-5.0.2.tgz",
+<       "integrity": "sha512-wfI3pk7EE80lCIXprqh7ym48IHYdwmAAzESdbU8Q9l7pnRCk9LEhpbOTNKjz6FARLm/Bl5m+4F0ABxOkYUujSQ==",
+<       "dependencies": {
+<         "debug": "^4.1.1",
+<         "extend": "^3.0.2"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/teeny-request": {
+<       "version": "8.0.3",
+<       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-8.0.3.tgz",
+<       "integrity": "sha512-jJZpA5He2y52yUhA7pyAGZlgQpcB+xLjcN0eUFxr9c8hP/H7uOXbBNVo/O0C/xVfJLJs680jvkFgVJEEvk9+ww==",
+<       "dependencies": {
+<         "http-proxy-agent": "^5.0.0",
+<         "https-proxy-agent": "^5.0.0",
+<         "node-fetch": "^2.6.1",
+<         "stream-events": "^1.0.5",
+<         "uuid": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/uuid": {
+<       "version": "9.0.1",
+<       "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+<       "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+<       "funding": [
+<         "https://github.com/sponsors/broofa",
+<         "https://github.com/sponsors/ctavan"
+<       ],
+<       "bin": {
+<         "uuid": "dist/bin/uuid"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging-min/node_modules/yallist": {
+<       "version": "4.0.0",
+<       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+<       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+<     },
+<     "node_modules/@google-cloud/logging/node_modules/@google-cloud/common": {
+<       "version": "5.0.2",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.2.tgz",
+<       "integrity": "sha512-V7bmBKYQyu0eVG2BFejuUjlBt+zrya6vtsKdY+JxMM/dNntPF41vZ9+LhOshEUH01zOHEqBSvI7Dad7ZS6aUeA==",
+<       "dependencies": {
+<         "@google-cloud/projectify": "^4.0.0",
+<         "@google-cloud/promisify": "^4.0.0",
+<         "arrify": "^2.0.1",
+<         "duplexify": "^4.1.1",
+<         "extend": "^3.0.2",
+<         "google-auth-library": "^9.0.0",
+<         "html-entities": "^2.5.2",
+<         "retry-request": "^7.0.0",
+<         "teeny-request": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14.0.0"
+<       }
+<     },
+4542,4557d4717
+<     "node_modules/@google-cloud/logging/node_modules/@google-cloud/projectify": {
+<       "version": "4.0.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/projectify/-/projectify-4.0.0.tgz",
+<       "integrity": "sha512-MmaX6HeSvyPbWGwFq7mXdo0uQZLGBYCwziiLIGq5JVX+/bdI3SAq6bP98trV5eTWfLuvsMcIC1YJOF2vfteLFA==",
+<       "engines": {
+<         "node": ">=14.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging/node_modules/@google-cloud/promisify": {
+<       "version": "4.0.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-4.0.0.tgz",
+<       "integrity": "sha512-Orxzlfb9c67A15cq2JQEyVc7wEsmFBmHjZWZYQMUyJ1qivXyMwdyNOs9odi79hze+2zqdTtu1E19IM/FtqZ10g==",
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+4585,4595d4744
+<     "node_modules/@google-cloud/logging/node_modules/duplexify": {
+<       "version": "4.1.3",
+<       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.3.tgz",
+<       "integrity": "sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==",
+<       "dependencies": {
+<         "end-of-stream": "^1.4.1",
+<         "inherits": "^2.0.3",
+<         "readable-stream": "^3.1.1",
+<         "stream-shift": "^1.0.2"
+<       }
+<     },
+4668,4695d4816
+<     "node_modules/@google-cloud/logging/node_modules/retry-request": {
+<       "version": "7.0.2",
+<       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-7.0.2.tgz",
+<       "integrity": "sha512-dUOvLMJ0/JJYEn8NrpOaGNE7X3vpI5XlZS/u0ANjqtcZVKnIxP7IgCFwrKTxENw29emmwug53awKtaMm4i9g5w==",
+<       "dependencies": {
+<         "@types/request": "^2.48.8",
+<         "extend": "^3.0.2",
+<         "teeny-request": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/logging/node_modules/teeny-request": {
+<       "version": "9.0.0",
+<       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
+<       "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+<       "dependencies": {
+<         "http-proxy-agent": "^5.0.0",
+<         "https-proxy-agent": "^5.0.0",
+<         "node-fetch": "^2.6.9",
+<         "stream-events": "^1.0.5",
+<         "uuid": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+4756,4799c4877
+<     "node_modules/@google-cloud/profiler": {
+<       "version": "6.0.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/profiler/-/profiler-6.0.0.tgz",
+<       "integrity": "sha512-EAxPbDiNRidAKOEnlUK3M+CcOlqG+REkUEZKirLtxFwzI/m7LmGqDzQvrVWTOSFSEYJ9qQRRnO+Q1osNGk3NUg==",
+<       "dependencies": {
+<         "@google-cloud/common": "^5.0.0",
+<         "@google-cloud/logging-min": "^10.0.0",
+<         "@types/console-log-level": "^1.4.0",
+<         "@types/semver": "^7.0.0",
+<         "console-log-level": "^1.4.0",
+<         "delay": "^5.0.0",
+<         "extend": "^3.0.2",
+<         "gcp-metadata": "^6.0.0",
+<         "parse-duration": "^1.0.0",
+<         "pprof": "3.2.1",
+<         "pretty-ms": "^7.0.0",
+<         "protobufjs": "~7.2.4",
+<         "semver": "^7.0.0",
+<         "teeny-request": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/@google-cloud/common": {
+<       "version": "5.0.0",
+<       "resolved": "https://registry.npmjs.org/@google-cloud/common/-/common-5.0.0.tgz",
+<       "integrity": "sha512-IsbTVr7Ag+04GMT87X738vDs85QU1rMvaesm2wEQrtTbZAR92tGmUQ8/D/kdnYgAi98Q4zmfhF+T8Xs/Lw4zAA==",
+<       "dependencies": {
+<         "@google-cloud/projectify": "^4.0.0",
+<         "@google-cloud/promisify": "^4.0.0",
+<         "arrify": "^2.0.1",
+<         "duplexify": "^4.1.1",
+<         "ent": "^2.2.0",
+<         "extend": "^3.0.2",
+<         "google-auth-library": "^9.0.0",
+<         "retry-request": "^6.0.0",
+<         "teeny-request": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/@google-cloud/projectify": {
+---
+>     "node_modules/@google-cloud/projectify": {
+4802a4881
+>       "license": "Apache-2.0",
+4807c4886
+<     "node_modules/@google-cloud/profiler/node_modules/@google-cloud/promisify": {
+---
+>     "node_modules/@google-cloud/promisify": {
+4810a4890
+>       "license": "Apache-2.0",
+4815,4993d4894
+<     "node_modules/@google-cloud/profiler/node_modules/agent-base": {
+<       "version": "7.1.0",
+<       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.0.tgz",
+<       "integrity": "sha512-o/zjMZRhJxny7OyEF+Op8X+efiELC7k7yOjMzgfzVqOzXqkBkWI79YoTdOtsuWd5BWhAGAuOY/Xa6xpiaWXiNg==",
+<       "dependencies": {
+<         "debug": "^4.3.4"
+<       },
+<       "engines": {
+<         "node": ">= 14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/debug": {
+<       "version": "4.3.4",
+<       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
+<       "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
+<       "dependencies": {
+<         "ms": "2.1.2"
+<       },
+<       "engines": {
+<         "node": ">=6.0"
+<       },
+<       "peerDependenciesMeta": {
+<         "supports-color": {
+<           "optional": true
+<         }
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/duplexify": {
+<       "version": "4.1.2",
+<       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
+<       "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
+<       "dependencies": {
+<         "end-of-stream": "^1.4.1",
+<         "inherits": "^2.0.3",
+<         "readable-stream": "^3.1.1",
+<         "stream-shift": "^1.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/gaxios": {
+<       "version": "6.1.1",
+<       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-6.1.1.tgz",
+<       "integrity": "sha512-bw8smrX+XlAoo9o1JAksBwX+hi/RG15J+NTSxmNPIclKC3ZVK6C2afwY8OSdRvOK0+ZLecUJYtj2MmjOt3Dm0w==",
+<       "dependencies": {
+<         "extend": "^3.0.2",
+<         "https-proxy-agent": "^7.0.1",
+<         "is-stream": "^2.0.0",
+<         "node-fetch": "^2.6.9"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/gaxios/node_modules/https-proxy-agent": {
+<       "version": "7.0.2",
+<       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.2.tgz",
+<       "integrity": "sha512-NmLNjm6ucYwtcUmL7JQC1ZQ57LmHP4lT15FQ8D61nak1rO6DH+fz5qNK2Ap5UN4ZapYICE3/0KodcLYSPsPbaA==",
+<       "dependencies": {
+<         "agent-base": "^7.0.2",
+<         "debug": "4"
+<       },
+<       "engines": {
+<         "node": ">= 14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/gcp-metadata": {
+<       "version": "6.0.0",
+<       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-6.0.0.tgz",
+<       "integrity": "sha512-Ozxyi23/1Ar51wjUT2RDklK+3HxqDr8TLBNK8rBBFQ7T85iIGnXnVusauj06QyqCXRFZig8LZC+TUddWbndlpQ==",
+<       "dependencies": {
+<         "gaxios": "^6.0.0",
+<         "json-bigint": "^1.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/google-auth-library": {
+<       "version": "9.1.0",
+<       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-9.1.0.tgz",
+<       "integrity": "sha512-1M9HdOcQNPV5BwSXqwwT238MTKodJFBxZ/V2JP397ieOLv4FjQdfYb9SooR7Mb+oUT2IJ92mLJQf804dyx0MJA==",
+<       "dependencies": {
+<         "base64-js": "^1.3.0",
+<         "ecdsa-sig-formatter": "^1.0.11",
+<         "gaxios": "^6.0.0",
+<         "gcp-metadata": "^6.0.0",
+<         "gtoken": "^7.0.0",
+<         "jws": "^4.0.0",
+<         "lru-cache": "^6.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/gtoken": {
+<       "version": "7.0.1",
+<       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-7.0.1.tgz",
+<       "integrity": "sha512-KcFVtoP1CVFtQu0aSk3AyAt2og66PFhZAlkUOuWKwzMLoulHXG5W5wE5xAnHb+yl3/wEFoqGW7/cDGMU8igDZQ==",
+<       "dependencies": {
+<         "gaxios": "^6.0.0",
+<         "jws": "^4.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14.0.0"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/lru-cache": {
+<       "version": "6.0.0",
+<       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+<       "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+<       "dependencies": {
+<         "yallist": "^4.0.0"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/ms": {
+<       "version": "2.1.2",
+<       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
+<       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/retry-request": {
+<       "version": "6.0.0",
+<       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-6.0.0.tgz",
+<       "integrity": "sha512-24kaFMd3wCnT3n4uPnsQh90ZSV8OISpfTFXJ00Wi+/oD2OPrp63EQ8hznk6rhxdlpwx2QBhQSDz2Fg46ki852g==",
+<       "dependencies": {
+<         "debug": "^4.1.1",
+<         "extend": "^3.0.2"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/semver": {
+<       "version": "7.5.4",
+<       "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
+<       "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+<       "dependencies": {
+<         "lru-cache": "^6.0.0"
+<       },
+<       "bin": {
+<         "semver": "bin/semver.js"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/teeny-request": {
+<       "version": "9.0.0",
+<       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
+<       "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+<       "dependencies": {
+<         "http-proxy-agent": "^5.0.0",
+<         "https-proxy-agent": "^5.0.0",
+<         "node-fetch": "^2.6.9",
+<         "stream-events": "^1.0.5",
+<         "uuid": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/uuid": {
+<       "version": "9.0.1",
+<       "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+<       "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+<       "funding": [
+<         "https://github.com/sponsors/broofa",
+<         "https://github.com/sponsors/ctavan"
+<       ],
+<       "bin": {
+<         "uuid": "dist/bin/uuid"
+<       }
+<     },
+<     "node_modules/@google-cloud/profiler/node_modules/yallist": {
+<       "version": "4.0.0",
+<       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+<       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+<     },
+5048,5058d4948
+<     "node_modules/@google-cloud/storage/node_modules/duplexify": {
+<       "version": "4.1.2",
+<       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
+<       "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
+<       "dependencies": {
+<         "end-of-stream": "^1.4.1",
+<         "inherits": "^2.0.3",
+<         "readable-stream": "^3.1.1",
+<         "stream-shift": "^1.0.0"
+<       }
+<     },
+5598,5608d5487
+<     "node_modules/@jsdoc/salty": {
+<       "version": "0.2.8",
+<       "resolved": "https://registry.npmjs.org/@jsdoc/salty/-/salty-0.2.8.tgz",
+<       "integrity": "sha512-5e+SFVavj1ORKlKaKr2BmTOekmXbelU7dC0cDkQLqag7xfuTPuGMUFx7KWJuv4bYZrTsoL2Z18VVCOKYxzoHcg==",
+<       "dependencies": {
+<         "lodash": "^4.17.21"
+<       },
+<       "engines": {
+<         "node": ">=v12.0.0"
+<       }
+<     },
+5809,5822d5687
+<     "node_modules/@mapbox/node-pre-gyp/node_modules/rimraf": {
+<       "version": "3.0.2",
+<       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+<       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+<       "dependencies": {
+<         "glob": "^7.1.3"
+<       },
+<       "bin": {
+<         "rimraf": "bin.js"
+<       },
+<       "funding": {
+<         "url": "https://github.com/sponsors/isaacs"
+<       }
+<     },
+11095,11103d10959
+<     "node_modules/@types/glob": {
+<       "version": "8.1.0",
+<       "resolved": "https://registry.npmjs.org/@types/glob/-/glob-8.1.0.tgz",
+<       "integrity": "sha512-IO+MJPVhoqz+28h1qLAcBEH2+xHMK6MTyHJc7MTnnYb6wsoLR29POVGJ7LycmVXIqyy/4/2ShP5sUwTXuOwb/w==",
+<       "dependencies": {
+<         "@types/minimatch": "^5.1.2",
+<         "@types/node": "*"
+<       }
+<     },
+11266,11270d11121
+<     "node_modules/@types/linkify-it": {
+<       "version": "5.0.0",
+<       "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
+<       "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q=="
+<     },
+11282,11295d11132
+<     "node_modules/@types/markdown-it": {
+<       "version": "14.1.1",
+<       "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.1.tgz",
+<       "integrity": "sha512-4NpsnpYl2Gt1ljyBGrKMxFYAYvpqbnnkgP/i/g+NLpjEUa3obn1XJCur9YbEXKDAkaXqsR1LbDnGEJ0MmKFxfg==",
+<       "dependencies": {
+<         "@types/linkify-it": "^5",
+<         "@types/mdurl": "^2"
+<       }
+<     },
+<     "node_modules/@types/mdurl": {
+<       "version": "2.0.0",
+<       "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz",
+<       "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg=="
+<     },
+11321,11325d11157
+<     "node_modules/@types/minimatch": {
+<       "version": "5.1.2",
+<       "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-5.1.2.tgz",
+<       "integrity": "sha512-K0VQKziLUWkVKiRVrx4a40iPaxTUefQmjtkQofBkYRcoaaL/8rhwDWww9qWbrgicNOgnpIsMxyNIUM4+n6dUIA=="
+<     },
+11574,11582d11405
+<     "node_modules/@types/rimraf": {
+<       "version": "3.0.2",
+<       "resolved": "https://registry.npmjs.org/@types/rimraf/-/rimraf-3.0.2.tgz",
+<       "integrity": "sha512-F3OznnSLAUxFrCEu/L5PY8+ny8DtcFRjx7fZZ9bycvXRi3KPTRS9HOitGZwvPg0juRhXFWIeKX58cnX5YqLohQ==",
+<       "dependencies": {
+<         "@types/glob": "*",
+<         "@types/node": "*"
+<       }
+<     },
+13204a13028
+>       "dev": true,
+13842a13667,13675
+>     "node_modules/asn1": {
+>       "version": "0.2.6",
+>       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
+>       "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "safer-buffer": "~2.1.0"
+>       }
+>     },
+14965a14799,14807
+>     "node_modules/buildcheck": {
+>       "version": "0.0.6",
+>       "resolved": "https://registry.npmjs.org/buildcheck/-/buildcheck-0.0.6.tgz",
+>       "integrity": "sha512-8f9ZJCUXyT1M35Jx7MkBgmBMo3oHTTBIPLiY9xyL0pl3T5RwcPEY8cUHr5LBNfu/fk6c2T4DJZuVM/8ZZT2D2A==",
+>       "optional": true,
+>       "engines": {
+>         "node": ">=10.0.0"
+>       }
+>     },
+15160,15174d15001
+<     "node_modules/c8/node_modules/rimraf": {
+<       "version": "3.0.2",
+<       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+<       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+<       "dev": true,
+<       "dependencies": {
+<         "glob": "^7.1.3"
+<       },
+<       "bin": {
+<         "rimraf": "bin.js"
+<       },
+<       "funding": {
+<         "url": "https://github.com/sponsors/isaacs"
+<       }
+<     },
+15367,15377d15193
+<     "node_modules/catharsis": {
+<       "version": "0.9.0",
+<       "resolved": "https://registry.npmjs.org/catharsis/-/catharsis-0.9.0.tgz",
+<       "integrity": "sha512-prMTQVpcns/tzFgFVkVp6ak6RykZyWb3gu8ckUpd6YkTlacOd3DXGJjIpD4Q6zJirizvaiAjSSHlOsA+6sNh2A==",
+<       "dependencies": {
+<         "lodash": "^4.17.15"
+<       },
+<       "engines": {
+<         "node": ">= 10"
+<       }
+<     },
+16502,16514d16317
+<     "node_modules/cpu-features": {
+<       "version": "0.0.2",
+<       "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.2.tgz",
+<       "integrity": "sha512-/2yieBqvMcRj8McNzkycjW2v3OIUOibBfd2dLEJ0nWts8NobAxwiyw9phVNS6oDL8x8tz9F7uNVFEVpJncQpeA==",
+<       "hasInstallScript": true,
+<       "optional": true,
+<       "dependencies": {
+<         "nan": "^2.14.1"
+<       },
+<       "engines": {
+<         "node": ">=8.0.0"
+<       }
+<     },
+17652c17455,17456
+<       "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ=="
+---
+>       "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
+>       "dev": true
+17910,17935d17713
+<     "node_modules/docker-modem": {
+<       "version": "3.0.3",
+<       "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-3.0.3.tgz",
+<       "integrity": "sha512-Tgkn2a+yiNP9FoZgMa/D9Wk+D2Db///0KOyKSYZRJa8w4+DzKyzQMkczKSdR/adQ0x46BOpeNkoyEOKjPhCzjw==",
+<       "dependencies": {
+<         "debug": "^4.1.1",
+<         "readable-stream": "^3.5.0",
+<         "split-ca": "^1.0.1",
+<         "ssh2": "^1.4.0"
+<       },
+<       "engines": {
+<         "node": ">= 8.0"
+<       }
+<     },
+<     "node_modules/dockerode": {
+<       "version": "3.3.1",
+<       "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-3.3.1.tgz",
+<       "integrity": "sha512-AS2mr8Lp122aa5n6d99HkuTNdRV1wkkhHwBdcnY6V0+28D3DSYwhxAk85/mM9XwD3RMliTxyr63iuvn5ZblFYQ==",
+<       "dependencies": {
+<         "docker-modem": "^3.0.0",
+<         "tar-fs": "~2.0.1"
+<       },
+<       "engines": {
+<         "node": ">= 8.0"
+<       }
+<     },
+18119a17898,17909
+>     "node_modules/duplexify": {
+>       "version": "4.1.3",
+>       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.3.tgz",
+>       "integrity": "sha512-M3BmBhwJRZsSx38lZyhE53Csddgzl5R7xGJNk7CVddZD6CcmwMCH8J+7AprIrQKH7TonKxaCjcv27Qmf+sQ+oA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "end-of-stream": "^1.4.1",
+>         "inherits": "^2.0.3",
+>         "readable-stream": "^3.1.1",
+>         "stream-shift": "^1.0.2"
+>       }
+>     },
+19831a19622
+>       "dev": true,
+19847a19639
+>       "dev": true,
+19858a19651
+>       "dev": true,
+19918a19712
+>       "dev": true,
+19936a19731
+>       "dev": true,
+20628c20423,20424
+<       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+---
+>       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
+>       "dev": true
+21080,21094d20875
+<     "node_modules/flat-cache/node_modules/rimraf": {
+<       "version": "3.0.2",
+<       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+<       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+<       "dev": true,
+<       "dependencies": {
+<         "glob": "^7.1.3"
+<       },
+<       "bin": {
+<         "rimraf": "bin.js"
+<       },
+<       "funding": {
+<         "url": "https://github.com/sponsors/isaacs"
+<       }
+<     },
+22169,22219d21949
+<     "node_modules/google-gax/node_modules/retry-request": {
+<       "version": "7.0.2",
+<       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-7.0.2.tgz",
+<       "integrity": "sha512-dUOvLMJ0/JJYEn8NrpOaGNE7X3vpI5XlZS/u0ANjqtcZVKnIxP7IgCFwrKTxENw29emmwug53awKtaMm4i9g5w==",
+<       "dependencies": {
+<         "@types/request": "^2.48.8",
+<         "extend": "^3.0.2",
+<         "teeny-request": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/google-gax/node_modules/teeny-request": {
+<       "version": "9.0.0",
+<       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
+<       "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+<       "dependencies": {
+<         "http-proxy-agent": "^5.0.0",
+<         "https-proxy-agent": "^5.0.0",
+<         "node-fetch": "^2.6.9",
+<         "stream-events": "^1.0.5",
+<         "uuid": "^9.0.0"
+<       },
+<       "engines": {
+<         "node": ">=14"
+<       }
+<     },
+<     "node_modules/google-gax/node_modules/teeny-request/node_modules/agent-base": {
+<       "version": "6.0.2",
+<       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-6.0.2.tgz",
+<       "integrity": "sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==",
+<       "dependencies": {
+<         "debug": "4"
+<       },
+<       "engines": {
+<         "node": ">= 6.0.0"
+<       }
+<     },
+<     "node_modules/google-gax/node_modules/teeny-request/node_modules/https-proxy-agent": {
+<       "version": "5.0.1",
+<       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-5.0.1.tgz",
+<       "integrity": "sha512-dFcAjpTQFgoLMzC2VwU+C/CbS7uRL0lWmxDITmqm7C+7F0Odmj6s9l6alZc6AELXhrnggM2CeWSXHGOdX2YtwA==",
+<       "dependencies": {
+<         "agent-base": "6",
+<         "debug": "4"
+<       },
+<       "engines": {
+<         "node": ">= 6"
+<       }
+<     },
+22231a21962,21970
+>     "node_modules/google-logging-utils": {
+>       "version": "0.0.2",
+>       "resolved": "https://registry.npmjs.org/google-logging-utils/-/google-logging-utils-0.0.2.tgz",
+>       "integrity": "sha512-NEgUnEcBiP5HrPzufUkBzJOD/Sxsco3rLNo1F1TNf7ieU8ryUzBhqba8r756CjLX7rn3fHl6iLEwPYuqpoKgQQ==",
+>       "license": "Apache-2.0",
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+24058,24062d23796
+<     "node_modules/is-stream-ended": {
+<       "version": "0.1.4",
+<       "resolved": "https://registry.npmjs.org/is-stream-ended/-/is-stream-ended-0.1.4.tgz",
+<       "integrity": "sha512-xj0XPvmr7bQFTvirqnFr50o0hQIh6ZItDqloxt5aJrR4NQsYeSsyFQERYGCAzfindAcnKjINnwEEgLx4IqVzQw=="
+<     },
+24518,24525d24251
+<     "node_modules/js2xmlparser": {
+<       "version": "4.0.2",
+<       "resolved": "https://registry.npmjs.org/js2xmlparser/-/js2xmlparser-4.0.2.tgz",
+<       "integrity": "sha512-6n4D8gLlLf1n5mNLQPRfViYzu9RATblzPEtm1SthMX1Pjao0r9YI9nw7ZIfRxQMERS87mcswrg+r/OYrPRX6jA==",
+<       "dependencies": {
+<         "xmlcreate": "^2.0.4"
+<       }
+<     },
+24597,24624d24322
+<     "node_modules/jsdoc": {
+<       "version": "4.0.3",
+<       "resolved": "https://registry.npmjs.org/jsdoc/-/jsdoc-4.0.3.tgz",
+<       "integrity": "sha512-Nu7Sf35kXJ1MWDZIMAuATRQTg1iIPdzh7tqJ6jjvaU/GfDf+qi5UV8zJR3Mo+/pYFvm8mzay4+6O5EWigaQBQw==",
+<       "dependencies": {
+<         "@babel/parser": "^7.20.15",
+<         "@jsdoc/salty": "^0.2.1",
+<         "@types/markdown-it": "^14.1.1",
+<         "bluebird": "^3.7.2",
+<         "catharsis": "^0.9.0",
+<         "escape-string-regexp": "^2.0.0",
+<         "js2xmlparser": "^4.0.2",
+<         "klaw": "^3.0.0",
+<         "markdown-it": "^14.1.0",
+<         "markdown-it-anchor": "^8.6.7",
+<         "marked": "^4.0.10",
+<         "mkdirp": "^1.0.4",
+<         "requizzle": "^0.2.3",
+<         "strip-json-comments": "^3.1.0",
+<         "underscore": "~1.13.2"
+<       },
+<       "bin": {
+<         "jsdoc": "jsdoc.js"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+24635,24653d24332
+<     "node_modules/jsdoc/node_modules/escape-string-regexp": {
+<       "version": "2.0.0",
+<       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
+<       "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
+<       "engines": {
+<         "node": ">=8"
+<       }
+<     },
+<     "node_modules/jsdoc/node_modules/mkdirp": {
+<       "version": "1.0.4",
+<       "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-1.0.4.tgz",
+<       "integrity": "sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==",
+<       "bin": {
+<         "mkdirp": "bin/cmd.js"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+25108,25115d24786
+<     "node_modules/klaw": {
+<       "version": "3.0.0",
+<       "resolved": "https://registry.npmjs.org/klaw/-/klaw-3.0.0.tgz",
+<       "integrity": "sha512-0Fo5oir+O9jnXu5EefYbVK+mHMBeEVEy2cmctR1O1NECcCkPRreJKrS6Qt/j3KC2C148Dfo9i3pCmCMsdqGr0g==",
+<       "dependencies": {
+<         "graceful-fs": "^4.1.9"
+<       }
+<     },
+25497,25509d25167
+<     "node_modules/linkify-it": {
+<       "version": "5.0.0",
+<       "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
+<       "integrity": "sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==",
+<       "dependencies": {
+<         "uc.micro": "^2.0.0"
+<       }
+<     },
+<     "node_modules/linkify-it/node_modules/uc.micro": {
+<       "version": "2.1.0",
+<       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
+<       "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A=="
+<     },
+25922,25923c25580
+<       "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=",
+<       "dev": true
+---
+>       "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg="
+26248,26288d25904
+<     "node_modules/markdown-it": {
+<       "version": "14.1.0",
+<       "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
+<       "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
+<       "dependencies": {
+<         "argparse": "^2.0.1",
+<         "entities": "^4.4.0",
+<         "linkify-it": "^5.0.0",
+<         "mdurl": "^2.0.0",
+<         "punycode.js": "^2.3.1",
+<         "uc.micro": "^2.1.0"
+<       },
+<       "bin": {
+<         "markdown-it": "bin/markdown-it.mjs"
+<       }
+<     },
+<     "node_modules/markdown-it-anchor": {
+<       "version": "8.6.7",
+<       "resolved": "https://registry.npmjs.org/markdown-it-anchor/-/markdown-it-anchor-8.6.7.tgz",
+<       "integrity": "sha512-FlCHFwNnutLgVTflOYHPW2pPcl2AACqVzExlkGQNsi4CJgqOHN7YTgDd4LuhgN1BFO3TS0vLAruV1Td6dwWPJA==",
+<       "peerDependencies": {
+<         "@types/markdown-it": "*",
+<         "markdown-it": "*"
+<       }
+<     },
+<     "node_modules/markdown-it/node_modules/entities": {
+<       "version": "4.5.0",
+<       "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+<       "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+<       "engines": {
+<         "node": ">=0.12"
+<       },
+<       "funding": {
+<         "url": "https://github.com/fb55/entities?sponsor=1"
+<       }
+<     },
+<     "node_modules/markdown-it/node_modules/uc.micro": {
+<       "version": "2.1.0",
+<       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
+<       "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A=="
+<     },
+26339,26343d25954
+<     "node_modules/mdurl": {
+<       "version": "2.0.0",
+<       "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-2.0.0.tgz",
+<       "integrity": "sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w=="
+<     },
+28390,28436d28000
+<     "node_modules/optionator": {
+<       "version": "0.8.3",
+<       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.3.tgz",
+<       "integrity": "sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA==",
+<       "dependencies": {
+<         "deep-is": "~0.1.3",
+<         "fast-levenshtein": "~2.0.6",
+<         "levn": "~0.3.0",
+<         "prelude-ls": "~1.1.2",
+<         "type-check": "~0.3.2",
+<         "word-wrap": "~1.2.3"
+<       },
+<       "engines": {
+<         "node": ">= 0.8.0"
+<       }
+<     },
+<     "node_modules/optionator/node_modules/levn": {
+<       "version": "0.3.0",
+<       "resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
+<       "integrity": "sha512-0OO4y2iOHix2W6ujICbKIaEQXvFQHue65vUG3pb5EUomzPI90z9hsA1VsO/dbIIpC53J8gxM9Q4Oho0jrCM/yA==",
+<       "dependencies": {
+<         "prelude-ls": "~1.1.2",
+<         "type-check": "~0.3.2"
+<       },
+<       "engines": {
+<         "node": ">= 0.8.0"
+<       }
+<     },
+<     "node_modules/optionator/node_modules/prelude-ls": {
+<       "version": "1.1.2",
+<       "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz",
+<       "integrity": "sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w==",
+<       "engines": {
+<         "node": ">= 0.8.0"
+<       }
+<     },
+<     "node_modules/optionator/node_modules/type-check": {
+<       "version": "0.3.2",
+<       "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
+<       "integrity": "sha512-ZCmOJdvOWDBYJlzAoFkC+Q0+bUyEOS1ltgp1MGU03fqHG+dbi9tBFU2Rd9QKiDZFAYrhPh2JUf7rZRIuHRKtOg==",
+<       "dependencies": {
+<         "prelude-ls": "~1.1.2"
+<       },
+<       "engines": {
+<         "node": ">= 0.8.0"
+<       }
+<     },
+28682,28686d28245
+<     "node_modules/parse-duration": {
+<       "version": "1.1.0",
+<       "resolved": "https://registry.npmjs.org/parse-duration/-/parse-duration-1.1.0.tgz",
+<       "integrity": "sha512-z6t9dvSJYaPoQq7quMzdEagSFtpGu+utzHqqxmpVWNNZRIXnvqyCvn9XsTdh7c/w0Bqmdz3RB3YnRaKtpRtEXQ=="
+<     },
+30167,30206d29725
+<     "node_modules/pprof": {
+<       "version": "3.2.1",
+<       "resolved": "https://registry.npmjs.org/pprof/-/pprof-3.2.1.tgz",
+<       "integrity": "sha512-KnextTM3EHQ2zqN8fUjB0VpE+njcVR7cOfo7DjJSLKzIbKTPelDtokI04ScR/Vd8CLDj+M99tsaKV+K6FHzpzA==",
+<       "hasInstallScript": true,
+<       "dependencies": {
+<         "@mapbox/node-pre-gyp": "^1.0.0",
+<         "bindings": "^1.2.1",
+<         "delay": "^5.0.0",
+<         "findit2": "^2.2.3",
+<         "nan": "^2.14.0",
+<         "p-limit": "^3.0.0",
+<         "pify": "^5.0.0",
+<         "protobufjs": "~7.2.4",
+<         "source-map": "^0.7.3",
+<         "split": "^1.0.1"
+<       },
+<       "engines": {
+<         "node": ">=10.4.1"
+<       }
+<     },
+<     "node_modules/pprof/node_modules/pify": {
+<       "version": "5.0.0",
+<       "resolved": "https://registry.npmjs.org/pify/-/pify-5.0.0.tgz",
+<       "integrity": "sha512-eW/gHNMlxdSP6dmG6uJip6FXN0EQBwm2clYYd8Wul42Cwu/DK8HEftzsapcNdYe2MfLiIwZqsDk2RDEsTE79hA==",
+<       "engines": {
+<         "node": ">=10"
+<       },
+<       "funding": {
+<         "url": "https://github.com/sponsors/sindresorhus"
+<       }
+<     },
+<     "node_modules/pprof/node_modules/source-map": {
+<       "version": "0.7.4",
+<       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.4.tgz",
+<       "integrity": "sha512-l3BikUxvPOcn5E74dZiq5BGsTb5yEwhaTSzccU6t4sDOH8NWJCstKO5QT2CvtFoK6F0saL7p9xHAqHOlCPJygA==",
+<       "engines": {
+<         "node": ">= 8"
+<       }
+<     },
+30457,30467d29975
+<     "node_modules/proto3-json-serializer": {
+<       "version": "1.1.1",
+<       "resolved": "https://registry.npmjs.org/proto3-json-serializer/-/proto3-json-serializer-1.1.1.tgz",
+<       "integrity": "sha512-AwAuY4g9nxx0u52DnSMkqqgyLHaW/XaPLtaAo3y/ZCfeaQB/g4YDH4kb8Wc/mWzWvu0YjOznVnfn373MVZZrgw==",
+<       "dependencies": {
+<         "protobufjs": "^7.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+30491,30635d29998
+<     "node_modules/protobufjs-cli": {
+<       "version": "1.1.1",
+<       "resolved": "https://registry.npmjs.org/protobufjs-cli/-/protobufjs-cli-1.1.1.tgz",
+<       "integrity": "sha512-VPWMgIcRNyQwWUv8OLPyGQ/0lQY/QTQAVN5fh+XzfDwsVw1FZ2L3DM/bcBf8WPiRz2tNpaov9lPZfNcmNo6LXA==",
+<       "dependencies": {
+<         "chalk": "^4.0.0",
+<         "escodegen": "^1.13.0",
+<         "espree": "^9.0.0",
+<         "estraverse": "^5.1.0",
+<         "glob": "^8.0.0",
+<         "jsdoc": "^4.0.0",
+<         "minimist": "^1.2.0",
+<         "semver": "^7.1.2",
+<         "tmp": "^0.2.1",
+<         "uglify-js": "^3.7.7"
+<       },
+<       "bin": {
+<         "pbjs": "bin/pbjs",
+<         "pbts": "bin/pbts"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       },
+<       "peerDependencies": {
+<         "protobufjs": "^7.0.0"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/ansi-styles": {
+<       "version": "4.3.0",
+<       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+<       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+<       "dependencies": {
+<         "color-convert": "^2.0.1"
+<       },
+<       "engines": {
+<         "node": ">=8"
+<       },
+<       "funding": {
+<         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/brace-expansion": {
+<       "version": "2.0.1",
+<       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
+<       "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
+<       "dependencies": {
+<         "balanced-match": "^1.0.0"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/chalk": {
+<       "version": "4.1.2",
+<       "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+<       "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+<       "dependencies": {
+<         "ansi-styles": "^4.1.0",
+<         "supports-color": "^7.1.0"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       },
+<       "funding": {
+<         "url": "https://github.com/chalk/chalk?sponsor=1"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/escodegen": {
+<       "version": "1.14.3",
+<       "resolved": "https://registry.npmjs.org/escodegen/-/escodegen-1.14.3.tgz",
+<       "integrity": "sha512-qFcX0XJkdg+PB3xjZZG/wKSuT1PnQWx57+TVSjIMmILd2yC/6ByYElPwJnslDsuWuSAp4AwJGumarAAmJch5Kw==",
+<       "dependencies": {
+<         "esprima": "^4.0.1",
+<         "estraverse": "^4.2.0",
+<         "esutils": "^2.0.2",
+<         "optionator": "^0.8.1"
+<       },
+<       "bin": {
+<         "escodegen": "bin/escodegen.js",
+<         "esgenerate": "bin/esgenerate.js"
+<       },
+<       "engines": {
+<         "node": ">=4.0"
+<       },
+<       "optionalDependencies": {
+<         "source-map": "~0.6.1"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/escodegen/node_modules/estraverse": {
+<       "version": "4.3.0",
+<       "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
+<       "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
+<       "engines": {
+<         "node": ">=4.0"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/glob": {
+<       "version": "8.1.0",
+<       "resolved": "https://registry.npmjs.org/glob/-/glob-8.1.0.tgz",
+<       "integrity": "sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==",
+<       "deprecated": "Glob versions prior to v9 are no longer supported",
+<       "dependencies": {
+<         "fs.realpath": "^1.0.0",
+<         "inflight": "^1.0.4",
+<         "inherits": "2",
+<         "minimatch": "^5.0.1",
+<         "once": "^1.3.0"
+<       },
+<       "engines": {
+<         "node": ">=12"
+<       },
+<       "funding": {
+<         "url": "https://github.com/sponsors/isaacs"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/minimatch": {
+<       "version": "5.1.6",
+<       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
+<       "integrity": "sha512-lKwV/1brpG6mBUFHtb7NUmtABCb2WZZmm2wNiOA5hAb8VdCS4B3dtMWyvcoViccwAW/COERjXLt0zP1zXUN26g==",
+<       "dependencies": {
+<         "brace-expansion": "^2.0.1"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/semver": {
+<       "version": "7.6.2",
+<       "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.2.tgz",
+<       "integrity": "sha512-FNAIBWCx9qcRhoHcgcJ0gvU7SN1lYU2ZXuSfl04bSC5OpvDHFyJCjdNHomPXxjQlCBU67YW64PzY7/VIEH7F2w==",
+<       "bin": {
+<         "semver": "bin/semver.js"
+<       },
+<       "engines": {
+<         "node": ">=10"
+<       }
+<     },
+<     "node_modules/protobufjs-cli/node_modules/supports-color": {
+<       "version": "7.2.0",
+<       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+<       "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+<       "dependencies": {
+<         "has-flag": "^4.0.0"
+<       },
+<       "engines": {
+<         "node": ">=8"
+<       }
+<     },
+30797,30807d30159
+<     "node_modules/pumpify/node_modules/duplexify": {
+<       "version": "4.1.2",
+<       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.2.tgz",
+<       "integrity": "sha512-fz3OjcNCHmRP12MJoZMPglx8m4rrFP8rovnk4vT8Fs+aonZoCwGg10dSsQsfP/E62eZcPTMSMP6686fu9Qlqtw==",
+<       "dependencies": {
+<         "end-of-stream": "^1.4.1",
+<         "inherits": "^2.0.3",
+<         "readable-stream": "^3.1.1",
+<         "stream-shift": "^1.0.0"
+<       }
+<     },
+30816,30823d30167
+<     "node_modules/punycode.js": {
+<       "version": "2.3.1",
+<       "resolved": "https://registry.npmjs.org/punycode.js/-/punycode.js-2.3.1.tgz",
+<       "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==",
+<       "engines": {
+<         "node": ">=6"
+<       }
+<     },
+31992,31999d31335
+<     "node_modules/requizzle": {
+<       "version": "0.2.4",
+<       "resolved": "https://registry.npmjs.org/requizzle/-/requizzle-0.2.4.tgz",
+<       "integrity": "sha512-JRrFk1D4OQ4SqovXOgdav+K8EAhSB/LJZqCz8tbX0KObcdeM15Ss59ozWMBWmmINMagCwmqn4ZNryUGpBsl6Jw==",
+<       "dependencies": {
+<         "lodash": "^4.17.21"
+<       }
+<     },
+32106a31443,31456
+>     "node_modules/retry-request": {
+>       "version": "7.0.2",
+>       "resolved": "https://registry.npmjs.org/retry-request/-/retry-request-7.0.2.tgz",
+>       "integrity": "sha512-dUOvLMJ0/JJYEn8NrpOaGNE7X3vpI5XlZS/u0ANjqtcZVKnIxP7IgCFwrKTxENw29emmwug53awKtaMm4i9g5w==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "@types/request": "^2.48.8",
+>         "extend": "^3.0.2",
+>         "teeny-request": "^9.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+32122a31473,31488
+>     "node_modules/rimraf": {
+>       "version": "3.0.2",
+>       "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+>       "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+>       "deprecated": "Rimraf versions prior to v4 are no longer supported",
+>       "license": "ISC",
+>       "dependencies": {
+>         "glob": "^7.1.3"
+>       },
+>       "bin": {
+>         "rimraf": "bin.js"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/isaacs"
+>       }
+>     },
+33320c32686
+<       "devOptional": true,
+---
+>       "dev": true,
+33488,33512d32853
+<     "node_modules/ssh2": {
+<       "version": "1.6.0",
+<       "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.6.0.tgz",
+<       "integrity": "sha512-lxc+uvXqOxyQ99N2M7k5o4pkYDO5GptOTYduWw7hIM41icxvoBcCNHcj+LTKrjkL0vFcAl+qfZekthoSFRJn2Q==",
+<       "hasInstallScript": true,
+<       "dependencies": {
+<         "asn1": "^0.2.4",
+<         "bcrypt-pbkdf": "^1.0.2"
+<       },
+<       "engines": {
+<         "node": ">=10.16.0"
+<       },
+<       "optionalDependencies": {
+<         "cpu-features": "0.0.2",
+<         "nan": "^2.15.0"
+<       }
+<     },
+<     "node_modules/ssh2/node_modules/asn1": {
+<       "version": "0.2.6",
+<       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
+<       "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
+<       "dependencies": {
+<         "safer-buffer": "~2.1.0"
+<       }
+<     },
+33537,33544d32877
+<     "node_modules/sshpk/node_modules/asn1": {
+<       "version": "0.2.6",
+<       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz",
+<       "integrity": "sha512-ix/FxPn0MDjeyJ7i/yoHGFt/EX6LyNbxSEhPPXODPL+KB0VPk86UYfL0lMdy+KCnv+fmvIzySwaK5COwqVbWTQ==",
+<       "dependencies": {
+<         "safer-buffer": "~2.1.0"
+<       }
+<     },
+33896a33230
+>       "dev": true,
+34789,34799d34122
+<     "node_modules/tar-fs": {
+<       "version": "2.0.1",
+<       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.0.1.tgz",
+<       "integrity": "sha512-6tzWDMeroL87uF/+lin46k+Q+46rAJ0SyPGz7OW7wTgblI273hsBqk2C1j0/xNadNLKDTUL9BukSjB7cwgmlPA==",
+<       "dependencies": {
+<         "chownr": "^1.1.1",
+<         "mkdirp-classic": "^0.5.2",
+<         "pump": "^3.0.0",
+<         "tar-stream": "^2.0.0"
+<       }
+<     },
+34862a34186,34214
+>     "node_modules/teeny-request": {
+>       "version": "9.0.0",
+>       "resolved": "https://registry.npmjs.org/teeny-request/-/teeny-request-9.0.0.tgz",
+>       "integrity": "sha512-resvxdc6Mgb7YEThw6G6bExlXKkv6+YbuzGg9xuXxSgxJF7Ozs+o8Y9+2R3sArdWdW8nOokoQb1yrpFB0pQK2g==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "http-proxy-agent": "^5.0.0",
+>         "https-proxy-agent": "^5.0.0",
+>         "node-fetch": "^2.6.9",
+>         "stream-events": "^1.0.5",
+>         "uuid": "^9.0.0"
+>       },
+>       "engines": {
+>         "node": ">=14"
+>       }
+>     },
+>     "node_modules/teeny-request/node_modules/uuid": {
+>       "version": "9.0.1",
+>       "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+>       "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+>       "funding": [
+>         "https://github.com/sponsors/broofa",
+>         "https://github.com/sponsors/ctavan"
+>       ],
+>       "license": "MIT",
+>       "bin": {
+>         "uuid": "dist/bin/uuid"
+>       }
+>     },
+35286a34639
+>       "dev": true,
+35442d34794
+<       "dev": true,
+35745a35098,35099
+>       "dev": true,
+>       "optional": true,
+37308,37315d36661
+<     "node_modules/word-wrap": {
+<       "version": "1.2.5",
+<       "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+<       "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+<       "engines": {
+<         "node": ">=0.10.0"
+<       }
+<     },
+37546,37550d36891
+<     "node_modules/xmlcreate": {
+<       "version": "2.0.4",
+<       "resolved": "https://registry.npmjs.org/xmlcreate/-/xmlcreate-2.0.4.tgz",
+<       "integrity": "sha512-nquOebG4sngPmGPICTS5EnxqhKbCmz5Ox5hsszI2T6U5qdrJizBc+0ilYSEjTSzU0yZcmvppztXe/5Al5fUwdg=="
+<     },
+37861c37202
+<         "dockerode": "^3.1.0",
+---
+>         "dockerode": "^4.0.6",
+37904a37246,37272
+>     "services/clsi/node_modules/@grpc/grpc-js": {
+>       "version": "1.13.3",
+>       "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.13.3.tgz",
+>       "integrity": "sha512-FTXHdOoPbZrBjlVLHuKbDZnsTxXv2BlHF57xw6LuThXacXvtkahEPED0CKMk6obZDf65Hv4k3z62eyPNpvinIg==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@grpc/proto-loader": "^0.7.13",
+>         "@js-sdsl/ordered-map": "^4.4.2"
+>       },
+>       "engines": {
+>         "node": ">=12.10.0"
+>       }
+>     },
+>     "services/clsi/node_modules/cpu-features": {
+>       "version": "0.0.10",
+>       "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.10.tgz",
+>       "integrity": "sha512-9IkYqtX3YHPCzoVg1Py+o9057a3i0fp7S530UWokCSaFVTc7CwXPRiOjRjBQQ18ZCNafx78YfnG+HALxtVmOGA==",
+>       "hasInstallScript": true,
+>       "optional": true,
+>       "dependencies": {
+>         "buildcheck": "~0.0.6",
+>         "nan": "^2.19.0"
+>       },
+>       "engines": {
+>         "node": ">=10.0.0"
+>       }
+>     },
+37913a37282,37345
+>     "services/clsi/node_modules/docker-modem": {
+>       "version": "5.0.6",
+>       "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-5.0.6.tgz",
+>       "integrity": "sha512-ens7BiayssQz/uAxGzH8zGXCtiV24rRWXdjNha5V4zSOcxmAZsfGVm/PPFbwQdqEkDnhG+SyR9E3zSHUbOKXBQ==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "debug": "^4.1.1",
+>         "readable-stream": "^3.5.0",
+>         "split-ca": "^1.0.1",
+>         "ssh2": "^1.15.0"
+>       },
+>       "engines": {
+>         "node": ">= 8.0"
+>       }
+>     },
+>     "services/clsi/node_modules/dockerode": {
+>       "version": "4.0.6",
+>       "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-4.0.6.tgz",
+>       "integrity": "sha512-FbVf3Z8fY/kALB9s+P9epCpWhfi/r0N2DgYYcYpsAUlaTxPjdsitsFobnltb+lyCgAIvf9C+4PSWlTnHlJMf1w==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@balena/dockerignore": "^1.0.2",
+>         "@grpc/grpc-js": "^1.11.1",
+>         "@grpc/proto-loader": "^0.7.13",
+>         "docker-modem": "^5.0.6",
+>         "protobufjs": "^7.3.2",
+>         "tar-fs": "~2.1.2",
+>         "uuid": "^10.0.0"
+>       },
+>       "engines": {
+>         "node": ">= 8.0"
+>       }
+>     },
+>     "services/clsi/node_modules/nan": {
+>       "version": "2.22.2",
+>       "resolved": "https://registry.npmjs.org/nan/-/nan-2.22.2.tgz",
+>       "integrity": "sha512-DANghxFkS1plDdRsX0X9pm0Z6SJNN6gBdtXfanwoZ8hooC5gosGFSBGRYHUVPz1asKA/kMRqDRdHrluZ61SpBQ==",
+>       "license": "MIT",
+>       "optional": true
+>     },
+>     "services/clsi/node_modules/protobufjs": {
+>       "version": "7.5.0",
+>       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.5.0.tgz",
+>       "integrity": "sha512-Z2E/kOY1QjoMlCytmexzYfDm/w5fKAiRwpSzGtdnXW1zC88Z2yXazHHrOtwCzn+7wSxyE8PYM4rvVcMphF9sOA==",
+>       "hasInstallScript": true,
+>       "license": "BSD-3-Clause",
+>       "dependencies": {
+>         "@protobufjs/aspromise": "^1.1.2",
+>         "@protobufjs/base64": "^1.1.2",
+>         "@protobufjs/codegen": "^2.0.4",
+>         "@protobufjs/eventemitter": "^1.1.0",
+>         "@protobufjs/fetch": "^1.1.0",
+>         "@protobufjs/float": "^1.0.2",
+>         "@protobufjs/inquire": "^1.1.0",
+>         "@protobufjs/path": "^1.1.2",
+>         "@protobufjs/pool": "^1.1.0",
+>         "@protobufjs/utf8": "^1.1.0",
+>         "@types/node": ">=13.7.0",
+>         "long": "^5.0.0"
+>       },
+>       "engines": {
+>         "node": ">=12.0.0"
+>       }
+>     },
+37932a37365,37381
+>     "services/clsi/node_modules/ssh2": {
+>       "version": "1.16.0",
+>       "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.16.0.tgz",
+>       "integrity": "sha512-r1X4KsBGedJqo7h8F5c4Ybpcr5RjyP+aWIG007uBPRjmdQWfEiVLzSK71Zji1B9sKxwaCvD8y8cwSkYrlLiRRg==",
+>       "hasInstallScript": true,
+>       "dependencies": {
+>         "asn1": "^0.2.6",
+>         "bcrypt-pbkdf": "^1.0.2"
+>       },
+>       "engines": {
+>         "node": ">=10.16.0"
+>       },
+>       "optionalDependencies": {
+>         "cpu-features": "~0.0.10",
+>         "nan": "^2.20.0"
+>       }
+>     },
+37942a37392,37416
+>       }
+>     },
+>     "services/clsi/node_modules/tar-fs": {
+>       "version": "2.1.2",
+>       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.2.tgz",
+>       "integrity": "sha512-EsaAXwxmx8UB7FRKqeozqEPop69DXcmYwTQwXvyAPF352HJsPdkVhvTaDPYqfNgruveJIJy3TA2l+2zj8LJIJA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "chownr": "^1.1.1",
+>         "mkdirp-classic": "^0.5.2",
+>         "pump": "^3.0.0",
+>         "tar-stream": "^2.1.4"
+>       }
+>     },
+>     "services/clsi/node_modules/uuid": {
+>       "version": "10.0.0",
+>       "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+>       "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+>       "funding": [
+>         "https://github.com/sponsors/broofa",
+>         "https://github.com/sponsors/ctavan"
+>       ],
+>       "license": "MIT",
+>       "bin": {
+>         "uuid": "dist/bin/uuid"
diff --git a/server-ce/hotfix/5.5.1/Dockerfile b/server-ce/hotfix/5.5.1/Dockerfile
new file mode 100644
index 0000000000..9572d29740
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/Dockerfile
@@ -0,0 +1,28 @@
+FROM sharelatex/sharelatex:5.5.0
+
+
+# fix tls configuration in redis for history-v1
+COPY pr_25168.patch .
+RUN patch -p1 < pr_25168.patch && rm pr_25168.patch
+
+# improve logging in history system
+COPY pr_26086.patch .
+RUN patch -p1 < pr_26086.patch && rm pr_26086.patch
+
+# fix create-user.mjs script
+COPY pr_26152.patch .
+RUN patch -p1 < pr_26152.patch && rm pr_26152.patch
+
+# check mongo featureCompatibilityVersion
+COPY pr_26091.patch .
+RUN patch -p1 < pr_26091.patch && rm pr_26091.patch
+
+# update multer and tar-fs
+RUN sed -i 's/"multer": "2.0.0"/"multer": "2.0.1"/g' package.json
+RUN sed -i 's/"dockerode": "^4.0.5"/"dockerode": "^4.0.7"/g' services/clsi/package.json
+RUN sed -i 's/"tar-fs": "^3.0.4"/"tar-fs": "^3.0.9"/g' services/clsi/package.json
+RUN sed -i 's/199c5ff05bd375c508f4074498237baead7f5148/4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23/g' services/web/package.json
+COPY package-lock.json.diff .
+RUN patch package-lock.json < package-lock.json.diff
+RUN npm install --omit=dev
+RUN npm install  @paralleldrive/cuid2@2.2.2 -w services/history-v1
diff --git a/server-ce/hotfix/5.5.1/package-lock.json.diff b/server-ce/hotfix/5.5.1/package-lock.json.diff
new file mode 100644
index 0000000000..ecbf851bc8
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/package-lock.json.diff
@@ -0,0 +1,2202 @@
+4954,4956c4954,4957
+<       "version": "1.8.22",
+<       "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.8.22.tgz",
+<       "integrity": "sha512-oAjDdN7fzbUi+4hZjKG96MR6KTEubAeMpQEb+77qy+3r0Ua5xTFuie6JOLr4ZZgl5g+W5/uRTS2M1V8mVAFPuA==",
+---
+>       "version": "1.13.4",
+>       "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.13.4.tgz",
+>       "integrity": "sha512-GsFaMXCkMqkKIvwCQjCrwH+GHbPKBjhwo/8ZuUkWHqbI73Kky9I+pQltrlT0+MWpedCoosda53lgjYfyEPgxBg==",
+>       "license": "Apache-2.0",
+4958,4959c4959,4960
+<         "@grpc/proto-loader": "^0.7.0",
+<         "@types/node": ">=12.12.47"
+---
+>         "@grpc/proto-loader": "^0.7.13",
+>         "@js-sdsl/ordered-map": "^4.4.2"
+4962c4963
+<         "node": "^8.13.0 || >=10.10.0"
+---
+>         "node": ">=12.10.0"
+5915a5917,5928
+>     "node_modules/@noble/hashes": {
+>       "version": "1.8.0",
+>       "resolved": "https://registry.npmjs.org/@noble/hashes/-/hashes-1.8.0.tgz",
+>       "integrity": "sha512-jCs9ldd7NwzpgXDIf6P3+NrHh9/sD6CQdxHyjQI+h/6rDNo88ypBxxz45UDuZHz9r3tNz7N/VInSVoVdtXEI4A==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": "^14.21.3 || >=16"
+>       },
+>       "funding": {
+>         "url": "https://paulmillr.com/funding/"
+>       }
+>     },
+7528a7542,7550
+>     "node_modules/@paralleldrive/cuid2": {
+>       "version": "2.2.2",
+>       "resolved": "https://registry.npmjs.org/@paralleldrive/cuid2/-/cuid2-2.2.2.tgz",
+>       "integrity": "sha512-ZOBkgDwEdoYVlSeRbYYXs0S9MejQofiVYoTbKzy/6GQa39/q5tQU2IX46+shYnUkpEl3wc+J6wRlar7r2EK2xA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "@noble/hashes": "^1.1.5"
+>       }
+>     },
+13479,13481c13501,13503
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
+<       "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
+---
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+>       "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
+13484,13485c13506,13507
+<         "call-bind": "^1.0.5",
+<         "is-array-buffer": "^3.0.4"
+---
+>         "call-bound": "^1.0.3",
+>         "is-array-buffer": "^3.0.5"
+13601,13603c13623,13625
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
+<       "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
+---
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+>       "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
+13607c13629
+<         "call-bind": "^1.0.5",
+---
+>         "call-bind": "^1.0.8",
+13609,13613c13631,13634
+<         "es-abstract": "^1.22.3",
+<         "es-errors": "^1.2.1",
+<         "get-intrinsic": "^1.2.3",
+<         "is-array-buffer": "^3.0.4",
+<         "is-shared-array-buffer": "^1.0.2"
+---
+>         "es-abstract": "^1.23.5",
+>         "es-errors": "^1.3.0",
+>         "get-intrinsic": "^1.2.6",
+>         "is-array-buffer": "^3.0.4"
+13706a13728,13736
+>     "node_modules/async-function": {
+>       "version": "1.0.0",
+>       "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+>       "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+14255,14257c14285,14287
+<       "version": "4.0.1",
+<       "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.0.1.tgz",
+<       "integrity": "sha512-ilQs4fm/l9eMfWY2dY0WCIUplSUp7U0CT1vrqMg1MUdeZl4fypu5UP0XcDBK5WBQPJAKP1b7XEodISmekH/CEg==",
+---
+>       "version": "4.1.5",
+>       "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.1.5.tgz",
+>       "integrity": "sha512-1zccWBMypln0jEE05LzZt+V/8y8AQsQQqxtklqaIyg5nu6OAYFhZxPXinJTSG+kU5qyNmeLgcn9AW7eHiCHVLA==",
+14261c14291
+<         "bare-events": "^2.0.0",
+---
+>         "bare-events": "^2.5.4",
+14263c14293
+<         "bare-stream": "^2.0.0"
+---
+>         "bare-stream": "^2.6.4"
+14266c14296,14304
+<         "bare": ">=1.7.0"
+---
+>         "bare": ">=1.16.0"
+>       },
+>       "peerDependencies": {
+>         "bare-buffer": "*"
+>       },
+>       "peerDependenciesMeta": {
+>         "bare-buffer": {
+>           "optional": true
+>         }
+14270,14272c14308,14310
+<       "version": "3.6.0",
+<       "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.6.0.tgz",
+<       "integrity": "sha512-BUrFS5TqSBdA0LwHop4OjPJwisqxGy6JsWVqV6qaFoe965qqtaKfDzHY5T2YA1gUL0ZeeQeA+4BBc1FJTcHiPw==",
+---
+>       "version": "3.6.1",
+>       "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.6.1.tgz",
+>       "integrity": "sha512-uaIjxokhFidJP+bmmvKSgiMzj2sV5GPHaZVAIktcxcpCyBFFWO+YlikVAdhmUo2vYFvFhOXIAlldqV29L8126g==",
+15110,15112c15148,15151
+<       "version": "1.0.7",
+<       "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
+<       "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
+---
+>       "version": "1.0.8",
+>       "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+>       "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
+>       "license": "MIT",
+15113a15153
+>         "call-bind-apply-helpers": "^1.0.0",
+15115,15116d15154
+<         "es-errors": "^1.3.0",
+<         "function-bind": "^1.1.2",
+15118c15156,15185
+<         "set-function-length": "^1.2.1"
+---
+>         "set-function-length": "^1.2.2"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+>     "node_modules/call-bind-apply-helpers": {
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+>       "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "es-errors": "^1.3.0",
+>         "function-bind": "^1.1.2"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+>     "node_modules/call-bound": {
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+>       "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bind-apply-helpers": "^1.0.2",
+>         "get-intrinsic": "^1.3.0"
+15423c15490,15491
+<       "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg=="
+---
+>       "integrity": "sha512-jJ0bqzaylmJtVnNgzTeSOs8DPavpbYgEr/b0YL8/2GO3xJEhInFmhKMUnEJQjZumK7KXGFhUy89PrsJWlakBVg==",
+>       "license": "ISC"
+15751,15756c15819,15822
+<       "version": "4.1.1",
+<       "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
+<       "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
+<       "engines": {
+<         "node": ">= 6"
+<       }
+---
+>       "version": "2.11.0",
+>       "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
+>       "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ==",
+>       "license": "MIT"
+15871,15873c15937,15939
+<       "version": "1.6.2",
+<       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
+<       "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
+---
+>       "version": "2.0.0",
+>       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-2.0.0.tgz",
+>       "integrity": "sha512-MWufYdFw53ccGjCA+Ol7XJYpAlW6/prSMzuPOTRnJGcGzuhLn4Scrz7qf6o8bROZ514ltazcIFJZevcfbo0x7A==",
+15875c15941
+<         "node >= 0.8"
+---
+>         "node >= 6.0"
+15876a15943
+>       "license": "MIT",
+15880c15947
+<         "readable-stream": "^2.2.2",
+---
+>         "readable-stream": "^3.0.2",
+15884,15910d15950
+<     "node_modules/concat-stream/node_modules/isarray": {
+<       "version": "1.0.0",
+<       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
+<       "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ=="
+<     },
+<     "node_modules/concat-stream/node_modules/readable-stream": {
+<       "version": "2.3.8",
+<       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
+<       "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
+<       "dependencies": {
+<         "core-util-is": "~1.0.0",
+<         "inherits": "~2.0.3",
+<         "isarray": "~1.0.0",
+<         "process-nextick-args": "~2.0.0",
+<         "safe-buffer": "~5.1.1",
+<         "string_decoder": "~1.1.1",
+<         "util-deprecate": "~1.0.1"
+<       }
+<     },
+<     "node_modules/concat-stream/node_modules/string_decoder": {
+<       "version": "1.1.1",
+<       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+<       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
+<       "dependencies": {
+<         "safe-buffer": "~5.1.0"
+<       }
+<     },
+16125c16165,16166
+<       "integrity": "sha512-LDx6oHrK+PhzLKJU9j5S7/Y3jM/mUHvD/DeI1WQmJn652iPC5Y4TBzC9l+5OMOXlyTTA+SmVUPm0HQUwpD5Jqw=="
+---
+>       "integrity": "sha512-LDx6oHrK+PhzLKJU9j5S7/Y3jM/mUHvD/DeI1WQmJn652iPC5Y4TBzC9l+5OMOXlyTTA+SmVUPm0HQUwpD5Jqw==",
+>       "license": "MIT"
+16337a16379,16392
+>     "node_modules/cpu-features": {
+>       "version": "0.0.10",
+>       "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.10.tgz",
+>       "integrity": "sha512-9IkYqtX3YHPCzoVg1Py+o9057a3i0fp7S530UWokCSaFVTc7CwXPRiOjRjBQQ18ZCNafx78YfnG+HALxtVmOGA==",
+>       "hasInstallScript": true,
+>       "optional": true,
+>       "dependencies": {
+>         "buildcheck": "~0.0.6",
+>         "nan": "^2.19.0"
+>       },
+>       "engines": {
+>         "node": ">=10.0.0"
+>       }
+>     },
+17268,17270c17323,17325
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz",
+<       "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==",
+---
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+>       "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
+17273c17328
+<         "call-bind": "^1.0.6",
+---
+>         "call-bound": "^1.0.3",
+17275c17330
+<         "is-data-view": "^1.0.1"
+---
+>         "is-data-view": "^1.0.2"
+17285,17287c17340,17342
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz",
+<       "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==",
+---
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+>       "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
+17290c17345
+<         "call-bind": "^1.0.7",
+---
+>         "call-bound": "^1.0.3",
+17292c17347
+<         "is-data-view": "^1.0.1"
+---
+>         "is-data-view": "^1.0.2"
+17298c17353
+<         "url": "https://github.com/sponsors/ljharb"
+---
+>         "url": "https://github.com/sponsors/inspect-js"
+17302,17304c17357,17359
+<       "version": "1.0.0",
+<       "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz",
+<       "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==",
+---
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+>       "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
+17307c17362
+<         "call-bind": "^1.0.6",
+---
+>         "call-bound": "^1.0.2",
+17666a17722,17731
+>     "node_modules/dezalgo": {
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.4.tgz",
+>       "integrity": "sha512-rXSP0bf+5n0Qonsb+SVVfNfIsimO4HEtmnIpPHY8Q1UCzKlQrDMfdobr8nJOOsRgWCyMRqeSBQzmWUMq7zvVig==",
+>       "license": "ISC",
+>       "dependencies": {
+>         "asap": "^2.0.0",
+>         "wrappy": "1"
+>       }
+>     },
+17725a17791,17872
+>     "node_modules/docker-modem": {
+>       "version": "5.0.6",
+>       "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-5.0.6.tgz",
+>       "integrity": "sha512-ens7BiayssQz/uAxGzH8zGXCtiV24rRWXdjNha5V4zSOcxmAZsfGVm/PPFbwQdqEkDnhG+SyR9E3zSHUbOKXBQ==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "debug": "^4.1.1",
+>         "readable-stream": "^3.5.0",
+>         "split-ca": "^1.0.1",
+>         "ssh2": "^1.15.0"
+>       },
+>       "engines": {
+>         "node": ">= 8.0"
+>       }
+>     },
+>     "node_modules/dockerode": {
+>       "version": "4.0.7",
+>       "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-4.0.7.tgz",
+>       "integrity": "sha512-R+rgrSRTRdU5mH14PZTCPZtW/zw3HDWNTS/1ZAQpL/5Upe/ye5K9WQkIysu4wBoiMwKynsz0a8qWuGsHgEvSAA==",
+>       "license": "Apache-2.0",
+>       "dependencies": {
+>         "@balena/dockerignore": "^1.0.2",
+>         "@grpc/grpc-js": "^1.11.1",
+>         "@grpc/proto-loader": "^0.7.13",
+>         "docker-modem": "^5.0.6",
+>         "protobufjs": "^7.3.2",
+>         "tar-fs": "~2.1.2",
+>         "uuid": "^10.0.0"
+>       },
+>       "engines": {
+>         "node": ">= 8.0"
+>       }
+>     },
+>     "node_modules/dockerode/node_modules/protobufjs": {
+>       "version": "7.5.3",
+>       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.5.3.tgz",
+>       "integrity": "sha512-sildjKwVqOI2kmFDiXQ6aEB0fjYTafpEvIBs8tOR8qI4spuL9OPROLVu2qZqi/xgCfsHIwVqlaF8JBjWFHnKbw==",
+>       "hasInstallScript": true,
+>       "license": "BSD-3-Clause",
+>       "dependencies": {
+>         "@protobufjs/aspromise": "^1.1.2",
+>         "@protobufjs/base64": "^1.1.2",
+>         "@protobufjs/codegen": "^2.0.4",
+>         "@protobufjs/eventemitter": "^1.1.0",
+>         "@protobufjs/fetch": "^1.1.0",
+>         "@protobufjs/float": "^1.0.2",
+>         "@protobufjs/inquire": "^1.1.0",
+>         "@protobufjs/path": "^1.1.2",
+>         "@protobufjs/pool": "^1.1.0",
+>         "@protobufjs/utf8": "^1.1.0",
+>         "@types/node": ">=13.7.0",
+>         "long": "^5.0.0"
+>       },
+>       "engines": {
+>         "node": ">=12.0.0"
+>       }
+>     },
+>     "node_modules/dockerode/node_modules/tar-fs": {
+>       "version": "2.1.3",
+>       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.3.tgz",
+>       "integrity": "sha512-090nwYJDmlhwFwEW3QQl+vaNnxsO2yVsd45eTKRBzSzu+hlb1w2K9inVq5b0ngXuLVqQ4ApvsUHHnu/zQNkWAg==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "chownr": "^1.1.1",
+>         "mkdirp-classic": "^0.5.2",
+>         "pump": "^3.0.0",
+>         "tar-stream": "^2.1.4"
+>       }
+>     },
+>     "node_modules/dockerode/node_modules/uuid": {
+>       "version": "10.0.0",
+>       "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+>       "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+>       "funding": [
+>         "https://github.com/sponsors/broofa",
+>         "https://github.com/sponsors/ctavan"
+>       ],
+>       "license": "MIT",
+>       "bin": {
+>         "uuid": "dist/bin/uuid"
+>       }
+>     },
+17926a18074,18087
+>     "node_modules/dunder-proto": {
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+>       "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bind-apply-helpers": "^1.0.1",
+>         "es-errors": "^1.3.0",
+>         "gopd": "^1.2.0"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+18212,18214c18373,18375
+<       "version": "1.23.3",
+<       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz",
+<       "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==",
+---
+>       "version": "1.24.0",
+>       "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.0.tgz",
+>       "integrity": "sha512-WSzPgsdLtTcQwm4CROfS5ju2Wa1QQcVeT37jFjYzdFz1r9ahadC8B8/a4qxJxM+09F18iumCdRmlr96ZYkQvEg==",
+18217,18218c18378,18379
+<         "array-buffer-byte-length": "^1.0.1",
+<         "arraybuffer.prototype.slice": "^1.0.3",
+---
+>         "array-buffer-byte-length": "^1.0.2",
+>         "arraybuffer.prototype.slice": "^1.0.4",
+18220,18224c18381,18386
+<         "call-bind": "^1.0.7",
+<         "data-view-buffer": "^1.0.1",
+<         "data-view-byte-length": "^1.0.1",
+<         "data-view-byte-offset": "^1.0.0",
+<         "es-define-property": "^1.0.0",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.4",
+>         "data-view-buffer": "^1.0.2",
+>         "data-view-byte-length": "^1.0.2",
+>         "data-view-byte-offset": "^1.0.1",
+>         "es-define-property": "^1.0.1",
+18226,18233c18388,18396
+<         "es-object-atoms": "^1.0.0",
+<         "es-set-tostringtag": "^2.0.3",
+<         "es-to-primitive": "^1.2.1",
+<         "function.prototype.name": "^1.1.6",
+<         "get-intrinsic": "^1.2.4",
+<         "get-symbol-description": "^1.0.2",
+<         "globalthis": "^1.0.3",
+<         "gopd": "^1.0.1",
+---
+>         "es-object-atoms": "^1.1.1",
+>         "es-set-tostringtag": "^2.1.0",
+>         "es-to-primitive": "^1.3.0",
+>         "function.prototype.name": "^1.1.8",
+>         "get-intrinsic": "^1.3.0",
+>         "get-proto": "^1.0.1",
+>         "get-symbol-description": "^1.1.0",
+>         "globalthis": "^1.0.4",
+>         "gopd": "^1.2.0",
+18235,18236c18398,18399
+<         "has-proto": "^1.0.3",
+<         "has-symbols": "^1.0.3",
+---
+>         "has-proto": "^1.2.0",
+>         "has-symbols": "^1.1.0",
+18238,18239c18401,18402
+<         "internal-slot": "^1.0.7",
+<         "is-array-buffer": "^3.0.4",
+---
+>         "internal-slot": "^1.1.0",
+>         "is-array-buffer": "^3.0.5",
+18241c18404
+<         "is-data-view": "^1.0.1",
+---
+>         "is-data-view": "^1.0.2",
+18243,18248c18406,18413
+<         "is-regex": "^1.1.4",
+<         "is-shared-array-buffer": "^1.0.3",
+<         "is-string": "^1.0.7",
+<         "is-typed-array": "^1.1.13",
+<         "is-weakref": "^1.0.2",
+<         "object-inspect": "^1.13.1",
+---
+>         "is-regex": "^1.2.1",
+>         "is-set": "^2.0.3",
+>         "is-shared-array-buffer": "^1.0.4",
+>         "is-string": "^1.1.1",
+>         "is-typed-array": "^1.1.15",
+>         "is-weakref": "^1.1.1",
+>         "math-intrinsics": "^1.1.0",
+>         "object-inspect": "^1.13.4",
+18250,18255c18415,18424
+<         "object.assign": "^4.1.5",
+<         "regexp.prototype.flags": "^1.5.2",
+<         "safe-array-concat": "^1.1.2",
+<         "safe-regex-test": "^1.0.3",
+<         "string.prototype.trim": "^1.2.9",
+<         "string.prototype.trimend": "^1.0.8",
+---
+>         "object.assign": "^4.1.7",
+>         "own-keys": "^1.0.1",
+>         "regexp.prototype.flags": "^1.5.4",
+>         "safe-array-concat": "^1.1.3",
+>         "safe-push-apply": "^1.0.0",
+>         "safe-regex-test": "^1.1.0",
+>         "set-proto": "^1.0.0",
+>         "stop-iteration-iterator": "^1.1.0",
+>         "string.prototype.trim": "^1.2.10",
+>         "string.prototype.trimend": "^1.0.9",
+18257,18262c18426,18431
+<         "typed-array-buffer": "^1.0.2",
+<         "typed-array-byte-length": "^1.0.1",
+<         "typed-array-byte-offset": "^1.0.2",
+<         "typed-array-length": "^1.0.6",
+<         "unbox-primitive": "^1.0.2",
+<         "which-typed-array": "^1.1.15"
+---
+>         "typed-array-buffer": "^1.0.3",
+>         "typed-array-byte-length": "^1.0.3",
+>         "typed-array-byte-offset": "^1.0.4",
+>         "typed-array-length": "^1.0.7",
+>         "unbox-primitive": "^1.1.0",
+>         "which-typed-array": "^1.1.19"
+18272,18277c18441,18444
+<       "version": "1.0.0",
+<       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
+<       "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+<       "dependencies": {
+<         "get-intrinsic": "^1.2.4"
+<       },
+---
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+>       "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+>       "license": "MIT",
+18318,18320c18485,18487
+<       "version": "1.0.0",
+<       "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
+<       "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+>       "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+18330,18332c18497,18499
+<       "version": "2.0.3",
+<       "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
+<       "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
+---
+>       "version": "2.1.0",
+>       "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+>       "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+18335c18502,18503
+<         "get-intrinsic": "^1.2.4",
+---
+>         "es-errors": "^1.3.0",
+>         "get-intrinsic": "^1.2.6",
+18337c18505
+<         "hasown": "^2.0.1"
+---
+>         "hasown": "^2.0.2"
+18353,18355c18521,18524
+<       "version": "1.2.1",
+<       "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
+<       "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==",
+---
+>       "version": "1.3.0",
+>       "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+>       "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
+>       "license": "MIT",
+18357,18359c18526,18528
+<         "is-callable": "^1.1.4",
+<         "is-date-object": "^1.0.1",
+<         "is-symbol": "^1.0.2"
+---
+>         "is-callable": "^1.2.7",
+>         "is-date-object": "^1.0.5",
+>         "is-symbol": "^1.0.4"
+20463a20633,20638
+>     "node_modules/fast-safe-stringify": {
+>       "version": "2.1.1",
+>       "resolved": "https://registry.npmjs.org/fast-safe-stringify/-/fast-safe-stringify-2.1.1.tgz",
+>       "integrity": "sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==",
+>       "license": "MIT"
+>     },
+20933,20935c21108,21111
+<       "version": "0.3.3",
+<       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz",
+<       "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==",
+---
+>       "version": "0.3.5",
+>       "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+>       "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
+>       "license": "MIT",
+20937c21113,21119
+<         "is-callable": "^1.1.3"
+---
+>         "is-callable": "^1.2.7"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+21100a21283
+>       "license": "MIT",
+21272,21274c21455,21458
+<       "version": "1.1.6",
+<       "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz",
+<       "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==",
+---
+>       "version": "1.1.8",
+>       "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.8.tgz",
+>       "integrity": "sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==",
+>       "license": "MIT",
+21276,21279c21460,21465
+<         "call-bind": "^1.0.2",
+<         "define-properties": "^1.2.0",
+<         "es-abstract": "^1.22.1",
+<         "functions-have-names": "^1.2.3"
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.3",
+>         "define-properties": "^1.2.1",
+>         "functions-have-names": "^1.2.3",
+>         "hasown": "^2.0.2",
+>         "is-callable": "^1.2.7"
+21385,21387c21571,21574
+<       "version": "1.2.4",
+<       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
+<       "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
+---
+>       "version": "1.3.0",
+>       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+>       "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+>       "license": "MIT",
+21388a21576,21577
+>         "call-bind-apply-helpers": "^1.0.2",
+>         "es-define-property": "^1.0.1",
+21389a21579
+>         "es-object-atoms": "^1.1.1",
+21391,21393c21581,21585
+<         "has-proto": "^1.0.1",
+<         "has-symbols": "^1.0.3",
+<         "hasown": "^2.0.0"
+---
+>         "get-proto": "^1.0.1",
+>         "gopd": "^1.2.0",
+>         "has-symbols": "^1.1.0",
+>         "hasown": "^2.0.2",
+>         "math-intrinsics": "^1.1.0"
+21420a21613,21625
+>     "node_modules/get-proto": {
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+>       "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "dunder-proto": "^1.0.1",
+>         "es-object-atoms": "^1.0.0"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+21437,21439c21642,21644
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
+<       "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+>       "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
+21442c21647
+<         "call-bind": "^1.0.5",
+---
+>         "call-bound": "^1.0.3",
+21444c21649
+<         "get-intrinsic": "^1.2.4"
+---
+>         "get-intrinsic": "^1.2.6"
+21664,21666c21869,21872
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.3.tgz",
+<       "integrity": "sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==",
+---
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+>       "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
+>       "license": "MIT",
+21668c21874,21875
+<         "define-properties": "^1.1.3"
+---
+>         "define-properties": "^1.2.1",
+>         "gopd": "^1.0.1"
+22055,22059c22262,22267
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
+<       "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
+<       "dependencies": {
+<         "get-intrinsic": "^1.1.3"
+---
+>       "version": "1.2.0",
+>       "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+>       "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+22079a22288
+>       "license": "MIT",
+22300,22302c22509,22511
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
+<       "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
+---
+>       "version": "1.2.0",
+>       "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+>       "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
+22303a22513,22515
+>       "dependencies": {
+>         "dunder-proto": "^1.0.0"
+>       },
+22312,22314c22524,22527
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
+<       "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+>       "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+>       "license": "MIT",
+23257,23259c23470,23472
+<       "version": "1.0.7",
+<       "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
+<       "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+>       "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
+23263,23264c23476,23477
+<         "hasown": "^2.0.0",
+<         "side-channel": "^1.0.4"
+---
+>         "hasown": "^2.0.2",
+>         "side-channel": "^1.1.0"
+23402,23404c23615,23617
+<       "version": "3.0.4",
+<       "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
+<       "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
+---
+>       "version": "3.0.5",
+>       "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+>       "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
+23407,23408c23620,23622
+<         "call-bind": "^1.0.2",
+<         "get-intrinsic": "^1.2.1"
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.3",
+>         "get-intrinsic": "^1.2.6"
+23422a23637,23655
+>     "node_modules/is-async-function": {
+>       "version": "2.1.1",
+>       "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+>       "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "async-function": "^1.0.0",
+>         "call-bound": "^1.0.3",
+>         "get-proto": "^1.0.1",
+>         "has-tostringtag": "^1.0.2",
+>         "safe-regex-test": "^1.1.0"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+23424,23426c23657,23660
+<       "version": "1.0.4",
+<       "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz",
+<       "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+>       "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
+>       "license": "MIT",
+23428c23662,23665
+<         "has-bigints": "^1.0.1"
+---
+>         "has-bigints": "^1.0.2"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+23447,23449c23684,23687
+<       "version": "1.1.2",
+<       "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz",
+<       "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==",
+---
+>       "version": "1.2.2",
+>       "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+>       "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
+>       "license": "MIT",
+23451,23452c23689,23690
+<         "call-bind": "^1.0.2",
+<         "has-tostringtag": "^1.0.0"
+---
+>         "call-bound": "^1.0.3",
+>         "has-tostringtag": "^1.0.2"
+23517,23519c23755,23757
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz",
+<       "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==",
+---
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+>       "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
+23521a23760,23761
+>         "call-bound": "^1.0.2",
+>         "get-intrinsic": "^1.2.6",
+23532,23534c23772,23775
+<       "version": "1.0.5",
+<       "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz",
+<       "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+>       "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
+>       "license": "MIT",
+23536c23777,23778
+<         "has-tostringtag": "^1.0.0"
+---
+>         "call-bound": "^1.0.2",
+>         "has-tostringtag": "^1.0.2"
+23601a23844,23858
+>     "node_modules/is-finalizationregistry": {
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+>       "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bound": "^1.0.3"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+23688,23691c23945,23951
+<       "version": "2.0.2",
+<       "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.2.tgz",
+<       "integrity": "sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==",
+<       "dev": true,
+---
+>       "version": "2.0.3",
+>       "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+>       "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+23753,23755c24013,24016
+<       "version": "1.0.7",
+<       "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz",
+<       "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+>       "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
+>       "license": "MIT",
+23757c24018,24019
+<         "has-tostringtag": "^1.0.0"
+---
+>         "call-bound": "^1.0.3",
+>         "has-tostringtag": "^1.0.2"
+23817,23819c24079,24082
+<       "version": "1.1.4",
+<       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz",
+<       "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==",
+---
+>       "version": "1.2.1",
+>       "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
+>       "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
+>       "license": "MIT",
+23821,23822c24084,24087
+<         "call-bind": "^1.0.2",
+<         "has-tostringtag": "^1.0.0"
+---
+>         "call-bound": "^1.0.2",
+>         "gopd": "^1.2.0",
+>         "has-tostringtag": "^1.0.2",
+>         "hasown": "^2.0.2"
+23832,23835c24097,24103
+<       "version": "2.0.2",
+<       "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.2.tgz",
+<       "integrity": "sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==",
+<       "dev": true,
+---
+>       "version": "2.0.3",
+>       "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+>       "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+23848,23850c24116,24118
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
+<       "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
+---
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+>       "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
+23853c24121
+<         "call-bind": "^1.0.7"
+---
+>         "call-bound": "^1.0.3"
+23874,23876c24142,24145
+<       "version": "1.0.7",
+<       "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz",
+<       "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+>       "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
+>       "license": "MIT",
+23878c24147,24148
+<         "has-tostringtag": "^1.0.0"
+---
+>         "call-bound": "^1.0.3",
+>         "has-tostringtag": "^1.0.2"
+23888,23890c24158,24161
+<       "version": "1.0.4",
+<       "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz",
+<       "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+>       "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
+>       "license": "MIT",
+23892c24163,24165
+<         "has-symbols": "^1.0.2"
+---
+>         "call-bound": "^1.0.2",
+>         "has-symbols": "^1.1.0",
+>         "safe-regex-test": "^1.1.0"
+23902,23904c24175,24177
+<       "version": "1.1.13",
+<       "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
+<       "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
+---
+>       "version": "1.1.15",
+>       "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+>       "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
+23907c24180
+<         "which-typed-array": "^1.1.14"
+---
+>         "which-typed-array": "^1.1.16"
+23943,23946c24216,24222
+<       "version": "2.0.1",
+<       "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz",
+<       "integrity": "sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==",
+<       "dev": true,
+---
+>       "version": "2.0.2",
+>       "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+>       "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+23952,23954c24228,24231
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz",
+<       "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+>       "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
+>       "license": "MIT",
+23956c24233,24236
+<         "call-bind": "^1.0.2"
+---
+>         "call-bound": "^1.0.3"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+23963,23966c24243,24246
+<       "version": "2.0.2",
+<       "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.2.tgz",
+<       "integrity": "sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==",
+<       "dev": true,
+---
+>       "version": "2.0.4",
+>       "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+>       "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+>       "license": "MIT",
+23968,23969c24248,24252
+<         "call-bind": "^1.0.2",
+<         "get-intrinsic": "^1.1.1"
+---
+>         "call-bound": "^1.0.3",
+>         "get-intrinsic": "^1.2.6"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+24543a24827
+>       "license": "MIT",
+24564a24849
+>       "license": "MIT",
+24568a24854,24862
+>     "node_modules/json-refs/node_modules/commander": {
+>       "version": "4.1.1",
+>       "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
+>       "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 6"
+>       }
+>     },
+24572a24867
+>       "license": "MIT",
+24584a24880
+>       "license": "MIT",
+25175,25187d25470
+<     "node_modules/less/node_modules/mime": {
+<       "version": "1.6.0",
+<       "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+<       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+<       "dev": true,
+<       "optional": true,
+<       "bin": {
+<         "mime": "cli.js"
+<       },
+<       "engines": {
+<         "node": ">=4"
+<       }
+<     },
+25335c25618,25619
+<       "integrity": "sha1-6I7suS4ruEyQZWEv2VigcZzUf5Q="
+---
+>       "integrity": "sha512-tC2aLC7bbkDXKNrjDu9OLiVx9pFIvjinID2eD9PzNdAQGZScWUd/h8faqOw5d6oLsOvFRCRbz1ASoB+deyMVUw==",
+>       "license": "MIT"
+25340c25624,25625
+<       "integrity": "sha1-6UC5690nwyfgqNqxtVkWxTQelXU=",
+---
+>       "integrity": "sha512-VGHm6DH+1UiuafQdE/DNMqxOcSyhRu0xO9+jPDq7xITRn5YOorGrHVQmavMVXCYmTm80YRTZZCn/jTW7MokwLg==",
+>       "license": "MIT",
+25351c25636,25637
+<       "integrity": "sha1-MPgj5X4X43NdODvWK2Czh1Q7QYY=",
+---
+>       "integrity": "sha512-+zJVXs0VxC/Au+/7foiKzw8UaWvfSfPh20XhqK/6HFQiUeclL5fz05zY7G9yDAFItAKKZwB4cgpzGvxiwuG1wQ==",
+>       "license": "MIT",
+25366c25652,25653
+<       "integrity": "sha1-+Ob1tXip405UEXm1a47uv0oofgg=",
+---
+>       "integrity": "sha512-8JJ3FnMPm54t3BwPLk8q8mPyQKQXm/rt9df+awr4NGtyJrtcCXM3Of1I86S6jVy1b4yAyFBb8wbKPEauuqzRmQ==",
+>       "license": "MIT",
+25376c25663,25664
+<       "integrity": "sha1-fQsmdknLKeehOdAQO3wR+uhOSFE=",
+---
+>       "integrity": "sha512-SLczhg860fGW7AKlYcuOFstDtJuQhaANlJ4Y/jrOoRxhmVtK41vbJDH3OefVRSRkSCQo4HI82QVkAVsoGa5gSw==",
+>       "license": "MIT",
+25387c25675,25676
+<       "integrity": "sha1-TTHy595+E0+/KAN2K4FQsyUZZm8=",
+---
+>       "integrity": "sha512-x2ja1fa/qmzbizuXgVM4QAP9svtMbdxjG8Anl9bCeDAwLOVQ1vLrA0hLb/NkpbGi9evjtkl0aWLTEoOlUdBPQA==",
+>       "license": "MIT",
+25398c25687,25688
+<       "integrity": "sha1-UdaVeXPaTtVW43KQ2MGhjFPeFgc=",
+---
+>       "integrity": "sha512-5TCfLt1haQpsa7bgLYRKNNE4yqhO4ZxIayN1btQmazMchO6Q8JYFRMqbJ3W+uNmMm4R0Jw7KGkZX5YfDDnywuw==",
+>       "license": "MIT",
+25409c25699,25700
+<       "integrity": "sha1-+vH3+BD6mFolHCGHQESBCUg55e4=",
+---
+>       "integrity": "sha512-iIrScwY3atGvLVbQL/+CNUznaPwBJg78S/JO4cTUFXRkRsZgEBhscB27cVoT4tsIOUyFu/5M/0umfHNGJ6wYwg==",
+>       "license": "MIT",
+25417c25708,25709
+<       "integrity": "sha1-PqZAS3hKe+g2x7V1gOHN95sUgyw="
+---
+>       "integrity": "sha512-BOlKGKNHhCHswGOWtmVb5zBygyxN7EmTuzVOSQI6QSoGhG+kvv71gICFS1TBpnqvT1n53txK8CDK3u5D2/GZxQ==",
+>       "license": "MIT"
+25422c25714,25715
+<       "integrity": "sha1-nUgvRjuOZq++WcLBTtsRcGAXIzQ="
+---
+>       "integrity": "sha512-xKDem1BxoIfcCtaJHotjtyfdIvZO9qrF+mv3G1+ngQmaI3MJt3Qm46i9HLk/CbzABbavUrr1/EomQT8KxtsrYA==",
+>       "license": "MIT"
+25427c25720,25721
+<       "integrity": "sha1-fAt/admKH3ZSn4kLDNsbTf7BHBE="
+---
+>       "integrity": "sha512-XpqGh1e7hhkOzftBfWE7zt+Yn9mVHFkDhicVttvKLsoCMLVVL+xTQjfjB4X4vtznauxv0QZ5ZAeqjvat0dh62Q==",
+>       "license": "MIT"
+25432c25726,25727
+<       "integrity": "sha1-phOWMNdtFTawfdyAliiJsIL2pkE=",
+---
+>       "integrity": "sha512-wwCwWX8PK/mYR5VZjcU5JFl6py/qrfLGMxzpKOfSqgA1PaZ6Z625CZLCxH1KsqyxSkOFmNm+mEYjeDpXlM4hrg==",
+>       "license": "MIT",
+25441c25736,25737
+<       "integrity": "sha1-98IAzRuS7yNrOZ7s9zxkjReqlNI=",
+---
+>       "integrity": "sha512-Vx0XKzpg2DFbQw4wrp1xSWd2sfl3W/BG6bucSRZmftS1AzbWRemCmBQDxyQTNhlLNec428PXkuuja+VNBZgu2A==",
+>       "license": "MIT",
+25450c25746,25747
+<       "integrity": "sha1-bpzJZm/wgfC1psl4uD4kLmlJ0gM=",
+---
+>       "integrity": "sha512-lBrglYxLD/6KAJ8IEa5Lg+YHgNAL7FyKqXg4XOUI+Du/vtniLs1ZqS+yHNKPkK54waAgkdUnDOYaWf+rv4B+AA==",
+>       "license": "MIT",
+25458c25755,25756
+<       "integrity": "sha1-dFz0GlNZexj2iImFREBe+isG2Q8="
+---
+>       "integrity": "sha512-+odPJa4PE2UgYnQgJgkLs0UD03QU78R2ivhrFnG9GdtYOZdE6ObxOj7KiUEUlqOOgatFT+ZqSypFjDSduTigKg==",
+>       "license": "MIT"
+25463c25761,25762
+<       "integrity": "sha1-hMOVlt1xGBqXsGUpE6fJZ15Jsao=",
+---
+>       "integrity": "sha512-AqQ4AJz5buSx9ELXWt5dONwJyVPd4NTADMKhoVYWCugjoVf172/LpvVhwmSJn4g8/Dc0S8hxTe8rt5Dob3X9KQ==",
+>       "license": "MIT",
+25473c25772,25773
+<       "integrity": "sha1-XRn6AFyMTSNvr0dCx7eh/Kvikmc=",
+---
+>       "integrity": "sha512-hn2VWYZ+N9aYncRad4jORvlGgpFrn+axnPIWRvFxjk6CWcZH5b5alI8EymYsHITI23Z9wrW/+ORq+azrVFpOfw==",
+>       "license": "MIT",
+25487c25787,25788
+<       "integrity": "sha1-8pIDtAsS/uCkXTYxZIJZvrq8eGg=",
+---
+>       "integrity": "sha512-zj5vReFLkR+lJOBKP1wyteZ13zut/KSmXtdCBgxcy/m4UTitcBxpeVZT7gwk8BQrztPI5dIgO4bhBppXV4rpTQ==",
+>       "license": "MIT",
+25517c25818,25819
+<       "integrity": "sha1-/j/Do0yGyUyrb5UiVgKCdB4BYwk=",
+---
+>       "integrity": "sha512-AvOobAkE7qBtIiHU5QHQIfveWH5Usr9pIcFIzBv7u4S6bvb3FWpFrh9ltqBY7UeL5lw6e8d+SggiUXQVyh+FpA==",
+>       "license": "MIT",
+25526c25828,25829
+<       "integrity": "sha1-eLQer+FAX6lmRZ6kGT/VAtCEUks=",
+---
+>       "integrity": "sha512-VC+CKm/zSs5t3i/MHv71HZoQphuqOvez1xhjWBwHU5zAbsCYrqwHr+MyQyMk14HzA3hSRNA5lCqDMSw5G2Qscg==",
+>       "license": "MIT",
+25547c25850,25851
+<       "integrity": "sha1-ZpTP+mX++TH3wxzobHRZfPVg9PE="
+---
+>       "integrity": "sha512-VRYX+8XipeLjorag5bz3YBBRJ+5kj8hVBzfnaHgXPZAVTYowBdY5l0M5ZnOmlAMCOXBFabQtm7f5VqjMKEji0w==",
+>       "license": "MIT"
+25562c25866,25867
+<       "integrity": "sha1-tSoybB9i9tfac6MdVAHfbvRPD6E=",
+---
+>       "integrity": "sha512-yRDd0z+APziDqbk0MqR6Qfwj/Qn3jLxFJbI9U8MuvdTnqIXdZ5YXyGLnwuzCpZmjr26F1GNOjKLMMZ10i/wy6A==",
+>       "license": "MIT",
+25575c25880,25882
+<       "integrity": "sha1-QVxEePK8wwEgwizhDtMib30+GOA="
+---
+>       "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+>       "deprecated": "This package is deprecated. Use require('node:util').isDeepStrictEqual instead.",
+>       "license": "MIT"
+25580c25887,25888
+<       "integrity": "sha1-LP1XXHPkmKtX4xm3f6Aq3vE6lNE="
+---
+>       "integrity": "sha512-6XcAB3izeQxPOQQNAJbbdjXbvWEt2Pn9ezPrjr4CwoLwmqsLVbsiEXD19cmmt4mbzOCOCdHzOQiUivUOJLra7w==",
+>       "license": "MIT"
+25595c25903,25904
+<       "integrity": "sha1-Wi5H/mmVPx7mMafrof5k0tBlWPU=",
+---
+>       "integrity": "sha512-sTebg2a1PoicYEZXD5PBdQcTlIJ6hUslrlWr7iV0O7n+i4596s2NQ9I5CaZ5FbXSfya/9WQsrYLANUJv9paYVA==",
+>       "license": "MIT",
+25613c25922,25923
+<       "integrity": "sha1-SN6kbfj/djKxDXBrissmWR4rNyc=",
+---
+>       "integrity": "sha512-ZpJhwvUXHSNL5wYd1RM6CUa2ZuqorG9ngoJ9Ix5Cce+uX7I5O/E06FCJdhSZ33b5dVyeQDnIlWH7B2s5uByZ7g==",
+>       "license": "MIT",
+25634c25944,25945
+<       "integrity": "sha1-T7VPgWZS5a4Q6PcvcXo4jHMmU4o="
+---
+>       "integrity": "sha512-uNcV98/blRhInPUGQEnj9ekXXfG+q+rfoNSFZgl/eBfog9yBDW9gfUv2AHX/rAF7zZRlzWhbslGhbGQFZlCkZA==",
+>       "license": "MIT"
+25650c25961,25962
+<       "integrity": "sha1-Mg4LZwMWc8KNeiu12eAzGkUkBRU=",
+---
+>       "integrity": "sha512-6SwqWwGFHhTXEiqB/yQgu8FYd//tm786d49y7kizHVCJH7zdzs191UQn3ES3tkkDbUddNRfkCRYqJFHtbLnbCw==",
+>       "license": "MIT",
+25997a26310,26318
+>     "node_modules/math-intrinsics": {
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+>       "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+26577a26899,26910
+>     "node_modules/mime": {
+>       "version": "1.6.0",
+>       "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+>       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+>       "license": "MIT",
+>       "bin": {
+>         "mime": "cli.js"
+>       },
+>       "engines": {
+>         "node": ">=4"
+>       }
+>     },
+26579,26581c26912,26915
+<       "version": "1.51.0",
+<       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.51.0.tgz",
+<       "integrity": "sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g==",
+---
+>       "version": "1.52.0",
+>       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+>       "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+>       "license": "MIT",
+26597,26599c26931,26934
+<       "version": "2.1.34",
+<       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.34.tgz",
+<       "integrity": "sha512-6cP692WwGIs9XXdOO4++N+7qjqv0rqxxVvJ3VHPh/Sc9mVZcQP+ZGhkKiTvWMQRr2tbHkJP/Yn7Y0npb3ZBs4A==",
+---
+>       "version": "2.1.35",
+>       "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+>       "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+>       "license": "MIT",
+26601c26936
+<         "mime-db": "1.51.0"
+---
+>         "mime-db": "1.52.0"
+26792c27127,27128
+<       "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A=="
+---
+>       "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==",
+>       "license": "MIT"
+27248,27250c27584,27586
+<       "version": "2.0.0",
+<       "resolved": "https://registry.npmjs.org/multer/-/multer-2.0.0.tgz",
+<       "integrity": "sha512-bS8rPZurbAuHGAnApbM9d4h1wSoYqrOqkE+6a64KLMK9yWU7gJXBDDVklKQ3TPi9DRb85cRs6yXaC0+cjxRtRg==",
+---
+>       "version": "2.0.1",
+>       "resolved": "https://registry.npmjs.org/multer/-/multer-2.0.1.tgz",
+>       "integrity": "sha512-Ug8bXeTIUlxurg8xLTEskKShvcKDZALo1THEX5E41pYCD2sCVub5/kIRIGqWNoqV6szyLyQKV6mD4QUrWE5GCQ==",
+27254,27256c27590,27592
+<         "busboy": "^1.0.0",
+<         "concat-stream": "^1.5.2",
+<         "mkdirp": "^0.5.4",
+---
+>         "busboy": "^1.6.0",
+>         "concat-stream": "^2.0.0",
+>         "mkdirp": "^0.5.6",
+27258,27259c27594,27595
+<         "type-is": "^1.6.4",
+<         "xtend": "^4.0.0"
+---
+>         "type-is": "^1.6.18",
+>         "xtend": "^4.0.2"
+27384c27720,27721
+<       "integrity": "sha1-IKMYwwy0X3H+et+/eyHJnBRy7xE="
+---
+>       "integrity": "sha512-zkVhZUA3y8mbz652WrL5x0fB0ehrBkulWT3TomAQ9iDtyXZvzKeEA6GPxAItBYeNYl5yngKRX612qHOhvMkDeg==",
+>       "license": "MIT"
+27842,27844c28179,28185
+<       "version": "1.13.1",
+<       "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz",
+<       "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==",
+---
+>       "version": "1.13.4",
+>       "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+>       "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+27886,27888c28227,28229
+<       "version": "4.1.5",
+<       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz",
+<       "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==",
+---
+>       "version": "4.1.7",
+>       "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+>       "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
+27891c28232,28233
+<         "call-bind": "^1.0.5",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.3",
+27893c28235,28236
+<         "has-symbols": "^1.0.3",
+---
+>         "es-object-atoms": "^1.0.0",
+>         "has-symbols": "^1.1.0",
+28129a28473,28489
+>     "node_modules/own-keys": {
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+>       "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "get-intrinsic": "^1.2.6",
+>         "object-keys": "^1.1.1",
+>         "safe-push-apply": "^1.0.0"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+28684,28686c29044,29047
+<       "version": "1.0.10",
+<       "resolved": "https://registry.npmjs.org/path-loader/-/path-loader-1.0.10.tgz",
+<       "integrity": "sha512-CMP0v6S6z8PHeJ6NFVyVJm6WyJjIwFvyz2b0n2/4bKdS/0uZa/9sKUlYZzubrn3zuDRU0zIuEDX9DZYQ2ZI8TA==",
+---
+>       "version": "1.0.12",
+>       "resolved": "https://registry.npmjs.org/path-loader/-/path-loader-1.0.12.tgz",
+>       "integrity": "sha512-n7oDG8B+k/p818uweWrOixY9/Dsr89o2TkCm6tOTex3fpdo2+BFDgR+KpB37mGKBRsBAlR8CIJMFN0OEy/7hIQ==",
+>       "license": "MIT",
+28689c29050,29129
+<         "superagent": "^3.8.3"
+---
+>         "superagent": "^7.1.6"
+>       }
+>     },
+>     "node_modules/path-loader/node_modules/debug": {
+>       "version": "4.4.1",
+>       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
+>       "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "ms": "^2.1.3"
+>       },
+>       "engines": {
+>         "node": ">=6.0"
+>       },
+>       "peerDependenciesMeta": {
+>         "supports-color": {
+>           "optional": true
+>         }
+>       }
+>     },
+>     "node_modules/path-loader/node_modules/formidable": {
+>       "version": "2.1.5",
+>       "resolved": "https://registry.npmjs.org/formidable/-/formidable-2.1.5.tgz",
+>       "integrity": "sha512-Oz5Hwvwak/DCaXVVUtPn4oLMLLy1CdclLKO1LFgU7XzDpVMUU5UjlSLpGMocyQNNk8F6IJW9M/YdooSn2MRI+Q==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "@paralleldrive/cuid2": "^2.2.2",
+>         "dezalgo": "^1.0.4",
+>         "once": "^1.4.0",
+>         "qs": "^6.11.0"
+>       },
+>       "funding": {
+>         "url": "https://ko-fi.com/tunnckoCore/commissions"
+>       }
+>     },
+>     "node_modules/path-loader/node_modules/mime": {
+>       "version": "2.6.0",
+>       "resolved": "https://registry.npmjs.org/mime/-/mime-2.6.0.tgz",
+>       "integrity": "sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==",
+>       "license": "MIT",
+>       "bin": {
+>         "mime": "cli.js"
+>       },
+>       "engines": {
+>         "node": ">=4.0.0"
+>       }
+>     },
+>     "node_modules/path-loader/node_modules/semver": {
+>       "version": "7.7.2",
+>       "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
+>       "integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
+>       "license": "ISC",
+>       "bin": {
+>         "semver": "bin/semver.js"
+>       },
+>       "engines": {
+>         "node": ">=10"
+>       }
+>     },
+>     "node_modules/path-loader/node_modules/superagent": {
+>       "version": "7.1.6",
+>       "resolved": "https://registry.npmjs.org/superagent/-/superagent-7.1.6.tgz",
+>       "integrity": "sha512-gZkVCQR1gy/oUXr+kxJMLDjla434KmSOKbx5iGD30Ql+AkJQ/YlPKECJy2nhqOsHLjGHzoDTXNSjhnvWhzKk7g==",
+>       "deprecated": "Please upgrade to v9.0.0+ as we have fixed a public vulnerability with formidable dependency. Note that v9.0.0+ requires Node.js v14.18.0+. See https://github.com/ladjs/superagent/pull/1800 for insight. This project is supported and maintained by the team at Forward Email @ https://forwardemail.net",
+>       "license": "MIT",
+>       "dependencies": {
+>         "component-emitter": "^1.3.0",
+>         "cookiejar": "^2.1.3",
+>         "debug": "^4.3.4",
+>         "fast-safe-stringify": "^2.1.1",
+>         "form-data": "^4.0.0",
+>         "formidable": "^2.0.1",
+>         "methods": "^1.1.2",
+>         "mime": "2.6.0",
+>         "qs": "^6.10.3",
+>         "readable-stream": "^3.6.0",
+>         "semver": "^7.3.7"
+>       },
+>       "engines": {
+>         "node": ">=6.4.0 <13 || >=14"
+31146a31587,31608
+>     "node_modules/reflect.getprototypeof": {
+>       "version": "1.0.10",
+>       "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+>       "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bind": "^1.0.8",
+>         "define-properties": "^1.2.1",
+>         "es-abstract": "^1.23.9",
+>         "es-errors": "^1.3.0",
+>         "es-object-atoms": "^1.0.0",
+>         "get-intrinsic": "^1.2.7",
+>         "get-proto": "^1.0.1",
+>         "which-builtin-type": "^1.2.1"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+31211,31213c31673,31675
+<       "version": "1.5.2",
+<       "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
+<       "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
+---
+>       "version": "1.5.4",
+>       "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+>       "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
+31216c31678
+<         "call-bind": "^1.0.6",
+---
+>         "call-bind": "^1.0.8",
+31219c31681,31683
+<         "set-function-name": "^2.0.1"
+---
+>         "get-proto": "^1.0.1",
+>         "gopd": "^1.2.0",
+>         "set-function-name": "^2.0.2"
+31679,31681c32143,32145
+<       "version": "1.1.2",
+<       "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
+<       "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
+---
+>       "version": "1.1.3",
+>       "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
+>       "integrity": "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==",
+31684,31686c32148,32151
+<         "call-bind": "^1.0.7",
+<         "get-intrinsic": "^1.2.4",
+<         "has-symbols": "^1.0.3",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.2",
+>         "get-intrinsic": "^1.2.6",
+>         "has-symbols": "^1.1.0",
+31706a32172,32187
+>     "node_modules/safe-push-apply": {
+>       "version": "1.0.0",
+>       "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+>       "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "es-errors": "^1.3.0",
+>         "isarray": "^2.0.5"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+31717,31719c32198,32200
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
+<       "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
+>       "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
+31722c32203
+<         "call-bind": "^1.0.6",
+---
+>         "call-bound": "^1.0.2",
+31724c32205
+<         "is-regex": "^1.1.4"
+---
+>         "is-regex": "^1.2.1"
+32123,32133d32603
+<     "node_modules/send/node_modules/mime": {
+<       "version": "1.6.0",
+<       "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+<       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+<       "bin": {
+<         "mime": "cli.js"
+<       },
+<       "engines": {
+<         "node": ">=4"
+<       }
+<     },
+32288,32290c32758,32761
+<       "version": "2.0.1",
+<       "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
+<       "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
+---
+>       "version": "2.0.2",
+>       "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+>       "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
+>       "license": "MIT",
+32292c32763,32764
+<         "define-data-property": "^1.0.1",
+---
+>         "define-data-property": "^1.1.4",
+>         "es-errors": "^1.3.0",
+32294c32766,32780
+<         "has-property-descriptors": "^1.0.0"
+---
+>         "has-property-descriptors": "^1.0.2"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       }
+>     },
+>     "node_modules/set-proto": {
+>       "version": "1.0.0",
+>       "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+>       "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "dunder-proto": "^1.0.1",
+>         "es-errors": "^1.3.0",
+>         "es-object-atoms": "^1.0.0"
+32391,32393c32877,32880
+<       "version": "1.0.6",
+<       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
+<       "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+>       "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+>       "license": "MIT",
+32395d32881
+<         "call-bind": "^1.0.7",
+32397,32398c32883,32939
+<         "get-intrinsic": "^1.2.4",
+<         "object-inspect": "^1.13.1"
+---
+>         "object-inspect": "^1.13.3",
+>         "side-channel-list": "^1.0.0",
+>         "side-channel-map": "^1.0.1",
+>         "side-channel-weakmap": "^1.0.2"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+>     "node_modules/side-channel-list": {
+>       "version": "1.0.0",
+>       "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.0.tgz",
+>       "integrity": "sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "es-errors": "^1.3.0",
+>         "object-inspect": "^1.13.3"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+>     "node_modules/side-channel-map": {
+>       "version": "1.0.1",
+>       "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+>       "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bound": "^1.0.2",
+>         "es-errors": "^1.3.0",
+>         "get-intrinsic": "^1.2.5",
+>         "object-inspect": "^1.13.3"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+>     "node_modules/side-channel-weakmap": {
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+>       "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bound": "^1.0.2",
+>         "es-errors": "^1.3.0",
+>         "get-intrinsic": "^1.2.5",
+>         "object-inspect": "^1.13.3",
+>         "side-channel-map": "^1.0.1"
+32871c33412,33413
+<       "integrity": "sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw=="
+---
+>       "integrity": "sha512-wcFzz9cDfbuqe0FZzfi2or1sgyIrsDwmPwfZC4hiNidPdPINjeUwNfv5kldczoEAcjl9Y1L3SM7Uz2PUEQzxQw==",
+>       "license": "(WTFPL OR MIT)"
+32960c33502,33503
+<       "integrity": "sha1-bIOv82kvphJW4M0ZfgXp3hV2kaY="
+---
+>       "integrity": "sha512-Q5thBSxp5t8WPTTJQS59LrGqOZqOsrhDGDVm8azCqIBjSBd7nd9o2PM+mDulQQkh8h//4U6hFZnc/mul8t5pWQ==",
+>       "license": "ISC"
+32994a33538,33554
+>     "node_modules/ssh2": {
+>       "version": "1.16.0",
+>       "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.16.0.tgz",
+>       "integrity": "sha512-r1X4KsBGedJqo7h8F5c4Ybpcr5RjyP+aWIG007uBPRjmdQWfEiVLzSK71Zji1B9sKxwaCvD8y8cwSkYrlLiRRg==",
+>       "hasInstallScript": true,
+>       "dependencies": {
+>         "asn1": "^0.2.6",
+>         "bcrypt-pbkdf": "^1.0.2"
+>       },
+>       "engines": {
+>         "node": ">=10.16.0"
+>       },
+>       "optionalDependencies": {
+>         "cpu-features": "~0.0.10",
+>         "nan": "^2.20.0"
+>       }
+>     },
+33095,33098c33655,33658
+<       "version": "1.0.0",
+<       "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.0.0.tgz",
+<       "integrity": "sha512-iCGQj+0l0HOdZ2AEeBADlsRC+vsnDsZsbdSiH1yNSjcfKM7fdpCMfqAL/dwF5BLiw/XhRft/Wax6zQbhq2BcjQ==",
+<       "dev": true,
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+>       "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+>       "license": "MIT",
+33100c33660,33661
+<         "internal-slot": "^1.0.4"
+---
+>         "es-errors": "^1.3.0",
+>         "internal-slot": "^1.1.0"
+33265,33267c33826,33828
+<       "version": "1.2.9",
+<       "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
+<       "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==",
+---
+>       "version": "1.2.10",
+>       "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz",
+>       "integrity": "sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==",
+33270c33831,33833
+<         "call-bind": "^1.0.7",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.2",
+>         "define-data-property": "^1.1.4",
+33272,33273c33835,33837
+<         "es-abstract": "^1.23.0",
+<         "es-object-atoms": "^1.0.0"
+---
+>         "es-abstract": "^1.23.5",
+>         "es-object-atoms": "^1.0.0",
+>         "has-property-descriptors": "^1.0.2"
+33283,33285c33847,33849
+<       "version": "1.0.8",
+<       "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz",
+<       "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==",
+---
+>       "version": "1.0.9",
+>       "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz",
+>       "integrity": "sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==",
+33288c33852,33853
+<         "call-bind": "^1.0.7",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.2",
+33291a33857,33859
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+33781c34349,34350
+<       "deprecated": "Please upgrade to v7.0.2+ of superagent.  We have fixed numerous issues with streams, form-data, attach(), filesystem errors not bubbling up (ENOENT on attach()), and all tests are now passing.  See the releases tab for more information at <https://github.com/visionmedia/superagent/releases>. Thanks to @shadowgate15, @spence-s, and @niftylettuce. Superagent is sponsored by Forward Email at <https://forwardemail.net>.",
+---
+>       "deprecated": "Please upgrade to v9.0.0+ as we have fixed a public vulnerability with formidable dependency. Note that v9.0.0+ requires Node.js v14.18.0+. See https://github.com/ladjs/superagent/pull/1800 for insight. This project is supported and maintained by the team at Forward Email @ https://forwardemail.net",
+>       "license": "MIT",
+33801a34371
+>       "license": "MIT",
+33807,33809c34377,34380
+<       "version": "2.5.1",
+<       "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.1.tgz",
+<       "integrity": "sha512-m21N3WOmEEURgk6B9GLOE4RuWOFf28Lhh9qGYeNlGq4VDXUlJy2th2slBNU8Gp8EzloYZOibZJ7t5ecIrFSjVA==",
+---
+>       "version": "2.5.3",
+>       "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.5.3.tgz",
+>       "integrity": "sha512-XHIrMD0NpDrNM/Ckf7XJiBbLl57KEhT3+i3yY+eWm+cqYZJQTZrKo8Y8AWKnuV5GT4scfuUGt9LzNoIx3dU1nQ==",
+>       "license": "MIT",
+33812,33813c34383,34386
+<         "combined-stream": "^1.0.6",
+<         "mime-types": "^2.1.12"
+---
+>         "combined-stream": "^1.0.8",
+>         "es-set-tostringtag": "^2.1.0",
+>         "mime-types": "^2.1.35",
+>         "safe-buffer": "^5.2.1"
+33818a34392,34411
+>     "node_modules/superagent/node_modules/form-data/node_modules/safe-buffer": {
+>       "version": "5.2.1",
+>       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+>       "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+>       "funding": [
+>         {
+>           "type": "github",
+>           "url": "https://github.com/sponsors/feross"
+>         },
+>         {
+>           "type": "patreon",
+>           "url": "https://www.patreon.com/feross"
+>         },
+>         {
+>           "type": "consulting",
+>           "url": "https://feross.org/support"
+>         }
+>       ],
+>       "license": "MIT"
+>     },
+33822,33833c34415,34416
+<       "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
+<     },
+<     "node_modules/superagent/node_modules/mime": {
+<       "version": "1.6.0",
+<       "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+<       "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+<       "bin": {
+<         "mime": "cli.js"
+<       },
+<       "engines": {
+<         "node": ">=4"
+<       }
+---
+>       "integrity": "sha512-VLghIWNM6ELQzo7zwmcg0NmTVyWKYjvIeM83yjp0wRDTmUnrM678fQbcKBo6n2CJEF0szoG//ytg+TKla89ALQ==",
+>       "license": "MIT"
+33836,33838c34419,34422
+<       "version": "2.3.7",
+<       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
+<       "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
+---
+>       "version": "2.3.8",
+>       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.8.tgz",
+>       "integrity": "sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==",
+>       "license": "MIT",
+33852a34437
+>       "license": "MIT",
+34099c34684,34685
+<       "integrity": "sha1-oJdRnG8e5N1n4wjZtT3cnCslf5c=",
+---
+>       "integrity": "sha512-O2hZbWqq8x6j0uZ4qWj5dw45WPoAxKsJLJZqOgTqRtPNi8IqA+rDkDV/48S8qanS3KGv1QcVoPNLivMbyHHdAQ==",
+>       "license": "MIT",
+34150,34155d34735
+<     "node_modules/swagger-tools/node_modules/commander": {
+<       "version": "2.11.0",
+<       "resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
+<       "integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ==",
+<       "license": "MIT"
+<     },
+34257,34259c34837,34839
+<       "version": "3.0.8",
+<       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.8.tgz",
+<       "integrity": "sha512-ZoROL70jptorGAlgAYiLoBLItEKw/fUxg9BSYK/dF/GAGYFJOJJJMvjPAKDJraCXFwadD456FCuvLWgfhMsPwg==",
+---
+>       "version": "3.0.9",
+>       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.9.tgz",
+>       "integrity": "sha512-XF4w9Xp+ZQgifKakjZYmFdkLoSWd34VGKcsTCwlNWM7QG3ZbaxnTsaBwnjFZqHRf/rROxaR8rXnbtwdvaDI+lA==",
+34943,34945c35523,35525
+<       "version": "0.6.9",
+<       "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.6.9.tgz",
+<       "integrity": "sha512-7bBrcF+/LQzSgFmT0X5YclVqQxtv7TDJ1f8Wj7ibBu/U6BMLeOpUxuZjV7rMc44UtKxlnMFigdhFAIszSX1DMg==",
+---
+>       "version": "0.6.11",
+>       "resolved": "https://registry.npmjs.org/traverse/-/traverse-0.6.11.tgz",
+>       "integrity": "sha512-vxXDZg8/+p3gblxB6BhhG5yWVn1kGRlaL8O78UDXc3wRnPizB5g83dcvWV1jpDMIPnjZjOFuxlMmE82XJ4407w==",
+34948,34950c35528,35530
+<         "gopd": "^1.0.1",
+<         "typedarray.prototype.slice": "^1.0.3",
+<         "which-typed-array": "^1.1.15"
+---
+>         "gopd": "^1.2.0",
+>         "typedarray.prototype.slice": "^1.0.5",
+>         "which-typed-array": "^1.1.18"
+35110,35112c35690,35692
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
+<       "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
+---
+>       "version": "1.0.3",
+>       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+>       "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
+35115c35695
+<         "call-bind": "^1.0.7",
+---
+>         "call-bound": "^1.0.3",
+35117c35697
+<         "is-typed-array": "^1.1.13"
+---
+>         "is-typed-array": "^1.1.14"
+35124,35126c35704,35706
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
+<       "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
+---
+>       "version": "1.0.3",
+>       "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+>       "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
+35129c35709
+<         "call-bind": "^1.0.7",
+---
+>         "call-bind": "^1.0.8",
+35131,35133c35711,35713
+<         "gopd": "^1.0.1",
+<         "has-proto": "^1.0.3",
+<         "is-typed-array": "^1.1.13"
+---
+>         "gopd": "^1.2.0",
+>         "has-proto": "^1.2.0",
+>         "is-typed-array": "^1.1.14"
+35143,35145c35723,35725
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
+<       "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
+---
+>       "version": "1.0.4",
+>       "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+>       "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
+35149c35729
+<         "call-bind": "^1.0.7",
+---
+>         "call-bind": "^1.0.8",
+35151,35153c35731,35734
+<         "gopd": "^1.0.1",
+<         "has-proto": "^1.0.3",
+<         "is-typed-array": "^1.1.13"
+---
+>         "gopd": "^1.2.0",
+>         "has-proto": "^1.2.0",
+>         "is-typed-array": "^1.1.15",
+>         "reflect.getprototypeof": "^1.0.9"
+35163,35165c35744,35746
+<       "version": "1.0.6",
+<       "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz",
+<       "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==",
+---
+>       "version": "1.0.7",
+>       "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.7.tgz",
+>       "integrity": "sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==",
+35171d35751
+<         "has-proto": "^1.0.3",
+35173c35753,35754
+<         "possible-typed-array-names": "^1.0.0"
+---
+>         "possible-typed-array-names": "^1.0.0",
+>         "reflect.getprototypeof": "^1.0.6"
+35188,35190c35769,35771
+<       "version": "1.0.3",
+<       "resolved": "https://registry.npmjs.org/typedarray.prototype.slice/-/typedarray.prototype.slice-1.0.3.tgz",
+<       "integrity": "sha512-8WbVAQAUlENo1q3c3zZYuy5k9VzBQvp8AX9WOtbvyWlLM1v5JaSRmjubLjzHF4JFtptjH/5c/i95yaElvcjC0A==",
+---
+>       "version": "1.0.5",
+>       "resolved": "https://registry.npmjs.org/typedarray.prototype.slice/-/typedarray.prototype.slice-1.0.5.tgz",
+>       "integrity": "sha512-q7QNVDGTdl702bVFiI5eY4l/HkgCM6at9KhcFbgUAzezHFbOVy4+0O/lCjsABEQwbZPravVfBIiBVGo89yzHFg==",
+35193c35774
+<         "call-bind": "^1.0.7",
+---
+>         "call-bind": "^1.0.8",
+35195c35776
+<         "es-abstract": "^1.23.0",
+---
+>         "es-abstract": "^1.23.9",
+35197,35198c35778,35781
+<         "typed-array-buffer": "^1.0.2",
+<         "typed-array-byte-offset": "^1.0.2"
+---
+>         "get-proto": "^1.0.1",
+>         "math-intrinsics": "^1.1.0",
+>         "typed-array-buffer": "^1.0.3",
+>         "typed-array-byte-offset": "^1.0.4"
+35274,35276c35857,35860
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz",
+<       "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==",
+---
+>       "version": "1.1.0",
+>       "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+>       "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
+>       "license": "MIT",
+35278c35862
+<         "call-bind": "^1.0.2",
+---
+>         "call-bound": "^1.0.3",
+35280,35281c35864,35868
+<         "has-symbols": "^1.0.3",
+<         "which-boxed-primitive": "^1.0.2"
+---
+>         "has-symbols": "^1.1.0",
+>         "which-boxed-primitive": "^1.1.1"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+35709a36297,36305
+>     "node_modules/validator": {
+>       "version": "10.11.0",
+>       "resolved": "https://registry.npmjs.org/validator/-/validator-10.11.0.tgz",
+>       "integrity": "sha512-X/p3UZerAIsbBfN/IwahhYaBbY68EN/UQBWHtsbXGT5bfrH/p4NQzUCG1kF/rtKaNpnJ7jAu6NGTdSNtyNIXMw==",
+>       "license": "MIT",
+>       "engines": {
+>         "node": ">= 0.10"
+>       }
+>     },
+36697,36699c37293,37296
+<       "version": "1.0.2",
+<       "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz",
+<       "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==",
+---
+>       "version": "1.1.1",
+>       "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+>       "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
+>       "license": "MIT",
+36701,36705c37298,37332
+<         "is-bigint": "^1.0.1",
+<         "is-boolean-object": "^1.1.0",
+<         "is-number-object": "^1.0.4",
+<         "is-string": "^1.0.5",
+<         "is-symbol": "^1.0.3"
+---
+>         "is-bigint": "^1.1.0",
+>         "is-boolean-object": "^1.2.1",
+>         "is-number-object": "^1.1.1",
+>         "is-string": "^1.1.1",
+>         "is-symbol": "^1.1.1"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+>       },
+>       "funding": {
+>         "url": "https://github.com/sponsors/ljharb"
+>       }
+>     },
+>     "node_modules/which-builtin-type": {
+>       "version": "1.2.1",
+>       "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+>       "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
+>       "license": "MIT",
+>       "dependencies": {
+>         "call-bound": "^1.0.2",
+>         "function.prototype.name": "^1.1.6",
+>         "has-tostringtag": "^1.0.2",
+>         "is-async-function": "^2.0.0",
+>         "is-date-object": "^1.1.0",
+>         "is-finalizationregistry": "^1.1.0",
+>         "is-generator-function": "^1.0.10",
+>         "is-regex": "^1.2.1",
+>         "is-weakref": "^1.0.2",
+>         "isarray": "^2.0.5",
+>         "which-boxed-primitive": "^1.1.0",
+>         "which-collection": "^1.0.2",
+>         "which-typed-array": "^1.1.16"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+36712,36715c37339,37342
+<       "version": "1.0.1",
+<       "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz",
+<       "integrity": "sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==",
+<       "dev": true,
+---
+>       "version": "1.0.2",
+>       "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+>       "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
+>       "license": "MIT",
+36717,36720c37344,37350
+<         "is-map": "^2.0.1",
+<         "is-set": "^2.0.1",
+<         "is-weakmap": "^2.0.1",
+<         "is-weakset": "^2.0.1"
+---
+>         "is-map": "^2.0.3",
+>         "is-set": "^2.0.3",
+>         "is-weakmap": "^2.0.2",
+>         "is-weakset": "^2.0.3"
+>       },
+>       "engines": {
+>         "node": ">= 0.4"
+36733,36735c37363,37365
+<       "version": "1.1.15",
+<       "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz",
+<       "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==",
+---
+>       "version": "1.1.19",
+>       "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.19.tgz",
+>       "integrity": "sha512-rEvr90Bck4WZt9HHFC4DJMsjvu7x+r6bImz0/BrbWb7A2djJ8hnZMrWnHo9F8ssv0OMErasDhftrfROTyqSDrw==",
+36739,36741c37369,37373
+<         "call-bind": "^1.0.7",
+<         "for-each": "^0.3.3",
+<         "gopd": "^1.0.1",
+---
+>         "call-bind": "^1.0.8",
+>         "call-bound": "^1.0.4",
+>         "for-each": "^0.3.5",
+>         "get-proto": "^1.0.1",
+>         "gopd": "^1.2.0",
+37217a37850
+>       "license": "MIT",
+37231,37236d37863
+<     "node_modules/z-schema/node_modules/commander": {
+<       "version": "2.20.3",
+<       "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+<       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+<       "optional": true
+<     },
+37241,37250c37868,37870
+<       "deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
+<       "hasInstallScript": true
+<     },
+<     "node_modules/z-schema/node_modules/validator": {
+<       "version": "10.11.0",
+<       "resolved": "https://registry.npmjs.org/validator/-/validator-10.11.0.tgz",
+<       "integrity": "sha512-X/p3UZerAIsbBfN/IwahhYaBbY68EN/UQBWHtsbXGT5bfrH/p4NQzUCG1kF/rtKaNpnJ7jAu6NGTdSNtyNIXMw==",
+<       "engines": {
+<         "node": ">= 0.10"
+<       }
+---
+>       "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
+>       "hasInstallScript": true,
+>       "license": "MIT"
+37358c37978
+<         "dockerode": "^4.0.5",
+---
+>         "dockerode": "^4.0.7",
+37364c37984
+<         "tar-fs": "^3.0.4",
+---
+>         "tar-fs": "^3.0.9",
+37425,37451d38044
+<     "services/clsi/node_modules/@grpc/grpc-js": {
+<       "version": "1.13.2",
+<       "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.13.2.tgz",
+<       "integrity": "sha512-nnR5nmL6lxF8YBqb6gWvEgLdLh/Fn+kvAdX5hUOnt48sNSb0riz/93ASd2E5gvanPA41X6Yp25bIfGRp1SMb2g==",
+<       "license": "Apache-2.0",
+<       "dependencies": {
+<         "@grpc/proto-loader": "^0.7.13",
+<         "@js-sdsl/ordered-map": "^4.4.2"
+<       },
+<       "engines": {
+<         "node": ">=12.10.0"
+<       }
+<     },
+<     "services/clsi/node_modules/cpu-features": {
+<       "version": "0.0.10",
+<       "resolved": "https://registry.npmjs.org/cpu-features/-/cpu-features-0.0.10.tgz",
+<       "integrity": "sha512-9IkYqtX3YHPCzoVg1Py+o9057a3i0fp7S530UWokCSaFVTc7CwXPRiOjRjBQQ18ZCNafx78YfnG+HALxtVmOGA==",
+<       "hasInstallScript": true,
+<       "optional": true,
+<       "dependencies": {
+<         "buildcheck": "~0.0.6",
+<         "nan": "^2.19.0"
+<       },
+<       "engines": {
+<         "node": ">=10.0.0"
+<       }
+<     },
+37461,37529d38053
+<     "services/clsi/node_modules/docker-modem": {
+<       "version": "5.0.6",
+<       "resolved": "https://registry.npmjs.org/docker-modem/-/docker-modem-5.0.6.tgz",
+<       "integrity": "sha512-ens7BiayssQz/uAxGzH8zGXCtiV24rRWXdjNha5V4zSOcxmAZsfGVm/PPFbwQdqEkDnhG+SyR9E3zSHUbOKXBQ==",
+<       "license": "Apache-2.0",
+<       "dependencies": {
+<         "debug": "^4.1.1",
+<         "readable-stream": "^3.5.0",
+<         "split-ca": "^1.0.1",
+<         "ssh2": "^1.15.0"
+<       },
+<       "engines": {
+<         "node": ">= 8.0"
+<       }
+<     },
+<     "services/clsi/node_modules/dockerode": {
+<       "version": "4.0.5",
+<       "resolved": "https://registry.npmjs.org/dockerode/-/dockerode-4.0.5.tgz",
+<       "integrity": "sha512-ZPmKSr1k1571Mrh7oIBS/j0AqAccoecY2yH420ni5j1KyNMgnoTh4Nu4FWunh0HZIJmRSmSysJjBIpa/zyWUEA==",
+<       "license": "Apache-2.0",
+<       "dependencies": {
+<         "@balena/dockerignore": "^1.0.2",
+<         "@grpc/grpc-js": "^1.11.1",
+<         "@grpc/proto-loader": "^0.7.13",
+<         "docker-modem": "^5.0.6",
+<         "protobufjs": "^7.3.2",
+<         "tar-fs": "~2.1.2",
+<         "uuid": "^10.0.0"
+<       },
+<       "engines": {
+<         "node": ">= 8.0"
+<       }
+<     },
+<     "services/clsi/node_modules/dockerode/node_modules/tar-fs": {
+<       "version": "2.1.2",
+<       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.2.tgz",
+<       "integrity": "sha512-EsaAXwxmx8UB7FRKqeozqEPop69DXcmYwTQwXvyAPF352HJsPdkVhvTaDPYqfNgruveJIJy3TA2l+2zj8LJIJA==",
+<       "license": "MIT",
+<       "dependencies": {
+<         "chownr": "^1.1.1",
+<         "mkdirp-classic": "^0.5.2",
+<         "pump": "^3.0.0",
+<         "tar-stream": "^2.1.4"
+<       }
+<     },
+<     "services/clsi/node_modules/protobufjs": {
+<       "version": "7.4.0",
+<       "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.4.0.tgz",
+<       "integrity": "sha512-mRUWCc3KUU4w1jU8sGxICXH/gNS94DvI1gxqDvBzhj1JpcsimQkYiOJfwsPUykUI5ZaspFbSgmBLER8IrQ3tqw==",
+<       "hasInstallScript": true,
+<       "license": "BSD-3-Clause",
+<       "dependencies": {
+<         "@protobufjs/aspromise": "^1.1.2",
+<         "@protobufjs/base64": "^1.1.2",
+<         "@protobufjs/codegen": "^2.0.4",
+<         "@protobufjs/eventemitter": "^1.1.0",
+<         "@protobufjs/fetch": "^1.1.0",
+<         "@protobufjs/float": "^1.0.2",
+<         "@protobufjs/inquire": "^1.1.0",
+<         "@protobufjs/path": "^1.1.2",
+<         "@protobufjs/pool": "^1.1.0",
+<         "@protobufjs/utf8": "^1.1.0",
+<         "@types/node": ">=13.7.0",
+<         "long": "^5.0.0"
+<       },
+<       "engines": {
+<         "node": ">=12.0.0"
+<       }
+<     },
+37549,37565d38072
+<     "services/clsi/node_modules/ssh2": {
+<       "version": "1.16.0",
+<       "resolved": "https://registry.npmjs.org/ssh2/-/ssh2-1.16.0.tgz",
+<       "integrity": "sha512-r1X4KsBGedJqo7h8F5c4Ybpcr5RjyP+aWIG007uBPRjmdQWfEiVLzSK71Zji1B9sKxwaCvD8y8cwSkYrlLiRRg==",
+<       "hasInstallScript": true,
+<       "dependencies": {
+<         "asn1": "^0.2.6",
+<         "bcrypt-pbkdf": "^1.0.2"
+<       },
+<       "engines": {
+<         "node": ">=10.16.0"
+<       },
+<       "optionalDependencies": {
+<         "cpu-features": "~0.0.10",
+<         "nan": "^2.20.0"
+<       }
+<     },
+37578,37590d38084
+<     "services/clsi/node_modules/uuid": {
+<       "version": "10.0.0",
+<       "resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
+<       "integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
+<       "funding": [
+<         "https://github.com/sponsors/broofa",
+<         "https://github.com/sponsors/ctavan"
+<       ],
+<       "license": "MIT",
+<       "bin": {
+<         "uuid": "dist/bin/uuid"
+<       }
+<     },
+38683c39177
+<         "multer": "overleaf/multer#199c5ff05bd375c508f4074498237baead7f5148",
+---
+>         "multer": "github:overleaf/multer#4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23",
+39602,39604c40096,40098
+<       "version": "2.0.0",
+<       "resolved": "git+ssh://git@github.com/overleaf/multer.git#199c5ff05bd375c508f4074498237baead7f5148",
+<       "integrity": "sha512-S5MlIoOgrDr+a2jLS8z7jQlbzvZ0m30U2tRwdyLrxhnnMUQZYEzkVysEv10Dw41RTpM5bQQDs563Vzl1LLhxhQ==",
+---
+>       "version": "2.0.1",
+>       "resolved": "git+ssh://git@github.com/overleaf/multer.git#4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23",
+>       "integrity": "sha512-kkvPK48OQibR5vIoTQBbZp1uWVCvT9MrW3Y0mqdhFYJP/HVJujb4eSCEU0yj+hyf0Y+H/BKCmPdM4fJnzqAO4w==",
+39608,39610c40102,40104
+<         "busboy": "^1.0.0",
+<         "concat-stream": "^1.5.2",
+<         "mkdirp": "^0.5.4",
+---
+>         "busboy": "^1.6.0",
+>         "concat-stream": "^2.0.0",
+>         "mkdirp": "^0.5.6",
+39612,39613c40106,40107
+<         "type-is": "^1.6.4",
+<         "xtend": "^4.0.0"
+---
+>         "type-is": "^1.6.18",
+>         "xtend": "^4.0.2"
diff --git a/server-ce/hotfix/5.5.1/pr_25168.patch b/server-ce/hotfix/5.5.1/pr_25168.patch
new file mode 100644
index 0000000000..5d496d1f67
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/pr_25168.patch
@@ -0,0 +1,19 @@
+--- a/services/history-v1/config/custom-environment-variables.json
++++ b/services/history-v1/config/custom-environment-variables.json
+@@ -50,12 +50,14 @@
+     "history": {
+       "host": "OVERLEAF_REDIS_HOST",
+       "password": "OVERLEAF_REDIS_PASS",
+-      "port": "OVERLEAF_REDIS_PORT"
++      "port": "OVERLEAF_REDIS_PORT",
++      "tls": "OVERLEAF_REDIS_TLS"
+     },
+     "lock": {
+       "host": "OVERLEAF_REDIS_HOST",
+       "password": "OVERLEAF_REDIS_PASS",
+-      "port": "OVERLEAF_REDIS_PORT"
++      "port": "OVERLEAF_REDIS_PORT",
++      "tls": "OVERLEAF_REDIS_TLS"
+     }
+   }
+ }
diff --git a/server-ce/hotfix/5.5.1/pr_26086.patch b/server-ce/hotfix/5.5.1/pr_26086.patch
new file mode 100644
index 0000000000..fec417b3a5
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/pr_26086.patch
@@ -0,0 +1,200 @@
+--- a/services/history-v1/api/controllers/project_import.js
++++ b/services/history-v1/api/controllers/project_import.js
+@@ -35,6 +35,7 @@ async function importSnapshot(req, res) {
+   try {
+     snapshot = Snapshot.fromRaw(rawSnapshot)
+   } catch (err) {
++    logger.warn({ err, projectId }, 'failed to import snapshot')
+     return render.unprocessableEntity(res)
+   }
+
+@@ -43,6 +44,7 @@ async function importSnapshot(req, res) {
+     historyId = await chunkStore.initializeProject(projectId, snapshot)
+   } catch (err) {
+     if (err instanceof chunkStore.AlreadyInitialized) {
++      logger.warn({ err, projectId }, 'already initialized')
+       return render.conflict(res)
+     } else {
+       throw err
+--- a/services/history-v1/api/controllers/projects.js
++++ b/services/history-v1/api/controllers/projects.js
+@@ -34,6 +34,7 @@ async function initializeProject(req, res, next) {
+     res.status(HTTPStatus.OK).json({ projectId })
+   } catch (err) {
+     if (err instanceof chunkStore.AlreadyInitialized) {
++      logger.warn({ err, projectId }, 'failed to initialize')
+       render.conflict(res)
+     } else {
+       throw err
+@@ -242,11 +243,15 @@ async function createProjectBlob(req, res, next) {
+     const sizeLimit = new StreamSizeLimit(maxUploadSize)
+     await pipeline(req, sizeLimit, fs.createWriteStream(tmpPath))
+     if (sizeLimit.sizeLimitExceeded) {
++      logger.warn(
++        { projectId, expectedHash, maxUploadSize },
++        'blob exceeds size threshold'
++      )
+       return render.requestEntityTooLarge(res)
+     }
+     const hash = await blobHash.fromFile(tmpPath)
+     if (hash !== expectedHash) {
+-      logger.debug({ hash, expectedHash }, 'Hash mismatch')
++      logger.warn({ projectId, hash, expectedHash }, 'Hash mismatch')
+       return render.conflict(res, 'File hash mismatch')
+     }
+
+@@ -343,6 +348,10 @@ async function copyProjectBlob(req, res, next) {
+     targetBlobStore.getBlob(blobHash),
+   ])
+   if (!sourceBlob) {
++    logger.warn(
++      { sourceProjectId, targetProjectId, blobHash },
++      'missing source blob when copying across projects'
++    )
+     return render.notFound(res)
+   }
+   // Exit early if the blob exists in the target project.
+--- a/services/history-v1/app.js
++++ b/services/history-v1/app.js
+@@ -100,11 +100,13 @@ function setupErrorHandling() {
+       })
+     }
+     if (err.code === 'ENUM_MISMATCH') {
++      logger.warn({ err, projectId }, err.message)
+       return res.status(HTTPStatus.UNPROCESSABLE_ENTITY).json({
+         message: 'invalid enum value: ' + err.paramName,
+       })
+     }
+     if (err.code === 'REQUIRED') {
++      logger.warn({ err, projectId }, err.message)
+       return res.status(HTTPStatus.UNPROCESSABLE_ENTITY).json({
+         message: err.message,
+       })
+--- a/services/project-history/app/js/HistoryStoreManager.js
++++ b/services/project-history/app/js/HistoryStoreManager.js
+@@ -35,7 +35,10 @@ class StringStream extends stream.Readable {
+ _mocks.getMostRecentChunk = (projectId, historyId, callback) => {
+   const path = `projects/${historyId}/latest/history`
+   logger.debug({ projectId, historyId }, 'getting chunk from history service')
+-  _requestChunk({ path, json: true }, callback)
++  _requestChunk({ path, json: true }, (err, chunk) => {
++    if (err) return callback(OError.tag(err))
++    callback(null, chunk)
++  })
+ }
+
+ /**
+@@ -54,7 +57,10 @@ export function getChunkAtVersion(projectId, historyId, version, callback) {
+     { projectId, historyId, version },
+     'getting chunk from history service for version'
+   )
+-  _requestChunk({ path, json: true }, callback)
++  _requestChunk({ path, json: true }, (err, chunk) => {
++    if (err) return callback(OError.tag(err))
++    callback(null, chunk)
++  })
+ }
+
+ export function getMostRecentVersion(projectId, historyId, callback) {
+@@ -68,8 +74,10 @@ export function getMostRecentVersion(projectId, historyId, callback) {
+       _.sortBy(chunk.chunk.history.changes || [], x => x.timestamp)
+     )
+     // find the latest project and doc versions in the chunk
+-    _getLatestProjectVersion(projectId, chunk, (err1, projectVersion) =>
++    _getLatestProjectVersion(projectId, chunk, (err1, projectVersion) => {
++      if (err1) err1 = OError.tag(err1)
+       _getLatestV2DocVersions(projectId, chunk, (err2, v2DocVersions) => {
++        if (err2) err2 = OError.tag(err2)
+         // return the project and doc versions
+         const projectStructureAndDocVersions = {
+           project: projectVersion,
+@@ -83,7 +91,7 @@ export function getMostRecentVersion(projectId, historyId, callback) {
+           chunk
+         )
+       })
+-    )
++    })
+   })
+ }
+
+@@ -211,7 +219,10 @@ export function getProjectBlob(historyId, blobHash, callback) {
+   logger.debug({ historyId, blobHash }, 'getting blob from history service')
+   _requestHistoryService(
+     { path: `projects/${historyId}/blobs/${blobHash}` },
+-    callback
++    (err, blob) => {
++      if (err) return callback(OError.tag(err))
++      callback(null, blob)
++    }
+   )
+ }
+
+@@ -277,7 +288,10 @@ function createBlobFromString(historyId, data, fileId, callback) {
+     (fsPath, cb) => {
+       _createBlob(historyId, fsPath, cb)
+     },
+-    callback
++    (err, hash) => {
++      if (err) return callback(OError.tag(err))
++      callback(null, hash)
++    }
+   )
+ }
+
+@@ -330,7 +344,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
+     try {
+       ranges = HistoryBlobTranslator.createRangeBlobDataFromUpdate(update)
+     } catch (error) {
+-      return callback(error)
++      return callback(OError.tag(error))
+     }
+     createBlobFromString(
+       historyId,
+@@ -338,7 +352,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
+       `project-${projectId}-doc-${update.doc}`,
+       (err, fileHash) => {
+         if (err) {
+-          return callback(err)
++          return callback(OError.tag(err))
+         }
+         if (ranges) {
+           createBlobFromString(
+@@ -347,7 +361,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
+             `project-${projectId}-doc-${update.doc}-ranges`,
+             (err, rangesHash) => {
+               if (err) {
+-                return callback(err)
++                return callback(OError.tag(err))
+               }
+               logger.debug(
+                 { fileHash, rangesHash },
+@@ -415,7 +429,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
+             },
+             (err, fileHash) => {
+               if (err) {
+-                return callback(err)
++                return callback(OError.tag(err))
+               }
+               if (update.hash && update.hash !== fileHash) {
+                 logger.warn(
+@@ -447,7 +461,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
+               },
+               (err, fileHash) => {
+                 if (err) {
+-                  return callback(err)
++                  return callback(OError.tag(err))
+                 }
+                 logger.debug({ fileHash }, 'created empty blob for file')
+                 callback(null, { file: fileHash })
+@@ -520,7 +534,10 @@ export function initializeProject(historyId, callback) {
+ export function deleteProject(projectId, callback) {
+   _requestHistoryService(
+     { method: 'DELETE', path: `projects/${projectId}` },
+-    callback
++    err => {
++      if (err) return callback(OError.tag(err))
++      callback(null)
++    }
+   )
+ }
+
diff --git a/server-ce/hotfix/5.5.1/pr_26091.patch b/server-ce/hotfix/5.5.1/pr_26091.patch
new file mode 100644
index 0000000000..c88618b8d0
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/pr_26091.patch
@@ -0,0 +1,60 @@
+--- a/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
++++ b/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
+@@ -7,6 +7,7 @@ import {
+ const { ObjectId } = mongodb
+
+ const MIN_MONGO_VERSION = [6, 0]
++const MIN_MONGO_FEATURE_COMPATIBILITY_VERSION = [6, 0]
+
+ async function main() {
+   let mongoClient
+@@ -18,6 +19,7 @@ async function main() {
+   }
+
+   await checkMongoVersion(mongoClient)
++  await checkFeatureCompatibilityVersion(mongoClient)
+
+   try {
+     await testTransactions(mongoClient)
+@@ -53,6 +55,41 @@ async function checkMongoVersion(mongoClient) {
+   }
+ }
+
++async function checkFeatureCompatibilityVersion(mongoClient) {
++  const {
++    featureCompatibilityVersion: { version },
++  } = await mongoClient
++    .db()
++    .admin()
++    .command({ getParameter: 1, featureCompatibilityVersion: 1 })
++  const [major, minor] = version.split('.').map(v => parseInt(v))
++  const [minMajor, minMinor] = MIN_MONGO_FEATURE_COMPATIBILITY_VERSION
++
++  if (major < minMajor || (major === minMajor && minor < minMinor)) {
++    const minVersion = MIN_MONGO_FEATURE_COMPATIBILITY_VERSION.join('.')
++    console.error(`
++The MongoDB server has featureCompatibilityVersion=${version}, but Overleaf requires at least version ${minVersion}.
++
++Open a mongo shell:
++- Overleaf Toolkit deployments: $ bin/mongo
++- Legacy docker-compose.yml deployments: $ docker exec -it mongo mongosh localhost/sharelatex
++
++In the mongo shell:
++> db.adminCommand( { setFeatureCompatibilityVersion: "${minMajor}.${minMinor}" } )
++
++Verify the new value:
++> db.adminCommand( { getParameter: 1, featureCompatibilityVersion: 1 } )
++ ...
++ {
++    featureCompatibilityVersion: { version: ${minMajor}.${minMinor}' },
++...
++
++Aborting.
++`)
++    process.exit(1)
++  }
++}
++
+ main()
+   .then(() => {
+     console.error('Mongodb is up.')
diff --git a/server-ce/hotfix/5.5.1/pr_26152.patch b/server-ce/hotfix/5.5.1/pr_26152.patch
new file mode 100644
index 0000000000..9dc5d50e28
--- /dev/null
+++ b/server-ce/hotfix/5.5.1/pr_26152.patch
@@ -0,0 +1,16 @@
+--- a/services/web/modules/server-ce-scripts/scripts/create-user.mjs
++++ b/services/web/modules/server-ce-scripts/scripts/create-user.mjs
+@@ -48,3 +48,13 @@ Please visit the following URL to set a password for ${email} and log in:
+     )
+   })
+ }
++
++if (filename === process.argv[1]) {
++  try {
++    await main()
++    process.exit(0)
++  } catch (error) {
++    console.error({ error })
++    process.exit(1)
++  }
++}
diff --git a/server-ce/hotfix/5.5.2/Dockerfile b/server-ce/hotfix/5.5.2/Dockerfile
new file mode 100644
index 0000000000..13f82e81a4
--- /dev/null
+++ b/server-ce/hotfix/5.5.2/Dockerfile
@@ -0,0 +1,27 @@
+FROM sharelatex/sharelatex:5.5.1
+
+# https://github.com/overleaf/internal/pull/25944
+# Removed changes to services/web/frontend/js/features/ide-redesign/components/rail.tsx due to incompatibility with 5.5.1
+COPY pr_25944.patch .
+RUN patch -p1 < pr_25944.patch && rm pr_25944.patch
+
+# https://github.com/overleaf/internal/pull/26637
+# Removed changes to server-ce/test/create-and-compile-project.spec.ts and server-ce/test/helpers/compile.ts due to incompatibility with 5.5.1
+COPY pr_26637.patch .
+RUN patch -p1 < pr_26637.patch && rm pr_26637.patch
+
+# https://github.com/overleaf/internal/pull/26783
+COPY pr_26783.patch .
+RUN patch -p1 < pr_26783.patch && rm pr_26783.patch
+
+# https://github.com/overleaf/internal/pull/26697
+COPY pr_26697.patch .
+RUN patch -p1 < pr_26697.patch && rm pr_26697.patch
+
+# Apply security updates to base image
+RUN apt update && apt install -y linux-libc-dev \
+  && unattended-upgrade --verbose --no-minimal-upgrade-steps \
+  && rm -rf /var/lib/apt/lists/*
+
+# Recompile frontend assets
+RUN node genScript compile | bash
diff --git a/server-ce/hotfix/5.5.2/pr_25944.patch b/server-ce/hotfix/5.5.2/pr_25944.patch
new file mode 100644
index 0000000000..e3b9f54246
--- /dev/null
+++ b/server-ce/hotfix/5.5.2/pr_25944.patch
@@ -0,0 +1,219 @@
+diff --git a/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx b/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
+index 20e157dfee9..ad943772d0d 100644
+--- a/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
++++ b/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
+@@ -4,10 +4,16 @@ import { ChangesUsersProvider } from './changes-users-context'
+ import { TrackChangesStateProvider } from './track-changes-state-context'
+ import { ThreadsProvider } from './threads-context'
+ import { ReviewPanelViewProvider } from './review-panel-view-context'
++import { useProjectContext } from '@/shared/context/project-context'
+ 
+ export const ReviewPanelProviders: FC<React.PropsWithChildren> = ({
+   children,
+ }) => {
++  const { features } = useProjectContext()
++  if (!features.trackChangesVisible) {
++    return children
++  }
++
+   return (
+     <ReviewPanelViewProvider>
+       <ChangesUsersProvider>
+diff --git a/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx b/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
+index 8606fb11fad..e80fb037116 100644
+--- a/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
++++ b/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
+@@ -176,24 +176,34 @@ export default function AddCollaborators({ readOnly }: { readOnly?: boolean }) {
+   ])
+ 
+   const privilegeOptions = useMemo(() => {
+-    return [
++    const options: {
++      key: string
++      label: string
++      description?: string | null
++    }[] = [
+       {
+         key: 'readAndWrite',
+         label: t('editor'),
+       },
+-      {
++    ]
++
++    if (features.trackChangesVisible) {
++      options.push({
+         key: 'review',
+         label: t('reviewer'),
+         description: !features.trackChanges
+           ? t('comment_only_upgrade_for_track_changes')
+           : null,
+-      },
+-      {
+-        key: 'readOnly',
+-        label: t('viewer'),
+-      },
+-    ]
+-  }, [features.trackChanges, t])
++      })
++    }
++
++    options.push({
++      key: 'readOnly',
++      label: t('viewer'),
++    })
++
++    return options
++  }, [features.trackChanges, features.trackChangesVisible, t])
+ 
+   return (
+     <OLForm className="add-collabs">
+diff --git a/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx b/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
+index 6d806968b12..9f24cddc4ad 100644
+--- a/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
++++ b/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
+@@ -244,14 +244,22 @@ function SelectPrivilege({
+   const { features } = useProjectContext()
+ 
+   const privileges = useMemo(
+-    (): Privilege[] => [
+-      { key: 'owner', label: t('make_owner') },
+-      { key: 'readAndWrite', label: t('editor') },
+-      { key: 'review', label: t('reviewer') },
+-      { key: 'readOnly', label: t('viewer') },
+-      { key: 'removeAccess', label: t('remove_access') },
+-    ],
+-    [t]
++    (): Privilege[] =>
++      features.trackChangesVisible
++        ? [
++            { key: 'owner', label: t('make_owner') },
++            { key: 'readAndWrite', label: t('editor') },
++            { key: 'review', label: t('reviewer') },
++            { key: 'readOnly', label: t('viewer') },
++            { key: 'removeAccess', label: t('remove_access') },
++          ]
++        : [
++            { key: 'owner', label: t('make_owner') },
++            { key: 'readAndWrite', label: t('editor') },
++            { key: 'readOnly', label: t('viewer') },
++            { key: 'removeAccess', label: t('remove_access') },
++          ],
++    [features.trackChangesVisible, t]
+   )
+ 
+   const downgradedPseudoPrivilege: Privilege = {
+diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
+index c1808cbb301..4bdfe2682c8 100644
+--- a/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
++++ b/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
+@@ -18,6 +18,7 @@ import {
+ } from './codemirror-context'
+ import MathPreviewTooltip from './math-preview-tooltip'
+ import { useToolbarMenuBarEditorCommands } from '@/features/ide-redesign/hooks/use-toolbar-menu-editor-commands'
++import { useProjectContext } from '@/shared/context/project-context'
+ 
+ // TODO: remove this when definitely no longer used
+ export * from './codemirror-context'
+@@ -67,6 +68,7 @@ function CodeMirrorEditor() {
+ 
+ function CodeMirrorEditorComponents() {
+   useToolbarMenuBarEditorCommands()
++  const { features } = useProjectContext()
+ 
+   return (
+     <ReviewPanelProviders>
+@@ -83,8 +85,8 @@ function CodeMirrorEditorComponents() {
+       <CodeMirrorCommandTooltip />
+ 
+       <MathPreviewTooltip />
+-      <ReviewTooltipMenu />
+-      <ReviewPanelNew />
++      {features.trackChangesVisible && <ReviewTooltipMenu />}
++      {features.trackChangesVisible && <ReviewPanelNew />}
+ 
+       {sourceEditorComponents.map(
+         ({ import: { default: Component }, path }) => (
+diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
+index e70663683fc..c5d9f3d3e47 100644
+--- a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
++++ b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
+@@ -14,6 +14,7 @@ import { LegacyTableDropdown } from './table-inserter-dropdown-legacy'
+ import { withinFormattingCommand } from '@/features/source-editor/utils/tree-operations/formatting'
+ import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+ import { isMac } from '@/shared/utils/os'
++import { useProjectContext } from '@/shared/context/project-context'
+ 
+ export const ToolbarItems: FC<{
+   state: EditorState
+@@ -31,6 +32,7 @@ export const ToolbarItems: FC<{
+   const { t } = useTranslation()
+   const { toggleSymbolPalette, showSymbolPalette, writefullInstance } =
+     useEditorContext()
++  const { features } = useProjectContext()
+   const isActive = withinFormattingCommand(state)
+ 
+   const symbolPaletteAvailable = getMeta('ol-symbolPaletteAvailable')
+@@ -127,13 +129,15 @@ export const ToolbarItems: FC<{
+                 command={commands.wrapInHref}
+                 icon="add_link"
+               />
+-              <ToolbarButton
+-                id="toolbar-add-comment"
+-                label={t('add_comment')}
+-                disabled={state.selection.main.empty}
+-                command={commands.addComment}
+-                icon="add_comment"
+-              />
++              {features.trackChangesVisible && (
++                <ToolbarButton
++                  id="toolbar-add-comment"
++                  label={t('add_comment')}
++                  disabled={state.selection.main.empty}
++                  command={commands.addComment}
++                  icon="add_comment"
++                />
++              )}
+               <ToolbarButton
+                 id="toolbar-ref"
+                 label={t('toolbar_insert_cross_reference')}
+diff --git a/services/web/test/frontend/features/review-panel/review-panel.spec.tsx b/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
+index d6677878108..58ac3e443da 100644
+--- a/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
++++ b/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
+@@ -181,6 +181,7 @@ describe('<ReviewPanel />', function () {
+           removeChangeIds,
+         },
+       },
++      projectFeatures: { trackChangesVisible: true },
+     })
+ 
+     cy.wrap(scope).as('scope')
+@@ -626,7 +627,7 @@ describe('<ReviewPanel /> for free users', function () {
+   function mountEditor(ownerId = USER_ID) {
+     const scope = mockScope(undefined, {
+       permissions: { write: true, trackedWrite: false, comment: true },
+-      projectFeatures: { trackChanges: false },
++      projectFeatures: { trackChanges: false, trackChangesVisible: true },
+       projectOwner: {
+         _id: ownerId,
+       },
+diff --git a/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx b/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
+index b86207fb0f7..dfce8134d1c 100644
+--- a/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
++++ b/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
+@@ -694,6 +694,7 @@ describe('<ShareProjectModal/>', function () {
+           features: {
+             collaborators: 0,
+             compileGroup: 'standard',
++            trackChangesVisible: true,
+           },
+         },
+       },
+@@ -723,6 +724,7 @@ describe('<ShareProjectModal/>', function () {
+           ...project,
+           features: {
+             collaborators: 1,
++            trackChangesVisible: true,
+           },
+           members: [
+             {
diff --git a/server-ce/hotfix/5.5.2/pr_26637.patch b/server-ce/hotfix/5.5.2/pr_26637.patch
new file mode 100644
index 0000000000..f2183723bf
--- /dev/null
+++ b/server-ce/hotfix/5.5.2/pr_26637.patch
@@ -0,0 +1,86 @@
+diff --git a/services/clsi/app/js/LocalCommandRunner.js b/services/clsi/app/js/LocalCommandRunner.js
+index ce274733585..aa62825443c 100644
+--- a/services/clsi/app/js/LocalCommandRunner.js
++++ b/services/clsi/app/js/LocalCommandRunner.js
+@@ -54,6 +54,7 @@ module.exports = CommandRunner = {
+       cwd: directory,
+       env,
+       stdio: ['pipe', 'pipe', 'ignore'],
++      detached: true,
+     })
+ 
+     let stdout = ''
+diff --git a/services/clsi/test/acceptance/js/StopCompile.js b/services/clsi/test/acceptance/js/StopCompile.js
+new file mode 100644
+index 00000000000..103a70f37d7
+--- /dev/null
++++ b/services/clsi/test/acceptance/js/StopCompile.js
+@@ -0,0 +1,47 @@
++const Client = require('./helpers/Client')
++const ClsiApp = require('./helpers/ClsiApp')
++const { expect } = require('chai')
++
++describe('Stop compile', function () {
++  before(function (done) {
++    this.request = {
++      options: {
++        timeout: 100,
++      }, // seconds
++      resources: [
++        {
++          path: 'main.tex',
++          content: `\
++\\documentclass{article}
++\\begin{document}
++\\def\\x{Hello!\\par\\x}
++\\x
++\\end{document}\
++`,
++        },
++      ],
++    }
++    this.project_id = Client.randomId()
++    ClsiApp.ensureRunning(() => {
++      // start the compile in the background
++      Client.compile(this.project_id, this.request, (error, res, body) => {
++        this.compileResult = { error, res, body }
++      })
++      // wait for 1 second before stopping the compile
++      setTimeout(() => {
++        Client.stopCompile(this.project_id, (error, res, body) => {
++          this.stopResult = { error, res, body }
++          setTimeout(done, 1000) // allow time for the compile request to terminate
++        })
++      }, 1000)
++    })
++  })
++
++  it('should force a compile response with an error status', function () {
++    expect(this.stopResult.error).to.be.null
++    expect(this.stopResult.res.statusCode).to.equal(204)
++    expect(this.compileResult.res.statusCode).to.equal(200)
++    expect(this.compileResult.body.compile.status).to.equal('terminated')
++    expect(this.compileResult.body.compile.error).to.equal('terminated')
++  })
++})
+diff --git a/services/clsi/test/acceptance/js/helpers/Client.js b/services/clsi/test/acceptance/js/helpers/Client.js
+index a0bdce734f3..49bf7390c6f 100644
+--- a/services/clsi/test/acceptance/js/helpers/Client.js
++++ b/services/clsi/test/acceptance/js/helpers/Client.js
+@@ -42,6 +42,16 @@ module.exports = Client = {
+     )
+   },
+ 
++  stopCompile(projectId, callback) {
++    if (callback == null) {
++      callback = function () {}
++    }
++    return request.post(
++      { url: `${this.host}/project/${projectId}/compile/stop` },
++      callback
++    )
++  },
++
+   clearCache(projectId, callback) {
+     if (callback == null) {
+       callback = function () {}
diff --git a/server-ce/hotfix/5.5.2/pr_26697.patch b/server-ce/hotfix/5.5.2/pr_26697.patch
new file mode 100644
index 0000000000..a6dd006d0a
--- /dev/null
+++ b/server-ce/hotfix/5.5.2/pr_26697.patch
@@ -0,0 +1,172 @@
+diff --git a/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx b/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
+index 8f3b3a8e5d0..f8c8014e1c0 100644
+--- a/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
++++ b/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
+@@ -55,7 +55,11 @@ export function ProjectListDsNav() {
+
+   return (
+     <div className="project-ds-nav-page website-redesign">
+-      <DefaultNavbar {...navbarProps} customLogo={overleafLogo} showCloseIcon />
++      <DefaultNavbar
++        {...navbarProps}
++        overleafLogo={overleafLogo}
++        showCloseIcon
++      />
+       <main className="project-list-wrapper">
+         <SidebarDsNav />
+         <div className="project-ds-nav-content-and-messages">
+diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
+index 2480b7f061f..8e5429dbde6 100644
+--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
++++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
+@@ -1,4 +1,4 @@
+-import { useState } from 'react'
++import React, { useState } from 'react'
+ import { sendMB } from '@/infrastructure/event-tracking'
+ import { useTranslation } from 'react-i18next'
+ import { Button, Container, Nav, Navbar } from 'react-bootstrap'
+@@ -13,9 +13,15 @@ import MaterialIcon from '@/shared/components/material-icon'
+ import { useContactUsModal } from '@/shared/hooks/use-contact-us-modal'
+ import { UserProvider } from '@/shared/context/user-context'
+ import { X } from '@phosphor-icons/react'
++import overleafWhiteLogo from '@/shared/svgs/overleaf-white.svg'
++import overleafBlackLogo from '@/shared/svgs/overleaf-black.svg'
++import type { CSSPropertiesWithVariables } from '../../../../../../../types/css-properties-with-variables'
+
+-function DefaultNavbar(props: DefaultNavbarMetadata) {
++function DefaultNavbar(
++  props: DefaultNavbarMetadata & { overleafLogo?: string }
++) {
+   const {
++    overleafLogo,
+     customLogo,
+     title,
+     canDisplayAdminMenu,
+@@ -49,10 +55,20 @@ function DefaultNavbar(props: DefaultNavbarMetadata) {
+         className="navbar-default navbar-main"
+         expand="lg"
+         onToggle={expanded => setExpanded(expanded)}
++        style={
++          {
++            '--navbar-brand-image-default-url': `url("${overleafWhiteLogo}")`,
++            '--navbar-brand-image-redesign-url': `url("${overleafBlackLogo}")`,
++          } as CSSPropertiesWithVariables
++        }
+       >
+         <Container className="navbar-container" fluid>
+           <div className="navbar-header">
+-            <HeaderLogoOrTitle title={title} customLogo={customLogo} />
++            <HeaderLogoOrTitle
++              title={title}
++              overleafLogo={overleafLogo}
++              customLogo={customLogo}
++            />
+             {enableUpgradeButton ? (
+               <Button
+                 as="a"
+diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
+index 44500f1b826..3eefc8e2d1c 100644
+--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
++++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
+@@ -2,11 +2,13 @@ import type { DefaultNavbarMetadata } from '@/features/ui/components/types/defau
+ import getMeta from '@/utils/meta'
+
+ export default function HeaderLogoOrTitle({
++  overleafLogo,
+   customLogo,
+   title,
+-}: Pick<DefaultNavbarMetadata, 'customLogo' | 'title'>) {
++}: Pick<DefaultNavbarMetadata, 'customLogo' | 'title'> & {
++  overleafLogo?: string
++}) {
+   const { appName } = getMeta('ol-ExposedSettings')
+-
+   if (customLogo) {
+     return (
+       // eslint-disable-next-line jsx-a11y/anchor-has-content
+@@ -24,9 +26,16 @@ export default function HeaderLogoOrTitle({
+       </a>
+     )
+   } else {
++    const style = overleafLogo
++      ? {
++          style: {
++            backgroundImage: `url("${overleafLogo}")`,
++          },
++        }
++      : null
+     return (
+       // eslint-disable-next-line jsx-a11y/anchor-has-content
+-      <a href="/" aria-label={appName} className="navbar-brand" />
++      <a href="/" aria-label={appName} className="navbar-brand" {...style} />
+     )
+   }
+ }
+diff --git a/services/web/frontend/js/shared/svgs/overleaf-black.svg b/services/web/frontend/js/shared/svgs/overleaf-black.svg
+new file mode 100644
+index 00000000000..ea0678438ba
+--- /dev/null
++++ b/services/web/frontend/js/shared/svgs/overleaf-black.svg
+@@ -0,0 +1,9 @@
++<svg width="129" height="38" viewBox="0 0 129 38" fill="none" xmlns="http://www.w3.org/2000/svg">
++<mask id="mask0_2579_355" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="72" height="38">
++<path d="M71.7643 37.6327H0.0244141V0.0717773H71.7643V37.6327Z" fill="white"/>
++</mask>
++<g mask="url(#mask0_2579_355)">
++<path d="M47.2509 26.4555C47.3948 27.7507 47.8985 28.7821 48.81 29.5257C49.6974 30.2692 50.8487 30.653 52.2638 30.653C53.1993 30.653 54.0387 30.4611 54.7823 30.0773C55.5258 29.6696 56.1255 29.1419 56.5572 28.4223H61.0664C60.2989 30.3891 59.1716 31.9002 57.6365 33.0035C56.1255 34.0829 54.3506 34.6345 52.3598 34.6345C51.0166 34.6345 49.7934 34.3947 48.666 33.915C47.5387 33.4352 46.5314 32.7397 45.6199 31.8043C44.7804 30.9168 44.1089 29.9094 43.6531 28.7341C43.1974 27.5589 42.9576 26.3836 42.9576 25.1603C42.9576 23.9131 43.1734 22.7138 43.6052 21.6105C44.0369 20.5072 44.6605 19.4998 45.5 18.6124C46.4114 17.629 47.4668 16.8854 48.6181 16.3817C49.7694 15.8541 50.9686 15.5902 52.1919 15.5902C53.7509 15.5902 55.214 15.95 56.5572 16.6456C57.9004 17.3651 59.0517 18.3485 60.0111 19.6437C60.5867 20.4113 61.0185 21.2747 61.3063 22.2581C61.5941 23.2175 61.714 24.3209 61.714 25.5681C61.714 25.664 61.714 25.8079 61.69 26.0238C61.69 26.2397 61.6661 26.3836 61.6661 26.4795H47.2509V26.4555ZM57.2048 23.1216C56.845 21.9223 56.2454 21.0109 55.4059 20.3873C54.5664 19.7637 53.4871 19.4519 52.2159 19.4519C51.0886 19.4519 50.1052 19.7876 49.2177 20.4592C48.3303 21.1308 47.7306 22.0183 47.4188 23.1216H57.2048ZM71.7638 19.7637C70.1328 19.8836 69.0055 20.3153 68.3579 21.0349C67.7103 21.7544 67.3985 23.0496 67.3985 24.9205V34.1068H63.2011V16.1179H67.1347V18.2046C67.7583 17.3891 68.4539 16.8135 69.2214 16.4297C69.9649 16.0459 70.8284 15.8541 71.7638 15.8541V19.7637ZM32.428 1.24705C27.3432 -0.743722 8.9465 -1.46328 8.92251 9.52196C3.54982 12.9519 0 18.5404 0 24.5367C0 31.7803 5.87638 37.6567 13.1199 37.6567C20.3635 37.6567 26.2399 31.7803 26.2399 24.5367C26.2399 18.9482 22.738 14.1511 17.797 12.2803C16.8376 11.9205 14.7749 11.2729 13.1439 11.4168C10.7934 12.9039 7.91513 15.974 6.57196 19.0441C8.58672 16.6216 11.7288 15.5662 14.5351 16.022C18.6365 16.6936 21.7786 20.2434 21.7786 24.5607C21.7786 29.3338 17.917 33.1954 13.1439 33.1954C10.5055 33.1954 8.15498 32.0201 6.57196 30.1733C4.19742 27.415 3.59779 24.4408 4.07749 21.5386C5.73247 11.3688 17.797 5.58838 26.7675 3.35775C23.8413 4.9168 18.5646 7.45923 14.8708 10.2175C25.6402 14.391 27.3911 5.30056 32.428 1.24705ZM36.7934 34.1308H33.5074L26.6716 16.1179H31.1328L35.3303 28.0865L39.6476 16.1179H43.9889L36.7934 34.1308Z" fill="#1B222C"/>
++</g>
++<path d="M83.6127 26.4556C83.7567 27.7508 84.2843 28.7822 85.1718 29.5257C86.0592 30.2692 87.2105 30.653 88.6257 30.653C89.5611 30.653 90.4006 30.4611 91.1441 30.0774C91.8877 29.6696 92.4873 29.1419 92.919 28.4224H97.4282C96.6607 30.3892 95.5334 31.9002 93.9984 33.0036C92.4873 34.0829 90.7124 34.6346 88.7216 34.6346C87.3784 34.6346 86.1552 34.3947 85.0279 33.915C83.9006 33.4353 82.8932 32.7397 81.9817 31.8043C81.1423 30.9168 80.4707 29.9095 80.015 28.7342C79.5353 27.5829 79.3194 26.3836 79.3194 25.1604C79.3194 23.9131 79.5353 22.7139 79.967 21.6106C80.3987 20.5072 81.0223 19.4999 81.8618 18.6124C82.7733 17.629 83.8286 16.8855 84.9799 16.3818C86.1312 15.8541 87.3305 15.5903 88.5537 15.5903C90.1128 15.5903 91.5758 15.95 92.919 16.6456C94.2622 17.3652 95.4135 18.3486 96.3729 19.6438C96.9485 20.4113 97.3803 21.2748 97.6681 22.2582C97.9559 23.2176 98.0758 24.3209 98.0758 25.5681C98.0758 25.6641 98.0758 25.808 98.0519 26.0238C98.0519 26.2397 98.0279 26.3836 98.0279 26.4796H83.6127V26.4556ZM93.5426 23.1216C93.1829 21.9224 92.5832 21.0109 91.7437 20.3873C90.9043 19.7637 89.8249 19.4519 88.5537 19.4519C87.4264 19.4519 86.443 19.7877 85.5556 20.4593C84.6681 21.1309 84.0685 22.0183 83.7567 23.1216H93.5426ZM114.698 34.1309V31.9242C114.194 32.8117 113.498 33.4833 112.587 33.915C111.675 34.3467 110.5 34.5626 109.085 34.5626C106.423 34.5626 104.192 33.6512 102.417 31.8283C100.642 30.0054 99.7308 27.7508 99.7308 25.0644C99.7308 23.7932 99.9467 22.594 100.402 21.4667C100.858 20.3393 101.482 19.332 102.321 18.4685C103.209 17.5091 104.216 16.8135 105.295 16.3578C106.375 15.9021 107.622 15.6862 108.989 15.6862C110.308 15.6862 111.436 15.9021 112.371 16.3338C113.306 16.7655 114.074 17.4371 114.65 18.3246V16.1419H118.727V34.1548H114.698V34.1309ZM104.024 24.9685C104.024 26.4796 104.528 27.7508 105.535 28.7822C106.543 29.8135 107.766 30.3172 109.229 30.3172C110.548 30.3172 111.699 29.8135 112.707 28.7822C113.714 27.7508 114.218 26.5515 114.218 25.1844C114.218 23.7213 113.714 22.474 112.707 21.4187C111.699 20.3633 110.524 19.8357 109.157 19.8357C107.742 19.8357 106.543 20.3393 105.535 21.3227C104.528 22.3301 104.024 23.5294 104.024 24.9685ZM129.904 16.1179V19.8596H126.882V34.1309H122.829V19.8596H120.694V16.1179H122.709V15.6382C122.709 13.7434 123.236 12.3283 124.268 11.3929C125.323 10.4574 126.906 10.0017 129.041 10.0017C129.113 10.0017 129.257 10.0017 129.449 10.0257C129.64 10.0257 129.784 10.0497 129.904 10.0497V13.8154H129.616C128.657 13.8154 127.985 13.9833 127.578 14.2711C127.17 14.5829 126.954 15.0866 126.954 15.8301V16.1659H129.904V16.1179ZM73.5869 34.1309H77.6884V10.2895H73.5869V34.1309Z" fill="#1B222C"/>
++</svg>
+diff --git a/services/web/frontend/js/shared/svgs/overleaf-white.svg b/services/web/frontend/js/shared/svgs/overleaf-white.svg
+new file mode 100644
+index 00000000000..2ced81aa46d
+--- /dev/null
++++ b/services/web/frontend/js/shared/svgs/overleaf-white.svg
+@@ -0,0 +1 @@
++<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 542 157" enable-background="new 0 0 542 157"><style>.st0{filter:url(#Adobe_OpacityMaskFilter);} .st1{fill:#FFFFFF;} .st2{mask:url(#mask-2);fill:#FFFFFF;}</style><g id="Page-1"><g id="Overleaf"><g id="Group-3"><defs><filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="0" y=".3" width="299.2" height="156.7"><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/></filter></defs><mask maskUnits="userSpaceOnUse" x="0" y=".3" width="299.2" height="156.7" id="mask-2"><g class="st0"><path id="path-1" class="st1" d="M299.2 156.9H.1V.3h299.1z"/></g></mask><path id="Fill-1" class="st2" d="M197 110.3c.6 5.4 2.7 9.7 6.5 12.8 3.7 3.1 8.5 4.7 14.4 4.7 3.9 0 7.4-.8 10.5-2.4 3.1-1.7 5.6-3.9 7.4-6.9h18.8c-3.2 8.2-7.9 14.5-14.3 19.1-6.3 4.5-13.7 6.8-22 6.8-5.6 0-10.7-1-15.4-3-4.7-2-8.9-4.9-12.7-8.8-3.5-3.7-6.3-7.9-8.2-12.8s-2.9-9.8-2.9-14.9c0-5.2.9-10.2 2.7-14.8 1.8-4.6 4.4-8.8 7.9-12.5 3.8-4.1 8.2-7.2 13-9.3 4.8-2.2 9.8-3.3 14.9-3.3 6.5 0 12.6 1.5 18.2 4.4 5.6 3 10.4 7.1 14.4 12.5 2.4 3.2 4.2 6.8 5.4 10.9 1.2 4 1.7 8.6 1.7 13.8 0 .4 0 1-.1 1.9 0 .9-.1 1.5-.1 1.9H197v-.1zm41.5-13.9c-1.5-5-4-8.8-7.5-11.4-3.5-2.6-8-3.9-13.3-3.9-4.7 0-8.8 1.4-12.5 4.2-3.7 2.8-6.2 6.5-7.5 11.1h40.8zm60.7-14c-6.8.5-11.5 2.3-14.2 5.3-2.7 3-4 8.4-4 16.2v38.3h-17.5v-75h16.4v8.7c2.6-3.4 5.5-5.8 8.7-7.4 3.1-1.6 6.7-2.4 10.6-2.4v16.3zm-164-77.2C114-3.1 37.3-6.1 37.2 39.7 14.8 54 0 77.3 0 102.3 0 132.5 24.5 157 54.7 157c30.2 0 54.7-24.5 54.7-54.7 0-23.3-14.6-43.3-35.2-51.1-4-1.5-12.6-4.2-19.4-3.6-9.8 6.2-21.8 19-27.4 31.8 8.4-10.1 21.5-14.5 33.2-12.6 17.1 2.8 30.2 17.6 30.2 35.6 0 19.9-16.1 36-36 36-11 0-20.8-4.9-27.4-12.6-9.9-11.5-12.4-23.9-10.4-36 6.9-42.4 57.2-66.5 94.6-75.8C99.4 20.5 77.4 31.1 62 42.6c44.9 17.4 52.2-20.5 73.2-37.4zm18.2 137.1h-13.7l-28.5-75.1h18.6l17.5 49.9 18-49.9h18.1l-30 75.1z"/></g><path id="Fill-4" class="st1" d="M348.6 110.3c.6 5.4 2.8 9.7 6.5 12.8 3.7 3.1 8.5 4.7 14.4 4.7 3.9 0 7.4-.8 10.5-2.4 3.1-1.7 5.6-3.9 7.4-6.9h18.8c-3.2 8.2-7.9 14.5-14.3 19.1-6.3 4.5-13.7 6.8-22 6.8-5.6 0-10.7-1-15.4-3-4.7-2-8.9-4.9-12.7-8.8-3.5-3.7-6.3-7.9-8.2-12.8-2-4.8-2.9-9.8-2.9-14.9 0-5.2.9-10.2 2.7-14.8 1.8-4.6 4.4-8.8 7.9-12.5 3.8-4.1 8.2-7.2 13-9.3 4.8-2.2 9.8-3.3 14.9-3.3 6.5 0 12.6 1.5 18.2 4.4 5.6 3 10.4 7.1 14.4 12.5 2.4 3.2 4.2 6.8 5.4 10.9 1.2 4 1.7 8.6 1.7 13.8 0 .4 0 1-.1 1.9 0 .9-.1 1.5-.1 1.9h-60.1v-.1zM390 96.4c-1.5-5-4-8.8-7.5-11.4-3.5-2.6-8-3.9-13.3-3.9-4.7 0-8.8 1.4-12.5 4.2-3.7 2.8-6.2 6.5-7.5 11.1H390zm88.2 45.9v-9.2c-2.1 3.7-5 6.5-8.8 8.3-3.8 1.8-8.7 2.7-14.6 2.7-11.1 0-20.4-3.8-27.8-11.4-7.4-7.6-11.2-17-11.2-28.2 0-5.3.9-10.3 2.8-15 1.9-4.7 4.5-8.9 8-12.5 3.7-4 7.9-6.9 12.4-8.8s9.7-2.8 15.4-2.8c5.5 0 10.2.9 14.1 2.7 3.9 1.8 7.1 4.6 9.5 8.3v-9.1h17v75.1h-16.8v-.1zm-44.5-38.2c0 6.3 2.1 11.6 6.3 15.9 4.2 4.3 9.3 6.4 15.4 6.4 5.5 0 10.3-2.1 14.5-6.4 4.2-4.3 6.3-9.3 6.3-15 0-6.1-2.1-11.3-6.3-15.7-4.2-4.4-9.1-6.6-14.8-6.6-5.9 0-10.9 2.1-15.1 6.2-4.2 4.2-6.3 9.2-6.3 15.2zm107.9-36.9v15.6H529v59.5h-16.9V82.8h-8.9V67.2h8.4v-2c0-7.9 2.2-13.8 6.5-17.7 4.4-3.9 11-5.8 19.9-5.8.3 0 .9 0 1.7.1.8 0 1.4.1 1.9.1v15.7h-1.2c-4 0-6.8.7-8.5 1.9-1.7 1.3-2.6 3.4-2.6 6.5v1.4h12.3v-.2zm-234.8 75.1h17.1V42.9h-17.1v99.4z"/></g></g></svg>
+\ No newline at end of file
+diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss b/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
+index 5d28341cf53..dd0600ed15d 100644
+--- a/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
++++ b/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
+@@ -8,7 +8,10 @@
+   --navbar-padding-h: var(--spacing-05);
+   --navbar-padding: 0 var(--navbar-padding-h);
+   --navbar-brand-width: 130px;
+-  --navbar-brand-image-url: url('../../../../public/img/ol-brand/overleaf-white.svg');
++  --navbar-brand-image-url: var(
++    --navbar-brand-image-default-url,
++    url('../../../../public/img/ol-brand/overleaf-white.svg')
++  );
+
+   // Title, when used instead of a logo
+   --navbar-title-font-size: var(--font-size-05);
+diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss b/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
+index 3b984bb6f36..a8855ea1ca3 100644
+--- a/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
++++ b/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
+@@ -216,7 +216,10 @@
+ .website-redesign .navbar-default {
+   --navbar-title-color: var(--content-primary);
+   --navbar-title-color-hover: var(--content-secondary);
+-  --navbar-brand-image-url: url('../../../../public/img/ol-brand/overleaf-black.svg');
++  --navbar-brand-image-url: var(
++    --navbar-brand-image-redesign-url,
++    url('../../../../public/img/ol-brand/overleaf-black.svg')
++  );
+   --navbar-subdued-color: var(--content-primary);
+   --navbar-subdued-hover-bg: var(--bg-dark-primary);
+   --navbar-subdued-hover-color: var(--content-primary-dark);
+diff --git a/services/web/types/css-properties-with-variables.tsx b/services/web/types/css-properties-with-variables.tsx
+new file mode 100644
+index 00000000000..fe0e85902a6
+--- /dev/null
++++ b/services/web/types/css-properties-with-variables.tsx
+@@ -0,0 +1,4 @@
++import { CSSProperties } from 'react'
++
++export type CSSPropertiesWithVariables = CSSProperties &
++  Record<`--${string}`, number | string>
+--
+2.43.0
+
diff --git a/server-ce/hotfix/5.5.2/pr_26783.patch b/server-ce/hotfix/5.5.2/pr_26783.patch
new file mode 100644
index 0000000000..74db897a5f
--- /dev/null
+++ b/server-ce/hotfix/5.5.2/pr_26783.patch
@@ -0,0 +1,58 @@
+diff --git a/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs b/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
+index 29f5e7ffd26..46be91a1d9c 100644
+--- a/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
++++ b/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
+@@ -9,6 +9,34 @@ const { ObjectId } = mongodb
+ const MIN_MONGO_VERSION = [6, 0]
+ const MIN_MONGO_FEATURE_COMPATIBILITY_VERSION = [6, 0]
+ 
++// Allow ignoring admin check failures via an environment variable
++const OVERRIDE_ENV_VAR_NAME = 'ALLOW_MONGO_ADMIN_CHECK_FAILURES'
++
++function shouldSkipAdminChecks() {
++  return process.env[OVERRIDE_ENV_VAR_NAME] === 'true'
++}
++
++function handleUnauthorizedError(err, feature) {
++  if (
++    err instanceof mongodb.MongoServerError &&
++    err.codeName === 'Unauthorized'
++  ) {
++    console.warn(`Warning: failed to check ${feature} (not authorised)`)
++    if (!shouldSkipAdminChecks()) {
++      console.error(
++        `Please ensure the MongoDB user has the required admin permissions, or\n` +
++          `set the environment variable ${OVERRIDE_ENV_VAR_NAME}=true to ignore this check.`
++      )
++      process.exit(1)
++    }
++    console.warn(
++      `Ignoring ${feature} check failure (${OVERRIDE_ENV_VAR_NAME}=${process.env[OVERRIDE_ENV_VAR_NAME]})`
++    )
++  } else {
++    throw err
++  }
++}
++
+ async function main() {
+   let mongoClient
+   try {
+@@ -18,8 +46,16 @@ async function main() {
+     throw err
+   }
+ 
+-  await checkMongoVersion(mongoClient)
+-  await checkFeatureCompatibilityVersion(mongoClient)
++  try {
++    await checkMongoVersion(mongoClient)
++  } catch (err) {
++    handleUnauthorizedError(err, 'MongoDB version')
++  }
++  try {
++    await checkFeatureCompatibilityVersion(mongoClient)
++  } catch (err) {
++    handleUnauthorizedError(err, 'MongoDB feature compatibility version')
++  }
+ 
+   try {
+     await testTransactions(mongoClient)
diff --git a/server-ce/runit/references-overleaf/run b/server-ce/runit/references-overleaf/run
new file mode 100755
index 0000000000..875023df9f
--- /dev/null
+++ b/server-ce/runit/references-overleaf/run
@@ -0,0 +1,12 @@
+#!/bin/bash
+
+NODE_PARAMS=""
+if [ "$DEBUG_NODE" == "true" ]; then
+    echo "running debug - references"
+    NODE_PARAMS="--inspect=0.0.0.0:30560"
+fi
+
+source /etc/overleaf/env.sh
+export LISTEN_ADDRESS=127.0.0.1
+
+exec /sbin/setuser www-data /usr/bin/node $NODE_PARAMS /overleaf/services/references/app.js >> /var/log/overleaf/references.log 2>&1
diff --git a/server-ce/services.js b/server-ce/services.js
index d0b0a9c076..e0282f3bad 100644
--- a/server-ce/services.js
+++ b/server-ce/services.js
@@ -29,6 +29,9 @@ module.exports = [
   {
     name: 'project-history',
   },
+  {
+    name: 'references',
+  },
   {
     name: 'history-v1',
   },
diff --git a/server-ce/test/Dockerfile b/server-ce/test/Dockerfile
index 721b99c06b..7cc86f7ff9 100644
--- a/server-ce/test/Dockerfile
+++ b/server-ce/test/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:20.18.2
+FROM node:22.17.0
 RUN curl -fsSL https://download.docker.com/linux/debian/gpg | apt-key add - \
 &&  echo \
       "deb [arch=$(dpkg --print-architecture)] https://download.docker.com/linux/debian $(. /etc/os-release && echo "$VERSION_CODENAME") stable" \
diff --git a/server-ce/test/Makefile b/server-ce/test/Makefile
index 18f4446902..fb7c980293 100644
--- a/server-ce/test/Makefile
+++ b/server-ce/test/Makefile
@@ -6,8 +6,8 @@ all: test-e2e
 # Notable the container labels com.docker.compose.project.working_dir and com.docker.compose.project.config_files need to match when creating containers from the docker host (how you started things) and from host-admin (how tests reconfigure the instance).
 export PWD = $(shell pwd)
 
-export TEX_LIVE_DOCKER_IMAGE ?= gcr.io/overleaf-ops/texlive-full:2023.1
-export ALL_TEX_LIVE_DOCKER_IMAGES ?= gcr.io/overleaf-ops/texlive-full:2023.1,gcr.io/overleaf-ops/texlive-full:2022.1
+export TEX_LIVE_DOCKER_IMAGE ?= us-east1-docker.pkg.dev/overleaf-ops/ol-docker/texlive-full:2023.1
+export ALL_TEX_LIVE_DOCKER_IMAGES ?= us-east1-docker.pkg.dev/overleaf-ops/ol-docker/texlive-full:2023.1,us-east1-docker.pkg.dev/overleaf-ops/ol-docker/texlive-full:2022.1
 export IMAGE_TAG_PRO ?= us-east1-docker.pkg.dev/overleaf-ops/ol-docker/pro:latest
 export CYPRESS_SHARD ?=
 export COMPOSE_PROJECT_NAME ?= test
@@ -20,9 +20,12 @@ test-e2e-native:
 		npm run cypress:open
 
 test-e2e:
+	docker compose build host-admin
+	docker compose up -d host-admin
 	docker compose up --no-log-prefix --exit-code-from=e2e e2e
 
 test-e2e-open:
+	docker compose up -d host-admin
 	docker compose up --no-log-prefix --exit-code-from=e2e-open e2e-open
 
 clean:
@@ -45,7 +48,7 @@ prefetch_custom_compose_pull:
 prefetch_custom: prefetch_custom_texlive
 prefetch_custom_texlive:
 	echo "$$ALL_TEX_LIVE_DOCKER_IMAGES" | tr ',' '\n' | xargs -I% \
-	sh -exc 'tag=%; re_tag=quay.io/sharelatex/$${tag#*/*/}; docker pull $$tag; docker tag $$tag $$re_tag'
+	sh -exc 'tag=%; re_tag=quay.io/sharelatex/$${tag#*/*/*/}; docker pull $$tag; docker tag $$tag $$re_tag'
 
 prefetch_custom: prefetch_old
 prefetch_old:
diff --git a/server-ce/test/accounts.spec.ts b/server-ce/test/accounts.spec.ts
index eeeb104087..85d545535a 100644
--- a/server-ce/test/accounts.spec.ts
+++ b/server-ce/test/accounts.spec.ts
@@ -9,7 +9,7 @@ describe('Accounts', function () {
   it('can log in and out', function () {
     login('user@example.com')
     cy.visit('/project')
-    cy.findByText('Account').click()
+    cy.findByRole('menuitem', { name: 'Account' }).click()
     cy.findByText('Log Out').click()
     cy.url().should('include', '/login')
     cy.visit('/project')
diff --git a/server-ce/test/admin.spec.ts b/server-ce/test/admin.spec.ts
index 18b33c6932..50a89fb855 100644
--- a/server-ce/test/admin.spec.ts
+++ b/server-ce/test/admin.spec.ts
@@ -179,6 +179,21 @@ describe('admin panel', function () {
         cy.get('nav').findByText('Manage Users').click()
       })
 
+      it('displays expected tabs', () => {
+        const tabs = ['Users', 'License Usage']
+        cy.get('[role="tab"]').each((el, index) => {
+          cy.wrap(el).findByText(tabs[index]).click()
+        })
+        cy.get('[role="tab"]').should('have.length', tabs.length)
+      })
+
+      it('license usage tab', () => {
+        cy.get('a').contains('License Usage').click()
+        cy.findByText(
+          'An active user is one who has opened a project in this Server Pro instance in the last 12 months.'
+        )
+      })
+
       describe('create users', () => {
         beforeEach(() => {
           cy.get('a').contains('New User').click()
@@ -293,8 +308,8 @@ describe('admin panel', function () {
       cy.findByText(deletedProjectName).should('not.exist')
 
       cy.log('navigate to thrashed projects and delete the project')
-      cy.get('.project-list-sidebar-react').within(() => {
-        cy.findByText('Trashed Projects').click()
+      cy.get('.project-list-sidebar-scroll').within(() => {
+        cy.findByText('Trashed projects').click()
       })
       findProjectRow(deletedProjectName).within(() =>
         cy.findByRole('button', { name: 'Delete' }).click()
@@ -318,8 +333,8 @@ describe('admin panel', function () {
       cy.log('login as the user and verify the project is restored')
       login(user1)
       cy.visit('/project')
-      cy.get('.project-list-sidebar-react').within(() => {
-        cy.findByText('Trashed Projects').click()
+      cy.get('.project-list-sidebar-scroll').within(() => {
+        cy.findByText('Trashed projects').click()
       })
       cy.findByText(`${deletedProjectName} (Restored)`)
     })
diff --git a/server-ce/test/create-and-compile-project.spec.ts b/server-ce/test/create-and-compile-project.spec.ts
index 20f8f0dd6d..a0e03fe8d0 100644
--- a/server-ce/test/create-and-compile-project.spec.ts
+++ b/server-ce/test/create-and-compile-project.spec.ts
@@ -40,9 +40,15 @@ describe('Project creation and compilation', function () {
     cy.get('.cm-line').should('have.length', 1)
     cy.get('.cm-line').type(markdownContent)
     cy.findByText('main.tex').click()
-    cy.get('.cm-content').should('contain.text', '\\maketitle')
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'contain.text',
+      '\\maketitle'
+    )
     cy.findByText(fileName).click()
-    cy.get('.cm-content').should('contain.text', markdownContent)
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'contain.text',
+      markdownContent
+    )
   })
 
   it('can link and display linked image from other project', function () {
@@ -51,7 +57,7 @@ describe('Project creation and compilation', function () {
     login('user@example.com')
 
     createProject(sourceProjectName, {
-      type: 'Example Project',
+      type: 'Example project',
       open: false,
     }).as('sourceProjectId')
     createProject(targetProjectName)
@@ -79,7 +85,7 @@ describe('Project creation and compilation', function () {
     const targetProjectName = `${sourceProjectName}-target`
     login('user@example.com')
     createProject(sourceProjectName, {
-      type: 'Example Project',
+      type: 'Example project',
       open: false,
     }).as('sourceProjectId')
     createProject(targetProjectName).as('targetProjectId')
@@ -102,10 +108,6 @@ describe('Project creation and compilation', function () {
       cy.findByText('Invite not yet accepted.')
     })
 
-    cy.visit('/project')
-    cy.findByText('Account').click()
-    cy.findByText('Log Out').click()
-
     login('collaborator@example.com')
     openProjectViaInviteNotification(targetProjectName)
     cy.get('@targetProjectId').then(targetProjectId => {
diff --git a/server-ce/test/docker-compose.yml b/server-ce/test/docker-compose.yml
index 43f494a084..d16c5e2b71 100644
--- a/server-ce/test/docker-compose.yml
+++ b/server-ce/test/docker-compose.yml
@@ -20,7 +20,7 @@ services:
       OVERLEAF_EMAIL_SMTP_HOST: 'mailtrap'
       OVERLEAF_EMAIL_SMTP_PORT: '25'
       OVERLEAF_EMAIL_SMTP_IGNORE_TLS: 'true'
-      ENABLED_LINKED_FILE_TYPES: 'project_file,project_output_file'
+      ENABLED_LINKED_FILE_TYPES: 'project_file,project_output_file,url'
       ENABLE_CONVERSIONS: 'true'
       EMAIL_CONFIRMATION_DISABLED: 'true'
     healthcheck:
@@ -35,7 +35,7 @@ services:
       MAILTRAP_PASSWORD: 'password-for-mailtrap'
 
   mongo:
-    image: mongo:6.0
+    image: mongo:8.0.11
     command: '--replSet overleaf'
     volumes:
       - ../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
@@ -91,6 +91,7 @@ services:
     volumes:
       - ./:/e2e
       - /tmp/.X11-unix:/tmp/.X11-unix
+      - ${XAUTHORITY:-/dev/null}:/home/node/.Xauthority
     user: "${DOCKER_USER:-1000:1000}"
     environment:
       CYPRESS_SHARD:
@@ -131,7 +132,7 @@ services:
 
   saml:
     restart: always
-    image: gcr.io/overleaf-ops/saml-test
+    image: us-east1-docker.pkg.dev/overleaf-ops/ol-docker/saml-test
     environment:
       SAML_TEST_SP_ENTITY_ID: 'sharelatex-test-saml'
       SAML_BASE_URL_PATH: 'http://saml/simplesaml/'
diff --git a/server-ce/test/editor.spec.ts b/server-ce/test/editor.spec.ts
index 648c55a907..3e57b94f8f 100644
--- a/server-ce/test/editor.spec.ts
+++ b/server-ce/test/editor.spec.ts
@@ -1,11 +1,8 @@
 import {
   createNewFile,
   createProject,
-  enableLinkSharing,
-  openFile,
   openProjectById,
-  openProjectViaLinkSharingAsUser,
-  toggleTrackChanges,
+  testNewFileUpload,
 } from './helpers/project'
 import { isExcludedBySharding, startWith } from './helpers/config'
 import { ensureUserExists, login } from './helpers/login'
@@ -26,7 +23,7 @@ describe('editor', () => {
   beforeWithReRunOnTestRetry(function () {
     projectName = `project-${uuid()}`
     login('user@example.com')
-    createProject(projectName, { type: 'Example Project', open: false }).then(
+    createProject(projectName, { type: 'Example project', open: false }).then(
       id => (projectId = id)
     )
     ;({ recompile, waitForCompileRateLimitCoolOff } =
@@ -66,12 +63,12 @@ describe('editor', () => {
 
       cy.log('add word to dictionary')
       cy.get('.ol-cm-spelling-error').contains(word).rightclick()
-      cy.findByText('Add to Dictionary').click()
+      cy.findByText('Add to dictionary').click()
       cy.get('.ol-cm-spelling-error').should('not.exist')
 
       cy.log('remove word from dictionary')
       cy.get('button').contains('Menu').click()
-      cy.get('button').contains('Edit').click()
+      cy.get('button#dictionary-settings').contains('Edit').click()
       cy.get('[id="dictionary-modal"]').within(() => {
         cy.findByText(word)
           .parent()
@@ -92,136 +89,6 @@ describe('editor', () => {
     })
   })
 
-  describe('collaboration', () => {
-    beforeWithReRunOnTestRetry(function () {
-      enableLinkSharing().then(({ linkSharingReadAndWrite }) => {
-        const email = 'collaborator@example.com'
-        login(email)
-        openProjectViaLinkSharingAsUser(
-          linkSharingReadAndWrite,
-          projectName,
-          email
-        )
-      })
-
-      login('user@example.com')
-      waitForCompileRateLimitCoolOff(() => {
-        openProjectById(projectId)
-      })
-    })
-
-    it('track-changes', () => {
-      cy.log('disable track-changes before populating doc')
-      toggleTrackChanges(false)
-
-      const fileName = createNewFile()
-      const oldContent = 'oldContent'
-      cy.get('.cm-line').type(`${oldContent}\n\nstatic`)
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      cy.log('enable track-changes for everyone')
-      toggleTrackChanges(true)
-
-      login('collaborator@example.com')
-      waitForCompileRateLimitCoolOff(() => {
-        openProjectById(projectId)
-      })
-      openFile(fileName, 'static')
-
-      cy.log('make changes in main file')
-      // cy.type() "clicks" in the center of the selected element before typing. This "click" discards the text as selected by the dblclick.
-      // Go down to the lower level event based typing, the frontend tests in web use similar events.
-      cy.get('.cm-editor').as('editor')
-      cy.get('@editor').findByText(oldContent).dblclick()
-      cy.get('@editor').trigger('keydown', { key: 'Delete' })
-      cy.get('@editor').trigger('keydown', { key: 'Enter' })
-      cy.get('@editor').trigger('keydown', { key: 'Enter' })
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      login('user@example.com')
-      waitForCompileRateLimitCoolOff(() => {
-        openProjectById(projectId)
-      })
-      openFile(fileName, 'static')
-
-      cy.log('reject changes')
-      cy.contains('.toolbar-item', 'Review').click()
-      cy.get('.cm-content').should('not.contain.text', oldContent)
-      cy.findByText('Reject change').click({ force: true })
-      cy.contains('.toolbar-item', 'Review').click()
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      cy.log('verify the changes are applied')
-      cy.get('.cm-content').should('contain.text', oldContent)
-
-      cy.log('disable track-changes for everyone again')
-      toggleTrackChanges(false)
-    })
-
-    it('track-changes rich text', () => {
-      cy.log('disable track-changes before populating doc')
-      toggleTrackChanges(false)
-
-      const fileName = createNewFile()
-      const oldContent = 'oldContent'
-      cy.get('.cm-line').type(`\\section{{}${oldContent}}\n\nstatic`)
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      cy.log('enable track-changes for everyone')
-      toggleTrackChanges(true)
-
-      login('collaborator@example.com')
-      waitForCompileRateLimitCoolOff(() => {
-        openProjectById(projectId)
-      })
-      cy.log('enable visual editor and make changes in main file')
-      cy.findByText('Visual Editor').click()
-
-      openFile(fileName, 'static')
-
-      // cy.type() "clicks" in the center of the selected element before typing. This "click" discards the text as selected by the dblclick.
-      // Go down to the lower level event based typing, the frontend tests in web use similar events.
-      cy.get('.cm-editor').as('editor')
-      cy.get('@editor').findByText(oldContent).dblclick()
-      cy.get('@editor').trigger('keydown', { key: 'Delete' })
-      cy.get('@editor').trigger('keydown', { key: 'Enter' })
-      cy.get('@editor').trigger('keydown', { key: 'Enter' })
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      login('user@example.com')
-      waitForCompileRateLimitCoolOff(() => {
-        openProjectById(projectId)
-      })
-      openFile(fileName, 'static')
-
-      cy.log('reject changes')
-      cy.contains('.toolbar-item', 'Review').click()
-      cy.get('.cm-content').should('not.contain.text', oldContent)
-      cy.findAllByText('Reject change').first().click({ force: true })
-      cy.contains('.toolbar-item', 'Review').click()
-
-      cy.log('recompile to force flush')
-      recompile()
-
-      cy.log('verify the changes are applied in the visual editor')
-      cy.findByText('Visual Editor').click()
-      cy.get('.cm-content').should('contain.text', oldContent)
-
-      cy.log('disable track-changes for everyone again')
-      toggleTrackChanges(false)
-    })
-  })
-
   describe('editor', () => {
     it('renders jpg', () => {
       cy.findByTestId('file-tree').findByText('frog.jpg').click()
@@ -238,7 +105,10 @@ describe('editor', () => {
         force: true,
       })
       cy.get('button').contains('𝜉').click()
-      cy.get('.cm-content').should('contain.text', '\\xi')
+      cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+        'contain.text',
+        '\\xi'
+      )
 
       cy.log('recompile to force flush and avoid "unsaved changes" prompt')
       recompile()
@@ -250,24 +120,7 @@ describe('editor', () => {
       cy.get('button').contains('New file').click({ force: true })
     })
 
-    it('can upload file', () => {
-      const name = `${uuid()}.txt`
-      const content = `Test File Content ${name}`
-      cy.get('button').contains('Upload').click({ force: true })
-      cy.get('input[type=file]')
-        .first()
-        .selectFile(
-          {
-            contents: Cypress.Buffer.from(content),
-            fileName: name,
-            lastModified: Date.now(),
-          },
-          { force: true }
-        )
-      // force: The file-tree pane is too narrow to display the full name.
-      cy.findByTestId('file-tree').findByText(name).click({ force: true })
-      cy.findByText(content)
-    })
+    testNewFileUpload()
 
     it('should not display import from URL', () => {
       cy.findByText('From external URL').should('not.exist')
@@ -281,8 +134,9 @@ describe('editor', () => {
 
     it('can download project sources', () => {
       cy.get('a').contains('Source').click()
+      const zipName = projectName.replaceAll('-', '_')
       cy.task('readFileInZip', {
-        pathToZip: `cypress/downloads/${projectName}.zip`,
+        pathToZip: `cypress/downloads/${zipName}.zip`,
         fileToRead: 'main.tex',
       }).should('contain', 'Your introduction goes here')
     })
diff --git a/server-ce/test/filestore-migration.spec.ts b/server-ce/test/filestore-migration.spec.ts
new file mode 100644
index 0000000000..25875ad374
--- /dev/null
+++ b/server-ce/test/filestore-migration.spec.ts
@@ -0,0 +1,104 @@
+import { ensureUserExists, login } from './helpers/login'
+import {
+  createProject,
+  openProjectById,
+  prepareFileUploadTest,
+} from './helpers/project'
+import { isExcludedBySharding, startWith } from './helpers/config'
+import { prepareWaitForNextCompileSlot } from './helpers/compile'
+import { beforeWithReRunOnTestRetry } from './helpers/beforeWithReRunOnTestRetry'
+import { v4 as uuid } from 'uuid'
+import { purgeFilestoreData, runScript } from './helpers/hostAdminClient'
+
+describe('filestore migration', function () {
+  if (isExcludedBySharding('CE_CUSTOM_3')) return
+  startWith({ withDataDir: true, resetData: true, vars: {} })
+  ensureUserExists({ email: 'user@example.com' })
+
+  let projectName: string
+  let projectId: string
+  let waitForCompileRateLimitCoolOff: (fn: () => void) => void
+  const previousBinaryFiles: (() => void)[] = []
+  beforeWithReRunOnTestRetry(function () {
+    projectName = `project-${uuid()}`
+    login('user@example.com')
+    createProject(projectName, { type: 'Example project' }).then(
+      id => (projectId = id)
+    )
+    let queueReset
+    ;({ waitForCompileRateLimitCoolOff, queueReset } =
+      prepareWaitForNextCompileSlot())
+    queueReset()
+    previousBinaryFiles.push(prepareFileUploadTest(true))
+  })
+
+  beforeEach(() => {
+    login('user@example.com')
+    waitForCompileRateLimitCoolOff(() => {
+      openProjectById(projectId)
+    })
+  })
+
+  function checkFilesAreAccessible() {
+    it('can upload new binary file and read previous uploads', function () {
+      previousBinaryFiles.push(prepareFileUploadTest(true))
+      for (const check of previousBinaryFiles) {
+        check()
+      }
+    })
+
+    it('renders frog jpg', () => {
+      cy.findByTestId('file-tree').findByText('frog.jpg').click()
+      cy.get('[alt="frog.jpg"]')
+        .should('be.visible')
+        .and('have.prop', 'naturalWidth')
+        .should('be.greaterThan', 0)
+    })
+  }
+
+  describe('OVERLEAF_FILESTORE_MIGRATION_LEVEL not set', function () {
+    startWith({ withDataDir: true, vars: {} })
+    checkFilesAreAccessible()
+  })
+
+  describe('OVERLEAF_FILESTORE_MIGRATION_LEVEL=0', function () {
+    startWith({
+      withDataDir: true,
+      vars: { OVERLEAF_FILESTORE_MIGRATION_LEVEL: '0' },
+    })
+    checkFilesAreAccessible()
+
+    describe('OVERLEAF_FILESTORE_MIGRATION_LEVEL=1', function () {
+      startWith({
+        withDataDir: true,
+        vars: { OVERLEAF_FILESTORE_MIGRATION_LEVEL: '1' },
+      })
+      checkFilesAreAccessible()
+
+      describe('OVERLEAF_FILESTORE_MIGRATION_LEVEL=2', function () {
+        startWith({
+          withDataDir: true,
+          vars: { OVERLEAF_FILESTORE_MIGRATION_LEVEL: '1' },
+        })
+        before(async function () {
+          await runScript({
+            cwd: 'services/history-v1',
+            script: 'storage/scripts/back_fill_file_hash.mjs',
+          })
+        })
+        startWith({
+          withDataDir: true,
+          vars: { OVERLEAF_FILESTORE_MIGRATION_LEVEL: '2' },
+        })
+        checkFilesAreAccessible()
+
+        describe('purge filestore data', function () {
+          before(async function () {
+            await purgeFilestoreData()
+          })
+          checkFilesAreAccessible()
+        })
+      })
+    })
+  })
+})
diff --git a/server-ce/test/git-bridge.spec.ts b/server-ce/test/git-bridge.spec.ts
index 071091bdfd..1f114574ac 100644
--- a/server-ce/test/git-bridge.spec.ts
+++ b/server-ce/test/git-bridge.spec.ts
@@ -46,7 +46,7 @@ describe('git-bridge', function () {
 
     function maybeClearAllTokens() {
       cy.visit('/user/settings')
-      cy.findByText('Git Integration')
+      cy.findByText('Git integration')
       cy.get('button')
         .contains(/Generate token|Add another token/)
         .then(btn => {
@@ -63,7 +63,7 @@ describe('git-bridge', function () {
     it('should render the git-bridge UI in the settings', () => {
       maybeClearAllTokens()
       cy.visit('/user/settings')
-      cy.findByText('Git Integration')
+      cy.findByText('Git integration')
       cy.get('button').contains('Generate token').click()
       cy.get('code')
         .contains(/olp_[a-zA-Z0-9]{16}/)
@@ -93,7 +93,7 @@ describe('git-bridge', function () {
           cy.get('code').contains(`git clone ${gitURL(id.toString())}`)
         })
         cy.findByRole('button', {
-          name: 'Generate token',
+          name: /generate token/i,
         }).click()
         cy.get('code').contains(/olp_[a-zA-Z0-9]{16}/)
       })
@@ -107,7 +107,7 @@ describe('git-bridge', function () {
           cy.get('code').contains(`git clone ${gitURL(id.toString())}`)
         })
         cy.findByText('Generate token').should('not.exist')
-        cy.findByText(/generate a new one in Account Settings/)
+        cy.findByText(/generate a new one in Account settings/)
         cy.findByText('Go to settings')
           .should('have.attr', 'target', '_blank')
           .and('have.attr', 'href', '/user/settings')
@@ -196,7 +196,7 @@ describe('git-bridge', function () {
           cy.get('code').contains(`git clone ${gitURL(projectId.toString())}`)
         })
         cy.findByRole('button', {
-          name: 'Generate token',
+          name: /generate token/i,
         }).click()
         cy.get('code')
           .contains(/olp_[a-zA-Z0-9]{16}/)
@@ -365,7 +365,7 @@ Hello world
     it('should not render the git-bridge UI in the settings', () => {
       login('user@example.com')
       cy.visit('/user/settings')
-      cy.findByText('Git Integration').should('not.exist')
+      cy.findByText('Git integration').should('not.exist')
     })
     it('should not render the git-bridge UI in the editor', function () {
       login('user@example.com')
diff --git a/server-ce/test/helpers/compile.ts b/server-ce/test/helpers/compile.ts
index 9f0c9e4150..d41e43221f 100644
--- a/server-ce/test/helpers/compile.ts
+++ b/server-ce/test/helpers/compile.ts
@@ -9,6 +9,14 @@ export function throttledRecompile() {
   return recompile
 }
 
+export function stopCompile(options: { delay?: number } = {}) {
+  const { delay = 0 } = options
+  cy.wait(delay)
+  cy.log('Stop compile')
+  cy.findByRole('button', { name: 'Toggle compile options menu' }).click()
+  cy.findByRole('menuitem', { name: 'Stop compilation' }).click()
+}
+
 export function prepareWaitForNextCompileSlot() {
   let lastCompile = 0
   function queueReset() {
diff --git a/server-ce/test/helpers/config.ts b/server-ce/test/helpers/config.ts
index 030e70ceb5..78e81be1f7 100644
--- a/server-ce/test/helpers/config.ts
+++ b/server-ce/test/helpers/config.ts
@@ -9,6 +9,7 @@ export function isExcludedBySharding(
     | 'CE_DEFAULT'
     | 'CE_CUSTOM_1'
     | 'CE_CUSTOM_2'
+    | 'CE_CUSTOM_3'
     | 'PRO_DEFAULT_1'
     | 'PRO_DEFAULT_2'
     | 'PRO_CUSTOM_1'
diff --git a/server-ce/test/helpers/hostAdminClient.ts b/server-ce/test/helpers/hostAdminClient.ts
index cafeaa2db6..dadfe2b059 100644
--- a/server-ce/test/helpers/hostAdminClient.ts
+++ b/server-ce/test/helpers/hostAdminClient.ts
@@ -85,6 +85,12 @@ export async function getRedisKeys() {
   return stdout.split('\n')
 }
 
+export async function purgeFilestoreData() {
+  await fetchJSON(`${hostAdminURL}/data/user_files`, {
+    method: 'DELETE',
+  })
+}
+
 async function sleep(ms: number) {
   return new Promise(resolve => {
     setTimeout(resolve, ms)
diff --git a/server-ce/test/helpers/project.ts b/server-ce/test/helpers/project.ts
index 662327d6f2..4b3197afed 100644
--- a/server-ce/test/helpers/project.ts
+++ b/server-ce/test/helpers/project.ts
@@ -5,11 +5,11 @@ import { v4 as uuid } from 'uuid'
 export function createProject(
   name: string,
   {
-    type = 'Blank Project',
+    type = 'Blank project',
     newProjectButtonMatcher = /new project/i,
     open = true,
   }: {
-    type?: 'Blank Project' | 'Example Project'
+    type?: 'Blank project' | 'Example project'
     newProjectButtonMatcher?: RegExp
     open?: boolean
   } = {}
@@ -37,7 +37,8 @@ export function createProject(
   }
   cy.findAllByRole('button').contains(newProjectButtonMatcher).click()
   // FIXME: This should only look in the left menu
-  cy.findAllByText(type).first().click()
+  // The upgrading tests create projects in older versions of Server Pro which used different casing of the project type. Use case-insensitive match.
+  cy.findAllByText(type, { exact: false }).first().click()
   cy.findByRole('dialog').within(() => {
     cy.get('input').type(name)
     cy.findByText('Create').click()
@@ -216,36 +217,42 @@ export function createNewFile() {
   return fileName
 }
 
-export function toggleTrackChanges(state: boolean) {
-  cy.findByText('Review').click()
-  cy.get('.track-changes-menu-button').then(el => {
-    // when the menu is expanded renders the `expand_more` icon,
-    // and the `chevron_right` icon when it's collapsed
-    if (!el.text().includes('expand_more')) {
-      el.click()
+export function prepareFileUploadTest(binary = false) {
+  const name = `${uuid()}.txt`
+  const content = `Test File Content ${name}${binary ? ' \x00' : ''}`
+  cy.get('button').contains('Upload').click({ force: true })
+  cy.get('input[type=file]')
+    .first()
+    .selectFile(
+      {
+        contents: Cypress.Buffer.from(content),
+        fileName: name,
+        lastModified: Date.now(),
+      },
+      { force: true }
+    )
+
+  // wait for the upload to finish
+  cy.findByRole('treeitem', { name })
+
+  return function check() {
+    cy.findByRole('treeitem', { name }).click()
+    if (binary) {
+      cy.findByText(content).should('not.have.class', 'cm-line')
+    } else {
+      cy.findByText(content).should('have.class', 'cm-line')
     }
+  }
+}
+
+export function testNewFileUpload() {
+  it('can upload text file', () => {
+    const check = prepareFileUploadTest(false)
+    check()
   })
 
-  cy.findByText('Everyone')
-    .parent()
-    .within(() => {
-      cy.get('.form-check-input').then(el => {
-        if (el.prop('checked') === state) return
-
-        const id = uuid()
-        const alias = `@${id}`
-        cy.intercept({
-          method: 'POST',
-          url: '**/track_changes',
-          times: 1,
-        }).as(id)
-        if (state) {
-          cy.get('.form-check-input').check()
-        } else {
-          cy.get('.form-check-input').uncheck()
-        }
-        cy.wait(alias)
-      })
-    })
-  cy.contains('.toolbar-item', 'Review').click()
+  it('can upload binary file', () => {
+    const check = prepareFileUploadTest(true)
+    check()
+  })
 }
diff --git a/server-ce/test/host-admin.js b/server-ce/test/host-admin.js
index 9e4cd5d360..b3dcd72b1f 100644
--- a/server-ce/test/host-admin.js
+++ b/server-ce/test/host-admin.js
@@ -29,6 +29,17 @@ const IMAGES = {
   PRO: process.env.IMAGE_TAG_PRO.replace(/:.+/, ''),
 }
 
+function defaultDockerComposeOverride() {
+  return {
+    services: {
+      sharelatex: {
+        environment: {},
+      },
+      'git-bridge': {},
+    },
+  }
+}
+
 let previousConfig = ''
 
 function readDockerComposeOverride() {
@@ -38,14 +49,7 @@ function readDockerComposeOverride() {
     if (error.code !== 'ENOENT') {
       throw error
     }
-    return {
-      services: {
-        sharelatex: {
-          environment: {},
-        },
-        'git-bridge': {},
-      },
-    }
+    return defaultDockerComposeOverride
   }
 }
 
@@ -77,12 +81,21 @@ app.use(bodyParser.json())
 app.use((req, res, next) => {
   // Basic access logs
   console.log(req.method, req.url, req.body)
+  const json = res.json
+  res.json = body => {
+    console.log(req.method, req.url, req.body, '->', body)
+    json.call(res, body)
+  }
+  next()
+})
+app.use((req, res, next) => {
   // Add CORS headers
   const accessControlAllowOrigin =
     process.env.ACCESS_CONTROL_ALLOW_ORIGIN || 'http://sharelatex'
   res.setHeader('Access-Control-Allow-Origin', accessControlAllowOrigin)
   res.setHeader('Access-Control-Allow-Headers', 'Content-Type')
   res.setHeader('Access-Control-Max-Age', '3600')
+  res.setHeader('Access-Control-Allow-Methods', 'DELETE, GET, HEAD, POST, PUT')
   next()
 })
 
@@ -131,10 +144,9 @@ const allowedVars = Joi.object(
       'GIT_BRIDGE_HOST',
       'GIT_BRIDGE_PORT',
       'V1_HISTORY_URL',
-      'DOCKER_RUNNER',
       'SANDBOXED_COMPILES',
-      'SANDBOXED_COMPILES_SIBLING_CONTAINERS',
       'ALL_TEX_LIVE_DOCKER_IMAGE_NAMES',
+      'OVERLEAF_FILESTORE_MIGRATION_LEVEL',
       'OVERLEAF_TEMPLATES_USER_ID',
       'OVERLEAF_NEW_PROJECT_TEMPLATE_LINKS',
       'OVERLEAF_ALLOW_PUBLIC_ACCESS',
@@ -196,10 +208,7 @@ function setVarsDockerCompose({ pro, vars, version, withDataDir }) {
     )
   }
 
-  if (
-    cfg.services.sharelatex.environment
-      .SANDBOXED_COMPILES_SIBLING_CONTAINERS === 'true'
-  ) {
+  if (cfg.services.sharelatex.environment.SANDBOXED_COMPILES === 'true') {
     cfg.services.sharelatex.environment.SANDBOXED_COMPILES_HOST_DIR =
       PATHS.SANDBOXED_COMPILES_HOST_DIR
     cfg.services.sharelatex.environment.TEX_LIVE_DOCKER_IMAGE =
@@ -324,8 +333,19 @@ app.get('/redis/keys', (req, res) => {
   )
 })
 
+app.delete('/data/user_files', (req, res) => {
+  runDockerCompose(
+    'exec',
+    ['sharelatex', 'rm', '-rf', '/var/lib/overleaf/data/user_files'],
+    (error, stdout, stderr) => {
+      res.json({ error, stdout, stderr })
+    }
+  )
+})
+
 app.use(handleValidationErrors())
 
 purgeDataDir()
+writeDockerComposeOverride(defaultDockerComposeOverride())
 
 app.listen(80)
diff --git a/server-ce/test/project-list.spec.ts b/server-ce/test/project-list.spec.ts
index 3056242a0f..998fcf9ffb 100644
--- a/server-ce/test/project-list.spec.ts
+++ b/server-ce/test/project-list.spec.ts
@@ -32,7 +32,7 @@ describe('Project List', () => {
 
     before(() => {
       login(REGULAR_USER)
-      createProject(projectName, { type: 'Example Project', open: false })
+      createProject(projectName, { type: 'Example project', open: false })
     })
     beforeEach(function () {
       login(REGULAR_USER)
@@ -44,8 +44,9 @@ describe('Project List', () => {
         cy.findByRole('button', { name: 'Download .zip file' }).click()
       )
 
+      const zipName = projectName.replaceAll('-', '_')
       cy.task('readFileInZip', {
-        pathToZip: `cypress/downloads/${projectName}.zip`,
+        pathToZip: `cypress/downloads/${zipName}.zip`,
         fileToRead: 'main.tex',
       }).should('contain', 'Your introduction goes here')
     })
diff --git a/server-ce/test/project-sharing.spec.ts b/server-ce/test/project-sharing.spec.ts
index e26439264b..4da2209332 100644
--- a/server-ce/test/project-sharing.spec.ts
+++ b/server-ce/test/project-sharing.spec.ts
@@ -55,8 +55,15 @@ describe('Project Sharing', function () {
 
   function expectContentReadOnlyAccess() {
     cy.url().should('match', /\/project\/[a-fA-F0-9]{24}/)
-    cy.get('.cm-content').should('contain.text', '\\maketitle')
-    cy.get('.cm-content').should('have.attr', 'contenteditable', 'false')
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'contain.text',
+      '\\maketitle'
+    )
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'have.attr',
+      'contenteditable',
+      'false'
+    )
   }
 
   function expectContentWriteAccess() {
@@ -64,13 +71,23 @@ describe('Project Sharing', function () {
     cy.url().should('match', /\/project\/[a-fA-F0-9]{24}/)
     const recompile = throttledRecompile()
     // wait for the editor to finish loading
-    cy.get('.cm-content').should('contain.text', '\\maketitle')
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'contain.text',
+      '\\maketitle'
+    )
     // the editor should be writable
-    cy.get('.cm-content').should('have.attr', 'contenteditable', 'true')
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'have.attr',
+      'contenteditable',
+      'true'
+    )
     cy.findByText('\\maketitle').parent().click()
     cy.findByText('\\maketitle').parent().type(`\n\\section{{}${section}}`)
     // should have written
-    cy.get('.cm-content').should('contain.text', `\\section{${section}}`)
+    cy.findByRole('textbox', { name: /Source Editor editing/i }).should(
+      'contain.text',
+      `\\section{${section}}`
+    )
     // check PDF
     recompile()
     cy.get('.pdf-viewer').should('contain.text', projectName)
diff --git a/server-ce/test/sandboxed-compiles.spec.ts b/server-ce/test/sandboxed-compiles.spec.ts
index 505f8cffd2..71f5b43392 100644
--- a/server-ce/test/sandboxed-compiles.spec.ts
+++ b/server-ce/test/sandboxed-compiles.spec.ts
@@ -1,7 +1,7 @@
 import { ensureUserExists, login } from './helpers/login'
 import { createProject } from './helpers/project'
 import { isExcludedBySharding, startWith } from './helpers/config'
-import { throttledRecompile } from './helpers/compile'
+import { throttledRecompile, stopCompile } from './helpers/compile'
 import { v4 as uuid } from 'uuid'
 import { waitUntilScrollingFinished } from './helpers/waitUntilScrollingFinished'
 import { beforeWithReRunOnTestRetry } from './helpers/beforeWithReRunOnTestRetry'
@@ -10,9 +10,7 @@ const LABEL_TEX_LIVE_VERSION = 'TeX Live version'
 
 describe('SandboxedCompiles', function () {
   const enabledVars = {
-    DOCKER_RUNNER: 'true',
     SANDBOXED_COMPILES: 'true',
-    SANDBOXED_COMPILES_SIBLING_CONTAINERS: 'true',
     ALL_TEX_LIVE_DOCKER_IMAGE_NAMES: '2023,2022',
   }
 
@@ -58,10 +56,44 @@ describe('SandboxedCompiles', function () {
     checkSyncTeX()
     checkXeTeX()
     checkRecompilesAfterErrors()
+    checkStopCompile()
   })
 
+  function checkStopCompile() {
+    it('users can stop a running compile', function () {
+      login('user@example.com')
+      createProject('test-project')
+      // create an infinite loop in the main document
+      // this will cause the compile to run indefinitely
+      cy.findByText('\\maketitle').parent().click()
+      cy.findByText('\\maketitle')
+        .parent()
+        .type('\n\\def\\x{{}Hello!\\par\\x}\\x')
+      cy.log('Start compile')
+      // We need to start the compile manually because we do not want to wait for it to finish
+      cy.findByText('Recompile').click()
+      // Now stop the compile and kill the latex process
+      stopCompile({ delay: 1000 })
+      cy.get('.logs-pane')
+        .invoke('text')
+        .should('match', /PDF Rendering Error|Compilation cancelled/)
+      // Check that the previous compile is not running in the background by
+      // disabling the infinite loop and recompiling
+      cy.findByText('\\def').parent().click()
+      cy.findByText('\\def').parent().type('{home}disabled loop% ')
+      cy.findByText('Recompile').click()
+      cy.get('.pdf-viewer').should('contain.text', 'disabled loop')
+      cy.get('.logs-pane').should(
+        'not.contain.text',
+        'A previous compile is still running'
+      )
+    })
+  }
+
   function checkSyncTeX() {
-    describe('SyncTeX', function () {
+    // TODO(25342): re-enable
+    // eslint-disable-next-line mocha/no-skipped-tests
+    describe.skip('SyncTeX', function () {
       let projectName: string
       beforeEach(function () {
         projectName = `Project ${uuid()}`
@@ -129,7 +161,9 @@ describe('SandboxedCompiles', function () {
         })
 
         cy.log('navigate to Section A')
-        cy.get('.cm-content').within(() => cy.findByText('Section A').click())
+        cy.findByRole('textbox', { name: /Source Editor editing/i }).within(
+          () => cy.findByText('Section A').click()
+        )
         cy.get('[aria-label="Go to code location in PDF"]').click()
         cy.get('@title').then((title: any) => {
           waitUntilScrollingFinished('.pdfjs-viewer-inner', title)
@@ -138,7 +172,9 @@ describe('SandboxedCompiles', function () {
         })
 
         cy.log('navigate to Section B')
-        cy.get('.cm-content').within(() => cy.findByText('Section B').click())
+        cy.findByRole('textbox', { name: /Source Editor editing/i }).within(
+          () => cy.findByText('Section B').click()
+        )
         cy.get('[aria-label="Go to code location in PDF"]').click()
         cy.get('@sectionA').then((title: any) => {
           waitUntilScrollingFinished('.pdfjs-viewer-inner', title)
@@ -227,6 +263,7 @@ describe('SandboxedCompiles', function () {
     checkSyncTeX()
     checkXeTeX()
     checkRecompilesAfterErrors()
+    checkStopCompile()
   })
 
   describe.skip('unavailable in CE', function () {
@@ -241,5 +278,6 @@ describe('SandboxedCompiles', function () {
     checkSyncTeX()
     checkXeTeX()
     checkRecompilesAfterErrors()
+    checkStopCompile()
   })
 })
diff --git a/server-ce/test/templates.spec.ts b/server-ce/test/templates.spec.ts
index bb581650a2..4959e149fc 100644
--- a/server-ce/test/templates.spec.ts
+++ b/server-ce/test/templates.spec.ts
@@ -47,7 +47,9 @@ describe('Templates', () => {
       cy.url().should('match', /\/templates$/)
     })
 
-    it('should have templates feature', () => {
+    // TODO(25342): re-enable
+    // eslint-disable-next-line mocha/no-skipped-tests
+    it.skip('should have templates feature', () => {
       login(TEMPLATES_USER)
       const name = `Template ${Date.now()}`
       const description = `Template Description ${Date.now()}`
@@ -96,12 +98,12 @@ describe('Templates', () => {
         .parent()
         .parent()
         .within(() => cy.get('input[type="checkbox"]').first().check())
-      cy.get('.project-list-sidebar-react').within(() => {
+      cy.get('.project-list-sidebar-scroll').within(() => {
         cy.findAllByText('New Tag').first().click()
       })
       cy.focused().type(tagName)
       cy.findByText('Create').click()
-      cy.get('.project-list-sidebar-react').within(() => {
+      cy.get('.project-list-sidebar-scroll').within(() => {
         cy.findByText(tagName)
           .parent()
           .within(() => cy.get('.name').should('have.text', `${tagName} (1)`))
diff --git a/services/chat/.gitignore b/services/chat/.gitignore
deleted file mode 100644
index f0cf94b147..0000000000
--- a/services/chat/.gitignore
+++ /dev/null
@@ -1,12 +0,0 @@
-**.swp
-
-public/build/
-
-node_modules/
-
-plato/
-
-**/*.map
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/chat/.nvmrc b/services/chat/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/chat/.nvmrc
+++ b/services/chat/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/chat/Dockerfile b/services/chat/Dockerfile
index 14056c2d29..66a8bc3ded 100644
--- a/services/chat/Dockerfile
+++ b/services/chat/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/chat
 
diff --git a/services/chat/Makefile b/services/chat/Makefile
index 94f0afb567..792f5d2cd6 100644
--- a/services/chat/Makefile
+++ b/services/chat/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/chat/buildscript.txt b/services/chat/buildscript.txt
index e8020de0d4..35114bd2a4 100644
--- a/services/chat/buildscript.txt
+++ b/services/chat/buildscript.txt
@@ -4,6 +4,6 @@ chat
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/chat/docker-compose.ci.yml b/services/chat/docker-compose.ci.yml
index 51eb64d126..ca3303a079 100644
--- a/services/chat/docker-compose.ci.yml
+++ b/services/chat/docker-compose.ci.yml
@@ -24,10 +24,13 @@ services:
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -39,7 +42,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/chat/docker-compose.yml b/services/chat/docker-compose.yml
index b830d25453..e7b8ce7385 100644
--- a/services/chat/docker-compose.yml
+++ b/services/chat/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/chat
       - ../../node_modules:/overleaf/node_modules
@@ -21,11 +21,12 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/chat
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/chat
     environment:
       ELASTIC_SEARCH_DSN: es:9200
@@ -39,10 +40,11 @@ services:
     depends_on:
       mongo:
         condition: service_started
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/clsi/.gitignore b/services/clsi/.gitignore
index 360466227e..a85e6b757a 100644
--- a/services/clsi/.gitignore
+++ b/services/clsi/.gitignore
@@ -1,14 +1,3 @@
-**.swp
-node_modules
-test/acceptance/fixtures/tmp
 compiles
 output
-.DS_Store
-*~
 cache
-.vagrant
-config/*
-npm-debug.log
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/clsi/.nvmrc b/services/clsi/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/clsi/.nvmrc
+++ b/services/clsi/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/clsi/Dockerfile b/services/clsi/Dockerfile
index c5f46c1c19..77c26fab23 100644
--- a/services/clsi/Dockerfile
+++ b/services/clsi/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/clsi
 COPY services/clsi/install_deps.sh /overleaf/services/clsi/
diff --git a/services/clsi/Makefile b/services/clsi/Makefile
index 2f673dbd87..e02697f4e9 100644
--- a/services/clsi/Makefile
+++ b/services/clsi/Makefile
@@ -24,7 +24,6 @@ DOCKER_COMPOSE_TEST_UNIT = \
 
 clean:
 	-docker rmi ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
-	-docker rmi gcr.io/overleaf-ops/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
 	-docker rmi us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
 	-$(DOCKER_COMPOSE_TEST_UNIT) down --rmi local
 	-$(DOCKER_COMPOSE_TEST_ACCEPTANCE) down --rmi local
@@ -33,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
@@ -129,11 +128,10 @@ build:
 		--pull \
 		--build-arg BUILDKIT_INLINE_CACHE=1 \
 		--tag ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) \
-		--tag gcr.io/overleaf-ops/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) \
-		--tag gcr.io/overleaf-ops/$(PROJECT_NAME):$(BRANCH_NAME) \
-		--cache-from gcr.io/overleaf-ops/$(PROJECT_NAME):$(BRANCH_NAME) \
-		--cache-from gcr.io/overleaf-ops/$(PROJECT_NAME):main \
 		--tag us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) \
+		--tag us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME) \
+		--cache-from us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME) \
+		--cache-from us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):main \
 		--file Dockerfile \
 		../..
 
diff --git a/services/clsi/README.md b/services/clsi/README.md
index 33a9c95c1c..f1cf927d3d 100644
--- a/services/clsi/README.md
+++ b/services/clsi/README.md
@@ -19,17 +19,18 @@ The CLSI can be configured through the following environment variables:
 * `ALLOWED_IMAGES` - Space separated list of allowed Docker TeX Live images
 * `CATCH_ERRORS` - Set to `true` to log uncaught exceptions
 * `COMPILE_GROUP_DOCKER_CONFIGS` - JSON string of Docker configs for compile groups
-* `COMPILES_HOST_DIR` - Working directory for LaTeX compiles
+* `SANDBOXED_COMPILES` - Set to true to use sibling containers
+* `SANDBOXED_COMPILES_HOST_DIR_COMPILES` - Working directory for LaTeX compiles
+* `SANDBOXED_COMPILES_HOST_DIR_OUTPUT` - Output directory for LaTeX compiles
 * `COMPILE_SIZE_LIMIT` - Sets the body-parser [limit](https://github.com/expressjs/body-parser#limit)
-* `DOCKER_RUNNER` - Set to true to use sibling containers
 * `DOCKER_RUNTIME` -
 * `FILESTORE_DOMAIN_OVERRIDE` - The url for the filestore service e.g.`http://$FILESTORE_HOST:3009`
 * `FILESTORE_PARALLEL_FILE_DOWNLOADS` - Number of parallel file downloads
 * `LISTEN_ADDRESS` - The address for the RESTful service to listen on. Set to `0.0.0.0` to listen on all network interfaces
 * `PROCESS_LIFE_SPAN_LIMIT_MS` - Process life span limit in milliseconds
 * `SMOKE_TEST` - Whether to run smoke tests
-* `TEXLIVE_IMAGE` - The TeX Live Docker image to use for sibling containers, e.g. `gcr.io/overleaf-ops/texlive-full:2017.1`
-* `TEX_LIVE_IMAGE_NAME_OVERRIDE` - The name of the registry for the Docker image e.g. `gcr.io/overleaf-ops`
+* `TEXLIVE_IMAGE` - The TeX Live Docker image to use for sibling containers, e.g. `us-east1-docker.pkg.dev/overleaf-ops/ol-docker/texlive-full:2017.1`
+* `TEX_LIVE_IMAGE_NAME_OVERRIDE` - The name of the registry for the Docker image e.g. `us-east1-docker.pkg.dev/overleaf-ops/ol-docker`
 * `TEXLIVE_IMAGE_USER` - When using sibling containers, the user to run as in the TeX Live image. Defaults to `tex`
 * `TEXLIVE_OPENOUT_ANY` - Sets the `openout_any` environment variable for TeX Live (see the `\openout` primitive [documentation](http://tug.org/texinfohtml/web2c.html#tex-invocation))
 
@@ -62,10 +63,10 @@ Then start the Docker container:
 docker run --rm \
   -p 127.0.0.1:3013:3013 \
   -e LISTEN_ADDRESS=0.0.0.0 \
-  -e DOCKER_RUNNER=true \
+  -e SANDBOXED_COMPILES=true \
   -e TEXLIVE_IMAGE=texlive/texlive \
   -e TEXLIVE_IMAGE_USER=root \
-  -e COMPILES_HOST_DIR="$PWD/compiles" \
+  -e SANDBOXED_COMPILES_HOST_DIR_COMPILES="$PWD/compiles" \
   -v "$PWD/compiles:/overleaf/services/clsi/compiles" \
   -v "$PWD/cache:/overleaf/services/clsi/cache" \
   -v /var/run/docker.sock:/var/run/docker.sock \
diff --git a/services/clsi/app.js b/services/clsi/app.js
index 8715802a0e..872f612d9c 100644
--- a/services/clsi/app.js
+++ b/services/clsi/app.js
@@ -249,6 +249,9 @@ app.get('/health_check', function (req, res) {
   if (Settings.processTooOld) {
     return res.status(500).json({ processTooOld: true })
   }
+  if (ProjectPersistenceManager.isAnyDiskCriticalLow()) {
+    return res.status(500).json({ diskCritical: true })
+  }
   smokeTest.sendLastResult(res)
 })
 
@@ -258,6 +261,8 @@ app.use(function (error, req, res, next) {
   if (error instanceof Errors.NotFoundError) {
     logger.debug({ err: error, url: req.url }, 'not found error')
     res.sendStatus(404)
+  } else if (error instanceof Errors.InvalidParameter) {
+    res.status(400).send(error.message)
   } else if (error.code === 'EPIPE') {
     // inspect container returns EPIPE when shutting down
     res.sendStatus(503) // send 503 Unavailable response
@@ -294,9 +299,14 @@ const loadTcpServer = net.createServer(function (socket) {
     }
 
     const freeLoad = availableWorkingCpus - currentLoad
-    const freeLoadPercentage = Math.round(
-      (freeLoad / availableWorkingCpus) * 100
-    )
+    let freeLoadPercentage = Math.round((freeLoad / availableWorkingCpus) * 100)
+    if (ProjectPersistenceManager.isAnyDiskCriticalLow()) {
+      freeLoadPercentage = 0
+    }
+    if (ProjectPersistenceManager.isAnyDiskLow()) {
+      freeLoadPercentage = freeLoadPercentage / 2
+    }
+
     if (
       Settings.internal.load_balancer_agent.allow_maintenance &&
       freeLoadPercentage <= 0
diff --git a/services/clsi/app/js/CLSICacheHandler.js b/services/clsi/app/js/CLSICacheHandler.js
new file mode 100644
index 0000000000..26acd221f9
--- /dev/null
+++ b/services/clsi/app/js/CLSICacheHandler.js
@@ -0,0 +1,304 @@
+const crypto = require('node:crypto')
+const fs = require('node:fs')
+const Path = require('node:path')
+const { pipeline } = require('node:stream/promises')
+const { createGzip, createGunzip } = require('node:zlib')
+const tarFs = require('tar-fs')
+const _ = require('lodash')
+const {
+  fetchNothing,
+  fetchStream,
+  RequestFailedError,
+} = require('@overleaf/fetch-utils')
+const logger = require('@overleaf/logger')
+const Metrics = require('@overleaf/metrics')
+const Settings = require('@overleaf/settings')
+const { MeteredStream } = require('@overleaf/stream-utils')
+const { CACHE_SUBDIR } = require('./OutputCacheManager')
+const { isExtraneousFile } = require('./ResourceWriter')
+
+const TIMING_BUCKETS = [
+  0, 10, 100, 1000, 2000, 5000, 10000, 15000, 20000, 30000,
+]
+const MAX_ENTRIES_IN_OUTPUT_TAR = 100
+const OBJECT_ID_REGEX = /^[0-9a-f]{24}$/
+
+/**
+ * @param {string} projectId
+ * @return {{shard: string, url: string}}
+ */
+function getShard(projectId) {
+  // [timestamp 4bytes][random per machine 5bytes][counter 3bytes]
+  //                                          [32bit       4bytes]
+  const last4Bytes = Buffer.from(projectId, 'hex').subarray(8, 12)
+  const idx = last4Bytes.readUInt32BE() % Settings.apis.clsiCache.shards.length
+  return Settings.apis.clsiCache.shards[idx]
+}
+
+/**
+ * @param {string} projectId
+ * @param {string} userId
+ * @param {string} buildId
+ * @param {string} editorId
+ * @param {[{path: string}]} outputFiles
+ * @param {string} compileGroup
+ * @param {Record<string, any>} options
+ * @return {string | undefined}
+ */
+function notifyCLSICacheAboutBuild({
+  projectId,
+  userId,
+  buildId,
+  editorId,
+  outputFiles,
+  compileGroup,
+  options,
+}) {
+  if (!Settings.apis.clsiCache.enabled) return undefined
+  if (!OBJECT_ID_REGEX.test(projectId)) return undefined
+  const { url, shard } = getShard(projectId)
+
+  /**
+   * @param {[{path: string}]} files
+   */
+  const enqueue = files => {
+    Metrics.count('clsi_cache_enqueue_files', files.length)
+    fetchNothing(`${url}/enqueue`, {
+      method: 'POST',
+      json: {
+        projectId,
+        userId,
+        buildId,
+        editorId,
+        files,
+        downloadHost: Settings.apis.clsi.downloadHost,
+        clsiServerId: Settings.apis.clsi.clsiServerId,
+        compileGroup,
+        options,
+      },
+      signal: AbortSignal.timeout(15_000),
+    }).catch(err => {
+      logger.warn(
+        { err, projectId, userId, buildId },
+        'enqueue for clsi cache failed'
+      )
+    })
+  }
+
+  // PDF preview
+  enqueue(
+    outputFiles
+      .filter(
+        f =>
+          f.path === 'output.pdf' ||
+          f.path === 'output.log' ||
+          f.path === 'output.synctex.gz' ||
+          f.path.endsWith('.blg')
+      )
+      .map(f => {
+        if (f.path === 'output.pdf') {
+          return _.pick(f, 'path', 'size', 'contentId', 'ranges')
+        }
+        return _.pick(f, 'path')
+      })
+  )
+
+  // Compile Cache
+  buildTarball({ projectId, userId, buildId, outputFiles })
+    .then(() => {
+      enqueue([{ path: 'output.tar.gz' }])
+    })
+    .catch(err => {
+      logger.warn(
+        { err, projectId, userId, buildId },
+        'build output.tar.gz for clsi cache failed'
+      )
+    })
+
+  return shard
+}
+
+/**
+ * @param {string} projectId
+ * @param {string} userId
+ * @param {string} buildId
+ * @param {[{path: string}]} outputFiles
+ * @return {Promise<void>}
+ */
+async function buildTarball({ projectId, userId, buildId, outputFiles }) {
+  const timer = new Metrics.Timer('clsi_cache_build', 1, {}, TIMING_BUCKETS)
+  const outputDir = Path.join(
+    Settings.path.outputDir,
+    userId ? `${projectId}-${userId}` : projectId,
+    CACHE_SUBDIR,
+    buildId
+  )
+
+  const files = outputFiles.filter(f => !isExtraneousFile(f.path))
+  if (files.length > MAX_ENTRIES_IN_OUTPUT_TAR) {
+    Metrics.inc('clsi_cache_build_too_many_entries')
+    throw new Error('too many output files for output.tar.gz')
+  }
+  Metrics.count('clsi_cache_build_files', files.length)
+
+  const path = Path.join(outputDir, 'output.tar.gz')
+  try {
+    await pipeline(
+      tarFs.pack(outputDir, { entries: files.map(f => f.path) }),
+      createGzip(),
+      fs.createWriteStream(path)
+    )
+  } catch (err) {
+    try {
+      await fs.promises.unlink(path)
+    } catch (e) {}
+    throw err
+  } finally {
+    timer.done()
+  }
+}
+
+/**
+ * @param {string} projectId
+ * @param {string} userId
+ * @param {string} editorId
+ * @param {string} buildId
+ * @param {string} outputDir
+ * @return {Promise<boolean>}
+ */
+async function downloadOutputDotSynctexFromCompileCache(
+  projectId,
+  userId,
+  editorId,
+  buildId,
+  outputDir
+) {
+  if (!Settings.apis.clsiCache.enabled) return false
+  if (!OBJECT_ID_REGEX.test(projectId)) return false
+
+  const timer = new Metrics.Timer(
+    'clsi_cache_download',
+    1,
+    { method: 'synctex' },
+    TIMING_BUCKETS
+  )
+  let stream
+  try {
+    stream = await fetchStream(
+      `${getShard(projectId).url}/project/${projectId}/${
+        userId ? `user/${userId}/` : ''
+      }build/${editorId}-${buildId}/search/output/output.synctex.gz`,
+      {
+        method: 'GET',
+        signal: AbortSignal.timeout(10_000),
+      }
+    )
+  } catch (err) {
+    if (err instanceof RequestFailedError && err.response.status === 404) {
+      timer.done({ status: 'not-found' })
+      return false
+    }
+    timer.done({ status: 'error' })
+    throw err
+  }
+  await fs.promises.mkdir(outputDir, { recursive: true })
+  const dst = Path.join(outputDir, 'output.synctex.gz')
+  const tmp = dst + crypto.randomUUID()
+  try {
+    await pipeline(
+      stream,
+      new MeteredStream(Metrics, 'clsi_cache_egress', {
+        path: 'output.synctex.gz',
+      }),
+      fs.createWriteStream(tmp)
+    )
+    await fs.promises.rename(tmp, dst)
+  } catch (err) {
+    try {
+      await fs.promises.unlink(tmp)
+    } catch {}
+    throw err
+  }
+  timer.done({ status: 'success' })
+  return true
+}
+
+/**
+ * @param {string} projectId
+ * @param {string} userId
+ * @param {string} compileDir
+ * @return {Promise<boolean>}
+ */
+async function downloadLatestCompileCache(projectId, userId, compileDir) {
+  if (!Settings.apis.clsiCache.enabled) return false
+  if (!OBJECT_ID_REGEX.test(projectId)) return false
+
+  const url = `${getShard(projectId).url}/project/${projectId}/${
+    userId ? `user/${userId}/` : ''
+  }latest/output/output.tar.gz`
+  const timer = new Metrics.Timer(
+    'clsi_cache_download',
+    1,
+    { method: 'tar' },
+    TIMING_BUCKETS
+  )
+  let stream
+  try {
+    stream = await fetchStream(url, {
+      method: 'GET',
+      signal: AbortSignal.timeout(10_000),
+    })
+  } catch (err) {
+    if (err instanceof RequestFailedError && err.response.status === 404) {
+      timer.done({ status: 'not-found' })
+      return false
+    }
+    timer.done({ status: 'error' })
+    throw err
+  }
+  let n = 0
+  let abort = false
+  await pipeline(
+    stream,
+    new MeteredStream(Metrics, 'clsi_cache_egress', { path: 'output.tar.gz' }),
+    createGunzip(),
+    tarFs.extract(compileDir, {
+      // use ignore hook for counting entries (files+folders) and validation.
+      // Include folders as they incur mkdir calls.
+      ignore(_, header) {
+        if (abort) return true // log once
+        n++
+        if (n > MAX_ENTRIES_IN_OUTPUT_TAR) {
+          abort = true
+          logger.warn(
+            {
+              url,
+              compileDir,
+            },
+            'too many entries in tar-ball from clsi-cache'
+          )
+        } else if (header.type !== 'file' && header.type !== 'directory') {
+          abort = true
+          logger.warn(
+            {
+              url,
+              compileDir,
+              entryType: header.type,
+            },
+            'unexpected entry in tar-ball from clsi-cache'
+          )
+        }
+        return abort
+      },
+    })
+  )
+  Metrics.count('clsi_cache_download_entries', n)
+  timer.done({ status: 'success' })
+  return !abort
+}
+
+module.exports = {
+  notifyCLSICacheAboutBuild,
+  downloadLatestCompileCache,
+  downloadOutputDotSynctexFromCompileCache,
+}
diff --git a/services/clsi/app/js/CompileController.js b/services/clsi/app/js/CompileController.js
index 8091055afe..b3343ee233 100644
--- a/services/clsi/app/js/CompileController.js
+++ b/services/clsi/app/js/CompileController.js
@@ -1,3 +1,4 @@
+const Path = require('node:path')
 const RequestParser = require('./RequestParser')
 const CompileManager = require('./CompileManager')
 const Settings = require('@overleaf/settings')
@@ -5,6 +6,7 @@ const Metrics = require('./Metrics')
 const ProjectPersistenceManager = require('./ProjectPersistenceManager')
 const logger = require('@overleaf/logger')
 const Errors = require('./Errors')
+const { notifyCLSICacheAboutBuild } = require('./CLSICacheHandler')
 
 let lastSuccessfulCompileTimestamp = 0
 
@@ -29,100 +31,135 @@ function compile(req, res, next) {
         if (error) {
           return next(error)
         }
-        CompileManager.doCompileWithLock(request, (error, result) => {
-          let { buildId, outputFiles, stats, timings } = result || {}
-          let code, status
-          if (outputFiles == null) {
-            outputFiles = []
-          }
-          if (error instanceof Errors.AlreadyCompilingError) {
-            code = 423 // Http 423 Locked
-            status = 'compile-in-progress'
-          } else if (error instanceof Errors.FilesOutOfSyncError) {
-            code = 409 // Http 409 Conflict
-            status = 'retry'
-            logger.warn(
-              {
+        const stats = {}
+        const timings = {}
+        CompileManager.doCompileWithLock(
+          request,
+          stats,
+          timings,
+          (error, result) => {
+            let { buildId, outputFiles } = result || {}
+            let code, status
+            if (outputFiles == null) {
+              outputFiles = []
+            }
+            if (error instanceof Errors.AlreadyCompilingError) {
+              code = 423 // Http 423 Locked
+              status = 'compile-in-progress'
+            } else if (error instanceof Errors.FilesOutOfSyncError) {
+              code = 409 // Http 409 Conflict
+              status = 'retry'
+              logger.warn(
+                {
+                  projectId: request.project_id,
+                  userId: request.user_id,
+                },
+                'files out of sync, please retry'
+              )
+            } else if (
+              error?.code === 'EPIPE' ||
+              error instanceof Errors.TooManyCompileRequestsError
+            ) {
+              // docker returns EPIPE when shutting down
+              code = 503 // send 503 Unavailable response
+              status = 'unavailable'
+            } else if (error?.terminated) {
+              status = 'terminated'
+            } else if (error?.validate) {
+              status = `validation-${error.validate}`
+            } else if (error?.timedout) {
+              status = 'timedout'
+              logger.debug(
+                { err: error, projectId: request.project_id },
+                'timeout running compile'
+              )
+            } else if (error) {
+              status = 'error'
+              code = 500
+              logger.error(
+                { err: error, projectId: request.project_id },
+                'error running compile'
+              )
+            } else {
+              if (
+                outputFiles.some(
+                  file => file.path === 'output.pdf' && file.size > 0
+                )
+              ) {
+                status = 'success'
+                lastSuccessfulCompileTimestamp = Date.now()
+              } else if (request.stopOnFirstError) {
+                status = 'stopped-on-first-error'
+              } else {
+                status = 'failure'
+                logger.warn(
+                  { projectId: request.project_id, outputFiles },
+                  'project failed to compile successfully, no output.pdf generated'
+                )
+              }
+
+              // log an error if any core files are found
+              if (outputFiles.some(file => file.path === 'core')) {
+                logger.error(
+                  { projectId: request.project_id, req, outputFiles },
+                  'core file found in output'
+                )
+              }
+            }
+
+            if (error) {
+              outputFiles = error.outputFiles || []
+              buildId = error.buildId
+            }
+
+            let clsiCacheShard
+            if (
+              status === 'success' &&
+              request.editorId &&
+              request.populateClsiCache
+            ) {
+              clsiCacheShard = notifyCLSICacheAboutBuild({
                 projectId: request.project_id,
                 userId: request.user_id,
+                buildId: outputFiles[0].build,
+                editorId: request.editorId,
+                outputFiles,
+                compileGroup: request.compileGroup,
+                options: {
+                  compiler: request.compiler,
+                  draft: request.draft,
+                  imageName: request.imageName
+                    ? request.imageName
+                    : undefined,
+                  rootResourcePath: request.rootResourcePath,
+                  stopOnFirstError: request.stopOnFirstError,
+                },
+              })
+            }
+
+            timer.done()
+            res.status(code || 200).send({
+              compile: {
+                status,
+                error: error?.message || error,
+                stats,
+                timings,
+                buildId,
+                clsiCacheShard,
+                outputUrlPrefix: Settings.apis.clsi.outputUrlPrefix,
+                outputFiles: outputFiles.map(file => ({
+                  url:
+                    `${Settings.apis.clsi.url}/project/${request.project_id}` +
+                    (request.user_id != null
+                      ? `/user/${request.user_id}`
+                      : '') +
+                    `/build/${file.build}/output/${file.path}`,
+                  ...file,
+                })),
               },
-              'files out of sync, please retry'
-            )
-          } else if (
-            error?.code === 'EPIPE' ||
-            error instanceof Errors.TooManyCompileRequestsError
-          ) {
-            // docker returns EPIPE when shutting down
-            code = 503 // send 503 Unavailable response
-            status = 'unavailable'
-          } else if (error?.terminated) {
-            status = 'terminated'
-          } else if (error?.validate) {
-            status = `validation-${error.validate}`
-          } else if (error?.timedout) {
-            status = 'timedout'
-            logger.debug(
-              { err: error, projectId: request.project_id },
-              'timeout running compile'
-            )
-          } else if (error) {
-            status = 'error'
-            code = 500
-            logger.error(
-              { err: error, projectId: request.project_id },
-              'error running compile'
-            )
-          } else {
-            if (
-              outputFiles.some(
-                file => file.path === 'output.pdf' && file.size > 0
-              )
-            ) {
-              status = 'success'
-              lastSuccessfulCompileTimestamp = Date.now()
-            } else if (request.stopOnFirstError) {
-              status = 'stopped-on-first-error'
-            } else {
-              status = 'failure'
-              logger.warn(
-                { projectId: request.project_id, outputFiles },
-                'project failed to compile successfully, no output.pdf generated'
-              )
-            }
-
-            // log an error if any core files are found
-            if (outputFiles.some(file => file.path === 'core')) {
-              logger.error(
-                { projectId: request.project_id, req, outputFiles },
-                'core file found in output'
-              )
-            }
+            })
           }
-
-          if (error) {
-            outputFiles = error.outputFiles || []
-            buildId = error.buildId
-          }
-
-          timer.done()
-          res.status(code || 200).send({
-            compile: {
-              status,
-              error: error?.message || error,
-              stats,
-              timings,
-              buildId,
-              outputUrlPrefix: Settings.apis.clsi.outputUrlPrefix,
-              outputFiles: outputFiles.map(file => ({
-                url:
-                  `${Settings.apis.clsi.url}/project/${request.project_id}` +
-                  (request.user_id != null ? `/user/${request.user_id}` : '') +
-                  `/build/${file.build}/output/${file.path}`,
-                ...file,
-              })),
-            },
-          })
-        })
+        )
       }
     )
   })
@@ -153,30 +190,27 @@ function clearCache(req, res, next) {
 }
 
 function syncFromCode(req, res, next) {
-  const { file } = req.query
+  const { file, editorId, buildId } = req.query
+  const compileFromClsiCache = req.query.compileFromClsiCache === 'true'
   const line = parseInt(req.query.line, 10)
   const column = parseInt(req.query.column, 10)
   const { imageName } = req.query
   const projectId = req.params.project_id
   const userId = req.params.user_id
-
-  if (imageName && !_isImageNameAllowed(imageName)) {
-    return res.status(400).send('invalid image')
-  }
-
   CompileManager.syncFromCode(
     projectId,
     userId,
     file,
     line,
     column,
-    imageName,
-    function (error, pdfPositions) {
+    { imageName, editorId, buildId, compileFromClsiCache },
+    function (error, pdfPositions, downloadedFromCache) {
       if (error) {
         return next(error)
       }
       res.json({
         pdf: pdfPositions,
+        downloadedFromCache,
       })
     }
   )
@@ -186,26 +220,24 @@ function syncFromPdf(req, res, next) {
   const page = parseInt(req.query.page, 10)
   const h = parseFloat(req.query.h)
   const v = parseFloat(req.query.v)
-  const { imageName } = req.query
+  const { imageName, editorId, buildId } = req.query
+  const compileFromClsiCache = req.query.compileFromClsiCache === 'true'
   const projectId = req.params.project_id
   const userId = req.params.user_id
-
-  if (imageName && !_isImageNameAllowed(imageName)) {
-    return res.status(400).send('invalid image')
-  }
   CompileManager.syncFromPdf(
     projectId,
     userId,
     page,
     h,
     v,
-    imageName,
-    function (error, codePositions) {
+    { imageName, editorId, buildId, compileFromClsiCache },
+    function (error, codePositions, downloadedFromCache) {
       if (error) {
         return next(error)
       }
       res.json({
         code: codePositions,
+        downloadedFromCache,
       })
     }
   )
@@ -216,9 +248,6 @@ function wordcount(req, res, next) {
   const projectId = req.params.project_id
   const userId = req.params.user_id
   const { image } = req.query
-  if (image && !_isImageNameAllowed(image)) {
-    return res.status(400).send('invalid image')
-  }
   logger.debug({ image, file, projectId }, 'word count request')
 
   CompileManager.wordcount(
@@ -241,12 +270,6 @@ function status(req, res, next) {
   res.send('OK')
 }
 
-function _isImageNameAllowed(imageName) {
-  const ALLOWED_IMAGES =
-    Settings.clsi && Settings.clsi.docker && Settings.clsi.docker.allowedImages
-  return !ALLOWED_IMAGES || ALLOWED_IMAGES.includes(imageName)
-}
-
 module.exports = {
   compile,
   stopCompile,
diff --git a/services/clsi/app/js/CompileManager.js b/services/clsi/app/js/CompileManager.js
index a98b138d0a..1b66927412 100644
--- a/services/clsi/app/js/CompileManager.js
+++ b/services/clsi/app/js/CompileManager.js
@@ -19,6 +19,11 @@ const Errors = require('./Errors')
 const CommandRunner = require('./CommandRunner')
 const { emitPdfStats } = require('./ContentCacheMetrics')
 const SynctexOutputParser = require('./SynctexOutputParser')
+const {
+  downloadLatestCompileCache,
+  downloadOutputDotSynctexFromCompileCache,
+} = require('./CLSICacheHandler')
+const { callbackifyMultiResult } = require('@overleaf/promise-utils')
 
 const COMPILE_TIME_BUCKETS = [
   // NOTE: These buckets are locked in per metric name.
@@ -42,22 +47,22 @@ function getOutputDir(projectId, userId) {
   return Path.join(Settings.path.outputDir, getCompileName(projectId, userId))
 }
 
-async function doCompileWithLock(request) {
+async function doCompileWithLock(request, stats, timings) {
   const compileDir = getCompileDir(request.project_id, request.user_id)
-  await fsPromises.mkdir(compileDir, { recursive: true })
+  request.isInitialCompile =
+    (await fsPromises.mkdir(compileDir, { recursive: true })) === compileDir
   // prevent simultaneous compiles
   const lock = LockManager.acquire(compileDir)
   try {
-    return await doCompile(request)
+    return await doCompile(request, stats, timings)
   } finally {
     lock.release()
   }
 }
 
-async function doCompile(request) {
+async function doCompile(request, stats, timings) {
+  const { project_id: projectId, user_id: userId } = request
   const compileDir = getCompileDir(request.project_id, request.user_id)
-  const stats = {}
-  const timings = {}
 
   const timerE2E = new Metrics.Timer(
     'compile-e2e-v2',
@@ -65,6 +70,25 @@ async function doCompile(request) {
     request.metricsOpts,
     COMPILE_TIME_BUCKETS
   )
+  if (request.isInitialCompile) {
+    stats.isInitialCompile = 1
+    request.metricsOpts.compile = 'initial'
+    if (request.compileFromClsiCache) {
+      try {
+        if (await downloadLatestCompileCache(projectId, userId, compileDir)) {
+          stats.restoredClsiCache = 1
+          request.metricsOpts.compile = 'from-clsi-cache'
+        }
+      } catch (err) {
+        logger.warn(
+          { err, projectId, userId },
+          'failed to populate compile dir from cache'
+        )
+      }
+    }
+  } else {
+    request.metricsOpts.compile = 'recompile'
+  }
   const writeToDiskTimer = new Metrics.Timer(
     'write-to-disk',
     1,
@@ -296,7 +320,7 @@ async function doCompile(request) {
     emitPdfStats(stats, timings, request)
   }
 
-  return { outputFiles, stats, timings, buildId }
+  return { outputFiles, buildId }
 }
 
 async function _saveOutputFiles({
@@ -408,14 +432,7 @@ async function _checkDirectory(compileDir) {
   return true
 }
 
-async function syncFromCode(
-  projectId,
-  userId,
-  filename,
-  line,
-  column,
-  imageName
-) {
+async function syncFromCode(projectId, userId, filename, line, column, opts) {
   // If LaTeX was run in a virtual environment, the file path that synctex expects
   // might not match the file path on the host. The .synctex.gz file however, will be accessed
   // wherever it is on the host.
@@ -431,15 +448,23 @@ async function syncFromCode(
     '-o',
     outputFilePath,
   ]
-  const stdout = await _runSynctex(projectId, userId, command, imageName)
+  const { stdout, downloadedFromCache } = await _runSynctex(
+    projectId,
+    userId,
+    command,
+    opts
+  )
   logger.debug(
     { projectId, userId, filename, line, column, command, stdout },
     'synctex code output'
   )
-  return SynctexOutputParser.parseViewOutput(stdout)
+  return {
+    codePositions: SynctexOutputParser.parseViewOutput(stdout),
+    downloadedFromCache,
+  }
 }
 
-async function syncFromPdf(projectId, userId, page, h, v, imageName) {
+async function syncFromPdf(projectId, userId, page, h, v, opts) {
   const compileName = getCompileName(projectId, userId)
   const baseDir = Settings.path.synctexBaseDir(compileName)
   const outputFilePath = `${baseDir}/output.pdf`
@@ -449,9 +474,17 @@ async function syncFromPdf(projectId, userId, page, h, v, imageName) {
     '-o',
     `${page}:${h}:${v}:${outputFilePath}`,
   ]
-  const stdout = await _runSynctex(projectId, userId, command, imageName)
+  const { stdout, downloadedFromCache } = await _runSynctex(
+    projectId,
+    userId,
+    command,
+    opts
+  )
   logger.debug({ projectId, userId, page, h, v, stdout }, 'synctex pdf output')
-  return SynctexOutputParser.parseEditOutput(stdout, baseDir)
+  return {
+    pdfPositions: SynctexOutputParser.parseEditOutput(stdout, baseDir),
+    downloadedFromCache,
+  }
 }
 
 async function _checkFileExists(dir, filename) {
@@ -478,32 +511,90 @@ async function _checkFileExists(dir, filename) {
   }
 }
 
-async function _runSynctex(projectId, userId, command, imageName) {
-  const directory = getCompileDir(projectId, userId)
+async function _runSynctex(projectId, userId, command, opts) {
+  const { imageName, editorId, buildId, compileFromClsiCache } = opts
+
+  if (imageName && !_isImageNameAllowed(imageName)) {
+    throw new Errors.InvalidParameter('invalid image')
+  }
+  if (editorId && !/^[a-f0-9-]+$/.test(editorId)) {
+    throw new Errors.InvalidParameter('invalid editorId')
+  }
+  if (buildId && !OutputCacheManager.BUILD_REGEX.test(buildId)) {
+    throw new Errors.InvalidParameter('invalid buildId')
+  }
+
+  const outputDir = getOutputDir(projectId, userId)
+  const runInOutputDir = buildId && CommandRunner.canRunSyncTeXInOutputDir()
+
+  const directory = runInOutputDir
+    ? Path.join(outputDir, OutputCacheManager.CACHE_SUBDIR, buildId)
+    : getCompileDir(projectId, userId)
   const timeout = 60 * 1000 // increased to allow for large projects
   const compileName = getCompileName(projectId, userId)
-  const compileGroup = 'synctex'
+  const compileGroup = runInOutputDir ? 'synctex-output' : 'synctex'
   const defaultImageName =
     Settings.clsi && Settings.clsi.docker && Settings.clsi.docker.image
-  await _checkFileExists(directory, 'output.synctex.gz')
-  try {
-    const output = await CommandRunner.promises.run(
-      compileName,
-      command,
-      directory,
-      imageName || defaultImageName,
-      timeout,
-      {},
-      compileGroup
-    )
-    return output.stdout
-  } catch (error) {
-    throw OError.tag(error, 'error running synctex', {
-      command,
-      projectId,
-      userId,
-    })
-  }
+  // eslint-disable-next-line @typescript-eslint/return-await
+  return await OutputCacheManager.promises.queueDirOperation(
+    outputDir,
+    /**
+     * @return {Promise<{stdout: string, downloadedFromCache: boolean}>}
+     */
+    async () => {
+      let downloadedFromCache = false
+      try {
+        await _checkFileExists(directory, 'output.synctex.gz')
+      } catch (err) {
+        if (
+          err instanceof Errors.NotFoundError &&
+          compileFromClsiCache &&
+          editorId &&
+          buildId
+        ) {
+          try {
+            downloadedFromCache =
+              await downloadOutputDotSynctexFromCompileCache(
+                projectId,
+                userId,
+                editorId,
+                buildId,
+                directory
+              )
+          } catch (err) {
+            logger.warn(
+              { err, projectId, userId, editorId, buildId },
+              'failed to download output.synctex.gz from clsi-cache'
+            )
+          }
+          await _checkFileExists(directory, 'output.synctex.gz')
+        } else {
+          throw err
+        }
+      }
+      try {
+        const { stdout } = await CommandRunner.promises.run(
+          compileName,
+          command,
+          directory,
+          imageName || defaultImageName,
+          timeout,
+          {},
+          compileGroup
+        )
+        return {
+          stdout,
+          downloadedFromCache,
+        }
+      } catch (error) {
+        throw OError.tag(error, 'error running synctex', {
+          command,
+          projectId,
+          userId,
+        })
+      }
+    }
+  )
 }
 
 async function wordcount(projectId, userId, filename, image) {
@@ -515,6 +606,10 @@ async function wordcount(projectId, userId, filename, image) {
   const compileName = getCompileName(projectId, userId)
   const compileGroup = 'wordcount'
 
+  if (image && !_isImageNameAllowed(image)) {
+    throw new Errors.InvalidParameter('invalid image')
+  }
+
   try {
     await fsPromises.mkdir(compileDir, { recursive: true })
   } catch (err) {
@@ -602,13 +697,25 @@ function _parseWordcountFromOutput(output) {
   return results
 }
 
+function _isImageNameAllowed(imageName) {
+  const ALLOWED_IMAGES =
+    Settings.clsi && Settings.clsi.docker && Settings.clsi.docker.allowedImages
+  return !ALLOWED_IMAGES || ALLOWED_IMAGES.includes(imageName)
+}
+
 module.exports = {
   doCompileWithLock: callbackify(doCompileWithLock),
   stopCompile: callbackify(stopCompile),
   clearProject: callbackify(clearProject),
   clearExpiredProjects: callbackify(clearExpiredProjects),
-  syncFromCode: callbackify(syncFromCode),
-  syncFromPdf: callbackify(syncFromPdf),
+  syncFromCode: callbackifyMultiResult(syncFromCode, [
+    'codePositions',
+    'downloadedFromCache',
+  ]),
+  syncFromPdf: callbackifyMultiResult(syncFromPdf, [
+    'pdfPositions',
+    'downloadedFromCache',
+  ]),
   wordcount: callbackify(wordcount),
   promises: {
     doCompileWithLock,
diff --git a/services/clsi/app/js/DockerRunner.js b/services/clsi/app/js/DockerRunner.js
index 7aac613db4..97053c1875 100644
--- a/services/clsi/app/js/DockerRunner.js
+++ b/services/clsi/app/js/DockerRunner.js
@@ -6,21 +6,12 @@ const dockerode = new Docker()
 const crypto = require('node:crypto')
 const async = require('async')
 const LockManager = require('./DockerLockManager')
-const fs = require('node:fs')
 const Path = require('node:path')
 const _ = require('lodash')
 
 const ONE_HOUR_IN_MS = 60 * 60 * 1000
 logger.debug('using docker runner')
 
-function usingSiblingContainers() {
-  return (
-    Settings != null &&
-    Settings.path != null &&
-    Settings.path.sandboxedCompilesHostDir != null
-  )
-}
-
 let containerMonitorTimeout
 let containerMonitorInterval
 
@@ -35,24 +26,6 @@ const DockerRunner = {
     compileGroup,
     callback
   ) {
-    if (usingSiblingContainers()) {
-      const _newPath = Settings.path.sandboxedCompilesHostDir
-      logger.debug(
-        { path: _newPath },
-        'altering bind path for sibling containers'
-      )
-      // Server Pro, example:
-      //   '/var/lib/overleaf/data/compiles/<project-id>'
-      //   ... becomes ...
-      //   '/opt/overleaf_data/data/compiles/<project-id>'
-      directory = Path.join(
-        Settings.path.sandboxedCompilesHostDir,
-        Path.basename(directory)
-      )
-    }
-
-    const volumes = { [directory]: '/compile' }
-
     command = command.map(arg =>
       arg.toString().replace('$COMPILE_DIR', '/compile')
     )
@@ -72,7 +45,32 @@ const DockerRunner = {
       image = `${Settings.texliveImageNameOveride}/${img[2]}`
     }
 
-    if (compileGroup === 'synctex' || compileGroup === 'wordcount') {
+    if (compileGroup === 'synctex-output') {
+      // In: directory = '/overleaf/services/clsi/output/projectId-userId/generated-files/buildId'
+      //             directory.split('/').slice(-3) === 'projectId-userId/generated-files/buildId'
+      //  sandboxedCompilesHostDirOutput = '/host/output'
+      // Out:                  directory = '/host/output/projectId-userId/generated-files/buildId'
+      directory = Path.join(
+        Settings.path.sandboxedCompilesHostDirOutput,
+        ...directory.split('/').slice(-3)
+      )
+    } else {
+      // In:   directory = '/overleaf/services/clsi/compiles/projectId-userId'
+      //                       Path.basename(directory) === 'projectId-userId'
+      //  sandboxedCompilesHostDirCompiles = '/host/compiles'
+      // Out:                    directory = '/host/compiles/projectId-userId'
+      directory = Path.join(
+        Settings.path.sandboxedCompilesHostDirCompiles,
+        Path.basename(directory)
+      )
+    }
+
+    const volumes = { [directory]: '/compile' }
+    if (
+      compileGroup === 'synctex' ||
+      compileGroup === 'synctex-output' ||
+      compileGroup === 'wordcount'
+    ) {
       volumes[directory] += ':ro'
     }
 
@@ -234,8 +232,8 @@ const DockerRunner = {
       }
     }
     // set the path based on the image year
-    const match = image.match(/:([0-9]+)\.[0-9]+/)
-    const year = match ? match[1] : '2014'
+    const match = image.match(/:([0-9]+)\.[0-9]+|:TL([0-9]+)/)
+    const year = match ? match[1] || match[2] : '2014'
     env.PATH = `/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/local/texlive/${year}/bin/x86_64-linux/`
     const options = {
       Cmd: command,
@@ -309,50 +307,17 @@ const DockerRunner = {
     LockManager.runWithLock(
       options.name,
       releaseLock =>
-        // Check that volumes exist before starting the container.
-        // When a container is started with volume pointing to a
-        // non-existent directory then docker creates the directory but
-        // with root ownership.
-        DockerRunner._checkVolumes(options, volumes, err => {
-          if (err != null) {
-            return releaseLock(err)
-          }
-          DockerRunner._startContainer(
-            options,
-            volumes,
-            attachStreamHandler,
-            releaseLock
-          )
-        }),
-
+        DockerRunner._startContainer(
+          options,
+          volumes,
+          attachStreamHandler,
+          releaseLock
+        ),
       callback
     )
   },
 
   // Check that volumes exist and are directories
-  _checkVolumes(options, volumes, callback) {
-    if (usingSiblingContainers()) {
-      // Server Pro, with sibling-containers active, skip checks
-      return callback(null)
-    }
-
-    const checkVolume = (path, cb) =>
-      fs.stat(path, (err, stats) => {
-        if (err != null) {
-          return cb(err)
-        }
-        if (!stats.isDirectory()) {
-          return cb(new Error('not a directory'))
-        }
-        cb()
-      })
-    const jobs = []
-    for (const vol in volumes) {
-      jobs.push(cb => checkVolume(vol, cb))
-    }
-    async.series(jobs, callback)
-  },
-
   _startContainer(options, volumes, attachStreamHandler, callback) {
     callback = _.once(callback)
     const { name } = options
@@ -617,6 +582,10 @@ const DockerRunner = {
       containerMonitorInterval = undefined
     }
   },
+
+  canRunSyncTeXInOutputDir() {
+    return Boolean(Settings.path.sandboxedCompilesHostDirOutput)
+  },
 }
 
 DockerRunner.startContainerMonitor()
diff --git a/services/clsi/app/js/Errors.js b/services/clsi/app/js/Errors.js
index 5c5fd3745a..64c3c7b59a 100644
--- a/services/clsi/app/js/Errors.js
+++ b/services/clsi/app/js/Errors.js
@@ -35,6 +35,7 @@ class QueueLimitReachedError extends OError {}
 class TimedOutError extends OError {}
 class NoXrefTableError extends OError {}
 class TooManyCompileRequestsError extends OError {}
+class InvalidParameter extends OError {}
 
 module.exports = Errors = {
   QueueLimitReachedError,
@@ -44,4 +45,5 @@ module.exports = Errors = {
   AlreadyCompilingError,
   NoXrefTableError,
   TooManyCompileRequestsError,
+  InvalidParameter,
 }
diff --git a/services/clsi/app/js/LocalCommandRunner.js b/services/clsi/app/js/LocalCommandRunner.js
index bac7d39400..aa62825443 100644
--- a/services/clsi/app/js/LocalCommandRunner.js
+++ b/services/clsi/app/js/LocalCommandRunner.js
@@ -54,6 +54,7 @@ module.exports = CommandRunner = {
       cwd: directory,
       env,
       stdio: ['pipe', 'pipe', 'ignore'],
+      detached: true,
     })
 
     let stdout = ''
@@ -99,6 +100,10 @@ module.exports = CommandRunner = {
     }
     return callback()
   },
+
+  canRunSyncTeXInOutputDir() {
+    return true
+  },
 }
 
 module.exports.promises = {
diff --git a/services/clsi/app/js/OutputCacheManager.js b/services/clsi/app/js/OutputCacheManager.js
index 1e9a10c921..a1a0a89aa7 100644
--- a/services/clsi/app/js/OutputCacheManager.js
+++ b/services/clsi/app/js/OutputCacheManager.js
@@ -83,6 +83,13 @@ async function cleanupDirectory(dir, options) {
   })
 }
 
+/**
+ * @template T
+ *
+ * @param {string} dir
+ * @param {() => Promise<T>} fn
+ * @return {Promise<T>}
+ */
 async function queueDirOperation(dir, fn) {
   const pending = PENDING_PROJECT_ACTIONS.get(dir) || Promise.resolve()
   const p = pending.then(fn, fn).finally(() => {
@@ -677,4 +684,5 @@ OutputCacheManager.promises = {
   saveOutputFilesInBuildDir: promisify(
     OutputCacheManager.saveOutputFilesInBuildDir
   ),
+  queueDirOperation,
 }
diff --git a/services/clsi/app/js/OutputFileArchiveManager.js b/services/clsi/app/js/OutputFileArchiveManager.js
index a64d634e12..64c5198392 100644
--- a/services/clsi/app/js/OutputFileArchiveManager.js
+++ b/services/clsi/app/js/OutputFileArchiveManager.js
@@ -93,8 +93,11 @@ module.exports = {
       )
 
       return outputFiles.filter(
-        // Ignore the pdf and also ignore the files ignored by the frontend.
-        ({ path }) => path !== 'output.pdf' && !ignoreFiles.includes(path)
+        // Ignore the pdf, clsi-cache tar-ball and also ignore the files ignored by the frontend.
+        ({ path }) =>
+          path !== 'output.pdf' &&
+          path !== 'output.tar.gz' &&
+          !ignoreFiles.includes(path)
       )
     } catch (error) {
       if (
diff --git a/services/clsi/app/js/ProjectPersistenceManager.js b/services/clsi/app/js/ProjectPersistenceManager.js
index 7d4f071d2c..41cdd07f4d 100644
--- a/services/clsi/app/js/ProjectPersistenceManager.js
+++ b/services/clsi/app/js/ProjectPersistenceManager.js
@@ -15,7 +15,6 @@ const logger = require('@overleaf/logger')
 const oneDay = 24 * 60 * 60 * 1000
 const Metrics = require('@overleaf/metrics')
 const Settings = require('@overleaf/settings')
-const diskusage = require('diskusage')
 const { callbackify } = require('node:util')
 const Path = require('node:path')
 const fs = require('node:fs')
@@ -23,6 +22,9 @@ const fs = require('node:fs')
 // projectId -> timestamp mapping.
 const LAST_ACCESS = new Map()
 
+let ANY_DISK_LOW = false
+let ANY_DISK_CRITICAL_LOW = false
+
 async function collectDiskStats() {
   const paths = [
     Settings.path.compilesDir,
@@ -31,19 +33,33 @@ async function collectDiskStats() {
   ]
 
   const diskStats = {}
+  let anyDiskLow = false
+  let anyDiskCriticalLow = false
   for (const path of paths) {
     try {
-      const stats = await diskusage.check(path)
+      const { blocks, bavail, bsize } = await fs.promises.statfs(path)
+      const stats = {
+        // Warning: these values will be wrong by a factor in Docker-for-Mac.
+        // See https://github.com/docker/for-mac/issues/2136
+        total: blocks * bsize, // Total size of the file system in bytes
+        available: bavail * bsize, // Free space available to unprivileged users.
+      }
       const diskAvailablePercent = (stats.available / stats.total) * 100
       Metrics.gauge('disk_available_percent', diskAvailablePercent, 1, {
         path,
       })
       const lowDisk = diskAvailablePercent < 10
       diskStats[path] = { stats, lowDisk }
+
+      const criticalLowDisk = diskAvailablePercent < 3
+      anyDiskLow = anyDiskLow || lowDisk
+      anyDiskCriticalLow = anyDiskCriticalLow || criticalLowDisk
     } catch (err) {
       logger.err({ err, path }, 'error getting disk usage')
     }
   }
+  ANY_DISK_LOW = anyDiskLow
+  ANY_DISK_CRITICAL_LOW = anyDiskCriticalLow
   return diskStats
 }
 
@@ -65,11 +81,22 @@ async function refreshExpiryTimeout() {
       break
     }
   }
+  Metrics.gauge(
+    'project_persistence_expiry_timeout',
+    ProjectPersistenceManager.EXPIRY_TIMEOUT
+  )
 }
 
 module.exports = ProjectPersistenceManager = {
   EXPIRY_TIMEOUT: Settings.project_cache_length_ms || oneDay * 2.5,
 
+  isAnyDiskLow() {
+    return ANY_DISK_LOW
+  },
+  isAnyDiskCriticalLow() {
+    return ANY_DISK_CRITICAL_LOW
+  },
+
   promises: {
     refreshExpiryTimeout,
   },
@@ -120,12 +147,12 @@ module.exports = ProjectPersistenceManager = {
       )
     })
 
-    // Collect disk stats frequently to have them ready the next time /metrics is scraped (60s +- jitter).
+    // Collect disk stats frequently to have them ready the next time /metrics is scraped (60s +- jitter) or every 5th scrape of the load agent (3s +- jitter).
     setInterval(() => {
       collectDiskStats().catch(err => {
         logger.err({ err }, 'low level error collecting disk stats')
       })
-    }, 50_000)
+    }, 15_000)
   },
 
   markProjectAsJustAccessed(projectId, callback) {
diff --git a/services/clsi/app/js/RequestParser.js b/services/clsi/app/js/RequestParser.js
index f5c07d3bcf..4e9d722921 100644
--- a/services/clsi/app/js/RequestParser.js
+++ b/services/clsi/app/js/RequestParser.js
@@ -3,6 +3,7 @@ const OutputCacheManager = require('./OutputCacheManager')
 
 const VALID_COMPILERS = ['pdflatex', 'latex', 'xelatex', 'lualatex']
 const MAX_TIMEOUT = 600
+const EDITOR_ID_REGEX = /^[a-f0-9-]{36}$/ // UUID
 
 function parse(body, callback) {
   const response = {}
@@ -28,12 +29,24 @@ function parse(body, callback) {
         default: '',
         type: 'string',
       }),
+      // Will be populated later. Must always be populated for prom library.
+      compile: 'initial',
     }
     response.compiler = _parseAttribute('compiler', compile.options.compiler, {
       validValues: VALID_COMPILERS,
       default: 'pdflatex',
       type: 'string',
     })
+    response.compileFromClsiCache = _parseAttribute(
+      'compileFromClsiCache',
+      compile.options.compileFromClsiCache,
+      { default: false, type: 'boolean' }
+    )
+    response.populateClsiCache = _parseAttribute(
+      'populateClsiCache',
+      compile.options.populateClsiCache,
+      { default: false, type: 'boolean' }
+    )
     response.enablePdfCaching = _parseAttribute(
       'enablePdfCaching',
       compile.options.enablePdfCaching,
@@ -137,6 +150,10 @@ function parse(body, callback) {
     )
     response.rootResourcePath = _checkPath(rootResourcePath)
 
+    response.editorId = _parseAttribute('editorId', compile.options.editorId, {
+      type: 'string',
+      regex: EDITOR_ID_REGEX,
+    })
     response.buildId = _parseAttribute('buildId', compile.options.buildId, {
       type: 'string',
       regex: OutputCacheManager.BUILD_REGEX,
diff --git a/services/clsi/app/js/ResourceWriter.js b/services/clsi/app/js/ResourceWriter.js
index 1db1c2baac..bf88538746 100644
--- a/services/clsi/app/js/ResourceWriter.js
+++ b/services/clsi/app/js/ResourceWriter.js
@@ -262,6 +262,7 @@ module.exports = ResourceWriter = {
       shouldDelete = false
     }
     if (
+      path === 'output.tar.gz' ||
       path === 'output.synctex.gz' ||
       path === 'output.pdfxref' ||
       path === 'output.pdf' ||
diff --git a/services/clsi/buildscript.txt b/services/clsi/buildscript.txt
index 756d5c3bb6..09c21888df 100644
--- a/services/clsi/buildscript.txt
+++ b/services/clsi/buildscript.txt
@@ -1,11 +1,11 @@
 clsi
 --data-dirs=cache,compiles,output
 --dependencies=
---docker-repos=gcr.io/overleaf-ops,us-east1-docker.pkg.dev/overleaf-ops/ol-docker
---env-add=ENABLE_PDF_CACHING="true",PDF_CACHING_ENABLE_WORKER_POOL="true",ALLOWED_IMAGES=quay.io/sharelatex/texlive-full:2017.1,TEXLIVE_IMAGE=quay.io/sharelatex/texlive-full:2017.1,TEX_LIVE_IMAGE_NAME_OVERRIDE=gcr.io/overleaf-ops,TEXLIVE_IMAGE_USER="tex",DOCKER_RUNNER="true",COMPILES_HOST_DIR=$PWD/compiles
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
+--env-add=ENABLE_PDF_CACHING="true",PDF_CACHING_ENABLE_WORKER_POOL="true",ALLOWED_IMAGES=quay.io/sharelatex/texlive-full:2017.1,TEXLIVE_IMAGE=quay.io/sharelatex/texlive-full:2017.1,TEX_LIVE_IMAGE_NAME_OVERRIDE=us-east1-docker.pkg.dev/overleaf-ops/ol-docker,TEXLIVE_IMAGE_USER="tex",SANDBOXED_COMPILES="true",SANDBOXED_COMPILES_HOST_DIR_COMPILES=$PWD/compiles,SANDBOXED_COMPILES_HOST_DIR_OUTPUT=$PWD/output
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=True
---script-version=4.5.0
+--script-version=4.7.0
 --use-large-ci-runner=True
diff --git a/services/clsi/config/settings.defaults.js b/services/clsi/config/settings.defaults.js
index 0f4111dc62..bd5614eb98 100644
--- a/services/clsi/config/settings.defaults.js
+++ b/services/clsi/config/settings.defaults.js
@@ -1,10 +1,8 @@
 const Path = require('node:path')
-const http = require('node:http')
-const https = require('node:https')
+const os = require('node:os')
 
-http.globalAgent.keepAlive = false
-https.globalAgent.keepAlive = false
 const isPreEmptible = process.env.PREEMPTIBLE === 'TRUE'
+const CLSI_SERVER_ID = os.hostname().replace('-ctr', '')
 
 module.exports = {
   compileSizeLimit: process.env.COMPILE_SIZE_LIMIT || '7mb',
@@ -48,12 +46,19 @@ module.exports = {
       url: `http://${process.env.CLSI_HOST || '127.0.0.1'}:3013`,
       // External url prefix for output files, e.g. for requests via load-balancers.
       outputUrlPrefix: `${process.env.ZONE ? `/zone/${process.env.ZONE}` : ''}`,
+      clsiServerId: process.env.CLSI_SERVER_ID || CLSI_SERVER_ID,
+
+      downloadHost: process.env.DOWNLOAD_HOST || 'http://localhost:3013',
     },
     clsiPerf: {
       host: `${process.env.CLSI_PERF_HOST || '127.0.0.1'}:${
         process.env.CLSI_PERF_PORT || '3043'
       }`,
     },
+    clsiCache: {
+      enabled: !!process.env.CLSI_CACHE_SHARDS,
+      shards: JSON.parse(process.env.CLSI_CACHE_SHARDS || '[]'),
+    },
   },
 
   smokeTest: process.env.SMOKE_TEST || false,
@@ -88,20 +93,21 @@ if (process.env.ALLOWED_COMPILE_GROUPS) {
   }
 }
 
-if (process.env.DOCKER_RUNNER) {
-  let seccompProfilePath
+if ((process.env.DOCKER_RUNNER || process.env.SANDBOXED_COMPILES) === 'true') {
   module.exports.clsi = {
-    dockerRunner: process.env.DOCKER_RUNNER === 'true',
+    dockerRunner: true,
     docker: {
       runtime: process.env.DOCKER_RUNTIME,
       image:
-        process.env.TEXLIVE_IMAGE || 'quay.io/sharelatex/texlive-full:2017.1',
+        process.env.TEXLIVE_IMAGE ||
+        process.env.TEX_LIVE_DOCKER_IMAGE ||
+        'quay.io/sharelatex/texlive-full:2017.1',
       env: {
         HOME: '/tmp',
         CLSI: 1,
       },
       socketPath: '/var/run/docker.sock',
-      user: process.env.TEXLIVE_IMAGE_USER || 'tex',
+      user: process.env.TEXLIVE_IMAGE_USER || 'www-data',
     },
     optimiseInDocker: true,
     expireProjectAfterIdleMs: 24 * 60 * 60 * 1000,
@@ -121,6 +127,7 @@ if (process.env.DOCKER_RUNNER) {
     const defaultCompileGroupConfig = {
       wordcount: { 'HostConfig.AutoRemove': true },
       synctex: { 'HostConfig.AutoRemove': true },
+      'synctex-output': { 'HostConfig.AutoRemove': true },
     }
     module.exports.clsi.docker.compileGroupConfig = Object.assign(
       defaultCompileGroupConfig,
@@ -131,11 +138,14 @@ if (process.env.DOCKER_RUNNER) {
     process.exit(1)
   }
 
+  let seccompProfilePath
   try {
     seccompProfilePath = Path.resolve(__dirname, '../seccomp/clsi-profile.json')
-    module.exports.clsi.docker.seccomp_profile = JSON.stringify(
-      JSON.parse(require('node:fs').readFileSync(seccompProfilePath))
-    )
+    module.exports.clsi.docker.seccomp_profile =
+      process.env.SECCOMP_PROFILE ||
+      JSON.stringify(
+        JSON.parse(require('node:fs').readFileSync(seccompProfilePath))
+      )
   } catch (error) {
     console.error(
       error,
@@ -165,5 +175,23 @@ if (process.env.DOCKER_RUNNER) {
 
   module.exports.path.synctexBaseDir = () => '/compile'
 
-  module.exports.path.sandboxedCompilesHostDir = process.env.COMPILES_HOST_DIR
+  module.exports.path.sandboxedCompilesHostDirCompiles =
+    process.env.SANDBOXED_COMPILES_HOST_DIR_COMPILES ||
+    process.env.SANDBOXED_COMPILES_HOST_DIR ||
+    process.env.COMPILES_HOST_DIR
+  if (!module.exports.path.sandboxedCompilesHostDirCompiles) {
+    throw new Error(
+      'SANDBOXED_COMPILES enabled, but SANDBOXED_COMPILES_HOST_DIR_COMPILES not set'
+    )
+  }
+
+  module.exports.path.sandboxedCompilesHostDirOutput =
+    process.env.SANDBOXED_COMPILES_HOST_DIR_OUTPUT ||
+    process.env.OUTPUT_HOST_DIR
+  if (!module.exports.path.sandboxedCompilesHostDirOutput) {
+    // TODO(das7pad): Enforce in a future major version of Server Pro.
+    // throw new Error(
+    //   'SANDBOXED_COMPILES enabled, but SANDBOXED_COMPILES_HOST_DIR_OUTPUT not set'
+    // )
+  }
 }
diff --git a/services/clsi/docker-compose.ci.yml b/services/clsi/docker-compose.ci.yml
index 00f54c6e72..77a45615b7 100644
--- a/services/clsi/docker-compose.ci.yml
+++ b/services/clsi/docker-compose.ci.yml
@@ -27,10 +27,11 @@ services:
       PDF_CACHING_ENABLE_WORKER_POOL: "true"
       ALLOWED_IMAGES: quay.io/sharelatex/texlive-full:2017.1
       TEXLIVE_IMAGE: quay.io/sharelatex/texlive-full:2017.1
-      TEX_LIVE_IMAGE_NAME_OVERRIDE: gcr.io/overleaf-ops
+      TEX_LIVE_IMAGE_NAME_OVERRIDE: us-east1-docker.pkg.dev/overleaf-ops/ol-docker
       TEXLIVE_IMAGE_USER: "tex"
-      DOCKER_RUNNER: "true"
-      COMPILES_HOST_DIR: $PWD/compiles
+      SANDBOXED_COMPILES: "true"
+      SANDBOXED_COMPILES_HOST_DIR_COMPILES: $PWD/compiles
+      SANDBOXED_COMPILES_HOST_DIR_OUTPUT: $PWD/output
     volumes:
       - ./compiles:/overleaf/services/clsi/compiles
       - /var/run/docker.sock:/var/run/docker.sock
diff --git a/services/clsi/docker-compose.yml b/services/clsi/docker-compose.yml
index a525c6029e..b8112a8e17 100644
--- a/services/clsi/docker-compose.yml
+++ b/services/clsi/docker-compose.yml
@@ -45,9 +45,10 @@ services:
       PDF_CACHING_ENABLE_WORKER_POOL: "true"
       ALLOWED_IMAGES: quay.io/sharelatex/texlive-full:2017.1
       TEXLIVE_IMAGE: quay.io/sharelatex/texlive-full:2017.1
-      TEX_LIVE_IMAGE_NAME_OVERRIDE: gcr.io/overleaf-ops
+      TEX_LIVE_IMAGE_NAME_OVERRIDE: us-east1-docker.pkg.dev/overleaf-ops/ol-docker
       TEXLIVE_IMAGE_USER: "tex"
-      DOCKER_RUNNER: "true"
-      COMPILES_HOST_DIR: $PWD/compiles
+      SANDBOXED_COMPILES: "true"
+      SANDBOXED_COMPILES_HOST_DIR_COMPILES: $PWD/compiles
+      SANDBOXED_COMPILES_HOST_DIR_OUTPUT: $PWD/output
     command: npm run --silent test:acceptance
 
diff --git a/services/clsi/entrypoint.sh b/services/clsi/entrypoint.sh
index bb551c91eb..b45899ab17 100755
--- a/services/clsi/entrypoint.sh
+++ b/services/clsi/entrypoint.sh
@@ -8,7 +8,6 @@ usermod -aG dockeronhost node
 # compatibility: initial volume setup
 mkdir -p /overleaf/services/clsi/cache && chown node:node /overleaf/services/clsi/cache
 mkdir -p /overleaf/services/clsi/compiles && chown node:node /overleaf/services/clsi/compiles
-mkdir -p /overleaf/services/clsi/db && chown node:node /overleaf/services/clsi/db
 mkdir -p /overleaf/services/clsi/output && chown node:node /overleaf/services/clsi/output
 
 exec runuser -u node -- "$@"
diff --git a/services/clsi/kube.yaml b/services/clsi/kube.yaml
deleted file mode 100644
index d3fb04291e..0000000000
--- a/services/clsi/kube.yaml
+++ /dev/null
@@ -1,41 +0,0 @@
-apiVersion: v1
-kind: Service
-metadata:
-  name: clsi
-  namespace: default
-spec:
-  type: LoadBalancer
-  ports:
-  - port: 80
-    protocol: TCP
-    targetPort: 80
-  selector:
-    run: clsi
----
-apiVersion: extensions/v1beta1
-kind: Deployment
-metadata:
-  name: clsi
-  namespace: default
-spec:
-  replicas: 2
-  template:
-    metadata:
-      labels:
-        run: clsi
-    spec:
-      containers:
-      - name: clsi
-        image: gcr.io/henry-terraform-admin/clsi
-        imagePullPolicy: Always
-        readinessProbe:
-          httpGet:
-            path: status
-            port: 80
-          periodSeconds: 5
-          initialDelaySeconds: 0
-          failureThreshold: 3
-          successThreshold: 1
-
-
-
diff --git a/services/clsi/package.json b/services/clsi/package.json
index 5df3f0e8b9..fe31c430bd 100644
--- a/services/clsi/package.json
+++ b/services/clsi/package.json
@@ -23,21 +23,21 @@
     "@overleaf/o-error": "*",
     "@overleaf/promise-utils": "*",
     "@overleaf/settings": "*",
+    "@overleaf/stream-utils": "*",
     "archiver": "5.3.2",
     "async": "^3.2.5",
     "body-parser": "^1.20.3",
     "bunyan": "^1.8.15",
-    "diskusage": "^1.1.3",
-    "dockerode": "^3.1.0",
+    "dockerode": "^4.0.7",
     "express": "^4.21.2",
     "lodash": "^4.17.21",
     "p-limit": "^3.1.0",
     "request": "^2.88.2",
     "send": "^0.19.0",
+    "tar-fs": "^3.0.9",
     "workerpool": "^6.1.5"
   },
   "devDependencies": {
-    "@types/workerpool": "^6.1.0",
     "chai": "^4.3.6",
     "chai-as-promised": "^7.1.1",
     "mocha": "^11.1.0",
diff --git a/services/clsi/seccomp/clsi-profile.json b/services/clsi/seccomp/clsi-profile.json
index 084354b15c..ad95130f76 100644
--- a/services/clsi/seccomp/clsi-profile.json
+++ b/services/clsi/seccomp/clsi-profile.json
@@ -829,13 +829,19 @@
             "args": []
         },
         {
-          "name": "gettimeofday",
-          "action": "SCMP_ACT_ALLOW",
-          "args": []
-        }, {
-          "name": "epoll_pwait",
-          "action": "SCMP_ACT_ALLOW",
-          "args": []
+            "name": "gettimeofday",
+            "action": "SCMP_ACT_ALLOW",
+            "args": []
+        },
+        {
+            "name": "epoll_pwait",
+            "action": "SCMP_ACT_ALLOW",
+            "args": []
+        },
+        {
+            "name": "poll",
+            "action": "SCMP_ACT_ALLOW",
+            "args": []
         }
     ]
-}
\ No newline at end of file
+}
diff --git a/services/clsi/test/acceptance/js/AllowedImageNamesTests.js b/services/clsi/test/acceptance/js/AllowedImageNamesTests.js
index 897f5d9c85..9cd7a65930 100644
--- a/services/clsi/test/acceptance/js/AllowedImageNamesTests.js
+++ b/services/clsi/test/acceptance/js/AllowedImageNamesTests.js
@@ -109,6 +109,7 @@ Hello world
                 width: 343.71106,
               },
             ],
+            downloadedFromCache: false,
           })
           done()
         }
@@ -146,6 +147,7 @@ Hello world
           expect(error).to.not.exist
           expect(result).to.deep.equal({
             code: [{ file: 'main.tex', line: 3, column: -1 }],
+            downloadedFromCache: false,
           })
           done()
         }
diff --git a/services/clsi/test/acceptance/js/BrokenLatexFileTests.js b/services/clsi/test/acceptance/js/BrokenLatexFileTests.js
index d22c142cff..46d07da092 100644
--- a/services/clsi/test/acceptance/js/BrokenLatexFileTests.js
+++ b/services/clsi/test/acceptance/js/BrokenLatexFileTests.js
@@ -11,6 +11,7 @@
 const Client = require('./helpers/Client')
 const request = require('request')
 const ClsiApp = require('./helpers/ClsiApp')
+const { expect } = require('chai')
 
 describe('Broken LaTeX file', function () {
   before(function (done) {
@@ -62,6 +63,10 @@ Hello world
       return this.body.compile.status.should.equal('failure')
     })
 
+    it('should return isInitialCompile flag', function () {
+      expect(this.body.compile.stats.isInitialCompile).to.equal(1)
+    })
+
     it('should return output files', function () {
       // NOTE: No output.pdf file.
       this.body.compile.outputFiles
@@ -98,6 +103,10 @@ Hello world
       return this.body.compile.status.should.equal('failure')
     })
 
+    it('should not return isInitialCompile flag', function () {
+      expect(this.body.compile.stats.isInitialCompile).to.not.exist
+    })
+
     it('should return output files', function () {
       // NOTE: No output.pdf file.
       this.body.compile.outputFiles
diff --git a/services/clsi/test/acceptance/js/StopCompile.js b/services/clsi/test/acceptance/js/StopCompile.js
new file mode 100644
index 0000000000..103a70f37d
--- /dev/null
+++ b/services/clsi/test/acceptance/js/StopCompile.js
@@ -0,0 +1,47 @@
+const Client = require('./helpers/Client')
+const ClsiApp = require('./helpers/ClsiApp')
+const { expect } = require('chai')
+
+describe('Stop compile', function () {
+  before(function (done) {
+    this.request = {
+      options: {
+        timeout: 100,
+      }, // seconds
+      resources: [
+        {
+          path: 'main.tex',
+          content: `\
+\\documentclass{article}
+\\begin{document}
+\\def\\x{Hello!\\par\\x}
+\\x
+\\end{document}\
+`,
+        },
+      ],
+    }
+    this.project_id = Client.randomId()
+    ClsiApp.ensureRunning(() => {
+      // start the compile in the background
+      Client.compile(this.project_id, this.request, (error, res, body) => {
+        this.compileResult = { error, res, body }
+      })
+      // wait for 1 second before stopping the compile
+      setTimeout(() => {
+        Client.stopCompile(this.project_id, (error, res, body) => {
+          this.stopResult = { error, res, body }
+          setTimeout(done, 1000) // allow time for the compile request to terminate
+        })
+      }, 1000)
+    })
+  })
+
+  it('should force a compile response with an error status', function () {
+    expect(this.stopResult.error).to.be.null
+    expect(this.stopResult.res.statusCode).to.equal(204)
+    expect(this.compileResult.res.statusCode).to.equal(200)
+    expect(this.compileResult.body.compile.status).to.equal('terminated')
+    expect(this.compileResult.body.compile.error).to.equal('terminated')
+  })
+})
diff --git a/services/clsi/test/acceptance/js/SynctexTests.js b/services/clsi/test/acceptance/js/SynctexTests.js
index 5ba5bb5b5f..049f260259 100644
--- a/services/clsi/test/acceptance/js/SynctexTests.js
+++ b/services/clsi/test/acceptance/js/SynctexTests.js
@@ -67,6 +67,7 @@ Hello world
                 width: 343.71106,
               },
             ],
+            downloadedFromCache: false,
           })
           return done()
         }
@@ -87,6 +88,7 @@ Hello world
           }
           expect(codePositions).to.deep.equal({
             code: [{ file: 'main.tex', line: 3, column: -1 }],
+            downloadedFromCache: false,
           })
           return done()
         }
diff --git a/services/clsi/test/acceptance/js/TimeoutTests.js b/services/clsi/test/acceptance/js/TimeoutTests.js
index bca8ae71d2..e9175d223c 100644
--- a/services/clsi/test/acceptance/js/TimeoutTests.js
+++ b/services/clsi/test/acceptance/js/TimeoutTests.js
@@ -11,6 +11,7 @@
 const Client = require('./helpers/Client')
 const request = require('request')
 const ClsiApp = require('./helpers/ClsiApp')
+const { expect } = require('chai')
 
 describe('Timed out compile', function () {
   before(function (done) {
@@ -54,6 +55,10 @@ describe('Timed out compile', function () {
     return this.body.compile.status.should.equal('timedout')
   })
 
+  it('should return isInitialCompile flag', function () {
+    expect(this.body.compile.stats.isInitialCompile).to.equal(1)
+  })
+
   return it('should return the log output file name', function () {
     const outputFilePaths = this.body.compile.outputFiles.map(x => x.path)
     return outputFilePaths.should.include('output.log')
diff --git a/services/clsi/test/acceptance/js/helpers/Client.js b/services/clsi/test/acceptance/js/helpers/Client.js
index a0bdce734f..49bf7390c6 100644
--- a/services/clsi/test/acceptance/js/helpers/Client.js
+++ b/services/clsi/test/acceptance/js/helpers/Client.js
@@ -42,6 +42,16 @@ module.exports = Client = {
     )
   },
 
+  stopCompile(projectId, callback) {
+    if (callback == null) {
+      callback = function () {}
+    }
+    return request.post(
+      { url: `${this.host}/project/${projectId}/compile/stop` },
+      callback
+    )
+  },
+
   clearCache(projectId, callback) {
     if (callback == null) {
       callback = function () {}
diff --git a/services/clsi/test/setup.js b/services/clsi/test/setup.js
index 19e1ae7165..b17507bf92 100644
--- a/services/clsi/test/setup.js
+++ b/services/clsi/test/setup.js
@@ -20,7 +20,7 @@ SandboxedModule.configure({
       err() {},
     },
   },
-  globals: { Buffer, console, process, URL },
+  globals: { Buffer, console, process, URL, Math },
   sourceTransformers: {
     removeNodePrefix: function (source) {
       return source.replace(/require\(['"]node:/g, "require('")
diff --git a/services/clsi/test/unit/js/CompileControllerTests.js b/services/clsi/test/unit/js/CompileControllerTests.js
index d97e433f29..2ac8d9c2d7 100644
--- a/services/clsi/test/unit/js/CompileControllerTests.js
+++ b/services/clsi/test/unit/js/CompileControllerTests.js
@@ -1,54 +1,11 @@
 const SandboxedModule = require('sandboxed-module')
 const sinon = require('sinon')
-const { expect } = require('chai')
 const modulePath = require('node:path').join(
   __dirname,
   '../../../app/js/CompileController'
 )
 const Errors = require('../../../app/js/Errors')
 
-function tryImageNameValidation(method, imageNameField) {
-  describe('when allowedImages is set', function () {
-    beforeEach(function () {
-      this.Settings.clsi = { docker: {} }
-      this.Settings.clsi.docker.allowedImages = [
-        'repo/image:tag1',
-        'repo/image:tag2',
-      ]
-      this.res.send = sinon.stub()
-      this.res.status = sinon.stub().returns({ send: this.res.send })
-
-      this.CompileManager[method].reset()
-    })
-
-    describe('with an invalid image', function () {
-      beforeEach(function () {
-        this.req.query[imageNameField] = 'something/evil:1337'
-        this.CompileController[method](this.req, this.res, this.next)
-      })
-      it('should return a 400', function () {
-        expect(this.res.status.calledWith(400)).to.equal(true)
-      })
-      it('should not run the query', function () {
-        expect(this.CompileManager[method].called).to.equal(false)
-      })
-    })
-
-    describe('with a valid image', function () {
-      beforeEach(function () {
-        this.req.query[imageNameField] = 'repo/image:tag1'
-        this.CompileController[method](this.req, this.res, this.next)
-      })
-      it('should not return a 400', function () {
-        expect(this.res.status.calledWith(400)).to.equal(false)
-      })
-      it('should run the query', function () {
-        expect(this.CompileManager[method].called).to.equal(true)
-      })
-    })
-  })
-}
-
 describe('CompileController', function () {
   beforeEach(function () {
     this.buildId = 'build-id-123'
@@ -61,6 +18,11 @@ describe('CompileController', function () {
             clsi: {
               url: 'http://clsi.example.com',
               outputUrlPrefix: '/zone/b',
+              downloadHost: 'http://localhost:3013',
+            },
+            clsiCache: {
+              enabled: false,
+              url: 'http://localhost:3044',
             },
           },
         }),
@@ -68,6 +30,11 @@ describe('CompileController', function () {
           Timer: sinon.stub().returns({ done: sinon.stub() }),
         },
         './ProjectPersistenceManager': (this.ProjectPersistenceManager = {}),
+        './CLSICacheHandler': {
+          notifyCLSICacheAboutBuild: sinon.stub(),
+          downloadLatestCompileCache: sinon.stub().resolves(),
+          downloadOutputDotSynctexFromCompileCache: sinon.stub().resolves(),
+        },
         './Errors': (this.Erros = Errors),
       },
     })
@@ -113,16 +80,21 @@ describe('CompileController', function () {
       this.timings = { bar: 2 }
       this.res.status = sinon.stub().returnsThis()
       this.res.send = sinon.stub()
+
+      this.CompileManager.doCompileWithLock = sinon
+        .stub()
+        .callsFake((_req, stats, timings, cb) => {
+          Object.assign(stats, this.stats)
+          Object.assign(timings, this.timings)
+          cb(null, {
+            outputFiles: this.output_files,
+            buildId: this.buildId,
+          })
+        })
     })
 
     describe('successfully', function () {
       beforeEach(function () {
-        this.CompileManager.doCompileWithLock = sinon.stub().yields(null, {
-          outputFiles: this.output_files,
-          stats: this.stats,
-          timings: this.timings,
-          buildId: this.buildId,
-        })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -157,6 +129,7 @@ describe('CompileController', function () {
                 url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
                 ...file,
               })),
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -166,12 +139,6 @@ describe('CompileController', function () {
     describe('without a outputUrlPrefix', function () {
       beforeEach(function () {
         this.Settings.apis.clsi.outputUrlPrefix = ''
-        this.CompileManager.doCompileWithLock = sinon.stub().yields(null, {
-          outputFiles: this.output_files,
-          stats: this.stats,
-          timings: this.timings,
-          buildId: this.buildId,
-        })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -190,6 +157,7 @@ describe('CompileController', function () {
                 url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
                 ...file,
               })),
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -210,33 +178,36 @@ describe('CompileController', function () {
             build: 1234,
           },
         ]
-        this.CompileManager.doCompileWithLock = sinon.stub().yields(null, {
-          outputFiles: this.output_files,
-          stats: this.stats,
-          timings: this.timings,
-          buildId: this.buildId,
-        })
+        this.CompileManager.doCompileWithLock = sinon
+          .stub()
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(null, {
+              outputFiles: this.output_files,
+              buildId: this.buildId,
+            })
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
       it('should return the JSON response with status failure', function () {
         this.res.status.calledWith(200).should.equal(true)
-        this.res.send
-          .calledWith({
-            compile: {
-              status: 'failure',
-              error: null,
-              stats: this.stats,
-              timings: this.timings,
-              outputUrlPrefix: '/zone/b',
-              buildId: this.buildId,
-              outputFiles: this.output_files.map(file => ({
-                url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
-                ...file,
-              })),
-            },
-          })
-          .should.equal(true)
+        this.res.send.should.have.been.calledWith({
+          compile: {
+            status: 'failure',
+            error: null,
+            stats: this.stats,
+            timings: this.timings,
+            outputUrlPrefix: '/zone/b',
+            buildId: this.buildId,
+            outputFiles: this.output_files.map(file => ({
+              url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
+              ...file,
+            })),
+            clsiCacheShard: undefined,
+          },
+        })
       })
     })
 
@@ -255,33 +226,36 @@ describe('CompileController', function () {
             build: 1234,
           },
         ]
-        this.CompileManager.doCompileWithLock = sinon.stub().yields(null, {
-          outputFiles: this.output_files,
-          stats: this.stats,
-          timings: this.timings,
-          buildId: this.buildId,
-        })
+        this.CompileManager.doCompileWithLock = sinon
+          .stub()
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(null, {
+              outputFiles: this.output_files,
+              buildId: this.buildId,
+            })
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
       it('should return the JSON response with status failure', function () {
         this.res.status.calledWith(200).should.equal(true)
-        this.res.send
-          .calledWith({
-            compile: {
-              status: 'failure',
-              error: null,
-              stats: this.stats,
-              buildId: this.buildId,
-              timings: this.timings,
-              outputUrlPrefix: '/zone/b',
-              outputFiles: this.output_files.map(file => ({
-                url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
-                ...file,
-              })),
-            },
-          })
-          .should.equal(true)
+        this.res.send.should.have.been.calledWith({
+          compile: {
+            status: 'failure',
+            error: null,
+            stats: this.stats,
+            buildId: this.buildId,
+            timings: this.timings,
+            outputUrlPrefix: '/zone/b',
+            outputFiles: this.output_files.map(file => ({
+              url: `${this.Settings.apis.clsi.url}/project/${this.project_id}/build/${file.build}/output/${file.path}`,
+              ...file,
+            })),
+            clsiCacheShard: undefined,
+          },
+        })
       })
     })
 
@@ -291,7 +265,11 @@ describe('CompileController', function () {
         error.buildId = this.buildId
         this.CompileManager.doCompileWithLock = sinon
           .stub()
-          .callsArgWith(1, error, null)
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(error)
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -305,9 +283,9 @@ describe('CompileController', function () {
               outputUrlPrefix: '/zone/b',
               outputFiles: [],
               buildId: this.buildId,
-              // JSON.stringify will omit these
-              stats: undefined,
-              timings: undefined,
+              stats: this.stats,
+              timings: this.timings,
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -321,7 +299,11 @@ describe('CompileController', function () {
         )
         this.CompileManager.doCompileWithLock = sinon
           .stub()
-          .callsArgWith(1, error, null)
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(error)
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -334,9 +316,11 @@ describe('CompileController', function () {
               error: 'too many concurrent compile requests',
               outputUrlPrefix: '/zone/b',
               outputFiles: [],
+              stats: this.stats,
+              timings: this.timings,
+              // JSON.stringify will omit these undefined values
               buildId: undefined,
-              stats: undefined,
-              timings: undefined,
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -349,7 +333,11 @@ describe('CompileController', function () {
         this.error.timedout = true
         this.CompileManager.doCompileWithLock = sinon
           .stub()
-          .callsArgWith(1, this.error, null)
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(this.error)
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -362,10 +350,11 @@ describe('CompileController', function () {
               error: this.message,
               outputUrlPrefix: '/zone/b',
               outputFiles: [],
-              // JSON.stringify will omit these
+              stats: this.stats,
+              timings: this.timings,
+              // JSON.stringify will omit these undefined values
               buildId: undefined,
-              stats: undefined,
-              timings: undefined,
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -376,7 +365,11 @@ describe('CompileController', function () {
       beforeEach(function () {
         this.CompileManager.doCompileWithLock = sinon
           .stub()
-          .callsArgWith(1, null, [])
+          .callsFake((_req, stats, timings, cb) => {
+            Object.assign(stats, this.stats)
+            Object.assign(timings, this.timings)
+            cb(null, {})
+          })
         this.CompileController.compile(this.req, this.res)
       })
 
@@ -389,10 +382,11 @@ describe('CompileController', function () {
               status: 'failure',
               outputUrlPrefix: '/zone/b',
               outputFiles: [],
-              // JSON.stringify will omit these
+              stats: this.stats,
+              timings: this.timings,
+              // JSON.stringify will omit these undefined values
               buildId: undefined,
-              stats: undefined,
-              timings: undefined,
+              clsiCacheShard: undefined,
             },
           })
           .should.equal(true)
@@ -416,7 +410,7 @@ describe('CompileController', function () {
 
       this.CompileManager.syncFromCode = sinon
         .stub()
-        .yields(null, (this.pdfPositions = ['mock-positions']))
+        .yields(null, (this.pdfPositions = ['mock-positions']), true)
       this.CompileController.syncFromCode(this.req, this.res, this.next)
     })
 
@@ -436,11 +430,10 @@ describe('CompileController', function () {
       this.res.json
         .calledWith({
           pdf: this.pdfPositions,
+          downloadedFromCache: true,
         })
         .should.equal(true)
     })
-
-    tryImageNameValidation('syncFromCode', 'imageName')
   })
 
   describe('syncFromPdf', function () {
@@ -459,7 +452,7 @@ describe('CompileController', function () {
 
       this.CompileManager.syncFromPdf = sinon
         .stub()
-        .yields(null, (this.codePositions = ['mock-positions']))
+        .yields(null, (this.codePositions = ['mock-positions']), true)
       this.CompileController.syncFromPdf(this.req, this.res, this.next)
     })
 
@@ -473,11 +466,10 @@ describe('CompileController', function () {
       this.res.json
         .calledWith({
           code: this.codePositions,
+          downloadedFromCache: true,
         })
         .should.equal(true)
     })
-
-    tryImageNameValidation('syncFromPdf', 'imageName')
   })
 
   describe('wordcount', function () {
@@ -511,7 +503,5 @@ describe('CompileController', function () {
         })
         .should.equal(true)
     })
-
-    tryImageNameValidation('wordcount', 'image')
   })
 })
diff --git a/services/clsi/test/unit/js/CompileManagerTests.js b/services/clsi/test/unit/js/CompileManagerTests.js
index 8d7aff4910..30ef538ac3 100644
--- a/services/clsi/test/unit/js/CompileManagerTests.js
+++ b/services/clsi/test/unit/js/CompileManagerTests.js
@@ -35,7 +35,7 @@ describe('CompileManager', function () {
         build: 1234,
       },
     ]
-    this.buildId = 'build-id-123'
+    this.buildId = '00000000000-0000000000000000'
     this.commandOutput = 'Dummy output'
     this.compileBaseDir = '/compile/dir'
     this.outputBaseDir = '/output/dir'
@@ -61,7 +61,10 @@ describe('CompileManager', function () {
       },
     }
     this.OutputCacheManager = {
+      BUILD_REGEX: /^[0-9a-f]+-[0-9a-f]+$/,
+      CACHE_SUBDIR: 'generated-files',
       promises: {
+        queueDirOperation: sinon.stub().callsArg(1),
         saveOutputFiles: sinon
           .stub()
           .resolves({ outputFiles: this.buildFiles, buildId: this.buildId }),
@@ -87,9 +90,10 @@ describe('CompileManager', function () {
       execFile: sinon.stub().yields(),
     }
     this.CommandRunner = {
+      canRunSyncTeXInOutputDir: sinon.stub().returns(false),
       promises: {
         run: sinon.stub().callsFake((_1, _2, _3, _4, _5, _6, compileGroup) => {
-          if (compileGroup === 'synctex') {
+          if (compileGroup === 'synctex' || compileGroup === 'synctex-output') {
             return Promise.resolve({ stdout: this.commandOutput })
           } else {
             return Promise.resolve({
@@ -140,6 +144,12 @@ describe('CompileManager', function () {
       .withArgs(Path.join(this.compileDir, 'output.synctex.gz'))
       .resolves(this.fileStats)
 
+    this.CLSICacheHandler = {
+      notifyCLSICacheAboutBuild: sinon.stub(),
+      downloadLatestCompileCache: sinon.stub().resolves(),
+      downloadOutputDotSynctexFromCompileCache: sinon.stub().resolves(),
+    }
+
     this.CompileManager = SandboxedModule.require(MODULE_PATH, {
       requires: {
         './LatexRunner': this.LatexRunner,
@@ -160,6 +170,7 @@ describe('CompileManager', function () {
         './LockManager': this.LockManager,
         './SynctexOutputParser': this.SynctexOutputParser,
         'fs/promises': this.fsPromises,
+        './CLSICacheHandler': this.CLSICacheHandler,
       },
     })
   })
@@ -177,6 +188,11 @@ describe('CompileManager', function () {
         flags: (this.flags = ['-file-line-error']),
         compileGroup: (this.compileGroup = 'compile-group'),
         stopOnFirstError: false,
+        metricsOpts: {
+          path: 'clsi-perf',
+          method: 'minimal',
+          compile: 'initial',
+        },
       }
       this.env = {
         OVERLEAF_PROJECT_ID: this.projectId,
@@ -188,7 +204,7 @@ describe('CompileManager', function () {
         const error = new Error('locked')
         this.LockManager.acquire.throws(error)
         await expect(
-          this.CompileManager.promises.doCompileWithLock(this.request)
+          this.CompileManager.promises.doCompileWithLock(this.request, {}, {})
         ).to.be.rejectedWith(error)
       })
 
@@ -206,7 +222,9 @@ describe('CompileManager', function () {
     describe('normally', function () {
       beforeEach(async function () {
         this.result = await this.CompileManager.promises.doCompileWithLock(
-          this.request
+          this.request,
+          {},
+          {}
         )
       })
 
@@ -260,7 +278,11 @@ describe('CompileManager', function () {
     describe('with draft mode', function () {
       beforeEach(async function () {
         this.request.draft = true
-        await this.CompileManager.promises.doCompileWithLock(this.request)
+        await this.CompileManager.promises.doCompileWithLock(
+          this.request,
+          {},
+          {}
+        )
       })
 
       it('should inject the draft mode header', function () {
@@ -273,7 +295,11 @@ describe('CompileManager', function () {
     describe('with a check option', function () {
       beforeEach(async function () {
         this.request.check = 'error'
-        await this.CompileManager.promises.doCompileWithLock(this.request)
+        await this.CompileManager.promises.doCompileWithLock(
+          this.request,
+          {},
+          {}
+        )
       })
 
       it('should run chktex', function () {
@@ -305,7 +331,11 @@ describe('CompileManager', function () {
       beforeEach(async function () {
         this.request.rootResourcePath = 'main.Rtex'
         this.request.check = 'error'
-        await this.CompileManager.promises.doCompileWithLock(this.request)
+        await this.CompileManager.promises.doCompileWithLock(
+          this.request,
+          {},
+          {}
+        )
       })
 
       it('should not run chktex', function () {
@@ -334,7 +364,7 @@ describe('CompileManager', function () {
         error.timedout = true
         this.LatexRunner.promises.runLatex.rejects(error)
         await expect(
-          this.CompileManager.promises.doCompileWithLock(this.request)
+          this.CompileManager.promises.doCompileWithLock(this.request, {}, {})
         ).to.be.rejected
       })
 
@@ -357,7 +387,7 @@ describe('CompileManager', function () {
         error.terminated = true
         this.LatexRunner.promises.runLatex.rejects(error)
         await expect(
-          this.CompileManager.promises.doCompileWithLock(this.request)
+          this.CompileManager.promises.doCompileWithLock(this.request, {}, {})
         ).to.be.rejected
       })
 
@@ -437,12 +467,83 @@ describe('CompileManager', function () {
             this.compileDir,
             this.Settings.clsi.docker.image,
             60000,
-            {}
+            {},
+            'synctex'
           )
         })
 
         it('should return the parsed output', function () {
-          expect(this.result).to.deep.equal(this.records)
+          expect(this.result).to.deep.equal({
+            codePositions: this.records,
+            downloadedFromCache: false,
+          })
+        })
+      })
+
+      describe('from cache in docker', function () {
+        beforeEach(async function () {
+          this.CommandRunner.canRunSyncTeXInOutputDir.returns(true)
+          this.Settings.path.synctexBaseDir
+            .withArgs(`${this.projectId}-${this.userId}`)
+            .returns('/compile')
+
+          const errNotFound = new Error()
+          errNotFound.code = 'ENOENT'
+          this.outputDir = `${this.outputBaseDir}/${this.projectId}-${this.userId}/${this.OutputCacheManager.CACHE_SUBDIR}/${this.buildId}`
+          const filename = Path.join(this.outputDir, 'output.synctex.gz')
+          this.fsPromises.stat
+            .withArgs(this.outputDir)
+            .onFirstCall()
+            .rejects(errNotFound)
+          this.fsPromises.stat
+            .withArgs(this.outputDir)
+            .onSecondCall()
+            .resolves(this.dirStats)
+          this.fsPromises.stat.withArgs(filename).resolves(this.fileStats)
+          this.CLSICacheHandler.downloadOutputDotSynctexFromCompileCache.resolves(
+            true
+          )
+          this.result = await this.CompileManager.promises.syncFromCode(
+            this.projectId,
+            this.userId,
+            this.filename,
+            this.line,
+            this.column,
+            {
+              imageName: 'image',
+              editorId: '00000000-0000-0000-0000-000000000000',
+              buildId: this.buildId,
+              compileFromClsiCache: true,
+            }
+          )
+        })
+
+        it('should run in output dir', function () {
+          const outputFilePath = '/compile/output.pdf'
+          const inputFilePath = `/compile/${this.filename}`
+          expect(this.CommandRunner.promises.run).to.have.been.calledWith(
+            `${this.projectId}-${this.userId}`,
+            [
+              'synctex',
+              'view',
+              '-i',
+              `${this.line}:${this.column}:${inputFilePath}`,
+              '-o',
+              outputFilePath,
+            ],
+            this.outputDir,
+            'image',
+            60000,
+            {},
+            'synctex-output'
+          )
+        })
+
+        it('should return the parsed output', function () {
+          expect(this.result).to.deep.equal({
+            codePositions: this.records,
+            downloadedFromCache: true,
+          })
         })
       })
 
@@ -455,7 +556,7 @@ describe('CompileManager', function () {
             this.filename,
             this.line,
             this.column,
-            customImageName
+            { imageName: customImageName }
           )
         })
 
@@ -475,7 +576,8 @@ describe('CompileManager', function () {
             this.compileDir,
             customImageName,
             60000,
-            {}
+            {},
+            'synctex'
           )
         })
       })
@@ -497,7 +599,7 @@ describe('CompileManager', function () {
             this.page,
             this.h,
             this.v,
-            ''
+            { imageName: '' }
           )
         })
 
@@ -519,7 +621,10 @@ describe('CompileManager', function () {
         })
 
         it('should return the parsed output', function () {
-          expect(this.result).to.deep.equal(this.records)
+          expect(this.result).to.deep.equal({
+            pdfPositions: this.records,
+            downloadedFromCache: false,
+          })
         })
       })
 
@@ -532,7 +637,7 @@ describe('CompileManager', function () {
             this.page,
             this.h,
             this.v,
-            customImageName
+            { imageName: customImageName }
           )
         })
 
diff --git a/services/clsi/test/unit/js/DockerRunnerTests.js b/services/clsi/test/unit/js/DockerRunnerTests.js
index 6c377d102b..d70aab52c7 100644
--- a/services/clsi/test/unit/js/DockerRunnerTests.js
+++ b/services/clsi/test/unit/js/DockerRunnerTests.js
@@ -76,8 +76,11 @@ describe('DockerRunner', function () {
     this.env = {}
     this.callback = sinon.stub()
     this.project_id = 'project-id-123'
-    this.volumes = { '/local/compile/directory': '/compile' }
+    this.volumes = { '/some/host/dir/compiles/directory': '/compile' }
     this.Settings.clsi.docker.image = this.defaultImage = 'default-image'
+    this.Settings.path.sandboxedCompilesHostDirCompiles =
+      '/some/host/dir/compiles'
+    this.Settings.path.sandboxedCompilesHostDirOutput = '/some/host/dir/output'
     this.compileGroup = 'compile-group'
     return (this.Settings.clsi.docker.env = { PATH: 'mock-path' })
   })
@@ -151,9 +154,8 @@ describe('DockerRunner', function () {
       })
     })
 
-    describe('when path.sandboxedCompilesHostDir is set', function () {
+    describe('standard compile', function () {
       beforeEach(function () {
-        this.Settings.path.sandboxedCompilesHostDir = '/some/host/dir/compiles'
         this.directory = '/var/lib/overleaf/data/compiles/xyz'
         this.DockerRunner._runAndWaitForContainer = sinon
           .stub()
@@ -183,6 +185,99 @@ describe('DockerRunner', function () {
       })
     })
 
+    describe('synctex-output', function () {
+      beforeEach(function () {
+        this.directory = '/var/lib/overleaf/data/output/xyz/generated-files/id'
+        this.DockerRunner._runAndWaitForContainer = sinon
+          .stub()
+          .callsArgWith(3, null, (this.output = 'mock-output'))
+        this.DockerRunner.run(
+          this.project_id,
+          this.command,
+          this.directory,
+          this.image,
+          this.timeout,
+          this.env,
+          'synctex-output',
+          this.callback
+        )
+      })
+
+      it('should re-write the bind directory and set ro flag', function () {
+        const volumes =
+          this.DockerRunner._runAndWaitForContainer.lastCall.args[1]
+        expect(volumes).to.deep.equal({
+          '/some/host/dir/output/xyz/generated-files/id': '/compile:ro',
+        })
+      })
+
+      it('should call the callback', function () {
+        this.callback.calledWith(null, this.output).should.equal(true)
+      })
+    })
+
+    describe('synctex', function () {
+      beforeEach(function () {
+        this.directory = '/var/lib/overleaf/data/compile/xyz'
+        this.DockerRunner._runAndWaitForContainer = sinon
+          .stub()
+          .callsArgWith(3, null, (this.output = 'mock-output'))
+        this.DockerRunner.run(
+          this.project_id,
+          this.command,
+          this.directory,
+          this.image,
+          this.timeout,
+          this.env,
+          'synctex',
+          this.callback
+        )
+      })
+
+      it('should re-write the bind directory', function () {
+        const volumes =
+          this.DockerRunner._runAndWaitForContainer.lastCall.args[1]
+        expect(volumes).to.deep.equal({
+          '/some/host/dir/compiles/xyz': '/compile:ro',
+        })
+      })
+
+      it('should call the callback', function () {
+        this.callback.calledWith(null, this.output).should.equal(true)
+      })
+    })
+
+    describe('wordcount', function () {
+      beforeEach(function () {
+        this.directory = '/var/lib/overleaf/data/compile/xyz'
+        this.DockerRunner._runAndWaitForContainer = sinon
+          .stub()
+          .callsArgWith(3, null, (this.output = 'mock-output'))
+        this.DockerRunner.run(
+          this.project_id,
+          this.command,
+          this.directory,
+          this.image,
+          this.timeout,
+          this.env,
+          'wordcount',
+          this.callback
+        )
+      })
+
+      it('should re-write the bind directory', function () {
+        const volumes =
+          this.DockerRunner._runAndWaitForContainer.lastCall.args[1]
+        expect(volumes).to.deep.equal({
+          '/some/host/dir/compiles/xyz': '/compile:ro',
+        })
+      })
+
+      it('should call the callback', function () {
+        this.callback.calledWith(null, this.output).should.equal(true)
+      })
+    })
+
     describe('when the run throws an error', function () {
       beforeEach(function () {
         let firstTime = true
@@ -390,7 +485,7 @@ describe('DockerRunner', function () {
         const options =
           this.DockerRunner._runAndWaitForContainer.lastCall.args[0]
         return expect(options.HostConfig).to.deep.include({
-          Binds: ['/local/compile/directory:/compile:rw'],
+          Binds: ['/some/host/dir/compiles/directory:/compile:rw'],
           LogConfig: { Type: 'none', Config: {} },
           CapDrop: 'ALL',
           SecurityOpt: ['no-new-privileges'],
@@ -562,82 +657,6 @@ describe('DockerRunner', function () {
       })
     })
 
-    describe('when a volume does not exist', function () {
-      beforeEach(function () {
-        this.fs.stat = sinon.stub().yields(new Error('no such path'))
-        return this.DockerRunner.startContainer(
-          this.options,
-          this.volumes,
-          this.attachStreamHandler,
-          this.callback
-        )
-      })
-
-      it('should not try to create the container', function () {
-        return this.createContainer.called.should.equal(false)
-      })
-
-      it('should call the callback with an error', function () {
-        this.callback.calledWith(sinon.match(Error)).should.equal(true)
-      })
-    })
-
-    describe('when a volume exists but is not a directory', function () {
-      beforeEach(function () {
-        this.fs.stat = sinon.stub().yields(null, {
-          isDirectory() {
-            return false
-          },
-        })
-        return this.DockerRunner.startContainer(
-          this.options,
-          this.volumes,
-          this.attachStreamHandler,
-          this.callback
-        )
-      })
-
-      it('should not try to create the container', function () {
-        return this.createContainer.called.should.equal(false)
-      })
-
-      it('should call the callback with an error', function () {
-        this.callback.calledWith(sinon.match(Error)).should.equal(true)
-      })
-    })
-
-    describe('when a volume does not exist, but sibling-containers are used', function () {
-      beforeEach(function () {
-        this.fs.stat = sinon.stub().yields(new Error('no such path'))
-        this.Settings.path.sandboxedCompilesHostDir = '/some/path'
-        this.container.start = sinon.stub().yields()
-        return this.DockerRunner.startContainer(
-          this.options,
-          this.volumes,
-          () => {},
-          this.callback
-        )
-      })
-
-      afterEach(function () {
-        return delete this.Settings.path.sandboxedCompilesHostDir
-      })
-
-      it('should start the container with the given name', function () {
-        this.getContainer.calledWith(this.options.name).should.equal(true)
-        return this.container.start.called.should.equal(true)
-      })
-
-      it('should not try to create the container', function () {
-        return this.createContainer.called.should.equal(false)
-      })
-
-      return it('should call the callback', function () {
-        this.callback.called.should.equal(true)
-        return this.callback.calledWith(new Error()).should.equal(false)
-      })
-    })
-
     return describe('when the container tries to be created, but already has been (race condition)', function () {})
   })
 
diff --git a/services/clsi/test/unit/js/ProjectPersistenceManagerTests.js b/services/clsi/test/unit/js/ProjectPersistenceManagerTests.js
index 2504d266ca..4f42411fba 100644
--- a/services/clsi/test/unit/js/ProjectPersistenceManagerTests.js
+++ b/services/clsi/test/unit/js/ProjectPersistenceManagerTests.js
@@ -21,12 +21,16 @@ const tk = require('timekeeper')
 
 describe('ProjectPersistenceManager', function () {
   beforeEach(function () {
+    this.fsPromises = {
+      statfs: sinon.stub(),
+    }
+
     this.ProjectPersistenceManager = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/metrics': (this.Metrics = { gauge: sinon.stub() }),
         './UrlCache': (this.UrlCache = {}),
         './CompileManager': (this.CompileManager = {}),
-        diskusage: (this.diskusage = { check: sinon.stub() }),
+        fs: { promises: this.fsPromises },
         '@overleaf/settings': (this.settings = {
           project_cache_length_ms: 1000,
           path: {
@@ -44,9 +48,10 @@ describe('ProjectPersistenceManager', function () {
 
   describe('refreshExpiryTimeout', function () {
     it('should leave expiry alone if plenty of disk', function (done) {
-      this.diskusage.check.resolves({
-        available: 40,
-        total: 100,
+      this.fsPromises.statfs.resolves({
+        blocks: 100,
+        bsize: 1,
+        bavail: 40,
       })
 
       this.ProjectPersistenceManager.refreshExpiryTimeout(() => {
@@ -62,9 +67,10 @@ describe('ProjectPersistenceManager', function () {
     })
 
     it('should drop EXPIRY_TIMEOUT 10% if low disk usage', function (done) {
-      this.diskusage.check.resolves({
-        available: 5,
-        total: 100,
+      this.fsPromises.statfs.resolves({
+        blocks: 100,
+        bsize: 1,
+        bavail: 5,
       })
 
       this.ProjectPersistenceManager.refreshExpiryTimeout(() => {
@@ -78,9 +84,10 @@ describe('ProjectPersistenceManager', function () {
     })
 
     it('should not drop EXPIRY_TIMEOUT to below 50% of project_cache_length_ms', function (done) {
-      this.diskusage.check.resolves({
-        available: 5,
-        total: 100,
+      this.fsPromises.statfs.resolves({
+        blocks: 100,
+        bsize: 1,
+        bavail: 5,
       })
       this.ProjectPersistenceManager.EXPIRY_TIMEOUT = 500
       this.ProjectPersistenceManager.refreshExpiryTimeout(() => {
@@ -94,7 +101,7 @@ describe('ProjectPersistenceManager', function () {
     })
 
     it('should not modify EXPIRY_TIMEOUT if there is an error getting disk values', function (done) {
-      this.diskusage.check.throws(new Error())
+      this.fsPromises.statfs.rejects(new Error())
       this.ProjectPersistenceManager.refreshExpiryTimeout(() => {
         this.ProjectPersistenceManager.EXPIRY_TIMEOUT.should.equal(1000)
         done()
diff --git a/services/contacts/.nvmrc b/services/contacts/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/contacts/.nvmrc
+++ b/services/contacts/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/contacts/Dockerfile b/services/contacts/Dockerfile
index 69d2d35b3c..b59cada7b3 100644
--- a/services/contacts/Dockerfile
+++ b/services/contacts/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/contacts
 
diff --git a/services/contacts/Makefile b/services/contacts/Makefile
index 97a348d219..3309e298e8 100644
--- a/services/contacts/Makefile
+++ b/services/contacts/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/contacts/buildscript.txt b/services/contacts/buildscript.txt
index 0f4f2e643d..b20764246c 100644
--- a/services/contacts/buildscript.txt
+++ b/services/contacts/buildscript.txt
@@ -4,6 +4,6 @@ contacts
 --env-add=
 --env-pass-through=
 --esmock-loader=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/contacts/docker-compose.ci.yml b/services/contacts/docker-compose.ci.yml
index 51eb64d126..ca3303a079 100644
--- a/services/contacts/docker-compose.ci.yml
+++ b/services/contacts/docker-compose.ci.yml
@@ -24,10 +24,13 @@ services:
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -39,7 +42,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/contacts/docker-compose.yml b/services/contacts/docker-compose.yml
index 310220bd20..474ea224f8 100644
--- a/services/contacts/docker-compose.yml
+++ b/services/contacts/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/contacts
       - ../../node_modules:/overleaf/node_modules
@@ -21,11 +21,12 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/contacts
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/contacts
     environment:
       ELASTIC_SEARCH_DSN: es:9200
@@ -39,10 +40,11 @@ services:
     depends_on:
       mongo:
         condition: service_started
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/contacts/package.json b/services/contacts/package.json
index f81f947d6a..db707e55c9 100644
--- a/services/contacts/package.json
+++ b/services/contacts/package.json
@@ -6,9 +6,9 @@
   "main": "app.js",
   "scripts": {
     "start": "node app.js",
-    "test:acceptance:_run": "LOG_LEVEL=fatal mocha --loader=esmock --recursive --reporter spec --timeout 15000 --exit $@ test/acceptance/js",
+    "test:acceptance:_run": "mocha --loader=esmock --recursive --reporter spec --timeout 15000 --exit $@ test/acceptance/js",
     "test:acceptance": "npm run test:acceptance:_run -- --grep=$MOCHA_GREP",
-    "test:unit:_run": "LOG_LEVEL=fatal mocha --loader=esmock --recursive --reporter spec $@ test/unit/js",
+    "test:unit:_run": "mocha --loader=esmock --recursive --reporter spec $@ test/unit/js",
     "test:unit": "npm run test:unit:_run -- --grep=$MOCHA_GREP",
     "nodemon": "node --watch app.js",
     "lint": "eslint --max-warnings 0 --format unix .",
diff --git a/services/docstore/.gitignore b/services/docstore/.gitignore
deleted file mode 100644
index 84bf300f7f..0000000000
--- a/services/docstore/.gitignore
+++ /dev/null
@@ -1,8 +0,0 @@
-node_modules
-forever
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
-
-# Jetbrains IDEs
-.idea
diff --git a/services/docstore/.nvmrc b/services/docstore/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/docstore/.nvmrc
+++ b/services/docstore/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/docstore/Dockerfile b/services/docstore/Dockerfile
index 60a024ea91..f24f9ddaf7 100644
--- a/services/docstore/Dockerfile
+++ b/services/docstore/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/docstore
 
diff --git a/services/docstore/Makefile b/services/docstore/Makefile
index 6efd053025..2b3596b0b4 100644
--- a/services/docstore/Makefile
+++ b/services/docstore/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/docstore/app.js b/services/docstore/app.js
index b4a26fc24a..ef755c4bb1 100644
--- a/services/docstore/app.js
+++ b/services/docstore/app.js
@@ -50,6 +50,14 @@ app.param('doc_id', function (req, res, next, docId) {
 app.get('/project/:project_id/doc-deleted', HttpController.getAllDeletedDocs)
 app.get('/project/:project_id/doc', HttpController.getAllDocs)
 app.get('/project/:project_id/ranges', HttpController.getAllRanges)
+app.get(
+  '/project/:project_id/comment-thread-ids',
+  HttpController.getCommentThreadIds
+)
+app.get(
+  '/project/:project_id/tracked-changes-user-ids',
+  HttpController.getTrackedChangesUserIds
+)
 app.get('/project/:project_id/has-ranges', HttpController.projectHasRanges)
 app.get('/project/:project_id/doc/:doc_id', HttpController.getDoc)
 app.get('/project/:project_id/doc/:doc_id/deleted', HttpController.isDocDeleted)
@@ -88,14 +96,17 @@ app.get('/status', (req, res) => res.send('docstore is alive'))
 
 app.use(handleValidationErrors())
 app.use(function (error, req, res, next) {
-  logger.error({ err: error, req }, 'request errored')
   if (error instanceof Errors.NotFoundError) {
+    logger.warn({ req }, 'not found')
     res.sendStatus(404)
   } else if (error instanceof Errors.DocModifiedError) {
+    logger.warn({ req }, 'conflict: doc modified')
     res.sendStatus(409)
   } else if (error instanceof Errors.DocVersionDecrementedError) {
+    logger.warn({ req }, 'conflict: doc version decremented')
     res.sendStatus(409)
   } else {
+    logger.error({ err: error, req }, 'request errored')
     res.status(500).send('Oops, something went wrong')
   }
 })
diff --git a/services/docstore/app/js/DocArchiveManager.js b/services/docstore/app/js/DocArchiveManager.js
index 4390afe18f..d03ee161a8 100644
--- a/services/docstore/app/js/DocArchiveManager.js
+++ b/services/docstore/app/js/DocArchiveManager.js
@@ -1,5 +1,4 @@
-const { callbackify } = require('node:util')
-const MongoManager = require('./MongoManager').promises
+const MongoManager = require('./MongoManager')
 const Errors = require('./Errors')
 const logger = require('@overleaf/logger')
 const Settings = require('@overleaf/settings')
@@ -8,29 +7,12 @@ const { ReadableString } = require('@overleaf/stream-utils')
 const RangeManager = require('./RangeManager')
 const PersistorManager = require('./PersistorManager')
 const pMap = require('p-map')
-const { streamToBuffer } = require('./StreamToBuffer').promises
+const { streamToBuffer } = require('./StreamToBuffer')
 const { BSON } = require('mongodb-legacy')
 
 const PARALLEL_JOBS = Settings.parallelArchiveJobs
 const UN_ARCHIVE_BATCH_SIZE = Settings.unArchiveBatchSize
 
-module.exports = {
-  archiveAllDocs: callbackify(archiveAllDocs),
-  archiveDoc: callbackify(archiveDoc),
-  unArchiveAllDocs: callbackify(unArchiveAllDocs),
-  unarchiveDoc: callbackify(unarchiveDoc),
-  destroyProject: callbackify(destroyProject),
-  getDoc: callbackify(getDoc),
-  promises: {
-    archiveAllDocs,
-    archiveDoc,
-    unArchiveAllDocs,
-    unarchiveDoc,
-    destroyProject,
-    getDoc,
-  },
-}
-
 async function archiveAllDocs(projectId) {
   if (!_isArchivingEnabled()) {
     return
@@ -62,6 +44,8 @@ async function archiveDoc(projectId, docId) {
     throw new Error('doc has no lines')
   }
 
+  RangeManager.fixCommentIds(doc)
+
   // warn about any oversized docs already in mongo
   const linesSize = BSON.calculateObjectSize(doc.lines || {})
   const rangesSize = BSON.calculateObjectSize(doc.ranges || {})
@@ -225,3 +209,12 @@ function _isArchivingEnabled() {
 
   return true
 }
+
+module.exports = {
+  archiveAllDocs,
+  archiveDoc,
+  unArchiveAllDocs,
+  unarchiveDoc,
+  destroyProject,
+  getDoc,
+}
diff --git a/services/docstore/app/js/DocManager.js b/services/docstore/app/js/DocManager.js
index a9ed99425c..c9e8dadc2c 100644
--- a/services/docstore/app/js/DocManager.js
+++ b/services/docstore/app/js/DocManager.js
@@ -5,7 +5,6 @@ const _ = require('lodash')
 const DocArchive = require('./DocArchiveManager')
 const RangeManager = require('./RangeManager')
 const Settings = require('@overleaf/settings')
-const { callbackifyAll } = require('@overleaf/promise-utils')
 const { setTimeout } = require('node:timers/promises')
 
 /**
@@ -29,7 +28,7 @@ const DocManager = {
       throw new Error('must include inS3 when getting doc')
     }
 
-    const doc = await MongoManager.promises.findDoc(projectId, docId, filter)
+    const doc = await MongoManager.findDoc(projectId, docId, filter)
 
     if (doc == null) {
       throw new Errors.NotFoundError(
@@ -38,15 +37,19 @@ const DocManager = {
     }
 
     if (doc.inS3) {
-      await DocArchive.promises.unarchiveDoc(projectId, docId)
+      await DocArchive.unarchiveDoc(projectId, docId)
       return await DocManager._getDoc(projectId, docId, filter)
     }
 
+    if (filter.ranges) {
+      RangeManager.fixCommentIds(doc)
+    }
+
     return doc
   },
 
   async isDocDeleted(projectId, docId) {
-    const doc = await MongoManager.promises.findDoc(projectId, docId, {
+    const doc = await MongoManager.findDoc(projectId, docId, {
       deleted: true,
     })
 
@@ -74,7 +77,7 @@ const DocManager = {
 
   // returns the doc without any version information
   async _peekRawDoc(projectId, docId) {
-    const doc = await MongoManager.promises.findDoc(projectId, docId, {
+    const doc = await MongoManager.findDoc(projectId, docId, {
       lines: true,
       rev: true,
       deleted: true,
@@ -91,7 +94,7 @@ const DocManager = {
 
     if (doc.inS3) {
       // skip the unarchiving to mongo when getting a doc
-      const archivedDoc = await DocArchive.promises.getDoc(projectId, docId)
+      const archivedDoc = await DocArchive.getDoc(projectId, docId)
       Object.assign(doc, archivedDoc)
     }
 
@@ -102,7 +105,7 @@ const DocManager = {
   // without unarchiving it (avoids unnecessary writes to mongo)
   async peekDoc(projectId, docId) {
     const doc = await DocManager._peekRawDoc(projectId, docId)
-    await MongoManager.promises.checkRevUnchanged(doc)
+    await MongoManager.checkRevUnchanged(doc)
     return doc
   },
 
@@ -111,16 +114,18 @@ const DocManager = {
       lines: true,
       inS3: true,
     })
-    return doc
+    if (!doc) throw new Errors.NotFoundError()
+    if (!Array.isArray(doc.lines)) throw new Errors.DocWithoutLinesError()
+    return doc.lines.join('\n')
   },
 
   async getAllDeletedDocs(projectId, filter) {
-    return await MongoManager.promises.getProjectsDeletedDocs(projectId, filter)
+    return await MongoManager.getProjectsDeletedDocs(projectId, filter)
   },
 
   async getAllNonDeletedDocs(projectId, filter) {
-    await DocArchive.promises.unArchiveAllDocs(projectId)
-    const docs = await MongoManager.promises.getProjectsDocs(
+    await DocArchive.unArchiveAllDocs(projectId)
+    const docs = await MongoManager.getProjectsDocs(
       projectId,
       { include_deleted: false },
       filter
@@ -128,15 +133,46 @@ const DocManager = {
     if (docs == null) {
       throw new Errors.NotFoundError(`No docs for project ${projectId}`)
     }
+    if (filter.ranges) {
+      for (const doc of docs) {
+        RangeManager.fixCommentIds(doc)
+      }
+    }
     return docs
   },
 
+  async getCommentThreadIds(projectId) {
+    const docs = await DocManager.getAllNonDeletedDocs(projectId, {
+      _id: true,
+      ranges: true,
+    })
+    const byDoc = new Map()
+    for (const doc of docs) {
+      const ids = new Set()
+      for (const comment of doc.ranges?.comments || []) {
+        ids.add(comment.op.t)
+      }
+      if (ids.size > 0) byDoc.set(doc._id.toString(), Array.from(ids))
+    }
+    return Object.fromEntries(byDoc.entries())
+  },
+
+  async getTrackedChangesUserIds(projectId) {
+    const docs = await DocManager.getAllNonDeletedDocs(projectId, {
+      ranges: true,
+    })
+    const userIds = new Set()
+    for (const doc of docs) {
+      for (const change of doc.ranges?.changes || []) {
+        if (change.metadata.user_id === 'anonymous-user') continue
+        userIds.add(change.metadata.user_id)
+      }
+    }
+    return Array.from(userIds)
+  },
+
   async projectHasRanges(projectId) {
-    const docs = await MongoManager.promises.getProjectsDocs(
-      projectId,
-      {},
-      { _id: 1 }
-    )
+    const docs = await MongoManager.getProjectsDocs(projectId, {}, { _id: 1 })
     const docIds = docs.map(doc => doc._id)
     for (const docId of docIds) {
       const doc = await DocManager.peekDoc(projectId, docId)
@@ -247,7 +283,7 @@ const DocManager = {
       }
 
       modified = true
-      await MongoManager.promises.upsertIntoDocCollection(
+      await MongoManager.upsertIntoDocCollection(
         projectId,
         docId,
         doc?.rev,
@@ -262,11 +298,7 @@ const DocManager = {
 
   async patchDoc(projectId, docId, meta) {
     const projection = { _id: 1, deleted: true }
-    const doc = await MongoManager.promises.findDoc(
-      projectId,
-      docId,
-      projection
-    )
+    const doc = await MongoManager.findDoc(projectId, docId, projection)
     if (!doc) {
       throw new Errors.NotFoundError(
         `No such project/doc to delete: ${projectId}/${docId}`
@@ -275,7 +307,7 @@ const DocManager = {
 
     if (meta.deleted && Settings.docstore.archiveOnSoftDelete) {
       // The user will not read this doc anytime soon. Flush it out of mongo.
-      DocArchive.promises.archiveDoc(projectId, docId).catch(err => {
+      DocArchive.archiveDoc(projectId, docId).catch(err => {
         logger.warn(
           { projectId, docId, err },
           'archiving a single doc in the background failed'
@@ -283,15 +315,8 @@ const DocManager = {
       })
     }
 
-    await MongoManager.promises.patchDoc(projectId, docId, meta)
+    await MongoManager.patchDoc(projectId, docId, meta)
   },
 }
 
-module.exports = {
-  ...callbackifyAll(DocManager, {
-    multiResult: {
-      updateDoc: ['modified', 'rev'],
-    },
-  }),
-  promises: DocManager,
-}
+module.exports = DocManager
diff --git a/services/docstore/app/js/Errors.js b/services/docstore/app/js/Errors.js
index bbdbe75c08..7b150cc0db 100644
--- a/services/docstore/app/js/Errors.js
+++ b/services/docstore/app/js/Errors.js
@@ -10,10 +10,13 @@ class DocRevValueError extends OError {}
 
 class DocVersionDecrementedError extends OError {}
 
+class DocWithoutLinesError extends OError {}
+
 module.exports = {
   Md5MismatchError,
   DocModifiedError,
   DocRevValueError,
   DocVersionDecrementedError,
+  DocWithoutLinesError,
   ...Errors,
 }
diff --git a/services/docstore/app/js/HealthChecker.js b/services/docstore/app/js/HealthChecker.js
index 34cd5c973c..a5b7ad7e9a 100644
--- a/services/docstore/app/js/HealthChecker.js
+++ b/services/docstore/app/js/HealthChecker.js
@@ -1,67 +1,35 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * DS207: Consider shorter variations of null checks
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const { db, ObjectId } = require('./mongodb')
-const request = require('request')
-const async = require('async')
 const _ = require('lodash')
 const crypto = require('node:crypto')
 const settings = require('@overleaf/settings')
 const { port } = settings.internal.docstore
 const logger = require('@overleaf/logger')
+const { fetchNothing, fetchJson } = require('@overleaf/fetch-utils')
 
-module.exports = {
-  check(callback) {
-    const docId = new ObjectId()
-    const projectId = new ObjectId(settings.docstore.healthCheck.project_id)
-    const url = `http://127.0.0.1:${port}/project/${projectId}/doc/${docId}`
-    const lines = [
-      'smoke test - delete me',
-      `${crypto.randomBytes(32).toString('hex')}`,
-    ]
-    const getOpts = () => ({
-      url,
-      timeout: 3000,
+async function check() {
+  const docId = new ObjectId()
+  const projectId = new ObjectId(settings.docstore.healthCheck.project_id)
+  const url = `http://127.0.0.1:${port}/project/${projectId}/doc/${docId}`
+  const lines = [
+    'smoke test - delete me',
+    `${crypto.randomBytes(32).toString('hex')}`,
+  ]
+  logger.debug({ lines, url, docId, projectId }, 'running health check')
+  let body
+  try {
+    await fetchNothing(url, {
+      method: 'POST',
+      json: { lines, version: 42, ranges: {} },
+      signal: AbortSignal.timeout(3_000),
     })
-    logger.debug({ lines, url, docId, projectId }, 'running health check')
-    const jobs = [
-      function (cb) {
-        const opts = getOpts()
-        opts.json = { lines, version: 42, ranges: {} }
-        return request.post(opts, cb)
-      },
-      function (cb) {
-        const opts = getOpts()
-        opts.json = true
-        return request.get(opts, function (err, res, body) {
-          if (err != null) {
-            logger.err({ err }, 'docstore returned a error in health check get')
-            return cb(err)
-          } else if (res == null) {
-            return cb(new Error('no response from docstore with get check'))
-          } else if ((res != null ? res.statusCode : undefined) !== 200) {
-            return cb(new Error(`status code not 200, its ${res.statusCode}`))
-          } else if (
-            _.isEqual(body != null ? body.lines : undefined, lines) &&
-            (body != null ? body._id : undefined) === docId.toString()
-          ) {
-            return cb()
-          } else {
-            return cb(
-              new Error(
-                `health check lines not equal ${body.lines} != ${lines}`
-              )
-            )
-          }
-        })
-      },
-      cb => db.docs.deleteOne({ _id: docId, project_id: projectId }, cb),
-    ]
-    return async.series(jobs, callback)
-  },
+    body = await fetchJson(url, { signal: AbortSignal.timeout(3_000) })
+  } finally {
+    await db.docs.deleteOne({ _id: docId, project_id: projectId })
+  }
+  if (!_.isEqual(body?.lines, lines)) {
+    throw new Error(`health check lines not equal ${body.lines} != ${lines}`)
+  }
+}
+module.exports = {
+  check,
 }
diff --git a/services/docstore/app/js/HttpController.js b/services/docstore/app/js/HttpController.js
index 1c4e137033..50c4302aeb 100644
--- a/services/docstore/app/js/HttpController.js
+++ b/services/docstore/app/js/HttpController.js
@@ -4,143 +4,104 @@ const DocArchive = require('./DocArchiveManager')
 const HealthChecker = require('./HealthChecker')
 const Errors = require('./Errors')
 const Settings = require('@overleaf/settings')
+const { expressify } = require('@overleaf/promise-utils')
 
-function getDoc(req, res, next) {
+async function getDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   const includeDeleted = req.query.include_deleted === 'true'
   logger.debug({ projectId, docId }, 'getting doc')
-  DocManager.getFullDoc(projectId, docId, function (error, doc) {
-    if (error) {
-      return next(error)
-    }
-    logger.debug({ docId, projectId }, 'got doc')
-    if (doc == null) {
-      res.sendStatus(404)
-    } else if (doc.deleted && !includeDeleted) {
-      res.sendStatus(404)
-    } else {
-      res.json(_buildDocView(doc))
-    }
-  })
+  const doc = await DocManager.getFullDoc(projectId, docId)
+  logger.debug({ docId, projectId }, 'got doc')
+  if (doc.deleted && !includeDeleted) {
+    res.sendStatus(404)
+  } else {
+    res.json(_buildDocView(doc))
+  }
 }
 
-function peekDoc(req, res, next) {
+async function peekDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   logger.debug({ projectId, docId }, 'peeking doc')
-  DocManager.peekDoc(projectId, docId, function (error, doc) {
-    if (error) {
-      return next(error)
-    }
-    if (doc == null) {
-      res.sendStatus(404)
-    } else {
-      res.setHeader('x-doc-status', doc.inS3 ? 'archived' : 'active')
-      res.json(_buildDocView(doc))
-    }
-  })
+  const doc = await DocManager.peekDoc(projectId, docId)
+  res.setHeader('x-doc-status', doc.inS3 ? 'archived' : 'active')
+  res.json(_buildDocView(doc))
 }
 
-function isDocDeleted(req, res, next) {
+async function isDocDeleted(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
-  DocManager.isDocDeleted(projectId, docId, function (error, deleted) {
-    if (error) {
-      return next(error)
-    }
-    res.json({ deleted })
-  })
+  const deleted = await DocManager.isDocDeleted(projectId, docId)
+  res.json({ deleted })
 }
 
-function getRawDoc(req, res, next) {
+async function getRawDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   logger.debug({ projectId, docId }, 'getting raw doc')
-  DocManager.getDocLines(projectId, docId, function (error, doc) {
-    if (error) {
-      return next(error)
-    }
-    if (doc == null) {
-      res.sendStatus(404)
-    } else {
-      res.setHeader('content-type', 'text/plain')
-      res.send(_buildRawDocView(doc))
-    }
-  })
+  const content = await DocManager.getDocLines(projectId, docId)
+  res.setHeader('content-type', 'text/plain')
+  res.send(content)
 }
 
-function getAllDocs(req, res, next) {
+async function getAllDocs(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'getting all docs')
-  DocManager.getAllNonDeletedDocs(
-    projectId,
-    { lines: true, rev: true },
-    function (error, docs) {
-      if (docs == null) {
-        docs = []
-      }
-      if (error) {
-        return next(error)
-      }
-      const docViews = _buildDocsArrayView(projectId, docs)
-      for (const docView of docViews) {
-        if (!docView.lines) {
-          logger.warn({ projectId, docId: docView._id }, 'missing doc lines')
-          docView.lines = []
-        }
-      }
-      res.json(docViews)
+  const docs = await DocManager.getAllNonDeletedDocs(projectId, {
+    lines: true,
+    rev: true,
+  })
+  const docViews = _buildDocsArrayView(projectId, docs)
+  for (const docView of docViews) {
+    if (!docView.lines) {
+      logger.warn({ projectId, docId: docView._id }, 'missing doc lines')
+      docView.lines = []
     }
-  )
+  }
+  res.json(docViews)
 }
 
-function getAllDeletedDocs(req, res, next) {
+async function getAllDeletedDocs(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'getting all deleted docs')
-  DocManager.getAllDeletedDocs(
-    projectId,
-    { name: true, deletedAt: true },
-    function (error, docs) {
-      if (error) {
-        return next(error)
-      }
-      res.json(
-        docs.map(doc => ({
-          _id: doc._id.toString(),
-          name: doc.name,
-          deletedAt: doc.deletedAt,
-        }))
-      )
-    }
+  const docs = await DocManager.getAllDeletedDocs(projectId, {
+    name: true,
+    deletedAt: true,
+  })
+  res.json(
+    docs.map(doc => ({
+      _id: doc._id.toString(),
+      name: doc.name,
+      deletedAt: doc.deletedAt,
+    }))
   )
 }
 
-function getAllRanges(req, res, next) {
+async function getAllRanges(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'getting all ranges')
-  DocManager.getAllNonDeletedDocs(
-    projectId,
-    { ranges: true },
-    function (error, docs) {
-      if (docs == null) {
-        docs = []
-      }
-      if (error) {
-        return next(error)
-      }
-      res.json(_buildDocsArrayView(projectId, docs))
-    }
-  )
-}
-
-function projectHasRanges(req, res, next) {
-  const { project_id: projectId } = req.params
-  DocManager.projectHasRanges(projectId, (err, projectHasRanges) => {
-    if (err) {
-      return next(err)
-    }
-    res.json({ projectHasRanges })
+  const docs = await DocManager.getAllNonDeletedDocs(projectId, {
+    ranges: true,
   })
+  res.json(_buildDocsArrayView(projectId, docs))
 }
 
-function updateDoc(req, res, next) {
+async function getCommentThreadIds(req, res) {
+  const { project_id: projectId } = req.params
+  const threadIds = await DocManager.getCommentThreadIds(projectId)
+  res.json(threadIds)
+}
+
+async function getTrackedChangesUserIds(req, res) {
+  const { project_id: projectId } = req.params
+  const userIds = await DocManager.getTrackedChangesUserIds(projectId)
+  res.json(userIds)
+}
+
+async function projectHasRanges(req, res) {
+  const { project_id: projectId } = req.params
+  const projectHasRanges = await DocManager.projectHasRanges(projectId)
+  res.json({ projectHasRanges })
+}
+
+async function updateDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   const lines = req.body?.lines
   const version = req.body?.version
@@ -172,25 +133,20 @@ function updateDoc(req, res, next) {
   }
 
   logger.debug({ projectId, docId }, 'got http request to update doc')
-  DocManager.updateDoc(
+  const { modified, rev } = await DocManager.updateDoc(
     projectId,
     docId,
     lines,
     version,
-    ranges,
-    function (error, modified, rev) {
-      if (error) {
-        return next(error)
-      }
-      res.json({
-        modified,
-        rev,
-      })
-    }
+    ranges
   )
+  res.json({
+    modified,
+    rev,
+  })
 }
 
-function patchDoc(req, res, next) {
+async function patchDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   logger.debug({ projectId, docId }, 'patching doc')
 
@@ -203,12 +159,8 @@ function patchDoc(req, res, next) {
       logger.fatal({ field }, 'joi validation for pathDoc is broken')
     }
   })
-  DocManager.patchDoc(projectId, docId, meta, function (error) {
-    if (error) {
-      return next(error)
-    }
-    res.sendStatus(204)
-  })
+  await DocManager.patchDoc(projectId, docId, meta)
+  res.sendStatus(204)
 }
 
 function _buildDocView(doc) {
@@ -221,10 +173,6 @@ function _buildDocView(doc) {
   return docView
 }
 
-function _buildRawDocView(doc) {
-  return (doc?.lines ?? []).join('\n')
-}
-
 function _buildDocsArrayView(projectId, docs) {
   const docViews = []
   for (const doc of docs) {
@@ -241,79 +189,69 @@ function _buildDocsArrayView(projectId, docs) {
   return docViews
 }
 
-function archiveAllDocs(req, res, next) {
+async function archiveAllDocs(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'archiving all docs')
-  DocArchive.archiveAllDocs(projectId, function (error) {
-    if (error) {
-      return next(error)
-    }
-    res.sendStatus(204)
-  })
+  await DocArchive.archiveAllDocs(projectId)
+  res.sendStatus(204)
 }
 
-function archiveDoc(req, res, next) {
+async function archiveDoc(req, res) {
   const { doc_id: docId, project_id: projectId } = req.params
   logger.debug({ projectId, docId }, 'archiving a doc')
-  DocArchive.archiveDoc(projectId, docId, function (error) {
-    if (error) {
-      return next(error)
-    }
-    res.sendStatus(204)
-  })
+  await DocArchive.archiveDoc(projectId, docId)
+  res.sendStatus(204)
 }
 
-function unArchiveAllDocs(req, res, next) {
+async function unArchiveAllDocs(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'unarchiving all docs')
-  DocArchive.unArchiveAllDocs(projectId, function (err) {
-    if (err) {
-      if (err instanceof Errors.DocRevValueError) {
-        logger.warn({ err }, 'Failed to unarchive doc')
-        return res.sendStatus(409)
-      }
-      return next(err)
+  try {
+    await DocArchive.unArchiveAllDocs(projectId)
+  } catch (err) {
+    if (err instanceof Errors.DocRevValueError) {
+      logger.warn({ err }, 'Failed to unarchive doc')
+      return res.sendStatus(409)
     }
-    res.sendStatus(200)
-  })
+    throw err
+  }
+  res.sendStatus(200)
 }
 
-function destroyProject(req, res, next) {
+async function destroyProject(req, res) {
   const { project_id: projectId } = req.params
   logger.debug({ projectId }, 'destroying all docs')
-  DocArchive.destroyProject(projectId, function (error) {
-    if (error) {
-      return next(error)
-    }
-    res.sendStatus(204)
-  })
+  await DocArchive.destroyProject(projectId)
+  res.sendStatus(204)
 }
 
-function healthCheck(req, res) {
-  HealthChecker.check(function (err) {
-    if (err) {
-      logger.err({ err }, 'error performing health check')
-      res.sendStatus(500)
-    } else {
-      res.sendStatus(200)
-    }
-  })
+async function healthCheck(req, res) {
+  try {
+    await HealthChecker.check()
+  } catch (err) {
+    logger.err({ err }, 'error performing health check')
+    res.sendStatus(500)
+    return
+  }
+  res.sendStatus(200)
 }
 
 module.exports = {
-  getDoc,
-  peekDoc,
-  isDocDeleted,
-  getRawDoc,
-  getAllDocs,
-  getAllDeletedDocs,
-  getAllRanges,
-  projectHasRanges,
-  updateDoc,
-  patchDoc,
-  archiveAllDocs,
-  archiveDoc,
-  unArchiveAllDocs,
-  destroyProject,
-  healthCheck,
+  getDoc: expressify(getDoc),
+  peekDoc: expressify(peekDoc),
+  isDocDeleted: expressify(isDocDeleted),
+  getRawDoc: expressify(getRawDoc),
+  getAllDocs: expressify(getAllDocs),
+  getAllDeletedDocs: expressify(getAllDeletedDocs),
+  getAllRanges: expressify(getAllRanges),
+  getTrackedChangesUserIds: expressify(getTrackedChangesUserIds),
+  getCommentThreadIds: expressify(getCommentThreadIds),
+  projectHasRanges: expressify(projectHasRanges),
+  updateDoc: expressify(updateDoc),
+  patchDoc: expressify(patchDoc),
+  archiveAllDocs: expressify(archiveAllDocs),
+  archiveDoc: expressify(archiveDoc),
+  unArchiveAllDocs: expressify(unArchiveAllDocs),
+  destroyProject: expressify(destroyProject),
+  healthCheck: expressify(healthCheck),
 }
diff --git a/services/docstore/app/js/MongoManager.js b/services/docstore/app/js/MongoManager.js
index ad1a2d2b40..ef101f91c0 100644
--- a/services/docstore/app/js/MongoManager.js
+++ b/services/docstore/app/js/MongoManager.js
@@ -1,7 +1,6 @@
 const { db, ObjectId } = require('./mongodb')
 const Settings = require('@overleaf/settings')
 const Errors = require('./Errors')
-const { callbackify } = require('node:util')
 
 const ARCHIVING_LOCK_DURATION_MS = Settings.archivingLockDurationMs
 
@@ -241,34 +240,17 @@ async function destroyProject(projectId) {
 }
 
 module.exports = {
-  findDoc: callbackify(findDoc),
-  getProjectsDeletedDocs: callbackify(getProjectsDeletedDocs),
-  getProjectsDocs: callbackify(getProjectsDocs),
-  getArchivedProjectDocs: callbackify(getArchivedProjectDocs),
-  getNonArchivedProjectDocIds: callbackify(getNonArchivedProjectDocIds),
-  getNonDeletedArchivedProjectDocs: callbackify(
-    getNonDeletedArchivedProjectDocs
-  ),
-  upsertIntoDocCollection: callbackify(upsertIntoDocCollection),
-  restoreArchivedDoc: callbackify(restoreArchivedDoc),
-  patchDoc: callbackify(patchDoc),
-  getDocForArchiving: callbackify(getDocForArchiving),
-  markDocAsArchived: callbackify(markDocAsArchived),
-  checkRevUnchanged: callbackify(checkRevUnchanged),
-  destroyProject: callbackify(destroyProject),
-  promises: {
-    findDoc,
-    getProjectsDeletedDocs,
-    getProjectsDocs,
-    getArchivedProjectDocs,
-    getNonArchivedProjectDocIds,
-    getNonDeletedArchivedProjectDocs,
-    upsertIntoDocCollection,
-    restoreArchivedDoc,
-    patchDoc,
-    getDocForArchiving,
-    markDocAsArchived,
-    checkRevUnchanged,
-    destroyProject,
-  },
+  findDoc,
+  getProjectsDeletedDocs,
+  getProjectsDocs,
+  getArchivedProjectDocs,
+  getNonArchivedProjectDocIds,
+  getNonDeletedArchivedProjectDocs,
+  upsertIntoDocCollection,
+  restoreArchivedDoc,
+  patchDoc,
+  getDocForArchiving,
+  markDocAsArchived,
+  checkRevUnchanged,
+  destroyProject,
 }
diff --git a/services/docstore/app/js/RangeManager.js b/services/docstore/app/js/RangeManager.js
index f36f68fe35..2fbadf9468 100644
--- a/services/docstore/app/js/RangeManager.js
+++ b/services/docstore/app/js/RangeManager.js
@@ -49,15 +49,25 @@ module.exports = RangeManager = {
       updateMetadata(change.metadata)
     }
     for (const comment of Array.from(ranges.comments || [])) {
-      comment.id = RangeManager._safeObjectId(comment.id)
-      if ((comment.op != null ? comment.op.t : undefined) != null) {
-        comment.op.t = RangeManager._safeObjectId(comment.op.t)
-      }
+      // Two bugs resulted in mismatched ids, prefer the thread id from the op: https://github.com/overleaf/internal/issues/23272
+      comment.id = RangeManager._safeObjectId(comment.op?.t || comment.id)
+      if (comment.op) comment.op.t = comment.id
+
+      // resolved property is added to comments when they are obtained from history, but this state doesn't belong in mongo docs collection
+      // more info: https://github.com/overleaf/internal/issues/24371#issuecomment-2913095174
+      delete comment.op?.resolved
       updateMetadata(comment.metadata)
     }
     return ranges
   },
 
+  fixCommentIds(doc) {
+    for (const comment of doc?.ranges?.comments || []) {
+      // Two bugs resulted in mismatched ids, prefer the thread id from the op: https://github.com/overleaf/internal/issues/23272
+      if (comment.op?.t) comment.id = comment.op.t
+    }
+  },
+
   _safeObjectId(data) {
     try {
       return new ObjectId(data)
diff --git a/services/docstore/app/js/StreamToBuffer.js b/services/docstore/app/js/StreamToBuffer.js
index 7de146cd11..09215a7367 100644
--- a/services/docstore/app/js/StreamToBuffer.js
+++ b/services/docstore/app/js/StreamToBuffer.js
@@ -2,13 +2,9 @@ const { LoggerStream, WritableBuffer } = require('@overleaf/stream-utils')
 const Settings = require('@overleaf/settings')
 const logger = require('@overleaf/logger/logging-manager')
 const { pipeline } = require('node:stream/promises')
-const { callbackify } = require('node:util')
 
 module.exports = {
-  streamToBuffer: callbackify(streamToBuffer),
-  promises: {
-    streamToBuffer,
-  },
+  streamToBuffer,
 }
 
 async function streamToBuffer(projectId, docId, stream) {
diff --git a/services/docstore/buildscript.txt b/services/docstore/buildscript.txt
index 0fb0267ca2..4526aa959c 100644
--- a/services/docstore/buildscript.txt
+++ b/services/docstore/buildscript.txt
@@ -4,6 +4,6 @@ docstore
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=True
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/docstore/docker-compose.ci.yml b/services/docstore/docker-compose.ci.yml
index a1a9995f60..cdb4783c5a 100644
--- a/services/docstore/docker-compose.ci.yml
+++ b/services/docstore/docker-compose.ci.yml
@@ -27,12 +27,15 @@ services:
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
       gcs:
         condition: service_healthy
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -44,7 +47,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/docstore/docker-compose.yml b/services/docstore/docker-compose.yml
index 93a029b00a..a9099c7e7b 100644
--- a/services/docstore/docker-compose.yml
+++ b/services/docstore/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/docstore
       - ../../node_modules:/overleaf/node_modules
@@ -21,11 +21,12 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/docstore
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/docstore
     environment:
       ELASTIC_SEARCH_DSN: es:9200
@@ -44,10 +45,11 @@ services:
         condition: service_started
       gcs:
         condition: service_healthy
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/docstore/package.json b/services/docstore/package.json
index e505f731d3..bf5857fd49 100644
--- a/services/docstore/package.json
+++ b/services/docstore/package.json
@@ -17,6 +17,7 @@
     "types:check": "tsc --noEmit"
   },
   "dependencies": {
+    "@overleaf/fetch-utils": "*",
     "@overleaf/logger": "*",
     "@overleaf/metrics": "*",
     "@overleaf/o-error": "*",
diff --git a/services/docstore/test/acceptance/js/ArchiveDocsTests.js b/services/docstore/test/acceptance/js/ArchiveDocsTests.js
index d9228103b6..7e254c7e84 100644
--- a/services/docstore/test/acceptance/js/ArchiveDocsTests.js
+++ b/services/docstore/test/acceptance/js/ArchiveDocsTests.js
@@ -1001,6 +1001,15 @@ describe('Archiving', function () {
         },
         version: 2,
       }
+      this.fixedRanges = {
+        ...this.doc.ranges,
+        comments: [
+          {
+            ...this.doc.ranges.comments[0],
+            id: this.doc.ranges.comments[0].op.t,
+          },
+        ],
+      }
       return DocstoreClient.createDoc(
         this.project_id,
         this.doc._id,
@@ -1048,7 +1057,7 @@ describe('Archiving', function () {
             throw error
           }
           s3Doc.lines.should.deep.equal(this.doc.lines)
-          const ranges = JSON.parse(JSON.stringify(this.doc.ranges)) // ObjectId -> String
+          const ranges = JSON.parse(JSON.stringify(this.fixedRanges)) // ObjectId -> String
           s3Doc.ranges.should.deep.equal(ranges)
           return done()
         }
@@ -1075,7 +1084,7 @@ describe('Archiving', function () {
             throw error
           }
           doc.lines.should.deep.equal(this.doc.lines)
-          doc.ranges.should.deep.equal(this.doc.ranges)
+          doc.ranges.should.deep.equal(this.fixedRanges)
           expect(doc.inS3).not.to.exist
           return done()
         })
diff --git a/services/docstore/test/acceptance/js/GettingAllDocsTests.js b/services/docstore/test/acceptance/js/GettingAllDocsTests.js
index 8fe5e7d91b..57851b2c3b 100644
--- a/services/docstore/test/acceptance/js/GettingAllDocsTests.js
+++ b/services/docstore/test/acceptance/js/GettingAllDocsTests.js
@@ -20,30 +20,73 @@ const DocstoreClient = require('./helpers/DocstoreClient')
 describe('Getting all docs', function () {
   beforeEach(function (done) {
     this.project_id = new ObjectId()
+    this.threadId1 = new ObjectId().toString()
+    this.threadId2 = new ObjectId().toString()
     this.docs = [
       {
         _id: new ObjectId(),
         lines: ['one', 'two', 'three'],
-        ranges: { mock: 'one' },
+        ranges: {
+          comments: [
+            { id: new ObjectId().toString(), op: { t: this.threadId1 } },
+          ],
+          changes: [
+            {
+              id: new ObjectId().toString(),
+              metadata: { user_id: 'user-id-1' },
+            },
+          ],
+        },
         rev: 2,
       },
       {
         _id: new ObjectId(),
         lines: ['aaa', 'bbb', 'ccc'],
-        ranges: { mock: 'two' },
+        ranges: {
+          changes: [
+            {
+              id: new ObjectId().toString(),
+              metadata: { user_id: 'user-id-2' },
+            },
+          ],
+        },
         rev: 4,
       },
       {
         _id: new ObjectId(),
         lines: ['111', '222', '333'],
-        ranges: { mock: 'three' },
+        ranges: {
+          comments: [
+            { id: new ObjectId().toString(), op: { t: this.threadId2 } },
+          ],
+          changes: [
+            {
+              id: new ObjectId().toString(),
+              metadata: { user_id: 'anonymous-user' },
+            },
+          ],
+        },
         rev: 6,
       },
     ]
+    this.fixedRanges = this.docs.map(doc => {
+      if (!doc.ranges?.comments?.length) return doc.ranges
+      return {
+        ...doc.ranges,
+        comments: [
+          { ...doc.ranges.comments[0], id: doc.ranges.comments[0].op.t },
+        ],
+      }
+    })
     this.deleted_doc = {
       _id: new ObjectId(),
       lines: ['deleted'],
-      ranges: { mock: 'four' },
+      ranges: {
+        comments: [{ id: new ObjectId().toString(), op: { t: 'thread-id-3' } }],
+        changes: [
+          { id: new ObjectId().toString(), metadata: { user_id: 'user-id-3' } },
+        ],
+      },
       rev: 8,
     }
     const version = 42
@@ -96,7 +139,7 @@ describe('Getting all docs', function () {
     })
   })
 
-  return it('getAllRanges should return all the (non-deleted) doc ranges', function (done) {
+  it('getAllRanges should return all the (non-deleted) doc ranges', function (done) {
     return DocstoreClient.getAllRanges(this.project_id, (error, res, docs) => {
       if (error != null) {
         throw error
@@ -104,9 +147,38 @@ describe('Getting all docs', function () {
       docs.length.should.equal(this.docs.length)
       for (let i = 0; i < docs.length; i++) {
         const doc = docs[i]
-        doc.ranges.should.deep.equal(this.docs[i].ranges)
+        doc.ranges.should.deep.equal(this.fixedRanges[i])
       }
       return done()
     })
   })
+
+  it('getTrackedChangesUserIds should return all the user ids from (non-deleted) ranges', function (done) {
+    DocstoreClient.getTrackedChangesUserIds(
+      this.project_id,
+      (error, res, userIds) => {
+        if (error != null) {
+          throw error
+        }
+        userIds.should.deep.equal(['user-id-1', 'user-id-2'])
+        done()
+      }
+    )
+  })
+
+  it('getCommentThreadIds should return all the thread ids from (non-deleted) ranges', function (done) {
+    DocstoreClient.getCommentThreadIds(
+      this.project_id,
+      (error, res, threadIds) => {
+        if (error != null) {
+          throw error
+        }
+        threadIds.should.deep.equal({
+          [this.docs[0]._id.toString()]: [this.threadId1],
+          [this.docs[2]._id.toString()]: [this.threadId2],
+        })
+        done()
+      }
+    )
+  })
 })
diff --git a/services/docstore/test/acceptance/js/GettingDocsTests.js b/services/docstore/test/acceptance/js/GettingDocsTests.js
index 121b3c1e24..1cfc53c5c6 100644
--- a/services/docstore/test/acceptance/js/GettingDocsTests.js
+++ b/services/docstore/test/acceptance/js/GettingDocsTests.js
@@ -28,10 +28,26 @@ describe('Getting a doc', function () {
           op: { i: 'foo', p: 3 },
           meta: {
             user_id: new ObjectId().toString(),
-            ts: new Date().toString(),
+            ts: new Date().toJSON(),
           },
         },
       ],
+      comments: [
+        {
+          id: new ObjectId().toString(),
+          op: { c: 'comment', p: 1, t: new ObjectId().toString() },
+          metadata: {
+            user_id: new ObjectId().toString(),
+            ts: new Date().toJSON(),
+          },
+        },
+      ],
+    }
+    this.fixedRanges = {
+      ...this.ranges,
+      comments: [
+        { ...this.ranges.comments[0], id: this.ranges.comments[0].op.t },
+      ],
     }
     return DocstoreApp.ensureRunning(() => {
       return DocstoreClient.createDoc(
@@ -60,7 +76,7 @@ describe('Getting a doc', function () {
           if (error) return done(error)
           doc.lines.should.deep.equal(this.lines)
           doc.version.should.equal(this.version)
-          doc.ranges.should.deep.equal(this.ranges)
+          doc.ranges.should.deep.equal(this.fixedRanges)
           return done()
         }
       )
@@ -114,7 +130,7 @@ describe('Getting a doc', function () {
           if (error) return done(error)
           doc.lines.should.deep.equal(this.lines)
           doc.version.should.equal(this.version)
-          doc.ranges.should.deep.equal(this.ranges)
+          doc.ranges.should.deep.equal(this.fixedRanges)
           doc.deleted.should.equal(true)
           return done()
         }
diff --git a/services/docstore/test/acceptance/js/HealthCheckerTest.js b/services/docstore/test/acceptance/js/HealthCheckerTest.js
new file mode 100644
index 0000000000..b25a45312b
--- /dev/null
+++ b/services/docstore/test/acceptance/js/HealthCheckerTest.js
@@ -0,0 +1,28 @@
+const { db } = require('../../../app/js/mongodb')
+const DocstoreApp = require('./helpers/DocstoreApp')
+const DocstoreClient = require('./helpers/DocstoreClient')
+const { expect } = require('chai')
+
+describe('HealthChecker', function () {
+  beforeEach('start', function (done) {
+    DocstoreApp.ensureRunning(done)
+  })
+  beforeEach('clear docs collection', async function () {
+    await db.docs.deleteMany({})
+  })
+  let res
+  beforeEach('run health check', function (done) {
+    DocstoreClient.healthCheck((err, _res) => {
+      res = _res
+      done(err)
+    })
+  })
+
+  it('should return 200', function () {
+    res.statusCode.should.equal(200)
+  })
+
+  it('should not leave any cruft behind', async function () {
+    expect(await db.docs.find({}).toArray()).to.deep.equal([])
+  })
+})
diff --git a/services/docstore/test/acceptance/js/helpers/DocstoreClient.js b/services/docstore/test/acceptance/js/helpers/DocstoreClient.js
index 790ec8f237..cb8bce2579 100644
--- a/services/docstore/test/acceptance/js/helpers/DocstoreClient.js
+++ b/services/docstore/test/acceptance/js/helpers/DocstoreClient.js
@@ -100,6 +100,26 @@ module.exports = DocstoreClient = {
     )
   },
 
+  getCommentThreadIds(projectId, callback) {
+    request.get(
+      {
+        url: `http://127.0.0.1:${settings.internal.docstore.port}/project/${projectId}/comment-thread-ids`,
+        json: true,
+      },
+      callback
+    )
+  },
+
+  getTrackedChangesUserIds(projectId, callback) {
+    request.get(
+      {
+        url: `http://127.0.0.1:${settings.internal.docstore.port}/project/${projectId}/tracked-changes-user-ids`,
+        json: true,
+      },
+      callback
+    )
+  },
+
   updateDoc(projectId, docId, lines, version, ranges, callback) {
     return request.post(
       {
@@ -181,6 +201,13 @@ module.exports = DocstoreClient = {
     )
   },
 
+  healthCheck(callback) {
+    request.get(
+      `http://127.0.0.1:${settings.internal.docstore.port}/health_check`,
+      callback
+    )
+  },
+
   getS3Doc(projectId, docId, callback) {
     getStringFromPersistor(
       Persistor,
diff --git a/services/docstore/test/unit/js/DocArchiveManagerTests.js b/services/docstore/test/unit/js/DocArchiveManagerTests.js
index a57f9806c8..2ec1cb2016 100644
--- a/services/docstore/test/unit/js/DocArchiveManagerTests.js
+++ b/services/docstore/test/unit/js/DocArchiveManagerTests.js
@@ -4,7 +4,7 @@ const modulePath = '../../../app/js/DocArchiveManager.js'
 const SandboxedModule = require('sandboxed-module')
 const { ObjectId } = require('mongodb-legacy')
 const Errors = require('../../../app/js/Errors')
-const StreamToBuffer = require('../../../app/js/StreamToBuffer').promises
+const StreamToBuffer = require('../../../app/js/StreamToBuffer')
 
 describe('DocArchiveManager', function () {
   let DocArchiveManager,
@@ -31,6 +31,7 @@ describe('DocArchiveManager', function () {
 
     RangeManager = {
       jsonRangesToMongo: sinon.stub().returns({ mongo: 'ranges' }),
+      fixCommentIds: sinon.stub(),
     }
     Settings = {
       docstore: {
@@ -142,37 +143,33 @@ describe('DocArchiveManager', function () {
     }
 
     MongoManager = {
-      promises: {
-        markDocAsArchived: sinon.stub().resolves(),
-        restoreArchivedDoc: sinon.stub().resolves(),
-        upsertIntoDocCollection: sinon.stub().resolves(),
-        getProjectsDocs: sinon.stub().resolves(mongoDocs),
-        getNonDeletedArchivedProjectDocs: getArchivedProjectDocs,
-        getNonArchivedProjectDocIds,
-        getArchivedProjectDocs,
-        findDoc: sinon.stub().callsFake(fakeGetDoc),
-        getDocForArchiving: sinon.stub().callsFake(fakeGetDoc),
-        destroyProject: sinon.stub().resolves(),
-      },
+      markDocAsArchived: sinon.stub().resolves(),
+      restoreArchivedDoc: sinon.stub().resolves(),
+      upsertIntoDocCollection: sinon.stub().resolves(),
+      getProjectsDocs: sinon.stub().resolves(mongoDocs),
+      getNonDeletedArchivedProjectDocs: getArchivedProjectDocs,
+      getNonArchivedProjectDocIds,
+      getArchivedProjectDocs,
+      findDoc: sinon.stub().callsFake(fakeGetDoc),
+      getDocForArchiving: sinon.stub().callsFake(fakeGetDoc),
+      destroyProject: sinon.stub().resolves(),
     }
 
     // Wrap streamToBuffer so that we can pass in something that it expects (in
     // this case, a Promise) rather than a stubbed stream object
     streamToBuffer = {
-      promises: {
-        streamToBuffer: async () => {
-          const inputStream = new Promise(resolve => {
-            stream.on('data', data => resolve(data))
-          })
+      streamToBuffer: async () => {
+        const inputStream = new Promise(resolve => {
+          stream.on('data', data => resolve(data))
+        })
 
-          const value = await StreamToBuffer.streamToBuffer(
-            'testProjectId',
-            'testDocId',
-            inputStream
-          )
+        const value = await StreamToBuffer.streamToBuffer(
+          'testProjectId',
+          'testDocId',
+          inputStream
+        )
 
-          return value
-        },
+        return value
       },
     }
 
@@ -192,9 +189,13 @@ describe('DocArchiveManager', function () {
 
   describe('archiveDoc', function () {
     it('should resolve when passed a valid document', async function () {
-      await expect(
-        DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
-      ).to.eventually.be.fulfilled
+      await expect(DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)).to
+        .eventually.be.fulfilled
+    })
+
+    it('should fix comment ids', async function () {
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[1]._id)
+      expect(RangeManager.fixCommentIds).to.have.been.called
     })
 
     it('should throw an error if the doc has no lines', async function () {
@@ -202,26 +203,26 @@ describe('DocArchiveManager', function () {
       doc.lines = null
 
       await expect(
-        DocArchiveManager.promises.archiveDoc(projectId, doc._id)
+        DocArchiveManager.archiveDoc(projectId, doc._id)
       ).to.eventually.be.rejectedWith('doc has no lines')
     })
 
     it('should add the schema version', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[1]._id)
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[1]._id)
       expect(StreamUtils.ReadableString).to.have.been.calledWith(
         sinon.match(/"schema_v":1/)
       )
     })
 
     it('should calculate the hex md5 sum of the content', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
       expect(Crypto.createHash).to.have.been.calledWith('md5')
       expect(HashUpdate).to.have.been.calledWith(archivedDocJson)
       expect(HashDigest).to.have.been.calledWith('hex')
     })
 
     it('should pass the md5 hash to the object persistor for verification', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
 
       expect(PersistorManager.sendStream).to.have.been.calledWith(
         sinon.match.any,
@@ -232,7 +233,7 @@ describe('DocArchiveManager', function () {
     })
 
     it('should pass the correct bucket and key to the persistor', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
 
       expect(PersistorManager.sendStream).to.have.been.calledWith(
         Settings.docstore.bucket,
@@ -241,7 +242,7 @@ describe('DocArchiveManager', function () {
     })
 
     it('should create a stream from the encoded json and send it', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
       expect(StreamUtils.ReadableString).to.have.been.calledWith(
         archivedDocJson
       )
@@ -253,8 +254,8 @@ describe('DocArchiveManager', function () {
     })
 
     it('should mark the doc as archived', async function () {
-      await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
-      expect(MongoManager.promises.markDocAsArchived).to.have.been.calledWith(
+      await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
+      expect(MongoManager.markDocAsArchived).to.have.been.calledWith(
         projectId,
         mongoDocs[0]._id,
         mongoDocs[0].rev
@@ -267,8 +268,8 @@ describe('DocArchiveManager', function () {
       })
 
       it('should bail out early', async function () {
-        await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
-        expect(MongoManager.promises.getDocForArchiving).to.not.have.been.called
+        await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
+        expect(MongoManager.getDocForArchiving).to.not.have.been.called
       })
     })
 
@@ -285,7 +286,7 @@ describe('DocArchiveManager', function () {
 
       it('should return an error', async function () {
         await expect(
-          DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
+          DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
         ).to.eventually.be.rejectedWith('null bytes detected')
       })
     })
@@ -296,21 +297,19 @@ describe('DocArchiveManager', function () {
 
     describe('when the doc is in S3', function () {
       beforeEach(function () {
-        MongoManager.promises.findDoc = sinon
-          .stub()
-          .resolves({ inS3: true, rev })
+        MongoManager.findDoc = sinon.stub().resolves({ inS3: true, rev })
         docId = mongoDocs[0]._id
         lines = ['doc', 'lines']
         rev = 123
       })
 
       it('should resolve when passed a valid document', async function () {
-        await expect(DocArchiveManager.promises.unarchiveDoc(projectId, docId))
-          .to.eventually.be.fulfilled
+        await expect(DocArchiveManager.unarchiveDoc(projectId, docId)).to
+          .eventually.be.fulfilled
       })
 
       it('should test md5 validity with the raw buffer', async function () {
-        await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+        await DocArchiveManager.unarchiveDoc(projectId, docId)
         expect(HashUpdate).to.have.been.calledWith(
           sinon.match.instanceOf(Buffer)
         )
@@ -319,15 +318,17 @@ describe('DocArchiveManager', function () {
       it('should throw an error if the md5 does not match', async function () {
         PersistorManager.getObjectMd5Hash.resolves('badf00d')
         await expect(
-          DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+          DocArchiveManager.unarchiveDoc(projectId, docId)
         ).to.eventually.be.rejected.and.be.instanceof(Errors.Md5MismatchError)
       })
 
       it('should restore the doc in Mongo', async function () {
-        await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
-        expect(
-          MongoManager.promises.restoreArchivedDoc
-        ).to.have.been.calledWith(projectId, docId, archivedDoc)
+        await DocArchiveManager.unarchiveDoc(projectId, docId)
+        expect(MongoManager.restoreArchivedDoc).to.have.been.calledWith(
+          projectId,
+          docId,
+          archivedDoc
+        )
       })
 
       describe('when archiving is not configured', function () {
@@ -337,15 +338,15 @@ describe('DocArchiveManager', function () {
 
         it('should error out on archived doc', async function () {
           await expect(
-            DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+            DocArchiveManager.unarchiveDoc(projectId, docId)
           ).to.eventually.be.rejected.and.match(
             /found archived doc, but archiving backend is not configured/
           )
         })
 
         it('should return early on non-archived doc', async function () {
-          MongoManager.promises.findDoc = sinon.stub().resolves({ rev })
-          await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+          MongoManager.findDoc = sinon.stub().resolves({ rev })
+          await DocArchiveManager.unarchiveDoc(projectId, docId)
           expect(PersistorManager.getObjectMd5Hash).to.not.have.been.called
         })
       })
@@ -363,10 +364,12 @@ describe('DocArchiveManager', function () {
           })
 
           it('should return the docs lines', async function () {
-            await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
-            expect(
-              MongoManager.promises.restoreArchivedDoc
-            ).to.have.been.calledWith(projectId, docId, { lines, rev })
+            await DocArchiveManager.unarchiveDoc(projectId, docId)
+            expect(MongoManager.restoreArchivedDoc).to.have.been.calledWith(
+              projectId,
+              docId,
+              { lines, rev }
+            )
           })
         })
 
@@ -385,14 +388,16 @@ describe('DocArchiveManager', function () {
           })
 
           it('should return the doc lines and ranges', async function () {
-            await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
-            expect(
-              MongoManager.promises.restoreArchivedDoc
-            ).to.have.been.calledWith(projectId, docId, {
-              lines,
-              ranges: { mongo: 'ranges' },
-              rev: 456,
-            })
+            await DocArchiveManager.unarchiveDoc(projectId, docId)
+            expect(MongoManager.restoreArchivedDoc).to.have.been.calledWith(
+              projectId,
+              docId,
+              {
+                lines,
+                ranges: { mongo: 'ranges' },
+                rev: 456,
+              }
+            )
           })
         })
 
@@ -406,10 +411,12 @@ describe('DocArchiveManager', function () {
           })
 
           it('should return only the doc lines', async function () {
-            await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
-            expect(
-              MongoManager.promises.restoreArchivedDoc
-            ).to.have.been.calledWith(projectId, docId, { lines, rev: 456 })
+            await DocArchiveManager.unarchiveDoc(projectId, docId)
+            expect(MongoManager.restoreArchivedDoc).to.have.been.calledWith(
+              projectId,
+              docId,
+              { lines, rev: 456 }
+            )
           })
         })
 
@@ -423,10 +430,12 @@ describe('DocArchiveManager', function () {
           })
 
           it('should use the rev obtained from Mongo', async function () {
-            await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
-            expect(
-              MongoManager.promises.restoreArchivedDoc
-            ).to.have.been.calledWith(projectId, docId, { lines, rev })
+            await DocArchiveManager.unarchiveDoc(projectId, docId)
+            expect(MongoManager.restoreArchivedDoc).to.have.been.calledWith(
+              projectId,
+              docId,
+              { lines, rev }
+            )
           })
         })
 
@@ -441,7 +450,7 @@ describe('DocArchiveManager', function () {
 
           it('should throw an error', async function () {
             await expect(
-              DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+              DocArchiveManager.unarchiveDoc(projectId, docId)
             ).to.eventually.be.rejectedWith(
               "I don't understand the doc format in s3"
             )
@@ -451,8 +460,8 @@ describe('DocArchiveManager', function () {
     })
 
     it('should not do anything if the file is already unarchived', async function () {
-      MongoManager.promises.findDoc.resolves({ inS3: false })
-      await DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+      MongoManager.findDoc.resolves({ inS3: false })
+      await DocArchiveManager.unarchiveDoc(projectId, docId)
       expect(PersistorManager.getObjectStream).not.to.have.been.called
     })
 
@@ -461,7 +470,7 @@ describe('DocArchiveManager', function () {
         .stub()
         .rejects(new Errors.NotFoundError())
       await expect(
-        DocArchiveManager.promises.unarchiveDoc(projectId, docId)
+        DocArchiveManager.unarchiveDoc(projectId, docId)
       ).to.eventually.be.rejected.and.be.instanceof(Errors.NotFoundError)
     })
   })
@@ -469,13 +478,11 @@ describe('DocArchiveManager', function () {
   describe('destroyProject', function () {
     describe('when archiving is enabled', function () {
       beforeEach(async function () {
-        await DocArchiveManager.promises.destroyProject(projectId)
+        await DocArchiveManager.destroyProject(projectId)
       })
 
       it('should delete the project in Mongo', function () {
-        expect(MongoManager.promises.destroyProject).to.have.been.calledWith(
-          projectId
-        )
+        expect(MongoManager.destroyProject).to.have.been.calledWith(projectId)
       })
 
       it('should delete the project in the persistor', function () {
@@ -489,13 +496,11 @@ describe('DocArchiveManager', function () {
     describe('when archiving is disabled', function () {
       beforeEach(async function () {
         Settings.docstore.backend = ''
-        await DocArchiveManager.promises.destroyProject(projectId)
+        await DocArchiveManager.destroyProject(projectId)
       })
 
       it('should delete the project in Mongo', function () {
-        expect(MongoManager.promises.destroyProject).to.have.been.calledWith(
-          projectId
-        )
+        expect(MongoManager.destroyProject).to.have.been.calledWith(projectId)
       })
 
       it('should not delete the project in the persistor', function () {
@@ -506,33 +511,35 @@ describe('DocArchiveManager', function () {
 
   describe('archiveAllDocs', function () {
     it('should resolve with valid arguments', async function () {
-      await expect(DocArchiveManager.promises.archiveAllDocs(projectId)).to
-        .eventually.be.fulfilled
+      await expect(DocArchiveManager.archiveAllDocs(projectId)).to.eventually.be
+        .fulfilled
     })
 
     it('should archive all project docs which are not in s3', async function () {
-      await DocArchiveManager.promises.archiveAllDocs(projectId)
+      await DocArchiveManager.archiveAllDocs(projectId)
       // not inS3
-      expect(MongoManager.promises.markDocAsArchived).to.have.been.calledWith(
+      expect(MongoManager.markDocAsArchived).to.have.been.calledWith(
         projectId,
         mongoDocs[0]._id
       )
-      expect(MongoManager.promises.markDocAsArchived).to.have.been.calledWith(
+      expect(MongoManager.markDocAsArchived).to.have.been.calledWith(
         projectId,
         mongoDocs[1]._id
       )
-      expect(MongoManager.promises.markDocAsArchived).to.have.been.calledWith(
+      expect(MongoManager.markDocAsArchived).to.have.been.calledWith(
         projectId,
         mongoDocs[4]._id
       )
 
       // inS3
-      expect(
-        MongoManager.promises.markDocAsArchived
-      ).not.to.have.been.calledWith(projectId, mongoDocs[2]._id)
-      expect(
-        MongoManager.promises.markDocAsArchived
-      ).not.to.have.been.calledWith(projectId, mongoDocs[3]._id)
+      expect(MongoManager.markDocAsArchived).not.to.have.been.calledWith(
+        projectId,
+        mongoDocs[2]._id
+      )
+      expect(MongoManager.markDocAsArchived).not.to.have.been.calledWith(
+        projectId,
+        mongoDocs[3]._id
+      )
     })
 
     describe('when archiving is not configured', function () {
@@ -541,21 +548,20 @@ describe('DocArchiveManager', function () {
       })
 
       it('should bail out early', async function () {
-        await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
-        expect(MongoManager.promises.getNonArchivedProjectDocIds).to.not.have
-          .been.called
+        await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
+        expect(MongoManager.getNonArchivedProjectDocIds).to.not.have.been.called
       })
     })
   })
 
   describe('unArchiveAllDocs', function () {
     it('should resolve with valid arguments', async function () {
-      await expect(DocArchiveManager.promises.unArchiveAllDocs(projectId)).to
-        .eventually.be.fulfilled
+      await expect(DocArchiveManager.unArchiveAllDocs(projectId)).to.eventually
+        .be.fulfilled
     })
 
     it('should unarchive all inS3 docs', async function () {
-      await DocArchiveManager.promises.unArchiveAllDocs(projectId)
+      await DocArchiveManager.unArchiveAllDocs(projectId)
 
       for (const doc of archivedDocs) {
         expect(PersistorManager.getObjectStream).to.have.been.calledWith(
@@ -571,9 +577,9 @@ describe('DocArchiveManager', function () {
       })
 
       it('should bail out early', async function () {
-        await DocArchiveManager.promises.archiveDoc(projectId, mongoDocs[0]._id)
-        expect(MongoManager.promises.getNonDeletedArchivedProjectDocs).to.not
-          .have.been.called
+        await DocArchiveManager.archiveDoc(projectId, mongoDocs[0]._id)
+        expect(MongoManager.getNonDeletedArchivedProjectDocs).to.not.have.been
+          .called
       })
     })
   })
diff --git a/services/docstore/test/unit/js/DocManagerTests.js b/services/docstore/test/unit/js/DocManagerTests.js
index 8405520e6e..67a2f26547 100644
--- a/services/docstore/test/unit/js/DocManagerTests.js
+++ b/services/docstore/test/unit/js/DocManagerTests.js
@@ -17,25 +17,22 @@ describe('DocManager', function () {
     this.version = 42
 
     this.MongoManager = {
-      promises: {
-        findDoc: sinon.stub(),
-        getProjectsDocs: sinon.stub(),
-        patchDoc: sinon.stub().resolves(),
-        upsertIntoDocCollection: sinon.stub().resolves(),
-      },
+      findDoc: sinon.stub(),
+      getProjectsDocs: sinon.stub(),
+      patchDoc: sinon.stub().resolves(),
+      upsertIntoDocCollection: sinon.stub().resolves(),
     }
     this.DocArchiveManager = {
-      promises: {
-        unarchiveDoc: sinon.stub(),
-        unArchiveAllDocs: sinon.stub(),
-        archiveDoc: sinon.stub().resolves(),
-      },
+      unarchiveDoc: sinon.stub(),
+      unArchiveAllDocs: sinon.stub(),
+      archiveDoc: sinon.stub().resolves(),
     }
     this.RangeManager = {
       jsonRangesToMongo(r) {
         return r
       },
       shouldUpdateRanges: sinon.stub().returns(false),
+      fixCommentIds: sinon.stub(),
     }
     this.settings = { docstore: {} }
 
@@ -52,7 +49,7 @@ describe('DocManager', function () {
 
   describe('getFullDoc', function () {
     beforeEach(function () {
-      this.DocManager.promises._getDoc = sinon.stub()
+      this.DocManager._getDoc = sinon.stub()
       this.doc = {
         _id: this.doc_id,
         lines: ['2134'],
@@ -60,13 +57,10 @@ describe('DocManager', function () {
     })
 
     it('should call get doc with a quick filter', async function () {
-      this.DocManager.promises._getDoc.resolves(this.doc)
-      const doc = await this.DocManager.promises.getFullDoc(
-        this.project_id,
-        this.doc_id
-      )
+      this.DocManager._getDoc.resolves(this.doc)
+      const doc = await this.DocManager.getFullDoc(this.project_id, this.doc_id)
       doc.should.equal(this.doc)
-      this.DocManager.promises._getDoc
+      this.DocManager._getDoc
         .calledWith(this.project_id, this.doc_id, {
           lines: true,
           rev: true,
@@ -79,27 +73,27 @@ describe('DocManager', function () {
     })
 
     it('should return error when get doc errors', async function () {
-      this.DocManager.promises._getDoc.rejects(this.stubbedError)
+      this.DocManager._getDoc.rejects(this.stubbedError)
       await expect(
-        this.DocManager.promises.getFullDoc(this.project_id, this.doc_id)
+        this.DocManager.getFullDoc(this.project_id, this.doc_id)
       ).to.be.rejectedWith(this.stubbedError)
     })
   })
 
   describe('getRawDoc', function () {
     beforeEach(function () {
-      this.DocManager.promises._getDoc = sinon.stub()
+      this.DocManager._getDoc = sinon.stub()
       this.doc = { lines: ['2134'] }
     })
 
     it('should call get doc with a quick filter', async function () {
-      this.DocManager.promises._getDoc.resolves(this.doc)
-      const doc = await this.DocManager.promises.getDocLines(
+      this.DocManager._getDoc.resolves(this.doc)
+      const content = await this.DocManager.getDocLines(
         this.project_id,
         this.doc_id
       )
-      doc.should.equal(this.doc)
-      this.DocManager.promises._getDoc
+      content.should.equal(this.doc.lines.join('\n'))
+      this.DocManager._getDoc
         .calledWith(this.project_id, this.doc_id, {
           lines: true,
           inS3: true,
@@ -108,11 +102,46 @@ describe('DocManager', function () {
     })
 
     it('should return error when get doc errors', async function () {
-      this.DocManager.promises._getDoc.rejects(this.stubbedError)
+      this.DocManager._getDoc.rejects(this.stubbedError)
       await expect(
-        this.DocManager.promises.getDocLines(this.project_id, this.doc_id)
+        this.DocManager.getDocLines(this.project_id, this.doc_id)
       ).to.be.rejectedWith(this.stubbedError)
     })
+
+    it('should return error when get doc does not exist', async function () {
+      this.DocManager._getDoc.resolves(null)
+      await expect(
+        this.DocManager.getDocLines(this.project_id, this.doc_id)
+      ).to.be.rejectedWith(Errors.NotFoundError)
+    })
+
+    it('should return error when get doc has no lines', async function () {
+      this.DocManager._getDoc.resolves({})
+      await expect(
+        this.DocManager.getDocLines(this.project_id, this.doc_id)
+      ).to.be.rejectedWith(Errors.DocWithoutLinesError)
+    })
+  })
+
+  describe('_getDoc', function () {
+    it('should return error when get doc does not exist', async function () {
+      this.MongoManager.findDoc.resolves(null)
+      await expect(
+        this.DocManager._getDoc(this.project_id, this.doc_id, { inS3: true })
+      ).to.be.rejectedWith(Errors.NotFoundError)
+    })
+
+    it('should fix comment ids', async function () {
+      this.MongoManager.findDoc.resolves({
+        _id: this.doc_id,
+        ranges: {},
+      })
+      await this.DocManager._getDoc(this.project_id, this.doc_id, {
+        inS3: true,
+        ranges: true,
+      })
+      expect(this.RangeManager.fixCommentIds).to.have.been.called
+    })
   })
 
   describe('getDoc', function () {
@@ -128,26 +157,25 @@ describe('DocManager', function () {
 
     describe('when using a filter', function () {
       beforeEach(function () {
-        this.MongoManager.promises.findDoc.resolves(this.doc)
+        this.MongoManager.findDoc.resolves(this.doc)
       })
 
       it('should error if inS3 is not set to true', async function () {
         await expect(
-          this.DocManager.promises._getDoc(this.project_id, this.doc_id, {
+          this.DocManager._getDoc(this.project_id, this.doc_id, {
             inS3: false,
           })
         ).to.be.rejected
       })
 
       it('should always get inS3 even when no filter is passed', async function () {
-        await expect(
-          this.DocManager.promises._getDoc(this.project_id, this.doc_id)
-        ).to.be.rejected
-        this.MongoManager.promises.findDoc.called.should.equal(false)
+        await expect(this.DocManager._getDoc(this.project_id, this.doc_id)).to
+          .be.rejected
+        this.MongoManager.findDoc.called.should.equal(false)
       })
 
       it('should not error if inS3 is set to true', async function () {
-        await this.DocManager.promises._getDoc(this.project_id, this.doc_id, {
+        await this.DocManager._getDoc(this.project_id, this.doc_id, {
           inS3: true,
         })
       })
@@ -155,8 +183,8 @@ describe('DocManager', function () {
 
     describe('when the doc is in the doc collection', function () {
       beforeEach(async function () {
-        this.MongoManager.promises.findDoc.resolves(this.doc)
-        this.result = await this.DocManager.promises._getDoc(
+        this.MongoManager.findDoc.resolves(this.doc)
+        this.result = await this.DocManager._getDoc(
           this.project_id,
           this.doc_id,
           { version: true, inS3: true }
@@ -164,7 +192,7 @@ describe('DocManager', function () {
       })
 
       it('should get the doc from the doc collection', function () {
-        this.MongoManager.promises.findDoc
+        this.MongoManager.findDoc
           .calledWith(this.project_id, this.doc_id)
           .should.equal(true)
       })
@@ -177,9 +205,9 @@ describe('DocManager', function () {
 
     describe('when MongoManager.findDoc errors', function () {
       it('should return the error', async function () {
-        this.MongoManager.promises.findDoc.rejects(this.stubbedError)
+        this.MongoManager.findDoc.rejects(this.stubbedError)
         await expect(
-          this.DocManager.promises._getDoc(this.project_id, this.doc_id, {
+          this.DocManager._getDoc(this.project_id, this.doc_id, {
             version: true,
             inS3: true,
           })
@@ -202,15 +230,15 @@ describe('DocManager', function () {
           version: 2,
           inS3: false,
         }
-        this.MongoManager.promises.findDoc.resolves(this.doc)
-        this.DocArchiveManager.promises.unarchiveDoc.callsFake(
+        this.MongoManager.findDoc.resolves(this.doc)
+        this.DocArchiveManager.unarchiveDoc.callsFake(
           async (projectId, docId) => {
-            this.MongoManager.promises.findDoc.resolves({
+            this.MongoManager.findDoc.resolves({
               ...this.unarchivedDoc,
             })
           }
         )
-        this.result = await this.DocManager.promises._getDoc(
+        this.result = await this.DocManager._getDoc(
           this.project_id,
           this.doc_id,
           {
@@ -221,13 +249,13 @@ describe('DocManager', function () {
       })
 
       it('should call the DocArchive to unarchive the doc', function () {
-        this.DocArchiveManager.promises.unarchiveDoc
+        this.DocArchiveManager.unarchiveDoc
           .calledWith(this.project_id, this.doc_id)
           .should.equal(true)
       })
 
       it('should look up the doc twice', function () {
-        this.MongoManager.promises.findDoc.calledTwice.should.equal(true)
+        this.MongoManager.findDoc.calledTwice.should.equal(true)
       })
 
       it('should return the doc', function () {
@@ -239,9 +267,9 @@ describe('DocManager', function () {
 
     describe('when the doc does not exist in the docs collection', function () {
       it('should return a NotFoundError', async function () {
-        this.MongoManager.promises.findDoc.resolves(null)
+        this.MongoManager.findDoc.resolves(null)
         await expect(
-          this.DocManager.promises._getDoc(this.project_id, this.doc_id, {
+          this.DocManager._getDoc(this.project_id, this.doc_id, {
             version: true,
             inS3: true,
           })
@@ -262,23 +290,27 @@ describe('DocManager', function () {
             lines: ['mock-lines'],
           },
         ]
-        this.MongoManager.promises.getProjectsDocs.resolves(this.docs)
-        this.DocArchiveManager.promises.unArchiveAllDocs.resolves(this.docs)
-        this.filter = { lines: true }
-        this.result = await this.DocManager.promises.getAllNonDeletedDocs(
+        this.MongoManager.getProjectsDocs.resolves(this.docs)
+        this.DocArchiveManager.unArchiveAllDocs.resolves(this.docs)
+        this.filter = { lines: true, ranges: true }
+        this.result = await this.DocManager.getAllNonDeletedDocs(
           this.project_id,
           this.filter
         )
       })
 
       it('should get the project from the database', function () {
-        this.MongoManager.promises.getProjectsDocs.should.have.been.calledWith(
+        this.MongoManager.getProjectsDocs.should.have.been.calledWith(
           this.project_id,
           { include_deleted: false },
           this.filter
         )
       })
 
+      it('should fix comment ids', async function () {
+        expect(this.RangeManager.fixCommentIds).to.have.been.called
+      })
+
       it('should return the docs', function () {
         expect(this.result).to.deep.equal(this.docs)
       })
@@ -286,13 +318,10 @@ describe('DocManager', function () {
 
     describe('when there are no docs for the project', function () {
       it('should return a NotFoundError', async function () {
-        this.MongoManager.promises.getProjectsDocs.resolves(null)
-        this.DocArchiveManager.promises.unArchiveAllDocs.resolves(null)
+        this.MongoManager.getProjectsDocs.resolves(null)
+        this.DocArchiveManager.unArchiveAllDocs.resolves(null)
         await expect(
-          this.DocManager.promises.getAllNonDeletedDocs(
-            this.project_id,
-            this.filter
-          )
+          this.DocManager.getAllNonDeletedDocs(this.project_id, this.filter)
         ).to.be.rejectedWith(`No docs for project ${this.project_id}`)
       })
     })
@@ -303,7 +332,7 @@ describe('DocManager', function () {
       beforeEach(function () {
         this.lines = ['mock', 'doc', 'lines']
         this.rev = 77
-        this.MongoManager.promises.findDoc.resolves({
+        this.MongoManager.findDoc.resolves({
           _id: new ObjectId(this.doc_id),
         })
         this.meta = {}
@@ -311,7 +340,7 @@ describe('DocManager', function () {
 
       describe('standard path', function () {
         beforeEach(async function () {
-          await this.DocManager.promises.patchDoc(
+          await this.DocManager.patchDoc(
             this.project_id,
             this.doc_id,
             this.meta
@@ -319,14 +348,14 @@ describe('DocManager', function () {
         })
 
         it('should get the doc', function () {
-          expect(this.MongoManager.promises.findDoc).to.have.been.calledWith(
+          expect(this.MongoManager.findDoc).to.have.been.calledWith(
             this.project_id,
             this.doc_id
           )
         })
 
         it('should persist the meta', function () {
-          expect(this.MongoManager.promises.patchDoc).to.have.been.calledWith(
+          expect(this.MongoManager.patchDoc).to.have.been.calledWith(
             this.project_id,
             this.doc_id,
             this.meta
@@ -339,7 +368,7 @@ describe('DocManager', function () {
           this.settings.docstore.archiveOnSoftDelete = false
           this.meta.deleted = true
 
-          await this.DocManager.promises.patchDoc(
+          await this.DocManager.patchDoc(
             this.project_id,
             this.doc_id,
             this.meta
@@ -347,8 +376,7 @@ describe('DocManager', function () {
         })
 
         it('should not flush the doc out of mongo', function () {
-          expect(this.DocArchiveManager.promises.archiveDoc).to.not.have.been
-            .called
+          expect(this.DocArchiveManager.archiveDoc).to.not.have.been.called
         })
       })
 
@@ -356,7 +384,7 @@ describe('DocManager', function () {
         beforeEach(async function () {
           this.settings.docstore.archiveOnSoftDelete = false
           this.meta.deleted = false
-          await this.DocManager.promises.patchDoc(
+          await this.DocManager.patchDoc(
             this.project_id,
             this.doc_id,
             this.meta
@@ -364,8 +392,7 @@ describe('DocManager', function () {
         })
 
         it('should not flush the doc out of mongo', function () {
-          expect(this.DocArchiveManager.promises.archiveDoc).to.not.have.been
-            .called
+          expect(this.DocArchiveManager.archiveDoc).to.not.have.been.called
         })
       })
 
@@ -377,7 +404,7 @@ describe('DocManager', function () {
 
         describe('when the background flush succeeds', function () {
           beforeEach(async function () {
-            await this.DocManager.promises.patchDoc(
+            await this.DocManager.patchDoc(
               this.project_id,
               this.doc_id,
               this.meta
@@ -389,17 +416,18 @@ describe('DocManager', function () {
           })
 
           it('should flush the doc out of mongo', function () {
-            expect(
-              this.DocArchiveManager.promises.archiveDoc
-            ).to.have.been.calledWith(this.project_id, this.doc_id)
+            expect(this.DocArchiveManager.archiveDoc).to.have.been.calledWith(
+              this.project_id,
+              this.doc_id
+            )
           })
         })
 
         describe('when the background flush fails', function () {
           beforeEach(async function () {
             this.err = new Error('foo')
-            this.DocArchiveManager.promises.archiveDoc.rejects(this.err)
-            await this.DocManager.promises.patchDoc(
+            this.DocArchiveManager.archiveDoc.rejects(this.err)
+            await this.DocManager.patchDoc(
               this.project_id,
               this.doc_id,
               this.meta
@@ -422,9 +450,9 @@ describe('DocManager', function () {
 
     describe('when the doc does not exist', function () {
       it('should return a NotFoundError', async function () {
-        this.MongoManager.promises.findDoc.resolves(null)
+        this.MongoManager.findDoc.resolves(null)
         await expect(
-          this.DocManager.promises.patchDoc(this.project_id, this.doc_id, {})
+          this.DocManager.patchDoc(this.project_id, this.doc_id, {})
         ).to.be.rejectedWith(
           `No such project/doc to delete: ${this.project_id}/${this.doc_id}`
         )
@@ -470,13 +498,13 @@ describe('DocManager', function () {
         ranges: this.originalRanges,
       }
 
-      this.DocManager.promises._getDoc = sinon.stub()
+      this.DocManager._getDoc = sinon.stub()
     })
 
     describe('when only the doc lines have changed', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.newDocLines,
@@ -486,7 +514,7 @@ describe('DocManager', function () {
       })
 
       it('should get the existing doc', function () {
-        this.DocManager.promises._getDoc
+        this.DocManager._getDoc
           .calledWith(this.project_id, this.doc_id, {
             version: true,
             rev: true,
@@ -498,7 +526,7 @@ describe('DocManager', function () {
       })
 
       it('should upsert the document to the doc collection', function () {
-        this.MongoManager.promises.upsertIntoDocCollection
+        this.MongoManager.upsertIntoDocCollection
           .calledWith(this.project_id, this.doc_id, this.rev, {
             lines: this.newDocLines,
           })
@@ -512,9 +540,9 @@ describe('DocManager', function () {
 
     describe('when the doc ranges have changed', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
         this.RangeManager.shouldUpdateRanges.returns(true)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.oldDocLines,
@@ -524,7 +552,7 @@ describe('DocManager', function () {
       })
 
       it('should upsert the ranges', function () {
-        this.MongoManager.promises.upsertIntoDocCollection
+        this.MongoManager.upsertIntoDocCollection
           .calledWith(this.project_id, this.doc_id, this.rev, {
             ranges: this.newRanges,
           })
@@ -538,8 +566,8 @@ describe('DocManager', function () {
 
     describe('when only the version has changed', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.oldDocLines,
@@ -549,7 +577,7 @@ describe('DocManager', function () {
       })
 
       it('should update the version', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.should.have.been.calledWith(
+        this.MongoManager.upsertIntoDocCollection.should.have.been.calledWith(
           this.project_id,
           this.doc_id,
           this.rev,
@@ -564,8 +592,8 @@ describe('DocManager', function () {
 
     describe('when the doc has not changed at all', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.oldDocLines,
@@ -575,9 +603,7 @@ describe('DocManager', function () {
       })
 
       it('should not update the ranges or lines or version', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.called.should.equal(
-          false
-        )
+        this.MongoManager.upsertIntoDocCollection.called.should.equal(false)
       })
 
       it('should return the old rev and modified == false', function () {
@@ -588,7 +614,7 @@ describe('DocManager', function () {
     describe('when the version is null', function () {
       it('should return an error', async function () {
         await expect(
-          this.DocManager.promises.updateDoc(
+          this.DocManager.updateDoc(
             this.project_id,
             this.doc_id,
             this.newDocLines,
@@ -602,7 +628,7 @@ describe('DocManager', function () {
     describe('when the lines are null', function () {
       it('should return an error', async function () {
         await expect(
-          this.DocManager.promises.updateDoc(
+          this.DocManager.updateDoc(
             this.project_id,
             this.doc_id,
             null,
@@ -616,7 +642,7 @@ describe('DocManager', function () {
     describe('when the ranges are null', function () {
       it('should return an error', async function () {
         await expect(
-          this.DocManager.promises.updateDoc(
+          this.DocManager.updateDoc(
             this.project_id,
             this.doc_id,
             this.newDocLines,
@@ -630,9 +656,9 @@ describe('DocManager', function () {
     describe('when there is a generic error getting the doc', function () {
       beforeEach(async function () {
         this.error = new Error('doc could not be found')
-        this.DocManager.promises._getDoc = sinon.stub().rejects(this.error)
+        this.DocManager._getDoc = sinon.stub().rejects(this.error)
         await expect(
-          this.DocManager.promises.updateDoc(
+          this.DocManager.updateDoc(
             this.project_id,
             this.doc_id,
             this.newDocLines,
@@ -643,16 +669,15 @@ describe('DocManager', function () {
       })
 
       it('should not upsert the document to the doc collection', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.should.not.have.been
-          .called
+        this.MongoManager.upsertIntoDocCollection.should.not.have.been.called
       })
     })
 
     describe('when the version was decremented', function () {
       it('should return an error', async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
         await expect(
-          this.DocManager.promises.updateDoc(
+          this.DocManager.updateDoc(
             this.project_id,
             this.doc_id,
             this.newDocLines,
@@ -665,8 +690,8 @@ describe('DocManager', function () {
 
     describe('when the doc lines have not changed', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.oldDocLines.slice(),
@@ -676,9 +701,7 @@ describe('DocManager', function () {
       })
 
       it('should not update the doc', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.called.should.equal(
-          false
-        )
+        this.MongoManager.upsertIntoDocCollection.called.should.equal(false)
       })
 
       it('should return the existing rev', function () {
@@ -688,8 +711,8 @@ describe('DocManager', function () {
 
     describe('when the doc does not exist', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(null)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.DocManager._getDoc = sinon.stub().resolves(null)
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.newDocLines,
@@ -699,7 +722,7 @@ describe('DocManager', function () {
       })
 
       it('should upsert the document to the doc collection', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.should.have.been.calledWith(
+        this.MongoManager.upsertIntoDocCollection.should.have.been.calledWith(
           this.project_id,
           this.doc_id,
           undefined,
@@ -718,12 +741,12 @@ describe('DocManager', function () {
 
     describe('when another update is racing', function () {
       beforeEach(async function () {
-        this.DocManager.promises._getDoc = sinon.stub().resolves(this.doc)
-        this.MongoManager.promises.upsertIntoDocCollection
+        this.DocManager._getDoc = sinon.stub().resolves(this.doc)
+        this.MongoManager.upsertIntoDocCollection
           .onFirstCall()
           .rejects(new Errors.DocRevValueError())
         this.RangeManager.shouldUpdateRanges.returns(true)
-        this.result = await this.DocManager.promises.updateDoc(
+        this.result = await this.DocManager.updateDoc(
           this.project_id,
           this.doc_id,
           this.newDocLines,
@@ -733,7 +756,7 @@ describe('DocManager', function () {
       })
 
       it('should upsert the doc twice', function () {
-        this.MongoManager.promises.upsertIntoDocCollection.should.have.been.calledWith(
+        this.MongoManager.upsertIntoDocCollection.should.have.been.calledWith(
           this.project_id,
           this.doc_id,
           this.rev,
@@ -743,8 +766,7 @@ describe('DocManager', function () {
             version: this.version + 1,
           }
         )
-        this.MongoManager.promises.upsertIntoDocCollection.should.have.been
-          .calledTwice
+        this.MongoManager.upsertIntoDocCollection.should.have.been.calledTwice
       })
 
       it('should return the new rev', function () {
diff --git a/services/docstore/test/unit/js/HttpControllerTests.js b/services/docstore/test/unit/js/HttpControllerTests.js
index bf78696890..ab491ec150 100644
--- a/services/docstore/test/unit/js/HttpControllerTests.js
+++ b/services/docstore/test/unit/js/HttpControllerTests.js
@@ -14,7 +14,7 @@ describe('HttpController', function () {
       max_doc_length: 2 * 1024 * 1024,
     }
     this.DocArchiveManager = {
-      unArchiveAllDocs: sinon.stub().yields(),
+      unArchiveAllDocs: sinon.stub().returns(),
     }
     this.DocManager = {}
     this.HttpController = SandboxedModule.require(modulePath, {
@@ -54,15 +54,13 @@ describe('HttpController', function () {
 
   describe('getDoc', function () {
     describe('without deleted docs', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.params = {
           project_id: this.projectId,
           doc_id: this.docId,
         }
-        this.DocManager.getFullDoc = sinon
-          .stub()
-          .callsArgWith(2, null, this.doc)
-        this.HttpController.getDoc(this.req, this.res, this.next)
+        this.DocManager.getFullDoc = sinon.stub().resolves(this.doc)
+        await this.HttpController.getDoc(this.req, this.res, this.next)
       })
 
       it('should get the document with the version (including deleted)', function () {
@@ -89,26 +87,24 @@ describe('HttpController', function () {
           project_id: this.projectId,
           doc_id: this.docId,
         }
-        this.DocManager.getFullDoc = sinon
-          .stub()
-          .callsArgWith(2, null, this.deletedDoc)
+        this.DocManager.getFullDoc = sinon.stub().resolves(this.deletedDoc)
       })
 
-      it('should get the doc from the doc manager', function () {
-        this.HttpController.getDoc(this.req, this.res, this.next)
+      it('should get the doc from the doc manager', async function () {
+        await this.HttpController.getDoc(this.req, this.res, this.next)
         this.DocManager.getFullDoc
           .calledWith(this.projectId, this.docId)
           .should.equal(true)
       })
 
-      it('should return 404 if the query string delete is not set ', function () {
-        this.HttpController.getDoc(this.req, this.res, this.next)
+      it('should return 404 if the query string delete is not set ', async function () {
+        await this.HttpController.getDoc(this.req, this.res, this.next)
         this.res.sendStatus.calledWith(404).should.equal(true)
       })
 
-      it('should return the doc as JSON if include_deleted is set to true', function () {
+      it('should return the doc as JSON if include_deleted is set to true', async function () {
         this.req.query.include_deleted = 'true'
-        this.HttpController.getDoc(this.req, this.res, this.next)
+        await this.HttpController.getDoc(this.req, this.res, this.next)
         this.res.json
           .calledWith({
             _id: this.docId,
@@ -123,13 +119,15 @@ describe('HttpController', function () {
   })
 
   describe('getRawDoc', function () {
-    beforeEach(function () {
+    beforeEach(async function () {
       this.req.params = {
         project_id: this.projectId,
         doc_id: this.docId,
       }
-      this.DocManager.getDocLines = sinon.stub().callsArgWith(2, null, this.doc)
-      this.HttpController.getRawDoc(this.req, this.res, this.next)
+      this.DocManager.getDocLines = sinon
+        .stub()
+        .resolves(this.doc.lines.join('\n'))
+      await this.HttpController.getRawDoc(this.req, this.res, this.next)
     })
 
     it('should get the document without the version', function () {
@@ -154,7 +152,7 @@ describe('HttpController', function () {
 
   describe('getAllDocs', function () {
     describe('normally', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.params = { project_id: this.projectId }
         this.docs = [
           {
@@ -168,10 +166,8 @@ describe('HttpController', function () {
             rev: 4,
           },
         ]
-        this.DocManager.getAllNonDeletedDocs = sinon
-          .stub()
-          .callsArgWith(2, null, this.docs)
-        this.HttpController.getAllDocs(this.req, this.res, this.next)
+        this.DocManager.getAllNonDeletedDocs = sinon.stub().resolves(this.docs)
+        await this.HttpController.getAllDocs(this.req, this.res, this.next)
       })
 
       it('should get all the (non-deleted) docs', function () {
@@ -199,7 +195,7 @@ describe('HttpController', function () {
     })
 
     describe('with null lines', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.params = { project_id: this.projectId }
         this.docs = [
           {
@@ -213,10 +209,8 @@ describe('HttpController', function () {
             rev: 4,
           },
         ]
-        this.DocManager.getAllNonDeletedDocs = sinon
-          .stub()
-          .callsArgWith(2, null, this.docs)
-        this.HttpController.getAllDocs(this.req, this.res, this.next)
+        this.DocManager.getAllNonDeletedDocs = sinon.stub().resolves(this.docs)
+        await this.HttpController.getAllDocs(this.req, this.res, this.next)
       })
 
       it('should return the doc with fallback lines', function () {
@@ -238,7 +232,7 @@ describe('HttpController', function () {
     })
 
     describe('with a null doc', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.params = { project_id: this.projectId }
         this.docs = [
           {
@@ -253,10 +247,8 @@ describe('HttpController', function () {
             rev: 4,
           },
         ]
-        this.DocManager.getAllNonDeletedDocs = sinon
-          .stub()
-          .callsArgWith(2, null, this.docs)
-        this.HttpController.getAllDocs(this.req, this.res, this.next)
+        this.DocManager.getAllNonDeletedDocs = sinon.stub().resolves(this.docs)
+        await this.HttpController.getAllDocs(this.req, this.res, this.next)
       })
 
       it('should return the non null docs as JSON', function () {
@@ -292,7 +284,7 @@ describe('HttpController', function () {
 
   describe('getAllRanges', function () {
     describe('normally', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.params = { project_id: this.projectId }
         this.docs = [
           {
@@ -304,10 +296,8 @@ describe('HttpController', function () {
             ranges: { mock_ranges: 'two' },
           },
         ]
-        this.DocManager.getAllNonDeletedDocs = sinon
-          .stub()
-          .callsArgWith(2, null, this.docs)
-        this.HttpController.getAllRanges(this.req, this.res, this.next)
+        this.DocManager.getAllNonDeletedDocs = sinon.stub().resolves(this.docs)
+        await this.HttpController.getAllRanges(this.req, this.res, this.next)
       })
 
       it('should get all the (non-deleted) doc ranges', function () {
@@ -342,16 +332,17 @@ describe('HttpController', function () {
     })
 
     describe('when the doc lines exist and were updated', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = {
           lines: (this.lines = ['hello', 'world']),
           version: (this.version = 42),
           ranges: (this.ranges = { changes: 'mock' }),
         }
+        this.rev = 5
         this.DocManager.updateDoc = sinon
           .stub()
-          .yields(null, true, (this.rev = 5))
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+          .resolves({ modified: true, rev: this.rev })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
       })
 
       it('should update the document', function () {
@@ -374,16 +365,17 @@ describe('HttpController', function () {
     })
 
     describe('when the doc lines exist and were not updated', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = {
           lines: (this.lines = ['hello', 'world']),
           version: (this.version = 42),
           ranges: {},
         }
+        this.rev = 5
         this.DocManager.updateDoc = sinon
           .stub()
-          .yields(null, false, (this.rev = 5))
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+          .resolves({ modified: false, rev: this.rev })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
       })
 
       it('should return a modified status', function () {
@@ -394,10 +386,12 @@ describe('HttpController', function () {
     })
 
     describe('when the doc lines are not provided', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = { version: 42, ranges: {} }
-        this.DocManager.updateDoc = sinon.stub().yields(null, false)
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+        this.DocManager.updateDoc = sinon
+          .stub()
+          .resolves({ modified: false, rev: 0 })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
       })
 
       it('should not update the document', function () {
@@ -410,10 +404,12 @@ describe('HttpController', function () {
     })
 
     describe('when the doc version are not provided', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = { version: 42, lines: ['hello world'] }
-        this.DocManager.updateDoc = sinon.stub().yields(null, false)
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+        this.DocManager.updateDoc = sinon
+          .stub()
+          .resolves({ modified: false, rev: 0 })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
       })
 
       it('should not update the document', function () {
@@ -426,10 +422,12 @@ describe('HttpController', function () {
     })
 
     describe('when the doc ranges is not provided', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = { lines: ['foo'], version: 42 }
-        this.DocManager.updateDoc = sinon.stub().yields(null, false)
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+        this.DocManager.updateDoc = sinon
+          .stub()
+          .resolves({ modified: false, rev: 0 })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
       })
 
       it('should not update the document', function () {
@@ -442,13 +440,20 @@ describe('HttpController', function () {
     })
 
     describe('when the doc body is too large', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = {
           lines: (this.lines = Array(2049).fill('a'.repeat(1024))),
           version: (this.version = 42),
           ranges: (this.ranges = { changes: 'mock' }),
         }
-        this.HttpController.updateDoc(this.req, this.res, this.next)
+        this.DocManager.updateDoc = sinon
+          .stub()
+          .resolves({ modified: false, rev: 0 })
+        await this.HttpController.updateDoc(this.req, this.res, this.next)
+      })
+
+      it('should not update the document', function () {
+        this.DocManager.updateDoc.called.should.equal(false)
       })
 
       it('should return a 413 (too large) response', function () {
@@ -462,14 +467,14 @@ describe('HttpController', function () {
   })
 
   describe('patchDoc', function () {
-    beforeEach(function () {
+    beforeEach(async function () {
       this.req.params = {
         project_id: this.projectId,
         doc_id: this.docId,
       }
       this.req.body = { name: 'foo.tex' }
-      this.DocManager.patchDoc = sinon.stub().yields(null)
-      this.HttpController.patchDoc(this.req, this.res, this.next)
+      this.DocManager.patchDoc = sinon.stub().resolves()
+      await this.HttpController.patchDoc(this.req, this.res, this.next)
     })
 
     it('should delete the document', function () {
@@ -484,11 +489,11 @@ describe('HttpController', function () {
     })
 
     describe('with an invalid payload', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.req.body = { cannot: 'happen' }
 
-        this.DocManager.patchDoc = sinon.stub().yields(null)
-        this.HttpController.patchDoc(this.req, this.res, this.next)
+        this.DocManager.patchDoc = sinon.stub().resolves()
+        await this.HttpController.patchDoc(this.req, this.res, this.next)
       })
 
       it('should log a message', function () {
@@ -509,10 +514,10 @@ describe('HttpController', function () {
   })
 
   describe('archiveAllDocs', function () {
-    beforeEach(function () {
+    beforeEach(async function () {
       this.req.params = { project_id: this.projectId }
-      this.DocArchiveManager.archiveAllDocs = sinon.stub().callsArg(1)
-      this.HttpController.archiveAllDocs(this.req, this.res, this.next)
+      this.DocArchiveManager.archiveAllDocs = sinon.stub().resolves()
+      await this.HttpController.archiveAllDocs(this.req, this.res, this.next)
     })
 
     it('should archive the project', function () {
@@ -532,9 +537,12 @@ describe('HttpController', function () {
     })
 
     describe('on success', function () {
-      beforeEach(function (done) {
-        this.res.sendStatus.callsFake(() => done())
-        this.HttpController.unArchiveAllDocs(this.req, this.res, this.next)
+      beforeEach(async function () {
+        await this.HttpController.unArchiveAllDocs(
+          this.req,
+          this.res,
+          this.next
+        )
       })
 
       it('returns a 200', function () {
@@ -543,12 +551,15 @@ describe('HttpController', function () {
     })
 
     describe("when the archived rev doesn't match", function () {
-      beforeEach(function (done) {
-        this.res.sendStatus.callsFake(() => done())
-        this.DocArchiveManager.unArchiveAllDocs.yields(
+      beforeEach(async function () {
+        this.DocArchiveManager.unArchiveAllDocs.rejects(
           new Errors.DocRevValueError('bad rev')
         )
-        this.HttpController.unArchiveAllDocs(this.req, this.res, this.next)
+        await this.HttpController.unArchiveAllDocs(
+          this.req,
+          this.res,
+          this.next
+        )
       })
 
       it('returns a 409', function () {
@@ -558,10 +569,10 @@ describe('HttpController', function () {
   })
 
   describe('destroyProject', function () {
-    beforeEach(function () {
+    beforeEach(async function () {
       this.req.params = { project_id: this.projectId }
-      this.DocArchiveManager.destroyProject = sinon.stub().callsArg(1)
-      this.HttpController.destroyProject(this.req, this.res, this.next)
+      this.DocArchiveManager.destroyProject = sinon.stub().resolves()
+      await this.HttpController.destroyProject(this.req, this.res, this.next)
     })
 
     it('should destroy the docs', function () {
diff --git a/services/docstore/test/unit/js/MongoManagerTests.js b/services/docstore/test/unit/js/MongoManagerTests.js
index 4f8467db76..b96b661df4 100644
--- a/services/docstore/test/unit/js/MongoManagerTests.js
+++ b/services/docstore/test/unit/js/MongoManagerTests.js
@@ -41,7 +41,7 @@ describe('MongoManager', function () {
       this.doc = { name: 'mock-doc' }
       this.db.docs.findOne = sinon.stub().resolves(this.doc)
       this.filter = { lines: true }
-      this.result = await this.MongoManager.promises.findDoc(
+      this.result = await this.MongoManager.findDoc(
         this.projectId,
         this.docId,
         this.filter
@@ -70,11 +70,7 @@ describe('MongoManager', function () {
   describe('patchDoc', function () {
     beforeEach(async function () {
       this.meta = { name: 'foo.tex' }
-      await this.MongoManager.promises.patchDoc(
-        this.projectId,
-        this.docId,
-        this.meta
-      )
+      await this.MongoManager.patchDoc(this.projectId, this.docId, this.meta)
     })
 
     it('should pass the parameter along', function () {
@@ -104,7 +100,7 @@ describe('MongoManager', function () {
 
     describe('with included_deleted = false', function () {
       beforeEach(async function () {
-        this.result = await this.MongoManager.promises.getProjectsDocs(
+        this.result = await this.MongoManager.getProjectsDocs(
           this.projectId,
           { include_deleted: false },
           this.filter
@@ -132,7 +128,7 @@ describe('MongoManager', function () {
 
     describe('with included_deleted = true', function () {
       beforeEach(async function () {
-        this.result = await this.MongoManager.promises.getProjectsDocs(
+        this.result = await this.MongoManager.getProjectsDocs(
           this.projectId,
           { include_deleted: true },
           this.filter
@@ -167,7 +163,7 @@ describe('MongoManager', function () {
       this.db.docs.find = sinon.stub().returns({
         toArray: sinon.stub().resolves([this.doc1, this.doc2, this.doc3]),
       })
-      this.result = await this.MongoManager.promises.getProjectsDeletedDocs(
+      this.result = await this.MongoManager.getProjectsDeletedDocs(
         this.projectId,
         this.filter
       )
@@ -203,7 +199,7 @@ describe('MongoManager', function () {
     })
 
     it('should upsert the document', async function () {
-      await this.MongoManager.promises.upsertIntoDocCollection(
+      await this.MongoManager.upsertIntoDocCollection(
         this.projectId,
         this.docId,
         this.oldRev,
@@ -223,7 +219,7 @@ describe('MongoManager', function () {
     it('should handle update error', async function () {
       this.db.docs.updateOne.rejects(this.stubbedErr)
       await expect(
-        this.MongoManager.promises.upsertIntoDocCollection(
+        this.MongoManager.upsertIntoDocCollection(
           this.projectId,
           this.docId,
           this.rev,
@@ -235,7 +231,7 @@ describe('MongoManager', function () {
     })
 
     it('should insert without a previous rev', async function () {
-      await this.MongoManager.promises.upsertIntoDocCollection(
+      await this.MongoManager.upsertIntoDocCollection(
         this.projectId,
         this.docId,
         null,
@@ -254,7 +250,7 @@ describe('MongoManager', function () {
     it('should handle generic insert error', async function () {
       this.db.docs.insertOne.rejects(this.stubbedErr)
       await expect(
-        this.MongoManager.promises.upsertIntoDocCollection(
+        this.MongoManager.upsertIntoDocCollection(
           this.projectId,
           this.docId,
           null,
@@ -266,7 +262,7 @@ describe('MongoManager', function () {
     it('should handle duplicate insert error', async function () {
       this.db.docs.insertOne.rejects({ code: 11000 })
       await expect(
-        this.MongoManager.promises.upsertIntoDocCollection(
+        this.MongoManager.upsertIntoDocCollection(
           this.projectId,
           this.docId,
           null,
@@ -280,7 +276,7 @@ describe('MongoManager', function () {
     beforeEach(async function () {
       this.projectId = new ObjectId()
       this.db.docs.deleteMany = sinon.stub().resolves()
-      await this.MongoManager.promises.destroyProject(this.projectId)
+      await this.MongoManager.destroyProject(this.projectId)
     })
 
     it('should destroy all docs', function () {
@@ -297,13 +293,13 @@ describe('MongoManager', function () {
 
     it('should not error when the rev has not changed', async function () {
       this.db.docs.findOne = sinon.stub().resolves({ rev: 1 })
-      await this.MongoManager.promises.checkRevUnchanged(this.doc)
+      await this.MongoManager.checkRevUnchanged(this.doc)
     })
 
     it('should return an error when the rev has changed', async function () {
       this.db.docs.findOne = sinon.stub().resolves({ rev: 2 })
       await expect(
-        this.MongoManager.promises.checkRevUnchanged(this.doc)
+        this.MongoManager.checkRevUnchanged(this.doc)
       ).to.be.rejectedWith(Errors.DocModifiedError)
     })
 
@@ -311,14 +307,14 @@ describe('MongoManager', function () {
       this.db.docs.findOne = sinon.stub().resolves({ rev: 2 })
       this.doc = { _id: new ObjectId(), name: 'mock-doc', rev: NaN }
       await expect(
-        this.MongoManager.promises.checkRevUnchanged(this.doc)
+        this.MongoManager.checkRevUnchanged(this.doc)
       ).to.be.rejectedWith(Errors.DocRevValueError)
     })
 
     it('should return a value error if checked doc rev is NaN', async function () {
       this.db.docs.findOne = sinon.stub().resolves({ rev: NaN })
       await expect(
-        this.MongoManager.promises.checkRevUnchanged(this.doc)
+        this.MongoManager.checkRevUnchanged(this.doc)
       ).to.be.rejectedWith(Errors.DocRevValueError)
     })
   })
@@ -334,7 +330,7 @@ describe('MongoManager', function () {
 
     describe('complete doc', function () {
       beforeEach(async function () {
-        await this.MongoManager.promises.restoreArchivedDoc(
+        await this.MongoManager.restoreArchivedDoc(
           this.projectId,
           this.docId,
           this.archivedDoc
@@ -364,7 +360,7 @@ describe('MongoManager', function () {
     describe('without ranges', function () {
       beforeEach(async function () {
         delete this.archivedDoc.ranges
-        await this.MongoManager.promises.restoreArchivedDoc(
+        await this.MongoManager.restoreArchivedDoc(
           this.projectId,
           this.docId,
           this.archivedDoc
@@ -395,7 +391,7 @@ describe('MongoManager', function () {
       it('throws a DocRevValueError', async function () {
         this.db.docs.updateOne.resolves({ matchedCount: 0 })
         await expect(
-          this.MongoManager.promises.restoreArchivedDoc(
+          this.MongoManager.restoreArchivedDoc(
             this.projectId,
             this.docId,
             this.archivedDoc
diff --git a/services/docstore/test/unit/js/RangeManagerTests.js b/services/docstore/test/unit/js/RangeManagerTests.js
index 7a2de7352e..ba99280a7a 100644
--- a/services/docstore/test/unit/js/RangeManagerTests.js
+++ b/services/docstore/test/unit/js/RangeManagerTests.js
@@ -30,7 +30,7 @@ describe('RangeManager', function () {
   })
 
   describe('jsonRangesToMongo', function () {
-    it('should convert ObjectIds and dates to proper objects', function () {
+    it('should convert ObjectIds and dates to proper objects and fix comment id', function () {
       const changeId = new ObjectId().toString()
       const commentId = new ObjectId().toString()
       const userId = new ObjectId().toString()
@@ -66,7 +66,7 @@ describe('RangeManager', function () {
         ],
         comments: [
           {
-            id: new ObjectId(commentId),
+            id: new ObjectId(threadId),
             op: { c: 'foo', p: 3, t: new ObjectId(threadId) },
           },
         ],
@@ -110,7 +110,6 @@ describe('RangeManager', function () {
 
     return it('should be consistent when transformed through json -> mongo -> json', function () {
       const changeId = new ObjectId().toString()
-      const commentId = new ObjectId().toString()
       const userId = new ObjectId().toString()
       const threadId = new ObjectId().toString()
       const ts = new Date().toJSON()
@@ -127,7 +126,7 @@ describe('RangeManager', function () {
         ],
         comments: [
           {
-            id: commentId,
+            id: threadId,
             op: { c: 'foo', p: 3, t: threadId },
           },
         ],
@@ -142,6 +141,7 @@ describe('RangeManager', function () {
 
   return describe('shouldUpdateRanges', function () {
     beforeEach(function () {
+      const threadId = new ObjectId()
       this.ranges = {
         changes: [
           {
@@ -155,8 +155,8 @@ describe('RangeManager', function () {
         ],
         comments: [
           {
-            id: new ObjectId(),
-            op: { c: 'foo', p: 3, t: new ObjectId() },
+            id: threadId,
+            op: { c: 'foo', p: 3, t: threadId },
           },
         ],
       }
diff --git a/services/document-updater/.gitignore b/services/document-updater/.gitignore
deleted file mode 100644
index 624e78f096..0000000000
--- a/services/document-updater/.gitignore
+++ /dev/null
@@ -1,52 +0,0 @@
-compileFolder
-
-Compiled source #
-###################
-*.com
-*.class
-*.dll
-*.exe
-*.o
-*.so
-
-# Packages #
-############
-# it's better to unpack these files and commit the raw source
-# git has its own built in compression methods
-*.7z
-*.dmg
-*.gz
-*.iso
-*.jar
-*.rar
-*.tar
-*.zip
-
-# Logs and databases #
-######################
-*.log
-*.sql
-*.sqlite
-
-# OS generated files #
-######################
-.DS_Store?
-ehthumbs.db
-Icon?
-Thumbs.db
-
-/node_modules/*
-
-
-
-forever/
-
-**.swp
-
-# Redis cluster
-**/appendonly.aof
-**/dump.rdb
-**/nodes.conf
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/document-updater/.nvmrc b/services/document-updater/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/document-updater/.nvmrc
+++ b/services/document-updater/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/document-updater/Dockerfile b/services/document-updater/Dockerfile
index 436d722577..720b619c41 100644
--- a/services/document-updater/Dockerfile
+++ b/services/document-updater/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/document-updater
 
diff --git a/services/document-updater/Makefile b/services/document-updater/Makefile
index 55f483fc89..46dfced5c9 100644
--- a/services/document-updater/Makefile
+++ b/services/document-updater/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/document-updater/app/js/DiffCodec.js b/services/document-updater/app/js/DiffCodec.js
index 245903ca13..17da409386 100644
--- a/services/document-updater/app/js/DiffCodec.js
+++ b/services/document-updater/app/js/DiffCodec.js
@@ -1,4 +1,6 @@
+const OError = require('@overleaf/o-error')
 const DMP = require('diff-match-patch')
+const { TextOperation } = require('overleaf-editor-core')
 const dmp = new DMP()
 
 // Do not attempt to produce a diff for more than 100ms
@@ -16,8 +18,7 @@ module.exports = {
     const ops = []
     let position = 0
     for (const diff of diffs) {
-      const type = diff[0]
-      const content = diff[1]
+      const [type, content] = diff
       if (type === this.ADDED) {
         ops.push({
           i: content,
@@ -37,4 +38,63 @@ module.exports = {
     }
     return ops
   },
+
+  /**
+   * @param {import("overleaf-editor-core").StringFileData} file
+   * @param {string} after
+   * @return {TextOperation}
+   */
+  diffAsHistoryOTEditOperation(file, after) {
+    const beforeWithoutTrackedDeletes = file.getContent({
+      filterTrackedDeletes: true,
+    })
+    const diffs = dmp.diff_main(beforeWithoutTrackedDeletes, after)
+    dmp.diff_cleanupSemantic(diffs)
+
+    const trackedChanges = file.trackedChanges.asSorted()
+    let nextTc = trackedChanges.shift()
+
+    const op = new TextOperation()
+    for (const diff of diffs) {
+      let [type, content] = diff
+      if (type === this.ADDED) {
+        op.insert(content)
+      } else if (type === this.REMOVED || type === this.UNCHANGED) {
+        while (op.baseLength + content.length > nextTc?.range.start) {
+          if (nextTc.tracking.type === 'delete') {
+            const untilRange = nextTc.range.start - op.baseLength
+            if (type === this.REMOVED) {
+              op.remove(untilRange)
+            } else if (type === this.UNCHANGED) {
+              op.retain(untilRange)
+            }
+            op.retain(nextTc.range.end - nextTc.range.start)
+            content = content.slice(untilRange)
+          }
+          nextTc = trackedChanges.shift()
+        }
+        if (type === this.REMOVED) {
+          op.remove(content.length)
+        } else if (type === this.UNCHANGED) {
+          op.retain(content.length)
+        }
+      } else {
+        throw new Error('Unknown type')
+      }
+    }
+    while (nextTc) {
+      if (
+        nextTc.tracking.type !== 'delete' ||
+        nextTc.range.start !== op.baseLength
+      ) {
+        throw new OError(
+          'StringFileData.trackedChanges out of sync: unexpected range after end of diff',
+          { nextTc, baseLength: op.baseLength }
+        )
+      }
+      op.retain(nextTc.range.end - nextTc.range.start)
+      nextTc = trackedChanges.shift()
+    }
+    return op
+  },
 }
diff --git a/services/document-updater/app/js/DocumentManager.js b/services/document-updater/app/js/DocumentManager.js
index 540a8a254c..3fb3d10a6e 100644
--- a/services/document-updater/app/js/DocumentManager.js
+++ b/services/document-updater/app/js/DocumentManager.js
@@ -11,10 +11,16 @@ const RangesManager = require('./RangesManager')
 const { extractOriginOrSource } = require('./Utils')
 const { getTotalSizeOfLines } = require('./Limits')
 const Settings = require('@overleaf/settings')
+const { StringFileData } = require('overleaf-editor-core')
 
 const MAX_UNFLUSHED_AGE = 300 * 1000 // 5 mins, document should be flushed to mongo this time after a change
 
 const DocumentManager = {
+  /**
+   * @param {string} projectId
+   * @param {string} docId
+   * @return {Promise<{lines: (string[] | StringFileRawData), version: number, ranges: Ranges, resolvedCommentIds: any[], pathname: string, projectHistoryId: string, unflushedTime: any, alreadyLoaded: boolean, historyRangesSupport: boolean, type: OTType}>}
+   */
   async getDoc(projectId, docId) {
     const {
       lines,
@@ -75,6 +81,7 @@ const DocumentManager = {
         unflushedTime: null,
         alreadyLoaded: false,
         historyRangesSupport,
+        type: Array.isArray(lines) ? 'sharejs-text-ot' : 'history-ot',
       }
     } else {
       return {
@@ -87,16 +94,25 @@ const DocumentManager = {
         unflushedTime,
         alreadyLoaded: true,
         historyRangesSupport,
+        type: Array.isArray(lines) ? 'sharejs-text-ot' : 'history-ot',
       }
     }
   },
 
   async getDocAndRecentOps(projectId, docId, fromVersion) {
-    const { lines, version, ranges, pathname, projectHistoryId } =
+    const { lines, version, ranges, pathname, projectHistoryId, type } =
       await DocumentManager.getDoc(projectId, docId)
 
     if (fromVersion === -1) {
-      return { lines, version, ops: [], ranges, pathname, projectHistoryId }
+      return {
+        lines,
+        version,
+        ops: [],
+        ranges,
+        pathname,
+        projectHistoryId,
+        type,
+      }
     } else {
       const ops = await RedisManager.promises.getPreviousDocOps(
         docId,
@@ -110,15 +126,21 @@ const DocumentManager = {
         ranges,
         pathname,
         projectHistoryId,
+        type,
       }
     }
   },
 
   async appendToDoc(projectId, docId, linesToAppend, originOrSource, userId) {
-    const { lines: currentLines } = await DocumentManager.getDoc(
+    let { lines: currentLines, type } = await DocumentManager.getDoc(
       projectId,
       docId
     )
+    if (type === 'history-ot') {
+      const file = StringFileData.fromRaw(currentLines)
+      // TODO(24596): tc support for history-ot
+      currentLines = file.getLines()
+    }
     const currentLineSize = getTotalSizeOfLines(currentLines)
     const addedSize = getTotalSizeOfLines(linesToAppend)
     const newlineSize = '\n'.length
@@ -153,30 +175,41 @@ const DocumentManager = {
       throw new Error('No lines were provided to setDoc')
     }
 
+    // Circular dependencies. Import at runtime.
+    const HistoryOTUpdateManager = require('./HistoryOTUpdateManager')
     const UpdateManager = require('./UpdateManager')
+
     const {
       lines: oldLines,
       version,
       alreadyLoaded,
+      type,
     } = await DocumentManager.getDoc(projectId, docId)
 
-    if (oldLines != null && oldLines.length > 0 && oldLines[0].text != null) {
-      logger.debug(
-        { docId, projectId, oldLines, newLines },
-        'document is JSON so not updating'
-      )
-      return
-    }
-
     logger.debug(
       { docId, projectId, oldLines, newLines },
       'setting a document via http'
     )
-    const op = DiffCodec.diffAsShareJsOp(oldLines, newLines)
-    if (undoing) {
-      for (const o of op || []) {
-        o.u = true
-      } // Turn on undo flag for each op for track changes
+
+    let op
+    if (type === 'history-ot') {
+      const file = StringFileData.fromRaw(oldLines)
+      const operation = DiffCodec.diffAsHistoryOTEditOperation(
+        file,
+        newLines.join('\n')
+      )
+      if (operation.isNoop()) {
+        op = []
+      } else {
+        op = [operation.toJSON()]
+      }
+    } else {
+      op = DiffCodec.diffAsShareJsOp(oldLines, newLines)
+      if (undoing) {
+        for (const o of op || []) {
+          o.u = true
+        } // Turn on undo flag for each op for track changes
+      }
     }
 
     const { origin, source } = extractOriginOrSource(originOrSource)
@@ -211,7 +244,11 @@ const DocumentManager = {
     // this update, otherwise the doc would never be
     // removed from redis.
     if (op.length > 0) {
-      await UpdateManager.promises.applyUpdate(projectId, docId, update)
+      if (type === 'history-ot') {
+        await HistoryOTUpdateManager.applyUpdate(projectId, docId, update)
+      } else {
+        await UpdateManager.promises.applyUpdate(projectId, docId, update)
+      }
     }
 
     // If the document was loaded already, then someone has it open
@@ -232,7 +269,7 @@ const DocumentManager = {
   },
 
   async flushDocIfLoaded(projectId, docId) {
-    const {
+    let {
       lines,
       version,
       ranges,
@@ -253,6 +290,11 @@ const DocumentManager = {
 
     logger.debug({ projectId, docId, version }, 'flushing doc')
     Metrics.inc('flush-doc-if-loaded', 1, { status: 'modified' })
+    if (!Array.isArray(lines)) {
+      const file = StringFileData.fromRaw(lines)
+      // TODO(24596): tc support for history-ot
+      lines = file.getLines()
+    }
     const result = await PersistenceManager.promises.setDoc(
       projectId,
       docId,
@@ -302,6 +344,7 @@ const DocumentManager = {
       throw new Errors.NotFoundError(`document not found: ${docId}`)
     }
 
+    // TODO(24596): tc support for history-ot
     const newRanges = RangesManager.acceptChanges(
       projectId,
       docId,
@@ -368,6 +411,7 @@ const DocumentManager = {
   },
 
   async getComment(projectId, docId, commentId) {
+    // TODO(24596): tc support for history-ot
     const { ranges } = await DocumentManager.getDoc(projectId, docId)
 
     const comment = ranges?.comments?.find(comment => comment.id === commentId)
@@ -389,6 +433,7 @@ const DocumentManager = {
       throw new Errors.NotFoundError(`document not found: ${docId}`)
     }
 
+    // TODO(24596): tc support for history-ot
     const newRanges = RangesManager.deleteComment(commentId, ranges)
 
     await RedisManager.promises.updateDocument(
@@ -428,7 +473,7 @@ const DocumentManager = {
   },
 
   async getDocAndFlushIfOld(projectId, docId) {
-    const { lines, version, unflushedTime, alreadyLoaded } =
+    let { lines, version, unflushedTime, alreadyLoaded } =
       await DocumentManager.getDoc(projectId, docId)
 
     // if doc was already loaded see if it needs to be flushed
@@ -440,6 +485,12 @@ const DocumentManager = {
       await DocumentManager.flushDocIfLoaded(projectId, docId)
     }
 
+    if (!Array.isArray(lines)) {
+      const file = StringFileData.fromRaw(lines)
+      // TODO(24596): tc support for history-ot
+      lines = file.getLines()
+    }
+
     return { lines, version }
   },
 
@@ -692,6 +743,7 @@ module.exports = {
         'ranges',
         'pathname',
         'projectHistoryId',
+        'type',
       ],
       getDocAndRecentOpsWithLock: [
         'lines',
@@ -700,6 +752,7 @@ module.exports = {
         'ranges',
         'pathname',
         'projectHistoryId',
+        'type',
       ],
       getCommentWithLock: ['comment'],
     },
diff --git a/services/document-updater/app/js/Errors.js b/services/document-updater/app/js/Errors.js
index a43f69ad35..ac1f5875fa 100644
--- a/services/document-updater/app/js/Errors.js
+++ b/services/document-updater/app/js/Errors.js
@@ -5,6 +5,15 @@ class OpRangeNotAvailableError extends OError {}
 class ProjectStateChangedError extends OError {}
 class DeleteMismatchError extends OError {}
 class FileTooLargeError extends OError {}
+class OTTypeMismatchError extends OError {
+  /**
+   * @param {OTType} got
+   * @param {OTType} want
+   */
+  constructor(got, want) {
+    super('ot type mismatch', { got, want })
+  }
+}
 
 module.exports = {
   NotFoundError,
@@ -12,4 +21,5 @@ module.exports = {
   ProjectStateChangedError,
   DeleteMismatchError,
   FileTooLargeError,
+  OTTypeMismatchError,
 }
diff --git a/services/document-updater/app/js/HistoryManager.js b/services/document-updater/app/js/HistoryManager.js
index 3963431925..d9a8459525 100644
--- a/services/document-updater/app/js/HistoryManager.js
+++ b/services/document-updater/app/js/HistoryManager.js
@@ -62,6 +62,7 @@ const HistoryManager = {
     // record updates for project history
     if (
       HistoryManager.shouldFlushHistoryOps(
+        projectId,
         projectOpsLength,
         ops.length,
         HistoryManager.FLUSH_PROJECT_EVERY_N_OPS
@@ -77,7 +78,8 @@ const HistoryManager = {
     }
   },
 
-  shouldFlushHistoryOps(length, opsLength, threshold) {
+  shouldFlushHistoryOps(projectId, length, opsLength, threshold) {
+    if (Settings.shortHistoryQueues.includes(projectId)) return true
     if (!length) {
       return false
     } // don't flush unless we know the length
diff --git a/services/document-updater/app/js/HistoryOTUpdateManager.js b/services/document-updater/app/js/HistoryOTUpdateManager.js
new file mode 100644
index 0000000000..5a8b92099e
--- /dev/null
+++ b/services/document-updater/app/js/HistoryOTUpdateManager.js
@@ -0,0 +1,158 @@
+// @ts-check
+
+const Profiler = require('./Profiler')
+const DocumentManager = require('./DocumentManager')
+const Errors = require('./Errors')
+const RedisManager = require('./RedisManager')
+const {
+  EditOperationBuilder,
+  StringFileData,
+  EditOperationTransformer,
+} = require('overleaf-editor-core')
+const Metrics = require('./Metrics')
+const ProjectHistoryRedisManager = require('./ProjectHistoryRedisManager')
+const HistoryManager = require('./HistoryManager')
+const RealTimeRedisManager = require('./RealTimeRedisManager')
+
+/**
+ * @typedef {import("./types").Update} Update
+ * @typedef {import("./types").HistoryOTEditOperationUpdate} HistoryOTEditOperationUpdate
+ */
+
+/**
+ * @param {Update} update
+ * @return {update is HistoryOTEditOperationUpdate}
+ */
+function isHistoryOTEditOperationUpdate(update) {
+  return (
+    update &&
+    'doc' in update &&
+    'op' in update &&
+    'v' in update &&
+    Array.isArray(update.op) &&
+    EditOperationBuilder.isValid(update.op[0])
+  )
+}
+
+/**
+ * Try to apply an update to the given document
+ *
+ * @param {string} projectId
+ * @param {string} docId
+ * @param {HistoryOTEditOperationUpdate} update
+ * @param {Profiler} profiler
+ */
+async function tryApplyUpdate(projectId, docId, update, profiler) {
+  let { lines, version, pathname, type } =
+    await DocumentManager.promises.getDoc(projectId, docId)
+  profiler.log('getDoc')
+
+  if (lines == null || version == null) {
+    throw new Errors.NotFoundError(`document not found: ${docId}`)
+  }
+  if (type !== 'history-ot') {
+    throw new Errors.OTTypeMismatchError(type, 'history-ot')
+  }
+
+  let op = EditOperationBuilder.fromJSON(update.op[0])
+  if (version !== update.v) {
+    const transformUpdates = await RedisManager.promises.getPreviousDocOps(
+      docId,
+      update.v,
+      version
+    )
+    for (const transformUpdate of transformUpdates) {
+      if (!isHistoryOTEditOperationUpdate(transformUpdate)) {
+        throw new Errors.OTTypeMismatchError('sharejs-text-ot', 'history-ot')
+      }
+
+      if (
+        transformUpdate.meta.source &&
+        update.dupIfSource?.includes(transformUpdate.meta.source)
+      ) {
+        update.dup = true
+        break
+      }
+      const other = EditOperationBuilder.fromJSON(transformUpdate.op[0])
+      op = EditOperationTransformer.transform(op, other)[0]
+    }
+    update.op = [op.toJSON()]
+  }
+
+  if (!update.dup) {
+    const file = StringFileData.fromRaw(lines)
+    file.edit(op)
+    version += 1
+    update.meta.ts = Date.now()
+    await RedisManager.promises.updateDocument(
+      projectId,
+      docId,
+      file.toRaw(),
+      version,
+      [update],
+      {},
+      update.meta
+    )
+
+    Metrics.inc('history-queue', 1, { status: 'project-history' })
+    try {
+      const projectOpsLength =
+        await ProjectHistoryRedisManager.promises.queueOps(projectId, [
+          JSON.stringify({
+            ...update,
+            meta: {
+              ...update.meta,
+              pathname,
+            },
+          }),
+        ])
+      HistoryManager.recordAndFlushHistoryOps(
+        projectId,
+        [update],
+        projectOpsLength
+      )
+      profiler.log('recordAndFlushHistoryOps')
+    } catch (err) {
+      // The full project history can re-sync a project in case
+      //  updates went missing.
+      // Just record the error here and acknowledge the write-op.
+      Metrics.inc('history-queue-error')
+    }
+  }
+  RealTimeRedisManager.sendData({
+    project_id: projectId,
+    doc_id: docId,
+    op: update,
+  })
+}
+
+/**
+ * Apply an update to the given document
+ *
+ * @param {string} projectId
+ * @param {string} docId
+ * @param {HistoryOTEditOperationUpdate} update
+ */
+async function applyUpdate(projectId, docId, update) {
+  const profiler = new Profiler('applyUpdate', {
+    project_id: projectId,
+    doc_id: docId,
+    type: 'history-ot',
+  })
+
+  try {
+    await tryApplyUpdate(projectId, docId, update, profiler)
+  } catch (error) {
+    RealTimeRedisManager.sendData({
+      project_id: projectId,
+      doc_id: docId,
+      error: error instanceof Error ? error.message : error,
+    })
+    profiler.log('sendData')
+    throw error
+  } finally {
+    profiler.end()
+  }
+}
+
+module.exports = { isHistoryOTEditOperationUpdate, applyUpdate }
diff --git a/services/document-updater/app/js/HttpController.js b/services/document-updater/app/js/HttpController.js
index 95fe9b7ba9..0a6ae3b2b4 100644
--- a/services/document-updater/app/js/HttpController.js
+++ b/services/document-updater/app/js/HttpController.js
@@ -9,6 +9,7 @@ const Metrics = require('./Metrics')
 const DeleteQueueManager = require('./DeleteQueueManager')
 const { getTotalSizeOfLines } = require('./Limits')
 const async = require('async')
+const { StringFileData } = require('overleaf-editor-core')
 
 function getDoc(req, res, next) {
   let fromVersion
@@ -27,7 +28,7 @@ function getDoc(req, res, next) {
     projectId,
     docId,
     fromVersion,
-    (error, lines, version, ops, ranges, pathname) => {
+    (error, lines, version, ops, ranges, pathname, _projectHistoryId, type) => {
       timer.done()
       if (error) {
         return next(error)
@@ -36,6 +37,11 @@ function getDoc(req, res, next) {
       if (lines == null || version == null) {
         return next(new Errors.NotFoundError('document not found'))
       }
+      if (!Array.isArray(lines) && req.query.historyOTSupport !== 'true') {
+        const file = StringFileData.fromRaw(lines)
+        // TODO(24596): tc support for history-ot
+        lines = file.getLines()
+      }
       res.json({
         id: docId,
         lines,
@@ -44,6 +50,7 @@ function getDoc(req, res, next) {
         ranges,
         pathname,
         ttlInS: RedisManager.DOC_OPS_TTL,
+        type,
       })
     }
   )
@@ -84,6 +91,11 @@ function peekDoc(req, res, next) {
     if (lines == null || version == null) {
       return next(new Errors.NotFoundError('document not found'))
     }
+    if (!Array.isArray(lines) && req.query.historyOTSupport !== 'true') {
+      const file = StringFileData.fromRaw(lines)
+      // TODO(24596): tc support for history-ot
+      lines = file.getLines()
+    }
     res.json({ id: docId, lines, version })
   })
 }
diff --git a/services/document-updater/app/js/Limits.js b/services/document-updater/app/js/Limits.js
index 268ccd3f9b..cbd9293042 100644
--- a/services/document-updater/app/js/Limits.js
+++ b/services/document-updater/app/js/Limits.js
@@ -28,4 +28,19 @@ module.exports = {
     // since we didn't hit the limit in the loop, the document is within the allowed length
     return false
   },
+
+  /**
+   * @param {StringFileRawData} raw
+   * @param {number} maxDocLength
+   */
+  stringFileDataContentIsTooLarge(raw, maxDocLength) {
+    let n = raw.content.length
+    if (n <= maxDocLength) return false // definitely under the limit, no need to calculate the total size
+    for (const tc of raw.trackedChanges ?? []) {
+      if (tc.tracking.type !== 'delete') continue
+      n -= tc.range.length
+      if (n <= maxDocLength) return false // under the limit now, no need to calculate the exact size
+    }
+    return true
+  },
 }
diff --git a/services/document-updater/app/js/PersistenceManager.js b/services/document-updater/app/js/PersistenceManager.js
index b08994ae41..6e832f9aa7 100644
--- a/services/document-updater/app/js/PersistenceManager.js
+++ b/services/document-updater/app/js/PersistenceManager.js
@@ -95,6 +95,13 @@ function getDoc(projectId, docId, options = {}, _callback) {
           status: body.pathname === '' ? 'zero-length' : 'undefined',
         })
       }
+
+      if (body.otMigrationStage > 0) {
+        // Use history-ot
+        body.lines = { content: body.lines.join('\n') }
+        body.ranges = {}
+      }
+
       callback(
         null,
         body.lines,
diff --git a/services/document-updater/app/js/Profiler.js b/services/document-updater/app/js/Profiler.js
index 8daac4ca41..aac8a9706e 100644
--- a/services/document-updater/app/js/Profiler.js
+++ b/services/document-updater/app/js/Profiler.js
@@ -1,68 +1,52 @@
-/* eslint-disable
-    no-unused-vars,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS206: Consider reworking classes to avoid initClass
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-let Profiler
-const Settings = require('@overleaf/settings')
 const logger = require('@overleaf/logger')
 
-const deltaMs = function (ta, tb) {
+function deltaMs(ta, tb) {
   const nanoSeconds = (ta[0] - tb[0]) * 1e9 + (ta[1] - tb[1])
   const milliSeconds = Math.floor(nanoSeconds * 1e-6)
   return milliSeconds
 }
 
-module.exports = Profiler = (function () {
-  Profiler = class Profiler {
-    static initClass() {
-      this.prototype.LOG_CUTOFF_TIME = 15 * 1000
-      this.prototype.LOG_SYNC_CUTOFF_TIME = 1000
-    }
+class Profiler {
+  LOG_CUTOFF_TIME = 15 * 1000
+  LOG_SYNC_CUTOFF_TIME = 1000
 
-    constructor(name, args) {
-      this.name = name
-      this.args = args
-      this.t0 = this.t = process.hrtime()
-      this.start = new Date()
-      this.updateTimes = []
-      this.totalSyncTime = 0
-    }
-
-    log(label, options = {}) {
-      const t1 = process.hrtime()
-      const dtMilliSec = deltaMs(t1, this.t)
-      this.t = t1
-      this.totalSyncTime += options.sync ? dtMilliSec : 0
-      this.updateTimes.push([label, dtMilliSec]) // timings in ms
-      return this // make it chainable
-    }
-
-    end(message) {
-      const totalTime = deltaMs(this.t, this.t0)
-      const exceedsCutoff = totalTime > this.LOG_CUTOFF_TIME
-      const exceedsSyncCutoff = this.totalSyncTime > this.LOG_SYNC_CUTOFF_TIME
-      if (exceedsCutoff || exceedsSyncCutoff) {
-        // log anything greater than cutoffs
-        const args = {}
-        for (const k in this.args) {
-          const v = this.args[k]
-          args[k] = v
-        }
-        args.updateTimes = this.updateTimes
-        args.start = this.start
-        args.end = new Date()
-        args.status = { exceedsCutoff, exceedsSyncCutoff }
-        logger.warn(args, this.name)
-      }
-      return totalTime
-    }
+  constructor(name, args) {
+    this.name = name
+    this.args = args
+    this.t0 = this.t = process.hrtime()
+    this.start = new Date()
+    this.updateTimes = []
+    this.totalSyncTime = 0
   }
-  Profiler.initClass()
-  return Profiler
-})()
+
+  log(label, options = {}) {
+    const t1 = process.hrtime()
+    const dtMilliSec = deltaMs(t1, this.t)
+    this.t = t1
+    this.totalSyncTime += options.sync ? dtMilliSec : 0
+    this.updateTimes.push([label, dtMilliSec]) // timings in ms
+    return this // make it chainable
+  }
+
+  end() {
+    const totalTime = deltaMs(this.t, this.t0)
+    const exceedsCutoff = totalTime > this.LOG_CUTOFF_TIME
+    const exceedsSyncCutoff = this.totalSyncTime > this.LOG_SYNC_CUTOFF_TIME
+    if (exceedsCutoff || exceedsSyncCutoff) {
+      // log anything greater than cutoffs
+      const args = {}
+      for (const k in this.args) {
+        const v = this.args[k]
+        args[k] = v
+      }
+      args.updateTimes = this.updateTimes
+      args.start = this.start
+      args.end = new Date()
+      args.status = { exceedsCutoff, exceedsSyncCutoff }
+      logger.warn(args, this.name)
+    }
+    return totalTime
+  }
+}
+
+module.exports = Profiler
diff --git a/services/document-updater/app/js/ProjectHistoryRedisManager.js b/services/document-updater/app/js/ProjectHistoryRedisManager.js
index 9a9985d99a..78e9c2ea4c 100644
--- a/services/document-updater/app/js/ProjectHistoryRedisManager.js
+++ b/services/document-updater/app/js/ProjectHistoryRedisManager.js
@@ -8,13 +8,14 @@ const rclient = require('@overleaf/redis-wrapper').createClient(
 )
 const logger = require('@overleaf/logger')
 const metrics = require('./Metrics')
-const { docIsTooLarge } = require('./Limits')
+const { docIsTooLarge, stringFileDataContentIsTooLarge } = require('./Limits')
 const { addTrackedDeletesToContent, extractOriginOrSource } = require('./Utils')
 const HistoryConversions = require('./HistoryConversions')
 const OError = require('@overleaf/o-error')
 
 /**
  * @import { Ranges } from './types'
+ * @import { StringFileRawData } from 'overleaf-editor-core/lib/types'
  */
 
 const ProjectHistoryRedisManager = {
@@ -180,7 +181,7 @@ const ProjectHistoryRedisManager = {
    * @param {string} projectId
    * @param {string} projectHistoryId
    * @param {string} docId
-   * @param {string[]} lines
+   * @param {string[] | StringFileRawData} lines
    * @param {Ranges} ranges
    * @param {string[]} resolvedCommentIds
    * @param {number} version
@@ -204,13 +205,8 @@ const ProjectHistoryRedisManager = {
       'queue doc content resync'
     )
 
-    let content = lines.join('\n')
-    if (historyRangesSupport) {
-      content = addTrackedDeletesToContent(content, ranges.changes ?? [])
-    }
-
     const projectUpdate = {
-      resyncDocContent: { content, version },
+      resyncDocContent: { version },
       projectHistoryId,
       path: pathname,
       doc: docId,
@@ -219,17 +215,38 @@ const ProjectHistoryRedisManager = {
       },
     }
 
-    if (historyRangesSupport) {
-      projectUpdate.resyncDocContent.ranges =
-        HistoryConversions.toHistoryRanges(ranges)
-      projectUpdate.resyncDocContent.resolvedCommentIds = resolvedCommentIds
+    let content = ''
+    if (Array.isArray(lines)) {
+      content = lines.join('\n')
+      if (historyRangesSupport) {
+        content = addTrackedDeletesToContent(content, ranges.changes ?? [])
+        projectUpdate.resyncDocContent.ranges =
+          HistoryConversions.toHistoryRanges(ranges)
+        projectUpdate.resyncDocContent.resolvedCommentIds = resolvedCommentIds
+      }
+    } else {
+      content = lines.content
+      projectUpdate.resyncDocContent.historyOTRanges = {
+        comments: lines.comments,
+        trackedChanges: lines.trackedChanges,
+      }
     }
+    projectUpdate.resyncDocContent.content = content
 
     const jsonUpdate = JSON.stringify(projectUpdate)
     // Do an optimised size check on the docLines using the serialised
     // project update length as an upper bound
     const sizeBound = jsonUpdate.length
-    if (docIsTooLarge(sizeBound, lines, Settings.max_doc_length)) {
+    if (Array.isArray(lines)) {
+      if (docIsTooLarge(sizeBound, lines, Settings.max_doc_length)) {
+        throw new OError(
+          'blocking resync doc content insert into project history queue: doc is too large',
+          { projectId, docId, docSize: sizeBound }
+        )
+      }
+    } else if (
+      stringFileDataContentIsTooLarge(lines, Settings.max_doc_length)
+    ) {
       throw new OError(
         'blocking resync doc content insert into project history queue: doc is too large',
         { projectId, docId, docSize: sizeBound }
diff --git a/services/document-updater/app/js/ProjectManager.js b/services/document-updater/app/js/ProjectManager.js
index 781ed0e168..cdd4c11482 100644
--- a/services/document-updater/app/js/ProjectManager.js
+++ b/services/document-updater/app/js/ProjectManager.js
@@ -317,6 +317,7 @@ function updateProjectWithLocks(
     }
     if (
       HistoryManager.shouldFlushHistoryOps(
+        projectId,
         projectOpsLength,
         updates.length,
         HistoryManager.FLUSH_PROJECT_EVERY_N_OPS
diff --git a/services/document-updater/app/js/RealTimeRedisManager.js b/services/document-updater/app/js/RealTimeRedisManager.js
index 08bf132dec..2b67971c5c 100644
--- a/services/document-updater/app/js/RealTimeRedisManager.js
+++ b/services/document-updater/app/js/RealTimeRedisManager.js
@@ -49,7 +49,7 @@ const RealTimeRedisManager = {
       MAX_OPS_PER_ITERATION,
       -1
     )
-    return multi.exec(function (error, replys) {
+    multi.exec(function (error, replys) {
       if (error != null) {
         return callback(error)
       }
@@ -80,7 +80,7 @@ const RealTimeRedisManager = {
   },
 
   getUpdatesLength(docId, callback) {
-    return rclient.llen(Keys.pendingUpdates({ doc_id: docId }), callback)
+    rclient.llen(Keys.pendingUpdates({ doc_id: docId }), callback)
   },
 
   sendCanaryAppliedOp({ projectId, docId, op }) {
@@ -132,5 +132,5 @@ const RealTimeRedisManager = {
 
 module.exports = RealTimeRedisManager
 module.exports.promises = promisifyAll(RealTimeRedisManager, {
-  without: ['sendData'],
+  without: ['sendCanaryAppliedOp', 'sendData'],
 })
diff --git a/services/document-updater/app/js/RedisManager.js b/services/document-updater/app/js/RedisManager.js
index f8e97f38b4..7f86036427 100644
--- a/services/document-updater/app/js/RedisManager.js
+++ b/services/document-updater/app/js/RedisManager.js
@@ -48,6 +48,7 @@ const RedisManager = {
       timer.done()
       _callback(error)
     }
+    const shareJSTextOT = Array.isArray(docLines)
     const docLinesArray = docLines
     docLines = JSON.stringify(docLines)
     if (docLines.indexOf('\u0000') !== -1) {
@@ -60,7 +61,10 @@ const RedisManager = {
     // Do an optimised size check on the docLines using the serialised
     // length as an upper bound
     const sizeBound = docLines.length
-    if (docIsTooLarge(sizeBound, docLinesArray, Settings.max_doc_length)) {
+    if (
+      shareJSTextOT && // editor-core has a size check in TextOperation.apply and TextOperation.applyToLength.
+      docIsTooLarge(sizeBound, docLinesArray, Settings.max_doc_length)
+    ) {
       const docSize = docLines.length
       const err = new Error('blocking doc insert into redis: doc is too large')
       logger.error({ projectId, docId, err, docSize }, err.message)
@@ -461,6 +465,7 @@ const RedisManager = {
     if (appliedOps == null) {
       appliedOps = []
     }
+    const shareJSTextOT = Array.isArray(docLines)
     RedisManager.getDocVersion(docId, (error, currentVersion) => {
       if (error) {
         return callback(error)
@@ -500,7 +505,10 @@ const RedisManager = {
       // Do an optimised size check on the docLines using the serialised
       // length as an upper bound
       const sizeBound = newDocLines.length
-      if (docIsTooLarge(sizeBound, docLines, Settings.max_doc_length)) {
+      if (
+        shareJSTextOT && // editor-core has a size check in TextOperation.apply and TextOperation.applyToLength.
+        docIsTooLarge(sizeBound, docLines, Settings.max_doc_length)
+      ) {
         const err = new Error('blocking doc update: doc is too large')
         const docSize = newDocLines.length
         logger.error({ projectId, docId, err, docSize }, err.message)
diff --git a/services/document-updater/app/js/UpdateManager.js b/services/document-updater/app/js/UpdateManager.js
index 1f58a751f7..e5df48575e 100644
--- a/services/document-updater/app/js/UpdateManager.js
+++ b/services/document-updater/app/js/UpdateManager.js
@@ -15,9 +15,10 @@ const RangesManager = require('./RangesManager')
 const SnapshotManager = require('./SnapshotManager')
 const Profiler = require('./Profiler')
 const { isInsert, isDelete, getDocLength, computeDocHash } = require('./Utils')
+const HistoryOTUpdateManager = require('./HistoryOTUpdateManager')
 
 /**
- * @import { DeleteOp, InsertOp, Op, Ranges, Update, HistoryUpdate } from "./types"
+ * @import { Ranges, Update, HistoryUpdate } from "./types"
  */
 
 const UpdateManager = {
@@ -80,7 +81,11 @@ const UpdateManager = {
     profile.log('getPendingUpdatesForDoc')
 
     for (const update of updates) {
-      await UpdateManager.applyUpdate(projectId, docId, update)
+      if (HistoryOTUpdateManager.isHistoryOTEditOperationUpdate(update)) {
+        await HistoryOTUpdateManager.applyUpdate(projectId, docId, update)
+      } else {
+        await UpdateManager.applyUpdate(projectId, docId, update)
+      }
       profile.log('applyUpdate')
     }
     profile.log('async done').end()
@@ -110,12 +115,16 @@ const UpdateManager = {
         pathname,
         projectHistoryId,
         historyRangesSupport,
+        type,
       } = await DocumentManager.promises.getDoc(projectId, docId)
       profile.log('getDoc')
 
       if (lines == null || version == null) {
         throw new Errors.NotFoundError(`document not found: ${docId}`)
       }
+      if (type !== 'sharejs-text-ot') {
+        throw new Errors.OTTypeMismatchError(type, 'sharejs-text-ot')
+      }
 
       const previousVersion = version
       const incomingUpdateVersion = update.v
diff --git a/services/document-updater/app/js/types.ts b/services/document-updater/app/js/types.ts
index b3085adb1b..851e62d8c8 100644
--- a/services/document-updater/app/js/types.ts
+++ b/services/document-updater/app/js/types.ts
@@ -1,12 +1,17 @@
 import {
   TrackingPropsRawData,
   ClearTrackingPropsRawData,
+  RawEditOperation,
 } from 'overleaf-editor-core/lib/types'
 
+export type OTType = 'sharejs-text-ot' | 'history-ot'
+
 /**
  * An update coming from the editor
  */
 export type Update = {
+  dup?: boolean
+  dupIfSource?: string[]
   doc: string
   op: Op[]
   v: number
@@ -18,6 +23,11 @@ export type Update = {
   projectHistoryId?: string
 }
 
+export type HistoryOTEditOperationUpdate = Omit<Update, 'op'> & {
+  op: RawEditOperation[]
+  meta: Update['meta'] & { source: string }
+}
+
 export type Op = InsertOp | DeleteOp | CommentOp | RetainOp
 
 export type InsertOp = {
diff --git a/services/document-updater/buildscript.txt b/services/document-updater/buildscript.txt
index f303583bcb..98d10a8e55 100644
--- a/services/document-updater/buildscript.txt
+++ b/services/document-updater/buildscript.txt
@@ -4,6 +4,6 @@ document-updater
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=True
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/document-updater/config/settings.defaults.js b/services/document-updater/config/settings.defaults.js
index 0cd29d325b..9ed59de6c4 100755
--- a/services/document-updater/config/settings.defaults.js
+++ b/services/document-updater/config/settings.defaults.js
@@ -184,4 +184,8 @@ module.exports = {
   smoothingOffset: process.env.SMOOTHING_OFFSET || 1000, // milliseconds
   gracefulShutdownDelayInMs:
     parseInt(process.env.GRACEFUL_SHUTDOWN_DELAY_SECONDS ?? '10', 10) * 1000,
+
+  shortHistoryQueues: (process.env.SHORT_HISTORY_QUEUES || '')
+    .split(',')
+    .filter(s => !!s),
 }
diff --git a/services/document-updater/docker-compose.ci.yml b/services/document-updater/docker-compose.ci.yml
index bdf10c9732..c6ec24a84b 100644
--- a/services/document-updater/docker-compose.ci.yml
+++ b/services/document-updater/docker-compose.ci.yml
@@ -21,18 +21,22 @@ services:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
       POSTGRES_HOST: postgres
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
       redis:
         condition: service_healthy
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -44,14 +48,14 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping="$$(redis-cli ping)" && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/document-updater/docker-compose.yml b/services/document-updater/docker-compose.yml
index 7dd27c9a39..c1b23c11c5 100644
--- a/services/document-updater/docker-compose.yml
+++ b/services/document-updater/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/document-updater
       - ../../node_modules:/overleaf/node_modules
@@ -21,15 +21,17 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/document-updater
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/document-updater
     environment:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
@@ -44,17 +46,18 @@ services:
         condition: service_started
       redis:
         condition: service_healthy
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping=$$(redis-cli ping) && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/document-updater/package.json b/services/document-updater/package.json
index 4fb45d6cd4..7d892689e9 100644
--- a/services/document-updater/package.json
+++ b/services/document-updater/package.json
@@ -34,6 +34,7 @@
     "lodash": "^4.17.21",
     "minimist": "^1.2.8",
     "mongodb-legacy": "6.1.3",
+    "overleaf-editor-core": "*",
     "request": "^2.88.2",
     "requestretry": "^7.1.0"
   },
diff --git a/services/document-updater/scripts/check_redis_mongo_sync_state.js b/services/document-updater/scripts/check_redis_mongo_sync_state.js
index 08209400aa..51db47af4d 100644
--- a/services/document-updater/scripts/check_redis_mongo_sync_state.js
+++ b/services/document-updater/scripts/check_redis_mongo_sync_state.js
@@ -15,6 +15,7 @@ const request = require('requestretry').defaults({
   retryDelay: 10,
 })
 
+const ONLY_PROJECT_ID = process.env.ONLY_PROJECT_ID
 const AUTO_FIX_VERSION_MISMATCH =
   process.env.AUTO_FIX_VERSION_MISMATCH === 'true'
 const AUTO_FIX_PARTIALLY_DELETED_DOC_METADATA =
@@ -319,10 +320,12 @@ async function processProject(projectId) {
  * @return {Promise<{perIterationOutOfSync: number, done: boolean}>}
  */
 async function scanOnce(processed, outOfSync) {
-  const projectIds = await ProjectFlusher.promises.flushAllProjects({
-    limit: LIMIT,
-    dryRun: true,
-  })
+  const projectIds = ONLY_PROJECT_ID
+    ? [ONLY_PROJECT_ID]
+    : await ProjectFlusher.promises.flushAllProjects({
+        limit: LIMIT,
+        dryRun: true,
+      })
 
   let perIterationOutOfSync = 0
   for (const projectId of projectIds) {
diff --git a/services/document-updater/scripts/flush_projects_with_no_history_id.js b/services/document-updater/scripts/flush_projects_with_no_history_id.js
new file mode 100644
index 0000000000..aa912b4b66
--- /dev/null
+++ b/services/document-updater/scripts/flush_projects_with_no_history_id.js
@@ -0,0 +1,211 @@
+// @ts-check
+
+const Settings = require('@overleaf/settings')
+const logger = require('@overleaf/logger')
+const RedisManager = require('../app/js/RedisManager')
+const minimist = require('minimist')
+const { db, ObjectId } = require('../app/js/mongodb')
+const ProjectManager = require('../app/js/ProjectManager')
+const OError = require('@overleaf/o-error')
+
+const docUpdaterKeys = Settings.redis.documentupdater.key_schema
+
+const rclient = RedisManager.rclient
+
+const { verbose, commit, ...args } = minimist(process.argv.slice(2), {
+  boolean: ['verbose', 'commit'],
+  string: ['batchSize'],
+  default: {
+    batchSize: '1000',
+  },
+})
+
+logger.logger.level(verbose ? 'debug' : 'warn')
+
+const batchSize = parseInt(args.batchSize, 10)
+
+/**
+ * @typedef {import('ioredis').Redis} Redis
+ */
+
+/**
+ *
+ * @param {string} key
+ * @return {string|void}
+ */
+function extractDocId(key) {
+  const matches = key.match(/ProjectHistoryId:\{(.*?)\}/)
+  if (matches) {
+    return matches[1]
+  }
+}
+
+/**
+ *
+ * @param {string} docId
+ * @return {Promise<{projectId: string, historyId: string}>}
+ */
+async function getHistoryId(docId) {
+  const doc = await db.docs.findOne(
+    { _id: new ObjectId(docId) },
+    { projection: { project_id: 1 }, readPreference: 'secondaryPreferred' }
+  )
+
+  if (!doc) {
+    throw new OError('Doc not present in mongo', { docId })
+  }
+
+  const project = await db.projects.findOne(
+    { _id: doc.project_id },
+    {
+      projection: { 'overleaf.history': 1 },
+      readPreference: 'secondaryPreferred',
+    }
+  )
+
+  if (!project?.overleaf?.history?.id) {
+    throw new OError('Project not present in mongo (or has no history id)', {
+      docId,
+      project,
+      doc,
+    })
+  }
+
+  return {
+    historyId: project?.overleaf?.history?.id,
+    projectId: doc.project_id.toString(),
+  }
+}
+
+/**
+ * @typedef {Object} UpdateableDoc
+ * @property {string} docId
+ * @property {string} projectId
+ * @property {string} historyId
+ */
+
+/**
+ *
+ * @param {Redis} node
+ * @param {Array<string>} docIds
+ * @return {Promise<Array<UpdateableDoc>>}
+ */
+async function findDocsWithMissingHistoryIds(node, docIds) {
+  const historyIds = await node.mget(
+    docIds.map(docId => docUpdaterKeys.projectHistoryId({ doc_id: docId }))
+  )
+
+  const results = []
+
+  for (const index in docIds) {
+    const historyId = historyIds[index]
+    const docId = docIds[index]
+    if (!historyId) {
+      try {
+        const { projectId, historyId } = await getHistoryId(docId)
+        results.push({ projectId, historyId, docId })
+      } catch (error) {
+        logger.warn(
+          { error },
+          'Error gathering data for doc with missing history id'
+        )
+      }
+    }
+  }
+  return results
+}
+
+/**
+ *
+ * @param {Array<UpdateableDoc>} updates
+ * @return {Promise<void>}
+ */
+async function fixAndFlushProjects(updates) {
+  for (const update of updates) {
+    if (commit) {
+      try {
+        await rclient.set(
+          docUpdaterKeys.projectHistoryId({ doc_id: update.docId }),
+          update.historyId
+        )
+        logger.debug({ ...update }, 'Set history id in redis')
+        await ProjectManager.promises.flushAndDeleteProjectWithLocks(
+          update.projectId,
+          {}
+        )
+        logger.debug({ ...update }, 'Flushed project')
+      } catch (err) {
+        logger.error({ err, ...update }, 'Error fixing and flushing project')
+      }
+    } else {
+      logger.debug(
+        { ...update },
+        'Would have set history id in redis and flushed'
+      )
+    }
+  }
+}
+
+/**
+ *
+ * @param {Array<Redis>} nodes
+ * @param {number} batchSize
+ * @return {Promise<void>}
+ */
+async function scanNodes(nodes, batchSize = 1000) {
+  let scanned = 0
+
+  for (const node of nodes) {
+    const stream = node.scanStream({
+      match: docUpdaterKeys.projectHistoryId({ doc_id: '*' }),
+      count: batchSize,
+    })
+
+    for await (const docKeys of stream) {
+      if (docKeys.length === 0) {
+        continue
+      }
+      stream.pause()
+      scanned += docKeys.length
+
+      const docIds = docKeys
+        .map((/** @type {string} */ docKey) => extractDocId(docKey))
+        .filter(Boolean)
+
+      try {
+        const updates = await findDocsWithMissingHistoryIds(node, docIds)
+        if (updates.length > 0) {
+          logger.info({ updates }, 'Found doc(s) with missing history ids')
+          await fixAndFlushProjects(updates)
+        }
+      } catch (error) {
+        logger.error({ docKeys }, 'Error processing batch')
+      } finally {
+        stream.resume()
+      }
+    }
+
+    logger.info({ scanned, server: node.serverInfo.role }, 'Scanned node')
+  }
+}
+
+async function main({ batchSize }) {
+  const nodes = (typeof rclient.nodes === 'function'
+    ? rclient.nodes('master')
+    : undefined) || [rclient]
+  await scanNodes(nodes, batchSize)
+}
+
+let code = 0
+
+main({ batchSize })
+  .then(() => {
+    logger.info({}, 'done')
+  })
+  .catch(error => {
+    logger.error({ error }, 'error')
+    code = 1
+  })
+  .finally(() => {
+    rclient.quit().then(() => process.exit(code))
+  })
diff --git a/services/document-updater/test/acceptance/js/ApplyingUpdatesToADocTests.js b/services/document-updater/test/acceptance/js/ApplyingUpdatesToADocTests.js
index 73e22aace7..39ec6c2ac7 100644
--- a/services/document-updater/test/acceptance/js/ApplyingUpdatesToADocTests.js
+++ b/services/document-updater/test/acceptance/js/ApplyingUpdatesToADocTests.js
@@ -16,27 +16,36 @@ const DocUpdaterClient = require('./helpers/DocUpdaterClient')
 const DocUpdaterApp = require('./helpers/DocUpdaterApp')
 
 describe('Applying updates to a doc', function () {
-  before(function (done) {
+  beforeEach(function (done) {
+    sinon.spy(MockWebApi, 'getDocument')
     this.lines = ['one', 'two', 'three']
     this.version = 42
     this.op = {
       i: 'one and a half\n',
       p: 4,
     }
+    this.project_id = DocUpdaterClient.randomId()
+    this.doc_id = DocUpdaterClient.randomId()
     this.update = {
       doc: this.doc_id,
       op: [this.op],
       v: this.version,
     }
+    this.historyOTUpdate = {
+      doc: this.doc_id,
+      op: [{ textOperation: [4, 'one and a half\n', 9] }],
+      v: this.version,
+      meta: { source: 'random-publicId' },
+    }
     this.result = ['one', 'one and a half', 'two', 'three']
     DocUpdaterApp.ensureRunning(done)
   })
+  afterEach(function () {
+    sinon.restore()
+  })
 
   describe('when the document is not loaded', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
-      sinon.spy(MockWebApi, 'getDocument')
+    beforeEach(function (done) {
       this.startTime = Date.now()
       MockWebApi.insertDoc(this.project_id, this.doc_id, {
         lines: this.lines,
@@ -50,15 +59,25 @@ describe('Applying updates to a doc', function () {
           if (error != null) {
             throw error
           }
-          setTimeout(done, 200)
+          setTimeout(() => {
+            rclientProjectHistory.get(
+              ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
+                project_id: this.project_id,
+              }),
+              (error, result) => {
+                if (error != null) {
+                  throw error
+                }
+                result = parseInt(result, 10)
+                this.firstOpTimestamp = result
+                done()
+              }
+            )
+          }, 200)
         }
       )
     })
 
-    after(function () {
-      MockWebApi.getDocument.restore()
-    })
-
     it('should load the document from the web API', function () {
       MockWebApi.getDocument
         .calledWith(this.project_id, this.doc_id)
@@ -92,21 +111,8 @@ describe('Applying updates to a doc', function () {
       )
     })
 
-    it('should set the first op timestamp', function (done) {
-      rclientProjectHistory.get(
-        ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
-          project_id: this.project_id,
-        }),
-        (error, result) => {
-          if (error != null) {
-            throw error
-          }
-          result = parseInt(result, 10)
-          result.should.be.within(this.startTime, Date.now())
-          this.firstOpTimestamp = result
-          done()
-        }
-      )
+    it('should set the first op timestamp', function () {
+      this.firstOpTimestamp.should.be.within(this.startTime, Date.now())
     })
 
     it('should yield last updated time', function (done) {
@@ -138,7 +144,7 @@ describe('Applying updates to a doc', function () {
     })
 
     describe('when sending another update', function () {
-      before(function (done) {
+      beforeEach(function (done) {
         this.timeout(10000)
         this.second_update = Object.assign({}, this.update)
         this.second_update.v = this.version + 1
@@ -207,13 +213,339 @@ describe('Applying updates to a doc', function () {
         )
       })
     })
+
+    describe('when another client is sending a concurrent update', function () {
+      beforeEach(function (done) {
+        this.timeout(10000)
+        this.otherUpdate = {
+          doc: this.doc_id,
+          op: [{ p: 8, i: 'two and a half\n' }],
+          v: this.version,
+          meta: { source: 'other-random-publicId' },
+        }
+        this.secondStartTime = Date.now()
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.otherUpdate,
+          error => {
+            if (error != null) {
+              throw error
+            }
+            setTimeout(done, 200)
+          }
+        )
+      })
+
+      it('should update the doc', function (done) {
+        DocUpdaterClient.getDoc(
+          this.project_id,
+          this.doc_id,
+          (error, res, doc) => {
+            if (error) done(error)
+            doc.lines.should.deep.equal([
+              'one',
+              'one and a half',
+              'two',
+              'two and a half',
+              'three',
+            ])
+            done()
+          }
+        )
+      })
+
+      it('should not change the first op timestamp', function (done) {
+        rclientProjectHistory.get(
+          ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
+            project_id: this.project_id,
+          }),
+          (error, result) => {
+            if (error != null) {
+              throw error
+            }
+            result = parseInt(result, 10)
+            result.should.equal(this.firstOpTimestamp)
+            done()
+          }
+        )
+      })
+
+      it('should yield last updated time', function (done) {
+        DocUpdaterClient.getProjectLastUpdatedAt(
+          this.project_id,
+          (error, res, body) => {
+            if (error != null) {
+              throw error
+            }
+            res.statusCode.should.equal(200)
+            body.lastUpdatedAt.should.be.within(
+              this.secondStartTime,
+              Date.now()
+            )
+            done()
+          }
+        )
+      })
+    })
+  })
+
+  describe('when the document is not loaded (history-ot)', function () {
+    beforeEach(function (done) {
+      this.startTime = Date.now()
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+      DocUpdaterClient.sendUpdate(
+        this.project_id,
+        this.doc_id,
+        this.historyOTUpdate,
+        error => {
+          if (error != null) {
+            throw error
+          }
+          setTimeout(() => {
+            rclientProjectHistory.get(
+              ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
+                project_id: this.project_id,
+              }),
+              (error, result) => {
+                if (error != null) {
+                  throw error
+                }
+                result = parseInt(result, 10)
+                this.firstOpTimestamp = result
+                done()
+              }
+            )
+          }, 200)
+        }
+      )
+    })
+
+    it('should load the document from the web API', function () {
+      MockWebApi.getDocument
+        .calledWith(this.project_id, this.doc_id)
+        .should.equal(true)
+    })
+
+    it('should update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) done(error)
+          doc.lines.should.deep.equal(this.result)
+          done()
+        }
+      )
+    })
+
+    it('should push the applied updates to the project history changes api', function (done) {
+      rclientProjectHistory.lrange(
+        ProjectHistoryKeys.projectHistoryOps({ project_id: this.project_id }),
+        0,
+        -1,
+        (error, updates) => {
+          if (error != null) {
+            throw error
+          }
+          JSON.parse(updates[0]).op.should.deep.equal(this.historyOTUpdate.op)
+          JSON.parse(updates[0]).meta.pathname.should.equal('/a/b/c.tex')
+
+          done()
+        }
+      )
+    })
+
+    it('should set the first op timestamp', function () {
+      this.firstOpTimestamp.should.be.within(this.startTime, Date.now())
+    })
+
+    it('should yield last updated time', function (done) {
+      DocUpdaterClient.getProjectLastUpdatedAt(
+        this.project_id,
+        (error, res, body) => {
+          if (error != null) {
+            throw error
+          }
+          res.statusCode.should.equal(200)
+          body.lastUpdatedAt.should.be.within(this.startTime, Date.now())
+          done()
+        }
+      )
+    })
+
+    it('should yield no last updated time for another project', function (done) {
+      DocUpdaterClient.getProjectLastUpdatedAt(
+        DocUpdaterClient.randomId(),
+        (error, res, body) => {
+          if (error != null) {
+            throw error
+          }
+          res.statusCode.should.equal(200)
+          body.should.deep.equal({})
+          done()
+        }
+      )
+    })
+
+    describe('when sending another update', function () {
+      beforeEach(function (done) {
+        this.timeout(10000)
+        this.second_update = Object.assign({}, this.historyOTUpdate)
+        this.second_update.op = [
+          {
+            textOperation: [4, 'one and a half\n', 24],
+          },
+        ]
+        this.second_update.v = this.version + 1
+        this.secondStartTime = Date.now()
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.second_update,
+          error => {
+            if (error != null) {
+              throw error
+            }
+            setTimeout(done, 200)
+          }
+        )
+      })
+
+      it('should update the doc', function (done) {
+        DocUpdaterClient.getDoc(
+          this.project_id,
+          this.doc_id,
+          (error, res, doc) => {
+            if (error) done(error)
+            doc.lines.should.deep.equal([
+              'one',
+              'one and a half',
+              'one and a half',
+              'two',
+              'three',
+            ])
+            done()
+          }
+        )
+      })
+
+      it('should not change the first op timestamp', function (done) {
+        rclientProjectHistory.get(
+          ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
+            project_id: this.project_id,
+          }),
+          (error, result) => {
+            if (error != null) {
+              throw error
+            }
+            result = parseInt(result, 10)
+            result.should.equal(this.firstOpTimestamp)
+            done()
+          }
+        )
+      })
+
+      it('should yield last updated time', function (done) {
+        DocUpdaterClient.getProjectLastUpdatedAt(
+          this.project_id,
+          (error, res, body) => {
+            if (error != null) {
+              throw error
+            }
+            res.statusCode.should.equal(200)
+            body.lastUpdatedAt.should.be.within(
+              this.secondStartTime,
+              Date.now()
+            )
+            done()
+          }
+        )
+      })
+    })
+
+    describe('when another client is sending a concurrent update', function () {
+      beforeEach(function (done) {
+        this.timeout(10000)
+        this.otherUpdate = {
+          doc: this.doc_id,
+          op: [{ textOperation: [8, 'two and a half\n', 5] }],
+          v: this.version,
+          meta: { source: 'other-random-publicId' },
+        }
+        this.secondStartTime = Date.now()
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.otherUpdate,
+          error => {
+            if (error != null) {
+              throw error
+            }
+            setTimeout(done, 200)
+          }
+        )
+      })
+
+      it('should update the doc', function (done) {
+        DocUpdaterClient.getDoc(
+          this.project_id,
+          this.doc_id,
+          (error, res, doc) => {
+            if (error) done(error)
+            doc.lines.should.deep.equal([
+              'one',
+              'one and a half',
+              'two',
+              'two and a half',
+              'three',
+            ])
+            done()
+          }
+        )
+      })
+
+      it('should not change the first op timestamp', function (done) {
+        rclientProjectHistory.get(
+          ProjectHistoryKeys.projectHistoryFirstOpTimestamp({
+            project_id: this.project_id,
+          }),
+          (error, result) => {
+            if (error != null) {
+              throw error
+            }
+            result = parseInt(result, 10)
+            result.should.equal(this.firstOpTimestamp)
+            done()
+          }
+        )
+      })
+
+      it('should yield last updated time', function (done) {
+        DocUpdaterClient.getProjectLastUpdatedAt(
+          this.project_id,
+          (error, res, body) => {
+            if (error != null) {
+              throw error
+            }
+            res.statusCode.should.equal(200)
+            body.lastUpdatedAt.should.be.within(
+              this.secondStartTime,
+              Date.now()
+            )
+            done()
+          }
+        )
+      })
+    })
   })
 
   describe('when the document is loaded', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
-
+    beforeEach(function (done) {
       MockWebApi.insertDoc(this.project_id, this.doc_id, {
         lines: this.lines,
         version: this.version,
@@ -222,7 +554,7 @@ describe('Applying updates to a doc', function () {
         if (error != null) {
           throw error
         }
-        sinon.spy(MockWebApi, 'getDocument')
+        sinon.resetHistory()
         DocUpdaterClient.sendUpdate(
           this.project_id,
           this.doc_id,
@@ -237,10 +569,6 @@ describe('Applying updates to a doc', function () {
       })
     })
 
-    after(function () {
-      MockWebApi.getDocument.restore()
-    })
-
     it('should not need to call the web api', function () {
       MockWebApi.getDocument.called.should.equal(false)
     })
@@ -272,10 +600,7 @@ describe('Applying updates to a doc', function () {
   })
 
   describe('when the document is loaded and is using project-history only', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
-
+    beforeEach(function (done) {
       MockWebApi.insertDoc(this.project_id, this.doc_id, {
         lines: this.lines,
         version: this.version,
@@ -284,7 +609,7 @@ describe('Applying updates to a doc', function () {
         if (error != null) {
           throw error
         }
-        sinon.spy(MockWebApi, 'getDocument')
+        sinon.resetHistory()
         DocUpdaterClient.sendUpdate(
           this.project_id,
           this.doc_id,
@@ -299,10 +624,6 @@ describe('Applying updates to a doc', function () {
       })
     })
 
-    after(function () {
-      MockWebApi.getDocument.restore()
-    })
-
     it('should update the doc', function (done) {
       DocUpdaterClient.getDoc(
         this.project_id,
@@ -329,11 +650,61 @@ describe('Applying updates to a doc', function () {
     })
   })
 
+  describe('when the document is loaded (history-ot)', function () {
+    beforeEach(function (done) {
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+      DocUpdaterClient.preloadDoc(this.project_id, this.doc_id, error => {
+        if (error != null) {
+          throw error
+        }
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.historyOTUpdate,
+          error => {
+            if (error != null) {
+              throw error
+            }
+            setTimeout(done, 200)
+          }
+        )
+      })
+    })
+
+    it('should update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) return done(error)
+          doc.lines.should.deep.equal(this.result)
+          done()
+        }
+      )
+    })
+
+    it('should push the applied updates to the project history changes api', function (done) {
+      rclientProjectHistory.lrange(
+        ProjectHistoryKeys.projectHistoryOps({ project_id: this.project_id }),
+        0,
+        -1,
+        (error, updates) => {
+          if (error) return done(error)
+          JSON.parse(updates[0]).op.should.deep.equal(this.historyOTUpdate.op)
+          JSON.parse(updates[0]).meta.pathname.should.equal('/a/b/c.tex')
+          done()
+        }
+      )
+    })
+  })
+
   describe('when the document has been deleted', function () {
     describe('when the ops come in a single linear order', function () {
-      before(function (done) {
-        this.project_id = DocUpdaterClient.randomId()
-        this.doc_id = DocUpdaterClient.randomId()
+      beforeEach(function (done) {
         const lines = ['', '', '']
         MockWebApi.insertDoc(this.project_id, this.doc_id, {
           lines,
@@ -353,54 +724,49 @@ describe('Applying updates to a doc', function () {
           { doc_id: this.doc_id, v: 10, op: [{ i: 'd', p: 10 }] },
         ]
         this.my_result = ['hello world', '', '']
-        done()
-      })
-
-      it('should be able to continue applying updates when the project has been deleted', function (done) {
-        let update
         const actions = []
-        for (update of this.updates.slice(0, 6)) {
-          ;(update => {
-            actions.push(callback =>
-              DocUpdaterClient.sendUpdate(
-                this.project_id,
-                this.doc_id,
-                update,
-                callback
-              )
+        for (const update of this.updates.slice(0, 6)) {
+          actions.push(callback =>
+            DocUpdaterClient.sendUpdate(
+              this.project_id,
+              this.doc_id,
+              update,
+              callback
             )
-          })(update)
+          )
         }
         actions.push(callback =>
           DocUpdaterClient.deleteDoc(this.project_id, this.doc_id, callback)
         )
-        for (update of this.updates.slice(6)) {
-          ;(update => {
-            actions.push(callback =>
-              DocUpdaterClient.sendUpdate(
-                this.project_id,
-                this.doc_id,
-                update,
-                callback
-              )
+        for (const update of this.updates.slice(6)) {
+          actions.push(callback =>
+            DocUpdaterClient.sendUpdate(
+              this.project_id,
+              this.doc_id,
+              update,
+              callback
             )
-          })(update)
+          )
         }
 
-        async.series(actions, error => {
-          if (error != null) {
-            throw error
+        // process updates
+        actions.push(cb =>
+          DocUpdaterClient.getDoc(this.project_id, this.doc_id, cb)
+        )
+
+        async.series(actions, done)
+      })
+
+      it('should be able to continue applying updates when the project has been deleted', function (done) {
+        DocUpdaterClient.getDoc(
+          this.project_id,
+          this.doc_id,
+          (error, res, doc) => {
+            if (error) return done(error)
+            doc.lines.should.deep.equal(this.my_result)
+            done()
           }
-          DocUpdaterClient.getDoc(
-            this.project_id,
-            this.doc_id,
-            (error, res, doc) => {
-              if (error) return done(error)
-              doc.lines.should.deep.equal(this.my_result)
-              done()
-            }
-          )
-        })
+        )
       })
 
       it('should store the doc ops in the correct order', function (done) {
@@ -422,9 +788,7 @@ describe('Applying updates to a doc', function () {
     })
 
     describe('when older ops come in after the delete', function () {
-      before(function (done) {
-        this.project_id = DocUpdaterClient.randomId()
-        this.doc_id = DocUpdaterClient.randomId()
+      beforeEach(function (done) {
         const lines = ['', '', '']
         MockWebApi.insertDoc(this.project_id, this.doc_id, {
           lines,
@@ -492,11 +856,9 @@ describe('Applying updates to a doc', function () {
   })
 
   describe('with a broken update', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
+    beforeEach(function (done) {
       this.broken_update = {
-        doc_id: this.doc_id,
+        doc: this.doc_id,
         v: this.version,
         op: [{ d: 'not the correct content', p: 0 }],
       }
@@ -546,10 +908,162 @@ describe('Applying updates to a doc', function () {
     })
   })
 
+  describe('with a broken update (history-ot)', function () {
+    beforeEach(function (done) {
+      this.broken_update = {
+        doc: this.doc_id,
+        v: this.version,
+        op: [{ textOperation: [99, -1] }],
+        meta: { source: '42' },
+      }
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+
+      DocUpdaterClient.subscribeToAppliedOps(
+        (this.messageCallback = sinon.stub())
+      )
+
+      DocUpdaterClient.sendUpdate(
+        this.project_id,
+        this.doc_id,
+        this.broken_update,
+        error => {
+          if (error != null) {
+            throw error
+          }
+          setTimeout(done, 200)
+        }
+      )
+    })
+
+    it('should not update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) return done(error)
+          doc.lines.should.deep.equal(this.lines)
+          done()
+        }
+      )
+    })
+
+    it('should send a message with an error', function () {
+      this.messageCallback.called.should.equal(true)
+      const [channel, message] = this.messageCallback.args[0]
+      channel.should.equal('applied-ops')
+      JSON.parse(message).should.deep.include({
+        project_id: this.project_id,
+        doc_id: this.doc_id,
+        error:
+          "The operation's base length must be equal to the string's length.",
+      })
+    })
+  })
+
+  describe('when mixing ot types (sharejs-text-ot -> history-ot)', function () {
+    beforeEach(function (done) {
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 0,
+      })
+
+      DocUpdaterClient.subscribeToAppliedOps(
+        (this.messageCallback = sinon.stub())
+      )
+
+      DocUpdaterClient.sendUpdate(
+        this.project_id,
+        this.doc_id,
+        this.historyOTUpdate,
+        error => {
+          if (error != null) {
+            throw error
+          }
+          setTimeout(done, 200)
+        }
+      )
+    })
+
+    it('should not update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) return done(error)
+          doc.lines.should.deep.equal(this.lines)
+          done()
+        }
+      )
+    })
+
+    it('should send a message with an error', function () {
+      this.messageCallback.called.should.equal(true)
+      const [channel, message] = this.messageCallback.args[0]
+      channel.should.equal('applied-ops')
+      JSON.parse(message).should.deep.include({
+        project_id: this.project_id,
+        doc_id: this.doc_id,
+        error: 'ot type mismatch',
+      })
+    })
+  })
+
+  describe('when mixing ot types (history-ot -> sharejs-text-ot)', function () {
+    beforeEach(function (done) {
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+
+      DocUpdaterClient.subscribeToAppliedOps(
+        (this.messageCallback = sinon.stub())
+      )
+
+      DocUpdaterClient.sendUpdate(
+        this.project_id,
+        this.doc_id,
+        this.update,
+        error => {
+          if (error != null) {
+            throw error
+          }
+          setTimeout(done, 200)
+        }
+      )
+    })
+
+    it('should not update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) return done(error)
+          doc.lines.should.deep.equal(this.lines)
+          done()
+        }
+      )
+    })
+
+    it('should send a message with an error', function () {
+      this.messageCallback.called.should.equal(true)
+      const [channel, message] = this.messageCallback.args[0]
+      channel.should.equal('applied-ops')
+      JSON.parse(message).should.deep.include({
+        project_id: this.project_id,
+        doc_id: this.doc_id,
+        error: 'ot type mismatch',
+      })
+    })
+  })
+
   describe('when there is no version in Mongo', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
+    beforeEach(function (done) {
       MockWebApi.insertDoc(this.project_id, this.doc_id, {
         lines: this.lines,
       })
@@ -586,9 +1100,7 @@ describe('Applying updates to a doc', function () {
   })
 
   describe('when the sending duplicate ops', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
+    beforeEach(function (done) {
       MockWebApi.insertDoc(this.project_id, this.doc_id, {
         lines: this.lines,
         version: this.version,
@@ -670,12 +1182,88 @@ describe('Applying updates to a doc', function () {
     })
   })
 
+  describe('when sending duplicate ops (history-ot)', function () {
+    beforeEach(function (done) {
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+
+      DocUpdaterClient.subscribeToAppliedOps(
+        (this.messageCallback = sinon.stub())
+      )
+
+      // One user delete 'one', the next turns it into 'once'. The second becomes a NOP.
+      DocUpdaterClient.sendUpdate(
+        this.project_id,
+        this.doc_id,
+        {
+          doc: this.doc_id,
+          op: [{ textOperation: [4, 'one and a half\n', 9] }],
+          v: this.version,
+          meta: {
+            source: 'ikHceq3yfAdQYzBo4-xZ',
+          },
+        },
+        error => {
+          if (error != null) {
+            throw error
+          }
+          setTimeout(() => {
+            DocUpdaterClient.sendUpdate(
+              this.project_id,
+              this.doc_id,
+              {
+                doc: this.doc_id,
+                op: [
+                  {
+                    textOperation: [4, 'one and a half\n', 9],
+                  },
+                ],
+                v: this.version,
+                dupIfSource: ['ikHceq3yfAdQYzBo4-xZ'],
+                meta: {
+                  source: 'ikHceq3yfAdQYzBo4-xZ',
+                },
+              },
+              error => {
+                if (error != null) {
+                  throw error
+                }
+                setTimeout(done, 200)
+              }
+            )
+          }, 200)
+        }
+      )
+    })
+
+    it('should update the doc', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) return done(error)
+          doc.lines.should.deep.equal(this.result)
+          done()
+        }
+      )
+    })
+
+    it('should return a message about duplicate ops', function () {
+      this.messageCallback.calledTwice.should.equal(true)
+      this.messageCallback.args[0][0].should.equal('applied-ops')
+      expect(JSON.parse(this.messageCallback.args[0][1]).op.dup).to.be.undefined
+      this.messageCallback.args[1][0].should.equal('applied-ops')
+      expect(JSON.parse(this.messageCallback.args[1][1]).op.dup).to.equal(true)
+    })
+  })
+
   describe('when sending updates for a non-existing doc id', function () {
-    before(function (done) {
-      this.project_id = DocUpdaterClient.randomId()
-      this.doc_id = DocUpdaterClient.randomId()
+    beforeEach(function (done) {
       this.non_existing = {
-        doc_id: this.doc_id,
+        doc: this.doc_id,
         v: this.version,
         op: [{ d: 'content', p: 0 }],
       }
diff --git a/services/document-updater/test/acceptance/js/SettingADocumentTests.js b/services/document-updater/test/acceptance/js/SettingADocumentTests.js
index 5b0c4ab281..e1bc54dc90 100644
--- a/services/document-updater/test/acceptance/js/SettingADocumentTests.js
+++ b/services/document-updater/test/acceptance/js/SettingADocumentTests.js
@@ -196,6 +196,167 @@ describe('Setting a document', function () {
     })
   })
 
+  describe('when the updated doc exists in the doc updater (history-ot)', function () {
+    before(function (done) {
+      numberOfReceivedUpdates = 0
+      this.project_id = DocUpdaterClient.randomId()
+      this.doc_id = DocUpdaterClient.randomId()
+      this.historyOTUpdate = {
+        doc: this.doc_id,
+        op: [{ textOperation: [4, 'one and a half\n', 9] }],
+        v: this.version,
+        meta: { source: 'random-publicId' },
+      }
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines: this.lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+      DocUpdaterClient.preloadDoc(this.project_id, this.doc_id, error => {
+        if (error) {
+          throw error
+        }
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.historyOTUpdate,
+          error => {
+            if (error) {
+              throw error
+            }
+            setTimeout(() => {
+              DocUpdaterClient.setDocLines(
+                this.project_id,
+                this.doc_id,
+                this.newLines,
+                this.source,
+                this.user_id,
+                false,
+                (error, res, body) => {
+                  if (error) {
+                    return done(error)
+                  }
+                  this.statusCode = res.statusCode
+                  this.body = body
+                  done()
+                }
+              )
+            }, 200)
+          }
+        )
+      })
+    })
+
+    after(function () {
+      MockProjectHistoryApi.flushProject.resetHistory()
+      MockWebApi.setDocument.resetHistory()
+    })
+
+    it('should return a 200 status code', function () {
+      this.statusCode.should.equal(200)
+    })
+
+    it('should emit two updates (from sendUpdate and setDocLines)', function () {
+      expect(numberOfReceivedUpdates).to.equal(2)
+    })
+
+    it('should send the updated doc lines and version to the web api', function () {
+      MockWebApi.setDocument
+        .calledWith(this.project_id, this.doc_id, this.newLines)
+        .should.equal(true)
+    })
+
+    it('should update the lines in the doc updater', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) {
+            return done(error)
+          }
+          doc.lines.should.deep.equal(this.newLines)
+          done()
+        }
+      )
+    })
+
+    it('should bump the version in the doc updater', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, doc) => {
+          if (error) {
+            return done(error)
+          }
+          doc.version.should.equal(this.version + 2)
+          done()
+        }
+      )
+    })
+
+    it('should leave the document in redis', function (done) {
+      docUpdaterRedis.get(
+        Keys.docLines({ doc_id: this.doc_id }),
+        (error, lines) => {
+          if (error) {
+            throw error
+          }
+          expect(JSON.parse(lines)).to.deep.equal({
+            content: this.newLines.join('\n'),
+          })
+          done()
+        }
+      )
+    })
+
+    it('should return the mongo rev in the json response', function () {
+      this.body.should.deep.equal({ rev: '123' })
+    })
+
+    describe('when doc has the same contents', function () {
+      beforeEach(function (done) {
+        numberOfReceivedUpdates = 0
+        DocUpdaterClient.setDocLines(
+          this.project_id,
+          this.doc_id,
+          this.newLines,
+          this.source,
+          this.user_id,
+          false,
+          (error, res, body) => {
+            if (error) {
+              return done(error)
+            }
+            this.statusCode = res.statusCode
+            this.body = body
+            done()
+          }
+        )
+      })
+
+      it('should not bump the version in doc updater', function (done) {
+        DocUpdaterClient.getDoc(
+          this.project_id,
+          this.doc_id,
+          (error, res, doc) => {
+            if (error) {
+              return done(error)
+            }
+            doc.version.should.equal(this.version + 2)
+            done()
+          }
+        )
+      })
+
+      it('should not emit any updates', function (done) {
+        setTimeout(() => {
+          expect(numberOfReceivedUpdates).to.equal(0)
+          done()
+        }, 100) // delay by 100ms: make sure we do not check too early!
+      })
+    })
+  })
+
   describe('when the updated doc does not exist in the doc updater', function () {
     before(function (done) {
       this.project_id = DocUpdaterClient.randomId()
@@ -525,4 +686,285 @@ describe('Setting a document', function () {
       })
     })
   })
+
+  describe('with track changes (history-ot)', function () {
+    const lines = ['one', 'one and a half', 'two', 'three']
+    const userId = DocUpdaterClient.randomId()
+    const ts = new Date().toISOString()
+    beforeEach(function (done) {
+      numberOfReceivedUpdates = 0
+      this.newLines = ['one', 'two', 'three']
+      this.project_id = DocUpdaterClient.randomId()
+      this.doc_id = DocUpdaterClient.randomId()
+      this.historyOTUpdate = {
+        doc: this.doc_id,
+        op: [
+          {
+            textOperation: [
+              4,
+              {
+                r: 'one and a half\n'.length,
+                tracking: {
+                  type: 'delete',
+                  userId,
+                  ts,
+                },
+              },
+              9,
+            ],
+          },
+        ],
+        v: this.version,
+        meta: { source: 'random-publicId' },
+      }
+      MockWebApi.insertDoc(this.project_id, this.doc_id, {
+        lines,
+        version: this.version,
+        otMigrationStage: 1,
+      })
+      DocUpdaterClient.preloadDoc(this.project_id, this.doc_id, error => {
+        if (error) {
+          throw error
+        }
+        DocUpdaterClient.sendUpdate(
+          this.project_id,
+          this.doc_id,
+          this.historyOTUpdate,
+          error => {
+            if (error) {
+              throw error
+            }
+            DocUpdaterClient.waitForPendingUpdates(
+              this.project_id,
+              this.doc_id,
+              done
+            )
+          }
+        )
+      })
+    })
+
+    afterEach(function () {
+      MockProjectHistoryApi.flushProject.resetHistory()
+      MockWebApi.setDocument.resetHistory()
+    })
+    it('should record tracked changes', function (done) {
+      docUpdaterRedis.get(
+        Keys.docLines({ doc_id: this.doc_id }),
+        (error, data) => {
+          if (error) {
+            throw error
+          }
+          expect(JSON.parse(data)).to.deep.equal({
+            content: lines.join('\n'),
+            trackedChanges: [
+              {
+                range: {
+                  pos: 4,
+                  length: 15,
+                },
+                tracking: {
+                  ts,
+                  type: 'delete',
+                  userId,
+                },
+              },
+            ],
+          })
+          done()
+        }
+      )
+    })
+
+    it('should apply the change', function (done) {
+      DocUpdaterClient.getDoc(
+        this.project_id,
+        this.doc_id,
+        (error, res, data) => {
+          if (error) {
+            throw error
+          }
+          expect(data.lines).to.deep.equal(this.newLines)
+          done()
+        }
+      )
+    })
+    const cases = [
+      {
+        name: 'when resetting the content',
+        lines,
+        want: {
+          content: 'one\none and a half\none and a half\ntwo\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 'one and a half\n'.length + 4,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when adding content before a tracked delete',
+        lines: ['one', 'INSERT', 'two', 'three'],
+        want: {
+          content: 'one\nINSERT\none and a half\ntwo\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 'INSERT\n'.length + 4,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when adding content after a tracked delete',
+        lines: ['one', 'two', 'INSERT', 'three'],
+        want: {
+          content: 'one\none and a half\ntwo\nINSERT\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 4,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when deleting content before a tracked delete',
+        lines: ['two', 'three'],
+        want: {
+          content: 'one and a half\ntwo\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 0,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when deleting content after a tracked delete',
+        lines: ['one', 'two'],
+        want: {
+          content: 'one\none and a half\ntwo',
+          trackedChanges: [
+            {
+              range: {
+                pos: 4,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when deleting content immediately after a tracked delete',
+        lines: ['one', 'three'],
+        want: {
+          content: 'one\none and a half\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 4,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+      {
+        name: 'when deleting content across a tracked delete',
+        lines: ['onethree'],
+        want: {
+          content: 'oneone and a half\nthree',
+          trackedChanges: [
+            {
+              range: {
+                pos: 3,
+                length: 15,
+              },
+              tracking: {
+                ts,
+                type: 'delete',
+                userId,
+              },
+            },
+          ],
+        },
+      },
+    ]
+
+    for (const { name, lines, want } of cases) {
+      describe(name, function () {
+        beforeEach(function (done) {
+          DocUpdaterClient.setDocLines(
+            this.project_id,
+            this.doc_id,
+            lines,
+            this.source,
+            userId,
+            false,
+            (error, res, body) => {
+              if (error) {
+                return done(error)
+              }
+              this.statusCode = res.statusCode
+              this.body = body
+              done()
+            }
+          )
+        })
+        it('should update accordingly', function (done) {
+          docUpdaterRedis.get(
+            Keys.docLines({ doc_id: this.doc_id }),
+            (error, data) => {
+              if (error) {
+                throw error
+              }
+              expect(JSON.parse(data)).to.deep.equal(want)
+              done()
+            }
+          )
+        })
+      })
+    }
+  })
 })
diff --git a/services/document-updater/test/setup.js b/services/document-updater/test/setup.js
index 1099724329..8ba17d922f 100644
--- a/services/document-updater/test/setup.js
+++ b/services/document-updater/test/setup.js
@@ -31,6 +31,7 @@ SandboxedModule.configure({
   requires: {
     '@overleaf/logger': stubs.logger,
     'mongodb-legacy': require('mongodb-legacy'), // for ObjectId comparisons
+    'overleaf-editor-core': require('overleaf-editor-core'), // does not play nice with sandbox
   },
   globals: { Buffer, JSON, Math, console, process },
   sourceTransformers: {
diff --git a/services/document-updater/test/unit/js/DocumentManager/DocumentManagerTests.js b/services/document-updater/test/unit/js/DocumentManager/DocumentManagerTests.js
index e9d68ee414..1816579103 100644
--- a/services/document-updater/test/unit/js/DocumentManager/DocumentManagerTests.js
+++ b/services/document-updater/test/unit/js/DocumentManager/DocumentManagerTests.js
@@ -49,6 +49,9 @@ describe('DocumentManager', function () {
         applyUpdate: sinon.stub().resolves(),
       },
     }
+    this.HistoryOTUpdateManager = {
+      applyUpdate: sinon.stub().resolves(),
+    }
     this.RangesManager = {
       acceptChanges: sinon.stub(),
       deleteComment: sinon.stub(),
@@ -66,6 +69,7 @@ describe('DocumentManager', function () {
         './Metrics': this.Metrics,
         './DiffCodec': this.DiffCodec,
         './UpdateManager': this.UpdateManager,
+        './HistoryOTUpdateManager': this.HistoryOTUpdateManager,
         './RangesManager': this.RangesManager,
         './Errors': Errors,
         '@overleaf/settings': this.Settings,
@@ -222,6 +226,7 @@ describe('DocumentManager', function () {
           ranges: this.ranges,
           pathname: this.pathname,
           projectHistoryId: this.projectHistoryId,
+          type: 'sharejs-text-ot',
         })
         this.RedisManager.promises.getPreviousDocOps.resolves(this.ops)
         this.result = await this.DocumentManager.promises.getDocAndRecentOps(
@@ -251,6 +256,7 @@ describe('DocumentManager', function () {
           ranges: this.ranges,
           pathname: this.pathname,
           projectHistoryId: this.projectHistoryId,
+          type: 'sharejs-text-ot',
         })
       })
     })
@@ -263,6 +269,7 @@ describe('DocumentManager', function () {
           ranges: this.ranges,
           pathname: this.pathname,
           projectHistoryId: this.projectHistoryId,
+          type: 'sharejs-text-ot',
         })
         this.RedisManager.promises.getPreviousDocOps.resolves(this.ops)
         this.result = await this.DocumentManager.promises.getDocAndRecentOps(
@@ -290,6 +297,7 @@ describe('DocumentManager', function () {
           ranges: this.ranges,
           pathname: this.pathname,
           projectHistoryId: this.projectHistoryId,
+          type: 'sharejs-text-ot',
         })
       })
     })
@@ -333,6 +341,7 @@ describe('DocumentManager', function () {
           unflushedTime: this.unflushedTime,
           alreadyLoaded: true,
           historyRangesSupport: this.historyRangesSupport,
+          type: 'sharejs-text-ot',
         })
       })
     })
@@ -400,6 +409,7 @@ describe('DocumentManager', function () {
           unflushedTime: null,
           alreadyLoaded: false,
           historyRangesSupport: this.historyRangesSupport,
+          type: 'sharejs-text-ot',
         })
       })
     })
diff --git a/services/document-updater/test/unit/js/HistoryManager/HistoryManagerTests.js b/services/document-updater/test/unit/js/HistoryManager/HistoryManagerTests.js
index 2fd019d4c2..2a5fb29b6d 100644
--- a/services/document-updater/test/unit/js/HistoryManager/HistoryManagerTests.js
+++ b/services/document-updater/test/unit/js/HistoryManager/HistoryManagerTests.js
@@ -14,6 +14,7 @@ describe('HistoryManager', function () {
       requires: {
         request: (this.request = {}),
         '@overleaf/settings': (this.Settings = {
+          shortHistoryQueues: [],
           apis: {
             project_history: {
               url: 'http://project_history.example.com',
@@ -118,7 +119,7 @@ describe('HistoryManager', function () {
       beforeEach(function () {
         this.HistoryManager.shouldFlushHistoryOps = sinon.stub()
         this.HistoryManager.shouldFlushHistoryOps
-          .withArgs(this.project_ops_length)
+          .withArgs(this.project_id, this.project_ops_length)
           .returns(true)
 
         this.HistoryManager.recordAndFlushHistoryOps(
@@ -139,7 +140,7 @@ describe('HistoryManager', function () {
       beforeEach(function () {
         this.HistoryManager.shouldFlushHistoryOps = sinon.stub()
         this.HistoryManager.shouldFlushHistoryOps
-          .withArgs(this.project_ops_length)
+          .withArgs(this.project_id, this.project_ops_length)
           .returns(false)
 
         this.HistoryManager.recordAndFlushHistoryOps(
@@ -157,6 +158,7 @@ describe('HistoryManager', function () {
     describe('shouldFlushHistoryOps', function () {
       it('should return false if the number of ops is not known', function () {
         this.HistoryManager.shouldFlushHistoryOps(
+          this.project_id,
           null,
           ['a', 'b', 'c'].length,
           1
@@ -168,6 +170,7 @@ describe('HistoryManager', function () {
         // Previously we were on 11 ops
         // We didn't pass over a multiple of 5
         this.HistoryManager.shouldFlushHistoryOps(
+          this.project_id,
           14,
           ['a', 'b', 'c'].length,
           5
@@ -178,6 +181,7 @@ describe('HistoryManager', function () {
         // Previously we were on 12 ops
         // We've reached a new multiple of 5
         this.HistoryManager.shouldFlushHistoryOps(
+          this.project_id,
           15,
           ['a', 'b', 'c'].length,
           5
@@ -189,11 +193,22 @@ describe('HistoryManager', function () {
         // Previously we were on 16 ops
         // We didn't pass over a multiple of 5
         this.HistoryManager.shouldFlushHistoryOps(
+          this.project_id,
           17,
           ['a', 'b', 'c'].length,
           5
         ).should.equal(true)
       })
+
+      it('should return true if the project has a short queue', function () {
+        this.Settings.shortHistoryQueues = [this.project_id]
+        this.HistoryManager.shouldFlushHistoryOps(
+          this.project_id,
+          14,
+          ['a', 'b', 'c'].length,
+          5
+        ).should.equal(true)
+      })
     })
   })
 
diff --git a/services/document-updater/test/unit/js/HttpController/HttpControllerTests.js b/services/document-updater/test/unit/js/HttpController/HttpControllerTests.js
index 2b8d288ef8..333da10d15 100644
--- a/services/document-updater/test/unit/js/HttpController/HttpControllerTests.js
+++ b/services/document-updater/test/unit/js/HttpController/HttpControllerTests.js
@@ -26,6 +26,7 @@ describe('HttpController', function () {
     this.Metrics.Timer.prototype.done = sinon.stub()
 
     this.project_id = 'project-id-123'
+    this.projectHistoryId = '123'
     this.doc_id = 'doc-id-123'
     this.source = 'editor'
     this.next = sinon.stub()
@@ -65,7 +66,9 @@ describe('HttpController', function () {
             this.version,
             [],
             this.ranges,
-            this.pathname
+            this.pathname,
+            this.projectHistoryId,
+            'sharejs-text-ot'
           )
         this.HttpController.getDoc(this.req, this.res, this.next)
       })
@@ -77,17 +80,16 @@ describe('HttpController', function () {
       })
 
       it('should return the doc as JSON', function () {
-        this.res.json
-          .calledWith({
-            id: this.doc_id,
-            lines: this.lines,
-            version: this.version,
-            ops: [],
-            ranges: this.ranges,
-            pathname: this.pathname,
-            ttlInS: 42,
-          })
-          .should.equal(true)
+        this.res.json.should.have.been.calledWith({
+          id: this.doc_id,
+          lines: this.lines,
+          version: this.version,
+          ops: [],
+          ranges: this.ranges,
+          pathname: this.pathname,
+          ttlInS: 42,
+          type: 'sharejs-text-ot',
+        })
       })
 
       it('should log the request', function () {
@@ -115,7 +117,9 @@ describe('HttpController', function () {
             this.version,
             this.ops,
             this.ranges,
-            this.pathname
+            this.pathname,
+            this.projectHistoryId,
+            'sharejs-text-ot'
           )
         this.req.query = { fromVersion: `${this.fromVersion}` }
         this.HttpController.getDoc(this.req, this.res, this.next)
@@ -128,17 +132,16 @@ describe('HttpController', function () {
       })
 
       it('should return the doc as JSON', function () {
-        this.res.json
-          .calledWith({
-            id: this.doc_id,
-            lines: this.lines,
-            version: this.version,
-            ops: this.ops,
-            ranges: this.ranges,
-            pathname: this.pathname,
-            ttlInS: 42,
-          })
-          .should.equal(true)
+        this.res.json.should.have.been.calledWith({
+          id: this.doc_id,
+          lines: this.lines,
+          version: this.version,
+          ops: this.ops,
+          ranges: this.ranges,
+          pathname: this.pathname,
+          ttlInS: 42,
+          type: 'sharejs-text-ot',
+        })
       })
 
       it('should log the request', function () {
diff --git a/services/document-updater/test/unit/js/Limits/LimitsTests.js b/services/document-updater/test/unit/js/Limits/LimitsTests.js
index 34a5c13c26..11ca38746a 100644
--- a/services/document-updater/test/unit/js/Limits/LimitsTests.js
+++ b/services/document-updater/test/unit/js/Limits/LimitsTests.js
@@ -81,4 +81,88 @@ describe('Limits', function () {
       })
     })
   })
+
+  describe('stringFileDataContentIsTooLarge', function () {
+    it('should handle small docs', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge({ content: '' }, 123)
+      ).to.equal(false)
+    })
+    it('should handle docs at the limit', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge(
+          { content: 'x'.repeat(123) },
+          123
+        )
+      ).to.equal(false)
+    })
+    it('should handle docs above the limit', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge(
+          { content: 'x'.repeat(123 + 1) },
+          123
+        )
+      ).to.equal(true)
+    })
+    it('should handle docs above the limit and below with tracked-deletes removed', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge(
+          {
+            content: 'x'.repeat(123 + 1),
+            trackedChanges: [
+              {
+                range: { pos: 1, length: 1 },
+                tracking: {
+                  type: 'delete',
+                  ts: '2025-06-16T14:31:44.910Z',
+                  userId: 'user-id',
+                },
+              },
+            ],
+          },
+          123
+        )
+      ).to.equal(false)
+    })
+    it('should handle docs above the limit and above with tracked-deletes removed', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge(
+          {
+            content: 'x'.repeat(123 + 2),
+            trackedChanges: [
+              {
+                range: { pos: 1, length: 1 },
+                tracking: {
+                  type: 'delete',
+                  ts: '2025-06-16T14:31:44.910Z',
+                  userId: 'user-id',
+                },
+              },
+            ],
+          },
+          123
+        )
+      ).to.equal(true)
+    })
+    it('should handle docs above the limit and with tracked-inserts', function () {
+      expect(
+        this.Limits.stringFileDataContentIsTooLarge(
+          {
+            content: 'x'.repeat(123 + 1),
+            trackedChanges: [
+              {
+                range: { pos: 1, length: 1 },
+                tracking: {
+                  type: 'insert',
+                  ts: '2025-06-16T14:31:44.910Z',
+                  userId: 'user-id',
+                },
+              },
+            ],
+          },
+          123
+        )
+      ).to.equal(true)
+    })
+  })
 })
diff --git a/services/document-updater/test/unit/js/ProjectHistoryRedisManager/ProjectHistoryRedisManagerTests.js b/services/document-updater/test/unit/js/ProjectHistoryRedisManager/ProjectHistoryRedisManagerTests.js
index 760385b176..ad6c121dfb 100644
--- a/services/document-updater/test/unit/js/ProjectHistoryRedisManager/ProjectHistoryRedisManagerTests.js
+++ b/services/document-updater/test/unit/js/ProjectHistoryRedisManager/ProjectHistoryRedisManagerTests.js
@@ -15,6 +15,7 @@ describe('ProjectHistoryRedisManager', function () {
 
     this.Limits = {
       docIsTooLarge: sinon.stub().returns(false),
+      stringFileDataContentIsTooLarge: sinon.stub().returns(false),
     }
 
     this.ProjectHistoryRedisManager = SandboxedModule.require(modulePath, {
@@ -61,22 +62,18 @@ describe('ProjectHistoryRedisManager', function () {
     })
 
     it('should queue an update', function () {
-      this.multi.rpush
-        .calledWithExactly(
-          `ProjectHistory:Ops:${this.project_id}`,
-          this.ops[0],
-          this.ops[1]
-        )
-        .should.equal(true)
+      this.multi.rpush.should.have.been.calledWithExactly(
+        `ProjectHistory:Ops:${this.project_id}`,
+        this.ops[0],
+        this.ops[1]
+      )
     })
 
     it('should set the queue timestamp if not present', function () {
-      this.multi.setnx
-        .calledWithExactly(
-          `ProjectHistory:FirstOpTimestamp:${this.project_id}`,
-          Date.now()
-        )
-        .should.equal(true)
+      this.multi.setnx.should.have.been.calledWithExactly(
+        `ProjectHistory:FirstOpTimestamp:${this.project_id}`,
+        Date.now()
+      )
     })
   })
 
@@ -118,9 +115,10 @@ describe('ProjectHistoryRedisManager', function () {
         file: this.file_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
   })
 
@@ -166,9 +164,10 @@ describe('ProjectHistoryRedisManager', function () {
         doc: this.doc_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
 
     it('should queue an update with file metadata', async function () {
@@ -350,9 +349,10 @@ describe('ProjectHistoryRedisManager', function () {
         doc: this.doc_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
 
     it('should not forward ranges if history ranges support is undefined', async function () {
@@ -402,9 +402,10 @@ describe('ProjectHistoryRedisManager', function () {
         doc: this.doc_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
 
     it('should pass "false" as the createdBlob field if not provided', async function () {
@@ -432,9 +433,10 @@ describe('ProjectHistoryRedisManager', function () {
         doc: this.doc_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
 
     it('should pass through the value of the createdBlob field', async function () {
@@ -463,9 +465,10 @@ describe('ProjectHistoryRedisManager', function () {
         doc: this.doc_id,
       }
 
-      this.ProjectHistoryRedisManager.promises.queueOps
-        .calledWithExactly(this.project_id, JSON.stringify(update))
-        .should.equal(true)
+      this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+        this.project_id,
+        JSON.stringify(update)
+      )
     })
   })
 
@@ -493,8 +496,8 @@ describe('ProjectHistoryRedisManager', function () {
       beforeEach(async function () {
         this.update = {
           resyncDocContent: {
-            content: 'one\ntwo',
             version: this.version,
+            content: 'one\ntwo',
           },
           projectHistoryId: this.projectHistoryId,
           path: this.pathname,
@@ -516,19 +519,18 @@ describe('ProjectHistoryRedisManager', function () {
       })
 
       it('should check if the doc is too large', function () {
-        this.Limits.docIsTooLarge
-          .calledWith(
-            JSON.stringify(this.update).length,
-            this.lines,
-            this.settings.max_doc_length
-          )
-          .should.equal(true)
+        this.Limits.docIsTooLarge.should.have.been.calledWith(
+          JSON.stringify(this.update).length,
+          this.lines,
+          this.settings.max_doc_length
+        )
       })
 
       it('should queue an update', function () {
-        this.ProjectHistoryRedisManager.promises.queueOps
-          .calledWithExactly(this.project_id, JSON.stringify(this.update))
-          .should.equal(true)
+        this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+          this.project_id,
+          JSON.stringify(this.update)
+        )
       })
     })
 
@@ -551,9 +553,8 @@ describe('ProjectHistoryRedisManager', function () {
       })
 
       it('should not queue an update if the doc is too large', function () {
-        this.ProjectHistoryRedisManager.promises.queueOps.called.should.equal(
-          false
-        )
+        this.ProjectHistoryRedisManager.promises.queueOps.should.not.have.been
+          .called
       })
     })
 
@@ -561,10 +562,10 @@ describe('ProjectHistoryRedisManager', function () {
       beforeEach(async function () {
         this.update = {
           resyncDocContent: {
-            content: 'onedeleted\ntwo',
             version: this.version,
             ranges: this.ranges,
             resolvedCommentIds: this.resolvedCommentIds,
+            content: 'onedeleted\ntwo',
           },
           projectHistoryId: this.projectHistoryId,
           path: this.pathname,
@@ -601,9 +602,76 @@ describe('ProjectHistoryRedisManager', function () {
       })
 
       it('should queue an update', function () {
-        this.ProjectHistoryRedisManager.promises.queueOps
-          .calledWithExactly(this.project_id, JSON.stringify(this.update))
-          .should.equal(true)
+        this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+          this.project_id,
+          JSON.stringify(this.update)
+        )
+      })
+    })
+
+    describe('history-ot', function () {
+      beforeEach(async function () {
+        this.lines = {
+          content: 'onedeleted\ntwo',
+          comments: [{ id: 'id1', ranges: [{ pos: 0, length: 3 }] }],
+          trackedChanges: [
+            {
+              range: { pos: 3, length: 7 },
+              tracking: {
+                type: 'delete',
+                userId: 'user-id',
+                ts: '2025-06-16T14:31:44.910Z',
+              },
+            },
+          ],
+        }
+        this.update = {
+          resyncDocContent: {
+            version: this.version,
+            historyOTRanges: {
+              comments: this.lines.comments,
+              trackedChanges: this.lines.trackedChanges,
+            },
+            content: this.lines.content,
+          },
+          projectHistoryId: this.projectHistoryId,
+          path: this.pathname,
+          doc: this.doc_id,
+          meta: { ts: new Date() },
+        }
+
+        await this.ProjectHistoryRedisManager.promises.queueResyncDocContent(
+          this.project_id,
+          this.projectHistoryId,
+          this.doc_id,
+          this.lines,
+          this.ranges,
+          this.resolvedCommentIds,
+          this.version,
+          this.pathname,
+          true
+        )
+      })
+
+      it('should include tracked deletes in the update', function () {
+        this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+          this.project_id,
+          JSON.stringify(this.update)
+        )
+      })
+
+      it('should check the doc length without tracked deletes', function () {
+        this.Limits.stringFileDataContentIsTooLarge.should.have.been.calledWith(
+          this.lines,
+          this.settings.max_doc_length
+        )
+      })
+
+      it('should queue an update', function () {
+        this.ProjectHistoryRedisManager.promises.queueOps.should.have.been.calledWithExactly(
+          this.project_id,
+          JSON.stringify(this.update)
+        )
       })
     })
   })
diff --git a/services/document-updater/test/unit/js/UpdateManager/UpdateManagerTests.js b/services/document-updater/test/unit/js/UpdateManager/UpdateManagerTests.js
index dba66456b7..912707e01d 100644
--- a/services/document-updater/test/unit/js/UpdateManager/UpdateManagerTests.js
+++ b/services/document-updater/test/unit/js/UpdateManager/UpdateManagerTests.js
@@ -331,6 +331,7 @@ describe('UpdateManager', function () {
         pathname: this.pathname,
         projectHistoryId: this.projectHistoryId,
         historyRangesSupport: false,
+        type: 'sharejs-text-ot',
       })
       this.RangesManager.applyUpdate.returns({
         newRanges: this.updated_ranges,
@@ -502,6 +503,7 @@ describe('UpdateManager', function () {
           pathname: this.pathname,
           projectHistoryId: this.projectHistoryId,
           historyRangesSupport: true,
+          type: 'sharejs-text-ot',
         })
         await this.UpdateManager.promises.applyUpdate(
           this.project_id,
diff --git a/services/filestore/.gitignore b/services/filestore/.gitignore
index a2f4b5afb2..1772191882 100644
--- a/services/filestore/.gitignore
+++ b/services/filestore/.gitignore
@@ -1,54 +1,3 @@
-compileFolder
-
-Compiled source #
-###################
-*.com
-*.class
-*.dll
-*.exe
-*.o
-*.so
-
-# Packages #
-############
-# it's better to unpack these files and commit the raw source
-# git has its own built in compression methods
-*.7z
-*.dmg
-*.gz
-*.iso
-*.jar
-*.rar
-*.tar
-*.zip
-
-# Logs and databases #
-######################
-*.log
-*.sql
-*.sqlite
-
-# OS generated files #
-######################
-.DS_Store?
-ehthumbs.db
-Icon?
-Thumbs.db
-
-/node_modules/*
-data/*/*
-
-**/*.map
-cookies.txt
 uploads/*
-
 user_files/*
 template_files/*
-
-**.swp
-
-/log.json
-hash_folder
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/filestore/.nvmrc b/services/filestore/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/filestore/.nvmrc
+++ b/services/filestore/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/filestore/Dockerfile b/services/filestore/Dockerfile
index 8e336d4630..33de01c80f 100644
--- a/services/filestore/Dockerfile
+++ b/services/filestore/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/filestore
 COPY services/filestore/install_deps.sh /overleaf/services/filestore/
diff --git a/services/filestore/Makefile b/services/filestore/Makefile
index cc1724589d..69d7f85bf4 100644
--- a/services/filestore/Makefile
+++ b/services/filestore/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/filestore/app.js b/services/filestore/app.js
index 23d01f1ca3..178e8c7ff0 100644
--- a/services/filestore/app.js
+++ b/services/filestore/app.js
@@ -50,64 +50,73 @@ app.use((req, res, next) => {
 
 Metrics.injectMetricsRoute(app)
 
-app.head(
-  '/project/:project_id/file/:file_id',
-  keyBuilder.userFileKeyMiddleware,
-  fileController.getFileHead
-)
-app.get(
-  '/project/:project_id/file/:file_id',
-  keyBuilder.userFileKeyMiddleware,
-  fileController.getFile
-)
-app.post(
-  '/project/:project_id/file/:file_id',
-  keyBuilder.userFileKeyMiddleware,
-  fileController.insertFile
-)
-app.put(
-  '/project/:project_id/file/:file_id',
-  keyBuilder.userFileKeyMiddleware,
-  bodyParser.json(),
-  fileController.copyFile
-)
-app.delete(
-  '/project/:project_id/file/:file_id',
-  keyBuilder.userFileKeyMiddleware,
-  fileController.deleteFile
-)
-app.delete(
-  '/project/:project_id',
-  keyBuilder.userProjectKeyMiddleware,
-  fileController.deleteProject
-)
+if (settings.filestore.stores.user_files) {
+  app.head(
+    '/project/:project_id/file/:file_id',
+    keyBuilder.userFileKeyMiddleware,
+    fileController.getFileHead
+  )
+  app.get(
+    '/project/:project_id/file/:file_id',
+    keyBuilder.userFileKeyMiddleware,
+    fileController.getFile
+  )
+  app.post(
+    '/project/:project_id/file/:file_id',
+    keyBuilder.userFileKeyMiddleware,
+    fileController.insertFile
+  )
+  app.put(
+    '/project/:project_id/file/:file_id',
+    keyBuilder.userFileKeyMiddleware,
+    bodyParser.json(),
+    fileController.copyFile
+  )
+  app.delete(
+    '/project/:project_id/file/:file_id',
+    keyBuilder.userFileKeyMiddleware,
+    fileController.deleteFile
+  )
+  app.delete(
+    '/project/:project_id',
+    keyBuilder.userProjectKeyMiddleware,
+    fileController.deleteProject
+  )
 
-app.get(
-  '/project/:project_id/size',
-  keyBuilder.userProjectKeyMiddleware,
-  fileController.directorySize
-)
+  app.get(
+    '/project/:project_id/size',
+    keyBuilder.userProjectKeyMiddleware,
+    fileController.directorySize
+  )
+}
 
-app.head(
-  '/template/:template_id/v/:version/:format',
-  keyBuilder.templateFileKeyMiddleware,
-  fileController.getFileHead
-)
-app.get(
-  '/template/:template_id/v/:version/:format',
-  keyBuilder.templateFileKeyMiddleware,
-  fileController.getFile
-)
-app.get(
-  '/template/:template_id/v/:version/:format/:sub_type',
-  keyBuilder.templateFileKeyMiddleware,
-  fileController.getFile
-)
-app.post(
-  '/template/:template_id/v/:version/:format',
-  keyBuilder.templateFileKeyMiddleware,
-  fileController.insertFile
-)
+if (settings.filestore.stores.template_files) {
+  app.head(
+    '/template/:template_id/v/:version/:format',
+    keyBuilder.templateFileKeyMiddleware,
+    fileController.getFileHead
+  )
+  app.get(
+    '/template/:template_id/v/:version/:format',
+    keyBuilder.templateFileKeyMiddleware,
+    fileController.getFile
+  )
+  app.get(
+    '/template/:template_id/v/:version/:format/:sub_type',
+    keyBuilder.templateFileKeyMiddleware,
+    fileController.getFile
+  )
+  app.post(
+    '/template/:template_id/v/:version/:format',
+    keyBuilder.templateFileKeyMiddleware,
+    fileController.insertFile
+  )
+  app.delete(
+    '/template/:template_id/v/:version/:format',
+    keyBuilder.templateFileKeyMiddleware,
+    fileController.deleteFile
+  )
+}
 
 app.get(
   '/bucket/:bucket/key/*',
diff --git a/services/filestore/app/js/FileConverter.js b/services/filestore/app/js/FileConverter.js
index ac3dccec1f..bfc34314e9 100644
--- a/services/filestore/app/js/FileConverter.js
+++ b/services/filestore/app/js/FileConverter.js
@@ -5,7 +5,7 @@ const { callbackify } = require('node:util')
 const safeExec = require('./SafeExec').promises
 const { ConversionError } = require('./Errors')
 
-const APPROVED_FORMATS = ['png']
+const APPROVED_FORMATS = ['png', 'jpg']
 const FOURTY_SECONDS = 40 * 1000
 const KILL_SIGNAL = 'SIGTERM'
 
@@ -34,16 +34,14 @@ async function convert(sourcePath, requestedFormat) {
 }
 
 async function thumbnail(sourcePath) {
-  const width = '260x'
-  return await convert(sourcePath, 'png', [
+  const width = '548x'
+  return await _convert(sourcePath, 'jpg', [
     'convert',
     '-flatten',
     '-background',
     'white',
     '-density',
     '300',
-    '-define',
-    `pdf:fit-page=${width}`,
     `${sourcePath}[0]`,
     '-resize',
     width,
@@ -51,16 +49,14 @@ async function thumbnail(sourcePath) {
 }
 
 async function preview(sourcePath) {
-  const width = '548x'
-  return await convert(sourcePath, 'png', [
+  const width = '794x'
+  return await _convert(sourcePath, 'jpg', [
     'convert',
     '-flatten',
     '-background',
     'white',
     '-density',
     '300',
-    '-define',
-    `pdf:fit-page=${width}`,
     `${sourcePath}[0]`,
     '-resize',
     width,
diff --git a/services/filestore/app/js/FileHandler.js b/services/filestore/app/js/FileHandler.js
index 2ed28bd435..0c092c85cd 100644
--- a/services/filestore/app/js/FileHandler.js
+++ b/services/filestore/app/js/FileHandler.js
@@ -150,7 +150,9 @@ async function _getConvertedFileAndCache(bucket, key, convertedKey, opts) {
   let convertedFsPath
   try {
     convertedFsPath = await _convertFile(bucket, key, opts)
-    await ImageOptimiser.promises.compressPng(convertedFsPath)
+    if (convertedFsPath.toLowerCase().endsWith(".png")) {
+      await ImageOptimiser.promises.compressPng(convertedFsPath)
+    }
     await PersistorManager.sendFile(bucket, convertedKey, convertedFsPath)
   } catch (err) {
     LocalFileWriter.deleteFile(convertedFsPath, () => {})
diff --git a/services/filestore/buildscript.txt b/services/filestore/buildscript.txt
index d40b7669c9..bd4d2116f6 100644
--- a/services/filestore/buildscript.txt
+++ b/services/filestore/buildscript.txt
@@ -5,8 +5,8 @@ filestore
 --env-add=ENABLE_CONVERSIONS="true",USE_PROM_METRICS="true",AWS_S3_USER_FILES_STORAGE_CLASS=REDUCED_REDUNDANCY,AWS_S3_USER_FILES_BUCKET_NAME=fake-user-files,AWS_S3_USER_FILES_DEK_BUCKET_NAME=fake-user-files-dek,AWS_S3_TEMPLATE_FILES_BUCKET_NAME=fake-template-files,GCS_USER_FILES_BUCKET_NAME=fake-gcs-user-files,GCS_TEMPLATE_FILES_BUCKET_NAME=fake-gcs-template-files
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=True
---script-version=4.5.0
+--script-version=4.7.0
 --test-acceptance-shards=SHARD_01_,SHARD_02_,SHARD_03_
 --use-large-ci-runner=True
diff --git a/services/filestore/docker-compose.ci.yml b/services/filestore/docker-compose.ci.yml
index febd6e4c13..fdf860b511 100644
--- a/services/filestore/docker-compose.ci.yml
+++ b/services/filestore/docker-compose.ci.yml
@@ -64,7 +64,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   certs:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - ./test/acceptance/certs:/certs
     working_dir: /certs
diff --git a/services/filestore/docker-compose.yml b/services/filestore/docker-compose.yml
index cc58997445..971d35b708 100644
--- a/services/filestore/docker-compose.yml
+++ b/services/filestore/docker-compose.yml
@@ -72,7 +72,7 @@ services:
     command: npm run --silent test:acceptance
 
   certs:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - ./test/acceptance/certs:/certs
     working_dir: /certs
diff --git a/services/git-bridge/.gitignore b/services/git-bridge/.gitignore
index 74a7f43d6e..f35e2ee038 100644
--- a/services/git-bridge/.gitignore
+++ b/services/git-bridge/.gitignore
@@ -1,53 +1,6 @@
-# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio and Webstorm
-# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839
-
-# Let's not share anything because we're using Maven.
-
-.idea
-*.iml
-
-# User-specific stuff:
-.idea/workspace.xml
-.idea/tasks.xml
-.idea/dictionaries
-.idea/vcs.xml
-.idea/jsLibraryMappings.xml
-
-# Sensitive or high-churn files:
-.idea/dataSources.ids
-.idea/dataSources.xml
-.idea/dataSources.local.xml
-.idea/sqlDataSources.xml
-.idea/dynamic.xml
-.idea/uiDesigner.xml
-
-# Gradle:
-.idea/gradle.xml
-.idea/libraries
-
-# Mongo Explorer plugin:
-.idea/mongoSettings.xml
-
-## File-based project format:
-*.iws
-
-## Plugin-specific files:
-
-# IntelliJ
+# Build output
 /out/
 target/
 
-# mpeltonen/sbt-idea plugin
-.idea_modules/
-
-# JIRA plugin
-atlassian-ide-plugin.xml
-
-# Crashlytics plugin (for Android Studio and IntelliJ)
-com_crashlytics_export_strings.xml
-crashlytics.properties
-crashlytics-build.properties
-fabric.properties
-
 # Local configuration files
 conf/runtime.json
diff --git a/services/git-bridge/Dockerfile b/services/git-bridge/Dockerfile
index 58572ae8b9..48579b9494 100644
--- a/services/git-bridge/Dockerfile
+++ b/services/git-bridge/Dockerfile
@@ -1,11 +1,17 @@
-# Dockerfile for git-bridge
+# Build the a8m/envsubst binary, as it supports default values,
+# which the gnu envsubst (from gettext-base) does not.
+FROM golang:1.24.3-alpine AS envsubst_builder
+
+WORKDIR /build
+
+RUN go install github.com/a8m/envsubst/cmd/envsubst@latest
 
 FROM maven:3-amazoncorretto-21-debian AS base
 
 RUN apt-get update && apt-get install -y make git sqlite3 \
  && rm -rf /var/lib/apt/lists
 
-COPY vendor/envsubst /opt/envsubst
+COPY --from=envsubst_builder /go/bin/envsubst /opt/envsubst
 RUN chmod +x /opt/envsubst
 
 RUN useradd --create-home node
@@ -33,7 +39,7 @@ RUN adduser -D node
 
 COPY --from=builder /git-bridge.jar /
 
-COPY vendor/envsubst /opt/envsubst
+COPY --from=envsubst_builder /go/bin/envsubst /opt/envsubst
 RUN chmod +x /opt/envsubst
 
 COPY conf/envsubst_template.json envsubst_template.json
diff --git a/services/git-bridge/README.md b/services/git-bridge/README.md
index 13b24cc6d0..eadc2abc4f 100644
--- a/services/git-bridge/README.md
+++ b/services/git-bridge/README.md
@@ -76,12 +76,10 @@ The configuration file is in `.json` format.
         "postbackBaseUrl" (string): the postback url,
         "serviceName" (string): current name of writeLaTeX
                                 in case it ever changes,
-        "oauth2" (object): { null or missing if oauth2 shouldn't be used
-            "oauth2ClientID" (string): oauth2 client ID,
-            "oauth2ClientSecret" (string): oauth2 client secret,
-            "oauth2Server" (string): oauth2 server,
-                                     with protocol and
-                                     without trailing slash
+        "oauth2Server" (string): oauth2 server,
+                                 with protocol and
+                                 without trailing slash,
+                                 null or missing if oauth2 shouldn't be used
         },
         "repoStore" (object, optional): { configure the repo store
             "maxFileSize" (long, optional): maximum size of a file, inclusive
diff --git a/services/git-bridge/conf/envsubst_template.json b/services/git-bridge/conf/envsubst_template.json
index 6aa91be700..4ede5bab7f 100644
--- a/services/git-bridge/conf/envsubst_template.json
+++ b/services/git-bridge/conf/envsubst_template.json
@@ -7,11 +7,7 @@
   "apiBaseUrl": "${GIT_BRIDGE_API_BASE_URL:-https://localhost/api/v0}",
   "postbackBaseUrl": "${GIT_BRIDGE_POSTBACK_BASE_URL:-https://localhost}",
   "serviceName": "${GIT_BRIDGE_SERVICE_NAME:-Overleaf}",
-  "oauth2": {
-    "oauth2ClientID": "${GIT_BRIDGE_OAUTH2_CLIENT_ID}",
-    "oauth2ClientSecret": "${GIT_BRIDGE_OAUTH2_CLIENT_SECRET}",
-    "oauth2Server": "${GIT_BRIDGE_OAUTH2_SERVER:-https://localhost}"
-  },
+  "oauth2Server": "${GIT_BRIDGE_OAUTH2_SERVER:-https://localhost}",
   "userPasswordEnabled": ${GIT_BRIDGE_USER_PASSWORD_ENABLED:-false},
   "repoStore": {
     "maxFileNum": ${GIT_BRIDGE_REPOSTORE_MAX_FILE_NUM:-2000},
diff --git a/services/git-bridge/conf/example_config.json b/services/git-bridge/conf/example_config.json
index 1e5b95e5a6..76b82eb6a0 100644
--- a/services/git-bridge/conf/example_config.json
+++ b/services/git-bridge/conf/example_config.json
@@ -7,11 +7,7 @@
     "apiBaseUrl": "https://localhost/api/v0",
     "postbackBaseUrl": "https://localhost",
     "serviceName": "Overleaf",
-    "oauth2": {
-        "oauth2ClientID": "asdf",
-        "oauth2ClientSecret": "asdf",
-        "oauth2Server": "https://localhost"
-    },
+    "oauth2Server": "https://localhost",
     "repoStore": {
         "maxFileNum": 2000,
         "maxFileSize": 52428800
diff --git a/services/git-bridge/conf/local.json b/services/git-bridge/conf/local.json
index 69eb31ab2f..c4de48d819 100644
--- a/services/git-bridge/conf/local.json
+++ b/services/git-bridge/conf/local.json
@@ -7,11 +7,7 @@
   "apiBaseUrl": "http://v2.overleaf.test:3000/api/v0",
   "postbackBaseUrl": "http://git-bridge:8000",
   "serviceName": "Overleaf",
-  "oauth2": {
-    "oauth2ClientID": "264c723c925c13590880751f861f13084934030c13b4452901e73bdfab226edc",
-    "oauth2ClientSecret": "e6b2e9eee7ae2bb653823250bb69594a91db0547fe3790a7135acb497108e62d",
-    "oauth2Server": "http://v2.overleaf.test:3000"
-  },
+  "oauth2Server": "http://v2.overleaf.test:3000",
   "repoStore": {
     "maxFileNum": 2000,
     "maxFileSize": 52428800
diff --git a/services/git-bridge/pom.xml b/services/git-bridge/pom.xml
index 7b2c5b8e55..3feb4dd860 100644
--- a/services/git-bridge/pom.xml
+++ b/services/git-bridge/pom.xml
@@ -18,8 +18,8 @@
         <jmock.junit4.version>2.8.4</jmock.junit4.version>
         <jetty.servlet.version>9.4.57.v20241219</jetty.servlet.version>
         <gson.version>2.9.0</gson.version>
-        <async.http.client.version>3.0.1</async.http.client.version>
-        <jgit.version>6.6.1.202309021850-r</jgit.version>
+        <async.http.client.version>3.0.2</async.http.client.version>
+        <jgit.version>6.10.1.202505221210-r</jgit.version>
         <sqlite.jdbc.version>3.41.2.2</sqlite.jdbc.version>
         <joda.time.version>2.9.9</joda.time.version>
         <google.oauth.client.version>1.37.0</google.oauth.client.version>
diff --git a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Config.java b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Config.java
index 492302721b..d5b530100e 100644
--- a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Config.java
+++ b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Config.java
@@ -30,7 +30,7 @@ public class Config implements JSONSource {
         config.apiBaseURL,
         config.postbackURL,
         config.serviceName,
-        Oauth2.asSanitised(config.oauth2),
+        config.oauth2Server,
         config.userPasswordEnabled,
         config.repoStore,
         SwapStoreConfig.sanitisedCopy(config.swapStore),
@@ -46,7 +46,7 @@ public class Config implements JSONSource {
   private String apiBaseURL;
   private String postbackURL;
   private String serviceName;
-  @Nullable private Oauth2 oauth2;
+  @Nullable private String oauth2Server;
   private boolean userPasswordEnabled;
   @Nullable private RepoStoreConfig repoStore;
   @Nullable private SwapStoreConfig swapStore;
@@ -70,7 +70,7 @@ public class Config implements JSONSource {
       String apiBaseURL,
       String postbackURL,
       String serviceName,
-      Oauth2 oauth2,
+      String oauth2Server,
       boolean userPasswordEnabled,
       RepoStoreConfig repoStore,
       SwapStoreConfig swapStore,
@@ -84,7 +84,7 @@ public class Config implements JSONSource {
     this.apiBaseURL = apiBaseURL;
     this.postbackURL = postbackURL;
     this.serviceName = serviceName;
-    this.oauth2 = oauth2;
+    this.oauth2Server = oauth2Server;
     this.userPasswordEnabled = userPasswordEnabled;
     this.repoStore = repoStore;
     this.swapStore = swapStore;
@@ -116,7 +116,7 @@ public class Config implements JSONSource {
     if (!postbackURL.endsWith("/")) {
       postbackURL += "/";
     }
-    oauth2 = new Gson().fromJson(configObject.get("oauth2"), Oauth2.class);
+    oauth2Server = getOptionalString(configObject, "oauth2Server");
     userPasswordEnabled = getOptionalString(configObject, "userPasswordEnabled").equals("true");
     repoStore = new Gson().fromJson(configObject.get("repoStore"), RepoStoreConfig.class);
     swapStore = new Gson().fromJson(configObject.get("swapStore"), SwapStoreConfig.class);
@@ -166,19 +166,12 @@ public class Config implements JSONSource {
     return postbackURL;
   }
 
-  public boolean isUsingOauth2() {
-    return oauth2 != null;
-  }
-
   public boolean isUserPasswordEnabled() {
     return userPasswordEnabled;
   }
 
-  public Oauth2 getOauth2() {
-    if (!isUsingOauth2()) {
-      throw new AssertionError("Getting oauth2 when not using it");
-    }
-    return oauth2;
+  public String getOauth2Server() {
+    return oauth2Server;
   }
 
   public Optional<RepoStoreConfig> getRepoStore() {
diff --git a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Oauth2.java b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Oauth2.java
deleted file mode 100644
index 1db7d3b4d2..0000000000
--- a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/application/config/Oauth2.java
+++ /dev/null
@@ -1,33 +0,0 @@
-package uk.ac.ic.wlgitbridge.application.config;
-
-/*
- * Created by winston on 25/10/15.
- */
-public class Oauth2 {
-
-  private final String oauth2ClientID;
-  private final String oauth2ClientSecret;
-  private final String oauth2Server;
-
-  public Oauth2(String oauth2ClientID, String oauth2ClientSecret, String oauth2Server) {
-    this.oauth2ClientID = oauth2ClientID;
-    this.oauth2ClientSecret = oauth2ClientSecret;
-    this.oauth2Server = oauth2Server;
-  }
-
-  public String getOauth2ClientID() {
-    return oauth2ClientID;
-  }
-
-  public String getOauth2ClientSecret() {
-    return oauth2ClientSecret;
-  }
-
-  public String getOauth2Server() {
-    return oauth2Server;
-  }
-
-  public static Oauth2 asSanitised(Oauth2 oauth2) {
-    return new Oauth2("<oauth2ClientID>", "<oauth2ClientSecret>", oauth2.oauth2Server);
-  }
-}
diff --git a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/GitBridgeServer.java b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/GitBridgeServer.java
index c576e2e9d8..57d1b34a7b 100644
--- a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/GitBridgeServer.java
+++ b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/GitBridgeServer.java
@@ -151,9 +151,9 @@ public class GitBridgeServer {
       throws ServletException {
     final ServletContextHandler servletContextHandler =
         new ServletContextHandler(ServletContextHandler.SESSIONS);
-    if (config.isUsingOauth2()) {
+    if (config.getOauth2Server() != null) {
       Filter filter =
-          new Oauth2Filter(snapshotApi, config.getOauth2(), config.isUserPasswordEnabled());
+          new Oauth2Filter(snapshotApi, config.getOauth2Server(), config.isUserPasswordEnabled());
       servletContextHandler.addFilter(
           new FilterHolder(filter), "/*", EnumSet.of(DispatcherType.REQUEST));
     }
diff --git a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/Oauth2Filter.java b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/Oauth2Filter.java
index 5bd3904e47..586a21ab3f 100644
--- a/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/Oauth2Filter.java
+++ b/services/git-bridge/src/main/java/uk/ac/ic/wlgitbridge/server/Oauth2Filter.java
@@ -13,7 +13,6 @@ import javax.servlet.*;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 import org.apache.commons.codec.binary.Base64;
-import uk.ac.ic.wlgitbridge.application.config.Oauth2;
 import uk.ac.ic.wlgitbridge.bridge.snapshot.SnapshotApi;
 import uk.ac.ic.wlgitbridge.util.Instance;
 import uk.ac.ic.wlgitbridge.util.Log;
@@ -28,13 +27,13 @@ public class Oauth2Filter implements Filter {
 
   private final SnapshotApi snapshotApi;
 
-  private final Oauth2 oauth2;
+  private final String oauth2Server;
 
   private final boolean isUserPasswordEnabled;
 
-  public Oauth2Filter(SnapshotApi snapshotApi, Oauth2 oauth2, boolean isUserPasswordEnabled) {
+  public Oauth2Filter(SnapshotApi snapshotApi, String oauth2Server, boolean isUserPasswordEnabled) {
     this.snapshotApi = snapshotApi;
-    this.oauth2 = oauth2;
+    this.oauth2Server = oauth2Server;
     this.isUserPasswordEnabled = isUserPasswordEnabled;
   }
 
@@ -108,7 +107,7 @@ public class Oauth2Filter implements Filter {
       // fail later (for example, in the unlikely event that the token
       // expired between the two requests). In that case, JGit will
       // return a 401 without a custom error message.
-      int statusCode = checkAccessToken(oauth2, password, getClientIp(request));
+      int statusCode = checkAccessToken(this.oauth2Server, password, getClientIp(request));
       if (statusCode == 429) {
         handleRateLimit(projectId, username, request, response);
         return;
@@ -238,10 +237,9 @@ public class Oauth2Filter implements Filter {
             "your Overleaf Account Settings."));
   }
 
-  private int checkAccessToken(Oauth2 oauth2, String accessToken, String clientIp)
+  private int checkAccessToken(String oauth2Server, String accessToken, String clientIp)
       throws IOException {
-    GenericUrl url =
-        new GenericUrl(oauth2.getOauth2Server() + "/oauth/token/info?client_ip=" + clientIp);
+    GenericUrl url = new GenericUrl(oauth2Server + "/oauth/token/info?client_ip=" + clientIp);
     HttpRequest request = Instance.httpRequestFactory.buildGetRequest(url);
     HttpHeaders headers = new HttpHeaders();
     headers.setAuthorization("Bearer " + accessToken);
diff --git a/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/WLGitBridgeIntegrationTest.java b/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/WLGitBridgeIntegrationTest.java
index 8491aa8055..f706d98edf 100644
--- a/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/WLGitBridgeIntegrationTest.java
+++ b/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/WLGitBridgeIntegrationTest.java
@@ -1495,13 +1495,9 @@ public class WLGitBridgeIntegrationTest {
             + port
             + "\",\n"
             + "    \"serviceName\": \"Overleaf\",\n"
-            + "    \"oauth2\": {\n"
-            + "        \"oauth2ClientID\": \"clientID\",\n"
-            + "        \"oauth2ClientSecret\": \"oauth2 client secret\",\n"
-            + "        \"oauth2Server\": \"http://127.0.0.1:"
+            + "    \"oauth2Server\": \"http://127.0.0.1:"
             + apiPort
-            + "\"\n"
-            + "    }";
+            + "\"";
     if (swapCfg != null) {
       cfgStr +=
           ",\n"
@@ -1524,7 +1520,6 @@ public class WLGitBridgeIntegrationTest {
               + ",\n"
               + "        \"intervalMillis\": "
               + swapCfg.getIntervalMillis()
-              + "\n"
               + "    }\n";
     }
     cfgStr += "}\n";
diff --git a/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/config/ConfigTest.java b/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/config/ConfigTest.java
index cbb4265d5b..8c102dbda3 100644
--- a/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/config/ConfigTest.java
+++ b/services/git-bridge/src/test/java/uk/ac/ic/wlgitbridge/application/config/ConfigTest.java
@@ -23,11 +23,7 @@ public class ConfigTest {
                 + "    \"apiBaseUrl\": \"http://127.0.0.1:60000/api/v0\",\n"
                 + "    \"postbackBaseUrl\": \"http://127.0.0.1\",\n"
                 + "    \"serviceName\": \"Overleaf\",\n"
-                + "    \"oauth2\": {\n"
-                + "        \"oauth2ClientID\": \"clientID\",\n"
-                + "        \"oauth2ClientSecret\": \"oauth2 client secret\",\n"
-                + "        \"oauth2Server\": \"https://www.overleaf.com\"\n"
-                + "    }\n"
+                + "    \"oauth2Server\": \"https://www.overleaf.com\"\n"
                 + "}\n");
     Config config = new Config(reader);
     assertEquals(80, config.getPort());
@@ -35,10 +31,7 @@ public class ConfigTest {
     assertEquals("http://127.0.0.1:60000/api/v0/", config.getAPIBaseURL());
     assertEquals("http://127.0.0.1/", config.getPostbackURL());
     assertEquals("Overleaf", config.getServiceName());
-    assertTrue(config.isUsingOauth2());
-    assertEquals("clientID", config.getOauth2().getOauth2ClientID());
-    assertEquals("oauth2 client secret", config.getOauth2().getOauth2ClientSecret());
-    assertEquals("https://www.overleaf.com", config.getOauth2().getOauth2Server());
+    assertEquals("https://www.overleaf.com", config.getOauth2Server());
   }
 
   @Test(expected = AssertionError.class)
@@ -53,7 +46,7 @@ public class ConfigTest {
                 + "    \"apiBaseUrl\": \"http://127.0.0.1:60000/api/v0\",\n"
                 + "    \"postbackBaseUrl\": \"http://127.0.0.1\",\n"
                 + "    \"serviceName\": \"Overleaf\",\n"
-                + "    \"oauth2\": null\n"
+                + "    \"oauth2Server\": null\n"
                 + "}\n");
     Config config = new Config(reader);
     assertEquals(80, config.getPort());
@@ -61,8 +54,7 @@ public class ConfigTest {
     assertEquals("http://127.0.0.1:60000/api/v0/", config.getAPIBaseURL());
     assertEquals("http://127.0.0.1/", config.getPostbackURL());
     assertEquals("Overleaf", config.getServiceName());
-    assertFalse(config.isUsingOauth2());
-    config.getOauth2();
+    assertNull(config.getOauth2Server());
   }
 
   @Test
@@ -77,11 +69,7 @@ public class ConfigTest {
                 + "    \"apiBaseUrl\": \"http://127.0.0.1:60000/api/v0\",\n"
                 + "    \"postbackBaseUrl\": \"http://127.0.0.1\",\n"
                 + "    \"serviceName\": \"Overleaf\",\n"
-                + "    \"oauth2\": {\n"
-                + "        \"oauth2ClientID\": \"my oauth2 client id\",\n"
-                + "        \"oauth2ClientSecret\": \"my oauth2 client secret\",\n"
-                + "        \"oauth2Server\": \"https://www.overleaf.com\"\n"
-                + "    }\n"
+                + "    \"oauth2Server\": \"https://www.overleaf.com\"\n"
                 + "}\n");
     Config config = new Config(reader);
     String expected =
@@ -94,11 +82,7 @@ public class ConfigTest {
             + "  \"apiBaseURL\": \"http://127.0.0.1:60000/api/v0/\",\n"
             + "  \"postbackURL\": \"http://127.0.0.1/\",\n"
             + "  \"serviceName\": \"Overleaf\",\n"
-            + "  \"oauth2\": {\n"
-            + "    \"oauth2ClientID\": \"<oauth2ClientID>\",\n"
-            + "    \"oauth2ClientSecret\": \"<oauth2ClientSecret>\",\n"
-            + "    \"oauth2Server\": \"https://www.overleaf.com\"\n"
-            + "  },\n"
+            + "  \"oauth2Server\": \"https://www.overleaf.com\",\n"
             + "  \"userPasswordEnabled\": false,\n"
             + "  \"repoStore\": null,\n"
             + "  \"swapStore\": null,\n"
diff --git a/services/git-bridge/vendor/envsubst b/services/git-bridge/vendor/envsubst
deleted file mode 100755
index f7ad8081d0..0000000000
Binary files a/services/git-bridge/vendor/envsubst and /dev/null differ
diff --git a/services/history-v1/.gitignore b/services/history-v1/.gitignore
deleted file mode 100644
index edb0f85350..0000000000
--- a/services/history-v1/.gitignore
+++ /dev/null
@@ -1,3 +0,0 @@
-
-# managed by monorepo$ bin/update_build_scripts
-.npmrc
diff --git a/services/history-v1/.nvmrc b/services/history-v1/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/history-v1/.nvmrc
+++ b/services/history-v1/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/history-v1/Dockerfile b/services/history-v1/Dockerfile
index 0aa6a2fc0f..322ab67ff8 100644
--- a/services/history-v1/Dockerfile
+++ b/services/history-v1/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/history-v1
 COPY services/history-v1/install_deps.sh /overleaf/services/history-v1/
diff --git a/services/history-v1/Makefile b/services/history-v1/Makefile
index 1f03a21f18..7e62ba1812 100644
--- a/services/history-v1/Makefile
+++ b/services/history-v1/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/history-v1/api/app/rollout.js b/services/history-v1/api/app/rollout.js
new file mode 100644
index 0000000000..24ca0409f8
--- /dev/null
+++ b/services/history-v1/api/app/rollout.js
@@ -0,0 +1,76 @@
+const crypto = require('node:crypto')
+
+class Rollout {
+  constructor(config) {
+    // The history buffer level is used to determine whether to queue changes
+    // in Redis or persist them directly to the chunk store.
+    // If defaults to 0 (no queuing) if not set.
+    this.historyBufferLevel = config.has('historyBufferLevel')
+      ? parseInt(config.get('historyBufferLevel'), 10)
+      : 0
+    // The forcePersistBuffer flag will ensure the buffer is fully persisted before
+    // any persist operation. Set this to true if you want to make the persisted-version
+    // in Redis match the endVersion of the latest chunk. This should be set to true
+    // when downgrading from a history buffer level that queues changes in Redis
+    // without persisting them immediately.
+    this.forcePersistBuffer = config.has('forcePersistBuffer')
+      ? config.get('forcePersistBuffer') === 'true'
+      : false
+
+    // Support gradual rollout of the next history buffer level
+    // with a percentage of projects using it.
+    this.nextHistoryBufferLevel = config.has('nextHistoryBufferLevel')
+      ? parseInt(config.get('nextHistoryBufferLevel'), 10)
+      : null
+    this.nextHistoryBufferLevelRolloutPercentage = config.has(
+      'nextHistoryBufferLevelRolloutPercentage'
+    )
+      ? parseInt(config.get('nextHistoryBufferLevelRolloutPercentage'), 10)
+      : 0
+  }
+
+  report(logger) {
+    logger.info(
+      {
+        historyBufferLevel: this.historyBufferLevel,
+        forcePersistBuffer: this.forcePersistBuffer,
+        nextHistoryBufferLevel: this.nextHistoryBufferLevel,
+        nextHistoryBufferLevelRolloutPercentage:
+          this.nextHistoryBufferLevelRolloutPercentage,
+      },
+      this.historyBufferLevel > 0 || this.forcePersistBuffer
+        ? 'using history buffer'
+        : 'history buffer disabled'
+    )
+  }
+
+  /**
+   * Get the history buffer level for a project.
+   * @param {string} projectId
+   * @returns {Object} - An object containing the history buffer level and force persist buffer flag.
+   * @property {number} historyBufferLevel - The history buffer level to use for processing changes.
+   * @property {boolean} forcePersistBuffer - If true, forces the buffer to be persisted before any operation.
+   */
+  getHistoryBufferLevelOptions(projectId) {
+    if (
+      this.nextHistoryBufferLevel > this.historyBufferLevel &&
+      this.nextHistoryBufferLevelRolloutPercentage > 0
+    ) {
+      const hash = crypto.createHash('sha1').update(projectId).digest('hex')
+      const percentage = parseInt(hash.slice(0, 8), 16) % 100
+      // If the project is in the rollout percentage, we use the next history buffer level.
+      if (percentage < this.nextHistoryBufferLevelRolloutPercentage) {
+        return {
+          historyBufferLevel: this.nextHistoryBufferLevel,
+          forcePersistBuffer: this.forcePersistBuffer,
+        }
+      }
+    }
+    return {
+      historyBufferLevel: this.historyBufferLevel,
+      forcePersistBuffer: this.forcePersistBuffer,
+    }
+  }
+}
+
+module.exports = Rollout
diff --git a/services/history-v1/api/controllers/project_import.js b/services/history-v1/api/controllers/project_import.js
index 5dec84d843..02fb793c87 100644
--- a/services/history-v1/api/controllers/project_import.js
+++ b/services/history-v1/api/controllers/project_import.js
@@ -2,6 +2,7 @@
 
 'use strict'
 
+const config = require('config')
 const { expressify } = require('@overleaf/promise-utils')
 
 const HTTPStatus = require('http-status')
@@ -21,10 +22,16 @@ const BatchBlobStore = storage.BatchBlobStore
 const BlobStore = storage.BlobStore
 const chunkStore = storage.chunkStore
 const HashCheckBlobStore = storage.HashCheckBlobStore
-const persistChanges = storage.persistChanges
+const commitChanges = storage.commitChanges
+const persistBuffer = storage.persistBuffer
 const InvalidChangeError = storage.InvalidChangeError
 
 const render = require('./render')
+const Rollout = require('../app/rollout')
+const redisBackend = require('../../storage/lib/chunk_store/redis')
+
+const rollout = new Rollout(config)
+rollout.report(logger) // display the rollout configuration in the logs
 
 async function importSnapshot(req, res) {
   const projectId = req.swagger.params.project_id.value
@@ -35,6 +42,7 @@ async function importSnapshot(req, res) {
   try {
     snapshot = Snapshot.fromRaw(rawSnapshot)
   } catch (err) {
+    logger.warn({ err, projectId }, 'failed to import snapshot')
     return render.unprocessableEntity(res)
   }
 
@@ -43,6 +51,7 @@ async function importSnapshot(req, res) {
     historyId = await chunkStore.initializeProject(projectId, snapshot)
   } catch (err) {
     if (err instanceof chunkStore.AlreadyInitialized) {
+      logger.warn({ err, projectId }, 'already initialized')
       return render.conflict(res)
     } else {
       throw err
@@ -95,7 +104,9 @@ async function importChanges(req, res, next) {
   }
 
   async function buildResultSnapshot(resultChunk) {
-    const chunk = resultChunk || (await chunkStore.loadLatest(projectId))
+    const chunk =
+      resultChunk ||
+      (await chunkStore.loadLatest(projectId, { persistedOnly: true }))
     const snapshot = chunk.getSnapshot()
     snapshot.applyAll(chunk.getChanges())
     const rawSnapshot = await snapshot.store(hashCheckBlobStore)
@@ -106,7 +117,12 @@ async function importChanges(req, res, next) {
 
   let result
   try {
-    result = await persistChanges(projectId, changes, limits, endVersion)
+    const { historyBufferLevel, forcePersistBuffer } =
+      rollout.getHistoryBufferLevelOptions(projectId)
+    result = await commitChanges(projectId, changes, limits, endVersion, {
+      historyBufferLevel,
+      forcePersistBuffer,
+    })
   } catch (err) {
     if (
       err instanceof Chunk.ConflictingEndVersion ||
@@ -130,12 +146,45 @@ async function importChanges(req, res, next) {
   }
 
   if (returnSnapshot === 'none') {
-    res.status(HTTPStatus.CREATED).json({})
+    res.status(HTTPStatus.CREATED).json({
+      resyncNeeded: result.resyncNeeded,
+    })
   } else {
     const rawSnapshot = await buildResultSnapshot(result && result.currentChunk)
     res.status(HTTPStatus.CREATED).json(rawSnapshot)
   }
 }
 
+async function flushChanges(req, res, next) {
+  const projectId = req.swagger.params.project_id.value
+  // Use the same limits importChanges, since these are passed to persistChanges
+  const farFuture = new Date()
+  farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+  const limits = {
+    maxChanges: 0,
+    minChangeTimestamp: farFuture,
+    maxChangeTimestamp: farFuture,
+    autoResync: true,
+  }
+  try {
+    await persistBuffer(projectId, limits)
+    res.status(HTTPStatus.OK).end()
+  } catch (err) {
+    if (err instanceof Chunk.NotFoundError) {
+      render.notFound(res)
+    } else {
+      throw err
+    }
+  }
+}
+
+async function expireProject(req, res, next) {
+  const projectId = req.swagger.params.project_id.value
+  await redisBackend.expireProject(projectId)
+  res.status(HTTPStatus.OK).end()
+}
+
 exports.importSnapshot = expressify(importSnapshot)
 exports.importChanges = expressify(importChanges)
+exports.flushChanges = expressify(flushChanges)
+exports.expireProject = expressify(expireProject)
diff --git a/services/history-v1/api/controllers/projects.js b/services/history-v1/api/controllers/projects.js
index 7dbeb53fae..b7f07c4834 100644
--- a/services/history-v1/api/controllers/projects.js
+++ b/services/history-v1/api/controllers/projects.js
@@ -15,6 +15,7 @@ const {
   BlobStore,
   blobHash,
   chunkStore,
+  redisBuffer,
   HashCheckBlobStore,
   ProjectArchive,
   zipStore,
@@ -34,6 +35,7 @@ async function initializeProject(req, res, next) {
     res.status(HTTPStatus.OK).json({ projectId })
   } catch (err) {
     if (err instanceof chunkStore.AlreadyInitialized) {
+      logger.warn({ err, projectId }, 'failed to initialize')
       render.conflict(res)
     } else {
       throw err
@@ -91,7 +93,7 @@ async function getLatestHistoryRaw(req, res, next) {
   const readOnly = req.swagger.params.readOnly.value
   try {
     const { startVersion, endVersion, endTimestamp } =
-      await chunkStore.loadLatestRaw(projectId, { readOnly })
+      await chunkStore.getLatestChunkMetadata(projectId, { readOnly })
     res.json({
       startVersion,
       endVersion,
@@ -138,6 +140,43 @@ async function getHistoryBefore(req, res, next) {
   }
 }
 
+/**
+ * Get all changes since the beginning of history or since a given version
+ */
+async function getChanges(req, res, next) {
+  const projectId = req.swagger.params.project_id.value
+  const since = req.swagger.params.since.value ?? 0
+
+  if (since < 0) {
+    // Negative values would cause an infinite loop
+    return res.status(400).json({
+      error: `Version out of bounds: ${since}`,
+    })
+  }
+
+  let chunk
+  try {
+    chunk = await chunkStore.loadAtVersion(projectId, since, {
+      preferNewer: true,
+    })
+  } catch (err) {
+    if (err instanceof Chunk.VersionNotFoundError) {
+      return res.status(400).json({
+        error: `Version out of bounds: ${since}`,
+      })
+    }
+    throw err
+  }
+
+  const latestChunkMetadata = await chunkStore.getLatestChunkMetadata(projectId)
+
+  // Extract the relevant changes from the chunk that contains the start version
+  const changes = chunk.getChanges().slice(since - chunk.getStartVersion())
+  const hasMore = latestChunkMetadata.endVersion > chunk.getEndVersion()
+
+  res.json({ changes: changes.map(change => change.toRaw()), hasMore })
+}
+
 async function getZip(req, res, next) {
   const projectId = req.swagger.params.project_id.value
   const version = req.swagger.params.version.value
@@ -188,7 +227,9 @@ async function createZip(req, res, next) {
 async function deleteProject(req, res, next) {
   const projectId = req.swagger.params.project_id.value
   const blobStore = new BlobStore(projectId)
+
   await Promise.all([
+    redisBuffer.hardDeleteProject(projectId),
     chunkStore.deleteProjectChunks(projectId),
     blobStore.deleteBlobs(),
   ])
@@ -205,22 +246,28 @@ async function createProjectBlob(req, res, next) {
     const sizeLimit = new StreamSizeLimit(maxUploadSize)
     await pipeline(req, sizeLimit, fs.createWriteStream(tmpPath))
     if (sizeLimit.sizeLimitExceeded) {
+      logger.warn(
+        { projectId, expectedHash, maxUploadSize },
+        'blob exceeds size threshold'
+      )
       return render.requestEntityTooLarge(res)
     }
     const hash = await blobHash.fromFile(tmpPath)
     if (hash !== expectedHash) {
-      logger.debug({ hash, expectedHash }, 'Hash mismatch')
+      logger.warn({ projectId, hash, expectedHash }, 'Hash mismatch')
       return render.conflict(res, 'File hash mismatch')
     }
 
     const blobStore = new BlobStore(projectId)
     const newBlob = await blobStore.putFile(tmpPath)
 
-    try {
-      const { backupBlob } = await import('../../storage/lib/backupBlob.mjs')
-      await backupBlob(projectId, newBlob, tmpPath)
-    } catch (error) {
-      logger.warn({ error, projectId, hash }, 'Failed to backup blob')
+    if (config.has('backupStore')) {
+      try {
+        const { backupBlob } = await import('../../storage/lib/backupBlob.mjs')
+        await backupBlob(projectId, newBlob, tmpPath)
+      } catch (error) {
+        logger.warn({ error, projectId, hash }, 'Failed to backup blob')
+      }
     }
     res.status(HTTPStatus.CREATED).end()
   })
@@ -304,6 +351,10 @@ async function copyProjectBlob(req, res, next) {
     targetBlobStore.getBlob(blobHash),
   ])
   if (!sourceBlob) {
+    logger.warn(
+      { sourceProjectId, targetProjectId, blobHash },
+      'missing source blob when copying across projects'
+    )
     return render.notFound(res)
   }
   // Exit early if the blob exists in the target project.
@@ -337,6 +388,7 @@ module.exports = {
   getLatestHistoryRaw: expressify(getLatestHistoryRaw),
   getHistory: expressify(getHistory),
   getHistoryBefore: expressify(getHistoryBefore),
+  getChanges: expressify(getChanges),
   getZip: expressify(getZip),
   createZip: expressify(createZip),
   deleteProject: expressify(deleteProject),
diff --git a/services/history-v1/api/controllers/with_tmp_dir.js b/services/history-v1/api/controllers/with_tmp_dir.js
index a9c2e9fb47..2e0737ba69 100644
--- a/services/history-v1/api/controllers/with_tmp_dir.js
+++ b/services/history-v1/api/controllers/with_tmp_dir.js
@@ -9,7 +9,7 @@ const path = require('node:path')
  * after.
  *
  * @param {string} prefix - prefix for the temporary directory name
- * @param {Function} fn - async function to call
+ * @param {(tmpDir: string) => Promise<void>} fn - async function to call
  */
 async function withTmpDir(prefix, fn) {
   const tmpDir = await fs.promises.mkdtemp(path.join(os.tmpdir(), prefix))
diff --git a/services/history-v1/api/swagger/project_import.js b/services/history-v1/api/swagger/project_import.js
index 60eb47fce4..043dc70667 100644
--- a/services/history-v1/api/swagger/project_import.js
+++ b/services/history-v1/api/swagger/project_import.js
@@ -100,9 +100,120 @@ const importChanges = {
   ],
 }
 
+const getChanges = {
+  'x-swagger-router-controller': 'projects',
+  operationId: 'getChanges',
+  tags: ['Project'],
+  description: 'Get changes applied to a project',
+  parameters: [
+    {
+      name: 'project_id',
+      in: 'path',
+      description: 'project id',
+      required: true,
+      type: 'string',
+    },
+    {
+      name: 'since',
+      in: 'query',
+      description: 'start version',
+      required: false,
+      type: 'number',
+    },
+  ],
+  responses: {
+    200: {
+      description: 'Success',
+      schema: {
+        type: 'array',
+        items: {
+          $ref: '#/definitions/Change',
+        },
+      },
+    },
+  },
+  security: [
+    {
+      basic: [],
+    },
+  ],
+}
+
+const flushChanges = {
+  'x-swagger-router-controller': 'project_import',
+  operationId: 'flushChanges',
+  tags: ['ProjectImport'],
+  description: 'Flush project changes from buffer to the chunk store.',
+  parameters: [
+    {
+      name: 'project_id',
+      in: 'path',
+      description: 'project id',
+      required: true,
+      type: 'string',
+    },
+  ],
+  responses: {
+    200: {
+      description: 'Success',
+      schema: {
+        $ref: '#/definitions/Project',
+      },
+    },
+    404: {
+      description: 'Not Found',
+      schema: {
+        $ref: '#/definitions/Error',
+      },
+    },
+  },
+  security: [
+    {
+      basic: [],
+    },
+  ],
+}
+
+const expireProject = {
+  'x-swagger-router-controller': 'project_import',
+  operationId: 'expireProject',
+  tags: ['ProjectImport'],
+  description: 'Expire project changes from buffer.',
+  parameters: [
+    {
+      name: 'project_id',
+      in: 'path',
+      description: 'project id',
+      required: true,
+      type: 'string',
+    },
+  ],
+  responses: {
+    200: {
+      description: 'Success',
+      schema: {
+        $ref: '#/definitions/Project',
+      },
+    },
+    404: {
+      description: 'Not Found',
+      schema: {
+        $ref: '#/definitions/Error',
+      },
+    },
+  },
+  security: [
+    {
+      basic: [],
+    },
+  ],
+}
+
 exports.paths = {
   '/projects/{project_id}/import': { post: importSnapshot },
   '/projects/{project_id}/legacy_import': { post: importSnapshot },
-  '/projects/{project_id}/changes': { post: importChanges },
+  '/projects/{project_id}/changes': { get: getChanges, post: importChanges },
   '/projects/{project_id}/legacy_changes': { post: importChanges },
+  '/projects/{project_id}/flush': { post: flushChanges },
+  '/projects/{project_id}/expire': { post: expireProject },
 }
diff --git a/services/history-v1/app.js b/services/history-v1/app.js
index 261f1001b6..dd991c1a6d 100644
--- a/services/history-v1/app.js
+++ b/services/history-v1/app.js
@@ -100,11 +100,13 @@ function setupErrorHandling() {
       })
     }
     if (err.code === 'ENUM_MISMATCH') {
+      logger.warn({ err, projectId }, err.message)
       return res.status(HTTPStatus.UNPROCESSABLE_ENTITY).json({
         message: 'invalid enum value: ' + err.paramName,
       })
     }
     if (err.code === 'REQUIRED') {
+      logger.warn({ err, projectId }, err.message)
       return res.status(HTTPStatus.UNPROCESSABLE_ENTITY).json({
         message: err.message,
       })
diff --git a/services/history-v1/backup-verifier-app.mjs b/services/history-v1/backup-verifier-app.mjs
index 3949e6a62d..856a15dd53 100644
--- a/services/history-v1/backup-verifier-app.mjs
+++ b/services/history-v1/backup-verifier-app.mjs
@@ -90,15 +90,16 @@ process.on('SIGINT', () => {
 
 /**
  * @param {number} port
+ * @param {boolean} enableVerificationLoop
  * @return {Promise<http.Server>}
  */
-export async function startApp(port) {
+export async function startApp(port, enableVerificationLoop = true) {
   await mongodb.client.connect()
   await loadGlobalBlobs()
   await healthCheck()
   const server = http.createServer(app)
   await promisify(server.listen.bind(server, port))()
-  loopRandomProjects(shutdownEmitter)
+  enableVerificationLoop && loopRandomProjects(shutdownEmitter)
   return server
 }
 
diff --git a/services/history-v1/buildscript.txt b/services/history-v1/buildscript.txt
index f8c895901b..4ce8eb63c7 100644
--- a/services/history-v1/buildscript.txt
+++ b/services/history-v1/buildscript.txt
@@ -4,7 +4,7 @@ history-v1
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
 --tsconfig-extra-includes=backup-deletion-app.mjs,backup-verifier-app.mjs,backup-worker-app.mjs,api/**/*,migrations/**/*,storage/**/*
diff --git a/services/history-v1/config/custom-environment-variables.json b/services/history-v1/config/custom-environment-variables.json
index daf804251c..686ca25407 100644
--- a/services/history-v1/config/custom-environment-variables.json
+++ b/services/history-v1/config/custom-environment-variables.json
@@ -84,11 +84,29 @@
   "maxFileUploadSize": "MAX_FILE_UPLOAD_SIZE",
   "httpsOnly": "HTTPS_ONLY",
   "httpRequestTimeout": "HTTP_REQUEST_TIMEOUT",
+  "historyBufferLevel": "HISTORY_BUFFER_LEVEL",
+  "forcePersistBuffer": "FORCE_PERSIST_BUFFER",
+  "nextHistoryBufferLevel": "NEXT_HISTORY_BUFFER_LEVEL",
+  "nextHistoryBufferLevelRolloutPercentage": "NEXT_HISTORY_BUFFER_LEVEL_ROLLOUT_PERCENTAGE",
   "redis": {
     "queue": {
       "host": "QUEUES_REDIS_HOST",
       "password": "QUEUES_REDIS_PASSWORD",
       "port": "QUEUES_REDIS_PORT"
+    },
+    "history": {
+      "host": "HISTORY_REDIS_HOST",
+      "password": "HISTORY_REDIS_PASSWORD",
+      "port": "HISTORY_REDIS_PORT"
+    },
+    "lock": {
+      "host": "REDIS_HOST",
+      "password": "REDIS_PASSWORD",
+      "port": "REDIS_PORT"
     }
+  },
+  "projectHistory": {
+    "host": "PROJECT_HISTORY_HOST",
+    "port": "PROJECT_HISTORY_PORT"
   }
 }
diff --git a/services/history-v1/config/default.json b/services/history-v1/config/default.json
index 5222b84d87..e7732fe3f7 100644
--- a/services/history-v1/config/default.json
+++ b/services/history-v1/config/default.json
@@ -39,5 +39,8 @@
   "databasePoolMin": "2",
   "databasePoolMax": "10",
   "httpsOnly": "false",
-  "httpRequestTimeout": "300000"
+  "httpRequestTimeout": "300000",
+  "projectHistory": {
+    "port": "3054"
+  }
 }
diff --git a/services/history-v1/docker-compose.ci.yml b/services/history-v1/docker-compose.ci.yml
index 7245ef14e2..cf6ec3357d 100644
--- a/services/history-v1/docker-compose.ci.yml
+++ b/services/history-v1/docker-compose.ci.yml
@@ -21,6 +21,7 @@ services:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
       POSTGRES_HOST: postgres
@@ -38,6 +39,7 @@ services:
       NODE_OPTIONS: "--unhandled-rejections=strict"
     volumes:
       - ./test/acceptance/certs:/certs
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
@@ -54,6 +56,7 @@ services:
       gcs:
         condition: service_healthy
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -65,14 +68,14 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping="$$(redis-cli ping)" && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
@@ -97,7 +100,7 @@ services:
       retries: 20
 
   certs:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - ./test/acceptance/certs:/certs
     working_dir: /certs
diff --git a/services/history-v1/docker-compose.yml b/services/history-v1/docker-compose.yml
index 608dd1d325..3a33882d28 100644
--- a/services/history-v1/docker-compose.yml
+++ b/services/history-v1/docker-compose.yml
@@ -33,10 +33,12 @@ services:
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
       - ./test/acceptance/certs:/certs
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/history-v1
     environment:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
@@ -70,17 +72,18 @@ services:
         condition: service_completed_successfully
       gcs:
         condition: service_healthy
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping=$$(redis-cli ping) && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
@@ -106,7 +109,7 @@ services:
       retries: 20
 
   certs:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - ./test/acceptance/certs:/certs
     working_dir: /certs
diff --git a/services/history-v1/migrations/20250415210802_add_chunks_closed.js b/services/history-v1/migrations/20250415210802_add_chunks_closed.js
new file mode 100644
index 0000000000..b5c1d577f9
--- /dev/null
+++ b/services/history-v1/migrations/20250415210802_add_chunks_closed.js
@@ -0,0 +1,27 @@
+// @ts-check
+
+/**
+ * @import { Knex } from "knex"
+ */
+
+/**
+ * @param { Knex } knex
+ * @returns { Promise<void> }
+ */
+exports.up = async function (knex) {
+  await knex.raw(`
+    ALTER TABLE chunks
+    ADD COLUMN closed BOOLEAN NOT NULL DEFAULT FALSE
+  `)
+}
+
+/**
+ * @param { Knex } knex
+ * @returns { Promise<void> }
+ */
+exports.down = async function (knex) {
+  await knex.raw(`
+    ALTER TABLE chunks
+    DROP COLUMN closed
+  `)
+}
diff --git a/services/history-v1/package.json b/services/history-v1/package.json
index 3219be9af4..4796cafd03 100644
--- a/services/history-v1/package.json
+++ b/services/history-v1/package.json
@@ -7,6 +7,7 @@
   "private": true,
   "dependencies": {
     "@google-cloud/secret-manager": "^5.6.0",
+    "@overleaf/fetch-utils": "*",
     "@overleaf/logger": "*",
     "@overleaf/metrics": "*",
     "@overleaf/mongo-utils": "*",
@@ -24,7 +25,7 @@
     "bunyan": "^1.8.12",
     "check-types": "^11.1.2",
     "command-line-args": "^3.0.3",
-    "config": "^1.19.0",
+    "config": "^3.3.12",
     "express": "^4.21.2",
     "fs-extra": "^9.0.1",
     "generic-pool": "^2.1.1",
@@ -36,6 +37,7 @@
     "mongodb": "6.12.0",
     "overleaf-editor-core": "*",
     "p-limit": "^6.2.0",
+    "p-queue": "^8.1.0",
     "pg": "^8.7.1",
     "pg-query-stream": "^4.2.4",
     "swagger-tools": "^0.10.4",
diff --git a/services/history-v1/storage/index.js b/services/history-v1/storage/index.js
index 238cd12a38..6bc81f60e8 100644
--- a/services/history-v1/storage/index.js
+++ b/services/history-v1/storage/index.js
@@ -2,11 +2,16 @@ exports.BatchBlobStore = require('./lib/batch_blob_store')
 exports.blobHash = require('./lib/blob_hash')
 exports.HashCheckBlobStore = require('./lib/hash_check_blob_store')
 exports.chunkStore = require('./lib/chunk_store')
+exports.redisBuffer = require('./lib/chunk_store/redis')
 exports.historyStore = require('./lib/history_store').historyStore
 exports.knex = require('./lib/knex')
 exports.mongodb = require('./lib/mongodb')
+exports.redis = require('./lib/redis')
 exports.persistChanges = require('./lib/persist_changes')
 exports.persistor = require('./lib/persistor')
+exports.persistBuffer = require('./lib/persist_buffer')
+exports.commitChanges = require('./lib/commit_changes')
+exports.queueChanges = require('./lib/queue_changes')
 exports.ProjectArchive = require('./lib/project_archive')
 exports.streams = require('./lib/streams')
 exports.temp = require('./lib/temp')
@@ -18,3 +23,6 @@ exports.loadGlobalBlobs = loadGlobalBlobs
 
 const { InvalidChangeError } = require('./lib/errors')
 exports.InvalidChangeError = InvalidChangeError
+
+const { ChunkVersionConflictError } = require('./lib/chunk_store/errors')
+exports.ChunkVersionConflictError = ChunkVersionConflictError
diff --git a/services/history-v1/storage/lib/assert.js b/services/history-v1/storage/lib/assert.js
index d0ce318b4d..91f24da7e0 100644
--- a/services/history-v1/storage/lib/assert.js
+++ b/services/history-v1/storage/lib/assert.js
@@ -1,5 +1,7 @@
 'use strict'
 
+const OError = require('@overleaf/o-error')
+
 const check = require('check-types')
 const { Blob } = require('overleaf-editor-core')
 
@@ -7,41 +9,58 @@ const assert = check.assert
 
 const MONGO_ID_REGEXP = /^[0-9a-f]{24}$/
 const POSTGRES_ID_REGEXP = /^[1-9][0-9]{0,9}$/
-const PROJECT_ID_REGEXP = /^([0-9a-f]{24}|[1-9][0-9]{0,9})$/
+const MONGO_OR_POSTGRES_ID_REGEXP = /^([0-9a-f]{24}|[1-9][0-9]{0,9})$/
 
 function transaction(transaction, message) {
   assert.function(transaction, message)
 }
 
 function blobHash(arg, message) {
-  assert.match(arg, Blob.HEX_HASH_RX, message)
+  try {
+    assert.match(arg, Blob.HEX_HASH_RX, message)
+  } catch (error) {
+    throw OError.tag(error, message, { arg })
+  }
+}
+
+/**
+ * A project id is a string that contains either an integer (for projects stored in Postgres) or 24
+ * hex digits (for projects stored in Mongo)
+ */
+function projectId(arg, message) {
+  try {
+    assert.match(arg, MONGO_OR_POSTGRES_ID_REGEXP, message)
+  } catch (error) {
+    throw OError.tag(error, message, { arg })
+  }
 }
 
 /**
  * A chunk id is a string that contains either an integer (for projects stored in Postgres) or 24
  * hex digits (for projects stored in Mongo)
  */
-function projectId(arg, message) {
-  assert.match(arg, PROJECT_ID_REGEXP, message)
-}
-
-/**
- * A chunk id is either a number (for projects stored in Postgres) or a 24
- * character string (for projects stored in Mongo)
- */
 function chunkId(arg, message) {
-  const valid = check.integer(arg) || check.match(arg, MONGO_ID_REGEXP)
-  if (!valid) {
-    throw new TypeError(message)
+  try {
+    assert.match(arg, MONGO_OR_POSTGRES_ID_REGEXP, message)
+  } catch (error) {
+    throw OError.tag(error, message, { arg })
   }
 }
 
 function mongoId(arg, message) {
-  assert.match(arg, MONGO_ID_REGEXP)
+  try {
+    assert.match(arg, MONGO_ID_REGEXP, message)
+  } catch (error) {
+    throw OError.tag(error, message, { arg })
+  }
 }
 
 function postgresId(arg, message) {
-  assert.match(arg, POSTGRES_ID_REGEXP, message)
+  try {
+    assert.match(arg, POSTGRES_ID_REGEXP, message)
+  } catch (error) {
+    throw OError.tag(error, message, { arg })
+  }
 }
 
 module.exports = {
diff --git a/services/history-v1/storage/lib/backupArchiver.mjs b/services/history-v1/storage/lib/backupArchiver.mjs
new file mode 100644
index 0000000000..c6f0e3755d
--- /dev/null
+++ b/services/history-v1/storage/lib/backupArchiver.mjs
@@ -0,0 +1,474 @@
+// @ts-check
+import path from 'node:path'
+import projectKey from './project_key.js'
+import {
+  chunksBucket,
+  backupPersistor,
+  projectBlobsBucket,
+  globalBlobsBucket as backupGlobalBlobsBucket,
+} from './backupPersistor.mjs'
+import core, { Chunk, History } from 'overleaf-editor-core'
+import {
+  GLOBAL_BLOBS,
+  makeProjectKey,
+  getStringLengthOfFile,
+  makeGlobalKey,
+} from './blob_store/index.js'
+import streams from './streams.js'
+import objectPersistor from '@overleaf/object-persistor'
+import OError from '@overleaf/o-error'
+import chunkStore from './chunk_store/index.js'
+import logger from '@overleaf/logger'
+import fs from 'node:fs'
+import { pipeline } from 'node:stream/promises'
+import withTmpDir from '../../api/controllers/with_tmp_dir.js'
+import { loadChunk } from './backupVerifier.mjs'
+import globalBlobPersistor from './persistor.js'
+import config from 'config'
+import { NoKEKMatchedError } from '@overleaf/object-persistor/src/Errors.js'
+
+const globalBlobsBucket = config.get('blobStore.globalBucket')
+
+class BackupBlobStore {
+  /**
+   *
+   * @param {string} historyId
+   * @param {string} tmp
+   * @param {CachedPerProjectEncryptedS3Persistor} persistor
+   * @param {boolean} useBackupGlobalBlobs
+   */
+  constructor(historyId, tmp, persistor, useBackupGlobalBlobs) {
+    this.historyId = historyId
+    this.tmp = tmp
+    this.blobs = new Map()
+    this.persistor = persistor
+    this.useBackupGlobalBlobs = useBackupGlobalBlobs
+  }
+
+  /**
+   * Required for BlobStore interface - not supported.
+   *
+   * @template T
+   * @param {string} hash
+   * @return {Promise<T>}
+   */
+  async getObject(hash) {
+    try {
+      const stream = await this.getStream(hash)
+      const buffer = await streams.readStreamToBuffer(stream)
+      return JSON.parse(buffer.toString())
+    } catch (err) {
+      logger.warn({ err, hash }, 'Failed to fetch chunk blob')
+      throw err
+    }
+  }
+
+  /**
+   *
+   * @param {Set<string>} hashes
+   * @return {Promise<void>}
+   */
+  async fetchBlobs(hashes) {
+    for await (const hash of hashes) {
+      if (this.blobs.has(hash)) return
+      const path = `${this.tmp}/${hash}`
+      /** @type {core.Blob} */
+      let blob
+      /** @type {NodeJS.ReadableStream} */
+      let blobStream
+      if (GLOBAL_BLOBS.has(hash)) {
+        try {
+          const blobData = await this.fetchGlobalBlob(hash)
+          await pipeline(blobData.stream, fs.createWriteStream(path))
+          blob = blobData.blob
+        } catch (err) {
+          logger.warn({ hash, err }, 'Failed to fetch global blob')
+          continue
+        }
+      } else {
+        try {
+          blobStream = await fetchBlob(this.historyId, hash, this.persistor)
+          await pipeline(blobStream, fs.createWriteStream(path))
+          blob = await this.makeBlob(hash, path)
+        } catch (err) {
+          logger.warn({ err, hash }, 'Failed to fetch chunk blob')
+          continue
+        }
+      }
+
+      this.blobs.set(hash, blob)
+    }
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @return {Promise<{ blob: core.Blob, stream: NodeJS.ReadableStream }>}
+   */
+  async fetchGlobalBlob(hash) {
+    const globalBlob = GLOBAL_BLOBS.get(hash)
+    if (!globalBlob) {
+      throw new Error('blob does not exist or is not a global blob')
+    }
+    let stream
+
+    const key = makeGlobalKey(hash)
+
+    if (this.useBackupGlobalBlobs) {
+      stream = await this.persistor.getObjectStream(
+        backupGlobalBlobsBucket,
+        key
+      )
+    } else {
+      stream = await globalBlobPersistor.getObjectStream(globalBlobsBucket, key)
+    }
+    return { blob: globalBlob.blob, stream }
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @param {string} pathname
+   * @return {Promise<core.Blob>}
+   */
+  async makeBlob(hash, pathname) {
+    const stat = await fs.promises.stat(pathname)
+    const byteLength = stat.size
+    const stringLength = await getStringLengthOfFile(byteLength, pathname)
+    if (stringLength) {
+      return new core.Blob(hash, byteLength, stringLength)
+    }
+    return new core.Blob(hash, byteLength)
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @return {Promise<string>}
+   */
+  async getString(hash) {
+    const stream = await this.getStream(hash)
+    const buffer = await streams.readStreamToBuffer(stream)
+    return buffer.toString()
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @return {Promise<fs.ReadStream>}
+   */
+  async getStream(hash) {
+    return fs.createReadStream(this.getBlobPathname(hash))
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @return {Promise<core.Blob>}
+   */
+  async getBlob(hash) {
+    return this.blobs.get(hash)
+  }
+
+  /**
+   *
+   * @param {string} hash
+   * @return {string}
+   */
+  getBlobPathname(hash) {
+    return path.join(this.tmp, hash)
+  }
+}
+
+/**
+ * @typedef {(import('@overleaf/object-persistor/src/PerProjectEncryptedS3Persistor.js').CachedPerProjectEncryptedS3Persistor)} CachedPerProjectEncryptedS3Persistor
+ */
+
+/**
+ * @typedef {(import('archiver').Archiver)} Archiver
+ */
+
+/**
+ * @typedef {(import('overleaf-editor-core').FileMap)} FileMap
+ */
+
+/**
+ *
+ * @param historyId
+ * @return {Promise<CachedPerProjectEncryptedS3Persistor>}
+ */
+async function getProjectPersistor(historyId) {
+  try {
+    return await backupPersistor.forProjectRO(
+      projectBlobsBucket,
+      makeProjectKey(historyId, '')
+    )
+  } catch (error) {
+    if (error instanceof NoKEKMatchedError) {
+      logger.info({}, 'no kek matched')
+    }
+    throw new BackupPersistorError(
+      'Failed to get project persistor',
+      { historyId },
+      error instanceof Error ? error : undefined
+    )
+  }
+}
+
+/**
+ *
+ * @param persistor
+ * @param {string} key
+ * @return {Promise<{chunkData: any, buffer: Buffer}>}
+ */
+async function loadChunkByKey(persistor, key) {
+  try {
+    const buf = await streams.gunzipStreamToBuffer(
+      await persistor.getObjectStream(chunksBucket, key)
+    )
+    return { chunkData: JSON.parse(buf.toString('utf-8')), buffer: buf }
+  } catch (err) {
+    if (err instanceof objectPersistor.Errors.NotFoundError) {
+      throw new Chunk.NotPersistedError('chunk not found')
+    }
+    if (err instanceof Error) {
+      throw OError.tag(err, 'Failed to load chunk', { key })
+    }
+    throw err
+  }
+}
+
+/**
+ *
+ * @param {string} historyId
+ * @param {string} hash
+ * @param {CachedPerProjectEncryptedS3Persistor} persistor
+ * @return {Promise<NodeJS.ReadableStream>}
+ */
+async function fetchBlob(historyId, hash, persistor) {
+  const path = makeProjectKey(historyId, hash)
+  return await persistor.getObjectStream(projectBlobsBucket, path, {
+    autoGunzip: true,
+  })
+}
+
+/**
+ * @typedef {object} AddChunkOptions
+ * @property {string} [prefix] Should include trailing slash (if length > 0)
+ * @property {boolean} [useBackupGlobalBlobs]
+ */
+
+/**
+ *
+ * @param {History} history
+ * @param {Archiver} archive
+ * @param {CachedPerProjectEncryptedS3Persistor} projectCache
+ * @param {string} historyId
+ * @param {AddChunkOptions} [options]
+ * @returns {Promise<void>}
+ */
+async function addChunkToArchive(
+  history,
+  archive,
+  projectCache,
+  historyId,
+  { prefix = '', useBackupGlobalBlobs = false } = {}
+) {
+  const chunkBlobs = new Set()
+  history.findBlobHashes(chunkBlobs)
+
+  await withTmpDir('recovery-blob-', async tmpDir => {
+    const blobStore = new BackupBlobStore(
+      historyId,
+      tmpDir,
+      projectCache,
+      useBackupGlobalBlobs
+    )
+    await blobStore.fetchBlobs(chunkBlobs)
+
+    await history.loadFiles('lazy', blobStore)
+
+    const snapshot = history.getSnapshot()
+    snapshot.applyAll(history.getChanges())
+
+    const filePaths = snapshot.getFilePathnames()
+
+    if (filePaths.length === 0) {
+      logger.warn(
+        { historyId, projectVersion: snapshot.projectVersion },
+        'No files found in snapshot backup'
+      )
+    }
+    for (const filePath of filePaths) {
+      /** @type {core.File | null | undefined} */
+      const file = snapshot.getFile(filePath)
+      if (!file) {
+        logger.error({ filePath }, 'File not found in snapshot')
+        continue
+      }
+
+      try {
+        await file.load('eager', blobStore)
+      } catch (err) {
+        logger.error(
+          { filePath, err },
+          'Failed to load file from snapshot, skipping'
+        )
+        continue
+      }
+
+      const hash = file.getHash()
+
+      /** @type {string | fs.ReadStream | null | undefined} */
+      let content = file.getContent({ filterTrackedDeletes: true })
+
+      if (content === null) {
+        if (!hash) {
+          logger.error({ filePath }, 'File does not have a hash')
+          continue
+        }
+        const blob = await blobStore.getBlob(hash)
+        if (!blob) {
+          logger.error({ filePath }, 'Blob not found in blob store')
+          continue
+        }
+        content = await blobStore.getStream(hash)
+      }
+      archive.append(content, {
+        name: `${prefix}${filePath}`,
+      })
+    }
+  })
+}
+
+/**
+ *
+ * @param {string} historyId
+ * @return {Promise<number>}
+ */
+async function findStartVersionOfLatestChunk(historyId) {
+  const backend = chunkStore.getBackend(historyId)
+  const chunk = await backend.getLatestChunk(historyId, { readOnly: true })
+  if (!chunk) {
+    throw new Error('Latest chunk could not be loaded')
+  }
+  return chunk.startVersion
+}
+
+/**
+ * Restore a project from the latest snapshot
+ *
+ * There is an assumption that the database backup has been restored.
+ *
+ * @param {Archiver} archive
+ * @param {string} historyId
+ * @param {boolean} [useBackupGlobalBlobs]
+ * @return {Promise<void>}
+ */
+export async function archiveLatestChunk(
+  archive,
+  historyId,
+  useBackupGlobalBlobs = false
+) {
+  logger.info({ historyId, useBackupGlobalBlobs }, 'Archiving latest chunk')
+
+  const projectCache = await getProjectPersistor(historyId)
+
+  const startVersion = await findStartVersionOfLatestChunk(historyId)
+
+  const backedUpChunkRaw = await loadChunk(
+    historyId,
+    startVersion,
+    projectCache
+  )
+
+  const backedUpChunk = History.fromRaw(backedUpChunkRaw)
+
+  await addChunkToArchive(backedUpChunk, archive, projectCache, historyId, {
+    useBackupGlobalBlobs,
+  })
+
+  return archive
+}
+
+/**
+ * Fetches all raw blobs from the project and adds them to the archive.
+ *
+ * @param {string} historyId
+ * @param {Archiver} archive
+ * @param {CachedPerProjectEncryptedS3Persistor} projectCache
+ * @return {Promise<void>}
+ */
+async function addRawBlobsToArchive(historyId, archive, projectCache) {
+  const key = projectKey.format(historyId)
+  const { contents } = await projectCache.listDirectory(projectBlobsBucket, key)
+  for (const blobRecord of contents) {
+    if (!blobRecord.Key) {
+      logger.debug({ blobRecord }, 'no key')
+      continue
+    }
+    const blobKey = blobRecord.Key
+    try {
+      const stream = await projectCache.getObjectStream(
+        projectBlobsBucket,
+        blobKey,
+        { autoGunzip: true }
+      )
+      archive.append(stream, {
+        name: path.join(historyId, 'blobs', blobKey),
+      })
+    } catch (err) {
+      logger.warn(
+        { err, path: blobRecord.Key },
+        'Failed to append blob to archive'
+      )
+    }
+  }
+}
+
+/**
+ * Download raw files from the backup.
+ *
+ * This can work without the database being backed up.
+ *
+ * It will split the project into chunks per directory and download the blobs alongside the chunk.
+ *
+ * @param {Archiver} archive
+ * @param {string} historyId
+ * @param {boolean} [useBackupGlobalBlobs]
+ * @return {Promise<void>}
+ */
+export async function archiveRawProject(
+  archive,
+  historyId,
+  useBackupGlobalBlobs = false
+) {
+  const projectCache = await getProjectPersistor(historyId)
+
+  const { contents: chunks } = await projectCache.listDirectory(
+    chunksBucket,
+    projectKey.format(historyId)
+  )
+
+  if (chunks.length === 0) {
+    throw new Error('No chunks found')
+  }
+
+  for (const chunkRecord of chunks) {
+    if (!chunkRecord.Key) {
+      logger.debug({ chunkRecord }, 'no key')
+      continue
+    }
+    const chunkId = chunkRecord.Key.split('/').pop()
+    logger.debug({ chunkId, key: chunkRecord.Key }, 'Processing chunk')
+
+    const { buffer } = await loadChunkByKey(projectCache, chunkRecord.Key)
+
+    archive.append(buffer, {
+      name: `${historyId}/chunks/${chunkId}/chunk.json`,
+    })
+  }
+  await addRawBlobsToArchive(historyId, archive, projectCache)
+}
+
+export class BackupPersistorError extends OError {}
diff --git a/services/history-v1/storage/lib/backupGenerator.mjs b/services/history-v1/storage/lib/backupGenerator.mjs
index f6b1b01a31..d8f1b0e99a 100644
--- a/services/history-v1/storage/lib/backupGenerator.mjs
+++ b/services/history-v1/storage/lib/backupGenerator.mjs
@@ -2,11 +2,7 @@
  * Provides a generator function to back up project chunks and blobs.
  */
 
-import {
-  getProjectChunksFromVersion,
-  loadAtVersion,
-  loadByChunkRecord,
-} from './chunk_store/index.js'
+import chunkStore from './chunk_store/index.js'
 
 import {
   GLOBAL_BLOBS, // NOTE:  must call loadGlobalBlobs() before using this
@@ -33,7 +29,11 @@ async function lookBehindForSeenBlobs(
   ) {
     // the snapshot in this chunk has not been backed up
     // so we find the set of backed up blobs from the previous chunk
-    const previousChunk = await loadAtVersion(projectId, lastBackedUpVersion)
+    const previousChunk = await chunkStore.loadAtVersion(
+      projectId,
+      lastBackedUpVersion,
+      { persistedOnly: true }
+    )
     const previousChunkHistory = previousChunk.getHistory()
     previousChunkHistory.findBlobHashes(seenBlobs)
   }
@@ -115,13 +115,13 @@ export async function* backupGenerator(projectId, lastBackedUpVersion) {
     lastBackedUpVersion >= 0 ? lastBackedUpVersion + 1 : 0
   let isStartingChunk = true
   let currentBackedUpVersion = lastBackedUpVersion
-  const chunkRecordIterator = getProjectChunksFromVersion(
+  const chunkRecordIterator = chunkStore.getProjectChunksFromVersion(
     projectId,
     firstPendingVersion
   )
 
   for await (const chunkRecord of chunkRecordIterator) {
-    const { chunk, chunkBuffer } = await loadByChunkRecord(
+    const { chunk, chunkBuffer } = await chunkStore.loadByChunkRecord(
       projectId,
       chunkRecord
     )
diff --git a/services/history-v1/storage/lib/backupVerifier.mjs b/services/history-v1/storage/lib/backupVerifier.mjs
index 14b84cd320..6e767b21ba 100644
--- a/services/history-v1/storage/lib/backupVerifier.mjs
+++ b/services/history-v1/storage/lib/backupVerifier.mjs
@@ -115,7 +115,11 @@ export async function verifyProjectWithErrorContext(
  * @param {CachedPerProjectEncryptedS3Persistor} backupPersistorForProject
  * @return {Promise<any>}
  */
-async function loadChunk(historyId, startVersion, backupPersistorForProject) {
+export async function loadChunk(
+  historyId,
+  startVersion,
+  backupPersistorForProject
+) {
   const key = path.join(
     projectKey.format(historyId),
     projectKey.pad(startVersion)
diff --git a/services/history-v1/storage/lib/backup_store/index.js b/services/history-v1/storage/lib/backup_store/index.js
index 1253afea06..da7944786a 100644
--- a/services/history-v1/storage/lib/backup_store/index.js
+++ b/services/history-v1/storage/lib/backup_store/index.js
@@ -27,6 +27,29 @@ function listPendingBackups(timeIntervalMs = 0, limit = null) {
   return cursor
 }
 
+// List projects that have never been backed up and are older than the specified interval
+function listUninitializedBackups(timeIntervalMs = 0, limit = null) {
+  const cutoffTimeInSeconds = (Date.now() - timeIntervalMs) / 1000
+  const options = {
+    projection: { _id: 1 },
+    sort: { _id: 1 },
+  }
+  // Apply limit if provided
+  if (limit) {
+    options.limit = limit
+  }
+  const cursor = projects.find(
+    {
+      'overleaf.backup.lastBackedUpVersion': null,
+      _id: {
+        $lt: ObjectId.createFromTime(cutoffTimeInSeconds),
+      },
+    },
+    options
+  )
+  return cursor
+}
+
 // Retrieve the history ID for a given project without giving direct access to the
 // projects collection.
 
@@ -183,6 +206,7 @@ module.exports = {
   updateCurrentMetadataIfNotSet,
   updatePendingChangeTimestamp,
   listPendingBackups,
+  listUninitializedBackups,
   getBackedUpBlobHashes,
   unsetBackedUpBlobHashes,
 }
diff --git a/services/history-v1/storage/lib/blob_hash.js b/services/history-v1/storage/lib/blob_hash.js
index 6309637d08..10ac64b87b 100644
--- a/services/history-v1/storage/lib/blob_hash.js
+++ b/services/history-v1/storage/lib/blob_hash.js
@@ -63,7 +63,7 @@ exports.fromString = function blobHashFromString(string) {
  * Compute the git blob hash for the content of a file
  *
  * @param  {string} filePath
- * @return {string} hexadecimal SHA-1 hash
+ * @return {Promise<string>} hexadecimal SHA-1 hash
  */
 exports.fromFile = function blobHashFromFile(pathname) {
   assert.string(pathname, 'blobHash: bad pathname')
diff --git a/services/history-v1/storage/lib/blob_store/index.js b/services/history-v1/storage/lib/blob_store/index.js
index b4a7d1682f..033e288554 100644
--- a/services/history-v1/storage/lib/blob_store/index.js
+++ b/services/history-v1/storage/lib/blob_store/index.js
@@ -24,6 +24,7 @@ const logger = require('@overleaf/logger')
 
 /** @import { Readable } from 'stream' */
 
+/** @type {Map<string, { blob: core.Blob, demoted: boolean}>} */
 const GLOBAL_BLOBS = new Map()
 
 function makeGlobalKey(hash) {
@@ -343,6 +344,11 @@ class BlobStore {
     return blob
   }
 
+  /**
+   *
+   * @param {Array<string>} hashes
+   * @return {Promise<*[]>}
+   */
   async getBlobs(hashes) {
     assert.array(hashes, 'bad hashes')
     const nonGlobalHashes = []
@@ -427,6 +433,7 @@ module.exports = {
   getProjectBlobsBatch,
   loadGlobalBlobs,
   makeProjectKey,
+  makeGlobalKey,
   makeBlobForFile,
   getStringLengthOfFile,
   GLOBAL_BLOBS,
diff --git a/services/history-v1/storage/lib/blob_store/postgres.js b/services/history-v1/storage/lib/blob_store/postgres.js
index 7f66d2d24d..1cedeec5d7 100644
--- a/services/history-v1/storage/lib/blob_store/postgres.js
+++ b/services/history-v1/storage/lib/blob_store/postgres.js
@@ -13,7 +13,7 @@ async function initialize(projectId) {
  * Return blob metadata for the given project and hash
  */
 async function findBlob(projectId, hash) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
+  assert.postgresId(projectId, 'bad projectId')
   projectId = parseInt(projectId, 10)
   assert.blobHash(hash, 'bad hash')
 
@@ -35,7 +35,7 @@ async function findBlob(projectId, hash) {
  * @return {Promise.<Array.<Blob?>>} no guarantee on order
  */
 async function findBlobs(projectId, hashes) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
+  assert.postgresId(projectId, 'bad projectId')
   projectId = parseInt(projectId, 10)
   assert.array(hashes, 'bad hashes: not array')
   hashes.forEach(function (hash) {
@@ -57,7 +57,7 @@ async function findBlobs(projectId, hashes) {
  * Return metadata for all blobs in the given project
  */
 async function getProjectBlobs(projectId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
+  assert.postgresId(projectId, 'bad projectId')
   projectId = parseInt(projectId, 10)
 
   const records = await knex('project_blobs')
@@ -103,7 +103,7 @@ async function getProjectBlobsBatch(projectIds) {
  * Add a blob's metadata to the blobs table after it has been uploaded.
  */
 async function insertBlob(projectId, blob) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
+  assert.postgresId(projectId, 'bad projectId')
   projectId = parseInt(projectId, 10)
 
   await knex('project_blobs')
@@ -116,7 +116,7 @@ async function insertBlob(projectId, blob) {
  * Deletes all blobs for a given project
  */
 async function deleteBlobs(projectId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
+  assert.postgresId(projectId, 'bad projectId')
   projectId = parseInt(projectId, 10)
 
   await knex('project_blobs').where('project_id', projectId).delete()
diff --git a/services/history-v1/storage/lib/chunk_store/errors.js b/services/history-v1/storage/lib/chunk_store/errors.js
index 5f0eba6aac..75b830f9a0 100644
--- a/services/history-v1/storage/lib/chunk_store/errors.js
+++ b/services/history-v1/storage/lib/chunk_store/errors.js
@@ -1,7 +1,15 @@
 const OError = require('@overleaf/o-error')
 
 class ChunkVersionConflictError extends OError {}
+class BaseVersionConflictError extends OError {}
+class JobNotFoundError extends OError {}
+class JobNotReadyError extends OError {}
+class VersionOutOfBoundsError extends OError {}
 
 module.exports = {
   ChunkVersionConflictError,
+  BaseVersionConflictError,
+  JobNotFoundError,
+  JobNotReadyError,
+  VersionOutOfBoundsError,
 }
diff --git a/services/history-v1/storage/lib/chunk_store/index.js b/services/history-v1/storage/lib/chunk_store/index.js
index c1fbb9d607..f387b68d90 100644
--- a/services/history-v1/storage/lib/chunk_store/index.js
+++ b/services/history-v1/storage/lib/chunk_store/index.js
@@ -1,3 +1,5 @@
+// @ts-check
+
 'use strict'
 
 /**
@@ -30,7 +32,15 @@ const { BlobStore } = require('../blob_store')
 const { historyStore } = require('../history_store')
 const mongoBackend = require('./mongo')
 const postgresBackend = require('./postgres')
-const { ChunkVersionConflictError } = require('./errors')
+const redisBackend = require('./redis')
+const {
+  ChunkVersionConflictError,
+  VersionOutOfBoundsError,
+} = require('./errors')
+
+/**
+ * @import { Change } from 'overleaf-editor-core'
+ */
 
 const DEFAULT_DELETE_BATCH_SIZE = parseInt(config.get('maxDeleteKeys'), 10)
 const DEFAULT_DELETE_TIMEOUT_SECS = 3000 // 50 minutes
@@ -86,56 +96,115 @@ async function lazyLoadHistoryFiles(history, batchBlobStore) {
  * @param {boolean} [opts.readOnly]
  * @return {Promise<{id: string, startVersion: number, endVersion: number, endTimestamp: Date}>}
  */
-async function loadLatestRaw(projectId, opts) {
+async function getLatestChunkMetadata(projectId, opts) {
   assert.projectId(projectId, 'bad projectId')
 
   const backend = getBackend(projectId)
-  const chunkRecord = await backend.getLatestChunk(projectId, opts)
-  if (chunkRecord == null) {
+  const chunkMetadata = await backend.getLatestChunk(projectId, opts)
+  if (chunkMetadata == null) {
     throw new Chunk.NotFoundError(projectId)
   }
-  return chunkRecord
+  return chunkMetadata
 }
 
 /**
  * Load the latest Chunk stored for a project, including blob metadata.
  *
  * @param {string} projectId
- * @return {Promise.<Chunk>}
+ * @param {object} [opts]
+ * @param {boolean} [opts.persistedOnly] - only include persisted changes
+ * @return {Promise<Chunk>}
  */
-async function loadLatest(projectId) {
-  const chunkRecord = await loadLatestRaw(projectId)
-  const rawHistory = await historyStore.loadRaw(projectId, chunkRecord.id)
+async function loadLatest(projectId, opts = {}) {
+  const chunkMetadata = await getLatestChunkMetadata(projectId)
+  const rawHistory = await historyStore.loadRaw(projectId, chunkMetadata.id)
   const history = History.fromRaw(rawHistory)
+
+  if (!opts.persistedOnly) {
+    const nonPersistedChanges = await getChunkExtension(
+      projectId,
+      chunkMetadata.endVersion
+    )
+    history.pushChanges(nonPersistedChanges)
+  }
+
   const blobStore = new BlobStore(projectId)
   const batchBlobStore = new BatchBlobStore(blobStore)
   await lazyLoadHistoryFiles(history, batchBlobStore)
-  return new Chunk(history, chunkRecord.startVersion)
+  return new Chunk(history, chunkMetadata.startVersion)
 }
 
 /**
  * Load the the chunk that contains the given version, including blob metadata.
+ *
+ * @param {string} projectId
+ * @param {number} version
+ * @param {object} [opts]
+ * @param {boolean} [opts.persistedOnly] - only include persisted changes
+ * @param {boolean} [opts.preferNewer] - If the version is at the boundary of
+ *        two chunks, return the newer chunk.
  */
-async function loadAtVersion(projectId, version) {
+async function loadAtVersion(projectId, version, opts = {}) {
   assert.projectId(projectId, 'bad projectId')
   assert.integer(version, 'bad version')
 
   const backend = getBackend(projectId)
   const blobStore = new BlobStore(projectId)
   const batchBlobStore = new BatchBlobStore(blobStore)
+  const latestChunkMetadata = await getLatestChunkMetadata(projectId)
 
-  const chunkRecord = await backend.getChunkForVersion(projectId, version)
+  // When loading a chunk for a version there are three cases to consider:
+  // 1. If `persistedOnly` is true, we always use the requested version
+  //  to fetch the chunk.
+  // 2. If `persistedOnly` is false and the requested version is in the
+  //  persisted chunk version range, we use the requested version.
+  // 3. If `persistedOnly` is false and the requested version is ahead of
+  //  the persisted chunk versions, we fetch the latest chunk and see if
+  //  the non-persisted changes include the requested version.
+  const targetChunkVersion = opts.persistedOnly
+    ? version
+    : Math.min(latestChunkMetadata.endVersion, version)
+
+  const chunkRecord = await backend.getChunkForVersion(
+    projectId,
+    targetChunkVersion,
+    {
+      preferNewer: opts.preferNewer,
+    }
+  )
   const rawHistory = await historyStore.loadRaw(projectId, chunkRecord.id)
   const history = History.fromRaw(rawHistory)
+  const startVersion = chunkRecord.endVersion - history.countChanges()
+
+  if (!opts.persistedOnly) {
+    // Try to extend the chunk with any non-persisted changes that
+    // follow the chunk's end version.
+    const nonPersistedChanges = await getChunkExtension(
+      projectId,
+      chunkRecord.endVersion
+    )
+    history.pushChanges(nonPersistedChanges)
+
+    // Check that the changes do actually contain the requested version
+    if (version > chunkRecord.endVersion + nonPersistedChanges.length) {
+      throw new Chunk.VersionNotFoundError(projectId, version)
+    }
+  }
+
   await lazyLoadHistoryFiles(history, batchBlobStore)
-  return new Chunk(history, chunkRecord.endVersion - history.countChanges())
+  return new Chunk(history, startVersion)
 }
 
 /**
  * Load the chunk that contains the version that was current at the given
  * timestamp, including blob metadata.
+ *
+ * @param {string} projectId
+ * @param {Date} timestamp
+ * @param {object} [opts]
+ * @param {boolean} [opts.persistedOnly] - only include persisted changes
  */
-async function loadAtTimestamp(projectId, timestamp) {
+async function loadAtTimestamp(projectId, timestamp, opts = {}) {
   assert.projectId(projectId, 'bad projectId')
   assert.date(timestamp, 'bad timestamp')
 
@@ -146,8 +215,18 @@ async function loadAtTimestamp(projectId, timestamp) {
   const chunkRecord = await backend.getChunkForTimestamp(projectId, timestamp)
   const rawHistory = await historyStore.loadRaw(projectId, chunkRecord.id)
   const history = History.fromRaw(rawHistory)
+  const startVersion = chunkRecord.endVersion - history.countChanges()
+
+  if (!opts.persistedOnly) {
+    const nonPersistedChanges = await getChunkExtension(
+      projectId,
+      chunkRecord.endVersion
+    )
+    history.pushChanges(nonPersistedChanges)
+  }
+
   await lazyLoadHistoryFiles(history, batchBlobStore)
-  return new Chunk(history, chunkRecord.endVersion - history.countChanges())
+  return new Chunk(history, startVersion)
 }
 
 /**
@@ -156,7 +235,6 @@ async function loadAtTimestamp(projectId, timestamp) {
  * @param {string} projectId
  * @param {Chunk} chunk
  * @param {Date} [earliestChangeTimestamp]
- * @return {Promise.<number>} for the chunkId of the inserted chunk
  */
 async function create(projectId, chunk, earliestChangeTimestamp) {
   assert.projectId(projectId, 'bad projectId')
@@ -164,13 +242,31 @@ async function create(projectId, chunk, earliestChangeTimestamp) {
   assert.maybe.date(earliestChangeTimestamp, 'bad timestamp')
 
   const backend = getBackend(projectId)
+  const chunkStart = chunk.getStartVersion()
+
+  const opts = {}
+  if (chunkStart > 0) {
+    const oldChunk = await backend.getChunkForVersion(projectId, chunkStart)
+
+    if (oldChunk.endVersion !== chunkStart) {
+      throw new ChunkVersionConflictError(
+        'unexpected end version on chunk to be updated',
+        {
+          projectId,
+          expectedVersion: chunkStart,
+          actualVersion: oldChunk.endVersion,
+        }
+      )
+    }
+
+    opts.oldChunkId = oldChunk.id
+  }
+  if (earliestChangeTimestamp != null) {
+    opts.earliestChangeTimestamp = earliestChangeTimestamp
+  }
+
   const chunkId = await uploadChunk(projectId, chunk)
-  await backend.confirmCreate(
-    projectId,
-    chunk,
-    chunkId,
-    earliestChangeTimestamp
-  )
+  await backend.confirmCreate(projectId, chunk, chunkId, opts)
 }
 
 /**
@@ -200,32 +296,57 @@ async function uploadChunk(projectId, chunk) {
  * chunk.
  *
  * @param {string} projectId
- * @param {number} oldEndVersion
  * @param {Chunk} newChunk
  * @param {Date} [earliestChangeTimestamp]
  * @return {Promise}
  */
-async function update(
-  projectId,
-  oldEndVersion,
-  newChunk,
-  earliestChangeTimestamp
-) {
+async function update(projectId, newChunk, earliestChangeTimestamp) {
   assert.projectId(projectId, 'bad projectId')
-  assert.integer(oldEndVersion, 'bad oldEndVersion')
   assert.instance(newChunk, Chunk, 'bad newChunk')
   assert.maybe.date(earliestChangeTimestamp, 'bad timestamp')
 
   const backend = getBackend(projectId)
-  const oldChunkId = await getChunkIdForVersion(projectId, oldEndVersion)
+  const oldChunk = await backend.getChunkForVersion(
+    projectId,
+    newChunk.getStartVersion(),
+    { preferNewer: true }
+  )
+
+  if (oldChunk.startVersion !== newChunk.getStartVersion()) {
+    throw new ChunkVersionConflictError(
+      'unexpected start version on chunk to be updated',
+      {
+        projectId,
+        expectedVersion: newChunk.getStartVersion(),
+        actualVersion: oldChunk.startVersion,
+      }
+    )
+  }
+
+  if (oldChunk.endVersion > newChunk.getEndVersion()) {
+    throw new ChunkVersionConflictError(
+      'chunk update would decrease chunk version',
+      {
+        projectId,
+        currentVersion: oldChunk.endVersion,
+        newVersion: newChunk.getEndVersion(),
+      }
+    )
+  }
+
   const newChunkId = await uploadChunk(projectId, newChunk)
 
+  const opts = {}
+  if (earliestChangeTimestamp != null) {
+    opts.earliestChangeTimestamp = earliestChangeTimestamp
+  }
+
   await backend.confirmUpdate(
     projectId,
-    oldChunkId,
+    oldChunk.id,
     newChunk,
     newChunkId,
-    earliestChangeTimestamp
+    opts
   )
 }
 
@@ -234,7 +355,7 @@ async function update(
  *
  * @param {string} projectId
  * @param {number} version
- * @return {Promise.<number>}
+ * @return {Promise.<string>}
  */
 async function getChunkIdForVersion(projectId, version) {
   const backend = getBackend(projectId)
@@ -302,7 +423,7 @@ async function loadByChunkRecord(projectId, chunkRecord) {
  */
 async function* getProjectChunksFromVersion(projectId, version) {
   const backend = getBackend(projectId)
-  const latestChunkMetadata = await loadLatestRaw(projectId)
+  const latestChunkMetadata = await getLatestChunkMetadata(projectId)
   if (!latestChunkMetadata || version > latestChunkMetadata.endVersion) {
     return
   }
@@ -343,10 +464,14 @@ async function deleteProjectChunks(projectId) {
  * Delete a given number of old chunks from both the database
  * and from object storage.
  *
- * @param {number} count - number of chunks to delete
- * @param {number} minAgeSecs - how many seconds ago must chunks have been
- *                              deleted
- * @return {Promise}
+ * @param {object} options
+ * @param {number} [options.batchSize] - number of chunks to delete in each
+ *                                       batch
+ * @param {number} [options.maxBatches] - maximum number of batches to process
+ * @param {number} [options.minAgeSecs] - minimum age of chunks to delete
+ * @param {number} [options.timeout] - maximum time to spend deleting chunks
+ *
+ * @return {Promise<number>} number of chunks deleted
  */
 async function deleteOldChunks(options = {}) {
   const batchSize = options.batchSize ?? DEFAULT_DELETE_BATCH_SIZE
@@ -409,6 +534,31 @@ function getBackend(projectId) {
   }
 }
 
+/**
+ * Gets non-persisted changes that could extend a chunk
+ *
+ * @param {string} projectId
+ * @param {number} chunkEndVersion - end version of the chunk to extend
+ *
+ * @return {Promise<Change[]>}
+ */
+async function getChunkExtension(projectId, chunkEndVersion) {
+  try {
+    const changes = await redisBackend.getNonPersistedChanges(
+      projectId,
+      chunkEndVersion
+    )
+    return changes
+  } catch (err) {
+    if (err instanceof VersionOutOfBoundsError) {
+      // If we can't extend the chunk, simply return an empty list
+      return []
+    } else {
+      throw err
+    }
+  }
+}
+
 class AlreadyInitialized extends OError {
   constructor(projectId) {
     super('Project is already initialized', { projectId })
@@ -419,7 +569,7 @@ module.exports = {
   getBackend,
   initializeProject,
   loadLatest,
-  loadLatestRaw,
+  getLatestChunkMetadata,
   loadAtVersion,
   loadAtTimestamp,
   loadByChunkRecord,
diff --git a/services/history-v1/storage/lib/chunk_store/mongo.js b/services/history-v1/storage/lib/chunk_store/mongo.js
index bb93679fec..49020c6be4 100644
--- a/services/history-v1/storage/lib/chunk_store/mongo.js
+++ b/services/history-v1/storage/lib/chunk_store/mongo.js
@@ -1,12 +1,19 @@
-const { ObjectId, ReadPreference } = require('mongodb')
+// @ts-check
+
+const { ObjectId, ReadPreference, MongoError } = require('mongodb')
 const { Chunk } = require('overleaf-editor-core')
 const OError = require('@overleaf/o-error')
+const config = require('config')
 const assert = require('../assert')
 const mongodb = require('../mongodb')
 const { ChunkVersionConflictError } = require('./errors')
 
 const DUPLICATE_KEY_ERROR_CODE = 11000
 
+/**
+ * @import { ClientSession } from 'mongodb'
+ */
+
 /**
  * Get the latest chunk's metadata from the database
  * @param {string} projectId
@@ -18,7 +25,10 @@ async function getLatestChunk(projectId, opts = {}) {
   const { readOnly = false } = opts
 
   const record = await mongodb.chunks.findOne(
-    { projectId: new ObjectId(projectId), state: 'active' },
+    {
+      projectId: new ObjectId(projectId),
+      state: { $in: ['active', 'closed'] },
+    },
     {
       sort: { startVersion: -1 },
       readPreference: readOnly
@@ -34,19 +44,25 @@ async function getLatestChunk(projectId, opts = {}) {
 
 /**
  * Get the metadata for the chunk that contains the given version.
+ *
+ * @param {string} projectId
+ * @param {number} version
+ * @param {object} [opts]
+ * @param {boolean} [opts.preferNewer] - If the version is at the boundary of
+ *        two chunks, return the newer chunk.
  */
-async function getChunkForVersion(projectId, version) {
+async function getChunkForVersion(projectId, version, opts = {}) {
   assert.mongoId(projectId, 'bad projectId')
   assert.integer(version, 'bad version')
 
   const record = await mongodb.chunks.findOne(
     {
       projectId: new ObjectId(projectId),
-      state: 'active',
+      state: { $in: ['active', 'closed'] },
       startVersion: { $lte: version },
       endVersion: { $gte: version },
     },
-    { sort: { startVersion: 1 } }
+    { sort: { startVersion: opts.preferNewer ? -1 : 1 } }
   )
   if (record == null) {
     throw new Chunk.VersionNotFoundError(projectId, version)
@@ -94,7 +110,7 @@ async function getChunkForTimestamp(projectId, timestamp) {
   const record = await mongodb.chunks.findOne(
     {
       projectId: new ObjectId(projectId),
-      state: 'active',
+      state: { $in: ['active', 'closed'] },
       endTimestamp: { $gte: timestamp },
     },
     // We use the index on the startVersion for sorting records. This assumes
@@ -126,7 +142,7 @@ async function getLastActiveChunkBeforeTimestamp(projectId, timestamp) {
   const record = await mongodb.chunks.findOne(
     {
       projectId: new ObjectId(projectId),
-      state: 'active',
+      state: { $in: ['active', 'closed'] },
       $or: [
         {
           endTimestamp: {
@@ -155,7 +171,10 @@ async function getProjectChunkIds(projectId) {
   assert.mongoId(projectId, 'bad projectId')
 
   const cursor = mongodb.chunks.find(
-    { projectId: new ObjectId(projectId), state: 'active' },
+    {
+      projectId: new ObjectId(projectId),
+      state: { $in: ['active', 'closed'] },
+    },
     { projection: { _id: 1 } }
   )
   return await cursor.map(record => record._id).toArray()
@@ -169,7 +188,10 @@ async function getProjectChunks(projectId) {
 
   const cursor = mongodb.chunks
     .find(
-      { projectId: new ObjectId(projectId), state: 'active' },
+      {
+        projectId: new ObjectId(projectId),
+        state: { $in: ['active', 'closed'] },
+      },
       { projection: { state: 0 } }
     )
     .sort({ startVersion: 1 })
@@ -198,48 +220,35 @@ async function insertPendingChunk(projectId, chunk) {
 
 /**
  * Record that a new chunk was created.
+ *
+ * @param {string} projectId
+ * @param {Chunk} chunk
+ * @param {string} chunkId
+ * @param {object} opts
+ * @param {Date} [opts.earliestChangeTimestamp]
+ * @param {string} [opts.oldChunkId]
  */
-async function confirmCreate(
-  projectId,
-  chunk,
-  chunkId,
-  earliestChangeTimestamp,
-  mongoOpts = {}
-) {
+async function confirmCreate(projectId, chunk, chunkId, opts = {}) {
   assert.mongoId(projectId, 'bad projectId')
-  assert.instance(chunk, Chunk, 'bad chunk')
-  assert.mongoId(chunkId, 'bad chunkId')
+  assert.instance(chunk, Chunk, 'bad newChunk')
+  assert.mongoId(chunkId, 'bad newChunkId')
 
-  let result
-  try {
-    result = await mongodb.chunks.updateOne(
-      {
-        _id: new ObjectId(chunkId),
-        projectId: new ObjectId(projectId),
-        state: 'pending',
-      },
-      { $set: { state: 'active', updatedAt: new Date() } },
-      mongoOpts
-    )
-  } catch (err) {
-    if (err.code === DUPLICATE_KEY_ERROR_CODE) {
-      throw new ChunkVersionConflictError('chunk start version is not unique', {
+  await mongodb.client.withSession(async session => {
+    await session.withTransaction(async () => {
+      if (opts.oldChunkId != null) {
+        await closeChunk(projectId, opts.oldChunkId, { session })
+      }
+
+      await activateChunk(projectId, chunkId, { session })
+
+      await updateProjectRecord(
         projectId,
-        chunkId,
-      })
-    } else {
-      throw err
-    }
-  }
-  if (result.matchedCount === 0) {
-    throw new OError('pending chunk not found', { projectId, chunkId })
-  }
-  await updateProjectRecord(
-    projectId,
-    chunk,
-    earliestChangeTimestamp,
-    mongoOpts
-  )
+        chunk,
+        opts.earliestChangeTimestamp,
+        { session }
+      )
+    })
+  })
 }
 
 /**
@@ -251,6 +260,9 @@ async function updateProjectRecord(
   earliestChangeTimestamp,
   mongoOpts = {}
 ) {
+  if (!config.has('backupStore')) {
+    return
+  }
   // record the end version against the project
   await mongodb.projects.updateOne(
     {
@@ -274,43 +286,168 @@ async function updateProjectRecord(
   )
 }
 
+/**
+ * @param {number} historyId
+ * @return {Promise<string>}
+ */
+async function lookupMongoProjectIdFromHistoryId(historyId) {
+  const project = await mongodb.projects.findOne(
+    // string for Object ids, number for postgres ids
+    { 'overleaf.history.id': historyId },
+    { projection: { _id: 1 } }
+  )
+  if (!project) {
+    // should not happen: We flush before allowing a project to be soft-deleted.
+    throw new OError('mongo project not found by history id', { historyId })
+  }
+  return project._id.toString()
+}
+
+async function resolveHistoryIdToMongoProjectId(projectId) {
+  return projectId
+}
+
 /**
  * Record that a chunk was replaced by a new one.
+ *
+ * @param {string} projectId
+ * @param {string} oldChunkId
+ * @param {Chunk} newChunk
+ * @param {string} newChunkId
+ * @param {object} [opts]
+ * @param {Date} [opts.earliestChangeTimestamp]
  */
 async function confirmUpdate(
   projectId,
   oldChunkId,
   newChunk,
   newChunkId,
-  earliestChangeTimestamp
+  opts = {}
 ) {
   assert.mongoId(projectId, 'bad projectId')
   assert.mongoId(oldChunkId, 'bad oldChunkId')
   assert.instance(newChunk, Chunk, 'bad newChunk')
   assert.mongoId(newChunkId, 'bad newChunkId')
 
-  const session = mongodb.client.startSession()
-  try {
+  await mongodb.client.withSession(async session => {
     await session.withTransaction(async () => {
-      await deleteChunk(projectId, oldChunkId, { session })
-      await confirmCreate(
+      await deleteActiveChunk(projectId, oldChunkId, { session })
+
+      await activateChunk(projectId, newChunkId, { session })
+
+      await updateProjectRecord(
         projectId,
         newChunk,
-        newChunkId,
-        earliestChangeTimestamp,
+        opts.earliestChangeTimestamp,
         { session }
       )
     })
-  } finally {
-    await session.endSession()
+  })
+}
+
+/**
+ * Activate a pending chunk
+ *
+ * @param {string} projectId
+ * @param {string} chunkId
+ * @param {object} [opts]
+ * @param {ClientSession} [opts.session]
+ */
+async function activateChunk(projectId, chunkId, opts = {}) {
+  assert.mongoId(projectId, 'bad projectId')
+  assert.mongoId(chunkId, 'bad chunkId')
+
+  let result
+  try {
+    result = await mongodb.chunks.updateOne(
+      {
+        _id: new ObjectId(chunkId),
+        projectId: new ObjectId(projectId),
+        state: 'pending',
+      },
+      { $set: { state: 'active', updatedAt: new Date() } },
+      opts
+    )
+  } catch (err) {
+    if (err instanceof MongoError && err.code === DUPLICATE_KEY_ERROR_CODE) {
+      throw new ChunkVersionConflictError('chunk start version is not unique', {
+        projectId,
+        chunkId,
+      })
+    } else {
+      throw err
+    }
+  }
+  if (result.matchedCount === 0) {
+    throw new OError('pending chunk not found', { projectId, chunkId })
+  }
+}
+
+/**
+ * Close a chunk
+ *
+ * A closed chunk is one that can't be extended anymore.
+ *
+ * @param {string} projectId
+ * @param {string} chunkId
+ * @param {object} [opts]
+ * @param {ClientSession} [opts.session]
+ */
+async function closeChunk(projectId, chunkId, opts = {}) {
+  const result = await mongodb.chunks.updateOne(
+    {
+      _id: new ObjectId(chunkId),
+      projectId: new ObjectId(projectId),
+      state: 'active',
+    },
+    { $set: { state: 'closed' } },
+    opts
+  )
+
+  if (result.matchedCount === 0) {
+    throw new ChunkVersionConflictError('unable to close chunk', {
+      projectId,
+      chunkId,
+    })
+  }
+}
+
+/**
+ * Delete an active chunk
+ *
+ * This is used to delete chunks that are in the process of being extended. It
+ * will refuse to delete chunks that are already closed and can therefore not be
+ * extended.
+ *
+ * @param {string} projectId
+ * @param {string} chunkId
+ * @param {object} [opts]
+ * @param {ClientSession} [opts.session]
+ */
+async function deleteActiveChunk(projectId, chunkId, opts = {}) {
+  const updateResult = await mongodb.chunks.updateOne(
+    {
+      _id: new ObjectId(chunkId),
+      projectId: new ObjectId(projectId),
+      state: 'active',
+    },
+    { $set: { state: 'deleted', updatedAt: new Date() } },
+    opts
+  )
+
+  if (updateResult.matchedCount === 0) {
+    throw new ChunkVersionConflictError('unable to delete active chunk', {
+      projectId,
+      chunkId,
+    })
   }
 }
 
 /**
  * Delete a chunk.
  *
- * @param {number} projectId
- * @param {number} chunkId
+ * @param {string} projectId
+ * @param {string} chunkId
  * @return {Promise}
  */
 async function deleteChunk(projectId, chunkId, mongoOpts = {}) {
@@ -331,7 +468,10 @@ async function deleteProjectChunks(projectId) {
   assert.mongoId(projectId, 'bad projectId')
 
   await mongodb.chunks.updateMany(
-    { projectId: new ObjectId(projectId), state: 'active' },
+    {
+      projectId: new ObjectId(projectId),
+      state: { $in: ['active', 'closed'] },
+    },
     { $set: { state: 'deleted', updatedAt: new Date() } }
   )
 }
@@ -414,4 +554,6 @@ module.exports = {
   deleteProjectChunks,
   getOldChunksBatch,
   deleteOldChunks,
+  lookupMongoProjectIdFromHistoryId,
+  resolveHistoryIdToMongoProjectId,
 }
diff --git a/services/history-v1/storage/lib/chunk_store/postgres.js b/services/history-v1/storage/lib/chunk_store/postgres.js
index 0964b0ecca..8906db38e1 100644
--- a/services/history-v1/storage/lib/chunk_store/postgres.js
+++ b/services/history-v1/storage/lib/chunk_store/postgres.js
@@ -1,12 +1,21 @@
+// @ts-check
+
 const { Chunk } = require('overleaf-editor-core')
 const assert = require('../assert')
 const knex = require('../knex')
 const knexReadOnly = require('../knex_read_only')
 const { ChunkVersionConflictError } = require('./errors')
-const { updateProjectRecord } = require('./mongo')
+const {
+  updateProjectRecord,
+  lookupMongoProjectIdFromHistoryId,
+} = require('./mongo')
 
 const DUPLICATE_KEY_ERROR_CODE = '23505'
 
+/**
+ * @import { Knex } from 'knex'
+ */
+
 /**
  * Get the latest chunk's metadata from the database
  * @param {string} projectId
@@ -14,12 +23,11 @@ const DUPLICATE_KEY_ERROR_CODE = '23505'
  * @param {boolean} [opts.readOnly]
  */
 async function getLatestChunk(projectId, opts = {}) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
   const { readOnly = false } = opts
 
   const record = await (readOnly ? knexReadOnly : knex)('chunks')
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
     .orderBy('end_version', 'desc')
     .first()
   if (record == null) {
@@ -30,15 +38,21 @@ async function getLatestChunk(projectId, opts = {}) {
 
 /**
  * Get the metadata for the chunk that contains the given version.
+ *
+ * @param {string} projectId
+ * @param {number} version
+ * @param {object} [opts]
+ * @param {boolean} [opts.preferNewer] - If the version is at the boundary of
+ *        two chunks, return the newer chunk.
  */
-async function getChunkForVersion(projectId, version) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+async function getChunkForVersion(projectId, version, opts = {}) {
+  assert.postgresId(projectId, 'bad projectId')
 
   const record = await knex('chunks')
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
+    .where('start_version', '<=', version)
     .where('end_version', '>=', version)
-    .orderBy('end_version')
+    .orderBy('end_version', opts.preferNewer ? 'desc' : 'asc')
     .first()
   if (!record) {
     throw new Chunk.VersionNotFoundError(projectId, version)
@@ -48,20 +62,23 @@ async function getChunkForVersion(projectId, version) {
 
 /**
  * Get the metadata for the chunk that contains the given version.
+ *
+ * @param {string} projectId
+ * @param {Date} timestamp
  */
 async function getFirstChunkBeforeTimestamp(projectId, timestamp) {
   assert.date(timestamp, 'bad timestamp')
 
   const recordActive = await getChunkForVersion(projectId, 0)
+
   // projectId must be valid if getChunkForVersion did not throw
-  projectId = parseInt(projectId, 10)
   if (recordActive && recordActive.endTimestamp <= timestamp) {
     return recordActive
   }
 
   // fallback to deleted chunk
   const recordDeleted = await knex('old_chunks')
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
     .where('start_version', '=', 0)
     .where('end_timestamp', '<=', timestamp)
     .orderBy('end_version', 'desc')
@@ -75,14 +92,16 @@ async function getFirstChunkBeforeTimestamp(projectId, timestamp) {
 /**
  * Get the metadata for the chunk that contains the version that was current at
  * the given timestamp.
+ *
+ * @param {string} projectId
+ * @param {Date} timestamp
  */
 async function getLastActiveChunkBeforeTimestamp(projectId, timestamp) {
   assert.date(timestamp, 'bad timestamp')
   assert.postgresId(projectId, 'bad projectId')
-  projectId = parseInt(projectId, 10)
 
   const query = knex('chunks')
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
     .where(function () {
       this.where('end_timestamp', '<=', timestamp).orWhere(
         'end_timestamp',
@@ -102,10 +121,12 @@ async function getLastActiveChunkBeforeTimestamp(projectId, timestamp) {
 /**
  * Get the metadata for the chunk that contains the version that was current at
  * the given timestamp.
+ *
+ * @param {string} projectId
+ * @param {Date} timestamp
  */
 async function getChunkForTimestamp(projectId, timestamp) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
   // This query will find the latest chunk after the timestamp (query orders
   // in reverse chronological order), OR the latest chunk
@@ -118,11 +139,11 @@ async function getChunkForTimestamp(projectId, timestamp) {
       'WHERE doc_id = ? ' +
       'ORDER BY end_version desc LIMIT 1' +
       ')',
-    [timestamp, projectId]
+    [timestamp, parseInt(projectId, 10)]
   )
 
   const record = await knex('chunks')
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
     .where(whereAfterEndTimestampOrLatestChunk)
     .orderBy('end_version')
     .first()
@@ -137,7 +158,7 @@ async function getChunkForTimestamp(projectId, timestamp) {
  */
 function chunkFromRecord(record) {
   return {
-    id: record.id,
+    id: record.id.toString(),
     startVersion: record.start_version,
     endVersion: record.end_version,
     endTimestamp: record.end_timestamp,
@@ -146,35 +167,41 @@ function chunkFromRecord(record) {
 
 /**
  * Get all of a project's chunk ids
+ *
+ * @param {string} projectId
  */
 async function getProjectChunkIds(projectId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
-  const records = await knex('chunks').select('id').where('doc_id', projectId)
+  const records = await knex('chunks')
+    .select('id')
+    .where('doc_id', parseInt(projectId, 10))
   return records.map(record => record.id)
 }
 
 /**
  * Get all of a projects chunks directly
+ *
+ * @param {string} projectId
  */
 async function getProjectChunks(projectId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
   const records = await knex('chunks')
     .select()
-    .where('doc_id', projectId)
+    .where('doc_id', parseInt(projectId, 10))
     .orderBy('end_version')
   return records.map(chunkFromRecord)
 }
 
 /**
  * Insert a pending chunk before sending it to object storage.
+ *
+ * @param {string} projectId
+ * @param {Chunk} chunk
  */
 async function insertPendingChunk(projectId, chunk) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
   const result = await knex.first(
     knex.raw("nextval('chunks_id_seq'::regclass)::integer as chunkid")
@@ -182,80 +209,119 @@ async function insertPendingChunk(projectId, chunk) {
   const chunkId = result.chunkid
   await knex('pending_chunks').insert({
     id: chunkId,
-    doc_id: projectId,
+    doc_id: parseInt(projectId, 10),
     end_version: chunk.getEndVersion(),
     start_version: chunk.getStartVersion(),
     end_timestamp: chunk.getEndTimestamp(),
   })
-  return chunkId
+  return chunkId.toString()
 }
 
 /**
  * Record that a new chunk was created.
+ *
+ * @param {string} projectId
+ * @param {Chunk} chunk
+ * @param {string} chunkId
+ * @param {object} opts
+ * @param {Date} [opts.earliestChangeTimestamp]
+ * @param {string} [opts.oldChunkId]
  */
-async function confirmCreate(
-  projectId,
-  chunk,
-  chunkId,
-  earliestChangeTimestamp
-) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+async function confirmCreate(projectId, chunk, chunkId, opts = {}) {
+  assert.postgresId(projectId, 'bad projectId')
 
   await knex.transaction(async tx => {
+    if (opts.oldChunkId != null) {
+      await _assertChunkIsNotClosed(tx, projectId, opts.oldChunkId)
+      await _closeChunk(tx, projectId, opts.oldChunkId)
+    }
     await Promise.all([
       _deletePendingChunk(tx, projectId, chunkId),
       _insertChunk(tx, projectId, chunk, chunkId),
     ])
-    await updateProjectRecord(projectId, chunk, earliestChangeTimestamp)
+    await updateProjectRecord(
+      // The history id in Mongo is an integer for Postgres projects
+      parseInt(projectId, 10),
+      chunk,
+      opts.earliestChangeTimestamp
+    )
   })
 }
 
 /**
  * Record that a chunk was replaced by a new one.
+ *
+ * @param {string} projectId
+ * @param {string} oldChunkId
+ * @param {Chunk} newChunk
+ * @param {string} newChunkId
  */
 async function confirmUpdate(
   projectId,
   oldChunkId,
   newChunk,
   newChunkId,
-  earliestChangeTimestamp
+  opts = {}
 ) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
   await knex.transaction(async tx => {
+    await _assertChunkIsNotClosed(tx, projectId, oldChunkId)
     await _deleteChunks(tx, { doc_id: projectId, id: oldChunkId })
     await Promise.all([
       _deletePendingChunk(tx, projectId, newChunkId),
       _insertChunk(tx, projectId, newChunk, newChunkId),
     ])
-    await updateProjectRecord(projectId, newChunk, earliestChangeTimestamp)
+    await updateProjectRecord(
+      // The history id in Mongo is an integer for Postgres projects
+      parseInt(projectId, 10),
+      newChunk,
+      opts.earliestChangeTimestamp
+    )
   })
 }
 
+/**
+ * Delete a pending chunk
+ *
+ * @param {Knex} tx
+ * @param {string} projectId
+ * @param {string} chunkId
+ */
 async function _deletePendingChunk(tx, projectId, chunkId) {
   await tx('pending_chunks')
     .where({
-      doc_id: projectId,
-      id: chunkId,
+      doc_id: parseInt(projectId, 10),
+      id: parseInt(chunkId, 10),
     })
     .del()
 }
 
+/**
+ * Adds an active chunk
+ *
+ * @param {Knex} tx
+ * @param {string} projectId
+ * @param {Chunk} chunk
+ * @param {string} chunkId
+ */
 async function _insertChunk(tx, projectId, chunk, chunkId) {
   const startVersion = chunk.getStartVersion()
   const endVersion = chunk.getEndVersion()
   try {
     await tx('chunks').insert({
-      id: chunkId,
-      doc_id: projectId,
+      id: parseInt(chunkId, 10),
+      doc_id: parseInt(projectId, 10),
       start_version: startVersion,
       end_version: endVersion,
       end_timestamp: chunk.getEndTimestamp(),
     })
   } catch (err) {
-    if (err.code === DUPLICATE_KEY_ERROR_CODE) {
+    if (
+      err instanceof Error &&
+      'code' in err &&
+      err.code === DUPLICATE_KEY_ERROR_CODE
+    ) {
       throw new ChunkVersionConflictError(
         'chunk start or end version is not unique',
         { projectId, chunkId, startVersion, endVersion }
@@ -265,35 +331,92 @@ async function _insertChunk(tx, projectId, chunk, chunkId) {
   }
 }
 
+/**
+ * Check that a chunk is not closed
+ *
+ * This is used to synchronize chunk creations and extensions.
+ *
+ * @param {Knex} tx
+ * @param {string} projectId
+ * @param {string} chunkId
+ */
+async function _assertChunkIsNotClosed(tx, projectId, chunkId) {
+  const record = await tx('chunks')
+    .forUpdate()
+    .select('closed')
+    .where('doc_id', parseInt(projectId, 10))
+    .where('id', parseInt(chunkId, 10))
+    .first()
+  if (!record) {
+    throw new ChunkVersionConflictError('unable to close chunk: not found', {
+      projectId,
+      chunkId,
+    })
+  }
+  if (record.closed) {
+    throw new ChunkVersionConflictError(
+      'unable to close chunk: already closed',
+      {
+        projectId,
+        chunkId,
+      }
+    )
+  }
+}
+
+/**
+ * Close a chunk
+ *
+ * A closed chunk can no longer be extended.
+ *
+ * @param {Knex} tx
+ * @param {string} projectId
+ * @param {string} chunkId
+ */
+async function _closeChunk(tx, projectId, chunkId) {
+  await tx('chunks')
+    .update({ closed: true })
+    .where('doc_id', parseInt(projectId, 10))
+    .where('id', parseInt(chunkId, 10))
+}
+
 /**
  * Delete a chunk.
  *
- * @param {number} projectId
- * @param {number} chunkId
- * @return {Promise}
+ * @param {string} projectId
+ * @param {string} chunkId
  */
 async function deleteChunk(projectId, chunkId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
   assert.integer(chunkId, 'bad chunkId')
 
-  await _deleteChunks(knex, { doc_id: projectId, id: chunkId })
+  await _deleteChunks(knex, {
+    doc_id: parseInt(projectId, 10),
+    id: parseInt(chunkId, 10),
+  })
 }
 
 /**
  * Delete all of a project's chunks
+ *
+ * @param {string} projectId
  */
 async function deleteProjectChunks(projectId) {
-  assert.postgresId(projectId, `bad projectId ${projectId}`)
-  projectId = parseInt(projectId, 10)
+  assert.postgresId(projectId, 'bad projectId')
 
   await knex.transaction(async tx => {
-    await _deleteChunks(knex, { doc_id: projectId })
+    await _deleteChunks(knex, { doc_id: parseInt(projectId, 10) })
   })
 }
 
+/**
+ * Delete many chunks
+ *
+ * @param {Knex} tx
+ * @param {any} whereClause
+ */
 async function _deleteChunks(tx, whereClause) {
-  const rows = await tx('chunks').returning('*').where(whereClause).del()
+  const rows = await tx('chunks').where(whereClause).del().returning('*')
   if (rows.length === 0) {
     return
   }
@@ -311,6 +434,9 @@ async function _deleteChunks(tx, whereClause) {
 
 /**
  * Get a batch of old chunks for deletion
+ *
+ * @param {number} count
+ * @param {number} minAgeSecs
  */
 async function getOldChunksBatch(count, minAgeSecs) {
   const maxDeletedAt = new Date(Date.now() - minAgeSecs * 1000)
@@ -321,15 +447,22 @@ async function getOldChunksBatch(count, minAgeSecs) {
     .limit(count)
   return records.map(oldChunk => ({
     projectId: oldChunk.doc_id.toString(),
-    chunkId: oldChunk.chunk_id,
+    chunkId: oldChunk.chunk_id.toString(),
   }))
 }
 
 /**
  * Delete a batch of old chunks from the database
+ *
+ * @param {string[]} chunkIds
  */
 async function deleteOldChunks(chunkIds) {
-  await knex('old_chunks').whereIn('chunk_id', chunkIds).del()
+  await knex('old_chunks')
+    .whereIn(
+      'chunk_id',
+      chunkIds.map(id => parseInt(id, 10))
+    )
+    .del()
 }
 
 /**
@@ -342,6 +475,10 @@ async function generateProjectId() {
   return record.doc_id.toString()
 }
 
+async function resolveHistoryIdToMongoProjectId(projectId) {
+  return await lookupMongoProjectIdFromHistoryId(parseInt(projectId, 10))
+}
+
 module.exports = {
   getLatestChunk,
   getFirstChunkBeforeTimestamp,
@@ -358,4 +495,5 @@ module.exports = {
   getOldChunksBatch,
   deleteOldChunks,
   generateProjectId,
+  resolveHistoryIdToMongoProjectId,
 }
diff --git a/services/history-v1/storage/lib/chunk_store/redis.js b/services/history-v1/storage/lib/chunk_store/redis.js
new file mode 100644
index 0000000000..b8a79b498d
--- /dev/null
+++ b/services/history-v1/storage/lib/chunk_store/redis.js
@@ -0,0 +1,854 @@
+// @ts-check
+
+const metrics = require('@overleaf/metrics')
+const OError = require('@overleaf/o-error')
+const { Change, Snapshot } = require('overleaf-editor-core')
+const redis = require('../redis')
+const rclient = redis.rclientHistory
+const {
+  BaseVersionConflictError,
+  JobNotFoundError,
+  JobNotReadyError,
+  VersionOutOfBoundsError,
+} = require('./errors')
+
+const MAX_PERSISTED_CHANGES = 100 // Maximum number of persisted changes to keep in the buffer for clients that need to catch up.
+const PROJECT_TTL_MS = 3600 * 1000 // Amount of time a project can stay inactive before it gets expired
+const MAX_PERSIST_DELAY_MS = 300 * 1000 // Maximum amount of time before a change is persisted
+const RETRY_DELAY_MS = 120 * 1000 // Time before a claimed job is considered stale and a worker can retry it.
+
+const keySchema = {
+  head({ projectId }) {
+    return `head:{${projectId}}`
+  },
+  headVersion({ projectId }) {
+    return `head-version:{${projectId}}`
+  },
+  persistedVersion({ projectId }) {
+    return `persisted-version:{${projectId}}`
+  },
+  expireTime({ projectId }) {
+    return `expire-time:{${projectId}}`
+  },
+  persistTime({ projectId }) {
+    return `persist-time:{${projectId}}`
+  },
+  changes({ projectId }) {
+    return `changes:{${projectId}}`
+  },
+}
+
+rclient.defineCommand('get_head_snapshot', {
+  numberOfKeys: 2,
+  lua: `
+      local headSnapshotKey = KEYS[1]
+      local headVersionKey = KEYS[2]
+
+      -- Check if the head version exists. If not, consider it a cache miss.
+      local version = redis.call('GET', headVersionKey)
+      if not version then
+        return nil
+      end
+
+      -- Retrieve the snapshot value
+      local snapshot = redis.call('GET', headSnapshotKey)
+      return {snapshot, version}
+    `,
+})
+
+/**
+ * Retrieves the head snapshot from Redis storage
+ * @param {string} projectId - The unique identifier of the project
+ * @returns {Promise<{version: number, snapshot: Snapshot}|null>} A Promise that resolves to an object containing the version and Snapshot,
+ *                               or null if retrieval fails or cache miss
+ * @throws {Error} If Redis operations fail
+ */
+async function getHeadSnapshot(projectId) {
+  try {
+    const result = await rclient.get_head_snapshot(
+      keySchema.head({ projectId }),
+      keySchema.headVersion({ projectId })
+    )
+    if (!result) {
+      metrics.inc('chunk_store.redis.get_head_snapshot', 1, {
+        status: 'cache-miss',
+      })
+      return null // cache-miss
+    }
+    const snapshot = Snapshot.fromRaw(JSON.parse(result[0]))
+    const version = parseInt(result[1], 10)
+    metrics.inc('chunk_store.redis.get_head_snapshot', 1, {
+      status: 'success',
+    })
+    return { version, snapshot }
+  } catch (err) {
+    metrics.inc('chunk_store.redis.get_head_snapshot', 1, { status: 'error' })
+    throw err
+  }
+}
+
+rclient.defineCommand('queue_changes', {
+  numberOfKeys: 5,
+  lua: `
+  local headSnapshotKey = KEYS[1]
+  local headVersionKey = KEYS[2]
+  local changesKey = KEYS[3]
+  local expireTimeKey = KEYS[4]
+  local persistTimeKey = KEYS[5]
+
+  local baseVersion = tonumber(ARGV[1])
+  local head = ARGV[2]
+  local persistTime = tonumber(ARGV[3])
+  local expireTime = tonumber(ARGV[4])
+  local onlyIfExists = ARGV[5]
+  local changesIndex = 6 -- Changes start here
+
+  local headVersion = tonumber(redis.call('GET', headVersionKey))
+
+  -- Check if updates should only be queued if the project already exists (used for gradual rollouts)
+  if not headVersion and onlyIfExists == 'true' then
+    return 'ignore'
+  end
+
+  -- Check that the supplied baseVersion matches the head version
+  -- If headVersion is nil, it means the project does not exist yet and will be created.
+  if headVersion and headVersion ~= baseVersion then
+    return 'conflict'
+  end
+
+  -- Check if there are any changes to queue
+  if #ARGV < changesIndex then
+    return 'no_changes_provided'
+  end
+
+  -- Store the changes
+  -- RPUSH changesKey change1 change2 ...
+  redis.call('RPUSH', changesKey, unpack(ARGV, changesIndex, #ARGV))
+
+  -- Update head snapshot only if changes were successfully pushed
+  redis.call('SET', headSnapshotKey, head)
+
+  -- Update the head version
+  local numChanges = #ARGV - changesIndex + 1
+  local newHeadVersion = baseVersion + numChanges
+  redis.call('SET', headVersionKey, newHeadVersion)
+
+  -- Update the persist time if the new time is sooner
+  local currentPersistTime = tonumber(redis.call('GET', persistTimeKey))
+  if not currentPersistTime or persistTime < currentPersistTime then
+    redis.call('SET', persistTimeKey, persistTime)
+  end
+
+  -- Update the expire time
+  redis.call('SET', expireTimeKey, expireTime)
+
+  return 'ok'
+  `,
+})
+
+/**
+ * Atomically queues changes to the project history in Redis if the baseVersion matches.
+ * Updates head snapshot, version, persist time, and expire time.
+ *
+ * @param {string} projectId - The project identifier.
+ * @param {Snapshot} headSnapshot - The new head snapshot after applying changes.
+ * @param {number} baseVersion - The expected current head version.
+ * @param {Change[]} changes - An array of Change objects to queue.
+ * @param {object} [opts]
+ * @param {number} [opts.persistTime] - Timestamp (ms since epoch) when the
+ *                 oldest change in the buffer should be persisted.
+ * @param {number} [opts.expireTime] - Timestamp (ms since epoch) when the
+ *                 project buffer should expire if inactive.
+ * @param {boolean} [opts.onlyIfExists] - If true, only queue changes if the
+ *                 project already exists in Redis, otherwise ignore.
+ * @returns {Promise<string>} Resolves on success to either 'ok' or 'ignore'.
+ * @throws {BaseVersionConflictError} If the baseVersion does not match the current head version in Redis.
+ * @throws {Error} If changes array is empty or if Redis operations fail.
+ */
+async function queueChanges(
+  projectId,
+  headSnapshot,
+  baseVersion,
+  changes,
+  opts = {}
+) {
+  if (!changes || changes.length === 0) {
+    throw new Error('Cannot queue empty changes array')
+  }
+
+  const persistTime = opts.persistTime ?? Date.now() + MAX_PERSIST_DELAY_MS
+  const expireTime = opts.expireTime ?? Date.now() + PROJECT_TTL_MS
+  const onlyIfExists = Boolean(opts.onlyIfExists)
+
+  try {
+    const keys = [
+      keySchema.head({ projectId }),
+      keySchema.headVersion({ projectId }),
+      keySchema.changes({ projectId }),
+      keySchema.expireTime({ projectId }),
+      keySchema.persistTime({ projectId }),
+    ]
+
+    const args = [
+      baseVersion.toString(),
+      JSON.stringify(headSnapshot.toRaw()),
+      persistTime.toString(),
+      expireTime.toString(),
+      onlyIfExists.toString(), // Only queue changes if the snapshot already exists
+      ...changes.map(change => JSON.stringify(change.toRaw())), // Serialize changes
+    ]
+
+    const status = await rclient.queue_changes(keys, args)
+    metrics.inc('chunk_store.redis.queue_changes', 1, { status })
+    if (status === 'ok') {
+      return status
+    }
+    if (status === 'ignore') {
+      return status // skip changes when project does not exist and onlyIfExists is true
+    }
+    if (status === 'conflict') {
+      throw new BaseVersionConflictError('base version mismatch', {
+        projectId,
+        baseVersion,
+      })
+    } else {
+      throw new Error(`unexpected result queuing changes: ${status}`)
+    }
+  } catch (err) {
+    if (err instanceof BaseVersionConflictError) {
+      // Re-throw conflict errors directly
+      throw err
+    }
+    metrics.inc('chunk_store.redis.queue_changes', 1, { status: 'error' })
+    throw err
+  }
+}
+
+rclient.defineCommand('get_state', {
+  numberOfKeys: 6, // Number of keys defined in keySchema
+  lua: `
+    local headSnapshotKey = KEYS[1]
+    local headVersionKey = KEYS[2]
+    local persistedVersionKey = KEYS[3]
+    local expireTimeKey = KEYS[4]
+    local persistTimeKey = KEYS[5]
+    local changesKey = KEYS[6]
+
+    local headSnapshot = redis.call('GET', headSnapshotKey)
+    local headVersion = redis.call('GET', headVersionKey)
+    local persistedVersion = redis.call('GET', persistedVersionKey)
+    local expireTime = redis.call('GET', expireTimeKey)
+    local persistTime = redis.call('GET', persistTimeKey)
+    local changes = redis.call('LRANGE', changesKey, 0, -1) -- Get all changes in the list
+
+    return {headSnapshot, headVersion, persistedVersion, expireTime, persistTime, changes}
+  `,
+})
+
+/**
+ * Retrieves the entire state associated with a project from Redis atomically.
+ * @param {string} projectId - The unique identifier of the project.
+ * @returns {Promise<object|null>} A Promise that resolves to an object containing the project state,
+ *                                  or null if the project state does not exist (e.g., head version is missing).
+ * @throws {Error} If Redis operations fail.
+ */
+async function getState(projectId) {
+  const keys = [
+    keySchema.head({ projectId }),
+    keySchema.headVersion({ projectId }),
+    keySchema.persistedVersion({ projectId }),
+    keySchema.expireTime({ projectId }),
+    keySchema.persistTime({ projectId }),
+    keySchema.changes({ projectId }),
+  ]
+
+  // Pass keys individually, not as an array
+  const result = await rclient.get_state(...keys)
+
+  const [
+    rawHeadSnapshot,
+    rawHeadVersion,
+    rawPersistedVersion,
+    rawExpireTime,
+    rawPersistTime,
+    rawChanges,
+  ] = result
+
+  // Safely parse values, providing defaults or nulls if necessary
+  const headSnapshot = rawHeadSnapshot
+    ? JSON.parse(rawHeadSnapshot)
+    : rawHeadSnapshot
+  const headVersion = rawHeadVersion ? parseInt(rawHeadVersion, 10) : null // Should always exist if result is not null
+  const persistedVersion = rawPersistedVersion
+    ? parseInt(rawPersistedVersion, 10)
+    : null
+  const expireTime = rawExpireTime ? parseInt(rawExpireTime, 10) : null
+  const persistTime = rawPersistTime ? parseInt(rawPersistTime, 10) : null
+  const changes = rawChanges ? rawChanges.map(JSON.parse) : null
+
+  return {
+    headSnapshot,
+    headVersion,
+    persistedVersion,
+    expireTime,
+    persistTime,
+    changes,
+  }
+}
+
+rclient.defineCommand('get_changes_since_version', {
+  numberOfKeys: 2,
+  lua: `
+    local headVersionKey = KEYS[1]
+    local changesKey = KEYS[2]
+
+    local requestedVersion = tonumber(ARGV[1])
+
+    -- Check if head version exists
+    local headVersion = tonumber(redis.call('GET', headVersionKey))
+    if not headVersion then
+      return {'not_found'}
+    end
+
+    -- If requested version equals head version, return empty array
+    if requestedVersion == headVersion then
+      return {'ok', {}}
+    end
+
+    -- If requested version is greater than head version, return error
+    if requestedVersion > headVersion then
+      return {'out_of_bounds'}
+    end
+
+    -- Get length of changes list
+    local changesCount = redis.call('LLEN', changesKey)
+
+    -- Check if requested version is too old (changes already removed from buffer)
+    if requestedVersion < (headVersion - changesCount) then
+      return {'out_of_bounds'}
+    end
+
+    -- Calculate the starting index, using negative indexing to count backwards
+    -- from the end of the list
+    local startIndex = requestedVersion - headVersion
+
+    -- Get changes using LRANGE
+    local changes = redis.call('LRANGE', changesKey, startIndex, -1)
+
+    return {'ok', changes}
+  `,
+})
+
+/**
+ * Retrieves changes since a specific version for a project from Redis.
+ *
+ * @param {string} projectId - The unique identifier of the project.
+ * @param {number} version - The version number to retrieve changes since.
+ * @returns {Promise<{status: string, changes?: Array<Change>}>} A Promise that resolves to an object containing:
+ *   - status: 'OK', 'NOT_FOUND', or 'OUT_OF_BOUNDS'
+ *   - changes: Array of Change objects (only when status is 'OK')
+ * @throws {Error} If Redis operations fail.
+ */
+async function getChangesSinceVersion(projectId, version) {
+  try {
+    const keys = [
+      keySchema.headVersion({ projectId }),
+      keySchema.changes({ projectId }),
+    ]
+
+    const args = [version.toString()]
+
+    const result = await rclient.get_changes_since_version(keys, args)
+    const status = result[0]
+
+    if (status === 'ok') {
+      // If status is OK, parse the changes
+      const changes = result[1]
+        ? result[1].map(rawChange =>
+            typeof rawChange === 'string' ? JSON.parse(rawChange) : rawChange
+          )
+        : []
+
+      metrics.inc('chunk_store.redis.get_changes_since_version', 1, {
+        status: 'success',
+      })
+      return { status, changes }
+    } else {
+      // For other statuses, just return the status
+      metrics.inc('chunk_store.redis.get_changes_since_version', 1, {
+        status,
+      })
+      return { status }
+    }
+  } catch (err) {
+    metrics.inc('chunk_store.redis.get_changes_since_version', 1, {
+      status: 'error',
+    })
+    throw err
+  }
+}
+
+rclient.defineCommand('get_non_persisted_changes', {
+  numberOfKeys: 3,
+  lua: `
+    local headVersionKey = KEYS[1]
+    local persistedVersionKey = KEYS[2]
+    local changesKey = KEYS[3]
+    local baseVersion = tonumber(ARGV[1])
+    local maxChanges = tonumber(ARGV[2])
+
+    -- Check if head version exists
+    local headVersion = tonumber(redis.call('GET', headVersionKey))
+    if not headVersion then
+      return {'not_found'}
+    end
+
+    -- Check if persisted version exists
+    local persistedVersion = tonumber(redis.call('GET', persistedVersionKey))
+    if not persistedVersion then
+      local changesCount = tonumber(redis.call('LLEN', changesKey))
+      persistedVersion = headVersion - changesCount
+    end
+
+    if baseVersion < persistedVersion or baseVersion > headVersion then
+      return {'out_of_bounds'}
+    elseif baseVersion == headVersion then
+      return {'ok', {}}
+    else
+      local numChanges = headVersion - baseVersion
+
+      local endIndex, expectedChanges
+      if maxChanges > 0 and maxChanges < numChanges then
+        -- return only the first maxChanges changes; the end index is inclusive
+        endIndex = -numChanges + maxChanges - 1
+        expectedChanges = maxChanges
+      else
+        endIndex = -1
+        expectedChanges = numChanges
+      end
+
+      local changes = redis.call('LRANGE', changesKey, -numChanges, endIndex)
+
+      if #changes < expectedChanges then
+        -- We didn't get as many changes as we expected
+        return {'out_of_bounds'}
+      end
+
+      return {'ok', changes}
+    end
+  `,
+})
+
+/**
+ * Retrieves non-persisted changes for a project from Redis.
+ *
+ * @param {string} projectId - The unique identifier of the project.
+ * @param {number} baseVersion - The version on top of which the changes should
+ *        be applied.
+ * @param {object} [opts]
+ * @param {number} [opts.maxChanges] - The maximum number of changes to return.
+ *        Defaults to 0, meaning no limit.
+ * @returns {Promise<Change[]>} Changes that can be applied on top of
+ *          baseVersion. An empty array means that the project doesn't have
+ *          changes to persist. A null value means that the non-persisted
+ *          changes can't be applied to the given base version.
+ *
+ * @throws {Error} If Redis operations fail.
+ */
+async function getNonPersistedChanges(projectId, baseVersion, opts = {}) {
+  let result
+  try {
+    result = await rclient.get_non_persisted_changes(
+      keySchema.headVersion({ projectId }),
+      keySchema.persistedVersion({ projectId }),
+      keySchema.changes({ projectId }),
+      baseVersion.toString(),
+      opts.maxChanges ?? 0
+    )
+  } catch (err) {
+    metrics.inc('chunk_store.redis.get_non_persisted_changes', 1, {
+      status: 'error',
+    })
+    throw err
+  }
+
+  const status = result[0]
+  metrics.inc('chunk_store.redis.get_non_persisted_changes', 1, {
+    status,
+  })
+
+  if (status === 'ok') {
+    return result[1].map(json => Change.fromRaw(JSON.parse(json)))
+  } else if (status === 'not_found') {
+    return []
+  } else if (status === 'out_of_bounds') {
+    throw new VersionOutOfBoundsError(
+      "Non-persisted changes can't be applied to base version",
+      { projectId, baseVersion }
+    )
+  } else {
+    throw new OError('unknown status for get_non_persisted_changes', {
+      projectId,
+      baseVersion,
+      status,
+    })
+  }
+}
+
+rclient.defineCommand('set_persisted_version', {
+  numberOfKeys: 4,
+  lua: `
+    local headVersionKey = KEYS[1]
+    local persistedVersionKey = KEYS[2]
+    local persistTimeKey = KEYS[3]
+    local changesKey = KEYS[4]
+
+    local newPersistedVersion = tonumber(ARGV[1])
+    local maxPersistedChanges = tonumber(ARGV[2])
+
+    -- Check if head version exists
+    local headVersion = tonumber(redis.call('GET', headVersionKey))
+    if not headVersion then
+      return 'not_found'
+    end
+
+    -- Get current persisted version
+    local persistedVersion = tonumber(redis.call('GET', persistedVersionKey))
+    if persistedVersion and persistedVersion > newPersistedVersion then
+      return 'too_low'
+    end
+
+    -- Refuse to set a persisted version that is higher than the head version
+    if newPersistedVersion > headVersion then
+      return 'too_high'
+    end
+
+    -- Set the persisted version
+    redis.call('SET', persistedVersionKey, newPersistedVersion)
+
+    -- Clear the persist time if the persisted version now matches the head version
+    if newPersistedVersion == headVersion then
+      redis.call('DEL', persistTimeKey)
+    end
+
+    -- Calculate the starting index, to keep only maxPersistedChanges beyond the persisted version
+    -- Using negative indexing to count backwards from the end of the list
+    local startIndex = newPersistedVersion - headVersion - maxPersistedChanges
+
+    -- Trim the changes list to keep only the specified number of changes beyond persisted version
+    if startIndex < 0 then
+      redis.call('LTRIM', changesKey, startIndex, -1)
+    end
+
+    return 'ok'
+  `,
+})
+
+/**
+ * Sets the persisted version for a project in Redis and trims the changes list.
+ *
+ * @param {string} projectId - The unique identifier of the project.
+ * @param {number} persistedVersion - The version number to set as persisted.
+ * @returns {Promise<string>} A Promise that resolves to 'OK' or 'NOT_FOUND'.
+ * @throws {Error} If Redis operations fail.
+ */
+async function setPersistedVersion(projectId, persistedVersion) {
+  try {
+    const keys = [
+      keySchema.headVersion({ projectId }),
+      keySchema.persistedVersion({ projectId }),
+      keySchema.persistTime({ projectId }),
+      keySchema.changes({ projectId }),
+    ]
+
+    const args = [persistedVersion.toString(), MAX_PERSISTED_CHANGES.toString()]
+
+    const status = await rclient.set_persisted_version(keys, args)
+
+    metrics.inc('chunk_store.redis.set_persisted_version', 1, {
+      status,
+    })
+
+    if (status === 'too_high') {
+      throw new VersionOutOfBoundsError(
+        'Persisted version cannot be higher than head version',
+        { projectId, persistedVersion }
+      )
+    }
+
+    return status
+  } catch (err) {
+    metrics.inc('chunk_store.redis.set_persisted_version', 1, {
+      status: 'error',
+    })
+    throw err
+  }
+}
+
+rclient.defineCommand('hard_delete_project', {
+  numberOfKeys: 6,
+  lua: `
+    local headKey = KEYS[1]
+    local headVersionKey = KEYS[2]
+    local persistedVersionKey = KEYS[3]
+    local expireTimeKey = KEYS[4]
+    local persistTimeKey = KEYS[5]
+    local changesKey = KEYS[6]
+    -- Delete all keys associated with the project
+    redis.call('DEL',
+      headKey,
+      headVersionKey,
+      persistedVersionKey,
+      expireTimeKey,
+      persistTimeKey,
+      changesKey
+    )
+      return 'ok'
+  `,
+})
+
+/** Hard delete a project from Redis by removing all keys associated with it.
+ * This is only to be used when a project is **permanently** deleted.
+ * DO NOT USE THIS FOR ANY OTHER PURPOSES AS IT WILL REMOVE NON-PERSISTED CHANGES.
+ * @param {string} projectId - The unique identifier of the project to delete.
+ * @returns {Promise<string>} A Promise that resolves to 'ok' on success.
+ * @throws {Error} If Redis operations fail.
+ */
+async function hardDeleteProject(projectId) {
+  try {
+    const status = await rclient.hard_delete_project(
+      keySchema.head({ projectId }),
+      keySchema.headVersion({ projectId }),
+      keySchema.persistedVersion({ projectId }),
+      keySchema.expireTime({ projectId }),
+      keySchema.persistTime({ projectId }),
+      keySchema.changes({ projectId })
+    )
+    metrics.inc('chunk_store.redis.hard_delete_project', 1, { status })
+    return status
+  } catch (err) {
+    metrics.inc('chunk_store.redis.hard_delete_project', 1, { status: 'error' })
+    throw err
+  }
+}
+
+rclient.defineCommand('set_expire_time', {
+  numberOfKeys: 2,
+  lua: `
+    local expireTimeKey = KEYS[1]
+    local headVersionKey = KEYS[2]
+    local expireTime = tonumber(ARGV[1])
+
+    -- Only set the expire time if the project is loaded in Redis
+    local headVersion = redis.call('GET', headVersionKey)
+    if headVersion then
+      redis.call('SET', expireTimeKey, expireTime)
+    end
+  `,
+})
+
+/**
+ * Sets the expire version for a project in Redis
+ *
+ * @param {string} projectId
+ * @param {number} expireTime - Timestamp (ms since epoch) when the project
+ *                 buffer should expire if inactive
+ */
+async function setExpireTime(projectId, expireTime) {
+  try {
+    await rclient.set_expire_time(
+      keySchema.expireTime({ projectId }),
+      keySchema.headVersion({ projectId }),
+      expireTime.toString()
+    )
+    metrics.inc('chunk_store.redis.set_expire_time', 1, { status: 'success' })
+  } catch (err) {
+    metrics.inc('chunk_store.redis.set_expire_time', 1, { status: 'error' })
+    throw err
+  }
+}
+
+rclient.defineCommand('expire_project', {
+  numberOfKeys: 6,
+  lua: `
+    local headKey = KEYS[1]
+    local headVersionKey = KEYS[2]
+    local changesKey = KEYS[3]
+    local persistedVersionKey = KEYS[4]
+    local persistTimeKey = KEYS[5]
+    local expireTimeKey = KEYS[6]
+
+    local headVersion = tonumber(redis.call('GET', headVersionKey))
+    if not headVersion then
+      return 'not-found'
+    end
+
+    local persistedVersion = tonumber(redis.call('GET', persistedVersionKey))
+    if not persistedVersion or persistedVersion ~= headVersion then
+      return 'not-persisted'
+    end
+
+    redis.call('DEL',
+      headKey,
+      headVersionKey,
+      changesKey,
+      persistedVersionKey,
+      persistTimeKey,
+      expireTimeKey
+    )
+    return 'success'
+  `,
+})
+
+async function expireProject(projectId) {
+  try {
+    const status = await rclient.expire_project(
+      keySchema.head({ projectId }),
+      keySchema.headVersion({ projectId }),
+      keySchema.changes({ projectId }),
+      keySchema.persistedVersion({ projectId }),
+      keySchema.persistTime({ projectId }),
+      keySchema.expireTime({ projectId })
+    )
+    metrics.inc('chunk_store.redis.expire_project', 1, {
+      status,
+    })
+    return status
+  } catch (err) {
+    metrics.inc('chunk_store.redis.expire_project', 1, {
+      status: 'error',
+    })
+    throw err
+  }
+}
+
+rclient.defineCommand('claim_job', {
+  numberOfKeys: 1,
+  lua: `
+    local jobTimeKey = KEYS[1]
+    local currentTime = tonumber(ARGV[1])
+    local retryDelay = tonumber(ARGV[2])
+
+    local jobTime = tonumber(redis.call('GET', jobTimeKey))
+    if not jobTime then
+      return {'no-job'}
+    end
+
+    local msUntilReady = jobTime - currentTime
+    if msUntilReady <= 0 then
+      local retryTime = currentTime + retryDelay
+      redis.call('SET', jobTimeKey, retryTime)
+      return {'ok', retryTime}
+    else
+      return {'wait', msUntilReady}
+    end
+  `,
+})
+
+rclient.defineCommand('close_job', {
+  numberOfKeys: 1,
+  lua: `
+    local jobTimeKey = KEYS[1]
+    local expectedJobTime = tonumber(ARGV[1])
+
+    local jobTime = tonumber(redis.call('GET', jobTimeKey))
+    if jobTime and jobTime == expectedJobTime then
+      redis.call('DEL', jobTimeKey)
+    end
+  `,
+})
+
+/**
+ * Claim an expire job
+ *
+ * @param {string} projectId
+ * @return {Promise<Job>}
+ */
+async function claimExpireJob(projectId) {
+  return await claimJob(keySchema.expireTime({ projectId }))
+}
+
+/**
+ * Claim a persist job
+ *
+ * @param {string} projectId
+ * @return {Promise<Job>}
+ */
+async function claimPersistJob(projectId) {
+  return await claimJob(keySchema.persistTime({ projectId }))
+}
+
+/**
+ * Claim a persist or expire job
+ *
+ * @param {string} jobKey - the Redis key containing the time at which the job
+ *                 is ready
+ * @return {Promise<Job>}
+ */
+async function claimJob(jobKey) {
+  let result, status
+  try {
+    result = await rclient.claim_job(jobKey, Date.now(), RETRY_DELAY_MS)
+    status = result[0]
+    metrics.inc('chunk_store.redis.claim_job', 1, { status })
+  } catch (err) {
+    metrics.inc('chunk_store.redis.claim_job', 1, { status: 'error' })
+    throw err
+  }
+
+  if (status === 'ok') {
+    return new Job(jobKey, parseInt(result[1], 10))
+  } else if (status === 'wait') {
+    throw new JobNotReadyError('job not ready', {
+      jobKey,
+      retryTime: result[1],
+    })
+  } else if (status === 'no-job') {
+    throw new JobNotFoundError('job not found', { jobKey })
+  } else {
+    throw new OError('unknown status for claim_job', { jobKey, status })
+  }
+}
+
+/**
+ * Handle for a claimed job
+ */
+class Job {
+  /**
+   * @param {string} redisKey
+   * @param {number} claimTimestamp
+   */
+  constructor(redisKey, claimTimestamp) {
+    this.redisKey = redisKey
+    this.claimTimestamp = claimTimestamp
+  }
+
+  async close() {
+    try {
+      await rclient.close_job(this.redisKey, this.claimTimestamp.toString())
+      metrics.inc('chunk_store.redis.close_job', 1, { status: 'success' })
+    } catch (err) {
+      metrics.inc('chunk_store.redis.close_job', 1, { status: 'error' })
+      throw err
+    }
+  }
+}
+
+module.exports = {
+  getHeadSnapshot,
+  queueChanges,
+  getState,
+  getChangesSinceVersion,
+  getNonPersistedChanges,
+  setPersistedVersion,
+  hardDeleteProject,
+  setExpireTime,
+  expireProject,
+  claimExpireJob,
+  claimPersistJob,
+  MAX_PERSISTED_CHANGES,
+  MAX_PERSIST_DELAY_MS,
+  PROJECT_TTL_MS,
+  RETRY_DELAY_MS,
+  keySchema,
+}
diff --git a/services/history-v1/storage/lib/commit_changes.js b/services/history-v1/storage/lib/commit_changes.js
new file mode 100644
index 0000000000..5749e5fc0e
--- /dev/null
+++ b/services/history-v1/storage/lib/commit_changes.js
@@ -0,0 +1,159 @@
+// @ts-check
+
+'use strict'
+
+const metrics = require('@overleaf/metrics')
+const redisBackend = require('./chunk_store/redis')
+const logger = require('@overleaf/logger')
+const queueChanges = require('./queue_changes')
+const persistChanges = require('./persist_changes')
+const persistBuffer = require('./persist_buffer')
+
+/**
+ * @typedef {import('overleaf-editor-core').Change} Change
+ */
+
+/**
+ * Handle incoming changes by processing them according to the specified options.
+ * @param {string} projectId
+ * @param {Change[]} changes
+ * @param {Object} limits
+ * @param {number} endVersion
+ * @param {Object} options
+ * @param {number} [options.historyBufferLevel] - The history buffer level to use for processing changes.
+ * @param {Boolean} [options.forcePersistBuffer] - If true, forces the buffer to be persisted before any operation.
+ * @return {Promise.<Object?>}
+ */
+
+async function commitChanges(
+  projectId,
+  changes,
+  limits,
+  endVersion,
+  options = {}
+) {
+  const { historyBufferLevel, forcePersistBuffer } = options
+
+  // Force the buffer to be persisted if specified.
+  if (forcePersistBuffer) {
+    try {
+      const status = await redisBackend.expireProject(projectId) // clear the project from Redis if it is persisted, returns 'not-persisted' if it was not persisted
+      if (status === 'not-persisted') {
+        await persistBuffer(projectId, limits)
+        await redisBackend.expireProject(projectId) // clear the project from Redis after persisting
+        metrics.inc('persist_buffer_force', 1, { status: 'persisted' })
+      }
+    } catch (err) {
+      metrics.inc('persist_buffer_force', 1, { status: 'error' })
+      logger.error(
+        { err, projectId },
+        'failed to persist buffer before committing changes'
+      )
+    }
+  }
+
+  metrics.inc('commit_changes', 1, {
+    history_buffer_level: historyBufferLevel || 0,
+  })
+
+  // Now handle the changes based on the configured history buffer level.
+  switch (historyBufferLevel) {
+    case 4: // Queue changes and only persist them in the background
+      await queueChanges(projectId, changes, endVersion)
+      return {}
+    case 3: // Queue changes and immediately persist with persistBuffer
+      await queueChanges(projectId, changes, endVersion)
+      return await persistBuffer(projectId, limits)
+    case 2: // Equivalent to queueChangesInRedis:true
+      await queueChangesFake(projectId, changes, endVersion)
+      return await persistChanges(projectId, changes, limits, endVersion)
+    case 1: // Queue changes with fake persist only for projects in redis already
+      await queueChangesFakeOnlyIfExists(projectId, changes, endVersion)
+      return await persistChanges(projectId, changes, limits, endVersion)
+    case 0: // Persist changes directly to the chunk store
+      return await persistChanges(projectId, changes, limits, endVersion)
+    default:
+      throw new Error(`Invalid history buffer level: ${historyBufferLevel}`)
+  }
+}
+
+/**
+ * Queues a set of changes in redis as if they had been persisted, ignoring any errors.
+ * @param {string} projectId
+ * @param {Change[]} changes
+ * @param {number} endVersion
+ * @param {Object} [options]
+ * @param {boolean} [options.onlyIfExists] - If true, only queue changes if the project
+ * already exists in Redis.
+ */
+
+async function queueChangesFake(projectId, changes, endVersion, options = {}) {
+  try {
+    await queueChanges(projectId, changes, endVersion)
+    await fakePersistRedisChanges(projectId, changes, endVersion)
+  } catch (err) {
+    logger.error({ err }, 'Chunk buffer verification failed')
+  }
+}
+
+/**
+ * Queues changes in Redis, simulating persistence, but only if the project already exists.
+ * @param {string} projectId - The ID of the project.
+ * @param {Change[]} changes - An array of changes to be queued.
+ * @param {number} endVersion - The expected version of the project before these changes are applied.
+ */
+
+async function queueChangesFakeOnlyIfExists(projectId, changes, endVersion) {
+  await queueChangesFake(projectId, changes, endVersion, {
+    onlyIfExists: true,
+  })
+}
+
+/**
+ * Simulates the persistence of changes by verifying a given set of changes against
+ * what is currently stored as non-persisted in Redis, and then updates the
+ * persisted version number in Redis.
+ *
+ * @async
+ * @param {string} projectId - The ID of the project.
+ * @param {Change[]} changesToPersist - An array of changes that are expected to be
+ *                                        persisted. These are used for verification
+ *                                        against the changes currently in Redis.
+ * @param {number} baseVersion - The base version number from which to calculate
+ *                               the new persisted version.
+ * @returns {Promise<void>} A promise that resolves when the persisted version
+ *                          in Redis has been updated.
+ */
+async function fakePersistRedisChanges(
+  projectId,
+  changesToPersist,
+  baseVersion
+) {
+  const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+    projectId,
+    baseVersion
+  )
+
+  if (
+    serializeChanges(nonPersistedChanges) === serializeChanges(changesToPersist)
+  ) {
+    metrics.inc('persist_redis_changes_verification', 1, { status: 'match' })
+  } else {
+    logger.warn({ projectId }, 'mismatch of non-persisted changes from Redis')
+    metrics.inc('persist_redis_changes_verification', 1, {
+      status: 'mismatch',
+    })
+  }
+
+  const persistedVersion = baseVersion + nonPersistedChanges.length
+  await redisBackend.setPersistedVersion(projectId, persistedVersion)
+}
+
+/**
+ * @param {Change[]} changes
+ */
+function serializeChanges(changes) {
+  return JSON.stringify(changes.map(change => change.toRaw()))
+}
+
+module.exports = commitChanges
diff --git a/services/history-v1/storage/lib/history_store.js b/services/history-v1/storage/lib/history_store.js
index d16820d74c..e51bdc25c5 100644
--- a/services/history-v1/storage/lib/history_store.js
+++ b/services/history-v1/storage/lib/history_store.js
@@ -25,8 +25,8 @@ const gunzip = promisify(zlib.gunzip)
 
 class LoadError extends OError {
   /**
-   * @param {number|string} projectId
-   * @param {number|string} chunkId
+   * @param {string} projectId
+   * @param {string} chunkId
    * @param {any} cause
    */
   constructor(projectId, chunkId, cause) {
@@ -42,8 +42,8 @@ class LoadError extends OError {
 
 class StoreError extends OError {
   /**
-   * @param {number|string} projectId
-   * @param {number|string} chunkId
+   * @param {string} projectId
+   * @param {string} chunkId
    * @param {any} cause
    */
   constructor(projectId, chunkId, cause) {
@@ -58,8 +58,8 @@ class StoreError extends OError {
 }
 
 /**
- * @param {number|string} projectId
- * @param {number|string} chunkId
+ * @param {string} projectId
+ * @param {string} chunkId
  * @return {string}
  */
 function getKey(projectId, chunkId) {
@@ -89,8 +89,8 @@ class HistoryStore {
   /**
    * Load the raw object for a History.
    *
-   * @param {number|string} projectId
-   * @param {number|string} chunkId
+   * @param {string} projectId
+   * @param {string} chunkId
    * @return {Promise<import('overleaf-editor-core/lib/types').RawHistory>}
    */
   async loadRaw(projectId, chunkId) {
@@ -144,8 +144,8 @@ class HistoryStore {
   /**
    * Compress and store a {@link History}.
    *
-   * @param {number|string} projectId
-   * @param {number|string} chunkId
+   * @param {string} projectId
+   * @param {string} chunkId
    * @param {import('overleaf-editor-core/lib/types').RawHistory} rawHistory
    */
   async storeRaw(projectId, chunkId, rawHistory) {
diff --git a/services/history-v1/storage/lib/knex.js b/services/history-v1/storage/lib/knex.js
index 5cdc85e2ab..7000fe034c 100644
--- a/services/history-v1/storage/lib/knex.js
+++ b/services/history-v1/storage/lib/knex.js
@@ -1,6 +1,8 @@
+// @ts-check
+
 'use strict'
 
 const env = process.env.NODE_ENV || 'development'
 
 const knexfile = require('../../knexfile')
-module.exports = require('knex')(knexfile[env])
+module.exports = require('knex').default(knexfile[env])
diff --git a/services/history-v1/storage/lib/persist_buffer.js b/services/history-v1/storage/lib/persist_buffer.js
new file mode 100644
index 0000000000..68b71e148f
--- /dev/null
+++ b/services/history-v1/storage/lib/persist_buffer.js
@@ -0,0 +1,237 @@
+// @ts-check
+'use strict'
+
+const logger = require('@overleaf/logger')
+const metrics = require('@overleaf/metrics')
+const OError = require('@overleaf/o-error')
+const assert = require('./assert')
+const chunkStore = require('./chunk_store')
+const { BlobStore } = require('./blob_store')
+const BatchBlobStore = require('./batch_blob_store')
+const persistChanges = require('./persist_changes')
+const resyncProject = require('./resync_project')
+const redisBackend = require('./chunk_store/redis')
+
+const PERSIST_BATCH_SIZE = 50
+
+/**
+ * Persist the changes from Redis buffer to the main storage
+ *
+ * Algorithm Outline:
+ * 1. Get the latest chunk's endVersion from the database
+ * 2. Get non-persisted changes from Redis that are after this endVersion.
+ * 3. If no such changes, exit.
+ * 4. Load file blobs for these Redis changes.
+ * 5. Run the persistChanges() algorithm to store these changes into a new chunk(s) in GCS.
+ *    - This must not decrease the endVersion. If changes were processed, it must advance.
+ * 6. Set the new persisted version (endVersion of the latest persisted chunk) in Redis.
+ *
+ * @param {string} projectId
+ * @param {Object} limits
+ * @throws {Error | OError} If a critical error occurs during persistence.
+ */
+async function persistBuffer(projectId, limits) {
+  assert.projectId(projectId)
+  logger.debug({ projectId }, 'starting persistBuffer operation')
+
+  // 1. Get the latest chunk's endVersion from GCS/main store
+  let endVersion
+  const latestChunkMetadata = await chunkStore.getLatestChunkMetadata(projectId)
+
+  if (latestChunkMetadata) {
+    endVersion = latestChunkMetadata.endVersion
+  } else {
+    endVersion = 0 // No chunks found, start from version 0
+    logger.debug({ projectId }, 'no existing chunks found in main storage')
+  }
+  const originalEndVersion = endVersion
+
+  logger.debug({ projectId, endVersion }, 'got latest persisted chunk')
+
+  // Process changes in batches
+  let numberOfChangesPersisted = 0
+  let currentChunk = null
+  let resyncNeeded = false
+  let resyncChangesWerePersisted = false
+  while (true) {
+    // 2. Get non-persisted changes from Redis
+    const changesToPersist = await redisBackend.getNonPersistedChanges(
+      projectId,
+      endVersion,
+      { maxChanges: PERSIST_BATCH_SIZE }
+    )
+
+    if (changesToPersist.length === 0) {
+      break
+    }
+
+    logger.debug(
+      {
+        projectId,
+        endVersion,
+        count: changesToPersist.length,
+      },
+      'found changes in Redis to persist'
+    )
+
+    // 4. Load file blobs for these Redis changes. Errors will propagate.
+    const blobStore = new BlobStore(projectId)
+    const batchBlobStore = new BatchBlobStore(blobStore)
+
+    const blobHashes = new Set()
+    for (const change of changesToPersist) {
+      change.findBlobHashes(blobHashes)
+    }
+    if (blobHashes.size > 0) {
+      await batchBlobStore.preload(Array.from(blobHashes))
+    }
+    for (const change of changesToPersist) {
+      await change.loadFiles('lazy', blobStore)
+    }
+
+    // 5. Run the persistChanges() algorithm. Errors will propagate.
+    logger.debug(
+      {
+        projectId,
+        endVersion,
+        changeCount: changesToPersist.length,
+      },
+      'calling persistChanges'
+    )
+
+    const persistResult = await persistChanges(
+      projectId,
+      changesToPersist,
+      limits,
+      endVersion
+    )
+
+    if (!persistResult || !persistResult.currentChunk) {
+      metrics.inc('persist_buffer', 1, { status: 'no-chunk-error' })
+      throw new OError(
+        'persistChanges did not produce a new chunk for non-empty changes',
+        {
+          projectId,
+          endVersion,
+          changeCount: changesToPersist.length,
+        }
+      )
+    }
+
+    currentChunk = persistResult.currentChunk
+    const newEndVersion = currentChunk.getEndVersion()
+
+    if (newEndVersion <= endVersion) {
+      metrics.inc('persist_buffer', 1, { status: 'chunk-version-mismatch' })
+      throw new OError(
+        'persisted chunk endVersion must be greater than current persisted chunk end version for non-empty changes',
+        {
+          projectId,
+          newEndVersion,
+          endVersion,
+          changeCount: changesToPersist.length,
+        }
+      )
+    }
+
+    logger.debug(
+      {
+        projectId,
+        oldVersion: endVersion,
+        newVersion: newEndVersion,
+      },
+      'successfully persisted changes from Redis to main storage'
+    )
+
+    // 6. Set the persisted version in Redis. Errors will propagate.
+    const status = await redisBackend.setPersistedVersion(
+      projectId,
+      newEndVersion
+    )
+
+    if (status !== 'ok') {
+      metrics.inc('persist_buffer', 1, { status: 'error-on-persisted-version' })
+      throw new OError('failed to update persisted version in Redis', {
+        projectId,
+        newEndVersion,
+        status,
+      })
+    }
+
+    logger.debug(
+      { projectId, newEndVersion },
+      'updated persisted version in Redis'
+    )
+    numberOfChangesPersisted += persistResult.numberOfChangesPersisted
+    endVersion = newEndVersion
+
+    // Check if a resync might be needed
+    if (persistResult.resyncNeeded) {
+      resyncNeeded = true
+    }
+
+    if (
+      changesToPersist.some(
+        change => change.getOrigin()?.getKind() === 'history-resync'
+      )
+    ) {
+      resyncChangesWerePersisted = true
+    }
+
+    if (persistResult.numberOfChangesPersisted < PERSIST_BATCH_SIZE) {
+      // We reached the end of available changes
+      break
+    }
+  }
+
+  if (numberOfChangesPersisted === 0) {
+    logger.debug(
+      { projectId, endVersion },
+      'no new changes in Redis buffer to persist'
+    )
+    metrics.inc('persist_buffer', 1, { status: 'no_changes' })
+    // No changes to persist, update the persisted version in Redis
+    // to match the current endVersion.  This shouldn't be needed
+    // unless a worker failed to update the persisted version.
+    await redisBackend.setPersistedVersion(projectId, endVersion)
+  } else {
+    logger.debug(
+      { projectId, finalPersistedVersion: endVersion },
+      'persistBuffer operation completed successfully'
+    )
+    metrics.inc('persist_buffer', 1, { status: 'persisted' })
+  }
+
+  if (limits.autoResync && resyncNeeded) {
+    if (resyncChangesWerePersisted) {
+      // To avoid an infinite loop, do not resync if the current batch of
+      // changes contains a history resync.
+      logger.warn(
+        { projectId },
+        'content hash validation failed while persisting a history resync, skipping additional resync'
+      )
+    } else {
+      const backend = chunkStore.getBackend(projectId)
+      const mongoProjectId =
+        await backend.resolveHistoryIdToMongoProjectId(projectId)
+      await resyncProject(mongoProjectId)
+    }
+  }
+
+  if (currentChunk == null) {
+    const { chunk } = await chunkStore.loadByChunkRecord(
+      projectId,
+      latestChunkMetadata
+    )
+    currentChunk = chunk
+  }
+
+  return {
+    numberOfChangesPersisted,
+    originalEndVersion,
+    currentChunk,
+    resyncNeeded,
+  }
+}
+
+module.exports = persistBuffer
diff --git a/services/history-v1/storage/lib/persist_changes.js b/services/history-v1/storage/lib/persist_changes.js
index 8a848aa214..d2ca00053f 100644
--- a/services/history-v1/storage/lib/persist_changes.js
+++ b/services/history-v1/storage/lib/persist_changes.js
@@ -80,6 +80,7 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
 
   let originalEndVersion
   let changesToPersist
+  let resyncNeeded = false
 
   limits = limits || {}
   _.defaults(limits, {
@@ -164,12 +165,14 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
         const actualHash = content != null ? getContentHash(content) : null
         logger.debug({ expectedHash, actualHash }, 'validating content hash')
         if (actualHash !== expectedHash) {
-          throw new InvalidChangeError('content hash mismatch', {
-            projectId,
-            path,
-            expectedHash,
-            actualHash,
-          })
+          // only log a warning on the first mismatch in each persistChanges call
+          if (!resyncNeeded) {
+            logger.warn(
+              { projectId, path, expectedHash, actualHash },
+              'content hash mismatch'
+            )
+          }
+          resyncNeeded = true
         }
 
         // Remove the content hash from the change before storing it in the chunk.
@@ -179,8 +182,10 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
     }
   }
 
-  async function extendLastChunkIfPossible() {
-    const latestChunk = await chunkStore.loadLatest(projectId)
+  async function loadLatestChunk() {
+    const latestChunk = await chunkStore.loadLatest(projectId, {
+      persistedOnly: true,
+    })
 
     currentChunk = latestChunk
     originalEndVersion = latestChunk.getEndVersion()
@@ -192,9 +197,11 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
     }
 
     currentSnapshot = latestChunk.getSnapshot().clone()
-    const timer = new Timer()
-    currentSnapshot.applyAll(latestChunk.getChanges())
+    currentSnapshot.applyAll(currentChunk.getChanges())
+  }
 
+  async function extendLastChunkIfPossible() {
+    const timer = new Timer()
     const changesPushed = await fillChunk(currentChunk, changesToPersist)
     if (!changesPushed) {
       return
@@ -202,12 +209,7 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
 
     checkElapsedTime(timer)
 
-    await chunkStore.update(
-      projectId,
-      originalEndVersion,
-      currentChunk,
-      earliestChangeTimestamp
-    )
+    await chunkStore.update(projectId, currentChunk, earliestChangeTimestamp)
   }
 
   async function createNewChunksAsNeeded() {
@@ -245,6 +247,7 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
     changesToPersist = oldChanges
     const numberOfChangesToPersist = oldChanges.length
 
+    await loadLatestChunk()
     await extendLastChunkIfPossible()
     await createNewChunksAsNeeded()
 
@@ -252,6 +255,7 @@ async function persistChanges(projectId, allChanges, limits, clientEndVersion) {
       numberOfChangesPersisted: numberOfChangesToPersist,
       originalEndVersion,
       currentChunk,
+      resyncNeeded,
     }
   } else {
     return null
diff --git a/services/history-v1/storage/lib/queue_changes.js b/services/history-v1/storage/lib/queue_changes.js
new file mode 100644
index 0000000000..6b8d4b22b4
--- /dev/null
+++ b/services/history-v1/storage/lib/queue_changes.js
@@ -0,0 +1,75 @@
+// @ts-check
+
+'use strict'
+
+const redisBackend = require('./chunk_store/redis')
+const { BlobStore } = require('./blob_store')
+const chunkStore = require('./chunk_store')
+const core = require('overleaf-editor-core')
+const Chunk = core.Chunk
+
+/**
+ * Queues an incoming set of changes after validating them against the current snapshot.
+ *
+ * @async
+ * @function queueChanges
+ * @param {string} projectId - The project to queue changes for.
+ * @param {Array<Object>} changesToQueue - An array of change objects to be applied and queued.
+ * @param {number} endVersion - The expected version of the project before these changes are applied.
+ *                              This is used for optimistic concurrency control.
+ * @param {Object} [opts] - Additional options for queuing changes.
+ * @throws {Chunk.ConflictingEndVersion} If the provided `endVersion` does not match the
+ *                                       current version of the project.
+ * @returns {Promise<any>} A promise that resolves with the status returned by the
+ *                         `redisBackend.queueChanges` operation.
+ */
+async function queueChanges(projectId, changesToQueue, endVersion, opts) {
+  const result = await redisBackend.getHeadSnapshot(projectId)
+  let currentSnapshot = null
+  let currentVersion = null
+  if (result) {
+    // If we have a snapshot in redis, we can use it to check the current state
+    // of the project and apply changes to it.
+    currentSnapshot = result.snapshot
+    currentVersion = result.version
+  } else {
+    // Otherwise, load the latest chunk from the chunk store.
+    const latestChunk = await chunkStore.loadLatest(projectId, {
+      persistedOnly: true,
+    })
+    // Throw an error if no latest chunk is found, indicating the project has not been initialised.
+    if (!latestChunk) {
+      throw new Chunk.NotFoundError(projectId)
+    }
+    currentSnapshot = latestChunk.getSnapshot()
+    currentSnapshot.applyAll(latestChunk.getChanges())
+    currentVersion = latestChunk.getEndVersion()
+  }
+
+  // Ensure the endVersion matches the current version of the project.
+  if (endVersion !== currentVersion) {
+    throw new Chunk.ConflictingEndVersion(endVersion, currentVersion)
+  }
+
+  // Compute the new hollow snapshot to be saved to redis.
+  const hollowSnapshot = currentSnapshot
+  const blobStore = new BlobStore(projectId)
+  await hollowSnapshot.loadFiles('hollow', blobStore)
+  // Clone the changes to avoid modifying the original ones when computing the hollow snapshot.
+  const hollowChanges = changesToQueue.map(change => change.clone())
+  for (const change of hollowChanges) {
+    await change.loadFiles('hollow', blobStore)
+  }
+  hollowSnapshot.applyAll(hollowChanges, { strict: true })
+  const baseVersion = currentVersion
+  const status = await redisBackend.queueChanges(
+    projectId,
+    hollowSnapshot,
+    baseVersion,
+    changesToQueue,
+    opts
+  )
+  return status
+}
+
+module.exports = queueChanges
diff --git a/services/history-v1/storage/lib/redis.js b/services/history-v1/storage/lib/redis.js
new file mode 100644
index 0000000000..9b00cc0a26
--- /dev/null
+++ b/services/history-v1/storage/lib/redis.js
@@ -0,0 +1,19 @@
+const config = require('config')
+const redis = require('@overleaf/redis-wrapper')
+
+const historyRedisOptions = config.get('redis.history')
+const rclientHistory = redis.createClient(historyRedisOptions)
+
+const lockRedisOptions = config.get('redis.history')
+const rclientLock = redis.createClient(lockRedisOptions)
+
+async function disconnect() {
+  await Promise.all([rclientHistory.disconnect(), rclientLock.disconnect()])
+}
+
+module.exports = {
+  rclientHistory,
+  rclientLock,
+  redis,
+  disconnect,
+}
diff --git a/services/history-v1/storage/lib/resync_project.js b/services/history-v1/storage/lib/resync_project.js
new file mode 100644
index 0000000000..3ec680bb5b
--- /dev/null
+++ b/services/history-v1/storage/lib/resync_project.js
@@ -0,0 +1,14 @@
+// @ts-check
+
+const config = require('config')
+const { fetchNothing } = require('@overleaf/fetch-utils')
+
+const PROJECT_HISTORY_URL = `http://${config.projectHistory.host}:${config.projectHistory.port}`
+
+async function resyncProject(projectId) {
+  await fetchNothing(`${PROJECT_HISTORY_URL}/project/${projectId}/resync`, {
+    method: 'POST',
+  })
+}
+
+module.exports = resyncProject
diff --git a/services/history-v1/storage/lib/scan.js b/services/history-v1/storage/lib/scan.js
new file mode 100644
index 0000000000..d55f5362c1
--- /dev/null
+++ b/services/history-v1/storage/lib/scan.js
@@ -0,0 +1,202 @@
+// @ts-check
+
+'use strict'
+
+const logger = require('@overleaf/logger')
+const { JobNotFoundError, JobNotReadyError } = require('./chunk_store/errors')
+const BATCH_SIZE = 1000 // Default batch size for SCAN
+
+/**
+ * Asynchronously scans a Redis instance or cluster for keys matching a pattern.
+ *
+ * This function handles both standalone Redis instances and Redis clusters.
+ * For clusters, it iterates over all master nodes. It yields keys in batches
+ * as they are found by the SCAN command.
+ *
+ * @param {object} redisClient - The Redis client instance (from @overleaf/redis-wrapper).
+ * @param {string} pattern - The pattern to match keys against (e.g., 'user:*').
+ * @param {number} [count=BATCH_SIZE] - Optional hint for Redis SCAN count per iteration.
+ * @yields {string[]} A batch of matching keys.
+ */
+async function* scanRedisCluster(redisClient, pattern, count = BATCH_SIZE) {
+  const nodes = redisClient.nodes ? redisClient.nodes('master') : [redisClient]
+
+  for (const node of nodes) {
+    let cursor = '0'
+    do {
+      // redisClient from @overleaf/redis-wrapper uses ioredis style commands
+      const [nextCursor, keys] = await node.scan(
+        cursor,
+        'MATCH',
+        pattern,
+        'COUNT',
+        count
+      )
+      cursor = nextCursor
+      if (keys.length > 0) {
+        yield keys
+      }
+    } while (cursor !== '0')
+  }
+}
+
+/**
+ * Extracts the content within the first pair of curly braces {} from a string.
+ * This is used to extract a user ID or project ID from a Redis key.
+ *
+ * @param {string} key - The input string containing content within curly braces.
+ * @returns {string | null} The extracted content (the key ID) if found, otherwise null.
+ */
+function extractKeyId(key) {
+  const match = key.match(/\{(.*?)\}/)
+  if (match && match[1]) {
+    return match[1]
+  }
+  return null
+}
+
+/**
+ * Fetches timestamps for a list of project IDs based on a given key name.
+ *
+ * @param {string[]} projectIds - Array of project identifiers.
+ * @param {object} rclient - The Redis client instance.
+ * @param {string} keyName - The base name for the Redis keys storing the timestamps (e.g., "expire-time", "persist-time").
+ * @param {number} currentTime - The current time (timestamp in milliseconds) to compare against.
+ * @returns {Promise<Array<{projectId: string, timestampValue: string}>>}
+ *           A promise that resolves to an array of objects, each containing a projectId and
+ *           its corresponding timestampValue, for due projects only.
+ */
+async function fetchOverdueProjects(projectIds, rclient, keyName, currentTime) {
+  if (!projectIds || projectIds.length === 0) {
+    return []
+  }
+  const timestampKeys = projectIds.map(id => `${keyName}:{${id}}`)
+  const timestamps = await rclient.mget(timestampKeys)
+
+  const dueProjects = []
+  for (let i = 0; i < projectIds.length; i++) {
+    const projectId = projectIds[i]
+    const timestampValue = timestamps[i]
+
+    if (timestampValue !== null) {
+      const timestamp = parseInt(timestampValue, 10)
+      if (!isNaN(timestamp) && currentTime > timestamp) {
+        dueProjects.push({ projectId, timestampValue })
+      }
+    }
+  }
+  return dueProjects
+}
+
+/**
+ * Scans Redis for keys matching a pattern derived from keyName, identifies items that are "due" based on a timestamp,
+ * and performs a specified action on them.
+ *
+ * @param {object} rclient - The Redis client instance.
+ * @param {string} taskName - A descriptive name for the task (used in logging).
+ * @param {string} keyName - The base name for the Redis keys (e.g., "expire-time", "persist-time").
+ *                           The function will derive the key prefix as `${keyName}:` and scan pattern as `${keyName}:{*}`.
+ * @param {function(string): Promise<void>} actionFn - An async function that takes a projectId and performs an action.
+ * @param {boolean} DRY_RUN - If true, logs actions that would be taken without performing them.
+ * @returns {Promise<{scannedKeyCount: number, processedKeyCount: number}>} Counts of scanned and processed keys.
+ */
+async function scanAndProcessDueItems(
+  rclient,
+  taskName,
+  keyName,
+  actionFn,
+  DRY_RUN
+) {
+  let scannedKeyCount = 0
+  let processedKeyCount = 0
+  const START_TIME = Date.now()
+  const logContext = { taskName, dryRun: DRY_RUN }
+
+  const scanPattern = `${keyName}:{*}`
+
+  if (DRY_RUN) {
+    logger.info(logContext, `Starting ${taskName} scan in DRY RUN mode`)
+  } else {
+    logger.info(logContext, `Starting ${taskName} scan`)
+  }
+
+  for await (const keysBatch of scanRedisCluster(rclient, scanPattern)) {
+    scannedKeyCount += keysBatch.length
+    const projectIds = keysBatch.map(extractKeyId).filter(id => id != null)
+
+    if (projectIds.length === 0) {
+      continue
+    }
+
+    const currentTime = Date.now()
+    const overdueProjects = await fetchOverdueProjects(
+      projectIds,
+      rclient,
+      keyName,
+      currentTime
+    )
+
+    for (const project of overdueProjects) {
+      const { projectId } = project
+      if (DRY_RUN) {
+        logger.info(
+          { ...logContext, projectId },
+          `[Dry Run] Would perform ${taskName} for project`
+        )
+      } else {
+        try {
+          await actionFn(projectId)
+          logger.debug(
+            { ...logContext, projectId },
+            `Successfully performed ${taskName} for project`
+          )
+        } catch (err) {
+          if (err instanceof JobNotReadyError) {
+            // the project has been touched since the job was created
+            logger.info(
+              { ...logContext, projectId },
+              `Job not ready for ${taskName} for project`
+            )
+          } else if (err instanceof JobNotFoundError) {
+            // the project has been expired already by another worker
+            logger.info(
+              { ...logContext, projectId },
+              `Job not found for ${taskName} for project`
+            )
+          } else {
+            logger.error(
+              { ...logContext, projectId, err },
+              `Error performing ${taskName} for project`
+            )
+          }
+          continue
+        }
+      }
+      processedKeyCount++
+
+      if (processedKeyCount % 1000 === 0 && processedKeyCount > 0) {
+        logger.info(
+          { ...logContext, scannedKeyCount, processedKeyCount },
+          `${taskName} scan progress`
+        )
+      }
+    }
+  }
+
+  logger.info(
+    {
+      ...logContext,
+      scannedKeyCount,
+      processedKeyCount,
+      elapsedTimeInSeconds: Math.floor((Date.now() - START_TIME) / 1000),
+    },
+    `${taskName} scan complete`
+  )
+  return { scannedKeyCount, processedKeyCount }
+}
+
+module.exports = {
+  scanRedisCluster,
+  extractKeyId,
+  scanAndProcessDueItems,
+}
diff --git a/services/history-v1/storage/scripts/back_fill_file_hash.mjs b/services/history-v1/storage/scripts/back_fill_file_hash.mjs
index 96dfd79e38..2e12328e5c 100644
--- a/services/history-v1/storage/scripts/back_fill_file_hash.mjs
+++ b/services/history-v1/storage/scripts/back_fill_file_hash.mjs
@@ -1,28 +1,20 @@
 // @ts-check
-import Crypto from 'node:crypto'
 import Events from 'node:events'
 import fs from 'node:fs'
 import Path from 'node:path'
 import { performance } from 'node:perf_hooks'
 import Stream from 'node:stream'
-import zLib from 'node:zlib'
 import { setTimeout } from 'node:timers/promises'
-import { Binary, ObjectId } from 'mongodb'
+import { ObjectId } from 'mongodb'
 import pLimit from 'p-limit'
 import logger from '@overleaf/logger'
 import {
   batchedUpdate,
   objectIdFromInput,
   renderObjectId,
-  READ_PREFERENCE_SECONDARY,
 } from '@overleaf/mongo-utils/batchedUpdate.js'
 import OError from '@overleaf/o-error'
-import {
-  AlreadyWrittenError,
-  NoKEKMatchedError,
-  NotFoundError,
-} from '@overleaf/object-persistor/src/Errors.js'
-import { backupPersistor, projectBlobsBucket } from '../lib/backupPersistor.mjs'
+import { NotFoundError } from '@overleaf/object-persistor/src/Errors.js'
 import {
   BlobStore,
   GLOBAL_BLOBS,
@@ -30,10 +22,8 @@ import {
   getProjectBlobsBatch,
   getStringLengthOfFile,
   makeBlobForFile,
-  makeProjectKey,
 } from '../lib/blob_store/index.js'
-import { backedUpBlobs as backedUpBlobsCollection, db } from '../lib/mongodb.js'
-import filestorePersistor from '../lib/persistor.js'
+import { db } from '../lib/mongodb.js'
 import commandLineArgs from 'command-line-args'
 import readline from 'node:readline'
 
@@ -89,18 +79,16 @@ ObjectId.cacheHexString = true
  */
 
 /**
- * @return {{PROJECT_IDS_FROM: string, PROCESS_HASHED_FILES: boolean, PROCESS_DELETED_FILES: boolean, LOGGING_IDENTIFIER: string, BATCH_RANGE_START: string, PROCESS_BLOBS: boolean, BATCH_RANGE_END: string, PROCESS_NON_DELETED_PROJECTS: boolean, PROCESS_DELETED_PROJECTS: boolean, COLLECT_BACKED_UP_BLOBS: boolean}}
+ * @return {{PROJECT_IDS_FROM: string, PROCESS_HASHED_FILES: boolean, LOGGING_IDENTIFIER: string, BATCH_RANGE_START: string, PROCESS_BLOBS: boolean, BATCH_RANGE_END: string, PROCESS_NON_DELETED_PROJECTS: boolean, PROCESS_DELETED_PROJECTS: boolean}}
  */
 function parseArgs() {
   const PUBLIC_LAUNCH_DATE = new Date('2012-01-01T00:00:00Z')
   const args = commandLineArgs([
     { name: 'processNonDeletedProjects', type: String, defaultValue: 'false' },
     { name: 'processDeletedProjects', type: String, defaultValue: 'false' },
-    { name: 'processDeletedFiles', type: String, defaultValue: 'false' },
     { name: 'processHashedFiles', type: String, defaultValue: 'false' },
     { name: 'processBlobs', type: String, defaultValue: 'true' },
     { name: 'projectIdsFrom', type: String, defaultValue: '' },
-    { name: 'collectBackedUpBlobs', type: String, defaultValue: 'true' },
     {
       name: 'BATCH_RANGE_START',
       type: String,
@@ -131,9 +119,7 @@ function parseArgs() {
     PROCESS_NON_DELETED_PROJECTS: boolVal('processNonDeletedProjects'),
     PROCESS_DELETED_PROJECTS: boolVal('processDeletedProjects'),
     PROCESS_BLOBS: boolVal('processBlobs'),
-    PROCESS_DELETED_FILES: boolVal('processDeletedFiles'),
     PROCESS_HASHED_FILES: boolVal('processHashedFiles'),
-    COLLECT_BACKED_UP_BLOBS: boolVal('collectBackedUpBlobs'),
     BATCH_RANGE_START,
     BATCH_RANGE_END,
     LOGGING_IDENTIFIER: args['LOGGING_IDENTIFIER'] || BATCH_RANGE_START,
@@ -145,9 +131,7 @@ const {
   PROCESS_NON_DELETED_PROJECTS,
   PROCESS_DELETED_PROJECTS,
   PROCESS_BLOBS,
-  PROCESS_DELETED_FILES,
   PROCESS_HASHED_FILES,
-  COLLECT_BACKED_UP_BLOBS,
   BATCH_RANGE_START,
   BATCH_RANGE_END,
   LOGGING_IDENTIFIER,
@@ -166,10 +150,6 @@ const CONCURRENT_BATCHES = parseInt(process.env.CONCURRENT_BATCHES || '2', 10)
 const RETRIES = parseInt(process.env.RETRIES || '10', 10)
 const RETRY_DELAY_MS = parseInt(process.env.RETRY_DELAY_MS || '100', 10)
 
-const USER_FILES_BUCKET_NAME = process.env.USER_FILES_BUCKET_NAME || ''
-if (!USER_FILES_BUCKET_NAME) {
-  throw new Error('env var USER_FILES_BUCKET_NAME is missing')
-}
 const RETRY_FILESTORE_404 = process.env.RETRY_FILESTORE_404 === 'true'
 const BUFFER_DIR = fs.mkdtempSync(
   process.env.BUFFER_DIR_PREFIX || '/tmp/back_fill_file_hash-'
@@ -182,13 +162,43 @@ const STREAM_HIGH_WATER_MARK = parseInt(
 const LOGGING_INTERVAL = parseInt(process.env.LOGGING_INTERVAL || '60000', 10)
 const SLEEP_BEFORE_EXIT = parseInt(process.env.SLEEP_BEFORE_EXIT || '1000', 10)
 
+// Filestore endpoint location
+const FILESTORE_HOST = process.env.FILESTORE_HOST || '127.0.0.1'
+const FILESTORE_PORT = process.env.FILESTORE_PORT || '3009'
+
+async function fetchFromFilestore(projectId, fileId) {
+  const url = `http://${FILESTORE_HOST}:${FILESTORE_PORT}/project/${projectId}/file/${fileId}`
+  const response = await fetch(url)
+  if (!response.ok) {
+    if (response.status === 404) {
+      throw new NotFoundError('file not found in filestore', {
+        status: response.status,
+      })
+    }
+    const body = await response.text()
+    throw new OError('fetchFromFilestore failed', {
+      projectId,
+      fileId,
+      status: response.status,
+      body,
+    })
+  }
+  if (!response.body) {
+    throw new OError('fetchFromFilestore response has no body', {
+      projectId,
+      fileId,
+      status: response.status,
+    })
+  }
+  return response.body
+}
+
 const projectsCollection = db.collection('projects')
 /** @type {ProjectsCollection} */
 const typedProjectsCollection = db.collection('projects')
 const deletedProjectsCollection = db.collection('deletedProjects')
 /** @type {DeletedProjectsCollection} */
 const typedDeletedProjectsCollection = db.collection('deletedProjects')
-const deletedFilesCollection = db.collection('deletedFiles')
 
 const concurrencyLimit = pLimit(CONCURRENCY)
 
@@ -206,7 +216,6 @@ async function processConcurrently(array, fn) {
 const STATS = {
   projects: 0,
   blobs: 0,
-  backedUpBlobs: 0,
   filesWithHash: 0,
   filesWithoutHash: 0,
   filesDuplicated: 0,
@@ -220,14 +229,8 @@ const STATS = {
   projectHardDeleted: 0,
   fileHardDeleted: 0,
   mongoUpdates: 0,
-  deduplicatedWriteToAWSLocalCount: 0,
-  deduplicatedWriteToAWSLocalEgress: 0,
-  deduplicatedWriteToAWSRemoteCount: 0,
-  deduplicatedWriteToAWSRemoteEgress: 0,
   readFromGCSCount: 0,
   readFromGCSIngress: 0,
-  writeToAWSCount: 0,
-  writeToAWSEgress: 0,
   writeToGCSCount: 0,
   writeToGCSEgress: 0,
 }
@@ -249,7 +252,7 @@ function toMiBPerSecond(v, ms) {
 /**
  * @param {any} stats
  * @param {number} ms
- * @return {{writeToAWSThroughputMiBPerSecond: number, readFromGCSThroughputMiBPerSecond: number}}
+ * @return {{readFromGCSThroughputMiBPerSecond: number}}
  */
 function bandwidthStats(stats, ms) {
   return {
@@ -257,10 +260,6 @@ function bandwidthStats(stats, ms) {
       stats.readFromGCSIngress,
       ms
     ),
-    writeToAWSThroughputMiBPerSecond: toMiBPerSecond(
-      stats.writeToAWSEgress,
-      ms
-    ),
   }
 }
 
@@ -352,14 +351,10 @@ async function processFile(entry, filePath) {
     } catch (err) {
       if (gracefulShutdownInitiated) throw err
       if (err instanceof NotFoundError) {
-        const { bucketName } = OError.getFullInfo(err)
-        if (bucketName === USER_FILES_BUCKET_NAME && !RETRY_FILESTORE_404) {
+        if (!RETRY_FILESTORE_404) {
           throw err // disable retries for not found in filestore bucket case
         }
       }
-      if (err instanceof NoKEKMatchedError) {
-        throw err // disable retries when upload to S3 will fail again
-      }
       STATS.filesRetries++
       const {
         ctx: { projectId },
@@ -388,42 +383,17 @@ async function processFileOnce(entry, filePath) {
     ctx: { projectId, historyId },
     fileId,
   } = entry
-  const blobStore = new BlobStore(historyId)
-  if (entry.blob) {
-    const { blob } = entry
-    const hash = blob.getHash()
-    if (entry.ctx.hasBackedUpBlob(hash)) {
-      STATS.deduplicatedWriteToAWSLocalCount++
-      STATS.deduplicatedWriteToAWSLocalEgress += estimateBlobSize(blob)
-      return hash
-    }
-    entry.ctx.recordPendingBlob(hash)
-    STATS.readFromGCSCount++
-    const src = await blobStore.getStream(hash)
-    const dst = fs.createWriteStream(filePath, {
-      highWaterMark: STREAM_HIGH_WATER_MARK,
-    })
-    try {
-      await Stream.promises.pipeline(src, dst)
-    } finally {
-      STATS.readFromGCSIngress += dst.bytesWritten
-    }
-    await uploadBlobToAWS(entry, blob, filePath)
-    return hash
-  }
-  if (entry.hash && entry.ctx.hasBackedUpBlob(entry.hash)) {
-    STATS.deduplicatedWriteToAWSLocalCount++
-    const blob = entry.ctx.getCachedHistoryBlob(entry.hash)
-    // blob might not exist on re-run with --PROCESS_BLOBS=false
-    if (blob) STATS.deduplicatedWriteToAWSLocalEgress += estimateBlobSize(blob)
+  if (entry.hash && entry.ctx.hasCompletedBlob(entry.hash)) {
+    // We can enter this case for two identical files in the same project,
+    // one with hash, the other without. When the one without hash gets
+    // processed first, we can skip downloading the other one we already
+    // know the hash of.
     return entry.hash
   }
-
+  const blobStore = new BlobStore(historyId)
   STATS.readFromGCSCount++
-  const src = await filestorePersistor.getObjectStream(
-    USER_FILES_BUCKET_NAME,
-    `${projectId}/${fileId}`
-  )
+  // make a fetch request to filestore itself
+  const src = await fetchFromFilestore(projectId, fileId)
   const dst = fs.createWriteStream(filePath, {
     highWaterMark: STREAM_HIGH_WATER_MARK,
   })
@@ -446,16 +416,14 @@ async function processFileOnce(entry, filePath) {
     STATS.globalBlobsEgress += estimateBlobSize(blob)
     return hash
   }
-  if (entry.ctx.hasBackedUpBlob(hash)) {
-    STATS.deduplicatedWriteToAWSLocalCount++
-    STATS.deduplicatedWriteToAWSLocalEgress += estimateBlobSize(blob)
+  if (entry.ctx.hasCompletedBlob(hash)) {
     return hash
   }
   entry.ctx.recordPendingBlob(hash)
 
   try {
     await uploadBlobToGCS(blobStore, entry, blob, hash, filePath)
-    await uploadBlobToAWS(entry, blob, filePath)
+    entry.ctx.recordCompletedBlob(hash) // mark upload as completed
   } catch (err) {
     entry.ctx.recordFailedBlob(hash)
     throw err
@@ -492,76 +460,6 @@ async function uploadBlobToGCS(blobStore, entry, blob, hash, filePath) {
 
 const GZ_SUFFIX = '.gz'
 
-/**
- * @param {QueueEntry} entry
- * @param {Blob} blob
- * @param {string} filePath
- * @return {Promise<void>}
- */
-async function uploadBlobToAWS(entry, blob, filePath) {
-  const { historyId } = entry.ctx
-  let backupSource
-  let contentEncoding
-  const md5 = Crypto.createHash('md5')
-  let size
-  if (blob.getStringLength()) {
-    const filePathCompressed = filePath + GZ_SUFFIX
-    backupSource = filePathCompressed
-    contentEncoding = 'gzip'
-    size = 0
-    await Stream.promises.pipeline(
-      fs.createReadStream(filePath, { highWaterMark: STREAM_HIGH_WATER_MARK }),
-      zLib.createGzip(),
-      async function* (source) {
-        for await (const chunk of source) {
-          size += chunk.byteLength
-          md5.update(chunk)
-          yield chunk
-        }
-      },
-      fs.createWriteStream(filePathCompressed, {
-        highWaterMark: STREAM_HIGH_WATER_MARK,
-      })
-    )
-  } else {
-    backupSource = filePath
-    size = blob.getByteLength()
-    await Stream.promises.pipeline(
-      fs.createReadStream(filePath, { highWaterMark: STREAM_HIGH_WATER_MARK }),
-      md5
-    )
-  }
-  const backendKeyPath = makeProjectKey(historyId, blob.getHash())
-  const persistor = await entry.ctx.getCachedPersistor(backendKeyPath)
-  try {
-    STATS.writeToAWSCount++
-    await persistor.sendStream(
-      projectBlobsBucket,
-      backendKeyPath,
-      fs.createReadStream(backupSource, {
-        highWaterMark: STREAM_HIGH_WATER_MARK,
-      }),
-      {
-        contentEncoding,
-        contentType: 'application/octet-stream',
-        contentLength: size,
-        sourceMd5: md5.digest('hex'),
-        ifNoneMatch: '*', // de-duplicate write (we pay for the request, but avoid egress)
-      }
-    )
-    STATS.writeToAWSEgress += size
-  } catch (err) {
-    if (err instanceof AlreadyWrittenError) {
-      STATS.deduplicatedWriteToAWSRemoteCount++
-      STATS.deduplicatedWriteToAWSRemoteEgress += size
-    } else {
-      STATS.writeToAWSEgress += size
-      throw err
-    }
-  }
-  entry.ctx.recordBackedUpBlob(blob.getHash())
-}
-
 /**
  * @param {Array<QueueEntry>} files
  * @return {Promise<void>}
@@ -647,30 +545,19 @@ async function queueNextBatch(batch, prefix = 'rootFolder.0') {
  * @return {Promise<void>}
  */
 async function processBatch(batch, prefix = 'rootFolder.0') {
-  const [deletedFiles, { nBlobs, blobs }, { nBackedUpBlobs, backedUpBlobs }] =
-    await Promise.all([
-      collectDeletedFiles(batch),
-      collectProjectBlobs(batch),
-      collectBackedUpBlobs(batch),
-    ])
-  const files = Array.from(
-    findFileInBatch(batch, prefix, deletedFiles, blobs, backedUpBlobs)
-  )
+  const { nBlobs, blobs } = await collectProjectBlobs(batch)
+  const files = Array.from(findFileInBatch(batch, prefix, blobs))
   STATS.projects += batch.length
   STATS.blobs += nBlobs
-  STATS.backedUpBlobs += nBackedUpBlobs
 
   // GC
   batch.length = 0
-  deletedFiles.clear()
   blobs.clear()
-  backedUpBlobs.clear()
 
   // The files are currently ordered by project-id.
-  // Order them by file-id ASC then blobs ASC to
-  // - process files before blobs
-  // - avoid head-of-line blocking from many project-files waiting on the generation of the projects DEK (round trip to AWS)
-  // - bonus: increase chance of de-duplicating write to AWS
+  // Order them by file-id ASC then hash ASC to
+  // increase the hit rate on the "already processed
+  // hash for project" checks.
   files.sort(
     /**
      * @param {QueueEntry} a
@@ -713,9 +600,7 @@ async function handleDeletedFileTreeBatch(batch) {
  * @return {Promise<boolean>}
  */
 async function tryUpdateFileRefInMongo(entry) {
-  if (entry.path === MONGO_PATH_DELETED_FILE) {
-    return await tryUpdateDeletedFileRefInMongo(entry)
-  } else if (entry.path.startsWith('project.')) {
+  if (entry.path.startsWith('project.')) {
     return await tryUpdateFileRefInMongoInDeletedProject(entry)
   }
 
@@ -732,22 +617,6 @@ async function tryUpdateFileRefInMongo(entry) {
   return result.matchedCount === 1
 }
 
-/**
- * @param {QueueEntry} entry
- * @return {Promise<boolean>}
- */
-async function tryUpdateDeletedFileRefInMongo(entry) {
-  STATS.mongoUpdates++
-  const result = await deletedFilesCollection.updateOne(
-    {
-      _id: new ObjectId(entry.fileId),
-      projectId: entry.ctx.projectId,
-    },
-    { $set: { hash: entry.hash } }
-  )
-  return result.matchedCount === 1
-}
-
 /**
  * @param {QueueEntry} entry
  * @return {Promise<boolean>}
@@ -812,7 +681,6 @@ async function updateFileRefInMongo(entry) {
       break
     }
     if (!found) {
-      if (await tryUpdateDeletedFileRefInMongo(entry)) return
       STATS.fileHardDeleted++
       console.warn('bug: file hard-deleted while processing', projectId, fileId)
       return
@@ -905,60 +773,15 @@ function* findFiles(ctx, folder, path, isInputLoop = false) {
 /**
  * @param {Array<Project>} projects
  * @param {string} prefix
- * @param {Map<string,Array<DeletedFileRef>>} deletedFiles
  * @param {Map<string,Array<Blob>>} blobs
- * @param {Map<string,Array<string>>} backedUpBlobs
  * @return Generator<QueueEntry>
  */
-function* findFileInBatch(
-  projects,
-  prefix,
-  deletedFiles,
-  blobs,
-  backedUpBlobs
-) {
+function* findFileInBatch(projects, prefix, blobs) {
   for (const project of projects) {
     const projectIdS = project._id.toString()
     const historyIdS = project.overleaf.history.id.toString()
     const projectBlobs = blobs.get(historyIdS) || []
-    const projectBackedUpBlobs = new Set(backedUpBlobs.get(projectIdS) || [])
-    const projectDeletedFiles = deletedFiles.get(projectIdS) || []
-    const ctx = new ProjectContext(
-      project._id,
-      historyIdS,
-      projectBlobs,
-      projectBackedUpBlobs
-    )
-    for (const fileRef of projectDeletedFiles) {
-      const fileId = fileRef._id.toString()
-      if (fileRef.hash) {
-        if (ctx.canSkipProcessingHashedFile(fileRef.hash)) continue
-        ctx.remainingQueueEntries++
-        STATS.filesWithHash++
-        yield {
-          ctx,
-          cacheKey: fileRef.hash,
-          fileId,
-          hash: fileRef.hash,
-          path: MONGO_PATH_SKIP_WRITE_HASH_TO_FILE_TREE,
-        }
-      } else {
-        ctx.remainingQueueEntries++
-        STATS.filesWithoutHash++
-        yield { ctx, cacheKey: fileId, fileId, path: MONGO_PATH_DELETED_FILE }
-      }
-    }
-    for (const blob of projectBlobs) {
-      if (projectBackedUpBlobs.has(blob.getHash())) continue
-      ctx.remainingQueueEntries++
-      yield {
-        ctx,
-        cacheKey: blob.getHash(),
-        path: MONGO_PATH_SKIP_WRITE_HASH_TO_FILE_TREE,
-        blob,
-        hash: blob.getHash(),
-      }
-    }
+    const ctx = new ProjectContext(project._id, historyIdS, projectBlobs)
     try {
       yield* findFiles(ctx, project.rootFolder?.[0], prefix, true)
     } catch (err) {
@@ -981,78 +804,11 @@ async function collectProjectBlobs(batch) {
   return await getProjectBlobsBatch(batch.map(p => p.overleaf.history.id))
 }
 
-/**
- * @param {Array<Project>} projects
- * @return {Promise<Map<string, Array<DeletedFileRef>>>}
- */
-async function collectDeletedFiles(projects) {
-  const deletedFiles = new Map()
-  if (!PROCESS_DELETED_FILES) return deletedFiles
-
-  const cursor = deletedFilesCollection.find(
-    {
-      projectId: { $in: projects.map(p => p._id) },
-      ...(PROCESS_HASHED_FILES
-        ? {}
-        : {
-            hash: { $exists: false },
-          }),
-    },
-    {
-      projection: { _id: 1, projectId: 1, hash: 1 },
-      readPreference: READ_PREFERENCE_SECONDARY,
-      sort: { projectId: 1 },
-    }
-  )
-  for await (const deletedFileRef of cursor) {
-    const projectId = deletedFileRef.projectId.toString()
-    const found = deletedFiles.get(projectId)
-    if (found) {
-      found.push(deletedFileRef)
-    } else {
-      deletedFiles.set(projectId, [deletedFileRef])
-    }
-  }
-  return deletedFiles
-}
-
-/**
- * @param {Array<Project>} projects
- * @return {Promise<{nBackedUpBlobs:number,backedUpBlobs:Map<string,Array<string>>}>}
- */
-async function collectBackedUpBlobs(projects) {
-  let nBackedUpBlobs = 0
-  const backedUpBlobs = new Map()
-  if (!COLLECT_BACKED_UP_BLOBS) return { nBackedUpBlobs, backedUpBlobs }
-
-  const cursor = backedUpBlobsCollection.find(
-    { _id: { $in: projects.map(p => p._id) } },
-    {
-      readPreference: READ_PREFERENCE_SECONDARY,
-      sort: { _id: 1 },
-    }
-  )
-  for await (const record of cursor) {
-    const blobs = record.blobs.map(b => b.toString('hex'))
-    backedUpBlobs.set(record._id.toString(), blobs)
-    nBackedUpBlobs += blobs.length
-  }
-  return { nBackedUpBlobs, backedUpBlobs }
-}
-
-const BATCH_HASH_WRITES = 1_000
 const BATCH_FILE_UPDATES = 100
 
-const MONGO_PATH_DELETED_FILE = 'deleted-file'
 const MONGO_PATH_SKIP_WRITE_HASH_TO_FILE_TREE = 'skip-write-to-file-tree'
 
 class ProjectContext {
-  /** @type {Promise<CachedPerProjectEncryptedS3Persistor> | null} */
-  #cachedPersistorPromise = null
-
-  /** @type {Set<string>} */
-  #backedUpBlobs
-
   /** @type {Map<string, Blob>} */
   #historyBlobs
 
@@ -1066,12 +822,10 @@ class ProjectContext {
    * @param {ObjectId} projectId
    * @param {string} historyId
    * @param {Array<Blob>} blobs
-   * @param {Set<string>} backedUpBlobs
    */
-  constructor(projectId, historyId, blobs, backedUpBlobs) {
+  constructor(projectId, historyId, blobs) {
     this.projectId = projectId
     this.historyId = historyId
-    this.#backedUpBlobs = backedUpBlobs
     this.#historyBlobs = new Map(blobs.map(b => [b.getHash(), b]))
   }
 
@@ -1100,75 +854,17 @@ class ProjectContext {
     return false
   }
 
-  /**
-   * @param {string} key
-   * @return {Promise<CachedPerProjectEncryptedS3Persistor>}
-   */
-  getCachedPersistor(key) {
-    if (!this.#cachedPersistorPromise) {
-      // Fetch DEK once, but only if needed -- upon the first use
-      this.#cachedPersistorPromise = this.#getCachedPersistorWithRetries(key)
-    }
-    return this.#cachedPersistorPromise
-  }
-
-  /**
-   * @param {string} key
-   * @return {Promise<CachedPerProjectEncryptedS3Persistor>}
-   */
-  async #getCachedPersistorWithRetries(key) {
-    // Optimization: Skip GET on DEK in case no blobs are marked as backed up yet.
-    let tryGenerateDEKFirst = this.#backedUpBlobs.size === 0
-    for (let attempt = 0; attempt < RETRIES; attempt++) {
-      try {
-        if (tryGenerateDEKFirst) {
-          try {
-            return await backupPersistor.generateDataEncryptionKey(
-              projectBlobsBucket,
-              key
-            )
-          } catch (err) {
-            if (err instanceof AlreadyWrittenError) {
-              tryGenerateDEKFirst = false
-              // fall back to GET below
-            } else {
-              throw err
-            }
-          }
-        }
-        return await backupPersistor.forProject(projectBlobsBucket, key)
-      } catch (err) {
-        if (gracefulShutdownInitiated) throw err
-        if (err instanceof NoKEKMatchedError) {
-          throw err
-        } else {
-          logger.warn(
-            { err, projectId: this.projectId, attempt },
-            'failed to get DEK, trying again'
-          )
-          const jitter = Math.random() * RETRY_DELAY_MS
-          await setTimeout(RETRY_DELAY_MS + jitter)
-        }
-      }
-    }
-    return await backupPersistor.forProject(projectBlobsBucket, key)
-  }
-
   async flushMongoQueuesIfNeeded() {
     if (this.remainingQueueEntries === 0) {
       await this.flushMongoQueues()
     }
 
-    if (this.#completedBlobs.size > BATCH_HASH_WRITES) {
-      await this.#storeBackedUpBlobs()
-    }
     if (this.#pendingFileWrites.length > BATCH_FILE_UPDATES) {
       await this.#storeFileHashes()
     }
   }
 
   async flushMongoQueues() {
-    await this.#storeBackedUpBlobs()
     await this.#storeFileHashes()
   }
 
@@ -1177,20 +873,6 @@ class ProjectContext {
   /** @type {Set<string>} */
   #completedBlobs = new Set()
 
-  async #storeBackedUpBlobs() {
-    if (this.#completedBlobs.size === 0) return
-    const blobs = Array.from(this.#completedBlobs).map(
-      hash => new Binary(Buffer.from(hash, 'hex'))
-    )
-    this.#completedBlobs.clear()
-    STATS.mongoUpdates++
-    await backedUpBlobsCollection.updateOne(
-      { _id: this.projectId },
-      { $addToSet: { blobs: { $each: blobs } } },
-      { upsert: true }
-    )
-  }
-
   /**
    * @param {string} hash
    */
@@ -1208,8 +890,7 @@ class ProjectContext {
   /**
    * @param {string} hash
    */
-  recordBackedUpBlob(hash) {
-    this.#backedUpBlobs.add(hash)
+  recordCompletedBlob(hash) {
     this.#completedBlobs.add(hash)
     this.#pendingBlobs.delete(hash)
   }
@@ -1218,12 +899,8 @@ class ProjectContext {
    * @param {string} hash
    * @return {boolean}
    */
-  hasBackedUpBlob(hash) {
-    return (
-      this.#pendingBlobs.has(hash) ||
-      this.#completedBlobs.has(hash) ||
-      this.#backedUpBlobs.has(hash)
-    )
+  hasCompletedBlob(hash) {
+    return this.#pendingBlobs.has(hash) || this.#completedBlobs.has(hash)
   }
 
   /** @type {Array<QueueEntry>} */
@@ -1264,9 +941,7 @@ class ProjectContext {
     const projectEntries = []
     const deletedProjectEntries = []
     for (const entry of this.#pendingFileWrites) {
-      if (entry.path === MONGO_PATH_DELETED_FILE) {
-        individualUpdates.push(entry)
-      } else if (entry.path.startsWith('project.')) {
+      if (entry.path.startsWith('project.')) {
         deletedProjectEntries.push(entry)
       } else {
         projectEntries.push(entry)
@@ -1422,14 +1097,21 @@ async function processDeletedProjects() {
 }
 
 async function main() {
+  console.log('Starting project file backup...')
   await loadGlobalBlobs()
+  console.log('Loaded global blobs:', GLOBAL_BLOBS.size)
   if (PROJECT_IDS_FROM) {
+    console.log(
+      `Processing projects from file: ${PROJECT_IDS_FROM}, this may take a while...`
+    )
     await processProjectsFromFile()
   } else {
     if (PROCESS_NON_DELETED_PROJECTS) {
+      console.log('Processing non-deleted projects...')
       await processNonDeletedProjects()
     }
     if (PROCESS_DELETED_PROJECTS) {
+      console.log('Processing deleted projects...')
       await processDeletedProjects()
     }
   }
diff --git a/services/history-v1/storage/scripts/back_fill_file_hash_fix_up.mjs b/services/history-v1/storage/scripts/back_fill_file_hash_fix_up.mjs
index 7bab794692..2525ee1d6e 100644
--- a/services/history-v1/storage/scripts/back_fill_file_hash_fix_up.mjs
+++ b/services/history-v1/storage/scripts/back_fill_file_hash_fix_up.mjs
@@ -9,15 +9,12 @@ import { Blob } from 'overleaf-editor-core'
 import {
   BlobStore,
   getStringLengthOfFile,
-  GLOBAL_BLOBS,
   makeBlobForFile,
 } from '../lib/blob_store/index.js'
 import { db } from '../lib/mongodb.js'
 import commandLineArgs from 'command-line-args'
 import readline from 'node:readline'
-import { _blobIsBackedUp, backupBlob } from '../lib/backupBlob.mjs'
 import { NotFoundError } from '@overleaf/object-persistor/src/Errors.js'
-import filestorePersistor from '../lib/persistor.js'
 import { setTimeout } from 'node:timers/promises'
 
 // Silence warning.
@@ -52,12 +49,11 @@ ObjectId.cacheHexString = true
  */
 
 /**
- * @return {{FIX_NOT_FOUND: boolean, FIX_HASH_MISMATCH: boolean, FIX_DELETE_PERMISSION: boolean, FIX_MISSING_HASH: boolean, LOGS: string}}
+ * @return {{FIX_NOT_FOUND: boolean, FIX_HASH_MISMATCH: boolean, FIX_MISSING_HASH: boolean, LOGS: string}}
  */
 function parseArgs() {
   const args = commandLineArgs([
     { name: 'fixNotFound', type: String, defaultValue: 'true' },
-    { name: 'fixDeletePermission', type: String, defaultValue: 'true' },
     { name: 'fixHashMismatch', type: String, defaultValue: 'true' },
     { name: 'fixMissingHash', type: String, defaultValue: 'true' },
     { name: 'logs', type: String, defaultValue: '' },
@@ -74,20 +70,13 @@ function parseArgs() {
   }
   return {
     FIX_HASH_MISMATCH: boolVal('fixNotFound'),
-    FIX_DELETE_PERMISSION: boolVal('fixDeletePermission'),
     FIX_NOT_FOUND: boolVal('fixHashMismatch'),
     FIX_MISSING_HASH: boolVal('fixMissingHash'),
     LOGS: args.logs,
   }
 }
 
-const {
-  FIX_HASH_MISMATCH,
-  FIX_DELETE_PERMISSION,
-  FIX_NOT_FOUND,
-  FIX_MISSING_HASH,
-  LOGS,
-} = parseArgs()
+const { FIX_HASH_MISMATCH, FIX_NOT_FOUND, FIX_MISSING_HASH, LOGS } = parseArgs()
 if (!LOGS) {
   throw new Error('--logs parameter missing')
 }
@@ -105,6 +94,37 @@ const STREAM_HIGH_WATER_MARK = parseInt(
 )
 const SLEEP_BEFORE_EXIT = parseInt(process.env.SLEEP_BEFORE_EXIT || '1000', 10)
 
+// Filestore endpoint location
+const FILESTORE_HOST = process.env.FILESTORE_HOST || '127.0.0.1'
+const FILESTORE_PORT = process.env.FILESTORE_PORT || '3009'
+
+async function fetchFromFilestore(projectId, fileId) {
+  const url = `http://${FILESTORE_HOST}:${FILESTORE_PORT}/project/${projectId}/file/${fileId}`
+  const response = await fetch(url)
+  if (!response.ok) {
+    if (response.status === 404) {
+      throw new NotFoundError('file not found in filestore', {
+        status: response.status,
+      })
+    }
+    const body = await response.text()
+    throw new OError('fetchFromFilestore failed', {
+      projectId,
+      fileId,
+      status: response.status,
+      body,
+    })
+  }
+  if (!response.body) {
+    throw new OError('fetchFromFilestore response has no body', {
+      projectId,
+      fileId,
+      status: response.status,
+    })
+  }
+  return response.body
+}
+
 /** @type {ProjectsCollection} */
 const projectsCollection = db.collection('projects')
 /** @type {DeletedProjectsCollection} */
@@ -302,19 +322,16 @@ async function setHashInMongo(projectId, fileId, hash) {
  * @return {Promise<void>}
  */
 async function importRestoredFilestoreFile(projectId, fileId, historyId) {
-  const filestoreKey = `${projectId}/${fileId}`
   const path = `${BUFFER_DIR}/${projectId}_${fileId}`
   try {
     let s
     try {
-      s = await filestorePersistor.getObjectStream(
-        USER_FILES_BUCKET_NAME,
-        filestoreKey
-      )
+      s = await fetchFromFilestore(projectId, fileId)
     } catch (err) {
       if (err instanceof NotFoundError) {
         throw new OError('missing blob, need to restore filestore file', {
-          filestoreKey,
+          projectId,
+          fileId,
         })
       }
       throw err
@@ -325,7 +342,6 @@ async function importRestoredFilestoreFile(projectId, fileId, historyId) {
     )
     const blobStore = new BlobStore(historyId)
     const blob = await blobStore.putFile(path)
-    await backupBlob(historyId, blob, path)
     await setHashInMongo(projectId, fileId, blob.getHash())
   } finally {
     await fs.promises.rm(path, { force: true })
@@ -339,13 +355,9 @@ async function importRestoredFilestoreFile(projectId, fileId, historyId) {
  * @return {Promise<Blob>}
  */
 async function bufferFilestoreFileToDisk(projectId, fileId, path) {
-  const filestoreKey = `${projectId}/${fileId}`
   try {
     await Stream.promises.pipeline(
-      await filestorePersistor.getObjectStream(
-        USER_FILES_BUCKET_NAME,
-        filestoreKey
-      ),
+      await fetchFromFilestore(projectId, fileId),
       fs.createWriteStream(path, { highWaterMark: STREAM_HIGH_WATER_MARK })
     )
     const blob = await makeBlobForFile(path)
@@ -356,7 +368,8 @@ async function bufferFilestoreFileToDisk(projectId, fileId, path) {
   } catch (err) {
     if (err instanceof NotFoundError) {
       throw new OError('missing blob, need to restore filestore file', {
-        filestoreKey,
+        projectId,
+        fileId,
       })
     }
     throw err
@@ -389,7 +402,7 @@ async function uploadFilestoreFile(projectId, fileId) {
     const blob = await bufferFilestoreFileToDisk(projectId, fileId, path)
     const hash = blob.getHash()
     try {
-      await ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash)
+      await ensureBlobExistsForFile(projectId, fileId, hash)
     } catch (err) {
       if (!(err instanceof Blob.NotFoundError)) throw err
 
@@ -397,7 +410,7 @@ async function uploadFilestoreFile(projectId, fileId) {
       const historyId = project.overleaf.history.id.toString()
       const blobStore = new BlobStore(historyId)
       await blobStore.putBlob(path, blob)
-      await ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash)
+      await ensureBlobExistsForFile(projectId, fileId, hash)
     }
   } finally {
     await fs.promises.rm(path, { force: true })
@@ -426,11 +439,7 @@ async function fixHashMismatch(line) {
     await importRestoredFilestoreFile(projectId, fileId, historyId)
     return true
   }
-  return await ensureBlobExistsForFileAndUploadToAWS(
-    projectId,
-    fileId,
-    computedHash
-  )
+  return await ensureBlobExistsForFile(projectId, fileId, computedHash)
 }
 
 /**
@@ -444,30 +453,19 @@ async function hashAlreadyUpdatedInFileTree(projectId, fileId, hash) {
   return fileRef.hash === hash
 }
 
-/**
- * @param {string} projectId
- * @param {string} hash
- * @return {Promise<boolean>}
- */
-async function needsBackingUpToAWS(projectId, hash) {
-  if (GLOBAL_BLOBS.has(hash)) return false
-  return !(await _blobIsBackedUp(projectId, hash))
-}
-
 /**
  * @param {string} projectId
  * @param {string} fileId
  * @param {string} hash
  * @return {Promise<boolean>}
  */
-async function ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash) {
+async function ensureBlobExistsForFile(projectId, fileId, hash) {
   const { project } = await getProject(projectId)
   const historyId = project.overleaf.history.id.toString()
   const blobStore = new BlobStore(historyId)
   if (
     (await hashAlreadyUpdatedInFileTree(projectId, fileId, hash)) &&
-    (await blobStore.getBlob(hash)) &&
-    !(await needsBackingUpToAWS(projectId, hash))
+    (await blobStore.getBlob(hash))
   ) {
     return false // already processed
   }
@@ -488,7 +486,7 @@ async function ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash) {
     )
     if (writtenBlob.getHash() !== hash) {
       // Double check download, better safe than sorry.
-      throw new OError('blob corrupted', { writtenBlob })
+      throw new OError('blob corrupted', { writtenBlob, hash })
     }
 
     let blob = await blobStore.getBlob(hash)
@@ -497,7 +495,6 @@ async function ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash) {
       // HACK: Skip upload to GCS and finalize putBlob operation directly.
       await blobStore.backend.insertBlob(historyId, writtenBlob)
     }
-    await backupBlob(historyId, writtenBlob, path)
   } finally {
     await fs.promises.rm(path, { force: true })
   }
@@ -505,16 +502,6 @@ async function ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash) {
   return true
 }
 
-/**
- * @param {string} line
- * @return {Promise<boolean>}
- */
-async function fixDeletePermission(line) {
-  let { projectId, fileId, hash } = JSON.parse(line)
-  if (!hash) hash = await computeFilestoreFileHash(projectId, fileId)
-  return await ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash)
-}
-
 /**
  * @param {string} line
  * @return {Promise<boolean>}
@@ -526,7 +513,7 @@ async function fixMissingHash(line) {
   } = await findFile(projectId, fileId)
   if (hash) {
     // processed, double check
-    return await ensureBlobExistsForFileAndUploadToAWS(projectId, fileId, hash)
+    return await ensureBlobExistsForFile(projectId, fileId, hash)
   }
   await uploadFilestoreFile(projectId, fileId)
   return true
@@ -543,11 +530,6 @@ const CASES = {
     flag: FIX_HASH_MISMATCH,
     action: fixHashMismatch,
   },
-  'delete permission': {
-    match: 'storage.objects.delete',
-    flag: FIX_DELETE_PERMISSION,
-    action: fixDeletePermission,
-  },
   'missing file hash': {
     match: '"bad file hash"',
     flag: FIX_MISSING_HASH,
diff --git a/services/history-v1/storage/scripts/backup.mjs b/services/history-v1/storage/scripts/backup.mjs
index d73ef9dade..8cbbadfe12 100644
--- a/services/history-v1/storage/scripts/backup.mjs
+++ b/services/history-v1/storage/scripts/backup.mjs
@@ -2,9 +2,14 @@
 
 import logger from '@overleaf/logger'
 import commandLineArgs from 'command-line-args'
-import { History } from 'overleaf-editor-core'
-import { getProjectChunks, loadLatestRaw } from '../lib/chunk_store/index.js'
+import { Chunk, History, Snapshot } from 'overleaf-editor-core'
+import {
+  getProjectChunks,
+  getLatestChunkMetadata,
+  create,
+} from '../lib/chunk_store/index.js'
 import { client } from '../lib/mongodb.js'
+import redis from '../lib/redis.js'
 import knex from '../lib/knex.js'
 import { historyStore } from '../lib/history_store.js'
 import pLimit from 'p-limit'
@@ -321,6 +326,11 @@ const optionDefinitions = [
     description: 'Time interval in seconds for pending backups (default: 3600)',
     defaultValue: 3600,
   },
+  {
+    name: 'fix',
+    type: Number,
+    description: 'Fix projects without chunks',
+  },
   {
     name: 'init',
     alias: 'I',
@@ -367,6 +377,7 @@ function handleOptions() {
     !options.list &&
     !options.pending &&
     !options.init &&
+    !(options.fix >= 0) &&
     !(options.compare && options['start-date'] && options['end-date'])
 
   if (projectIdRequired && !options.projectId) {
@@ -433,7 +444,7 @@ async function analyseBackupStatus(projectId) {
     await getBackupStatus(projectId)
   // TODO: when we have confidence that the latestChunkMetadata always matches
   // the values from the backupStatus we can skip loading it here
-  const latestChunkMetadata = await loadLatestRaw(historyId, {
+  const latestChunkMetadata = await getLatestChunkMetadata(historyId, {
     readOnly: Boolean(USE_SECONDARY),
   })
   if (
@@ -443,7 +454,7 @@ async function analyseBackupStatus(projectId) {
     // compare the current end version with the latest chunk metadata to check that
     // the updates to the project collection are reliable
     // expect some failures due to the time window between getBackupStatus and
-    // loadLatestRaw where the project is being actively edited.
+    // getLatestChunkMetadata where the project is being actively edited.
     logger.warn(
       {
         projectId,
@@ -681,6 +692,54 @@ function convertToISODate(dateStr) {
   return new Date(dateStr + 'T00:00:00.000Z').toISOString()
 }
 
+export async function fixProjectsWithoutChunks(options) {
+  const limit = options.fix || 1
+  const query = {
+    'overleaf.history.id': { $exists: true },
+    'overleaf.backup.lastBackedUpVersion': { $in: [null] },
+  }
+  const cursor = client
+    .db()
+    .collection('projects')
+    .find(query, {
+      projection: { _id: 1, 'overleaf.history.id': 1 },
+      readPreference: READ_PREFERENCE_SECONDARY,
+    })
+    .limit(limit)
+  for await (const project of cursor) {
+    const historyId = project.overleaf.history.id.toString()
+    const chunks = await getProjectChunks(historyId)
+    if (chunks.length > 0) {
+      continue
+    }
+    if (DRY_RUN) {
+      console.log(
+        'Would create new chunk for Project ID:',
+        project._id.toHexString(),
+        'History ID:',
+        historyId,
+        'Chunks:',
+        chunks
+      )
+    } else {
+      console.log(
+        'Creating new chunk for Project ID:',
+        project._id.toHexString(),
+        'History ID:',
+        historyId,
+        'Chunks:',
+        chunks
+      )
+      const snapshot = new Snapshot()
+      const history = new History(snapshot, [])
+      const chunk = new Chunk(history, 0)
+      await create(historyId, chunk)
+      const newChunks = await getProjectChunks(historyId)
+      console.log('New chunk:', newChunks)
+    }
+  }
+}
+
 export async function initializeProjects(options) {
   await ensureGlobalBlobsLoaded()
   let totalErrors = 0
@@ -856,7 +915,7 @@ async function compareBackups(projectId, options) {
           const globalBlob = GLOBAL_BLOBS.get(blob.hash)
           console.log(
             `  ✓ Blob ${blob.hash} is a global blob`,
-            globalBlob.demoted ? '(demoted)' : ''
+            globalBlob?.demoted ? '(demoted)' : ''
           )
           continue
         }
@@ -983,11 +1042,12 @@ async function main() {
   const options = handleOptions()
   await ensureGlobalBlobsLoaded()
   const projectId = options.projectId
-
   if (options.status) {
     await displayBackupStatus(projectId)
   } else if (options.list) {
     await displayPendingBackups(options)
+  } else if (options.fix !== undefined) {
+    await fixProjectsWithoutChunks(options)
   } else if (options.pending) {
     await backupPendingProjects(options)
   } else if (options.init) {
@@ -1032,5 +1092,13 @@ if (import.meta.url === `file://${process.argv[1]}`) {
         .catch(err => {
           console.error('Error closing MongoDB connection:', err)
         })
+      redis
+        .disconnect()
+        .then(() => {
+          console.log('Redis connection closed')
+        })
+        .catch(err => {
+          console.error('Error closing Redis connection:', err)
+        })
     })
 }
diff --git a/services/history-v1/storage/scripts/backup_blob.mjs b/services/history-v1/storage/scripts/backup_blob.mjs
index 2a777d0074..314b05313e 100644
--- a/services/history-v1/storage/scripts/backup_blob.mjs
+++ b/services/history-v1/storage/scripts/backup_blob.mjs
@@ -10,6 +10,7 @@ import {
 import assert from '../lib/assert.js'
 import knex from '../lib/knex.js'
 import { client } from '../lib/mongodb.js'
+import redis from '../lib/redis.js'
 import { setTimeout } from 'node:timers/promises'
 import fs from 'node:fs'
 
@@ -23,6 +24,7 @@ async function gracefulShutdown() {
   console.log('Gracefully shutting down')
   await knex.destroy()
   await client.close()
+  await redis.disconnect()
   await setTimeout(100)
   process.exit()
 }
diff --git a/services/history-v1/storage/scripts/backup_scheduler.mjs b/services/history-v1/storage/scripts/backup_scheduler.mjs
index 32edc1d0af..38b6e6ef04 100644
--- a/services/history-v1/storage/scripts/backup_scheduler.mjs
+++ b/services/history-v1/storage/scripts/backup_scheduler.mjs
@@ -4,6 +4,7 @@ import commandLineArgs from 'command-line-args'
 import logger from '@overleaf/logger'
 import {
   listPendingBackups,
+  listUninitializedBackups,
   getBackupStatus,
 } from '../lib/backup_store/index.js'
 
@@ -16,8 +17,8 @@ const redisOptions = config.get('redis.queue')
 const backupQueue = new Queue('backup', {
   redis: redisOptions,
   defaultJobOptions: {
-    removeOnComplete: true,
-    removeOnFail: true,
+    removeOnComplete: { age: 60 }, // keep completed jobs for 60 seconds
+    removeOnFail: { age: 7 * 24 * 3600, count: 1000 }, // keep failed jobs for 7 days, max 1000
   },
 })
 
@@ -200,6 +201,18 @@ async function addDateRangeJob(input) {
   )
 }
 
+// Helper to list pending and uninitialized backups
+// This function combines the two cursors into a single generator
+// to yield projects from both lists
+async function* pendingCursor(timeIntervalMs, limit) {
+  for await (const project of listPendingBackups(timeIntervalMs, limit)) {
+    yield project
+  }
+  for await (const project of listUninitializedBackups(timeIntervalMs, limit)) {
+    yield project
+  }
+}
+
 // Process pending projects with changes older than the specified seconds
 async function processPendingProjects(
   age,
@@ -218,26 +231,34 @@ async function processPendingProjects(
   let addedCount = 0
   let existingCount = 0
   // Pass the limit directly to MongoDB query for better performance
-  const pendingCursor = listPendingBackups(timeIntervalMs, limit)
   const changeTimes = []
-  for await (const project of pendingCursor) {
+  for await (const project of pendingCursor(timeIntervalMs, limit)) {
     const projectId = project._id.toHexString()
-    const pendingAt = project.overleaf?.backup?.pendingChangeAt
+    const pendingAt =
+      project.overleaf?.backup?.pendingChangeAt || project._id.getTimestamp()
     if (pendingAt) {
       changeTimes.push(pendingAt)
       const pendingAge = Math.floor((Date.now() - pendingAt.getTime()) / 1000)
       if (pendingAge > WARN_THRESHOLD) {
-        const backupStatus = await getBackupStatus(projectId)
-        logger.warn(
-          {
-            projectId,
-            pendingAt,
-            pendingAge,
-            backupStatus,
-            warnThreshold: WARN_THRESHOLD,
-          },
-          `pending change exceeds rpo warning threshold`
-        )
+        try {
+          const backupStatus = await getBackupStatus(projectId)
+          logger.warn(
+            {
+              projectId,
+              pendingAt,
+              pendingAge,
+              backupStatus,
+              warnThreshold: WARN_THRESHOLD,
+            },
+            `pending change exceeds rpo warning threshold`
+          )
+        } catch (err) {
+          logger.error(
+            { projectId, pendingAt, pendingAge },
+            'Error getting backup status'
+          )
+          throw err
+        }
       }
     }
     if (showOnly && verbose) {
@@ -277,10 +298,11 @@ async function processPendingProjects(
       )
     }
   }
-
-  const oldestChange = changeTimes.reduce((min, time) =>
-    time < min ? time : min
-  )
+  // Set oldestChange to undefined if there are no changes
+  const oldestChange =
+    changeTimes.length > 0
+      ? changeTimes.reduce((min, time) => (time < min ? time : min))
+      : undefined
 
   if (showOnly) {
     console.log(
@@ -290,7 +312,9 @@ async function processPendingProjects(
     console.log(`Found ${count} projects with pending changes:`)
     console.log(`  ${addedCount} jobs added to queue`)
     console.log(`  ${existingCount} jobs already existed in queue`)
-    console.log(`  Oldest pending change: ${formatPendingTime(oldestChange)}`)
+    if (oldestChange) {
+      console.log(`  Oldest pending change: ${formatPendingTime(oldestChange)}`)
+    }
   }
 }
 
diff --git a/services/history-v1/storage/scripts/expire_redis_chunks.js b/services/history-v1/storage/scripts/expire_redis_chunks.js
new file mode 100644
index 0000000000..cb6d689e2c
--- /dev/null
+++ b/services/history-v1/storage/scripts/expire_redis_chunks.js
@@ -0,0 +1,74 @@
+const logger = require('@overleaf/logger')
+const commandLineArgs = require('command-line-args')
+const redis = require('../lib/redis')
+const { scanAndProcessDueItems } = require('../lib/scan')
+const { expireProject, claimExpireJob } = require('../lib/chunk_store/redis')
+const config = require('config')
+const { fetchNothing } = require('@overleaf/fetch-utils')
+
+const rclient = redis.rclientHistory
+
+const optionDefinitions = [
+  { name: 'dry-run', alias: 'd', type: Boolean },
+  { name: 'post-request', type: Boolean },
+]
+const options = commandLineArgs(optionDefinitions)
+const DRY_RUN = options['dry-run'] || false
+const POST_REQUEST = options['post-request'] || false
+const HISTORY_V1_URL = `http://${process.env.HISTORY_V1_HOST || 'localhost'}:${process.env.PORT || 3100}`
+
+logger.initialize('expire-redis-chunks')
+
+async function expireProjectAction(projectId) {
+  const job = await claimExpireJob(projectId)
+  if (POST_REQUEST) {
+    await requestProjectExpiry(projectId)
+  } else {
+    await expireProject(projectId)
+  }
+  if (job && job.close) {
+    await job.close()
+  }
+}
+
+async function requestProjectExpiry(projectId) {
+  logger.debug({ projectId }, 'sending project expire request')
+  const url = `${HISTORY_V1_URL}/api/projects/${projectId}/expire`
+  const credentials = Buffer.from(
+    `staging:${config.get('basicHttpAuth.password')}`
+  ).toString('base64')
+  await fetchNothing(url, {
+    method: 'POST',
+    headers: {
+      Authorization: `Basic ${credentials}`,
+    },
+  })
+}
+
+async function runExpireChunks() {
+  await scanAndProcessDueItems(
+    rclient,
+    'expireChunks',
+    'expire-time',
+    expireProjectAction,
+    DRY_RUN
+  )
+}
+
+if (require.main === module) {
+  runExpireChunks()
+    .catch(err => {
+      logger.fatal(
+        { err, taskName: 'expireChunks' },
+        'Unhandled error in runExpireChunks'
+      )
+      process.exit(1)
+    })
+    .finally(async () => {
+      await redis.disconnect()
+    })
+} else {
+  module.exports = {
+    runExpireChunks,
+  }
+}
diff --git a/services/history-v1/storage/scripts/list_redis_buffer_stats.js b/services/history-v1/storage/scripts/list_redis_buffer_stats.js
new file mode 100644
index 0000000000..a53a939e44
--- /dev/null
+++ b/services/history-v1/storage/scripts/list_redis_buffer_stats.js
@@ -0,0 +1,145 @@
+const { rclientHistory, disconnect } = require('../lib/redis')
+const { scanRedisCluster } = require('../lib/scan')
+
+// Lua script to get snapshot length, change lengths, and change timestamps
+// Assumes snapshot key is a string and changes key is a list.
+const LUA_SCRIPT = `
+  -- local cjson = require('cjson')
+  local snapshotKey = KEYS[1]
+  local changesKey = KEYS[2]
+
+  -- Get snapshot length (returns 0 if key does not exist)
+  local snapshotLen = redis.call('STRLEN', snapshotKey)
+
+  -- Return nil if snapshot is empty
+  if snapshotLen == 0 then
+    return nil
+  end
+
+  local changeLengths = {}
+  local changeTimestamps = {}
+
+  -- Get all changes (returns empty list if key does not exist)
+  local changes = redis.call('LRANGE', changesKey, 0, -1)
+
+  -- FIXME: it would be better to send all the changes back and do the processing
+  -- in JS to avoid blocking redis, if we need to run this script regularly
+  for i, change in ipairs(changes) do
+    -- Calculate length
+    table.insert(changeLengths, string.len(change))
+
+    -- Attempt to decode JSON and extract timestamp
+    local ok, decoded = pcall(cjson.decode, change)
+    if ok and type(decoded) == 'table' and decoded.timestamp then
+      table.insert(changeTimestamps, decoded.timestamp)
+    else
+      -- Handle cases where decoding fails or timestamp is missing
+      -- Log or insert a placeholder like nil if needed, otherwise skip
+      table.insert(changeTimestamps, nil) -- Keep placeholder for consistency
+    end
+  end
+
+  -- Return snapshot length, list of change lengths, and list of change timestamps
+  return {snapshotLen, changeLengths, changeTimestamps}
+`
+
+// Define the command if it doesn't exist
+if (!rclientHistory.getProjectBufferStats) {
+  rclientHistory.defineCommand('getProjectBufferStats', {
+    numberOfKeys: 2,
+    lua: LUA_SCRIPT,
+  })
+}
+
+/**
+ * Processes a single project ID: fetches its buffer stats from Redis
+ * and writes the results to the output stream in CSV format.
+ *
+ * @param {string} projectId The project ID to process.
+ * @param {WritableStream} outputStream The stream to write CSV output to.
+ */
+async function processProject(projectId, outputStream) {
+  try {
+    // Get current time in milliseconds *before* fetching data
+    const nowMs = Date.now()
+
+    // Execute the Lua script
+    const result = await rclientHistory.getProjectBufferStats(
+      `snapshot:${projectId}`,
+      `changes:${projectId}`
+    )
+
+    // Check if the result is null (e.g., snapshot is empty)
+    if (result === null) {
+      console.log(
+        `Skipping project ${projectId}: Snapshot is empty or does not exist.`
+      )
+      return
+    }
+
+    const [snapshotSize, changeSizes, changeTimestamps] = result
+
+    // Output snapshot size
+    outputStream.write(`${projectId},snapshotSize,${snapshotSize}\n`)
+    outputStream.write(`${projectId},changeCount,${changeSizes.length}\n`)
+
+    const changes = changeSizes.map((size, index) => [
+      size,
+      changeTimestamps[index],
+    ])
+
+    let totalChangeSize = 0
+    // Output change sizes
+    for (const [changeSize, changeTimestamp] of changes) {
+      totalChangeSize += parseInt(changeSize, 10)
+      const age = nowMs - new Date(changeTimestamp)
+      const ageInSeconds = Math.floor(age / 1000)
+      outputStream.write(`${projectId},change,${changeSize},${ageInSeconds}\n`)
+    }
+    outputStream.write(`${projectId},totalChangeSize,${totalChangeSize}\n`)
+  } catch (err) {
+    // Log error for this specific project but continue with others
+    console.error(`Error processing project ${projectId}:`, err)
+  }
+}
+
+async function main() {
+  const outputStream = process.stdout
+
+  // Write CSV header
+  outputStream.write('projectId,type,size,age\n')
+
+  try {
+    const scanPattern = 'snapshot:*'
+    console.log(`Scanning Redis for keys matching "${scanPattern}"...`)
+
+    for await (const keysBatch of scanRedisCluster(
+      rclientHistory,
+      scanPattern
+    )) {
+      for (const key of keysBatch) {
+        const parts = key.split(':')
+        if (parts.length !== 2 || parts[0] !== 'snapshot') {
+          console.warn(`Skipping malformed key: ${key}`)
+          continue
+        }
+        const projectId = parts[1]
+
+        // Call processProject directly and await it sequentially
+        await processProject(projectId, outputStream)
+      }
+    }
+
+    console.log('Finished processing keys.')
+  } catch (error) {
+    console.error('Error during Redis scan:', error)
+  } finally {
+    await disconnect()
+    console.log('Redis connections closed.')
+  }
+}
+
+main().catch(err => {
+  console.error('Unhandled error in main:', err)
+  process.exit(1)
+})
diff --git a/services/history-v1/storage/scripts/persist_and_expire_queues.sh b/services/history-v1/storage/scripts/persist_and_expire_queues.sh
new file mode 100644
index 0000000000..35b057f52c
--- /dev/null
+++ b/services/history-v1/storage/scripts/persist_and_expire_queues.sh
@@ -0,0 +1,3 @@
+#!/bin/sh
+node storage/scripts/persist_redis_chunks.mjs --queue --max-time 270
+node storage/scripts/expire_redis_chunks.js --post-request
diff --git a/services/history-v1/storage/scripts/persist_redis_chunks.mjs b/services/history-v1/storage/scripts/persist_redis_chunks.mjs
new file mode 100644
index 0000000000..dd7e9f3a51
--- /dev/null
+++ b/services/history-v1/storage/scripts/persist_redis_chunks.mjs
@@ -0,0 +1,181 @@
+import config from 'config'
+import PQueue from 'p-queue'
+import { fetchNothing } from '@overleaf/fetch-utils'
+import logger from '@overleaf/logger'
+import commandLineArgs from 'command-line-args'
+import * as redis from '../lib/redis.js'
+import knex from '../lib/knex.js'
+import knexReadOnly from '../lib/knex_read_only.js'
+import { client } from '../lib/mongodb.js'
+import { scanAndProcessDueItems } from '../lib/scan.js'
+import persistBuffer from '../lib/persist_buffer.js'
+import { claimPersistJob } from '../lib/chunk_store/redis.js'
+import { loadGlobalBlobs } from '../lib/blob_store/index.js'
+import { EventEmitter } from 'node:events'
+import { fileURLToPath } from 'node:url'
+
+// Something is registering 11 listeners, over the limit of 10, which generates
+// a lot of warning noise.
+EventEmitter.defaultMaxListeners = 11
+
+const rclient = redis.rclientHistory
+
+const optionDefinitions = [
+  { name: 'dry-run', alias: 'd', type: Boolean },
+  { name: 'queue', type: Boolean },
+  { name: 'max-time', type: Number },
+  { name: 'min-rate', type: Number, defaultValue: 1 },
+]
+const options = commandLineArgs(optionDefinitions)
+const DRY_RUN = options['dry-run'] || false
+const USE_QUEUE = options.queue || false
+const MAX_TIME = options['max-time'] || null
+const MIN_RATE = options['min-rate']
+const HISTORY_V1_URL = `http://${process.env.HISTORY_V1_HOST || 'localhost'}:${process.env.PORT || 3100}`
+let isShuttingDown = false
+
+logger.initialize('persist-redis-chunks')
+
+async function persistProjectAction(projectId) {
+  const job = await claimPersistJob(projectId)
+  // Set limits to force us to persist all of the changes.
+  const farFuture = new Date()
+  farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+  const limits = {
+    maxChanges: 0,
+    minChangeTimestamp: farFuture,
+    maxChangeTimestamp: farFuture,
+    autoResync: true,
+  }
+  await persistBuffer(projectId, limits)
+  if (job && job.close) {
+    await job.close()
+  }
+}
+
+async function requestProjectFlush(projectId) {
+  const job = await claimPersistJob(projectId)
+  logger.debug({ projectId }, 'sending project flush request')
+  const url = `${HISTORY_V1_URL}/api/projects/${projectId}/flush`
+  const credentials = Buffer.from(
+    `staging:${config.get('basicHttpAuth.password')}`
+  ).toString('base64')
+  await fetchNothing(url, {
+    method: 'POST',
+    headers: {
+      Authorization: `Basic ${credentials}`,
+    },
+  })
+  if (job && job.close) {
+    await job.close()
+  }
+}
+
+async function persistQueuedProjects(queuedProjects) {
+  const totalCount = queuedProjects.size
+  // Compute the rate at which we need to dispatch requests
+  const targetRate = MAX_TIME > 0 ? Math.ceil(totalCount / MAX_TIME) : 0
+  // Rate limit to spread the requests over the interval.
+  const queue = new PQueue({
+    intervalCap: Math.max(MIN_RATE, targetRate),
+    interval: 1000, // use a 1 second interval
+  })
+  logger.info(
+    { totalCount, targetRate, minRate: MIN_RATE, maxTime: MAX_TIME },
+    'dispatching project flush requests'
+  )
+  const startTime = Date.now()
+  let dispatchedCount = 0
+  for (const projectId of queuedProjects) {
+    if (isShuttingDown) {
+      logger.info('Shutting down, stopping project flush requests')
+      queue.clear()
+      break
+    }
+    queue.add(async () => {
+      try {
+        await requestProjectFlush(projectId)
+      } catch (err) {
+        logger.error({ err, projectId }, 'error while flushing project')
+      }
+    })
+    dispatchedCount++
+    if (dispatchedCount % 1000 === 0) {
+      logger.info(
+        { count: dispatchedCount },
+        'dispatched project flush requests'
+      )
+    }
+    await queue.onEmpty()
+  }
+  const elapsedTime = Math.floor((Date.now() - startTime) / 1000)
+  logger.info(
+    { count: totalCount, elapsedTime },
+    'dispatched project flush requests'
+  )
+  await queue.onIdle()
+}
+
+async function runPersistChunks() {
+  const queuedProjects = new Set()
+
+  async function queueProjectAction(projectId) {
+    queuedProjects.add(projectId)
+  }
+
+  await loadGlobalBlobs()
+  await scanAndProcessDueItems(
+    rclient,
+    'persistChunks',
+    'persist-time',
+    USE_QUEUE ? queueProjectAction : persistProjectAction,
+    DRY_RUN
+  )
+
+  if (USE_QUEUE) {
+    if (isShuttingDown) {
+      logger.info('Shutting down, skipping queued project persistence')
+      return
+    }
+    logger.info(
+      { count: queuedProjects.size },
+      'queued projects for persistence'
+    )
+    await persistQueuedProjects(queuedProjects)
+  }
+}
+
+async function main() {
+  try {
+    await runPersistChunks()
+  } catch (err) {
+    logger.fatal(
+      { err, taskName: 'persistChunks' },
+      'Unhandled error in runPersistChunks'
+    )
+    process.exit(1)
+  } finally {
+    await redis.disconnect()
+    await client.close()
+    await knex.destroy()
+    await knexReadOnly.destroy()
+  }
+}
+
+function gracefulShutdown() {
+  if (isShuttingDown) {
+    return
+  }
+  isShuttingDown = true
+  logger.info({ isShuttingDown }, 'received shutdown signal, cleaning up...')
+}
+
+// Check if the module is being run directly
+const currentScriptPath = fileURLToPath(import.meta.url)
+if (process.argv[1] === currentScriptPath) {
+  process.on('SIGINT', gracefulShutdown)
+  process.on('SIGTERM', gracefulShutdown)
+  main()
+}
+
+export { runPersistChunks }
diff --git a/services/history-v1/storage/scripts/recover_doc_versions.js b/services/history-v1/storage/scripts/recover_doc_versions.js
index f121c60afd..650fb20324 100644
--- a/services/history-v1/storage/scripts/recover_doc_versions.js
+++ b/services/history-v1/storage/scripts/recover_doc_versions.js
@@ -279,7 +279,7 @@ async function processProject(project, summary) {
 
 async function getHistoryDocVersions(project) {
   const historyId = project.overleaf.history.id
-  const chunk = await chunkStore.loadLatest(historyId)
+  const chunk = await chunkStore.loadLatest(historyId, { persistedOnly: true })
   if (chunk == null) {
     return []
   }
diff --git a/services/history-v1/storage/scripts/recover_zip_from_backup.mjs b/services/history-v1/storage/scripts/recover_zip_from_backup.mjs
new file mode 100644
index 0000000000..4cf7051fcd
--- /dev/null
+++ b/services/history-v1/storage/scripts/recover_zip_from_backup.mjs
@@ -0,0 +1,233 @@
+// @ts-check
+import { loadGlobalBlobs } from '../lib/blob_store/index.js'
+import commandLineArgs from 'command-line-args'
+import assert from '../lib/assert.js'
+import fs from 'node:fs'
+import { setTimeout } from 'node:timers/promises'
+import {
+  archiveLatestChunk,
+  archiveRawProject,
+  BackupPersistorError,
+} from '../lib/backupArchiver.mjs'
+import knex from '../lib/knex.js'
+import { client } from '../lib/mongodb.js'
+import archiver from 'archiver'
+import Events from 'node:events'
+import { Chunk } from 'overleaf-editor-core'
+import _ from 'lodash'
+
+// Silence warning.
+Events.setMaxListeners(20)
+
+const SUPPORTED_MODES = ['raw', 'latest']
+
+// Pads the mode name to a fixed length for better alignment in output.
+const padModeName = _.partialRight(
+  _.padEnd,
+  Math.max(...SUPPORTED_MODES.map(mode => mode.length))
+)
+
+const SUPPORTED_MODES_HELP = {
+  raw: 'Retrieve all chunk and blob files from the project backup.',
+  latest: 'Retrieves the last backed up state of the project.',
+}
+
+// outputFile needs to be available in the shutdown function (which may be called before it's declared)
+// eslint-disable-next-line prefer-const
+let outputFile
+
+/**
+ * Gracefully shutdown the process
+ * @param {number} code
+ */
+async function shutdown(code = 0) {
+  if (outputFile) {
+    outputFile.close()
+  }
+  await knex.destroy()
+  await client.close()
+  await setTimeout(1000)
+  process.exit(code)
+}
+
+function usage() {
+  console.log(
+    'Usage: node recover_zip_from_backup.mjs --historyId=<historyId> --output=<output> [--mode=<mode>] [--verbose] [--useBackupGlobalBlobs]'
+  )
+  console.log(
+    '--useBackupGlobalBlobs can be used if the global blobs have not been restored from the backup yet.'
+  )
+  console.log('Supported modes: ' + SUPPORTED_MODES.join(', '))
+  SUPPORTED_MODES.forEach(mode => {
+    console.log(
+      `    --mode=${padModeName(mode)} -  ${SUPPORTED_MODES_HELP[mode] || ''}`
+    )
+  })
+}
+
+/**
+ * @typedef {import('archiver').ZipArchive} ZipArchive
+ */
+
+/**
+ * @typedef {import('archiver').ProgressData} ProgressData
+ */
+
+/**
+ * @typedef {import('archiver').EntryData} EntryData
+ */
+
+/**
+ * @typedef {Object} ArchiverError
+ * @property {string} message
+ * @property {string} code
+ * @property {Object} data
+ */
+
+let historyId, help, mode, output, useBackupGlobalBlobs, verbose
+
+try {
+  ;({ historyId, help, mode, output, useBackupGlobalBlobs, verbose } =
+    commandLineArgs([
+      { name: 'historyId', type: String },
+      { name: 'output', type: String },
+      { name: 'mode', type: String, defaultValue: 'raw' },
+      { name: 'verbose', type: Boolean, defaultValue: false },
+      { name: 'useBackupGlobalBlobs', type: Boolean, defaultValue: false },
+      { name: 'help', type: Boolean },
+    ]))
+} catch (err) {
+  console.error(err instanceof Error ? err.message : err)
+  help = true
+}
+
+if (help) {
+  usage()
+  await shutdown(0)
+}
+
+if (!historyId) {
+  console.error('missing --historyId')
+  usage()
+  await shutdown(1)
+}
+
+if (!output) {
+  console.error('missing --output')
+  usage()
+  await shutdown(1)
+}
+
+try {
+  assert.projectId(historyId)
+} catch (error) {
+  console.error('Invalid history ID')
+  await shutdown(1)
+}
+
+if (!SUPPORTED_MODES.includes(mode)) {
+  console.error(
+    'Invalid mode; supported modes are: ' + SUPPORTED_MODES.join(', ')
+  )
+  await shutdown(1)
+}
+
+await loadGlobalBlobs()
+
+outputFile = fs.createWriteStream(output)
+
+const archive = archiver.create('zip', {})
+
+archive.on('close', function () {
+  console.log(archive.pointer() + ' total bytes')
+  console.log(`Wrote ${output}`)
+  shutdown().catch(e => console.error('Error shutting down', e))
+})
+
+archive.on(
+  'error',
+  /**
+   *
+   * @param {ArchiverError} e
+   */
+  function (e) {
+    console.error(`Error writing archive: ${e.message}`)
+  }
+)
+
+archive.on('end', function () {
+  console.log(`Wrote ${archive.pointer()} total bytes to ${output}`)
+  shutdown().catch(e => console.error('Error shutting down', e))
+})
+
+archive.on(
+  'progress',
+  /**
+   *
+   * @param {ProgressData} progress
+   */
+  function (progress) {
+    if (verbose) {
+      console.log(
+        `${progress.entries.processed} processed out of ${progress.entries.total}`
+      )
+    }
+  }
+)
+
+archive.on(
+  'entry',
+  /**
+   *
+   * @param {EntryData} entry
+   */
+  function (entry) {
+    if (verbose) {
+      console.log(`${entry.name} added`)
+    }
+  }
+)
+
+archive.on(
+  'warning',
+  /**
+   *
+   * @param {ArchiverError} warning
+   */
+  function (warning) {
+    console.warn(`Warning encountered when writing archive: ${warning.message}`)
+  }
+)
+
+try {
+  switch (mode) {
+    case 'latest':
+      await archiveLatestChunk(archive, historyId, useBackupGlobalBlobs)
+      break
+    case 'raw':
+    default:
+      await archiveRawProject(archive, historyId, useBackupGlobalBlobs)
+      break
+  }
+  archive.pipe(outputFile)
+} catch (error) {
+  if (error instanceof BackupPersistorError) {
+    console.error(error.message)
+  }
+  if (error instanceof Chunk.NotPersistedError) {
+    console.error('Chunk not found. Project may not have been fully backed up.')
+  }
+  if (verbose) {
+    console.error(error)
+  } else {
+    console.error('Error encountered when writing archive')
+  }
+} finally {
+  await Promise.race([
+    await archive.finalize(),
+    setTimeout(10000).then(() => {
+      console.error('Archive did not finalize in time')
+      return shutdown(1)
+    }),
+  ])
+}
diff --git a/services/history-v1/storage/scripts/redis.mjs b/services/history-v1/storage/scripts/redis.mjs
index bf46452ba4..ce9a39891f 100644
--- a/services/history-v1/storage/scripts/redis.mjs
+++ b/services/history-v1/storage/scripts/redis.mjs
@@ -1,11 +1,28 @@
 import redis from '@overleaf/redis-wrapper'
 import config from 'config'
 
-const redisOptions = config.get('redis.queue')
+// Get allowed Redis dbs from config
+const redisConfig = config.get('redis')
+const allowedDbs = Object.keys(redisConfig)
 
+// Get the Redis db from command line argument or use the first available db as default
+const db = process.argv[2]
+
+// Validate redis db
+if (!allowedDbs.includes(db)) {
+  if (db) {
+    console.error('Invalid redis db:', db)
+  }
+  console.error(`Usage: node redis.mjs [${allowedDbs.join('|')}]`)
+  process.exit(1)
+}
+
+// Get redis options based on command line argument
+const redisOptions = config.get(`redis.${db}`)
+console.log('Using redis db:', db)
 console.log('REDIS CONFIG', {
   ...redisOptions,
-  password: '*'.repeat(redisOptions.password.length),
+  password: '*'.repeat(redisOptions.password?.length),
 })
 const rclient = redis.createClient(redisOptions)
 
diff --git a/services/history-v1/storage/scripts/show.mjs b/services/history-v1/storage/scripts/show.mjs
index 04ec6c61a8..51697dc38f 100644
--- a/services/history-v1/storage/scripts/show.mjs
+++ b/services/history-v1/storage/scripts/show.mjs
@@ -6,6 +6,7 @@ import {
 } from '../lib/chunk_store/index.js'
 import { client } from '../lib/mongodb.js'
 import knex from '../lib/knex.js'
+import redis from '../lib/redis.js'
 import {
   loadGlobalBlobs,
   BlobStore,
@@ -47,7 +48,16 @@ async function listChunks(historyId) {
 async function fetchChunkLocal(historyId, version) {
   const chunkRecord = await getChunkMetadataForVersion(historyId, version)
   const chunk = await loadAtVersion(historyId, version)
-  return { key: version, chunk, metadata: chunkRecord, source: 'local storage' }
+  const persistedChunk = await loadAtVersion(historyId, version, {
+    persistedOnly: true,
+  })
+  return {
+    key: version,
+    chunk,
+    persistedChunk,
+    metadata: chunkRecord,
+    source: 'local storage',
+  }
 }
 
 async function fetchChunkRemote(historyId, version) {
@@ -72,7 +82,7 @@ async function fetchChunkRemote(historyId, version) {
 }
 
 async function displayChunk(historyId, version, options) {
-  const { key, chunk, metadata, source } = await (options.remote
+  const { key, chunk, persistedChunk, metadata, source } = await (options.remote
     ? fetchChunkRemote(historyId, version)
     : fetchChunkLocal(historyId, version))
   console.log('Source:', source)
@@ -80,6 +90,18 @@ async function displayChunk(historyId, version, options) {
   console.log('Key', key)
   // console.log('Number of changes', chunk.getChanges().length)
   console.log(JSON.stringify(chunk))
+  if (
+    persistedChunk &&
+    persistedChunk.getChanges().length !== chunk.getChanges().length
+  ) {
+    console.warn(
+      'Warning: Local chunk and persisted chunk have different number of changes:',
+      chunk.getChanges().length,
+      'local (including buffer) vs',
+      persistedChunk.getChanges().length,
+      'persisted'
+    )
+  }
 }
 
 async function fetchBlobRemote(historyId, blobHash) {
@@ -247,4 +269,7 @@ main()
   .finally(() => {
     knex.destroy().catch(err => console.error('Error closing Postgres:', err))
     client.close().catch(err => console.error('Error closing MongoDB:', err))
+    redis
+      .disconnect()
+      .catch(err => console.error('Error disconnecting Redis:', err))
   })
diff --git a/services/history-v1/storage/scripts/show_buffer.js b/services/history-v1/storage/scripts/show_buffer.js
new file mode 100644
index 0000000000..1d80ee227d
--- /dev/null
+++ b/services/history-v1/storage/scripts/show_buffer.js
@@ -0,0 +1,117 @@
+#!/usr/bin/env node
+// @ts-check
+
+const { rclientHistory: rclient } = require('../lib/redis')
+const { keySchema } = require('../lib/chunk_store/redis')
+const commandLineArgs = require('command-line-args')
+
+const optionDefinitions = [
+  { name: 'historyId', type: String, defaultOption: true },
+]
+
+// Column width for key display alignment; can be overridden with COL_WIDTH env variable
+const COLUMN_WIDTH = process.env.COL_WIDTH
+  ? parseInt(process.env.COL_WIDTH, 10)
+  : 45
+
+let options
+try {
+  options = commandLineArgs(optionDefinitions)
+} catch (e) {
+  console.error(
+    'Error parsing command line arguments:',
+    e instanceof Error ? e.message : String(e)
+  )
+  console.error('Usage: ./show_buffer.js <historyId>')
+  process.exit(1)
+}
+
+const { historyId } = options
+
+if (!historyId) {
+  console.error('Usage: ./show_buffer.js <historyId>')
+  process.exit(1)
+}
+
+function format(str, indent = COLUMN_WIDTH + 2) {
+  const lines = str.split('\n')
+  for (let i = 1; i < lines.length; i++) {
+    lines[i] = ' '.repeat(indent) + lines[i]
+  }
+  return lines.join('\n')
+}
+
+async function displayKeyValue(
+  rclient,
+  key,
+  { parseJson = false, formatDate = false } = {}
+) {
+  const value = await rclient.get(key)
+  let displayValue = '(nil)'
+  if (value) {
+    if (parseJson) {
+      try {
+        displayValue = format(JSON.stringify(JSON.parse(value), null, 2))
+      } catch (e) {
+        displayValue = `  Raw value: ${value}`
+      }
+    } else if (formatDate) {
+      const ts = parseInt(value, 10)
+      displayValue = `${new Date(ts).toISOString()} (${value})`
+    } else {
+      displayValue = value
+    }
+  }
+  console.log(`${key.padStart(COLUMN_WIDTH)}: ${displayValue}`)
+}
+
+async function displayBuffer(projectId) {
+  console.log(`Buffer for history ID: ${projectId}`)
+  console.log('--------------------------------------------------')
+
+  try {
+    const headKey = keySchema.head({ projectId })
+    const headVersionKey = keySchema.headVersion({ projectId })
+    const persistedVersionKey = keySchema.persistedVersion({ projectId })
+    const expireTimeKey = keySchema.expireTime({ projectId })
+    const persistTimeKey = keySchema.persistTime({ projectId })
+    const changesKey = keySchema.changes({ projectId })
+
+    await displayKeyValue(rclient, headKey, { parseJson: true })
+    await displayKeyValue(rclient, headVersionKey)
+    await displayKeyValue(rclient, persistedVersionKey)
+    await displayKeyValue(rclient, expireTimeKey, { formatDate: true })
+    await displayKeyValue(rclient, persistTimeKey, { formatDate: true })
+
+    const changesList = await rclient.lrange(changesKey, 0, -1)
+
+    // 6. changes
+    let changesListDisplay = '(nil)'
+    if (changesList) {
+      changesListDisplay = changesList.length
+        ? format(
+            changesList
+              .map((change, index) => `[${index}]: ${change}`)
+              .join('\n')
+          )
+        : '(empty list)'
+    }
+    console.log(`${changesKey.padStart(COLUMN_WIDTH)}: ${changesListDisplay}`)
+  } catch (error) {
+    console.error('Error fetching data from Redis:', error)
+    throw error
+  }
+}
+
+;(async () => {
+  let errorOccurred = false
+  try {
+    await displayBuffer(historyId)
+  } catch (error) {
+    errorOccurred = true
+  } finally {
+    rclient.quit(() => {
+      process.exit(errorOccurred ? 1 : 0)
+    })
+  }
+})()
diff --git a/services/history-v1/storage/scripts/verify_backed_up_blobs.mjs b/services/history-v1/storage/scripts/verify_backed_up_blobs.mjs
index f4778c382f..257238aad4 100644
--- a/services/history-v1/storage/scripts/verify_backed_up_blobs.mjs
+++ b/services/history-v1/storage/scripts/verify_backed_up_blobs.mjs
@@ -16,6 +16,7 @@ import {
   db,
   client,
 } from '../lib/mongodb.js'
+import redis from '../lib/redis.js'
 import commandLineArgs from 'command-line-args'
 import fs from 'node:fs'
 
@@ -146,4 +147,7 @@ main()
       console.error('Error closing Postgres connection:', err)
     })
     client.close().catch(err => console.error('Error closing MongoDB:', err))
+    redis.disconnect().catch(err => {
+      console.error('Error disconnecting Redis:', err)
+    })
   })
diff --git a/services/history-v1/storage/scripts/verify_project.mjs b/services/history-v1/storage/scripts/verify_project.mjs
index 6e1cb9de89..3c26f9b5da 100644
--- a/services/history-v1/storage/scripts/verify_project.mjs
+++ b/services/history-v1/storage/scripts/verify_project.mjs
@@ -2,6 +2,7 @@ import commandLineArgs from 'command-line-args'
 import { verifyProjectWithErrorContext } from '../lib/backupVerifier.mjs'
 import knex from '../lib/knex.js'
 import { client } from '../lib/mongodb.js'
+import redis from '../lib/redis.js'
 import { setTimeout } from 'node:timers/promises'
 import { loadGlobalBlobs } from '../lib/blob_store/index.js'
 
@@ -10,6 +11,7 @@ const { historyId } = commandLineArgs([{ name: 'historyId', type: String }])
 async function gracefulShutdown(code = process.exitCode) {
   await knex.destroy()
   await client.close()
+  await redis.disconnect()
   await setTimeout(1_000)
   process.exit(code)
 }
diff --git a/services/history-v1/storage/scripts/verify_sampled_projects.mjs b/services/history-v1/storage/scripts/verify_sampled_projects.mjs
index e5b2d0c347..a74a8b9798 100644
--- a/services/history-v1/storage/scripts/verify_sampled_projects.mjs
+++ b/services/history-v1/storage/scripts/verify_sampled_projects.mjs
@@ -14,6 +14,7 @@ import { loadGlobalBlobs } from '../lib/blob_store/index.js'
 import { getDatesBeforeRPO } from '../../backupVerifier/utils.mjs'
 import { EventEmitter } from 'node:events'
 import { mongodb } from '../index.js'
+import redis from '../lib/redis.js'
 
 logger.logger.level('fatal')
 
@@ -30,6 +31,7 @@ const usageMessage = [
 async function gracefulShutdown(code = process.exitCode) {
   await knex.destroy()
   await client.close()
+  await redis.disconnect()
   await setTimeout(1_000)
   process.exit(code)
 }
diff --git a/services/history-v1/storage/tasks/fix_duplicate_versions.js b/services/history-v1/storage/tasks/fix_duplicate_versions.js
index a7db4b2765..ae9dcb4965 100755
--- a/services/history-v1/storage/tasks/fix_duplicate_versions.js
+++ b/services/history-v1/storage/tasks/fix_duplicate_versions.js
@@ -34,7 +34,7 @@ async function main() {
 
 async function processProject(projectId, save) {
   console.log(`Project ${projectId}:`)
-  const chunk = await chunkStore.loadLatest(projectId)
+  const chunk = await chunkStore.loadLatest(projectId, { persistedOnly: true })
   let numChanges = 0
   numChanges += removeDuplicateProjectVersions(chunk)
   numChanges += removeDuplicateDocVersions(chunk)
diff --git a/services/history-v1/test/acceptance/js/api/backupVerifier.test.mjs b/services/history-v1/test/acceptance/js/api/backupVerifier.test.mjs
index fe3a4d1591..0a1fa528ab 100644
--- a/services/history-v1/test/acceptance/js/api/backupVerifier.test.mjs
+++ b/services/history-v1/test/acceptance/js/api/backupVerifier.test.mjs
@@ -30,14 +30,17 @@ import { historyStore } from '../../../../storage/lib/history_store.js'
  * @typedef {import("overleaf-editor-core").Blob} Blob
  */
 
-async function verifyProjectScript(historyId) {
+// Timeout for script execution, increased to avoid flaky tests
+const SCRIPT_TIMEOUT = 15_000
+
+async function verifyProjectScript(historyId, expectFail = true) {
   try {
     const result = await promisify(execFile)(
       process.argv0,
       ['storage/scripts/verify_project.mjs', `--historyId=${historyId}`],
       {
         encoding: 'utf-8',
-        timeout: 5_000,
+        timeout: SCRIPT_TIMEOUT,
         env: {
           ...process.env,
           LOG_LEVEL: 'warn',
@@ -53,6 +56,9 @@ async function verifyProjectScript(historyId) {
       'code' in err &&
       'stderr' in err
     ) {
+      if (!expectFail) {
+        console.log(err)
+      }
       return {
         stdout: typeof err.stdout === 'string' ? err.stdout : '',
         status: typeof err.code === 'number' ? err.code : -1,
@@ -68,7 +74,7 @@ async function verifyProjectScript(historyId) {
  * @param {string} hash
  * @return {Promise<{stdout: string, status:number }>}
  */
-async function verifyBlobScript(historyId, hash) {
+async function verifyBlobScript(historyId, hash, expectFail = true) {
   try {
     const result = await promisify(execFile)(
       process.argv0,
@@ -79,7 +85,7 @@ async function verifyBlobScript(historyId, hash) {
       ],
       {
         encoding: 'utf-8',
-        timeout: 5_000,
+        timeout: SCRIPT_TIMEOUT,
         env: {
           ...process.env,
           LOG_LEVEL: 'warn',
@@ -89,6 +95,9 @@ async function verifyBlobScript(historyId, hash) {
     return { status: 0, stdout: result.stdout }
   } catch (err) {
     if (err && typeof err === 'object' && 'stdout' in err && 'code' in err) {
+      if (!expectFail) {
+        console.log(err)
+      }
       return {
         stdout: typeof err.stdout === 'string' ? err.stdout : '',
         status: typeof err.code === 'number' ? err.code : -1,
@@ -110,17 +119,17 @@ async function verifyBlobHTTP(historyId, hash) {
 }
 
 async function backupChunk(historyId) {
-  const newChunk = await chunkStore.loadLatestRaw(historyId)
+  const newChunkMetadata = await chunkStore.getLatestChunkMetadata(historyId)
   const { buffer: chunkBuffer } = await historyStore.loadRawWithBuffer(
     historyId,
-    newChunk.id
+    newChunkMetadata.id
   )
   const md5 = Crypto.createHash('md5').update(chunkBuffer)
   await backupPersistor.sendStream(
     chunksBucket,
     path.join(
       projectKey.format(historyId),
-      projectKey.pad(newChunk.startVersion)
+      projectKey.pad(newChunkMetadata.startVersion)
     ),
     Stream.Readable.from([chunkBuffer]),
     {
@@ -140,14 +149,14 @@ async function addFileInNewChunk(
   historyId,
   { creationDate = new Date() }
 ) {
-  const chunk = await chunkStore.loadLatest(historyId)
+  const chunk = await chunkStore.loadLatest(historyId, { persistedOnly: true })
   const operation = Operation.addFile(
     `${historyId}.txt`,
     File.fromString(fileContents)
   )
   const changes = [new Change([operation], creationDate, [])]
   chunk.pushChanges(changes)
-  await chunkStore.update(historyId, 0, chunk)
+  await chunkStore.update(historyId, chunk)
 }
 
 /**
@@ -202,6 +211,7 @@ async function checkDEKExists(historyId) {
 }
 
 describe('backupVerifier', function () {
+  this.timeout(5_000 + SCRIPT_TIMEOUT) // allow time for external scripts to run
   const historyIdPostgres = '42'
   const historyIdMongo = '000000000000000000000042'
   let blobHashPG, blobHashMongo, blobPathPG
@@ -228,7 +238,7 @@ describe('backupVerifier', function () {
   describe('storage/scripts/verify_project.mjs', function () {
     describe('when the project is appropriately backed up', function () {
       it('should return 0', async function () {
-        const response = await verifyProjectScript(historyIdPostgres)
+        const response = await verifyProjectScript(historyIdPostgres, false)
         expect(response.status).to.equal(0)
       })
     })
@@ -306,12 +316,20 @@ describe('backupVerifier', function () {
       expect(result.stdout).to.include('hash mismatch for backed up blob')
     })
     it('should successfully verify from postgres', async function () {
-      const result = await verifyBlobScript(historyIdPostgres, blobHashPG)
+      const result = await verifyBlobScript(
+        historyIdPostgres,
+        blobHashPG,
+        false
+      )
       expect(result.status).to.equal(0)
       expect(result.stdout.split('\n')).to.include('OK')
     })
     it('should successfully verify from mongo', async function () {
-      const result = await verifyBlobScript(historyIdMongo, blobHashMongo)
+      const result = await verifyBlobScript(
+        historyIdMongo,
+        blobHashMongo,
+        false
+      )
       expect(result.status).to.equal(0)
       expect(result.stdout.split('\n')).to.include('OK')
     })
diff --git a/services/history-v1/test/acceptance/js/api/project_expiry.test.js b/services/history-v1/test/acceptance/js/api/project_expiry.test.js
new file mode 100644
index 0000000000..efa589ec71
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/api/project_expiry.test.js
@@ -0,0 +1,82 @@
+'use strict'
+
+const BPromise = require('bluebird')
+const { expect } = require('chai')
+const HTTPStatus = require('http-status')
+const fetch = require('node-fetch')
+const fs = BPromise.promisifyAll(require('node:fs'))
+
+const cleanup = require('../storage/support/cleanup')
+const fixtures = require('../storage/support/fixtures')
+const testFiles = require('../storage/support/test_files')
+const testProjects = require('./support/test_projects')
+const testServer = require('./support/test_server')
+
+const { Change, File, Operation } = require('overleaf-editor-core')
+const queueChanges = require('../../../../storage/lib/queue_changes')
+const { getState } = require('../../../../storage/lib/chunk_store/redis')
+
+describe('project expiry', function () {
+  beforeEach(cleanup.everything)
+  beforeEach(fixtures.create)
+
+  it('expire redis buffer', async function () {
+    const basicAuthClient = testServer.basicAuthClient
+    const projectId = await testProjects.createEmptyProject()
+
+    // upload an empty file
+    const response = await fetch(
+      testServer.url(
+        `/api/projects/${projectId}/blobs/${File.EMPTY_FILE_HASH}`,
+        { qs: { pathname: 'main.tex' } }
+      ),
+      {
+        method: 'PUT',
+        body: fs.createReadStream(testFiles.path('empty.tex')),
+        headers: {
+          Authorization: testServer.basicAuthHeader,
+        },
+      }
+    )
+    expect(response.ok).to.be.true
+
+    const testFile = File.fromHash(File.EMPTY_FILE_HASH)
+    const testChange = new Change(
+      [Operation.addFile('main.tex', testFile)],
+      new Date()
+    )
+    await queueChanges(projectId, [testChange], 0)
+
+    // Verify that the changes are queued and not yet persisted
+    const initialState = await getState(projectId)
+    expect(initialState.persistedVersion).to.be.null
+    expect(initialState.changes).to.have.lengthOf(1)
+
+    const importResponse =
+      await basicAuthClient.apis.ProjectImport.flushChanges({
+        project_id: projectId,
+      })
+
+    expect(importResponse.status).to.equal(HTTPStatus.OK)
+
+    // Verify that the changes were persisted to the chunk store
+    const flushedState = await getState(projectId)
+    expect(flushedState.persistedVersion).to.equal(1)
+
+    const expireResponse =
+      await basicAuthClient.apis.ProjectImport.expireProject({
+        project_id: projectId,
+      })
+    expect(expireResponse.status).to.equal(HTTPStatus.OK)
+
+    const finalState = await getState(projectId)
+    expect(finalState).to.deep.equal({
+      changes: [],
+      expireTime: null,
+      headSnapshot: null,
+      headVersion: null,
+      persistTime: null,
+      persistedVersion: null,
+    })
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/api/project_flush.test.js b/services/history-v1/test/acceptance/js/api/project_flush.test.js
new file mode 100644
index 0000000000..f8d0b23d8e
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/api/project_flush.test.js
@@ -0,0 +1,66 @@
+'use strict'
+
+const BPromise = require('bluebird')
+const { expect } = require('chai')
+const HTTPStatus = require('http-status')
+const fetch = require('node-fetch')
+const fs = BPromise.promisifyAll(require('node:fs'))
+
+const cleanup = require('../storage/support/cleanup')
+const fixtures = require('../storage/support/fixtures')
+const testFiles = require('../storage/support/test_files')
+const testProjects = require('./support/test_projects')
+const testServer = require('./support/test_server')
+
+const { Change, File, Operation } = require('overleaf-editor-core')
+const queueChanges = require('../../../../storage/lib/queue_changes')
+const { getState } = require('../../../../storage/lib/chunk_store/redis')
+
+describe('project flush', function () {
+  beforeEach(cleanup.everything)
+  beforeEach(fixtures.create)
+
+  it('persists queued changes to the chunk store', async function () {
+    const basicAuthClient = testServer.basicAuthClient
+    const projectId = await testProjects.createEmptyProject()
+
+    // upload an empty file
+    const response = await fetch(
+      testServer.url(
+        `/api/projects/${projectId}/blobs/${File.EMPTY_FILE_HASH}`,
+        { qs: { pathname: 'main.tex' } }
+      ),
+      {
+        method: 'PUT',
+        body: fs.createReadStream(testFiles.path('empty.tex')),
+        headers: {
+          Authorization: testServer.basicAuthHeader,
+        },
+      }
+    )
+    expect(response.ok).to.be.true
+
+    const testFile = File.fromHash(File.EMPTY_FILE_HASH)
+    const testChange = new Change(
+      [Operation.addFile('main.tex', testFile)],
+      new Date()
+    )
+    await queueChanges(projectId, [testChange], 0)
+
+    // Verify that the changes are queued and not yet persisted
+    const initialState = await getState(projectId)
+    expect(initialState.persistedVersion).to.be.null
+    expect(initialState.changes).to.have.lengthOf(1)
+
+    const importResponse =
+      await basicAuthClient.apis.ProjectImport.flushChanges({
+        project_id: projectId,
+      })
+
+    expect(importResponse.status).to.equal(HTTPStatus.OK)
+
+    // Verify that the changes were persisted to the chunk store
+    const finalState = await getState(projectId)
+    expect(finalState.persistedVersion).to.equal(1)
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/api/project_import.test.js b/services/history-v1/test/acceptance/js/api/project_import.test.js
index 216fb527fa..fb173238f8 100644
--- a/services/history-v1/test/acceptance/js/api/project_import.test.js
+++ b/services/history-v1/test/acceptance/js/api/project_import.test.js
@@ -52,6 +52,6 @@ describe('project import', function () {
       })
 
     expect(importResponse.status).to.equal(HTTPStatus.CREATED)
-    expect(importResponse.obj).to.deep.equal({})
+    expect(importResponse.obj).to.deep.equal({ resyncNeeded: false })
   })
 })
diff --git a/services/history-v1/test/acceptance/js/api/project_updates.test.js b/services/history-v1/test/acceptance/js/api/project_updates.test.js
index d67000245a..f50f3677b5 100644
--- a/services/history-v1/test/acceptance/js/api/project_updates.test.js
+++ b/services/history-v1/test/acceptance/js/api/project_updates.test.js
@@ -580,7 +580,7 @@ describe('history import', function () {
       .catch(expectResponse.unprocessableEntity)
       .then(getLatestContent)
       .then(response => {
-        // Check that no chaes were made
+        // Check that no changes were made
         const snapshot = Snapshot.fromRaw(response.obj)
         expect(snapshot.countFiles()).to.equal(1)
         expect(snapshot.getFile(mainFilePathname).getHash()).to.equal(
diff --git a/services/history-v1/test/acceptance/js/api/projects.test.js b/services/history-v1/test/acceptance/js/api/projects.test.js
index 7af8b0172f..22220ae8bd 100644
--- a/services/history-v1/test/acceptance/js/api/projects.test.js
+++ b/services/history-v1/test/acceptance/js/api/projects.test.js
@@ -10,7 +10,12 @@ const cleanup = require('../storage/support/cleanup')
 const fixtures = require('../storage/support/fixtures')
 const testFiles = require('../storage/support/test_files')
 
-const { zipStore, persistChanges } = require('../../../../storage')
+const {
+  zipStore,
+  BlobStore,
+  persistChanges,
+  redisBuffer,
+} = require('../../../../storage')
 
 const { expectHttpError } = require('./support/expect_response')
 const testServer = require('./support/test_server')
@@ -21,6 +26,8 @@ const {
   Snapshot,
   Change,
   AddFileOperation,
+  EditFileOperation,
+  TextOperation,
 } = require('overleaf-editor-core')
 const testProjects = require('./support/test_projects')
 
@@ -103,57 +110,195 @@ describe('project controller', function () {
     // https://github.com/overleaf/write_latex/pull/5120#discussion_r244291862
   })
 
-  describe('getLatestHashedContent', function () {
-    let limitsToPersistImmediately
+  describe('project with changes', function () {
+    let projectId
 
-    before(function () {
+    beforeEach(async function () {
       // used to provide a limit which forces us to persist all of the changes.
       const farFuture = new Date()
       farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
-      limitsToPersistImmediately = {
+      const limits = {
         minChangeTimestamp: farFuture,
         maxChangeTimestamp: farFuture,
       }
-    })
-
-    it('returns a snaphot', async function () {
       const changes = [
         new Change(
           [new AddFileOperation('test.tex', File.fromString('ab'))],
           new Date(),
           []
         ),
+        new Change(
+          [new AddFileOperation('other.tex', File.fromString('hello'))],
+          new Date(),
+          []
+        ),
       ]
 
-      const projectId = await createEmptyProject()
-      await persistChanges(projectId, changes, limitsToPersistImmediately, 0)
-      const response =
-        await testServer.basicAuthClient.apis.Project.getLatestHashedContent({
-          project_id: projectId,
-        })
-      expect(response.status).to.equal(HTTPStatus.OK)
-      const snapshot = Snapshot.fromRaw(response.obj)
-      expect(snapshot.countFiles()).to.equal(1)
-      expect(snapshot.getFile('test.tex').getHash()).to.equal(
-        testFiles.STRING_AB_HASH
-      )
+      projectId = await createEmptyProject()
+      await persistChanges(projectId, changes, limits, 0)
     })
-    describe('getLatestHistoryRaw', function () {
-      it('should handles read', async function () {
-        const projectId = fixtures.docs.initializedProject.id
+
+    describe('getLatestHashedContent', function () {
+      it('returns a snapshot', async function () {
         const response =
-          await testServer.pseudoJwtBasicAuthClient.apis.Project.getLatestHistoryRaw(
-            {
-              project_id: projectId,
-              readOnly: 'true',
-            }
+          await testServer.basicAuthClient.apis.Project.getLatestHashedContent({
+            project_id: projectId,
+          })
+        expect(response.status).to.equal(HTTPStatus.OK)
+        const snapshot = Snapshot.fromRaw(response.obj)
+        expect(snapshot.countFiles()).to.equal(2)
+        expect(snapshot.getFile('test.tex').getHash()).to.equal(
+          testFiles.STRING_AB_HASH
+        )
+      })
+    })
+
+    describe('getChanges', function () {
+      it('returns all changes when not given a limit', async function () {
+        const response =
+          await testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+          })
+        expect(response.status).to.equal(HTTPStatus.OK)
+        const { changes, hasMore } = response.obj
+        expect(changes.length).to.equal(2)
+        const filenames = changes
+          .flatMap(change => change.operations)
+          .map(operation => operation.pathname)
+        expect(filenames).to.deep.equal(['test.tex', 'other.tex'])
+        expect(hasMore).to.be.false
+      })
+
+      it('returns only requested changes', async function () {
+        const response =
+          await testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+            since: 1,
+          })
+        expect(response.status).to.equal(HTTPStatus.OK)
+        const { changes, hasMore } = response.obj
+        expect(changes.length).to.equal(1)
+        const filenames = changes
+          .flatMap(change => change.operations)
+          .map(operation => operation.pathname)
+        expect(filenames).to.deep.equal(['other.tex'])
+        expect(hasMore).to.be.false
+      })
+
+      it('rejects negative versions', async function () {
+        await expect(
+          testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+            since: -1,
+          })
+        ).to.be.rejectedWith('Bad Request')
+      })
+
+      it('rejects out of bounds versions', async function () {
+        await expect(
+          testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+            since: 20,
+          })
+        ).to.be.rejectedWith('Bad Request')
+      })
+    })
+
+    describe('project with many chunks', function () {
+      let projectId, changes
+
+      beforeEach(async function () {
+        // used to provide a limit which forces us to persist all of the changes.
+        const farFuture = new Date()
+        farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+        const limits = {
+          minChangeTimestamp: farFuture,
+          maxChangeTimestamp: farFuture,
+          maxChunkChanges: 5,
+        }
+        projectId = await createEmptyProject()
+        const blobStore = new BlobStore(projectId)
+        const blob = await blobStore.putString('')
+        changes = [
+          new Change(
+            [new AddFileOperation('test.tex', File.createLazyFromBlobs(blob))],
+            new Date(),
+            []
+          ),
+        ]
+
+        for (let i = 0; i < 20; i++) {
+          const textOperation = new TextOperation()
+          textOperation.retain(i)
+          textOperation.insert('x')
+          changes.push(
+            new Change(
+              [new EditFileOperation('test.tex', textOperation)],
+              new Date(),
+              []
+            )
           )
-        expect(response.body).to.deep.equal({
-          startVersion: 0,
-          endVersion: 1,
-          endTimestamp: '2032-01-01T00:00:00.000Z',
+        }
+
+        await persistChanges(projectId, changes, limits, 0)
+      })
+
+      it('returns the first chunk when not given a limit', async function () {
+        const response =
+          await testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+          })
+
+        expect(response.status).to.equal(HTTPStatus.OK)
+        expect(response.obj).to.deep.equal({
+          changes: changes.slice(0, 5).map(c => c.toRaw()),
+          hasMore: true,
         })
       })
+
+      it('returns only requested changes', async function () {
+        const response =
+          await testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+            since: 12,
+          })
+        expect(response.status).to.equal(HTTPStatus.OK)
+        expect(response.obj).to.deep.equal({
+          changes: changes.slice(12, 15).map(c => c.toRaw()),
+          hasMore: true,
+        })
+      })
+
+      it('returns changes in the latest chunk', async function () {
+        const response =
+          await testServer.basicAuthClient.apis.Project.getChanges({
+            project_id: projectId,
+            since: 20,
+          })
+        expect(response.status).to.equal(HTTPStatus.OK)
+        expect(response.obj).to.deep.equal({
+          changes: changes.slice(20).map(c => c.toRaw()),
+          hasMore: false,
+        })
+      })
+    })
+  })
+
+  describe('getLatestHistoryRaw', function () {
+    it('should handles read', async function () {
+      const projectId = fixtures.docs.initializedProject.id
+      const response =
+        await testServer.pseudoJwtBasicAuthClient.apis.Project.getLatestHistoryRaw(
+          {
+            project_id: projectId,
+            readOnly: 'true',
+          }
+        )
+      expect(response.body).to.deep.equal({
+        startVersion: 0,
+        endVersion: 1,
+        endTimestamp: '2032-01-01T00:00:00.000Z',
+      })
     })
   })
 
@@ -207,5 +352,60 @@ describe('project controller', function () {
       const response3 = await fetch(blobUrl, { headers: authHeaders })
       expect(response3.status).to.equal(HTTPStatus.NOT_FOUND)
     })
+
+    it('deletes the project from the redis buffer', async function () {
+      const projectId = await createEmptyProject()
+      const blobStore = new BlobStore(projectId)
+      const blob = await blobStore.putString('this is a test')
+      const snapshot = new Snapshot()
+      const change = new Change(
+        [new AddFileOperation('test.tex', File.createLazyFromBlobs(blob))],
+        new Date(),
+        []
+      )
+
+      await redisBuffer.queueChanges(projectId, snapshot, 0, [change])
+      const changesBefore = await redisBuffer.getNonPersistedChanges(
+        projectId,
+        0
+      )
+      expect(changesBefore.length).to.equal(1)
+
+      const deleteResponse =
+        await testServer.basicAuthClient.apis.Project.deleteProject({
+          project_id: projectId,
+        })
+      expect(deleteResponse.status).to.equal(HTTPStatus.NO_CONTENT)
+
+      const changesAfter = await redisBuffer.getNonPersistedChanges(
+        projectId,
+        0
+      )
+      expect(changesAfter.length).to.equal(0)
+
+      const finalState = await redisBuffer.getState(projectId)
+      expect(finalState).to.deep.equal({
+        changes: [],
+        expireTime: null,
+        headSnapshot: null,
+        headVersion: null,
+        persistTime: null,
+        persistedVersion: null,
+      })
+    })
+
+    it('deletes an empty project from the redis buffer', async function () {
+      const projectId = await createEmptyProject()
+      const deleteResponse =
+        await testServer.basicAuthClient.apis.Project.deleteProject({
+          project_id: projectId,
+        })
+      expect(deleteResponse.status).to.equal(HTTPStatus.NO_CONTENT)
+      const changesAfter = await redisBuffer.getNonPersistedChanges(
+        projectId,
+        0
+      )
+      expect(changesAfter.length).to.equal(0)
+    })
   })
 })
diff --git a/services/history-v1/test/acceptance/js/api/rollout.test.js b/services/history-v1/test/acceptance/js/api/rollout.test.js
new file mode 100644
index 0000000000..f1a65e5aff
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/api/rollout.test.js
@@ -0,0 +1,115 @@
+const config = require('config')
+const sinon = require('sinon')
+const { expect } = require('chai')
+
+const cleanup = require('../storage/support/cleanup')
+const Rollout = require('../../../../api/app/rollout')
+
+describe('rollout', function () {
+  beforeEach(cleanup.everything)
+  beforeEach('Set up stubs', function () {
+    sinon.stub(config, 'has').callThrough()
+    sinon.stub(config, 'get').callThrough()
+  })
+  afterEach(sinon.restore)
+
+  it('should return a valid history buffer level', function () {
+    setMockConfig('historyBufferLevel', '2')
+    setMockConfig('forcePersistBuffer', 'false')
+
+    const rollout = new Rollout(config)
+    const { historyBufferLevel, forcePersistBuffer } =
+      rollout.getHistoryBufferLevelOptions('test-project-id')
+    expect(historyBufferLevel).to.equal(2)
+    expect(forcePersistBuffer).to.be.false
+  })
+
+  it('should return a valid history buffer level and force persist buffer options', function () {
+    setMockConfig('historyBufferLevel', '1')
+    setMockConfig('forcePersistBuffer', 'true')
+    const rollout = new Rollout(config)
+    const { historyBufferLevel, forcePersistBuffer } =
+      rollout.getHistoryBufferLevelOptions('test-project-id')
+    expect(historyBufferLevel).to.equal(1)
+    expect(forcePersistBuffer).to.be.true
+  })
+
+  describe('with a higher next history buffer level rollout', function () {
+    beforeEach(function () {
+      setMockConfig('historyBufferLevel', '2')
+      setMockConfig('forcePersistBuffer', 'false')
+      setMockConfig('nextHistoryBufferLevel', '3')
+    })
+    it('should return the expected history buffer level when the rollout percentage is zero', function () {
+      setMockConfig('nextHistoryBufferLevelRolloutPercentage', '0')
+      const rollout = new Rollout(config)
+      for (let i = 0; i < 1000; i++) {
+        const { historyBufferLevel, forcePersistBuffer } =
+          rollout.getHistoryBufferLevelOptions(`test-project-id-${i}`)
+        expect(historyBufferLevel).to.equal(2)
+        expect(forcePersistBuffer).to.be.false
+      }
+    })
+
+    it('should return the expected distribution of levels when the rollout percentage is 10%', function () {
+      setMockConfig('nextHistoryBufferLevelRolloutPercentage', '10')
+      const rollout = new Rollout(config)
+      let currentLevel = 0
+      let nextLevel = 0
+      for (let i = 0; i < 1000; i++) {
+        const { historyBufferLevel } = rollout.getHistoryBufferLevelOptions(
+          `test-project-id-${i}`
+        )
+        switch (historyBufferLevel) {
+          case 2:
+            currentLevel++
+            break
+          case 3:
+            nextLevel++
+            break
+          default:
+            expect.fail(
+              `Unexpected history buffer level: ${historyBufferLevel}`
+            )
+        }
+      }
+      const twoPercentage = (currentLevel / 1000) * 100
+      const threePercentage = (nextLevel / 1000) * 100
+      expect(twoPercentage).to.be.closeTo(90, 5) // 90% for level 2
+      expect(threePercentage).to.be.closeTo(10, 5) // 10% for level 3
+    })
+  })
+  describe('with a next history buffer level lower than the current level', function () {
+    beforeEach(function () {
+      setMockConfig('historyBufferLevel', '3')
+      setMockConfig('forcePersistBuffer', 'false')
+      setMockConfig('nextHistoryBufferLevel', '2')
+    })
+    it('should always return the current level when the rollout percentage is zero', function () {
+      setMockConfig('nextHistoryBufferLevelRolloutPercentage', '0')
+      const rollout = new Rollout(config)
+      for (let i = 0; i < 1000; i++) {
+        const { historyBufferLevel, forcePersistBuffer } =
+          rollout.getHistoryBufferLevelOptions(`test-project-id-${i}`)
+        expect(historyBufferLevel).to.equal(3)
+        expect(forcePersistBuffer).to.be.false
+      }
+    })
+
+    it('should always return the current level regardless of the rollout percentage', function () {
+      setMockConfig('nextHistoryBufferLevelRolloutPercentage', '10')
+      const rollout = new Rollout(config)
+      for (let i = 0; i < 1000; i++) {
+        const { historyBufferLevel } = rollout.getHistoryBufferLevelOptions(
+          `test-project-id-${i}`
+        )
+        expect(historyBufferLevel).to.equal(3)
+      }
+    })
+  })
+})
+
+function setMockConfig(path, value) {
+  config.has.withArgs(path).returns(true)
+  config.get.withArgs(path).returns(value)
+}
diff --git a/services/history-v1/test/acceptance/js/api/support/test_backup_verifier_server.mjs b/services/history-v1/test/acceptance/js/api/support/test_backup_verifier_server.mjs
index 10d6dbc6c1..57a805e334 100644
--- a/services/history-v1/test/acceptance/js/api/support/test_backup_verifier_server.mjs
+++ b/services/history-v1/test/acceptance/js/api/support/test_backup_verifier_server.mjs
@@ -26,7 +26,7 @@ async function listenOnRandomPort() {
       return
     } catch {}
   }
-  server = await startApp(0)
+  server = await startApp(0, false)
 }
 
 after('close server', function (done) {
diff --git a/services/history-v1/test/acceptance/js/storage/assert.test.js b/services/history-v1/test/acceptance/js/storage/assert.test.js
new file mode 100644
index 0000000000..6ba30e2562
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/assert.test.js
@@ -0,0 +1,248 @@
+'use strict'
+
+const OError = require('@overleaf/o-error')
+const { expect } = require('chai')
+const assert = require('../../../../storage/lib/assert')
+
+describe('assert', function () {
+  describe('blobHash', function () {
+    it('should not throw for valid blob hashes', function () {
+      expect(() =>
+        assert.blobHash(
+          'aad321caf77ca6c5ab09e6c638c237705f93b001',
+          'should be a blob hash'
+        )
+      ).to.not.throw()
+    })
+
+    it('should throw for invalid blob hashes', function () {
+      try {
+        assert.blobHash('invalid-hash', 'should be a blob hash')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a blob hash')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 'invalid-hash' })
+      }
+    })
+
+    it('should throw for string integer blob hashes', function () {
+      try {
+        assert.blobHash('123', 'should be a blob hash')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a blob hash')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '123' })
+      }
+    })
+  })
+
+  describe('projectId', function () {
+    it('should not throw for valid mongo project ids', function () {
+      expect(() =>
+        assert.projectId('507f1f77bcf86cd799439011', 'should be a project id')
+      ).to.not.throw()
+    })
+
+    it('should not throw for valid postgres project ids', function () {
+      expect(() =>
+        assert.projectId('123456789', 'should be a project id')
+      ).to.not.throw()
+    })
+
+    it('should throw for invalid project ids', function () {
+      try {
+        assert.projectId('invalid-id', 'should be a project id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a project id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 'invalid-id' })
+      }
+    })
+
+    it('should throw for non-numeric project ids', function () {
+      try {
+        assert.projectId('12345x', 'should be a project id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a project id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '12345x' })
+      }
+    })
+
+    it('should throw for postgres ids starting with 0', function () {
+      try {
+        assert.projectId('0123456', 'should be a project id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a project id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '0123456' })
+      }
+    })
+  })
+
+  describe('chunkId', function () {
+    it('should not throw for valid mongo chunk ids', function () {
+      expect(() =>
+        assert.chunkId('507f1f77bcf86cd799439011', 'should be a chunk id')
+      ).to.not.throw()
+    })
+
+    it('should not throw for valid postgres chunk ids', function () {
+      expect(() =>
+        assert.chunkId('123456789', 'should be a chunk id')
+      ).to.not.throw()
+    })
+
+    it('should throw for invalid chunk ids', function () {
+      try {
+        assert.chunkId('invalid-id', 'should be a chunk id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a chunk id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 'invalid-id' })
+      }
+    })
+
+    it('should throw for integer chunk ids', function () {
+      try {
+        assert.chunkId(12345, 'should be a chunk id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a chunk id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 12345 })
+      }
+    })
+  })
+
+  describe('mongoId', function () {
+    it('should not throw for valid mongo ids', function () {
+      expect(() =>
+        assert.mongoId('507f1f77bcf86cd799439011', 'should be a mongo id')
+      ).to.not.throw()
+    })
+
+    it('should throw for invalid mongo ids', function () {
+      try {
+        assert.mongoId('invalid-id', 'should be a mongo id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a mongo id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 'invalid-id' })
+      }
+    })
+
+    it('should throw for numeric mongo ids', function () {
+      try {
+        assert.mongoId('12345', 'should be a mongo id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a mongo id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '12345' })
+      }
+    })
+
+    it('should throw for mongo ids that are too short', function () {
+      try {
+        assert.mongoId('507f1f77bcf86cd79943901', 'should be a mongo id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a mongo id')
+        expect(OError.getFullInfo(error)).to.deep.equal({
+          arg: '507f1f77bcf86cd79943901',
+        })
+      }
+    })
+
+    it('should throw for mongo ids that are too long', function () {
+      try {
+        assert.mongoId('507f1f77bcf86cd7994390111', 'should be a mongo id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a mongo id')
+        expect(OError.getFullInfo(error)).to.deep.equal({
+          arg: '507f1f77bcf86cd7994390111',
+        })
+      }
+    })
+  })
+
+  describe('postgresId', function () {
+    it('should not throw for valid postgres ids', function () {
+      expect(() =>
+        assert.postgresId('123456789', 'should be a postgres id')
+      ).to.not.throw()
+      expect(() =>
+        assert.postgresId('1', 'should be a postgres id')
+      ).to.not.throw()
+    })
+
+    it('should throw for invalid postgres ids', function () {
+      try {
+        assert.postgresId('invalid-id', 'should be a postgres id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a postgres id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: 'invalid-id' })
+      }
+    })
+
+    it('should throw for postgres ids starting with 0', function () {
+      try {
+        assert.postgresId('0123456', 'should be a postgres id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a postgres id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '0123456' })
+      }
+    })
+
+    it('should throw for postgres ids that are too long', function () {
+      try {
+        assert.postgresId('12345678901', 'should be a postgres id')
+        expect.fail()
+      } catch (error) {
+        expect(error).to.be.instanceOf(TypeError)
+        expect(error.message).to.equal('should be a postgres id')
+        expect(OError.getFullInfo(error)).to.deep.equal({ arg: '12345678901' })
+      }
+    })
+  })
+
+  describe('regex constants', function () {
+    it('MONGO_ID_REGEXP should match valid mongo ids', function () {
+      expect('507f1f77bcf86cd799439011').to.match(assert.MONGO_ID_REGEXP)
+      expect('abcdef0123456789abcdef01').to.match(assert.MONGO_ID_REGEXP)
+    })
+
+    it('MONGO_ID_REGEXP should not match invalid mongo ids', function () {
+      expect('invalid-id').to.not.match(assert.MONGO_ID_REGEXP)
+      expect('507f1f77bcf86cd79943901').to.not.match(assert.MONGO_ID_REGEXP) // too short
+      expect('507f1f77bcf86cd7994390111').to.not.match(assert.MONGO_ID_REGEXP) // too long
+      expect('507F1F77BCF86CD799439011').to.not.match(assert.MONGO_ID_REGEXP) // uppercase
+    })
+
+    it('POSTGRES_ID_REGEXP should match valid postgres ids', function () {
+      expect('123456789').to.match(assert.POSTGRES_ID_REGEXP)
+      expect('1').to.match(assert.POSTGRES_ID_REGEXP)
+    })
+
+    it('POSTGRES_ID_REGEXP should not match invalid postgres ids', function () {
+      expect('invalid-id').to.not.match(assert.POSTGRES_ID_REGEXP)
+      expect('0123456').to.not.match(assert.POSTGRES_ID_REGEXP) // starts with 0
+      expect('12345678901').to.not.match(assert.POSTGRES_ID_REGEXP) // too long (> 10 digits)
+    })
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/storage/back_fill_file_hash.test.mjs b/services/history-v1/test/acceptance/js/storage/back_fill_file_hash.test.mjs
index fad87b4703..b6cdd4b9bf 100644
--- a/services/history-v1/test/acceptance/js/storage/back_fill_file_hash.test.mjs
+++ b/services/history-v1/test/acceptance/js/storage/back_fill_file_hash.test.mjs
@@ -4,48 +4,29 @@ import Stream from 'node:stream'
 import { setTimeout } from 'node:timers/promises'
 import { promisify } from 'node:util'
 import { ObjectId, Binary } from 'mongodb'
-import {
-  db,
-  backedUpBlobs,
-  globalBlobs,
-} from '../../../../storage/lib/mongodb.js'
+import { db, globalBlobs } from '../../../../storage/lib/mongodb.js'
 import cleanup from './support/cleanup.js'
 import testProjects from '../api/support/test_projects.js'
 import { execFile } from 'node:child_process'
 import chai, { expect } from 'chai'
 import chaiExclude from 'chai-exclude'
-import config from 'config'
-import ObjectPersistor from '@overleaf/object-persistor'
 import { WritableBuffer } from '@overleaf/stream-utils'
 import {
   backupPersistor,
   projectBlobsBucket,
 } from '../../../../storage/lib/backupPersistor.mjs'
-import projectKey from '../../../../storage/lib/project_key.js'
 import {
   BlobStore,
   makeProjectKey,
 } from '../../../../storage/lib/blob_store/index.js'
 
+import { mockFilestore } from './support/MockFilestore.mjs'
+
 chai.use(chaiExclude)
 const TIMEOUT = 20 * 1_000
 
-const { deksBucket } = config.get('backupStore')
-const { tieringStorageClass } = config.get('backupPersistor')
-
 const projectsCollection = db.collection('projects')
 const deletedProjectsCollection = db.collection('deletedProjects')
-const deletedFilesCollection = db.collection('deletedFiles')
-
-const FILESTORE_PERSISTOR = ObjectPersistor({
-  backend: 'gcs',
-  gcs: {
-    endpoint: {
-      apiEndpoint: process.env.GCS_API_ENDPOINT,
-      projectId: process.env.GCS_PROJECT_ID,
-    },
-  },
-})
 
 /**
  * @param {ObjectId} objectId
@@ -74,17 +55,6 @@ function binaryForGitBlobHash(gitBlobHash) {
   return new Binary(Buffer.from(gitBlobHash, 'hex'))
 }
 
-async function listS3Bucket(bucket, wantStorageClass) {
-  const client = backupPersistor._getClientForBucket(bucket)
-  const response = await client.listObjectsV2({ Bucket: bucket }).promise()
-
-  for (const object of response.Contents || []) {
-    expect(object).to.have.property('StorageClass', wantStorageClass)
-  }
-
-  return (response.Contents || []).map(item => item.Key || '')
-}
-
 function objectIdFromTime(timestamp) {
   return ObjectId.createFromTime(new Date(timestamp).getTime() / 1000)
 }
@@ -130,11 +100,8 @@ describe('back_fill_file_hash script', function () {
   const fileId7 = objectIdFromTime('2017-02-01T00:07:00Z')
   const fileId8 = objectIdFromTime('2017-02-01T00:08:00Z')
   const fileId9 = objectIdFromTime('2017-02-01T00:09:00Z')
-  const fileIdDeleted1 = objectIdFromTime('2017-03-01T00:01:00Z')
-  const fileIdDeleted2 = objectIdFromTime('2017-03-01T00:02:00Z')
-  const fileIdDeleted3 = objectIdFromTime('2017-03-01T00:03:00Z')
-  const fileIdDeleted4 = objectIdFromTime('2024-03-01T00:04:00Z')
-  const fileIdDeleted5 = objectIdFromTime('2024-03-01T00:05:00Z')
+  const fileId10 = objectIdFromTime('2017-02-01T00:10:00Z')
+  const fileId11 = objectIdFromTime('2017-02-01T00:11:00Z')
   const contentTextBlob0 = Buffer.from('Hello 0')
   const hashTextBlob0 = gitBlobHashBuffer(contentTextBlob0)
   const contentTextBlob1 = Buffer.from('Hello 1')
@@ -161,7 +128,6 @@ describe('back_fill_file_hash script', function () {
       hash: hashFile7,
       content: contentFile7,
     },
-    { projectId: projectId0, historyId: historyId0, fileId: fileIdDeleted5 },
     {
       projectId: projectId0,
       historyId: historyId0,
@@ -181,7 +147,6 @@ describe('back_fill_file_hash script', function () {
       content: contentTextBlob2,
     },
     { projectId: projectId1, historyId: historyId1, fileId: fileId1 },
-    { projectId: projectId1, historyId: historyId1, fileId: fileIdDeleted1 },
     {
       projectId: projectId2,
       historyId: historyId2,
@@ -189,23 +154,28 @@ describe('back_fill_file_hash script', function () {
       hasHash: true,
     },
     { projectId: projectId3, historyId: historyId3, fileId: fileId3 },
+    // fileId10 is dupe of fileId3, without a hash
+    {
+      projectId: projectId3,
+      historyId: historyId3,
+      fileId: fileId10,
+      content: Buffer.from(fileId3.toString()),
+      hash: gitBlobHash(fileId3),
+    },
+    // fileId11 is dupe of fileId3, but with a hash
+    {
+      projectId: projectId3,
+      historyId: historyId3,
+      fileId: fileId11,
+      content: Buffer.from(fileId3.toString()),
+      hash: gitBlobHash(fileId3),
+      hasHash: true,
+    },
     {
       projectId: projectIdDeleted0,
       historyId: historyIdDeleted0,
       fileId: fileId4,
     },
-    {
-      projectId: projectIdDeleted0,
-      historyId: historyIdDeleted0,
-      fileId: fileIdDeleted2,
-    },
-    // { historyId: historyIdDeleted0, fileId:fileIdDeleted3 }, // fileIdDeleted3 is dupe of fileIdDeleted2
-    {
-      projectId: projectIdDeleted0,
-      historyId: historyIdDeleted0,
-      fileId: fileIdDeleted4,
-      hasHash: true,
-    },
     {
       projectId: projectIdDeleted1,
       historyId: historyIdDeleted1,
@@ -233,10 +203,6 @@ describe('back_fill_file_hash script', function () {
       fileId4,
       fileId5,
       fileId6,
-      fileIdDeleted1,
-      fileIdDeleted2,
-      fileIdDeleted3,
-      fileIdDeleted4,
     }
     console.log({
       projectId0,
@@ -328,7 +294,11 @@ describe('back_fill_file_hash script', function () {
                 fileRefs: [],
                 folders: [
                   {
-                    fileRefs: [{ _id: fileId3 }],
+                    fileRefs: [
+                      { _id: fileId3 },
+                      { _id: fileId10 },
+                      { _id: fileId11, hash: gitBlobHash(fileId3) },
+                    ],
                     folders: [],
                   },
                 ],
@@ -446,17 +416,6 @@ describe('back_fill_file_hash script', function () {
         },
       },
     ])
-    await deletedFilesCollection.insertMany([
-      { _id: fileIdDeleted1, projectId: projectId1 },
-      { _id: fileIdDeleted2, projectId: projectIdDeleted0 },
-      { _id: fileIdDeleted3, projectId: projectIdDeleted0 },
-      {
-        _id: fileIdDeleted4,
-        projectId: projectIdDeleted0,
-        hash: gitBlobHash(fileIdDeleted4),
-      },
-      { _id: fileIdDeleted5, projectId: projectId0 },
-    ])
   }
 
   async function populateHistoryV1() {
@@ -484,81 +443,36 @@ describe('back_fill_file_hash script', function () {
   }
 
   async function populateFilestore() {
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileId0}`,
-      Stream.Readable.from([fileId0.toString()])
+    await mockFilestore.addFile(projectId0, fileId0, fileId0.toString())
+    await mockFilestore.addFile(projectId0, fileId6, fileId6.toString())
+    await mockFilestore.addFile(projectId0, fileId7, contentFile7)
+    await mockFilestore.addFile(projectId1, fileId1, fileId1.toString())
+    await mockFilestore.addFile(projectId2, fileId2, fileId2.toString())
+    await mockFilestore.addFile(projectId3, fileId3, fileId3.toString())
+    await mockFilestore.addFile(
+      projectId3,
+      fileId10,
+      // fileId10 is dupe of fileId3
+      fileId3.toString()
     )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileId6}`,
-      Stream.Readable.from([fileId6.toString()])
+    await mockFilestore.addFile(
+      projectId3,
+      fileId11,
+      // fileId11 is dupe of fileId3
+      fileId3.toString()
     )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileId7}`,
-      Stream.Readable.from([contentFile7])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileIdDeleted5}`,
-      Stream.Readable.from([fileIdDeleted5.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId1}/${fileId1}`,
-      Stream.Readable.from([fileId1.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId2}/${fileId2}`,
-      Stream.Readable.from([fileId2.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId3}/${fileId3}`,
-      Stream.Readable.from([fileId3.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdDeleted0}/${fileId4}`,
-      Stream.Readable.from([fileId4.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdDeleted1}/${fileId5}`,
-      Stream.Readable.from([fileId5.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId1}/${fileIdDeleted1}`,
-      Stream.Readable.from([fileIdDeleted1.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdDeleted0}/${fileIdDeleted2}`,
-      Stream.Readable.from([fileIdDeleted2.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdDeleted0}/${fileIdDeleted3}`,
-      // same content as 2, deduplicate
-      Stream.Readable.from([fileIdDeleted2.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdDeleted0}/${fileIdDeleted4}`,
-      Stream.Readable.from([fileIdDeleted4.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectIdBadFileTree3}/${fileId9}`,
-      Stream.Readable.from([fileId9.toString()])
+    await mockFilestore.addFile(projectIdDeleted0, fileId4, fileId4.toString())
+    await mockFilestore.addFile(projectIdDeleted1, fileId5, fileId5.toString())
+    await mockFilestore.addFile(
+      projectIdBadFileTree3,
+      fileId9,
+      fileId9.toString()
     )
   }
 
   async function prepareEnvironment() {
     await cleanup.everything()
+    await mockFilestore.start()
     await populateMongo()
     await populateHistoryV1()
     await populateFilestore()
@@ -579,7 +493,6 @@ describe('back_fill_file_hash script', function () {
           'storage/scripts/back_fill_file_hash.mjs',
           '--processNonDeletedProjects=true',
           '--processDeletedProjects=true',
-          '--processDeletedFiles=true',
           ...args,
         ],
         {
@@ -605,11 +518,7 @@ describe('back_fill_file_hash script', function () {
     expect((await fs.promises.readdir('/tmp')).join(';')).to.not.match(
       /back_fill_file_hash/
     )
-    const extraStatsKeys = [
-      'eventLoop',
-      'readFromGCSThroughputMiBPerSecond',
-      'writeToAWSThroughputMiBPerSecond',
-    ]
+    const extraStatsKeys = ['eventLoop', 'readFromGCSThroughputMiBPerSecond']
     const stats = JSON.parse(
       result.stderr
         .split('\n')
@@ -624,7 +533,6 @@ describe('back_fill_file_hash script', function () {
     delete stats.time
     if (shouldHaveWritten) {
       expect(stats.readFromGCSThroughputMiBPerSecond).to.be.greaterThan(0)
-      expect(stats.writeToAWSThroughputMiBPerSecond).to.be.greaterThan(0)
     }
     for (const key of extraStatsKeys) {
       delete stats[key]
@@ -741,6 +649,8 @@ describe('back_fill_file_hash script', function () {
                       {
                         fileRefs: [
                           { _id: fileId3, hash: gitBlobHash(fileId3) },
+                          { _id: fileId10, hash: gitBlobHash(fileId3) },
+                          { _id: fileId11, hash: gitBlobHash(fileId3) },
                         ],
                         folders: [],
                       },
@@ -868,144 +778,6 @@ describe('back_fill_file_hash script', function () {
           },
         },
       ])
-      expect(await deletedFilesCollection.find({}).toArray()).to.deep.equal([
-        {
-          _id: fileIdDeleted1,
-          projectId: projectId1,
-          hash: gitBlobHash(fileIdDeleted1),
-        },
-        {
-          _id: fileIdDeleted2,
-          projectId: projectIdDeleted0,
-          hash: gitBlobHash(fileIdDeleted2),
-        },
-        {
-          _id: fileIdDeleted3,
-          projectId: projectIdDeleted0,
-          // uses the same content as fileIdDeleted2
-          hash: gitBlobHash(fileIdDeleted2),
-        },
-        {
-          _id: fileIdDeleted4,
-          projectId: projectIdDeleted0,
-          hash: gitBlobHash(fileIdDeleted4),
-        },
-        {
-          _id: fileIdDeleted5,
-          projectId: projectId0,
-          hash: gitBlobHash(fileIdDeleted5),
-        },
-      ])
-      expect(
-        (await backedUpBlobs.find({}, { sort: { _id: 1 } }).toArray()).map(
-          entry => {
-            // blobs are pushed unordered into mongo. Sort the list for consistency.
-            entry.blobs.sort()
-            return entry
-          }
-        )
-      ).to.deep.equal([
-        {
-          _id: projectId0,
-          blobs: [
-            binaryForGitBlobHash(gitBlobHash(fileId0)),
-            binaryForGitBlobHash(hashFile7),
-            binaryForGitBlobHash(gitBlobHash(fileIdDeleted5)),
-            binaryForGitBlobHash(hashTextBlob0),
-          ].sort(),
-        },
-        {
-          _id: projectId1,
-          blobs: [
-            binaryForGitBlobHash(gitBlobHash(fileId1)),
-            binaryForGitBlobHash(gitBlobHash(fileIdDeleted1)),
-            binaryForGitBlobHash(hashTextBlob1),
-          ].sort(),
-        },
-        {
-          _id: projectId2,
-          blobs: [binaryForGitBlobHash(hashTextBlob2)]
-            .concat(
-              processHashedFiles
-                ? [binaryForGitBlobHash(gitBlobHash(fileId2))]
-                : []
-            )
-            .sort(),
-        },
-        {
-          _id: projectIdDeleted0,
-          blobs: [
-            binaryForGitBlobHash(gitBlobHash(fileId4)),
-            binaryForGitBlobHash(gitBlobHash(fileIdDeleted2)),
-          ]
-            .concat(
-              processHashedFiles
-                ? [binaryForGitBlobHash(gitBlobHash(fileIdDeleted4))]
-                : []
-            )
-            .sort(),
-        },
-        {
-          _id: projectId3,
-          blobs: [binaryForGitBlobHash(gitBlobHash(fileId3))].sort(),
-        },
-        ...(processHashedFiles
-          ? [
-              {
-                _id: projectIdDeleted1,
-                blobs: [binaryForGitBlobHash(gitBlobHash(fileId5))].sort(),
-              },
-            ]
-          : []),
-        {
-          _id: projectIdBadFileTree0,
-          blobs: [binaryForGitBlobHash(hashTextBlob3)].sort(),
-        },
-        {
-          _id: projectIdBadFileTree3,
-          blobs: [binaryForGitBlobHash(gitBlobHash(fileId9))].sort(),
-        },
-      ])
-    })
-    it('should have backed up all the files', async function () {
-      expect(tieringStorageClass).to.exist
-      const blobs = await listS3Bucket(projectBlobsBucket, tieringStorageClass)
-      expect(blobs.sort()).to.deep.equal(
-        writtenBlobs
-          .map(({ historyId, fileId, hash }) =>
-            makeProjectKey(historyId, hash || gitBlobHash(fileId))
-          )
-          .sort()
-      )
-      for (let { historyId, fileId, hash, content } of writtenBlobs) {
-        hash = hash || gitBlobHash(fileId.toString())
-        const s = await backupPersistor.getObjectStream(
-          projectBlobsBucket,
-          makeProjectKey(historyId, hash),
-          { autoGunzip: true }
-        )
-        const buf = new WritableBuffer()
-        await Stream.promises.pipeline(s, buf)
-        expect(gitBlobHashBuffer(buf.getContents())).to.equal(hash)
-        if (content) {
-          expect(buf.getContents()).to.deep.equal(content)
-        } else {
-          const id = buf.getContents().toString('utf-8')
-          expect(id).to.equal(fileId.toString())
-          // double check we are not comparing 'undefined' or '[object Object]' above
-          expect(id).to.match(/^[a-f0-9]{24}$/)
-        }
-      }
-      const deks = await listS3Bucket(deksBucket, 'STANDARD')
-      expect(deks.sort()).to.deep.equal(
-        Array.from(
-          new Set(
-            writtenBlobs.map(
-              ({ historyId }) => projectKey.format(historyId) + '/dek'
-            )
-          )
-        ).sort()
-      )
     })
     it('should have written the back filled files to history v1', async function () {
       for (const { historyId, hash, fileId, content } of writtenBlobs) {
@@ -1037,15 +809,14 @@ describe('back_fill_file_hash script', function () {
         ...STATS_ALL_ZERO,
         // We still need to iterate over all the projects and blobs.
         projects: 10,
-        blobs: 13,
-        backedUpBlobs: 13,
+        blobs: 10,
+
         badFileTrees: 4,
       }
       if (processHashedFiles) {
         stats = sumStats(stats, {
           ...STATS_ALL_ZERO,
-          blobs: 3,
-          backedUpBlobs: 3,
+          blobs: 2,
         })
       }
       expect(rerun.stats).deep.equal(stats)
@@ -1071,7 +842,6 @@ describe('back_fill_file_hash script', function () {
   const STATS_ALL_ZERO = {
     projects: 0,
     blobs: 0,
-    backedUpBlobs: 0,
     filesWithHash: 0,
     filesWithoutHash: 0,
     filesDuplicated: 0,
@@ -1085,23 +855,16 @@ describe('back_fill_file_hash script', function () {
     fileHardDeleted: 0,
     badFileTrees: 0,
     mongoUpdates: 0,
-    deduplicatedWriteToAWSLocalCount: 0,
-    deduplicatedWriteToAWSLocalEgress: 0,
-    deduplicatedWriteToAWSRemoteCount: 0,
-    deduplicatedWriteToAWSRemoteEgress: 0,
     readFromGCSCount: 0,
     readFromGCSIngress: 0,
-    writeToAWSCount: 0,
-    writeToAWSEgress: 0,
     writeToGCSCount: 0,
     writeToGCSEgress: 0,
   }
   const STATS_UP_TO_PROJECT1 = {
     projects: 2,
     blobs: 2,
-    backedUpBlobs: 0,
     filesWithHash: 0,
-    filesWithoutHash: 7,
+    filesWithoutHash: 5,
     filesDuplicated: 1,
     filesRetries: 0,
     filesFailed: 0,
@@ -1112,24 +875,17 @@ describe('back_fill_file_hash script', function () {
     projectHardDeleted: 0,
     fileHardDeleted: 0,
     badFileTrees: 0,
-    mongoUpdates: 6,
-    deduplicatedWriteToAWSLocalCount: 0,
-    deduplicatedWriteToAWSLocalEgress: 0,
-    deduplicatedWriteToAWSRemoteCount: 0,
-    deduplicatedWriteToAWSRemoteEgress: 0,
-    readFromGCSCount: 8,
-    readFromGCSIngress: 4000134,
-    writeToAWSCount: 7,
-    writeToAWSEgress: 4086,
-    writeToGCSCount: 5,
-    writeToGCSEgress: 4000096,
+    mongoUpdates: 2, // 4-2 blobs written to backedUpBlobs collection
+    readFromGCSCount: 4,
+    readFromGCSIngress: 4000072,
+    writeToGCSCount: 3,
+    writeToGCSEgress: 4000048,
   }
   const STATS_UP_FROM_PROJECT1_ONWARD = {
     projects: 8,
     blobs: 2,
-    backedUpBlobs: 0,
     filesWithHash: 0,
-    filesWithoutHash: 5,
+    filesWithoutHash: 4,
     filesDuplicated: 0,
     filesRetries: 0,
     filesFailed: 0,
@@ -1140,28 +896,20 @@ describe('back_fill_file_hash script', function () {
     projectHardDeleted: 0,
     fileHardDeleted: 0,
     badFileTrees: 4,
-    mongoUpdates: 10,
-    deduplicatedWriteToAWSLocalCount: 1,
-    deduplicatedWriteToAWSLocalEgress: 30,
-    deduplicatedWriteToAWSRemoteCount: 0,
-    deduplicatedWriteToAWSRemoteEgress: 0,
-    readFromGCSCount: 7,
-    readFromGCSIngress: 134,
-    writeToAWSCount: 6,
-    writeToAWSEgress: 173,
-    writeToGCSCount: 4,
-    writeToGCSEgress: 96,
+    mongoUpdates: 3, // previously 5 blobs written to backedUpBlobs collection
+    readFromGCSCount: 4,
+    readFromGCSIngress: 96,
+    writeToGCSCount: 3,
+    writeToGCSEgress: 72,
   }
   const STATS_FILES_HASHED_EXTRA = {
     ...STATS_ALL_ZERO,
-    filesWithHash: 3,
-    mongoUpdates: 1,
-    readFromGCSCount: 3,
-    readFromGCSIngress: 72,
-    writeToAWSCount: 3,
-    writeToAWSEgress: 89,
-    writeToGCSCount: 3,
-    writeToGCSEgress: 72,
+    filesWithHash: 2,
+    mongoUpdates: 0, // previously 2 blobs written to backedUpBlobs collection
+    readFromGCSCount: 2,
+    readFromGCSIngress: 48,
+    writeToGCSCount: 2,
+    writeToGCSEgress: 48,
   }
 
   function sumStats(a, b) {
@@ -1177,10 +925,7 @@ describe('back_fill_file_hash script', function () {
     beforeEach('prepare environment', prepareEnvironment)
 
     it('should gracefully handle fatal errors', async function () {
-      await FILESTORE_PERSISTOR.deleteObject(
-        USER_FILES_BUCKET_NAME,
-        `${projectId0}/${fileId0}`
-      )
+      mockFilestore.deleteObject(projectId0, fileId0)
       const t0 = Date.now()
       const { stats, result } = await tryRunScript([], {
         RETRIES: '10',
@@ -1194,8 +939,6 @@ describe('back_fill_file_hash script', function () {
           ...STATS_ALL_ZERO,
           filesFailed: 1,
           readFromGCSIngress: -24,
-          writeToAWSCount: -1,
-          writeToAWSEgress: -28,
           writeToGCSCount: -1,
           writeToGCSEgress: -24,
         })
@@ -1208,17 +951,10 @@ describe('back_fill_file_hash script', function () {
     })
 
     it('should retry on error', async function () {
-      await FILESTORE_PERSISTOR.deleteObject(
-        USER_FILES_BUCKET_NAME,
-        `${projectId0}/${fileId0}`
-      )
+      mockFilestore.deleteObject(projectId0, fileId0)
       const restoreFileAfter5s = async () => {
         await setTimeout(5_000)
-        await FILESTORE_PERSISTOR.sendStream(
-          USER_FILES_BUCKET_NAME,
-          `${projectId0}/${fileId0}`,
-          Stream.Readable.from([fileId0.toString()])
-        )
+        mockFilestore.addFile(projectId0, fileId0, fileId0.toString())
       }
       // use Promise.allSettled to ensure the above sendStream call finishes before this test completes
       const [
@@ -1326,15 +1062,15 @@ describe('back_fill_file_hash script', function () {
     before('run script with hashed files', async function () {
       output2 = await runScript(['--processHashedFiles=true'], {})
     })
-    it('should print stats', function () {
+    it('should print stats for the first run without hashed files', function () {
       expect(output1.stats).deep.equal(STATS_ALL)
+    })
+    it('should print stats for the hashed files run', function () {
       expect(output2.stats).deep.equal({
         ...STATS_FILES_HASHED_EXTRA,
         projects: 10,
-        blobs: 13,
-        backedUpBlobs: 13,
+        blobs: 10,
         badFileTrees: 4,
-        mongoUpdates: 3,
       })
     })
     commonAssertions(true)
@@ -1376,7 +1112,13 @@ describe('back_fill_file_hash script', function () {
     })
     it('should print stats', function () {
       expect(output.stats).deep.equal(
-        sumStats(STATS_ALL, STATS_FILES_HASHED_EXTRA)
+        sumStats(STATS_ALL, {
+          ...STATS_FILES_HASHED_EXTRA,
+          readFromGCSCount: 3,
+          readFromGCSIngress: 72,
+          mongoUpdates: 0,
+          filesWithHash: 3,
+        })
       )
     })
     commonAssertions(true)
@@ -1404,48 +1146,6 @@ describe('back_fill_file_hash script', function () {
       expect(output.stats).deep.equal(
         sumStats(STATS_ALL, {
           ...STATS_ALL_ZERO,
-          // one remote deduplicate
-          deduplicatedWriteToAWSRemoteCount: 1,
-          deduplicatedWriteToAWSRemoteEgress: 28,
-          writeToAWSEgress: -28, // subtract skipped egress
-        })
-      )
-    })
-    commonAssertions()
-  })
-
-  describe('with something in the bucket and marked as processed', function () {
-    before('prepare environment', prepareEnvironment)
-    before('create a file in s3', async function () {
-      await backupPersistor.sendStream(
-        projectBlobsBucket,
-        makeProjectKey(historyId0, hashTextBlob0),
-        Stream.Readable.from([contentTextBlob0]),
-        { contentLength: contentTextBlob0.byteLength }
-      )
-      await backedUpBlobs.insertMany([
-        {
-          _id: projectId0,
-          blobs: [binaryForGitBlobHash(hashTextBlob0)],
-        },
-      ])
-    })
-    let output
-    before('run script', async function () {
-      output = await runScript([], {
-        CONCURRENCY: '1',
-      })
-    })
-
-    it('should print stats', function () {
-      expect(output.stats).deep.equal(
-        sumStats(STATS_ALL, {
-          ...STATS_ALL_ZERO,
-          backedUpBlobs: 1,
-          writeToAWSCount: -1,
-          writeToAWSEgress: -27,
-          readFromGCSCount: -1,
-          readFromGCSIngress: -7,
         })
       )
     })
@@ -1468,8 +1168,10 @@ describe('back_fill_file_hash script', function () {
       })
     })
 
-    it('should print stats', function () {
+    it('should print stats for part 0', function () {
       expect(outputPart0.stats).to.deep.equal(STATS_UP_TO_PROJECT1)
+    })
+    it('should print stats for part 1', function () {
       expect(outputPart1.stats).to.deep.equal(STATS_UP_FROM_PROJECT1_ONWARD)
     })
     commonAssertions()
diff --git a/services/history-v1/test/acceptance/js/storage/back_fill_file_hash_fix_up.test.mjs b/services/history-v1/test/acceptance/js/storage/back_fill_file_hash_fix_up.test.mjs
index ceafa24c3a..3aa00d685a 100644
--- a/services/history-v1/test/acceptance/js/storage/back_fill_file_hash_fix_up.test.mjs
+++ b/services/history-v1/test/acceptance/js/storage/back_fill_file_hash_fix_up.test.mjs
@@ -1,48 +1,24 @@
 import fs from 'node:fs'
 import Crypto from 'node:crypto'
-import Stream from 'node:stream'
 import { promisify } from 'node:util'
 import { Binary, ObjectId } from 'mongodb'
 import { Blob } from 'overleaf-editor-core'
-import { backedUpBlobs, blobs, db } from '../../../../storage/lib/mongodb.js'
+import { db } from '../../../../storage/lib/mongodb.js'
 import cleanup from './support/cleanup.js'
 import testProjects from '../api/support/test_projects.js'
 import { execFile } from 'node:child_process'
 import chai, { expect } from 'chai'
 import chaiExclude from 'chai-exclude'
-import config from 'config'
-import { WritableBuffer } from '@overleaf/stream-utils'
-import {
-  backupPersistor,
-  projectBlobsBucket,
-} from '../../../../storage/lib/backupPersistor.mjs'
-import projectKey from '../../../../storage/lib/project_key.js'
-import {
-  BlobStore,
-  makeProjectKey,
-} from '../../../../storage/lib/blob_store/index.js'
-import ObjectPersistor from '@overleaf/object-persistor'
+import { BlobStore } from '../../../../storage/lib/blob_store/index.js'
+import { mockFilestore } from './support/MockFilestore.mjs'
 
 chai.use(chaiExclude)
 
 const TIMEOUT = 20 * 1_000
 
-const { deksBucket } = config.get('backupStore')
-const { tieringStorageClass } = config.get('backupPersistor')
-
 const projectsCollection = db.collection('projects')
 const deletedProjectsCollection = db.collection('deletedProjects')
 
-const FILESTORE_PERSISTOR = ObjectPersistor({
-  backend: 'gcs',
-  gcs: {
-    endpoint: {
-      apiEndpoint: process.env.GCS_API_ENDPOINT,
-      projectId: process.env.GCS_PROJECT_ID,
-    },
-  },
-})
-
 /**
  * @param {ObjectId} objectId
  * @return {string}
@@ -70,17 +46,6 @@ function binaryForGitBlobHash(gitBlobHash) {
   return new Binary(Buffer.from(gitBlobHash, 'hex'))
 }
 
-async function listS3Bucket(bucket, wantStorageClass) {
-  const client = backupPersistor._getClientForBucket(bucket)
-  const response = await client.listObjectsV2({ Bucket: bucket }).promise()
-
-  for (const object of response.Contents || []) {
-    expect(object).to.have.property('StorageClass', wantStorageClass)
-  }
-
-  return (response.Contents || []).map(item => item.Key || '')
-}
-
 function objectIdFromTime(timestamp) {
   return ObjectId.createFromTime(new Date(timestamp).getTime() / 1000)
 }
@@ -97,7 +62,6 @@ describe('back_fill_file_hash_fix_up script', function () {
   const historyIdDeleted0 = projectIdDeleted0.toString()
   const fileIdWithDifferentHashFound = objectIdFromTime('2017-02-01T00:00:00Z')
   const fileIdInGoodState = objectIdFromTime('2017-02-01T00:01:00Z')
-  const fileIdBlobExistsInGCS0 = objectIdFromTime('2017-02-01T00:02:00Z')
   const fileIdWithDifferentHashNotFound0 = objectIdFromTime(
     '2017-02-01T00:03:00Z'
   )
@@ -112,9 +76,6 @@ describe('back_fill_file_hash_fix_up script', function () {
   const fileIdWithDifferentHashRestore = objectIdFromTime(
     '2017-02-01T00:08:00Z'
   )
-  const fileIdBlobExistsInGCS1 = objectIdFromTime('2017-02-01T00:09:00Z')
-  const fileIdRestoreFromFilestore0 = objectIdFromTime('2017-02-01T00:10:00Z')
-  const fileIdRestoreFromFilestore1 = objectIdFromTime('2017-02-01T00:11:00Z')
   const fileIdMissing2 = objectIdFromTime('2017-02-01T00:12:00Z')
   const fileIdHashMissing0 = objectIdFromTime('2017-02-01T00:13:00Z')
   const fileIdHashMissing1 = objectIdFromTime('2017-02-01T00:14:00Z')
@@ -125,31 +86,11 @@ describe('back_fill_file_hash_fix_up script', function () {
   )
   const deleteProjectsRecordId0 = new ObjectId()
   const writtenBlobs = [
-    {
-      projectId: projectId0,
-      historyId: historyId0,
-      fileId: fileIdBlobExistsInGCS0,
-    },
-    {
-      projectId: projectId0,
-      historyId: historyId0,
-      fileId: fileIdBlobExistsInGCS1,
-    },
     {
       projectId: projectId0,
       historyId: historyId0,
       fileId: fileIdWithDifferentHashNotFound0,
     },
-    {
-      projectId: projectId0,
-      historyId: historyId0,
-      fileId: fileIdRestoreFromFilestore0,
-    },
-    {
-      projectId: projectId0,
-      historyId: historyId0,
-      fileId: fileIdRestoreFromFilestore1,
-    },
     {
       projectId: projectId0,
       historyId: historyId0,
@@ -200,17 +141,6 @@ describe('back_fill_file_hash_fix_up script', function () {
       },
       msg: 'failed to process file',
     },
-    {
-      projectId: projectId0,
-      fileId: fileIdRestoreFromFilestore0,
-      err: { message: 'OError: hash mismatch' },
-      hash: gitBlobHash(fileIdRestoreFromFilestore0),
-      entry: {
-        ctx: { historyId: historyId0.toString() },
-        hash: hashDoesNotExistAsBlob,
-      },
-      msg: 'failed to process file',
-    },
     {
       projectId: projectIdDeleted0,
       fileId: fileIdWithDifferentHashNotFound1,
@@ -236,33 +166,6 @@ describe('back_fill_file_hash_fix_up script', function () {
       err: { message: 'NotFoundError' },
       msg: 'failed to process file',
     },
-    {
-      projectId: projectId0,
-      fileId: fileIdBlobExistsInGCS0,
-      hash: gitBlobHash(fileIdBlobExistsInGCS0),
-      err: { message: 'storage.objects.delete' },
-      msg: 'failed to process file',
-    },
-    {
-      projectId: projectId0,
-      fileId: fileIdBlobExistsInGCSCorrupted,
-      hash: gitBlobHash(fileIdBlobExistsInGCSCorrupted),
-      err: { message: 'storage.objects.delete' },
-      msg: 'failed to process file',
-    },
-    {
-      projectId: projectId0,
-      fileId: fileIdBlobExistsInGCS1,
-      hash: gitBlobHash(fileIdBlobExistsInGCS1),
-      err: { message: 'storage.objects.delete' },
-      msg: 'failed to process file',
-    },
-    {
-      projectId: projectId0,
-      fileId: fileIdRestoreFromFilestore1,
-      err: { message: 'storage.objects.delete' },
-      msg: 'failed to process file',
-    },
     {
       projectId: projectIdDeleted0,
       fileId: fileIdMissing1,
@@ -291,22 +194,23 @@ describe('back_fill_file_hash_fix_up script', function () {
       reason: 'bad file hash',
       msg: 'bad file-tree path',
     },
+    {
+      projectId: projectId0,
+      _id: fileIdBlobExistsInGCSCorrupted,
+      reason: 'bad file hash',
+      msg: 'bad file-tree path',
+    },
   ]
   if (PRINT_IDS_AND_HASHES_FOR_DEBUGGING) {
     const fileIds = {
       fileIdWithDifferentHashFound,
       fileIdInGoodState,
-      fileIdBlobExistsInGCS0,
-      fileIdBlobExistsInGCS1,
       fileIdWithDifferentHashNotFound0,
       fileIdWithDifferentHashNotFound1,
-      fileIdBlobExistsInGCSCorrupted,
       fileIdMissing0,
       fileIdMissing1,
       fileIdMissing2,
       fileIdWithDifferentHashRestore,
-      fileIdRestoreFromFilestore0,
-      fileIdRestoreFromFilestore1,
       fileIdHashMissing0,
       fileIdHashMissing1,
     }
@@ -330,38 +234,25 @@ describe('back_fill_file_hash_fix_up script', function () {
   before(cleanup.everything)
 
   before('populate blobs/GCS', async function () {
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileIdRestoreFromFilestore0}`,
-      Stream.Readable.from([fileIdRestoreFromFilestore0.toString()])
+    await mockFilestore.start()
+    mockFilestore.addFile(
+      projectId0,
+      fileIdHashMissing0,
+      fileIdHashMissing0.toString()
     )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileIdRestoreFromFilestore1}`,
-      Stream.Readable.from([fileIdRestoreFromFilestore1.toString()])
+    mockFilestore.addFile(
+      projectId0,
+      fileIdHashMissing1,
+      fileIdHashMissing1.toString()
     )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileIdHashMissing0}`,
-      Stream.Readable.from([fileIdHashMissing0.toString()])
-    )
-    await FILESTORE_PERSISTOR.sendStream(
-      USER_FILES_BUCKET_NAME,
-      `${projectId0}/${fileIdHashMissing1}`,
-      Stream.Readable.from([fileIdHashMissing1.toString()])
+    mockFilestore.addFile(
+      projectId0,
+      fileIdBlobExistsInGCSCorrupted,
+      fileIdBlobExistsInGCSCorrupted.toString()
     )
     await new BlobStore(historyId0.toString()).putString(
       fileIdHashMissing1.toString() // partially processed
     )
-    await new BlobStore(historyId0.toString()).putString(
-      fileIdBlobExistsInGCS0.toString()
-    )
-    await new BlobStore(historyId0.toString()).putString(
-      fileIdBlobExistsInGCS1.toString()
-    )
-    await new BlobStore(historyId0.toString()).putString(
-      fileIdRestoreFromFilestore1.toString()
-    )
     const path = '/tmp/test-blob-corrupted'
     try {
       await fs.promises.writeFile(path, contentCorruptedBlob)
@@ -426,22 +317,10 @@ describe('back_fill_file_hash_fix_up script', function () {
                     _id: fileIdWithDifferentHashNotFound0,
                     hash: hashDoesNotExistAsBlob,
                   },
-                  {
-                    _id: fileIdRestoreFromFilestore0,
-                    hash: hashDoesNotExistAsBlob,
-                  },
-                  {
-                    _id: fileIdRestoreFromFilestore1,
-                  },
-                  {
-                    _id: fileIdBlobExistsInGCS0,
-                    hash: gitBlobHash(fileIdBlobExistsInGCS0),
-                  },
                   {
                     _id: fileIdBlobExistsInGCSCorrupted,
                     hash: gitBlobHash(fileIdBlobExistsInGCSCorrupted),
                   },
-                  { _id: fileIdBlobExistsInGCS1 },
                 ],
                 folders: [],
               },
@@ -546,8 +425,8 @@ describe('back_fill_file_hash_fix_up script', function () {
   })
   it('should print stats', function () {
     expect(stats).to.contain({
-      processedLines: 16,
-      success: 11,
+      processedLines: 12,
+      success: 7,
       alreadyProcessed: 0,
       fileDeleted: 0,
       skipped: 0,
@@ -558,9 +437,9 @@ describe('back_fill_file_hash_fix_up script', function () {
   it('should handle re-run on same logs', async function () {
     ;({ stats } = await runScriptWithLogs())
     expect(stats).to.contain({
-      processedLines: 16,
+      processedLines: 12,
       success: 0,
-      alreadyProcessed: 8,
+      alreadyProcessed: 4,
       fileDeleted: 3,
       skipped: 0,
       failed: 3,
@@ -663,31 +542,11 @@ describe('back_fill_file_hash_fix_up script', function () {
                       _id: fileIdWithDifferentHashNotFound0,
                       hash: gitBlobHash(fileIdWithDifferentHashNotFound0),
                     },
-                    // Updated hash
-                    {
-                      _id: fileIdRestoreFromFilestore0,
-                      hash: gitBlobHash(fileIdRestoreFromFilestore0),
-                    },
-                    // Added hash
-                    {
-                      _id: fileIdRestoreFromFilestore1,
-                      hash: gitBlobHash(fileIdRestoreFromFilestore1),
-                    },
-                    // No change, blob created
-                    {
-                      _id: fileIdBlobExistsInGCS0,
-                      hash: gitBlobHash(fileIdBlobExistsInGCS0),
-                    },
                     // No change, flagged
                     {
                       _id: fileIdBlobExistsInGCSCorrupted,
                       hash: gitBlobHash(fileIdBlobExistsInGCSCorrupted),
                     },
-                    // Added hash
-                    {
-                      _id: fileIdBlobExistsInGCS1,
-                      hash: gitBlobHash(fileIdBlobExistsInGCS1),
-                    },
                   ],
                   folders: [],
                 },
@@ -696,7 +555,7 @@ describe('back_fill_file_hash_fix_up script', function () {
           ],
           overleaf: { history: { id: historyId0 } },
           // Incremented when removing file/updating hash
-          version: 8,
+          version: 5,
         },
       ])
     expect(await deletedProjectsCollection.find({}).toArray()).to.deep.equal([
@@ -745,62 +604,6 @@ describe('back_fill_file_hash_fix_up script', function () {
         (writtenBlobsByProject.get(projectId) || []).concat([fileId])
       )
     }
-    expect(
-      (await backedUpBlobs.find({}, { sort: { _id: 1 } }).toArray()).map(
-        entry => {
-          // blobs are pushed unordered into mongo. Sort the list for consistency.
-          entry.blobs.sort()
-          return entry
-        }
-      )
-    ).to.deep.equal(
-      Array.from(writtenBlobsByProject.entries()).map(
-        ([projectId, fileIds]) => {
-          return {
-            _id: projectId,
-            blobs: fileIds
-              .map(fileId => binaryForGitBlobHash(gitBlobHash(fileId)))
-              .sort(),
-          }
-        }
-      )
-    )
-  })
-  it('should have backed up all the files', async function () {
-    expect(tieringStorageClass).to.exist
-    const objects = await listS3Bucket(projectBlobsBucket, tieringStorageClass)
-    expect(objects.sort()).to.deep.equal(
-      writtenBlobs
-        .map(({ historyId, fileId, hash }) =>
-          makeProjectKey(historyId, hash || gitBlobHash(fileId))
-        )
-        .sort()
-    )
-    for (let { historyId, fileId } of writtenBlobs) {
-      const hash = gitBlobHash(fileId.toString())
-      const s = await backupPersistor.getObjectStream(
-        projectBlobsBucket,
-        makeProjectKey(historyId, hash),
-        { autoGunzip: true }
-      )
-      const buf = new WritableBuffer()
-      await Stream.promises.pipeline(s, buf)
-      expect(gitBlobHashBuffer(buf.getContents())).to.equal(hash)
-      const id = buf.getContents().toString('utf-8')
-      expect(id).to.equal(fileId.toString())
-      // double check we are not comparing 'undefined' or '[object Object]' above
-      expect(id).to.match(/^[a-f0-9]{24}$/)
-    }
-    const deks = await listS3Bucket(deksBucket, 'STANDARD')
-    expect(deks.sort()).to.deep.equal(
-      Array.from(
-        new Set(
-          writtenBlobs.map(
-            ({ historyId }) => projectKey.format(historyId) + '/dek'
-          )
-        )
-      ).sort()
-    )
   })
   it('should have written the back filled files to history v1', async function () {
     for (const { historyId, fileId } of writtenBlobs) {
diff --git a/services/history-v1/test/acceptance/js/storage/backup.test.mjs b/services/history-v1/test/acceptance/js/storage/backup.test.mjs
index 83087a1384..fdca1ce294 100644
--- a/services/history-v1/test/acceptance/js/storage/backup.test.mjs
+++ b/services/history-v1/test/acceptance/js/storage/backup.test.mjs
@@ -169,8 +169,8 @@ describe('backup script', function () {
         makeChunkKey(historyId, 0)
       )
       const chunkContent = await text(chunkStream.pipe(createGunzip()))
-      const chunk = await ChunkStore.loadLatestRaw(historyId)
-      const rawHistory = await historyStore.loadRaw(historyId, chunk.id)
+      const chunkMetadata = await ChunkStore.getLatestChunkMetadata(historyId)
+      const rawHistory = await historyStore.loadRaw(historyId, chunkMetadata.id)
       expect(JSON.parse(chunkContent)).to.deep.equal(rawHistory)
 
       // Unrelated entries from backedUpBlobs should be not cleared
@@ -299,8 +299,8 @@ describe('backup script', function () {
         makeChunkKey(historyId, 0)
       )
       const chunkContent = await text(chunkStream.pipe(createGunzip()))
-      const chunk = await ChunkStore.loadLatestRaw(historyId)
-      const rawHistory = await historyStore.loadRaw(historyId, chunk.id)
+      const chunkMetadata = await ChunkStore.getLatestChunkMetadata(historyId)
+      const rawHistory = await historyStore.loadRaw(historyId, chunkMetadata.id)
       expect(JSON.parse(chunkContent)).to.deep.equal(rawHistory)
 
       // Unrelated entries from backedUpBlobs should be not cleared
@@ -399,8 +399,8 @@ describe('backup script', function () {
         makeChunkKey(historyId, 0)
       )
       const chunkContent = await text(chunkStream.pipe(createGunzip()))
-      const chunk = await ChunkStore.loadLatestRaw(historyId)
-      const rawHistory = await historyStore.loadRaw(historyId, chunk.id)
+      const chunkMetadata = await ChunkStore.getLatestChunkMetadata(historyId)
+      const rawHistory = await historyStore.loadRaw(historyId, chunkMetadata.id)
       expect(JSON.parse(chunkContent)).to.deep.equal(rawHistory)
 
       // Verify that the demoted global blob was backed up
diff --git a/services/history-v1/test/acceptance/js/storage/blob_store_postgres.test.js b/services/history-v1/test/acceptance/js/storage/blob_store_postgres.test.js
index 0add4fa901..e762c33569 100644
--- a/services/history-v1/test/acceptance/js/storage/blob_store_postgres.test.js
+++ b/services/history-v1/test/acceptance/js/storage/blob_store_postgres.test.js
@@ -8,20 +8,20 @@ describe('BlobStore postgres backend', function () {
       const projectId = new ObjectId().toString()
       await expect(
         postgresBackend.insertBlob(projectId, 'hash', 123, 99)
-      ).to.be.rejectedWith(`bad projectId ${projectId}`)
+      ).to.be.rejectedWith('bad projectId')
     })
 
     it('deleteBlobs rejects when called with bad projectId', async function () {
       const projectId = new ObjectId().toString()
       await expect(postgresBackend.deleteBlobs(projectId)).to.be.rejectedWith(
-        `bad projectId ${projectId}`
+        'bad projectId'
       )
     })
 
     it('findBlobs rejects when called with bad projectId', async function () {
       const projectId = new ObjectId().toString()
       await expect(postgresBackend.findBlobs(projectId)).to.be.rejectedWith(
-        `bad projectId ${projectId}`
+        'bad projectId'
       )
     })
 
@@ -29,14 +29,14 @@ describe('BlobStore postgres backend', function () {
       const projectId = new ObjectId().toString()
       await expect(
         postgresBackend.findBlob(projectId, 'hash')
-      ).to.be.rejectedWith(`bad projectId ${projectId}`)
+      ).to.be.rejectedWith('bad projectId')
     })
 
     it('getProjectBlobs rejects when called with bad projectId', async function () {
       const projectId = new ObjectId().toString()
       await expect(
         postgresBackend.getProjectBlobs(projectId)
-      ).to.be.rejectedWith(`bad projectId ${projectId}`)
+      ).to.be.rejectedWith('bad projectId')
     })
   })
 })
diff --git a/services/history-v1/test/acceptance/js/storage/chunk_store.test.js b/services/history-v1/test/acceptance/js/storage/chunk_store.test.js
index 50341fdcb5..df1e36e9cd 100644
--- a/services/history-v1/test/acceptance/js/storage/chunk_store.test.js
+++ b/services/history-v1/test/acceptance/js/storage/chunk_store.test.js
@@ -6,6 +6,10 @@ const { expect } = require('chai')
 const sinon = require('sinon')
 const { ObjectId } = require('mongodb')
 const { projects } = require('../../../../storage/lib/mongodb')
+const {
+  ChunkVersionConflictError,
+  VersionNotFoundError,
+} = require('../../../../storage/lib/chunk_store/errors')
 
 const {
   Chunk,
@@ -18,7 +22,8 @@ const {
   EditFileOperation,
   TextOperation,
 } = require('overleaf-editor-core')
-const { chunkStore, historyStore } = require('../../../../storage')
+const { chunkStore, historyStore, BlobStore } = require('../../../../storage')
+const redisBackend = require('../../../../storage/lib/chunk_store/redis')
 
 describe('chunkStore', function () {
   beforeEach(cleanup.everything)
@@ -42,6 +47,7 @@ describe('chunkStore', function () {
     describe(scenario.description, function () {
       let projectId
       let projectRecord
+      let blobStore
 
       beforeEach(async function () {
         projectId = await scenario.createProject()
@@ -49,6 +55,7 @@ describe('chunkStore', function () {
         projectRecord = await projects.insertOne({
           overleaf: { history: { id: scenario.idMapping(projectId) } },
         })
+        blobStore = new BlobStore(projectId)
       })
 
       it('loads empty latest chunk for a new project', async function () {
@@ -62,17 +69,34 @@ describe('chunkStore', function () {
         const pendingChangeTimestamp = new Date('2014-01-01T00:00:00')
         const lastChangeTimestamp = new Date('2015-01-01T00:00:00')
         beforeEach(async function () {
-          const chunk = makeChunk(
+          const blob = await blobStore.putString('abc')
+          const firstChunk = makeChunk(
             [
               makeChange(
-                Operation.addFile('main.tex', File.fromString('abc')),
+                Operation.addFile('main.tex', File.createLazyFromBlobs(blob)),
+                lastChangeTimestamp
+              ),
+            ],
+            0
+          )
+          await chunkStore.update(projectId, firstChunk, pendingChangeTimestamp)
+
+          const secondChunk = makeChunk(
+            [
+              makeChange(
+                Operation.addFile('other.tex', File.createLazyFromBlobs(blob)),
                 lastChangeTimestamp
               ),
             ],
             1
           )
-          await chunkStore.create(projectId, chunk, pendingChangeTimestamp)
+          await chunkStore.create(
+            projectId,
+            secondChunk,
+            pendingChangeTimestamp
+          )
         })
+
         it('creates a chunk and inserts the pending change timestamp', async function () {
           const project = await projects.findOne({
             _id: new ObjectId(projectRecord.insertedId),
@@ -97,24 +121,22 @@ describe('chunkStore', function () {
 
         beforeEach(async function () {
           const chunk = await chunkStore.loadLatest(projectId)
-          const oldEndVersion = chunk.getEndVersion()
+          const blob = await blobStore.putString('')
           const changes = [
-            makeChange(Operation.addFile(testPathname, File.fromString(''))),
+            makeChange(
+              Operation.addFile(testPathname, File.createLazyFromBlobs(blob))
+            ),
             makeChange(Operation.editFile(testPathname, testTextOperation)),
           ]
           lastChangeTimestamp = changes[1].getTimestamp()
           chunk.pushChanges(changes)
-          await chunkStore.update(
-            projectId,
-            oldEndVersion,
-            chunk,
-            pendingChangeTimestamp
-          )
+          await chunkStore.update(projectId, chunk, pendingChangeTimestamp)
         })
 
         it('records the correct metadata in db readOnly=false', async function () {
-          const raw = await chunkStore.loadLatestRaw(projectId)
-          expect(raw).to.deep.include({
+          const chunkMetadata =
+            await chunkStore.getLatestChunkMetadata(projectId)
+          expect(chunkMetadata).to.deep.include({
             startVersion: 0,
             endVersion: 2,
             endTimestamp: lastChangeTimestamp,
@@ -122,10 +144,11 @@ describe('chunkStore', function () {
         })
 
         it('records the correct metadata in db readOnly=true', async function () {
-          const raw = await chunkStore.loadLatestRaw(projectId, {
-            readOnly: true,
-          })
-          expect(raw).to.deep.include({
+          const chunkMetadata = await chunkStore.getLatestChunkMetadata(
+            projectId,
+            { readOnly: true }
+          )
+          expect(chunkMetadata).to.deep.include({
             startVersion: 0,
             endVersion: 2,
             endTimestamp: lastChangeTimestamp,
@@ -181,35 +204,31 @@ describe('chunkStore', function () {
         let firstChunk, secondChunk, thirdChunk
 
         beforeEach(async function () {
+          const blob = await blobStore.putString('')
           firstChunk = makeChunk(
             [
               makeChange(
-                Operation.addFile('foo.tex', File.fromString('')),
+                Operation.addFile('foo.tex', File.createLazyFromBlobs(blob)),
                 new Date(firstChunkTimestamp - 5000)
               ),
               makeChange(
-                Operation.addFile('bar.tex', File.fromString('')),
+                Operation.addFile('bar.tex', File.createLazyFromBlobs(blob)),
                 firstChunkTimestamp
               ),
             ],
             0
           )
-          await chunkStore.update(
-            projectId,
-            0,
-            firstChunk,
-            pendingChangeTimestamp
-          )
+          await chunkStore.update(projectId, firstChunk, pendingChangeTimestamp)
           firstChunk = await chunkStore.loadLatest(projectId)
 
           secondChunk = makeChunk(
             [
               makeChange(
-                Operation.addFile('baz.tex', File.fromString('')),
+                Operation.addFile('baz.tex', File.createLazyFromBlobs(blob)),
                 new Date(secondChunkTimestamp - 5000)
               ),
               makeChange(
-                Operation.addFile('qux.tex', File.fromString('')),
+                Operation.addFile('qux.tex', File.createLazyFromBlobs(blob)),
                 secondChunkTimestamp
               ),
             ],
@@ -221,7 +240,11 @@ describe('chunkStore', function () {
           thirdChunk = makeChunk(
             [
               makeChange(
-                Operation.addFile('quux.tex', File.fromString('')),
+                Operation.addFile('quux.tex', File.createLazyFromBlobs(blob)),
+                thirdChunkTimestamp
+              ),
+              makeChange(
+                Operation.addFile('barbar.tex', File.createLazyFromBlobs(blob)),
                 thirdChunkTimestamp
               ),
             ],
@@ -298,7 +321,7 @@ describe('chunkStore', function () {
           const project = await projects.findOne({
             _id: new ObjectId(projectRecord.insertedId),
           })
-          expect(project.overleaf.history.currentEndVersion).to.equal(5)
+          expect(project.overleaf.history.currentEndVersion).to.equal(6)
           expect(project.overleaf.history.currentEndTimestamp).to.deep.equal(
             thirdChunkTimestamp
           )
@@ -313,26 +336,104 @@ describe('chunkStore', function () {
           )
         })
 
-        describe('after updating the last chunk', function () {
-          let newChunk
+        describe('chunk update', function () {
+          it('rejects a chunk that removes changes', async function () {
+            const newChunk = makeChunk([thirdChunk.getChanges()[0]], 4)
+            await expect(
+              chunkStore.update(projectId, newChunk)
+            ).to.be.rejectedWith(ChunkVersionConflictError)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(thirdChunk.toRaw())
+          })
 
-          beforeEach(async function () {
-            newChunk = makeChunk(
+          it('accepts the same chunk', async function () {
+            await chunkStore.update(projectId, thirdChunk)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(thirdChunk.toRaw())
+          })
+
+          it('accepts a larger chunk', async function () {
+            const blob = await blobStore.putString('foobar')
+            const newChunk = makeChunk(
               [
                 ...thirdChunk.getChanges(),
                 makeChange(
-                  Operation.addFile('onemore.tex', File.fromString('')),
+                  Operation.addFile(
+                    'onemore.tex',
+                    File.createLazyFromBlobs(blob)
+                  ),
                   thirdChunkTimestamp
                 ),
               ],
               4
             )
-            await chunkStore.update(projectId, 5, newChunk)
+            await chunkStore.update(projectId, newChunk)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(newChunk.toRaw())
+          })
+        })
+
+        describe('chunk create', function () {
+          let change
+
+          beforeEach(async function () {
+            const blob = await blobStore.putString('foobar')
+            change = makeChange(
+              Operation.addFile('onemore.tex', File.createLazyFromBlobs(blob)),
+              thirdChunkTimestamp
+            )
+          })
+
+          it('rejects a base version that is too low', async function () {
+            const newChunk = makeChunk([change], 5)
+            await expect(
+              chunkStore.create(projectId, newChunk)
+            ).to.be.rejectedWith(ChunkVersionConflictError)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(thirdChunk.toRaw())
+          })
+
+          it('rejects a base version that is too high', async function () {
+            const newChunk = makeChunk([change], 7)
+            await expect(
+              chunkStore.create(projectId, newChunk)
+            ).to.be.rejectedWith(VersionNotFoundError)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(thirdChunk.toRaw())
+          })
+
+          it('accepts the right base version', async function () {
+            const newChunk = makeChunk([change], 6)
+            await chunkStore.create(projectId, newChunk)
+            const latestChunk = await chunkStore.loadLatest(projectId)
+            expect(latestChunk.toRaw()).to.deep.equal(newChunk.toRaw())
+          })
+        })
+
+        describe('after updating the last chunk', function () {
+          let newChunk
+
+          beforeEach(async function () {
+            const blob = await blobStore.putString('')
+            newChunk = makeChunk(
+              [
+                ...thirdChunk.getChanges(),
+                makeChange(
+                  Operation.addFile(
+                    'onemore.tex',
+                    File.createLazyFromBlobs(blob)
+                  ),
+                  thirdChunkTimestamp
+                ),
+              ],
+              4
+            )
+            await chunkStore.update(projectId, newChunk)
             newChunk = await chunkStore.loadLatest(projectId)
           })
 
           it('replaces the latest chunk', function () {
-            expect(newChunk.getChanges()).to.have.length(2)
+            expect(newChunk.getChanges()).to.have.length(3)
           })
 
           it('returns the right chunk when querying by version', async function () {
@@ -352,7 +453,7 @@ describe('chunkStore', function () {
             const project = await projects.findOne({
               _id: new ObjectId(projectRecord.insertedId),
             })
-            expect(project.overleaf.history.currentEndVersion).to.equal(6)
+            expect(project.overleaf.history.currentEndVersion).to.equal(7)
             expect(project.overleaf.history.currentEndTimestamp).to.deep.equal(
               thirdChunkTimestamp
             )
@@ -368,6 +469,159 @@ describe('chunkStore', function () {
           })
         })
 
+        describe('with changes queued in the Redis buffer', function () {
+          let queuedChanges
+          const firstQueuedChangeTimestamp = new Date('2017-01-01T00:01:00')
+          const lastQueuedChangeTimestamp = new Date('2017-01-01T00:02:00')
+
+          beforeEach(async function () {
+            const snapshot = thirdChunk.getSnapshot()
+            snapshot.applyAll(thirdChunk.getChanges())
+            const blob = await blobStore.putString('zzz')
+            queuedChanges = [
+              makeChange(
+                Operation.addFile(
+                  'in-redis.tex',
+                  File.createLazyFromBlobs(blob)
+                ),
+                firstQueuedChangeTimestamp
+              ),
+              makeChange(
+                // Add a second change to make the buffer more interesting
+                Operation.editFile(
+                  'in-redis.tex',
+                  TextOperation.fromJSON({ textOperation: ['hello'] })
+                ),
+                lastQueuedChangeTimestamp
+              ),
+            ]
+            await redisBackend.queueChanges(
+              projectId,
+              snapshot,
+              thirdChunk.getEndVersion(),
+              queuedChanges
+            )
+          })
+
+          it('includes the queued changes when getting the latest chunk', async function () {
+            const chunk = await chunkStore.loadLatest(projectId)
+            const expectedChanges = thirdChunk
+              .getChanges()
+              .concat(queuedChanges)
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              thirdChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(
+              thirdChunk.getEndVersion() + queuedChanges.length
+            )
+            expect(chunk.getEndTimestamp()).to.deep.equal(
+              lastQueuedChangeTimestamp
+            )
+          })
+
+          it('includes the queued changes when getting the latest chunk by timestamp', async function () {
+            const chunk = await chunkStore.loadAtTimestamp(
+              projectId,
+              thirdChunkTimestamp
+            )
+            const expectedChanges = thirdChunk
+              .getChanges()
+              .concat(queuedChanges)
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              thirdChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(
+              thirdChunk.getEndVersion() + queuedChanges.length
+            )
+          })
+
+          it("doesn't include the queued changes when getting another chunk by timestamp", async function () {
+            const chunk = await chunkStore.loadAtTimestamp(
+              projectId,
+              secondChunkTimestamp
+            )
+            const expectedChanges = secondChunk.getChanges()
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              secondChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(secondChunk.getEndVersion())
+            expect(chunk.getEndTimestamp()).to.deep.equal(secondChunkTimestamp)
+          })
+
+          it('includes the queued changes when getting the latest chunk by version', async function () {
+            const chunk = await chunkStore.loadAtVersion(
+              projectId,
+              thirdChunk.getEndVersion()
+            )
+            const expectedChanges = thirdChunk
+              .getChanges()
+              .concat(queuedChanges)
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              thirdChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(
+              thirdChunk.getEndVersion() + queuedChanges.length
+            )
+            expect(chunk.getEndTimestamp()).to.deep.equal(
+              lastQueuedChangeTimestamp
+            )
+          })
+
+          it("doesn't include the queued changes when getting another chunk by version", async function () {
+            const chunk = await chunkStore.loadAtVersion(
+              projectId,
+              secondChunk.getEndVersion()
+            )
+            const expectedChanges = secondChunk.getChanges()
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              secondChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(secondChunk.getEndVersion())
+            expect(chunk.getEndTimestamp()).to.deep.equal(secondChunkTimestamp)
+          })
+
+          it('loads a version that is only in the Redis buffer', async function () {
+            const versionInRedis = thirdChunk.getEndVersion() + 1 // the first change in Redis
+            const chunk = await chunkStore.loadAtVersion(
+              projectId,
+              versionInRedis
+            )
+            // The chunk should contain changes from the thirdChunk and the queuedChanges
+            const expectedChanges = thirdChunk
+              .getChanges()
+              .concat(queuedChanges)
+            expect(chunk.getChanges()).to.deep.equal(expectedChanges)
+            expect(chunk.getStartVersion()).to.equal(
+              thirdChunk.getStartVersion()
+            )
+            expect(chunk.getEndVersion()).to.equal(
+              thirdChunk.getEndVersion() + queuedChanges.length
+            )
+            expect(chunk.getEndTimestamp()).to.deep.equal(
+              lastQueuedChangeTimestamp
+            )
+          })
+
+          it('throws an error when loading a version beyond the Redis buffer', async function () {
+            const versionBeyondRedis =
+              thirdChunk.getEndVersion() + queuedChanges.length + 1
+            await expect(
+              chunkStore.loadAtVersion(projectId, versionBeyondRedis)
+            )
+              .to.be.rejectedWith(chunkStore.VersionOutOfBoundsError)
+              .and.eventually.satisfy(err => {
+                expect(err.info).to.have.property('projectId', projectId)
+                expect(err.info).to.have.property('version', versionBeyondRedis)
+                return true
+              })
+          })
+        })
+
         describe('when iterating the chunks with getProjectChunksFromVersion', function () {
           // The first chunk has startVersion:0 and endVersion:2
           for (let startVersion = 0; startVersion <= 2; startVersion++) {
@@ -442,7 +696,7 @@ describe('chunkStore', function () {
             const chunkRecords = []
             for await (const chunk of chunkStore.getProjectChunksFromVersion(
               projectId,
-              6
+              7
             )) {
               chunkRecords.push(chunk)
             }
@@ -470,15 +724,18 @@ describe('chunkStore', function () {
           let chunk = await chunkStore.loadLatest(projectId)
           expect(chunk.getEndVersion()).to.equal(oldEndVersion)
 
+          const blob = await blobStore.putString('')
           const changes = [
-            makeChange(Operation.addFile(testPathname, File.fromString(''))),
+            makeChange(
+              Operation.addFile(testPathname, File.createLazyFromBlobs(blob))
+            ),
             makeChange(Operation.editFile(testPathname, testTextOperation)),
           ]
           chunk.pushChanges(changes)
 
-          await expect(
-            chunkStore.update(projectId, oldEndVersion, chunk)
-          ).to.be.rejectedWith('S3 Error')
+          await expect(chunkStore.update(projectId, chunk)).to.be.rejectedWith(
+            'S3 Error'
+          )
           chunk = await chunkStore.loadLatest(projectId)
           expect(chunk.getEndVersion()).to.equal(oldEndVersion)
         })
@@ -487,9 +744,12 @@ describe('chunkStore', function () {
       describe('version checks', function () {
         beforeEach(async function () {
           // Create a chunk with start version 0, end version 3
+          const blob = await blobStore.putString('abc')
           const chunk = makeChunk(
             [
-              makeChange(Operation.addFile('main.tex', File.fromString('abc'))),
+              makeChange(
+                Operation.addFile('main.tex', File.createLazyFromBlobs(blob))
+              ),
               makeChange(
                 Operation.editFile(
                   'main.tex',
@@ -505,12 +765,17 @@ describe('chunkStore', function () {
             ],
             0
           )
-          await chunkStore.update(projectId, 0, chunk)
+          await chunkStore.update(projectId, chunk)
         })
 
         it('refuses to create a chunk with the same start version', async function () {
+          const blob = await blobStore.putString('abc')
           const chunk = makeChunk(
-            [makeChange(Operation.addFile('main.tex', File.fromString('abc')))],
+            [
+              makeChange(
+                Operation.addFile('main.tex', File.createLazyFromBlobs(blob))
+              ),
+            ],
             0
           )
           await expect(chunkStore.create(projectId, chunk)).to.be.rejectedWith(
@@ -519,8 +784,13 @@ describe('chunkStore', function () {
         })
 
         it("allows creating chunks that don't have version conflicts", async function () {
+          const blob = await blobStore.putString('abc')
           const chunk = makeChunk(
-            [makeChange(Operation.addFile('main.tex', File.fromString('abc')))],
+            [
+              makeChange(
+                Operation.addFile('main.tex', File.createLazyFromBlobs(blob))
+              ),
+            ],
             3
           )
           await chunkStore.create(projectId, chunk)
diff --git a/services/history-v1/test/acceptance/js/storage/chunk_store_mongo_backend.test.js b/services/history-v1/test/acceptance/js/storage/chunk_store_mongo_backend.test.js
index 61d80810f1..98cdd2db4d 100644
--- a/services/history-v1/test/acceptance/js/storage/chunk_store_mongo_backend.test.js
+++ b/services/history-v1/test/acceptance/js/storage/chunk_store_mongo_backend.test.js
@@ -1,8 +1,16 @@
 const { expect } = require('chai')
 const { ObjectId } = require('mongodb')
-const { Chunk, Snapshot, History } = require('overleaf-editor-core')
+const {
+  Chunk,
+  Snapshot,
+  History,
+  Change,
+  AddFileOperation,
+  File,
+} = require('overleaf-editor-core')
 const cleanup = require('./support/cleanup')
 const backend = require('../../../../storage/lib/chunk_store/mongo')
+const { ChunkVersionConflictError } = require('../../../../storage')
 
 describe('chunk store Mongo backend', function () {
   beforeEach(cleanup.everything)
@@ -42,11 +50,86 @@ describe('chunk store Mongo backend', function () {
       expect(oldChunks).to.deep.equal([])
     })
   })
+
+  describe('concurrency handling', function () {
+    it('prevents chunks from being created with the same start version', async function () {
+      const projectId = new ObjectId().toString()
+      const chunks = [makeChunk([], 10), makeChunk([], 10)]
+
+      const chunkIds = []
+      for (const chunk of chunks) {
+        const chunkId = await backend.insertPendingChunk(projectId, chunk)
+        chunkIds.push(chunkId)
+      }
+
+      await backend.confirmCreate(projectId, chunks[0], chunkIds[0])
+      await expect(
+        backend.confirmCreate(projectId, chunks[1], chunkIds[1])
+      ).to.be.rejectedWith(ChunkVersionConflictError)
+    })
+
+    describe('conflicts between chunk extension and chunk creation', function () {
+      let projectId,
+        baseChunkId,
+        updatedChunkId,
+        newChunkId,
+        updatedChunk,
+        newChunk
+
+      beforeEach(async function () {
+        projectId = new ObjectId().toString()
+        const baseChunk = makeChunk([], 0)
+        baseChunkId = await backend.insertPendingChunk(projectId, baseChunk)
+        await backend.confirmCreate(projectId, baseChunk, baseChunkId)
+
+        const change = new Change(
+          [new AddFileOperation('main.tex', File.fromString('hello'))],
+          new Date()
+        )
+
+        updatedChunk = makeChunk([change], 0)
+        updatedChunkId = await backend.insertPendingChunk(
+          projectId,
+          updatedChunk
+        )
+        newChunk = makeChunk([change], 1)
+        newChunkId = await backend.insertPendingChunk(projectId, newChunk)
+      })
+
+      it('prevents creation after extension', async function () {
+        await backend.confirmUpdate(
+          projectId,
+          baseChunkId,
+          updatedChunk,
+          updatedChunkId
+        )
+        await expect(
+          backend.confirmCreate(projectId, newChunk, newChunkId, {
+            oldChunkId: baseChunkId,
+          })
+        ).to.be.rejectedWith(ChunkVersionConflictError)
+      })
+
+      it('prevents extension after creation', async function () {
+        await backend.confirmCreate(projectId, newChunk, newChunkId, {
+          oldChunkId: baseChunkId,
+        })
+        await expect(
+          backend.confirmUpdate(
+            projectId,
+            baseChunkId,
+            updatedChunk,
+            updatedChunkId
+          )
+        ).to.be.rejectedWith(ChunkVersionConflictError)
+      })
+    })
+  })
 })
 
 function makeChunk(changes, versionNumber) {
   const snapshot = Snapshot.fromRaw({ files: {} })
-  const history = new History(snapshot, [])
+  const history = new History(snapshot, changes)
   const chunk = new Chunk(history, versionNumber)
   return chunk
 }
diff --git a/services/history-v1/test/acceptance/js/storage/chunk_store_postgres_backend.test.js b/services/history-v1/test/acceptance/js/storage/chunk_store_postgres_backend.test.js
index 20a24de3eb..cd1d705bdc 100644
--- a/services/history-v1/test/acceptance/js/storage/chunk_store_postgres_backend.test.js
+++ b/services/history-v1/test/acceptance/js/storage/chunk_store_postgres_backend.test.js
@@ -1,7 +1,15 @@
 const { expect } = require('chai')
 const { ObjectId } = require('mongodb')
-const { Chunk, Snapshot, History } = require('overleaf-editor-core')
+const {
+  Chunk,
+  Snapshot,
+  History,
+  Change,
+  AddFileOperation,
+  File,
+} = require('overleaf-editor-core')
 const cleanup = require('./support/cleanup')
+const { ChunkVersionConflictError } = require('../../../../storage')
 const backend = require('../../../../storage/lib/chunk_store/postgres')
 
 describe('chunk store Postgres backend', function () {
@@ -11,32 +19,86 @@ describe('chunk store Postgres backend', function () {
     const invalidProjectId = new ObjectId().toString()
 
     await expect(backend.getLatestChunk(invalidProjectId)).to.be.rejectedWith(
-      `bad projectId ${invalidProjectId}`
+      'bad projectId'
     )
     await expect(
       backend.getChunkForVersion(invalidProjectId, 1)
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(
       backend.getChunkForTimestamp(invalidProjectId, new Date())
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(
       backend.getProjectChunkIds(invalidProjectId)
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(
       backend.insertPendingChunk(invalidProjectId, makeChunk([], 0))
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(
       backend.confirmCreate(invalidProjectId, makeChunk([], 0), 1)
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(
       backend.confirmUpdate(invalidProjectId, 1, makeChunk([], 0), 2)
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
     await expect(backend.deleteChunk(invalidProjectId, 1)).to.be.rejectedWith(
-      `bad projectId ${invalidProjectId}`
+      'bad projectId'
     )
     await expect(
       backend.deleteProjectChunks(invalidProjectId)
-    ).to.be.rejectedWith(`bad projectId ${invalidProjectId}`)
+    ).to.be.rejectedWith('bad projectId')
+  })
+
+  describe('conflicts between chunk extension and chunk creation', function () {
+    let projectId,
+      baseChunkId,
+      updatedChunkId,
+      newChunkId,
+      updatedChunk,
+      newChunk
+
+    beforeEach(async function () {
+      projectId = '1234'
+      const baseChunk = makeChunk([], 0)
+      baseChunkId = await backend.insertPendingChunk(projectId, baseChunk)
+      await backend.confirmCreate(projectId, baseChunk, baseChunkId)
+
+      const change = new Change(
+        [new AddFileOperation('main.tex', File.fromString('hello'))],
+        new Date()
+      )
+
+      updatedChunk = makeChunk([change], 0)
+      updatedChunkId = await backend.insertPendingChunk(projectId, updatedChunk)
+      newChunk = makeChunk([change], 1)
+      newChunkId = await backend.insertPendingChunk(projectId, newChunk)
+    })
+
+    it('prevents creation after extension', async function () {
+      await backend.confirmUpdate(
+        projectId,
+        baseChunkId,
+        updatedChunk,
+        updatedChunkId
+      )
+      await expect(
+        backend.confirmCreate(projectId, newChunk, newChunkId, {
+          oldChunkId: baseChunkId,
+        })
+      ).to.be.rejectedWith(ChunkVersionConflictError)
+    })
+
+    it('prevents extension after creation', async function () {
+      await backend.confirmCreate(projectId, newChunk, newChunkId, {
+        oldChunkId: baseChunkId,
+      })
+      await expect(
+        backend.confirmUpdate(
+          projectId,
+          baseChunkId,
+          updatedChunk,
+          updatedChunkId
+        )
+      ).to.be.rejectedWith(ChunkVersionConflictError)
+    })
   })
 })
 
diff --git a/services/history-v1/test/acceptance/js/storage/chunk_store_redis_backend.test.js b/services/history-v1/test/acceptance/js/storage/chunk_store_redis_backend.test.js
new file mode 100644
index 0000000000..fc176de192
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/chunk_store_redis_backend.test.js
@@ -0,0 +1,1315 @@
+'use strict'
+
+const { expect } = require('chai')
+const {
+  Snapshot,
+  Change,
+  AddFileOperation,
+  File,
+} = require('overleaf-editor-core')
+const cleanup = require('./support/cleanup')
+const redisBackend = require('../../../../storage/lib/chunk_store/redis')
+const {
+  JobNotReadyError,
+  JobNotFoundError,
+  VersionOutOfBoundsError,
+} = require('../../../../storage/lib/chunk_store/errors')
+const redis = require('../../../../storage/lib/redis')
+const rclient = redis.rclientHistory
+const keySchema = redisBackend.keySchema
+
+describe('chunk buffer Redis backend', function () {
+  beforeEach(cleanup.everything)
+  const projectId = 'project123'
+
+  describe('getHeadSnapshot', function () {
+    it('should return null on cache miss', async function () {
+      const result = await redisBackend.getHeadSnapshot(projectId)
+      expect(result).to.be.null
+    })
+
+    it('should return the cached head snapshot and version', async function () {
+      // Create a sample snapshot and version
+      const snapshot = new Snapshot()
+      const version = 42
+      const rawSnapshot = JSON.stringify(snapshot.toRaw())
+
+      // Manually set the data in Redis
+      await rclient.set(keySchema.head({ projectId }), rawSnapshot)
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        version.toString()
+      )
+
+      // Retrieve the cached snapshot
+      const result = await redisBackend.getHeadSnapshot(projectId)
+
+      expect(result).to.not.be.null
+      expect(result.version).to.equal(version)
+      expect(result.snapshot).to.deep.equal(snapshot) // Use deep equal for object comparison
+    })
+
+    it('should return null if the version is missing', async function () {
+      // Create a sample snapshot
+      const snapshot = new Snapshot()
+      const rawSnapshot = JSON.stringify(snapshot.toRaw())
+
+      // Manually set only the snapshot data in Redis
+      await rclient.set(keySchema.head({ projectId }), rawSnapshot)
+
+      // Attempt to retrieve the snapshot
+      const result = await redisBackend.getHeadSnapshot(projectId)
+
+      expect(result).to.be.null
+    })
+  })
+
+  describe('queueChanges', function () {
+    it('should queue changes when the base version matches head version', async function () {
+      // Create base version
+      const baseVersion = 0
+
+      // Create a new head snapshot that will be set after changes
+      const headSnapshot = new Snapshot()
+
+      // Create changes
+      const timestamp = new Date()
+      const change = new Change([], timestamp, [])
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000 // 30 seconds from now
+      const expireTime = now + 60 * 60 * 1000 // 1 hour from now
+
+      // Queue the changes
+      await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change],
+        { persistTime, expireTime }
+      )
+
+      // Get the state to verify the changes
+      const state = await redisBackend.getState(projectId)
+
+      // Verify the result
+      expect(state).to.exist
+      expect(state.headVersion).to.equal(baseVersion + 1)
+      expect(state.headSnapshot).to.deep.equal(headSnapshot.toRaw())
+      expect(state.persistTime).to.equal(persistTime)
+      expect(state.expireTime).to.equal(expireTime)
+    })
+
+    it('should throw BaseVersionConflictError when base version does not match head version', async function () {
+      // Create a mismatch scenario
+      const headSnapshot = new Snapshot()
+      const baseVersion = 0
+
+      // Manually set a different head version in Redis
+      await rclient.set(keySchema.headVersion({ projectId }), '5')
+
+      // Create changes
+      const timestamp = new Date()
+      const change = new Change([], timestamp, [])
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Attempt to queue the changes with a mismatched base version
+      // This should throw a BaseVersionConflictError
+      try {
+        await redisBackend.queueChanges(
+          projectId,
+          headSnapshot,
+          baseVersion,
+          [change],
+          { persistTime, expireTime }
+        )
+        // If we get here, the test should fail
+        expect.fail('Expected BaseVersionConflictError but no error was thrown')
+      } catch (err) {
+        expect(err.name).to.equal('BaseVersionConflictError')
+        expect(err.info).to.deep.include({
+          projectId,
+          baseVersion,
+        })
+      }
+    })
+
+    it('should throw error when given an empty changes array', async function () {
+      // Create a valid scenario but with empty changes
+      const headSnapshot = new Snapshot()
+      const baseVersion = 0
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Attempt to queue with empty changes array
+      try {
+        await redisBackend.queueChanges(
+          projectId,
+          headSnapshot,
+          baseVersion,
+          [], // Empty changes array
+          { persistTime, expireTime }
+        )
+        // If we get here, the test should fail
+        expect.fail('Expected Error but no error was thrown')
+      } catch (err) {
+        expect(err.message).to.equal('Cannot queue empty changes array')
+      }
+    })
+
+    it('should queue multiple changes and increment version correctly', async function () {
+      // Create base version
+      const baseVersion = 0
+
+      // Create a new head snapshot
+      const headSnapshot = new Snapshot()
+
+      // Create multiple changes
+      const timestamp = new Date()
+      const change1 = new Change([], timestamp)
+      const change2 = new Change([], timestamp)
+      const change3 = new Change([], timestamp)
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Queue the changes
+      await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change1, change2, change3], // Multiple changes
+        { persistTime, expireTime }
+      )
+
+      // Get the state to verify the changes
+      const state = await redisBackend.getState(projectId)
+
+      // Verify that version was incremented by the number of changes
+      expect(state.headVersion).to.equal(baseVersion + 3)
+      expect(state.headSnapshot).to.deep.equal(headSnapshot.toRaw())
+    })
+
+    it('should use the provided persistTime only if it is sooner than existing time', async function () {
+      // Create base version
+      const baseVersion = 0
+
+      // Create a new head snapshot
+      const headSnapshot = new Snapshot()
+
+      // Create changes
+      const timestamp = new Date()
+      const change = new Change([], timestamp)
+
+      // Set times
+      const now = Date.now()
+      const earlierPersistTime = now + 15 * 1000 // 15 seconds from now
+      const laterPersistTime = now + 30 * 1000 // 30 seconds from now
+      const expireTime = now + 60 * 60 * 1000 // 1 hour from now
+
+      // First queue changes with the later persist time
+      await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change],
+        { persistTime: laterPersistTime, expireTime }
+      )
+
+      // Get the state to verify the first persist time was set
+      let state = await redisBackend.getState(projectId)
+      expect(state.persistTime).to.equal(laterPersistTime)
+
+      // Queue more changes with an earlier persist time
+      const newerHeadSnapshot = new Snapshot()
+      await redisBackend.queueChanges(
+        projectId,
+        newerHeadSnapshot,
+        baseVersion + 1, // Updated base version
+        [change],
+        {
+          persistTime: earlierPersistTime, // Earlier time should replace the later one
+          expireTime,
+        }
+      )
+
+      // Get the state to verify the persist time was updated to the earlier time
+      state = await redisBackend.getState(projectId)
+      expect(state.persistTime).to.equal(earlierPersistTime)
+
+      // Queue more changes with another later persist time
+      const evenNewerHeadSnapshot = new Snapshot()
+      await redisBackend.queueChanges(
+        projectId,
+        evenNewerHeadSnapshot,
+        baseVersion + 2, // Updated base version
+        [change],
+        {
+          persistTime: laterPersistTime, // Later time should not replace the earlier one
+          expireTime,
+        }
+      )
+
+      // Get the state to verify the persist time remains at the earlier time
+      state = await redisBackend.getState(projectId)
+      expect(state.persistTime).to.equal(earlierPersistTime) // Should still be the earlier time
+    })
+
+    it('should ignore changes when onlyIfExists is true and project does not exist', async function () {
+      // Create base version
+      const baseVersion = 10
+
+      // Create a new head snapshot
+      const headSnapshot = new Snapshot()
+
+      // Create changes
+      const timestamp = new Date()
+      const change = new Change([], timestamp)
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Queue changes with onlyIfExists set to true
+      const result = await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change],
+        { persistTime, expireTime, onlyIfExists: true }
+      )
+
+      // Should return 'ignore' status
+      expect(result).to.equal('ignore')
+
+      // Get the state - should be empty/null
+      const state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.be.null
+      expect(state.headSnapshot).to.be.null
+    })
+
+    it('should queue changes when onlyIfExists is true and project exists', async function () {
+      // First create the project
+      const headSnapshot = new Snapshot()
+      const baseVersion = 10
+      const timestamp = new Date()
+      const change1 = new Change([], timestamp)
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Create the project first
+      await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change1],
+        { persistTime, expireTime }
+      )
+
+      // Now create another change with onlyIfExists set to true
+      const newerSnapshot = new Snapshot()
+      const change2 = new Change([], timestamp)
+
+      // Queue changes with onlyIfExists set to true
+      const result = await redisBackend.queueChanges(
+        projectId,
+        newerSnapshot,
+        baseVersion + 1, // Version should be 1 after the first change
+        [change2],
+        { persistTime, expireTime, onlyIfExists: true }
+      )
+
+      // Should return 'ok' status
+      expect(result).to.equal('ok')
+
+      // Get the state to verify the changes were applied
+      const state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(baseVersion + 2) // Should be 2 after both changes
+      expect(state.headSnapshot).to.deep.equal(newerSnapshot.toRaw())
+    })
+
+    it('should queue changes when onlyIfExists is false and project does not exist', async function () {
+      // Create base version
+      const baseVersion = 10
+
+      // Create a new head snapshot
+      const headSnapshot = new Snapshot()
+
+      // Create changes
+      const timestamp = new Date()
+      const change = new Change([], timestamp)
+
+      // Set times
+      const now = Date.now()
+      const persistTime = now + 30 * 1000
+      const expireTime = now + 60 * 60 * 1000
+
+      // Queue changes with onlyIfExists explicitly set to false
+      const result = await redisBackend.queueChanges(
+        projectId,
+        headSnapshot,
+        baseVersion,
+        [change],
+        { persistTime, expireTime, onlyIfExists: false }
+      )
+
+      // Should return 'ok' status
+      expect(result).to.equal('ok')
+
+      // Get the state to verify the project was created
+      const state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(baseVersion + 1)
+      expect(state.headSnapshot).to.deep.equal(headSnapshot.toRaw())
+    })
+  })
+
+  describe('getChangesSinceVersion', function () {
+    it('should return not_found when project does not exist', async function () {
+      const result = await redisBackend.getChangesSinceVersion(projectId, 1)
+      expect(result.status).to.equal('not_found')
+    })
+
+    it('should return empty array when requested version equals head version', async function () {
+      // Set head version
+      const headVersion = 5
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Request changes since the current head version
+      const result = await redisBackend.getChangesSinceVersion(
+        projectId,
+        headVersion
+      )
+
+      expect(result.status).to.equal('ok')
+      expect(result.changes).to.be.an('array').that.is.empty
+    })
+
+    it('should return out_of_bounds when requested version is greater than head version', async function () {
+      // Set head version
+      const headVersion = 5
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Request changes with version larger than head
+      const result = await redisBackend.getChangesSinceVersion(
+        projectId,
+        headVersion + 1
+      )
+
+      expect(result.status).to.equal('out_of_bounds')
+    })
+
+    it('should return out_of_bounds when requested version is too old', async function () {
+      // Set head version
+      const headVersion = 10
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Create a few changes but less than what we'd need to reach requested version
+      const timestamp = new Date()
+      const change1 = new Change([], timestamp)
+      const change2 = new Change([], timestamp)
+      await rclient.rpush(
+        keySchema.changes({ projectId }),
+        JSON.stringify(change1.toRaw()),
+        JSON.stringify(change2.toRaw())
+      )
+
+      // Request changes from version 5, which is too old (headVersion - changesCount = 10 - 2 = 8)
+      const result = await redisBackend.getChangesSinceVersion(projectId, 5)
+
+      expect(result.status).to.equal('out_of_bounds')
+    })
+
+    it('should return changes since requested version', async function () {
+      // Set head version
+      const headVersion = 5
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Create changes
+      const timestamp = new Date()
+      const change1 = new Change([], timestamp)
+      const change2 = new Change([], timestamp)
+      const change3 = new Change([], timestamp)
+
+      // Push changes to Redis (representing versions 3, 4, and 5)
+      await rclient.rpush(
+        keySchema.changes({ projectId }),
+        JSON.stringify(change1.toRaw()),
+        JSON.stringify(change2.toRaw()),
+        JSON.stringify(change3.toRaw())
+      )
+
+      // Request changes since version 3 (should return changes for versions 4 and 5)
+      const result = await redisBackend.getChangesSinceVersion(projectId, 3)
+
+      expect(result.status).to.equal('ok')
+      expect(result.changes).to.be.an('array').with.lengthOf(2)
+
+      // The changes array should contain the raw changes
+      // Note: We're comparing raw objects, not the Change instances
+      expect(result.changes[0]).to.deep.equal(change2.toRaw())
+      expect(result.changes[1]).to.deep.equal(change3.toRaw())
+    })
+
+    it('should return all changes when requested version is earliest available', async function () {
+      // Set head version to 5
+      const headVersion = 5
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Create changes
+      const timestamp = new Date()
+      const change1 = new Change([], timestamp)
+      const change2 = new Change([], timestamp)
+      const change3 = new Change([], timestamp)
+
+      // Push changes to Redis (representing versions 3, 4, and 5)
+      await rclient.rpush(
+        keySchema.changes({ projectId }),
+        JSON.stringify(change1.toRaw()),
+        JSON.stringify(change2.toRaw()),
+        JSON.stringify(change3.toRaw())
+      )
+
+      // Request changes since version 2 (should return all 3 changes)
+      const result = await redisBackend.getChangesSinceVersion(projectId, 2)
+
+      expect(result.status).to.equal('ok')
+      expect(result.changes).to.be.an('array').with.lengthOf(3)
+      expect(result.changes[0]).to.deep.equal(change1.toRaw())
+      expect(result.changes[1]).to.deep.equal(change2.toRaw())
+      expect(result.changes[2]).to.deep.equal(change3.toRaw())
+    })
+  })
+
+  describe('getNonPersistedChanges', function () {
+    describe('project not loaded', function () {
+      it('should return empty array', async function () {
+        const changes = await redisBackend.getNonPersistedChanges(projectId, 0)
+        expect(changes).to.be.an('array').that.is.empty
+      })
+
+      it('should handle any base version', async function () {
+        const changes = await redisBackend.getNonPersistedChanges(projectId, 2)
+        expect(changes).to.be.an('array').that.is.empty
+      })
+    })
+
+    describe('project never persisted', function () {
+      let changes
+
+      beforeEach(async function () {
+        changes = await setupState(projectId, {
+          headVersion: 5,
+          persistedVersion: null,
+          changes: 3,
+        })
+      })
+
+      it('should return all changes if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          2
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes)
+      })
+
+      it('should return part of the changes following a given base version if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          3
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(1))
+      })
+
+      it('should limit the number of changes returned if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          2,
+          { maxChanges: 2 }
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(0, 2))
+      })
+
+      it('should return all changes if limit is not reached', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          3,
+          { maxChanges: 10 }
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(1))
+      })
+
+      it('should error if the base version requested is too low', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 0)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+
+      it('should return an empty array if the base version is the head version', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          5
+        )
+        expect(nonPersistedChanges).to.deep.equal([])
+      })
+
+      it('should error if the base version requested is too high', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 6)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+    })
+
+    describe('fully persisted changes', function () {
+      beforeEach(async function () {
+        await setupState(projectId, {
+          headVersion: 5,
+          persistedVersion: 5,
+          changes: 3,
+        })
+      })
+
+      it('should return an empty array when asked for the head version', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          5
+        )
+        expect(nonPersistedChanges).to.deep.equal([])
+      })
+
+      it('should throw an error when asked for an older version', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 4)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+
+      it('should throw an error when asked for a newer version', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 6)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+    })
+
+    describe('partially persisted project', async function () {
+      let changes
+
+      beforeEach(async function () {
+        changes = await setupState(projectId, {
+          headVersion: 10,
+          persistedVersion: 7,
+          changes: 6,
+        })
+      })
+
+      it('should return all non-persisted changes if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          7
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(3))
+      })
+
+      it('should return part of the changes if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          8
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(4))
+      })
+
+      it('should error if the base version requested is too low', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 5)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+
+      it('should return an empty array if the base version is the head version', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          10
+        )
+        expect(nonPersistedChanges).to.deep.equal([])
+      })
+
+      it('should error if the base version requested is too high', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 12)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+    })
+
+    // This case should never happen, but we'll handle it anyway
+    describe('persisted version before start of changes list', async function () {
+      let changes
+
+      beforeEach(async function () {
+        changes = await setupState(projectId, {
+          headVersion: 5,
+          persistedVersion: 1,
+          changes: 3,
+        })
+      })
+
+      it('should return all non-persisted changes if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          2
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes)
+      })
+
+      it('should return part of the changes if requested', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          3
+        )
+        expect(nonPersistedChanges).to.deep.equal(changes.slice(1))
+      })
+
+      it('should error if the base version requested is too low', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 1)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+
+      it('should return an empty array if the base version is the head version', async function () {
+        const nonPersistedChanges = await redisBackend.getNonPersistedChanges(
+          projectId,
+          5
+        )
+        expect(nonPersistedChanges).to.deep.equal([])
+      })
+
+      it('should error if the base version requested is too high', async function () {
+        await expect(
+          redisBackend.getNonPersistedChanges(projectId, 6)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+      })
+    })
+  })
+
+  describe('setPersistedVersion', function () {
+    const persistTime = Date.now() + 60 * 1000 // 1 minute from now
+
+    it('should return not_found when project does not exist', async function () {
+      const result = await redisBackend.setPersistedVersion(projectId, 5)
+      expect(result).to.equal('not_found')
+    })
+
+    describe('when the persisted version is not set', function () {
+      beforeEach(async function () {
+        await setupState(projectId, {
+          headVersion: 5,
+          persistedVersion: null,
+          persistTime,
+          changes: 5,
+        })
+      })
+
+      it('should set the persisted version', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 3)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(3)
+      })
+
+      it('should leave the persist time if the persisted version is not current', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 3)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistTime).to.deep.equal(persistTime) // Persist time should remain unchanged
+      })
+
+      it('should refuse to set a persisted version greater than the head version', async function () {
+        await expect(
+          redisBackend.setPersistedVersion(projectId, 10)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+        // Ensure persisted version remains unchanged
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.be.null
+      })
+
+      it('should clear the persist time when the persisted version is current', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 5)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(5)
+        expect(state.persistTime).to.be.null // Persist time should be cleared
+      })
+    })
+
+    describe('when the persisted version is set', function () {
+      beforeEach(async function () {
+        await setupState(projectId, {
+          headVersion: 5,
+          persistedVersion: 3,
+          persistTime,
+          changes: 5,
+        })
+      })
+
+      it('should set the persisted version', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 5)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(5)
+      })
+
+      it('should clear the persist time when the persisted version is current', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 5)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(5)
+        expect(state.persistTime).to.be.null // Persist time should be cleared
+      })
+
+      it('should leave the persist time if the persisted version is not current', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 4)
+        expect(status).to.equal('ok')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(4)
+        expect(state.persistTime).to.deep.equal(persistTime) // Persist time should remain unchanged
+      })
+
+      it('should not decrease the persisted version', async function () {
+        const status = await redisBackend.setPersistedVersion(projectId, 2)
+        expect(status).to.equal('too_low')
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(3)
+      })
+
+      it('should refuse to set a persisted version greater than the head version', async function () {
+        await expect(
+          redisBackend.setPersistedVersion(projectId, 10)
+        ).to.be.rejectedWith(VersionOutOfBoundsError)
+        // Ensure persisted version remains unchanged
+        const state = await redisBackend.getState(projectId)
+        expect(state.persistedVersion).to.equal(3)
+      })
+    })
+
+    it('should trim the changes list to keep only MAX_PERSISTED_CHANGES beyond persisted version', async function () {
+      // Get MAX_PERSISTED_CHANGES to ensure our test data is larger
+      const maxPersistedChanges = redisBackend.MAX_PERSISTED_CHANGES
+
+      // Create a larger number of changes for the test
+      // Using MAX_PERSISTED_CHANGES + 10 to ensure we have enough changes to trigger trimming
+      const totalChanges = maxPersistedChanges + 10
+
+      // Set head version to match total number of changes
+      const headVersion = totalChanges
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Create changes for versions 1 through totalChanges
+      const timestamp = new Date()
+      const changes = Array.from(
+        { length: totalChanges },
+        (_, idx) =>
+          new Change(
+            [new AddFileOperation(`file${idx}.tex`, File.fromString('hello'))],
+            timestamp
+          )
+      )
+
+      // Push changes to Redis
+      await rclient.rpush(
+        keySchema.changes({ projectId }),
+        ...changes.map(change => JSON.stringify(change.toRaw()))
+      )
+
+      // Set persisted version to somewhere near the head version
+      const persistedVersion = headVersion - 5
+
+      // Set the persisted version
+      const result = await redisBackend.setPersistedVersion(
+        projectId,
+        persistedVersion
+      )
+      expect(result).to.equal('ok')
+
+      // Get all changes that remain in Redis
+      const remainingChanges = await rclient.lrange(
+        keySchema.changes({ projectId }),
+        0,
+        -1
+      )
+
+      // Calculate the expected number of changes to remain
+      expect(remainingChanges).to.have.lengthOf(
+        maxPersistedChanges + (headVersion - persistedVersion)
+      )
+
+      // Check that remaining changes are the expected ones
+      const expectedChanges = changes.slice(
+        persistedVersion - maxPersistedChanges,
+        totalChanges
+      )
+      expect(remainingChanges).to.deep.equal(
+        expectedChanges.map(change => JSON.stringify(change.toRaw()))
+      )
+    })
+
+    it('should keep all changes when there are fewer than MAX_PERSISTED_CHANGES', async function () {
+      // Set head version to 5
+      const headVersion = 5
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Create changes for versions 1 through 5
+      const timestamp = new Date()
+      const changes = Array.from({ length: 5 }, () => new Change([], timestamp))
+
+      // Push changes to Redis
+      await rclient.rpush(
+        keySchema.changes({ projectId }),
+        ...changes.map(change => JSON.stringify(change.toRaw()))
+      )
+
+      // Set persisted version to 3
+      // All changes should remain since total count is small
+      const persistedVersion = 3
+
+      // Ensure MAX_PERSISTED_CHANGES is larger than our test dataset
+      expect(redisBackend.MAX_PERSISTED_CHANGES).to.be.greaterThan(
+        5,
+        'MAX_PERSISTED_CHANGES should be greater than 5 for this test'
+      )
+
+      // Set the persisted version
+      const result = await redisBackend.setPersistedVersion(
+        projectId,
+        persistedVersion
+      )
+      expect(result).to.equal('ok')
+
+      // Get all changes that remain in Redis
+      const remainingChanges = await rclient.lrange(
+        keySchema.changes({ projectId }),
+        0,
+        -1
+      )
+
+      // All changes should remain
+      expect(remainingChanges).to.have.lengthOf(5)
+    })
+  })
+
+  describe('getState', function () {
+    it('should return complete project state from Redis', async function () {
+      // Set up the test data in Redis
+      const snapshot = new Snapshot()
+      const rawSnapshot = JSON.stringify(snapshot.toRaw())
+      const headVersion = 42
+      const persistedVersion = 40
+      const now = Date.now()
+      const expireTime = now + 60 * 60 * 1000 // 1 hour from now
+      const persistTime = now + 30 * 1000 // 30 seconds from now
+
+      // Create a change
+      const timestamp = new Date()
+      const change = new Change([], timestamp)
+      const serializedChange = JSON.stringify(change.toRaw())
+
+      // Set everything in Redis
+      await rclient.set(keySchema.head({ projectId }), rawSnapshot)
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+      await rclient.set(
+        keySchema.persistedVersion({ projectId }),
+        persistedVersion.toString()
+      )
+      await rclient.set(
+        keySchema.expireTime({ projectId }),
+        expireTime.toString()
+      )
+      await rclient.set(
+        keySchema.persistTime({ projectId }),
+        persistTime.toString()
+      )
+      await rclient.rpush(keySchema.changes({ projectId }), serializedChange)
+
+      // Get the state
+      const state = await redisBackend.getState(projectId)
+
+      // Verify everything matches
+      expect(state).to.exist
+      expect(state.headSnapshot).to.deep.equal(snapshot.toRaw())
+      expect(state.headVersion).to.equal(headVersion)
+      expect(state.persistedVersion).to.equal(persistedVersion)
+      expect(state.expireTime).to.equal(expireTime)
+      expect(state.persistTime).to.equal(persistTime)
+    })
+
+    it('should return proper defaults for missing fields', async function () {
+      // Only set the head snapshot and version, leave others unset
+      const snapshot = new Snapshot()
+      const rawSnapshot = JSON.stringify(snapshot.toRaw())
+      const headVersion = 42
+
+      await rclient.set(keySchema.head({ projectId }), rawSnapshot)
+      await rclient.set(
+        keySchema.headVersion({ projectId }),
+        headVersion.toString()
+      )
+
+      // Get the state
+      const state = await redisBackend.getState(projectId)
+
+      // Verify only what we set exists, and other fields have correct defaults
+      expect(state).to.exist
+      expect(state.headSnapshot).to.deep.equal(snapshot.toRaw())
+      expect(state.headVersion).to.equal(headVersion)
+      expect(state.persistedVersion).to.be.null
+      expect(state.expireTime).to.be.null
+      expect(state.persistTime).to.be.null
+    })
+  })
+
+  describe('setExpireTime', function () {
+    it('should set the expire time on an active project', async function () {
+      // Load a fake project in Redis
+      const change = makeChange()
+      await queueChanges(projectId, [change], { expireTime: 123 })
+
+      // Check that the right expire time was recorded
+      let state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.equal(123)
+
+      // Set the expire time to something else
+      await redisBackend.setExpireTime(projectId, 456)
+      state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.equal(456)
+    })
+
+    it('should not set an expire time on an inactive project', async function () {
+      let state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.be.null
+
+      await redisBackend.setExpireTime(projectId, 456)
+      state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.be.null
+    })
+  })
+
+  describe('expireProject', function () {
+    it('should expire a persisted project', async function () {
+      // Load and persist a project in Redis
+      const change = makeChange()
+      await queueChanges(projectId, [change])
+      await redisBackend.setPersistedVersion(projectId, 1)
+
+      // Check that the project is loaded
+      let state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(1)
+      expect(state.persistedVersion).to.equal(1)
+
+      // Expire the project
+      await redisBackend.expireProject(projectId)
+      state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.be.null
+    })
+
+    it('should not expire a non-persisted project', async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      await queueChanges(projectId, [change])
+
+      // Check that the project is loaded
+      let state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(1)
+      expect(state.persistedVersion).to.equal(null)
+
+      // Expire the project
+      await redisBackend.expireProject(projectId)
+      state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(1)
+    })
+
+    it('should not expire a partially persisted project', async function () {
+      // Load a fake project in Redis
+      const change1 = makeChange()
+      const change2 = makeChange()
+      await queueChanges(projectId, [change1, change2])
+
+      // Persist the first change
+      await redisBackend.setPersistedVersion(projectId, 1)
+
+      // Check that the project is loaded
+      let state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(2)
+      expect(state.persistedVersion).to.equal(1)
+
+      // Expire the project
+      await redisBackend.expireProject(projectId)
+      state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(2)
+    })
+
+    it('should handle a project that is not loaded', async function () {
+      // Check that the project is not loaded
+      let state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.be.null
+
+      // Expire the project
+      await redisBackend.expireProject(projectId)
+      state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.be.null
+    })
+  })
+
+  describe('claimExpireJob', function () {
+    it("should claim the expire job when it's ready", async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      const now = Date.now()
+      const expireTime = now - 1000
+      await queueChanges(projectId, [change], { expireTime })
+
+      // Check that the expire time has been set correctly
+      let state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.equal(expireTime)
+
+      // Claim the job
+      await redisBackend.claimExpireJob(projectId)
+
+      // Check the job expires in the future
+      state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.satisfy(time => time > now)
+    })
+
+    it('should throw an error when the job is not ready', async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      const now = Date.now()
+      const expireTime = now + 100_000
+      await queueChanges(projectId, [change], { expireTime })
+
+      // Claim the job
+      await expect(redisBackend.claimExpireJob(projectId)).to.be.rejectedWith(
+        JobNotReadyError
+      )
+    })
+
+    it('should throw an error when the job is not found', async function () {
+      // Claim a job on a project that is not loaded
+      await expect(redisBackend.claimExpireJob(projectId)).to.be.rejectedWith(
+        JobNotFoundError
+      )
+    })
+  })
+
+  describe('claimPersistJob', function () {
+    it("should claim the persist job when it's ready", async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      const now = Date.now()
+      const persistTime = now - 1000
+      await queueChanges(projectId, [change], { persistTime })
+
+      // Check that the persist time has been set correctly
+      let state = await redisBackend.getState(projectId)
+      expect(state.persistTime).to.equal(persistTime)
+
+      // Claim the job
+      await redisBackend.claimPersistJob(projectId)
+
+      // Check the job is not ready
+      state = await redisBackend.getState(projectId)
+      expect(state.persistTime).to.satisfy(time => time > now)
+    })
+
+    it('should throw an error when the job is not ready', async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      const now = Date.now()
+      const persistTime = now + 100_000
+      await queueChanges(projectId, [change], { persistTime })
+
+      // Claim the job
+      await expect(redisBackend.claimPersistJob(projectId)).to.be.rejectedWith(
+        JobNotReadyError
+      )
+    })
+
+    it('should throw an error when the job is not found', async function () {
+      // Claim a job on a project that is not loaded
+      await expect(redisBackend.claimExpireJob(projectId)).to.be.rejectedWith(
+        JobNotFoundError
+      )
+    })
+  })
+
+  describe('closing a job', function () {
+    let job
+
+    beforeEach(async function () {
+      // Load a project in Redis
+      const change = makeChange()
+      const now = Date.now()
+      const expireTime = now - 1000
+      await queueChanges(projectId, [change], { expireTime })
+
+      // Check that the expire time has been set correctly
+      const state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.equal(expireTime)
+
+      // Claim the job
+      job = await redisBackend.claimExpireJob(projectId)
+    })
+
+    it("should delete the key if it hasn't changed", async function () {
+      await job.close()
+      const state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.be.null
+    })
+
+    it('should keep the key if it has changed', async function () {
+      const newTimestamp = job.claimTimestamp + 1000
+      await redisBackend.setExpireTime(projectId, newTimestamp)
+      await job.close()
+      const state = await redisBackend.getState(projectId)
+      expect(state.expireTime).to.equal(newTimestamp)
+    })
+  })
+
+  describe('hardDeleteProject', function () {
+    it('should delete all keys associated with the project', async function () {
+      // Setup project state
+      await setupState(projectId, {
+        headVersion: 5,
+        headSnapshot: new Snapshot(),
+        persistedVersion: 3,
+        persistTime: Date.now(),
+        expireTime: Date.now() + 3600 * 1000, // 1 hour from now
+        changes: 5,
+      })
+
+      // Verify that state exists before deletion
+      let state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.equal(5)
+
+      // Call hardDeleteProject
+      const result = await redisBackend.hardDeleteProject(projectId)
+      expect(result).to.equal('ok')
+
+      // Verify that all keys are deleted
+      state = await redisBackend.getState(projectId)
+      expect(state.headVersion).to.be.null
+      expect(state.headSnapshot).to.be.null
+      expect(state.persistedVersion).to.be.null
+      expect(state.persistTime).to.be.null
+      expect(state.expireTime).to.be.null
+      expect(state.changes).to.be.an('array').that.is.empty
+    })
+
+    it('should not throw an error if the project does not exist', async function () {
+      // Call hardDeleteProject on a non-existent project
+      const result = await redisBackend.hardDeleteProject(projectId)
+      expect(result).to.equal('ok')
+    })
+  })
+})
+
+async function queueChanges(projectId, changes, opts = {}) {
+  const baseVersion = 0
+  const headSnapshot = new Snapshot()
+
+  await redisBackend.queueChanges(
+    projectId,
+    headSnapshot,
+    baseVersion,
+    changes,
+    {
+      persistTime: opts.persistTime,
+      expireTime: opts.expireTime,
+    }
+  )
+}
+
+function makeChange() {
+  const timestamp = new Date()
+  return new Change([], timestamp)
+}
+
+/**
+ * Setup Redis buffer state for tests
+ *
+ * @param {string} projectId
+ * @param {object} params
+ * @param {number} params.headVersion
+ * @param {Snapshot} [params.headSnapshot]
+ * @param {number | null} params.persistedVersion
+ * @param {number | null} params.persistTime - time when the project should be persisted
+ * @param {number | null} params.expireTime - time when the project should expire
+ * @param {number} params.changes - number of changes to create
+ * @return {Promise<Change[]>} dummy changes that have been created
+ */
+async function setupState(projectId, params) {
+  await rclient.set(keySchema.headVersion({ projectId }), params.headVersion)
+  if (params.headSnapshot) {
+    await rclient.set(
+      keySchema.head({ projectId }),
+      JSON.stringify(params.headSnapshot.toRaw())
+    )
+  }
+  if (params.persistedVersion) {
+    await rclient.set(
+      keySchema.persistedVersion({ projectId }),
+      params.persistedVersion
+    )
+  }
+  if (params.persistTime) {
+    await rclient.set(keySchema.persistTime({ projectId }), params.persistTime)
+  }
+  if (params.expireTime) {
+    await rclient.set(keySchema.expireTime({ projectId }), params.expireTime)
+  }
+  const changes = []
+  for (let i = 1; i <= params.changes; i++) {
+    const change = new Change(
+      [new AddFileOperation(`file${i}.tex`, File.createHollow(i, i))],
+      new Date()
+    )
+    changes.push(change)
+  }
+  await rclient.rpush(
+    keySchema.changes({ projectId }),
+    changes.map(change => JSON.stringify(change.toRaw()))
+  )
+  return changes
+}
diff --git a/services/history-v1/test/acceptance/js/storage/expire_redis_chunks.test.js b/services/history-v1/test/acceptance/js/storage/expire_redis_chunks.test.js
new file mode 100644
index 0000000000..f8a5943c43
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/expire_redis_chunks.test.js
@@ -0,0 +1,131 @@
+'use strict'
+
+const { expect } = require('chai')
+const { Author, Change } = require('overleaf-editor-core')
+const cleanup = require('./support/cleanup')
+const { setupProjectState, rclient, keySchema } = require('./support/redis')
+const { runScript } = require('./support/runscript')
+
+const SCRIPT_PATH = 'storage/scripts/expire_redis_chunks.js'
+
+function makeChange() {
+  const timestamp = new Date()
+  const author = new Author(123, 'test@example.com', 'Test User')
+  return new Change([], timestamp, [author])
+}
+
+describe('expire_redis_chunks script', function () {
+  beforeEach(cleanup.everything)
+
+  let now, past, future
+
+  // Setup all projects and run the script once before tests
+  beforeEach(async function () {
+    now = Date.now()
+    past = now - 10000 // 10 seconds ago
+    future = now + 60000 // 1 minute in the future
+
+    // Setup all project states explicitly
+    await setupProjectState('expired_persisted', {
+      headVersion: 2,
+      persistedVersion: 2,
+      expireTime: past,
+    })
+    await setupProjectState('expired_initial_state', {
+      headVersion: 0,
+      persistedVersion: 0,
+      expireTime: past,
+    })
+    await setupProjectState('expired_persisted_with_job', {
+      headVersion: 2,
+      persistedVersion: 2,
+      expireTime: past,
+      persistTime: future,
+    })
+    await setupProjectState('expired_not_persisted', {
+      headVersion: 3,
+      persistedVersion: 2,
+      expireTime: past,
+      changes: [makeChange()],
+    })
+    await setupProjectState('expired_no_persisted_version', {
+      headVersion: 1,
+      persistedVersion: null,
+      expireTime: past,
+      changes: [makeChange()],
+    })
+    await setupProjectState('future_expired_persisted', {
+      headVersion: 2,
+      persistedVersion: 2,
+      expireTime: future,
+    })
+    await setupProjectState('future_expired_not_persisted', {
+      headVersion: 3,
+      persistedVersion: 2,
+      expireTime: future,
+      changes: [makeChange()],
+    })
+    await setupProjectState('no_expire_time', {
+      headVersion: 1,
+      persistedVersion: 1,
+      expireTime: null,
+    })
+
+    // Run the expire script once after all projects are set up
+    await runScript(SCRIPT_PATH)
+  })
+
+  async function checkProjectStatus(projectId) {
+    const exists =
+      (await rclient.exists(keySchema.headVersion({ projectId }))) === 1
+    return exists ? 'exists' : 'deleted'
+  }
+
+  it('should expire a project when expireTime is past and it is fully persisted', async function () {
+    const projectId = 'expired_persisted'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('deleted')
+  })
+
+  it('should expire a project when expireTime is past and it has no changes (initial state)', async function () {
+    const projectId = 'expired_initial_state'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('deleted')
+  })
+
+  it('should expire a project when expireTime is past and it is fully persisted even if persistTime is set', async function () {
+    const projectId = 'expired_persisted_with_job'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('deleted')
+  })
+
+  it('should not expire a project when expireTime is past but it is not fully persisted', async function () {
+    const projectId = 'expired_not_persisted'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('exists')
+  })
+
+  it('should not expire a project when expireTime is past but persistedVersion is not set', async function () {
+    const projectId = 'expired_no_persisted_version'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('exists')
+  })
+
+  it('should not expire a project when expireTime is in the future (even if fully persisted)', async function () {
+    const projectId = 'future_expired_persisted'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('exists')
+  })
+
+  it('should not expire a project when expireTime is in the future (if not fully persisted)', async function () {
+    const projectId = 'future_expired_not_persisted'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('exists')
+  })
+
+  it('should not expire a project when expireTime is not set', async function () {
+    const projectId = 'no_expire_time'
+    const status = await checkProjectStatus(projectId)
+    expect(status).to.equal('exists')
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/storage/fixtures/chunks.js b/services/history-v1/test/acceptance/js/storage/fixtures/chunks.js
index 8f67c17d71..0fb50e49e9 100644
--- a/services/history-v1/test/acceptance/js/storage/fixtures/chunks.js
+++ b/services/history-v1/test/acceptance/js/storage/fixtures/chunks.js
@@ -15,7 +15,7 @@ exports.chunks = {
 exports.histories = {
   chunkOne: {
     projectId: DocFixtures.initializedProject.id,
-    chunkId: 1000000,
+    chunkId: '1000000',
     json: { snapshot: { files: {} }, changes: [] },
   },
 }
diff --git a/services/history-v1/test/acceptance/js/storage/persist_buffer.test.mjs b/services/history-v1/test/acceptance/js/storage/persist_buffer.test.mjs
new file mode 100644
index 0000000000..64eb4efcb1
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/persist_buffer.test.mjs
@@ -0,0 +1,590 @@
+'use strict'
+
+import fs from 'node:fs'
+import { expect } from 'chai'
+import {
+  Change,
+  Snapshot,
+  File,
+  TextOperation,
+  AddFileOperation,
+  EditFileOperation, // Added EditFileOperation
+} from 'overleaf-editor-core'
+import persistBuffer from '../../../../storage/lib/persist_buffer.js'
+import chunkStore from '../../../../storage/lib/chunk_store/index.js'
+import { BlobStore } from '../../../../storage/lib/blob_store/index.js'
+import redisBackend from '../../../../storage/lib/chunk_store/redis.js'
+import persistChanges from '../../../../storage/lib/persist_changes.js'
+import cleanup from './support/cleanup.js'
+import fixtures from './support/fixtures.js'
+import testFiles from './support/test_files.js'
+
+describe('persistBuffer', function () {
+  let projectId
+  const initialVersion = 0
+  let limitsToPersistImmediately
+  let blobStore
+
+  before(function () {
+    const farFuture = new Date()
+    farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+    limitsToPersistImmediately = {
+      minChangeTimestamp: farFuture,
+      maxChangeTimestamp: farFuture,
+      maxChunkChanges: 10,
+    }
+  })
+
+  beforeEach(cleanup.everything)
+  beforeEach(fixtures.create)
+
+  beforeEach(async function () {
+    projectId = fixtures.docs.uninitializedProject.id
+    await chunkStore.initializeProject(projectId)
+    blobStore = new BlobStore(projectId)
+  })
+
+  describe('with an empty initial chunk (new project)', function () {
+    it('should persist changes from Redis to a new chunk', async function () {
+      // create an initial snapshot and add the empty file `main.tex`
+      const HELLO_TXT = fs.readFileSync(testFiles.path('hello.txt')).toString()
+
+      const createFile = new Change(
+        [new AddFileOperation('main.tex', File.fromString(HELLO_TXT))],
+        new Date(),
+        []
+      )
+
+      await persistChanges(
+        projectId,
+        [createFile],
+        limitsToPersistImmediately,
+        0
+      )
+      // Now queue some changes in Redis
+      const op1 = new TextOperation().insert('Hello').retain(HELLO_TXT.length)
+      const change1 = new Change(
+        [new EditFileOperation('main.tex', op1)],
+        new Date()
+      )
+
+      const op2 = new TextOperation()
+        .retain('Hello'.length)
+        .insert(' World')
+        .retain(HELLO_TXT.length)
+      const change2 = new Change(
+        [new EditFileOperation('main.tex', op2)],
+        new Date()
+      )
+
+      const changesToQueue = [change1, change2]
+
+      const finalHeadVersion = initialVersion + 1 + changesToQueue.length
+
+      const now = Date.now()
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(), // dummy snapshot
+        1,
+        changesToQueue,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+      await redisBackend.setPersistedVersion(projectId, initialVersion)
+
+      // Persist the changes from Redis to the chunk store
+      const persistResult = await persistBuffer(
+        projectId,
+        limitsToPersistImmediately
+      )
+
+      // Check the return value of persistBuffer
+      expect(persistResult).to.exist
+      expect(persistResult).to.have.property('numberOfChangesPersisted')
+      expect(persistResult).to.have.property('originalEndVersion')
+      expect(persistResult).to.have.property('currentChunk')
+      expect(persistResult).to.have.property('resyncNeeded')
+      expect(persistResult.numberOfChangesPersisted).to.equal(
+        changesToQueue.length
+      )
+      expect(persistResult.originalEndVersion).to.equal(initialVersion + 1)
+      expect(persistResult.resyncNeeded).to.be.false
+
+      const latestChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(latestChunk).to.exist
+      expect(latestChunk.getStartVersion()).to.equal(initialVersion)
+      expect(latestChunk.getEndVersion()).to.equal(finalHeadVersion)
+      expect(latestChunk.getChanges().length).to.equal(
+        changesToQueue.length + 1
+      )
+      // Check that chunk returned by persistBuffer matches the latest chunk
+      expect(latestChunk).to.deep.equal(persistResult.currentChunk)
+
+      const chunkSnapshot = latestChunk.getSnapshot()
+      expect(Object.keys(chunkSnapshot.getFileMap()).length).to.equal(1)
+
+      const persistedVersionInRedis = (await redisBackend.getState(projectId))
+        .persistedVersion
+      expect(persistedVersionInRedis).to.equal(finalHeadVersion)
+
+      const nonPersisted = await redisBackend.getNonPersistedChanges(
+        projectId,
+        finalHeadVersion
+      )
+      expect(nonPersisted).to.be.an('array').that.is.empty
+    })
+  })
+
+  describe('with an existing chunk and new changes in Redis', function () {
+    it('should persist new changes from Redis, appending to existing history', async function () {
+      const initialContent = 'Initial document content.\n'
+
+      const addInitialFileChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(),
+        []
+      )
+
+      await persistChanges(
+        projectId,
+        [addInitialFileChange],
+        limitsToPersistImmediately,
+        initialVersion
+      )
+      const versionAfterInitialSetup = initialVersion + 1 // Now version is 1
+
+      const opForChunk1 = new TextOperation()
+        .retain(initialContent.length)
+        .insert(' First addition.')
+      const changesForChunk1 = [
+        new Change(
+          [new EditFileOperation('main.tex', opForChunk1)],
+          new Date(),
+          []
+        ),
+      ]
+
+      await persistChanges(
+        projectId,
+        changesForChunk1,
+        limitsToPersistImmediately, // Original limits for this step
+        versionAfterInitialSetup // Correct clientEndVersion
+      )
+      // Update persistedChunkEndVersion: 1 (from setup) + 1 (from changesForChunk1) = 2
+      const persistedChunkEndVersion =
+        versionAfterInitialSetup + changesForChunk1.length
+      const contentAfterChunk1 = initialContent + ' First addition.'
+
+      const opVersion2 = new TextOperation()
+        .retain(contentAfterChunk1.length)
+        .insert(' Second addition.')
+      const changeVersion2 = new Change(
+        [new EditFileOperation('main.tex', opVersion2)],
+        new Date(),
+        []
+      )
+
+      const contentAfterChange2 = contentAfterChunk1 + ' Second addition.'
+      const opVersion3 = new TextOperation()
+        .retain(contentAfterChange2.length)
+        .insert(' Third addition.')
+      const changeVersion3 = new Change(
+        [new EditFileOperation('main.tex', opVersion3)],
+        new Date(),
+        []
+      )
+
+      const redisChangesToPush = [changeVersion2, changeVersion3]
+      const finalHeadVersionAfterRedisPush =
+        persistedChunkEndVersion + redisChangesToPush.length
+      const now = Date.now()
+
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(), // Use new Snapshot() like in the first test
+        persistedChunkEndVersion,
+        redisChangesToPush,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+      await redisBackend.setPersistedVersion(
+        projectId,
+        persistedChunkEndVersion
+      )
+
+      const persistResult = await persistBuffer(
+        projectId,
+        limitsToPersistImmediately
+      )
+
+      // Check the return value of persistBuffer
+      expect(persistResult).to.exist
+      expect(persistResult).to.have.property('numberOfChangesPersisted')
+      expect(persistResult).to.have.property('originalEndVersion')
+      expect(persistResult).to.have.property('currentChunk')
+      expect(persistResult).to.have.property('resyncNeeded')
+      expect(persistResult.numberOfChangesPersisted).to.equal(
+        redisChangesToPush.length
+      )
+      expect(persistResult.originalEndVersion).to.equal(
+        persistedChunkEndVersion
+      )
+      expect(persistResult.resyncNeeded).to.be.false
+
+      const latestChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(latestChunk).to.exist
+      expect(latestChunk.getStartVersion()).to.equal(0)
+      expect(latestChunk.getEndVersion()).to.equal(
+        finalHeadVersionAfterRedisPush
+      )
+      expect(latestChunk.getChanges().length).to.equal(
+        persistedChunkEndVersion + redisChangesToPush.length
+      )
+
+      const persistedVersionInRedisAfter = (
+        await redisBackend.getState(projectId)
+      ).persistedVersion
+      expect(persistedVersionInRedisAfter).to.equal(
+        finalHeadVersionAfterRedisPush
+      )
+
+      // Check that chunk returned by persistBuffer matches the latest chunk
+      expect(persistResult.currentChunk).to.deep.equal(latestChunk)
+
+      const nonPersisted = await redisBackend.getNonPersistedChanges(
+        projectId,
+        finalHeadVersionAfterRedisPush
+      )
+      expect(nonPersisted).to.be.an('array').that.is.empty
+    })
+  })
+
+  describe('when Redis has no new changes', function () {
+    let persistedChunkEndVersion
+    let changesForChunk1
+
+    beforeEach(async function () {
+      const initialContent = 'Content.'
+
+      const addInitialFileChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(),
+        []
+      )
+
+      // Replace chunkStore.create with persistChanges
+      // clientEndVersion is initialVersion (0). This advances version to 1.
+      await persistChanges(
+        projectId,
+        [addInitialFileChange],
+        limitsToPersistImmediately,
+        initialVersion
+      )
+      const versionAfterInitialSetup = initialVersion + 1 // Now version is 1
+
+      const opForChunk1 = new TextOperation()
+        .retain(initialContent.length)
+        .insert(' More.')
+      changesForChunk1 = [
+        new Change(
+          [new EditFileOperation('main.tex', opForChunk1)],
+          new Date(),
+          []
+        ),
+      ]
+      // Corrected persistChanges call: clientEndVersion is versionAfterInitialSetup (1)
+      await persistChanges(
+        projectId,
+        changesForChunk1,
+        limitsToPersistImmediately, // Original limits for this step
+        versionAfterInitialSetup // Correct clientEndVersion
+      )
+      // Update persistedChunkEndVersion: 1 (from setup) + 1 (from changesForChunk1) = 2
+      persistedChunkEndVersion =
+        versionAfterInitialSetup + changesForChunk1.length
+    })
+
+    it('should leave the persisted version and stored chunks unchanged', async function () {
+      const now = Date.now()
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(),
+        persistedChunkEndVersion - 1,
+        changesForChunk1,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+      await redisBackend.setPersistedVersion(
+        projectId,
+        persistedChunkEndVersion
+      )
+
+      const chunksBefore = await chunkStore.getProjectChunks(projectId)
+
+      const persistResult = await persistBuffer(
+        projectId,
+        limitsToPersistImmediately
+      )
+
+      const currentChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(persistResult).to.deep.equal({
+        numberOfChangesPersisted: 0,
+        originalEndVersion: persistedChunkEndVersion,
+        currentChunk,
+        resyncNeeded: false,
+      })
+
+      const chunksAfter = await chunkStore.getProjectChunks(projectId)
+      expect(chunksAfter.length).to.equal(chunksBefore.length)
+      expect(chunksAfter).to.deep.equal(chunksBefore)
+
+      const finalPersistedVersionInRedis = (
+        await redisBackend.getState(projectId)
+      ).persistedVersion
+      expect(finalPersistedVersionInRedis).to.equal(persistedChunkEndVersion)
+    })
+
+    it('should update the persisted version if it is behind the chunk store end version', async function () {
+      const now = Date.now()
+
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(),
+        persistedChunkEndVersion - 1,
+        changesForChunk1,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+      // Force the persisted version in Redis to lag behind the chunk store,
+      // simulating the situation where a worker has persisted changes to the
+      // chunk store but failed to update the version in redis.
+      await redisBackend.setPersistedVersion(
+        projectId,
+        persistedChunkEndVersion - 1
+      )
+
+      const chunksBefore = await chunkStore.getProjectChunks(projectId)
+
+      // Persist buffer (which should do nothing as there are no new changes)
+      const persistResult = await persistBuffer(
+        projectId,
+        limitsToPersistImmediately
+      )
+
+      // Check the return value
+      const currentChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(persistResult).to.deep.equal({
+        numberOfChangesPersisted: 0,
+        originalEndVersion: persistedChunkEndVersion,
+        currentChunk,
+        resyncNeeded: false,
+      })
+
+      const chunksAfter = await chunkStore.getProjectChunks(projectId)
+      expect(chunksAfter.length).to.equal(chunksBefore.length)
+      expect(chunksAfter).to.deep.equal(chunksBefore)
+
+      const finalPersistedVersionInRedis = (
+        await redisBackend.getState(projectId)
+      ).persistedVersion
+      expect(finalPersistedVersionInRedis).to.equal(persistedChunkEndVersion)
+    })
+  })
+
+  describe('when limits restrict the number of changes to persist', function () {
+    it('should persist only a subset of changes and update persistedVersion accordingly', async function () {
+      const now = Date.now()
+      const oneDayAgo = now - 1000 * 60 * 60 * 24
+      const oneHourAgo = now - 1000 * 60 * 60
+      const twoHoursAgo = now - 1000 * 60 * 60 * 2
+      const threeHoursAgo = now - 1000 * 60 * 60 * 3
+
+      // Create an initial file with some content
+      const initialContent = 'Initial content.'
+      const addInitialFileChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(oneDayAgo),
+        []
+      )
+
+      await persistChanges(
+        projectId,
+        [addInitialFileChange],
+        limitsToPersistImmediately,
+        initialVersion
+      )
+      const versionAfterInitialSetup = initialVersion + 1 // Version is 1
+
+      // Queue three additional changes in Redis
+      const op1 = new TextOperation()
+        .retain(initialContent.length)
+        .insert(' Change 1.')
+      const change1 = new Change(
+        [new EditFileOperation('main.tex', op1)],
+        new Date(threeHoursAgo)
+      )
+      const contentAfterC1 = initialContent + ' Change 1.'
+
+      const op2 = new TextOperation()
+        .retain(contentAfterC1.length)
+        .insert(' Change 2.')
+      const change2 = new Change(
+        [new EditFileOperation('main.tex', op2)],
+        new Date(twoHoursAgo)
+      )
+      const contentAfterC2 = contentAfterC1 + ' Change 2.'
+
+      const op3 = new TextOperation()
+        .retain(contentAfterC2.length)
+        .insert(' Change 3.')
+      const change3 = new Change(
+        [new EditFileOperation('main.tex', op3)],
+        new Date(oneHourAgo)
+      )
+
+      const changesToQueue = [change1, change2, change3]
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(), // dummy snapshot
+        versionAfterInitialSetup, // startVersion for queued changes
+        changesToQueue,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+      await redisBackend.setPersistedVersion(
+        projectId,
+        versionAfterInitialSetup
+      )
+
+      // Define limits to only persist 2 additional changes (on top of the initial file creation),
+      // which should leave the final change (change3) in the redis buffer.
+      const restrictiveLimits = {
+        minChangeTimestamp: new Date(oneHourAgo), // only changes more than 1 hour old are considered
+        maxChangeTimestamp: new Date(twoHoursAgo), // they will be persisted if any change is older than 2 hours
+      }
+
+      const persistResult = await persistBuffer(projectId, restrictiveLimits)
+
+      // Check the return value of persistBuffer
+      expect(persistResult).to.exist
+      expect(persistResult).to.have.property('numberOfChangesPersisted')
+      expect(persistResult).to.have.property('originalEndVersion')
+      expect(persistResult).to.have.property('currentChunk')
+      expect(persistResult).to.have.property('resyncNeeded')
+      expect(persistResult.numberOfChangesPersisted).to.equal(2) // change1 + change2
+      expect(persistResult.originalEndVersion).to.equal(
+        versionAfterInitialSetup
+      )
+      expect(persistResult.resyncNeeded).to.be.false
+
+      // Check the latest persisted chunk, it should only have the initial file and the first two changes
+      const latestChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(latestChunk).to.exist
+      expect(latestChunk.getChanges().length).to.equal(3) // addInitialFileChange + change1 + change2
+      expect(latestChunk.getStartVersion()).to.equal(initialVersion)
+      const expectedEndVersion = versionAfterInitialSetup + 2 // Persisted two changes from the queue
+      expect(latestChunk.getEndVersion()).to.equal(expectedEndVersion)
+
+      // Check that chunk returned by persistBuffer matches the latest chunk
+      expect(persistResult.currentChunk).to.deep.equal(latestChunk)
+
+      // Check persisted version in Redis
+      const state = await redisBackend.getState(projectId)
+      expect(state.persistedVersion).to.equal(expectedEndVersion)
+
+      // Check non-persisted changes in Redis
+      const nonPersisted = await redisBackend.getNonPersistedChanges(
+        projectId,
+        expectedEndVersion
+      )
+      expect(nonPersisted).to.be.an('array').with.lengthOf(1) // change3 should remain
+      expect(nonPersisted).to.deep.equal([change3])
+    })
+  })
+
+  describe('with lots of changes to persist', function () {
+    it('should persist all changes', async function () {
+      const changes = []
+      // Create an initial file with some content
+      const blob = await blobStore.putString('')
+      changes.push(
+        new Change(
+          [new AddFileOperation('main.tex', File.createLazyFromBlobs(blob))],
+          new Date(),
+          []
+        )
+      )
+
+      for (let i = 0; i < 500; i++) {
+        const op = new TextOperation().retain(i).insert('x')
+        changes.push(
+          new Change([new EditFileOperation('main.tex', op)], new Date())
+        )
+      }
+
+      const now = Date.now()
+      await redisBackend.queueChanges(
+        projectId,
+        new Snapshot(), // dummy snapshot
+        0, // startVersion for queued changes
+        changes,
+        {
+          persistTime: now + redisBackend.MAX_PERSIST_DELAY_MS,
+          expireTime: now + redisBackend.PROJECT_TTL_MS,
+        }
+      )
+
+      const expectedEndVersion = 501
+      const persistResult = await persistBuffer(
+        projectId,
+        limitsToPersistImmediately
+      )
+      expect(persistResult.numberOfChangesPersisted).to.equal(
+        expectedEndVersion
+      )
+      expect(persistResult.originalEndVersion).to.equal(0)
+      expect(persistResult.resyncNeeded).to.be.false
+
+      // Check the latest persisted chunk
+      const latestChunk = await chunkStore.loadLatest(projectId, {
+        persistedOnly: true,
+      })
+      expect(latestChunk).to.exist
+      expect(latestChunk.getEndVersion()).to.equal(expectedEndVersion)
+
+      // Check that chunk returned by persistBuffer matches the latest chunk
+      expect(persistResult.currentChunk).to.deep.equal(latestChunk)
+
+      // Check persisted version in Redis
+      const state = await redisBackend.getState(projectId)
+      expect(state.persistedVersion).to.equal(expectedEndVersion)
+
+      // Check non-persisted changes in Redis
+      const nonPersisted = await redisBackend.getNonPersistedChanges(
+        projectId,
+        expectedEndVersion
+      )
+      expect(nonPersisted).to.deep.equal([])
+    })
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/storage/persist_changes.test.js b/services/history-v1/test/acceptance/js/storage/persist_changes.test.js
index aa56dc8c2a..4c491db4a3 100644
--- a/services/history-v1/test/acceptance/js/storage/persist_changes.test.js
+++ b/services/history-v1/test/acceptance/js/storage/persist_changes.test.js
@@ -58,6 +58,7 @@ describe('persistChanges', function () {
       numberOfChangesPersisted: 1,
       originalEndVersion: 0,
       currentChunk,
+      resyncNeeded: false,
     })
 
     const chunk = await chunkStore.loadLatest(projectId)
@@ -66,7 +67,7 @@ describe('persistChanges', function () {
     expect(chunk.getChanges().length).to.equal(1)
   })
 
-  it('persists changes in two chunks', async function () {
+  it('persists changes in three chunks', async function () {
     const limitsToPersistImmediately = {
       maxChunkChanges: 1,
       minChangeTimestamp: farFuture,
@@ -83,7 +84,12 @@ describe('persistChanges', function () {
       new Date(),
       []
     )
-    const changes = [firstChange, secondChange]
+    const thirdChange = new Change(
+      [new AddFileOperation('c.tex', File.fromString(''))],
+      new Date(),
+      []
+    )
+    const changes = [firstChange, secondChange, thirdChange]
 
     await chunkStore.initializeProject(projectId)
     const result = await persistChanges(
@@ -98,19 +104,23 @@ describe('persistChanges', function () {
         'a.tex': {
           content: '',
         },
+        'b.tex': {
+          content: '',
+        },
       },
     })
-    const history = new History(snapshot, [secondChange])
-    const currentChunk = new Chunk(history, 1)
+    const history = new History(snapshot, [thirdChange])
+    const currentChunk = new Chunk(history, 2)
     expect(result).to.deep.equal({
-      numberOfChangesPersisted: 2,
+      numberOfChangesPersisted: 3,
       originalEndVersion: 0,
       currentChunk,
+      resyncNeeded: false,
     })
 
     const chunk = await chunkStore.loadLatest(projectId)
-    expect(chunk.getStartVersion()).to.equal(1)
-    expect(chunk.getEndVersion()).to.equal(2)
+    expect(chunk.getStartVersion()).to.equal(2)
+    expect(chunk.getEndVersion()).to.equal(3)
     expect(chunk.getChanges().length).to.equal(1)
   })
 
@@ -147,6 +157,7 @@ describe('persistChanges', function () {
       numberOfChangesPersisted: 2,
       originalEndVersion: 0,
       currentChunk,
+      resyncNeeded: false,
     })
 
     const chunk = await chunkStore.loadLatest(projectId)
@@ -213,7 +224,7 @@ describe('persistChanges', function () {
       expect(result.numberOfChangesPersisted).to.equal(1)
     })
 
-    it('rejects a change with an invalid hash', async function () {
+    it('turns on the resyncNeeded flag if content hash validation fails', async function () {
       const limitsToPersistImmediately = {
         minChangeTimestamp: farFuture,
         maxChangeTimestamp: farFuture,
@@ -235,9 +246,13 @@ describe('persistChanges', function () {
       )
       const changes = [change]
 
-      await expect(
-        persistChanges(projectId, changes, limitsToPersistImmediately, 0)
-      ).to.be.rejectedWith(storage.InvalidChangeError)
+      const result = await persistChanges(
+        projectId,
+        changes,
+        limitsToPersistImmediately,
+        0
+      )
+      expect(result.resyncNeeded).to.be.true
     })
   })
 })
diff --git a/services/history-v1/test/acceptance/js/storage/persist_redis_chunks.test.js b/services/history-v1/test/acceptance/js/storage/persist_redis_chunks.test.js
new file mode 100644
index 0000000000..58261703bb
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/persist_redis_chunks.test.js
@@ -0,0 +1,262 @@
+'use strict'
+
+const { expect } = require('chai')
+const {
+  Change,
+  AddFileOperation,
+  EditFileOperation,
+  TextOperation,
+  File,
+} = require('overleaf-editor-core')
+const cleanup = require('./support/cleanup')
+const fixtures = require('./support/fixtures')
+const chunkStore = require('../../../../storage/lib/chunk_store')
+const { getState } = require('../../../../storage/lib/chunk_store/redis')
+const { setupProjectState } = require('./support/redis')
+const { runScript } = require('./support/runscript')
+const persistChanges = require('../../../../storage/lib/persist_changes')
+
+const SCRIPT_PATH = 'storage/scripts/persist_redis_chunks.mjs'
+
+describe('persist_redis_chunks script', function () {
+  before(cleanup.everything)
+
+  let now, past, future
+  let projectIdsStore // To store the generated project IDs, keyed by scenario name
+  let limitsToPersistImmediately
+
+  before(async function () {
+    const farFuture = new Date()
+    farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+    limitsToPersistImmediately = {
+      minChangeTimestamp: farFuture,
+      maxChangeTimestamp: farFuture,
+      maxChunkChanges: 100, // Allow enough changes for setup
+    }
+
+    await fixtures.create()
+
+    now = Date.now()
+    past = now - 10000 // 10 seconds ago
+    future = now + 60000 // 1 minute in the future
+
+    projectIdsStore = {}
+
+    // Scenario 1: project_due_for_persistence
+    // Goal: Has initial persisted content (v1), Redis has new changes (v1->v2) due for persistence.
+    // Expected: Script persists Redis changes, persistedVersion becomes 2.
+    {
+      const dueProjectId = await chunkStore.initializeProject()
+      projectIdsStore.project_due_for_persistence = dueProjectId
+      const initialContent = 'Initial content for due project.'
+      const initialChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(now - 30000), // 30 seconds ago
+        []
+      )
+      await persistChanges(
+        dueProjectId,
+        [initialChange],
+        limitsToPersistImmediately,
+        0
+      )
+      const secondChangeDue = new Change(
+        [
+          new EditFileOperation(
+            'main.tex',
+            new TextOperation()
+              .retain(initialContent.length)
+              .insert(' More content.')
+          ),
+        ],
+        new Date(now - 20000), // 20 seconds ago
+        []
+      )
+      await setupProjectState(dueProjectId, {
+        persistTime: past,
+        headVersion: 2, // After secondChangeDue
+        persistedVersion: 1, // Initial content is at v1
+        changes: [secondChangeDue], // New changes in Redis (v1->v2)
+        expireTimeFuture: true,
+      })
+    }
+
+    // Scenario 2: project_not_due_for_persistence
+    // Goal: Has initial persisted content (v1), Redis has no new changes, not due.
+    // Expected: Script does nothing, persistedVersion remains 1.
+    {
+      const notDueProjectId = await chunkStore.initializeProject()
+      projectIdsStore.project_not_due_for_persistence = notDueProjectId
+      const initialContent = 'Initial content for not_due project.'
+      const initialChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(now - 30000), // 30 seconds ago
+        []
+      )
+      await persistChanges(
+        notDueProjectId,
+        [initialChange],
+        limitsToPersistImmediately,
+        0
+      ) // Persisted: v0 -> v1
+      await setupProjectState(notDueProjectId, {
+        persistTime: future,
+        headVersion: 1, // Matches persisted version
+        persistedVersion: 1,
+        changes: [], // No new changes in Redis
+        expireTimeFuture: true,
+      })
+    }
+
+    // Scenario 3: project_no_persist_time
+    // Goal: Has initial persisted content (v1), Redis has no new changes, no persistTime.
+    // Expected: Script does nothing, persistedVersion remains 1.
+    {
+      const noPersistTimeProjectId = await chunkStore.initializeProject()
+      projectIdsStore.project_no_persist_time = noPersistTimeProjectId
+      const initialContent = 'Initial content for no_persist_time project.'
+      const initialChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(now - 30000), // 30 seconds ago
+        []
+      )
+      await persistChanges(
+        noPersistTimeProjectId,
+        [initialChange],
+        limitsToPersistImmediately,
+        0
+      ) // Persisted: v0 -> v1
+      await setupProjectState(noPersistTimeProjectId, {
+        persistTime: null,
+        headVersion: 1, // Matches persisted version
+        persistedVersion: 1,
+        changes: [], // No new changes in Redis
+        expireTimeFuture: true,
+      })
+    }
+
+    // Scenario 4: project_due_fully_persisted
+    // Goal: Has content persisted up to v2, Redis reflects this (head=2, persisted=2), due for check.
+    // Expected: Script clears persistTime, persistedVersion remains 2.
+    {
+      const dueFullyPersistedId = await chunkStore.initializeProject()
+      projectIdsStore.project_due_fully_persisted = dueFullyPersistedId
+      const initialContent = 'Content part 1 for fully persisted.'
+      const change1 = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(now - 40000), // 40 seconds ago
+        []
+      )
+      const change2 = new Change(
+        [
+          new EditFileOperation(
+            'main.tex',
+            new TextOperation()
+              .retain(initialContent.length)
+              .insert(' Content part 2.')
+          ),
+        ],
+        new Date(now - 30000), // 30 seconds ago
+        []
+      )
+      await persistChanges(
+        dueFullyPersistedId,
+        [change1, change2],
+        limitsToPersistImmediately,
+        0
+      )
+      await setupProjectState(dueFullyPersistedId, {
+        persistTime: past,
+        headVersion: 2,
+        persistedVersion: 2,
+        changes: [], // No new unpersisted changes in Redis
+        expireTimeFuture: true,
+      })
+    }
+
+    // Scenario 5: project_fails_to_persist
+    // Goal: Has initial persisted content (v1), Redis has new changes (v1->v2) due for persistence, but these changes will cause an error.
+    // Expected: Script attempts to persist, fails, and persistTime is NOT cleared.
+    {
+      const failsToPersistProjectId = await chunkStore.initializeProject()
+      projectIdsStore.project_fails_to_persist = failsToPersistProjectId
+      const initialContent = 'Initial content for failure case.'
+      const initialChange = new Change(
+        [new AddFileOperation('main.tex', File.fromString(initialContent))],
+        new Date(now - 30000), // 30 seconds ago
+        []
+      )
+      await persistChanges(
+        failsToPersistProjectId,
+        [initialChange],
+        limitsToPersistImmediately,
+        0
+      )
+      // This change will fail because it tries to insert at a non-existent offset
+      // assuming the initial content is shorter than 1000 characters.
+      const conflictingChange = new Change(
+        [
+          new EditFileOperation(
+            'main.tex',
+            new TextOperation().retain(1000).insert('This will fail.')
+          ),
+        ],
+        new Date(now - 20000), // 20 seconds ago
+        []
+      )
+      await setupProjectState(failsToPersistProjectId, {
+        persistTime: past, // Due for persistence
+        headVersion: 2, // After conflictingChange
+        persistedVersion: 1, // Initial content is at v1
+        changes: [conflictingChange], // New changes in Redis (v1->v2)
+        expireTimeFuture: true,
+      })
+    }
+
+    await runScript(SCRIPT_PATH)
+  })
+
+  describe('when the buffer has new changes', function () {
+    it('should update persisted-version when the persist-time is in the past', async function () {
+      const projectId = projectIdsStore.project_due_for_persistence
+      const state = await getState(projectId)
+      // console.log('State after running script (project_due_for_persistence):', state)
+      expect(state.persistTime).to.be.null
+      expect(state.persistedVersion).to.equal(2)
+    })
+
+    it('should not perform any operations when the persist-time is in the future', async function () {
+      const projectId = projectIdsStore.project_not_due_for_persistence
+      const state = await getState(projectId)
+      expect(state.persistTime).to.equal(future)
+      expect(state.persistedVersion).to.equal(1)
+    })
+  })
+
+  describe('when the changes in the buffer are already persisted', function () {
+    it('should delete persist-time for a project when the persist-time is in the past', async function () {
+      const projectId = projectIdsStore.project_due_fully_persisted
+      const state = await getState(projectId)
+      expect(state.persistTime).to.be.null
+      expect(state.persistedVersion).to.equal(2)
+    })
+  })
+
+  describe('when there is no persist-time set', function () {
+    it('should not change redis when there is no persist-time set initially', async function () {
+      const projectId = projectIdsStore.project_no_persist_time
+      const state = await getState(projectId)
+      expect(state.persistTime).to.be.null
+      expect(state.persistedVersion).to.equal(1)
+    })
+  })
+
+  describe('when persistence fails due to conflicting changes', function () {
+    it('should not clear persist-time and not update persisted-version', async function () {
+      const projectId = projectIdsStore.project_fails_to_persist
+      const state = await getState(projectId)
+      expect(state.persistTime).to.be.greaterThan(now) // persistTime should be pushed to the future by RETRY_DELAY_MS
+      expect(state.persistedVersion).to.equal(1) // persistedVersion should not change
+    })
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/storage/queue_changes.test.js b/services/history-v1/test/acceptance/js/storage/queue_changes.test.js
new file mode 100644
index 0000000000..dbfe8c7e56
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/queue_changes.test.js
@@ -0,0 +1,416 @@
+'use strict'
+
+const { expect } = require('chai')
+const sinon = require('sinon')
+
+const cleanup = require('./support/cleanup')
+const fixtures = require('./support/fixtures')
+const testFiles = require('./support/test_files.js')
+const storage = require('../../../../storage')
+const chunkStore = storage.chunkStore
+const queueChanges = storage.queueChanges
+const redisBackend = require('../../../../storage/lib/chunk_store/redis')
+
+const core = require('overleaf-editor-core')
+const AddFileOperation = core.AddFileOperation
+const EditFileOperation = core.EditFileOperation
+const TextOperation = core.TextOperation
+const Change = core.Change
+const Chunk = core.Chunk
+const File = core.File
+const Snapshot = core.Snapshot
+const BlobStore = storage.BlobStore
+const persistChanges = storage.persistChanges
+
+describe('queueChanges', function () {
+  let limitsToPersistImmediately
+  before(function () {
+    // Used to provide a limit which forces us to persist all of the changes
+    const farFuture = new Date()
+    farFuture.setTime(farFuture.getTime() + 7 * 24 * 3600 * 1000)
+    limitsToPersistImmediately = {
+      minChangeTimestamp: farFuture,
+      maxChangeTimestamp: farFuture,
+      maxChanges: 10,
+      maxChunkChanges: 10,
+    }
+  })
+
+  beforeEach(cleanup.everything)
+  beforeEach(fixtures.create)
+  afterEach(function () {
+    sinon.restore()
+  })
+
+  it('queues changes when redis has no snapshot (falls back to chunkStore with an empty chunk)', async function () {
+    // Start with an empty chunk store for the project
+    const projectId = fixtures.docs.uninitializedProject.id
+    await chunkStore.initializeProject(projectId)
+
+    // Ensure that the initial state in redis is empty
+    const initialRedisState = await redisBackend.getState(projectId)
+    expect(initialRedisState.headVersion).to.be.null
+    expect(initialRedisState.headSnapshot).to.be.null
+    expect(initialRedisState.changes).to.be.an('array').that.is.empty
+
+    // Add a test file to the blob store
+    const blobStore = new BlobStore(projectId)
+    await blobStore.putFile(testFiles.path('hello.txt'))
+
+    // Prepare an initial change to add a single file to an empty project
+    const change = new Change(
+      [
+        new AddFileOperation(
+          'test.tex',
+          File.fromHash(testFiles.HELLO_TXT_HASH)
+        ),
+      ],
+      new Date(),
+      []
+    )
+    const changesToQueue = [change]
+    const endVersion = 0
+
+    // Queue the changes to add the test file
+    const status = await queueChanges(projectId, changesToQueue, endVersion)
+    expect(status).to.equal('ok')
+
+    // Verify that we now have some state in redis
+    const redisState = await redisBackend.getState(projectId)
+    expect(redisState).to.not.be.null
+
+    // Compute the expected snapshot after applying the changes
+    const expectedSnapshot = new Snapshot()
+    await expectedSnapshot.loadFiles('hollow', blobStore)
+    for (const change of changesToQueue) {
+      const hollowChange = change.clone()
+      await hollowChange.loadFiles('hollow', blobStore)
+      hollowChange.applyTo(expectedSnapshot, { strict: true })
+    }
+
+    // Confirm that state in redis matches the expected snapshot and changes queue
+    const expectedVersionInRedis = endVersion + changesToQueue.length
+    expect(redisState.headVersion).to.equal(expectedVersionInRedis)
+    expect(redisState.headSnapshot).to.deep.equal(expectedSnapshot.toRaw())
+    expect(redisState.changes).to.deep.equal(changesToQueue.map(c => c.toRaw()))
+  })
+
+  it('queues changes when redis has no snapshot (falls back to chunkStore with an existing chunk)', async function () {
+    const projectId = fixtures.docs.uninitializedProject.id
+
+    // Initialise the project in the chunk store using the "Hello World" test file
+    await chunkStore.initializeProject(projectId)
+    const blobStore = new BlobStore(projectId)
+    await blobStore.putFile(testFiles.path('hello.txt'))
+    const change = new Change(
+      [
+        new AddFileOperation(
+          'hello.tex',
+          File.fromHash(testFiles.HELLO_TXT_HASH)
+        ),
+      ],
+      new Date(),
+      []
+    )
+    const initialChanges = [change]
+    const initialVersion = 0
+
+    const result = await persistChanges(
+      projectId,
+      initialChanges,
+      limitsToPersistImmediately,
+      initialVersion
+    )
+    // Compute the state after the initial changes are persisted for later comparison
+    const endVersion = initialVersion + initialChanges.length
+    const { currentChunk } = result
+    const originalSnapshot = result.currentChunk.getSnapshot()
+    await originalSnapshot.loadFiles('hollow', blobStore)
+    originalSnapshot.applyAll(currentChunk.getChanges())
+
+    // Ensure that the initial state in redis is empty
+    const initialRedisState = await redisBackend.getState(projectId)
+    expect(initialRedisState.headVersion).to.be.null
+    expect(initialRedisState.headSnapshot).to.be.null
+    expect(initialRedisState.changes).to.be.an('array').that.is.empty
+
+    // Prepare a change to edit the existing file
+    const editFileOp = new EditFileOperation(
+      'hello.tex',
+      new TextOperation()
+        .insert('Hello')
+        .retain(testFiles.HELLO_TXT_UTF8_LENGTH)
+    )
+    const editFileChange = new Change([editFileOp], new Date(), [])
+    const changesToQueue = [editFileChange]
+
+    // Queue the changes to edit the existing file
+    const status = await queueChanges(projectId, changesToQueue, endVersion)
+    expect(status).to.equal('ok')
+
+    // Verify that we now have some state in redis
+    const redisState = await redisBackend.getState(projectId)
+    expect(redisState).to.not.be.null
+
+    // Compute the expected snapshot after applying the changes
+    const expectedSnapshot = originalSnapshot.clone()
+    await expectedSnapshot.loadFiles('hollow', blobStore)
+    expectedSnapshot.applyAll(changesToQueue)
+
+    // Confirm that state in redis matches the expected snapshot and changes queue
+    const expectedVersionInRedis = endVersion + changesToQueue.length
+    expect(redisState.headVersion).to.equal(expectedVersionInRedis)
+    expect(redisState.headSnapshot).to.deep.equal(expectedSnapshot.toRaw())
+    expect(redisState.changes).to.deep.equal(changesToQueue.map(c => c.toRaw()))
+  })
+
+  it('queues changes when redis has a snapshot with existing changes', async function () {
+    const projectId = fixtures.docs.uninitializedProject.id
+
+    // Initialise the project in redis using the "Hello World" test file
+    await chunkStore.initializeProject(projectId)
+    const blobStore = new BlobStore(projectId)
+    await blobStore.putFile(testFiles.path('hello.txt'))
+    const initialChangeOp = new AddFileOperation(
+      'existing.tex',
+      File.fromHash(testFiles.HELLO_TXT_HASH)
+    )
+    const initialChange = new Change([initialChangeOp], new Date(), [])
+    const initialChangesToQueue = [initialChange]
+    const versionBeforeInitialQueue = 0
+
+    // Queue the initial changes
+    const status = await queueChanges(
+      projectId,
+      initialChangesToQueue,
+      versionBeforeInitialQueue
+    )
+    // Confirm that the initial changes were queued successfully
+    expect(status).to.equal('ok')
+    const versionAfterInitialQueue =
+      versionBeforeInitialQueue + initialChangesToQueue.length
+
+    // Compute the snapshot after the initial changes for later use
+    const initialSnapshot = new Snapshot()
+    await initialSnapshot.loadFiles('hollow', blobStore)
+    for (const change of initialChangesToQueue) {
+      const hollowChange = change.clone()
+      await hollowChange.loadFiles('hollow', blobStore)
+      hollowChange.applyTo(initialSnapshot, { strict: true })
+    }
+
+    // Now prepare some subsequent changes for the queue
+    await blobStore.putFile(testFiles.path('graph.png'))
+    const addFileOp = new AddFileOperation(
+      'graph.png',
+      File.fromHash(testFiles.GRAPH_PNG_HASH)
+    )
+    const addFileChange = new Change([addFileOp], new Date(), [])
+    const editFileOp = new EditFileOperation(
+      'existing.tex',
+      new TextOperation()
+        .insert('Hello')
+        .retain(testFiles.HELLO_TXT_UTF8_LENGTH)
+    )
+    const editFileChange = new Change([editFileOp], new Date(), [])
+
+    const subsequentChangesToQueue = [addFileChange, editFileChange]
+    const versionBeforeSubsequentQueue = versionAfterInitialQueue
+
+    // Queue the subsequent changes
+    const subsequentStatus = await queueChanges(
+      projectId,
+      subsequentChangesToQueue,
+      versionBeforeSubsequentQueue
+    )
+    expect(subsequentStatus).to.equal('ok')
+
+    // Compute the expected snapshot after applying all changes
+    const expectedSnapshot = initialSnapshot.clone()
+    await expectedSnapshot.loadFiles('hollow', blobStore)
+    for (const change of subsequentChangesToQueue) {
+      const hollowChange = change.clone()
+      await hollowChange.loadFiles('hollow', blobStore)
+      hollowChange.applyTo(expectedSnapshot, { strict: true })
+    }
+
+    // Confirm that state in redis matches the expected snapshot and changes queue
+    const finalRedisState = await redisBackend.getState(projectId)
+    expect(finalRedisState).to.not.be.null
+    const expectedFinalVersion =
+      versionBeforeSubsequentQueue + subsequentChangesToQueue.length
+    expect(finalRedisState.headVersion).to.equal(expectedFinalVersion)
+    expect(finalRedisState.headSnapshot).to.deep.equal(expectedSnapshot.toRaw())
+    const allQueuedChangesRaw = initialChangesToQueue
+      .concat(subsequentChangesToQueue)
+      .map(c => c.toRaw())
+    expect(finalRedisState.changes).to.deep.equal(allQueuedChangesRaw)
+  })
+
+  it('skips queuing changes when there is no snapshot and the onlyIfExists flag is set', async function () {
+    // Start with an empty chunk store for the project
+    const projectId = fixtures.docs.uninitializedProject.id
+    await chunkStore.initializeProject(projectId)
+
+    // Ensure that the initial state in redis is empty
+    const initialRedisState = await redisBackend.getState(projectId)
+    expect(initialRedisState.headVersion).to.be.null
+    expect(initialRedisState.headSnapshot).to.be.null
+    expect(initialRedisState.changes).to.be.an('array').that.is.empty
+
+    // Add a test file to the blob store
+    const blobStore = new BlobStore(projectId)
+    await blobStore.putFile(testFiles.path('hello.txt'))
+
+    // Prepare an initial change to add a single file to an empty project
+    const change = new Change(
+      [
+        new AddFileOperation(
+          'test.tex',
+          File.fromHash(testFiles.HELLO_TXT_HASH)
+        ),
+      ],
+      new Date(),
+      []
+    )
+    const changesToQueue = [change]
+    const endVersion = 0
+
+    // Queue the changes to add the test file
+    const status = await queueChanges(projectId, changesToQueue, endVersion, {
+      onlyIfExists: true,
+    })
+    expect(status).to.equal('ignore')
+
+    // Verify that the state in redis has not changed
+    const redisState = await redisBackend.getState(projectId)
+    expect(redisState).to.deep.equal(initialRedisState)
+  })
+
+  it('creates an initial hollow snapshot when redis has no snapshot (falls back to chunkStore with an empty chunk)', async function () {
+    // Start with an empty chunk store for the project
+    const projectId = fixtures.docs.uninitializedProject.id
+    await chunkStore.initializeProject(projectId)
+    const blobStore = new BlobStore(projectId)
+    await blobStore.putFile(testFiles.path('hello.txt'))
+
+    // Prepare an initial change to add a single file to an empty project
+    const change = new Change(
+      [
+        new AddFileOperation(
+          'test.tex',
+          File.fromHash(testFiles.HELLO_TXT_HASH)
+        ),
+      ],
+      new Date(),
+      []
+    )
+    const changesToQueue = [change]
+    const endVersion = 0
+
+    // Queue the changes to add the test file
+    const status = await queueChanges(projectId, changesToQueue, endVersion)
+    expect(status).to.equal('ok')
+
+    // Verify that we now have some state in redis
+    const redisState = await redisBackend.getState(projectId)
+    expect(redisState).to.not.be.null
+    expect(redisState.headSnapshot.files['test.tex']).to.deep.equal({
+      stringLength: testFiles.HELLO_TXT_UTF8_LENGTH,
+    })
+  })
+
+  it('throws ConflictingEndVersion if endVersion does not match current version (from chunkStore)', async function () {
+    const projectId = fixtures.docs.uninitializedProject.id
+    // Initialise an empty project in the chunk store
+    await chunkStore.initializeProject(projectId)
+
+    // Ensure that the initial state in redis is empty
+    const initialRedisState = await redisBackend.getState(projectId)
+    expect(initialRedisState.headVersion).to.be.null
+
+    // Prepare a change to add a file
+    const change = new Change(
+      [new AddFileOperation('test.tex', File.fromString(''))],
+      new Date(),
+      []
+    )
+    const changesToQueue = [change]
+    const incorrectEndVersion = 1
+
+    // Attempt to queue the changes with an incorrect endVersion (1 instead of 0)
+    await expect(queueChanges(projectId, changesToQueue, incorrectEndVersion))
+      .to.be.rejectedWith(Chunk.ConflictingEndVersion)
+      .and.eventually.satisfies(err => {
+        expect(err.info).to.have.property(
+          'clientEndVersion',
+          incorrectEndVersion
+        )
+        expect(err.info).to.have.property('latestEndVersion', 0)
+        return true
+      })
+
+    // Verify that the state in redis has not changed
+    const redisStateAfterError = await redisBackend.getState(projectId)
+    expect(redisStateAfterError).to.deep.equal(initialRedisState)
+  })
+
+  it('throws ConflictingEndVersion if endVersion does not match current version (from redis snapshot)', async function () {
+    const projectId = fixtures.docs.uninitializedProject.id
+
+    // Initialise the project in the redis with a test file
+    await chunkStore.initializeProject(projectId)
+    const initialChange = new Change(
+      [new AddFileOperation('initial.tex', File.fromString('content'))],
+      new Date(),
+      []
+    )
+    const initialChangesToQueue = [initialChange]
+    const versionBeforeInitialQueue = 0
+
+    // Queue the initial changes
+    await queueChanges(
+      projectId,
+      initialChangesToQueue,
+      versionBeforeInitialQueue
+    )
+    const versionInRedisAfterSetup =
+      versionBeforeInitialQueue + initialChangesToQueue.length
+
+    // Confirm that the initial changes were queued successfully
+    const initialRedisState = await redisBackend.getState(projectId)
+    expect(initialRedisState).to.not.be.null
+    expect(initialRedisState.headVersion).to.equal(versionInRedisAfterSetup)
+
+    // Now prepare a subsequent change for the queue
+    const subsequentChange = new Change(
+      [new AddFileOperation('another.tex', File.fromString(''))],
+      new Date(),
+      []
+    )
+    const subsequentChangesToQueue = [subsequentChange]
+    const incorrectEndVersion = 0
+
+    //  Attempt to queue the changes with an incorrect endVersion (0 instead of 1)
+    await expect(
+      queueChanges(projectId, subsequentChangesToQueue, incorrectEndVersion)
+    )
+      .to.be.rejectedWith(Chunk.ConflictingEndVersion)
+      .and.eventually.satisfies(err => {
+        expect(err.info).to.have.property(
+          'clientEndVersion',
+          incorrectEndVersion
+        )
+        expect(err.info).to.have.property(
+          'latestEndVersion',
+          versionInRedisAfterSetup
+        )
+        return true
+      })
+
+    // Verify that the state in redis has not changed
+    const redisStateAfterError = await redisBackend.getState(projectId)
+    expect(redisStateAfterError).to.not.be.null
+    expect(redisStateAfterError).to.deep.equal(initialRedisState)
+  })
+})
diff --git a/services/history-v1/test/acceptance/js/storage/support/MockFilestore.mjs b/services/history-v1/test/acceptance/js/storage/support/MockFilestore.mjs
new file mode 100644
index 0000000000..55d0923c34
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/support/MockFilestore.mjs
@@ -0,0 +1,54 @@
+import express from 'express'
+
+class MockFilestore {
+  constructor() {
+    this.host = process.env.FILESTORE_HOST || '127.0.0.1'
+    this.port = process.env.FILESTORE_PORT || 3009
+    // create a server listening on this.host and this.port
+    this.files = {}
+
+    this.app = express()
+
+    this.app.get('/project/:projectId/file/:fileId', (req, res) => {
+      const { projectId, fileId } = req.params
+      const content = this.files[projectId]?.[fileId]
+      if (!content) return res.status(404).end()
+      res.status(200).end(content)
+    })
+  }
+
+  start() {
+    // reset stored files
+    this.files = {}
+    // start the server
+    if (this.serverPromise) {
+      return this.serverPromise
+    } else {
+      this.serverPromise = new Promise((resolve, reject) => {
+        this.server = this.app.listen(this.port, this.host, err => {
+          if (err) return reject(err)
+          resolve()
+        })
+      })
+      return this.serverPromise
+    }
+  }
+
+  addFile(projectId, fileId, fileContent) {
+    if (!this.files[projectId]) {
+      this.files[projectId] = {}
+    }
+    this.files[projectId][fileId] = fileContent
+  }
+
+  deleteObject(projectId, fileId) {
+    if (this.files[projectId]) {
+      delete this.files[projectId][fileId]
+      if (Object.keys(this.files[projectId]).length === 0) {
+        delete this.files[projectId]
+      }
+    }
+  }
+}
+
+export const mockFilestore = new MockFilestore()
diff --git a/services/history-v1/test/acceptance/js/storage/support/cleanup.js b/services/history-v1/test/acceptance/js/storage/support/cleanup.js
index fd0fcbbcb6..4df985d613 100644
--- a/services/history-v1/test/acceptance/js/storage/support/cleanup.js
+++ b/services/history-v1/test/acceptance/js/storage/support/cleanup.js
@@ -1,6 +1,6 @@
 const config = require('config')
 
-const { knex, persistor, mongodb } = require('../../../../../storage')
+const { knex, persistor, mongodb, redis } = require('../../../../../storage')
 const { S3Persistor } = require('@overleaf/object-persistor/src/S3Persistor')
 
 const POSTGRES_TABLES = [
@@ -17,7 +17,6 @@ const MONGO_COLLECTIONS = [
   'projectHistoryChunks',
 
   // back_fill_file_hash.test.mjs
-  'deletedFiles',
   'deletedProjects',
   'projects',
   'projectHistoryBackedUpBlobs',
@@ -43,6 +42,11 @@ async function cleanupMongo() {
   }
 }
 
+async function cleanupRedis() {
+  await redis.rclientHistory.flushdb()
+  await redis.rclientLock.flushdb()
+}
+
 async function cleanupPersistor() {
   await Promise.all([
     clearBucket(config.get('blobStore.globalBucket')),
@@ -59,6 +63,10 @@ async function clearBucket(name) {
 let s3PersistorForBackupCleanup
 
 async function cleanupBackup() {
+  if (!config.has('backupStore')) {
+    return
+  }
+
   // The backupPersistor refuses to delete short prefixes. Use a low-level S3 persistor.
   if (!s3PersistorForBackupCleanup) {
     const { backupPersistor } = await import(
@@ -82,6 +90,7 @@ async function cleanupEverything() {
     cleanupMongo(),
     cleanupPersistor(),
     cleanupBackup(),
+    cleanupRedis(),
   ])
 }
 
@@ -90,5 +99,6 @@ module.exports = {
   mongo: cleanupMongo,
   persistor: cleanupPersistor,
   backup: cleanupBackup,
+  redis: cleanupRedis,
   everything: cleanupEverything,
 }
diff --git a/services/history-v1/test/acceptance/js/storage/support/redis.js b/services/history-v1/test/acceptance/js/storage/support/redis.js
new file mode 100644
index 0000000000..3f5b9cda27
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/support/redis.js
@@ -0,0 +1,75 @@
+'use strict'
+
+const { Snapshot } = require('overleaf-editor-core')
+const redis = require('../../../../../storage/lib/redis')
+const redisBackend = require('../../../../../storage/lib/chunk_store/redis')
+const rclient = redis.rclientHistory
+const keySchema = redisBackend.keySchema
+
+// Helper to set up a basic project state in Redis
+async function setupProjectState(
+  projectId,
+  {
+    headVersion = 0,
+    persistedVersion = null,
+    expireTime = null,
+    persistTime = null,
+    changes = [],
+    expireTimeFuture = false, // Default to not setting future expire time unless specified
+  }
+) {
+  const headSnapshot = new Snapshot()
+  await rclient.set(
+    keySchema.head({ projectId }),
+    JSON.stringify(headSnapshot.toRaw())
+  )
+  await rclient.set(
+    keySchema.headVersion({ projectId }),
+    headVersion.toString()
+  )
+
+  if (persistedVersion !== null) {
+    await rclient.set(
+      keySchema.persistedVersion({ projectId }),
+      persistedVersion.toString()
+    )
+  } else {
+    await rclient.del(keySchema.persistedVersion({ projectId }))
+  }
+
+  if (expireTime !== null) {
+    await rclient.set(
+      keySchema.expireTime({ projectId }),
+      expireTime.toString()
+    )
+  } else {
+    // If expireTimeFuture is true, set it to a future time, otherwise delete it if null
+    if (expireTimeFuture) {
+      const futureExpireTime = Date.now() + 5 * 60 * 1000 // 5 minutes in the future
+      await rclient.set(
+        keySchema.expireTime({ projectId }),
+        futureExpireTime.toString()
+      )
+    } else {
+      await rclient.del(keySchema.expireTime({ projectId }))
+    }
+  }
+
+  if (persistTime !== null) {
+    await rclient.set(
+      keySchema.persistTime({ projectId }),
+      persistTime.toString()
+    )
+  } else {
+    await rclient.del(keySchema.persistTime({ projectId }))
+  }
+
+  if (changes.length > 0) {
+    const rawChanges = changes.map(c => JSON.stringify(c.toRaw()))
+    await rclient.rpush(keySchema.changes({ projectId }), ...rawChanges)
+  } else {
+    await rclient.del(keySchema.changes({ projectId }))
+  }
+}
+
+module.exports = { setupProjectState, rclient, keySchema }
diff --git a/services/history-v1/test/acceptance/js/storage/support/runscript.js b/services/history-v1/test/acceptance/js/storage/support/runscript.js
new file mode 100644
index 0000000000..7ff8355566
--- /dev/null
+++ b/services/history-v1/test/acceptance/js/storage/support/runscript.js
@@ -0,0 +1,35 @@
+'use strict'
+
+const { promisify } = require('node:util')
+const { execFile } = require('node:child_process')
+
+async function runScript(scriptPath, options = {}) {
+  const TIMEOUT = options.timeout || 10 * 1000 // 10 seconds default
+  let result
+  try {
+    result = await promisify(execFile)('node', [scriptPath], {
+      encoding: 'utf-8',
+      timeout: TIMEOUT,
+      env: {
+        ...process.env,
+        LOG_LEVEL: 'debug', // Override LOG_LEVEL for script output
+      },
+    })
+    result.status = 0
+  } catch (err) {
+    const { stdout, stderr, code } = err
+    if (typeof code !== 'number') {
+      console.error(`Error running script ${scriptPath}:`, err)
+      throw err
+    }
+    result = { stdout, stderr, status: code }
+  }
+  // The script might exit with status 1 if it finds no keys to process, which is ok
+  if (result.status !== 0 && result.status !== 1) {
+    console.error(`Script ${scriptPath} failed:`, result.stderr)
+    throw new Error(`Script ${scriptPath} failed with status ${result.status}`)
+  }
+  return result
+}
+
+module.exports = { runScript }
diff --git a/services/history-v1/test/acceptance/js/storage/tasks.test.js b/services/history-v1/test/acceptance/js/storage/tasks.test.js
index 04f9cd12c3..e43bdac79f 100644
--- a/services/history-v1/test/acceptance/js/storage/tasks.test.js
+++ b/services/history-v1/test/acceptance/js/storage/tasks.test.js
@@ -76,9 +76,13 @@ describe('tasks', function () {
     await mongodb.chunks.insertMany(mongoChunks)
     await Promise.all([
       ...postgresChunks.map(chunk =>
-        historyStore.storeRaw(postgresProjectId.toString(), chunk.chunk_id, {
-          history: 'raw history',
-        })
+        historyStore.storeRaw(
+          postgresProjectId.toString(),
+          chunk.chunk_id.toString(),
+          {
+            history: 'raw history',
+          }
+        )
       ),
       ...mongoChunks.map(chunk =>
         historyStore.storeRaw(mongoProjectId.toString(), chunk._id.toString(), {
diff --git a/services/history-v1/test/setup.js b/services/history-v1/test/setup.js
index 38c1b283ad..60974173de 100644
--- a/services/history-v1/test/setup.js
+++ b/services/history-v1/test/setup.js
@@ -2,12 +2,13 @@ const chai = require('chai')
 const chaiAsPromised = require('chai-as-promised')
 const config = require('config')
 const fetch = require('node-fetch')
-const { knex, mongodb } = require('../storage')
+const { knex, mongodb, redis } = require('../storage')
 
 // ensure every ObjectId has the id string as a property for correct comparisons
 require('mongodb').ObjectId.cacheHexString = true
 
 chai.use(chaiAsPromised)
+chai.config.truncateThreshold = 0
 
 async function setupPostgresDatabase() {
   this.timeout(60_000)
@@ -20,7 +21,7 @@ async function setupMongoDatabase() {
     {
       key: { projectId: 1, startVersion: 1 },
       name: 'projectId_1_startVersion_1',
-      partialFilterExpression: { state: 'active' },
+      partialFilterExpression: { state: { $in: ['active', 'closed'] } },
       unique: true,
     },
     {
@@ -52,6 +53,7 @@ async function createGcsBuckets() {
 // can exit.
 async function tearDownConnectionPool() {
   await knex.destroy()
+  await redis.disconnect()
 }
 
 module.exports = {
diff --git a/services/notifications/.gitignore b/services/notifications/.gitignore
deleted file mode 100644
index 8a030e9aff..0000000000
--- a/services/notifications/.gitignore
+++ /dev/null
@@ -1,54 +0,0 @@
-Compiled source #
-###################
-*.com
-*.class
-*.dll
-*.exe
-*.o
-*.so
-
-# Packages #
-############
-# it's better to unpack these files and commit the raw source
-# git has its own built in compression methods
-*.7z
-*.dmg
-*.gz
-*.iso
-*.jar
-*.rar
-*.tar
-*.zip
-
-# Logs and databases #
-######################
-*.log
-*.sql
-*.sqlite
-
-# OS generated files #
-######################
-.DS_Store?
-ehthumbs.db
-Icon?
-Thumbs.db
-
-node_modules/*
-data/*
-
-cookies.txt
-UserAndProjectPopulator.coffee
-
-public/stylesheets/style.css
-
-Gemfile.lock
-
-*.swp
-.DS_Store
-
-app/views/external
-
-/modules/
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/notifications/.nvmrc b/services/notifications/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/notifications/.nvmrc
+++ b/services/notifications/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/notifications/Dockerfile b/services/notifications/Dockerfile
index 16a5c44fbf..0d0581f113 100644
--- a/services/notifications/Dockerfile
+++ b/services/notifications/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/notifications
 
diff --git a/services/notifications/Makefile b/services/notifications/Makefile
index 8ca3f983ff..f8440d97e2 100644
--- a/services/notifications/Makefile
+++ b/services/notifications/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/notifications/buildscript.txt b/services/notifications/buildscript.txt
index 10e6804ead..1950c5c251 100644
--- a/services/notifications/buildscript.txt
+++ b/services/notifications/buildscript.txt
@@ -4,6 +4,6 @@ notifications
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=True
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/notifications/docker-compose.ci.yml b/services/notifications/docker-compose.ci.yml
index 51eb64d126..ca3303a079 100644
--- a/services/notifications/docker-compose.ci.yml
+++ b/services/notifications/docker-compose.ci.yml
@@ -24,10 +24,13 @@ services:
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -39,7 +42,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/notifications/docker-compose.yml b/services/notifications/docker-compose.yml
index c0902fee2d..e43e9aeef5 100644
--- a/services/notifications/docker-compose.yml
+++ b/services/notifications/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/notifications
       - ../../node_modules:/overleaf/node_modules
@@ -21,11 +21,12 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/notifications
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/notifications
     environment:
       ELASTIC_SEARCH_DSN: es:9200
@@ -39,10 +40,11 @@ services:
     depends_on:
       mongo:
         condition: service_started
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/project-history/.gitignore b/services/project-history/.gitignore
deleted file mode 100644
index 25328fed2e..0000000000
--- a/services/project-history/.gitignore
+++ /dev/null
@@ -1,8 +0,0 @@
-**.swp
-node_modules/
-forever/
-.config
-.npm
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/project-history/.nvmrc b/services/project-history/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/project-history/.nvmrc
+++ b/services/project-history/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/project-history/Dockerfile b/services/project-history/Dockerfile
index 1bf4e5680b..0d719cbfc6 100644
--- a/services/project-history/Dockerfile
+++ b/services/project-history/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/project-history
 
diff --git a/services/project-history/Makefile b/services/project-history/Makefile
index 5cde05ea46..a1d116253d 100644
--- a/services/project-history/Makefile
+++ b/services/project-history/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json --volume $(MONOREPO)/services/document-updater/app/js/types.ts:/overleaf/services/document-updater/app/js/types.ts ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/project-history/app/js/FlushManager.js b/services/project-history/app/js/FlushManager.js
index 6df3b20a87..455a4f56f7 100644
--- a/services/project-history/app/js/FlushManager.js
+++ b/services/project-history/app/js/FlushManager.js
@@ -11,6 +11,7 @@ import async from 'async'
 import logger from '@overleaf/logger'
 import OError from '@overleaf/o-error'
 import metrics from '@overleaf/metrics'
+import Settings from '@overleaf/settings'
 import _ from 'lodash'
 import * as RedisManager from './RedisManager.js'
 import * as UpdatesProcessor from './UpdatesProcessor.js'
@@ -37,6 +38,13 @@ export function flushIfOld(projectId, cutoffTime, callback) {
         )
         metrics.inc('flush-old-updates', 1, { status: 'flushed' })
         return UpdatesProcessor.processUpdatesForProject(projectId, callback)
+      } else if (Settings.shortHistoryQueues.includes(projectId)) {
+        logger.debug(
+          { projectId, firstOpTimestamp, cutoffTime },
+          'flushing project with short queue'
+        )
+        metrics.inc('flush-old-updates', 1, { status: 'short-queue' })
+        return UpdatesProcessor.processUpdatesForProject(projectId, callback)
       } else {
         metrics.inc('flush-old-updates', 1, { status: 'skipped' })
         return callback()
diff --git a/services/project-history/app/js/HistoryStoreManager.js b/services/project-history/app/js/HistoryStoreManager.js
index fe9c9e3d2d..38658bdf5b 100644
--- a/services/project-history/app/js/HistoryStoreManager.js
+++ b/services/project-history/app/js/HistoryStoreManager.js
@@ -35,7 +35,10 @@ class StringStream extends stream.Readable {
 _mocks.getMostRecentChunk = (projectId, historyId, callback) => {
   const path = `projects/${historyId}/latest/history`
   logger.debug({ projectId, historyId }, 'getting chunk from history service')
-  _requestChunk({ path, json: true }, callback)
+  _requestChunk({ path, json: true }, (err, chunk) => {
+    if (err) return callback(OError.tag(err))
+    callback(null, chunk)
+  })
 }
 
 /**
@@ -54,7 +57,10 @@ export function getChunkAtVersion(projectId, historyId, version, callback) {
     { projectId, historyId, version },
     'getting chunk from history service for version'
   )
-  _requestChunk({ path, json: true }, callback)
+  _requestChunk({ path, json: true }, (err, chunk) => {
+    if (err) return callback(OError.tag(err))
+    callback(null, chunk)
+  })
 }
 
 export function getMostRecentVersion(projectId, historyId, callback) {
@@ -68,8 +74,10 @@ export function getMostRecentVersion(projectId, historyId, callback) {
       _.sortBy(chunk.chunk.history.changes || [], x => x.timestamp)
     )
     // find the latest project and doc versions in the chunk
-    _getLatestProjectVersion(projectId, chunk, (err1, projectVersion) =>
+    _getLatestProjectVersion(projectId, chunk, (err1, projectVersion) => {
+      if (err1) err1 = OError.tag(err1)
       _getLatestV2DocVersions(projectId, chunk, (err2, v2DocVersions) => {
+        if (err2) err2 = OError.tag(err2)
         // return the project and doc versions
         const projectStructureAndDocVersions = {
           project: projectVersion,
@@ -83,7 +91,7 @@ export function getMostRecentVersion(projectId, historyId, callback) {
           chunk
         )
       })
-    )
+    })
   })
 }
 
@@ -211,7 +219,10 @@ export function getProjectBlob(historyId, blobHash, callback) {
   logger.debug({ historyId, blobHash }, 'getting blob from history service')
   _requestHistoryService(
     { path: `projects/${historyId}/blobs/${blobHash}` },
-    callback
+    (err, blob) => {
+      if (err) return callback(OError.tag(err))
+      callback(null, blob)
+    }
   )
 }
 
@@ -249,7 +260,7 @@ export function sendChanges(
       method: 'POST',
       json: changes,
     },
-    error => {
+    (error, response) => {
       if (error) {
         OError.tag(error, 'failed to send changes to v1', {
           projectId,
@@ -261,7 +272,7 @@ export function sendChanges(
         })
         return callback(error)
       }
-      callback()
+      callback(null, { resyncNeeded: response?.resyncNeeded ?? false })
     }
   )
 }
@@ -277,7 +288,10 @@ function createBlobFromString(historyId, data, fileId, callback) {
     (fsPath, cb) => {
       _createBlob(historyId, fsPath, cb)
     },
-    callback
+    (err, hash) => {
+      if (err) return callback(OError.tag(err))
+      callback(null, hash)
+    }
   )
 }
 
@@ -330,7 +344,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
     try {
       ranges = HistoryBlobTranslator.createRangeBlobDataFromUpdate(update)
     } catch (error) {
-      return callback(error)
+      return callback(OError.tag(error))
     }
     createBlobFromString(
       historyId,
@@ -338,7 +352,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
       `project-${projectId}-doc-${update.doc}`,
       (err, fileHash) => {
         if (err) {
-          return callback(err)
+          return callback(OError.tag(err))
         }
         if (ranges) {
           createBlobFromString(
@@ -347,7 +361,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
             `project-${projectId}-doc-${update.doc}-ranges`,
             (err, rangesHash) => {
               if (err) {
-                return callback(err)
+                return callback(OError.tag(err))
               }
               logger.debug(
                 { fileHash, rangesHash },
@@ -415,7 +429,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
             },
             (err, fileHash) => {
               if (err) {
-                return callback(err)
+                return callback(OError.tag(err))
               }
               if (update.hash && update.hash !== fileHash) {
                 logger.warn(
@@ -447,7 +461,7 @@ export function createBlobForUpdate(projectId, historyId, update, callback) {
               },
               (err, fileHash) => {
                 if (err) {
-                  return callback(err)
+                  return callback(OError.tag(err))
                 }
                 logger.debug({ fileHash }, 'created empty blob for file')
                 callback(null, { file: fileHash })
@@ -520,7 +534,10 @@ export function initializeProject(historyId, callback) {
 export function deleteProject(projectId, callback) {
   _requestHistoryService(
     { method: 'DELETE', path: `projects/${projectId}` },
-    callback
+    err => {
+      if (err) return callback(OError.tag(err))
+      callback(null)
+    }
   )
 }
 
diff --git a/services/project-history/app/js/HttpController.js b/services/project-history/app/js/HttpController.js
index 766fb4a414..927248726f 100644
--- a/services/project-history/app/js/HttpController.js
+++ b/services/project-history/app/js/HttpController.js
@@ -238,22 +238,6 @@ export function getFileMetadataSnapshot(req, res, next) {
   )
 }
 
-export function getMostRecentChunk(req, res, next) {
-  const { project_id: projectId } = req.params
-  WebApiManager.getHistoryId(projectId, (error, historyId) => {
-    if (error) return next(OError.tag(error))
-
-    HistoryStoreManager.getMostRecentChunk(
-      projectId,
-      historyId,
-      (err, data) => {
-        if (err) return next(OError.tag(err))
-        res.json(data)
-      }
-    )
-  })
-}
-
 export function getLatestSnapshot(req, res, next) {
   const { project_id: projectId } = req.params
   WebApiManager.getHistoryId(projectId, (error, historyId) => {
@@ -272,25 +256,6 @@ export function getLatestSnapshot(req, res, next) {
   })
 }
 
-export function getChangesSince(req, res, next) {
-  const { project_id: projectId } = req.params
-  const { since } = req.query
-  WebApiManager.getHistoryId(projectId, (error, historyId) => {
-    if (error) return next(OError.tag(error))
-    SnapshotManager.getChangesSince(
-      projectId,
-      historyId,
-      since,
-      (error, changes) => {
-        if (error != null) {
-          return next(error)
-        }
-        res.json(changes.map(c => c.toRaw()))
-      }
-    )
-  })
-}
-
 export function getChangesInChunkSince(req, res, next) {
   const { project_id: projectId } = req.params
   const { since } = req.query
diff --git a/services/project-history/app/js/Router.js b/services/project-history/app/js/Router.js
index d7233a511b..ec9a4f0582 100644
--- a/services/project-history/app/js/Router.js
+++ b/services/project-history/app/js/Router.js
@@ -22,10 +22,6 @@ export function initialize(app) {
   app.delete('/project/:project_id', HttpController.deleteProject)
 
   app.get('/project/:project_id/snapshot', HttpController.getLatestSnapshot)
-  app.get(
-    '/project/:project_id/latest/history',
-    HttpController.getMostRecentChunk
-  )
 
   app.get(
     '/project/:project_id/diff',
@@ -61,16 +57,6 @@ export function initialize(app) {
     HttpController.getUpdates
   )
 
-  app.get(
-    '/project/:project_id/changes',
-    validate({
-      query: {
-        since: Joi.number().integer().min(0),
-      },
-    }),
-    HttpController.getChangesSince
-  )
-
   app.get(
     '/project/:project_id/changes-in-chunk',
     validate({
diff --git a/services/project-history/app/js/SnapshotManager.js b/services/project-history/app/js/SnapshotManager.js
index e735fd334b..ed316743cf 100644
--- a/services/project-history/app/js/SnapshotManager.js
+++ b/services/project-history/app/js/SnapshotManager.js
@@ -341,44 +341,6 @@ function getLatestSnapshotFromChunk(data) {
   }
 }
 
-async function getChangesSince(projectId, historyId, sinceVersion) {
-  const allChanges = []
-  let nextVersion
-  while (true) {
-    let data
-    if (nextVersion) {
-      data = await HistoryStoreManager.promises.getChunkAtVersion(
-        projectId,
-        historyId,
-        nextVersion
-      )
-    } else {
-      data = await HistoryStoreManager.promises.getMostRecentChunk(
-        projectId,
-        historyId
-      )
-    }
-    if (data == null || data.chunk == null) {
-      throw new OError('undefined chunk')
-    }
-    const chunk = Core.Chunk.fromRaw(data.chunk)
-    if (sinceVersion > chunk.getEndVersion()) {
-      throw new OError('requested version past the end')
-    }
-    const changes = chunk.getChanges()
-    if (chunk.getStartVersion() > sinceVersion) {
-      allChanges.unshift(...changes)
-      nextVersion = chunk.getStartVersion()
-    } else {
-      allChanges.unshift(
-        ...changes.slice(sinceVersion - chunk.getStartVersion())
-      )
-      break
-    }
-  }
-  return allChanges
-}
-
 async function getChangesInChunkSince(projectId, historyId, sinceVersion) {
   const latestChunk = Core.Chunk.fromRaw(
     (
@@ -426,7 +388,6 @@ async function _loadFilesLimit(snapshot, kind, blobStore) {
 
 // EXPORTS
 
-const getChangesSinceCb = callbackify(getChangesSince)
 const getChangesInChunkSinceCb = callbackify(getChangesInChunkSince)
 const getFileSnapshotStreamCb = callbackify(getFileSnapshotStream)
 const getProjectSnapshotCb = callbackify(getProjectSnapshot)
@@ -441,7 +402,6 @@ const getPathsAtVersionCb = callbackify(getPathsAtVersion)
 
 export {
   getLatestSnapshotFromChunk,
-  getChangesSinceCb as getChangesSince,
   getChangesInChunkSinceCb as getChangesInChunkSince,
   getFileSnapshotStreamCb as getFileSnapshotStream,
   getProjectSnapshotCb as getProjectSnapshot,
@@ -454,7 +414,6 @@ export {
 }
 
 export const promises = {
-  getChangesSince,
   getChangesInChunkSince,
   getFileSnapshotStream,
   getProjectSnapshot,
diff --git a/services/project-history/app/js/SyncManager.js b/services/project-history/app/js/SyncManager.js
index ef8caf69eb..43cb61be9f 100644
--- a/services/project-history/app/js/SyncManager.js
+++ b/services/project-history/app/js/SyncManager.js
@@ -23,6 +23,7 @@ import { isInsert, isDelete } from './Utils.js'
 
 /**
  * @import { Comment as HistoryComment, TrackedChange as HistoryTrackedChange } from 'overleaf-editor-core'
+ * @import { CommentRawData, TrackedChangeRawData } from 'overleaf-editor-core/lib/types'
  * @import { Comment, Entity, ResyncDocContentUpdate, RetainOp, TrackedChange } from './types'
  * @import { TrackedChangeTransition, TrackingDirective, TrackingType, Update } from './types'
  * @import { ProjectStructureUpdate } from './types'
@@ -764,11 +765,19 @@ class SyncUpdateExpander {
     }
 
     const persistedComments = file.getComments().toArray()
-    await this.queueUpdatesForOutOfSyncComments(
-      update,
-      pathname,
-      persistedComments
-    )
+    if (update.resyncDocContent.historyOTRanges) {
+      this.queueUpdatesForOutOfSyncCommentsHistoryOT(
+        update,
+        pathname,
+        file.getComments().toRaw()
+      )
+    } else {
+      await this.queueUpdatesForOutOfSyncComments(
+        update,
+        pathname,
+        persistedComments
+      )
+    }
 
     const persistedChanges = file.getTrackedChanges().asSorted()
     await this.queueUpdatesForOutOfSyncTrackedChanges(
@@ -825,6 +834,91 @@ class SyncUpdateExpander {
     return expandedUpdate
   }
 
+  /**
+   * Queue updates for out of sync comments
+   *
+   * @param {ResyncDocContentUpdate} update
+   * @param {string} pathname
+   * @param {CommentRawData[]} persistedComments
+   */
+  queueUpdatesForOutOfSyncCommentsHistoryOT(
+    update,
+    pathname,
+    persistedComments
+  ) {
+    const expectedComments =
+      update.resyncDocContent.historyOTRanges?.comments ?? []
+    const expectedCommentsById = new Map(
+      expectedComments.map(comment => [comment.id, comment])
+    )
+    const persistedCommentsById = new Map(
+      persistedComments.map(comment => [comment.id, comment])
+    )
+
+    // Delete any persisted comment that is not in the expected comment list.
+    for (const persistedComment of persistedComments) {
+      if (!expectedCommentsById.has(persistedComment.id)) {
+        this.expandedUpdates.push({
+          doc: update.doc,
+          op: [{ deleteComment: persistedComment.id }],
+          meta: {
+            pathname,
+            resync: true,
+            origin: this.origin,
+            ts: update.meta.ts,
+          },
+        })
+      }
+    }
+
+    for (const expectedComment of expectedComments) {
+      const persistedComment = persistedCommentsById.get(expectedComment.id)
+      if (
+        persistedComment &&
+        commentRangesAreInSyncHistoryOT(persistedComment, expectedComment)
+      ) {
+        if (expectedComment.resolved === persistedComment.resolved) {
+          // Both comments are identical; do nothing
+        } else {
+          // Only the resolved state differs
+          this.expandedUpdates.push({
+            doc: update.doc,
+            op: [
+              {
+                commentId: expectedComment.id,
+                resolved: expectedComment.resolved,
+              },
+            ],
+            meta: {
+              pathname,
+              resync: true,
+              origin: this.origin,
+              ts: update.meta.ts,
+            },
+          })
+        }
+      } else {
+        // New comment or ranges differ
+        this.expandedUpdates.push({
+          doc: update.doc,
+          op: [
+            {
+              commentId: expectedComment.id,
+              ranges: expectedComment.ranges,
+              resolved: expectedComment.resolved,
+            },
+          ],
+          meta: {
+            pathname,
+            resync: true,
+            origin: this.origin,
+            ts: update.meta.ts,
+          },
+        })
+      }
+    }
+  }
+
   /**
    * Queue updates for out of sync comments
    *
@@ -951,6 +1045,7 @@ class SyncUpdateExpander {
     for (const transition of getTrackedChangesTransitions(
       persistedChanges,
       expectedChanges,
+      update.resyncDocContent.historyOTRanges?.trackedChanges || [],
       expectedContent.length
     )) {
       if (transition.pos > cursor) {
@@ -1018,6 +1113,25 @@ class SyncUpdateExpander {
   }
 }
 
+/**
+ * Compares the ranges in the persisted and expected comments
+ *
+ * @param {CommentRawData} persistedComment
+ * @param {CommentRawData} expectedComment
+ */
+function commentRangesAreInSyncHistoryOT(persistedComment, expectedComment) {
+  if (persistedComment.ranges.length !== expectedComment.ranges.length) {
+    return false
+  }
+  for (let i = 0; i < persistedComment.ranges.length; i++) {
+    const persistedRange = persistedComment.ranges[i]
+    const expectedRange = expectedComment.ranges[i]
+    if (persistedRange.pos !== expectedRange.pos) return false
+    if (persistedRange.length !== expectedRange.length) return false
+  }
+  return true
+}
+
 /**
  * Compares the ranges in the persisted and expected comments
  *
@@ -1049,11 +1163,13 @@ function commentRangesAreInSync(persistedComment, expectedComment) {
  *
  * @param {readonly HistoryTrackedChange[]} persistedChanges
  * @param {TrackedChange[]} expectedChanges
+ * @param {TrackedChangeRawData[]} persistedChangesHistoryOT
  * @param {number} docLength
  */
 function getTrackedChangesTransitions(
   persistedChanges,
   expectedChanges,
+  persistedChangesHistoryOT,
   docLength
 ) {
   /** @type {TrackedChangeTransition[]} */
@@ -1076,6 +1192,19 @@ function getTrackedChangesTransitions(
     })
   }
 
+  for (const change of persistedChangesHistoryOT) {
+    transitions.push({
+      stage: 'expected',
+      pos: change.range.pos,
+      tracking: change.tracking,
+    })
+    transitions.push({
+      stage: 'expected',
+      pos: change.range.pos + change.range.length,
+      tracking: { type: 'none' },
+    })
+  }
+
   for (const change of expectedChanges) {
     const op = change.op
     const pos = op.hpos ?? op.p
diff --git a/services/project-history/app/js/UpdateCompressor.js b/services/project-history/app/js/UpdateCompressor.js
index b548b7529e..5ae7591a7f 100644
--- a/services/project-history/app/js/UpdateCompressor.js
+++ b/services/project-history/app/js/UpdateCompressor.js
@@ -1,7 +1,15 @@
 // @ts-check
 
+import Metrics from '@overleaf/metrics'
 import OError from '@overleaf/o-error'
 import DMP from 'diff-match-patch'
+import { EditOperationBuilder } from 'overleaf-editor-core'
+import zlib from 'node:zlib'
+import { ReadableString, WritableBuffer } from '@overleaf/stream-utils'
+import Stream from 'node:stream'
+import logger from '@overleaf/logger'
+import { callbackify } from '@overleaf/promise-utils'
+import Settings from '@overleaf/settings'
 
 /**
  * @import { DeleteOp, InsertOp, Op, Update } from './types'
@@ -161,7 +169,9 @@ export function concatUpdatesWithSameVersion(updates) {
         lastUpdate.op != null &&
         lastUpdate.v === update.v &&
         lastUpdate.doc === update.doc &&
-        lastUpdate.pathname === update.pathname
+        lastUpdate.pathname === update.pathname &&
+        EditOperationBuilder.isValid(update.op[0]) ===
+          EditOperationBuilder.isValid(lastUpdate.op[0])
       ) {
         lastUpdate.op = lastUpdate.op.concat(update.op)
         if (update.meta.doc_hash == null) {
@@ -179,6 +189,66 @@ export function concatUpdatesWithSameVersion(updates) {
   return concattedUpdates
 }
 
+async function estimateStorage(updates) {
+  const blob = JSON.stringify(updates)
+  const bytes = Buffer.from(blob).byteLength
+  const read = new ReadableString(blob)
+  const compress = zlib.createGzip()
+  const write = new WritableBuffer()
+  await Stream.promises.pipeline(read, compress, write)
+  const bytesGz = write.size()
+  return { bytes, bytesGz, nUpdates: updates.length }
+}
+
+/**
+ * @param {Update[]} rawUpdates
+ * @param {string} projectId
+ * @param {import("./Profiler").Profiler} profile
+ * @return {Promise<Update[]>}
+ */
+async function compressRawUpdatesWithMetrics(rawUpdates, projectId, profile) {
+  if (100 * Math.random() > Settings.estimateCompressionSample) {
+    return compressRawUpdatesWithProfile(rawUpdates, projectId, profile)
+  }
+  const before = await estimateStorage(rawUpdates)
+  profile.log('estimateRawUpdatesSize')
+  const updates = compressRawUpdatesWithProfile(rawUpdates, projectId, profile)
+  const after = await estimateStorage(updates)
+  for (const [path, values] of Object.entries({ before, after })) {
+    for (const [method, v] of Object.entries(values)) {
+      Metrics.summary('updates_compression_estimate', v, { path, method })
+    }
+  }
+  for (const method of Object.keys(before)) {
+    const percentage = Math.ceil(100 * (after[method] / before[method]))
+    Metrics.summary('updates_compression_percentage', percentage, { method })
+  }
+  profile.log('estimateCompressedUpdatesSize')
+  return updates
+}
+
+export const compressRawUpdatesWithMetricsCb = callbackify(
+  compressRawUpdatesWithMetrics
+)
+
+/**
+ * @param {Update[]} rawUpdates
+ * @param {string} projectId
+ * @param {import("./Profiler").Profiler} profile
+ * @return {Update[]}
+ */
+function compressRawUpdatesWithProfile(rawUpdates, projectId, profile) {
+  const updates = compressRawUpdates(rawUpdates)
+  const timeTaken = profile.log('compressRawUpdates').getTimeDelta()
+  if (timeTaken >= 1000) {
+    logger.debug(
+      { projectId, updates: rawUpdates, timeTaken },
+      'slow compression of raw updates'
+    )
+  }
+  return updates
+}
+
 export function compressRawUpdates(rawUpdates) {
   let updates = convertToSingleOpUpdates(rawUpdates)
   updates = compressUpdates(updates)
@@ -230,6 +300,13 @@ function _concatTwoUpdates(firstUpdate, secondUpdate) {
     return [firstUpdate, secondUpdate]
   }
 
+  const firstUpdateIsHistoryOT = EditOperationBuilder.isValid(firstUpdate.op)
+  const secondUpdateIsHistoryOT = EditOperationBuilder.isValid(secondUpdate.op)
+  if (firstUpdateIsHistoryOT !== secondUpdateIsHistoryOT) {
+    // cannot merge mix of sharejs-text-op and history-ot, should not happen.
+    return [firstUpdate, secondUpdate]
+  }
+
   if (
     firstUpdate.doc !== secondUpdate.doc ||
     firstUpdate.pathname !== secondUpdate.pathname
@@ -276,6 +353,15 @@ function _concatTwoUpdates(firstUpdate, secondUpdate) {
     return [firstUpdate, secondUpdate]
   }
 
+  if (firstUpdateIsHistoryOT && secondUpdateIsHistoryOT) {
+    const op1 = EditOperationBuilder.fromJSON(firstUpdate.op)
+    const op2 = EditOperationBuilder.fromJSON(secondUpdate.op)
+    if (!op1.canBeComposedWith(op2)) return [firstUpdate, secondUpdate]
+    return [
+      mergeUpdatesWithOp(firstUpdate, secondUpdate, op1.compose(op2).toJSON()),
+    ]
+  }
+
   if (
     firstUpdate.op.trackedDeleteRejection ||
     secondUpdate.op.trackedDeleteRejection
@@ -440,8 +526,7 @@ export function diffAsShareJsOps(before, after) {
   const ops = []
   let position = 0
   for (const diff of diffs) {
-    const type = diff[0]
-    const content = diff[1]
+    const [type, content] = diff
     if (type === ADDED) {
       ops.push({
         i: content,
diff --git a/services/project-history/app/js/UpdateTranslator.js b/services/project-history/app/js/UpdateTranslator.js
index 38e65f6968..43b9f48270 100644
--- a/services/project-history/app/js/UpdateTranslator.js
+++ b/services/project-history/app/js/UpdateTranslator.js
@@ -7,7 +7,7 @@ import * as OperationsCompressor from './OperationsCompressor.js'
 import { isInsert, isRetain, isDelete, isComment } from './Utils.js'
 
 /**
- * @import { AddDocUpdate, AddFileUpdate, DeleteCommentUpdate, Op, RawScanOp } from './types'
+ * @import { AddDocUpdate, AddFileUpdate, DeleteCommentUpdate, HistoryOTEditOperationUpdate, Op, RawScanOp } from './types'
  * @import { RenameUpdate, TextUpdate, TrackingDirective, TrackingProps } from './types'
  * @import { SetCommentStateUpdate, SetFileMetadataOperation, Update, UpdateWithBlob } from './types'
  */
@@ -60,6 +60,16 @@ function _convertToChange(projectId, updateWithBlob) {
     }
     operations = [op]
     projectVersion = update.version
+  } else if (isHistoryOTEditOperationUpdate(update)) {
+    let { pathname } = update.meta
+    pathname = _convertPathname(pathname)
+    if (update.v != null) {
+      v2DocVersions[update.doc] = { pathname, v: update.v }
+    }
+    operations = update.op.map(op => {
+      // Turn EditOperation into EditFileOperation by adding the pathname field.
+      return { pathname, ...op }
+    })
   } else if (isTextUpdate(update)) {
     const docLength = update.meta.history_doc_length ?? update.meta.doc_length
     let pathname = update.meta.pathname
@@ -194,6 +204,22 @@ export function isTextUpdate(update) {
   )
 }
 
+/**
+ * @param {Update} update
+ * @returns {update is HistoryOTEditOperationUpdate}
+ */
+export function isHistoryOTEditOperationUpdate(update) {
+  return (
+    'doc' in update &&
+    update.doc != null &&
+    'op' in update &&
+    update.op != null &&
+    'pathname' in update.meta &&
+    update.meta.pathname != null &&
+    Core.EditOperationBuilder.isValid(update.op[0])
+  )
+}
+
 export function isProjectStructureUpdate(update) {
   return isAddUpdate(update) || _isRenameUpdate(update)
 }
diff --git a/services/project-history/app/js/UpdatesProcessor.js b/services/project-history/app/js/UpdatesProcessor.js
index b52fac7af6..b4895c012d 100644
--- a/services/project-history/app/js/UpdatesProcessor.js
+++ b/services/project-history/app/js/UpdatesProcessor.js
@@ -85,7 +85,7 @@ export function startResyncAndProcessUpdatesUnderLock(
         })
       })
     },
-    (flushError, queueSize) => {
+    (flushError, { queueSize } = {}) => {
       if (flushError) {
         OError.tag(flushError)
         ErrorRecorder.record(projectId, queueSize, flushError, recordError => {
@@ -132,7 +132,7 @@ export function processUpdatesForProject(projectId, callback) {
         releaseLock
       )
     },
-    (flushError, queueSize) => {
+    (flushError, { queueSize, resyncNeeded } = {}) => {
       if (flushError) {
         OError.tag(flushError)
         ErrorRecorder.record(
@@ -167,7 +167,15 @@ export function processUpdatesForProject(projectId, callback) {
               'failed to clear error'
             )
           }
-          callback()
+          if (resyncNeeded) {
+            logger.warn(
+              { projectId },
+              'Resyncing project as requested by full project history'
+            )
+            resyncProject(projectId, callback)
+          } else {
+            callback()
+          }
         })
       }
       if (queueSize > 0) {
@@ -198,7 +206,7 @@ export function resyncProject(projectId, callback) {
           releaseLock
         )
       },
-      (flushError, queueSize) => {
+      (flushError, { queueSize } = {}) => {
         if (flushError) {
           ErrorRecorder.record(
             projectId,
@@ -247,7 +255,7 @@ export function processUpdatesForProjectUsingBisect(
         releaseLock
       )
     },
-    (flushError, queueSize) => {
+    (flushError, { queueSize } = {}) => {
       if (amountToProcess === 0 || queueSize === 0) {
         // no further processing possible
         if (flushError != null) {
@@ -298,7 +306,7 @@ export function processSingleUpdateForProject(projectId, callback) {
     ) => {
       _countAndProcessUpdates(projectId, extendLock, 1, releaseLock)
     },
-    (flushError, queueSize) => {
+    (flushError, { queueSize } = {}) => {
       // no need to clear the flush marker when single stepping
       // it will be cleared up on the next background flush if
       // the queue is empty
@@ -339,18 +347,34 @@ _mocks._countAndProcessUpdates = (
     }
     if (queueSize > 0) {
       logger.debug({ projectId, queueSize }, 'processing uncompressed updates')
+
+      let resyncNeeded = false
       RedisManager.getUpdatesInBatches(
         projectId,
         batchSize,
         (updates, cb) => {
-          _processUpdatesBatch(projectId, updates, extendLock, cb)
+          _processUpdatesBatch(
+            projectId,
+            updates,
+            extendLock,
+            (err, flushResponse) => {
+              if (err) {
+                return cb(err)
+              }
+
+              if (flushResponse.resyncNeeded) {
+                resyncNeeded = true
+              }
+              cb()
+            }
+          )
         },
         error => {
           // Unconventional callback signature. The caller needs the queue size
           // even when an error is thrown in order to record the queue size in
           // the projectHistoryFailures collection. We'll have to find another
           // way to achieve this when we promisify.
-          callback(error, queueSize)
+          callback(error, { queueSize, resyncNeeded })
         }
       )
     } else {
@@ -376,15 +400,21 @@ function _processUpdatesBatch(projectId, updates, extendLock, callback) {
         { projectId },
         'discarding updates as project does not use history'
       )
-      return callback()
+      return callback(null, {})
     }
 
-    _processUpdates(projectId, historyId, updates, extendLock, error => {
-      if (error != null) {
-        return callback(OError.tag(error))
+    _processUpdates(
+      projectId,
+      historyId,
+      updates,
+      extendLock,
+      (error, flushResponse) => {
+        if (error != null) {
+          return callback(OError.tag(error))
+        }
+        callback(null, flushResponse)
       }
-      callback()
-    })
+    )
   })
 }
 
@@ -516,7 +546,10 @@ export function _processUpdates(
       }
       if (filteredUpdates.length === 0) {
         // return early if there are no updates to apply
-        return SyncManager.setResyncState(projectId, newSyncState, callback)
+        return SyncManager.setResyncState(projectId, newSyncState, err => {
+          if (err) return callback(err)
+          callback(null, { resyncNeeded: false })
+        })
       }
       // only make request to history service if we have actual updates to process
       _getMostRecentVersionWithDebug(
@@ -536,6 +569,8 @@ export function _processUpdates(
           if (error != null) {
             return callback(error)
           }
+
+          let resyncNeeded = false
           async.waterfall(
             [
               cb => {
@@ -561,17 +596,17 @@ export function _processUpdates(
                   return cb(err)
                 }
                 profile.log('skipAlreadyAppliedUpdates')
-                const compressedUpdates =
-                  UpdateCompressor.compressRawUpdates(unappliedUpdates)
-                const timeTaken = profile
-                  .log('compressRawUpdates')
-                  .getTimeDelta()
-                if (timeTaken >= 1000) {
-                  logger.debug(
-                    { projectId, updates: unappliedUpdates, timeTaken },
-                    'slow compression of raw updates'
-                  )
-                }
+                cb(null, unappliedUpdates)
+              },
+              (unappliedUpdates, cb) => {
+                UpdateCompressor.compressRawUpdatesWithMetricsCb(
+                  unappliedUpdates,
+                  projectId,
+                  profile,
+                  cb
+                )
+              },
+              (compressedUpdates, cb) => {
                 cb = profile.wrap('createBlobs', cb)
                 BlobManager.createBlobsForUpdates(
                   projectId,
@@ -646,7 +681,13 @@ export function _processUpdates(
                     projectHistoryId,
                     changes,
                     baseVersion,
-                    cb
+                    (err, response) => {
+                      if (err) {
+                        return cb(err)
+                      }
+                      resyncNeeded = response.resyncNeeded
+                      cb()
+                    }
                   )
                 })
               },
@@ -657,7 +698,11 @@ export function _processUpdates(
             ],
             error => {
               profile.end()
-              callback(error)
+              if (error) {
+                callback(error)
+              } else {
+                callback(null, { resyncNeeded })
+              }
             }
           )
         }
diff --git a/services/project-history/app/js/types.ts b/services/project-history/app/js/types.ts
index c2b0d83728..c11b7741e3 100644
--- a/services/project-history/app/js/types.ts
+++ b/services/project-history/app/js/types.ts
@@ -1,5 +1,11 @@
 import { HistoryRanges } from '../../../document-updater/app/js/types'
-import { LinkedFileData, RawOrigin } from 'overleaf-editor-core/lib/types'
+import {
+  LinkedFileData,
+  RawEditOperation,
+  RawOrigin,
+  CommentRawData,
+  TrackedChangeRawData,
+} from 'overleaf-editor-core/lib/types'
 
 export type Update =
   | TextUpdate
@@ -40,6 +46,15 @@ export type TextUpdate = {
   }
 }
 
+export type HistoryOTEditOperationUpdate = {
+  doc: string
+  op: RawEditOperation[]
+  v: number
+  meta: UpdateMeta & {
+    pathname: string
+  }
+}
+
 export type SetCommentStateUpdate = {
   pathname: string
   commentId: string
@@ -105,6 +120,10 @@ export type ResyncDocContentUpdate = {
     content: string
     version: number
     ranges?: Ranges
+    historyOTRanges?: {
+      comments: CommentRawData[]
+      trackedChanges: TrackedChangeRawData[]
+    }
     resolvedCommentIds?: string[]
   }
   projectHistoryId: string
diff --git a/services/project-history/buildscript.txt b/services/project-history/buildscript.txt
index 89ed021aa3..dc83e95fe4 100644
--- a/services/project-history/buildscript.txt
+++ b/services/project-history/buildscript.txt
@@ -4,6 +4,6 @@ project-history
 --env-add=
 --env-pass-through=
 --esmock-loader=True
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/project-history/config/settings.defaults.cjs b/services/project-history/config/settings.defaults.cjs
index 9e5a39868a..d767cddd96 100644
--- a/services/project-history/config/settings.defaults.cjs
+++ b/services/project-history/config/settings.defaults.cjs
@@ -106,4 +106,12 @@ module.exports = {
   },
 
   maxFileSizeInBytes: 100 * 1024 * 1024, // 100 megabytes
+
+  shortHistoryQueues: (process.env.SHORT_HISTORY_QUEUES || '')
+    .split(',')
+    .filter(s => !!s),
+  estimateCompressionSample: parseInt(
+    process.env.ESTIMATE_COMPRESSION_SAMPLE || '0',
+    10
+  ),
 }
diff --git a/services/project-history/docker-compose.ci.yml b/services/project-history/docker-compose.ci.yml
index bdf10c9732..c6ec24a84b 100644
--- a/services/project-history/docker-compose.ci.yml
+++ b/services/project-history/docker-compose.ci.yml
@@ -21,18 +21,22 @@ services:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
       POSTGRES_HOST: postgres
       MOCHA_GREP: ${MOCHA_GREP}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     depends_on:
       mongo:
         condition: service_started
       redis:
         condition: service_healthy
     user: node
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance
 
 
@@ -44,14 +48,14 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping="$$(redis-cli ping)" && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/project-history/docker-compose.yml b/services/project-history/docker-compose.yml
index 39c7ed9009..dd3c6468fe 100644
--- a/services/project-history/docker-compose.yml
+++ b/services/project-history/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/project-history
       - ../../node_modules:/overleaf/node_modules
@@ -21,15 +21,17 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/project-history
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/project-history
     environment:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
@@ -44,17 +46,18 @@ services:
         condition: service_started
       redis:
         condition: service_healthy
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance
 
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping=$$(redis-cli ping) && [ "$$ping" = 'PONG' ]
       interval: 1s
       retries: 20
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/project-history/package.json b/services/project-history/package.json
index 2a54a807d3..4160f36f6f 100644
--- a/services/project-history/package.json
+++ b/services/project-history/package.json
@@ -9,8 +9,8 @@
     "test:unit": "npm run test:unit:_run -- --grep=$MOCHA_GREP",
     "start": "node app.js",
     "nodemon": "node --watch app.js",
-    "test:acceptance:_run": "LOG_LEVEL=fatal mocha --loader=esmock --recursive --reporter spec --timeout 15000 --exit $@ test/acceptance/js",
-    "test:unit:_run": "LOG_LEVEL=fatal mocha --loader=esmock --recursive --reporter spec $@ test/unit/js",
+    "test:acceptance:_run": "mocha --loader=esmock --recursive --reporter spec --timeout 15000 --exit $@ test/acceptance/js",
+    "test:unit:_run": "mocha --loader=esmock --recursive --reporter spec $@ test/unit/js",
     "lint": "eslint --max-warnings 0 --format unix .",
     "format": "prettier --list-different $PWD/'**/*.*js'",
     "format:fix": "prettier --write $PWD/'**/*.*js'",
@@ -25,6 +25,7 @@
     "@overleaf/promise-utils": "*",
     "@overleaf/redis-wrapper": "*",
     "@overleaf/settings": "*",
+    "@overleaf/stream-utils": "*",
     "async": "^3.2.5",
     "aws-sdk": "^2.650.0",
     "body-parser": "^1.20.3",
diff --git a/services/project-history/scripts/flush_old.js b/services/project-history/scripts/flush_old.js
index 6dc140196e..7ac13b757a 100644
--- a/services/project-history/scripts/flush_old.js
+++ b/services/project-history/scripts/flush_old.js
@@ -124,11 +124,14 @@ async function main() {
       .map((projectId, idx) => {
         return { projectId, timestamp: timestamps[idx] }
       })
-      .filter(({ timestamp }) => {
+      .filter(({ projectId, timestamp }) => {
         if (!timestamp) {
           nullCount++
+          return true // Unknown age
         }
-        return timestamp ? olderThan(maxAge, timestamp) : true
+        if (olderThan(maxAge, timestamp)) return true // Older than threshold
+        if (Settings.shortHistoryQueues.includes(projectId)) return true // Short queue
+        return false // Do not flush
       })
     collectedProjects.push(...newProjects)
   }
diff --git a/services/project-history/scripts/retry_failures.js b/services/project-history/scripts/retry_failures.js
new file mode 100755
index 0000000000..85ee21faf4
--- /dev/null
+++ b/services/project-history/scripts/retry_failures.js
@@ -0,0 +1,26 @@
+import * as RetryManager from '../app/js/RetryManager.js'
+import minimist from 'minimist'
+
+const args = minimist(process.argv.slice(2), {
+  string: ['failureType', 'timeout', 'limit'],
+  default: {
+    failureType: 'soft',
+    timeout: (60 * 60 * 1000).toString(),
+    limit: (100_000).toString(),
+  },
+})
+
+const failureType = args.failureType
+const timeout = parseInt(args.timeout, 10)
+const limit = parseInt(args.limit, 10)
+
+RetryManager.retryFailures({ failureType, timeout, limit }, (err, result) => {
+  if (err) {
+    console.error(err)
+    process.exit(1)
+  } else {
+    console.log(JSON.stringify(result))
+    console.log('Done.')
+  }
+  process.exit(0)
+})
diff --git a/services/project-history/test/acceptance/js/FlushManagerTests.js b/services/project-history/test/acceptance/js/FlushManagerTests.js
index d11346d9a3..8d4432d3ef 100644
--- a/services/project-history/test/acceptance/js/FlushManagerTests.js
+++ b/services/project-history/test/acceptance/js/FlushManagerTests.js
@@ -6,6 +6,7 @@ import assert from 'node:assert'
 import mongodb from 'mongodb-legacy'
 import * as ProjectHistoryClient from './helpers/ProjectHistoryClient.js'
 import * as ProjectHistoryApp from './helpers/ProjectHistoryApp.js'
+import Settings from '@overleaf/settings'
 const { ObjectId } = mongodb
 
 const MockHistoryStore = () => nock('http://127.0.0.1:3100')
@@ -127,7 +128,7 @@ describe('Flushing old queues', function () {
                 'made calls to history service to store updates in the background'
               )
               done()
-            }, 100)
+            }, 1_000)
           }
         )
       })
@@ -183,6 +184,88 @@ describe('Flushing old queues', function () {
       })
     })
 
+    describe('when the update is newer than the cutoff and project has short queue', function () {
+      beforeEach(function () {
+        Settings.shortHistoryQueues.push(this.projectId)
+      })
+      afterEach(function () {
+        Settings.shortHistoryQueues.length = 0
+      })
+      beforeEach(function (done) {
+        this.flushCall = MockHistoryStore()
+          .put(
+            `/api/projects/${historyId}/blobs/0a207c060e61f3b88eaee0a8cd0696f46fb155eb`
+          )
+          .reply(201)
+          .post(`/api/projects/${historyId}/legacy_changes?end_version=0`)
+          .reply(200)
+        const update = {
+          pathname: '/main.tex',
+          docLines: 'a\nb',
+          doc: this.docId,
+          meta: { user_id: this.user_id, ts: new Date() },
+        }
+        async.series(
+          [
+            cb =>
+              ProjectHistoryClient.pushRawUpdate(this.projectId, update, cb),
+            cb =>
+              ProjectHistoryClient.setFirstOpTimestamp(
+                this.projectId,
+                Date.now() - 60 * 1000,
+                cb
+              ),
+          ],
+          done
+        )
+      })
+
+      it('flushes the project history queue', function (done) {
+        request.post(
+          {
+            url: `http://127.0.0.1:3054/flush/old?maxAge=${3 * 3600}`,
+          },
+          (error, res, body) => {
+            if (error) {
+              return done(error)
+            }
+            expect(res.statusCode).to.equal(200)
+            assert(
+              this.flushCall.isDone(),
+              'made calls to history service to store updates'
+            )
+            done()
+          }
+        )
+      })
+
+      it('flushes the project history queue in the background when requested', function (done) {
+        request.post(
+          {
+            url: `http://127.0.0.1:3054/flush/old?maxAge=${3 * 3600}&background=1`,
+          },
+          (error, res, body) => {
+            if (error) {
+              return done(error)
+            }
+            expect(res.statusCode).to.equal(200)
+            expect(body).to.equal('{"message":"running flush in background"}')
+            assert(
+              !this.flushCall.isDone(),
+              'did not make calls to history service to store updates in the foreground'
+            )
+            setTimeout(() => {
+              assert(
+                this.flushCall.isDone(),
+                'made calls to history service to store updates in the background'
+              )
+              done()
+            }, 1_000)
+          }
+        )
+      })
+    })
+
     describe('when the update does not have a timestamp', function () {
       beforeEach(function (done) {
         this.flushCall = MockHistoryStore()
diff --git a/services/project-history/test/acceptance/js/GetChangesSince.js b/services/project-history/test/acceptance/js/GetChangesSince.js
deleted file mode 100644
index 559432fc73..0000000000
--- a/services/project-history/test/acceptance/js/GetChangesSince.js
+++ /dev/null
@@ -1,122 +0,0 @@
-import { expect } from 'chai'
-import mongodb from 'mongodb-legacy'
-import nock from 'nock'
-import Core from 'overleaf-editor-core'
-import * as ProjectHistoryClient from './helpers/ProjectHistoryClient.js'
-import * as ProjectHistoryApp from './helpers/ProjectHistoryApp.js'
-import latestChunk from '../fixtures/chunks/7-8.json' with { type: 'json' }
-import previousChunk from '../fixtures/chunks/4-6.json' with { type: 'json' }
-import firstChunk from '../fixtures/chunks/0-3.json' with { type: 'json' }
-const { ObjectId } = mongodb
-
-const MockHistoryStore = () => nock('http://127.0.0.1:3100')
-const MockWeb = () => nock('http://127.0.0.1:3000')
-
-const fixture = path => new URL(`../fixtures/${path}`, import.meta.url)
-
-describe('GetChangesSince', function () {
-  let projectId, historyId
-  beforeEach(function (done) {
-    projectId = new ObjectId().toString()
-    historyId = new ObjectId().toString()
-    ProjectHistoryApp.ensureRunning(error => {
-      if (error) throw error
-
-      MockHistoryStore().post('/api/projects').reply(200, {
-        projectId: historyId,
-      })
-
-      ProjectHistoryClient.initializeProject(historyId, (error, olProject) => {
-        if (error) throw error
-        MockWeb()
-          .get(`/project/${projectId}/details`)
-          .reply(200, {
-            name: 'Test Project',
-            overleaf: { history: { id: olProject.id } },
-          })
-
-        MockHistoryStore()
-          .get(`/api/projects/${historyId}/latest/history`)
-          .replyWithFile(200, fixture('chunks/7-8.json'))
-        MockHistoryStore()
-          .get(`/api/projects/${historyId}/versions/6/history`)
-          .replyWithFile(200, fixture('chunks/4-6.json'))
-        MockHistoryStore()
-          .get(`/api/projects/${historyId}/versions/3/history`)
-          .replyWithFile(200, fixture('chunks/0-3.json'))
-
-        done()
-      })
-    })
-  })
-
-  afterEach(function () {
-    nock.cleanAll()
-  })
-
-  function expectChangesSince(version, changes, done) {
-    ProjectHistoryClient.getChangesSince(
-      projectId,
-      version,
-      {},
-      (error, got) => {
-        if (error) throw error
-        expect(got.map(c => Core.Change.fromRaw(c))).to.deep.equal(
-          changes.map(c => Core.Change.fromRaw(c))
-        )
-        done()
-      }
-    )
-  }
-
-  it('should return zero changes since the latest version', function (done) {
-    expectChangesSince(8, [], done)
-  })
-
-  it('should return one change when behind one version', function (done) {
-    expectChangesSince(7, [latestChunk.chunk.history.changes[1]], done)
-  })
-
-  it('should return changes when at the chunk boundary', function (done) {
-    expect(latestChunk.chunk.startVersion).to.equal(6)
-    expectChangesSince(6, latestChunk.chunk.history.changes, done)
-  })
-
-  it('should return changes spanning multiple chunks', function (done) {
-    expectChangesSince(
-      1,
-      [
-        ...firstChunk.chunk.history.changes.slice(1),
-        ...previousChunk.chunk.history.changes,
-        ...latestChunk.chunk.history.changes,
-      ],
-      done
-    )
-  })
-
-  it('should return all changes when going back to the beginning', function (done) {
-    expectChangesSince(
-      0,
-      [
-        ...firstChunk.chunk.history.changes,
-        ...previousChunk.chunk.history.changes,
-        ...latestChunk.chunk.history.changes,
-      ],
-      done
-    )
-  })
-
-  it('should return an error when past the end version', function (done) {
-    ProjectHistoryClient.getChangesSince(
-      projectId,
-      9,
-      { allowErrors: true },
-      (error, body, statusCode) => {
-        if (error) throw error
-        expect(statusCode).to.equal(500)
-        expect(body).to.deep.equal({ message: 'an internal error occurred' })
-        done()
-      }
-    )
-  })
-})
diff --git a/services/project-history/test/acceptance/js/SyncTests.js b/services/project-history/test/acceptance/js/SyncTests.js
index 89e002d4dd..f7420e6cdb 100644
--- a/services/project-history/test/acceptance/js/SyncTests.js
+++ b/services/project-history/test/acceptance/js/SyncTests.js
@@ -1225,7 +1225,7 @@ describe('Syncing with web and doc-updater', function () {
           )
         })
 
-        it('should fix comments in the history store', function (done) {
+        it('should add comments in the history store', function (done) {
           const commentId = 'comment-id'
           const addComment = MockHistoryStore()
             .post(`/api/projects/${historyId}/legacy_changes`, body => {
@@ -1315,6 +1315,1195 @@ describe('Syncing with web and doc-updater', function () {
             }
           )
         })
+
+        it('should add comments in the history store (history-ot)', function (done) {
+          const commentId = 'comment-id'
+          const addComment = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      ranges: [{ pos: 1, length: 10 }],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          ranges: [
+                            {
+                              pos: 1,
+                              length: 10,
+                            },
+                          ],
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                addComment.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should add tracked changes in the history store', function (done) {
+          const fixTrackedChange = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      textOperation: [
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                        1,
+                      ],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    ranges: {
+                      changes: [
+                        {
+                          id: 'id1',
+                          op: {
+                            d: 'a',
+                            p: 0,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                        {
+                          id: 'id2',
+                          op: {
+                            i: '\n',
+                            p: 0,
+                            hpos: 1,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                fixTrackedChange.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should add tracked changes in the history store (history-ot)', function (done) {
+          const fixTrackedChange = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      textOperation: [
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                        1,
+                      ],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      trackedChanges: [
+                        {
+                          range: { pos: 0, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          range: { pos: 1, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                fixTrackedChange.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+      })
+
+      describe("when a doc's ranges are out of sync", function () {
+        const commentId = 'comment-id'
+        beforeEach(function () {
+          MockHistoryStore()
+            .get(`/api/projects/${historyId}/latest/history`)
+            .reply(200, {
+              chunk: {
+                history: {
+                  snapshot: {
+                    files: {
+                      'main.tex': {
+                        hash: '0a207c060e61f3b88eaee0a8cd0696f46fb155eb',
+                        rangesHash: '0a207c060e61f3b88eaee0a8cd0696f46fb155ec',
+                        stringLength: 3,
+                      },
+                    },
+                  },
+                  changes: [],
+                },
+                startVersion: 0,
+              },
+            })
+
+          MockHistoryStore()
+            .get(
+              `/api/projects/${historyId}/blobs/0a207c060e61f3b88eaee0a8cd0696f46fb155eb`
+            )
+            .reply(200, 'a\nb')
+
+          MockHistoryStore()
+            .get(
+              `/api/projects/${historyId}/blobs/0a207c060e61f3b88eaee0a8cd0696f46fb155ec`
+            )
+            .reply(
+              200,
+              JSON.stringify({
+                comments: [{ id: commentId, ranges: [{ pos: 0, length: 3 }] }],
+                trackedChanges: [
+                  {
+                    range: { pos: 0, length: 1 },
+                    tracking: {
+                      ts: this.timestamp.toJSON(),
+                      type: 'delete',
+                      userId: 'user-id',
+                    },
+                  },
+                  {
+                    range: { pos: 2, length: 1 },
+                    tracking: {
+                      ts: this.timestamp.toJSON(),
+                      type: 'insert',
+                      userId: 'user-id',
+                    },
+                  },
+                ],
+              })
+            )
+        })
+
+        it('should fix comments in the history store', function (done) {
+          const addComment = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      ranges: [{ pos: 1, length: 2 }],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    ranges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          op: {
+                            c: 'a',
+                            p: 0,
+                            hpos: 1,
+                            hlen: 2,
+                            t: commentId,
+                          },
+                          meta: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                      changes: [
+                        {
+                          id: 'id1',
+                          op: {
+                            d: 'a',
+                            p: 0,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                        {
+                          id: 'id2',
+                          op: {
+                            i: '\n',
+                            p: 1,
+                            hpos: 2,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                addComment.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix resolved state for comments in the history store', function (done) {
+          const addComment = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      resolved: true,
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    resolvedCommentIds: [commentId],
+                    ranges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          op: {
+                            c: 'a',
+                            p: 0,
+                            hpos: 0,
+                            hlen: 3,
+                            t: commentId,
+                          },
+                          meta: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                      changes: [
+                        {
+                          id: 'id1',
+                          op: {
+                            d: 'a',
+                            p: 0,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                        {
+                          id: 'id2',
+                          op: {
+                            i: '\n',
+                            p: 1,
+                            hpos: 2,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                addComment.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix comments in the history store (history-ot)', function (done) {
+          const addComment = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      ranges: [{ pos: 1, length: 2 }],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          ranges: [
+                            {
+                              pos: 1,
+                              length: 2,
+                            },
+                          ],
+                        },
+                      ],
+                      trackedChanges: [
+                        {
+                          range: { pos: 0, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          range: { pos: 2, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                addComment.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix resolved state for comments in the history store (history-ot)', function (done) {
+          const addComment = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      resolved: true,
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          ranges: [
+                            {
+                              pos: 0,
+                              length: 3,
+                            },
+                          ],
+                          resolved: true,
+                        },
+                      ],
+                      trackedChanges: [
+                        {
+                          range: { pos: 0, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          range: { pos: 2, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                addComment.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix tracked changes in the history store', function (done) {
+          const fixTrackedChange = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      textOperation: [
+                        1,
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          r: 1,
+                          tracking: {
+                            type: 'none',
+                          },
+                        },
+                      ],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    ranges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          op: {
+                            c: 'a',
+                            p: 0,
+                            hpos: 0,
+                            hlen: 3,
+                            t: commentId,
+                          },
+                          meta: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                      changes: [
+                        {
+                          id: 'id1',
+                          op: {
+                            d: 'a',
+                            p: 0,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                        {
+                          id: 'id2',
+                          op: {
+                            i: '\n',
+                            p: 0,
+                            hpos: 1,
+                          },
+                          metadata: {
+                            user_id: 'user-id',
+                            ts: this.timestamp,
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                fixTrackedChange.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix tracked changes in the history store (history-ot)', function (done) {
+          const fixTrackedChange = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      textOperation: [
+                        1,
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          r: 1,
+                          tracking: {
+                            type: 'none',
+                          },
+                        },
+                      ],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          ranges: [
+                            {
+                              pos: 0,
+                              length: 3,
+                            },
+                          ],
+                        },
+                      ],
+                      trackedChanges: [
+                        {
+                          range: { pos: 0, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          range: { pos: 1, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                fixTrackedChange.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
+
+        it('should fix both comments and tracked changes in the history store (history-ot)', function (done) {
+          const fixTrackedChange = MockHistoryStore()
+            .post(`/api/projects/${historyId}/legacy_changes`, body => {
+              expect(body).to.deep.equal([
+                // not merged due to comment operation using history-ot and tracked-changes operation using sharejs ot
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      commentId,
+                      ranges: [{ pos: 1, length: 2 }],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+                {
+                  v2Authors: [],
+                  authors: [],
+                  timestamp: this.timestamp.toJSON(),
+                  operations: [
+                    {
+                      pathname: 'main.tex',
+                      textOperation: [
+                        1,
+                        {
+                          r: 1,
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          r: 1,
+                          tracking: {
+                            type: 'none',
+                          },
+                        },
+                      ],
+                    },
+                  ],
+                  origin: { kind: 'test-origin' },
+                },
+              ])
+              return true
+            })
+            .query({ end_version: 0 })
+            .reply(204)
+
+          async.series(
+            [
+              cb => {
+                ProjectHistoryClient.resyncHistory(this.project_id, cb)
+              },
+              cb => {
+                const update = {
+                  projectHistoryId: historyId,
+                  resyncProjectStructure: {
+                    docs: [{ path: '/main.tex' }],
+                    files: [],
+                  },
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                const update = {
+                  path: '/main.tex',
+                  projectHistoryId: historyId,
+                  resyncDocContent: {
+                    content: 'a\nb',
+                    historyOTRanges: {
+                      comments: [
+                        {
+                          id: commentId,
+                          ranges: [
+                            {
+                              pos: 1,
+                              length: 2,
+                            },
+                          ],
+                        },
+                      ],
+                      trackedChanges: [
+                        {
+                          range: { pos: 0, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'delete',
+                            userId: 'user-id',
+                          },
+                        },
+                        {
+                          range: { pos: 1, length: 1 },
+                          tracking: {
+                            ts: this.timestamp.toJSON(),
+                            type: 'insert',
+                            userId: 'user-id',
+                          },
+                        },
+                      ],
+                    },
+                  },
+                  doc: this.doc_id,
+                  meta: {
+                    ts: this.timestamp,
+                  },
+                }
+                ProjectHistoryClient.pushRawUpdate(this.project_id, update, cb)
+              },
+              cb => {
+                ProjectHistoryClient.flushProject(this.project_id, cb)
+              },
+            ],
+            error => {
+              if (error) {
+                return done(error)
+              }
+              assert(
+                fixTrackedChange.isDone(),
+                `/api/projects/${historyId}/changes should have been called`
+              )
+              done()
+            }
+          )
+        })
       })
 
       describe('resyncProjectStructureOnly', function () {
diff --git a/services/project-history/test/acceptance/js/helpers/ProjectHistoryApp.js b/services/project-history/test/acceptance/js/helpers/ProjectHistoryApp.js
index ae453b74f9..6a81221840 100644
--- a/services/project-history/test/acceptance/js/helpers/ProjectHistoryApp.js
+++ b/services/project-history/test/acceptance/js/helpers/ProjectHistoryApp.js
@@ -9,6 +9,7 @@
  * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
  */
 import { app } from '../../../../app/js/server.js'
+import { mongoClient } from '../../../../app/js/mongodb.js'
 
 let running = false
 let initing = false
@@ -29,13 +30,16 @@ export function ensureRunning(callback) {
     if (error != null) {
       throw error
     }
-    running = true
-    return (() => {
-      const result = []
-      for (callback of Array.from(callbacks)) {
-        result.push(callback())
+
+    // Wait for mongo
+    mongoClient.connect(error => {
+      if (error != null) {
+        throw error
       }
-      return result
-    })()
+      running = true
+      for (callback of Array.from(callbacks)) {
+        callback()
+      }
+    })
   })
 }
diff --git a/services/project-history/test/acceptance/js/helpers/ProjectHistoryClient.js b/services/project-history/test/acceptance/js/helpers/ProjectHistoryClient.js
index 7a30b27740..92caa4bd0e 100644
--- a/services/project-history/test/acceptance/js/helpers/ProjectHistoryClient.js
+++ b/services/project-history/test/acceptance/js/helpers/ProjectHistoryClient.js
@@ -108,25 +108,6 @@ export function getFileTreeDiff(projectId, from, to, callback) {
   )
 }
 
-export function getChangesSince(projectId, since, options, callback) {
-  request.get(
-    {
-      url: `http://127.0.0.1:3054/project/${projectId}/changes`,
-      qs: {
-        since,
-      },
-      json: true,
-    },
-    (error, res, body) => {
-      if (error) return callback(error)
-      if (!options.allowErrors) {
-        expect(res.statusCode).to.equal(200)
-      }
-      callback(null, body, res.statusCode)
-    }
-  )
-}
-
 export function getChangesInChunkSince(projectId, since, options, callback) {
   request.get(
     {
diff --git a/services/project-history/test/unit/js/UpdatesManager/UpdatesProcessorTests.js b/services/project-history/test/unit/js/UpdatesManager/UpdatesProcessorTests.js
index 137169bfcf..fcc0918e11 100644
--- a/services/project-history/test/unit/js/UpdatesManager/UpdatesProcessorTests.js
+++ b/services/project-history/test/unit/js/UpdatesManager/UpdatesProcessorTests.js
@@ -6,14 +6,14 @@ import * as Errors from '../../../../app/js/Errors.js'
 const MODULE_PATH = '../../../../app/js/UpdatesProcessor.js'
 
 describe('UpdatesProcessor', function () {
-  before(async function () {
+  beforeEach(async function () {
     this.extendLock = sinon.stub()
     this.BlobManager = {
       createBlobsForUpdates: sinon.stub(),
     }
     this.HistoryStoreManager = {
       getMostRecentVersion: sinon.stub(),
-      sendChanges: sinon.stub().yields(),
+      sendChanges: sinon.stub().yields(null, { resyncNeeded: true }),
     }
     this.LockManager = {
       runWithLock: sinon.spy((key, runner, callback) =>
@@ -22,7 +22,7 @@ describe('UpdatesProcessor', function () {
     }
     this.RedisManager = {}
     this.UpdateCompressor = {
-      compressRawUpdates: sinon.stub(),
+      compressRawUpdatesWithMetricsCb: sinon.stub(),
     }
     this.UpdateTranslator = {
       convertToChanges: sinon.stub(),
@@ -109,7 +109,7 @@ describe('UpdatesProcessor', function () {
       this.queueSize = 445
       this.UpdatesProcessor._mocks._countAndProcessUpdates = sinon
         .stub()
-        .callsArgWith(3, this.error, this.queueSize)
+        .callsArgWith(3, this.error, { queueSize: this.queueSize })
     })
 
     describe('when there is no existing error', function () {
@@ -299,7 +299,10 @@ describe('UpdatesProcessor', function () {
         null,
         this.expandedUpdates
       )
-      this.UpdateCompressor.compressRawUpdates.returns(this.compressedUpdates)
+      this.UpdateCompressor.compressRawUpdatesWithMetricsCb.yields(
+        null,
+        this.compressedUpdates
+      )
       this.BlobManager.createBlobsForUpdates.callsArgWith(
         4,
         null,
@@ -315,8 +318,8 @@ describe('UpdatesProcessor', function () {
           this.ol_project_id,
           this.rawUpdates,
           this.extendLock,
-          err => {
-            this.callback(err)
+          (err, flushResponse) => {
+            this.callback(err, flushResponse)
             done()
           }
         )
@@ -347,7 +350,7 @@ describe('UpdatesProcessor', function () {
       })
 
       it('should compress updates', function () {
-        this.UpdateCompressor.compressRawUpdates.should.have.been.calledWith(
+        this.UpdateCompressor.compressRawUpdatesWithMetricsCb.should.have.been.calledWith(
           this.expandedUpdates
         )
       })
@@ -382,8 +385,74 @@ describe('UpdatesProcessor', function () {
         )
       })
 
-      it('should call the callback with no error', function () {
-        this.callback.should.have.been.called
+      it('should call the callback with no error and flush response', function () {
+        this.callback.should.have.been.calledWith(null, { resyncNeeded: true })
+      })
+    })
+
+    describe('no updates', function () {
+      beforeEach(function (done) {
+        this.SyncManager.skipUpdatesDuringSync.yields(
+          null,
+          [],
+          this.newSyncState
+        )
+        this.UpdatesProcessor._processUpdates(
+          this.project_id,
+          this.ol_project_id,
+          this.rawUpdates,
+          this.extendLock,
+          (err, flushResponse) => {
+            this.callback(err, flushResponse)
+            done()
+          }
+        )
+      })
+
+      it('should not get the latest version id', function () {
+        this.HistoryStoreManager.getMostRecentVersion.should.not.have.been.calledWith(
+          this.project_id,
+          this.ol_project_id
+        )
+      })
+
+      it('should skip updates when resyncing', function () {
+        this.SyncManager.skipUpdatesDuringSync.should.have.been.calledWith(
+          this.project_id,
+          this.rawUpdates
+        )
+      })
+
+      it('should not expand sync updates', function () {
+        this.SyncManager.expandSyncUpdates.should.not.have.been.called
+      })
+
+      it('should not compress updates', function () {
+        this.UpdateCompressor.compressRawUpdatesWithMetricsCb.should.not.have
+          .been.called
+      })
+
+      it('should not create any blobs for the updates', function () {
+        this.BlobManager.createBlobsForUpdates.should.not.have.been.called
+      })
+
+      it('should not convert the updates into a change requests', function () {
+        this.UpdateTranslator.convertToChanges.should.not.have.been.called
+      })
+
+      it('should not send the change request to the history store', function () {
+        this.HistoryStoreManager.sendChanges.should.not.have.been.called
+      })
+
+      it('should set the sync state', function () {
+        this.SyncManager.setResyncState.should.have.been.calledWith(
+          this.project_id,
+          this.newSyncState
+        )
+      })
+
+      it('should call the callback with fake flush response', function () {
+        this.callback.should.have.been.calledWith(null, { resyncNeeded: false })
       })
     })
 
@@ -412,7 +481,7 @@ describe('UpdatesProcessor', function () {
   })
 
   describe('_skipAlreadyAppliedUpdates', function () {
-    before(function () {
+    beforeEach(function () {
       this.UpdateTranslator.isProjectStructureUpdate.callsFake(
         update => update.version != null
       )
@@ -420,7 +489,7 @@ describe('UpdatesProcessor', function () {
     })
 
     describe('with all doc ops in order', function () {
-      before(function () {
+      beforeEach(function () {
         this.updates = [
           { doc: 'id', v: 1 },
           { doc: 'id', v: 2 },
@@ -440,7 +509,7 @@ describe('UpdatesProcessor', function () {
     })
 
     describe('with all project ops in order', function () {
-      before(function () {
+      beforeEach(function () {
         this.updates = [
           { version: 1 },
           { version: 2 },
@@ -460,7 +529,7 @@ describe('UpdatesProcessor', function () {
     })
 
     describe('with all multiple doc and ops in order', function () {
-      before(function () {
+      beforeEach(function () {
         this.updates = [
           { doc: 'id1', v: 1 },
           { doc: 'id1', v: 2 },
@@ -488,64 +557,47 @@ describe('UpdatesProcessor', function () {
     })
 
     describe('with doc ops out of order', function () {
-      before(function () {
+      beforeEach(function () {
         this.updates = [
           { doc: 'id', v: 1 },
           { doc: 'id', v: 2 },
           { doc: 'id', v: 4 },
           { doc: 'id', v: 3 },
         ]
-        this.skipFn = sinon.spy(
-          this.UpdatesProcessor._mocks,
-          '_skipAlreadyAppliedUpdates'
-        )
-        try {
-          this.updatesToApply =
-            this.UpdatesProcessor._skipAlreadyAppliedUpdates(
-              this.project_id,
-              this.updates,
-              { docs: {} }
-            )
-        } catch (error) {}
-      })
-
-      after(function () {
-        this.skipFn.restore()
       })
 
       it('should throw an exception', function () {
-        this.skipFn.threw('OpsOutOfOrderError').should.equal(true)
+        expect(() => {
+          this.UpdatesProcessor._skipAlreadyAppliedUpdates(
+            this.project_id,
+            this.updates,
+            { docs: {} }
+          )
+        }).to.throw(Errors.OpsOutOfOrderError)
       })
     })
 
     describe('with project ops out of order', function () {
-      before(function () {
+      beforeEach(function () {
+        this.UpdateTranslator.isProjectStructureUpdate.callsFake(
+          update => update.version != null
+        )
         this.updates = [
           { version: 1 },
           { version: 2 },
           { version: 4 },
           { version: 3 },
         ]
-        this.skipFn = sinon.spy(
-          this.UpdatesProcessor._mocks,
-          '_skipAlreadyAppliedUpdates'
-        )
-        try {
-          this.updatesToApply =
-            this.UpdatesProcessor._skipAlreadyAppliedUpdates(
-              this.project_id,
-              this.updates,
-              { docs: {} }
-            )
-        } catch (error) {}
-      })
-
-      after(function () {
-        this.skipFn.restore()
       })
 
       it('should throw an exception', function () {
-        this.skipFn.threw('OpsOutOfOrderError').should.equal(true)
+        expect(() => {
+          this.UpdatesProcessor._skipAlreadyAppliedUpdates(
+            this.project_id,
+            this.updates,
+            { docs: {} }
+          )
+        }).to.throw(Errors.OpsOutOfOrderError)
       })
     })
   })
diff --git a/services/real-time/.gitignore b/services/real-time/.gitignore
deleted file mode 100644
index 80bac793a7..0000000000
--- a/services/real-time/.gitignore
+++ /dev/null
@@ -1,5 +0,0 @@
-node_modules
-forever
-
-# managed by dev-environment$ bin/update_build_scripts
-.npmrc
diff --git a/services/real-time/.nvmrc b/services/real-time/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/real-time/.nvmrc
+++ b/services/real-time/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/real-time/Dockerfile b/services/real-time/Dockerfile
index d1f2046895..4fb5283c1e 100644
--- a/services/real-time/Dockerfile
+++ b/services/real-time/Dockerfile
@@ -2,7 +2,7 @@
 # Instead run bin/update_build_scripts from
 # https://github.com/overleaf/internal/
 
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/real-time
 
diff --git a/services/real-time/Makefile b/services/real-time/Makefile
index e9e6a7a067..7d2bcacb77 100644
--- a/services/real-time/Makefile
+++ b/services/real-time/Makefile
@@ -32,12 +32,12 @@ HERE=$(shell pwd)
 MONOREPO=$(shell cd ../../ && pwd)
 # Run the linting commands in the scope of the monorepo.
 # Eslint and prettier (plus some configs) are on the root.
-RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:22.17.0 npm run --silent
 
 RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
 
 # Same but from the top of the monorepo
-RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:22.17.0 npm run --silent
 
 SHELLCHECK_OPTS = \
 	--shell=bash \
diff --git a/services/real-time/app.js b/services/real-time/app.js
index 85b469bf90..a66833d9d9 100644
--- a/services/real-time/app.js
+++ b/services/real-time/app.js
@@ -83,6 +83,44 @@ io.configure(function () {
   io.set('match origin protocol', true)
 
   io.set('transports', ['websocket', 'xhr-polling'])
+
+  if (Settings.allowedCorsOrigins) {
+    // Create a regex for matching origins, allowing wildcard subdomains
+    const allowedCorsOriginsRegex = new RegExp(
+      `^${Settings.allowedCorsOrigins.replaceAll('.', '\\.').replace('://*', '://[^.]+')}(?::443)?$`
+    )
+
+    io.set('origins', function (origin, req) {
+      if (!origin) {
+        // There is no origin or referer header - this is likely a same-site request.
+        logger.warn({ req }, 'No origin or referer header')
+        return true
+      }
+      const normalizedOrigin = URL.parse(origin).origin
+      const originIsValid = allowedCorsOriginsRegex.test(normalizedOrigin)
+
+      if (req.headers.origin) {
+        if (!originIsValid) {
+          logger.warn(
+            { normalizedOrigin, origin, req },
+            'Origin header does not match allowed origins'
+          )
+        }
+        return originIsValid
+      }
+
+      if (!originIsValid) {
+        // There is no Origin header and the Referrer does not satisfy the
+        // constraints. We're going to pass this anyway for now but log it
+        logger.warn(
+          { req, referer: req.headers.referer },
+          'Referrer header does not match allowed origins'
+        )
+      }
+
+      return true
+    })
+  }
 })
 
 // Serve socket.io.js client file from imported dist folder
@@ -227,6 +265,7 @@ function drainAndShutdown(signal) {
 }
 
 Settings.shutDownInProgress = false
+Settings.shutDownScheduled = false
 const shutdownDrainTimeWindow = parseInt(Settings.shutdownDrainTimeWindow, 10)
 if (Settings.shutdownDrainTimeWindow) {
   logger.info({ shutdownDrainTimeWindow }, 'shutdownDrainTimeWindow enabled')
@@ -266,8 +305,16 @@ if (Settings.shutdownDrainTimeWindow) {
         )
       }
       logger.error({ err: error }, 'uncaught exception')
-      if (Settings.errors && Settings.errors.shutdownOnUncaughtError) {
-        drainAndShutdown('SIGABRT')
+      if (
+        Settings.errors?.shutdownOnUncaughtError &&
+        !Settings.shutDownScheduled
+      ) {
+        Settings.shutDownScheduled = true
+        const delay = Math.ceil(
+          Math.random() * 60 * Math.max(io.sockets.clients().length, 1_000)
+        )
+        logger.info({ delay }, 'delaying shutdown on uncaught error')
+        setTimeout(() => drainAndShutdown('SIGABRT'), delay)
       }
     })
   }
diff --git a/services/real-time/app/js/ConnectedUsersManager.js b/services/real-time/app/js/ConnectedUsersManager.js
index 299a4b870a..4ce3dcdcad 100644
--- a/services/real-time/app/js/ConnectedUsersManager.js
+++ b/services/real-time/app/js/ConnectedUsersManager.js
@@ -3,6 +3,7 @@ const Settings = require('@overleaf/settings')
 const logger = require('@overleaf/logger')
 const redis = require('@overleaf/redis-wrapper')
 const OError = require('@overleaf/o-error')
+const Metrics = require('@overleaf/metrics')
 const rclient = redis.createClient(Settings.redis.realtime)
 const Keys = Settings.redis.realtime.key_schema
 
@@ -13,7 +14,25 @@ const FOUR_DAYS_IN_S = ONE_DAY_IN_S * 4
 const USER_TIMEOUT_IN_S = ONE_HOUR_IN_S / 4
 const REFRESH_TIMEOUT_IN_S = 10 // only show clients which have responded to a refresh request in the last 10 seconds
 
+function recordProjectNotEmptySinceMetric(res, status) {
+  const diff = Date.now() / 1000 - parseInt(res, 10)
+  const BUCKETS = [
+    0,
+    ONE_HOUR_IN_S,
+    2 * ONE_HOUR_IN_S,
+    ONE_DAY_IN_S,
+    2 * ONE_DAY_IN_S,
+    7 * ONE_DAY_IN_S,
+    30 * ONE_DAY_IN_S,
+  ]
+  Metrics.histogram('project_not_empty_since', diff, BUCKETS, { status })
+}
+
 module.exports = {
+  countConnectedClients(projectId, callback) {
+    rclient.scard(Keys.clientsInProject({ project_id: projectId }), callback)
+  },
+
   // Use the same method for when a user connects, and when a user sends a cursor
   // update. This way we don't care if the connected_user key has expired when
   // we receive a cursor update.
@@ -23,6 +42,7 @@ module.exports = {
     const multi = rclient.multi()
 
     multi.sadd(Keys.clientsInProject({ project_id: projectId }), clientId)
+    multi.scard(Keys.clientsInProject({ project_id: projectId }))
     multi.expire(
       Keys.clientsInProject({ project_id: projectId }),
       FOUR_DAYS_IN_S
@@ -66,11 +86,17 @@ module.exports = {
       USER_TIMEOUT_IN_S
     )
 
-    multi.exec(function (err) {
+    multi.exec(function (err, res) {
       if (err) {
         err = new OError('problem marking user as connected').withCause(err)
+        return callback(err)
       }
-      callback(err)
+      const [, nConnectedClients] = res
+      Metrics.inc('editing_session_mode', 1, {
+        method: cursorData ? 'update' : 'connect',
+        status: nConnectedClients === 1 ? 'single' : 'multi',
+      })
+      callback(null)
     })
   },
 
@@ -100,6 +126,7 @@ module.exports = {
     logger.debug({ projectId, clientId }, 'marking user as disconnected')
     const multi = rclient.multi()
     multi.srem(Keys.clientsInProject({ project_id: projectId }), clientId)
+    multi.scard(Keys.clientsInProject({ project_id: projectId }))
     multi.expire(
       Keys.clientsInProject({ project_id: projectId }),
       FOUR_DAYS_IN_S
@@ -107,11 +134,58 @@ module.exports = {
     multi.del(
       Keys.connectedUser({ project_id: projectId, client_id: clientId })
     )
-    multi.exec(function (err) {
+    multi.exec(function (err, res) {
       if (err) {
         err = new OError('problem marking user as disconnected').withCause(err)
+        return callback(err)
       }
-      callback(err)
+      const [, nConnectedClients] = res
+      const status =
+        nConnectedClients === 0
+          ? 'empty'
+          : nConnectedClients === 1
+            ? 'single'
+            : 'multi'
+      Metrics.inc('editing_session_mode', 1, {
+        method: 'disconnect',
+        status,
+      })
+      if (status === 'empty') {
+        rclient.getdel(Keys.projectNotEmptySince({ projectId }), (err, res) => {
+          if (err) {
+            logger.warn(
+              { err, projectId },
+              'could not collect projectNotEmptySince'
+            )
+          } else if (res) {
+            recordProjectNotEmptySinceMetric(res, status)
+          }
+        })
+      } else {
+        // Only populate projectNotEmptySince when more clients remain connected.
+        const nowInSeconds = Math.ceil(Date.now() / 1000).toString()
+        // We can go back to SET GET after upgrading to redis 7.0+
+        const multi = rclient.multi()
+        multi.get(Keys.projectNotEmptySince({ projectId }))
+        multi.set(
+          Keys.projectNotEmptySince({ projectId }),
+          nowInSeconds,
+          'NX',
+          'EX',
+          31 * ONE_DAY_IN_S
+        )
+        multi.exec((err, res) => {
+          if (err) {
+            logger.warn(
+              { err, projectId },
+              'could not get/set projectNotEmptySince'
+            )
+          } else if (res[0]) {
+            recordProjectNotEmptySinceMetric(res[0], status)
+          }
+        })
+      }
+      callback(null)
     })
   },
 
diff --git a/services/real-time/app/js/DocumentUpdaterManager.js b/services/real-time/app/js/DocumentUpdaterManager.js
index 0a9a12c99d..51b71e8ec0 100644
--- a/services/real-time/app/js/DocumentUpdaterManager.js
+++ b/services/real-time/app/js/DocumentUpdaterManager.js
@@ -19,7 +19,7 @@ const Keys = settings.redis.documentupdater.key_schema
 const DocumentUpdaterManager = {
   getDocument(projectId, docId, fromVersion, callback) {
     const timer = new metrics.Timer('get-document')
-    const url = `${settings.apis.documentupdater.url}/project/${projectId}/doc/${docId}?fromVersion=${fromVersion}`
+    const url = `${settings.apis.documentupdater.url}/project/${projectId}/doc/${docId}?fromVersion=${fromVersion}&historyOTSupport=true`
     logger.debug(
       { projectId, docId, fromVersion },
       'getting doc from document updater'
@@ -48,7 +48,8 @@ const DocumentUpdaterManager = {
           body.version,
           body.ranges,
           body.ops,
-          body.ttlInS
+          body.ttlInS,
+          body.type
         )
       } else if (res.statusCode === 422 && body?.firstVersionInRedis) {
         callback(new ClientRequestedMissingOpsError(422, body))
diff --git a/services/real-time/app/js/HttpApiController.js b/services/real-time/app/js/HttpApiController.js
index 122f1838be..5e75fe3601 100644
--- a/services/real-time/app/js/HttpApiController.js
+++ b/services/real-time/app/js/HttpApiController.js
@@ -1,8 +1,23 @@
 const WebsocketLoadBalancer = require('./WebsocketLoadBalancer')
 const DrainManager = require('./DrainManager')
+const ConnectedUsersManager = require('./ConnectedUsersManager')
 const logger = require('@overleaf/logger')
 
 module.exports = {
+  countConnectedClients(req, res) {
+    const { projectId } = req.params
+    ConnectedUsersManager.countConnectedClients(
+      projectId,
+      (err, nConnectedClients) => {
+        if (err) {
+          logger.err({ err, projectId }, 'count connected clients failed')
+          return res.sendStatus(500)
+        }
+        res.json({ nConnectedClients })
+      }
+    )
+  },
+
   sendMessage(req, res) {
     logger.debug({ message: req.params.message }, 'sending message')
     if (Array.isArray(req.body)) {
diff --git a/services/real-time/app/js/Router.js b/services/real-time/app/js/Router.js
index e907a1b684..943453bc13 100644
--- a/services/real-time/app/js/Router.js
+++ b/services/real-time/app/js/Router.js
@@ -113,6 +113,10 @@ module.exports = Router = {
       bodyParser.json({ limit: '5mb' }),
       HttpApiController.sendMessage
     )
+    app.get(
+      '/project/:projectId/count-connected-clients',
+      HttpApiController.countConnectedClients
+    )
 
     app.post('/drain', HttpApiController.startDrain)
     app.post(
@@ -579,7 +583,6 @@ module.exports = Router = {
             if (err) {
               Router._handleError(callback, err, client, 'applyOtUpdate', {
                 doc_id: docId,
-                update,
               })
             } else {
               callback()
diff --git a/services/real-time/app/js/WebsocketController.js b/services/real-time/app/js/WebsocketController.js
index dec567709a..c0f465a490 100644
--- a/services/real-time/app/js/WebsocketController.js
+++ b/services/real-time/app/js/WebsocketController.js
@@ -8,6 +8,7 @@ const ConnectedUsersManager = require('./ConnectedUsersManager')
 const WebsocketLoadBalancer = require('./WebsocketLoadBalancer')
 const RoomManager = require('./RoomManager')
 const {
+  CodedError,
   JoinLeaveEpochMismatchError,
   NotAuthorizedError,
   NotJoinedError,
@@ -283,7 +284,7 @@ module.exports = WebsocketController = {
             projectId,
             docId,
             fromVersion,
-            function (error, lines, version, ranges, ops, ttlInS) {
+            function (error, lines, version, ranges, ops, ttlInS, type) {
               if (error) {
                 if (error instanceof ClientRequestedMissingOpsError) {
                   emitJoinDocCatchUpMetrics('missing', error.info)
@@ -307,36 +308,53 @@ module.exports = WebsocketController = {
               // See http://ecmanaut.blogspot.co.uk/2006/07/encoding-decoding-utf8-in-javascript.html
               const encodeForWebsockets = text =>
                 unescape(encodeURIComponent(text))
-              const escapedLines = []
-              for (let line of lines) {
-                try {
-                  line = encodeForWebsockets(line)
-                } catch (err) {
-                  OError.tag(err, 'error encoding line uri component', { line })
-                  return callback(err)
+              metrics.inc('client_supports_history_v1_ot', 1, {
+                status: options.supportsHistoryOT ? 'success' : 'failure',
+              })
+              let escapedLines
+              if (type === 'history-ot') {
+                if (!options.supportsHistoryOT) {
+                  RoomManager.leaveDoc(client, docId)
+                  // TODO(24596): ask the user to reload the editor page (via out-of-sync modal when there are pending ops).
+                  return callback(
+                    new CodedError('client does not support history-ot')
+                  )
                 }
-                escapedLines.push(line)
-              }
-              if (options.encodeRanges) {
-                try {
-                  for (const comment of (ranges && ranges.comments) || []) {
-                    if (comment.op.c) {
-                      comment.op.c = encodeForWebsockets(comment.op.c)
-                    }
+                escapedLines = lines
+              } else {
+                escapedLines = []
+                for (let line of lines) {
+                  try {
+                    line = encodeForWebsockets(line)
+                  } catch (err) {
+                    OError.tag(err, 'error encoding line uri component', {
+                      line,
+                    })
+                    return callback(err)
                   }
-                  for (const change of (ranges && ranges.changes) || []) {
-                    if (change.op.i) {
-                      change.op.i = encodeForWebsockets(change.op.i)
+                  escapedLines.push(line)
+                }
+                if (options.encodeRanges) {
+                  try {
+                    for (const comment of (ranges && ranges.comments) || []) {
+                      if (comment.op.c) {
+                        comment.op.c = encodeForWebsockets(comment.op.c)
+                      }
                     }
-                    if (change.op.d) {
-                      change.op.d = encodeForWebsockets(change.op.d)
+                    for (const change of (ranges && ranges.changes) || []) {
+                      if (change.op.i) {
+                        change.op.i = encodeForWebsockets(change.op.i)
+                      }
+                      if (change.op.d) {
+                        change.op.d = encodeForWebsockets(change.op.d)
+                      }
                     }
+                  } catch (err) {
+                    OError.tag(err, 'error encoding range uri component', {
+                      ranges,
+                    })
+                    return callback(err)
                   }
-                } catch (err) {
-                  OError.tag(err, 'error encoding range uri component', {
-                    ranges,
-                  })
-                  return callback(err)
                 }
               }
 
@@ -351,7 +369,7 @@ module.exports = WebsocketController = {
                 },
                 'client joined doc'
               )
-              callback(null, escapedLines, version, ops, ranges)
+              callback(null, escapedLines, version, ops, ranges, type)
             }
           )
         })
diff --git a/services/real-time/buildscript.txt b/services/real-time/buildscript.txt
index 79980f013f..1eb77d9f6b 100644
--- a/services/real-time/buildscript.txt
+++ b/services/real-time/buildscript.txt
@@ -4,6 +4,6 @@ real-time
 --env-add=
 --env-pass-through=
 --esmock-loader=False
---node-version=20.18.2
+--node-version=22.17.0
 --public-repo=False
---script-version=4.5.0
+--script-version=4.7.0
diff --git a/services/real-time/config/settings.defaults.js b/services/real-time/config/settings.defaults.js
index 1cc0c0f107..57b0a50a42 100644
--- a/services/real-time/config/settings.defaults.js
+++ b/services/real-time/config/settings.defaults.js
@@ -38,6 +38,9 @@ const settings = {
         connectedUser({ project_id, client_id }) {
           return `connected_user:{${project_id}}:${client_id}`
         },
+        projectNotEmptySince({ projectId }) {
+          return `projectNotEmptySince:{${projectId}}`
+        },
       },
       maxRetriesPerRequest: parseInt(
         process.env.REAL_TIME_REDIS_MAX_RETRIES_PER_REQUEST ||
@@ -170,6 +173,7 @@ const settings = {
   behindProxy: process.env.BEHIND_PROXY === 'true',
   trustedProxyIps: process.env.TRUSTED_PROXY_IPS,
   keepAliveTimeoutMs: parseInt(process.env.KEEPALIVE_TIMEOUT_MS ?? '5000', 10),
+  allowedCorsOrigins: process.env.REAL_TIME_ALLOWED_CORS_ORIGINS,
 }
 
 // console.log settings.redis
diff --git a/services/real-time/docker-compose.ci.yml b/services/real-time/docker-compose.ci.yml
index ca9813adad..a5a2292e72 100644
--- a/services/real-time/docker-compose.ci.yml
+++ b/services/real-time/docker-compose.ci.yml
@@ -21,6 +21,7 @@ services:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
       POSTGRES_HOST: postgres
@@ -42,7 +43,7 @@ services:
     command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
     user: root
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping="$$(redis-cli ping)" && [ "$$ping" = 'PONG' ]
       interval: 1s
diff --git a/services/real-time/docker-compose.yml b/services/real-time/docker-compose.yml
index 5ff5afe513..a4f019f6be 100644
--- a/services/real-time/docker-compose.yml
+++ b/services/real-time/docker-compose.yml
@@ -6,7 +6,7 @@ version: "2.3"
 
 services:
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/real-time
       - ../../node_modules:/overleaf/node_modules
@@ -21,7 +21,7 @@ services:
     user: node
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/real-time
       - ../../node_modules:/overleaf/node_modules
@@ -30,6 +30,7 @@ services:
     environment:
       ELASTIC_SEARCH_DSN: es:9200
       REDIS_HOST: redis
+      HISTORY_REDIS_HOST: redis
       QUEUES_REDIS_HOST: redis
       ANALYTICS_QUEUES_REDIS_HOST: redis
       MONGO_HOST: mongo
@@ -45,7 +46,7 @@ services:
     command: npm run --silent test:acceptance
 
   redis:
-    image: redis
+    image: redis:7.4.3
     healthcheck:
       test: ping=$$(redis-cli ping) && [ "$$ping" = 'PONG' ]
       interval: 1s
diff --git a/services/real-time/package.json b/services/real-time/package.json
index 33c75ecf9f..a52e0dfcf9 100644
--- a/services/real-time/package.json
+++ b/services/real-time/package.json
@@ -34,7 +34,7 @@
     "lodash": "^4.17.21",
     "proxy-addr": "^2.0.7",
     "request": "^2.88.2",
-    "socket.io": "github:overleaf/socket.io#0.9.19-overleaf-10",
+    "socket.io": "github:overleaf/socket.io#0.9.19-overleaf-12",
     "socket.io-client": "github:overleaf/socket.io-client#0.9.17-overleaf-5"
   },
   "devDependencies": {
diff --git a/services/real-time/test/acceptance/js/ClientTrackingTests.js b/services/real-time/test/acceptance/js/ClientTrackingTests.js
index 415e9ad662..d4b484c0a8 100644
--- a/services/real-time/test/acceptance/js/ClientTrackingTests.js
+++ b/services/real-time/test/acceptance/js/ClientTrackingTests.js
@@ -19,6 +19,80 @@ const FixturesManager = require('./helpers/FixturesManager')
 const async = require('async')
 
 describe('clientTracking', function () {
+  describe('when another logged in user joins a project', function () {
+    before(function (done) {
+      return async.series(
+        [
+          cb => {
+            return FixturesManager.setUpProject(
+              {
+                privilegeLevel: 'owner',
+                project: { name: 'Test Project' },
+              },
+              (error, { user_id: userId, project_id: projectId }) => {
+                if (error) return done(error)
+                this.user_id = userId
+                this.project_id = projectId
+                return cb()
+              }
+            )
+          },
+
+          cb => {
+            return FixturesManager.setUpDoc(
+              this.project_id,
+              { lines: this.lines, version: this.version, ops: this.ops },
+              (e, { doc_id: docId }) => {
+                this.doc_id = docId
+                return cb(e)
+              }
+            )
+          },
+
+          cb => {
+            this.clientA = RealTimeClient.connect(this.project_id, cb)
+          },
+
+          cb => {
+            RealTimeClient.countConnectedClients(
+              this.project_id,
+              (err, body) => {
+                if (err) return cb(err)
+                expect(body).to.deep.equal({ nConnectedClients: 1 })
+                cb()
+              }
+            )
+          },
+
+          cb => {
+            this.clientB = RealTimeClient.connect(this.project_id, cb)
+          },
+        ],
+        done
+      )
+    })
+
+    it('should record the initial state in getConnectedUsers', function (done) {
+      this.clientA.emit('clientTracking.getConnectedUsers', (error, users) => {
+        if (error) return done(error)
+        for (const user of Array.from(users)) {
+          if (user.client_id === this.clientB.publicId) {
+            expect(user.cursorData).to.not.exist
+            return done()
+          }
+        }
+        throw new Error('other user was never found')
+      })
+    })
+    it('should list both clients via HTTP', function (done) {
+      RealTimeClient.countConnectedClients(this.project_id, (err, body) => {
+        if (err) return done(err)
+        expect(body).to.deep.equal({ nConnectedClients: 2 })
+        done()
+      })
+    })
+  })
+
   describe('when a client updates its cursor location', function () {
     before(function (done) {
       return async.series(
diff --git a/services/real-time/test/acceptance/js/JoinDocTests.js b/services/real-time/test/acceptance/js/JoinDocTests.js
index 547691d358..3381526c59 100644
--- a/services/real-time/test/acceptance/js/JoinDocTests.js
+++ b/services/real-time/test/acceptance/js/JoinDocTests.js
@@ -89,6 +89,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -168,6 +169,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -247,6 +249,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -408,6 +411,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -489,6 +493,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -504,7 +509,7 @@ describe('joinDoc', function () {
     })
   })
 
-  return describe('with fromVersion and options', function () {
+  describe('with fromVersion and options', function () {
     before(function (done) {
       this.fromVersion = 36
       this.options = { encodeRanges: true }
@@ -572,6 +577,7 @@ describe('joinDoc', function () {
         this.version,
         this.ops,
         this.ranges,
+        'sharejs-text-ot',
       ])
     })
 
@@ -586,4 +592,139 @@ describe('joinDoc', function () {
       )
     })
   })
+
+  describe('with type=history-ot', function () {
+    before(function (done) {
+      async.series(
+        [
+          cb => {
+            FixturesManager.setUpProject(
+              { privilegeLevel: 'owner' },
+              (e, { project_id: projectId, user_id: userId }) => {
+                this.project_id = projectId
+                this.user_id = userId
+                cb(e)
+              }
+            )
+          },
+
+          cb => {
+            FixturesManager.setUpDoc(
+              this.project_id,
+              {
+                lines: this.lines,
+                version: this.version,
+                ops: this.ops,
+                ranges: this.ranges,
+                type: 'history-ot',
+              },
+              (e, { doc_id: docId }) => {
+                this.doc_id = docId
+                cb(e)
+              }
+            )
+          },
+        ],
+        done
+      )
+    })
+
+    describe('when support is indicated', function () {
+      before(function (done) {
+        MockDocUpdaterServer.getDocument.resetHistory()
+        async.series(
+          [
+            cb => {
+              this.client = RealTimeClient.connect(this.project_id, cb)
+            },
+            cb =>
+              this.client.emit(
+                'joinDoc',
+                this.doc_id,
+                { supportsHistoryOT: true },
+                (error, ...rest) => {
+                  ;[...this.returnedArgs] = Array.from(rest)
+                  cb(error)
+                }
+              ),
+          ],
+          done
+        )
+      })
+
+      it('should get the doc from the doc updater', function () {
+        MockDocUpdaterServer.getDocument
+          .calledWith(this.project_id, this.doc_id, -1)
+          .should.equal(true)
+      })
+
+      it('should return the doc lines, version, ranges and ops', function () {
+        this.returnedArgs.should.deep.equal([
+          this.lines,
+          this.version,
+          this.ops,
+          this.ranges,
+          'history-ot',
+        ])
+      })
+
+      it('should have joined the doc room', function (done) {
+        RealTimeClient.getConnectedClient(
+          this.client.socket.sessionid,
+          (error, client) => {
+            if (error) return done(error)
+            expect(client.rooms).to.deep.equal([this.project_id, this.doc_id])
+            done()
+          }
+        )
+      })
+    })
+
+    describe('when support is not indicated', function () {
+      before(function (done) {
+        MockDocUpdaterServer.getDocument.resetHistory()
+        async.series(
+          [
+            cb => {
+              this.client = RealTimeClient.connect(this.project_id, cb)
+            },
+            cb =>
+              this.client.emit('joinDoc', this.doc_id, (error, ...rest) => {
+                this.error = error
+                ;[...this.returnedArgs] = Array.from(rest)
+                cb()
+              }),
+          ],
+          done
+        )
+      })
+
+      it('should get the doc from the doc updater', function () {
+        MockDocUpdaterServer.getDocument
+          .calledWith(this.project_id, this.doc_id, -1)
+          .should.equal(true)
+      })
+
+      it('should return an error', function () {
+        expect(this.error).to.deep.equal({
+          message: 'client does not support history-ot',
+        })
+      })
+
+      it('should not return the doc lines, version, ranges and ops', function () {
+        this.returnedArgs.should.deep.equal([])
+      })
+
+      it('should leave the doc room again', function (done) {
+        RealTimeClient.getConnectedClient(
+          this.client.socket.sessionid,
+          (error, client) => {
+            if (error) return done(error)
+            expect(client.rooms).to.deep.equal([this.project_id])
+            done()
+          }
+        )
+      })
+    })
+  })
 })
diff --git a/services/real-time/test/acceptance/js/helpers/FixturesManager.js b/services/real-time/test/acceptance/js/helpers/FixturesManager.js
index 1db0c684c1..66e3072532 100644
--- a/services/real-time/test/acceptance/js/helpers/FixturesManager.js
+++ b/services/real-time/test/acceptance/js/helpers/FixturesManager.js
@@ -108,13 +108,17 @@ module.exports = FixturesManager = {
     if (!options.ops) {
       options.ops = ['mock', 'ops']
     }
-    const { doc_id: docId, lines, version, ops, ranges } = options
+    if (!options.type) {
+      options.type = 'sharejs-text-ot'
+    }
+    const { doc_id: docId, lines, version, ops, ranges, type } = options
 
     MockDocUpdaterServer.createMockDoc(projectId, docId, {
       lines,
       version,
       ops,
       ranges,
+      type,
     })
     return MockDocUpdaterServer.run(error => {
       if (error != null) {
diff --git a/services/real-time/test/acceptance/js/helpers/RealTimeClient.js b/services/real-time/test/acceptance/js/helpers/RealTimeClient.js
index 7b53f5d5c4..6cc7001896 100644
--- a/services/real-time/test/acceptance/js/helpers/RealTimeClient.js
+++ b/services/real-time/test/acceptance/js/helpers/RealTimeClient.js
@@ -123,6 +123,16 @@ module.exports = Client = {
     )
   },
 
+  countConnectedClients(projectId, callback) {
+    request.get(
+      {
+        url: `http://127.0.0.1:3026/project/${projectId}/count-connected-clients`,
+        json: true,
+      },
+      (error, response, data) => callback(error, data)
+    )
+  },
+
   getConnectedClient(clientId, callback) {
     if (callback == null) {
       callback = function () {}
diff --git a/services/real-time/test/unit/js/ConnectedUsersManagerTests.js b/services/real-time/test/unit/js/ConnectedUsersManagerTests.js
index 9026d0bb42..a6864075e0 100644
--- a/services/real-time/test/unit/js/ConnectedUsersManagerTests.js
+++ b/services/real-time/test/unit/js/ConnectedUsersManagerTests.js
@@ -20,6 +20,7 @@ const tk = require('timekeeper')
 
 describe('ConnectedUsersManager', function () {
   beforeEach(function () {
+    tk.freeze(new Date())
     this.settings = {
       redis: {
         realtime: {
@@ -30,12 +31,18 @@ describe('ConnectedUsersManager', function () {
             connectedUser({ project_id: projectId, client_id: clientId }) {
               return `connected_user:${projectId}:${clientId}`
             },
+            projectNotEmptySince({ projectId }) {
+              return `projectNotEmptySince:{${projectId}}`
+            },
           },
         },
       },
     }
     this.rClient = {
       auth() {},
+      getdel: sinon.stub(),
+      scard: sinon.stub(),
+      set: sinon.stub(),
       setex: sinon.stub(),
       sadd: sinon.stub(),
       get: sinon.stub(),
@@ -50,11 +57,15 @@ describe('ConnectedUsersManager', function () {
         return this.rClient
       },
     }
-    tk.freeze(new Date())
+    this.Metrics = {
+      inc: sinon.stub(),
+      histogram: sinon.stub(),
+    }
 
     this.ConnectedUsersManager = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/settings': this.settings,
+        '@overleaf/metrics': this.Metrics,
         '@overleaf/redis-wrapper': {
           createClient: () => {
             return this.rClient
@@ -83,7 +94,7 @@ describe('ConnectedUsersManager', function () {
 
   describe('updateUserPosition', function () {
     beforeEach(function () {
-      return this.rClient.exec.callsArgWith(0)
+      this.rClient.exec.yields(null, [1, 1])
     })
 
     it('should set a key with the date and give it a ttl', function (done) {
@@ -240,7 +251,7 @@ describe('ConnectedUsersManager', function () {
       )
     })
 
-    return it('should set the cursor position when provided', function (done) {
+    it('should set the cursor position when provided', function (done) {
       return this.ConnectedUsersManager.updateUserPosition(
         this.project_id,
         this.client_id,
@@ -259,11 +270,72 @@ describe('ConnectedUsersManager', function () {
         }
       )
     })
+
+    describe('editing_session_mode', function () {
+      const cases = {
+        'should bump the metric when connecting to empty room': {
+          nConnectedClients: 1,
+          cursorData: null,
+          labels: {
+            method: 'connect',
+            status: 'single',
+          },
+        },
+        'should bump the metric when connecting to non-empty room': {
+          nConnectedClients: 2,
+          cursorData: null,
+          labels: {
+            method: 'connect',
+            status: 'multi',
+          },
+        },
+        'should bump the metric when updating in empty room': {
+          nConnectedClients: 1,
+          cursorData: { row: 42 },
+          labels: {
+            method: 'update',
+            status: 'single',
+          },
+        },
+        'should bump the metric when updating in non-empty room': {
+          nConnectedClients: 2,
+          cursorData: { row: 42 },
+          labels: {
+            method: 'update',
+            status: 'multi',
+          },
+        },
+      }
+
+      for (const [
+        name,
+        { nConnectedClients, cursorData, labels },
+      ] of Object.entries(cases)) {
+        it(name, function (done) {
+          this.rClient.exec.yields(null, [1, nConnectedClients])
+          this.ConnectedUsersManager.updateUserPosition(
+            this.project_id,
+            this.client_id,
+            this.user,
+            cursorData,
+            err => {
+              if (err) return done(err)
+              expect(this.Metrics.inc).to.have.been.calledWith(
+                'editing_session_mode',
+                1,
+                labels
+              )
+              done()
+            }
+          )
+        })
+      }
+    })
   })
 
   describe('markUserAsDisconnected', function () {
     beforeEach(function () {
-      return this.rClient.exec.callsArgWith(0)
+      this.rClient.exec.yields(null, [1, 0])
     })
 
     it('should remove the user from the set', function (done) {
@@ -294,7 +366,7 @@ describe('ConnectedUsersManager', function () {
       )
     })
 
-    return it('should add a ttl to the connected user set so it stays clean', function (done) {
+    it('should add a ttl to the connected user set so it stays clean', function (done) {
       return this.ConnectedUsersManager.markUserAsDisconnected(
         this.project_id,
         this.client_id,
@@ -310,6 +382,161 @@ describe('ConnectedUsersManager', function () {
         }
       )
     })
+
+    describe('editing_session_mode', function () {
+      const cases = {
+        'should bump the metric when disconnecting from now empty room': {
+          nConnectedClients: 0,
+          labels: {
+            method: 'disconnect',
+            status: 'empty',
+          },
+        },
+        'should bump the metric when disconnecting from now single room': {
+          nConnectedClients: 1,
+          labels: {
+            method: 'disconnect',
+            status: 'single',
+          },
+        },
+        'should bump the metric when disconnecting from now multi room': {
+          nConnectedClients: 2,
+          labels: {
+            method: 'disconnect',
+            status: 'multi',
+          },
+        },
+      }
+
+      for (const [name, { nConnectedClients, labels }] of Object.entries(
+        cases
+      )) {
+        it(name, function (done) {
+          this.rClient.exec.yields(null, [1, nConnectedClients])
+          this.ConnectedUsersManager.markUserAsDisconnected(
+            this.project_id,
+            this.client_id,
+            err => {
+              if (err) return done(err)
+              expect(this.Metrics.inc).to.have.been.calledWith(
+                'editing_session_mode',
+                1,
+                labels
+              )
+              done()
+            }
+          )
+        })
+      }
+    })
+
+    describe('projectNotEmptySince', function () {
+      it('should clear the projectNotEmptySince key when empty and skip metric if not set', function (done) {
+        this.rClient.exec.yields(null, [1, 0])
+        this.rClient.getdel.yields(null, '')
+        this.ConnectedUsersManager.markUserAsDisconnected(
+          this.project_id,
+          this.client_id,
+          err => {
+            if (err) return done(err)
+            expect(this.rClient.getdel).to.have.been.calledWith(
+              `projectNotEmptySince:{${this.project_id}}`
+            )
+            expect(this.Metrics.histogram).to.not.have.been.called
+            done()
+          }
+        )
+      })
+      it('should clear the projectNotEmptySince key when empty and record metric if set', function (done) {
+        this.rClient.exec.onFirstCall().yields(null, [1, 0])
+        tk.freeze(1_234_000)
+        this.rClient.getdel.yields(null, '1230')
+        this.ConnectedUsersManager.markUserAsDisconnected(
+          this.project_id,
+          this.client_id,
+          err => {
+            if (err) return done(err)
+            expect(this.rClient.getdel).to.have.been.calledWith(
+              `projectNotEmptySince:{${this.project_id}}`
+            )
+            expect(this.Metrics.histogram).to.have.been.calledWith(
+              'project_not_empty_since',
+              4,
+              sinon.match.any,
+              { status: 'empty' }
+            )
+            done()
+          }
+        )
+      })
+      it('should set projectNotEmptySince key when single and skip metric if not set before', function (done) {
+        this.rClient.exec.onFirstCall().yields(null, [1, 1])
+        tk.freeze(1_233_001) // should ceil up
+        this.rClient.exec.onSecondCall().yields(null, [''])
+        this.ConnectedUsersManager.markUserAsDisconnected(
+          this.project_id,
+          this.client_id,
+          err => {
+            if (err) return done(err)
+            expect(this.rClient.set).to.have.been.calledWith(
+              `projectNotEmptySince:{${this.project_id}}`,
+              '1234',
+              'NX',
+              'EX',
+              31 * 24 * 60 * 60
+            )
+            expect(this.Metrics.histogram).to.not.have.been.called
+            done()
+          }
+        )
+      })
+      const cases = {
+        'should set projectNotEmptySince key when single and record metric if set before':
+          {
+            nConnectedClients: 1,
+            labels: {
+              status: 'single',
+            },
+          },
+        'should set projectNotEmptySince key when multi and record metric if set before':
+          {
+            nConnectedClients: 2,
+            labels: {
+              status: 'multi',
+            },
+          },
+      }
+      for (const [name, { nConnectedClients, labels }] of Object.entries(
+        cases
+      )) {
+        it(name, function (done) {
+          this.rClient.exec.onFirstCall().yields(null, [1, nConnectedClients])
+          tk.freeze(1_235_000)
+          this.rClient.exec.onSecondCall().yields(null, ['1230'])
+          this.ConnectedUsersManager.markUserAsDisconnected(
+            this.project_id,
+            this.client_id,
+            err => {
+              if (err) return done(err)
+              expect(this.rClient.set).to.have.been.calledWith(
+                `projectNotEmptySince:{${this.project_id}}`,
+                '1235',
+                'NX',
+                'EX',
+                31 * 24 * 60 * 60
+              )
+              expect(this.Metrics.histogram).to.have.been.calledWith(
+                'project_not_empty_since',
+                5,
+                sinon.match.any,
+                labels
+              )
+              done()
+            }
+          )
+        })
+      }
+    })
   })
 
   describe('_getConnectedUser', function () {
diff --git a/services/real-time/test/unit/js/DocumentUpdaterManagerTests.js b/services/real-time/test/unit/js/DocumentUpdaterManagerTests.js
index 6dea5401f0..ecf45cd452 100644
--- a/services/real-time/test/unit/js/DocumentUpdaterManagerTests.js
+++ b/services/real-time/test/unit/js/DocumentUpdaterManagerTests.js
@@ -79,7 +79,7 @@ describe('DocumentUpdaterManager', function () {
       })
 
       it('should get the document from the document updater', function () {
-        const url = `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}?fromVersion=${this.fromVersion}`
+        const url = `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}?fromVersion=${this.fromVersion}&historyOTSupport=true`
         return this.request.get.calledWith(url).should.equal(true)
       })
 
diff --git a/services/references/.eslintrc b/services/references/.eslintrc
new file mode 100644
index 0000000000..cc68024d9d
--- /dev/null
+++ b/services/references/.eslintrc
@@ -0,0 +1,6 @@
+{
+  "parserOptions": {
+    "ecmaVersion": 2022,
+    "sourceType": "module"
+  }
+}
diff --git a/services/contacts/.gitignore b/services/references/.gitignore
similarity index 100%
rename from services/contacts/.gitignore
rename to services/references/.gitignore
diff --git a/services/references/.mocharc.json b/services/references/.mocharc.json
new file mode 100644
index 0000000000..dc3280aa96
--- /dev/null
+++ b/services/references/.mocharc.json
@@ -0,0 +1,3 @@
+{
+  "require": "test/setup.js"
+}
diff --git a/services/references/.nvmrc b/services/references/.nvmrc
new file mode 100644
index 0000000000..0254b1e633
--- /dev/null
+++ b/services/references/.nvmrc
@@ -0,0 +1 @@
+20.18.2
diff --git a/services/references/Dockerfile b/services/references/Dockerfile
new file mode 100644
index 0000000000..caa6e2a31c
--- /dev/null
+++ b/services/references/Dockerfile
@@ -0,0 +1,27 @@
+# This file was auto-generated, do not edit it directly.
+# Instead run bin/update_build_scripts from
+# https://github.com/overleaf/internal/
+
+FROM node:20.18.2 AS base
+
+WORKDIR /overleaf/services/references
+
+# Google Cloud Storage needs a writable $HOME/.config for resumable uploads
+# (see https://googleapis.dev/nodejs/storage/latest/File.html#createWriteStream)
+RUN mkdir /home/node/.config && chown node:node /home/node/.config
+
+FROM base AS app
+
+COPY package.json package-lock.json /overleaf/
+COPY services/references/package.json /overleaf/services/references/
+COPY libraries/ /overleaf/libraries/
+COPY patches/ /overleaf/patches/
+
+RUN cd /overleaf && npm ci --quiet
+
+COPY services/references/ /overleaf/services/references/
+
+FROM app
+USER node
+
+CMD ["node", "--expose-gc", "app.js"]
diff --git a/services/references/LICENSE b/services/references/LICENSE
new file mode 100644
index 0000000000..ac8619dcb9
--- /dev/null
+++ b/services/references/LICENSE
@@ -0,0 +1,662 @@
+
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<http://www.gnu.org/licenses/>.
diff --git a/services/references/Makefile b/services/references/Makefile
new file mode 100644
index 0000000000..e5181b46f3
--- /dev/null
+++ b/services/references/Makefile
@@ -0,0 +1,156 @@
+# This file was auto-generated, do not edit it directly.
+# Instead run bin/update_build_scripts from
+# https://github.com/overleaf/internal/
+
+BUILD_NUMBER ?= local
+BRANCH_NAME ?= $(shell git rev-parse --abbrev-ref HEAD)
+PROJECT_NAME = references
+BUILD_DIR_NAME = $(shell pwd | xargs basename | tr -cd '[a-zA-Z0-9_.\-]')
+
+DOCKER_COMPOSE_FLAGS ?= -f docker-compose.yml
+DOCKER_COMPOSE := BUILD_NUMBER=$(BUILD_NUMBER) \
+	BRANCH_NAME=$(BRANCH_NAME) \
+	PROJECT_NAME=$(PROJECT_NAME) \
+	MOCHA_GREP=${MOCHA_GREP} \
+	docker compose ${DOCKER_COMPOSE_FLAGS}
+
+COMPOSE_PROJECT_NAME_TEST_ACCEPTANCE ?= test_acceptance_$(BUILD_DIR_NAME)
+DOCKER_COMPOSE_TEST_ACCEPTANCE = \
+	COMPOSE_PROJECT_NAME=$(COMPOSE_PROJECT_NAME_TEST_ACCEPTANCE) $(DOCKER_COMPOSE)
+
+COMPOSE_PROJECT_NAME_TEST_UNIT ?= test_unit_$(BUILD_DIR_NAME)
+DOCKER_COMPOSE_TEST_UNIT = \
+	COMPOSE_PROJECT_NAME=$(COMPOSE_PROJECT_NAME_TEST_UNIT) $(DOCKER_COMPOSE)
+
+clean:
+	-docker rmi ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
+	-docker rmi us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
+	-$(DOCKER_COMPOSE_TEST_UNIT) down --rmi local
+	-$(DOCKER_COMPOSE_TEST_ACCEPTANCE) down --rmi local
+
+HERE=$(shell pwd)
+MONOREPO=$(shell cd ../../ && pwd)
+# Run the linting commands in the scope of the monorepo.
+# Eslint and prettier (plus some configs) are on the root.
+RUN_LINTING = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(HERE) node:20.18.2 npm run --silent
+
+RUN_LINTING_CI = docker run --rm --volume $(MONOREPO)/.editorconfig:/overleaf/.editorconfig --volume $(MONOREPO)/.eslintignore:/overleaf/.eslintignore --volume $(MONOREPO)/.eslintrc:/overleaf/.eslintrc --volume $(MONOREPO)/.prettierignore:/overleaf/.prettierignore --volume $(MONOREPO)/.prettierrc:/overleaf/.prettierrc --volume $(MONOREPO)/tsconfig.backend.json:/overleaf/tsconfig.backend.json ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) npm run --silent
+
+# Same but from the top of the monorepo
+RUN_LINTING_MONOREPO = docker run --rm -v $(MONOREPO):$(MONOREPO) -w $(MONOREPO) node:20.18.2 npm run --silent
+
+SHELLCHECK_OPTS = \
+	--shell=bash \
+	--external-sources
+SHELLCHECK_COLOR := $(if $(CI),--color=never,--color)
+SHELLCHECK_FILES := { git ls-files "*.sh" -z; git grep -Plz "\A\#\!.*bash"; } | sort -zu
+
+shellcheck:
+	@$(SHELLCHECK_FILES) | xargs -0 -r docker run --rm -v $(HERE):/mnt -w /mnt \
+		koalaman/shellcheck:stable $(SHELLCHECK_OPTS) $(SHELLCHECK_COLOR)
+
+shellcheck_fix:
+	@$(SHELLCHECK_FILES) | while IFS= read -r -d '' file; do \
+		diff=$$(docker run --rm -v $(HERE):/mnt -w /mnt koalaman/shellcheck:stable $(SHELLCHECK_OPTS) --format=diff "$$file" 2>/dev/null); \
+		if [ -n "$$diff" ] && ! echo "$$diff" | patch -p1 >/dev/null 2>&1; then echo "\033[31m$$file\033[0m"; \
+		elif [ -n "$$diff" ]; then echo "$$file"; \
+		else echo "\033[2m$$file\033[0m"; fi \
+	done
+
+format:
+	$(RUN_LINTING) format
+
+format_ci:
+	$(RUN_LINTING_CI) format
+
+format_fix:
+	$(RUN_LINTING) format:fix
+
+lint:
+	$(RUN_LINTING) lint
+
+lint_ci:
+	$(RUN_LINTING_CI) lint
+
+lint_fix:
+	$(RUN_LINTING) lint:fix
+
+typecheck:
+	$(RUN_LINTING) types:check
+
+typecheck_ci:
+	$(RUN_LINTING_CI) types:check
+
+test: format lint typecheck shellcheck test_unit test_acceptance
+
+test_unit:
+ifneq (,$(wildcard test/unit))
+	$(DOCKER_COMPOSE_TEST_UNIT) run --rm test_unit
+	$(MAKE) test_unit_clean
+endif
+
+test_clean: test_unit_clean
+test_unit_clean:
+ifneq (,$(wildcard test/unit))
+	$(DOCKER_COMPOSE_TEST_UNIT) down -v -t 0
+endif
+
+test_acceptance: test_acceptance_clean test_acceptance_pre_run test_acceptance_run
+	$(MAKE) test_acceptance_clean
+
+test_acceptance_debug: test_acceptance_clean test_acceptance_pre_run test_acceptance_run_debug
+	$(MAKE) test_acceptance_clean
+
+test_acceptance_run:
+ifneq (,$(wildcard test/acceptance))
+	$(DOCKER_COMPOSE_TEST_ACCEPTANCE) run --rm test_acceptance
+endif
+
+test_acceptance_run_debug:
+ifneq (,$(wildcard test/acceptance))
+	$(DOCKER_COMPOSE_TEST_ACCEPTANCE) run -p 127.0.0.9:19999:19999 --rm test_acceptance npm run test:acceptance -- --inspect=0.0.0.0:19999 --inspect-brk
+endif
+
+test_clean: test_acceptance_clean
+test_acceptance_clean:
+	$(DOCKER_COMPOSE_TEST_ACCEPTANCE) down -v -t 0
+
+test_acceptance_pre_run:
+ifneq (,$(wildcard test/acceptance/js/scripts/pre-run))
+	$(DOCKER_COMPOSE_TEST_ACCEPTANCE) run --rm test_acceptance test/acceptance/js/scripts/pre-run
+endif
+
+benchmarks:
+	$(DOCKER_COMPOSE_TEST_ACCEPTANCE) run --rm test_acceptance npm run benchmarks
+
+build:
+	docker build \
+		--pull \
+		--build-arg BUILDKIT_INLINE_CACHE=1 \
+		--tag ci/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) \
+		--tag us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER) \
+		--tag us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME) \
+		--cache-from us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):$(BRANCH_NAME) \
+		--cache-from us-east1-docker.pkg.dev/overleaf-ops/ol-docker/$(PROJECT_NAME):main \
+		--file Dockerfile \
+		../..
+
+tar:
+	$(DOCKER_COMPOSE) up tar
+
+publish:
+
+	docker push $(DOCKER_REPO)/$(PROJECT_NAME):$(BRANCH_NAME)-$(BUILD_NUMBER)
+
+
+.PHONY: clean \
+	format format_fix \
+	lint lint_fix \
+	build_types typecheck \
+	lint_ci format_ci typecheck_ci \
+	shellcheck shellcheck_fix \
+	test test_clean test_unit test_unit_clean \
+	test_acceptance test_acceptance_debug test_acceptance_pre_run \
+	test_acceptance_run test_acceptance_run_debug test_acceptance_clean \
+	benchmarks \
+	build tar publish \
diff --git a/services/references/README.md b/services/references/README.md
new file mode 100644
index 0000000000..41844d259a
--- /dev/null
+++ b/services/references/README.md
@@ -0,0 +1,10 @@
+overleaf/references
+===============
+
+An API for providing citation-keys from user bib-files
+
+License
+=======
+The code in this repository is released under the GNU AFFERO GENERAL PUBLIC LICENSE, version 3.
+
+Based on https://github.com/overleaf/overleaf/commit/9964aebc794f9fd7ce1373ab3484f6b33b061af3
diff --git a/services/references/app.js b/services/references/app.js
new file mode 100644
index 0000000000..a7da8720ed
--- /dev/null
+++ b/services/references/app.js
@@ -0,0 +1,40 @@
+import '@overleaf/metrics/initialize.js'
+
+import express from 'express'
+import Settings from '@overleaf/settings'
+import logger from '@overleaf/logger'
+import metrics from '@overleaf/metrics'
+import ReferencesAPIController from './app/js/ReferencesAPIController.js'
+import bodyParser from 'body-parser'
+
+const app = express()
+metrics.injectMetricsRoute(app)
+
+app.use(bodyParser.json({ limit: '2mb' }))
+app.use(metrics.http.monitor(logger))
+
+app.post('/project/:project_id/index', ReferencesAPIController.index)
+app.get('/status', (req, res) => res.send({ status: 'references api is up' }))
+
+const settings =
+  Settings.internal && Settings.internal.references
+    ? Settings.internal.references
+    : undefined
+const host = settings && settings.host ? settings.host : 'localhost'
+const port = settings && settings.port ? settings.port : 3056
+
+logger.debug('Listening at', { host, port })
+
+const server = app.listen(port, host, function (error) {
+  if (error) {
+    throw error
+  }
+  logger.info({ host, port }, 'references HTTP server starting up')
+})
+
+process.on('SIGTERM', () => {
+  server.close(() => {
+    logger.info({ host, port }, 'references HTTP server closed')
+    metrics.close()
+  })
+})
diff --git a/services/references/app/js/ReferencesAPIController.js b/services/references/app/js/ReferencesAPIController.js
new file mode 100644
index 0000000000..ac51ca6bbd
--- /dev/null
+++ b/services/references/app/js/ReferencesAPIController.js
@@ -0,0 +1,42 @@
+import logger from '@overleaf/logger'
+import BibtexParser from './bib2json.js'
+
+export default {
+  async index(req, res) {
+    const { docUrls, fullIndex } = req.body
+    try {
+      const responses = await Promise.all(
+        docUrls.map(async (docUrl) => {
+          try {
+            const response = await fetch(docUrl)
+            if (!response.ok) {
+              throw new Error(`HTTP error! status: ${response.status}`)
+            }
+            return response.text()
+          } catch (error) {
+            logger.error({ error }, "Failed to fetch document from URL: " + docUrl)
+            return null
+          }
+        })
+      )
+      const keys = []
+      for (const body of responses) {
+        if (!body) continue
+
+        try {
+          const parsedEntries = BibtexParser(body).entries
+          const ks = parsedEntries
+            .filter(entry => entry.EntryKey)
+            .map(entry => entry.EntryKey)
+          keys.push(...ks)
+        } catch (error) {
+          logger.error({ error }, "bib file skipped.")
+        }
+      }
+      res.status(200).json({ keys })
+    } catch (error) {
+      logger.error({ error }, "Unexpected error during indexing process.")
+      res.status(500).json({ error: "Failed to process bib files." })
+    }
+  }
+}
diff --git a/services/references/app/js/bib2json.js b/services/references/app/js/bib2json.js
new file mode 100644
index 0000000000..99cfcf70ee
--- /dev/null
+++ b/services/references/app/js/bib2json.js
@@ -0,0 +1,1967 @@
+/* eslint-disable */
+/**
+ * Parser.js
+ * Copyright 2012-13 Mayank Lahiri
+ * mlahiri@gmail.com
+ * Released under the BSD License.
+ *
+ * Modifications 2016 Sharelatex
+ * Modifications 2017-2020 Overleaf
+ *
+ * A forgiving Bibtex parser that can:
+ *
+ * (1) operate in streaming or block mode, extracting entries as dictionaries.
+ * (2) convert Latex special characters to UTF-8.
+ * (3) best-effort parse malformed entries.
+ * (4) run in a CommonJS environment or a browser, without any dependencies.
+ * (5) be advanced-compiled by Google Closure Compiler.
+ *
+ * Handwritten as a labor of love, not auto-generated from a grammar.
+ *
+ * Modes of usage:
+ *
+ * (1) Synchronous, string
+ *
+ *   var entries = BibtexParser(text);
+ *   console.log(entries);
+ *
+ * (2) Asynchronous, stream
+ *
+ *   function entryCallback(entry) { console.log(entry); }
+ *   var parser = new BibtexParser(entryCallback);
+ *   parser.parse(chunk1);
+ *   parser.parse(chunk2);
+ *   ...
+ *
+ * @param {text|function(Object)} arg0 Either a Bibtex string or callback
+ *                                    function for processing parsed entries.
+ * @param {array} allowedKeys optimization: do not output key/value pairs that are not on this allowlist
+ * @constructor
+ */
+function BibtexParser(arg0, allowedKeys) {
+  // Determine how this function is to be used
+  if (typeof arg0 === 'string') {
+    // Passed a string, synchronous call without 'new'
+    const entries = []
+    function accumulator(entry) {
+      entries.push(entry)
+    }
+    const parser = new BibtexParser(accumulator, allowedKeys)
+    parser.parse(arg0)
+    return {
+      entries,
+      errors: parser.getErrors(),
+    }
+  }
+  if (typeof arg0 !== 'function') {
+    throw 'Invalid parser construction.'
+  }
+  this.ALLOWEDKEYS_ = allowedKeys || []
+  this.reset_(arg0)
+  this.initMacros_()
+  return this
+}
+
+/** @enum {number} */
+BibtexParser.prototype.STATES_ = {
+  ENTRY_OR_JUNK: 0,
+  OBJECT_TYPE: 1,
+  ENTRY_KEY: 2,
+  KV_KEY: 3,
+  EQUALS: 4,
+  KV_VALUE: 5,
+}
+BibtexParser.prototype.reset_ = function (arg0) {
+  /** @private */ this.DATA_ = {}
+  /** @private */ this.CALLBACK_ = arg0
+  /** @private */ this.CHAR_ = 0
+  /** @private */ this.LINE_ = 1
+  /** @private */ this.CHAR_IN_LINE_ = 0
+  /** @private */ this.SKIPWS_ = true
+  /** @private */ this.SKIPCOMMENT_ = true
+  /** @private */ this.SKIPKVPAIR_ = false
+  /** @private */ this.PARSETMP_ = {}
+  /** @private */ this.SKIPTILLEOL_ = false
+  /** @private */ this.VALBRACES_ = null
+  /** @private */ this.BRACETYPE_ = null
+  /** @private */ this.BRACECOUNT_ = 0
+  /** @private */ this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+  /** @private */ this.ERRORS_ = []
+}
+/** @private */ BibtexParser.prototype.ENTRY_TYPES_ = {
+  inproceedings: 1,
+  proceedings: 2,
+  article: 3,
+  techreport: 4,
+  misc: 5,
+  mastersthesis: 6,
+  book: 7,
+  phdthesis: 8,
+  incollection: 9,
+  unpublished: 10,
+  inbook: 11,
+  manual: 12,
+  periodical: 13,
+  booklet: 14,
+  masterthesis: 15,
+  conference: 16,
+  /* additional fields from biblatex */
+  artwork: 17,
+  audio: 18,
+  bibnote: 19,
+  bookinbook: 20,
+  collection: 21,
+  commentary: 22,
+  customa: 23,
+  customb: 24,
+  customc: 25,
+  customd: 26,
+  custome: 27,
+  customf: 28,
+  image: 29,
+  inreference: 30,
+  jurisdiction: 31,
+  legal: 32,
+  legislation: 33,
+  letter: 34,
+  movie: 35,
+  music: 36,
+  mvbook: 37,
+  mvcollection: 38,
+  mvproceedings: 39,
+  mvreference: 40,
+  online: 41,
+  patent: 42,
+  performance: 43,
+  reference: 44,
+  report: 45,
+  review: 46,
+  set: 47,
+  software: 48,
+  standard: 49,
+  suppbook: 50,
+  suppcollection: 51,
+  thesis: 52,
+  video: 53,
+}
+BibtexParser.prototype.initMacros_ = function () {
+  // macros can be extended by the user via
+  //   @string { macroName = "macroValue" }
+  /** @private */ this.MACROS_ = {
+    jan: 'January',
+    feb: 'February',
+    mar: 'March',
+    apr: 'April',
+    may: 'May',
+    jun: 'June',
+    jul: 'July',
+    aug: 'August',
+    sep: 'September',
+    oct: 'October',
+    nov: 'November',
+    dec: 'December',
+    Jan: 'January',
+    Feb: 'February',
+    Mar: 'March',
+    Apr: 'April',
+    May: 'May',
+    Jun: 'June',
+    Jul: 'July',
+    Aug: 'August',
+    Sep: 'September',
+    Oct: 'October',
+    Nov: 'November',
+    Dec: 'December',
+  }
+}
+
+/**
+ * Gets an array of all errors encountered during parsing.
+ * Array entries are of the format:
+ *  [ line number, character in line, character in stream, error text ]
+ *
+ * @returns Array<Array>
+ * @public
+ */
+BibtexParser.prototype.getErrors = function () {
+  return this.ERRORS_
+}
+
+/**
+ * Processes a chunk of data
+ * @public
+ */
+BibtexParser.prototype.parse = function (chunk) {
+  for (let i = 0; i < chunk.length; i++) this.processCharacter_(chunk[i])
+}
+
+/**
+ * Logs error at current stream position.
+ *
+ * @private
+ */
+BibtexParser.prototype.error_ = function (text) {
+  this.ERRORS_.push([this.LINE_, this.CHAR_IN_LINE_, this.CHAR_, text])
+}
+
+/**
+ * Called after an entire entry has been parsed from the stream.
+ * Performs post-processing and invokes the entry callback pointed to by
+ * this.CALLBACK_. Parsed (but unprocessed) entry data is in this.DATA_.
+ */
+BibtexParser.prototype.processEntry_ = function () {
+  const data = this.DATA_
+  if (data.Fields)
+    for (const f in data.Fields) {
+      let raw = data.Fields[f]
+
+      // Convert Latex/Bibtex special characters to UTF-8 equivalents
+      for (let i = 0; i < this.CHARCONV_.length; i++) {
+        const re = this.CHARCONV_[i][0]
+        const rep = this.CHARCONV_[i][1]
+        raw = raw.replace(re, rep)
+      }
+
+      // Basic substitutions
+      raw = raw
+        .replace(/[\n\r\t]/g, ' ')
+        .replace(/\s\s+/g, ' ')
+        .replace(/^\s+|\s+$/g, '')
+
+      // Remove braces and backslashes
+      const len = raw.length
+      let processedArr = []
+      for (let i = 0; i < len; i++) {
+        let c = raw[i]
+        let skip = false
+        if (c == '\\' && i < len - 1) c = raw[++i]
+        else {
+          if (c == '{' || c == '}') skip = true
+        }
+        if (!skip) processedArr.push(c)
+      }
+      data.Fields[f] = processedArr.join('')
+      processedArr = null
+    }
+
+  if (data.ObjectType == 'string') {
+    for (const f in data.Fields) {
+      this.MACROS_[f] = data.Fields[f]
+    }
+  } else {
+    // Parsed a new Bibtex entry
+    this.CALLBACK_(data)
+  }
+}
+
+/**
+ * Processes next character in the stream, invoking the callback after
+ * each entry has been found and processed.
+ *
+ * @private
+ * @param {string} c Next character in input stream
+ */
+BibtexParser.prototype.processCharacter_ = function (c) {
+  // Housekeeping
+  this.CHAR_++
+  this.CHAR_IN_LINE_++
+  if (c == '\n') {
+    this.LINE_++
+    this.CHAR_IN_LINE_ = 1
+  }
+
+  // Convenience states for skipping whitespace when needed
+  if (this.SKIPTILLEOL_) {
+    if (c == '\n') this.SKIPTILLEOL_ = false
+    return
+  }
+  if (this.SKIPCOMMENT_ && c == '%') {
+    this.SKIPTILLEOL_ = true
+    return
+  }
+  if (this.SKIPWS_ && /\s/.test(c)) return
+  this.SKIPWS_ = false
+  this.SKIPCOMMENT_ = false
+  this.SKIPTILLEOL_ = false
+
+  // Main state machine
+  let AnotherIteration = true
+  while (AnotherIteration) {
+    // console.log(this.LINE_, this.CHAR_IN_LINE_, this.STATE_, c)
+    AnotherIteration = false
+    switch (this.STATE_) {
+      // -- Scan for an object marker ('@')
+      // -- Reset temporary data structure in case previous entry was garbled
+      case this.STATES_.ENTRY_OR_JUNK:
+        if (c == '@') {
+          // SUCCESS:     Parsed a valid start-of-object marker.
+          // NEXT_STATE:  OBJECT_TYPE
+          this.STATE_ = this.STATES_.OBJECT_TYPE
+          this.DATA_ = {
+            ObjectType: '',
+          }
+        }
+        this.BRACETYPE_ = null
+        this.SKIPWS_ = true
+        this.SKIPCOMMENT_ = true
+        break
+
+      // Start at first non-whitespace character after start-of-object '@'
+      // -- Accept [A-Za-z], break on non-matching character
+      // -- Populate this.DATA_.EntryType and this.DATA_.ObjectType
+      case this.STATES_.OBJECT_TYPE:
+        if (/[A-Za-z]/.test(c)) {
+          this.DATA_.ObjectType += c.toLowerCase()
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+        } else {
+          // Break from state and validate object type
+          const ot = this.DATA_.ObjectType
+          if (ot == 'comment') {
+            this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+          } else {
+            if (ot == 'string') {
+              this.DATA_.ObjectType = ot
+              this.DATA_.Fields = {}
+              this.BRACETYPE_ = c
+              this.BRACECOUNT_ = 1
+              this.STATE_ = this.STATES_.KV_KEY
+              this.SKIPWS_ = true
+              this.SKIPCOMMENT_ = true
+              this.PARSETMP_ = {
+                Key: '',
+              }
+            } else {
+              if (ot == 'preamble') {
+                this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+              } else {
+                if (ot in this.ENTRY_TYPES_) {
+                  // SUCCESS:     Parsed a valid object type.
+                  // NEXT_STATE:  ENTRY_KEY
+                  this.DATA_.ObjectType = 'entry'
+                  this.DATA_.EntryType = ot
+                  this.DATA_.EntryKey = ''
+                  this.STATE_ = this.STATES_.ENTRY_KEY
+                  AnotherIteration = true
+                } else {
+                  // ERROR:       Unrecognized object type.
+                  // NEXT_STATE:  ENTRY_OR_JUNK
+                  this.error_(
+                    'Unrecognized object type: "' + this.DATA_.ObjectType + '"'
+                  )
+                  this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+                }
+              }
+            }
+          }
+        }
+        break
+
+      // Start at first non-alphabetic character after an entry type
+      // -- Populate this.DATA_.EntryKey
+      case this.STATES_.ENTRY_KEY:
+        if ((c === '{' || c === '(') && this.BRACETYPE_ == null) {
+          this.BRACETYPE_ = c
+          this.BRACECOUNT_ = 1
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+          break
+        }
+        if (/[,%\s]/.test(c)) {
+          if (this.DATA_.EntryKey.length < 1) {
+            // Skip comments and whitespace before entry key
+            this.SKIPWS_ = true
+            this.SKIPCOMMENT_ = true
+          } else {
+            if (this.BRACETYPE_ == null) {
+              // ERROR:       No opening brace for object
+              // NEXT_STATE:  ENTRY_OR_JUNK
+              this.error_('No opening brace for object.')
+              this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+            } else {
+              // SUCCESS:     Parsed an entry key
+              // NEXT_STATE:  KV_KEY
+              this.SKIPWS_ = true
+              this.SKIPCOMMENT_ = true
+              AnotherIteration = true
+              this.STATE_ = this.STATES_.KV_KEY
+              this.PARSETMP_.Key = ''
+              this.DATA_.Fields = {}
+            }
+          }
+        } else {
+          this.DATA_.EntryKey += c
+          this.SKIPWS_ = false
+          this.SKIPCOMMENT_ = false
+        }
+        break
+
+      // Start at first non-whitespace/comment character after entry key.
+      // -- Populate this.PARSETMP_.Key
+      case this.STATES_.KV_KEY:
+        // Test for end of entry
+        if (
+          (c == '}' && this.BRACETYPE_ == '{') ||
+          (c == ')' && this.BRACETYPE_ == '(')
+        ) {
+          // SUCCESS:       Parsed an entry, possible incomplete
+          // NEXT_STATE:    ENTRY_OR_JUNK
+          this.processEntry_()
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+          this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+          break
+        }
+        if (/[\-A-Za-z:]/.test(c)) {
+          // Add to key
+          this.PARSETMP_.Key += c
+          this.SKIPWS_ = false
+          this.SKIPCOMMENT_ = false
+        } else {
+          // Either end of key or we haven't encountered start of key
+          if (this.PARSETMP_.Key.length < 1) {
+            // Keep going till we see a key
+            this.SKIPWS_ = true
+            this.SKIPCOMMENT_ = true
+          } else {
+            // SUCCESS:       Found full key in K/V pair
+            // NEXT_STATE:    EQUALS
+            this.SKIPWS_ = true
+            this.SKIPCOMMENT_ = true
+            this.STATE_ = this.STATES_.EQUALS
+            AnotherIteration = true
+
+            if (this.DATA_.ObjectType !== 'string') {
+              // this entry is not a macro
+              // normalize the key to lower case
+              this.PARSETMP_.Key = this.PARSETMP_.Key.toLowerCase()
+
+              // optimization: skip key/value pairs that are not on the allowlist
+              this.SKIPKVPAIR_ =
+                // has allowedKeys set
+                this.ALLOWEDKEYS_.length &&
+                // key is not on the allowlist
+                this.ALLOWEDKEYS_.indexOf(this.PARSETMP_.Key) === -1
+            } else {
+              this.SKIPKVPAIR_ = false
+            }
+          }
+        }
+        break
+
+      // Start at first non-alphabetic character after K/V pair key.
+      case this.STATES_.EQUALS:
+        if (
+          (c == '}' && this.BRACETYPE_ == '{') ||
+          (c == ')' && this.BRACETYPE_ == '(')
+        ) {
+          // ERROR:         K/V pair with key but no value
+          // NEXT_STATE:    ENTRY_OR_JUNK
+          this.error_(
+            'Key-value pair has key "' + this.PARSETMP_.Key + '", but no value.'
+          )
+          this.processEntry_()
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+          this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+          break
+        }
+        if (c == '=') {
+          // SUCCESS:       found an equal signs separating key and value
+          // NEXT_STATE:    KV_VALUE
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+          this.STATE_ = this.STATES_.KV_VALUE
+          this.PARSETMP_.Value = []
+          this.VALBRACES_ = { '"': [], '{': [] }
+        }
+        break
+
+      // Start at first non-whitespace/comment character after '='
+      // -- Populate this.PARSETMP_.Value
+      case this.STATES_.KV_VALUE:
+        const delim = this.VALBRACES_
+        // valueCharsArray is the list of characters that make up the
+        // current value
+        const valueCharsArray = this.PARSETMP_.Value
+        let doneParsingValue = false
+
+        // Test for special characters
+        if (c == '"' || c == '{' || c == '}' || c == ',') {
+          if (c == ',') {
+            // This comma can mean:
+            // (1) just another comma literal
+            // (2) end of a macro reference
+            if (delim['"'].length + delim['{'].length === 0) {
+              // end of a macro reference
+              const macro = this.PARSETMP_.Value.join('').trim()
+              if (macro in this.MACROS_) {
+                // Successful macro reference
+                this.PARSETMP_.Value = [this.MACROS_[macro]]
+              } else {
+                // Reference to an undefined macro
+                this.error_('Reference to an undefined macro: ' + macro)
+              }
+              doneParsingValue = true
+            }
+          }
+          if (c == '"') {
+            // This quote can mean:
+            // (1) opening delimiter
+            // (2) closing delimiter
+            // (3) literal, if we have a '{' on the stack
+            if (delim['"'].length + delim['{'].length === 0) {
+              // opening delimiter
+              delim['"'].push(this.CHAR_)
+              this.SKIPWS_ = false
+              this.SKIPCOMMENT_ = false
+              break
+            }
+            if (
+              delim['"'].length == 1 &&
+              delim['{'].length == 0 &&
+              (valueCharsArray.length == 0 ||
+                valueCharsArray[valueCharsArray.length - 1] != '\\')
+            ) {
+              // closing delimiter
+              doneParsingValue = true
+            } else {
+              // literal, add to value
+            }
+          }
+          if (c == '{') {
+            // This brace can mean:
+            // (1) opening delimiter
+            // (2) stacked verbatim delimiter
+            if (
+              valueCharsArray.length == 0 ||
+              valueCharsArray[valueCharsArray.length - 1] != '\\'
+            ) {
+              delim['{'].push(this.CHAR_)
+              this.SKIPWS_ = false
+              this.SKIPCOMMENT_ = false
+            } else {
+              // literal, add to value
+            }
+          }
+          if (c == '}') {
+            // This brace can mean:
+            // (1) closing delimiter
+            // (2) closing stacked verbatim delimiter
+            // (3) end of object definition if value was a macro
+            if (delim['"'].length + delim['{'].length === 0) {
+              // end of object definition, after macro
+              const macro = this.PARSETMP_.Value.join('').trim()
+              if (macro in this.MACROS_) {
+                // Successful macro reference
+                this.PARSETMP_.Value = [this.MACROS_[macro]]
+              } else {
+                // Reference to an undefined macro
+                this.error_('Reference to an undefined macro: ' + macro)
+              }
+              AnotherIteration = true
+              doneParsingValue = true
+            } else {
+              // sometimes imported bibs will have {\},{\\}, {\\\}, {\\\\}, etc for whitespace,
+              //  which would otherwise break the parsing. we watch for these occurences of
+              //  1+ backslashes in an empty bracket pair to gracefully handle the malformed bib file
+              const doubleSlash =
+                valueCharsArray.length >= 2 &&
+                valueCharsArray[valueCharsArray.length - 1] === '\\' && // for \\}
+                valueCharsArray[valueCharsArray.length - 2] === '\\'
+              const singleSlash =
+                valueCharsArray.length >= 2 &&
+                valueCharsArray[valueCharsArray.length - 1] === '\\' && // for {\}
+                valueCharsArray[valueCharsArray.length - 2] === '{'
+
+              if (
+                valueCharsArray.length == 0 ||
+                valueCharsArray[valueCharsArray.length - 1] != '\\' || // for }
+                doubleSlash ||
+                singleSlash
+              ) {
+                if (delim['{'].length > 0) {
+                  // pop stack for stacked verbatim delimiter
+                  delim['{'].splice(delim['{'].length - 1, 1)
+                  if (delim['{'].length + delim['"'].length == 0) {
+                    // closing delimiter
+                    doneParsingValue = true
+                  } else {
+                    // end verbatim block
+                  }
+                }
+              } else {
+                // literal, add to value
+              }
+            }
+          }
+        }
+
+        // If here, then we are either done parsing the value or
+        // have a literal that should be added to the value.
+        if (doneParsingValue) {
+          // SUCCESS:     value parsed
+          // NEXT_STATE:  KV_KEY
+          this.SKIPWS_ = true
+          this.SKIPCOMMENT_ = true
+          this.STATE_ = this.STATES_.KV_KEY
+          if (!this.SKIPKVPAIR_) {
+            this.DATA_.Fields[this.PARSETMP_.Key] =
+              this.PARSETMP_.Value.join('')
+          }
+          this.PARSETMP_ = { Key: '' }
+          this.VALBRACES_ = null
+        } else {
+          this.PARSETMP_.Value.push(c)
+          if (this.PARSETMP_.Value.length >= 1000 * 20) {
+            this.PARSETMP_.Value = []
+            this.STATE_ = this.STATES_.ENTRY_OR_JUNK
+            this.DATA_ = { ObjectType: '' }
+            this.BRACETYPE_ = null
+            this.SKIPWS_ = true
+            this.SKIPCOMMENT_ = true
+          }
+        }
+        break
+    } // end switch (this.STATE_)
+  } // end while(AnotherIteration)
+} // end function processCharacter
+
+/** @private */ BibtexParser.prototype.CHARCONV_ = [
+  [/\\space /g, '\u0020'],
+  [/\\textdollar /g, '\u0024'],
+  [/\\textquotesingle /g, '\u0027'],
+  [/\\ast /g, '\u002A'],
+  [/\\textbackslash /g, '\u005C'],
+  [/\\\^\{\}/g, '\u005E'],
+  [/\\textasciigrave /g, '\u0060'],
+  [/\\lbrace /g, '\u007B'],
+  [/\\vert /g, '\u007C'],
+  [/\\rbrace /g, '\u007D'],
+  [/\\textasciitilde /g, '\u007E'],
+  [/\\textexclamdown /g, '\u00A1'],
+  [/\\textcent /g, '\u00A2'],
+  [/\\textsterling /g, '\u00A3'],
+  [/\\textcurrency /g, '\u00A4'],
+  [/\\textyen /g, '\u00A5'],
+  [/\\textbrokenbar /g, '\u00A6'],
+  [/\\textsection /g, '\u00A7'],
+  [/\\textasciidieresis /g, '\u00A8'],
+  [/\\textcopyright /g, '\u00A9'],
+  [/\\textordfeminine /g, '\u00AA'],
+  [/\\guillemotleft /g, '\u00AB'],
+  [/\\lnot /g, '\u00AC'],
+  [/\\textregistered /g, '\u00AE'],
+  [/\\textasciimacron /g, '\u00AF'],
+  [/\\textdegree /g, '\u00B0'],
+  [/\\pm /g, '\u00B1'],
+  [/\\textasciiacute /g, '\u00B4'],
+  [/\\mathrm\{\\mu\}/g, '\u00B5'],
+  [/\\textparagraph /g, '\u00B6'],
+  [/\\cdot /g, '\u00B7'],
+  [/\\c\{\}/g, '\u00B8'],
+  [/\\textordmasculine /g, '\u00BA'],
+  [/\\guillemotright /g, '\u00BB'],
+  [/\\textonequarter /g, '\u00BC'],
+  [/\\textonehalf /g, '\u00BD'],
+  [/\\textthreequarters /g, '\u00BE'],
+  [/\\textquestiondown /g, '\u00BF'],
+  [/\\`\{A\}/g, '\u00C0'],
+  [/\\'\{A\}/g, '\u00C1'],
+  [/\\\^\{A\}/g, '\u00C2'],
+  [/\\~\{A\}/g, '\u00C3'],
+  [/\\"\{A\}/g, '\u00C4'],
+  [/\\AA /g, '\u00C5'],
+  [/\\AE /g, '\u00C6'],
+  [/\\c\{C\}/g, '\u00C7'],
+  [/\\`\{E\}/g, '\u00C8'],
+  [/\\'\{E\}/g, '\u00C9'],
+  [/\\\^\{E\}/g, '\u00CA'],
+  [/\\"\{E\}/g, '\u00CB'],
+  [/\\`\{I\}/g, '\u00CC'],
+  [/\\'\{I\}/g, '\u00CD'],
+  [/\\\^\{I\}/g, '\u00CE'],
+  [/\\"\{I\}/g, '\u00CF'],
+  [/\\DH /g, '\u00D0'],
+  [/\\~\{N\}/g, '\u00D1'],
+  [/\\`\{O\}/g, '\u00D2'],
+  [/\\'\{O\}/g, '\u00D3'],
+  [/\\\^\{O\}/g, '\u00D4'],
+  [/\\~\{O\}/g, '\u00D5'],
+  [/\\"\{O\}/g, '\u00D6'],
+  [/\\texttimes /g, '\u00D7'],
+  [/\\O /g, '\u00D8'],
+  [/\\`\{U\}/g, '\u00D9'],
+  [/\\'\{U\}/g, '\u00DA'],
+  [/\\\^\{U\}/g, '\u00DB'],
+  [/\\"\{U\}/g, '\u00DC'],
+  [/\\'\{Y\}/g, '\u00DD'],
+  [/\\TH /g, '\u00DE'],
+  [/\\ss /g, '\u00DF'],
+  [/\\`\{a\}/g, '\u00E0'],
+  [/\\'\{a\}/g, '\u00E1'],
+  [/\\\^\{a\}/g, '\u00E2'],
+  [/\\~\{a\}/g, '\u00E3'],
+  [/\\"\{a\}/g, '\u00E4'],
+  [/\\aa /g, '\u00E5'],
+  [/\\ae /g, '\u00E6'],
+  [/\\c\{c\}/g, '\u00E7'],
+  [/\\`\{e\}/g, '\u00E8'],
+  [/\\'\{e\}/g, '\u00E9'],
+  [/\\\^\{e\}/g, '\u00EA'],
+  [/\\"\{e\}/g, '\u00EB'],
+  [/\\`\{\\i\}/g, '\u00EC'],
+  [/\\'\{\\i\}/g, '\u00ED'],
+  [/\\\^\{\\i\}/g, '\u00EE'],
+  [/\\"\{\\i\}/g, '\u00EF'],
+  [/\\dh /g, '\u00F0'],
+  [/\\~\{n\}/g, '\u00F1'],
+  [/\\`\{o\}/g, '\u00F2'],
+  [/\\'\{o\}/g, '\u00F3'],
+  [/\\\^\{o\}/g, '\u00F4'],
+  [/\\~\{o\}/g, '\u00F5'],
+  [/\\"\{o\}/g, '\u00F6'],
+  [/\\div /g, '\u00F7'],
+  [/\\o /g, '\u00F8'],
+  [/\\`\{u\}/g, '\u00F9'],
+  [/\\'\{u\}/g, '\u00FA'],
+  [/\\\^\{u\}/g, '\u00FB'],
+  [/\\"\{u\}/g, '\u00FC'],
+  [/\\'\{y\}/g, '\u00FD'],
+  [/\\th /g, '\u00FE'],
+  [/\\"\{y\}/g, '\u00FF'],
+  [/\\=\{A\}/g, '\u0100'],
+  [/\\=\{a\}/g, '\u0101'],
+  [/\\u\{A\}/g, '\u0102'],
+  [/\\u\{a\}/g, '\u0103'],
+  [/\\k\{A\}/g, '\u0104'],
+  [/\\k\{a\}/g, '\u0105'],
+  [/\\'\{C\}/g, '\u0106'],
+  [/\\'\{c\}/g, '\u0107'],
+  [/\\\^\{C\}/g, '\u0108'],
+  [/\\\^\{c\}/g, '\u0109'],
+  [/\\.\{C\}/g, '\u010A'],
+  [/\\.\{c\}/g, '\u010B'],
+  [/\\v\{C\}/g, '\u010C'],
+  [/\\v\{c\}/g, '\u010D'],
+  [/\\v\{D\}/g, '\u010E'],
+  [/\\v\{d\}/g, '\u010F'],
+  [/\\DJ /g, '\u0110'],
+  [/\\dj /g, '\u0111'],
+  [/\\=\{E\}/g, '\u0112'],
+  [/\\=\{e\}/g, '\u0113'],
+  [/\\u\{E\}/g, '\u0114'],
+  [/\\u\{e\}/g, '\u0115'],
+  [/\\.\{E\}/g, '\u0116'],
+  [/\\.\{e\}/g, '\u0117'],
+  [/\\k\{E\}/g, '\u0118'],
+  [/\\k\{e\}/g, '\u0119'],
+  [/\\v\{E\}/g, '\u011A'],
+  [/\\v\{e\}/g, '\u011B'],
+  [/\\\^\{G\}/g, '\u011C'],
+  [/\\\^\{g\}/g, '\u011D'],
+  [/\\u\{G\}/g, '\u011E'],
+  [/\\u\{g\}/g, '\u011F'],
+  [/\\.\{G\}/g, '\u0120'],
+  [/\\.\{g\}/g, '\u0121'],
+  [/\\c\{G\}/g, '\u0122'],
+  [/\\c\{g\}/g, '\u0123'],
+  [/\\\^\{H\}/g, '\u0124'],
+  [/\\\^\{h\}/g, '\u0125'],
+  [/\\Elzxh /g, '\u0127'],
+  [/\\~\{I\}/g, '\u0128'],
+  [/\\~\{\\i\}/g, '\u0129'],
+  [/\\=\{I\}/g, '\u012A'],
+  [/\\=\{\\i\}/g, '\u012B'],
+  [/\\u\{I\}/g, '\u012C'],
+  [/\\u\{\\i\}/g, '\u012D'],
+  [/\\k\{I\}/g, '\u012E'],
+  [/\\k\{i\}/g, '\u012F'],
+  [/\\.\{I\}/g, '\u0130'],
+  [/\\i /g, '\u0131'],
+  [/\\\^\{J\}/g, '\u0134'],
+  [/\\\^\{\\j\}/g, '\u0135'],
+  [/\\c\{K\}/g, '\u0136'],
+  [/\\c\{k\}/g, '\u0137'],
+  [/\\'\{L\}/g, '\u0139'],
+  [/\\'\{l\}/g, '\u013A'],
+  [/\\c\{L\}/g, '\u013B'],
+  [/\\c\{l\}/g, '\u013C'],
+  [/\\v\{L\}/g, '\u013D'],
+  [/\\v\{l\}/g, '\u013E'],
+  [/\\L /g, '\u0141'],
+  [/\\l /g, '\u0142'],
+  [/\\'\{N\}/g, '\u0143'],
+  [/\\'\{n\}/g, '\u0144'],
+  [/\\c\{N\}/g, '\u0145'],
+  [/\\c\{n\}/g, '\u0146'],
+  [/\\v\{N\}/g, '\u0147'],
+  [/\\v\{n\}/g, '\u0148'],
+  [/\\NG /g, '\u014A'],
+  [/\\ng /g, '\u014B'],
+  [/\\=\{O\}/g, '\u014C'],
+  [/\\=\{o\}/g, '\u014D'],
+  [/\\u\{O\}/g, '\u014E'],
+  [/\\u\{o\}/g, '\u014F'],
+  [/\\H\{O\}/g, '\u0150'],
+  [/\\H\{o\}/g, '\u0151'],
+  [/\\OE /g, '\u0152'],
+  [/\\oe /g, '\u0153'],
+  [/\\'\{R\}/g, '\u0154'],
+  [/\\'\{r\}/g, '\u0155'],
+  [/\\c\{R\}/g, '\u0156'],
+  [/\\c\{r\}/g, '\u0157'],
+  [/\\v\{R\}/g, '\u0158'],
+  [/\\v\{r\}/g, '\u0159'],
+  [/\\'\{S\}/g, '\u015A'],
+  [/\\'\{s\}/g, '\u015B'],
+  [/\\\^\{S\}/g, '\u015C'],
+  [/\\\^\{s\}/g, '\u015D'],
+  [/\\c\{S\}/g, '\u015E'],
+  [/\\c\{s\}/g, '\u015F'],
+  [/\\v\{S\}/g, '\u0160'],
+  [/\\v\{s\}/g, '\u0161'],
+  [/\\c\{T\}/g, '\u0162'],
+  [/\\c\{t\}/g, '\u0163'],
+  [/\\v\{T\}/g, '\u0164'],
+  [/\\v\{t\}/g, '\u0165'],
+  [/\\~\{U\}/g, '\u0168'],
+  [/\\~\{u\}/g, '\u0169'],
+  [/\\=\{U\}/g, '\u016A'],
+  [/\\=\{u\}/g, '\u016B'],
+  [/\\u\{U\}/g, '\u016C'],
+  [/\\u\{u\}/g, '\u016D'],
+  [/\\r\{U\}/g, '\u016E'],
+  [/\\r\{u\}/g, '\u016F'],
+  [/\\H\{U\}/g, '\u0170'],
+  [/\\H\{u\}/g, '\u0171'],
+  [/\\k\{U\}/g, '\u0172'],
+  [/\\k\{u\}/g, '\u0173'],
+  [/\\\^\{W\}/g, '\u0174'],
+  [/\\\^\{w\}/g, '\u0175'],
+  [/\\\^\{Y\}/g, '\u0176'],
+  [/\\\^\{y\}/g, '\u0177'],
+  [/\\"\{Y\}/g, '\u0178'],
+  [/\\'\{Z\}/g, '\u0179'],
+  [/\\'\{z\}/g, '\u017A'],
+  [/\\.\{Z\}/g, '\u017B'],
+  [/\\.\{z\}/g, '\u017C'],
+  [/\\v\{Z\}/g, '\u017D'],
+  [/\\v\{z\}/g, '\u017E'],
+  [/\\texthvlig /g, '\u0195'],
+  [/\\textnrleg /g, '\u019E'],
+  [/\\eth /g, '\u01AA'],
+  [/\\textdoublepipe /g, '\u01C2'],
+  [/\\'\{g\}/g, '\u01F5'],
+  [/\\Elztrna /g, '\u0250'],
+  [/\\Elztrnsa /g, '\u0252'],
+  [/\\Elzopeno /g, '\u0254'],
+  [/\\Elzrtld /g, '\u0256'],
+  [/\\Elzschwa /g, '\u0259'],
+  [/\\varepsilon /g, '\u025B'],
+  [/\\Elzpgamma /g, '\u0263'],
+  [/\\Elzpbgam /g, '\u0264'],
+  [/\\Elztrnh /g, '\u0265'],
+  [/\\Elzbtdl /g, '\u026C'],
+  [/\\Elzrtll /g, '\u026D'],
+  [/\\Elztrnm /g, '\u026F'],
+  [/\\Elztrnmlr /g, '\u0270'],
+  [/\\Elzltlmr /g, '\u0271'],
+  [/\\Elzltln /g, '\u0272'],
+  [/\\Elzrtln /g, '\u0273'],
+  [/\\Elzclomeg /g, '\u0277'],
+  [/\\textphi /g, '\u0278'],
+  [/\\Elztrnr /g, '\u0279'],
+  [/\\Elztrnrl /g, '\u027A'],
+  [/\\Elzrttrnr /g, '\u027B'],
+  [/\\Elzrl /g, '\u027C'],
+  [/\\Elzrtlr /g, '\u027D'],
+  [/\\Elzfhr /g, '\u027E'],
+  [/\\Elzrtls /g, '\u0282'],
+  [/\\Elzesh /g, '\u0283'],
+  [/\\Elztrnt /g, '\u0287'],
+  [/\\Elzrtlt /g, '\u0288'],
+  [/\\Elzpupsil /g, '\u028A'],
+  [/\\Elzpscrv /g, '\u028B'],
+  [/\\Elzinvv /g, '\u028C'],
+  [/\\Elzinvw /g, '\u028D'],
+  [/\\Elztrny /g, '\u028E'],
+  [/\\Elzrtlz /g, '\u0290'],
+  [/\\Elzyogh /g, '\u0292'],
+  [/\\Elzglst /g, '\u0294'],
+  [/\\Elzreglst /g, '\u0295'],
+  [/\\Elzinglst /g, '\u0296'],
+  [/\\textturnk /g, '\u029E'],
+  [/\\Elzdyogh /g, '\u02A4'],
+  [/\\Elztesh /g, '\u02A7'],
+  [/\\textasciicaron /g, '\u02C7'],
+  [/\\Elzverts /g, '\u02C8'],
+  [/\\Elzverti /g, '\u02CC'],
+  [/\\Elzlmrk /g, '\u02D0'],
+  [/\\Elzhlmrk /g, '\u02D1'],
+  [/\\Elzsbrhr /g, '\u02D2'],
+  [/\\Elzsblhr /g, '\u02D3'],
+  [/\\Elzrais /g, '\u02D4'],
+  [/\\Elzlow /g, '\u02D5'],
+  [/\\textasciibreve /g, '\u02D8'],
+  [/\\textperiodcentered /g, '\u02D9'],
+  [/\\r\{\}/g, '\u02DA'],
+  [/\\k\{\}/g, '\u02DB'],
+  [/\\texttildelow /g, '\u02DC'],
+  [/\\H\{\}/g, '\u02DD'],
+  [/\\tone\{55\}/g, '\u02E5'],
+  [/\\tone\{44\}/g, '\u02E6'],
+  [/\\tone\{33\}/g, '\u02E7'],
+  [/\\tone\{22\}/g, '\u02E8'],
+  [/\\tone\{11\}/g, '\u02E9'],
+  [/\\cyrchar\\C/g, '\u030F'],
+  [/\\Elzpalh /g, '\u0321'],
+  [/\\Elzrh /g, '\u0322'],
+  [/\\Elzsbbrg /g, '\u032A'],
+  [/\\Elzxl /g, '\u0335'],
+  [/\\Elzbar /g, '\u0336'],
+  [/\\'\{A\}/g, '\u0386'],
+  [/\\'\{E\}/g, '\u0388'],
+  [/\\'\{H\}/g, '\u0389'],
+  [/\\'\{\}\{I\}/g, '\u038A'],
+  [/\\'\{\}O/g, '\u038C'],
+  [/\\mathrm\{'Y\}/g, '\u038E'],
+  [/\\mathrm\{'\\Omega\}/g, '\u038F'],
+  [/\\acute\{\\ddot\{\\iota\}\}/g, '\u0390'],
+  [/\\Alpha /g, '\u0391'],
+  [/\\Beta /g, '\u0392'],
+  [/\\Gamma /g, '\u0393'],
+  [/\\Delta /g, '\u0394'],
+  [/\\Epsilon /g, '\u0395'],
+  [/\\Zeta /g, '\u0396'],
+  [/\\Eta /g, '\u0397'],
+  [/\\Theta /g, '\u0398'],
+  [/\\Iota /g, '\u0399'],
+  [/\\Kappa /g, '\u039A'],
+  [/\\Lambda /g, '\u039B'],
+  [/\\Xi /g, '\u039E'],
+  [/\\Pi /g, '\u03A0'],
+  [/\\Rho /g, '\u03A1'],
+  [/\\Sigma /g, '\u03A3'],
+  [/\\Tau /g, '\u03A4'],
+  [/\\Upsilon /g, '\u03A5'],
+  [/\\Phi /g, '\u03A6'],
+  [/\\Chi /g, '\u03A7'],
+  [/\\Psi /g, '\u03A8'],
+  [/\\Omega /g, '\u03A9'],
+  [/\\mathrm\{\\ddot\{I\}\}/g, '\u03AA'],
+  [/\\mathrm\{\\ddot\{Y\}\}/g, '\u03AB'],
+  [/\\'\{\$\\alpha\$\}/g, '\u03AC'],
+  [/\\acute\{\\epsilon\}/g, '\u03AD'],
+  [/\\acute\{\\eta\}/g, '\u03AE'],
+  [/\\acute\{\\iota\}/g, '\u03AF'],
+  [/\\acute\{\\ddot\{\\upsilon\}\}/g, '\u03B0'],
+  [/\\alpha /g, '\u03B1'],
+  [/\\beta /g, '\u03B2'],
+  [/\\gamma /g, '\u03B3'],
+  [/\\delta /g, '\u03B4'],
+  [/\\epsilon /g, '\u03B5'],
+  [/\\zeta /g, '\u03B6'],
+  [/\\eta /g, '\u03B7'],
+  [/\\texttheta /g, '\u03B8'],
+  [/\\iota /g, '\u03B9'],
+  [/\\kappa /g, '\u03BA'],
+  [/\\lambda /g, '\u03BB'],
+  [/\\mu /g, '\u03BC'],
+  [/\\nu /g, '\u03BD'],
+  [/\\xi /g, '\u03BE'],
+  [/\\pi /g, '\u03C0'],
+  [/\\rho /g, '\u03C1'],
+  [/\\varsigma /g, '\u03C2'],
+  [/\\sigma /g, '\u03C3'],
+  [/\\tau /g, '\u03C4'],
+  [/\\upsilon /g, '\u03C5'],
+  [/\\varphi /g, '\u03C6'],
+  [/\\chi /g, '\u03C7'],
+  [/\\psi /g, '\u03C8'],
+  [/\\omega /g, '\u03C9'],
+  [/\\ddot\{\\iota\}/g, '\u03CA'],
+  [/\\ddot\{\\upsilon\}/g, '\u03CB'],
+  [/\\'\{o\}/g, '\u03CC'],
+  [/\\acute\{\\upsilon\}/g, '\u03CD'],
+  [/\\acute\{\\omega\}/g, '\u03CE'],
+  [/\\Pisymbol\{ppi022\}\{87\}/g, '\u03D0'],
+  [/\\textvartheta /g, '\u03D1'],
+  [/\\Upsilon /g, '\u03D2'],
+  [/\\phi /g, '\u03D5'],
+  [/\\varpi /g, '\u03D6'],
+  [/\\Stigma /g, '\u03DA'],
+  [/\\Digamma /g, '\u03DC'],
+  [/\\digamma /g, '\u03DD'],
+  [/\\Koppa /g, '\u03DE'],
+  [/\\Sampi /g, '\u03E0'],
+  [/\\varkappa /g, '\u03F0'],
+  [/\\varrho /g, '\u03F1'],
+  [/\\textTheta /g, '\u03F4'],
+  [/\\backepsilon /g, '\u03F6'],
+  [/\\cyrchar\\CYRYO /g, '\u0401'],
+  [/\\cyrchar\\CYRDJE /g, '\u0402'],
+  [/\\cyrchar\{\\'\\CYRG\}/g, '\u0403'],
+  [/\\cyrchar\\CYRIE /g, '\u0404'],
+  [/\\cyrchar\\CYRDZE /g, '\u0405'],
+  [/\\cyrchar\\CYRII /g, '\u0406'],
+  [/\\cyrchar\\CYRYI /g, '\u0407'],
+  [/\\cyrchar\\CYRJE /g, '\u0408'],
+  [/\\cyrchar\\CYRLJE /g, '\u0409'],
+  [/\\cyrchar\\CYRNJE /g, '\u040A'],
+  [/\\cyrchar\\CYRTSHE /g, '\u040B'],
+  [/\\cyrchar\{\\'\\CYRK\}/g, '\u040C'],
+  [/\\cyrchar\\CYRUSHRT /g, '\u040E'],
+  [/\\cyrchar\\CYRDZHE /g, '\u040F'],
+  [/\\cyrchar\\CYRA /g, '\u0410'],
+  [/\\cyrchar\\CYRB /g, '\u0411'],
+  [/\\cyrchar\\CYRV /g, '\u0412'],
+  [/\\cyrchar\\CYRG /g, '\u0413'],
+  [/\\cyrchar\\CYRD /g, '\u0414'],
+  [/\\cyrchar\\CYRE /g, '\u0415'],
+  [/\\cyrchar\\CYRZH /g, '\u0416'],
+  [/\\cyrchar\\CYRZ /g, '\u0417'],
+  [/\\cyrchar\\CYRI /g, '\u0418'],
+  [/\\cyrchar\\CYRISHRT /g, '\u0419'],
+  [/\\cyrchar\\CYRK /g, '\u041A'],
+  [/\\cyrchar\\CYRL /g, '\u041B'],
+  [/\\cyrchar\\CYRM /g, '\u041C'],
+  [/\\cyrchar\\CYRN /g, '\u041D'],
+  [/\\cyrchar\\CYRO /g, '\u041E'],
+  [/\\cyrchar\\CYRP /g, '\u041F'],
+  [/\\cyrchar\\CYRR /g, '\u0420'],
+  [/\\cyrchar\\CYRS /g, '\u0421'],
+  [/\\cyrchar\\CYRT /g, '\u0422'],
+  [/\\cyrchar\\CYRU /g, '\u0423'],
+  [/\\cyrchar\\CYRF /g, '\u0424'],
+  [/\\cyrchar\\CYRH /g, '\u0425'],
+  [/\\cyrchar\\CYRC /g, '\u0426'],
+  [/\\cyrchar\\CYRCH /g, '\u0427'],
+  [/\\cyrchar\\CYRSH /g, '\u0428'],
+  [/\\cyrchar\\CYRSHCH /g, '\u0429'],
+  [/\\cyrchar\\CYRHRDSN /g, '\u042A'],
+  [/\\cyrchar\\CYRERY /g, '\u042B'],
+  [/\\cyrchar\\CYRSFTSN /g, '\u042C'],
+  [/\\cyrchar\\CYREREV /g, '\u042D'],
+  [/\\cyrchar\\CYRYU /g, '\u042E'],
+  [/\\cyrchar\\CYRYA /g, '\u042F'],
+  [/\\cyrchar\\cyra /g, '\u0430'],
+  [/\\cyrchar\\cyrb /g, '\u0431'],
+  [/\\cyrchar\\cyrv /g, '\u0432'],
+  [/\\cyrchar\\cyrg /g, '\u0433'],
+  [/\\cyrchar\\cyrd /g, '\u0434'],
+  [/\\cyrchar\\cyre /g, '\u0435'],
+  [/\\cyrchar\\cyrzh /g, '\u0436'],
+  [/\\cyrchar\\cyrz /g, '\u0437'],
+  [/\\cyrchar\\cyri /g, '\u0438'],
+  [/\\cyrchar\\cyrishrt /g, '\u0439'],
+  [/\\cyrchar\\cyrk /g, '\u043A'],
+  [/\\cyrchar\\cyrl /g, '\u043B'],
+  [/\\cyrchar\\cyrm /g, '\u043C'],
+  [/\\cyrchar\\cyrn /g, '\u043D'],
+  [/\\cyrchar\\cyro /g, '\u043E'],
+  [/\\cyrchar\\cyrp /g, '\u043F'],
+  [/\\cyrchar\\cyrr /g, '\u0440'],
+  [/\\cyrchar\\cyrs /g, '\u0441'],
+  [/\\cyrchar\\cyrt /g, '\u0442'],
+  [/\\cyrchar\\cyru /g, '\u0443'],
+  [/\\cyrchar\\cyrf /g, '\u0444'],
+  [/\\cyrchar\\cyrh /g, '\u0445'],
+  [/\\cyrchar\\cyrc /g, '\u0446'],
+  [/\\cyrchar\\cyrch /g, '\u0447'],
+  [/\\cyrchar\\cyrsh /g, '\u0448'],
+  [/\\cyrchar\\cyrshch /g, '\u0449'],
+  [/\\cyrchar\\cyrhrdsn /g, '\u044A'],
+  [/\\cyrchar\\cyrery /g, '\u044B'],
+  [/\\cyrchar\\cyrsftsn /g, '\u044C'],
+  [/\\cyrchar\\cyrerev /g, '\u044D'],
+  [/\\cyrchar\\cyryu /g, '\u044E'],
+  [/\\cyrchar\\cyrya /g, '\u044F'],
+  [/\\cyrchar\\cyryo /g, '\u0451'],
+  [/\\cyrchar\\cyrdje /g, '\u0452'],
+  [/\\cyrchar\{\\'\\cyrg\}/g, '\u0453'],
+  [/\\cyrchar\\cyrie /g, '\u0454'],
+  [/\\cyrchar\\cyrdze /g, '\u0455'],
+  [/\\cyrchar\\cyrii /g, '\u0456'],
+  [/\\cyrchar\\cyryi /g, '\u0457'],
+  [/\\cyrchar\\cyrje /g, '\u0458'],
+  [/\\cyrchar\\cyrlje /g, '\u0459'],
+  [/\\cyrchar\\cyrnje /g, '\u045A'],
+  [/\\cyrchar\\cyrtshe /g, '\u045B'],
+  [/\\cyrchar\{\\'\\cyrk\}/g, '\u045C'],
+  [/\\cyrchar\\cyrushrt /g, '\u045E'],
+  [/\\cyrchar\\cyrdzhe /g, '\u045F'],
+  [/\\cyrchar\\CYROMEGA /g, '\u0460'],
+  [/\\cyrchar\\cyromega /g, '\u0461'],
+  [/\\cyrchar\\CYRYAT /g, '\u0462'],
+  [/\\cyrchar\\CYRIOTE /g, '\u0464'],
+  [/\\cyrchar\\cyriote /g, '\u0465'],
+  [/\\cyrchar\\CYRLYUS /g, '\u0466'],
+  [/\\cyrchar\\cyrlyus /g, '\u0467'],
+  [/\\cyrchar\\CYRIOTLYUS /g, '\u0468'],
+  [/\\cyrchar\\cyriotlyus /g, '\u0469'],
+  [/\\cyrchar\\CYRBYUS /g, '\u046A'],
+  [/\\cyrchar\\CYRIOTBYUS /g, '\u046C'],
+  [/\\cyrchar\\cyriotbyus /g, '\u046D'],
+  [/\\cyrchar\\CYRKSI /g, '\u046E'],
+  [/\\cyrchar\\cyrksi /g, '\u046F'],
+  [/\\cyrchar\\CYRPSI /g, '\u0470'],
+  [/\\cyrchar\\cyrpsi /g, '\u0471'],
+  [/\\cyrchar\\CYRFITA /g, '\u0472'],
+  [/\\cyrchar\\CYRIZH /g, '\u0474'],
+  [/\\cyrchar\\CYRUK /g, '\u0478'],
+  [/\\cyrchar\\cyruk /g, '\u0479'],
+  [/\\cyrchar\\CYROMEGARND /g, '\u047A'],
+  [/\\cyrchar\\cyromegarnd /g, '\u047B'],
+  [/\\cyrchar\\CYROMEGATITLO /g, '\u047C'],
+  [/\\cyrchar\\cyromegatitlo /g, '\u047D'],
+  [/\\cyrchar\\CYROT /g, '\u047E'],
+  [/\\cyrchar\\cyrot /g, '\u047F'],
+  [/\\cyrchar\\CYRKOPPA /g, '\u0480'],
+  [/\\cyrchar\\cyrkoppa /g, '\u0481'],
+  [/\\cyrchar\\cyrthousands /g, '\u0482'],
+  [/\\cyrchar\\cyrhundredthousands /g, '\u0488'],
+  [/\\cyrchar\\cyrmillions /g, '\u0489'],
+  [/\\cyrchar\\CYRSEMISFTSN /g, '\u048C'],
+  [/\\cyrchar\\cyrsemisftsn /g, '\u048D'],
+  [/\\cyrchar\\CYRRTICK /g, '\u048E'],
+  [/\\cyrchar\\cyrrtick /g, '\u048F'],
+  [/\\cyrchar\\CYRGUP /g, '\u0490'],
+  [/\\cyrchar\\cyrgup /g, '\u0491'],
+  [/\\cyrchar\\CYRGHCRS /g, '\u0492'],
+  [/\\cyrchar\\cyrghcrs /g, '\u0493'],
+  [/\\cyrchar\\CYRGHK /g, '\u0494'],
+  [/\\cyrchar\\cyrghk /g, '\u0495'],
+  [/\\cyrchar\\CYRZHDSC /g, '\u0496'],
+  [/\\cyrchar\\cyrzhdsc /g, '\u0497'],
+  [/\\cyrchar\\CYRZDSC /g, '\u0498'],
+  [/\\cyrchar\\cyrzdsc /g, '\u0499'],
+  [/\\cyrchar\\CYRKDSC /g, '\u049A'],
+  [/\\cyrchar\\cyrkdsc /g, '\u049B'],
+  [/\\cyrchar\\CYRKVCRS /g, '\u049C'],
+  [/\\cyrchar\\cyrkvcrs /g, '\u049D'],
+  [/\\cyrchar\\CYRKHCRS /g, '\u049E'],
+  [/\\cyrchar\\cyrkhcrs /g, '\u049F'],
+  [/\\cyrchar\\CYRKBEAK /g, '\u04A0'],
+  [/\\cyrchar\\cyrkbeak /g, '\u04A1'],
+  [/\\cyrchar\\CYRNDSC /g, '\u04A2'],
+  [/\\cyrchar\\cyrndsc /g, '\u04A3'],
+  [/\\cyrchar\\CYRNG /g, '\u04A4'],
+  [/\\cyrchar\\cyrng /g, '\u04A5'],
+  [/\\cyrchar\\CYRPHK /g, '\u04A6'],
+  [/\\cyrchar\\cyrphk /g, '\u04A7'],
+  [/\\cyrchar\\CYRABHHA /g, '\u04A8'],
+  [/\\cyrchar\\cyrabhha /g, '\u04A9'],
+  [/\\cyrchar\\CYRSDSC /g, '\u04AA'],
+  [/\\cyrchar\\cyrsdsc /g, '\u04AB'],
+  [/\\cyrchar\\CYRTDSC /g, '\u04AC'],
+  [/\\cyrchar\\cyrtdsc /g, '\u04AD'],
+  [/\\cyrchar\\CYRY /g, '\u04AE'],
+  [/\\cyrchar\\cyry /g, '\u04AF'],
+  [/\\cyrchar\\CYRYHCRS /g, '\u04B0'],
+  [/\\cyrchar\\cyryhcrs /g, '\u04B1'],
+  [/\\cyrchar\\CYRHDSC /g, '\u04B2'],
+  [/\\cyrchar\\cyrhdsc /g, '\u04B3'],
+  [/\\cyrchar\\CYRTETSE /g, '\u04B4'],
+  [/\\cyrchar\\cyrtetse /g, '\u04B5'],
+  [/\\cyrchar\\CYRCHRDSC /g, '\u04B6'],
+  [/\\cyrchar\\cyrchrdsc /g, '\u04B7'],
+  [/\\cyrchar\\CYRCHVCRS /g, '\u04B8'],
+  [/\\cyrchar\\cyrchvcrs /g, '\u04B9'],
+  [/\\cyrchar\\CYRSHHA /g, '\u04BA'],
+  [/\\cyrchar\\cyrshha /g, '\u04BB'],
+  [/\\cyrchar\\CYRABHCH /g, '\u04BC'],
+  [/\\cyrchar\\cyrabhch /g, '\u04BD'],
+  [/\\cyrchar\\CYRABHCHDSC /g, '\u04BE'],
+  [/\\cyrchar\\cyrabhchdsc /g, '\u04BF'],
+  [/\\cyrchar\\CYRpalochka /g, '\u04C0'],
+  [/\\cyrchar\\CYRKHK /g, '\u04C3'],
+  [/\\cyrchar\\cyrkhk /g, '\u04C4'],
+  [/\\cyrchar\\CYRNHK /g, '\u04C7'],
+  [/\\cyrchar\\cyrnhk /g, '\u04C8'],
+  [/\\cyrchar\\CYRCHLDSC /g, '\u04CB'],
+  [/\\cyrchar\\cyrchldsc /g, '\u04CC'],
+  [/\\cyrchar\\CYRAE /g, '\u04D4'],
+  [/\\cyrchar\\cyrae /g, '\u04D5'],
+  [/\\cyrchar\\CYRSCHWA /g, '\u04D8'],
+  [/\\cyrchar\\cyrschwa /g, '\u04D9'],
+  [/\\cyrchar\\CYRABHDZE /g, '\u04E0'],
+  [/\\cyrchar\\cyrabhdze /g, '\u04E1'],
+  [/\\cyrchar\\CYROTLD /g, '\u04E8'],
+  [/\\cyrchar\\cyrotld /g, '\u04E9'],
+  [/\\hspace\{0.6em\}/g, '\u2002'],
+  [/\\hspace\{1em\}/g, '\u2003'],
+  [/\\hspace\{0.33em\}/g, '\u2004'],
+  [/\\hspace\{0.25em\}/g, '\u2005'],
+  [/\\hspace\{0.166em\}/g, '\u2006'],
+  [/\\hphantom\{0\}/g, '\u2007'],
+  [/\\hphantom\{,\}/g, '\u2008'],
+  [/\\hspace\{0.167em\}/g, '\u2009'],
+  [/\\mkern1mu /g, '\u200A'],
+  [/\\textendash /g, '\u2013'],
+  [/\\textemdash /g, '\u2014'],
+  [/\\rule\{1em\}\{1pt\}/g, '\u2015'],
+  [/\\Vert /g, '\u2016'],
+  [/\\Elzreapos /g, '\u201B'],
+  [/\\textquotedblleft /g, '\u201C'],
+  [/\\textquotedblright /g, '\u201D'],
+  [/\\textdagger /g, '\u2020'],
+  [/\\textdaggerdbl /g, '\u2021'],
+  [/\\textbullet /g, '\u2022'],
+  [/\\ldots /g, '\u2026'],
+  [/\\textperthousand /g, '\u2030'],
+  [/\\textpertenthousand /g, '\u2031'],
+  [/\\backprime /g, '\u2035'],
+  [/\\guilsinglleft /g, '\u2039'],
+  [/\\guilsinglright /g, '\u203A'],
+  [/\\mkern4mu /g, '\u205F'],
+  [/\\nolinebreak /g, '\u2060'],
+  [/\\ensuremath\{\\Elzpes\}/g, '\u20A7'],
+  [/\\mbox\{\\texteuro\} /g, '\u20AC'],
+  [/\\dddot /g, '\u20DB'],
+  [/\\ddddot /g, '\u20DC'],
+  [/\\mathbb\{C\}/g, '\u2102'],
+  [/\\mathscr\{g\}/g, '\u210A'],
+  [/\\mathscr\{H\}/g, '\u210B'],
+  [/\\mathfrak\{H\}/g, '\u210C'],
+  [/\\mathbb\{H\}/g, '\u210D'],
+  [/\\hslash /g, '\u210F'],
+  [/\\mathscr\{I\}/g, '\u2110'],
+  [/\\mathfrak\{I\}/g, '\u2111'],
+  [/\\mathscr\{L\}/g, '\u2112'],
+  [/\\mathscr\{l\}/g, '\u2113'],
+  [/\\mathbb\{N\}/g, '\u2115'],
+  [/\\cyrchar\\textnumero /g, '\u2116'],
+  [/\\wp /g, '\u2118'],
+  [/\\mathbb\{P\}/g, '\u2119'],
+  [/\\mathbb\{Q\}/g, '\u211A'],
+  [/\\mathscr\{R\}/g, '\u211B'],
+  [/\\mathfrak\{R\}/g, '\u211C'],
+  [/\\mathbb\{R\}/g, '\u211D'],
+  [/\\Elzxrat /g, '\u211E'],
+  [/\\texttrademark /g, '\u2122'],
+  [/\\mathbb\{Z\}/g, '\u2124'],
+  [/\\Omega /g, '\u2126'],
+  [/\\mho /g, '\u2127'],
+  [/\\mathfrak\{Z\}/g, '\u2128'],
+  [/\\ElsevierGlyph\{2129\}/g, '\u2129'],
+  [/\\AA /g, '\u212B'],
+  [/\\mathscr\{B\}/g, '\u212C'],
+  [/\\mathfrak\{C\}/g, '\u212D'],
+  [/\\mathscr\{e\}/g, '\u212F'],
+  [/\\mathscr\{E\}/g, '\u2130'],
+  [/\\mathscr\{F\}/g, '\u2131'],
+  [/\\mathscr\{M\}/g, '\u2133'],
+  [/\\mathscr\{o\}/g, '\u2134'],
+  [/\\aleph /g, '\u2135'],
+  [/\\beth /g, '\u2136'],
+  [/\\gimel /g, '\u2137'],
+  [/\\daleth /g, '\u2138'],
+  [/\\textfrac\{1\}\{3\}/g, '\u2153'],
+  [/\\textfrac\{2\}\{3\}/g, '\u2154'],
+  [/\\textfrac\{1\}\{5\}/g, '\u2155'],
+  [/\\textfrac\{2\}\{5\}/g, '\u2156'],
+  [/\\textfrac\{3\}\{5\}/g, '\u2157'],
+  [/\\textfrac\{4\}\{5\}/g, '\u2158'],
+  [/\\textfrac\{1\}\{6\}/g, '\u2159'],
+  [/\\textfrac\{5\}\{6\}/g, '\u215A'],
+  [/\\textfrac\{1\}\{8\}/g, '\u215B'],
+  [/\\textfrac\{3\}\{8\}/g, '\u215C'],
+  [/\\textfrac\{5\}\{8\}/g, '\u215D'],
+  [/\\textfrac\{7\}\{8\}/g, '\u215E'],
+  [/\\leftarrow /g, '\u2190'],
+  [/\\uparrow /g, '\u2191'],
+  [/\\rightarrow /g, '\u2192'],
+  [/\\downarrow /g, '\u2193'],
+  [/\\leftrightarrow /g, '\u2194'],
+  [/\\updownarrow /g, '\u2195'],
+  [/\\nwarrow /g, '\u2196'],
+  [/\\nearrow /g, '\u2197'],
+  [/\\searrow /g, '\u2198'],
+  [/\\swarrow /g, '\u2199'],
+  [/\\nleftarrow /g, '\u219A'],
+  [/\\nrightarrow /g, '\u219B'],
+  [/\\arrowwaveright /g, '\u219C'],
+  [/\\arrowwaveright /g, '\u219D'],
+  [/\\twoheadleftarrow /g, '\u219E'],
+  [/\\twoheadrightarrow /g, '\u21A0'],
+  [/\\leftarrowtail /g, '\u21A2'],
+  [/\\rightarrowtail /g, '\u21A3'],
+  [/\\mapsto /g, '\u21A6'],
+  [/\\hookleftarrow /g, '\u21A9'],
+  [/\\hookrightarrow /g, '\u21AA'],
+  [/\\looparrowleft /g, '\u21AB'],
+  [/\\looparrowright /g, '\u21AC'],
+  [/\\leftrightsquigarrow /g, '\u21AD'],
+  [/\\nleftrightarrow /g, '\u21AE'],
+  [/\\Lsh /g, '\u21B0'],
+  [/\\Rsh /g, '\u21B1'],
+  [/\\ElsevierGlyph\{21B3\}/g, '\u21B3'],
+  [/\\curvearrowleft /g, '\u21B6'],
+  [/\\curvearrowright /g, '\u21B7'],
+  [/\\circlearrowleft /g, '\u21BA'],
+  [/\\circlearrowright /g, '\u21BB'],
+  [/\\leftharpoonup /g, '\u21BC'],
+  [/\\leftharpoondown /g, '\u21BD'],
+  [/\\upharpoonright /g, '\u21BE'],
+  [/\\upharpoonleft /g, '\u21BF'],
+  [/\\rightharpoonup /g, '\u21C0'],
+  [/\\rightharpoondown /g, '\u21C1'],
+  [/\\downharpoonright /g, '\u21C2'],
+  [/\\downharpoonleft /g, '\u21C3'],
+  [/\\rightleftarrows /g, '\u21C4'],
+  [/\\dblarrowupdown /g, '\u21C5'],
+  [/\\leftrightarrows /g, '\u21C6'],
+  [/\\leftleftarrows /g, '\u21C7'],
+  [/\\upuparrows /g, '\u21C8'],
+  [/\\rightrightarrows /g, '\u21C9'],
+  [/\\downdownarrows /g, '\u21CA'],
+  [/\\leftrightharpoons /g, '\u21CB'],
+  [/\\rightleftharpoons /g, '\u21CC'],
+  [/\\nLeftarrow /g, '\u21CD'],
+  [/\\nLeftrightarrow /g, '\u21CE'],
+  [/\\nRightarrow /g, '\u21CF'],
+  [/\\Leftarrow /g, '\u21D0'],
+  [/\\Uparrow /g, '\u21D1'],
+  [/\\Rightarrow /g, '\u21D2'],
+  [/\\Downarrow /g, '\u21D3'],
+  [/\\Leftrightarrow /g, '\u21D4'],
+  [/\\Updownarrow /g, '\u21D5'],
+  [/\\Lleftarrow /g, '\u21DA'],
+  [/\\Rrightarrow /g, '\u21DB'],
+  [/\\rightsquigarrow /g, '\u21DD'],
+  [/\\DownArrowUpArrow /g, '\u21F5'],
+  [/\\forall /g, '\u2200'],
+  [/\\complement /g, '\u2201'],
+  [/\\partial /g, '\u2202'],
+  [/\\exists /g, '\u2203'],
+  [/\\nexists /g, '\u2204'],
+  [/\\varnothing /g, '\u2205'],
+  [/\\nabla /g, '\u2207'],
+  [/\\in /g, '\u2208'],
+  [/\\not\\in /g, '\u2209'],
+  [/\\ni /g, '\u220B'],
+  [/\\not\\ni /g, '\u220C'],
+  [/\\prod /g, '\u220F'],
+  [/\\coprod /g, '\u2210'],
+  [/\\sum /g, '\u2211'],
+  [/\\mp /g, '\u2213'],
+  [/\\dotplus /g, '\u2214'],
+  [/\\setminus /g, '\u2216'],
+  [/\\circ /g, '\u2218'],
+  [/\\bullet /g, '\u2219'],
+  [/\\surd /g, '\u221A'],
+  [/\\propto /g, '\u221D'],
+  [/\\infty /g, '\u221E'],
+  [/\\rightangle /g, '\u221F'],
+  [/\\angle /g, '\u2220'],
+  [/\\measuredangle /g, '\u2221'],
+  [/\\sphericalangle /g, '\u2222'],
+  [/\\mid /g, '\u2223'],
+  [/\\nmid /g, '\u2224'],
+  [/\\parallel /g, '\u2225'],
+  [/\\nparallel /g, '\u2226'],
+  [/\\wedge /g, '\u2227'],
+  [/\\vee /g, '\u2228'],
+  [/\\cap /g, '\u2229'],
+  [/\\cup /g, '\u222A'],
+  [/\\int /g, '\u222B'],
+  [/\\int\\!\\int /g, '\u222C'],
+  [/\\int\\!\\int\\!\\int /g, '\u222D'],
+  [/\\oint /g, '\u222E'],
+  [/\\surfintegral /g, '\u222F'],
+  [/\\volintegral /g, '\u2230'],
+  [/\\clwintegral /g, '\u2231'],
+  [/\\ElsevierGlyph\{2232\}/g, '\u2232'],
+  [/\\ElsevierGlyph\{2233\}/g, '\u2233'],
+  [/\\therefore /g, '\u2234'],
+  [/\\because /g, '\u2235'],
+  [/\\Colon /g, '\u2237'],
+  [/\\ElsevierGlyph\{2238\}/g, '\u2238'],
+  [/\\mathbin\{\{:\}\\!\\!\{\-\}\\!\\!\{:\}\}/g, '\u223A'],
+  [/\\homothetic /g, '\u223B'],
+  [/\\sim /g, '\u223C'],
+  [/\\backsim /g, '\u223D'],
+  [/\\lazysinv /g, '\u223E'],
+  [/\\wr /g, '\u2240'],
+  [/\\not\\sim /g, '\u2241'],
+  [/\\ElsevierGlyph\{2242\}/g, '\u2242'],
+  [/\\NotEqualTilde /g, '\u2242-00338'],
+  [/\\simeq /g, '\u2243'],
+  [/\\not\\simeq /g, '\u2244'],
+  [/\\cong /g, '\u2245'],
+  [/\\approxnotequal /g, '\u2246'],
+  [/\\not\\cong /g, '\u2247'],
+  [/\\approx /g, '\u2248'],
+  [/\\not\\approx /g, '\u2249'],
+  [/\\approxeq /g, '\u224A'],
+  [/\\tildetrpl /g, '\u224B'],
+  [/\\not\\apid /g, '\u224B-00338'],
+  [/\\allequal /g, '\u224C'],
+  [/\\asymp /g, '\u224D'],
+  [/\\Bumpeq /g, '\u224E'],
+  [/\\NotHumpDownHump /g, '\u224E-00338'],
+  [/\\bumpeq /g, '\u224F'],
+  [/\\NotHumpEqual /g, '\u224F-00338'],
+  [/\\doteq /g, '\u2250'],
+  [/\\not\\doteq/g, '\u2250-00338'],
+  [/\\doteqdot /g, '\u2251'],
+  [/\\fallingdotseq /g, '\u2252'],
+  [/\\risingdotseq /g, '\u2253'],
+  [/\\eqcirc /g, '\u2256'],
+  [/\\circeq /g, '\u2257'],
+  [/\\estimates /g, '\u2259'],
+  [/\\ElsevierGlyph\{225A\}/g, '\u225A'],
+  [/\\starequal /g, '\u225B'],
+  [/\\triangleq /g, '\u225C'],
+  [/\\ElsevierGlyph\{225F\}/g, '\u225F'],
+  [/\\not =/g, '\u2260'],
+  [/\\equiv /g, '\u2261'],
+  [/\\not\\equiv /g, '\u2262'],
+  [/\\leq /g, '\u2264'],
+  [/\\geq /g, '\u2265'],
+  [/\\leqq /g, '\u2266'],
+  [/\\geqq /g, '\u2267'],
+  [/\\lneqq /g, '\u2268'],
+  [/\\lvertneqq /g, '\u2268-0FE00'],
+  [/\\gneqq /g, '\u2269'],
+  [/\\gvertneqq /g, '\u2269-0FE00'],
+  [/\\ll /g, '\u226A'],
+  [/\\NotLessLess /g, '\u226A-00338'],
+  [/\\gg /g, '\u226B'],
+  [/\\NotGreaterGreater /g, '\u226B-00338'],
+  [/\\between /g, '\u226C'],
+  [/\\not\\kern\-0.3em\\times /g, '\u226D'],
+  [/\\not</g, '\u226E'],
+  [/\\not>/g, '\u226F'],
+  [/\\not\\leq /g, '\u2270'],
+  [/\\not\\geq /g, '\u2271'],
+  [/\\lessequivlnt /g, '\u2272'],
+  [/\\greaterequivlnt /g, '\u2273'],
+  [/\\ElsevierGlyph\{2274\}/g, '\u2274'],
+  [/\\ElsevierGlyph\{2275\}/g, '\u2275'],
+  [/\\lessgtr /g, '\u2276'],
+  [/\\gtrless /g, '\u2277'],
+  [/\\notlessgreater /g, '\u2278'],
+  [/\\notgreaterless /g, '\u2279'],
+  [/\\prec /g, '\u227A'],
+  [/\\succ /g, '\u227B'],
+  [/\\preccurlyeq /g, '\u227C'],
+  [/\\succcurlyeq /g, '\u227D'],
+  [/\\precapprox /g, '\u227E'],
+  [/\\NotPrecedesTilde /g, '\u227E-00338'],
+  [/\\succapprox /g, '\u227F'],
+  [/\\NotSucceedsTilde /g, '\u227F-00338'],
+  [/\\not\\prec /g, '\u2280'],
+  [/\\not\\succ /g, '\u2281'],
+  [/\\subset /g, '\u2282'],
+  [/\\supset /g, '\u2283'],
+  [/\\not\\subset /g, '\u2284'],
+  [/\\not\\supset /g, '\u2285'],
+  [/\\subseteq /g, '\u2286'],
+  [/\\supseteq /g, '\u2287'],
+  [/\\not\\subseteq /g, '\u2288'],
+  [/\\not\\supseteq /g, '\u2289'],
+  [/\\subsetneq /g, '\u228A'],
+  [/\\varsubsetneqq /g, '\u228A-0FE00'],
+  [/\\supsetneq /g, '\u228B'],
+  [/\\varsupsetneq /g, '\u228B-0FE00'],
+  [/\\uplus /g, '\u228E'],
+  [/\\sqsubset /g, '\u228F'],
+  [/\\NotSquareSubset /g, '\u228F-00338'],
+  [/\\sqsupset /g, '\u2290'],
+  [/\\NotSquareSuperset /g, '\u2290-00338'],
+  [/\\sqsubseteq /g, '\u2291'],
+  [/\\sqsupseteq /g, '\u2292'],
+  [/\\sqcap /g, '\u2293'],
+  [/\\sqcup /g, '\u2294'],
+  [/\\oplus /g, '\u2295'],
+  [/\\ominus /g, '\u2296'],
+  [/\\otimes /g, '\u2297'],
+  [/\\oslash /g, '\u2298'],
+  [/\\odot /g, '\u2299'],
+  [/\\circledcirc /g, '\u229A'],
+  [/\\circledast /g, '\u229B'],
+  [/\\circleddash /g, '\u229D'],
+  [/\\boxplus /g, '\u229E'],
+  [/\\boxminus /g, '\u229F'],
+  [/\\boxtimes /g, '\u22A0'],
+  [/\\boxdot /g, '\u22A1'],
+  [/\\vdash /g, '\u22A2'],
+  [/\\dashv /g, '\u22A3'],
+  [/\\top /g, '\u22A4'],
+  [/\\perp /g, '\u22A5'],
+  [/\\truestate /g, '\u22A7'],
+  [/\\forcesextra /g, '\u22A8'],
+  [/\\Vdash /g, '\u22A9'],
+  [/\\Vvdash /g, '\u22AA'],
+  [/\\VDash /g, '\u22AB'],
+  [/\\nvdash /g, '\u22AC'],
+  [/\\nvDash /g, '\u22AD'],
+  [/\\nVdash /g, '\u22AE'],
+  [/\\nVDash /g, '\u22AF'],
+  [/\\vartriangleleft /g, '\u22B2'],
+  [/\\vartriangleright /g, '\u22B3'],
+  [/\\trianglelefteq /g, '\u22B4'],
+  [/\\trianglerighteq /g, '\u22B5'],
+  [/\\original /g, '\u22B6'],
+  [/\\image /g, '\u22B7'],
+  [/\\multimap /g, '\u22B8'],
+  [/\\hermitconjmatrix /g, '\u22B9'],
+  [/\\intercal /g, '\u22BA'],
+  [/\\veebar /g, '\u22BB'],
+  [/\\rightanglearc /g, '\u22BE'],
+  [/\\ElsevierGlyph\{22C0\}/g, '\u22C0'],
+  [/\\ElsevierGlyph\{22C1\}/g, '\u22C1'],
+  [/\\bigcap /g, '\u22C2'],
+  [/\\bigcup /g, '\u22C3'],
+  [/\\diamond /g, '\u22C4'],
+  [/\\cdot /g, '\u22C5'],
+  [/\\star /g, '\u22C6'],
+  [/\\divideontimes /g, '\u22C7'],
+  [/\\bowtie /g, '\u22C8'],
+  [/\\ltimes /g, '\u22C9'],
+  [/\\rtimes /g, '\u22CA'],
+  [/\\leftthreetimes /g, '\u22CB'],
+  [/\\rightthreetimes /g, '\u22CC'],
+  [/\\backsimeq /g, '\u22CD'],
+  [/\\curlyvee /g, '\u22CE'],
+  [/\\curlywedge /g, '\u22CF'],
+  [/\\Subset /g, '\u22D0'],
+  [/\\Supset /g, '\u22D1'],
+  [/\\Cap /g, '\u22D2'],
+  [/\\Cup /g, '\u22D3'],
+  [/\\pitchfork /g, '\u22D4'],
+  [/\\lessdot /g, '\u22D6'],
+  [/\\gtrdot /g, '\u22D7'],
+  [/\\verymuchless /g, '\u22D8'],
+  [/\\verymuchgreater /g, '\u22D9'],
+  [/\\lesseqgtr /g, '\u22DA'],
+  [/\\gtreqless /g, '\u22DB'],
+  [/\\curlyeqprec /g, '\u22DE'],
+  [/\\curlyeqsucc /g, '\u22DF'],
+  [/\\not\\sqsubseteq /g, '\u22E2'],
+  [/\\not\\sqsupseteq /g, '\u22E3'],
+  [/\\Elzsqspne /g, '\u22E5'],
+  [/\\lnsim /g, '\u22E6'],
+  [/\\gnsim /g, '\u22E7'],
+  [/\\precedesnotsimilar /g, '\u22E8'],
+  [/\\succnsim /g, '\u22E9'],
+  [/\\ntriangleleft /g, '\u22EA'],
+  [/\\ntriangleright /g, '\u22EB'],
+  [/\\ntrianglelefteq /g, '\u22EC'],
+  [/\\ntrianglerighteq /g, '\u22ED'],
+  [/\\vdots /g, '\u22EE'],
+  [/\\cdots /g, '\u22EF'],
+  [/\\upslopeellipsis /g, '\u22F0'],
+  [/\\downslopeellipsis /g, '\u22F1'],
+  [/\\barwedge /g, '\u2305'],
+  [/\\perspcorrespond /g, '\u2306'],
+  [/\\lceil /g, '\u2308'],
+  [/\\rceil /g, '\u2309'],
+  [/\\lfloor /g, '\u230A'],
+  [/\\rfloor /g, '\u230B'],
+  [/\\recorder /g, '\u2315'],
+  [/\\mathchar"2208/g, '\u2316'],
+  [/\\ulcorner /g, '\u231C'],
+  [/\\urcorner /g, '\u231D'],
+  [/\\llcorner /g, '\u231E'],
+  [/\\lrcorner /g, '\u231F'],
+  [/\\frown /g, '\u2322'],
+  [/\\smile /g, '\u2323'],
+  [/\\langle /g, '\u2329'],
+  [/\\rangle /g, '\u232A'],
+  [/\\ElsevierGlyph\{E838\}/g, '\u233D'],
+  [/\\Elzdlcorn /g, '\u23A3'],
+  [/\\lmoustache /g, '\u23B0'],
+  [/\\rmoustache /g, '\u23B1'],
+  [/\\textvisiblespace /g, '\u2423'],
+  [/\\ding\{172\}/g, '\u2460'],
+  [/\\ding\{173\}/g, '\u2461'],
+  [/\\ding\{174\}/g, '\u2462'],
+  [/\\ding\{175\}/g, '\u2463'],
+  [/\\ding\{176\}/g, '\u2464'],
+  [/\\ding\{177\}/g, '\u2465'],
+  [/\\ding\{178\}/g, '\u2466'],
+  [/\\ding\{179\}/g, '\u2467'],
+  [/\\ding\{180\}/g, '\u2468'],
+  [/\\ding\{181\}/g, '\u2469'],
+  [/\\circledS /g, '\u24C8'],
+  [/\\Elzdshfnc /g, '\u2506'],
+  [/\\Elzsqfnw /g, '\u2519'],
+  [/\\diagup /g, '\u2571'],
+  [/\\ding\{110\}/g, '\u25A0'],
+  [/\\square /g, '\u25A1'],
+  [/\\blacksquare /g, '\u25AA'],
+  [/\\fbox\{~~\}/g, '\u25AD'],
+  [/\\Elzvrecto /g, '\u25AF'],
+  [/\\ElsevierGlyph\{E381\}/g, '\u25B1'],
+  [/\\ding\{115\}/g, '\u25B2'],
+  [/\\bigtriangleup /g, '\u25B3'],
+  [/\\blacktriangle /g, '\u25B4'],
+  [/\\vartriangle /g, '\u25B5'],
+  [/\\blacktriangleright /g, '\u25B8'],
+  [/\\triangleright /g, '\u25B9'],
+  [/\\ding\{116\}/g, '\u25BC'],
+  [/\\bigtriangledown /g, '\u25BD'],
+  [/\\blacktriangledown /g, '\u25BE'],
+  [/\\triangledown /g, '\u25BF'],
+  [/\\blacktriangleleft /g, '\u25C2'],
+  [/\\triangleleft /g, '\u25C3'],
+  [/\\ding\{117\}/g, '\u25C6'],
+  [/\\lozenge /g, '\u25CA'],
+  [/\\bigcirc /g, '\u25CB'],
+  [/\\ding\{108\}/g, '\u25CF'],
+  [/\\Elzcirfl /g, '\u25D0'],
+  [/\\Elzcirfr /g, '\u25D1'],
+  [/\\Elzcirfb /g, '\u25D2'],
+  [/\\ding\{119\}/g, '\u25D7'],
+  [/\\Elzrvbull /g, '\u25D8'],
+  [/\\Elzsqfl /g, '\u25E7'],
+  [/\\Elzsqfr /g, '\u25E8'],
+  [/\\Elzsqfse /g, '\u25EA'],
+  [/\\bigcirc /g, '\u25EF'],
+  [/\\ding\{72\}/g, '\u2605'],
+  [/\\ding\{73\}/g, '\u2606'],
+  [/\\ding\{37\}/g, '\u260E'],
+  [/\\ding\{42\}/g, '\u261B'],
+  [/\\ding\{43\}/g, '\u261E'],
+  [/\\rightmoon /g, '\u263E'],
+  [/\\mercury /g, '\u263F'],
+  [/\\venus /g, '\u2640'],
+  [/\\male /g, '\u2642'],
+  [/\\jupiter /g, '\u2643'],
+  [/\\saturn /g, '\u2644'],
+  [/\\uranus /g, '\u2645'],
+  [/\\neptune /g, '\u2646'],
+  [/\\pluto /g, '\u2647'],
+  [/\\aries /g, '\u2648'],
+  [/\\taurus /g, '\u2649'],
+  [/\\gemini /g, '\u264A'],
+  [/\\cancer /g, '\u264B'],
+  [/\\leo /g, '\u264C'],
+  [/\\virgo /g, '\u264D'],
+  [/\\libra /g, '\u264E'],
+  [/\\scorpio /g, '\u264F'],
+  [/\\sagittarius /g, '\u2650'],
+  [/\\capricornus /g, '\u2651'],
+  [/\\aquarius /g, '\u2652'],
+  [/\\pisces /g, '\u2653'],
+  [/\\ding\{171\}/g, '\u2660'],
+  [/\\diamond /g, '\u2662'],
+  [/\\ding\{168\}/g, '\u2663'],
+  [/\\ding\{170\}/g, '\u2665'],
+  [/\\ding\{169\}/g, '\u2666'],
+  [/\\quarternote /g, '\u2669'],
+  [/\\eighthnote /g, '\u266A'],
+  [/\\flat /g, '\u266D'],
+  [/\\natural /g, '\u266E'],
+  [/\\sharp /g, '\u266F'],
+  [/\\ding\{33\}/g, '\u2701'],
+  [/\\ding\{34\}/g, '\u2702'],
+  [/\\ding\{35\}/g, '\u2703'],
+  [/\\ding\{36\}/g, '\u2704'],
+  [/\\ding\{38\}/g, '\u2706'],
+  [/\\ding\{39\}/g, '\u2707'],
+  [/\\ding\{40\}/g, '\u2708'],
+  [/\\ding\{41\}/g, '\u2709'],
+  [/\\ding\{44\}/g, '\u270C'],
+  [/\\ding\{45\}/g, '\u270D'],
+  [/\\ding\{46\}/g, '\u270E'],
+  [/\\ding\{47\}/g, '\u270F'],
+  [/\\ding\{48\}/g, '\u2710'],
+  [/\\ding\{49\}/g, '\u2711'],
+  [/\\ding\{50\}/g, '\u2712'],
+  [/\\ding\{51\}/g, '\u2713'],
+  [/\\ding\{52\}/g, '\u2714'],
+  [/\\ding\{53\}/g, '\u2715'],
+  [/\\ding\{54\}/g, '\u2716'],
+  [/\\ding\{55\}/g, '\u2717'],
+  [/\\ding\{56\}/g, '\u2718'],
+  [/\\ding\{57\}/g, '\u2719'],
+  [/\\ding\{58\}/g, '\u271A'],
+  [/\\ding\{59\}/g, '\u271B'],
+  [/\\ding\{60\}/g, '\u271C'],
+  [/\\ding\{61\}/g, '\u271D'],
+  [/\\ding\{62\}/g, '\u271E'],
+  [/\\ding\{63\}/g, '\u271F'],
+  [/\\ding\{64\}/g, '\u2720'],
+  [/\\ding\{65\}/g, '\u2721'],
+  [/\\ding\{66\}/g, '\u2722'],
+  [/\\ding\{67\}/g, '\u2723'],
+  [/\\ding\{68\}/g, '\u2724'],
+  [/\\ding\{69\}/g, '\u2725'],
+  [/\\ding\{70\}/g, '\u2726'],
+  [/\\ding\{71\}/g, '\u2727'],
+  [/\\ding\{73\}/g, '\u2729'],
+  [/\\ding\{74\}/g, '\u272A'],
+  [/\\ding\{75\}/g, '\u272B'],
+  [/\\ding\{76\}/g, '\u272C'],
+  [/\\ding\{77\}/g, '\u272D'],
+  [/\\ding\{78\}/g, '\u272E'],
+  [/\\ding\{79\}/g, '\u272F'],
+  [/\\ding\{80\}/g, '\u2730'],
+  [/\\ding\{81\}/g, '\u2731'],
+  [/\\ding\{82\}/g, '\u2732'],
+  [/\\ding\{83\}/g, '\u2733'],
+  [/\\ding\{84\}/g, '\u2734'],
+  [/\\ding\{85\}/g, '\u2735'],
+  [/\\ding\{86\}/g, '\u2736'],
+  [/\\ding\{87\}/g, '\u2737'],
+  [/\\ding\{88\}/g, '\u2738'],
+  [/\\ding\{89\}/g, '\u2739'],
+  [/\\ding\{90\}/g, '\u273A'],
+  [/\\ding\{91\}/g, '\u273B'],
+  [/\\ding\{92\}/g, '\u273C'],
+  [/\\ding\{93\}/g, '\u273D'],
+  [/\\ding\{94\}/g, '\u273E'],
+  [/\\ding\{95\}/g, '\u273F'],
+  [/\\ding\{96\}/g, '\u2740'],
+  [/\\ding\{97\}/g, '\u2741'],
+  [/\\ding\{98\}/g, '\u2742'],
+  [/\\ding\{99\}/g, '\u2743'],
+  [/\\ding\{100\}/g, '\u2744'],
+  [/\\ding\{101\}/g, '\u2745'],
+  [/\\ding\{102\}/g, '\u2746'],
+  [/\\ding\{103\}/g, '\u2747'],
+  [/\\ding\{104\}/g, '\u2748'],
+  [/\\ding\{105\}/g, '\u2749'],
+  [/\\ding\{106\}/g, '\u274A'],
+  [/\\ding\{107\}/g, '\u274B'],
+  [/\\ding\{109\}/g, '\u274D'],
+  [/\\ding\{111\}/g, '\u274F'],
+  [/\\ding\{112\}/g, '\u2750'],
+  [/\\ding\{113\}/g, '\u2751'],
+  [/\\ding\{114\}/g, '\u2752'],
+  [/\\ding\{118\}/g, '\u2756'],
+  [/\\ding\{120\}/g, '\u2758'],
+  [/\\ding\{121\}/g, '\u2759'],
+  [/\\ding\{122\}/g, '\u275A'],
+  [/\\ding\{123\}/g, '\u275B'],
+  [/\\ding\{124\}/g, '\u275C'],
+  [/\\ding\{125\}/g, '\u275D'],
+  [/\\ding\{126\}/g, '\u275E'],
+  [/\\ding\{161\}/g, '\u2761'],
+  [/\\ding\{162\}/g, '\u2762'],
+  [/\\ding\{163\}/g, '\u2763'],
+  [/\\ding\{164\}/g, '\u2764'],
+  [/\\ding\{165\}/g, '\u2765'],
+  [/\\ding\{166\}/g, '\u2766'],
+  [/\\ding\{167\}/g, '\u2767'],
+  [/\\ding\{182\}/g, '\u2776'],
+  [/\\ding\{183\}/g, '\u2777'],
+  [/\\ding\{184\}/g, '\u2778'],
+  [/\\ding\{185\}/g, '\u2779'],
+  [/\\ding\{186\}/g, '\u277A'],
+  [/\\ding\{187\}/g, '\u277B'],
+  [/\\ding\{188\}/g, '\u277C'],
+  [/\\ding\{189\}/g, '\u277D'],
+  [/\\ding\{190\}/g, '\u277E'],
+  [/\\ding\{191\}/g, '\u277F'],
+  [/\\ding\{192\}/g, '\u2780'],
+  [/\\ding\{193\}/g, '\u2781'],
+  [/\\ding\{194\}/g, '\u2782'],
+  [/\\ding\{195\}/g, '\u2783'],
+  [/\\ding\{196\}/g, '\u2784'],
+  [/\\ding\{197\}/g, '\u2785'],
+  [/\\ding\{198\}/g, '\u2786'],
+  [/\\ding\{199\}/g, '\u2787'],
+  [/\\ding\{200\}/g, '\u2788'],
+  [/\\ding\{201\}/g, '\u2789'],
+  [/\\ding\{202\}/g, '\u278A'],
+  [/\\ding\{203\}/g, '\u278B'],
+  [/\\ding\{204\}/g, '\u278C'],
+  [/\\ding\{205\}/g, '\u278D'],
+  [/\\ding\{206\}/g, '\u278E'],
+  [/\\ding\{207\}/g, '\u278F'],
+  [/\\ding\{208\}/g, '\u2790'],
+  [/\\ding\{209\}/g, '\u2791'],
+  [/\\ding\{210\}/g, '\u2792'],
+  [/\\ding\{211\}/g, '\u2793'],
+  [/\\ding\{212\}/g, '\u2794'],
+  [/\\ding\{216\}/g, '\u2798'],
+  [/\\ding\{217\}/g, '\u2799'],
+  [/\\ding\{218\}/g, '\u279A'],
+  [/\\ding\{219\}/g, '\u279B'],
+  [/\\ding\{220\}/g, '\u279C'],
+  [/\\ding\{221\}/g, '\u279D'],
+  [/\\ding\{222\}/g, '\u279E'],
+  [/\\ding\{223\}/g, '\u279F'],
+  [/\\ding\{224\}/g, '\u27A0'],
+  [/\\ding\{225\}/g, '\u27A1'],
+  [/\\ding\{226\}/g, '\u27A2'],
+  [/\\ding\{227\}/g, '\u27A3'],
+  [/\\ding\{228\}/g, '\u27A4'],
+  [/\\ding\{229\}/g, '\u27A5'],
+  [/\\ding\{230\}/g, '\u27A6'],
+  [/\\ding\{231\}/g, '\u27A7'],
+  [/\\ding\{232\}/g, '\u27A8'],
+  [/\\ding\{233\}/g, '\u27A9'],
+  [/\\ding\{234\}/g, '\u27AA'],
+  [/\\ding\{235\}/g, '\u27AB'],
+  [/\\ding\{236\}/g, '\u27AC'],
+  [/\\ding\{237\}/g, '\u27AD'],
+  [/\\ding\{238\}/g, '\u27AE'],
+  [/\\ding\{239\}/g, '\u27AF'],
+  [/\\ding\{241\}/g, '\u27B1'],
+  [/\\ding\{242\}/g, '\u27B2'],
+  [/\\ding\{243\}/g, '\u27B3'],
+  [/\\ding\{244\}/g, '\u27B4'],
+  [/\\ding\{245\}/g, '\u27B5'],
+  [/\\ding\{246\}/g, '\u27B6'],
+  [/\\ding\{247\}/g, '\u27B7'],
+  [/\\ding\{248\}/g, '\u27B8'],
+  [/\\ding\{249\}/g, '\u27B9'],
+  [/\\ding\{250\}/g, '\u27BA'],
+  [/\\ding\{251\}/g, '\u27BB'],
+  [/\\ding\{252\}/g, '\u27BC'],
+  [/\\ding\{253\}/g, '\u27BD'],
+  [/\\ding\{254\}/g, '\u27BE'],
+  [/\\longleftarrow /g, '\u27F5'],
+  [/\\longrightarrow /g, '\u27F6'],
+  [/\\longleftrightarrow /g, '\u27F7'],
+  [/\\Longleftarrow /g, '\u27F8'],
+  [/\\Longrightarrow /g, '\u27F9'],
+  [/\\Longleftrightarrow /g, '\u27FA'],
+  [/\\longmapsto /g, '\u27FC'],
+  [/\\sim\\joinrel\\leadsto/g, '\u27FF'],
+  [/\\ElsevierGlyph\{E212\}/g, '\u2905'],
+  [/\\UpArrowBar /g, '\u2912'],
+  [/\\DownArrowBar /g, '\u2913'],
+  [/\\ElsevierGlyph\{E20C\}/g, '\u2923'],
+  [/\\ElsevierGlyph\{E20D\}/g, '\u2924'],
+  [/\\ElsevierGlyph\{E20B\}/g, '\u2925'],
+  [/\\ElsevierGlyph\{E20A\}/g, '\u2926'],
+  [/\\ElsevierGlyph\{E211\}/g, '\u2927'],
+  [/\\ElsevierGlyph\{E20E\}/g, '\u2928'],
+  [/\\ElsevierGlyph\{E20F\}/g, '\u2929'],
+  [/\\ElsevierGlyph\{E210\}/g, '\u292A'],
+  [/\\ElsevierGlyph\{E21C\}/g, '\u2933'],
+  [/\\ElsevierGlyph\{E21D\}/g, '\u2933-00338'],
+  [/\\ElsevierGlyph\{E21A\}/g, '\u2936'],
+  [/\\ElsevierGlyph\{E219\}/g, '\u2937'],
+  [/\\Elolarr /g, '\u2940'],
+  [/\\Elorarr /g, '\u2941'],
+  [/\\ElzRlarr /g, '\u2942'],
+  [/\\ElzrLarr /g, '\u2944'],
+  [/\\Elzrarrx /g, '\u2947'],
+  [/\\LeftRightVector /g, '\u294E'],
+  [/\\RightUpDownVector /g, '\u294F'],
+  [/\\DownLeftRightVector /g, '\u2950'],
+  [/\\LeftUpDownVector /g, '\u2951'],
+  [/\\LeftVectorBar /g, '\u2952'],
+  [/\\RightVectorBar /g, '\u2953'],
+  [/\\RightUpVectorBar /g, '\u2954'],
+  [/\\RightDownVectorBar /g, '\u2955'],
+  [/\\DownLeftVectorBar /g, '\u2956'],
+  [/\\DownRightVectorBar /g, '\u2957'],
+  [/\\LeftUpVectorBar /g, '\u2958'],
+  [/\\LeftDownVectorBar /g, '\u2959'],
+  [/\\LeftTeeVector /g, '\u295A'],
+  [/\\RightTeeVector /g, '\u295B'],
+  [/\\RightUpTeeVector /g, '\u295C'],
+  [/\\RightDownTeeVector /g, '\u295D'],
+  [/\\DownLeftTeeVector /g, '\u295E'],
+  [/\\DownRightTeeVector /g, '\u295F'],
+  [/\\LeftUpTeeVector /g, '\u2960'],
+  [/\\LeftDownTeeVector /g, '\u2961'],
+  [/\\UpEquilibrium /g, '\u296E'],
+  [/\\ReverseUpEquilibrium /g, '\u296F'],
+  [/\\RoundImplies /g, '\u2970'],
+  [/\\ElsevierGlyph\{E214\}/g, '\u297C'],
+  [/\\ElsevierGlyph\{E215\}/g, '\u297D'],
+  [/\\Elztfnc /g, '\u2980'],
+  [/\\ElsevierGlyph\{3018\}/g, '\u2985'],
+  [/\\Elroang /g, '\u2986'],
+  [/\\ElsevierGlyph\{E291\}/g, '\u2994'],
+  [/\\Elzddfnc /g, '\u2999'],
+  [/\\Angle /g, '\u299C'],
+  [/\\Elzlpargt /g, '\u29A0'],
+  [/\\ElsevierGlyph\{E260\}/g, '\u29B5'],
+  [/\\ElsevierGlyph\{E61B\}/g, '\u29B6'],
+  [/\\ElzLap /g, '\u29CA'],
+  [/\\Elzdefas /g, '\u29CB'],
+  [/\\LeftTriangleBar /g, '\u29CF'],
+  [/\\NotLeftTriangleBar /g, '\u29CF-00338'],
+  [/\\RightTriangleBar /g, '\u29D0'],
+  [/\\NotRightTriangleBar /g, '\u29D0-00338'],
+  [/\\ElsevierGlyph\{E372\}/g, '\u29DC'],
+  [/\\blacklozenge /g, '\u29EB'],
+  [/\\RuleDelayed /g, '\u29F4'],
+  [/\\Elxuplus /g, '\u2A04'],
+  [/\\ElzThr /g, '\u2A05'],
+  [/\\Elxsqcup /g, '\u2A06'],
+  [/\\ElzInf /g, '\u2A07'],
+  [/\\ElzSup /g, '\u2A08'],
+  [/\\ElzCint /g, '\u2A0D'],
+  [/\\clockoint /g, '\u2A0F'],
+  [/\\ElsevierGlyph\{E395\}/g, '\u2A10'],
+  [/\\sqrint /g, '\u2A16'],
+  [/\\ElsevierGlyph\{E25A\}/g, '\u2A25'],
+  [/\\ElsevierGlyph\{E25B\}/g, '\u2A2A'],
+  [/\\ElsevierGlyph\{E25C\}/g, '\u2A2D'],
+  [/\\ElsevierGlyph\{E25D\}/g, '\u2A2E'],
+  [/\\ElzTimes /g, '\u2A2F'],
+  [/\\ElsevierGlyph\{E25E\}/g, '\u2A34'],
+  [/\\ElsevierGlyph\{E25E\}/g, '\u2A35'],
+  [/\\ElsevierGlyph\{E259\}/g, '\u2A3C'],
+  [/\\amalg /g, '\u2A3F'],
+  [/\\ElzAnd /g, '\u2A53'],
+  [/\\ElzOr /g, '\u2A54'],
+  [/\\ElsevierGlyph\{E36E\}/g, '\u2A55'],
+  [/\\ElOr /g, '\u2A56'],
+  [/\\perspcorrespond /g, '\u2A5E'],
+  [/\\Elzminhat /g, '\u2A5F'],
+  [/\\ElsevierGlyph\{225A\}/g, '\u2A63'],
+  [/\\stackrel\{*\}\{=\}/g, '\u2A6E'],
+  [/\\Equal /g, '\u2A75'],
+  [/\\leqslant /g, '\u2A7D'],
+  [/\\nleqslant /g, '\u2A7D-00338'],
+  [/\\geqslant /g, '\u2A7E'],
+  [/\\ngeqslant /g, '\u2A7E-00338'],
+  [/\\lessapprox /g, '\u2A85'],
+  [/\\gtrapprox /g, '\u2A86'],
+  [/\\lneq /g, '\u2A87'],
+  [/\\gneq /g, '\u2A88'],
+  [/\\lnapprox /g, '\u2A89'],
+  [/\\gnapprox /g, '\u2A8A'],
+  [/\\lesseqqgtr /g, '\u2A8B'],
+  [/\\gtreqqless /g, '\u2A8C'],
+  [/\\eqslantless /g, '\u2A95'],
+  [/\\eqslantgtr /g, '\u2A96'],
+  [/\\Pisymbol\{ppi020\}\{117\}/g, '\u2A9D'],
+  [/\\Pisymbol\{ppi020\}\{105\}/g, '\u2A9E'],
+  [/\\NestedLessLess /g, '\u2AA1'],
+  [/\\NotNestedLessLess /g, '\u2AA1-00338'],
+  [/\\NestedGreaterGreater /g, '\u2AA2'],
+  [/\\NotNestedGreaterGreater /g, '\u2AA2-00338'],
+  [/\\preceq /g, '\u2AAF'],
+  [/\\not\\preceq /g, '\u2AAF-00338'],
+  [/\\succeq /g, '\u2AB0'],
+  [/\\not\\succeq /g, '\u2AB0-00338'],
+  [/\\precneqq /g, '\u2AB5'],
+  [/\\succneqq /g, '\u2AB6'],
+  [/\\precapprox /g, '\u2AB7'],
+  [/\\succapprox /g, '\u2AB8'],
+  [/\\precnapprox /g, '\u2AB9'],
+  [/\\succnapprox /g, '\u2ABA'],
+  [/\\subseteqq /g, '\u2AC5'],
+  [/\\nsubseteqq /g, '\u2AC5-00338'],
+  [/\\supseteqq /g, '\u2AC6'],
+  [/\\nsupseteqq/g, '\u2AC6-00338'],
+  [/\\subsetneqq /g, '\u2ACB'],
+  [/\\supsetneqq /g, '\u2ACC'],
+  [/\\ElsevierGlyph\{E30D\}/g, '\u2AEB'],
+  [/\\Elztdcol /g, '\u2AF6'],
+  [/\\ElsevierGlyph\{300A\}/g, '\u300A'],
+  [/\\ElsevierGlyph\{300B\}/g, '\u300B'],
+  [/\\ElsevierGlyph\{3018\}/g, '\u3018'],
+  [/\\ElsevierGlyph\{3019\}/g, '\u3019'],
+  [/\\openbracketleft /g, '\u301A'],
+  [/\\openbracketright /g, '\u301B'],
+]
+
+export default BibtexParser
+if (typeof module !== 'undefined' && module.exports) {
+  module.exports = BibtexParser
+}
diff --git a/services/references/buildscript.txt b/services/references/buildscript.txt
new file mode 100644
index 0000000000..05771cd85a
--- /dev/null
+++ b/services/references/buildscript.txt
@@ -0,0 +1,9 @@
+references
+--dependencies=mongo
+--docker-repos=us-east1-docker.pkg.dev/overleaf-ops/ol-docker
+--env-add=
+--env-pass-through=
+--esmock-loader=True
+--node-version=20.18.2
+--public-repo=False
+--script-version=4.5.0
diff --git a/services/references/config/settings.defaults.cjs b/services/references/config/settings.defaults.cjs
new file mode 100644
index 0000000000..2551f99f09
--- /dev/null
+++ b/services/references/config/settings.defaults.cjs
@@ -0,0 +1,9 @@
+module.exports = {
+  internal: {
+    references: {
+      port: 3056,
+      host: process.env.REFERENCES_HOST || '127.0.0.1',
+    },
+  },
+}
+
diff --git a/services/references/docker-compose.ci.yml b/services/references/docker-compose.ci.yml
new file mode 100644
index 0000000000..51eb64d126
--- /dev/null
+++ b/services/references/docker-compose.ci.yml
@@ -0,0 +1,52 @@
+# This file was auto-generated, do not edit it directly.
+# Instead run bin/update_build_scripts from
+# https://github.com/overleaf/internal/
+
+version: "2.3"
+
+services:
+  test_unit:
+    image: ci/$PROJECT_NAME:$BRANCH_NAME-$BUILD_NUMBER
+    user: node
+    command: npm run test:unit:_run
+    environment:
+      NODE_ENV: test
+      NODE_OPTIONS: "--unhandled-rejections=strict"
+
+
+  test_acceptance:
+    build: .
+    image: ci/$PROJECT_NAME:$BRANCH_NAME-$BUILD_NUMBER
+    environment:
+      ELASTIC_SEARCH_DSN: es:9200
+      MONGO_HOST: mongo
+      POSTGRES_HOST: postgres
+      MOCHA_GREP: ${MOCHA_GREP}
+      NODE_ENV: test
+      NODE_OPTIONS: "--unhandled-rejections=strict"
+    depends_on:
+      mongo:
+        condition: service_started
+    user: node
+    command: npm run test:acceptance
+
+
+  tar:
+    build: .
+    image: ci/$PROJECT_NAME:$BRANCH_NAME-$BUILD_NUMBER
+    volumes:
+      - ./:/tmp/build/
+    command: tar -czf /tmp/build/build.tar.gz --exclude=build.tar.gz --exclude-vcs .
+    user: root
+  mongo:
+    image: mongo:6.0.13
+    command: --replSet overleaf
+    volumes:
+      - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
+    environment:
+      MONGO_INITDB_DATABASE: sharelatex
+    extra_hosts:
+      # Required when using the automatic database setup for initializing the
+      # replica set. This override is not needed when running the setup after
+      # starting up mongo.
+      - mongo:127.0.0.1
diff --git a/services/references/docker-compose.yml b/services/references/docker-compose.yml
new file mode 100644
index 0000000000..ad71431768
--- /dev/null
+++ b/services/references/docker-compose.yml
@@ -0,0 +1,56 @@
+# This file was auto-generated, do not edit it directly.
+# Instead run bin/update_build_scripts from
+# https://github.com/overleaf/internal/
+
+version: "2.3"
+
+services:
+  test_unit:
+    image: node:20.18.2
+    volumes:
+      - .:/overleaf/services/references
+      - ../../node_modules:/overleaf/node_modules
+      - ../../libraries:/overleaf/libraries
+    working_dir: /overleaf/services/references
+    environment:
+      MOCHA_GREP: ${MOCHA_GREP}
+      LOG_LEVEL: ${LOG_LEVEL:-}
+      NODE_ENV: test
+      NODE_OPTIONS: "--unhandled-rejections=strict"
+    command: npm run --silent test:unit
+    user: node
+
+  test_acceptance:
+    image: node:20.18.2
+    volumes:
+      - .:/overleaf/services/references
+      - ../../node_modules:/overleaf/node_modules
+      - ../../libraries:/overleaf/libraries
+    working_dir: /overleaf/services/references
+    environment:
+      ELASTIC_SEARCH_DSN: es:9200
+      MONGO_HOST: mongo
+      POSTGRES_HOST: postgres
+      MOCHA_GREP: ${MOCHA_GREP}
+      LOG_LEVEL: ${LOG_LEVEL:-}
+      NODE_ENV: test
+      NODE_OPTIONS: "--unhandled-rejections=strict"
+    user: node
+    depends_on:
+      mongo:
+        condition: service_started
+    command: npm run --silent test:acceptance
+
+  mongo:
+    image: mongo:6.0.13
+    command: --replSet overleaf
+    volumes:
+      - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
+    environment:
+      MONGO_INITDB_DATABASE: sharelatex
+    extra_hosts:
+      # Required when using the automatic database setup for initializing the
+      # replica set. This override is not needed when running the setup after
+      # starting up mongo.
+      - mongo:127.0.0.1
+
diff --git a/services/references/package.json b/services/references/package.json
new file mode 100644
index 0000000000..9b0988e7ac
--- /dev/null
+++ b/services/references/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "@overleaf/references",
+  "description": "An API for providing citation-keys",
+  "private": true,
+  "type": "module",
+  "main": "app.js",
+  "scripts": {
+    "start": "node app.js"
+  },
+  "version": "0.1.0",
+  "dependencies": {
+    "@overleaf/settings": "*",
+    "@overleaf/logger": "*",
+    "@overleaf/metrics": "*",
+    "async": "^3.2.5",
+    "express": "^4.21.2"
+  },
+  "devDependencies": {
+    "chai": "^4.3.6",
+    "chai-as-promised": "^7.1.1",
+    "esmock": "^2.6.9",
+    "mocha": "^11.1.0",
+    "sinon": "^9.2.4",
+    "typescript": "^5.0.4"
+  }
+}
diff --git a/services/references/tsconfig.json b/services/references/tsconfig.json
new file mode 100644
index 0000000000..d3fdd3022a
--- /dev/null
+++ b/services/references/tsconfig.json
@@ -0,0 +1,12 @@
+{
+  "extends": "../../tsconfig.backend.json",
+  "include": [
+    "app.js",
+    "app/js/**/*",
+    "benchmarks/**/*",
+    "config/**/*",
+    "scripts/**/*",
+    "test/**/*",
+    "types"
+  ]
+}
diff --git a/services/web/.eslintrc.js b/services/web/.eslintrc.js
index 47d15bca87..7dd154c942 100644
--- a/services/web/.eslintrc.js
+++ b/services/web/.eslintrc.js
@@ -1,3 +1,7 @@
+const _ = require('lodash')
+const confusingBrowserGlobals = require('confusing-browser-globals')
+const globals = require('globals')
+
 module.exports = {
   root: true,
   parser: '@typescript-eslint/parser',
@@ -19,6 +23,7 @@ module.exports = {
   },
   rules: {
     'no-constant-binary-expression': 'error',
+    'no-restricted-globals': ['error', ...confusingBrowserGlobals],
 
     // do not allow importing of implicit dependencies.
     'import/no-extraneous-dependencies': 'error',
@@ -39,6 +44,12 @@ module.exports = {
       'error',
       { functions: false, classes: false, variables: false },
     ],
+    'react-hooks/exhaustive-deps': [
+      'warn',
+      {
+        additionalHooks: '(useCommandProvider)',
+      },
+    ],
   },
   overrides: [
     // NOTE: changing paths may require updating them in the Makefile too.
@@ -58,6 +69,10 @@ module.exports = {
     {
       // Test specific rules
       files: ['**/test/**/*.*'],
+      excludedFiles: [
+        '**/test/unit/src/**/*.test.mjs',
+        'test/unit/vitest_bootstrap.mjs',
+      ], // exclude vitest files
       plugins: ['mocha', 'chai-expect', 'chai-friendly'],
       env: {
         mocha: true,
@@ -89,6 +104,30 @@ module.exports = {
         '@typescript-eslint/no-unused-expressions': 'off',
       },
     },
+    {
+      files: [
+        '**/test/unit/src/**/*.test.mjs',
+        'test/unit/vitest_bootstrap.mjs',
+      ],
+      env: {
+        jest: true, // best match for vitest API etc.
+      },
+      plugins: ['@vitest', 'chai-expect', 'chai-friendly'], // still using chai for now
+      rules: {
+        // vitest-specific rules
+        '@vitest/no-focused-tests': 'error',
+        '@vitest/no-disabled-tests': 'error',
+
+        // Swap the no-unused-expressions rule with a more chai-friendly one
+        'no-unused-expressions': 'off',
+        'chai-friendly/no-unused-expressions': 'error',
+
+        // chai-specific rules
+        'chai-expect/missing-assertion': 'error',
+        'chai-expect/terminating-properties': 'error',
+        '@typescript-eslint/no-unused-expressions': 'off',
+      },
+    },
     {
       // ES specific rules
       files: [
@@ -349,6 +388,18 @@ module.exports = {
               'Modify location via customLocalStorage instead of calling window.localStorage methods directly',
           },
         ],
+        'no-unused-vars': 'off',
+        '@typescript-eslint/no-unused-vars': [
+          'error',
+          {
+            args: 'after-used',
+            argsIgnorePattern: '^_',
+            ignoreRestSiblings: false,
+            caughtErrors: 'none',
+            vars: 'all',
+            varsIgnorePattern: '^_',
+          },
+        ],
       },
     },
     {
@@ -485,5 +536,17 @@ module.exports = {
         'no-console': 'error',
       },
     },
+    {
+      files: ['**/*.worker.{js,ts}'],
+      rules: {
+        'no-restricted-globals': [
+          'error',
+          ..._.difference(
+            Object.keys({ ...globals.browser, ...globals.node }),
+            Object.keys(globals.worker)
+          ),
+        ],
+      },
+    },
   ],
 }
diff --git a/services/web/.gitignore b/services/web/.gitignore
index 8bd23b7f0a..9946f23ae6 100644
--- a/services/web/.gitignore
+++ b/services/web/.gitignore
@@ -1,51 +1,6 @@
-# Compiled source #
-###################
-*.com
-*.class
-*.dll
-*.exe
-*.o
-*.so
-
-# Packages #
-############
-# it's better to unpack these files and commit the raw source
-# git has its own built in compression methods
-*.7z
-*.dmg
-*.gz
-*.iso
-*.jar
-*.rar
-*.tar
-*.zip
-
-# Logs and databases #
-######################
-*.log
-*.sql
-*.sqlite
-
-# OS generated files #
-######################
-.DS_Store?
-ehthumbs.db
-Icon?
-Thumbs.db
-
-# allow "icons"
-![Ii]cons
-
-node_modules/*
 data/*
 coverage
 
-cookies.txt
-requestQueueWorker.js
-TpdsWorker.js
-BackgroundJobsWorker.js
-UserAndProjectPopulator.coffee
-
 public/manifest.json
 
 public/js
@@ -54,22 +9,6 @@ public/stylesheets
 public/fonts
 public/images
 
-Gemfile.lock
-
-*.swp
-.DS_Store
-
-docker-shared.yml
-
-config/*.coffee
-!config/settings.defaults.coffee
-!config/settings.webpack.coffee
-config/*.js
-!config/settings.defaults.js
-!config/settings.webpack.js
-!config/settings.overrides.saas.js
-!config/settings.overrides.server-pro.js
-
 modules/**/Makefile
 
 # Precompiled pug files
@@ -78,13 +17,6 @@ modules/**/Makefile
 # Sentry secrets file (injected by CI)
 .sentryclirc
 
-# via dev-environment
-.npmrc
-
-# Intellij
-.idea
-.run
-
 # Cypress
 cypress/screenshots/
 cypress/videos/
diff --git a/services/web/.nvmrc b/services/web/.nvmrc
index 0254b1e633..fc37597bcc 100644
--- a/services/web/.nvmrc
+++ b/services/web/.nvmrc
@@ -1 +1 @@
-20.18.2
+22.17.0
diff --git a/services/web/.prettierignore b/services/web/.prettierignore
index f4be187b87..2e8db8b35b 100644
--- a/services/web/.prettierignore
+++ b/services/web/.prettierignore
@@ -6,9 +6,35 @@ frontend/js/vendor
 modules/**/frontend/js/vendor
 public/js
 public/minjs
+frontend/stylesheets/bootstrap-5/modules/metrics/nvd3.scss
 frontend/stylesheets/components/nvd3.less
 frontend/js/features/source-editor/lezer-latex/latex.mjs
 frontend/js/features/source-editor/lezer-latex/latex.terms.mjs
 frontend/js/features/source-editor/lezer-bibtex/bibtex.mjs
 frontend/js/features/source-editor/lezer-bibtex/bibtex.terms.mjs
 frontend/js/features/source-editor/hunspell/wasm/hunspell.mjs
+
+# complex pages
+app/views/project/editor.pug
+app/views/project/editor/**
+modules/open-in-overleaf/app/views/documentation.pug
+modules/references-search/app/views/project/editor/**
+modules/rich-text/app/views/toolbar.pug
+
+# loops
+app/views/referal/bonus.pug
+modules/templates/app/views/tag.pug
+
+# expressions that could not be formatted correctly
+app/views/_mixins/faq_search.pug
+app/views/external/home/v2.pug
+app/views/project/token/access.pug
+app/views/user/primaryEmailCheck.pug
+app/views/user/restricted.pug
+modules/admin-panel/app/views/project/show.pug
+modules/templates/app/views/project/editor/_left-menu.pug
+modules/two-factor-authentication/app/views/_mixins.pug
+
+# minified files
+app/views/_google_analytics.pug
+app/views/_customer_io.pug
diff --git a/services/web/.prettierrc b/services/web/.prettierrc
index 13e31862ff..b99212a874 100644
--- a/services/web/.prettierrc
+++ b/services/web/.prettierrc
@@ -1,9 +1,23 @@
 {
   "arrowParens": "avoid",
   "jsxSingleQuote": false,
+  "pugAttributeSeparator": "as-needed",
+  "pugBracketSpacing": false,
+  "pugClassNotation": "as-is",
+  "pugIdNotation": "as-is",
+  "pugSortAttributesBeginning": ["name", "data-type"],
+  "plugins": ["@prettier/plugin-pug"],
   "semi": false,
   "singleQuote": true,
   "trailingComma": "es5",
   "tabWidth": 2,
-  "useTabs": false
+  "useTabs": false,
+  "overrides": [
+    {
+      "files": "*.pug",
+      "options": {
+        "useTabs": true
+      }
+    }
+  ]
 }
diff --git a/services/web/.storybook/preview.tsx b/services/web/.storybook/preview.tsx
index ed67abc3c4..c5d50da27a 100644
--- a/services/web/.storybook/preview.tsx
+++ b/services/web/.storybook/preview.tsx
@@ -9,14 +9,16 @@ import i18n from 'i18next'
 import { initReactI18next } from 'react-i18next'
 // @ts-ignore
 import en from '../../../services/web/locales/en.json'
-import { bootstrapVersionArg } from './utils/with-bootstrap-switcher'
 
-function resetMeta(bootstrapVersion?: 3 | 5) {
+function resetMeta() {
   window.metaAttributesCache = new Map()
   window.metaAttributesCache.set('ol-i18n', { currentLangCode: 'en' })
-  if (bootstrapVersion) {
-    window.metaAttributesCache.set('ol-bootstrapVersion', bootstrapVersion)
-  }
+  window.metaAttributesCache.set('ol-projectHistoryBlobsEnabled', true)
+  window.metaAttributesCache.set('ol-capabilities', ['chat'])
+  window.metaAttributesCache.set('ol-compileSettings', {
+    reducedTimeoutWarning: 'default',
+    compileTimeout: 20,
+  })
   window.metaAttributesCache.set('ol-ExposedSettings', {
     adminEmail: 'placeholder@example.com',
     appName: 'Overleaf',
@@ -126,8 +128,12 @@ const preview: Preview = {
       // render stories in iframes, to isolate modals
       inlineStories: false,
     },
-    // Default to Bootstrap 5 styles
-    bootstrap5: true,
+    options: {
+      storySort: {
+        method: 'alphabetical',
+        order: ['Shared'],
+      },
+    },
   },
   globalTypes: {
     theme: {
@@ -144,17 +150,9 @@ const preview: Preview = {
     },
   },
   loaders: [
-    async ({ globals }) => {
-      const { theme } = globals
-
+    async () => {
       return {
-        // NOTE: this uses `${theme}style.less` rather than `${theme}.less`
-        // so that webpack only bundles files ending with "style.less"
-        bootstrap3Style: await import(
-          `!!to-string-loader!css-loader!less-loader!../../../services/web/frontend/stylesheets/${theme}style.less`
-        ),
-        // Themes are applied differently in Bootstrap 5 code
-        bootstrap5Style: await import(
+        mainStyle: await import(
           // @ts-ignore
           `!!to-string-loader!css-loader!resolve-url-loader!sass-loader!../../../services/web/frontend/stylesheets/bootstrap-5/main-style.scss`
         ),
@@ -163,15 +161,9 @@ const preview: Preview = {
   ],
   decorators: [
     (Story, context) => {
-      const { bootstrap3Style, bootstrap5Style } = context.loaded
-      const bootstrapVersion = Number(
-        context.args[bootstrapVersionArg] ||
-          (context.parameters.bootstrap5 === false ? 3 : 5)
-      ) as 3 | 5
-      const activeStyle =
-        bootstrapVersion === 3 ? bootstrap3Style : bootstrap5Style
+      const { mainStyle } = context.loaded
 
-      resetMeta(bootstrapVersion)
+      resetMeta()
 
       return (
         <div
@@ -179,12 +171,8 @@ const preview: Preview = {
             context.globals.theme === 'main-light-' ? 'light' : 'default'
           }
         >
-          {activeStyle && <style>{activeStyle.default}</style>}
-          <Story
-            {...context}
-            // force re-renders when switching between Bootstrap versions
-            key={bootstrapVersion}
-          />
+          {mainStyle && <style>{mainStyle.default}</style>}
+          <Story {...context} />
         </div>
       )
     },
diff --git a/services/web/.storybook/utils/with-bootstrap-switcher.tsx b/services/web/.storybook/utils/with-bootstrap-switcher.tsx
deleted file mode 100644
index 640338dbb0..0000000000
--- a/services/web/.storybook/utils/with-bootstrap-switcher.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Meta } from '@storybook/react'
-
-export const bootstrapVersionArg = 'bootstrapVersion'
-
-export const bsVersionDecorator: Meta = {
-  argTypes: {
-    [bootstrapVersionArg]: {
-      name: 'Bootstrap Version',
-      description: 'Bootstrap version for components',
-      control: { type: 'inline-radio' },
-      options: ['3', '5'],
-      table: {
-        defaultValue: { summary: '5' },
-      },
-    },
-  },
-  args: {
-    [bootstrapVersionArg]: '5',
-  },
-}
diff --git a/services/web/Dockerfile b/services/web/Dockerfile
index 4f5d2e5ff1..5e58ab7ec2 100644
--- a/services/web/Dockerfile
+++ b/services/web/Dockerfile
@@ -1,6 +1,6 @@
 # the base image is suitable for running web with /overleaf/services/web bind
 # mounted
-FROM node:20.18.2 AS base
+FROM node:22.17.0 AS base
 
 WORKDIR /overleaf/services/web
 
diff --git a/services/web/Dockerfile.frontend b/services/web/Dockerfile.frontend
index 0bdfd8c1f9..6922653908 100644
--- a/services/web/Dockerfile.frontend
+++ b/services/web/Dockerfile.frontend
@@ -1,4 +1,4 @@
-FROM node:20.18.2
+FROM node:22.17.0
 
 # Install Google Chrome
 RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
diff --git a/services/web/Makefile b/services/web/Makefile
index c6916048d6..f5a7542691 100644
--- a/services/web/Makefile
+++ b/services/web/Makefile
@@ -83,6 +83,21 @@ test_unit_app:
 	$(DOCKER_COMPOSE) run --name unit_test_$(BUILD_DIR_NAME) --rm test_unit
 	$(DOCKER_COMPOSE) down -v -t 0
 
+test_unit_mocha: export COMPOSE_PROJECT_NAME=unit_test_mocha_$(BUILD_DIR_NAME)
+test_unit_mocha:
+	$(DOCKER_COMPOSE) run --rm test_unit npm run test:unit:mocha
+	$(DOCKER_COMPOSE) down -v -t 0
+
+test_unit_esm: export COMPOSE_PROJECT_NAME=unit_test_esm_$(BUILD_DIR_NAME)
+test_unit_esm:
+	$(DOCKER_COMPOSE) run --rm test_unit npm run test:unit:esm
+	$(DOCKER_COMPOSE) down -v -t 0
+
+test_unit_esm_watch: export COMPOSE_PROJECT_NAME=unit_test_esm_watch_$(BUILD_DIR_NAME)
+test_unit_esm_watch:
+	$(DOCKER_COMPOSE) run --rm test_unit npm run test:unit:esm:watch
+	$(DOCKER_COMPOSE) down -v -t 0
+
 TEST_SUITES = $(sort $(filter-out \
 	$(wildcard test/unit/src/helpers/*), \
 	$(wildcard test/unit/src/*/*)))
@@ -440,12 +455,19 @@ format: format_styles
 format_styles:
 	npm run --silent format:styles
 
+format: format_pug
+format_pug:
+	npm run --silent format:pug
+
 format_fix:
 	npm run --silent format:fix
 
 format_styles_fix:
 	npm run --silent format:styles:fix
 
+format_pug_fix:
+	npm run --silent format:pug:fix
+
 format_in_docker:
 	$(RUN_LINT_FORMAT) make format -j2 --output-sync
 
diff --git a/services/web/app.mjs b/services/web/app.mjs
index 5ece02cf32..3f54cc36a8 100644
--- a/services/web/app.mjs
+++ b/services/web/app.mjs
@@ -1,5 +1,5 @@
 // Metrics must be initialized before importing anything else
-import '@overleaf/metrics/initialize.js'
+import { metricsModuleImportStartTime } from '@overleaf/metrics/initialize.js'
 
 import Modules from './app/src/infrastructure/Modules.js'
 import metrics from '@overleaf/metrics'
@@ -20,6 +20,13 @@ import FileWriter from './app/src/infrastructure/FileWriter.js'
 import { fileURLToPath } from 'node:url'
 import Features from './app/src/infrastructure/Features.js'
 
+metrics.gauge(
+  'web_startup',
+  performance.now() - metricsModuleImportStartTime,
+  1,
+  { path: 'imports' }
+)
+
 logger.initialize(process.env.METRICS_APP_NAME || 'web')
 logger.logger.serializers.user = Serializers.user
 logger.logger.serializers.docs = Serializers.docs
@@ -49,14 +56,31 @@ if (Settings.catchErrors) {
 // Create ./data/dumpFolder if needed
 FileWriter.ensureDumpFolderExists()
 
-if (
-  !Features.hasFeature('project-history-blobs') &&
-  !Features.hasFeature('filestore')
-) {
-  throw new Error(
-    'invalid config: must enable either project-history-blobs (Settings.enableProjectHistoryBlobs=true) or enable filestore (Settings.disableFilestore=false)'
-  )
+// Validate combination of feature flags.
+Features.validateSettings()
+
+// handle SIGTERM for graceful shutdown in kubernetes
+process.on('SIGTERM', function (signal) {
+  triggerGracefulShutdown(Server.server, signal)
+})
+
+const beforeWaitForMongoAndGlobalBlobs = performance.now()
+try {
+  await Promise.all([
+    mongodb.connectionPromise,
+    mongoose.connectionPromise,
+    HistoryManager.loadGlobalBlobsPromise,
+  ])
+} catch (err) {
+  logger.fatal({ err }, 'Cannot connect to mongo. Exiting.')
+  process.exit(1)
 }
+metrics.gauge(
+  'web_startup',
+  performance.now() - beforeWaitForMongoAndGlobalBlobs,
+  1,
+  { path: 'waitForMongoAndGlobalBlobs' }
+)
 
 const port = Settings.port || Settings.internal.web.port || 3000
 const host = Settings.internal.web.host || '127.0.0.1'
@@ -69,42 +93,33 @@ if (process.argv[1] === fileURLToPath(import.meta.url)) {
 
   PlansLocator.ensurePlansAreSetupCorrectly()
 
-  Promise.all([
-    mongodb.connectionPromise,
-    mongoose.connectionPromise,
-    HistoryManager.promises.loadGlobalBlobs(),
-  ])
-    .then(async () => {
-      Server.server.listen(port, host, function () {
-        logger.debug(`web starting up, listening on ${host}:${port}`)
-        logger.debug(`${http.globalAgent.maxSockets} sockets enabled`)
-        // wait until the process is ready before monitoring the event loop
-        metrics.event_loop.monitor(logger)
-      })
-      QueueWorkers.start()
-      await Modules.start()
-    })
-    .catch(err => {
-      logger.fatal({ err }, 'Cannot connect to mongo. Exiting.')
-      process.exit(1)
-    })
+  Server.server.listen(port, host, function () {
+    logger.debug(`web starting up, listening on ${host}:${port}`)
+    logger.debug(`${http.globalAgent.maxSockets} sockets enabled`)
+    // wait until the process is ready before monitoring the event loop
+    metrics.event_loop.monitor(logger)
+
+    // Record metrics for the total startup time before listening on HTTP.
+    metrics.gauge(
+      'web_startup',
+      performance.now() - metricsModuleImportStartTime,
+      1,
+      { path: 'metricsModuleImportToHTTPListen' }
+    )
+  })
+  try {
+    QueueWorkers.start()
+  } catch (err) {
+    logger.fatal({ err }, 'failed to start queue processing')
+  }
+  try {
+    await Modules.start()
+  } catch (err) {
+    logger.fatal({ err }, 'failed to start web module background jobs')
+  }
 }
 
 // initialise site admin tasks
-Promise.all([
-  mongodb.connectionPromise,
-  mongoose.connectionPromise,
-  HistoryManager.promises.loadGlobalBlobs(),
-])
-  .then(() => SiteAdminHandler.initialise())
-  .catch(err => {
-    logger.fatal({ err }, 'Cannot connect to mongo. Exiting.')
-    process.exit(1)
-  })
-
-// handle SIGTERM for graceful shutdown in kubernetes
-process.on('SIGTERM', function (signal) {
-  triggerGracefulShutdown(Server.server, signal)
-})
+SiteAdminHandler.initialise()
 
 export default Server.server
diff --git a/services/web/app/src/Features/Authentication/AuthenticationController.js b/services/web/app/src/Features/Authentication/AuthenticationController.js
index 7a97d2ac9c..a190ddab5a 100644
--- a/services/web/app/src/Features/Authentication/AuthenticationController.js
+++ b/services/web/app/src/Features/Authentication/AuthenticationController.js
@@ -36,7 +36,22 @@ function send401WithChallenge(res) {
 function checkCredentials(userDetailsMap, user, password) {
   const expectedPassword = userDetailsMap.get(user)
   const userExists = userDetailsMap.has(user) && expectedPassword // user exists with a non-null password
-  const isValid = userExists && tsscmp(expectedPassword, password)
+
+  let isValid = false
+  if (userExists) {
+    if (Array.isArray(expectedPassword)) {
+      const isValidPrimary = Boolean(
+        expectedPassword[0] && tsscmp(expectedPassword[0], password)
+      )
+      const isValidFallback = Boolean(
+        expectedPassword[1] && tsscmp(expectedPassword[1], password)
+      )
+      isValid = isValidPrimary || isValidFallback
+    } else {
+      isValid = tsscmp(expectedPassword, password)
+    }
+  }
+
   if (!isValid) {
     logger.err({ user }, 'invalid login details')
   }
@@ -82,6 +97,7 @@ const AuthenticationController = {
       analyticsId: user.analyticsId || user._id,
       alphaProgram: user.alphaProgram || undefined, // only store if set
       betaProgram: user.betaProgram || undefined, // only store if set
+      externalAuth: user.externalAuth || false,
     }
     if (user.isAdmin) {
       lightUser.isAdmin = true
diff --git a/services/web/app/src/Features/Authentication/AuthenticationManager.js b/services/web/app/src/Features/Authentication/AuthenticationManager.js
index 33827f1673..6ac510986c 100644
--- a/services/web/app/src/Features/Authentication/AuthenticationManager.js
+++ b/services/web/app/src/Features/Authentication/AuthenticationManager.js
@@ -409,10 +409,6 @@ const AuthenticationManager = {
       if (!_exceedsMaximumLengthRatio(password, MAX_SIMILARITY, emailPart)) {
         const similarity = DiffHelper.stringSimilarity(password, emailPart)
         if (similarity > MAX_SIMILARITY) {
-          logger.warn(
-            { email, emailPart, similarity, maxSimilarity: MAX_SIMILARITY },
-            'Password too similar to email'
-          )
           return new Error('password is too similar to email')
         }
       }
diff --git a/services/web/app/src/Features/Authorization/AuthorizationManager.js b/services/web/app/src/Features/Authorization/AuthorizationManager.js
index 2f339de83d..22d92ea9d9 100644
--- a/services/web/app/src/Features/Authorization/AuthorizationManager.js
+++ b/services/web/app/src/Features/Authorization/AuthorizationManager.js
@@ -88,9 +88,54 @@ async function getPrivilegeLevelForProject(
   opts = {}
 ) {
   if (userId) {
-    return getPrivilegeLevelForProjectWithUser(userId, projectId, opts)
+    return await getPrivilegeLevelForProjectWithUser(
+      userId,
+      projectId,
+      null,
+      opts
+    )
   } else {
-    return getPrivilegeLevelForProjectWithoutUser(projectId, token, opts)
+    return await getPrivilegeLevelForProjectWithoutUser(projectId, token, opts)
+  }
+}
+
+/**
+ * Get the privilege level that the user has for the project.
+ *
+ * @param userId - The id of the user that wants to access the project.
+ * @param projectId - The id of the project to be accessed.
+ * @param {string} token
+ * @param {ProjectAccess} projectAccess
+ * @param {Object} opts
+ * @param {boolean} opts.ignoreSiteAdmin - Do not consider whether the user is
+ *     a site admin.
+ * @param {boolean} opts.ignorePublicAccess - Do not consider the project is
+ *     publicly accessible.
+ *
+ * @returns {string|boolean} The privilege level. One of "owner",
+ *     "readAndWrite", "readOnly" or false.
+ */
+async function getPrivilegeLevelForProjectWithProjectAccess(
+  userId,
+  projectId,
+  token,
+  projectAccess,
+  opts = {}
+) {
+  if (userId) {
+    return await getPrivilegeLevelForProjectWithUser(
+      userId,
+      projectId,
+      projectAccess,
+      opts
+    )
+  } else {
+    return await _getPrivilegeLevelForProjectWithoutUserWithPublicAccessLevel(
+      projectId,
+      token,
+      projectAccess.publicAccessLevel(),
+      opts
+    )
   }
 }
 
@@ -98,6 +143,7 @@ async function getPrivilegeLevelForProject(
 async function getPrivilegeLevelForProjectWithUser(
   userId,
   projectId,
+  projectAccess,
   opts = {}
 ) {
   if (!opts.ignoreSiteAdmin) {
@@ -106,11 +152,11 @@ async function getPrivilegeLevelForProjectWithUser(
     }
   }
 
-  const privilegeLevel =
-    await CollaboratorsGetter.promises.getMemberIdPrivilegeLevel(
-      userId,
-      projectId
-    )
+  projectAccess =
+    projectAccess ||
+    (await CollaboratorsGetter.promises.getProjectAccess(projectId))
+
+  const privilegeLevel = projectAccess.privilegeLevelForUser(userId)
   if (privilegeLevel && privilegeLevel !== PrivilegeLevels.NONE) {
     // The user has direct access
     return privilegeLevel
@@ -119,7 +165,7 @@ async function getPrivilegeLevelForProjectWithUser(
   if (!opts.ignorePublicAccess) {
     // Legacy public-access system
     // User is present (not anonymous), but does not have direct access
-    const publicAccessLevel = await getPublicAccessLevel(projectId)
+    const publicAccessLevel = projectAccess.publicAccessLevel()
     if (publicAccessLevel === PublicAccessLevels.READ_ONLY) {
       return PrivilegeLevels.READ_ONLY
     }
@@ -137,7 +183,21 @@ async function getPrivilegeLevelForProjectWithoutUser(
   token,
   opts = {}
 ) {
-  const publicAccessLevel = await getPublicAccessLevel(projectId)
+  return await _getPrivilegeLevelForProjectWithoutUserWithPublicAccessLevel(
+    projectId,
+    token,
+    await getPublicAccessLevel(projectId),
+    opts
+  )
+}
+
+// User is Anonymous, Try Token-based access
+async function _getPrivilegeLevelForProjectWithoutUserWithPublicAccessLevel(
+  projectId,
+  token,
+  publicAccessLevel,
+  opts = {}
+) {
   if (!opts.ignorePublicAccess) {
     if (publicAccessLevel === PublicAccessLevels.READ_ONLY) {
       // Legacy public read-only access for anonymous user
@@ -149,7 +209,7 @@ async function getPrivilegeLevelForProjectWithoutUser(
     }
   }
   if (publicAccessLevel === PublicAccessLevels.TOKEN_BASED) {
-    return getPrivilegeLevelForProjectWithToken(projectId, token)
+    return await getPrivilegeLevelForProjectWithToken(projectId, token)
   }
 
   // Deny anonymous user access
@@ -309,6 +369,7 @@ module.exports = {
     canUserRenameProject,
     canUserAdminProject,
     getPrivilegeLevelForProject,
+    getPrivilegeLevelForProjectWithProjectAccess,
     isRestrictedUserForProject,
     isUserSiteAdmin,
   },
diff --git a/services/web/app/src/Features/Authorization/PermissionsController.js b/services/web/app/src/Features/Authorization/PermissionsController.js
index c9ffac3c7c..27b99081c6 100644
--- a/services/web/app/src/Features/Authorization/PermissionsController.js
+++ b/services/web/app/src/Features/Authorization/PermissionsController.js
@@ -10,9 +10,16 @@ const Modules = require('../../infrastructure/Modules')
 const { expressify } = require('@overleaf/promise-utils')
 const Features = require('../../infrastructure/Features')
 
+/**
+ * @typedef {(import('express').Request)} Request
+ * @typedef {(import('express').Response)} Response
+ * @typedef {(import('express').NextFunction)} NextFunction
+ * @typedef {import('./PermissionsManager').Capability} Capability
+ */
+
 /**
  * Function that returns middleware to add an `assertPermission` function to the request object to check if the user has a specific capability.
- * @returns {Function} The middleware function that adds the `assertPermission` function to the request object.
+ * @returns {() => (req: Request, res: Response, next: NextFunction) => void} The middleware function that adds the `assertPermission` function to the request object.
  */
 function useCapabilities() {
   const middleware = async function (req, res, next) {
@@ -30,12 +37,15 @@ function useCapabilities() {
       return next()
     }
     try {
-      let results = await Modules.promises.hooks.fire(
+      /**
+       * @type {{groupPolicy: Record<string, boolean>}[][]}
+       */
+      const hookResponses = await Modules.promises.hooks.fire(
         'getGroupPolicyForUser',
         req.user
       )
       // merge array of all results from all modules
-      results = results.flat()
+      const results = hookResponses.flat()
 
       if (results.length > 0) {
         // get the combined group policy applying to the user
@@ -70,8 +80,8 @@ function useCapabilities() {
 
 /**
  * Function that returns middleware to check if the user has permission to access a resource.
- * @param {[string]} requiredCapabilities - the capabilities required to access the resource.
- * @returns {Function} The middleware function that checks if the user has the required capabilities.
+ * @param {...Capability} requiredCapabilities - the capabilities required to access the resource.
+ * @returns {(req: Request, res: Response, next: NextFunction) => void} The middleware function that checks if the user has the required capabilities.
  */
 function requirePermission(...requiredCapabilities) {
   if (
@@ -80,6 +90,11 @@ function requirePermission(...requiredCapabilities) {
   ) {
     throw new Error('invalid required capabilities')
   }
+  /**
+   * @param {Request} req
+   * @param {Response} res
+   * @param {NextFunction} next
+   */
   const doRequest = async function (req, res, next) {
     if (!Features.hasFeature('saas')) {
       return next()
diff --git a/services/web/app/src/Features/Authorization/PermissionsManager.js b/services/web/app/src/Features/Authorization/PermissionsManager.js
index a20280a941..aad1021b24 100644
--- a/services/web/app/src/Features/Authorization/PermissionsManager.js
+++ b/services/web/app/src/Features/Authorization/PermissionsManager.js
@@ -45,16 +45,23 @@ const { callbackify } = require('util')
 const { ForbiddenError } = require('../Errors/Errors')
 const Modules = require('../../infrastructure/Modules')
 
+/**
+ * @typedef {(import('../../../../types/capabilities').Capability)} Capability
+ */
+
+/** @type {Map<string, Map<Capability, boolean>>} */
 const POLICY_TO_CAPABILITY_MAP = new Map()
 const POLICY_TO_VALIDATOR_MAP = new Map()
+/** @type {Map<Capability, boolean>} */
 const DEFAULT_PERMISSIONS = new Map()
+/** @type {Set<string>} */
 const ALLOWED_PROPERTIES = new Set()
 
 /**
  * Throws an error if the given capability is not registered.
  *
  * @private
- * @param {string} capability - The name of the capability to check.
+ * @param {Capability} capability - The name of the capability to check.
  * @throws {Error} If the capability is not registered.
  */
 function ensureCapabilityExists(capability) {
@@ -66,7 +73,7 @@ function ensureCapabilityExists(capability) {
 /**
  * Validates an group policy object
  *
- * @param {Object} policies - An object containing policy names and booleans
+ * @param {Record<string, boolean>} policies - An object containing policy names and booleans
  *   as key-value entries.
  * @throws {Error} if the `policies` object contains a policy that is not
  *   registered, or the policy value is not a boolean
@@ -85,7 +92,7 @@ function validatePolicies(policies) {
 /**
  * Registers a new capability with the given name and options.
  *
- * @param {string} name - The name of the capability to register.
+ * @param {Capability} name - The name of the capability to register.
  * @param {Object} options - The options for the capability.
  * @param {boolean} options.default - The default value for the capability
  *   (required).
@@ -108,7 +115,7 @@ function registerCapability(name, options) {
  * Registers a new policy with the given name, capabilities, and options.
  *
  * @param {string} name - The name of the policy to register.
- * @param {Object} capabilities - The capabilities for the policy.
+ * @param {Partial<Record<Capability, boolean>>|Map<Capability, boolean>} capabilities - The capabilities for the policy.
  * @param {Object} [options] - The options for the policy.
  * @param {Function?} [options.validator] - The optional validator function for the
  *   policy.
@@ -122,10 +129,11 @@ function registerPolicy(name, capabilities, options = {}) {
   if (POLICY_TO_CAPABILITY_MAP.has(name)) {
     throw new Error(`policy already registered: ${name}`)
   }
+
+  /** @type {[Capability, boolean][]} */
+  const entries = Object.entries(capabilities)
   // check that all the entries in the capability set exist and are booleans
-  for (const [capabilityName, capabilityValue] of Object.entries(
-    capabilities
-  )) {
+  for (const [capabilityName, capabilityValue] of entries) {
     // check that the capability exists (look in the default permissions)
     if (!DEFAULT_PERMISSIONS.has(capabilityName)) {
       throw new Error(`unknown capability: ${capabilityName}`)
@@ -158,19 +166,18 @@ function registerAllowedProperty(name) {
 
 /**
  * returns the set of allowed properties that have been registered
- *
- * @returns {Set} ALLOWED_PROPERTIES
  */
 function getAllowedProperties() {
   return ALLOWED_PROPERTIES
 }
+
 /**
  * Returns an array of policy names that are enforced based on the provided
  * group policy object.
  *
  * @private
- * @param {Object} groupPolicy - The group policy object to check.
- * @returns {Array} An array of policy names that are enforced.
+ * @param {Partial<Map<Capability , boolean>>} groupPolicy - The group policy object to check.
+ * @returns {Capability[]} An array of policy names that are enforced.
  */
 function getEnforcedPolicyNames(groupPolicy = {}) {
   if (!groupPolicy) {
@@ -192,7 +199,7 @@ function getEnforcedPolicyNames(groupPolicy = {}) {
  * @private
  * @param {string} policyName - The name of the policy to retrieve the
  *   capability value from.
- * @param {string} capability - The name of the capability to retrieve the value
+ * @param {Capability} capability - The name of the capability to retrieve the value
  *   for.
  * @returns {boolean | undefined} The value of the capability for the policy, or
  *   undefined if the policy or capability is not found.
@@ -205,7 +212,7 @@ function getCapabilityValueFromPolicy(policyName, capability) {
  * Returns the default value for the specified capability.
  *
  * @private
- * @param {string} capability - The name of the capability to retrieve the
+ * @param {Capability} capability - The name of the capability to retrieve the
  *   default value for.
  * @returns {boolean | undefined} The default value for the capability, or
  *   undefined if the capability is not found.
@@ -222,9 +229,10 @@ function getValidatorFromPolicy(policyName) {
  * Returns a set of default capabilities based on the DEFAULT_PERMISSIONS map.
  *
  * @private
- * @returns {Set} A set of default capabilities.
+ * @returns {Set<Capability>} A set of default capabilities.
  */
 function getDefaultCapabilities() {
+  /** @type {Set<Capability>} */
   const defaultCapabilities = new Set()
   for (const [
     capabilityName,
@@ -242,7 +250,7 @@ function getDefaultCapabilities() {
  * which are not allowed by the policy.
  *
  * @private
- * @param {Set} capabilitySet - The set of capabilities to apply the policy to.
+ * @param {Set<Capability>} capabilitySet - The set of capabilities to apply the policy to.
  * @param {string} policyName - The name of the policy to apply.
  * @throws {Error} If the policy is unknown.
  */
@@ -281,10 +289,11 @@ function getUserCapabilities(groupPolicy) {
 /**
  * Combines an array of group policies into a single policy object.
  *
- * @param {Array} groupPolicies - An array of group policies.
- * @returns {Object} - The combined group policy object.
+ * @param {Record<string, boolean>[]} groupPolicies - An array of group policies.
+ * @returns {Record<string, boolean>} - The combined group policy object.
  */
 function combineGroupPolicies(groupPolicies) {
+  /** @type {Record<string, boolean>} */
   const combinedGroupPolicy = {}
   for (const groupPolicy of groupPolicies) {
     const enforcedPolicyNames = getEnforcedPolicyNames(groupPolicy)
@@ -335,7 +344,7 @@ function getUserRestrictions(groupPolicy) {
  * policy.
  *
  * @param {Object} groupPolicy - The group policy object for the user.
- * @param {string} capability - The name of the capability to check permission
+ * @param {Capability} capability - The name of the capability to check permission
  *   for.
  * @returns {boolean} True if the user has permission for the capability, false
  *   otherwise.
@@ -349,7 +358,7 @@ function hasPermission(groupPolicy, capability) {
   )
   // if there are no results, or none of the policies apply, return the default permission
   if (results.length === 0 || results.every(result => result === undefined)) {
-    return getDefaultPermission(capability)
+    return !!getDefaultPermission(capability)
   }
   // only allow the permission if all the results are true, otherwise deny it
   return results.every(result => result === true)
@@ -395,7 +404,7 @@ async function getUserValidationStatus({ user, groupPolicy, subscription }) {
  *
  * @param {Object} user - The user object to retrieve the group policy for.
  *   Only the user's _id is required
- * @param {Array} capabilities - The list of the capabilities to check permission for.
+ * @param {Capability[]} requiredCapabilities - The list of the capabilities to check permission for.
  * @returns {Promise<void>}
  * @throws {Error} If the user does not have permission
  */
@@ -417,7 +426,7 @@ async function assertUserPermissions(user, requiredCapabilities) {
  *
  * @param {Object} user - The user object to retrieve the group policy for.
  *   Only the user's _id is required
- * @param {Array} capabilities - The list of the capabilities to check permission for.
+ * @param {Capability[]} requiredCapabilities - The list of the capabilities to check permission for.
  * @returns {Promise<Boolean>} - true if the user has all permissions, false if not
  */
 async function checkUserPermissions(user, requiredCapabilities) {
diff --git a/services/web/app/src/Features/BrandVariations/BrandVariationsHandler.js b/services/web/app/src/Features/BrandVariations/BrandVariationsHandler.js
index 942fa3a6ab..33fa764048 100644
--- a/services/web/app/src/Features/BrandVariations/BrandVariationsHandler.js
+++ b/services/web/app/src/Features/BrandVariations/BrandVariationsHandler.js
@@ -74,6 +74,10 @@ function sanitizeBrandVariationDetails(details) {
       details.submit_button_html,
       settings.modules.sanitize.options
     )
+    details.submit_button_html_no_br = sanitizeHtml(
+      details.submit_button_html.replace(/<br\s*\/?>/gi, ' '),
+      settings.modules.sanitize.options
+    )
   }
 }
 
diff --git a/services/web/app/src/Features/Captcha/CaptchaMiddleware.js b/services/web/app/src/Features/Captcha/CaptchaMiddleware.js
index 9c93b74cfa..645738c2c7 100644
--- a/services/web/app/src/Features/Captcha/CaptchaMiddleware.js
+++ b/services/web/app/src/Features/Captcha/CaptchaMiddleware.js
@@ -28,7 +28,9 @@ async function initializeDeviceHistory(req) {
 
 async function canSkipCaptcha(req, res) {
   const trustedUser =
-    req.body?.email && Settings.recaptcha.trustedUsers.includes(req.body.email)
+    req.body?.email &&
+    (Settings.recaptcha.trustedUsers.includes(req.body.email) ||
+      Settings.recaptcha.trustedUsersRegex?.test(req.body.email))
   if (trustedUser) {
     return res.json(true)
   }
diff --git a/services/web/app/src/Features/Chat/ChatManager.js b/services/web/app/src/Features/Chat/ChatManager.js
index 9625881dd8..7eab6039d8 100644
--- a/services/web/app/src/Features/Chat/ChatManager.js
+++ b/services/web/app/src/Features/Chat/ChatManager.js
@@ -1,61 +1,46 @@
-const async = require('async')
-const UserInfoManager = require('../User/UserInfoManager')
 const UserInfoController = require('../User/UserInfoController')
-const { promisify } = require('@overleaf/promise-utils')
+const UserGetter = require('../User/UserGetter')
+const { callbackify } = require('@overleaf/promise-utils')
 
-function injectUserInfoIntoThreads(threads, callback) {
-  // There will be a lot of repitition of user_ids, so first build a list
-  // of unique ones to perform db look ups on, then use these to populate the
-  // user fields
-  let message, thread, threadId, userId
-  if (callback == null) {
-    callback = function () {}
-  }
-  const userIds = {}
-  for (threadId in threads) {
-    thread = threads[threadId]
+async function injectUserInfoIntoThreads(threads) {
+  const userIds = new Set()
+  for (const thread of Object.values(threads)) {
     if (thread.resolved) {
-      userIds[thread.resolved_by_user_id] = true
+      userIds.add(thread.resolved_by_user_id)
     }
-    for (message of Array.from(thread.messages)) {
-      userIds[message.user_id] = true
+    for (const message of thread.messages) {
+      userIds.add(message.user_id)
     }
   }
 
-  const jobs = []
-  const users = {}
-  for (userId in userIds) {
-    ;(userId =>
-      jobs.push(cb =>
-        UserInfoManager.getPersonalInfo(userId, function (error, user) {
-          if (error != null) return cb(error)
-          user = UserInfoController.formatPersonalInfo(user)
-          users[userId] = user
-          cb()
-        })
-      ))(userId)
+  const projection = {
+    _id: true,
+    first_name: true,
+    last_name: true,
+    email: true,
   }
-
-  return async.series(jobs, function (error) {
-    if (error != null) {
-      return callback(error)
+  const users = await UserGetter.promises.getUsers(userIds, projection)
+  const usersById = new Map()
+  for (const user of users) {
+    usersById.set(
+      user._id.toString(),
+      UserInfoController.formatPersonalInfo(user)
+    )
+  }
+  for (const thread of Object.values(threads)) {
+    if (thread.resolved) {
+      thread.resolved_by_user = usersById.get(thread.resolved_by_user_id)
     }
-    for (threadId in threads) {
-      thread = threads[threadId]
-      if (thread.resolved) {
-        thread.resolved_by_user = users[thread.resolved_by_user_id]
-      }
-      for (message of Array.from(thread.messages)) {
-        message.user = users[message.user_id]
-      }
+    for (const message of thread.messages) {
+      message.user = usersById.get(message.user_id)
     }
-    return callback(null, threads)
-  })
+  }
+  return threads
 }
 
 module.exports = {
-  injectUserInfoIntoThreads,
+  injectUserInfoIntoThreads: callbackify(injectUserInfoIntoThreads),
   promises: {
-    injectUserInfoIntoThreads: promisify(injectUserInfoIntoThreads),
+    injectUserInfoIntoThreads,
   },
 }
diff --git a/services/web/app/src/Features/Collaborators/CollaboratorsGetter.js b/services/web/app/src/Features/Collaborators/CollaboratorsGetter.js
index 77fb7ab2d3..a3543ae614 100644
--- a/services/web/app/src/Features/Collaborators/CollaboratorsGetter.js
+++ b/services/web/app/src/Features/Collaborators/CollaboratorsGetter.js
@@ -1,3 +1,4 @@
+// @ts-check
 const { callbackify } = require('util')
 const pLimit = require('p-limit')
 const { ObjectId } = require('mongodb-legacy')
@@ -15,9 +16,6 @@ module.exports = {
   getMemberIdsWithPrivilegeLevels: callbackify(getMemberIdsWithPrivilegeLevels),
   getMemberIds: callbackify(getMemberIds),
   getInvitedMemberIds: callbackify(getInvitedMemberIds),
-  getInvitedMembersWithPrivilegeLevels: callbackify(
-    getInvitedMembersWithPrivilegeLevels
-  ),
   getInvitedMembersWithPrivilegeLevelsFromFields: callbackify(
     getInvitedMembersWithPrivilegeLevelsFromFields
   ),
@@ -31,10 +29,10 @@ module.exports = {
   userIsTokenMember: callbackify(userIsTokenMember),
   getAllInvitedMembers: callbackify(getAllInvitedMembers),
   promises: {
+    getProjectAccess,
     getMemberIdsWithPrivilegeLevels,
     getMemberIds,
     getInvitedMemberIds,
-    getInvitedMembersWithPrivilegeLevels,
     getInvitedMembersWithPrivilegeLevelsFromFields,
     getMemberIdPrivilegeLevel,
     getInvitedEditCollaboratorCount,
@@ -50,7 +48,202 @@ module.exports = {
   },
 }
 
-async function getMemberIdsWithPrivilegeLevels(projectId) {
+/**
+ * @typedef ProjectMember
+ * @property {string} id
+ * @property {typeof PrivilegeLevels[keyof PrivilegeLevels]} privilegeLevel
+ * @property {typeof Sources[keyof Sources]} source
+ * @property {boolean} [pendingEditor]
+ * @property {boolean} [pendingReviewer]
+ */
+
+/**
+ * @typedef LoadedProjectMember
+ * @property {typeof PrivilegeLevels[keyof PrivilegeLevels]} privilegeLevel
+ * @property {{_id: ObjectId, email: string, features: any, first_name: string, last_name: string, signUpDate: Date}} user
+ * @property {boolean} [pendingEditor]
+ * @property {boolean} [pendingReviewer]
+ */
+
+// Wrapper for determining multiple dimensions of project access.
+class ProjectAccess {
+  /** @type {ProjectMember[]} */
+  #members
+
+  /** @type {typeof PublicAccessLevels[keyof PublicAccessLevels]} */
+  #publicAccessLevel
+
+  /**
+   * @param {{ owner_ref: ObjectId; collaberator_refs: ObjectId[]; readOnly_refs: ObjectId[]; tokenAccessReadAndWrite_refs: ObjectId[]; tokenAccessReadOnly_refs: ObjectId[]; publicAccesLevel: typeof PublicAccessLevels[keyof PublicAccessLevels]; pendingEditor_refs: ObjectId[]; reviewer_refs: ObjectId[]; pendingReviewer_refs: ObjectId[]; }} project
+   */
+  constructor(project) {
+    this.#members = _getMemberIdsWithPrivilegeLevelsFromFields(
+      project.owner_ref,
+      project.collaberator_refs,
+      project.readOnly_refs,
+      project.tokenAccessReadAndWrite_refs,
+      project.tokenAccessReadOnly_refs,
+      project.publicAccesLevel,
+      project.pendingEditor_refs,
+      project.reviewer_refs,
+      project.pendingReviewer_refs
+    )
+    this.#publicAccessLevel = project.publicAccesLevel
+  }
+
+  /**
+   * @return {Promise<{ownerMember: LoadedProjectMember|undefined, members: LoadedProjectMember[]}>}
+   */
+  async loadOwnerAndInvitedMembers() {
+    const all = await _loadMembers(
+      this.#members.filter(m => m.source !== Sources.TOKEN)
+    )
+    return {
+      ownerMember: all.find(m => m.privilegeLevel === PrivilegeLevels.OWNER),
+      members: all.filter(m => m.privilegeLevel !== PrivilegeLevels.OWNER),
+    }
+  }
+
+  /**
+   * @return {Promise<LoadedProjectMember[]>}
+   */
+  async loadInvitedMembers() {
+    return _loadMembers(
+      this.#members.filter(
+        m =>
+          m.source !== Sources.TOKEN &&
+          m.privilegeLevel !== PrivilegeLevels.OWNER
+      )
+    )
+  }
+
+  /**
+   * @return {Promise<LoadedProjectMember|undefined>}
+   */
+  async loadOwner() {
+    const [owner] = await _loadMembers(
+      this.#members.filter(m => m.privilegeLevel === PrivilegeLevels.OWNER)
+    )
+    return owner
+  }
+
+  /**
+   * @return {ProjectMember[]}
+   */
+  allMembers() {
+    return this.#members
+  }
+
+  /**
+   * @return {typeof PublicAccessLevels[keyof PublicAccessLevels]}
+   */
+  publicAccessLevel() {
+    return this.#publicAccessLevel
+  }
+
+  /**
+   * @return {string[]}
+   */
+  memberIds() {
+    return this.#members.map(m => m.id)
+  }
+
+  /**
+   * @return {string[]}
+   */
+  invitedMemberIds() {
+    return this.#members.filter(m => m.source !== Sources.TOKEN).map(m => m.id)
+  }
+
+  /**
+   * @param {string | ObjectId} userId
+   * @return {typeof PrivilegeLevels[keyof PrivilegeLevels]}
+   */
+  privilegeLevelForUser(userId) {
+    if (!userId) return PrivilegeLevels.NONE
+    for (const member of this.#members) {
+      if (member.id === userId.toString()) {
+        return member.privilegeLevel
+      }
+    }
+    return PrivilegeLevels.NONE
+  }
+
+  /**
+   * @param {string | ObjectId} userId
+   * @return {boolean}
+   */
+  isUserTokenMember(userId) {
+    if (!userId) return false
+    for (const member of this.#members) {
+      if (member.id === userId.toString() && member.source === Sources.TOKEN) {
+        return true
+      }
+    }
+    return false
+  }
+
+  /**
+   * @param {string | ObjectId} userId
+   * @return {boolean}
+   */
+  isUserInvitedMember(userId) {
+    if (!userId) return false
+    for (const member of this.#members) {
+      if (member.id === userId.toString() && member.source !== Sources.TOKEN) {
+        return true
+      }
+    }
+    return false
+  }
+
+  /**
+   * @param {string | ObjectId} userId
+   * @return {boolean}
+   */
+  isUserInvitedReadWriteMember(userId) {
+    for (const member of this.#members) {
+      if (
+        member.id.toString() === userId.toString() &&
+        member.source !== Sources.TOKEN &&
+        member.privilegeLevel === PrivilegeLevels.READ_AND_WRITE
+      ) {
+        return true
+      }
+    }
+    return false
+  }
+
+  /**
+   * Counts invited members with editor or reviewer roles
+   * @return {number}
+   */
+  countInvitedEditCollaborators() {
+    return this.#members.filter(
+      m =>
+        m.source === Sources.INVITE &&
+        (m.privilegeLevel === PrivilegeLevels.READ_AND_WRITE ||
+          m.privilegeLevel === PrivilegeLevels.REVIEW)
+    ).length
+  }
+
+  /**
+   * Counts invited members that are readonly pending editors or pending reviewers
+   * @return {number}
+   */
+  countInvitedPendingEditors() {
+    return this.#members.filter(
+      m =>
+        m.source === Sources.INVITE &&
+        m.privilegeLevel === PrivilegeLevels.READ_ONLY &&
+        (m.pendingEditor || m.pendingReviewer)
+    ).length
+  }
+}
+
+module.exports.ProjectAccess = ProjectAccess
+
+async function getProjectAccess(projectId) {
   const project = await ProjectGetter.promises.getProject(projectId, {
     owner_ref: 1,
     collaberator_refs: 1,
@@ -65,34 +258,19 @@ async function getMemberIdsWithPrivilegeLevels(projectId) {
   if (!project) {
     throw new Errors.NotFoundError(`no project found with id ${projectId}`)
   }
-  const memberIds = _getMemberIdsWithPrivilegeLevelsFromFields(
-    project.owner_ref,
-    project.collaberator_refs,
-    project.readOnly_refs,
-    project.tokenAccessReadAndWrite_refs,
-    project.tokenAccessReadOnly_refs,
-    project.publicAccesLevel,
-    project.pendingEditor_refs,
-    project.reviewer_refs,
-    project.pendingReviewer_refs
-  )
-  return memberIds
+  return new ProjectAccess(project)
+}
+
+async function getMemberIdsWithPrivilegeLevels(projectId) {
+  return (await getProjectAccess(projectId)).allMembers()
 }
 
 async function getMemberIds(projectId) {
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  return members.map(m => m.id)
+  return (await getProjectAccess(projectId)).memberIds()
 }
 
 async function getInvitedMemberIds(projectId) {
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  return members.filter(m => m.source !== Sources.TOKEN).map(m => m.id)
-}
-
-async function getInvitedMembersWithPrivilegeLevels(projectId) {
-  let members = await getMemberIdsWithPrivilegeLevels(projectId)
-  members = members.filter(m => m.source !== Sources.TOKEN)
-  return _loadMembers(members)
+  return (await getProjectAccess(projectId)).invitedMemberIds()
 }
 
 async function getInvitedMembersWithPrivilegeLevelsFromFields(
@@ -107,7 +285,7 @@ async function getInvitedMembersWithPrivilegeLevelsFromFields(
     readOnlyIds,
     [],
     [],
-    null,
+    'private',
     [],
     reviewerIds,
     []
@@ -121,69 +299,31 @@ async function getMemberIdPrivilegeLevel(userId, projectId) {
   if (userId == null) {
     return PrivilegeLevels.NONE
   }
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  for (const member of members) {
-    if (member.id === userId.toString()) {
-      return member.privilegeLevel
-    }
-  }
-  return PrivilegeLevels.NONE
+  return (await getProjectAccess(projectId)).privilegeLevelForUser(userId)
 }
 
 async function getInvitedEditCollaboratorCount(projectId) {
-  // Counts invited members with editor or reviewer roles
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  return members.filter(
-    m =>
-      m.source === Sources.INVITE &&
-      (m.privilegeLevel === PrivilegeLevels.READ_AND_WRITE ||
-        m.privilegeLevel === PrivilegeLevels.REVIEW)
-  ).length
+  return (await getProjectAccess(projectId)).countInvitedEditCollaborators()
 }
 
 async function getInvitedPendingEditorCount(projectId) {
-  // Only counts invited members that are readonly pending editors or pending
-  // reviewers
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  return members.filter(
-    m =>
-      m.source === Sources.INVITE &&
-      m.privilegeLevel === PrivilegeLevels.READ_ONLY &&
-      (m.pendingEditor || m.pendingReviewer)
-  ).length
+  return (await getProjectAccess(projectId)).countInvitedPendingEditors()
 }
 
 async function isUserInvitedMemberOfProject(userId, projectId) {
   if (!userId) {
     return false
   }
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  for (const member of members) {
-    if (
-      member.id.toString() === userId.toString() &&
-      member.source !== Sources.TOKEN
-    ) {
-      return true
-    }
-  }
-  return false
+  return (await getProjectAccess(projectId)).isUserInvitedMember(userId)
 }
 
 async function isUserInvitedReadWriteMemberOfProject(userId, projectId) {
   if (!userId) {
     return false
   }
-  const members = await getMemberIdsWithPrivilegeLevels(projectId)
-  for (const member of members) {
-    if (
-      member.id.toString() === userId.toString() &&
-      member.source !== Sources.TOKEN &&
-      member.privilegeLevel === PrivilegeLevels.READ_AND_WRITE
-    ) {
-      return true
-    }
-  }
-  return false
+  return (await getProjectAccess(projectId)).isUserInvitedReadWriteMember(
+    userId
+  )
 }
 
 async function getPublicShareTokens(userId, projectId) {
@@ -209,10 +349,13 @@ async function getPublicShareTokens(userId, projectId) {
     return null
   }
 
+  // @ts-ignore
   if (memberInfo.isOwner) {
     return memberInfo.tokens
+    // @ts-ignore
   } else if (memberInfo.hasTokenReadOnlyAccess) {
     return {
+      // @ts-ignore
       readOnly: memberInfo.tokens.readOnly,
     }
   } else {
@@ -224,6 +367,7 @@ async function getPublicShareTokens(userId, projectId) {
 // excluding projects where the user is listed in the token access fields when
 // token access has been disabled.
 async function getProjectsUserIsMemberOf(userId, fields) {
+  // @ts-ignore
   const limit = pLimit(2)
   const [readAndWrite, review, readOnly, tokenReadAndWrite, tokenReadOnly] =
     await Promise.all([
@@ -274,10 +418,9 @@ async function dangerouslyGetAllProjectsUserIsMemberOf(userId, fields) {
 
 async function getAllInvitedMembers(projectId) {
   try {
-    const rawMembers = await getInvitedMembersWithPrivilegeLevels(projectId)
-    const { members } =
-      ProjectEditorHandler.buildOwnerAndMembersViews(rawMembers)
-    return members
+    const projectAccess = await getProjectAccess(projectId)
+    const invitedMembers = await projectAccess.loadInvitedMembers()
+    return invitedMembers.map(ProjectEditorHandler.buildUserModelView)
   } catch (err) {
     throw OError.tag(err, 'error getting members for project', { projectId })
   }
@@ -316,6 +459,19 @@ async function userIsReadWriteTokenMember(userId, projectId) {
   return project != null
 }
 
+/**
+ * @param {ObjectId} ownerId
+ * @param {ObjectId[]} collaboratorIds
+ * @param {ObjectId[]} readOnlyIds
+ * @param {ObjectId[]} tokenAccessIds
+ * @param {ObjectId[]} tokenAccessReadOnlyIds
+ * @param {typeof PublicAccessLevels[keyof PublicAccessLevels]} publicAccessLevel
+ * @param {ObjectId[]} pendingEditorIds
+ * @param {ObjectId[]} reviewerIds
+ * @param {ObjectId[]} pendingReviewerIds
+ * @return {ProjectMember[]}
+ * @private
+ */
 function _getMemberIdsWithPrivilegeLevelsFromFields(
   ownerId,
   collaboratorIds,
@@ -384,35 +540,39 @@ function _getMemberIdsWithPrivilegeLevelsFromFields(
   return members
 }
 
+/**
+ * @param {ProjectMember[]} members
+ * @return {Promise<LoadedProjectMember[]>}
+ * @private
+ */
 async function _loadMembers(members) {
-  const limit = pLimit(3)
-  const results = await Promise.all(
-    members.map(member =>
-      limit(async () => {
-        const user = await UserGetter.promises.getUser(member.id, {
-          _id: 1,
-          email: 1,
-          features: 1,
-          first_name: 1,
-          last_name: 1,
-          signUpDate: 1,
-        })
-        if (user != null) {
-          const record = {
-            user,
-            privilegeLevel: member.privilegeLevel,
-          }
-          if (member.pendingEditor) {
-            record.pendingEditor = true
-          } else if (member.pendingReviewer) {
-            record.pendingReviewer = true
-          }
-          return record
-        } else {
-          return null
-        }
-      })
-    )
-  )
-  return results.filter(r => r != null)
+  if (members.length === 0) return []
+  const userIds = Array.from(new Set(members.map(m => m.id)))
+  const users = new Map()
+  for (const user of await UserGetter.promises.getUsers(userIds, {
+    _id: 1,
+    email: 1,
+    features: 1,
+    first_name: 1,
+    last_name: 1,
+    signUpDate: 1,
+  })) {
+    users.set(user._id.toString(), user)
+  }
+  return members
+    .map(member => {
+      const user = users.get(member.id)
+      if (!user) return null
+      const record = {
+        user,
+        privilegeLevel: member.privilegeLevel,
+      }
+      if (member.pendingEditor) {
+        record.pendingEditor = true
+      } else if (member.pendingReviewer) {
+        record.pendingReviewer = true
+      }
+      return record
+    })
+    .filter(r => r != null)
 }
diff --git a/services/web/app/src/Features/Collaborators/CollaboratorsHandler.js b/services/web/app/src/Features/Collaborators/CollaboratorsHandler.js
index ab16929bf9..2411dc3ad0 100644
--- a/services/web/app/src/Features/Collaborators/CollaboratorsHandler.js
+++ b/services/web/app/src/Features/Collaborators/CollaboratorsHandler.js
@@ -2,7 +2,6 @@ const { callbackify } = require('util')
 const OError = require('@overleaf/o-error')
 const { Project } = require('../../models/Project')
 const ProjectGetter = require('../Project/ProjectGetter')
-const ProjectHelper = require('../Project/ProjectHelper')
 const logger = require('@overleaf/logger')
 const ContactManager = require('../Contacts/ContactManager')
 const PrivilegeLevels = require('../Authorization/PrivilegeLevels')
@@ -31,65 +30,22 @@ module.exports = {
 
 async function removeUserFromProject(projectId, userId) {
   try {
-    const project = await Project.findOne({ _id: projectId }).exec()
-
-    // Temporary workaround for the case where pendingReviewer_refs is null
     await Project.updateOne(
-      { _id: projectId, pendingReviewer_refs: { $type: 'null' } },
-      { $set: { pendingReviewer_refs: [] } }
-    ).exec()
-
-    // Temporary workaround for the case where readOnly_refs is null
-    await Project.updateOne(
-      { _id: projectId, readOnly_refs: { $type: 'null' } },
-      { $set: { readOnly_refs: [] } }
-    ).exec()
-
-    // Deal with the old type of boolean value for archived
-    // In order to clear it
-    if (typeof project.archived === 'boolean') {
-      let archived = ProjectHelper.calculateArchivedArray(
-        project,
-        userId,
-        'ARCHIVE'
-      )
-
-      archived = archived.filter(id => id.toString() !== userId.toString())
-
-      await Project.updateOne(
-        { _id: projectId },
-        {
-          $set: { archived },
-          $pull: {
-            collaberator_refs: userId,
-            reviewer_refs: userId,
-            readOnly_refs: userId,
-            pendingEditor_refs: userId,
-            pendingReviewer_refs: userId,
-            tokenAccessReadOnly_refs: userId,
-            tokenAccessReadAndWrite_refs: userId,
-            trashed: userId,
-          },
-        }
-      )
-    } else {
-      await Project.updateOne(
-        { _id: projectId },
-        {
-          $pull: {
-            collaberator_refs: userId,
-            readOnly_refs: userId,
-            reviewer_refs: userId,
-            pendingEditor_refs: userId,
-            pendingReviewer_refs: userId,
-            tokenAccessReadOnly_refs: userId,
-            tokenAccessReadAndWrite_refs: userId,
-            archived: userId,
-            trashed: userId,
-          },
-        }
-      )
-    }
+      { _id: projectId },
+      {
+        $pull: {
+          collaberator_refs: userId,
+          readOnly_refs: userId,
+          reviewer_refs: userId,
+          pendingEditor_refs: userId,
+          pendingReviewer_refs: userId,
+          tokenAccessReadOnly_refs: userId,
+          tokenAccessReadAndWrite_refs: userId,
+          archived: userId,
+          trashed: userId,
+        },
+      }
+    )
   } catch (err) {
     throw OError.tag(err, 'problem removing user from project collaborators', {
       projectId,
@@ -110,9 +66,26 @@ async function removeUserFromAllProjects(userId) {
     .concat(readOnly)
     .concat(tokenReadAndWrite)
     .concat(tokenReadOnly)
+  logger.info(
+    {
+      userId,
+      readAndWriteCount: readAndWrite.length,
+      readOnlyCount: readOnly.length,
+      tokenReadAndWriteCount: tokenReadAndWrite.length,
+      tokenReadOnlyCount: tokenReadOnly.length,
+    },
+    'removing user from projects'
+  )
   for (const project of allProjects) {
     await removeUserFromProject(project._id, userId)
   }
+  logger.info(
+    {
+      userId,
+      allProjectsCount: allProjects.length,
+    },
+    'removed user from all projects'
+  )
 }
 
 async function addUserIdToProject(
@@ -132,6 +105,7 @@ async function addUserIdToProject(
   })
   let level
   let existingUsers = project.collaberator_refs || []
+  existingUsers = existingUsers.concat(project.reviewer_refs || [])
   existingUsers = existingUsers.concat(project.readOnly_refs || [])
   existingUsers = existingUsers.map(u => u.toString())
   if (existingUsers.includes(userId.toString())) {
@@ -307,6 +281,7 @@ async function setCollaboratorPrivilegeLevel(
     ],
   }
   let update
+
   switch (privilegeLevel) {
     case PrivilegeLevels.READ_AND_WRITE: {
       update = {
diff --git a/services/web/app/src/Features/Collaborators/CollaboratorsInviteController.mjs b/services/web/app/src/Features/Collaborators/CollaboratorsInviteController.mjs
index c6ffba1ea5..db853afac3 100644
--- a/services/web/app/src/Features/Collaborators/CollaboratorsInviteController.mjs
+++ b/services/web/app/src/Features/Collaborators/CollaboratorsInviteController.mjs
@@ -244,6 +244,7 @@ async function generateNewInvite(req, res) {
 async function viewInvite(req, res) {
   const projectId = req.params.Project_id
   const { token } = req.params
+
   const _renderInvalidPage = function () {
     res.status(404)
     logger.debug({ projectId }, 'invite not valid, rendering not-valid page')
diff --git a/services/web/app/src/Features/Collaborators/OwnershipTransferHandler.js b/services/web/app/src/Features/Collaborators/OwnershipTransferHandler.js
index 82c9c37ac7..e22818ebb8 100644
--- a/services/web/app/src/Features/Collaborators/OwnershipTransferHandler.js
+++ b/services/web/app/src/Features/Collaborators/OwnershipTransferHandler.js
@@ -85,6 +85,7 @@ async function _getProject(projectId) {
     owner_ref: 1,
     collaberator_refs: 1,
     readOnly_refs: 1,
+    reviewer_refs: 1,
     name: 1,
   })
   if (project == null) {
@@ -104,8 +105,13 @@ async function _getUser(userId) {
 function _getUserPermissions(user, project) {
   const collaboratorIds = project.collaberator_refs || []
   const readOnlyIds = project.readOnly_refs || []
+  const reviewerIds = project.reviewer_refs || []
   if (collaboratorIds.some(collaboratorId => collaboratorId.equals(user._id))) {
     return PrivilegeLevels.READ_AND_WRITE
+  } else if (
+    reviewerIds.some(collaboratorId => collaboratorId.equals(user._id))
+  ) {
+    return PrivilegeLevels.REVIEW
   } else if (
     readOnlyIds.some(collaboratorId => collaboratorId.equals(user._id))
   ) {
diff --git a/services/web/app/src/Features/Compile/ClsiCacheController.js b/services/web/app/src/Features/Compile/ClsiCacheController.js
new file mode 100644
index 0000000000..6065b25578
--- /dev/null
+++ b/services/web/app/src/Features/Compile/ClsiCacheController.js
@@ -0,0 +1,156 @@
+const { NotFoundError, ResourceGoneError } = require('../Errors/Errors')
+const {
+  fetchStreamWithResponse,
+  RequestFailedError,
+} = require('@overleaf/fetch-utils')
+const Path = require('path')
+const { pipeline } = require('stream/promises')
+const logger = require('@overleaf/logger')
+const ClsiCacheManager = require('./ClsiCacheManager')
+const CompileController = require('./CompileController')
+const { expressify } = require('@overleaf/promise-utils')
+const ClsiCacheHandler = require('./ClsiCacheHandler')
+const ProjectGetter = require('../Project/ProjectGetter')
+const { MeteredStream } = require('@overleaf/stream-utils')
+const Metrics = require('@overleaf/metrics')
+
+/**
+ * Download a file from a specific build on the clsi-cache.
+ *
+ * @param req
+ * @param res
+ * @return {Promise<*>}
+ */
+async function downloadFromCache(req, res) {
+  const { Project_id: projectId, buildId, filename } = req.params
+  const userId = CompileController._getUserIdForCompile(req)
+  const signal = AbortSignal.timeout(60 * 1000)
+  let location, projectName
+  try {
+    ;[{ location }, { name: projectName }] = await Promise.all([
+      ClsiCacheHandler.getOutputFile(
+        projectId,
+        userId,
+        buildId,
+        filename,
+        signal
+      ),
+      ProjectGetter.promises.getProject(projectId, { name: 1 }),
+    ])
+  } catch (err) {
+    if (err instanceof NotFoundError) {
+      // res.sendStatus() sends a description of the status as body.
+      // Using res.status().end() avoids sending that fake body.
+      return res.status(404).end()
+    } else {
+      throw err
+    }
+  }
+
+  const { stream, response } = await fetchStreamWithResponse(location, {
+    signal,
+  })
+  if (req.destroyed) {
+    // The client has disconnected already, avoid trying to write into the broken connection.
+    return
+  }
+
+  for (const key of ['Content-Length', 'Content-Type']) {
+    if (response.headers.has(key)) res.setHeader(key, response.headers.get(key))
+  }
+  const ext = Path.extname(filename)
+  res.attachment(
+    ext === '.pdf'
+      ? `${CompileController._getSafeProjectName({ name: projectName })}.pdf`
+      : filename
+  )
+  try {
+    res.writeHead(response.status)
+    await pipeline(
+      stream,
+      new MeteredStream(Metrics, 'clsi_cache_egress', {
+        path: ClsiCacheHandler.getEgressLabel(filename),
+      }),
+      res
+    )
+  } catch (err) {
+    const reqAborted = Boolean(req.destroyed)
+    const streamingStarted = Boolean(res.headersSent)
+    if (!streamingStarted) {
+      if (err instanceof RequestFailedError) {
+        res.sendStatus(err.response.status)
+      } else {
+        res.sendStatus(500)
+      }
+    }
+    if (
+      streamingStarted &&
+      reqAborted &&
+      err.code === 'ERR_STREAM_PREMATURE_CLOSE'
+    ) {
+      // Ignore noisy spurious error
+      return
+    }
+    logger.warn(
+      {
+        err,
+        projectId,
+        location,
+        filename,
+        reqAborted,
+        streamingStarted,
+      },
+      'CLSI-cache proxy error'
+    )
+  }
+}
+
+/**
+ * Prepare a compile response from the clsi-cache.
+ *
+ * @param req
+ * @param res
+ * @return {Promise<void>}
+ */
+async function getLatestBuildFromCache(req, res) {
+  const { Project_id: projectId } = req.params
+  const userId = CompileController._getUserIdForCompile(req)
+  try {
+    const {
+      zone,
+      outputFiles,
+      compileGroup,
+      clsiServerId,
+      clsiCacheShard,
+      options,
+    } = await ClsiCacheManager.getLatestCompileResult(projectId, userId)
+
+    let { pdfCachingMinChunkSize, pdfDownloadDomain } =
+      await CompileController._getSplitTestOptions(req, res)
+    pdfDownloadDomain += `/zone/${zone}`
+    res.json({
+      fromCache: true,
+      status: 'success',
+      outputFiles,
+      compileGroup,
+      clsiServerId,
+      clsiCacheShard,
+      pdfDownloadDomain,
+      pdfCachingMinChunkSize,
+      options,
+    })
+  } catch (err) {
+    if (err instanceof NotFoundError) {
+      res.sendStatus(404)
+    } else if (err instanceof ResourceGoneError) {
+      res.sendStatus(410)
+    } else {
+      throw err
+    }
+  }
+}
+
+module.exports = {
+  downloadFromCache: expressify(downloadFromCache),
+  getLatestBuildFromCache: expressify(getLatestBuildFromCache),
+}
diff --git a/services/web/app/src/Features/Compile/ClsiCacheHandler.js b/services/web/app/src/Features/Compile/ClsiCacheHandler.js
new file mode 100644
index 0000000000..4f74d237d6
--- /dev/null
+++ b/services/web/app/src/Features/Compile/ClsiCacheHandler.js
@@ -0,0 +1,247 @@
+const _ = require('lodash')
+const {
+  fetchNothing,
+  fetchRedirectWithResponse,
+  RequestFailedError,
+} = require('@overleaf/fetch-utils')
+const logger = require('@overleaf/logger')
+const Settings = require('@overleaf/settings')
+const OError = require('@overleaf/o-error')
+const { NotFoundError, InvalidNameError } = require('../Errors/Errors')
+
+/**
+ * Keep in sync with validateFilename in services/clsi-cache/app/js/utils.js
+ *
+ * @param {string} filename
+ */
+function validateFilename(filename) {
+  if (filename.split('/').includes('..')) {
+    throw new InvalidNameError('path traversal')
+  }
+  if (
+    !(
+      [
+        'output.blg',
+        'output.log',
+        'output.pdf',
+        'output.synctex.gz',
+        'output.overleaf.json',
+        'output.tar.gz',
+      ].includes(filename) || filename.endsWith('.blg')
+    )
+  ) {
+    throw new InvalidNameError('bad filename')
+  }
+}
+
+/**
+ * Keep in sync with getIngressLabel in services/clsi-cache/app/js/utils.js
+ *
+ * @param {string} fsPath
+ * @return {string}
+ */
+function getEgressLabel(fsPath) {
+  if (fsPath.endsWith('.blg')) {
+    // .blg files may have custom names and can be in nested folders.
+    return 'output.blg'
+  }
+  // The rest is limited to 5 file names via validateFilename: output.pdf, etc.
+  return fsPath
+}
+
+/**
+ * Clear the cache on all clsi-cache instances.
+ *
+ * @param projectId
+ * @param userId
+ * @return {Promise<void>}
+ */
+async function clearCache(projectId, userId) {
+  let path = `/project/${projectId}`
+  if (userId) {
+    path += `/user/${userId}`
+  }
+  path += '/output'
+
+  await Promise.all(
+    Settings.apis.clsiCache.instances.map(async ({ url, shard }) => {
+      const u = new URL(url)
+      u.pathname = path
+      try {
+        await fetchNothing(u, {
+          method: 'DELETE',
+          signal: AbortSignal.timeout(15_000),
+        })
+      } catch (err) {
+        throw OError.tag(err, 'clear clsi-cache', { url, shard })
+      }
+    })
+  )
+}
+
+/**
+ * Get an output file from a specific build.
+ *
+ * @param projectId
+ * @param userId
+ * @param buildId
+ * @param filename
+ * @param signal
+ * @return {Promise<{size: number, zone: string, shard: string, location: string, lastModified: Date, allFiles: string[]}>}
+ */
+async function getOutputFile(
+  projectId,
+  userId,
+  buildId,
+  filename,
+  signal = AbortSignal.timeout(15_000)
+) {
+  validateFilename(filename)
+  if (!/^[a-f0-9-]+$/.test(buildId)) {
+    throw new InvalidNameError('bad buildId')
+  }
+
+  let path = `/project/${projectId}`
+  if (userId) {
+    path += `/user/${userId}`
+  }
+  path += `/build/${buildId}/search/output/${filename}`
+  return getRedirectWithFallback(projectId, userId, path, signal)
+}
+
+/**
+ * Get an output file from the most recent build.
+ *
+ * @param projectId
+ * @param userId
+ * @param filename
+ * @param signal
+ * @return {Promise<{size: number, zone: string, shard: string, location: string, lastModified: Date, allFiles: string[]}>}
+ */
+async function getLatestOutputFile(
+  projectId,
+  userId,
+  filename,
+  signal = AbortSignal.timeout(15_000)
+) {
+  validateFilename(filename)
+
+  let path = `/project/${projectId}`
+  if (userId) {
+    path += `/user/${userId}`
+  }
+  path += `/latest/output/${filename}`
+  return getRedirectWithFallback(projectId, userId, path, signal)
+}
+
+/**
+ * Request the given path from any of the clsi-cache instances.
+ *
+ * Some of them might be down temporarily. Try the next one until we receive a redirect or 404.
+ *
+ * This function is similar to the Coordinator in the clsi-cache, notable differences:
+ * - all the logic for sorting builds is in clsi-cache (re-used by clsi and web)
+ * - fan-out (1 client performs lookup on many clsi-cache instances) is "central" in clsi-cache, resulting in better connection re-use
+ * - we only cross the k8s cluster boundary via an internal GCLB once ($$$)
+ *
+ * @param projectId
+ * @param userId
+ * @param path
+ * @param signal
+ * @return {Promise<{size: number, zone: string, shard: string, location: string, lastModified: Date, allFiles: string[]}>}
+ */
+async function getRedirectWithFallback(
+  projectId,
+  userId,
+  path,
+  signal = AbortSignal.timeout(15_000)
+) {
+  // Avoid hitting the same instance first all the time.
+  const instances = _.shuffle(Settings.apis.clsiCache.instances)
+  for (const { url, shard } of instances) {
+    const u = new URL(url)
+    u.pathname = path
+    try {
+      const {
+        location,
+        response: { headers },
+      } = await fetchRedirectWithResponse(u, {
+        signal,
+      })
+      let allFilesRaw = headers.get('X-All-Files')
+      if (!allFilesRaw.startsWith('[')) {
+        allFilesRaw = Buffer.from(allFilesRaw, 'base64url').toString()
+      }
+      // Success, return the cache entry.
+      return {
+        location,
+        zone: headers.get('X-Zone'),
+        shard: headers.get('X-Shard') || 'cache',
+        lastModified: new Date(headers.get('X-Last-Modified')),
+        size: parseInt(headers.get('X-Content-Length'), 10),
+        allFiles: JSON.parse(allFilesRaw),
+      }
+    } catch (err) {
+      if (err instanceof RequestFailedError && err.response.status === 404) {
+        break // No clsi-cache instance has cached something for this project/user.
+      }
+      logger.warn(
+        { err, projectId, userId, url, shard },
+        'getLatestOutputFile from clsi-cache failed'
+      )
+      // This clsi-cache instance is down, try the next backend.
+    }
+  }
+  throw new NotFoundError('nothing cached yet')
+}
+
+/**
+ * Populate the clsi-cache for the given project/user with the provided source
+ *
+ * This is either another project, or a template (id+version).
+ *
+ * @param projectId
+ * @param userId
+ * @param sourceProjectId
+ * @param templateId
+ * @param templateVersionId
+ * @param lastUpdated
+ * @param shard
+ * @param signal
+ * @return {Promise<void>}
+ */
+async function prepareCacheSource(
+  projectId,
+  userId,
+  { sourceProjectId, templateId, templateVersionId, lastUpdated, shard, signal }
+) {
+  const url = new URL(
+    `/project/${projectId}/user/${userId}/import-from`,
+    Settings.apis.clsiCache.instances.find(i => i.shard === shard).url
+  )
+  try {
+    await fetchNothing(url, {
+      method: 'POST',
+      json: {
+        sourceProjectId,
+        lastUpdated,
+        templateId,
+        templateVersionId,
+      },
+      signal,
+    })
+  } catch (err) {
+    if (err instanceof RequestFailedError && err.response.status === 404) {
+      throw new NotFoundError()
+    }
+    throw err
+  }
+}
+
+module.exports = {
+  getEgressLabel,
+  clearCache,
+  getOutputFile,
+  getLatestOutputFile,
+  prepareCacheSource,
+}
diff --git a/services/web/app/src/Features/Compile/ClsiCacheManager.js b/services/web/app/src/Features/Compile/ClsiCacheManager.js
new file mode 100644
index 0000000000..0c172642ee
--- /dev/null
+++ b/services/web/app/src/Features/Compile/ClsiCacheManager.js
@@ -0,0 +1,217 @@
+const _ = require('lodash')
+const { NotFoundError, ResourceGoneError } = require('../Errors/Errors')
+const ClsiCacheHandler = require('./ClsiCacheHandler')
+const DocumentUpdaterHandler = require('../DocumentUpdater/DocumentUpdaterHandler')
+const ProjectGetter = require('../Project/ProjectGetter')
+const SplitTestHandler = require('../SplitTests/SplitTestHandler')
+const UserGetter = require('../User/UserGetter')
+const Settings = require('@overleaf/settings')
+const { fetchJson, RequestFailedError } = require('@overleaf/fetch-utils')
+const Metrics = require('@overleaf/metrics')
+
+/**
+ * Get the most recent build and metadata
+ *
+ * Internal: internal metadata; External: fine to send to user as-is.
+ *
+ * @param projectId
+ * @param userId
+ * @param filename
+ * @param signal
+ * @return {Promise<{internal: {location: string}, external: {zone: string, shard: string, isUpToDate: boolean, lastUpdated: Date, size: number, allFiles: string[]}}>}
+ */
+async function getLatestBuildFromCache(projectId, userId, filename, signal) {
+  const [
+    { location, lastModified: lastCompiled, zone, shard, size, allFiles },
+    lastUpdatedInRedis,
+    { lastUpdated: lastUpdatedInMongo },
+  ] = await Promise.all([
+    ClsiCacheHandler.getLatestOutputFile(projectId, userId, filename, signal),
+    DocumentUpdaterHandler.promises.getProjectLastUpdatedAt(projectId),
+    ProjectGetter.promises.getProject(projectId, { lastUpdated: 1 }),
+  ])
+
+  const lastUpdated =
+    lastUpdatedInRedis > lastUpdatedInMongo
+      ? lastUpdatedInRedis
+      : lastUpdatedInMongo
+  const isUpToDate = lastCompiled >= lastUpdated
+
+  return {
+    internal: {
+      location,
+    },
+    external: {
+      isUpToDate,
+      lastUpdated,
+      size,
+      allFiles,
+      shard,
+      zone,
+    },
+  }
+}
+
+class MetaFileExpiredError extends NotFoundError {}
+
+async function getLatestCompileResult(projectId, userId) {
+  const signal = AbortSignal.timeout(15_000)
+  for (let attempt = 0; attempt < 3; attempt++) {
+    try {
+      return await tryGetLatestCompileResult(projectId, userId, signal)
+    } catch (err) {
+      if (err instanceof MetaFileExpiredError) {
+        continue
+      }
+      throw err
+    }
+  }
+  throw new NotFoundError()
+}
+
+async function tryGetLatestCompileResult(projectId, userId, signal) {
+  const {
+    internal: { location: metaLocation },
+    external: {
+      isUpToDate,
+      allFiles,
+      zone,
+      shard: clsiCacheShard,
+      size: jsonSize,
+    },
+  } = await getLatestBuildFromCache(
+    projectId,
+    userId,
+    'output.overleaf.json',
+    signal
+  )
+  if (!isUpToDate) throw new ResourceGoneError()
+
+  let meta
+  try {
+    meta = await fetchJson(metaLocation, {
+      signal: AbortSignal.timeout(5 * 1000),
+    })
+  } catch (err) {
+    if (err instanceof RequestFailedError && err.response.status === 404) {
+      throw new MetaFileExpiredError(
+        'build expired between listing and reading'
+      )
+    }
+    throw err
+  }
+  Metrics.count('clsi_cache_egress', jsonSize, 1, {
+    path: ClsiCacheHandler.getEgressLabel('output.overleaf.json'),
+  })
+
+  const [, editorId, buildId] = metaLocation.match(
+    /\/build\/([a-f0-9-]+?)-([a-f0-9]+-[a-f0-9]+)\//
+  )
+  const { ranges, contentId, clsiServerId, compileGroup, size, options } = meta
+
+  let baseURL = `/project/${projectId}`
+  if (userId) {
+    baseURL += `/user/${userId}`
+  }
+
+  const outputFiles = allFiles
+    .filter(path => path !== 'output.overleaf.json' && path !== 'output.tar.gz')
+    .map(path => {
+      const f = {
+        url: `${baseURL}/build/${editorId}-${buildId}/output/${path}`,
+        downloadURL: `/download/project/${projectId}/build/${editorId}-${buildId}/output/cached/${path}`,
+        build: buildId,
+        path,
+        type: path.split('.').pop(),
+      }
+      if (path === 'output.pdf') {
+        Object.assign(f, {
+          size,
+          editorId,
+        })
+        if (clsiServerId !== clsiCacheShard) {
+          // Enable PDF caching and attempt to download from VM first.
+          // (clsi VMs do not have the editorId in the path on disk, omit it).
+          Object.assign(f, {
+            url: `${baseURL}/build/${buildId}/output/output.pdf`,
+            ranges,
+            contentId,
+          })
+        }
+      }
+      return f
+    })
+
+  return {
+    allFiles,
+    zone,
+    outputFiles,
+    compileGroup,
+    clsiServerId,
+    clsiCacheShard,
+    options,
+  }
+}
+
+/**
+ * Collect metadata and prepare the clsi-cache for the given project.
+ *
+ * @param projectId
+ * @param userId
+ * @param sourceProjectId
+ * @param templateId
+ * @param templateVersionId
+ * @return {Promise<void>}
+ */
+async function prepareClsiCache(
+  projectId,
+  userId,
+  { sourceProjectId, templateId, templateVersionId }
+) {
+  const { variant } = await SplitTestHandler.promises.getAssignmentForUser(
+    userId,
+    'populate-clsi-cache'
+  )
+  if (variant !== 'enabled') return
+
+  const features = await UserGetter.promises.getUserFeatures(userId)
+  if (features.compileGroup !== 'priority') return
+
+  const signal = AbortSignal.timeout(5_000)
+  let lastUpdated
+  let shard = _.shuffle(Settings.apis.clsiCache.instances)[0].shard
+  if (sourceProjectId) {
+    try {
+      ;({
+        external: { lastUpdated, shard },
+      } = await getLatestBuildFromCache(
+        sourceProjectId,
+        userId,
+        'output.tar.gz',
+        signal
+      ))
+    } catch (err) {
+      if (err instanceof NotFoundError) return // nothing cached yet
+      throw err
+    }
+  }
+  try {
+    await ClsiCacheHandler.prepareCacheSource(projectId, userId, {
+      sourceProjectId,
+      templateId,
+      templateVersionId,
+      shard,
+      lastUpdated,
+      signal,
+    })
+  } catch (err) {
+    if (err instanceof NotFoundError) return // nothing cached yet/expired.
+    throw err
+  }
+}
+
+module.exports = {
+  getLatestBuildFromCache,
+  getLatestCompileResult,
+  prepareClsiCache,
+}
diff --git a/services/web/app/src/Features/Compile/ClsiCookieManager.js b/services/web/app/src/Features/Compile/ClsiCookieManager.js
index fc542fefaf..a1ac0741b9 100644
--- a/services/web/app/src/Features/Compile/ClsiCookieManager.js
+++ b/services/web/app/src/Features/Compile/ClsiCookieManager.js
@@ -1,12 +1,15 @@
 const { URL, URLSearchParams } = require('url')
 const OError = require('@overleaf/o-error')
 const Settings = require('@overleaf/settings')
-const request = require('request').defaults({ timeout: 30 * 1000 })
+const {
+  fetchNothing,
+  fetchStringWithResponse,
+  RequestFailedError,
+} = require('@overleaf/fetch-utils')
 const RedisWrapper = require('../../infrastructure/RedisWrapper')
 const Cookie = require('cookie')
 const logger = require('@overleaf/logger')
 const Metrics = require('@overleaf/metrics')
-const { promisifyAll } = require('@overleaf/promise-utils')
 
 const clsiCookiesEnabled = (Settings.clsiCookie?.key ?? '') !== ''
 
@@ -16,235 +19,204 @@ if (Settings.redis.clsi_cookie_secondary != null) {
   rclientSecondary = RedisWrapper.client('clsi_cookie_secondary')
 }
 
-module.exports = function (backendGroup) {
-  const cookieManager = {
-    buildKey(projectId, userId) {
-      if (backendGroup != null) {
-        return `clsiserver:${backendGroup}:${projectId}:${userId}`
-      } else {
-        return `clsiserver:${projectId}:${userId}`
-      }
-    },
+const ClsiCookieManagerFactory = function (backendGroup) {
+  function buildKey(projectId, userId) {
+    if (backendGroup != null) {
+      return `clsiserver:${backendGroup}:${projectId}:${userId}`
+    } else {
+      return `clsiserver:${projectId}:${userId}`
+    }
+  }
 
-    getServerId(
-      projectId,
-      userId,
-      compileGroup,
-      compileBackendClass,
-      callback
-    ) {
-      if (!clsiCookiesEnabled) {
-        return callback()
-      }
-      rclient.get(this.buildKey(projectId, userId), (err, serverId) => {
-        if (err) {
-          return callback(err)
-        }
-        if (serverId == null || serverId === '') {
-          this._populateServerIdViaRequest(
-            projectId,
-            userId,
-            compileGroup,
-            compileBackendClass,
-            callback
-          )
-        } else {
-          callback(null, serverId)
-        }
-      })
-    },
+  async function getServerId(
+    projectId,
+    userId,
+    compileGroup,
+    compileBackendClass
+  ) {
+    if (!clsiCookiesEnabled) {
+      return
+    }
+    const serverId = await rclient.get(buildKey(projectId, userId))
 
-    _populateServerIdViaRequest(
-      projectId,
-      userId,
-      compileGroup,
-      compileBackendClass,
-      callback
-    ) {
-      const u = new URL(`${Settings.apis.clsi.url}/project/${projectId}/status`)
-      u.search = new URLSearchParams({
+    if (!serverId) {
+      return await cookieManager.promises._populateServerIdViaRequest(
+        projectId,
+        userId,
         compileGroup,
-        compileBackendClass,
-      }).toString()
-      request.post(u.href, (err, res, body) => {
-        if (err) {
-          OError.tag(err, 'error getting initial server id for project', {
-            project_id: projectId,
-          })
-          return callback(err)
-        }
-        if (!clsiCookiesEnabled) {
-          return callback()
-        }
-        const serverId = this._parseServerIdFromResponse(res)
-        this.setServerId(
-          projectId,
-          userId,
-          compileGroup,
-          compileBackendClass,
-          serverId,
-          null,
-          function (err) {
-            if (err) {
-              logger.warn(
-                { err, projectId },
-                'error setting server id via populate request'
-              )
-            }
-            callback(err, serverId)
-          }
-        )
-      })
-    },
-
-    _parseServerIdFromResponse(response) {
-      const cookies = Cookie.parse(response.headers['set-cookie']?.[0] || '')
-      return cookies?.[Settings.clsiCookie.key]
-    },
-
-    checkIsLoadSheddingEvent(clsiserverid, compileGroup, compileBackendClass) {
-      request.get(
-        {
-          url: `${Settings.apis.clsi.url}/instance-state`,
-          qs: { clsiserverid, compileGroup, compileBackendClass },
-        },
-        (err, res, body) => {
-          if (err) {
-            Metrics.inc('clsi-lb-switch-backend', 1, {
-              status: 'error',
-            })
-            logger.warn({ err, clsiserverid }, 'cannot probe clsi VM')
-            return
-          }
-          const isStillRunning =
-            res.statusCode === 200 && body === `${clsiserverid},UP\n`
-          Metrics.inc('clsi-lb-switch-backend', 1, {
-            status: isStillRunning ? 'load-shedding' : 'cycle',
-          })
-        }
+        compileBackendClass
       )
-    },
+    } else {
+      return serverId
+    }
+  }
 
-    _getTTLInSeconds(clsiServerId) {
-      return (clsiServerId || '').includes('-reg-')
-        ? Settings.clsiCookie.ttlInSecondsRegular
-        : Settings.clsiCookie.ttlInSeconds
-    },
-
-    setServerId(
-      projectId,
-      userId,
+  async function _populateServerIdViaRequest(
+    projectId,
+    userId,
+    compileGroup,
+    compileBackendClass
+  ) {
+    const u = new URL(`${Settings.apis.clsi.url}/project/${projectId}/status`)
+    u.search = new URLSearchParams({
       compileGroup,
       compileBackendClass,
-      serverId,
-      previous,
-      callback
-    ) {
-      if (!clsiCookiesEnabled) {
-        return callback()
-      }
-      if (serverId == null) {
-        // We don't get a cookie back if it hasn't changed
-        return rclient.expire(
-          this.buildKey(projectId, userId),
-          this._getTTLInSeconds(previous),
-          err => callback(err)
-        )
-      }
-      if (!previous) {
-        // Initial assignment of a user+project or after clearing cache.
-        Metrics.inc('clsi-lb-assign-initial-backend')
-      } else {
-        this.checkIsLoadSheddingEvent(
-          previous,
-          compileGroup,
-          compileBackendClass
-        )
-      }
-      if (rclientSecondary != null) {
-        this._setServerIdInRedis(
-          rclientSecondary,
-          projectId,
-          userId,
-          serverId,
-          () => {}
-        )
-      }
-      this._setServerIdInRedis(rclient, projectId, userId, serverId, err =>
-        callback(err)
-      )
-    },
-
-    _setServerIdInRedis(rclient, projectId, userId, serverId, callback) {
-      rclient.setex(
-        this.buildKey(projectId, userId),
-        this._getTTLInSeconds(serverId),
-        serverId,
-        callback
-      )
-    },
-
-    clearServerId(projectId, userId, callback) {
-      if (!clsiCookiesEnabled) {
-        return callback()
-      }
-      rclient.del(this.buildKey(projectId, userId), err => {
-        if (err) {
-          // redis errors need wrapping as the instance may be shared
-          return callback(
-            new OError(
-              'Failed to clear clsi persistence',
-              { projectId, userId },
-              err
-            )
-          )
-        } else {
-          return callback()
-        }
+    }).toString()
+    let res
+    try {
+      res = await fetchNothing(u.href, {
+        method: 'POST',
+        signal: AbortSignal.timeout(30_000),
       })
-    },
+    } catch (err) {
+      OError.tag(err, 'error getting initial server id for project', {
+        project_id: projectId,
+      })
+      throw err
+    }
 
-    getCookieJar(
-      projectId,
-      userId,
-      compileGroup,
-      compileBackendClass,
-      callback
-    ) {
-      if (!clsiCookiesEnabled) {
-        return callback(null, request.jar(), undefined)
-      }
-      this.getServerId(
+    if (!clsiCookiesEnabled) {
+      return
+    }
+    const serverId = cookieManager._parseServerIdFromResponse(res)
+    try {
+      await cookieManager.promises.setServerId(
         projectId,
         userId,
         compileGroup,
         compileBackendClass,
-        (err, serverId) => {
-          if (err != null) {
-            OError.tag(err, 'error getting server id', {
-              project_id: projectId,
-            })
-            return callback(err)
-          }
-          const serverCookie = request.cookie(
-            `${Settings.clsiCookie.key}=${serverId}`
-          )
-          const jar = request.jar()
-          jar.setCookie(serverCookie, Settings.apis.clsi.url)
-          callback(null, jar, serverId)
+        serverId,
+        null
+      )
+      return serverId
+    } catch (err) {
+      logger.warn(
+        { err, projectId },
+        'error setting server id via populate request'
+      )
+      throw err
+    }
+  }
+
+  function _parseServerIdFromResponse(response) {
+    const cookies = Cookie.parse(response.headers['set-cookie']?.[0] || '')
+    return cookies?.[Settings.clsiCookie.key]
+  }
+
+  async function checkIsLoadSheddingEvent(
+    clsiserverid,
+    compileGroup,
+    compileBackendClass
+  ) {
+    let status
+    try {
+      const params = new URLSearchParams({
+        clsiserverid,
+        compileGroup,
+        compileBackendClass,
+      }).toString()
+      const { response, body } = await fetchStringWithResponse(
+        `${Settings.apis.clsi.url}/instance-state?${params}`,
+        {
+          method: 'GET',
+          signal: AbortSignal.timeout(30_000),
         }
       )
+      status =
+        response.status === 200 && body === `${clsiserverid},UP\n`
+          ? 'load-shedding'
+          : 'cycle'
+    } catch (err) {
+      if (err instanceof RequestFailedError && err.response.status === 404) {
+        status = 'cycle'
+      } else {
+        status = 'error'
+        logger.warn({ err, clsiserverid }, 'cannot probe clsi VM')
+      }
+    }
+    Metrics.inc('clsi-lb-switch-backend', 1, { status })
+  }
+
+  function _getTTLInSeconds(clsiServerId) {
+    return (clsiServerId || '').includes('-reg-')
+      ? Settings.clsiCookie.ttlInSecondsRegular
+      : Settings.clsiCookie.ttlInSeconds
+  }
+
+  async function setServerId(
+    projectId,
+    userId,
+    compileGroup,
+    compileBackendClass,
+    serverId,
+    previous
+  ) {
+    if (!clsiCookiesEnabled) {
+      return
+    }
+    if (serverId == null) {
+      // We don't get a cookie back if it hasn't changed
+      return await rclient.expire(
+        buildKey(projectId, userId),
+        _getTTLInSeconds(previous)
+      )
+    }
+    if (!previous) {
+      // Initial assignment of a user+project or after clearing cache.
+      Metrics.inc('clsi-lb-assign-initial-backend')
+    } else {
+      await checkIsLoadSheddingEvent(
+        previous,
+        compileGroup,
+        compileBackendClass
+      )
+    }
+    if (rclientSecondary != null) {
+      await _setServerIdInRedis(
+        rclientSecondary,
+        projectId,
+        userId,
+        serverId
+      ).catch(() => {})
+    }
+    await _setServerIdInRedis(rclient, projectId, userId, serverId)
+  }
+
+  async function _setServerIdInRedis(rclient, projectId, userId, serverId) {
+    await rclient.setex(
+      buildKey(projectId, userId),
+      _getTTLInSeconds(serverId),
+      serverId
+    )
+  }
+
+  async function clearServerId(projectId, userId) {
+    if (!clsiCookiesEnabled) {
+      return
+    }
+    try {
+      await rclient.del(buildKey(projectId, userId))
+    } catch (err) {
+      // redis errors need wrapping as the instance may be shared
+      throw new OError(
+        'Failed to clear clsi persistence',
+        { projectId, userId },
+        err
+      )
+    }
+  }
+
+  const cookieManager = {
+    _parseServerIdFromResponse,
+    promises: {
+      getServerId,
+      clearServerId,
+      _populateServerIdViaRequest,
+      setServerId,
     },
   }
-  cookieManager.promises = promisifyAll(cookieManager, {
-    without: [
-      '_parseServerIdFromResponse',
-      'checkIsLoadSheddingEvent',
-      '_getTTLInSeconds',
-    ],
-    multiResult: {
-      getCookieJar: ['jar', 'clsiServerId'],
-    },
-  })
+
   return cookieManager
 }
+
+module.exports = ClsiCookieManagerFactory
diff --git a/services/web/app/src/Features/Compile/ClsiManager.js b/services/web/app/src/Features/Compile/ClsiManager.js
index 68c8a9c0de..94208e8607 100644
--- a/services/web/app/src/Features/Compile/ClsiManager.js
+++ b/services/web/app/src/Features/Compile/ClsiManager.js
@@ -25,6 +25,7 @@ const ClsiFormatChecker = require('./ClsiFormatChecker')
 const DocumentUpdaterHandler = require('../DocumentUpdater/DocumentUpdaterHandler')
 const Metrics = require('@overleaf/metrics')
 const Errors = require('../Errors/Errors')
+const ClsiCacheHandler = require('./ClsiCacheHandler')
 const { getBlobLocation } = require('../History/HistoryManager')
 
 const VALID_COMPILERS = ['pdflatex', 'latex', 'xelatex', 'lualatex']
@@ -148,6 +149,13 @@ async function deleteAuxFiles(projectId, userId, options, clsiserverid) {
       clsiserverid
     )
   } finally {
+    // always clear the clsi-cache
+    try {
+      await ClsiCacheHandler.clearCache(projectId, userId)
+    } catch (err) {
+      logger.warn({ err, projectId, userId }, 'purge clsi-cache failed')
+    }
+
     // always clear the project state from the docupdater, even if there
     // was a problem with the request to the clsi
     try {
@@ -199,6 +207,7 @@ async function _sendBuiltRequest(projectId, userId, req, options, callback) {
     stats: compile.stats,
     timings: compile.timings,
     outputUrlPrefix: compile.outputUrlPrefix,
+    clsiCacheShard: compile.clsiCacheShard,
   }
 }
 
@@ -683,7 +692,7 @@ async function _getContentFromMongo(projectId) {
 
 function _finaliseRequest(projectId, options, project, docs, files) {
   const resources = []
-  let flags
+  let flags = []
   let rootResourcePath = null
   let rootResourcePathOverride = null
   let hasMainFile = false
@@ -762,10 +771,15 @@ function _finaliseRequest(projectId, options, project, docs, files) {
     flags = ['-file-line-error']
   }
 
+  if (process.env.TEX_COMPILER_EXTRA_FLAGS) {
+    flags.push(...process.env.TEX_COMPILER_EXTRA_FLAGS.split(/\s+/).filter(Boolean))
+  }
+
   return {
     compile: {
       options: {
         buildId: options.buildId,
+        editorId: options.editorId,
         compiler: project.compiler,
         timeout: options.timeout,
         imageName: project.imageName,
@@ -775,6 +789,13 @@ function _finaliseRequest(projectId, options, project, docs, files) {
         syncType: options.syncType,
         syncState: options.syncState,
         compileGroup: options.compileGroup,
+        // Overleaf alpha/staff users get compileGroup=alpha (via getProjectCompileLimits in CompileManager), enroll them into the premium rollout of clsi-cache.
+        compileFromClsiCache:
+          ['alpha', 'priority'].includes(options.compileGroup) &&
+          options.compileFromClsiCache,
+        populateClsiCache:
+          ['alpha', 'priority'].includes(options.compileGroup) &&
+          options.populateClsiCache,
         enablePdfCaching:
           (Settings.enablePdfCaching && options.enablePdfCaching) || false,
         pdfCachingMinChunkSize: options.pdfCachingMinChunkSize,
@@ -837,6 +858,7 @@ module.exports = {
     'timings',
     'outputUrlPrefix',
     'buildId',
+    'clsiCacheShard',
   ]),
   sendExternalRequest: callbackifyMultiResult(sendExternalRequest, [
     'status',
diff --git a/services/web/app/src/Features/Compile/CompileController.js b/services/web/app/src/Features/Compile/CompileController.js
index 327c7cc9a3..f4b08a84cf 100644
--- a/services/web/app/src/Features/Compile/CompileController.js
+++ b/services/web/app/src/Features/Compile/CompileController.js
@@ -1,5 +1,4 @@
-let CompileController
-const { URL, URLSearchParams } = require('url')
+const { URL } = require('url')
 const { pipeline } = require('stream/promises')
 const { Cookie } = require('tough-cookie')
 const OError = require('@overleaf/o-error')
@@ -17,7 +16,7 @@ const ClsiCookieManager = require('./ClsiCookieManager')(
 const Path = require('path')
 const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const SplitTestHandler = require('../SplitTests/SplitTestHandler')
-const { callbackify } = require('@overleaf/promise-utils')
+const { expressify } = require('@overleaf/promise-utils')
 const {
   fetchStreamWithResponse,
   RequestFailedError,
@@ -34,17 +33,19 @@ function getOutputFilesArchiveSpecification(projectId, userId, buildId) {
   const fileName = 'output.zip'
   return {
     path: fileName,
-    url: CompileController._getFileUrl(projectId, userId, buildId, fileName),
+    url: _CompileController._getFileUrl(projectId, userId, buildId, fileName),
     type: 'zip',
   }
 }
 
-function getImageNameForProject(projectId, callback) {
-  ProjectGetter.getProject(projectId, { imageName: 1 }, (err, project) => {
-    if (err) return callback(err)
-    if (!project) return callback(new Error('project not found'))
-    callback(null, project.imageName)
+async function getImageNameForProject(projectId) {
+  const project = await ProjectGetter.promises.getProject(projectId, {
+    imageName: 1,
   })
+  if (!project) {
+    throw new Error('project not found')
+  }
+  return project.imageName
 }
 
 async function getPdfCachingMinChunkSize(req, res) {
@@ -53,11 +54,13 @@ async function getPdfCachingMinChunkSize(req, res) {
     res,
     'pdf-caching-min-chunk-size'
   )
-  if (variant === 'default') return 1_000_000
+  if (variant === 'default') {
+    return 1_000_000
+  }
   return parseInt(variant, 10)
 }
 
-const getSplitTestOptions = callbackify(async function (req, res) {
+async function _getSplitTestOptions(req, res) {
   // Use the query flags from the editor request for overriding the split test.
   let query = {}
   try {
@@ -66,11 +69,25 @@ const getSplitTestOptions = callbackify(async function (req, res) {
   } catch (e) {}
   const editorReq = { ...req, query }
 
+  // Lookup the clsi-cache flag in the backend.
+  // We may need to turn off the feature on a short notice, without requiring
+  //  all users to reload their editor page to disable the feature.
+  const { variant: populateClsiCacheVariant } =
+    await SplitTestHandler.promises.getAssignment(
+      editorReq,
+      res,
+      'populate-clsi-cache'
+    )
+  const populateClsiCache = populateClsiCacheVariant === 'enabled'
+  const compileFromClsiCache = populateClsiCache // use same split-test
+
   const pdfDownloadDomain = Settings.pdfDownloadDomain
 
   if (!req.query.enable_pdf_caching) {
     // The frontend does not want to do pdf caching.
     return {
+      compileFromClsiCache,
+      populateClsiCache,
       pdfDownloadDomain,
       enablePdfCaching: false,
     }
@@ -88,20 +105,24 @@ const getSplitTestOptions = callbackify(async function (req, res) {
   if (!enablePdfCaching) {
     // Skip the lookup of the chunk size when caching is not enabled.
     return {
+      compileFromClsiCache,
+      populateClsiCache,
       pdfDownloadDomain,
       enablePdfCaching: false,
     }
   }
   const pdfCachingMinChunkSize = await getPdfCachingMinChunkSize(editorReq, res)
   return {
+    compileFromClsiCache,
+    populateClsiCache,
     pdfDownloadDomain,
     enablePdfCaching,
     pdfCachingMinChunkSize,
   }
-})
+}
 
-module.exports = CompileController = {
-  compile(req, res, next) {
+const _CompileController = {
+  async compile(req, res) {
     res.setTimeout(COMPILE_TIMEOUT_MS)
     const projectId = req.params.Project_id
     const isAutoCompile = !!req.query.auto_compile
@@ -112,6 +133,7 @@ module.exports = CompileController = {
       isAutoCompile,
       fileLineErrors,
       stopOnFirstError,
+      editorId: req.body.editorId,
     }
 
     if (req.body.rootDoc_id) {
@@ -136,103 +158,101 @@ module.exports = CompileController = {
       options.incrementalCompilesEnabled = true
     }
 
-    getSplitTestOptions(req, res, (err, splitTestOptions) => {
-      if (err) return next(err)
-      let { enablePdfCaching, pdfCachingMinChunkSize, pdfDownloadDomain } =
-        splitTestOptions
-      options.enablePdfCaching = enablePdfCaching
-      if (enablePdfCaching) {
-        options.pdfCachingMinChunkSize = pdfCachingMinChunkSize
-      }
+    let {
+      compileFromClsiCache,
+      populateClsiCache,
+      enablePdfCaching,
+      pdfCachingMinChunkSize,
+      pdfDownloadDomain,
+    } = await _getSplitTestOptions(req, res)
+    options.compileFromClsiCache = compileFromClsiCache
+    options.populateClsiCache = populateClsiCache
+    options.enablePdfCaching = enablePdfCaching
+    if (enablePdfCaching) {
+      options.pdfCachingMinChunkSize = pdfCachingMinChunkSize
+    }
 
-      CompileManager.compile(
-        projectId,
-        userId,
-        options,
-        (
-          error,
+    const {
+      status,
+      outputFiles,
+      clsiServerId,
+      limits,
+      validationProblems,
+      stats,
+      timings,
+      outputUrlPrefix,
+      buildId,
+      clsiCacheShard,
+    } = await CompileManager.promises
+      .compile(projectId, userId, options)
+      .catch(error => {
+        Metrics.inc('compile-error')
+        throw error
+      })
+
+    Metrics.inc('compile-status', 1, { status })
+    if (pdfDownloadDomain && outputUrlPrefix) {
+      pdfDownloadDomain += outputUrlPrefix
+    }
+
+    if (limits) {
+      // For a compile request to be sent to clsi we need limits.
+      // If we get here without having the limits object populated, it is
+      //  a reasonable assumption to make that nothing was compiled.
+      // We need to know the limits in order to make use of the events.
+      AnalyticsManager.recordEventForSession(
+        req.session,
+        'compile-result-backend',
+        {
+          projectId,
+          ownerAnalyticsId: limits.ownerAnalyticsId,
           status,
-          outputFiles,
+          compileTime: timings?.compileE2E,
+          timeout: limits.timeout,
+          server:
+            clsiServerId?.includes('-c2d-') ||
+            clsiServerId?.includes('-c3d-') ||
+            clsiServerId?.includes('-c4d-')
+              ? 'faster'
+              : 'normal',
           clsiServerId,
-          limits,
-          validationProblems,
-          stats,
-          timings,
-          outputUrlPrefix,
-          buildId
-        ) => {
-          if (error) {
-            Metrics.inc('compile-error')
-            return next(error)
-          }
-          Metrics.inc('compile-status', 1, { status })
-          if (pdfDownloadDomain && outputUrlPrefix) {
-            pdfDownloadDomain += outputUrlPrefix
-          }
-
-          if (
-            limits &&
-            SplitTestHandler.getPercentile(
-              AnalyticsManager.getIdsFromSession(req.session).analyticsId,
-              'compile-result-backend',
-              'release'
-            ) === 1
-          ) {
-            // For a compile request to be sent to clsi we need limits.
-            // If we get here without having the limits object populated, it is
-            //  a reasonable assumption to make that nothing was compiled.
-            // We need to know the limits in order to make use of the events.
-            AnalyticsManager.recordEventForSession(
-              req.session,
-              'compile-result-backend',
-              {
-                projectId,
-                ownerAnalyticsId: limits.ownerAnalyticsId,
-                status,
-                compileTime: timings?.compileE2E,
-                timeout: limits.timeout === 60 ? 'short' : 'long',
-                server: clsiServerId?.includes('-c2d-') ? 'faster' : 'normal',
-                isAutoCompile,
-                stopOnFirstError,
-              }
-            )
-          }
-
-          const outputFilesArchive = buildId
-            ? getOutputFilesArchiveSpecification(projectId, userId, buildId)
-            : null
-
-          res.json({
-            status,
-            outputFiles,
-            outputFilesArchive,
-            compileGroup: limits?.compileGroup,
-            clsiServerId,
-            validationProblems,
-            stats,
-            timings,
-            outputUrlPrefix,
-            pdfDownloadDomain,
-            pdfCachingMinChunkSize,
-          })
+          isAutoCompile,
+          isInitialCompile: stats?.isInitialCompile === 1,
+          restoredClsiCache: stats?.restoredClsiCache === 1,
+          stopOnFirstError,
         }
       )
+    }
+
+    const outputFilesArchive = buildId
+      ? getOutputFilesArchiveSpecification(projectId, userId, buildId)
+      : null
+
+    res.json({
+      status,
+      outputFiles,
+      outputFilesArchive,
+      compileGroup: limits?.compileGroup,
+      clsiServerId,
+      clsiCacheShard,
+      validationProblems,
+      stats,
+      timings,
+      outputUrlPrefix,
+      pdfDownloadDomain,
+      pdfCachingMinChunkSize,
     })
   },
 
-  stopCompile(req, res, next) {
+  async stopCompile(req, res) {
     const projectId = req.params.Project_id
     const userId = SessionManager.getLoggedInUserId(req.session)
-    CompileManager.stopCompile(projectId, userId, function (error) {
-      if (error) {
-        return next(error)
-      }
-      res.sendStatus(200)
-    })
+    await CompileManager.promises.stopCompile(projectId, userId)
+    res.sendStatus(200)
   },
 
   // Used for submissions through the public API
-  compileSubmission(req, res, next) {
+  async compileSubmission(req, res) {
     res.setTimeout(COMPILE_TIMEOUT_MS)
     const submissionId = req.params.submission_id
     const options = {}
@@ -253,200 +273,164 @@ module.exports = CompileController = {
     options.compileBackendClass = Settings.apis.clsi.submissionBackendClass
     options.timeout =
       req.body?.timeout || Settings.defaultFeatures.compileTimeout
-    ClsiManager.sendExternalRequest(
-      submissionId,
-      req.body,
-      options,
-      function (error, status, outputFiles, clsiServerId, validationProblems) {
-        if (error) {
-          return next(error)
-        }
-        res.json({
-          status,
-          outputFiles,
-          clsiServerId,
-          validationProblems,
-        })
-      }
-    )
-  },
-
-  _compileAsUser(req, callback) {
-    // callback with userId if per-user, undefined otherwise
-    if (!Settings.disablePerUserCompiles) {
-      const userId = SessionManager.getLoggedInUserId(req.session)
-      callback(null, userId)
-    } else {
-      callback()
-    }
-  }, // do a per-project compile, not per-user
-
-  _downloadAsUser(req, callback) {
-    // callback with userId if per-user, undefined otherwise
-    if (!Settings.disablePerUserCompiles) {
-      const userId = SessionManager.getLoggedInUserId(req.session)
-      callback(null, userId)
-    } else {
-      callback()
-    }
-  }, // do a per-project compile, not per-user
-
-  downloadPdf(req, res, next) {
-    Metrics.inc('pdf-downloads')
-    const projectId = req.params.Project_id
-    const rateLimit = function (callback) {
-      pdfDownloadRateLimiter
-        .consume(req.ip, 1, { method: 'ip' })
-        .then(() => {
-          callback(null, true)
-        })
-        .catch(err => {
-          if (err instanceof Error) {
-            callback(err)
-          } else {
-            callback(null, false)
-          }
-        })
-    }
-
-    ProjectGetter.getProject(projectId, { name: 1 }, function (err, project) {
-      if (err) {
-        return next(err)
-      }
-      res.contentType('application/pdf')
-      const filename = `${CompileController._getSafeProjectName(project)}.pdf`
-
-      if (req.query.popupDownload) {
-        res.setContentDisposition('attachment', { filename })
-      } else {
-        res.setContentDisposition('inline', { filename })
-      }
-
-      rateLimit(function (err, canContinue) {
-        if (err) {
-          logger.err({ err }, 'error checking rate limit for pdf download')
-          res.sendStatus(500)
-        } else if (!canContinue) {
-          logger.debug(
-            { projectId, ip: req.ip },
-            'rate limit hit downloading pdf'
-          )
-          res.sendStatus(500)
-        } else {
-          CompileController._downloadAsUser(req, function (error, userId) {
-            if (error) {
-              return next(error)
-            }
-            const url = CompileController._getFileUrl(
-              projectId,
-              userId,
-              req.params.build_id,
-              'output.pdf'
-            )
-            CompileController.proxyToClsi(
-              projectId,
-              'output-file',
-              url,
-              {},
-              req,
-              res,
-              next
-            )
-          })
-        }
-      })
+    const { status, outputFiles, clsiServerId, validationProblems } =
+      await ClsiManager.promises.sendExternalRequest(
+        submissionId,
+        req.body,
+        options
+      )
+    res.json({
+      status,
+      outputFiles,
+      clsiServerId,
+      validationProblems,
     })
   },
 
+  _getUserIdForCompile(req) {
+    if (!Settings.disablePerUserCompiles) {
+      return SessionManager.getLoggedInUserId(req.session)
+    }
+    return null
+  },
+
+  async downloadPdf(req, res) {
+    Metrics.inc('pdf-downloads')
+    const projectId = req.params.Project_id
+    const rateLimit = () =>
+      pdfDownloadRateLimiter
+        .consume(req.ip, 1, { method: 'ip' })
+        .then(() => true)
+        .catch(err => {
+          if (err instanceof Error) {
+            throw err
+          }
+          return false
+        })
+
+    const project = await ProjectGetter.promises.getProject(projectId, {
+      name: 1,
+    })
+
+    res.contentType('application/pdf')
+    const filename = `${_CompileController._getSafeProjectName(project)}.pdf`
+
+    if (req.query.popupDownload) {
+      res.setContentDisposition('attachment', { filename })
+    } else {
+      res.setContentDisposition('inline', { filename })
+    }
+
+    let canContinue
+    try {
+      canContinue = await rateLimit()
+    } catch (err) {
+      logger.err({ err }, 'error checking rate limit for pdf download')
+      res.sendStatus(500)
+      return
+    }
+
+    if (!canContinue) {
+      logger.debug({ projectId, ip: req.ip }, 'rate limit hit downloading pdf')
+      res.sendStatus(500) // should it be 429?
+    } else {
+      const userId = CompileController._getUserIdForCompile(req)
+
+      const url = _CompileController._getFileUrl(
+        projectId,
+        userId,
+        req.params.build_id,
+        'output.pdf'
+      )
+      await CompileController._proxyToClsi(
+        projectId,
+        'output-file',
+        url,
+        {},
+        req,
+        res
+      )
+    }
+  },
+
+  // Keep in sync with the logic for zip files in ProjectDownloadsController
   _getSafeProjectName(project) {
     return project.name.replace(/[^\p{L}\p{Nd}]/gu, '_')
   },
 
-  deleteAuxFiles(req, res, next) {
+  async deleteAuxFiles(req, res) {
     const projectId = req.params.Project_id
     const { clsiserverid } = req.query
-    CompileController._compileAsUser(req, function (error, userId) {
-      if (error) {
-        return next(error)
-      }
-      CompileManager.deleteAuxFiles(
-        projectId,
-        userId,
-        clsiserverid,
-        function (error) {
-          if (error) {
-            return next(error)
-          }
-          res.sendStatus(200)
-        }
-      )
-    })
+    const userId = await CompileController._getUserIdForCompile(req)
+    await CompileManager.promises.deleteAuxFiles(
+      projectId,
+      userId,
+      clsiserverid
+    )
+    res.sendStatus(200)
   },
 
   // this is only used by templates, so is not called with a userId
-  compileAndDownloadPdf(req, res, next) {
+  async compileAndDownloadPdf(req, res) {
     const projectId = req.params.project_id
-    // pass userId as null, since templates are an "anonymous" compile
-    CompileManager.compile(projectId, null, {}, (err, _status, outputFiles) => {
-      if (err) {
-        logger.err(
-          { err, projectId },
-          'something went wrong compile and downloading pdf'
-        )
-        res.sendStatus(500)
-        return
-      }
-      const pdf = outputFiles.find(f => f.path === 'output.pdf')
-      if (!pdf) {
-        logger.warn(
-          { projectId },
-          'something went wrong compile and downloading pdf: no pdf'
-        )
-        res.sendStatus(500)
-        return
-      }
-      CompileController.proxyToClsi(
-        projectId,
-        'output-file',
-        pdf.url,
-        {},
-        req,
-        res,
-        next
+
+    let outputFiles
+    try {
+      ;({ outputFiles } = await CompileManager.promises
+        // pass userId as null, since templates are an "anonymous" compile
+        .compile(projectId, null, {}))
+    } catch (err) {
+      logger.err(
+        { err, projectId },
+        'something went wrong compile and downloading pdf'
       )
-    })
+      res.sendStatus(500)
+      return
+    }
+    const pdf = outputFiles.find(f => f.path === 'output.pdf')
+    if (!pdf) {
+      logger.warn(
+        { projectId },
+        'something went wrong compile and downloading pdf: no pdf'
+      )
+      res.sendStatus(500)
+      return
+    }
+    await CompileController._proxyToClsi(
+      projectId,
+      'output-file',
+      pdf.url,
+      {},
+      req,
+      res
+    )
   },
 
-  getFileFromClsi(req, res, next) {
+  async getFileFromClsi(req, res) {
     const projectId = req.params.Project_id
-    CompileController._downloadAsUser(req, function (error, userId) {
-      if (error) {
-        return next(error)
-      }
+    const userId = CompileController._getUserIdForCompile(req)
 
-      const qs = {}
+    const qs = {}
 
-      const url = CompileController._getFileUrl(
-        projectId,
-        userId,
-        req.params.build_id,
-        req.params.file
-      )
-      CompileController.proxyToClsi(
-        projectId,
-        'output-file',
-        url,
-        qs,
-        req,
-        res,
-        next
-      )
-    })
+    const url = _CompileController._getFileUrl(
+      projectId,
+      userId,
+      req.params.build_id,
+      req.params.file
+    )
+    await CompileController._proxyToClsi(
+      projectId,
+      'output-file',
+      url,
+      qs,
+      req,
+      res
+    )
   },
 
-  getFileFromClsiWithoutUser(req, res, next) {
+  async getFileFromClsiWithoutUser(req, res) {
     const submissionId = req.params.submission_id
-    const url = CompileController._getFileUrl(
+    const url = _CompileController._getFileUrl(
       submissionId,
       null,
       req.params.build_id,
@@ -459,15 +443,14 @@ module.exports = CompileController = {
         Settings.defaultFeatures.compileGroup,
       compileBackendClass: Settings.apis.clsi.submissionBackendClass,
     }
-    CompileController.proxyToClsiWithLimits(
+    await CompileController._proxyToClsiWithLimits(
       submissionId,
       'output-file',
       url,
       {},
       limits,
       req,
-      res,
-      next
+      res
     )
   },
 
@@ -495,45 +478,42 @@ module.exports = CompileController = {
     return `${path}/${action}`
   },
 
-  proxySyncPdf(req, res, next) {
+  async proxySyncPdf(req, res) {
     const projectId = req.params.Project_id
-    const { page, h, v } = req.query
+    const { page, h, v, editorId, buildId } = req.query
     if (!page?.match(/^\d+$/)) {
-      return next(new Error('invalid page parameter'))
+      throw new Error('invalid page parameter')
     }
     if (!h?.match(/^-?\d+\.\d+$/)) {
-      return next(new Error('invalid h parameter'))
+      throw new Error('invalid h parameter')
     }
     if (!v?.match(/^-?\d+\.\d+$/)) {
-      return next(new Error('invalid v parameter'))
+      throw new Error('invalid v parameter')
     }
     // whether this request is going to a per-user container
-    CompileController._compileAsUser(req, function (error, userId) {
-      if (error) {
-        return next(error)
-      }
-      getImageNameForProject(projectId, (error, imageName) => {
-        if (error) return next(error)
+    const userId = CompileController._getUserIdForCompile(req)
 
-        const url = CompileController._getUrl(projectId, userId, 'sync/pdf')
-        CompileController.proxyToClsi(
-          projectId,
-          'sync-to-pdf',
-          url,
-          { page, h, v, imageName },
-          req,
-          res,
-          next
-        )
-      })
-    })
+    const imageName = await getImageNameForProject(projectId)
+
+    const { compileFromClsiCache } = await _getSplitTestOptions(req, res)
+
+    const url = _CompileController._getUrl(projectId, userId, 'sync/pdf')
+
+    await CompileController._proxyToClsi(
+      projectId,
+      'sync-to-pdf',
+      url,
+      { page, h, v, imageName, editorId, buildId, compileFromClsiCache },
+      req,
+      res
+    )
   },
 
-  proxySyncCode(req, res, next) {
+  async proxySyncCode(req, res) {
     const projectId = req.params.Project_id
-    const { file, line, column } = req.query
+    const { file, line, column, editorId, buildId } = req.query
     if (file == null) {
-      return next(new Error('missing file parameter'))
+      throw new Error('missing file parameter')
     }
     // Check that we are dealing with a simple file path (this is not
     // strictly needed because synctex uses this parameter as a label
@@ -542,212 +522,234 @@ module.exports = CompileController = {
     // allow those by replacing /./ with /
     const testPath = file.replace('/./', '/')
     if (Path.resolve('/', testPath) !== `/${testPath}`) {
-      return next(new Error('invalid file parameter'))
+      throw new Error('invalid file parameter')
     }
     if (!line?.match(/^\d+$/)) {
-      return next(new Error('invalid line parameter'))
+      throw new Error('invalid line parameter')
     }
     if (!column?.match(/^\d+$/)) {
-      return next(new Error('invalid column parameter'))
+      throw new Error('invalid column parameter')
     }
-    CompileController._compileAsUser(req, function (error, userId) {
-      if (error) {
-        return next(error)
-      }
-      getImageNameForProject(projectId, (error, imageName) => {
-        if (error) return next(error)
+    const userId = CompileController._getUserIdForCompile(req)
 
-        const url = CompileController._getUrl(projectId, userId, 'sync/code')
-        CompileController.proxyToClsi(
-          projectId,
-          'sync-to-code',
-          url,
-          { file, line, column, imageName },
-          req,
-          res,
-          next
-        )
-      })
-    })
-  },
+    const imageName = await getImageNameForProject(projectId)
 
-  proxyToClsi(projectId, action, url, qs, req, res, next) {
-    CompileManager.getProjectCompileLimits(projectId, function (error, limits) {
-      if (error) {
-        return next(error)
-      }
-      CompileController.proxyToClsiWithLimits(
-        projectId,
-        action,
-        url,
-        qs,
-        limits,
-        req,
-        res,
-        next
-      )
-    })
-  },
+    const { compileFromClsiCache } = await _getSplitTestOptions(req, res)
 
-  proxyToClsiWithLimits(projectId, action, url, qs, limits, req, res, next) {
-    _getPersistenceOptions(
-      req,
+    const url = _CompileController._getUrl(projectId, userId, 'sync/code')
+    await CompileController._proxyToClsi(
       projectId,
-      limits.compileGroup,
-      limits.compileBackendClass,
-      (err, persistenceOptions) => {
-        if (err) {
-          OError.tag(err, 'error getting cookie jar for clsi request')
-          return next(err)
-        }
-        url = new URL(`${Settings.apis.clsi.url}${url}`)
-        url.search = new URLSearchParams({
-          ...persistenceOptions.qs,
-          ...qs,
-        }).toString()
-        const timer = new Metrics.Timer(
-          'proxy_to_clsi',
-          1,
-          { path: action },
-          [0, 100, 1000, 2000, 5000, 10000, 15000, 20000, 30000, 45000, 60000]
-        )
-        Metrics.inc('proxy_to_clsi', 1, { path: action, status: 'start' })
-        fetchStreamWithResponse(url.href, {
-          method: req.method,
-          signal: AbortSignal.timeout(60 * 1000),
-          headers: persistenceOptions.headers,
-        })
-          .then(({ stream, response }) => {
-            if (req.destroyed) {
-              // The client has disconnected already, avoid trying to write into the broken connection.
-              Metrics.inc('proxy_to_clsi', 1, {
-                path: action,
-                status: 'req-aborted',
-              })
-              return
-            }
-            Metrics.inc('proxy_to_clsi', 1, {
-              path: action,
-              status: response.status,
-            })
-
-            for (const key of ['Content-Length', 'Content-Type']) {
-              if (response.headers.has(key)) {
-                res.setHeader(key, response.headers.get(key))
-              }
-            }
-            res.writeHead(response.status)
-            return pipeline(stream, res)
-          })
-          .then(() => {
-            timer.labels.status = 'success'
-            timer.done()
-          })
-          .catch(err => {
-            const reqAborted = Boolean(req.destroyed)
-            const status = reqAborted ? 'req-aborted-late' : 'error'
-            timer.labels.status = status
-            const duration = timer.done()
-            Metrics.inc('proxy_to_clsi', 1, { path: action, status })
-            const streamingStarted = Boolean(res.headersSent)
-            if (!streamingStarted) {
-              if (err instanceof RequestFailedError) {
-                res.sendStatus(err.response.status)
-              } else {
-                res.sendStatus(500)
-              }
-            }
-            if (
-              streamingStarted &&
-              reqAborted &&
-              err.code === 'ERR_STREAM_PREMATURE_CLOSE'
-            ) {
-              // Ignore noisy spurious error
-              return
-            }
-            if (
-              err instanceof RequestFailedError &&
-              ['sync-to-code', 'sync-to-pdf', 'output-file'].includes(action)
-            ) {
-              // Ignore noisy error
-              // https://github.com/overleaf/internal/issues/15201
-              return
-            }
-            logger.warn(
-              {
-                err,
-                projectId,
-                url,
-                action,
-                reqAborted,
-                streamingStarted,
-                duration,
-              },
-              'CLSI proxy error'
-            )
-          })
-      }
+      'sync-to-code',
+      url,
+      {
+        file,
+        line,
+        column,
+        imageName,
+        editorId,
+        buildId,
+        compileFromClsiCache,
+      },
+      req,
+      res
     )
   },
 
-  wordCount(req, res, next) {
+  async _proxyToClsi(projectId, action, url, qs, req, res) {
+    const limits =
+      await CompileManager.promises.getProjectCompileLimits(projectId)
+    if (
+      qs?.compileFromClsiCache &&
+      !['alpha', 'priority'].includes(limits.compileGroup)
+    ) {
+      qs.compileFromClsiCache = false
+    }
+    return CompileController._proxyToClsiWithLimits(
+      projectId,
+      action,
+      url,
+      qs,
+      limits,
+      req,
+      res
+    )
+  },
+
+  async _proxyToClsiWithLimits(projectId, action, url, qs, limits, req, res) {
+    const persistenceOptions = await _getPersistenceOptions(
+      req,
+      projectId,
+      limits.compileGroup,
+      limits.compileBackendClass
+    ).catch(err => {
+      OError.tag(err, 'error getting cookie jar for clsi request')
+      throw err
+    })
+
+    url = new URL(`${Settings.apis.clsi.url}${url}`)
+
+    const searchParams = {
+      ...persistenceOptions.qs,
+      ...qs,
+    }
+    for (const [key, value] of Object.entries(searchParams)) {
+      if (value !== undefined) {
+        // avoid sending "undefined" as a string value
+        url.searchParams.set(key, value)
+      }
+    }
+
+    const timer = new Metrics.Timer(
+      'proxy_to_clsi',
+      1,
+      { path: action },
+      [0, 100, 1000, 2000, 5000, 10000, 15000, 20000, 30000, 45000, 60000]
+    )
+    Metrics.inc('proxy_to_clsi', 1, { path: action, status: 'start' })
+    try {
+      const { stream, response } = await fetchStreamWithResponse(url.href, {
+        method: req.method,
+        signal: AbortSignal.timeout(60 * 1000),
+        headers: persistenceOptions.headers,
+      })
+      if (req.destroyed) {
+        // The client has disconnected already, avoid trying to write into the broken connection.
+        Metrics.inc('proxy_to_clsi', 1, {
+          path: action,
+          status: 'req-aborted',
+        })
+        return
+      }
+      Metrics.inc('proxy_to_clsi', 1, {
+        path: action,
+        status: response.status,
+      })
+
+      for (const key of ['Content-Length', 'Content-Type']) {
+        if (response.headers.has(key)) {
+          res.setHeader(key, response.headers.get(key))
+        }
+      }
+      res.writeHead(response.status)
+      await pipeline(stream, res)
+      timer.labels.status = 'success'
+      timer.done()
+    } catch (err) {
+      const reqAborted = Boolean(req.destroyed)
+      const status = reqAborted ? 'req-aborted-late' : 'error'
+      timer.labels.status = status
+      const duration = timer.done()
+      Metrics.inc('proxy_to_clsi', 1, { path: action, status })
+      const streamingStarted = Boolean(res.headersSent)
+      if (!streamingStarted) {
+        if (err instanceof RequestFailedError) {
+          res.sendStatus(err.response.status)
+        } else {
+          res.sendStatus(500)
+        }
+      }
+      if (
+        streamingStarted &&
+        reqAborted &&
+        err.code === 'ERR_STREAM_PREMATURE_CLOSE'
+      ) {
+        // Ignore noisy spurious error
+        return
+      }
+      if (
+        err instanceof RequestFailedError &&
+        ['sync-to-code', 'sync-to-pdf', 'output-file'].includes(action)
+      ) {
+        // Ignore noisy error
+        // https://github.com/overleaf/internal/issues/15201
+        return
+      }
+      logger.warn(
+        {
+          err,
+          projectId,
+          url,
+          action,
+          reqAborted,
+          streamingStarted,
+          duration,
+        },
+        'CLSI proxy error'
+      )
+    }
+  },
+
+  async wordCount(req, res) {
     const projectId = req.params.Project_id
     const file = req.query.file || false
     const { clsiserverid } = req.query
-    CompileController._compileAsUser(req, function (error, userId) {
-      if (error) {
-        return next(error)
-      }
-      CompileManager.wordCount(
-        projectId,
-        userId,
-        file,
-        clsiserverid,
-        function (error, body) {
-          if (error) {
-            return next(error)
-          }
-          res.json(body)
-        }
-      )
-    })
+    const userId = CompileController._getUserIdForCompile(req)
+
+    const body = await CompileManager.promises.wordCount(
+      projectId,
+      userId,
+      file,
+      clsiserverid
+    )
+    res.json(body)
   },
 }
 
-function _getPersistenceOptions(
+async function _getPersistenceOptions(
   req,
   projectId,
   compileGroup,
-  compileBackendClass,
-  callback
+  compileBackendClass
 ) {
   const { clsiserverid } = req.query
   const userId = SessionManager.getLoggedInUserId(req)
   if (clsiserverid && typeof clsiserverid === 'string') {
-    callback(null, {
+    return {
       qs: { clsiserverid, compileGroup, compileBackendClass },
       headers: {},
-    })
+    }
   } else {
-    ClsiCookieManager.getServerId(
+    const clsiServerId = await ClsiCookieManager.promises.getServerId(
       projectId,
       userId,
       compileGroup,
-      compileBackendClass,
-      (err, clsiServerId) => {
-        if (err) return callback(err)
-        callback(null, {
-          qs: { compileGroup, compileBackendClass },
-          headers: clsiServerId
-            ? {
-                Cookie: new Cookie({
-                  key: Settings.clsiCookie.key,
-                  value: clsiServerId,
-                }).cookieString(),
-              }
-            : {},
-        })
-      }
+      compileBackendClass
     )
+    return {
+      qs: { compileGroup, compileBackendClass },
+      headers: clsiServerId
+        ? {
+            Cookie: new Cookie({
+              key: Settings.clsiCookie.key,
+              value: clsiServerId,
+            }).cookieString(),
+          }
+        : {},
+    }
   }
 }
+
+const CompileController = {
+  COMPILE_TIMEOUT_MS,
+  compile: expressify(_CompileController.compile),
+  stopCompile: expressify(_CompileController.stopCompile),
+  compileSubmission: expressify(_CompileController.compileSubmission),
+  downloadPdf: expressify(_CompileController.downloadPdf), //
+  compileAndDownloadPdf: expressify(_CompileController.compileAndDownloadPdf),
+  deleteAuxFiles: expressify(_CompileController.deleteAuxFiles),
+  getFileFromClsi: expressify(_CompileController.getFileFromClsi),
+  getFileFromClsiWithoutUser: expressify(
+    _CompileController.getFileFromClsiWithoutUser
+  ),
+  proxySyncPdf: expressify(_CompileController.proxySyncPdf),
+  proxySyncCode: expressify(_CompileController.proxySyncCode),
+  wordCount: expressify(_CompileController.wordCount),
+
+  _getSafeProjectName: _CompileController._getSafeProjectName,
+  _getSplitTestOptions,
+  _getUserIdForCompile: _CompileController._getUserIdForCompile,
+  _proxyToClsi: _CompileController._proxyToClsi,
+  _proxyToClsiWithLimits: _CompileController._proxyToClsiWithLimits,
+}
+
+module.exports = CompileController
diff --git a/services/web/app/src/Features/Compile/CompileManager.js b/services/web/app/src/Features/Compile/CompileManager.js
index 9b5404865a..974f573815 100644
--- a/services/web/app/src/Features/Compile/CompileManager.js
+++ b/services/web/app/src/Features/Compile/CompileManager.js
@@ -86,6 +86,7 @@ async function compile(projectId, userId, options = {}) {
     timings,
     outputUrlPrefix,
     buildId,
+    clsiCacheShard,
   } = await ClsiManager.promises.sendRequest(projectId, compileAsUser, options)
 
   return {
@@ -98,6 +99,7 @@ async function compile(projectId, userId, options = {}) {
     timings,
     outputUrlPrefix,
     buildId,
+    clsiCacheShard,
   }
 }
 
@@ -184,6 +186,7 @@ module.exports = CompileManager = {
     'timings',
     'outputUrlPrefix',
     'buildId',
+    'clsiCacheShard',
   ]),
 
   stopCompile: callbackify(stopCompile),
diff --git a/services/web/app/src/Features/Cooldown/CooldownManager.js b/services/web/app/src/Features/Cooldown/CooldownManager.js
index 67bdc98838..8c6b708c07 100644
--- a/services/web/app/src/Features/Cooldown/CooldownManager.js
+++ b/services/web/app/src/Features/Cooldown/CooldownManager.js
@@ -1,24 +1,11 @@
-/* eslint-disable
-    n/handle-callback-err,
-    max-len,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * DS207: Consider shorter variations of null checks
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-let CooldownManager
 const RedisWrapper = require('../../infrastructure/RedisWrapper')
 const rclient = RedisWrapper.client('cooldown')
 const logger = require('@overleaf/logger')
-const { promisifyAll } = require('@overleaf/promise-utils')
+const { promisify } = require('@overleaf/promise-utils')
 
 const COOLDOWN_IN_SECONDS = 60 * 10
 
-module.exports = CooldownManager = {
+const CooldownManager = {
   _buildKey(projectId) {
     return `Cooldown:{${projectId}}`
   },
@@ -31,7 +18,7 @@ module.exports = CooldownManager = {
       { projectId },
       `[Cooldown] putting project on cooldown for ${COOLDOWN_IN_SECONDS} seconds`
     )
-    return rclient.set(
+    rclient.set(
       CooldownManager._buildKey(projectId),
       '1',
       'EX',
@@ -44,18 +31,18 @@ module.exports = CooldownManager = {
     if (callback == null) {
       callback = function () {}
     }
-    return rclient.get(
-      CooldownManager._buildKey(projectId),
-      function (err, result) {
-        if (err != null) {
-          return callback(err)
-        }
-        return callback(null, result === '1')
+    rclient.get(CooldownManager._buildKey(projectId), function (err, result) {
+      if (err != null) {
+        return callback(err)
       }
-    )
+      return callback(null, result === '1')
+    })
   },
 }
 
-module.exports.promises = promisifyAll(module.exports, {
-  without: ['_buildKey'],
-})
+CooldownManager.promises = {
+  putProjectOnCooldown: promisify(CooldownManager.putProjectOnCooldown),
+  isProjectOnCooldown: promisify(CooldownManager.isProjectOnCooldown),
+}
+
+module.exports = CooldownManager
diff --git a/services/web/app/src/Features/Docstore/DocstoreManager.js b/services/web/app/src/Features/Docstore/DocstoreManager.js
index 5fe0f27dc9..4074b90605 100644
--- a/services/web/app/src/Features/Docstore/DocstoreManager.js
+++ b/services/web/app/src/Features/Docstore/DocstoreManager.js
@@ -1,10 +1,11 @@
 const { promisify } = require('util')
-const { promisifyMultiResult } = require('@overleaf/promise-utils')
+const { promisifyMultiResult, callbackify } = require('@overleaf/promise-utils')
 const request = require('request').defaults({ jar: false })
 const OError = require('@overleaf/o-error')
 const logger = require('@overleaf/logger')
 const settings = require('@overleaf/settings')
 const Errors = require('../Errors/Errors')
+const { fetchJson } = require('@overleaf/fetch-utils')
 
 const TIMEOUT = 30 * 1000 // request timeout
 
@@ -86,6 +87,22 @@ function getAllDeletedDocs(projectId, callback) {
   })
 }
 
+/**
+ * @param {string} projectId
+ */
+async function getCommentThreadIds(projectId) {
+  const url = `${settings.apis.docstore.url}/project/${projectId}/comment-thread-ids`
+  return fetchJson(url, { signal: AbortSignal.timeout(TIMEOUT) })
+}
+
+/**
+ * @param {string} projectId
+ */
+async function getTrackedChangesUserIds(projectId) {
+  const url = `${settings.apis.docstore.url}/project/${projectId}/tracked-changes-user-ids`
+  return fetchJson(url, { signal: AbortSignal.timeout(TIMEOUT) })
+}
+
 /**
  * @param {string} projectId
  * @param {Callback} callback
@@ -292,6 +309,8 @@ module.exports = {
   getAllDeletedDocs,
   getAllRanges,
   getDoc,
+  getCommentThreadIds: callbackify(getCommentThreadIds),
+  getTrackedChangesUserIds: callbackify(getTrackedChangesUserIds),
   isDocDeleted,
   updateDoc,
   projectHasRanges,
@@ -304,6 +323,8 @@ module.exports = {
     getAllDeletedDocs: promisify(getAllDeletedDocs),
     getAllRanges: promisify(getAllRanges),
     getDoc: promisifyMultiResult(getDoc, ['lines', 'rev', 'version', 'ranges']),
+    getCommentThreadIds,
+    getTrackedChangesUserIds,
     isDocDeleted: promisify(isDocDeleted),
     updateDoc: promisifyMultiResult(updateDoc, ['modified', 'rev']),
     projectHasRanges: promisify(projectHasRanges),
diff --git a/services/web/app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js b/services/web/app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js
index 493b812dab..2ea06601c7 100644
--- a/services/web/app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js
+++ b/services/web/app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js
@@ -64,6 +64,11 @@ function flushProjectToMongoAndDelete(projectId, callback) {
   )
 }
 
+/**
+ * @param {string} projectId
+ * @param {string} docId
+ * @param {Callback} callback
+ */
 function flushDocToMongo(projectId, docId, callback) {
   _makeRequest(
     {
diff --git a/services/web/app/src/Features/Documents/DocumentController.mjs b/services/web/app/src/Features/Documents/DocumentController.mjs
index 6886414291..9a16811894 100644
--- a/services/web/app/src/Features/Documents/DocumentController.mjs
+++ b/services/web/app/src/Features/Documents/DocumentController.mjs
@@ -7,6 +7,7 @@ import logger from '@overleaf/logger'
 import _ from 'lodash'
 import { plainTextResponse } from '../../infrastructure/Response.js'
 import { expressify } from '@overleaf/promise-utils'
+import Modules from '../../infrastructure/Modules.js'
 
 async function getDocument(req, res) {
   const { Project_id: projectId, doc_id: docId } = req.params
@@ -52,6 +53,11 @@ async function getDocument(req, res) {
       'overleaf.history.rangesSupportEnabled',
       false
     )
+    const otMigrationStage = _.get(
+      project,
+      'overleaf.history.otMigrationStage',
+      0
+    )
 
     // all projects are now migrated to Full Project History, keeping the field
     // for API compatibility
@@ -65,6 +71,7 @@ async function getDocument(req, res) {
       projectHistoryId,
       projectHistoryType,
       historyRangesSupport,
+      otMigrationStage,
       resolvedCommentIds,
     })
   }
@@ -86,6 +93,9 @@ async function setDocument(req, res) {
     { docId, projectId },
     'finished receiving set document request from api (docupdater)'
   )
+
+  await Modules.promises.hooks.fire('docModified', projectId, docId)
+
   res.json(result)
 }
 
diff --git a/services/web/app/src/Features/Downloads/ProjectDownloadsController.mjs b/services/web/app/src/Features/Downloads/ProjectDownloadsController.mjs
index 6bd239b273..36aafda8c9 100644
--- a/services/web/app/src/Features/Downloads/ProjectDownloadsController.mjs
+++ b/services/web/app/src/Features/Downloads/ProjectDownloadsController.mjs
@@ -18,6 +18,11 @@ import { prepareZipAttachment } from '../../infrastructure/Response.js'
 
 let ProjectDownloadsController
 
+// Keep in sync with the logic for PDF files in CompileController
+function getSafeProjectName(project) {
+  return project.name.replace(/[^\p{L}\p{Nd}]/gu, '_')
+}
+
 export default ProjectDownloadsController = {
   downloadProject(req, res, next) {
     const projectId = req.params.Project_id
@@ -41,7 +46,7 @@ export default ProjectDownloadsController = {
                 if (error != null) {
                   return next(error)
                 }
-                prepareZipAttachment(res, `${project.name}.zip`)
+                prepareZipAttachment(res, `${getSafeProjectName(project)}.zip`)
                 return stream.pipe(res)
               }
             )
diff --git a/services/web/app/src/Features/Editor/EditorController.js b/services/web/app/src/Features/Editor/EditorController.js
index ea0153fe37..4d3a5e9eb0 100644
--- a/services/web/app/src/Features/Editor/EditorController.js
+++ b/services/web/app/src/Features/Editor/EditorController.js
@@ -307,6 +307,7 @@ const EditorController = {
       projectId,
       folderId,
       folderName,
+      userId,
       (err, folder, folderId) => {
         if (err) {
           OError.tag(err, 'could not add folder', {
@@ -333,11 +334,12 @@ const EditorController = {
     )
   },
 
-  mkdirp(projectId, path, callback) {
+  mkdirp(projectId, path, userId, callback) {
     logger.debug({ projectId, path }, "making directories if they don't exist")
     ProjectEntityUpdateHandler.mkdirp(
       projectId,
       path,
+      userId,
       (err, newFolders, lastFolder) => {
         if (err) {
           OError.tag(err, 'could not mkdirp', {
diff --git a/services/web/app/src/Features/Editor/EditorHttpController.js b/services/web/app/src/Features/Editor/EditorHttpController.js
index 45c9b2427a..f44b57f069 100644
--- a/services/web/app/src/Features/Editor/EditorHttpController.js
+++ b/services/web/app/src/Features/Editor/EditorHttpController.js
@@ -4,16 +4,13 @@ const ProjectGetter = require('../Project/ProjectGetter')
 const AuthorizationManager = require('../Authorization/AuthorizationManager')
 const ProjectEditorHandler = require('../Project/ProjectEditorHandler')
 const Metrics = require('@overleaf/metrics')
-const CollaboratorsGetter = require('../Collaborators/CollaboratorsGetter')
 const CollaboratorsInviteGetter = require('../Collaborators/CollaboratorsInviteGetter')
-const CollaboratorsHandler = require('../Collaborators/CollaboratorsHandler')
 const PrivilegeLevels = require('../Authorization/PrivilegeLevels')
 const SessionManager = require('../Authentication/SessionManager')
 const Errors = require('../Errors/Errors')
-const DocstoreManager = require('../Docstore/DocstoreManager')
-const logger = require('@overleaf/logger')
 const { expressify } = require('@overleaf/promise-utils')
 const Settings = require('@overleaf/settings')
+const { ProjectAccess } = require('../Collaborators/CollaboratorsGetter')
 
 module.exports = {
   joinProject: expressify(joinProject),
@@ -45,12 +42,6 @@ async function joinProject(req, res, next) {
   if (!project) {
     return res.sendStatus(403)
   }
-  // Hide sensitive data if the user is restricted
-  if (isRestrictedUser) {
-    project.owner = { _id: project.owner._id }
-    project.members = []
-    project.invites = []
-  }
   // Only show the 'renamed or deleted' message once
   if (project.deletedByExternalDataSource) {
     await ProjectDeleter.promises.unmarkAsDeletedByExternalSource(projectId)
@@ -77,57 +68,43 @@ async function _buildJoinProjectView(req, projectId, userId) {
   if (project == null) {
     throw new Errors.NotFoundError('project not found')
   }
-  let deletedDocsFromDocstore = []
-  try {
-    deletedDocsFromDocstore =
-      await DocstoreManager.promises.getAllDeletedDocs(projectId)
-  } catch (err) {
-    // The query in docstore is not optimized at this time and fails for
-    // projects with many very large, deleted documents.
-    // Not serving the user with deletedDocs from docstore may cause a minor
-    //  UI issue with deleted files that are no longer available for restore.
-    logger.warn(
-      { err, projectId },
-      'soft-failure when fetching deletedDocs from docstore'
-    )
-  }
-  const members =
-    await CollaboratorsGetter.promises.getInvitedMembersWithPrivilegeLevels(
-      projectId
-    )
+  const projectAccess = new ProjectAccess(project)
   const token = req.body.anonymousAccessToken
   const privilegeLevel =
-    await AuthorizationManager.promises.getPrivilegeLevelForProject(
+    await AuthorizationManager.promises.getPrivilegeLevelForProjectWithProjectAccess(
       userId,
       projectId,
-      token
+      token,
+      projectAccess
     )
   if (privilegeLevel == null || privilegeLevel === PrivilegeLevels.NONE) {
     return { project: null, privilegeLevel: null, isRestrictedUser: false }
   }
-  const invites =
-    await CollaboratorsInviteGetter.promises.getAllInvites(projectId)
-  const isTokenMember = await CollaboratorsHandler.promises.userIsTokenMember(
-    userId,
-    projectId
-  )
-  const isInvitedMember =
-    await CollaboratorsGetter.promises.isUserInvitedMemberOfProject(
-      userId,
-      projectId
-    )
+  const isTokenMember = projectAccess.isUserTokenMember(userId)
+  const isInvitedMember = projectAccess.isUserInvitedMember(userId)
   const isRestrictedUser = AuthorizationManager.isRestrictedUser(
     userId,
     privilegeLevel,
     isTokenMember,
     isInvitedMember
   )
+  let ownerMember
+  let members = []
+  let invites = []
+  if (isRestrictedUser) {
+    ownerMember = await projectAccess.loadOwner()
+  } else {
+    ;({ ownerMember, members } =
+      await projectAccess.loadOwnerAndInvitedMembers())
+    invites = await CollaboratorsInviteGetter.promises.getAllInvites(projectId)
+  }
   return {
     project: ProjectEditorHandler.buildProjectModelView(
       project,
+      ownerMember,
       members,
       invites,
-      deletedDocsFromDocstore
+      isRestrictedUser
     ),
     privilegeLevel,
     isTokenMember,
diff --git a/services/web/app/src/Features/Email/EmailBuilder.js b/services/web/app/src/Features/Email/EmailBuilder.js
index 0e46b1b8ea..4741838b15 100644
--- a/services/web/app/src/Features/Email/EmailBuilder.js
+++ b/services/web/app/src/Features/Email/EmailBuilder.js
@@ -222,10 +222,10 @@ templates.passwordResetRequested = ctaTemplate({
 
 templates.confirmEmail = ctaTemplate({
   subject() {
-    return `Confirm Email - ${settings.appName}`
+    return `Confirm email - ${settings.appName}`
   },
   title() {
-    return 'Confirm Email'
+    return 'Confirm email'
   },
   message(opts) {
     return [
@@ -239,7 +239,7 @@ templates.confirmEmail = ctaTemplate({
     ]
   },
   ctaText() {
-    return 'Confirm Email'
+    return 'Confirm email'
   },
   ctaURL(opts) {
     return opts.confirmEmailUrl
@@ -861,7 +861,7 @@ templates.SAMLDataCleared = ctaTemplate({
     ]
   },
   ctaText(opts) {
-    return 'Update my Emails and Affiliations'
+    return 'Update my Emails and affiliations'
   },
   ctaURL(opts) {
     return `${settings.siteUrl}/user/settings`
@@ -907,7 +907,7 @@ templates.welcome = ctaTemplate({
     ]
   },
   ctaText() {
-    return 'Confirm Email'
+    return 'Confirm email'
   },
   ctaURL(opts) {
     return opts.confirmEmailUrl
@@ -949,6 +949,33 @@ templates.welcomeWithoutCTA = NoCTAEmailTemplate({
   },
 })
 
+templates.removeGroupMember = NoCTAEmailTemplate({
+  subject(opts) {
+    return `Your ${settings.appName} account has been removed from ${opts.adminName}’s group`
+  },
+  title(opts) {
+    return `Your ${settings.appName} account has been removed from ${opts.adminName}’s group`
+  },
+  greeting() {
+    return ''
+  },
+  message() {
+    const passwordResetUrl = `${settings.siteUrl}/user/password/reset`
+
+    return [
+      'Don’t worry, your account and projects are still accessible. But there are a few changes to be aware of:',
+      '<ul>' +
+        `<li>Your account will have reverted to a free ${settings.appName} plan.</li>`,
+      `<li>Any project collaborators have been set to read-only (you can invite one collaborator per project on the free plan).</li>`,
+      `<li>If you previously logged in via SSO, you’ll need to <a href="${passwordResetUrl}">set a password</a> to access your account.</li>` +
+        '</ul>',
+      `If you think this has been done in error, please contact your group admin.`,
+      `Thanks!`,
+      `Team ${settings.appName}`,
+    ]
+  },
+})
+
 function _formatUserNameAndEmail(user, placeholder) {
   if (user.first_name && user.last_name) {
     const fullName = `${user.first_name} ${user.last_name}`
diff --git a/services/web/app/src/Features/Email/EmailSender.js b/services/web/app/src/Features/Email/EmailSender.js
index c11369cb93..bb9374c2bb 100644
--- a/services/web/app/src/Features/Email/EmailSender.js
+++ b/services/web/app/src/Features/Email/EmailSender.js
@@ -48,6 +48,7 @@ function getClient() {
         'secure',
         'auth',
         'ignoreTLS',
+        'tls',
         'logger',
         'name'
       )
diff --git a/services/web/app/src/Features/Errors/Errors.js b/services/web/app/src/Features/Errors/Errors.js
index 8a21b6042a..487b8cbd03 100644
--- a/services/web/app/src/Features/Errors/Errors.js
+++ b/services/web/app/src/Features/Errors/Errors.js
@@ -41,10 +41,14 @@ class ServiceNotConfiguredError extends BackwardCompatibleError {}
 
 class TooManyRequestsError extends BackwardCompatibleError {}
 
+class ResourceGoneError extends BackwardCompatibleError {}
+
 class DuplicateNameError extends OError {}
 
 class InvalidNameError extends BackwardCompatibleError {}
 
+class IndeterminateInvoiceError extends OError {}
+
 class UnsupportedFileTypeError extends BackwardCompatibleError {}
 
 class FileTooLargeError extends BackwardCompatibleError {}
@@ -300,6 +304,18 @@ class NonDeletableEntityError extends OError {
   }
 }
 
+class FoundConnectedClientsError extends OError {
+  constructor(nConnectedClients) {
+    super(`found ${nConnectedClients} remaining connected clients`)
+  }
+}
+
+class ConcurrentLoadingOfDocsDetectedError extends OError {
+  constructor() {
+    super('concurrent loading of docs detected')
+  }
+}
+
 module.exports = {
   OError,
   BackwardCompatibleError,
@@ -307,6 +323,7 @@ module.exports = {
   ForbiddenError,
   ServiceNotConfiguredError,
   TooManyRequestsError,
+  ResourceGoneError,
   DuplicateNameError,
   InvalidNameError,
   UnsupportedFileTypeError,
@@ -318,6 +335,7 @@ module.exports = {
   UnconfirmedEmailError,
   EmailExistsError,
   InvalidError,
+  IndeterminateInvoiceError,
   NotInV2Error,
   OutputFileFetchFailedError,
   SAMLAssertionAudienceMismatch,
@@ -356,4 +374,6 @@ module.exports = {
   InvalidEmailError,
   InvalidInstitutionalEmailError,
   NonDeletableEntityError,
+  FoundConnectedClientsError,
+  ConcurrentLoadingOfDocsDetectedError,
 }
diff --git a/services/web/app/src/Features/Errors/HttpErrorHandler.js b/services/web/app/src/Features/Errors/HttpErrorHandler.js
index c3fab886fa..0908a1b3e2 100644
--- a/services/web/app/src/Features/Errors/HttpErrorHandler.js
+++ b/services/web/app/src/Features/Errors/HttpErrorHandler.js
@@ -146,7 +146,7 @@ module.exports = HttpErrorHandler = {
     }
     let message = `${Settings.appName} is currently down for maintenance.`
     if (Settings.statusPageUrl) {
-      message += ` Please check https://${Settings.statusPageUrl} for updates.`
+      message += ` Please check ${Settings.statusPageUrl} for updates.`
     }
     switch (req.accepts(['html', 'json'])) {
       case 'html':
diff --git a/services/web/app/src/Features/Helpers/AuthorizationHelper.js b/services/web/app/src/Features/Helpers/AuthorizationHelper.js
index f193398b87..8369f2d321 100644
--- a/services/web/app/src/Features/Helpers/AuthorizationHelper.js
+++ b/services/web/app/src/Features/Helpers/AuthorizationHelper.js
@@ -1,14 +1,7 @@
 const { UserSchema } = require('../../models/User')
-const SplitTestHandler = require('../SplitTests/SplitTestHandler')
-const ProjectGetter = require('../Project/ProjectGetter')
-const { callbackify } = require('@overleaf/promise-utils')
 
 module.exports = {
   hasAnyStaffAccess,
-  isReviewerRoleEnabled: callbackify(isReviewerRoleEnabled),
-  promises: {
-    isReviewerRoleEnabled,
-  },
 }
 
 function hasAnyStaffAccess(user) {
@@ -21,24 +14,3 @@ function hasAnyStaffAccess(user) {
   }
   return false
 }
-
-async function isReviewerRoleEnabled(projectId) {
-  const project = await ProjectGetter.promises.getProject(projectId, {
-    reviewer_refs: 1,
-    owner_ref: 1,
-  })
-
-  // if there are reviewers, it means the role is enabled
-  if (Object.keys(project.reviewer_refs || {}).length > 0) {
-    return true
-  }
-
-  // if there are no reviewers, check split test from project owner
-  const reviewerRoleAssigment =
-    await SplitTestHandler.promises.getAssignmentForUser(
-      project.owner_ref,
-      'reviewer-role'
-    )
-
-  return reviewerRoleAssigment.variant === 'enabled'
-}
diff --git a/services/web/app/src/Features/Helpers/UrlHelper.js b/services/web/app/src/Features/Helpers/UrlHelper.js
index cf686636b8..1c70e792f0 100644
--- a/services/web/app/src/Features/Helpers/UrlHelper.js
+++ b/services/web/app/src/Features/Helpers/UrlHelper.js
@@ -32,14 +32,6 @@ module.exports = {
   getCanonicalURL,
   getSafeRedirectPath,
   getSafeAdminDomainRedirect,
-  wrapUrlWithProxy(url) {
-    // TODO: Consider what to do for Community and Enterprise edition?
-    if (!Settings.apis.linkedUrlProxy.url) {
-      throw new Error('no linked url proxy configured')
-    }
-    return `${Settings.apis.linkedUrlProxy.url}?url=${encodeURIComponent(url)}`
-  },
-
   prependHttpIfNeeded(url) {
     if (!url.match('://')) {
       url = `http://${url}`
diff --git a/services/web/app/src/Features/History/HistoryController.js b/services/web/app/src/Features/History/HistoryController.js
index f6ca483dce..be2a44c39e 100644
--- a/services/web/app/src/Features/History/HistoryController.js
+++ b/services/web/app/src/Features/History/HistoryController.js
@@ -1,8 +1,17 @@
-let HistoryController
+// @ts-check
+
+const { setTimeout } = require('timers/promises')
+const { pipeline } = require('stream/promises')
 const OError = require('@overleaf/o-error')
-const async = require('async')
 const logger = require('@overleaf/logger')
-const request = require('request')
+const { expressify } = require('@overleaf/promise-utils')
+const {
+  fetchStream,
+  fetchStreamWithResponse,
+  fetchJson,
+  fetchNothing,
+  RequestFailedError,
+} = require('@overleaf/fetch-utils')
 const settings = require('@overleaf/settings')
 const SessionManager = require('../Authentication/SessionManager')
 const UserGetter = require('../User/UserGetter')
@@ -12,11 +21,8 @@ const HistoryManager = require('./HistoryManager')
 const ProjectDetailsHandler = require('../Project/ProjectDetailsHandler')
 const ProjectEntityUpdateHandler = require('../Project/ProjectEntityUpdateHandler')
 const RestoreManager = require('./RestoreManager')
-const { pipeline } = require('stream')
-const Stream = require('stream')
 const { prepareZipAttachment } = require('../../infrastructure/Response')
 const Features = require('../../infrastructure/Features')
-const { expressify } = require('@overleaf/promise-utils')
 
 // Number of seconds after which the browser should send a request to revalidate
 // blobs
@@ -26,6 +32,8 @@ const REVALIDATE_BLOB_AFTER_SECONDS = 86400 // 1 day
 // revalidating
 const STALE_WHILE_REVALIDATE_SECONDS = 365 * 86400 // 1 year
 
+const MAX_HISTORY_ZIP_ATTEMPTS = 40
+
 async function getBlob(req, res) {
   await requestBlob('GET', req, res)
 }
@@ -44,9 +52,9 @@ async function requestBlob(method, req, res) {
   }
 
   const range = req.get('Range')
-  let url, stream, source, contentLength
+  let stream, source, contentLength
   try {
-    ;({ url, stream, source, contentLength } =
+    ;({ stream, source, contentLength } =
       await HistoryManager.promises.requestBlobWithFallback(
         projectId,
         hash,
@@ -65,14 +73,13 @@ async function requestBlob(method, req, res) {
   setBlobCacheHeaders(res, hash)
 
   try {
-    await Stream.promises.pipeline(stream, res)
+    await pipeline(stream, res)
   } catch (err) {
     // If the downstream request is cancelled, we get an
     // ERR_STREAM_PREMATURE_CLOSE, ignore these "errors".
-    if (err?.code === 'ERR_STREAM_PREMATURE_CLOSE') return
-
-    logger.warn({ err, url, method, range }, 'streaming blob error')
-    throw err
+    if (!isPrematureClose(err)) {
+      throw err
+    }
   }
 }
 
@@ -88,492 +95,436 @@ function setBlobCacheHeaders(res, etag) {
   res.set('ETag', etag)
 }
 
-module.exports = HistoryController = {
-  getBlob: expressify(getBlob),
-  headBlob: expressify(headBlob),
+async function proxyToHistoryApi(req, res, next) {
+  const userId = SessionManager.getLoggedInUserId(req.session)
+  const url = settings.apis.project_history.url + req.url
 
-  proxyToHistoryApi(req, res, next) {
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    const url = settings.apis.project_history.url + req.url
+  const { stream, response } = await fetchStreamWithResponse(url, {
+    method: req.method,
+    headers: { 'X-User-Id': userId },
+  })
 
-    const getReq = request({
-      url,
-      method: req.method,
-      headers: {
-        'X-User-Id': userId,
-      },
-    })
-    pipeline(getReq, res, function (err) {
+  const contentType = response.headers.get('Content-Type')
+  const contentLength = response.headers.get('Content-Length')
+  if (contentType != null) {
+    res.set('Content-Type', contentType)
+  }
+  if (contentLength != null) {
+    res.set('Content-Length', contentLength)
+  }
+
+  try {
+    await pipeline(stream, res)
+  } catch (err) {
+    // If the downstream request is cancelled, we get an
+    // ERR_STREAM_PREMATURE_CLOSE.
+    if (!isPrematureClose(err)) {
+      throw err
+    }
+  }
+}
+
+async function proxyToHistoryApiAndInjectUserDetails(req, res, next) {
+  const userId = SessionManager.getLoggedInUserId(req.session)
+  const url = settings.apis.project_history.url + req.url
+  const body = await fetchJson(url, {
+    method: req.method,
+    headers: { 'X-User-Id': userId },
+  })
+  const data = await HistoryManager.promises.injectUserDetails(body)
+  res.json(data)
+}
+
+async function resyncProjectHistory(req, res, next) {
+  // increase timeout to 6 minutes
+  res.setTimeout(6 * 60 * 1000)
+  const projectId = req.params.Project_id
+  const opts = {}
+  const historyRangesMigration = req.body.historyRangesMigration
+  if (historyRangesMigration) {
+    opts.historyRangesMigration = historyRangesMigration
+  }
+  if (req.body.resyncProjectStructureOnly) {
+    opts.resyncProjectStructureOnly = req.body.resyncProjectStructureOnly
+  }
+
+  try {
+    await ProjectEntityUpdateHandler.promises.resyncProjectHistory(
+      projectId,
+      opts
+    )
+  } catch (err) {
+    if (err instanceof Errors.ProjectHistoryDisabledError) {
+      return res.sendStatus(404)
+    } else {
+      throw err
+    }
+  }
+
+  res.sendStatus(204)
+}
+
+async function restoreFileFromV2(req, res, next) {
+  const { project_id: projectId } = req.params
+  const { version, pathname } = req.body
+  const userId = SessionManager.getLoggedInUserId(req.session)
+
+  const entity = await RestoreManager.promises.restoreFileFromV2(
+    userId,
+    projectId,
+    version,
+    pathname
+  )
+
+  res.json({
+    type: entity.type,
+    id: entity._id,
+  })
+}
+
+async function revertFile(req, res, next) {
+  const { project_id: projectId } = req.params
+  const { version, pathname } = req.body
+  const userId = SessionManager.getLoggedInUserId(req.session)
+
+  const entity = await RestoreManager.promises.revertFile(
+    userId,
+    projectId,
+    version,
+    pathname,
+    {}
+  )
+
+  res.json({
+    type: entity.type,
+    id: entity._id,
+  })
+}
+
+async function revertProject(req, res, next) {
+  const { project_id: projectId } = req.params
+  const { version } = req.body
+  const userId = SessionManager.getLoggedInUserId(req.session)
+
+  await RestoreManager.promises.revertProject(userId, projectId, version)
+
+  res.sendStatus(200)
+}
+
+async function getLabels(req, res, next) {
+  const projectId = req.params.Project_id
+
+  let labels = await fetchJson(
+    `${settings.apis.project_history.url}/project/${projectId}/labels`
+  )
+  labels = await _enrichLabels(labels)
+
+  res.json(labels)
+}
+
+async function createLabel(req, res, next) {
+  const projectId = req.params.Project_id
+  const { comment, version } = req.body
+  const userId = SessionManager.getLoggedInUserId(req.session)
+
+  let label = await fetchJson(
+    `${settings.apis.project_history.url}/project/${projectId}/labels`,
+    {
+      method: 'POST',
+      json: { comment, version, user_id: userId },
+    }
+  )
+  label = await _enrichLabel(label)
+
+  res.json(label)
+}
+
+async function _enrichLabel(label) {
+  const newLabel = Object.assign({}, label)
+  if (!label.user_id) {
+    newLabel.user_display_name = _displayNameForUser(null)
+    return newLabel
+  }
+
+  const user = await UserGetter.promises.getUser(label.user_id, {
+    first_name: 1,
+    last_name: 1,
+    email: 1,
+  })
+  newLabel.user_display_name = _displayNameForUser(user)
+  return newLabel
+}
+
+async function _enrichLabels(labels) {
+  if (!labels || !labels.length) {
+    return []
+  }
+  const uniqueUsers = new Set(labels.map(label => label.user_id))
+
+  // For backwards compatibility, and for anonymously created labels in SP
+  // expect missing user_id fields
+  uniqueUsers.delete(undefined)
+
+  if (!uniqueUsers.size) {
+    return labels
+  }
+
+  const rawUsers = await UserGetter.promises.getUsers(Array.from(uniqueUsers), {
+    first_name: 1,
+    last_name: 1,
+    email: 1,
+  })
+  const users = new Map(rawUsers.map(user => [String(user._id), user]))
+
+  labels.forEach(label => {
+    const user = users.get(label.user_id)
+    label.user_display_name = _displayNameForUser(user)
+  })
+  return labels
+}
+
+function _displayNameForUser(user) {
+  if (user == null) {
+    return 'Anonymous'
+  }
+  if (user.name) {
+    return user.name
+  }
+  let name = [user.first_name, user.last_name]
+    .filter(n => n != null)
+    .join(' ')
+    .trim()
+  if (name === '') {
+    name = user.email.split('@')[0]
+  }
+  if (!name) {
+    return '?'
+  }
+  return name
+}
+
+async function deleteLabel(req, res, next) {
+  const { Project_id: projectId, label_id: labelId } = req.params
+  const userId = SessionManager.getLoggedInUserId(req.session)
+
+  const project = await ProjectGetter.promises.getProject(projectId, {
+    owner_ref: true,
+  })
+
+  // If the current user is the project owner, we can use the non-user-specific
+  // delete label endpoint. Otherwise, we have to use the user-specific version
+  // (which only deletes the label if it is owned by the user)
+  const deleteEndpointUrl = project.owner_ref.equals(userId)
+    ? `${settings.apis.project_history.url}/project/${projectId}/labels/${labelId}`
+    : `${settings.apis.project_history.url}/project/${projectId}/user/${userId}/labels/${labelId}`
+
+  await fetchNothing(deleteEndpointUrl, {
+    method: 'DELETE',
+  })
+  res.sendStatus(204)
+}
+
+async function downloadZipOfVersion(req, res, next) {
+  const { project_id: projectId, version } = req.params
+
+  const project = await ProjectDetailsHandler.promises.getDetails(projectId)
+  const v1Id =
+    project.overleaf && project.overleaf.history && project.overleaf.history.id
+
+  if (v1Id == null) {
+    logger.error(
+      { projectId, version },
+      'got request for zip version of non-v1 history project'
+    )
+    return res.sendStatus(402)
+  }
+
+  await _pipeHistoryZipToResponse(
+    v1Id,
+    version,
+    `${project.name} (Version ${version})`,
+    req,
+    res
+  )
+}
+
+async function _pipeHistoryZipToResponse(v1ProjectId, version, name, req, res) {
+  if (req.destroyed) {
+    // client has disconnected -- skip project history api call and download
+    return
+  }
+  // increase timeout to 6 minutes
+  res.setTimeout(6 * 60 * 1000)
+  const url = `${settings.apis.v1_history.url}/projects/${v1ProjectId}/version/${version}/zip`
+  const basicAuth = {
+    user: settings.apis.v1_history.user,
+    password: settings.apis.v1_history.pass,
+  }
+
+  if (!Features.hasFeature('saas')) {
+    let stream
+    try {
+      stream = await fetchStream(url, { basicAuth })
+    } catch (err) {
+      if (err instanceof RequestFailedError && err.response.status === 404) {
+        return res.sendStatus(404)
+      } else {
+        throw err
+      }
+    }
+
+    prepareZipAttachment(res, `${name}.zip`)
+
+    try {
+      await pipeline(stream, res)
+    } catch (err) {
       // If the downstream request is cancelled, we get an
       // ERR_STREAM_PREMATURE_CLOSE.
-      if (err && err.code !== 'ERR_STREAM_PREMATURE_CLOSE') {
-        logger.warn({ url, err }, 'history API error')
-        next(err)
+      if (!isPrematureClose(err)) {
+        throw err
       }
+    }
+    return
+  }
+
+  let body
+  try {
+    body = await fetchJson(url, { method: 'POST', basicAuth })
+  } catch (err) {
+    if (err instanceof RequestFailedError && err.response.status === 404) {
+      throw new Errors.NotFoundError('zip not found')
+    } else {
+      throw err
+    }
+  }
+
+  if (req.destroyed) {
+    // client has disconnected -- skip delayed s3 download
+    return
+  }
+
+  if (!body.zipUrl) {
+    throw new OError('Missing zipUrl, cannot fetch zip file', {
+      v1ProjectId,
+      body,
     })
-  },
+  }
 
-  proxyToHistoryApiAndInjectUserDetails(req, res, next) {
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    const url = settings.apis.project_history.url + req.url
-    HistoryController._makeRequest(
-      {
-        url,
-        method: req.method,
-        json: true,
-        headers: {
-          'X-User-Id': userId,
-        },
-      },
-      function (err, body) {
-        if (err) {
-          return next(err)
-        }
-        HistoryManager.injectUserDetails(body, function (err, data) {
-          if (err) {
-            return next(err)
-          }
-          res.json(data)
-        })
-      }
-    )
-  },
+  // retry for about 6 minutes starting with short delay
+  let retryDelay = 2000
+  let attempt = 0
+  while (true) {
+    attempt += 1
+    await setTimeout(retryDelay)
 
-  resyncProjectHistory(req, res, next) {
-    // increase timeout to 6 minutes
-    res.setTimeout(6 * 60 * 1000)
-    const projectId = req.params.Project_id
-    const opts = {}
-    const historyRangesMigration = req.body.historyRangesMigration
-    if (historyRangesMigration) {
-      opts.historyRangesMigration = historyRangesMigration
-    }
-    if (req.body.resyncProjectStructureOnly) {
-      opts.resyncProjectStructureOnly = req.body.resyncProjectStructureOnly
-    }
-    ProjectEntityUpdateHandler.resyncProjectHistory(
-      projectId,
-      opts,
-      function (err) {
-        if (err instanceof Errors.ProjectHistoryDisabledError) {
-          return res.sendStatus(404)
-        }
-        if (err) {
-          return next(err)
-        }
-        res.sendStatus(204)
-      }
-    )
-  },
-
-  restoreFileFromV2(req, res, next) {
-    const { project_id: projectId } = req.params
-    const { version, pathname } = req.body
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    RestoreManager.restoreFileFromV2(
-      userId,
-      projectId,
-      version,
-      pathname,
-      function (err, entity) {
-        if (err) {
-          return next(err)
-        }
-        res.json({
-          type: entity.type,
-          id: entity._id,
-        })
-      }
-    )
-  },
-
-  revertFile(req, res, next) {
-    const { project_id: projectId } = req.params
-    const { version, pathname } = req.body
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    RestoreManager.revertFile(
-      userId,
-      projectId,
-      version,
-      pathname,
-      {},
-      function (err, entity) {
-        if (err) {
-          return next(err)
-        }
-        res.json({
-          type: entity.type,
-          id: entity._id,
-        })
-      }
-    )
-  },
-
-  revertProject(req, res, next) {
-    const { project_id: projectId } = req.params
-    const { version } = req.body
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    RestoreManager.revertProject(userId, projectId, version, function (err) {
-      if (err) {
-        return next(err)
-      }
-      res.sendStatus(200)
-    })
-  },
-
-  getLabels(req, res, next) {
-    const projectId = req.params.Project_id
-    HistoryController._makeRequest(
-      {
-        method: 'GET',
-        url: `${settings.apis.project_history.url}/project/${projectId}/labels`,
-        json: true,
-      },
-      function (err, labels) {
-        if (err) {
-          return next(err)
-        }
-        HistoryController._enrichLabels(labels, (err, labels) => {
-          if (err) {
-            return next(err)
-          }
-          res.json(labels)
-        })
-      }
-    )
-  },
-
-  createLabel(req, res, next) {
-    const projectId = req.params.Project_id
-    const { comment, version } = req.body
-    const userId = SessionManager.getLoggedInUserId(req.session)
-    HistoryController._makeRequest(
-      {
-        method: 'POST',
-        url: `${settings.apis.project_history.url}/project/${projectId}/labels`,
-        json: { comment, version, user_id: userId },
-      },
-      function (err, label) {
-        if (err) {
-          return next(err)
-        }
-        HistoryController._enrichLabel(label, (err, label) => {
-          if (err) {
-            return next(err)
-          }
-          res.json(label)
-        })
-      }
-    )
-  },
-
-  _enrichLabel(label, callback) {
-    if (!label.user_id) {
-      const newLabel = Object.assign({}, label)
-      newLabel.user_display_name = HistoryController._displayNameForUser(null)
-      return callback(null, newLabel)
-    }
-    UserGetter.getUser(
-      label.user_id,
-      { first_name: 1, last_name: 1, email: 1 },
-      (err, user) => {
-        if (err) {
-          return callback(err)
-        }
-        const newLabel = Object.assign({}, label)
-        newLabel.user_display_name = HistoryController._displayNameForUser(user)
-        callback(null, newLabel)
-      }
-    )
-  },
-
-  _enrichLabels(labels, callback) {
-    if (!labels || !labels.length) {
-      return callback(null, [])
-    }
-    const uniqueUsers = new Set(labels.map(label => label.user_id))
-
-    // For backwards compatibility, and for anonymously created labels in SP
-    // expect missing user_id fields
-    uniqueUsers.delete(undefined)
-
-    if (!uniqueUsers.size) {
-      return callback(null, labels)
-    }
-
-    UserGetter.getUsers(
-      Array.from(uniqueUsers),
-      { first_name: 1, last_name: 1, email: 1 },
-      function (err, rawUsers) {
-        if (err) {
-          return callback(err)
-        }
-        const users = new Map(rawUsers.map(user => [String(user._id), user]))
-
-        labels.forEach(label => {
-          const user = users.get(label.user_id)
-          label.user_display_name = HistoryController._displayNameForUser(user)
-        })
-        callback(null, labels)
-      }
-    )
-  },
-
-  _displayNameForUser(user) {
-    if (user == null) {
-      return 'Anonymous'
-    }
-    if (user.name) {
-      return user.name
-    }
-    let name = [user.first_name, user.last_name]
-      .filter(n => n != null)
-      .join(' ')
-      .trim()
-    if (name === '') {
-      name = user.email.split('@')[0]
-    }
-    if (!name) {
-      return '?'
-    }
-    return name
-  },
-
-  deleteLabel(req, res, next) {
-    const { Project_id: projectId, label_id: labelId } = req.params
-    const userId = SessionManager.getLoggedInUserId(req.session)
-
-    ProjectGetter.getProject(
-      projectId,
-      {
-        owner_ref: true,
-      },
-      (err, project) => {
-        if (err) {
-          return next(err)
-        }
-
-        // If the current user is the project owner, we can use the non-user-specific delete label endpoint.
-        // Otherwise, we have to use the user-specific version (which only deletes the label if it is owned by the user)
-        const deleteEndpointUrl = project.owner_ref.equals(userId)
-          ? `${settings.apis.project_history.url}/project/${projectId}/labels/${labelId}`
-          : `${settings.apis.project_history.url}/project/${projectId}/user/${userId}/labels/${labelId}`
-
-        HistoryController._makeRequest(
-          {
-            method: 'DELETE',
-            url: deleteEndpointUrl,
-          },
-          function (err) {
-            if (err) {
-              return next(err)
-            }
-            res.sendStatus(204)
-          }
-        )
-      }
-    )
-  },
-
-  _makeRequest(options, callback) {
-    return request(options, function (err, response, body) {
-      if (err) {
-        return callback(err)
-      }
-      if (response.statusCode >= 200 && response.statusCode < 300) {
-        callback(null, body)
-      } else {
-        err = new Error(
-          `history api responded with non-success code: ${response.statusCode}`
-        )
-        callback(err)
-      }
-    })
-  },
-
-  downloadZipOfVersion(req, res, next) {
-    const { project_id: projectId, version } = req.params
-    ProjectDetailsHandler.getDetails(projectId, function (err, project) {
-      if (err) {
-        return next(err)
-      }
-      const v1Id =
-        project.overleaf &&
-        project.overleaf.history &&
-        project.overleaf.history.id
-      if (v1Id == null) {
-        logger.error(
-          { projectId, version },
-          'got request for zip version of non-v1 history project'
-        )
-        return res.sendStatus(402)
-      }
-      HistoryController._pipeHistoryZipToResponse(
-        v1Id,
-        version,
-        `${project.name} (Version ${version})`,
-        req,
-        res,
-        next
-      )
-    })
-  },
-
-  _pipeHistoryZipToResponse(v1ProjectId, version, name, req, res, next) {
     if (req.destroyed) {
-      // client has disconnected -- skip project history api call and download
-      return
-    }
-    // increase timeout to 6 minutes
-    res.setTimeout(6 * 60 * 1000)
-    const url = `${settings.apis.v1_history.url}/projects/${v1ProjectId}/version/${version}/zip`
-    const options = {
-      auth: {
-        user: settings.apis.v1_history.user,
-        pass: settings.apis.v1_history.pass,
-      },
-      json: true,
-      url,
-    }
-
-    if (!Features.hasFeature('saas')) {
-      const getReq = request({ ...options, method: 'get' })
-
-      getReq.on('error', function (err) {
-        logger.warn({ err, v1ProjectId, version }, 'history zip download error')
-        res.sendStatus(500)
-      })
-      getReq.on('response', function (response) {
-        const statusCode = response.statusCode
-        if (statusCode !== 200) {
-          logger.warn(
-            { v1ProjectId, version, statusCode },
-            'history zip download failed'
-          )
-          if (statusCode === 404) {
-            res.sendStatus(404)
-          } else {
-            res.sendStatus(500)
-          }
-          return
-        }
-
-        prepareZipAttachment(res, `${name}.zip`)
-        pipeline(response, res, function (err) {
-          // If the downstream request is cancelled, we get an
-          // ERR_STREAM_PREMATURE_CLOSE.
-          if (err && err.code !== 'ERR_STREAM_PREMATURE_CLOSE') {
-            logger.error({ err, v1ProjectId, version }, 'history API error')
-            next(err)
-          }
-        })
-      })
+      // client has disconnected -- skip s3 download
       return
     }
 
-    request({ ...options, method: 'post' }, function (err, response, body) {
-      if (err) {
-        OError.tag(err, 'history API error', {
-          v1ProjectId,
-          version,
-        })
-        return next(err)
+    // increase delay by 1 second up to 10
+    if (retryDelay < 10000) {
+      retryDelay += 1000
+    }
+
+    try {
+      const stream = await fetchStream(body.zipUrl)
+      prepareZipAttachment(res, `${name}.zip`)
+      await pipeline(stream, res)
+    } catch (err) {
+      if (attempt > MAX_HISTORY_ZIP_ATTEMPTS) {
+        throw err
       }
-      if (response.statusCode !== 200) {
-        if (response.statusCode === 404) {
-          return next(new Errors.NotFoundError('zip not found'))
-        } else {
-          return next(
-            new OError('Error while getting zip for download', {
-              v1ProjectId,
-              statusCode: response.statusCode,
-            })
-          )
-        }
-      }
-      if (req.destroyed) {
-        // client has disconnected -- skip delayed s3 download
-        return
-      }
-      if (!body.zipUrl) {
-        return next(
-          new OError('Missing zipUrl, cannot fetch zip file', {
-            v1ProjectId,
-            body,
-            statusCode: response.statusCode,
-          })
+
+      if (err instanceof RequestFailedError && err.response.status === 404) {
+        // File not ready yet. Retry.
+        continue
+      } else if (isPrematureClose(err)) {
+        // Downstream request cancelled. Retry.
+        continue
+      } else {
+        // Unknown error. Log and retry.
+        logger.warn(
+          { err, v1ProjectId, version, retryAttempt: attempt },
+          'history s3 proxying error'
         )
+        continue
       }
-      let retryAttempt = 0
-      let retryDelay = 2000
-      // retry for about 6 minutes starting with short delay
-      async.retry(
-        40,
-        callback =>
-          setTimeout(function () {
-            if (req.destroyed) {
-              // client has disconnected -- skip s3 download
-              return callback() // stop async.retry loop
-            }
+    }
 
-            // increase delay by 1 second up to 10
-            if (retryDelay < 10000) {
-              retryDelay += 1000
-            }
-            retryAttempt++
-            const getReq = request({
-              url: body.zipUrl,
-              sendImmediately: true,
-            })
-            const abortS3Request = () => getReq.abort()
-            req.on('close', abortS3Request)
-            res.on('timeout', abortS3Request)
-            function cleanupAbortTrigger() {
-              req.off('close', abortS3Request)
-              res.off('timeout', abortS3Request)
-            }
-            getReq.on('response', function (response) {
-              if (response.statusCode !== 200) {
-                cleanupAbortTrigger()
-                return callback(new Error('invalid response'))
-              }
-              // pipe also proxies the headers, but we want to customize these ones
-              delete response.headers['content-disposition']
-              delete response.headers['content-type']
-              res.status(response.statusCode)
-              prepareZipAttachment(res, `${name}.zip`)
-              pipeline(response, res, err => {
-                // If the downstream request is cancelled, we get an
-                // ERR_STREAM_PREMATURE_CLOSE.
-                if (err && err.code !== 'ERR_STREAM_PREMATURE_CLOSE') {
-                  logger.warn(
-                    { err, v1ProjectId, version, retryAttempt },
-                    'history s3 proxying error'
-                  )
-                }
-              })
-              callback()
-            })
-            getReq.on('error', function (err) {
-              logger.warn(
-                { err, v1ProjectId, version, retryAttempt },
-                'history s3 download error'
-              )
-              cleanupAbortTrigger()
-              callback(err)
-            })
-          }, retryDelay),
-        function (err) {
-          if (err) {
-            OError.tag(err, 'history s3 download failed', {
-              v1ProjectId,
-              version,
-              retryAttempt,
-            })
-            next(err)
-          }
-        }
-      )
+    // We made it through. No need to retry anymore. Exit loop
+    break
+  }
+}
+
+async function getLatestHistory(req, res, next) {
+  const projectId = req.params.project_id
+  const history = await HistoryManager.promises.getLatestHistory(projectId)
+  res.json(history)
+}
+
+async function getChanges(req, res, next) {
+  const projectId = req.params.project_id
+  let since = req.query.since
+  // TODO: Transition flag; remove after a while
+  const paginated = req.query.paginated === 'true'
+
+  if (paginated) {
+    const changes = await HistoryManager.promises.getChanges(projectId, {
+      since,
     })
+    return res.json(changes)
+  } else {
+    // TODO: Remove this code path after a while
+    let hasMore = true
+    const allChanges = []
+    while (hasMore) {
+      const response = await HistoryManager.promises.getChanges(projectId, {
+        since,
+      })
+
+      let changes
+      if (Array.isArray(response)) {
+        changes = response
+        hasMore = false
+      } else {
+        changes = response.changes
+        hasMore = response.hasMore
+        since += changes.length
+      }
+      allChanges.push(...changes)
+    }
+    return res.json(allChanges)
+  }
+}
+
+function isPrematureClose(err) {
+  return (
+    err instanceof Error &&
+    'code' in err &&
+    err.code === 'ERR_STREAM_PREMATURE_CLOSE'
+  )
+}
+
+module.exports = {
+  getBlob: expressify(getBlob),
+  headBlob: expressify(headBlob),
+  proxyToHistoryApi: expressify(proxyToHistoryApi),
+  proxyToHistoryApiAndInjectUserDetails: expressify(
+    proxyToHistoryApiAndInjectUserDetails
+  ),
+  resyncProjectHistory: expressify(resyncProjectHistory),
+  restoreFileFromV2: expressify(restoreFileFromV2),
+  revertFile: expressify(revertFile),
+  revertProject: expressify(revertProject),
+  getLabels: expressify(getLabels),
+  createLabel: expressify(createLabel),
+  deleteLabel: expressify(deleteLabel),
+  downloadZipOfVersion: expressify(downloadZipOfVersion),
+  getLatestHistory: expressify(getLatestHistory),
+  getChanges: expressify(getChanges),
+  _displayNameForUser,
+  promises: {
+    _pipeHistoryZipToResponse,
   },
 }
diff --git a/services/web/app/src/Features/History/HistoryManager.js b/services/web/app/src/Features/History/HistoryManager.js
index 78730c4782..42d7e229bf 100644
--- a/services/web/app/src/Features/History/HistoryManager.js
+++ b/services/web/app/src/Features/History/HistoryManager.js
@@ -11,7 +11,7 @@ const OError = require('@overleaf/o-error')
 const UserGetter = require('../User/UserGetter')
 const ProjectGetter = require('../Project/ProjectGetter')
 const HistoryBackupDeletionHandler = require('./HistoryBackupDeletionHandler')
-const { db, ObjectId } = require('../../infrastructure/mongodb')
+const { db, ObjectId, waitForDb } = require('../../infrastructure/mongodb')
 const Metrics = require('@overleaf/metrics')
 const logger = require('@overleaf/logger')
 const { NotFoundError } = require('../Errors/Errors')
@@ -21,6 +21,12 @@ const projectKey = require('./project_key')
 
 const GLOBAL_BLOBS = new Set() // CHANGE FROM SOURCE: only store hashes.
 
+const HISTORY_V1_URL = settings.apis.v1_history.url
+const HISTORY_V1_BASIC_AUTH = {
+  user: settings.apis.v1_history.user,
+  password: settings.apis.v1_history.pass,
+}
+
 function makeGlobalKey(hash) {
   return `${hash.slice(0, 2)}/${hash.slice(2, 4)}/${hash.slice(4)}`
 }
@@ -44,6 +50,7 @@ function getBlobLocation(projectId, hash) {
 }
 
 async function loadGlobalBlobs() {
+  await waitForDb() // CHANGE FROM SOURCE: wait for db before running query.
   const blobs = db.projectHistoryGlobalBlobs.find()
   for await (const blob of blobs) {
     GLOBAL_BLOBS.add(blob._id) // CHANGE FROM SOURCE: only store hashes.
@@ -144,16 +151,10 @@ async function _deleteProjectInProjectHistory(projectId) {
 
 async function _deleteProjectInFullProjectHistory(historyId) {
   try {
-    await fetchNothing(
-      `${settings.apis.v1_history.url}/projects/${historyId}`,
-      {
-        method: 'DELETE',
-        basicAuth: {
-          user: settings.apis.v1_history.user,
-          password: settings.apis.v1_history.pass,
-        },
-      }
-    )
+    await fetchNothing(`${HISTORY_V1_URL}/projects/${historyId}`, {
+      method: 'DELETE',
+      basicAuth: HISTORY_V1_BASIC_AUTH,
+    })
   } catch (err) {
     throw OError.tag(err, 'failed to clear project history', { historyId })
   }
@@ -162,29 +163,23 @@ async function _deleteProjectInFullProjectHistory(historyId) {
 async function uploadBlobFromDisk(historyId, hash, byteLength, fsPath) {
   const outStream = fs.createReadStream(fsPath)
 
-  const url = `${settings.apis.v1_history.url}/projects/${historyId}/blobs/${hash}`
+  const url = `${HISTORY_V1_URL}/projects/${historyId}/blobs/${hash}`
   await fetchNothing(url, {
     method: 'PUT',
     body: outStream,
     headers: { 'Content-Length': byteLength }, // add the content length to work around problems with chunked encoding in node 18
     signal: AbortSignal.timeout(60 * 1000),
-    basicAuth: {
-      user: settings.apis.v1_history.user,
-      password: settings.apis.v1_history.pass,
-    },
+    basicAuth: HISTORY_V1_BASIC_AUTH,
   })
 }
 
 async function copyBlob(sourceHistoryId, targetHistoryId, hash) {
-  const url = `${settings.apis.v1_history.url}/projects/${targetHistoryId}/blobs/${hash}`
+  const url = `${HISTORY_V1_URL}/projects/${targetHistoryId}/blobs/${hash}`
   await fetchNothing(
     `${url}?${new URLSearchParams({ copyFrom: sourceHistoryId })}`,
     {
       method: 'POST',
-      basicAuth: {
-        user: settings.apis.v1_history.user,
-        password: settings.apis.v1_history.pass,
-      },
+      basicAuth: HISTORY_V1_BASIC_AUTH,
     }
   )
 }
@@ -200,7 +195,7 @@ async function requestBlobWithFallback(
     'overleaf.history.id': true,
   })
   // Talk to history-v1 directly to avoid streaming via project-history.
-  let url = new URL(settings.apis.v1_history.url)
+  let url = new URL(HISTORY_V1_URL)
   url.pathname += `/projects/${project.overleaf.history.id}/blobs/${hash}`
 
   const opts = { method, headers: { Range: range } }
@@ -255,22 +250,14 @@ async function requestBlobWithFallback(
  * @returns Promise<object>
  */
 async function getCurrentContent(projectId) {
-  const project = await ProjectGetter.promises.getProject(projectId, {
-    overleaf: true,
-  })
-  const historyId = project?.overleaf?.history?.id
-  if (!historyId) {
-    throw new OError('project does not have a history id', { projectId })
-  }
+  const historyId = await getHistoryId(projectId)
+
   try {
     return await fetchJson(
-      `${settings.apis.v1_history.url}/projects/${historyId}/latest/content`,
+      `${HISTORY_V1_URL}/projects/${historyId}/latest/content`,
       {
         method: 'GET',
-        basicAuth: {
-          user: settings.apis.v1_history.user,
-          password: settings.apis.v1_history.pass,
-        },
+        basicAuth: HISTORY_V1_BASIC_AUTH,
       }
     )
   } catch (err) {
@@ -287,22 +274,14 @@ async function getCurrentContent(projectId) {
  * @returns Promise<object>
  */
 async function getContentAtVersion(projectId, version) {
-  const project = await ProjectGetter.promises.getProject(projectId, {
-    overleaf: true,
-  })
-  const historyId = project?.overleaf?.history?.id
-  if (!historyId) {
-    throw new OError('project does not have a history id', { projectId })
-  }
+  const historyId = await getHistoryId(projectId)
+
   try {
     return await fetchJson(
-      `${settings.apis.v1_history.url}/projects/${historyId}/versions/${version}/content`,
+      `${HISTORY_V1_URL}/projects/${historyId}/versions/${version}/content`,
       {
         method: 'GET',
-        basicAuth: {
-          user: settings.apis.v1_history.user,
-          password: settings.apis.v1_history.pass,
-        },
+        basicAuth: HISTORY_V1_BASIC_AUTH,
       }
     )
   } catch (err) {
@@ -314,6 +293,53 @@ async function getContentAtVersion(projectId, version) {
   }
 }
 
+/**
+ * Get the latest chunk from history
+ *
+ * @param {string} projectId
+ */
+async function getLatestHistory(projectId) {
+  const historyId = await getHistoryId(projectId)
+
+  return await fetchJson(
+    `${HISTORY_V1_URL}/projects/${historyId}/latest/history`,
+    {
+      basicAuth: HISTORY_V1_BASIC_AUTH,
+    }
+  )
+}
+
+/**
+ * Get history changes since a given version
+ *
+ * @param {string} projectId
+ * @param {object} opts
+ * @param {number} opts.since - The start version of changes to get
+ */
+async function getChanges(projectId, opts = {}) {
+  const historyId = await getHistoryId(projectId)
+
+  const url = new URL(`${HISTORY_V1_URL}/projects/${historyId}/changes`)
+  if (opts.since) {
+    url.searchParams.set('since', opts.since)
+  }
+
+  return await fetchJson(url, {
+    basicAuth: HISTORY_V1_BASIC_AUTH,
+  })
+}
+
+async function getHistoryId(projectId) {
+  const project = await ProjectGetter.promises.getProject(projectId, {
+    overleaf: true,
+  })
+  const historyId = project?.overleaf?.history?.id
+  if (!historyId) {
+    throw new OError('project does not have a history id', { projectId })
+  }
+  return historyId
+}
+
 async function injectUserDetails(data) {
   // data can be either:
   // {
@@ -392,8 +418,11 @@ function _userView(user) {
   return { first_name: firstName, last_name: lastName, email, id: _id }
 }
 
+const loadGlobalBlobsPromise = loadGlobalBlobs()
+
 module.exports = {
   getBlobLocation,
+  loadGlobalBlobsPromise,
   initializeProject: callbackify(initializeProject),
   flushProject: callbackify(flushProject),
   resyncProject: callbackify(resyncProject),
@@ -404,8 +433,9 @@ module.exports = {
   uploadBlobFromDisk: callbackify(uploadBlobFromDisk),
   copyBlob: callbackify(copyBlob),
   requestBlobWithFallback: callbackify(requestBlobWithFallback),
+  getLatestHistory: callbackify(getLatestHistory),
+  getChanges: callbackify(getChanges),
   promises: {
-    loadGlobalBlobs,
     initializeProject,
     flushProject,
     resyncProject,
@@ -417,5 +447,7 @@ module.exports = {
     uploadBlobFromDisk,
     copyBlob,
     requestBlobWithFallback,
+    getLatestHistory,
+    getChanges,
   },
 }
diff --git a/services/web/app/src/Features/History/HistoryOTMigration.mjs b/services/web/app/src/Features/History/HistoryOTMigration.mjs
new file mode 100644
index 0000000000..a55fb3bbfd
--- /dev/null
+++ b/services/web/app/src/Features/History/HistoryOTMigration.mjs
@@ -0,0 +1,56 @@
+import ProjectGetter from '../Project/ProjectGetter.js'
+import DocumentUpdaterHandler from '../DocumentUpdater/DocumentUpdaterHandler.js'
+import HistoryManager from '../History/HistoryManager.js'
+import * as RealTimeHandler from '../References/RealTime/RealTimeHandler.mjs'
+import ProjectOptionsHandler from '../Project/ProjectOptionsHandler.js'
+import {
+  NotFoundError,
+  FoundConnectedClientsError,
+  ConcurrentLoadingOfDocsDetectedError,
+} from '../Errors/Errors.js'
+
+async function ensureNoConnectedClients(projectId) {
+  const n = await RealTimeHandler.countConnectedClients(projectId)
+  if (n > 0) throw new FoundConnectedClientsError(n)
+}
+
+/**
+ * @param {string} projectId
+ * @param {number} nextStage
+ * @return {Promise<{otMigrationStage: number}>}
+ */
+export async function advanceOTMigrationStage(projectId, nextStage) {
+  const project = await ProjectGetter.promises.getProject(projectId, {
+    overleaf: true,
+  })
+  if (!project) throw new NotFoundError()
+  const { otMigrationStage } = project?.overleaf?.history || {}
+  if (otMigrationStage >= nextStage) return { otMigrationStage }
+
+  // NOTE: For the single connected client case, we could emit a pub/sub event here asking any (inactive) client without pending edits to disconnect briefly.
+  // e.g. EditorRealTimeController.emitToRoom(projectId, 'attempt-history-ot-migration')
+
+  // Ensure we can perform the hard migration
+  await ensureNoConnectedClients(projectId)
+
+  // Flush ahead of migrating to keep the time under lock down.
+  await DocumentUpdaterHandler.promises.flushProjectToMongoAndDelete(projectId)
+  // Avoid mixing update types
+  await HistoryManager.promises.flushProject(projectId)
+
+  // Obtain lock
+  if (!(await DocumentUpdaterHandler.promises.blockProject(projectId))) {
+    throw new ConcurrentLoadingOfDocsDetectedError()
+  }
+
+  try {
+    // Perform the mongo update and tell caller about the latest stage.
+    return await ProjectOptionsHandler.promises.setOTMigrationStage(
+      projectId,
+      nextStage
+    )
+  } finally {
+    // Unlock again (The lock will expire after 30s otherwise)
+    await DocumentUpdaterHandler.promises.unblockProject(projectId)
+  }
+}
diff --git a/services/web/app/src/Features/History/HistoryRouter.mjs b/services/web/app/src/Features/History/HistoryRouter.mjs
index 5b37236166..d5c7b46804 100644
--- a/services/web/app/src/Features/History/HistoryRouter.mjs
+++ b/services/web/app/src/Features/History/HistoryRouter.mjs
@@ -151,15 +151,28 @@ function apply(webRouter, privateApiRouter) {
 
   webRouter.get(
     '/project/:project_id/latest/history',
+    validate({
+      params: Joi.object({
+        project_id: Joi.objectId().required(),
+      }),
+    }),
     AuthorizationMiddleware.blockRestrictedUserFromProject,
     AuthorizationMiddleware.ensureUserCanReadProject,
-    HistoryController.proxyToHistoryApi
+    HistoryController.getLatestHistory
   )
   webRouter.get(
     '/project/:project_id/changes',
+    validate({
+      params: Joi.object({
+        project_id: Joi.objectId().required(),
+      }),
+      query: Joi.object({
+        since: Joi.number().integer().min(0).optional(),
+      }),
+    }),
     AuthorizationMiddleware.blockRestrictedUserFromProject,
     AuthorizationMiddleware.ensureUserCanReadProject,
-    HistoryController.proxyToHistoryApi
+    HistoryController.getChanges
   )
 }
 
diff --git a/services/web/app/src/Features/History/HistoryURLHelper.js b/services/web/app/src/Features/History/HistoryURLHelper.js
index 8b8d8cbdd7..acb43ced68 100644
--- a/services/web/app/src/Features/History/HistoryURLHelper.js
+++ b/services/web/app/src/Features/History/HistoryURLHelper.js
@@ -8,7 +8,7 @@ function projectHistoryURLWithFilestoreFallback(
 ) {
   const filestoreURL = `${Settings.apis.filestore.url}/project/${projectId}/file/${fileRef._id}?from=${origin}`
   // TODO: When this file is converted to ES modules we will be able to use Features.hasFeature('project-history-blobs'). Currently we can't stub the feature return value in tests.
-  if (fileRef.hash && Settings.enableProjectHistoryBlobs) {
+  if (fileRef.hash && Settings.filestoreMigrationLevel >= 1) {
     return {
       url: `${Settings.apis.project_history.url}/project/${historyId}/blob/${fileRef.hash}`,
       fallbackURL: filestoreURL,
diff --git a/services/web/app/src/Features/History/RestoreManager.js b/services/web/app/src/Features/History/RestoreManager.js
index f36f1466af..16ef2024f6 100644
--- a/services/web/app/src/Features/History/RestoreManager.js
+++ b/services/web/app/src/Features/History/RestoreManager.js
@@ -18,6 +18,12 @@ const OError = require('@overleaf/o-error')
 const ProjectGetter = require('../Project/ProjectGetter')
 const ProjectEntityHandler = require('../Project/ProjectEntityHandler')
 
+async function getCommentThreadIds(projectId) {
+  await DocumentUpdaterHandler.promises.flushProjectToMongo(projectId)
+  const raw = await DocstoreManager.promises.getCommentThreadIds(projectId)
+  return new Map(Object.entries(raw).map(([doc, ids]) => [doc, new Set(ids)]))
+}
+
 const RestoreManager = {
   async restoreFileFromV2(userId, projectId, version, pathname) {
     const fsPath = await RestoreManager._writeFileVersionToDisk(
@@ -33,7 +39,8 @@ const RestoreManager = {
     }
     const parentFolderId = await RestoreManager._findOrCreateFolder(
       projectId,
-      dirname
+      dirname,
+      userId
     )
     const addEntityWithName = async name =>
       await FileSystemImportManager.promises.addEntity(
@@ -51,6 +58,25 @@ const RestoreManager = {
   },
 
   async revertFile(userId, projectId, version, pathname, options = {}) {
+    const threadIds = await getCommentThreadIds(projectId)
+    return await RestoreManager._revertSingleFile(
+      userId,
+      projectId,
+      version,
+      pathname,
+      threadIds,
+      options
+    )
+  },
+
+  async _revertSingleFile(
+    userId,
+    projectId,
+    version,
+    pathname,
+    threadIds,
+    options = {}
+  ) {
     const project = await ProjectGetter.promises.getProject(projectId, {
       overleaf: true,
     })
@@ -71,7 +97,8 @@ const RestoreManager = {
     }
     const parentFolderId = await RestoreManager._findOrCreateFolder(
       projectId,
-      dirname
+      dirname,
+      userId
     )
     const file = await ProjectLocator.promises
       .findElementByPath({
@@ -113,6 +140,7 @@ const RestoreManager = {
         origin,
         userId
       )
+      threadIds.delete(file.element._id.toString())
     }
 
     const { metadata } = await RestoreManager._getMetadataFromHistory(
@@ -152,22 +180,12 @@ const RestoreManager = {
     const documentCommentIds = new Set(
       ranges.comments?.map(({ op: { t } }) => t)
     )
-
-    await DocumentUpdaterHandler.promises.flushProjectToMongo(projectId)
-
-    const docsWithRanges =
-      await DocstoreManager.promises.getAllRanges(projectId)
-
-    const nonOrphanedThreadIds = new Set()
-    for (const { ranges } of docsWithRanges) {
-      for (const comment of ranges.comments ?? []) {
-        nonOrphanedThreadIds.add(comment.op.t)
+    const commentIdsToDuplicate = Array.from(documentCommentIds).filter(id => {
+      for (const ids of threadIds.values()) {
+        if (ids.has(id)) return true
       }
-    }
-
-    const commentIdsToDuplicate = Array.from(documentCommentIds).filter(id =>
-      nonOrphanedThreadIds.has(id)
-    )
+      return false
+    })
 
     const newRanges = { changes: ranges.changes, comments: [] }
 
@@ -189,6 +207,7 @@ const RestoreManager = {
             continue
           }
           // We have a new id for this comment thread
+          comment.id = result.duplicateId
           comment.op.t = result.duplicateId
         }
         newRanges.comments.push(comment)
@@ -229,8 +248,6 @@ const RestoreManager = {
         delete threadData.resolved_by_user_id
         delete threadData.resolved_at
       }
-      // remove the resolved property from the comment range as the chat service is synced at this point
-      delete commentRange.op.resolved
     }
 
     await ChatManager.promises.injectUserInfoIntoThreads(newCommentThreadData)
@@ -257,6 +274,11 @@ const RestoreManager = {
       origin,
       userId
     )
+    // For revertProject: The next doc that gets reverted will need to duplicate all the threads seen here.
+    threadIds.set(
+      _id.toString(),
+      new Set(newRanges.comments.map(({ op: { t } }) => t))
+    )
 
     return {
       _id,
@@ -264,10 +286,11 @@ const RestoreManager = {
     }
   },
 
-  async _findOrCreateFolder(projectId, dirname) {
+  async _findOrCreateFolder(projectId, dirname, userId) {
     const { lastFolder } = await EditorController.promises.mkdirp(
       projectId,
-      dirname
+      dirname,
+      userId
     )
     return lastFolder?._id
   },
@@ -318,11 +341,17 @@ const RestoreManager = {
       version,
       timestamp: new Date(updateAtVersion.meta.end_ts).toISOString(),
     }
+    const threadIds = await getCommentThreadIds(projectId)
 
     for (const pathname of pathsAtPastVersion) {
-      await RestoreManager.revertFile(userId, projectId, version, pathname, {
-        origin,
-      })
+      await RestoreManager._revertSingleFile(
+        userId,
+        projectId,
+        version,
+        pathname,
+        threadIds,
+        { origin }
+      )
     }
 
     const entitiesAtLiveVersion =
diff --git a/services/web/app/src/Features/InactiveData/InactiveProjectManager.js b/services/web/app/src/Features/InactiveData/InactiveProjectManager.js
index 818fe70c08..54bd81a500 100644
--- a/services/web/app/src/Features/InactiveData/InactiveProjectManager.js
+++ b/services/web/app/src/Features/InactiveData/InactiveProjectManager.js
@@ -11,6 +11,27 @@ const { callbackifyAll } = require('@overleaf/promise-utils')
 const Metrics = require('@overleaf/metrics')
 
 const MILISECONDS_IN_DAY = 86400000
+
+function findInactiveProjects(limit, daysOld) {
+  const oldProjectDate = new Date() - MILISECONDS_IN_DAY * daysOld
+  try {
+    // use $not $gt to catch non-opened projects where lastOpened is null
+    // return a cursor instead of executing the query
+    return Project.find({
+      lastOpened: { $not: { $gt: oldProjectDate } },
+    })
+      .where('active')
+      .equals(true)
+      .select(['_id', 'lastOpened'])
+      .limit(limit)
+      .read(READ_PREFERENCE_SECONDARY)
+      .cursor()
+  } catch (err) {
+    logger.err({ err }, 'could not get projects for deactivating')
+    throw err // Re-throw the error to be handled by the caller
+  }
+}
+
 const InactiveProjectManager = {
   async reactivateProjectIfRequired(projectId) {
     let project
@@ -53,30 +74,13 @@ const InactiveProjectManager = {
     if (daysOld == null) {
       daysOld = 360
     }
-    const oldProjectDate = new Date() - MILISECONDS_IN_DAY * daysOld
 
-    let projects
-    try {
-      // use $not $gt to catch non-opened projects where lastOpened is null
-      projects = await Project.find({
-        lastOpened: { $not: { $gt: oldProjectDate } },
-      })
-        .where('active')
-        .equals(true)
-        .select('_id')
-        .limit(limit)
-        .read(READ_PREFERENCE_SECONDARY)
-        .exec()
-    } catch (err) {
-      logger.err({ err }, 'could not get projects for deactivating')
-    }
+    logger.debug('deactivating projects')
 
-    logger.debug(
-      { numberOfProjects: projects && projects.length },
-      'deactivating projects'
-    )
+    const processedProjects = []
 
-    for (const project of projects) {
+    for await (const project of findInactiveProjects(limit, daysOld)) {
+      processedProjects.push(project)
       try {
         await InactiveProjectManager.deactivateProject(project._id)
       } catch (err) {
@@ -87,7 +91,12 @@ const InactiveProjectManager = {
       }
     }
 
-    return projects
+    logger.debug(
+      { numberOfProjects: processedProjects.length },
+      'finished deactivating projects'
+    )
+
+    return processedProjects
   },
 
   async deactivateProject(projectId) {
@@ -126,4 +135,5 @@ const InactiveProjectManager = {
 module.exports = {
   ...callbackifyAll(InactiveProjectManager),
   promises: InactiveProjectManager,
+  findInactiveProjects,
 }
diff --git a/services/web/app/src/Features/LinkedFiles/UrlAgent.mjs b/services/web/app/src/Features/LinkedFiles/UrlAgent.mjs
index 12785d7c04..3c75034b34 100644
--- a/services/web/app/src/Features/LinkedFiles/UrlAgent.mjs
+++ b/services/web/app/src/Features/LinkedFiles/UrlAgent.mjs
@@ -72,7 +72,6 @@ function _getUrl(projectId, data, currentUserId) {
   if (!urlValidator.isWebUri(url)) {
     throw new InvalidUrlError(`invalid url: ${url}`)
   }
-  url = UrlHelper.wrapUrlWithProxy(url)
   return url
 }
 
diff --git a/services/web/app/src/Features/Notifications/NotificationsController.mjs b/services/web/app/src/Features/Notifications/NotificationsController.mjs
index ae1d9208f3..35b5f0a677 100644
--- a/services/web/app/src/Features/Notifications/NotificationsController.mjs
+++ b/services/web/app/src/Features/Notifications/NotificationsController.mjs
@@ -33,4 +33,26 @@ export default {
       res.sendStatus(200)
     )
   },
+
+  getNotification(req, res, next) {
+    const userId = SessionManager.getLoggedInUserId(req.session)
+    const { notificationId } = req.params
+    NotificationsHandler.getUserNotifications(
+      userId,
+      function (err, unreadNotifications) {
+        if (err) {
+          return next(err)
+        }
+        const notification = unreadNotifications.find(
+          n => n._id === notificationId
+        )
+
+        if (!notification) {
+          return res.status(404).end()
+        }
+
+        res.json(notification)
+      }
+    )
+  },
 }
diff --git a/services/web/app/src/Features/PasswordReset/PasswordResetController.mjs b/services/web/app/src/Features/PasswordReset/PasswordResetController.mjs
index 40e3a06e44..2963c56653 100644
--- a/services/web/app/src/Features/PasswordReset/PasswordResetController.mjs
+++ b/services/web/app/src/Features/PasswordReset/PasswordResetController.mjs
@@ -8,7 +8,6 @@ import UserSessionsManager from '../User/UserSessionsManager.js'
 import OError from '@overleaf/o-error'
 import EmailsHelper from '../Helpers/EmailHelper.js'
 import { expressify } from '@overleaf/promise-utils'
-import SplitTestHandler from '../SplitTests/SplitTestHandler.js'
 
 async function setNewUserPassword(req, res, next) {
   let user
@@ -119,7 +118,11 @@ async function requestReset(req, res, next) {
     OError.tag(err, 'failed to generate and email password reset token', {
       email,
     })
-    if (err.message === 'user does not have permission for change-password') {
+
+    if (
+      err.message ===
+      'user does not have one or more permissions within change-password'
+    ) {
       return res.status(403).json({
         message: {
           key: 'no-password-allowed-due-to-sso',
@@ -145,12 +148,6 @@ async function requestReset(req, res, next) {
 }
 
 async function renderSetPasswordForm(req, res, next) {
-  const { variant } = await SplitTestHandler.promises.getAssignment(
-    req,
-    res,
-    'auth-pages-bs5'
-  )
-
   if (req.query.passwordResetToken != null) {
     try {
       const result =
@@ -163,10 +160,6 @@ async function renderSetPasswordForm(req, res, next) {
         return res.redirect('/user/password/reset?error=token_expired')
       }
       req.session.resetToken = req.query.passwordResetToken
-      if (variant === 'enabled') {
-        req.session.setPasswordBS5 = true
-      }
-
       let emailQuery = ''
 
       if (typeof req.query.email === 'string') {
@@ -195,13 +188,7 @@ async function renderSetPasswordForm(req, res, next) {
   const passwordResetToken = req.session.resetToken
   delete req.session.resetToken
 
-  const template = req.session.setPasswordBS5
-    ? 'user/setPassword-bs5'
-    : 'user/setPassword'
-
-  delete req.session.setPasswordBS5
-
-  res.render(template, {
+  res.render('user/setPassword', {
     title: 'set_password',
     email,
     passwordResetToken,
@@ -214,16 +201,8 @@ async function renderRequestResetForm(req, res) {
   if (errorQuery === 'token_expired') {
     error = 'password_reset_token_expired'
   }
-  const { variant } = await SplitTestHandler.promises.getAssignment(
-    req,
-    res,
-    'auth-pages-bs5'
-  )
 
-  const template =
-    variant === 'enabled' ? 'user/passwordReset-bs5' : 'user/passwordReset'
-
-  res.render(template, {
+  res.render('user/passwordReset', {
     title: 'reset_password',
     error,
   })
diff --git a/services/web/app/src/Features/PasswordReset/PasswordResetHandler.mjs b/services/web/app/src/Features/PasswordReset/PasswordResetHandler.mjs
index 094f18b95f..2c1aefe6a6 100644
--- a/services/web/app/src/Features/PasswordReset/PasswordResetHandler.mjs
+++ b/services/web/app/src/Features/PasswordReset/PasswordResetHandler.mjs
@@ -72,6 +72,7 @@ async function getUserForPasswordResetToken(token) {
     'overleaf.id': 1,
     email: 1,
     must_reconfirm: 1,
+    hashedPassword: 1,
   })
 
   await assertUserPermissions(user, ['change-password'])
diff --git a/services/web/app/src/Features/Project/ProjectController.js b/services/web/app/src/Features/Project/ProjectController.js
index 8fd4668468..86e06699d1 100644
--- a/services/web/app/src/Features/Project/ProjectController.js
+++ b/services/web/app/src/Features/Project/ProjectController.js
@@ -14,8 +14,8 @@ const ProjectHelper = require('./ProjectHelper')
 const metrics = require('@overleaf/metrics')
 const { User } = require('../../models/User')
 const SubscriptionLocator = require('../Subscription/SubscriptionLocator')
+const { isPaidSubscription } = require('../Subscription/SubscriptionHelper')
 const LimitationsManager = require('../Subscription/LimitationsManager')
-const FeaturesHelper = require('../Subscription/FeaturesHelper')
 const Settings = require('@overleaf/settings')
 const AuthorizationManager = require('../Authorization/AuthorizationManager')
 const InactiveProjectManager = require('../InactiveData/InactiveProjectManager')
@@ -43,13 +43,10 @@ const ProjectAuditLogHandler = require('./ProjectAuditLogHandler')
 const PublicAccessLevels = require('../Authorization/PublicAccessLevels')
 const TagsHandler = require('../Tags/TagsHandler')
 const TutorialHandler = require('../Tutorial/TutorialHandler')
-const OnboardingDataCollectionManager = require('../OnboardingDataCollection/OnboardingDataCollectionManager')
 const UserUpdater = require('../User/UserUpdater')
 const Modules = require('../../infrastructure/Modules')
 const UserGetter = require('../User/UserGetter')
-const {
-  isStandaloneAiAddOnPlanCode,
-} = require('../Subscription/RecurlyEntities')
+const { isStandaloneAiAddOnPlanCode } = require('../Subscription/AiHelper')
 const SubscriptionController = require('../Subscription/SubscriptionController.js')
 const { formatCurrency } = require('../../util/currency')
 
@@ -335,9 +332,10 @@ const _ProjectController = {
 
     const splitTests = [
       'compile-log-events',
+      'visual-preview',
       'external-socket-heartbeat',
-      'full-project-search',
       'null-test-share-modal',
+      'populate-clsi-cache',
       'pdf-caching-cached-url-lookup',
       'pdf-caching-mode',
       'pdf-caching-prefetch-large',
@@ -347,15 +345,12 @@ const _ProjectController = {
       !anonymous && 'ro-mirror-on-client',
       'track-pdf-download',
       !anonymous && 'writefull-oauth-promotion',
-      'write-and-cite',
-      'write-and-cite-ars',
-      'default-visual-for-beginners',
       'hotjar',
-      'reviewer-role',
-      'papers-integration',
       'editor-redesign',
-      'paywall-change-compile-timeout',
       'overleaf-assist-bundle',
+      'word-count-client',
+      'editor-popup-ux-survey',
+      'new-editor-error-logs-redesign',
     ].filter(Boolean)
 
     const getUserValues = async userId =>
@@ -364,7 +359,7 @@ const _ProjectController = {
           user: (async () => {
             const user = await User.findById(
               userId,
-              'email first_name last_name referal_id signUpDate featureSwitches features featuresEpoch refProviders alphaProgram betaProgram isAdmin ace labsProgram completedTutorials writefull aiErrorAssistant'
+              'email first_name last_name referal_id signUpDate featureSwitches features featuresEpoch refProviders alphaProgram betaProgram isAdmin ace labsProgram labsExperiments completedTutorials writefull aiErrorAssistant'
             ).exec()
             // Handle case of deleted user
             if (!user) {
@@ -404,20 +399,6 @@ const _ProjectController = {
               userId,
               projectId
             ),
-          usedLatex: OnboardingDataCollectionManager.getOnboardingDataValue(
-            userId,
-            'usedLatex'
-          ).catch(err => {
-            logger.error({ err, userId })
-            return null
-          }),
-          odcRole: OnboardingDataCollectionManager.getOnboardingDataValue(
-            userId,
-            'role'
-          ).catch(err => {
-            logger.error({ err, userId })
-            return null
-          }),
         })
       )
     const splitTestAssignments = {}
@@ -470,8 +451,6 @@ const _ProjectController = {
         subscription,
         isTokenMember,
         isInvitedMember,
-        usedLatex,
-        odcRole,
       } = userValues
 
       const brandVariation = project?.brandVariationId
@@ -493,12 +472,6 @@ const _ProjectController = {
           anonRequestToken
         )
 
-      const reviewerRoleAssignment =
-        await SplitTestHandler.promises.getAssignmentForUser(
-          project.owner_ref,
-          'reviewer-role'
-        )
-
       await Modules.promises.hooks.fire('enforceCollaboratorLimit', projectId)
       if (isTokenMember) {
         // Check explicitly that the user is in read write token refs, while this could be inferred
@@ -567,10 +540,11 @@ const _ProjectController = {
         .catch(err =>
           logger.error({ err }, 'failed to update split test info in session')
         )
+
+      const ownerFeatures = await UserGetter.promises.getUserFeatures(
+        project.owner_ref
+      )
       if (userId) {
-        const ownerFeatures = await UserGetter.promises.getUserFeatures(
-          project.owner_ref
-        )
         const planLimit = ownerFeatures?.collaborators || 0
         const namedEditors = project.collaberator_refs?.length || 0
         const pendingEditors = project.pendingEditor_refs?.length || 0
@@ -616,7 +590,7 @@ const _ProjectController = {
       }
 
       const isAdminOrTemplateOwner =
-        hasAdminAccess(user) || Settings.templates?.user_id === userId
+        hasAdminAccess(user) || Settings.templates?.nonAdminCanManage
       const showTemplatesServerPro =
         Features.hasFeature('templates-server-pro') && isAdminOrTemplateOwner
 
@@ -671,18 +645,6 @@ const _ProjectController = {
         }
       }
 
-      const hasNonRecurlySubscription =
-        subscription && !subscription.recurlySubscription_id
-      const hasManuallyCollectedSubscription =
-        subscription?.collectionMethod === 'manual'
-      const canPurchaseAddons = !(
-        hasNonRecurlySubscription || hasManuallyCollectedSubscription
-      )
-      const assistantDisabled = user.aiErrorAssistant?.enabled === false // the assistant has been manually disabled by the user
-      const canUseErrorAssistant =
-        (user.features?.aiErrorAssistant || canPurchaseAddons) &&
-        !assistantDisabled
-
       let featureUsage = {}
 
       if (Features.hasFeature('saas')) {
@@ -748,12 +710,11 @@ const _ProjectController = {
           ? 'project/ide-react-detached'
           : 'project/ide-react'
 
-      let chatEnabled
-      if (Features.hasFeature('saas')) {
-        chatEnabled =
-          Features.hasFeature('chat') && req.capabilitySet.has('chat')
-      } else {
-        chatEnabled = Features.hasFeature('chat')
+      const capabilities = [...req.capabilitySet]
+
+      // make sure the capability is added to CE/SP when the feature is enabled
+      if (!Features.hasFeature('saas') && Features.hasFeature('chat')) {
+        capabilities.push('chat')
       }
 
       const isOverleafAssistBundleEnabled =
@@ -761,25 +722,17 @@ const _ProjectController = {
 
       let fullFeatureSet = user?.features
       if (!anonymous) {
-        // generate users feature set including features added, or overriden via modules
-        const moduleFeatures =
-          (await Modules.promises.hooks.fire(
-            'getModuleProvidedFeatures',
-            userId
-          )) || []
-        fullFeatureSet = FeaturesHelper.computeFeatureSet([
-          user.features,
-          ...moduleFeatures,
-        ])
+        fullFeatureSet = await UserGetter.promises.getUserFeatures(userId)
       }
 
-      const isPaywallChangeCompileTimeoutEnabled =
-        splitTestAssignments['paywall-change-compile-timeout']?.variant ===
-        'enabled'
-
-      const paywallPlans =
-        isPaywallChangeCompileTimeoutEnabled &&
-        (await ProjectController._getPaywallPlansPrices(req, res))
+      const hasPaidSubscription = isPaidSubscription(subscription)
+      const hasManuallyCollectedSubscription =
+        subscription?.collectionMethod === 'manual'
+      const assistantDisabled = user.aiErrorAssistant?.enabled === false // the assistant has been manually disabled by the user
+      const canUseErrorAssistant =
+        (!hasManuallyCollectedSubscription ||
+          fullFeatureSet?.aiErrorAssistant) &&
+        !assistantDisabled
 
       const customerIoEnabled =
         await SplitTestHandler.promises.hasUserBeenAssignedToVariant(
@@ -794,17 +747,27 @@ const _ProjectController = {
         isOverleafAssistBundleEnabled &&
         (await ProjectController._getAddonPrices(req, res))
 
+      const reducedTimeoutWarning =
+        await SplitTestHandler.promises.getAssignmentForUser(
+          project.owner_ref,
+          '10s-timeout-warning'
+        )
+
       let planCode = subscription?.planCode
       if (!planCode && !userInNonIndividualSub) {
-        planCode = 'free'
+        planCode = 'personal'
       }
 
+      const planDetails = Settings.plans.find(p => p.planCode === planCode)
+
       res.render(template, {
         title: project.name,
         priority_title: true,
         bodyClasses: ['editor'],
         project_id: project._id,
         projectName: project.name,
+        projectOwnerHasPremiumOnPageLoad:
+          ownerFeatures?.compileGroup === 'priority',
         user: {
           id: userId,
           email: user.email,
@@ -813,7 +776,7 @@ const _ProjectController = {
           referal_id: user.referal_id,
           signUpDate: user.signUpDate,
           allowedFreeTrial,
-          hasRecurlySubscription: subscription?.recurlySubscription_id != null,
+          hasPaidSubscription,
           featureSwitches: user.featureSwitches,
           features: fullFeatureSet,
           featureUsage,
@@ -829,6 +792,8 @@ const _ProjectController = {
           inactiveTutorials: TutorialHandler.getInactiveTutorials(user),
           isAdmin: hasAdminAccess(user),
           planCode,
+          planName: planDetails?.name,
+          isAnnualPlan: planCode && planDetails?.annual,
           isMemberOfGroupSubscription: userIsMemberOfGroupSubscription,
           hasInstitutionLicence: userHasInstitutionLicence,
         },
@@ -844,9 +809,11 @@ const _ProjectController = {
           lineHeight: user.ace.lineHeight || 'normal',
           overallTheme: user.ace.overallTheme,
           mathPreview: user.ace.mathPreview,
+          breadcrumbs: user.ace.breadcrumbs,
           referencesSearchMode: user.ace.referencesSearchMode,
           enableNewEditor: user.ace.enableNewEditor ?? true,
         },
+        labsExperiments: user.labsExperiments ?? [],
         privilegeLevel,
         anonymous,
         isTokenMember,
@@ -856,7 +823,7 @@ const _ProjectController = {
           isTokenMember,
           isInvitedMember
         ),
-        chatEnabled,
+        capabilities,
         projectHistoryBlobsEnabled: Features.hasFeature(
           'project-history-blobs'
         ),
@@ -887,28 +854,15 @@ const _ProjectController = {
         fixedSizeDocument: true,
         hasTrackChangesFeature: Features.hasFeature('track-changes'),
         projectTags,
-        usedLatex:
-          // only use the usedLatex value if the split test is enabled
-          splitTestAssignments['default-visual-for-beginners']?.variant ===
-          'enabled'
-            ? usedLatex
-            : null,
-        odcRole:
-          // only use the ODC role value if the split test is enabled
-          splitTestAssignments['paywall-change-compile-timeout']?.variant ===
-          'enabled'
-            ? odcRole
-            : null,
         isSaas: Features.hasFeature('saas'),
         shouldLoadHotjar: splitTestAssignments.hotjar?.variant === 'enabled',
-        isReviewerRoleEnabled:
-          reviewerRoleAssignment?.variant === 'enabled' ||
-          Object.keys(project.reviewer_refs || {}).length > 0,
-        isPaywallChangeCompileTimeoutEnabled,
         isOverleafAssistBundleEnabled,
-        paywallPlans,
         customerIoEnabled,
         addonPrices,
+        compileSettings: {
+          reducedTimeoutWarning: reducedTimeoutWarning?.variant,
+          compileTimeout: ownerFeatures?.compileTimeout,
+        },
       })
       timer.done()
     } catch (err) {
@@ -943,7 +897,7 @@ const _ProjectController = {
     return plansData
   },
 
-  async _getAddonPrices(req, res, addonPlans = ['assistBundle']) {
+  async _getAddonPrices(req, res, addonPlans = ['assistant']) {
     const plansData = {}
 
     const locale = req.i18n.language
@@ -956,9 +910,17 @@ const _ProjectController = {
       const annualPrice = Settings.localizedAddOnsPricing[currency][plan].annual
       const monthlyPrice =
         Settings.localizedAddOnsPricing[currency][plan].monthly
+      const annualDividedByTwelve =
+        Settings.localizedAddOnsPricing[currency][plan].annualDividedByTwelve
 
       plansData[plan] = {
         annual: formatCurrency(annualPrice, currency, locale, true),
+        annualDividedByTwelve: formatCurrency(
+          annualDividedByTwelve,
+          currency,
+          locale,
+          true
+        ),
         monthly: formatCurrency(monthlyPrice, currency, locale, true),
       }
     })
@@ -1202,6 +1164,7 @@ const THEME_LIST = [
   'eclipse',
   'monokai',
   'overleaf',
+  'overleaf_dark',
   'textmate',
 ]
 
diff --git a/services/web/app/src/Features/Project/ProjectDeleter.js b/services/web/app/src/Features/Project/ProjectDeleter.js
index 62d893dd0f..bbf5553ae1 100644
--- a/services/web/app/src/Features/Project/ProjectDeleter.js
+++ b/services/web/app/src/Features/Project/ProjectDeleter.js
@@ -9,7 +9,6 @@ const Errors = require('../Errors/Errors')
 const logger = require('@overleaf/logger')
 const DocumentUpdaterHandler = require('../DocumentUpdater/DocumentUpdaterHandler')
 const TagsHandler = require('../Tags/TagsHandler')
-const ProjectHelper = require('./ProjectHelper')
 const ProjectDetailsHandler = require('./ProjectDetailsHandler')
 const CollaboratorsHandler = require('../Collaborators/CollaboratorsHandler')
 const CollaboratorsGetter = require('../Collaborators/CollaboratorsGetter')
@@ -80,7 +79,12 @@ async function unmarkAsDeletedByExternalSource(projectId) {
 
 async function deleteUsersProjects(userId) {
   const projects = await Project.find({ owner_ref: userId }).exec()
+  logger.info(
+    { userId, projectCount: projects.length },
+    'found user projects to delete'
+  )
   await promiseMapWithLimit(5, projects, project => deleteProject(project._id))
+  logger.info({ userId }, 'deleted all user projects')
   await CollaboratorsHandler.promises.removeUserFromAllProjects(userId)
 }
 
@@ -101,8 +105,24 @@ async function expireDeletedProjectsAfterDuration() {
       deletedProject => deletedProject.deleterData.deletedProjectId
     )
   )
-  for (const projectId of projectIds) {
-    await expireDeletedProject(projectId)
+  logger.info(
+    { projectCount: projectIds.length },
+    'expiring batch of deleted projects'
+  )
+  try {
+    for (const projectId of projectIds) {
+      await expireDeletedProject(projectId)
+    }
+    logger.info(
+      { projectCount: projectIds.length },
+      'batch of deleted projects expired successfully'
+    )
+  } catch (error) {
+    logger.warn(
+      { error },
+      'something went wrong expiring batch of deleted projects'
+    )
+    throw error
   }
 }
 
@@ -114,88 +134,37 @@ async function restoreProject(projectId) {
 }
 
 async function archiveProject(projectId, userId) {
-  try {
-    const project = await Project.findOne({ _id: projectId }).exec()
-    if (!project) {
-      throw new Errors.NotFoundError('project not found')
+  await Project.updateOne(
+    { _id: projectId },
+    {
+      $addToSet: { archived: new ObjectId(userId) },
+      $pull: { trashed: new ObjectId(userId) },
     }
-    const archived = ProjectHelper.calculateArchivedArray(
-      project,
-      userId,
-      'ARCHIVE'
-    )
-
-    await Project.updateOne(
-      { _id: projectId },
-      { $set: { archived }, $pull: { trashed: new ObjectId(userId) } }
-    )
-  } catch (err) {
-    logger.warn({ err }, 'problem archiving project')
-    throw err
-  }
+  )
 }
 
 async function unarchiveProject(projectId, userId) {
-  try {
-    const project = await Project.findOne({ _id: projectId }).exec()
-    if (!project) {
-      throw new Errors.NotFoundError('project not found')
-    }
-
-    const archived = ProjectHelper.calculateArchivedArray(
-      project,
-      userId,
-      'UNARCHIVE'
-    )
-
-    await Project.updateOne({ _id: projectId }, { $set: { archived } })
-  } catch (err) {
-    logger.warn({ err }, 'problem unarchiving project')
-    throw err
-  }
+  await Project.updateOne(
+    { _id: projectId },
+    { $pull: { archived: new ObjectId(userId) } }
+  )
 }
 
 async function trashProject(projectId, userId) {
-  try {
-    const project = await Project.findOne({ _id: projectId }).exec()
-    if (!project) {
-      throw new Errors.NotFoundError('project not found')
+  await Project.updateOne(
+    { _id: projectId },
+    {
+      $addToSet: { trashed: new ObjectId(userId) },
+      $pull: { archived: new ObjectId(userId) },
     }
-
-    const archived = ProjectHelper.calculateArchivedArray(
-      project,
-      userId,
-      'UNARCHIVE'
-    )
-
-    await Project.updateOne(
-      { _id: projectId },
-      {
-        $addToSet: { trashed: new ObjectId(userId) },
-        $set: { archived },
-      }
-    )
-  } catch (err) {
-    logger.warn({ err }, 'problem trashing project')
-    throw err
-  }
+  )
 }
 
 async function untrashProject(projectId, userId) {
-  try {
-    const project = await Project.findOne({ _id: projectId }).exec()
-    if (!project) {
-      throw new Errors.NotFoundError('project not found')
-    }
-
-    await Project.updateOne(
-      { _id: projectId },
-      { $pull: { trashed: new ObjectId(userId) } }
-    )
-  } catch (err) {
-    logger.warn({ err }, 'problem untrashing project')
-    throw err
-  }
+  await Project.updateOne(
+    { _id: projectId },
+    { $pull: { trashed: new ObjectId(userId) } }
+  )
 }
 
 async function deleteProject(projectId, options = {}) {
@@ -271,12 +240,15 @@ async function deleteProject(projectId, options = {}) {
     )
 
     await Project.deleteOne({ _id: projectId }).exec()
+
+    logger.info(
+      { projectId, userId: project.owner_ref },
+      'successfully deleted project'
+    )
   } catch (err) {
     logger.warn({ err }, 'problem deleting project')
     throw err
   }
-
-  logger.debug({ projectId }, 'successfully deleted project')
 }
 
 async function undeleteProject(projectId, options = {}) {
@@ -319,19 +291,6 @@ async function undeleteProject(projectId, options = {}) {
     })
     restored.deletedDocs = []
   }
-  if (restored.deletedFiles && restored.deletedFiles.length > 0) {
-    filterDuplicateDeletedFilesInPlace(restored)
-    const deletedFiles = restored.deletedFiles.map(file => {
-      // break free from the model
-      file = file.toObject()
-
-      // add projectId
-      file.projectId = projectId
-      return file
-    })
-    await db.deletedFiles.insertMany(deletedFiles)
-    restored.deletedFiles = []
-  }
 
   // we can't use Mongoose to re-insert the project, as it won't
   // create a new document with an _id already specified. We need to
@@ -343,17 +302,22 @@ async function undeleteProject(projectId, options = {}) {
 
 async function expireDeletedProject(projectId) {
   try {
+    logger.info({ projectId }, 'expiring deleted project')
     const activeProject = await Project.findById(projectId).exec()
     if (activeProject) {
       // That project is active. The deleted project record might be there
       // because of an incomplete delete or undelete operation. Clean it up and
       // return.
+      logger.info(
+        { projectId },
+        'deleted project record found but project is active'
+      )
       await DeletedProject.deleteOne({
         'deleterData.deletedProjectId': projectId,
       })
-      await ProjectAuditLogEntry.deleteMany({ projectId })
       return
     }
+
     const deletedProject = await DeletedProject.findOne({
       'deleterData.deletedProjectId': projectId,
     }).exec()
@@ -369,12 +333,14 @@ async function expireDeletedProject(projectId) {
       )
       return
     }
-
+    const userId = deletedProject.deleterData?.deletedProjectOwnerId?.toString()
     const historyId =
       deletedProject.project.overleaf &&
       deletedProject.project.overleaf.history &&
       deletedProject.project.overleaf.history.id
 
+    logger.info({ projectId, userId }, 'destroying expired project data')
+
     await Promise.all([
       DocstoreManager.promises.destroyProject(deletedProject.project._id),
       HistoryManager.promises.deleteProject(
@@ -383,11 +349,14 @@ async function expireDeletedProject(projectId) {
       ),
       FilestoreHandler.promises.deleteProject(deletedProject.project._id),
       ChatApiHandler.promises.destroyProject(deletedProject.project._id),
-      hardDeleteDeletedFiles(deletedProject.project._id),
       ProjectAuditLogEntry.deleteMany({ projectId }),
       Modules.promises.hooks.fire('projectExpired', deletedProject.project._id),
     ])
 
+    logger.info(
+      { projectId, userId },
+      'redacting PII from the deleted project record'
+    )
     await DeletedProject.updateOne(
       {
         _id: deletedProject._id,
@@ -399,36 +368,9 @@ async function expireDeletedProject(projectId) {
         },
       }
     ).exec()
+    logger.info({ projectId, userId }, 'expired deleted project successfully')
   } catch (error) {
     logger.warn({ projectId, error }, 'error expiring deleted project')
     throw error
   }
 }
-
-function filterDuplicateDeletedFilesInPlace(project) {
-  const fileIds = new Set()
-  project.deletedFiles = project.deletedFiles.filter(file => {
-    const id = file._id.toString()
-    if (fileIds.has(id)) return false
-    fileIds.add(id)
-    return true
-  })
-}
-
-let deletedFilesProjectIdIndexExist
-async function doesDeletedFilesProjectIdIndexExist() {
-  if (typeof deletedFilesProjectIdIndexExist !== 'boolean') {
-    // Resolve this about once. No need for locking or retry handling.
-    deletedFilesProjectIdIndexExist =
-      await db.deletedFiles.indexExists('projectId_1')
-  }
-  return deletedFilesProjectIdIndexExist
-}
-
-async function hardDeleteDeletedFiles(projectId) {
-  if (!(await doesDeletedFilesProjectIdIndexExist())) {
-    // Running the deletion command w/o index would kill mongo performance
-    return
-  }
-  return db.deletedFiles.deleteMany({ projectId })
-}
diff --git a/services/web/app/src/Features/Project/ProjectDuplicator.js b/services/web/app/src/Features/Project/ProjectDuplicator.js
index da18c7e9b8..47c00ed3df 100644
--- a/services/web/app/src/Features/Project/ProjectDuplicator.js
+++ b/services/web/app/src/Features/Project/ProjectDuplicator.js
@@ -21,6 +21,7 @@ const TpdsProjectFlusher = require('../ThirdPartyDataStore/TpdsProjectFlusher')
 const _ = require('lodash')
 const TagsHandler = require('../Tags/TagsHandler')
 const Features = require('../../infrastructure/Features')
+const ClsiCacheManager = require('../Compile/ClsiCacheManager')
 
 module.exports = {
   duplicate: callbackify(duplicate),
@@ -35,6 +36,7 @@ async function duplicate(owner, originalProjectId, newProjectName, tags = []) {
     originalProjectId,
     {
       compiler: true,
+      imageName: true,
       rootFolder: true,
       rootDoc_id: true,
       fromV1TemplateId: true,
@@ -73,6 +75,21 @@ async function duplicate(owner, originalProjectId, newProjectName, tags = []) {
     { segmentation }
   )
 
+  let prepareClsiCacheInBackground = Promise.resolve()
+  if (originalProject.imageName === newProject.imageName) {
+    // Populate the clsi-cache unless the TeXLive release has changed.
+    prepareClsiCacheInBackground = ClsiCacheManager.prepareClsiCache(
+      newProject._id,
+      owner._id,
+      { sourceProjectId: originalProjectId }
+    ).catch(err => {
+      logger.warn(
+        { err, originalProjectId, projectId: newProject._id },
+        'failed to prepare clsi-cache for cloned project'
+      )
+    })
+  }
+
   try {
     await ProjectOptionsHandler.promises.setCompiler(
       newProject._id,
@@ -120,6 +137,10 @@ async function duplicate(owner, originalProjectId, newProjectName, tags = []) {
     })
   }
 
+  try {
+    await prepareClsiCacheInBackground
+  } catch {}
+
   return newProject
 }
 
diff --git a/services/web/app/src/Features/Project/ProjectEditorHandler.js b/services/web/app/src/Features/Project/ProjectEditorHandler.js
index a85e8b5764..810fac7f83 100644
--- a/services/web/app/src/Features/Project/ProjectEditorHandler.js
+++ b/services/web/app/src/Features/Project/ProjectEditorHandler.js
@@ -3,23 +3,16 @@ const _ = require('lodash')
 const Path = require('path')
 const Features = require('../../infrastructure/Features')
 
-function mergeDeletedDocs(a, b) {
-  const docIdsInA = new Set(a.map(doc => doc._id.toString()))
-  return a.concat(b.filter(doc => !docIdsInA.has(doc._id.toString())))
-}
-
 module.exports = ProjectEditorHandler = {
-  trackChangesAvailable: false,
+  trackChangesAvailable: true,
 
-  buildProjectModelView(project, members, invites, deletedDocsFromDocstore) {
-    let owner, ownerFeatures
-    if (!Array.isArray(project.deletedDocs)) {
-      project.deletedDocs = []
-    }
-    project.deletedDocs.forEach(doc => {
-      // The frontend does not use this field.
-      delete doc.deletedAt
-    })
+  buildProjectModelView(
+    project,
+    ownerMember,
+    members,
+    invites,
+    isRestrictedUser
+  ) {
     const result = {
       _id: project._id,
       name: project.name,
@@ -32,24 +25,23 @@ module.exports = ProjectEditorHandler = {
       description: project.description,
       spellCheckLanguage: project.spellCheckLanguage,
       deletedByExternalDataSource: project.deletedByExternalDataSource || false,
-      deletedDocs: mergeDeletedDocs(
-        project.deletedDocs,
-        deletedDocsFromDocstore
-      ),
-      members: [],
-      invites: this.buildInvitesView(invites),
       imageName:
         project.imageName != null
-          ? Path.basename(project.imageName)
+          ? project.imageName
           : undefined,
     }
 
-    ;({ owner, ownerFeatures, members } =
-      this.buildOwnerAndMembersViews(members))
-    result.owner = owner
-    result.members = members
+    if (isRestrictedUser) {
+      result.owner = { _id: project.owner_ref }
+      result.members = []
+      result.invites = []
+    } else {
+      result.owner = this.buildUserModelView(ownerMember)
+      result.members = members.map(this.buildUserModelView)
+      result.invites = this.buildInvitesView(invites)
+    }
 
-    result.features = _.defaults(ownerFeatures || {}, {
+    result.features = _.defaults(ownerMember?.user?.features || {}, {
       collaborators: -1, // Infinite
       versioning: false,
       dropbox: false,
@@ -78,25 +70,6 @@ module.exports = ProjectEditorHandler = {
     return result
   },
 
-  buildOwnerAndMembersViews(members) {
-    let owner = null
-    let ownerFeatures = null
-    const filteredMembers = []
-    for (const member of members || []) {
-      if (member.privilegeLevel === 'owner') {
-        ownerFeatures = member.user.features
-        owner = this.buildUserModelView(member)
-      } else {
-        filteredMembers.push(this.buildUserModelView(member))
-      }
-    }
-    return {
-      owner,
-      ownerFeatures,
-      members: filteredMembers,
-    }
-  },
-
   buildUserModelView(member) {
     const user = member.user
     return {
diff --git a/services/web/app/src/Features/Project/ProjectEntityHandler.js b/services/web/app/src/Features/Project/ProjectEntityHandler.js
index b834f58d2a..7d0498ffd0 100644
--- a/services/web/app/src/Features/Project/ProjectEntityHandler.js
+++ b/services/web/app/src/Features/Project/ProjectEntityHandler.js
@@ -99,10 +99,18 @@ function getAllDocPathsFromProject(project) {
   return docPath
 }
 
-async function getDoc(projectId, docId) {
+/**
+ *
+ * @param {string} projectId
+ * @param {string} docId
+ * @param {{peek?: boolean, include_deleted?: boolean}} options
+ * @return {Promise<{lines: *, rev: *, version: *, ranges: *}>}
+ */
+async function getDoc(projectId, docId, options = {}) {
   const { lines, rev, version, ranges } = await DocstoreManager.promises.getDoc(
     projectId,
-    docId
+    docId,
+    options
   )
   return { lines, rev, version, ranges }
 }
diff --git a/services/web/app/src/Features/Project/ProjectEntityMongoUpdateHandler.js b/services/web/app/src/Features/Project/ProjectEntityMongoUpdateHandler.js
index 31b3efaec8..895350bf37 100644
--- a/services/web/app/src/Features/Project/ProjectEntityMongoUpdateHandler.js
+++ b/services/web/app/src/Features/Project/ProjectEntityMongoUpdateHandler.js
@@ -15,7 +15,6 @@ const ProjectGetter = require('./ProjectGetter')
 const ProjectLocator = require('./ProjectLocator')
 const FolderStructureBuilder = require('./FolderStructureBuilder')
 const SafePath = require('./SafePath')
-const { DeletedFile } = require('../../models/DeletedFile')
 const { iterablePaths } = require('./IterablePath')
 
 const LOCK_NAMESPACE = 'mongoTransaction'
@@ -72,7 +71,6 @@ module.exports = {
     'changes',
   ]),
   createNewFolderStructure: callbackify(wrapWithLock(createNewFolderStructure)),
-  _insertDeletedFileReference: callbackify(_insertDeletedFileReference),
   _putElement: callbackifyMultiResult(_putElement, ['result', 'project']),
   _confirmFolder,
   promises: {
@@ -87,7 +85,6 @@ module.exports = {
     deleteEntity: wrapWithLock(deleteEntity),
     renameEntity: wrapWithLock(renameEntity),
     createNewFolderStructure: wrapWithLock(createNewFolderStructure),
-    _insertDeletedFileReference,
     _putElement,
   },
 }
@@ -105,7 +102,7 @@ function wrapWithLock(methodWithoutLock) {
   return methodWithLock
 }
 
-async function addDoc(projectId, folderId, doc) {
+async function addDoc(projectId, folderId, doc, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     {
@@ -119,12 +116,13 @@ async function addDoc(projectId, folderId, doc) {
     project,
     folderId,
     doc,
-    'doc'
+    'doc',
+    userId
   )
   return { result, project: newProject }
 }
 
-async function addFile(projectId, folderId, fileRef) {
+async function addFile(projectId, folderId, fileRef, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -134,23 +132,24 @@ async function addFile(projectId, folderId, fileRef) {
     project,
     folderId,
     fileRef,
-    'file'
+    'file',
+    userId
   )
   return { result, project: newProject }
 }
 
-async function addFolder(projectId, parentFolderId, folderName) {
+async function addFolder(projectId, parentFolderId, folderName, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
   )
   parentFolderId = _confirmFolder(project, parentFolderId)
   const folder = new Folder({ name: folderName })
-  await _putElement(project, parentFolderId, folder, 'folder')
+  await _putElement(project, parentFolderId, folder, 'folder', userId)
   return { folder, parentFolderId }
 }
 
-async function replaceFileWithNew(projectId, fileId, newFileRef) {
+async function replaceFileWithNew(projectId, fileId, newFileRef, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -160,7 +159,6 @@ async function replaceFileWithNew(projectId, fileId, newFileRef) {
     element_id: fileId,
     type: 'file',
   })
-  await _insertDeletedFileReference(projectId, fileRef)
   const newProject = await Project.findOneAndUpdate(
     { _id: project._id, [path.mongo]: { $exists: true } },
     {
@@ -169,6 +167,8 @@ async function replaceFileWithNew(projectId, fileId, newFileRef) {
         [`${path.mongo}.created`]: new Date(),
         [`${path.mongo}.linkedFileData`]: newFileRef.linkedFileData,
         [`${path.mongo}.hash`]: newFileRef.hash,
+        lastUpdated: new Date(),
+        lastUpdatedBy: userId,
       },
       $inc: {
         version: 1,
@@ -194,7 +194,7 @@ async function replaceFileWithNew(projectId, fileId, newFileRef) {
   return { oldFileRef: fileRef, project, path, newProject, newFileRef }
 }
 
-async function replaceDocWithFile(projectId, docId, fileRef) {
+async function replaceDocWithFile(projectId, docId, fileRef, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -215,6 +215,7 @@ async function replaceDocWithFile(projectId, docId, fileRef) {
         [`${folderMongoPath}.fileRefs`]: fileRef,
       },
       $inc: { version: 1 },
+      $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
     },
     { new: true }
   ).exec()
@@ -227,7 +228,7 @@ async function replaceDocWithFile(projectId, docId, fileRef) {
   return newProject
 }
 
-async function replaceFileWithDoc(projectId, fileId, newDoc) {
+async function replaceFileWithDoc(projectId, fileId, newDoc, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -248,6 +249,7 @@ async function replaceFileWithDoc(projectId, fileId, newDoc) {
         [`${folderMongoPath}.docs`]: newDoc,
       },
       $inc: { version: 1 },
+      $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
     },
     { new: true }
   ).exec()
@@ -260,7 +262,7 @@ async function replaceFileWithDoc(projectId, fileId, newDoc) {
   return newProject
 }
 
-async function mkdirp(projectId, path, options = {}) {
+async function mkdirp(projectId, path, userId, options = {}) {
   // defaults to case insensitive paths, use options {exactCaseMatch:true}
   // to make matching case-sensitive
   const folders = path.split('/').filter(folder => folder.length !== 0)
@@ -289,7 +291,7 @@ async function mkdirp(projectId, path, options = {}) {
       // Folder couldn't be found. Create it.
       const parentFolderId = lastFolder && lastFolder._id
       const { folder: newFolder, parentFolderId: newParentFolderId } =
-        await addFolder(projectId, parentFolderId, folderName)
+        await addFolder(projectId, parentFolderId, folderName, userId)
       newFolder.parentFolder_id = newParentFolderId
       lastFolder = newFolder
       newFolders.push(newFolder)
@@ -298,7 +300,13 @@ async function mkdirp(projectId, path, options = {}) {
   return { folder: lastFolder, newFolders }
 }
 
-async function moveEntity(projectId, entityId, destFolderId, entityType) {
+async function moveEntity(
+  projectId,
+  entityId,
+  destFolderId,
+  entityType,
+  userId
+) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -326,7 +334,8 @@ async function moveEntity(projectId, entityId, destFolderId, entityType) {
     project,
     destFolderId,
     entity,
-    entityType
+    entityType,
+    userId
   )
   // Note: putElement always pushes onto the end of an
   // array so it will never change an existing mongo
@@ -337,10 +346,10 @@ async function moveEntity(projectId, entityId, destFolderId, entityType) {
   // is done by _checkValidMove above) because that
   // would lead to it being deleted.
   const newProject = await _removeElementFromMongoArray(
-    Project,
     projectId,
     entityPath.mongo,
-    entityId
+    entityId,
+    userId
   )
   const { docs: newDocs, files: newFiles } =
     ProjectEntityHandler.getAllEntitiesFromProject(newProject)
@@ -375,7 +384,7 @@ async function moveEntity(projectId, entityId, destFolderId, entityType) {
   return { project, startPath, endPath, rev: entity.rev, changes }
 }
 
-async function deleteEntity(projectId, entityId, entityType) {
+async function deleteEntity(projectId, entityId, entityType, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { name: true, rootFolder: true, overleaf: true, rootDoc_id: true }
@@ -399,22 +408,16 @@ async function deleteEntity(projectId, entityId, entityType) {
     type: entityType,
   })
   const newProject = await _removeElementFromMongoArray(
-    Project,
     projectId,
     path.mongo,
     entityId,
+    userId,
     deleteRootDoc
   )
   return { entity, path, projectBeforeDeletion: project, newProject }
 }
 
-async function renameEntity(
-  projectId,
-  entityId,
-  entityType,
-  newName,
-  callback
-) {
+async function renameEntity(projectId, entityId, entityType, newName, userId) {
   const project = await ProjectGetter.promises.getProjectWithoutLock(
     projectId,
     { rootFolder: true, name: true, overleaf: true }
@@ -445,7 +448,14 @@ async function renameEntity(
   // we need to increment the project version number for any structure change
   const newProject = await Project.findOneAndUpdate(
     { _id: projectId, [entPath.mongo]: { $exists: true } },
-    { $set: { [`${entPath.mongo}.name`]: newName }, $inc: { version: 1 } },
+    {
+      $set: {
+        [`${entPath.mongo}.name`]: newName,
+        lastUpdated: new Date(),
+        lastUpdatedBy: userId,
+      },
+      $inc: { version: 1 },
+    },
     { new: true }
   ).exec()
   if (newProject == null) {
@@ -466,22 +476,11 @@ async function renameEntity(
   }
 }
 
-async function _insertDeletedFileReference(projectId, fileRef) {
-  await DeletedFile.create({
-    projectId,
-    _id: fileRef._id,
-    name: fileRef.name,
-    linkedFileData: fileRef.linkedFileData,
-    hash: fileRef.hash,
-    deletedAt: new Date(),
-  })
-}
-
 async function _removeElementFromMongoArray(
-  model,
   modelId,
   path,
   elementId,
+  userId,
   deleteRootDoc = false
 ) {
   const nonArrayPath = path.slice(0, path.lastIndexOf('.'))
@@ -490,11 +489,12 @@ async function _removeElementFromMongoArray(
   const update = {
     $pull: { [nonArrayPath]: { _id: elementId } },
     $inc: { version: 1 },
+    $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
   }
   if (deleteRootDoc) {
     update.$unset = { rootDoc_id: 1 }
   }
-  return model.findOneAndUpdate(query, update, options).exec()
+  return Project.findOneAndUpdate(query, update, options).exec()
 }
 
 function _countElements(project) {
@@ -522,7 +522,7 @@ function _countElements(project) {
   return countFolder(project.rootFolder[0])
 }
 
-async function _putElement(project, folderId, element, type) {
+async function _putElement(project, folderId, element, type, userId) {
   if (element == null || element._id == null) {
     logger.warn(
       { projectId: project._id, folderId, element, type },
@@ -578,7 +578,11 @@ async function _putElement(project, folderId, element, type) {
   const mongoPath = `${path.mongo}.${pathSegment}`
   const newProject = await Project.findOneAndUpdate(
     { _id: project._id, [path.mongo]: { $exists: true } },
-    { $push: { [mongoPath]: element }, $inc: { version: 1 } },
+    {
+      $push: { [mongoPath]: element },
+      $inc: { version: 1 },
+      $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
+    },
     { new: true }
   ).exec()
   if (newProject == null) {
@@ -709,7 +713,11 @@ async function createNewFolderStructure(projectId, docEntries, fileEntries) {
         'rootFolder.0.files.0': { $exists: false },
       },
       {
-        $set: { rootFolder: [rootFolder] },
+        $set: {
+          rootFolder: [rootFolder],
+          // NOTE: Do not set lastUpdated/lastUpdatedBy here. They are both set when creating the initial record.
+          // The newly created clsi-cache record uses the lastUpdated timestamp of the initial record. Updating the lastUpdated timestamp here invalidates the cache record.
+        },
         $inc: { version: 1 },
       },
       {
diff --git a/services/web/app/src/Features/Project/ProjectEntityUpdateHandler.js b/services/web/app/src/Features/Project/ProjectEntityUpdateHandler.js
index dd86dc4724..d03cb7f95a 100644
--- a/services/web/app/src/Features/Project/ProjectEntityUpdateHandler.js
+++ b/services/web/app/src/Features/Project/ProjectEntityUpdateHandler.js
@@ -296,7 +296,8 @@ const addDocWithRanges = wrapWithLock({
       await ProjectEntityUpdateHandler._addDocAndSendToTpds(
         projectId,
         folderId,
-        doc
+        doc,
+        userId
       )
     const docPath = result?.path?.fileSystem
     const projectHistoryId = project?.overleaf?.history?.id
@@ -364,7 +365,8 @@ const addFile = wrapWithLock({
       await ProjectEntityUpdateHandler._addFileAndSendToTpds(
         projectId,
         folderId,
-        fileRef
+        fileRef,
+        userId
       )
     const projectHistoryId = project.overleaf?.history?.id
     const newFiles = [
@@ -382,12 +384,6 @@ const addFile = wrapWithLock({
       { newFiles, newProject: project },
       source
     )
-
-    ProjectUpdateHandler.promises
-      .markAsUpdated(projectId, new Date(), userId)
-      .catch(error => {
-        logger.error({ error }, 'failed to mark project as updated')
-      })
     return { fileRef, folderId, createdBlob }
   },
 })
@@ -434,7 +430,8 @@ const upsertDoc = wrapWithLock(
         await ProjectEntityMongoUpdateHandler.promises.replaceFileWithDoc(
           projectId,
           existingFile._id,
-          doc
+          doc,
+          userId
         )
 
       await TpdsUpdateSender.promises.addDoc({
@@ -616,7 +613,8 @@ const upsertFile = wrapWithLock({
         await ProjectEntityMongoUpdateHandler.promises.replaceDocWithFile(
           projectId,
           existingDoc._id,
-          fileRef
+          fileRef,
+          userId
         )
       const projectHistoryId = project.overleaf?.history?.id
       await TpdsUpdateSender.promises.addFile({
@@ -699,7 +697,8 @@ const upsertDocWithPath = wrapWithLock(
     const { newFolders, folder } =
       await ProjectEntityUpdateHandler.promises.mkdirp.withoutLock(
         projectId,
-        folderPath
+        folderPath,
+        userId
       )
     const { isNew, doc } =
       await ProjectEntityUpdateHandler.promises.upsertDoc.withoutLock(
@@ -772,7 +771,8 @@ const upsertFileWithPath = wrapWithLock({
     const { newFolders, folder } =
       await ProjectEntityUpdateHandler.promises.mkdirp.withoutLock(
         projectId,
-        folderPath
+        folderPath,
+        userId
       )
     // this calls directly into the upsertFile main task (without the beforeLock part)
     const {
@@ -818,7 +818,8 @@ const deleteEntity = wrapWithLock(
       await ProjectEntityMongoUpdateHandler.promises.deleteEntity(
         projectId,
         entityId,
-        entityType
+        entityType,
+        userId
       )
     const subtreeListing = await ProjectEntityUpdateHandler._cleanUpEntity(
       projectBeforeDeletion,
@@ -866,7 +867,7 @@ const deleteEntityWithPath = wrapWithLock(
   }
 )
 
-const mkdirp = wrapWithLock(async function (projectId, path) {
+const mkdirp = wrapWithLock(async function (projectId, path, userId) {
   for (const folder of path.split('/')) {
     if (folder.length > 0 && !SafePath.isCleanFilename(folder)) {
       throw new Errors.InvalidNameError('invalid element name')
@@ -875,32 +876,37 @@ const mkdirp = wrapWithLock(async function (projectId, path) {
   return await ProjectEntityMongoUpdateHandler.promises.mkdirp(
     projectId,
     path,
+    userId,
     { exactCaseMatch: false }
   )
 })
 
-const mkdirpWithExactCase = wrapWithLock(async function (projectId, path) {
-  for (const folder of path.split('/')) {
-    if (folder.length > 0 && !SafePath.isCleanFilename(folder)) {
-      throw new Errors.InvalidNameError('invalid element name')
+const mkdirpWithExactCase = wrapWithLock(
+  async function (projectId, path, userId) {
+    for (const folder of path.split('/')) {
+      if (folder.length > 0 && !SafePath.isCleanFilename(folder)) {
+        throw new Errors.InvalidNameError('invalid element name')
+      }
     }
+    return await ProjectEntityMongoUpdateHandler.promises.mkdirp(
+      projectId,
+      path,
+      userId,
+      { exactCaseMatch: true }
+    )
   }
-  return await ProjectEntityMongoUpdateHandler.promises.mkdirp(
-    projectId,
-    path,
-    { exactCaseMatch: true }
-  )
-})
+)
 
 const addFolder = wrapWithLock(
-  async function (projectId, parentFolderId, folderName) {
+  async function (projectId, parentFolderId, folderName, userId) {
     if (!SafePath.isCleanFilename(folderName)) {
       throw new Errors.InvalidNameError('invalid element name')
     }
     return await ProjectEntityMongoUpdateHandler.promises.addFolder(
       projectId,
       parentFolderId,
-      folderName
+      folderName,
+      userId
     )
   }
 )
@@ -929,7 +935,8 @@ const moveEntity = wrapWithLock(
         projectId,
         entityId,
         destFolderId,
-        entityType
+        entityType,
+        userId
       )
 
     const projectHistoryId = project.overleaf?.history?.id
@@ -988,7 +995,8 @@ const renameEntity = wrapWithLock(
         projectId,
         entityId,
         entityType,
-        newName
+        newName,
+        userId
       )
 
     const projectHistoryId = project.overleaf?.history?.id
@@ -1115,7 +1123,8 @@ const convertDocToFile = wrapWithLock({
       await ProjectEntityMongoUpdateHandler.promises.replaceDocWithFile(
         projectId,
         doc._id,
-        fileRef
+        fileRef,
+        userId
       )
     const projectHistoryId = project.overleaf?.history?.id
     await DocumentUpdaterHandler.promises.updateProjectStructure(
@@ -1274,16 +1283,18 @@ const ProjectEntityUpdateHandler = {
     upsertFile,
     upsertFileWithPath,
     appendToDocWithPath: appendToDoc,
+    setMainBibliographyDoc,
   },
 
-  async _addDocAndSendToTpds(projectId, folderId, doc) {
+  async _addDocAndSendToTpds(projectId, folderId, doc, userId) {
     let result, project
     try {
       ;({ result, project } =
         await ProjectEntityMongoUpdateHandler.promises.addDoc(
           projectId,
           folderId,
-          doc
+          doc,
+          userId
         ))
     } catch (err) {
       throw OError.tag(err, 'error adding file with project', {
@@ -1328,14 +1339,15 @@ const ProjectEntityUpdateHandler = {
     }
   },
 
-  async _addFileAndSendToTpds(projectId, folderId, fileRef) {
+  async _addFileAndSendToTpds(projectId, folderId, fileRef, userId) {
     let result, project
     try {
       ;({ result, project } =
         await ProjectEntityMongoUpdateHandler.promises.addFile(
           projectId,
           folderId,
-          fileRef
+          fileRef,
+          userId
         ))
     } catch (err) {
       throw OError.tag(err, 'error adding file with project', {
@@ -1382,7 +1394,8 @@ const ProjectEntityUpdateHandler = {
     } = await ProjectEntityMongoUpdateHandler.promises.replaceFileWithNew(
       projectId,
       fileId,
-      newFileRef
+      newFileRef,
+      userId
     )
 
     const oldFiles = [
@@ -1410,11 +1423,6 @@ const ProjectEntityUpdateHandler = {
       projectName: project.name,
       folderId,
     })
-    ProjectUpdateHandler.promises
-      .markAsUpdated(projectId, new Date(), userId)
-      .catch(error => {
-        logger.error({ error }, 'failed to mark project as updated')
-      })
 
     await DocumentUpdaterHandler.promises.updateProjectStructure(
       projectId,
@@ -1538,7 +1546,8 @@ const ProjectEntityUpdateHandler = {
           projectId,
           entityId,
           entityType,
-          rename.newName
+          rename.newName,
+          null // unset lastUpdatedBy
         )
 
       // update the renamed entity for the resync
@@ -1618,8 +1627,6 @@ const ProjectEntityUpdateHandler = {
           entry.path,
           userId
         )
-      } else if (entry.type === 'file') {
-        await ProjectEntityUpdateHandler._cleanUpFile(project, entry.entity)
       }
     }
     return subtreeListing
@@ -1670,13 +1677,6 @@ const ProjectEntityUpdateHandler = {
 
     return await DocumentUpdaterHandler.promises.deleteDoc(projectId, docId)
   },
-
-  async _cleanUpFile(project, file) {
-    return await ProjectEntityMongoUpdateHandler.promises._insertDeletedFileReference(
-      project._id,
-      file
-    )
-  },
 }
 
 /**
diff --git a/services/web/app/src/Features/Project/ProjectGetter.js b/services/web/app/src/Features/Project/ProjectGetter.js
index 7edf08d7a2..5b93cdc861 100644
--- a/services/web/app/src/Features/Project/ProjectGetter.js
+++ b/services/web/app/src/Features/Project/ProjectGetter.js
@@ -83,6 +83,9 @@ const ProjectGetter = {
     return project._id
   },
 
+  /**
+   * @return {Promise<any>}
+   */
   async findAllUsersProjects(userId, fields) {
     const CollaboratorsGetter = require('../Collaborators/CollaboratorsGetter')
     const ownedProjects = await Project.find(
diff --git a/services/web/app/src/Features/Project/ProjectHelper.js b/services/web/app/src/Features/Project/ProjectHelper.js
index dc64fbfe1f..ef2e671e85 100644
--- a/services/web/app/src/Features/Project/ProjectHelper.js
+++ b/services/web/app/src/Features/Project/ProjectHelper.js
@@ -20,7 +20,6 @@ module.exports = {
   isArchived,
   isTrashed,
   isArchivedOrTrashed,
-  calculateArchivedArray,
   ensureNameIsUnique,
   getAllowedImagesForUser,
   promises: {
@@ -63,38 +62,6 @@ function isArchivedOrTrashed(project, userId) {
   return isArchived(project, userId) || isTrashed(project, userId)
 }
 
-function _allCollaborators(project) {
-  return _.unionWith(
-    [project.owner_ref],
-    project.collaberator_refs,
-    project.readOnly_refs,
-    project.tokenAccessReadAndWrite_refs,
-    project.tokenAccessReadOnly_refs,
-    _objectIdEquals
-  )
-}
-
-function calculateArchivedArray(project, userId, action) {
-  let archived = project.archived
-  userId = new ObjectId(userId)
-
-  if (archived === true) {
-    archived = _allCollaborators(project)
-  } else if (!archived) {
-    archived = []
-  }
-
-  if (action === 'ARCHIVE') {
-    archived = _.unionWith(archived, [userId], _objectIdEquals)
-  } else if (action === 'UNARCHIVE') {
-    archived = archived.filter(id => !_objectIdEquals(id, userId))
-  } else {
-    throw new Error('Unrecognised action')
-  }
-
-  return archived
-}
-
 function ensureNameIsUnique(nameList, name, suffixes, maxLength, callback) {
   // create a set of all project names
   if (suffixes == null) {
@@ -122,11 +89,6 @@ function ensureNameIsUnique(nameList, name, suffixes, maxLength, callback) {
   }
 }
 
-function _objectIdEquals(firstVal, secondVal) {
-  // For use as a comparator for unionWith
-  return firstVal.toString() === secondVal.toString()
-}
-
 function _addSuffixToProjectName(name, suffix, maxLength) {
   // append the suffix and truncate the project title if needed
   if (suffix == null) {
diff --git a/services/web/app/src/Features/Project/ProjectListController.mjs b/services/web/app/src/Features/Project/ProjectListController.mjs
index 6ae7080961..4c4ed17fb2 100644
--- a/services/web/app/src/Features/Project/ProjectListController.mjs
+++ b/services/web/app/src/Features/Project/ProjectListController.mjs
@@ -21,13 +21,15 @@ import { OError, V1ConnectionError } from '../Errors/Errors.js'
 import { User } from '../../models/User.js'
 import UserPrimaryEmailCheckHandler from '../User/UserPrimaryEmailCheckHandler.js'
 import UserController from '../User/UserController.js'
-import LimitationsManager from '../Subscription/LimitationsManager.js'
 import NotificationsBuilder from '../Notifications/NotificationsBuilder.js'
 import GeoIpLookup from '../../infrastructure/GeoIpLookup.js'
 import SplitTestHandler from '../SplitTests/SplitTestHandler.js'
 import SplitTestSessionHandler from '../SplitTests/SplitTestSessionHandler.js'
-import SubscriptionLocator from '../Subscription/SubscriptionLocator.js'
 import TutorialHandler from '../Tutorial/TutorialHandler.js'
+import SubscriptionHelper from '../Subscription/SubscriptionHelper.js'
+import PermissionsManager from '../Authorization/PermissionsManager.js'
+import SubscriptionLocator from '../Subscription/SubscriptionLocator.js'
+import AnalyticsManager from '../Analytics/AnalyticsManager.js'
 
 /**
  * @import { GetProjectsRequest, GetProjectsResponse, AllUsersProjects, MongoProject } from "./types"
@@ -102,6 +104,8 @@ async function projectListPage(req, res, next) {
   // - undefined - when there's no "saas" feature or couldn't get subscription data
   // - object - the subscription data object
   let usersBestSubscription
+  let usersIndividualSubscription
+  let usersGroupSubscriptions = []
   let survey
   let userIsMemberOfGroupSubscription = false
   let groupSubscriptionsPendingEnrollment = []
@@ -115,8 +119,8 @@ async function projectListPage(req, res, next) {
   })
   const user = await User.findById(
     userId,
-    `email emails features alphaProgram betaProgram lastPrimaryEmailCheck signUpDate${
-      isSaas ? ' enrollment writefull completedTutorials' : ''
+    `email emails features alphaProgram betaProgram lastPrimaryEmailCheck signUpDate refProviders${
+      isSaas ? ' enrollment writefull completedTutorials aiErrorAssistant' : ''
     }`
   )
 
@@ -126,14 +130,19 @@ async function projectListPage(req, res, next) {
     return
   }
 
+  user.refProviders = _.mapValues(user.refProviders, Boolean)
+
   if (isSaas) {
     await SplitTestSessionHandler.promises.sessionMaintenance(req, user)
 
     try {
-      usersBestSubscription =
-        await SubscriptionViewModelBuilder.promises.getBestSubscription({
-          _id: userId,
-        })
+      ;({
+        bestSubscription: usersBestSubscription,
+        individualSubscription: usersIndividualSubscription,
+        memberGroupSubscriptions: usersGroupSubscriptions,
+      } = await SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+        { _id: userId }
+      ))
     } catch (error) {
       logger.err(
         { err: error, userId },
@@ -141,14 +150,11 @@ async function projectListPage(req, res, next) {
       )
     }
     try {
-      const { isMember, subscriptions } =
-        await LimitationsManager.promises.userIsMemberOfGroupSubscription(user)
-
-      userIsMemberOfGroupSubscription = isMember
+      userIsMemberOfGroupSubscription = usersGroupSubscriptions?.length > 0
 
       // TODO use helper function
       if (!user.enrollment?.managedBy) {
-        groupSubscriptionsPendingEnrollment = subscriptions.filter(
+        groupSubscriptionsPendingEnrollment = usersGroupSubscriptions.filter(
           subscription =>
             subscription.groupPlan && subscription.managedUsersEnabled
         )
@@ -312,18 +318,9 @@ async function projectListPage(req, res, next) {
     delete req.session.saml
   }
 
-  function fakeDelay() {
-    return new Promise(resolve => {
-      setTimeout(() => resolve(undefined), 0)
-    })
-  }
-
-  const prefetchedProjectsBlob = await Promise.race([
-    projectsBlobPending,
-    fakeDelay(),
-  ])
+  const prefetchedProjectsBlob = await projectsBlobPending
   Metrics.inc('project-list-prefetch-projects', 1, {
-    status: prefetchedProjectsBlob ? 'success' : 'too-slow',
+    status: prefetchedProjectsBlob ? 'success' : 'error',
   })
 
   // in v2 add notifications for matching university IPs
@@ -395,29 +392,70 @@ async function projectListPage(req, res, next) {
     }
   }
 
-  let hasIndividualRecurlySubscription = false
+  let hasIndividualPaidSubscription = false
 
   try {
-    const individualSubscription =
-      await SubscriptionLocator.promises.getUsersSubscription(userId)
-
-    hasIndividualRecurlySubscription =
-      individualSubscription?.groupPlan === false &&
-      individualSubscription?.recurlyStatus?.state !== 'canceled' &&
-      individualSubscription?.recurlySubscription_id !== ''
+    hasIndividualPaidSubscription =
+      SubscriptionHelper.isIndividualActivePaidSubscription(
+        usersIndividualSubscription
+      )
   } catch (error) {
     logger.error({ err: error }, 'Failed to get individual subscription')
   }
 
-  // Get the user's assignment for the DS unified nav split test, which
-  // populates splitTestVariants with a value for the split test name and allows
-  // Pug to send it to the browser
-  await SplitTestHandler.promises.getAssignment(
-    req,
-    res,
-    'sidebar-navigation-ui-update'
+  const aiAssistNotificationAssignment =
+    await SplitTestHandler.promises.getAssignment(
+      req,
+      res,
+      'ai-assist-notification'
+    )
+
+  let showAiAssistNotification = false
+  if (aiAssistNotificationAssignment.variant !== 'default') {
+    showAiAssistNotification = await _showAiAssistNotification(user)
+  }
+
+  const affiliations = userAffiliations || []
+  const inEnterpriseCommons = affiliations.some(
+    affiliation => affiliation.institution?.enterpriseCommons
   )
 
+  // customer.io: Premium nudge experiment
+  // Only do customer-io-trial-conversion assignment for users not in India/China and not in group/commons
+  let customerIoEnabled = false
+  const aiBlocked = !(await _canUseAIAssist(user))
+  const hasAiAssist = await _userHasAIAssist(user)
+  if (!userIsMemberOfGroupSubscription && !inEnterpriseCommons) {
+    try {
+      const ip = req.ip
+      const { countryCode } = await GeoIpLookup.promises.getCurrencyCode(ip)
+      const excludedCountries = ['IN', 'CN']
+
+      if (!excludedCountries.includes(countryCode)) {
+        const cioAssignment =
+          await SplitTestHandler.promises.getAssignmentForUser(
+            userId,
+            'customer-io-trial-conversion'
+          )
+        if (cioAssignment.variant === 'enabled') {
+          customerIoEnabled = true
+          AnalyticsManager.setUserPropertyForUserInBackground(
+            userId,
+            'customer-io-integration',
+            true
+          )
+        }
+      }
+    } catch (err) {
+      logger.error(
+        { err },
+        'Error checking geo location for customer-io-trial-conversion'
+      )
+      // Fallback to not enabled if geoip fails
+      customerIoEnabled = false
+    }
+  }
+
   res.render('project/list-react', {
     title: 'your_projects',
     usersBestSubscription,
@@ -447,8 +485,12 @@ async function projectListPage(req, res, next) {
         groupId: subscription._id,
         groupName: subscription.teamName,
       })),
-    hasIndividualRecurlySubscription,
+    hasIndividualPaidSubscription,
     userRestrictions: Array.from(req.userRestrictions || []),
+    customerIoEnabled,
+    showAiAssistNotification,
+    aiBlocked,
+    hasAiAssist,
   })
 }
 
@@ -733,6 +775,62 @@ function _hasActiveFilter(filters) {
   )
 }
 
+async function _userHasAIAssist(user) {
+  // Check if the user has AI Assist enabled via Overleaf
+  if (user.features?.aiErrorAssistant) {
+    return true
+  }
+  // Check if the user has AI Assist enabled via Writefull
+  const { isPremium: hasAiAssistViaWritefull } =
+    await UserGetter.promises.getWritefullData(user._id)
+  if (hasAiAssistViaWritefull) {
+    return true
+  }
+  return false
+}
+
+// Determines if user is able to enable AI assist
+// based on their permissions and settings
+// It does NOT determine if the user has AI Assist enabled
+async function _canUseAIAssist(user) {
+  // Check if the assistant has been manually disabled by the user
+  if (user.aiErrorAssistant?.enabled === false) {
+    return false
+  }
+
+  // Check if the user can use AI features (policy check)
+  return await PermissionsManager.promises.checkUserPermissions(user, [
+    'use-ai',
+  ])
+}
+
+async function _showAiAssistNotification(user) {
+  // Check if the assistant has been manually disabled by the user
+  if (user.aiErrorAssistant?.enabled === false) {
+    return false
+  }
+
+  // Check if the user can use AI features (policy check)
+  const canUseAi = await PermissionsManager.promises.checkUserPermissions(
+    user,
+    ['use-ai']
+  )
+  if (!canUseAi) {
+    return false
+  }
+
+  // Check if the user has a subscription with manually collected group admins (#22822)
+  const subscription = await SubscriptionLocator.promises.getUsersSubscription(
+    user._id
+  )
+  if (subscription?.collectionMethod === 'manual') {
+    return false
+  }
+
+  const userHasAiAssist = await _userHasAIAssist(user)
+  return !userHasAiAssist
+}
+
 export default {
   projectListPage: expressify(projectListPage),
   getProjectsJson: expressify(getProjectsJson),
diff --git a/services/web/app/src/Features/Project/ProjectLocator.js b/services/web/app/src/Features/Project/ProjectLocator.js
index c78dac1dbf..2feaa0cebf 100644
--- a/services/web/app/src/Features/Project/ProjectLocator.js
+++ b/services/web/app/src/Features/Project/ProjectLocator.js
@@ -7,6 +7,28 @@ const Errors = require('../Errors/Errors')
 const { promisifyMultiResult } = require('@overleaf/promise-utils')
 const { iterablePaths } = require('./IterablePath')
 
+/**
+ * @param project
+ * @param predicate
+ * @returns {{path: string, value: *}}
+ */
+function findDeep(project, predicate) {
+  function find(value, path) {
+    if (predicate(value)) {
+      return { value, path: path.join('.') }
+    }
+    if (typeof value === 'object' && value !== null) {
+      for (const [childKey, childVal] of Object.entries(value)) {
+        const found = find(childVal, [...path, childKey])
+        if (found) {
+          return found
+        }
+      }
+    }
+  }
+  return find(project.rootFolder, ['rootFolder'])
+}
+
 function findElement(options, _callback) {
   // The search algorithm below potentially invokes the callback multiple
   // times.
@@ -308,6 +330,7 @@ module.exports = {
   findElementByPath,
   findRootDoc,
   findElementByMongoPath,
+  findDeep,
   promises: {
     findElement: promisifyMultiResult(findElement, [
       'element',
diff --git a/services/web/app/src/Features/Project/ProjectOptionsHandler.js b/services/web/app/src/Features/Project/ProjectOptionsHandler.js
index 5ca89ce145..5d0001bcf4 100644
--- a/services/web/app/src/Features/Project/ProjectOptionsHandler.js
+++ b/services/web/app/src/Features/Project/ProjectOptionsHandler.js
@@ -2,6 +2,8 @@ const { Project } = require('../../models/Project')
 const settings = require('@overleaf/settings')
 const { callbackify } = require('util')
 const { db, ObjectId } = require('../../infrastructure/mongodb')
+const Errors = require('../Errors/Errors')
+const { ReturnDocument } = require('mongodb-legacy')
 const safeCompilers = ['xelatex', 'pdflatex', 'latex', 'lualatex']
 
 const ProjectOptionsHandler = {
@@ -22,7 +24,6 @@ const ProjectOptionsHandler = {
     if (!imageName || !Array.isArray(settings.allowedImageNames)) {
       return
     }
-    imageName = imageName.toLowerCase()
     const isAllowed = settings.allowedImageNames.find(
       allowed => imageName === allowed.imageName
     )
@@ -30,7 +31,7 @@ const ProjectOptionsHandler = {
       throw new Error(`invalid imageName: ${imageName}`)
     }
     const conditions = { _id: projectId }
-    const update = { imageName: settings.imageRoot + '/' + imageName }
+    const update = { imageName: imageName }
     return Project.updateOne(conditions, update, {})
   },
 
@@ -73,6 +74,21 @@ const ProjectOptionsHandler = {
     // because rangesSupportEnabled is not part of the schema?
     return db.projects.updateOne(conditions, update)
   },
+
+  async setOTMigrationStage(projectId, nextStage) {
+    const project = await db.projects.findOneAndUpdate(
+      { _id: new ObjectId(projectId) },
+      // Use $max to ensure that we never downgrade the migration stage.
+      { $max: { 'overleaf.history.otMigrationStage': nextStage } },
+      {
+        returnDocument: ReturnDocument.AFTER,
+        projection: { 'overleaf.history.otMigrationStage': 1 },
+      }
+    )
+    if (!project) throw new Errors.NotFoundError('project does not exist')
+    const { otMigrationStage } = project.overleaf.history
+    return { otMigrationStage }
+  },
 }
 
 module.exports = {
diff --git a/services/web/app/src/Features/References/RealTime/RealTimeHandler.mjs b/services/web/app/src/Features/References/RealTime/RealTimeHandler.mjs
new file mode 100644
index 0000000000..3c797a9003
--- /dev/null
+++ b/services/web/app/src/Features/References/RealTime/RealTimeHandler.mjs
@@ -0,0 +1,9 @@
+import Settings from '@overleaf/settings'
+import { fetchJson } from '@overleaf/fetch-utils'
+
+export async function countConnectedClients(projectId) {
+  const url = new URL(Settings.apis.realTime.url)
+  url.pathname = `/project/${projectId}/count-connected-clients`
+  const { nConnectedClients } = await fetchJson(url)
+  return nConnectedClients
+}
diff --git a/services/web/app/src/Features/SplitTests/SplitTestHandler.js b/services/web/app/src/Features/SplitTests/SplitTestHandler.js
index 5dcf00967b..4bd904fdd4 100644
--- a/services/web/app/src/Features/SplitTests/SplitTestHandler.js
+++ b/services/web/app/src/Features/SplitTests/SplitTestHandler.js
@@ -145,16 +145,12 @@ async function hasUserBeenAssignedToVariant(
   ignoreVersion = false
 ) {
   try {
-    const { session, query = {} } = req
+    const { session = {}, query = {} } = req
 
     const splitTest = await _getSplitTest(splitTestName)
     const currentVersion = SplitTestUtils.getCurrentVersion(splitTest)
 
-    if (
-      !userId ||
-      !SessionManager.isUserLoggedIn(session) ||
-      !currentVersion?.active
-    ) {
+    if (!userId || !currentVersion?.active) {
       return false
     }
 
diff --git a/services/web/app/src/Features/StaticPages/HomeController.mjs b/services/web/app/src/Features/StaticPages/HomeController.mjs
index cc7361217d..9b0b0fb563 100644
--- a/services/web/app/src/Features/StaticPages/HomeController.mjs
+++ b/services/web/app/src/Features/StaticPages/HomeController.mjs
@@ -6,6 +6,7 @@ import ErrorController from '../Errors/ErrorController.js'
 import SessionManager from '../Authentication/SessionManager.js'
 import { expressify } from '@overleaf/promise-utils'
 import logger from '@overleaf/logger'
+import SplitTestHandler from '../SplitTests/SplitTestHandler.js'
 
 const __dirname = new URL('.', import.meta.url).pathname
 
@@ -31,7 +32,15 @@ async function home(req, res) {
       page: req.path,
     })
 
-    res.render('external/home/index')
+    const hotjarAssignment = await SplitTestHandler.promises.getAssignment(
+      req,
+      res,
+      'hotjar-marketing'
+    )
+
+    res.render('external/home/index', {
+      shouldLoadHotjar: hotjarAssignment?.variant === 'enabled',
+    })
   } else {
     res.redirect('/login')
   }
diff --git a/services/web/app/src/Features/StaticPages/StaticPagesRouter.mjs b/services/web/app/src/Features/StaticPages/StaticPagesRouter.mjs
index b81e25c7cd..60350505a6 100644
--- a/services/web/app/src/Features/StaticPages/StaticPagesRouter.mjs
+++ b/services/web/app/src/Features/StaticPages/StaticPagesRouter.mjs
@@ -22,11 +22,6 @@ export default {
       HomeController.externalPage('planned_maintenance', 'Planned Maintenance')
     )
 
-    webRouter.get(
-      '/track-changes-and-comments-in-latex',
-      HomeController.externalPage('review-features-page', 'Review features')
-    )
-
     webRouter.get('/university', UniversityController.getIndexPage)
     return webRouter.get('/university/*', UniversityController.getPage)
   },
diff --git a/services/web/app/src/Features/Subscription/AiHelper.js b/services/web/app/src/Features/Subscription/AiHelper.js
new file mode 100644
index 0000000000..3a383f7b07
--- /dev/null
+++ b/services/web/app/src/Features/Subscription/AiHelper.js
@@ -0,0 +1,46 @@
+// @ts-check
+// Initially, this functions lived in PaymentProviderEntities.js,
+// but it was moved to this file to prevent circular dependency issue
+
+const AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE = 'assistant'
+const AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE = 'assistant-annual'
+const AI_ADD_ON_CODE = 'assistant'
+
+/**
+ * Returns whether the given plan code is a standalone AI plan
+ *
+ * @param {string} planCode
+ * @return {boolean}
+ */
+function isStandaloneAiAddOnPlanCode(planCode) {
+  return (
+    planCode === AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE ||
+    planCode === AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE
+  )
+}
+
+/**
+ * Returns whether subscription change will have have the ai bundle once the change is processed
+ *
+ * @param {Object} subscriptionChange The subscription change object coming from payment provider
+ * type should be PaymentProviderSubscriptionChange but if imported here, it creates a circular dependency
+ * TODO: fix this when moved to es modules
+ *
+ * @return {boolean}
+ */
+function subscriptionChangeIsAiAssistUpgrade(subscriptionChange) {
+  return Boolean(
+    isStandaloneAiAddOnPlanCode(subscriptionChange.nextPlanCode) ||
+      subscriptionChange.nextAddOns?.some(
+        addOn => addOn.code === AI_ADD_ON_CODE
+      )
+  )
+}
+
+module.exports = {
+  AI_ADD_ON_CODE,
+  AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE,
+  AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE,
+  isStandaloneAiAddOnPlanCode,
+  subscriptionChangeIsAiAssistUpgrade,
+}
diff --git a/services/web/app/src/Features/Subscription/Errors.js b/services/web/app/src/Features/Subscription/Errors.js
index 53ecf7ba12..ee474fa710 100644
--- a/services/web/app/src/Features/Subscription/Errors.js
+++ b/services/web/app/src/Features/Subscription/Errors.js
@@ -1,3 +1,5 @@
+// @ts-check
+
 const Errors = require('../Errors/Errors')
 const OError = require('@overleaf/o-error')
 
@@ -24,13 +26,50 @@ class InactiveError extends OError {}
 
 class SubtotalLimitExceededError extends OError {}
 
+class HasPastDueInvoiceError extends OError {}
+
+class HasNoAdditionalLicenseWhenManuallyCollectedError extends OError {}
+
+/**
+ * @typedef {Object} PaymentActionRequiredInfo
+ * @property {string} PaymentActionRequiredInfo.clientSecret
+ * @property {string} PaymentActionRequiredInfo.publicKey
+ */
+class PaymentActionRequiredError extends OError {
+  /**
+   * @param {PaymentActionRequiredInfo} info
+   */
+  constructor(info) {
+    super('Payment action required', info)
+  }
+}
+
+/**
+ * @typedef {Object} PaymentFailedInfo
+ * @property {string} PaymentFailedInfo.subscriptionId
+ * @property {string} PaymentFailedInfo.reason
+ * @property {string} PaymentFailedInfo.adviceCode
+ */
+class PaymentFailedError extends OError {
+  /**
+   * @param {PaymentFailedInfo} info
+   */
+  constructor(info) {
+    super('Failed to process payment', info)
+  }
+}
+
 module.exports = {
   RecurlyTransactionError,
   DuplicateAddOnError,
   AddOnNotPresentError,
+  PaymentActionRequiredError,
+  PaymentFailedError,
   MissingBillingInfoError,
   ManuallyCollectedError,
   PendingChangeError,
   InactiveError,
   SubtotalLimitExceededError,
+  HasPastDueInvoiceError,
+  HasNoAdditionalLicenseWhenManuallyCollectedError,
 }
diff --git a/services/web/app/src/Features/Subscription/FeaturesUpdater.js b/services/web/app/src/Features/Subscription/FeaturesUpdater.js
index 1e7a868fc0..c9ecea4dbb 100644
--- a/services/web/app/src/Features/Subscription/FeaturesUpdater.js
+++ b/services/web/app/src/Features/Subscription/FeaturesUpdater.js
@@ -3,6 +3,7 @@ const { callbackify } = require('util')
 const { callbackifyMultiResult } = require('@overleaf/promise-utils')
 const PlansLocator = require('./PlansLocator')
 const SubscriptionLocator = require('./SubscriptionLocator')
+const SubscriptionHelper = require('./SubscriptionHelper')
 const UserFeaturesUpdater = require('./UserFeaturesUpdater')
 const FeaturesHelper = require('./FeaturesHelper')
 const Settings = require('@overleaf/settings')
@@ -14,7 +15,7 @@ const UserGetter = require('../User/UserGetter')
 const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const Queues = require('../../infrastructure/Queues')
 const Modules = require('../../infrastructure/Modules')
-const { AI_ADD_ON_CODE } = require('./RecurlyEntities')
+const { AI_ADD_ON_CODE } = require('./AiHelper')
 
 /**
  * Enqueue a job for refreshing features for the given user
@@ -117,7 +118,10 @@ async function computeFeatures(userId) {
 async function _getIndividualFeatures(userId) {
   const subscription =
     await SubscriptionLocator.promises.getUsersSubscription(userId)
-  if (subscription == null || subscription?.recurlyStatus?.state === 'paused') {
+  if (
+    subscription == null ||
+    SubscriptionHelper.getPaidSubscriptionState(subscription) === 'paused'
+  ) {
     return {}
   }
 
diff --git a/services/web/app/src/Features/Subscription/LimitationsManager.js b/services/web/app/src/Features/Subscription/LimitationsManager.js
index d0c3d29b7b..464a8bc273 100644
--- a/services/web/app/src/Features/Subscription/LimitationsManager.js
+++ b/services/web/app/src/Features/Subscription/LimitationsManager.js
@@ -128,7 +128,11 @@ async function userHasSubscription(user) {
   )
   let hasValidSubscription = false
   if (subscription) {
-    if (subscription.recurlySubscription_id || subscription.customAccount) {
+    if (
+      subscription.recurlySubscription_id ||
+      subscription.paymentProvider?.subscriptionId ||
+      subscription.customAccount
+    ) {
       hasValidSubscription = true
     }
   }
diff --git a/services/web/app/src/Features/Subscription/RecurlyEntities.js b/services/web/app/src/Features/Subscription/PaymentProviderEntities.js
similarity index 50%
rename from services/web/app/src/Features/Subscription/RecurlyEntities.js
rename to services/web/app/src/Features/Subscription/PaymentProviderEntities.js
index 5c6f700b5f..5e64f634de 100644
--- a/services/web/app/src/Features/Subscription/RecurlyEntities.js
+++ b/services/web/app/src/Features/Subscription/PaymentProviderEntities.js
@@ -1,15 +1,19 @@
 // @ts-check
 
+/**
+ * @import { PaymentProvider } from '../../../../types/subscription/dashboard/subscription'
+ * @import { CurrencyCode, StripeCurrencyCode } from '../../../../types/subscription/currency'
+ * @import { AddOn } from '../../../../types/subscription/plan'
+ */
+
 const OError = require('@overleaf/o-error')
 const { DuplicateAddOnError, AddOnNotPresentError } = require('./Errors')
 const PlansLocator = require('./PlansLocator')
 const SubscriptionHelper = require('./SubscriptionHelper')
-
-const AI_ADD_ON_CODE = 'assistant'
+const { AI_ADD_ON_CODE, isStandaloneAiAddOnPlanCode } = require('./AiHelper')
 const MEMBERS_LIMIT_ADD_ON_CODE = 'additional-license'
-const STANDALONE_AI_ADD_ON_CODES = ['assistant', 'assistant-annual']
 
-class RecurlySubscription {
+class PaymentProviderSubscription {
   /**
    * @param {object} props
    * @param {string} props.id
@@ -17,16 +21,26 @@ class RecurlySubscription {
    * @param {string} props.planCode
    * @param {string} props.planName
    * @param {number} props.planPrice
-   * @param {RecurlySubscriptionAddOn[]} [props.addOns]
+   * @param {PaymentProviderSubscriptionAddOn[]} [props.addOns]
    * @param {number} props.subtotal
    * @param {number} [props.taxRate]
    * @param {number} [props.taxAmount]
-   * @param {string} props.currency
+   * // Recurly uses uppercase currency codes, but Stripe uses lowercase
+   * @param {CurrencyCode | StripeCurrencyCode} props.currency
    * @param {number} props.total
    * @param {Date} props.periodStart
    * @param {Date} props.periodEnd
    * @param {string} props.collectionMethod
-   * @param {RecurlySubscriptionChange} [props.pendingChange]
+   * @param {number} [props.netTerms]
+   * @param {string} [props.poNumber]
+   * @param {string} [props.termsAndConditions]
+   * @param {PaymentProviderSubscriptionChange} [props.pendingChange]
+   * @param {PaymentProvider['service']} [props.service]
+   * @param {string} [props.state]
+   * @param {Date|null} [props.trialPeriodStart]
+   * @param {Date|null} [props.trialPeriodEnd]
+   * @param {Date|null} [props.pausePeriodStart]
+   * @param {number|null} [props.remainingPauseCycles]
    */
   constructor(props) {
     this.id = props.id
@@ -38,12 +52,21 @@ class RecurlySubscription {
     this.subtotal = props.subtotal
     this.taxRate = props.taxRate ?? 0
     this.taxAmount = props.taxAmount ?? 0
-    this.currency = props.currency
+    this.currency = props.currency.toUpperCase() // ensure that currency codes are always uppercase
     this.total = props.total
     this.periodStart = props.periodStart
     this.periodEnd = props.periodEnd
     this.collectionMethod = props.collectionMethod
+    this.netTerms = props.netTerms ?? 0
+    this.poNumber = props.poNumber ?? ''
+    this.termsAndConditions = props.termsAndConditions ?? ''
     this.pendingChange = props.pendingChange ?? null
+    this.service = props.service ?? 'recurly'
+    this.state = props.state ?? 'active'
+    this.trialPeriodStart = props.trialPeriodStart ?? null
+    this.trialPeriodEnd = props.trialPeriodEnd ?? null
+    this.pausePeriodStart = props.pausePeriodStart ?? null
+    this.remainingPauseCycles = props.remainingPauseCycles ?? null
   }
 
   /**
@@ -65,6 +88,15 @@ class RecurlySubscription {
     return isStandaloneAiAddOnPlanCode(this.planCode)
   }
 
+  /**
+   * Returns whether this subscription is a group subscription
+   *
+   * @return {boolean}
+   */
+  isGroupSubscription() {
+    return PlansLocator.isGroupPlanCode(this.planCode)
+  }
+
   /**
    * Returns whether this subcription will have the given add-on next billing
    * period.
@@ -86,42 +118,45 @@ class RecurlySubscription {
 
   /**
    * Change this subscription's plan
-   *
-   * @return {RecurlySubscriptionChangeRequest}
+   * @param {string} planCode - the new plan code
+   * @param {number} [quantity] - the quantity of the plan
+   * @param {boolean} [shouldChangeAtTermEnd] - whether the change should be applied at the end of the term
+   * @return {PaymentProviderSubscriptionChangeRequest}
    */
-  getRequestForPlanChange(planCode) {
-    const currentPlan = PlansLocator.findLocalPlanInSettings(this.planCode)
-    if (currentPlan == null) {
-      throw new OError('Unable to find plan in settings', {
-        planCode: this.planCode,
-      })
-    }
-    const newPlan = PlansLocator.findLocalPlanInSettings(planCode)
-    if (newPlan == null) {
-      throw new OError('Unable to find plan in settings', { planCode })
-    }
-    const shouldChangeAtTermEnd = SubscriptionHelper.shouldPlanChangeAtTermEnd(
-      currentPlan,
-      newPlan
-    )
-
-    const changeRequest = new RecurlySubscriptionChangeRequest({
+  getRequestForPlanChange(planCode, quantity, shouldChangeAtTermEnd) {
+    const changeRequest = new PaymentProviderSubscriptionChangeRequest({
       subscription: this,
       timeframe: shouldChangeAtTermEnd ? 'term_end' : 'now',
       planCode,
     })
 
+    if (quantity !== 1) {
+      // Only group plans in Stripe can have larger than 1 quantity
+      // This is because in Stripe, the group plans are configued with per-seat pricing
+      // and the quantity is the number of seats
+      // Setting the members limit add-on quantity accordingly
+      // so it is compitible with Recurly's group plan model (1 base plan + add-on for each member)
+      changeRequest.addOnUpdates = [
+        new PaymentProviderSubscriptionAddOnUpdate({
+          code: MEMBERS_LIMIT_ADD_ON_CODE,
+          quantity,
+        }),
+      ]
+    }
+
     // Carry the AI add-on to the new plan if applicable
     if (
       this.isStandaloneAiAddOn() ||
       (!shouldChangeAtTermEnd && this.hasAddOn(AI_ADD_ON_CODE)) ||
       (shouldChangeAtTermEnd && this.hasAddOnNextPeriod(AI_ADD_ON_CODE))
     ) {
-      const addOnUpdate = new RecurlySubscriptionAddOnUpdate({
+      const addOnUpdate = new PaymentProviderSubscriptionAddOnUpdate({
         code: AI_ADD_ON_CODE,
         quantity: 1,
       })
-      changeRequest.addOnUpdates = [addOnUpdate]
+      changeRequest.addOnUpdates = changeRequest.addOnUpdates
+        ? [...changeRequest.addOnUpdates, addOnUpdate]
+        : [addOnUpdate]
     }
 
     return changeRequest
@@ -133,7 +168,7 @@ class RecurlySubscription {
    * @param {string} code
    * @param {number} [quantity]
    * @param {number} [unitPrice]
-   * @return {RecurlySubscriptionChangeRequest} - the change request to send to
+   * @return {PaymentProviderSubscriptionChangeRequest} - the change request to send to
    * Recurly
    *
    * @throws {DuplicateAddOnError} if the add-on is already present on the subscription
@@ -148,9 +183,9 @@ class RecurlySubscription {
 
     const addOnUpdates = this.addOns.map(addOn => addOn.toAddOnUpdate())
     addOnUpdates.push(
-      new RecurlySubscriptionAddOnUpdate({ code, quantity, unitPrice })
+      new PaymentProviderSubscriptionAddOnUpdate({ code, quantity, unitPrice })
     )
-    return new RecurlySubscriptionChangeRequest({
+    return new PaymentProviderSubscriptionChangeRequest({
       subscription: this,
       timeframe: 'now',
       addOnUpdates,
@@ -162,7 +197,7 @@ class RecurlySubscription {
    *
    * @param {string} code
    * @param {number} quantity
-   * @return {RecurlySubscriptionChangeRequest} - the change request to send to
+   * @return {PaymentProviderSubscriptionChangeRequest} - the change request to send to
    * Recurly
    *
    * @throws {AddOnNotPresentError} if the subscription doesn't have the add-on
@@ -188,7 +223,7 @@ class RecurlySubscription {
       return update
     })
 
-    return new RecurlySubscriptionChangeRequest({
+    return new PaymentProviderSubscriptionChangeRequest({
       subscription: this,
       timeframe: 'now',
       addOnUpdates,
@@ -199,7 +234,7 @@ class RecurlySubscription {
    * Remove an add-on from this subscription
    *
    * @param {string} code
-   * @return {RecurlySubscriptionChangeRequest}
+   * @return {PaymentProviderSubscriptionChangeRequest}
    *
    * @throws {AddOnNotPresentError} if the subscription doesn't have the add-on
    */
@@ -216,30 +251,68 @@ class RecurlySubscription {
     const addOnUpdates = this.addOns
       .filter(addOn => addOn.code !== code)
       .map(addOn => addOn.toAddOnUpdate())
-    return new RecurlySubscriptionChangeRequest({
+    const isInTrial = SubscriptionHelper.isInTrial(this.trialPeriodEnd)
+    return new PaymentProviderSubscriptionChangeRequest({
       subscription: this,
-      timeframe: 'term_end',
+      timeframe: isInTrial ? 'now' : 'term_end',
       addOnUpdates,
     })
   }
 
+  /**
+   * Form a request to revert the plan to it's last saved backup state
+   *
+   * @param {string} previousPlanCode
+   * @param {Array<AddOn> | null} previousAddOns
+   * @return {PaymentProviderSubscriptionChangeRequest}
+   *
+   * @throws {OError} if the restore point plan doesnt exist
+   */
+  getRequestForPlanRevert(previousPlanCode, previousAddOns) {
+    const lastSuccessfulPlan =
+      PlansLocator.findLocalPlanInSettings(previousPlanCode)
+    if (lastSuccessfulPlan == null) {
+      throw new OError('Unable to find plan in settings', { previousPlanCode })
+    }
+    const changeRequest = new PaymentProviderSubscriptionChangeRequest({
+      subscription: this,
+      timeframe: 'now',
+      planCode: previousPlanCode,
+    })
+
+    // defaulting to empty array is important, as that will wipe away any add-ons that were added in the failed payment
+    //  but were not part of the last successful subscription
+    const addOns = []
+    for (const previousAddon of previousAddOns || []) {
+      const addOnUpdate = new PaymentProviderSubscriptionAddOnUpdate({
+        code: previousAddon.addOnCode,
+        quantity: previousAddon.quantity,
+        unitPrice: previousAddon.unitAmountInCents / 100,
+      })
+      addOns.push(addOnUpdate)
+    }
+    changeRequest.addOnUpdates = addOns
+
+    return changeRequest
+  }
+
   /**
    * Upgrade group plan with the plan code provided
    *
    * @param {string} newPlanCode
-   * @return {RecurlySubscriptionChangeRequest}
+   * @return {PaymentProviderSubscriptionChangeRequest}
    */
   getRequestForGroupPlanUpgrade(newPlanCode) {
     // Ensure all the existing add-ons are added to the new plan
     const addOns = this.addOns.map(
       addOn =>
-        new RecurlySubscriptionAddOnUpdate({
+        new PaymentProviderSubscriptionAddOnUpdate({
           code: addOn.code,
           quantity: addOn.quantity,
         })
     )
 
-    return new RecurlySubscriptionChangeRequest({
+    return new PaymentProviderSubscriptionChangeRequest({
       subscription: this,
       timeframe: 'now',
       addOnUpdates: addOns,
@@ -247,6 +320,39 @@ class RecurlySubscription {
     })
   }
 
+  /**
+   * Update the "PO number" and "Terms and conditions" in a subscription
+   *
+   * @param {string} poNumber
+   * @param {string} termsAndConditions
+   * @return {PaymentProviderSubscriptionUpdateRequest} - the update request to send to
+   * Recurly
+   */
+  getRequestForPoNumberAndTermsAndConditionsUpdate(
+    poNumber,
+    termsAndConditions
+  ) {
+    return new PaymentProviderSubscriptionUpdateRequest({
+      subscription: this,
+      poNumber,
+      termsAndConditions,
+    })
+  }
+
+  /**
+   * Update the "Terms and conditions" in a subscription
+   *
+   * @param {string} termsAndConditions
+   * @return {PaymentProviderSubscriptionUpdateRequest} - the update request to send to
+   * Recurly
+   */
+  getRequestForTermsAndConditionsUpdate(termsAndConditions) {
+    return new PaymentProviderSubscriptionUpdateRequest({
+      subscription: this,
+      termsAndConditions,
+    })
+  }
+
   /**
    * Returns whether this subscription is manually collected
    *
@@ -255,12 +361,37 @@ class RecurlySubscription {
   get isCollectionMethodManual() {
     return this.collectionMethod === 'manual'
   }
+
+  /**
+   * Determine if a plan change should be applied at the end of the term
+   *
+   * @param {string} newPlanCode
+   * @returns {boolean}
+   */
+  shouldPlanChangeAtTermEnd(newPlanCode) {
+    const currentPlan = PlansLocator.findLocalPlanInSettings(this.planCode)
+    if (currentPlan == null) {
+      throw new OError('Unable to find plan in settings', {
+        planCode: this.planCode,
+      })
+    }
+    const newPlan = PlansLocator.findLocalPlanInSettings(newPlanCode)
+    if (newPlan == null) {
+      throw new OError('Unable to find plan in settings', { newPlanCode })
+    }
+    const isInTrial = SubscriptionHelper.isInTrial(this.trialPeriodEnd)
+    return SubscriptionHelper.shouldPlanChangeAtTermEnd(
+      currentPlan,
+      newPlan,
+      isInTrial
+    )
+  }
 }
 
 /**
  * An add-on attached to a subscription
  */
-class RecurlySubscriptionAddOn {
+class PaymentProviderSubscriptionAddOn {
   /**
    * @param {object} props
    * @param {string} props.code
@@ -280,7 +411,7 @@ class RecurlySubscriptionAddOn {
    * Return an add-on update that doesn't modify the add-on
    */
   toAddOnUpdate() {
-    return new RecurlySubscriptionAddOnUpdate({
+    return new PaymentProviderSubscriptionAddOnUpdate({
       code: this.code,
       quantity: this.quantity,
       unitPrice: this.unitPrice,
@@ -288,17 +419,33 @@ class RecurlySubscriptionAddOn {
   }
 }
 
-class RecurlySubscriptionChangeRequest {
+class PaymentProviderSubscriptionUpdateRequest {
   /**
    * @param {object} props
-   * @param {RecurlySubscription} props.subscription
+   * @param {PaymentProviderSubscription} props.subscription
+   * @param {string} [props.poNumber]
+   * @param {string} [props.termsAndConditions]
+   */
+  constructor(props) {
+    this.subscription = props.subscription
+    this.poNumber = props.poNumber ?? ''
+    this.termsAndConditions = props.termsAndConditions ?? ''
+  }
+}
+
+class PaymentProviderSubscriptionChangeRequest {
+  /**
+   * @param {object} props
+   * @param {PaymentProviderSubscription} props.subscription
    * @param {"now" | "term_end"} props.timeframe
    * @param {string} [props.planCode]
-   * @param {RecurlySubscriptionAddOnUpdate[]} [props.addOnUpdates]
+   * @param {PaymentProviderSubscriptionAddOnUpdate[]} [props.addOnUpdates]
    */
   constructor(props) {
     if (props.planCode == null && props.addOnUpdates == null) {
-      throw new OError('Invalid RecurlySubscriptionChangeRequest', { props })
+      throw new OError('Invalid PaymentProviderSubscriptionChangeRequest', {
+        props,
+      })
     }
     this.subscription = props.subscription
     this.timeframe = props.timeframe
@@ -307,7 +454,7 @@ class RecurlySubscriptionChangeRequest {
   }
 }
 
-class RecurlySubscriptionAddOnUpdate {
+class PaymentProviderSubscriptionAddOnUpdate {
   /**
    * @param {object} props
    * @param {string} props.code
@@ -316,20 +463,20 @@ class RecurlySubscriptionAddOnUpdate {
    */
   constructor(props) {
     this.code = props.code
-    this.quantity = props.quantity ?? null
+    this.quantity = props.quantity
     this.unitPrice = props.unitPrice ?? null
   }
 }
 
-class RecurlySubscriptionChange {
+class PaymentProviderSubscriptionChange {
   /**
    * @param {object} props
-   * @param {RecurlySubscription} props.subscription
+   * @param {PaymentProviderSubscription} props.subscription
    * @param {string} props.nextPlanCode
    * @param {string} props.nextPlanName
    * @param {number} props.nextPlanPrice
-   * @param {RecurlySubscriptionAddOn[]} props.nextAddOns
-   * @param {RecurlyImmediateCharge} [props.immediateCharge]
+   * @param {PaymentProviderSubscriptionAddOn[]} props.nextAddOns
+   * @param {PaymentProviderImmediateCharge} [props.immediateCharge]
    */
   constructor(props) {
     this.subscription = props.subscription
@@ -339,7 +486,12 @@ class RecurlySubscriptionChange {
     this.nextAddOns = props.nextAddOns
     this.immediateCharge =
       props.immediateCharge ??
-      new RecurlyImmediateCharge({ subtotal: 0, tax: 0, total: 0, discount: 0 })
+      new PaymentProviderImmediateCharge({
+        subtotal: 0,
+        tax: 0,
+        total: 0,
+        discount: 0,
+      })
 
     this.subtotal = this.nextPlanPrice
     for (const addOn of this.nextAddOns) {
@@ -378,7 +530,7 @@ class CreditCardPaymentMethod {
   }
 }
 
-class RecurlyImmediateCharge {
+class PaymentProviderImmediateCharge {
   /**
    * @param {object} props
    * @param {number} props.subtotal
@@ -397,7 +549,7 @@ class RecurlyImmediateCharge {
 /**
  * An add-on configuration, independent of any subscription
  */
-class RecurlyAddOn {
+class PaymentProviderAddOn {
   /**
    * @param {object} props
    * @param {string} props.code
@@ -412,7 +564,7 @@ class RecurlyAddOn {
 /**
  * A plan configuration
  */
-class RecurlyPlan {
+class PaymentProviderPlan {
   /**
    * @param {object} props
    * @param {string} props.code
@@ -425,27 +577,52 @@ class RecurlyPlan {
 }
 
 /**
- * Returns whether the given plan code is a standalone AI plan
- *
- * @param {string} planCode
+ * A coupon in the payment provider
  */
-function isStandaloneAiAddOnPlanCode(planCode) {
-  return STANDALONE_AI_ADD_ON_CODES.includes(planCode)
+class PaymentProviderCoupon {
+  /**
+   * @param {object} props
+   * @param {string} props.code
+   * @param {string} props.name
+   * @param {string} [props.description]
+   */
+  constructor(props) {
+    this.code = props.code
+    this.name = props.name
+    this.description = props.description
+  }
+}
+
+/**
+ * An account in the payment provider
+ */
+class PaymentProviderAccount {
+  /**
+   * @param {object} props
+   * @param {string} props.code
+   * @param {string} props.email
+   * @param {boolean} props.hasPastDueInvoice
+   */
+  constructor(props) {
+    this.code = props.code
+    this.email = props.email
+    this.hasPastDueInvoice = props.hasPastDueInvoice ?? false
+  }
 }
 
 module.exports = {
-  AI_ADD_ON_CODE,
   MEMBERS_LIMIT_ADD_ON_CODE,
-  STANDALONE_AI_ADD_ON_CODES,
-  RecurlySubscription,
-  RecurlySubscriptionAddOn,
-  RecurlySubscriptionChange,
-  RecurlySubscriptionChangeRequest,
-  RecurlySubscriptionAddOnUpdate,
+  PaymentProviderSubscription,
+  PaymentProviderSubscriptionAddOn,
+  PaymentProviderSubscriptionChange,
+  PaymentProviderSubscriptionChangeRequest,
+  PaymentProviderSubscriptionUpdateRequest,
+  PaymentProviderSubscriptionAddOnUpdate,
   PaypalPaymentMethod,
   CreditCardPaymentMethod,
-  RecurlyAddOn,
-  RecurlyPlan,
-  isStandaloneAiAddOnPlanCode,
-  RecurlyImmediateCharge,
+  PaymentProviderAddOn,
+  PaymentProviderPlan,
+  PaymentProviderCoupon,
+  PaymentProviderAccount,
+  PaymentProviderImmediateCharge,
 }
diff --git a/services/web/app/src/Features/Subscription/PlansLocator.js b/services/web/app/src/Features/Subscription/PlansLocator.js
index 937d2d3ccb..98bb5ddf7a 100644
--- a/services/web/app/src/Features/Subscription/PlansLocator.js
+++ b/services/web/app/src/Features/Subscription/PlansLocator.js
@@ -1,10 +1,15 @@
-// TODO: This file may be deleted when Stripe is fully implemented to all users, so, consider deleting it
+// @ts-check
+
 const Settings = require('@overleaf/settings')
 const logger = require('@overleaf/logger')
 
 /**
  * @typedef {import('../../../../types/subscription/plan').RecurlyPlanCode} RecurlyPlanCode
  * @typedef {import('../../../../types/subscription/plan').StripeLookupKey} StripeLookupKey
+ * @typedef {import('../../../../types/subscription/plan').StripeBaseLookupKey} StripeBaseLookupKey
+ * @typedef {import('../../../../types/subscription/plan').Plan} Plan
+ * @typedef {import('../../../../types/subscription/currency').StripeCurrencyCode} StripeCurrencyCode
+ * @typedef {import('stripe').Stripe.Price.Recurring.Interval} BillingCycleInterval
  */
 
 function ensurePlansAreSetupCorrectly() {
@@ -24,51 +29,105 @@ function ensurePlansAreSetupCorrectly() {
   })
 }
 
-const recurlyPlanCodeToStripeLookupKey = {
-  'professional-annual': 'professional_annual',
-  professional: 'professional_monthly',
-  professional_free_trial_7_days: 'professional_monthly',
-  'collaborator-annual': 'standard_annual',
+/**
+ * @type {Record<RecurlyPlanCode, StripeBaseLookupKey>}
+ */
+const recurlyCodeToStripeBaseLookupKey = {
   collaborator: 'standard_monthly',
+  'collaborator-annual': 'standard_annual',
   collaborator_free_trial_7_days: 'standard_monthly',
-  'student-annual': 'student_annual',
+
+  professional: 'professional_monthly',
+  'professional-annual': 'professional_annual',
+  professional_free_trial_7_days: 'professional_monthly',
+
   student: 'student_monthly',
+  'student-annual': 'student_annual',
   student_free_trial_7_days: 'student_monthly',
+
+  // TODO: change all group plans' lookup_keys to match the UK account after they have been added
+  group_collaborator: 'group_standard_enterprise',
+  group_collaborator_educational: 'group_standard_educational',
+  group_professional: 'group_professional_enterprise',
+  group_professional_educational: 'group_professional_educational',
+
+  assistant: 'assistant_monthly',
+  'assistant-annual': 'assistant_annual',
+}
+
+const LATEST_STRIPE_LOOKUP_KEY_VERSION = 'jun2025'
+
+/**
+ * Build the Stripe lookup key, will be in this format:
+ * `${productCode}_${billingInterval}_${latestVersion}_${currency}`
+ * (for example: 'assistant_annual_jun2025_clp')
+ *
+ * @param {RecurlyPlanCode} recurlyCode
+ * @param {StripeCurrencyCode} currency
+ * @param {BillingCycleInterval} [billingCycleInterval] -- needed for handling 'assistant' add-on
+ * @returns {StripeLookupKey|null}
+ */
+function buildStripeLookupKey(recurlyCode, currency, billingCycleInterval) {
+  let stripeBaseLookupKey = recurlyCodeToStripeBaseLookupKey[recurlyCode]
+
+  // Recurly always uses 'assistant' as the code regardless of the subscription duration
+  if (recurlyCode === 'assistant' && billingCycleInterval) {
+    if (billingCycleInterval === 'month') {
+      stripeBaseLookupKey = 'assistant_monthly'
+    }
+    if (billingCycleInterval === 'year') {
+      stripeBaseLookupKey = 'assistant_annual'
+    }
+  }
+
+  if (stripeBaseLookupKey == null) {
+    return null
+  }
+
+  return `${stripeBaseLookupKey}_${LATEST_STRIPE_LOOKUP_KEY_VERSION}_${currency}`
 }
 
 /**
- *
- * @param {RecurlyPlanCode} recurlyPlanCode
- * @returns {StripeLookupKey}
+ * @typedef {{ planType: 'individual' | 'group' | 'student' | null, period: 'annual' | 'monthly' }} PlanTypeAndPeriod
+ * @type {Record<RecurlyPlanCode, PlanTypeAndPeriod>}
  */
-function mapRecurlyPlanCodeToStripeLookupKey(recurlyPlanCode) {
-  return recurlyPlanCodeToStripeLookupKey[recurlyPlanCode]
-}
-
 const recurlyPlanCodeToPlanTypeAndPeriod = {
-  collaborator: { planType: 'standard', period: 'monthly' },
-  collaborator_free_trial_7_days: { planType: 'standard', period: 'monthly' },
-  'collaborator-annual': { planType: 'standard', period: 'annual' },
-  professional: { planType: 'professional', period: 'monthly' },
+  collaborator: { planType: 'individual', period: 'monthly' },
+  'collaborator-annual': { planType: 'individual', period: 'annual' },
+  collaborator_free_trial_7_days: { planType: 'individual', period: 'monthly' },
+
+  professional: { planType: 'individual', period: 'monthly' },
+  'professional-annual': { planType: 'individual', period: 'annual' },
   professional_free_trial_7_days: {
-    planType: 'professional',
+    planType: 'individual',
     period: 'monthly',
   },
-  'professional-annual': { planType: 'professional', period: 'annual' },
+
   student: { planType: 'student', period: 'monthly' },
-  student_free_trial_7_days: { planType: 'student', period: 'monthly' },
   'student-annual': { planType: 'student', period: 'annual' },
+  student_free_trial_7_days: { planType: 'student', period: 'monthly' },
+
+  group_collaborator: { planType: 'group', period: 'annual' },
+  group_collaborator_educational: { planType: 'group', period: 'annual' },
+  group_professional: { planType: 'group', period: 'annual' },
+  group_professional_educational: { planType: 'group', period: 'annual' },
+
+  assistant: { planType: null, period: 'monthly' },
+  'assistant-annual': { planType: null, period: 'annual' },
 }
 
 /**
- *
  * @param {RecurlyPlanCode} recurlyPlanCode
- * @returns {{ planType: 'standard' | 'professional' | 'student', period: 'annual' | 'monthly'}}
+ * @returns {PlanTypeAndPeriod}
  */
 function getPlanTypeAndPeriodFromRecurlyPlanCode(recurlyPlanCode) {
   return recurlyPlanCodeToPlanTypeAndPeriod[recurlyPlanCode]
 }
 
+/**
+ * @param {string|null} [planCode]
+ * @returns {Plan|null}
+ */
 function findLocalPlanInSettings(planCode) {
   for (const plan of Settings.plans) {
     if (plan.planCode === planCode) {
@@ -78,9 +137,47 @@ function findLocalPlanInSettings(planCode) {
   return null
 }
 
+/**
+ * Returns whether the given plan code is a group plan
+ *
+ * @param {string} planCode
+ */
+function isGroupPlanCode(planCode) {
+  return planCode.includes('group')
+}
+
+/**
+ * Adapts a legacy Recurly group plan code (e.g., `group_professional_5_educational`)
+ * into its corresponding Stripe-compatible plan code (e.g., `group_professional_educational`),
+ * extracting the license quantity where applicable.
+ *
+ *  @param {RecurlyPlanCode} planCode
+ * @returns {{ planCode: RecurlyPlanCode, quantity: number }}
+ */
+function convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded(
+  planCode
+) {
+  const pattern =
+    /^group_(collaborator|professional)_(2|3|4|5|10|20|50)_(educational|enterprise)$/
+
+  const match = planCode.match(pattern)
+  if (match == null) {
+    return { planCode, quantity: 1 }
+  }
+
+  const [, tier, size, usage] = match
+  const newPlanCode = /** @type {RecurlyPlanCode} */ (
+    usage === 'enterprise' ? `group_${tier}` : `group_${tier}_${usage}`
+  )
+
+  return { planCode: newPlanCode, quantity: Number(size) }
+}
+
 module.exports = {
   ensurePlansAreSetupCorrectly,
   findLocalPlanInSettings,
-  mapRecurlyPlanCodeToStripeLookupKey,
+  buildStripeLookupKey,
   getPlanTypeAndPeriodFromRecurlyPlanCode,
+  isGroupPlanCode,
+  convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded,
 }
diff --git a/services/web/app/src/Features/Subscription/RecurlyClient.js b/services/web/app/src/Features/Subscription/RecurlyClient.js
index 7bd7d1f3b2..2031f50392 100644
--- a/services/web/app/src/Features/Subscription/RecurlyClient.js
+++ b/services/web/app/src/Features/Subscription/RecurlyClient.js
@@ -7,37 +7,68 @@ const OError = require('@overleaf/o-error')
 const { callbackify } = require('util')
 const UserGetter = require('../User/UserGetter')
 const {
-  RecurlySubscription,
-  RecurlySubscriptionAddOn,
-  RecurlySubscriptionChange,
+  PaymentProviderSubscription,
+  PaymentProviderSubscriptionAddOn,
+  PaymentProviderSubscriptionChange,
   PaypalPaymentMethod,
   CreditCardPaymentMethod,
-  RecurlyAddOn,
-  RecurlyPlan,
-  RecurlyImmediateCharge,
-} = require('./RecurlyEntities')
+  PaymentProviderAddOn,
+  PaymentProviderPlan,
+  PaymentProviderCoupon,
+  PaymentProviderAccount,
+  PaymentProviderImmediateCharge,
+} = require('./PaymentProviderEntities')
 const {
   MissingBillingInfoError,
   SubtotalLimitExceededError,
 } = require('./Errors')
+const RecurlyMetrics = require('./RecurlyMetrics')
 
 /**
- * @import { RecurlySubscriptionChangeRequest } from './RecurlyEntities'
+ * @import { PaymentProviderSubscriptionChangeRequest } from './PaymentProviderEntities'
+ * @import { PaymentProviderSubscriptionUpdateRequest } from './PaymentProviderEntities'
  * @import { PaymentMethod } from './types'
+ * @import { CurrencyCode } from '../../../../types/subscription/currency'
  */
 
+class RecurlyClientWithErrorHandling extends recurly.Client {
+  /**
+   * @param {import('recurly/lib/recurly/Http').Response} response
+   * @return {Error | null}
+   * @private
+   */
+  _errorFromResponse(response) {
+    RecurlyMetrics.recordMetrics(
+      response.status,
+      response.rateLimit,
+      response.rateLimitRemaining,
+      response.rateLimitReset.getTime()
+    )
+    // @ts-ignore
+    return super._errorFromResponse(response)
+  }
+}
+
 const recurlySettings = Settings.apis.recurly
 const recurlyApiKey = recurlySettings ? recurlySettings.apiKey : undefined
 
-const client = new recurly.Client(recurlyApiKey)
+const client = new RecurlyClientWithErrorHandling(recurlyApiKey)
 
+/**
+ * Get account for a given user
+ *
+ * @param {string} userId
+ * @return {Promise<PaymentProviderAccount | null>}
+ */
 async function getAccountForUserId(userId) {
   try {
-    return await client.getAccount(`code-${userId}`)
+    const account = await client.getAccount(`code-${userId}`)
+    return accountFromApi(account)
   } catch (err) {
     if (err instanceof recurly.errors.NotFoundError) {
       // An expected error, we don't need to handle it, just return nothing
       logger.debug({ userId }, 'no recurly account found for user')
+      return null
     } else {
       throw err
     }
@@ -62,11 +93,76 @@ async function createAccountForUserId(userId) {
   return account
 }
 
+/**
+ * Get active coupons for a given user
+ *
+ * @param {string} userId
+ * @return {Promise<PaymentProviderCoupon[]>}
+ */
+async function getActiveCouponsForUserId(userId) {
+  try {
+    const redemptions = await client.listActiveCouponRedemptions(
+      `code-${userId}`
+    )
+
+    const coupons = []
+    for await (const redemption of redemptions.each()) {
+      coupons.push(couponFromApi(redemption))
+    }
+
+    return coupons
+  } catch (err) {
+    // An expected error if no coupons have been redeemed
+    if (err instanceof recurly.errors.NotFoundError) {
+      return []
+    } else {
+      throw err
+    }
+  }
+}
+
+/**
+ * Get hosted customer management link
+ *
+ * @param {string} userId
+ * @param {string} pageType
+ * @return {Promise<string|null>}
+ */
+async function getCustomerManagementLink(userId, pageType) {
+  try {
+    const account = await client.getAccount(`code-${userId}`)
+    const recurlySubdomain = Settings.apis.recurly.subdomain
+    const hostedLoginToken = account.hostedLoginToken
+    if (!hostedLoginToken) {
+      throw new OError('recurly account does not have hosted login token')
+    }
+    let path = ''
+    if (pageType === 'billing-details') {
+      path = 'billing_info/edit?ht='
+    }
+    return [
+      'https://',
+      recurlySubdomain,
+      '.recurly.com/account/',
+      path,
+      hostedLoginToken,
+    ].join('')
+  } catch (err) {
+    if (err instanceof recurly.errors.NotFoundError) {
+      // An expected error, we don't need to handle it, just return nothing
+      logger.debug({ userId }, 'no recurly account found for user')
+      return null
+    } else {
+      throw err
+    }
+  }
+}
+
 /**
  * Get a subscription from Recurly
  *
  * @param {string} subscriptionId
- * @return {Promise<RecurlySubscription>}
+ * @return {Promise<PaymentProviderSubscription>}
  */
 async function getSubscription(subscriptionId) {
   const subscription = await client.getSubscription(`uuid-${subscriptionId}`)
@@ -80,7 +176,7 @@ async function getSubscription(subscriptionId) {
  * error if the user has more than one subscription.
  *
  * @param {string} userId
- * @return {Promise<RecurlySubscription | null>}
+ * @return {Promise<PaymentProviderSubscription | null>}
  */
 async function getSubscriptionForUser(userId) {
   try {
@@ -113,9 +209,31 @@ async function getSubscriptionForUser(userId) {
 }
 
 /**
- * Request a susbcription change from Recurly
+ * Request a subscription update from Recurly
  *
- * @param {RecurlySubscriptionChangeRequest} changeRequest
+ * @param {PaymentProviderSubscriptionUpdateRequest} updateRequest
+ */
+async function updateSubscriptionDetails(updateRequest) {
+  const body = subscriptionUpdateRequestToApi(updateRequest)
+
+  const updatedSubscription = await client.updateSubscription(
+    `uuid-${updateRequest.subscription.id}`,
+    body
+  )
+
+  logger.debug(
+    {
+      subscriptionId: updateRequest.subscription.id,
+      updateId: updatedSubscription.id,
+    },
+    'updated subscription'
+  )
+}
+
+/**
+ * Request a subscription change from Recurly
+ *
+ * @param {PaymentProviderSubscriptionChangeRequest} changeRequest
  */
 async function applySubscriptionChangeRequest(changeRequest) {
   const body = subscriptionChangeRequestToApi(changeRequest)
@@ -155,8 +273,8 @@ async function applySubscriptionChangeRequest(changeRequest) {
 /**
  * Preview a subscription change
  *
- * @param {RecurlySubscriptionChangeRequest} changeRequest
- * @return {Promise<RecurlySubscriptionChange>}
+ * @param {PaymentProviderSubscriptionChangeRequest} changeRequest
+ * @return {Promise<PaymentProviderSubscriptionChange>}
  */
 async function previewSubscriptionChange(changeRequest) {
   const body = subscriptionChangeRequestToApi(changeRequest)
@@ -265,7 +383,7 @@ async function getPaymentMethod(userId) {
  *
  * @param {string} planCode
  * @param {string} addOnCode
- * @return {Promise<RecurlyAddOn>}
+ * @return {Promise<PaymentProviderAddOn>}
  */
 async function getAddOn(planCode, addOnCode) {
   const addOn = await client.getPlanAddOn(
@@ -279,7 +397,7 @@ async function getAddOn(planCode, addOnCode) {
  * Get the configuration for a given plan
  *
  * @param {string} planCode
- * @return {Promise<RecurlyPlan>}
+ * @return {Promise<PaymentProviderPlan>}
  */
 async function getPlan(planCode) {
   const plan = await client.getPlan(`code-${planCode}`)
@@ -292,10 +410,48 @@ function subscriptionIsCanceledOrExpired(subscription) {
 }
 
 /**
- * Build a RecurlySubscription from Recurly API data
+ * Build a PaymentProviderAccount from Recurly API data
+ *
+ * @param {recurly.Account} apiAccount
+ * @return {PaymentProviderAccount}
+ */
+function accountFromApi(apiAccount) {
+  if (apiAccount.code == null || apiAccount.email == null) {
+    throw new OError('Invalid Recurly account', {
+      account: apiAccount,
+    })
+  }
+  return new PaymentProviderAccount({
+    code: apiAccount.code,
+    email: apiAccount.email,
+    hasPastDueInvoice: apiAccount.hasPastDueInvoice ?? false,
+  })
+}
+
+/**
+ * Build a PaymentProviderCoupon from Recurly API data
+ *
+ * @param {recurly.CouponRedemption} apiRedemption
+ * @return {PaymentProviderCoupon}
+ */
+function couponFromApi(apiRedemption) {
+  if (apiRedemption.coupon == null || apiRedemption.coupon.code == null) {
+    throw new OError('Invalid Recurly coupon', {
+      coupon: apiRedemption,
+    })
+  }
+  return new PaymentProviderCoupon({
+    code: apiRedemption.coupon.code,
+    name: apiRedemption.coupon.name ?? '',
+    description: apiRedemption.coupon.hostedPageDescription ?? '',
+  })
+}
+
+/**
+ * Build a PaymentProviderSubscription from Recurly API data
  *
  * @param {recurly.Subscription} apiSubscription
- * @return {RecurlySubscription}
+ * @return {PaymentProviderSubscription}
  */
 function subscriptionFromApi(apiSubscription) {
   if (
@@ -311,14 +467,18 @@ function subscriptionFromApi(apiSubscription) {
     apiSubscription.currency == null ||
     apiSubscription.currentPeriodStartedAt == null ||
     apiSubscription.currentPeriodEndsAt == null ||
-    apiSubscription.collectionMethod == null
+    apiSubscription.collectionMethod == null ||
+    apiSubscription.netTerms == null ||
+    // The values below could be null initially if the subscription has never updated
+    !('poNumber' in apiSubscription) ||
+    !('termsAndConditions' in apiSubscription)
   ) {
     throw new OError('Invalid Recurly subscription', {
       subscription: apiSubscription,
     })
   }
 
-  const subscription = new RecurlySubscription({
+  const subscription = new PaymentProviderSubscription({
     id: apiSubscription.uuid,
     userId: apiSubscription.account.code,
     planCode: apiSubscription.plan.code,
@@ -329,10 +489,19 @@ function subscriptionFromApi(apiSubscription) {
     taxRate: apiSubscription.taxInfo?.rate ?? 0,
     taxAmount: apiSubscription.tax ?? 0,
     total: apiSubscription.total,
-    currency: apiSubscription.currency,
+    currency: /** @type {CurrencyCode} */ (apiSubscription.currency),
     periodStart: apiSubscription.currentPeriodStartedAt,
     periodEnd: apiSubscription.currentPeriodEndsAt,
     collectionMethod: apiSubscription.collectionMethod,
+    netTerms: apiSubscription.netTerms ?? 0,
+    poNumber: apiSubscription.poNumber ?? '',
+    termsAndConditions: apiSubscription.termsAndConditions ?? '',
+    service: 'recurly',
+    state: apiSubscription.state ?? 'active',
+    trialPeriodStart: apiSubscription.trialStartedAt,
+    trialPeriodEnd: apiSubscription.trialEndsAt,
+    pausePeriodStart: apiSubscription.pausedAt,
+    remainingPauseCycles: apiSubscription.remainingPauseCycles,
   })
 
   if (apiSubscription.pendingChange != null) {
@@ -346,10 +515,10 @@ function subscriptionFromApi(apiSubscription) {
 }
 
 /**
- * Build a RecurlySubscriptionAddOn from Recurly API data
+ * Build a PaymentProviderSubscriptionAddOn from Recurly API data
  *
  * @param {recurly.SubscriptionAddOn} addOn
- * @return {RecurlySubscriptionAddOn}
+ * @return {PaymentProviderSubscriptionAddOn}
  */
 function subscriptionAddOnFromApi(addOn) {
   if (
@@ -361,7 +530,7 @@ function subscriptionAddOnFromApi(addOn) {
     throw new OError('Invalid Recurly add-on', { addOn })
   }
 
-  return new RecurlySubscriptionAddOn({
+  return new PaymentProviderSubscriptionAddOn({
     code: addOn.addOn.code,
     name: addOn.addOn.name,
     quantity: addOn.quantity ?? 1,
@@ -370,11 +539,11 @@ function subscriptionAddOnFromApi(addOn) {
 }
 
 /**
- * Build a RecurlySubscriptionChange from Recurly API data
+ * Build a PaymentProviderSubscriptionChange from Recurly API data
  *
- * @param {RecurlySubscription} subscription - the current subscription
+ * @param {PaymentProviderSubscription} subscription - the current subscription
  * @param {recurly.SubscriptionChange} subscriptionChange - the subscription change returned from the API
- * @return {RecurlySubscriptionChange}
+ * @return {PaymentProviderSubscriptionChange}
  */
 function subscriptionChangeFromApi(subscription, subscriptionChange) {
   if (
@@ -391,7 +560,7 @@ function subscriptionChangeFromApi(subscription, subscriptionChange) {
     subscriptionAddOnFromApi
   )
 
-  return new RecurlySubscriptionChange({
+  return new PaymentProviderSubscriptionChange({
     subscription,
     nextPlanCode: subscriptionChange.plan.code,
     nextPlanName: subscriptionChange.plan.name,
@@ -405,7 +574,7 @@ function subscriptionChangeFromApi(subscription, subscriptionChange) {
  * Compute immediate charge based on invoice collection
  *
  * @param {recurly.SubscriptionChange} subscriptionChange - the subscription change returned from the API
- * @return {RecurlyImmediateCharge}
+ * @return {PaymentProviderImmediateCharge}
  */
 function computeImmediateCharge(subscriptionChange) {
   const roundToTwoDecimal = (/** @type {number} */ num) =>
@@ -425,7 +594,7 @@ function computeImmediateCharge(subscriptionChange) {
     tax = roundToTwoDecimal(tax + (creditInvoice.tax ?? 0))
     discount = roundToTwoDecimal(discount + (creditInvoice.discount ?? 0))
   }
-  return new RecurlyImmediateCharge({
+  return new PaymentProviderImmediateCharge({
     subtotal,
     total,
     tax,
@@ -459,41 +628,41 @@ function paymentMethodFromApi(billingInfo) {
 }
 
 /**
- * Build a RecurlyAddOn from Recurly API data
+ * Build a PaymentProviderAddOn from Recurly API data
  *
  * @param {recurly.AddOn} addOn
- * @return {RecurlyAddOn}
+ * @return {PaymentProviderAddOn}
  */
 function addOnFromApi(addOn) {
   if (addOn.code == null || addOn.name == null) {
     throw new OError('Invalid Recurly add-on', { addOn })
   }
-  return new RecurlyAddOn({
+  return new PaymentProviderAddOn({
     code: addOn.code,
     name: addOn.name,
   })
 }
 
 /**
- * Build a RecurlyPlan from Recurly API data
+ * Build a PaymentProviderPlan from Recurly API data
  *
  * @param {recurly.Plan} plan
- * @return {RecurlyPlan}
+ * @return {PaymentProviderPlan}
  */
 function planFromApi(plan) {
   if (plan.code == null || plan.name == null) {
     throw new OError('Invalid Recurly add-on', { plan })
   }
-  return new RecurlyPlan({
+  return new PaymentProviderPlan({
     code: plan.code,
     name: plan.name,
   })
 }
 
 /**
- * Build an API request from a RecurlySubscriptionChangeRequest
+ * Build an API request from a PaymentProviderSubscriptionChangeRequest
  *
- * @param {RecurlySubscriptionChangeRequest} changeRequest
+ * @param {PaymentProviderSubscriptionChangeRequest} changeRequest
  * @return {recurly.SubscriptionChangeCreate}
  */
 function subscriptionChangeRequestToApi(changeRequest) {
@@ -520,14 +689,79 @@ function subscriptionChangeRequestToApi(changeRequest) {
   return requestBody
 }
 
+/**
+ * Build an API request from a PaymentProviderSubscriptionUpdateRequest
+ *
+ * @param {PaymentProviderSubscriptionUpdateRequest} updateRequest
+ */
+function subscriptionUpdateRequestToApi(updateRequest) {
+  const requestBody = {}
+  if (updateRequest.poNumber) {
+    requestBody.poNumber = updateRequest.poNumber
+  }
+  if (updateRequest.termsAndConditions) {
+    requestBody.termsAndConditions = updateRequest.termsAndConditions
+  }
+  return requestBody
+}
+
+/**
+ * Retrieves a list of failed invoices for a given Recurly subscription ID.
+ *
+ * @async
+ * @function
+ * @param {string} subscriptionId - The ID of the Recurly subscription to fetch failed invoices for.
+ * @returns {Promise<Array<recurly.Invoice>>} A promise that resolves to an array of failed invoice objects.
+ */
+async function getPastDueInvoices(subscriptionId) {
+  const failed = []
+  const invoices = client.listSubscriptionInvoices(`uuid-${subscriptionId}`, {
+    params: { state: 'past_due' },
+  })
+
+  for await (const invoice of invoices.each()) {
+    failed.push(invoice)
+  }
+  return failed
+}
+
+/**
+ * Marks an invoice as failed using the Recurly client.
+ *
+ * @async
+ * @function failInvoice
+ * @param {string} invoiceId - The ID of the invoice to be marked as failed.
+ * @returns {Promise<void>} Resolves when the invoice has been successfully marked as failed.
+ */
+async function failInvoice(invoiceId) {
+  await client.markInvoiceFailed(invoiceId)
+}
+
+async function terminateSubscriptionByUuid(subscriptionUuid) {
+  const subscription = await client.terminateSubscription(
+    'uuid-' + subscriptionUuid,
+    {
+      body: {
+        refund: 'none',
+      },
+    }
+  )
+
+  logger.debug({ subscriptionUuid }, 'subscription terminated')
+
+  return subscription
+}
+
 module.exports = {
   errors: recurly.errors,
 
   getAccountForUserId: callbackify(getAccountForUserId),
   createAccountForUserId: callbackify(createAccountForUserId),
+  getActiveCouponsForUserId: callbackify(getActiveCouponsForUserId),
   getSubscription: callbackify(getSubscription),
   getSubscriptionForUser: callbackify(getSubscriptionForUser),
   previewSubscriptionChange: callbackify(previewSubscriptionChange),
+  updateSubscriptionDetails: callbackify(updateSubscriptionDetails),
   applySubscriptionChangeRequest: callbackify(applySubscriptionChangeRequest),
   removeSubscriptionChange: callbackify(removeSubscriptionChange),
   removeSubscriptionChangeByUuid: callbackify(removeSubscriptionChangeByUuid),
@@ -539,13 +773,19 @@ module.exports = {
   subscriptionIsCanceledOrExpired,
   pauseSubscriptionByUuid: callbackify(pauseSubscriptionByUuid),
   resumeSubscriptionByUuid: callbackify(resumeSubscriptionByUuid),
+  getPastDueInvoices: callbackify(getPastDueInvoices),
+  failInvoice: callbackify(failInvoice),
+  terminateSubscriptionByUuid: callbackify(terminateSubscriptionByUuid),
 
   promises: {
     getSubscription,
     getSubscriptionForUser,
     getAccountForUserId,
     createAccountForUserId,
+    getActiveCouponsForUserId,
+    getCustomerManagementLink,
     previewSubscriptionChange,
+    updateSubscriptionDetails,
     applySubscriptionChangeRequest,
     removeSubscriptionChange,
     removeSubscriptionChangeByUuid,
@@ -556,5 +796,8 @@ module.exports = {
     getPaymentMethod,
     getAddOn,
     getPlan,
+    getPastDueInvoices,
+    failInvoice,
+    terminateSubscriptionByUuid,
   },
 }
diff --git a/services/web/app/src/Features/Subscription/RecurlyEventHandler.js b/services/web/app/src/Features/Subscription/RecurlyEventHandler.js
index 906e1258ea..c131ee10ec 100644
--- a/services/web/app/src/Features/Subscription/RecurlyEventHandler.js
+++ b/services/web/app/src/Features/Subscription/RecurlyEventHandler.js
@@ -1,7 +1,7 @@
 const SplitTestHandler = require('../SplitTests/SplitTestHandler')
 const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const SubscriptionEmailHandler = require('./SubscriptionEmailHandler')
-const { AI_ADD_ON_CODE } = require('./RecurlyEntities')
+const { AI_ADD_ON_CODE } = require('./AiHelper')
 const { ObjectId } = require('mongodb-legacy')
 
 const INVOICE_SUBSCRIPTION_LIMIT = 10
@@ -12,6 +12,16 @@ async function sendRecurlyAnalyticsEvent(event, eventData) {
     return
   }
 
+  const customerIoEnabled =
+    await SplitTestHandler.promises.hasUserBeenAssignedToVariant(
+      {},
+      userId,
+      'customer-io-trial-conversion',
+      'enabled',
+      true
+    )
+  eventData['customerio-integration'] = customerIoEnabled || false
+
   switch (event) {
     case 'new_subscription_notification':
       await _sendSubscriptionStartedEvent(userId, eventData)
@@ -66,6 +76,8 @@ async function _sendSubscriptionResumedEvent(userId, eventData) {
     {
       plan_code: planCode,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -87,6 +99,8 @@ async function _sendSubscriptionPausedEvent(userId, eventData) {
       pause_length: pauseLength,
       plan_code: planCode,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -108,6 +122,8 @@ async function _sendSubscriptionStartedEvent(userId, eventData) {
       is_trial: isTrial,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -154,6 +170,8 @@ async function _sendSubscriptionUpdatedEvent(userId, eventData) {
       is_trial: isTrial,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -185,6 +203,8 @@ async function _sendSubscriptionCancelledEvent(userId, eventData) {
       is_trial: isTrial,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -211,6 +231,8 @@ async function _sendSubscriptionExpiredEvent(userId, eventData) {
       is_trial: isTrial,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -242,6 +264,8 @@ async function _sendSubscriptionRenewedEvent(userId, eventData) {
       is_trial: isTrial,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -272,6 +296,8 @@ async function _sendSubscriptionReactivatedEvent(userId, eventData) {
       quantity,
       has_ai_add_on: hasAiAddOn,
       subscriptionId,
+      payment_provider: 'recurly',
+      'customerio-integration': eventData['customerio-integration'],
     }
   )
   AnalyticsManager.setUserPropertyForUserInBackground(
@@ -318,6 +344,7 @@ async function _sendInvoicePaidEvent(userId, eventData) {
       taxInCents,
       country,
       collectionMethod,
+      payment_provider: 'recurly',
       ...subscriptionIds,
     }
   )
diff --git a/services/web/app/src/Features/Subscription/RecurlyMetrics.js b/services/web/app/src/Features/Subscription/RecurlyMetrics.js
new file mode 100644
index 0000000000..1b709d7dc4
--- /dev/null
+++ b/services/web/app/src/Features/Subscription/RecurlyMetrics.js
@@ -0,0 +1,38 @@
+const Metrics = require('@overleaf/metrics')
+
+/**
+ * @param {number} status
+ * @param {number} rateLimit
+ * @param {number} rateLimitRemaining
+ * @param {number} rateLimitReset
+ */
+function recordMetrics(status, rateLimit, rateLimitRemaining, rateLimitReset) {
+  Metrics.inc('recurly_request', 1, { status })
+  const metrics = { rateLimit, rateLimitRemaining, rateLimitReset }
+  for (const [method, v] of Object.entries(metrics)) {
+    if (Number.isNaN(v)) continue
+    Metrics.gauge('recurly_request_rate_limiting', v, 1, { method })
+  }
+}
+
+/**
+ * @param {Response} response
+ */
+function recordMetricsFromResponse(response) {
+  const rateLimit = parseInt(
+    response.headers.get('X-RateLimit-Limit') || '',
+    10
+  )
+  const rateLimitRemaining = parseInt(
+    response.headers.get('X-RateLimit-Remaining') || '',
+    10
+  )
+  const rateLimitReset =
+    parseInt(response.headers.get('X-RateLimit-Reset') || '', 10) * 1000
+  recordMetrics(response.status, rateLimit, rateLimitRemaining, rateLimitReset)
+}
+
+module.exports = {
+  recordMetrics,
+  recordMetricsFromResponse,
+}
diff --git a/services/web/app/src/Features/Subscription/RecurlyWrapper.js b/services/web/app/src/Features/Subscription/RecurlyWrapper.js
index 053c983502..243da6edce 100644
--- a/services/web/app/src/Features/Subscription/RecurlyWrapper.js
+++ b/services/web/app/src/Features/Subscription/RecurlyWrapper.js
@@ -9,24 +9,30 @@ const logger = require('@overleaf/logger')
 const Errors = require('../Errors/Errors')
 const SubscriptionErrors = require('./Errors')
 const { callbackify } = require('@overleaf/promise-utils')
+const RecurlyMetrics = require('./RecurlyMetrics')
 
 /**
- * @param accountId
- * @param newEmail
+ * Updates the email address of a Recurly account
+ *
+ * @param userId
+ * @param newAccountEmail - the new email address to set for the Recurly account
  */
-async function updateAccountEmailAddress(accountId, newEmail) {
+async function updateAccountEmailAddress(userId, newAccountEmail) {
   const data = {
-    email: newEmail,
+    email: newAccountEmail,
   }
   let requestBody
   try {
     requestBody = RecurlyWrapper._buildXml('account', data)
   } catch (error) {
-    throw OError.tag(error, 'error building xml', { accountId, newEmail })
+    throw OError.tag(error, 'error building xml', {
+      accountId: userId,
+      newEmail: newAccountEmail,
+    })
   }
 
   const { body } = await RecurlyWrapper.promises.apiRequest({
-    url: `accounts/${accountId}`,
+    url: `accounts/${userId}`,
     method: 'PUT',
     body: requestBody,
   })
@@ -412,9 +418,15 @@ const promises = {
     }
 
     try {
-      return await fetchStringWithResponse(fetchUrl, fetchOptions)
+      const { body, response } = await fetchStringWithResponse(
+        fetchUrl,
+        fetchOptions
+      )
+      RecurlyMetrics.recordMetricsFromResponse(response)
+      return { body, response }
     } catch (error) {
       if (error instanceof RequestFailedError) {
+        RecurlyMetrics.recordMetricsFromResponse(error.response)
         if (error.response.status === 404 && expect404) {
           return { response: error.response, body: null }
         } else if (error.response.status === 422 && expect422) {
@@ -547,27 +559,6 @@ const promises = {
 
   updateAccountEmailAddress,
 
-  async getAccountActiveCoupons(accountId) {
-    const { body } = await RecurlyWrapper.promises.apiRequest({
-      url: `accounts/${accountId}/redemptions`,
-    })
-
-    const redemptions = await RecurlyWrapper.promises._parseRedemptionsXml(body)
-
-    const activeRedemptions = redemptions.filter(
-      redemption => redemption.state === 'active'
-    )
-    const couponCodes = activeRedemptions.map(
-      redemption => redemption.coupon_code
-    )
-
-    return await Promise.all(
-      couponCodes.map(couponCode =>
-        RecurlyWrapper.promises.getCoupon(couponCode)
-      )
-    )
-  },
-
   async getCoupon(couponCode) {
     const opts = { url: `coupons/${couponCode}` }
     const { body } = await RecurlyWrapper.promises.apiRequest(opts)
@@ -702,12 +693,15 @@ const promises = {
     }
   },
 
-  async extendTrial(subscriptionId, daysUntilExpire) {
+  async extendTrial(subscriptionId, trialEndsAt, daysUntilExpire) {
     if (daysUntilExpire == null) {
       daysUntilExpire = 7
     }
+    if (trialEndsAt == null) {
+      trialEndsAt = new Date()
+    }
     const nextRenewalDate = new Date()
-    nextRenewalDate.setDate(nextRenewalDate.getDate() + daysUntilExpire)
+    nextRenewalDate.setDate(trialEndsAt.getDate() + daysUntilExpire)
     logger.debug(
       { subscriptionId, daysUntilExpire },
       'Exending Free trial for user'
@@ -904,7 +898,6 @@ const RecurlyWrapper = {
   _buildXml,
   _parseXml: callbackify(promises._parseXml),
   createFixedAmountCoupon: callbackify(promises.createFixedAmountCoupon),
-  getAccountActiveCoupons: callbackify(promises.getAccountActiveCoupons),
   getBillingInfo: callbackify(promises.getBillingInfo),
   getPaginatedEndpoint: callbackify(promises.getPaginatedEndpoint),
   getSubscription: callbackify(promises.getSubscription),
diff --git a/services/web/app/src/Features/Subscription/SubscriptionController.js b/services/web/app/src/Features/Subscription/SubscriptionController.js
index cb8a293fb4..def0abf7ac 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionController.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionController.js
@@ -2,6 +2,7 @@
 
 const SessionManager = require('../Authentication/SessionManager')
 const SubscriptionHandler = require('./SubscriptionHandler')
+const SubscriptionHelper = require('./SubscriptionHelper')
 const SubscriptionViewModelBuilder = require('./SubscriptionViewModelBuilder')
 const LimitationsManager = require('./LimitationsManager')
 const RecurlyWrapper = require('./RecurlyWrapper')
@@ -15,20 +16,35 @@ const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const RecurlyEventHandler = require('./RecurlyEventHandler')
 const { expressify } = require('@overleaf/promise-utils')
 const OError = require('@overleaf/o-error')
-const { DuplicateAddOnError, AddOnNotPresentError } = require('./Errors')
+const {
+  DuplicateAddOnError,
+  AddOnNotPresentError,
+  PaymentActionRequiredError,
+  PaymentFailedError,
+} = require('./Errors')
 const SplitTestHandler = require('../SplitTests/SplitTestHandler')
 const AuthorizationManager = require('../Authorization/AuthorizationManager')
 const Modules = require('../../infrastructure/Modules')
 const async = require('async')
 const HttpErrorHandler = require('../Errors/HttpErrorHandler')
 const RecurlyClient = require('./RecurlyClient')
-const { AI_ADD_ON_CODE } = require('./RecurlyEntities')
+const {
+  AI_ADD_ON_CODE,
+  subscriptionChangeIsAiAssistUpgrade,
+} = require('./AiHelper')
 const PlansLocator = require('./PlansLocator')
+const { User } = require('../../models/User')
+const UserGetter = require('../User/UserGetter')
+const PermissionsManager = require('../Authorization/PermissionsManager')
+const {
+  sanitizeSessionUserForFrontEnd,
+} = require('../../infrastructure/FrontEndUser')
+const { IndeterminateInvoiceError } = require('../Errors/Errors')
 
 /**
  * @import { SubscriptionChangeDescription } from '../../../../types/subscription/subscription-change-preview'
  * @import { SubscriptionChangePreview } from '../../../../types/subscription/subscription-change-preview'
- * @import { RecurlySubscriptionChange } from './RecurlyEntities'
+ * @import { PaymentProviderSubscriptionChange } from './PaymentProviderEntities'
  * @import { PaymentMethod } from './types'
  */
 
@@ -45,7 +61,6 @@ function formatGroupPlansDataForDash() {
 
 async function userSubscriptionPage(req, res) {
   const user = SessionManager.getSessionUser(req.session)
-
   await SplitTestHandler.promises.getAssignment(req, res, 'pause-subscription')
 
   const groupPricingDiscount = await SplitTestHandler.promises.getAssignment(
@@ -76,16 +91,20 @@ async function userSubscriptionPage(req, res) {
     await Modules.promises.hooks.fire('userCanExtendTrial', user)
   )?.[0]
   const fromPlansPage = req.query.hasSubscription
+  const isInTrial = SubscriptionHelper.isInTrial(
+    personalSubscription?.payment?.trialEndsAt
+  )
   const plansData =
     SubscriptionViewModelBuilder.buildPlansListForSubscriptionDash(
-      personalSubscription?.plan
+      personalSubscription?.plan,
+      isInTrial
     )
 
   AnalyticsManager.recordEventForSession(req.session, 'subscription-page-view')
 
   const groupPlansDataForDash = formatGroupPlansDataForDash()
 
-  // display the Group Settings button only to admins of group subscriptions with either/or the Managed Users or Group SSO feature available
+  // display the Group settings button only to admins of group subscriptions with either/or the Managed Users or Group SSO feature available
   let groupSettingsEnabledFor
   try {
     const managedGroups = await async.filter(
@@ -153,6 +172,10 @@ async function userSubscriptionPage(req, res) {
       'Failed to list groups with group settings enabled for advertising'
     )
   }
+  const {
+    isPremium: hasAiAssistViaWritefull,
+    premiumSource: aiAssistViaWritefullSource,
+  } = await UserGetter.promises.getWritefullData(user._id)
 
   const data = {
     title: 'your_subscription',
@@ -176,13 +199,17 @@ async function userSubscriptionPage(req, res) {
     groupSettingsEnabledFor,
     isManagedAccount: !!req.managedBy,
     userRestrictions: Array.from(req.userRestrictions || []),
+    hasAiAssistViaWritefull,
+    aiAssistViaWritefullSource,
   }
   res.render('subscriptions/dashboard-react', data)
 }
 
 async function successfulSubscription(req, res) {
   const user = SessionManager.getSessionUser(req.session)
-
+  if (!user) {
+    throw new Error('User is not logged in')
+  }
   const { personalSubscription } =
     await SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
       user,
@@ -194,11 +221,23 @@ async function successfulSubscription(req, res) {
   if (!personalSubscription) {
     res.redirect('/user/subscription/plans')
   } else {
+    const userInDb = await User.findById(user._id, {
+      _id: 1,
+      features: 1,
+    })
+
+    if (!userInDb) {
+      throw new Error('User not found')
+    }
+
     res.render('subscriptions/successful-subscription-react', {
       title: 'thank_you',
       personalSubscription,
       postCheckoutRedirect,
-      user,
+      user: {
+        _id: user._id,
+        features: userInDb.features,
+      },
     })
   }
 }
@@ -236,7 +275,8 @@ async function pauseSubscription(req, res, next) {
       {
         pause_length: pauseCycles,
         plan_code: subscription?.planCode,
-        subscriptionId: subscription?.recurlySubscription_id,
+        subscriptionId:
+          SubscriptionHelper.getPaymentProviderSubscriptionId(subscription),
       }
     )
 
@@ -267,20 +307,18 @@ async function resumeSubscription(req, res, next) {
   }
 }
 
-function cancelSubscription(req, res, next) {
+async function cancelSubscription(req, res, next) {
   const user = SessionManager.getSessionUser(req.session)
   logger.debug({ userId: user._id }, 'canceling subscription')
-  SubscriptionHandler.cancelSubscription(user, function (err) {
-    if (err) {
-      OError.tag(err, 'something went wrong canceling subscription', {
-        user_id: user._id,
-      })
-      return next(err)
-    }
-    // Note: this redirect isn't used in the main flow as the redirection is
-    // handled by Angular
-    res.redirect('/user/subscription/canceled')
-  })
+  try {
+    await SubscriptionHandler.promises.cancelSubscription(user)
+    return res.sendStatus(200)
+  } catch (err) {
+    OError.tag(err, 'something went wrong canceling subscription', {
+      user_id: user._id,
+    })
+    return next(err)
+  }
 }
 
 /**
@@ -289,7 +327,9 @@ function cancelSubscription(req, res, next) {
 async function canceledSubscription(req, res, next) {
   return res.render('subscriptions/canceled-subscription-react', {
     title: 'subscription_canceled',
-    user: SessionManager.getSessionUser(req.session),
+    user: sanitizeSessionUserForFrontEnd(
+      SessionManager.getSessionUser(req.session)
+    ),
   })
 }
 
@@ -308,26 +348,47 @@ function cancelV1Subscription(req, res, next) {
 }
 
 async function previewAddonPurchase(req, res) {
-  const userId = SessionManager.getLoggedInUserId(req.session)
+  const user = SessionManager.getSessionUser(req.session)
+  const userId = user._id
   const addOnCode = req.params.addOnCode
+  const purchaseReferrer = req.query.purchaseReferrer
 
   if (addOnCode !== AI_ADD_ON_CODE) {
     return HttpErrorHandler.notFound(req, res, `Unknown add-on: ${addOnCode}`)
   }
 
-  const paymentMethod = await RecurlyClient.promises.getPaymentMethod(userId)
+  const canUseAi = await PermissionsManager.promises.checkUserPermissions(
+    user,
+    ['use-ai']
+  )
+  if (!canUseAi) {
+    return res.redirect(
+      '/user/subscription?redirect-reason=ai-assist-unavailable'
+    )
+  }
+
+  /** @type {PaymentMethod[]} */
+  const paymentMethod = await Modules.promises.hooks.fire(
+    'getPaymentMethod',
+    userId
+  )
 
   let subscriptionChange
   try {
     subscriptionChange =
       await SubscriptionHandler.promises.previewAddonPurchase(userId, addOnCode)
+
+    const { isPremium: hasAiAssistViaWritefull } =
+      await UserGetter.promises.getWritefullData(userId)
+    const isAiUpgrade = subscriptionChangeIsAiAssistUpgrade(subscriptionChange)
+    if (hasAiAssistViaWritefull && isAiUpgrade) {
+      return res.redirect(
+        '/user/subscription?redirect-reason=writefull-entitled'
+      )
+    }
   } catch (err) {
     if (err instanceof DuplicateAddOnError) {
-      return HttpErrorHandler.badRequest(
-        req,
-        res,
-        `Subscription already has add-on "${addOnCode}"`
-      )
+      return res.redirect('/user/subscription?redirect-reason=double-buy')
     }
     throw err
   }
@@ -348,10 +409,19 @@ async function previewAddonPurchase(req, res) {
       },
     },
     subscriptionChange,
-    paymentMethod
+    paymentMethod[0]
   )
 
-  res.render('subscriptions/preview-change', { changePreview })
+  await SplitTestHandler.promises.getAssignment(
+    req,
+    res,
+    'overleaf-assist-bundle'
+  )
+
+  res.render('subscriptions/preview-change', {
+    changePreview,
+    purchaseReferrer,
+  })
 }
 
 async function purchaseAddon(req, res, next) {
@@ -371,7 +441,6 @@ async function purchaseAddon(req, res, next) {
       addOnCode,
       quantity
     )
-    return res.sendStatus(200)
   } catch (err) {
     if (err instanceof DuplicateAddOnError) {
       HttpErrorHandler.badRequest(
@@ -380,6 +449,30 @@ async function purchaseAddon(req, res, next) {
         'Your subscription already includes this add-on',
         { addon: addOnCode }
       )
+    } else if (err instanceof PaymentActionRequiredError) {
+      logger.debug(
+        { userId: user._id },
+        'Customer needs to perform payment action to complete transaction'
+      )
+      return res.status(402).json({
+        message: 'Payment action required',
+        clientSecret: err.info.clientSecret,
+        publicKey: err.info.publicKey,
+      })
+    } else if (err instanceof PaymentFailedError) {
+      logger.debug(
+        {
+          userId: user._id,
+          reason: err.info.reason,
+          adviceCode: err.info.adviceCode,
+        },
+        'Payment failed for transaction'
+      )
+      return res.status(402).json({
+        message: 'Payment failed',
+        reason: err.info.reason,
+        adviceCode: err.info.adviceCode,
+      })
     } else {
       if (err instanceof Error) {
         OError.tag(err, 'something went wrong purchasing add-ons', {
@@ -390,6 +483,14 @@ async function purchaseAddon(req, res, next) {
       return next(err)
     }
   }
+
+  try {
+    await FeaturesUpdater.promises.refreshFeatures(user._id, 'add-on-purchase')
+  } catch (err) {
+    logger.error({ err }, 'Failed to refresh features after add-on purchase')
+  }
+
+  return res.sendStatus(200)
 }
 
 async function removeAddon(req, res, next) {
@@ -430,6 +531,7 @@ async function previewSubscription(req, res, next) {
   if (!planCode) {
     return HttpErrorHandler.notFound(req, res, 'Missing plan code')
   }
+  // TODO: use PaymentService to fetch plan information
   const plan = await RecurlyClient.promises.getPlan(planCode)
   const userId = SessionManager.getLoggedInUserId(req.session)
   const subscriptionChange =
@@ -437,14 +539,18 @@ async function previewSubscription(req, res, next) {
       userId,
       planCode
     )
-  const paymentMethod = await RecurlyClient.promises.getPaymentMethod(userId)
+  /** @type {PaymentMethod[]} */
+  const paymentMethod = await Modules.promises.hooks.fire(
+    'getPaymentMethod',
+    userId
+  )
   const changePreview = makeChangePreview(
     {
       type: 'premium-subscription',
       plan: { code: plan.code, name: plan.name },
     },
     subscriptionChange,
-    paymentMethod
+    paymentMethod[0]
   )
 
   res.render('subscriptions/preview-change', { changePreview })
@@ -468,18 +574,18 @@ function cancelPendingSubscriptionChange(req, res, next) {
   })
 }
 
-function updateAccountEmailAddress(req, res, next) {
+async function updateAccountEmailAddress(req, res, next) {
   const user = SessionManager.getSessionUser(req.session)
-  RecurlyWrapper.updateAccountEmailAddress(
-    user._id,
-    user.email,
-    function (error) {
-      if (error) {
-        return next(error)
-      }
-      res.sendStatus(200)
-    }
-  )
+  try {
+    await Modules.promises.hooks.fire(
+      'updateAccountEmailAddress',
+      user._id,
+      user.email
+    )
+    return res.sendStatus(200)
+  } catch (error) {
+    return next(error)
+  }
 }
 
 function reactivateSubscription(req, res, next) {
@@ -518,7 +624,42 @@ function recurlyCallback(req, res, next) {
     )
   )
 
-  if (
+  // this is a recurly only case which is required since Recurly does not have a reliable way to check credit info pre-upgrade purchase
+  if (event === 'failed_payment_notification') {
+    if (!Settings.planReverts?.enabled) {
+      return res.sendStatus(200)
+    }
+
+    SubscriptionHandler.getSubscriptionRestorePoint(
+      eventData.transaction.subscription_id,
+      function (err, lastSubscription) {
+        if (err) {
+          return next(err)
+        }
+        // if theres no restore point it could be a failed renewal, or no restore set. Either way it will be handled through dunning automatically
+        if (!lastSubscription || !lastSubscription?.planCode) {
+          return res.sendStatus(200)
+        }
+        SubscriptionHandler.revertPlanChange(
+          eventData.transaction.subscription_id,
+          lastSubscription,
+          function (err) {
+            if (err instanceof IndeterminateInvoiceError) {
+              logger.warn(
+                { recurlySubscriptionId: err.info.recurlySubscriptionId },
+                'could not determine invoice to fail for subscription'
+              )
+              return res.sendStatus(200)
+            }
+            if (err) {
+              return next(err)
+            }
+            return res.sendStatus(200)
+          }
+        )
+      }
+    )
+  } else if (
     [
       'new_subscription_notification',
       'updated_subscription_notification',
@@ -599,18 +740,6 @@ async function refreshUserFeatures(req, res) {
   res.sendStatus(200)
 }
 
-async function redirectToHostedPage(req, res) {
-  const userId = SessionManager.getLoggedInUserId(req.session)
-  const { pageType } = req.params
-  const url =
-    await SubscriptionViewModelBuilder.promises.getRedirectToHostedPage(
-      userId,
-      pageType
-    )
-  logger.warn({ userId, pageType }, 'redirecting to recurly hosted page')
-  res.redirect(url)
-}
-
 async function getRecommendedCurrency(req, res) {
   const userId = SessionManager.getLoggedInUserId(req.session)
   let ip = req.ip
@@ -621,7 +750,7 @@ async function getRecommendedCurrency(req, res) {
     ip = req.query.ip
   }
   const currencyLookup = await GeoIpLookup.promises.getCurrencyCode(ip)
-  let countryCode = currencyLookup.countryCode
+  const countryCode = currencyLookup.countryCode
   const recommendedCurrency = currencyLookup.currencyCode
 
   let currency = null
@@ -632,13 +761,6 @@ async function getRecommendedCurrency(req, res) {
     currency = recommendedCurrency
   }
 
-  const queryCountryCode = req.query.countryCode?.toUpperCase()
-
-  // only enable countryCode testing flag on staging or dev environments
-  if (queryCountryCode && process.env.NODE_ENV !== 'production') {
-    countryCode = queryCountryCode
-  }
-
   return {
     currency,
     recommendedCurrency,
@@ -718,8 +840,8 @@ function getPlanNameForDisplay(planName, planCode) {
  * Build a subscription change preview for display purposes
  *
  * @param {SubscriptionChangeDescription} subscriptionChangeDescription A description of the change for the frontend
- * @param {RecurlySubscriptionChange} subscriptionChange The subscription change object coming from Recurly
- * @param {PaymentMethod} paymentMethod The payment method associated to the user
+ * @param {PaymentProviderSubscriptionChange} subscriptionChange The subscription change object coming from Recurly
+ * @param {PaymentMethod} [paymentMethod] The payment method associated to the user
  * @return {SubscriptionChangePreview}
  */
 function makeChangePreview(
@@ -735,9 +857,10 @@ function makeChangePreview(
     change: subscriptionChangeDescription,
     currency: subscription.currency,
     immediateCharge: { ...subscriptionChange.immediateCharge },
-    paymentMethod: paymentMethod.toString(),
+    paymentMethod: paymentMethod?.toString(),
+    netTerms: subscription.netTerms,
     nextPlan: {
-      annual: nextPlan.annual ?? false,
+      annual: nextPlan?.annual ?? false,
     },
     nextInvoice: {
       date: subscription.periodEnd.toISOString(),
@@ -775,13 +898,12 @@ module.exports = {
   cancelV1Subscription,
   previewSubscription: expressify(previewSubscription),
   cancelPendingSubscriptionChange,
-  updateAccountEmailAddress,
+  updateAccountEmailAddress: expressify(updateAccountEmailAddress),
   reactivateSubscription,
   recurlyCallback,
   extendTrial: expressify(extendTrial),
   recurlyNotificationParser,
   refreshUserFeatures: expressify(refreshUserFeatures),
-  redirectToHostedPage: expressify(redirectToHostedPage),
   previewAddonPurchase: expressify(previewAddonPurchase),
   purchaseAddon,
   removeAddon,
diff --git a/services/web/app/src/Features/Subscription/SubscriptionFormatters.js b/services/web/app/src/Features/Subscription/SubscriptionFormatters.js
index 8bdfc2a060..1953f337fa 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionFormatters.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionFormatters.js
@@ -1,21 +1,4 @@
 const dateformat = require('dateformat')
-const { formatCurrency } = require('../../util/currency')
-
-/**
- * @param {number} priceInCents - price in the smallest currency unit (e.g. dollar cents, CLP units, ...)
- * @param {CurrencyCode?} currency - currency code (default to USD)
- * @param {string} [locale] - locale string
- * @returns {string} - formatted price
- */
-function formatPriceLocalized(priceInCents, currency = 'USD', locale) {
-  const isNoCentsCurrency = ['CLP', 'JPY', 'KRW', 'VND'].includes(currency)
-
-  const priceInCurrencyUnit = isNoCentsCurrency
-    ? priceInCents
-    : priceInCents / 100
-
-  return formatCurrency(priceInCurrencyUnit, currency, locale)
-}
 
 function formatDateTime(date) {
   if (!date) {
@@ -32,7 +15,6 @@ function formatDate(date) {
 }
 
 module.exports = {
-  formatPriceLocalized,
   formatDateTime,
   formatDate,
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionGroupController.mjs b/services/web/app/src/Features/Subscription/SubscriptionGroupController.mjs
index 14d73f91de..7091d2916d 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionGroupController.mjs
+++ b/services/web/app/src/Features/Subscription/SubscriptionGroupController.mjs
@@ -17,8 +17,10 @@ import {
   PendingChangeError,
   InactiveError,
   SubtotalLimitExceededError,
+  HasPastDueInvoiceError,
+  HasNoAdditionalLicenseWhenManuallyCollectedError,
+  PaymentActionRequiredError,
 } from './Errors.js'
-import RecurlyClient from './RecurlyClient.js'
 
 /**
  * @import { Subscription } from "../../../../types/subscription/dashboard/subscription.js"
@@ -106,10 +108,16 @@ async function _removeUserFromGroup(
     })
   }
 
+  const groupAuditLog = {
+    initiatorId: loggedInUserId,
+    ipAddress: req.ip,
+  }
+
   try {
     await SubscriptionGroupHandler.promises.removeUserFromGroup(
       subscriptionId,
-      userToRemoveId
+      userToRemoveId,
+      groupAuditLog
     )
   } catch (error) {
     logger.err(
@@ -130,28 +138,35 @@ async function _removeUserFromGroup(
 async function addSeatsToGroupSubscription(req, res) {
   try {
     const userId = SessionManager.getLoggedInUserId(req.session)
-    const { subscription, recurlySubscription, plan } =
+    const { subscription, paymentProviderSubscription, plan } =
       await SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails(
         userId
       )
     await SubscriptionGroupHandler.promises.ensureFlexibleLicensingEnabled(plan)
-    await SubscriptionGroupHandler.promises.ensureSubscriptionCollectionMethodIsNotManual(
-      recurlySubscription
-    )
     await SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPendingChanges(
-      recurlySubscription
+      paymentProviderSubscription
     )
-    // Check if the user has missing billing details
-    await RecurlyClient.promises.getPaymentMethod(userId)
     await SubscriptionGroupHandler.promises.ensureSubscriptionIsActive(
       subscription
     )
+    await SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPastDueInvoice(
+      subscription
+    )
+    await SubscriptionGroupHandler.promises.checkBillingInfoExistence(
+      paymentProviderSubscription,
+      userId
+    )
+    await SubscriptionGroupHandler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual(
+      paymentProviderSubscription
+    )
 
     res.render('subscriptions/add-seats', {
       subscriptionId: subscription._id,
       groupName: subscription.teamName,
       totalLicenses: subscription.membersLimit,
       isProfessional: isProfessionalGroupPlan(subscription),
+      isCollectionMethodManual:
+        paymentProviderSubscription.isCollectionMethodManual,
     })
   } catch (error) {
     if (error instanceof MissingBillingInfoError) {
@@ -160,13 +175,17 @@ async function addSeatsToGroupSubscription(req, res) {
       )
     }
 
-    if (error instanceof ManuallyCollectedError) {
+    if (error instanceof HasNoAdditionalLicenseWhenManuallyCollectedError) {
       return res.redirect(
         '/user/subscription/group/manually-collected-subscription'
       )
     }
 
-    if (error instanceof PendingChangeError || error instanceof InactiveError) {
+    if (
+      error instanceof PendingChangeError ||
+      error instanceof InactiveError ||
+      error instanceof HasPastDueInvoiceError
+    ) {
       return res.redirect('/user/subscription')
     }
 
@@ -197,9 +216,10 @@ async function previewAddSeatsSubscriptionChange(req, res) {
   } catch (error) {
     if (
       error instanceof MissingBillingInfoError ||
-      error instanceof ManuallyCollectedError ||
       error instanceof PendingChangeError ||
-      error instanceof InactiveError
+      error instanceof InactiveError ||
+      error instanceof HasPastDueInvoiceError ||
+      error instanceof HasNoAdditionalLicenseWhenManuallyCollectedError
     ) {
       return res.status(422).end()
     }
@@ -231,16 +251,18 @@ async function createAddSeatsSubscriptionChange(req, res) {
     const create =
       await SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange(
         userId,
-        req.body.adding
+        req.body.adding,
+        req.body.poNumber
       )
 
     res.json(create)
   } catch (error) {
     if (
       error instanceof MissingBillingInfoError ||
-      error instanceof ManuallyCollectedError ||
       error instanceof PendingChangeError ||
-      error instanceof InactiveError
+      error instanceof InactiveError ||
+      error instanceof HasPastDueInvoiceError ||
+      error instanceof HasNoAdditionalLicenseWhenManuallyCollectedError
     ) {
       return res.status(422).end()
     }
@@ -252,6 +274,14 @@ async function createAddSeatsSubscriptionChange(req, res) {
       })
     }
 
+    if (error instanceof PaymentActionRequiredError) {
+      return res.status(402).json({
+        message: 'Payment action required',
+        clientSecret: error.info.clientSecret,
+        publicKey: error.info.publicKey,
+      })
+    }
+
     logger.err(
       { error },
       'error trying to create "add seats" subscription change'
@@ -264,11 +294,27 @@ async function createAddSeatsSubscriptionChange(req, res) {
 async function submitForm(req, res) {
   const userId = SessionManager.getLoggedInUserId(req.session)
   const userEmail = await UserGetter.promises.getUserEmail(userId)
-  const { adding } = req.body
+  const { adding, poNumber } = req.body
+
+  const { paymentProviderSubscription } =
+    await SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails(
+      userId
+    )
+
+  if (paymentProviderSubscription.isCollectionMethodManual) {
+    await SubscriptionGroupHandler.promises.updateSubscriptionPaymentTerms(
+      userId,
+      paymentProviderSubscription,
+      poNumber
+    )
+  }
 
   const messageLines = [`\n**Overleaf Sales Contact Form:**`]
   messageLines.push('**Subject:** Self-Serve Group User Increase Request')
   messageLines.push(`**Estimated Number of Users:** ${adding}`)
+  if (poNumber) {
+    messageLines.push(`**PO Number:** ${poNumber}`)
+  }
   messageLines.push(
     `**Message:** This email has been generated on behalf of user with email **${userEmail}** ` +
       'to request an increase in the total number of users for their subscription.'
@@ -332,6 +378,13 @@ async function upgradeSubscription(req, res) {
     await SubscriptionGroupHandler.promises.upgradeGroupPlan(userId)
     return res.sendStatus(200)
   } catch (error) {
+    if (error instanceof PaymentActionRequiredError) {
+      return res.status(402).json({
+        message: 'Payment action required',
+        clientSecret: error.info.clientSecret,
+        publicKey: error.info.publicKey,
+      })
+    }
     logger.err({ error }, 'error trying to upgrade subscription')
     return res.sendStatus(500)
   }
@@ -388,6 +441,21 @@ async function subtotalLimitExceeded(req, res) {
   }
 }
 
+async function getGroupPlanPerUserPrices(req, res) {
+  try {
+    const userId = SessionManager.getLoggedInUserId(req.session)
+    const prices = await Modules.promises.hooks.fire(
+      'getGroupPlanPerUserPrices',
+      userId,
+      req.query.currency
+    )
+    return res.json(prices[0])
+  } catch (error) {
+    logger.err({ error }, 'error trying to get websale group product prices')
+    return res.sendStatus(500)
+  }
+}
+
 export default {
   removeUserFromGroup: expressify(removeUserFromGroup),
   removeSelfFromGroup: expressify(removeSelfFromGroup),
@@ -404,4 +472,5 @@ export default {
   missingBillingInformation: expressify(missingBillingInformation),
   manuallyCollectedSubscription: expressify(manuallyCollectedSubscription),
   subtotalLimitExceeded: expressify(subtotalLimitExceeded),
+  getGroupPlanPerUserPrices: expressify(getGroupPlanPerUserPrices),
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionGroupHandler.js b/services/web/app/src/Features/Subscription/SubscriptionGroupHandler.js
index 05befd6ca5..977218fdd2 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionGroupHandler.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionGroupHandler.js
@@ -1,23 +1,33 @@
 const { callbackify } = require('util')
+const _ = require('lodash')
+const OError = require('@overleaf/o-error')
 const SubscriptionUpdater = require('./SubscriptionUpdater')
 const SubscriptionLocator = require('./SubscriptionLocator')
 const SubscriptionController = require('./SubscriptionController')
+const SubscriptionHelper = require('./SubscriptionHelper')
 const { Subscription } = require('../../models/Subscription')
+const { User } = require('../../models/User')
 const RecurlyClient = require('./RecurlyClient')
 const PlansLocator = require('./PlansLocator')
-const SubscriptionHandler = require('./SubscriptionHandler')
+const TeamInvitesHandler = require('./TeamInvitesHandler')
 const GroupPlansData = require('./GroupPlansData')
-const { MEMBERS_LIMIT_ADD_ON_CODE } = require('./RecurlyEntities')
+const Modules = require('../../infrastructure/Modules')
+const { MEMBERS_LIMIT_ADD_ON_CODE } = require('./PaymentProviderEntities')
 const {
   ManuallyCollectedError,
   PendingChangeError,
   InactiveError,
+  HasPastDueInvoiceError,
+  HasNoAdditionalLicenseWhenManuallyCollectedError,
 } = require('./Errors')
+const EmailHelper = require('../Helpers/EmailHelper')
+const { InvalidEmailError } = require('../Errors/Errors')
 
-async function removeUserFromGroup(subscriptionId, userIdToRemove) {
+async function removeUserFromGroup(subscriptionId, userIdToRemove, auditLog) {
   await SubscriptionUpdater.promises.removeUserFromGroup(
     subscriptionId,
-    userIdToRemove
+    userIdToRemove,
+    auditLog
   )
 }
 
@@ -68,7 +78,7 @@ async function ensureFlexibleLicensingEnabled(plan) {
 }
 
 async function ensureSubscriptionIsActive(subscription) {
-  if (subscription?.recurlyStatus?.state !== 'active') {
+  if (SubscriptionHelper.getPaidSubscriptionState(subscription) !== 'active') {
     throw new InactiveError('The subscription is not active', {
       subscriptionId: subscription._id.toString(),
     })
@@ -76,26 +86,60 @@ async function ensureSubscriptionIsActive(subscription) {
 }
 
 async function ensureSubscriptionCollectionMethodIsNotManual(
-  recurlySubscription
+  paymentProviderSubscription
 ) {
-  if (recurlySubscription.isCollectionMethodManual) {
+  if (paymentProviderSubscription.isCollectionMethodManual) {
     throw new ManuallyCollectedError(
       'This subscription is being collected manually',
       {
-        recurlySubscription_id: recurlySubscription.id,
+        subscription_id: paymentProviderSubscription.id,
       }
     )
   }
 }
 
-async function ensureSubscriptionHasNoPendingChanges(recurlySubscription) {
-  if (recurlySubscription.pendingChange) {
+async function ensureSubscriptionHasNoPendingChanges(
+  paymentProviderSubscription
+) {
+  if (paymentProviderSubscription.pendingChange) {
     throw new PendingChangeError('This subscription has a pending change', {
-      recurlySubscription_id: recurlySubscription.id,
+      subscription_id: paymentProviderSubscription.id,
     })
   }
 }
 
+async function ensureSubscriptionHasNoPastDueInvoice(subscription) {
+  const [paymentRecord] = await Modules.promises.hooks.fire(
+    'getPaymentFromRecord',
+    subscription
+  )
+
+  if (paymentRecord.account.hasPastDueInvoice) {
+    throw new HasPastDueInvoiceError(
+      'This subscription has a past due invoice',
+      {
+        subscriptionId: subscription._id.toString(),
+      }
+    )
+  }
+}
+
+async function ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual(
+  paymentProviderSubscription
+) {
+  if (
+    paymentProviderSubscription.isCollectionMethodManual &&
+    !paymentProviderSubscription.hasAddOn(MEMBERS_LIMIT_ADD_ON_CODE)
+  ) {
+    throw new HasNoAdditionalLicenseWhenManuallyCollectedError(
+      'This subscription is being collected manually has no "additional-license" add-on',
+      {
+        subscription_id: paymentProviderSubscription.id,
+      }
+    )
+  }
+}
+
 async function getUsersGroupSubscriptionDetails(userId) {
   const subscription =
     await SubscriptionLocator.promises.getUsersSubscription(userId)
@@ -110,38 +154,50 @@ async function getUsersGroupSubscriptionDetails(userId) {
 
   const plan = PlansLocator.findLocalPlanInSettings(subscription.planCode)
 
-  const recurlySubscription = await RecurlyClient.promises.getSubscription(
-    subscription.recurlySubscription_id
+  const response = await Modules.promises.hooks.fire(
+    'getPaymentFromRecord',
+    subscription
   )
 
+  const { subscription: paymentProviderSubscription } = response[0]
+
   return {
     userId,
     subscription,
-    recurlySubscription,
+    paymentProviderSubscription,
     plan,
   }
 }
 
+async function checkBillingInfoExistence(paymentProviderSubscription, userId) {
+  // Verify the billing info only if the collection method is not manual (e.g. automatic)
+  if (!paymentProviderSubscription.isCollectionMethodManual) {
+    // Check if the user has missing billing details
+    await Modules.promises.hooks.fire('getPaymentMethod', userId)
+  }
+}
+
 async function _addSeatsSubscriptionChange(userId, adding) {
-  const { subscription, recurlySubscription, plan } =
+  const { subscription, paymentProviderSubscription, plan } =
     await getUsersGroupSubscriptionDetails(userId)
   await ensureFlexibleLicensingEnabled(plan)
   await ensureSubscriptionIsActive(subscription)
-  await ensureSubscriptionCollectionMethodIsNotManual(recurlySubscription)
-  await ensureSubscriptionHasNoPendingChanges(recurlySubscription)
+  await ensureSubscriptionHasNoPendingChanges(paymentProviderSubscription)
+  await checkBillingInfoExistence(paymentProviderSubscription, userId)
+  await ensureSubscriptionHasNoPastDueInvoice(subscription)
 
   const currentAddonQuantity =
-    recurlySubscription.addOns.find(
+    paymentProviderSubscription.addOns.find(
       addOn => addOn.code === MEMBERS_LIMIT_ADD_ON_CODE
     )?.quantity ?? 0
   // Keeps only the new total quantity of addon
   const nextAddonQuantity = currentAddonQuantity + adding
 
   let changeRequest
-  if (recurlySubscription.hasAddOn(MEMBERS_LIMIT_ADD_ON_CODE)) {
+  if (paymentProviderSubscription.hasAddOn(MEMBERS_LIMIT_ADD_ON_CODE)) {
     // Not providing a custom price as once the subscription is locked
     // to an add-on at a given price, it will use it for subsequent payments
-    changeRequest = recurlySubscription.getRequestForAddOnUpdate(
+    changeRequest = paymentProviderSubscription.getRequestForAddOnUpdate(
       MEMBERS_LIMIT_ADD_ON_CODE,
       nextAddonQuantity
     )
@@ -150,7 +206,7 @@ async function _addSeatsSubscriptionChange(userId, adding) {
     const pattern =
       /^group_(collaborator|professional)_(2|3|4|5|10|20|50)_(educational|enterprise)$/
     const [, planCode, size, usage] = plan.planCode.match(pattern)
-    const currency = recurlySubscription.currency
+    const currency = paymentProviderSubscription.currency
     const planPriceInCents =
       GroupPlansData[usage][planCode][currency][size].price_in_cents
     const legacyUnitPriceInCents =
@@ -159,7 +215,7 @@ async function _addSeatsSubscriptionChange(userId, adding) {
 
     if (
       _shouldUseLegacyPricing(
-        recurlySubscription.planPrice,
+        paymentProviderSubscription.planPrice,
         planPriceInCents / 100,
         usage,
         size
@@ -168,7 +224,7 @@ async function _addSeatsSubscriptionChange(userId, adding) {
       unitPrice = legacyUnitPriceInCents / 100
     }
 
-    changeRequest = recurlySubscription.getRequestForAddOnPurchase(
+    changeRequest = paymentProviderSubscription.getRequestForAddOnPurchase(
       MEMBERS_LIMIT_ADD_ON_CODE,
       nextAddonQuantity,
       unitPrice
@@ -178,7 +234,7 @@ async function _addSeatsSubscriptionChange(userId, adding) {
   return {
     changeRequest,
     currentAddonQuantity,
-    recurlySubscription,
+    paymentProviderSubscription,
   }
 }
 
@@ -202,73 +258,81 @@ function _shouldUseLegacyPricing(
 async function previewAddSeatsSubscriptionChange(userId, adding) {
   const { changeRequest, currentAddonQuantity } =
     await _addSeatsSubscriptionChange(userId, adding)
-  const paymentMethod = await RecurlyClient.promises.getPaymentMethod(userId)
-  const subscriptionChange =
-    await RecurlyClient.promises.previewSubscriptionChange(changeRequest)
-  const subscriptionChangePreview =
-    await SubscriptionController.makeChangePreview(
-      {
-        type: 'add-on-update',
-        addOn: {
-          code: MEMBERS_LIMIT_ADD_ON_CODE,
-          quantity: subscriptionChange.nextAddOns.find(
-            addon => addon.code === MEMBERS_LIMIT_ADD_ON_CODE
-          ).quantity,
-          prevQuantity: currentAddonQuantity,
-        },
+  const response = await Modules.promises.hooks.fire(
+    'previewSubscriptionChangeRequest',
+    changeRequest
+  )
+  const subscriptionChange = response[0]
+  const subscriptionChangePreview = SubscriptionController.makeChangePreview(
+    {
+      type: 'add-on-update',
+      addOn: {
+        code: MEMBERS_LIMIT_ADD_ON_CODE,
+        quantity: subscriptionChange.nextAddOns.find(
+          addon => addon.code === MEMBERS_LIMIT_ADD_ON_CODE
+        ).quantity,
+        prevQuantity: currentAddonQuantity,
       },
-      subscriptionChange,
-      paymentMethod
-    )
+    },
+    subscriptionChange
+  )
 
   return subscriptionChangePreview
 }
 
-async function createAddSeatsSubscriptionChange(userId, adding) {
-  const { changeRequest, recurlySubscription } =
+async function createAddSeatsSubscriptionChange(userId, adding, poNumber) {
+  const { changeRequest, paymentProviderSubscription } =
     await _addSeatsSubscriptionChange(userId, adding)
-  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
-  await SubscriptionHandler.promises.syncSubscription(
-    { uuid: recurlySubscription.id },
+
+  if (paymentProviderSubscription.isCollectionMethodManual) {
+    await updateSubscriptionPaymentTerms(paymentProviderSubscription, poNumber)
+  }
+  await Modules.promises.hooks.fire(
+    'applySubscriptionChangeRequestAndSync',
+    changeRequest,
     userId
   )
 
   return { adding }
 }
 
-async function _getUpgradeTargetPlanCodeMaybeThrow(subscription) {
-  if (
-    subscription.planCode.includes('professional') ||
-    !subscription.groupPlan
-  ) {
-    throw new Error('Not eligible for group plan upgrade')
+async function updateSubscriptionPaymentTerms(
+  paymentProviderSubscription,
+  poNumber
+) {
+  if (paymentProviderSubscription.service?.includes('stripe')) {
+    // TODO: Implement Stripe payment terms update
+    throw new OError(
+      'Updating payment terms is not supported for Stripe subscriptions',
+      {
+        subscriptionId: paymentProviderSubscription.id,
+      }
+    )
   }
 
-  return subscription.planCode.replace('collaborator', 'professional')
-}
-
-async function _getGroupPlanUpgradeChangeRequest(ownerId) {
-  const olSubscription =
-    await SubscriptionLocator.promises.getUsersSubscription(ownerId)
-
-  await ensureSubscriptionIsActive(olSubscription)
-
-  const newPlanCode = await _getUpgradeTargetPlanCodeMaybeThrow(olSubscription)
-  const recurlySubscription = await RecurlyClient.promises.getSubscription(
-    olSubscription.recurlySubscription_id
+  const [termsAndConditions] = await Modules.promises.hooks.fire(
+    'generateTermsAndConditions',
+    { currency: paymentProviderSubscription.currency, poNumber }
   )
 
-  await ensureSubscriptionCollectionMethodIsNotManual(recurlySubscription)
-  await ensureSubscriptionHasNoPendingChanges(recurlySubscription)
+  const updateRequest = poNumber
+    ? paymentProviderSubscription.getRequestForPoNumberAndTermsAndConditionsUpdate(
+        poNumber,
+        termsAndConditions
+      )
+    : paymentProviderSubscription.getRequestForTermsAndConditionsUpdate(
+        termsAndConditions
+      )
 
-  return recurlySubscription.getRequestForGroupPlanUpgrade(newPlanCode)
+  await RecurlyClient.promises.updateSubscriptionDetails(updateRequest)
 }
 
 async function getGroupPlanUpgradePreview(ownerId) {
-  const changeRequest = await _getGroupPlanUpgradeChangeRequest(ownerId)
-  const subscriptionChange =
-    await RecurlyClient.promises.previewSubscriptionChange(changeRequest)
-  const paymentMethod = await RecurlyClient.promises.getPaymentMethod(ownerId)
+  const preview = await Modules.promises.hooks.fire(
+    'previewGroupPlanUpgrade',
+    ownerId
+  )
+  const { subscriptionChange, paymentMethod } = preview[0]
   return SubscriptionController.makeChangePreview(
     {
       type: 'group-plan-upgrade',
@@ -285,12 +349,128 @@ async function getGroupPlanUpgradePreview(ownerId) {
 }
 
 async function upgradeGroupPlan(ownerId) {
-  const changeRequest = await _getGroupPlanUpgradeChangeRequest(ownerId)
-  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
-  await SubscriptionHandler.promises.syncSubscription(
-    { uuid: changeRequest.subscription.id },
-    ownerId
+  await Modules.promises.hooks.fire('upgradeGroupPlan', ownerId)
+}
+
+async function updateGroupMembersBulk(
+  inviterId,
+  subscriptionId,
+  emailList,
+  options = {}
+) {
+  const { removeMembersNotIncluded, commit } = options
+
+  // remove duplications and empty values
+  emailList = _.uniq(_.compact(emailList))
+
+  const invalidEmails = emailList.filter(
+    email => !EmailHelper.parseEmail(email)
   )
+
+  if (invalidEmails.length > 0) {
+    throw new InvalidEmailError('email not valid', {
+      invalidEmails,
+    })
+  }
+
+  const subscription = await Subscription.findOne({
+    _id: subscriptionId,
+  }).exec()
+
+  const existingUserData = await User.find(
+    {
+      _id: { $in: subscription.member_ids },
+    },
+    { _id: 1, email: 1, 'emails.email': 1 }
+  ).exec()
+
+  const existingUsers = existingUserData.map(user => ({
+    _id: user._id,
+    emails: user.emails?.map(user => user.email),
+  }))
+
+  const currentMemberEmails = _.flatten(
+    existingUsers
+      .filter(userData => userData.emails?.length > 0)
+      .map(user => user.emails)
+  )
+
+  const currentInvites =
+    subscription.teamInvites?.map(invite => invite.email) || []
+  if (subscription.invited_emails?.length > 0) {
+    currentInvites.push(...subscription.invited_emails)
+  }
+
+  const invitesToSend = _.difference(
+    emailList,
+    currentMemberEmails.concat(currentInvites)
+  )
+
+  let membersToRemove
+  let invitesToRevoke
+  let newTotalCount
+
+  if (!removeMembersNotIncluded) {
+    membersToRemove = []
+    invitesToRevoke = []
+    newTotalCount =
+      existingUsers.length + currentInvites.length + invitesToSend.length
+  } else {
+    membersToRemove = []
+    for (const existingUser of existingUsers) {
+      if (_.intersection(existingUser.emails, emailList).length === 0) {
+        membersToRemove.push(existingUser._id)
+      }
+    }
+    const invitesToMaintain = _.intersection(emailList, currentInvites)
+    invitesToRevoke = _.difference(currentInvites, invitesToMaintain)
+    newTotalCount =
+      existingUsers.length -
+      membersToRemove.length +
+      invitesToMaintain.length +
+      invitesToSend.length
+  }
+
+  const result = {
+    emailsToSendInvite: invitesToSend,
+    emailsToRevokeInvite: invitesToRevoke,
+    membersToRemove,
+    currentMemberCount: existingUsers.length,
+    newTotalCount,
+    membersLimit: subscription.membersLimit,
+  }
+
+  if (commit) {
+    if (newTotalCount > subscription.membersLimit) {
+      const { currentMemberCount, newTotalCount, membersLimit } = result
+      throw new OError('limit reached', {
+        currentMemberCount,
+        newTotalCount,
+        membersLimit,
+      })
+    }
+    for (const email of invitesToSend) {
+      await TeamInvitesHandler.promises.createInvite(
+        inviterId,
+        subscription,
+        email
+      )
+    }
+    for (const email of invitesToRevoke) {
+      await TeamInvitesHandler.promises.revokeInvite(
+        inviterId,
+        subscription,
+        email
+      )
+    }
+    for (const user of membersToRemove) {
+      await removeUserFromGroup(subscription._id, user._id, {
+        initiatorId: inviterId,
+      })
+    }
+  }
+
+  return result
 }
 
 module.exports = {
@@ -304,10 +484,19 @@ module.exports = {
   ensureSubscriptionHasNoPendingChanges: callbackify(
     ensureSubscriptionHasNoPendingChanges
   ),
+  ensureSubscriptionHasNoPastDueInvoice: callbackify(
+    ensureSubscriptionHasNoPastDueInvoice
+  ),
+  ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual:
+    callbackify(
+      ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual
+    ),
   getTotalConfirmedUsersInGroup: callbackify(getTotalConfirmedUsersInGroup),
   isUserPartOfGroup: callbackify(isUserPartOfGroup),
   getGroupPlanUpgradePreview: callbackify(getGroupPlanUpgradePreview),
   upgradeGroupPlan: callbackify(upgradeGroupPlan),
+  checkBillingInfoExistence: callbackify(checkBillingInfoExistence),
+  updateGroupMembersBulk: callbackify(updateGroupMembersBulk),
   promises: {
     removeUserFromGroup,
     replaceUserReferencesInGroups,
@@ -315,12 +504,17 @@ module.exports = {
     ensureSubscriptionIsActive,
     ensureSubscriptionCollectionMethodIsNotManual,
     ensureSubscriptionHasNoPendingChanges,
+    ensureSubscriptionHasNoPastDueInvoice,
+    ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual,
     getTotalConfirmedUsersInGroup,
     isUserPartOfGroup,
     getUsersGroupSubscriptionDetails,
     previewAddSeatsSubscriptionChange,
     createAddSeatsSubscriptionChange,
+    updateSubscriptionPaymentTerms,
     getGroupPlanUpgradePreview,
     upgradeGroupPlan,
+    checkBillingInfoExistence,
+    updateGroupMembersBulk,
   },
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionHandler.js b/services/web/app/src/Features/Subscription/SubscriptionHandler.js
index 4988bb5983..656b57aa01 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionHandler.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionHandler.js
@@ -1,20 +1,21 @@
 // @ts-check
 
-const recurly = require('recurly')
 const RecurlyWrapper = require('./RecurlyWrapper')
 const RecurlyClient = require('./RecurlyClient')
 const { User } = require('../../models/User')
 const logger = require('@overleaf/logger')
+const SubscriptionHelper = require('./SubscriptionHelper')
 const SubscriptionUpdater = require('./SubscriptionUpdater')
 const SubscriptionLocator = require('./SubscriptionLocator')
 const LimitationsManager = require('./LimitationsManager')
 const EmailHandler = require('../Email/EmailHandler')
 const { callbackify } = require('@overleaf/promise-utils')
 const UserUpdater = require('../User/UserUpdater')
-const { NotFoundError } = require('../Errors/Errors')
+const { IndeterminateInvoiceError } = require('../Errors/Errors')
+const Modules = require('../../infrastructure/Modules')
 
 /**
- * @import { RecurlySubscription, RecurlySubscriptionChange } from './RecurlyEntities'
+ * @import { PaymentProviderSubscriptionChange } from './PaymentProviderEntities'
  */
 
 async function validateNoSubscriptionInRecurly(userId) {
@@ -69,22 +70,22 @@ async function createSubscription(user, subscriptionDetails, recurlyTokenIds) {
  *
  * @param {string} userId
  * @param {string} planCode
- * @return {Promise<RecurlySubscriptionChange>}
+ * @return {Promise<PaymentProviderSubscriptionChange>}
  */
 async function previewSubscriptionChange(userId, planCode) {
-  const subscription = await getSubscriptionForUser(userId)
-  const changeRequest = subscription?.getRequestForPlanChange(planCode)
-  const change =
-    await RecurlyClient.promises.previewSubscriptionChange(changeRequest)
-  return change
+  const change = await Modules.promises.hooks.fire(
+    'previewPlanChange',
+    userId,
+    planCode
+  )
+  return change[0]
 }
 
 /**
  * @param user
  * @param planCode
- * @param couponCode
  */
-async function updateSubscription(user, planCode, couponCode) {
+async function updateSubscription(user, planCode) {
   let hasSubscription = false
   let subscription
 
@@ -101,30 +102,17 @@ async function updateSubscription(user, planCode, couponCode) {
   if (
     !hasSubscription ||
     subscription == null ||
-    subscription.recurlySubscription_id == null
+    SubscriptionHelper.getPaymentProviderSubscriptionId(subscription) == null
   ) {
     return
   }
-  const recurlySubscriptionId = subscription.recurlySubscription_id
 
-  if (couponCode) {
-    const usersSubscription = await RecurlyWrapper.promises.getSubscription(
-      recurlySubscriptionId,
-      { includeAccount: true }
-    )
-
-    await RecurlyWrapper.promises.redeemCoupon(
-      usersSubscription.account.account_code,
-      couponCode
-    )
-  }
-
-  const recurlySubscription = await RecurlyClient.promises.getSubscription(
-    recurlySubscriptionId
+  await Modules.promises.hooks.fire(
+    'updatePaidSubscription',
+    subscription,
+    planCode,
+    user._id
   )
-  const changeRequest = recurlySubscription.getRequestForPlanChange(planCode)
-  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
-  await syncSubscription({ uuid: recurlySubscriptionId }, user._id)
 }
 
 /**
@@ -135,8 +123,9 @@ async function cancelPendingSubscriptionChange(user) {
     await LimitationsManager.promises.userHasSubscription(user)
 
   if (hasSubscription && subscription != null) {
-    await RecurlyClient.promises.removeSubscriptionChangeByUuid(
-      subscription.recurlySubscription_id
+    await Modules.promises.hooks.fire(
+      'cancelPendingPaidSubscriptionChange',
+      subscription
     )
   }
 }
@@ -149,10 +138,7 @@ async function cancelSubscription(user) {
     const { hasSubscription, subscription } =
       await LimitationsManager.promises.userHasSubscription(user)
     if (hasSubscription && subscription != null) {
-      await RecurlyClient.promises.cancelSubscriptionByUuid(
-        subscription.recurlySubscription_id
-      )
-      await _updateSubscriptionFromRecurly(subscription)
+      await Modules.promises.hooks.fire('cancelPaidSubscription', subscription)
       const emailOpts = {
         to: user.email,
         first_name: user.first_name,
@@ -180,10 +166,10 @@ async function reactivateSubscription(user) {
     const { hasSubscription, subscription } =
       await LimitationsManager.promises.userHasSubscription(user)
     if (hasSubscription && subscription != null) {
-      await RecurlyClient.promises.reactivateSubscriptionByUuid(
-        subscription.recurlySubscription_id
+      await Modules.promises.hooks.fire(
+        'reactivatePaidSubscription',
+        subscription
       )
-      await _updateSubscriptionFromRecurly(subscription)
       EmailHandler.sendEmail(
         'reactivatedSubscription',
         { to: user.email },
@@ -260,22 +246,8 @@ async function attemptPaypalInvoiceCollection(recurlyAccountCode) {
   )
 }
 
-async function extendTrial(subscription, daysToExend) {
-  await RecurlyWrapper.promises.extendTrial(
-    subscription.recurlySubscription_id,
-    daysToExend
-  )
-}
-
-async function _updateSubscriptionFromRecurly(subscription) {
-  const recurlySubscription = await RecurlyWrapper.promises.getSubscription(
-    subscription.recurlySubscription_id,
-    {}
-  )
-  await SubscriptionUpdater.promises.updateSubscriptionFromRecurly(
-    recurlySubscription,
-    subscription
-  )
+async function extendTrial(subscription, daysToExtend) {
+  await Modules.promises.hooks.fire('extendTrial', subscription, daysToExtend)
 }
 
 /**
@@ -283,27 +255,15 @@ async function _updateSubscriptionFromRecurly(subscription) {
  *
  * @param {string} userId
  * @param {string} addOnCode
- * @return {Promise<RecurlySubscriptionChange>}
+ * @return {Promise<PaymentProviderSubscriptionChange>}
  */
 async function previewAddonPurchase(userId, addOnCode) {
-  const subscription = await getSubscriptionForUser(userId)
-
-  try {
-    await RecurlyClient.promises.getAddOn(subscription.planCode, addOnCode)
-  } catch (err) {
-    if (err instanceof recurly.errors.NotFoundError) {
-      throw new NotFoundError({
-        message: 'Add-on not found',
-        info: { addOnCode },
-      })
-    }
-    throw err
-  }
-
-  const changeRequest = subscription.getRequestForAddOnPurchase(addOnCode)
-  const change =
-    await RecurlyClient.promises.previewSubscriptionChange(changeRequest)
-  return change
+  const change = await Modules.promises.hooks.fire(
+    'previewAddOnPurchase',
+    userId,
+    addOnCode
+  )
+  return change[0]
 }
 
 /**
@@ -314,24 +274,12 @@ async function previewAddonPurchase(userId, addOnCode) {
  * @param {number} quantity
  */
 async function purchaseAddon(userId, addOnCode, quantity) {
-  const subscription = await getSubscriptionForUser(userId)
-  try {
-    await RecurlyClient.promises.getAddOn(subscription.planCode, addOnCode)
-  } catch (err) {
-    if (err instanceof recurly.errors.NotFoundError) {
-      throw new NotFoundError({
-        message: 'Add-on not found',
-        info: { addOnCode },
-      })
-    }
-    throw err
-  }
-  const changeRequest = subscription.getRequestForAddOnPurchase(
+  await Modules.promises.hooks.fire(
+    'purchaseAddOn',
+    userId,
     addOnCode,
     quantity
   )
-  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
-  await syncSubscription({ uuid: subscription.id }, userId)
 }
 
 /**
@@ -341,51 +289,17 @@ async function purchaseAddon(userId, addOnCode, quantity) {
  * @param {string} addOnCode
  */
 async function removeAddon(userId, addOnCode) {
-  const subscription = await getSubscriptionForUser(userId)
-  const changeRequest = subscription.getRequestForAddOnRemoval(addOnCode)
-  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
-  await syncSubscription({ uuid: subscription.id }, userId)
-}
-
-/**
- * Returns the Recurly UUID for the given user
- *
- * Throws a NotFoundError if the subscription can't be found
- *
- * @param {string} userId
- * @return {Promise<RecurlySubscription>}
- */
-async function getSubscriptionForUser(userId) {
-  const subscription =
-    await SubscriptionLocator.promises.getUsersSubscription(userId)
-  const recurlyId = subscription?.recurlySubscription_id
-  if (recurlyId == null) {
-    throw new NotFoundError({
-      message: 'Recurly subscription not found',
-      info: { userId },
-    })
-  }
-
-  try {
-    const subscription = await RecurlyClient.promises.getSubscription(recurlyId)
-    return subscription
-  } catch (err) {
-    if (err instanceof recurly.errors.NotFoundError) {
-      throw new NotFoundError({
-        message: 'Subscription not found',
-        info: { userId, recurlyId },
-      })
-    } else {
-      throw err
-    }
-  }
+  await Modules.promises.hooks.fire('removeAddOn', userId, addOnCode)
 }
 
 async function pauseSubscription(user, pauseCycles) {
   // only allow pausing on monthly plans not in a trial
   const { subscription } =
     await LimitationsManager.promises.userHasSubscription(user)
-  if (!subscription || !subscription.recurlyStatus) {
+  if (
+    !subscription ||
+    !SubscriptionHelper.getPaidSubscriptionState(subscription)
+  ) {
     throw new Error('No active subscription to pause')
   }
 
@@ -396,10 +310,9 @@ async function pauseSubscription(user, pauseCycles) {
   ) {
     throw new Error('Can only pause monthly individual plans')
   }
-  if (
-    subscription.recurlyStatus.trialEndsAt &&
-    subscription.recurlyStatus.trialEndsAt > new Date()
-  ) {
+  const trialEndsAt =
+    SubscriptionHelper.getSubscriptionTrialEndsAt(subscription)
+  if (trialEndsAt && trialEndsAt > new Date()) {
     throw new Error('Cannot pause a subscription in a trial')
   }
   if (subscription.addOns?.length) {
@@ -415,7 +328,10 @@ async function pauseSubscription(user, pauseCycles) {
 async function resumeSubscription(user) {
   const { subscription } =
     await LimitationsManager.promises.userHasSubscription(user)
-  if (!subscription || !subscription.recurlyStatus) {
+  if (
+    !subscription ||
+    !SubscriptionHelper.getPaidSubscriptionState(subscription)
+  ) {
     throw new Error('No active subscription to resume')
   }
   await RecurlyClient.promises.resumeSubscriptionByUuid(
@@ -423,6 +339,80 @@ async function resumeSubscription(user) {
   )
 }
 
+/**
+ * @param recurlySubscriptionId
+ */
+async function getSubscriptionRestorePoint(recurlySubscriptionId) {
+  const lastSubscription =
+    await SubscriptionLocator.promises.getLastSuccessfulSubscription(
+      recurlySubscriptionId
+    )
+  return lastSubscription
+}
+
+/**
+ * @param recurlySubscriptionId
+ * @param subscriptionRestorePoint
+ */
+async function revertPlanChange(
+  recurlySubscriptionId,
+  subscriptionRestorePoint
+) {
+  const subscription = await RecurlyClient.promises.getSubscription(
+    recurlySubscriptionId
+  )
+
+  const changeRequest = subscription.getRequestForPlanRevert(
+    subscriptionRestorePoint.planCode,
+    subscriptionRestorePoint.addOns
+  )
+
+  const pastDue = await RecurlyClient.promises.getPastDueInvoices(
+    recurlySubscriptionId
+  )
+
+  // only process revert requests within the past 24 hours, as we dont want to restore plans at the end of their dunning cycle
+  const yesterday = new Date()
+  yesterday.setDate(yesterday.getDate() - 1)
+  if (
+    pastDue.length !== 1 ||
+    !pastDue[0].id ||
+    !pastDue[0].dueAt ||
+    pastDue[0].dueAt < yesterday ||
+    pastDue[0].collectionMethod !== 'automatic'
+  ) {
+    throw new IndeterminateInvoiceError(
+      'cant determine invoice to fail for plan revert',
+      {
+        recurlySubscriptionId,
+      }
+    )
+  }
+
+  await RecurlyClient.promises.failInvoice(pastDue[0].id)
+  await SubscriptionUpdater.promises.setSubscriptionWasReverted(
+    subscriptionRestorePoint._id
+  )
+  await RecurlyClient.promises.applySubscriptionChangeRequest(changeRequest)
+  await syncSubscription({ uuid: recurlySubscriptionId }, {})
+}
+
+async function setSubscriptionRestorePoint(userId) {
+  const subscription =
+    await SubscriptionLocator.promises.getUsersSubscription(userId)
+  // if the subscription is not a recurly one, we can return early as we dont allow for failed payments on other payment providers
+  //  we need to deal with it for recurly, because we cant verify payment in advance
+  if (!subscription?.recurlySubscription_id || !subscription.planCode) {
+    return
+  }
+  await SubscriptionUpdater.promises.setRestorePoint(
+    subscription.id,
+    subscription.planCode,
+    subscription.addOns,
+    false
+  )
+}
+
 module.exports = {
   validateNoSubscriptionInRecurly: callbackify(validateNoSubscriptionInRecurly),
   createSubscription: callbackify(createSubscription),
@@ -439,6 +429,9 @@ module.exports = {
   removeAddon: callbackify(removeAddon),
   pauseSubscription: callbackify(pauseSubscription),
   resumeSubscription: callbackify(resumeSubscription),
+  revertPlanChange: callbackify(revertPlanChange),
+  setSubscriptionRestorePoint: callbackify(setSubscriptionRestorePoint),
+  getSubscriptionRestorePoint: callbackify(getSubscriptionRestorePoint),
   promises: {
     validateNoSubscriptionInRecurly,
     createSubscription,
@@ -455,5 +448,8 @@ module.exports = {
     removeAddon,
     pauseSubscription,
     resumeSubscription,
+    revertPlanChange,
+    setSubscriptionRestorePoint,
+    getSubscriptionRestorePoint,
   },
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionHelper.js b/services/web/app/src/Features/Subscription/SubscriptionHelper.js
index efb8895280..35c3b4c132 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionHelper.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionHelper.js
@@ -1,23 +1,26 @@
 const { formatCurrency } = require('../../util/currency')
 const GroupPlansData = require('./GroupPlansData')
+const { isStandaloneAiAddOnPlanCode } = require('./AiHelper')
 
 /**
  * If the user changes to a less expensive plan, we shouldn't apply the change immediately.
  * This is to avoid unintended/artifical credits on users Recurly accounts.
  */
-function shouldPlanChangeAtTermEnd(oldPlan, newPlan) {
-  return oldPlan.price_in_cents > newPlan.price_in_cents
-}
+function shouldPlanChangeAtTermEnd(oldPlan, newPlan, isInTrial) {
+  if (isInTrial) {
+    // we should always upgrade or downgrade immediately if actively in trial
+    return false
+  }
 
-/**
- * This is duplicated in:
- *   - services/web/scripts/plan-prices/plans.mjs
- *   - services/web/modules/subscriptions/frontend/js/pages/plans/group-member-picker/group-plan-pricing.js
- * @param {number} number
- * @returns {number}
- */
-function roundUpToNearest5Cents(number) {
-  return Math.ceil(number * 20) / 20
+  if (
+    oldPlan.annual === newPlan.annual &&
+    isStandaloneAiAddOnPlanCode(oldPlan.planCode) &&
+    !isStandaloneAiAddOnPlanCode(newPlan.planCode)
+  ) {
+    // changing from an standalone AI add-on plan to a non-AI plan should not be considered a downgrade
+    return false
+  }
+  return oldPlan.price_in_cents > newPlan.price_in_cents
 }
 
 /**
@@ -34,7 +37,6 @@ function roundUpToNearest5Cents(number) {
  * @typedef {Object} LocalizedGroupPrice
  * @property {PlanToPrice} price
  * @property {PlanToPrice} pricePerUser
- * @property {PlanToPrice} pricePerUserPerMonth
  */
 
 /**
@@ -51,17 +53,11 @@ function generateInitialLocalizedGroupPrice(recommendedCurrency, locale) {
       INITIAL_LICENSE_SIZE
     ].price_in_cents / 100
   const collaboratorPricePerUser = collaboratorPrice / INITIAL_LICENSE_SIZE
-  const collaboratorPricePerUserPerMonth = roundUpToNearest5Cents(
-    collaboratorPrice / INITIAL_LICENSE_SIZE / 12
-  )
   const professionalPrice =
     GroupPlansData.enterprise.professional[recommendedCurrency][
       INITIAL_LICENSE_SIZE
     ].price_in_cents / 100
   const professionalPricePerUser = professionalPrice / INITIAL_LICENSE_SIZE
-  const professionalPricePerUserPerMonth = roundUpToNearest5Cents(
-    professionalPrice / INITIAL_LICENSE_SIZE / 12
-  )
 
   /**
    * @param {number} price
@@ -79,14 +75,78 @@ function generateInitialLocalizedGroupPrice(recommendedCurrency, locale) {
       collaborator: formatPrice(collaboratorPricePerUser),
       professional: formatPrice(professionalPricePerUser),
     },
-    pricePerUserPerMonth: {
-      collaborator: formatPrice(collaboratorPricePerUserPerMonth),
-      professional: formatPrice(professionalPricePerUserPerMonth),
-    },
   }
 }
 
+function isPaidSubscription(subscription) {
+  const hasRecurlySubscription =
+    subscription?.recurlySubscription_id &&
+    subscription?.recurlySubscription_id !== ''
+  const hasStripeSubscription =
+    subscription?.paymentProvider?.subscriptionId &&
+    subscription?.paymentProvider?.subscriptionId !== ''
+  return !!(subscription && (hasRecurlySubscription || hasStripeSubscription))
+}
+
+function isIndividualActivePaidSubscription(subscription) {
+  return (
+    isPaidSubscription(subscription) &&
+    subscription?.groupPlan === false &&
+    subscription?.recurlyStatus?.state !== 'canceled' &&
+    subscription?.paymentProvider?.state !== 'canceled'
+  )
+}
+
+function getPaymentProviderSubscriptionId(subscription) {
+  if (subscription?.recurlySubscription_id) {
+    return subscription.recurlySubscription_id
+  }
+  if (subscription?.paymentProvider?.subscriptionId) {
+    return subscription.paymentProvider.subscriptionId
+  }
+  return null
+}
+
+function getPaidSubscriptionState(subscription) {
+  if (subscription?.recurlyStatus?.state) {
+    return subscription.recurlyStatus.state
+  }
+  if (subscription?.paymentProvider?.state) {
+    return subscription.paymentProvider.state
+  }
+  return null
+}
+
+function getSubscriptionTrialStartedAt(subscription) {
+  if (subscription?.recurlyStatus?.trialStartedAt) {
+    return subscription.recurlyStatus?.trialStartedAt
+  }
+  return subscription?.paymentProvider?.trialStartedAt
+}
+
+function getSubscriptionTrialEndsAt(subscription) {
+  if (subscription?.recurlyStatus?.trialEndsAt) {
+    return subscription.recurlyStatus?.trialEndsAt
+  }
+  return subscription?.paymentProvider?.trialEndsAt
+}
+
+function isInTrial(trialEndsAt) {
+  if (!trialEndsAt) {
+    return false
+  }
+
+  return trialEndsAt.getTime() > Date.now()
+}
+
 module.exports = {
   shouldPlanChangeAtTermEnd,
   generateInitialLocalizedGroupPrice,
+  isPaidSubscription,
+  isIndividualActivePaidSubscription,
+  getPaymentProviderSubscriptionId,
+  getPaidSubscriptionState,
+  getSubscriptionTrialStartedAt,
+  getSubscriptionTrialEndsAt,
+  isInTrial,
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionLocator.js b/services/web/app/src/Features/Subscription/SubscriptionLocator.js
index a980399c29..a867cf698a 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionLocator.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionLocator.js
@@ -1,11 +1,13 @@
+/**
+ * @import { AddOn } from '../../../../types/subscription/plan'
+ */
+
 const { callbackifyAll } = require('@overleaf/promise-utils')
 const { Subscription } = require('../../models/Subscription')
+const SubscriptionHelper = require('./SubscriptionHelper')
 const { DeletedSubscription } = require('../../models/DeletedSubscription')
 const logger = require('@overleaf/logger')
-const {
-  AI_ADD_ON_CODE,
-  isStandaloneAiAddOnPlanCode,
-} = require('./RecurlyEntities')
+const { AI_ADD_ON_CODE, isStandaloneAiAddOnPlanCode } = require('./AiHelper')
 require('./GroupPlansData') // make sure dynamic group plans are loaded
 
 const SubscriptionLocator = {
@@ -121,9 +123,12 @@ const SubscriptionLocator = {
   async hasAiAssist(userOrId) {
     const userId = SubscriptionLocator._getUserId(userOrId)
     const subscription = await Subscription.findOne({ admin_id: userId }).exec()
+    // todo: as opposed to recurlyEntities which use addon.code, subscription model uses addon.addOnCode
+    //  which we hope to align via https://github.com/overleaf/internal/issues/25494
     return Boolean(
-      isStandaloneAiAddOnPlanCode(subscription?.planCode) ||
-        subscription?.addOns?.some(addOn => addOn.code === AI_ADD_ON_CODE)
+      (subscription?.planCode &&
+        isStandaloneAiAddOnPlanCode(subscription?.planCode)) ||
+        subscription?.addOns?.some(addOn => addOn.addOnCode === AI_ADD_ON_CODE)
     )
   },
 
@@ -134,6 +139,68 @@ const SubscriptionLocator = {
       return userOrId
     }
   },
+
+  /**
+   * Retrieves the last successful subscription for a given user.
+   *
+   * @async
+   * @function
+   * @param {string} recurlyId - The ID of the recurly subscription tied to the mongo subscription to check for a previous successful state.
+   * @returns {Promise<{_id: ObjectId, planCode: string, addOns: [AddOn]}|null>} A promise that resolves to the last successful planCode and addon state,
+   *   or null if we havent stored a previous
+   */
+  async getLastSuccessfulSubscription(recurlyId) {
+    const subscription = await Subscription.findOne({
+      recurlySubscription_id: recurlyId,
+    }).exec()
+    return subscription && subscription.lastSuccesfulSubscription
+      ? {
+          ...subscription.lastSuccesfulSubscription,
+          _id: subscription._id,
+        }
+      : null
+  },
+
+  async getUserSubscriptionStatus(userId) {
+    let usersSubscription = { personal: false, group: false }
+
+    if (!userId) {
+      return usersSubscription
+    }
+
+    const memberSubscriptions =
+      await SubscriptionLocator.getMemberSubscriptions(userId)
+
+    const hasActiveGroupSubscription = memberSubscriptions.some(
+      subscription =>
+        subscription.groupPlan &&
+        SubscriptionHelper.getPaidSubscriptionState(subscription) === 'active'
+    )
+    if (hasActiveGroupSubscription) {
+      // Member of a group plan
+      usersSubscription = { ...usersSubscription, group: true }
+    }
+
+    const personalSubscription =
+      await SubscriptionLocator.getUsersSubscription(userId)
+
+    if (personalSubscription) {
+      const hasActivePersonalSubscription =
+        SubscriptionHelper.getPaidSubscriptionState(personalSubscription) ===
+        'active'
+      if (hasActivePersonalSubscription) {
+        if (personalSubscription.groupPlan) {
+          // Owner of a group plan
+          usersSubscription = { ...usersSubscription, group: true }
+        } else {
+          // Owner of an individual plan
+          usersSubscription = { ...usersSubscription, personal: true }
+        }
+      }
+    }
+
+    return usersSubscription
+  },
 }
 
 module.exports = {
diff --git a/services/web/app/src/Features/Subscription/SubscriptionRouter.mjs b/services/web/app/src/Features/Subscription/SubscriptionRouter.mjs
index 0bb30b578e..6cc83bf232 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionRouter.mjs
+++ b/services/web/app/src/Features/Subscription/SubscriptionRouter.mjs
@@ -19,10 +19,12 @@ const subscriptionRateLimiter = new RateLimiter('subscription', {
 })
 
 const MAX_NUMBER_OF_USERS = 20
+const MAX_NUMBER_OF_PO_NUMBER_CHARACTERS = 50
 
 const addSeatsValidateSchema = {
   body: Joi.object({
     adding: Joi.number().integer().min(1).max(MAX_NUMBER_OF_USERS).required(),
+    poNumber: Joi.string().max(MAX_NUMBER_OF_PO_NUMBER_CHARACTERS),
   }),
 }
 
@@ -54,13 +56,6 @@ export default {
       SubscriptionController.canceledSubscription
     )
 
-    webRouter.get(
-      '/user/subscription/recurly/:pageType',
-      AuthenticationController.requireLogin(),
-      RateLimiterMiddleware.rateLimit(subscriptionRateLimiter),
-      SubscriptionController.redirectToHostedPage
-    )
-
     webRouter.delete(
       '/subscription/group/user',
       AuthenticationController.requireLogin(),
@@ -97,6 +92,7 @@ export default {
       validate({
         body: Joi.object({
           adding: Joi.number().integer().min(MAX_NUMBER_OF_USERS).required(),
+          poNumber: Joi.string(),
         }),
       }),
       RateLimiterMiddleware.rateLimit(subscriptionRateLimiter),
@@ -110,6 +106,13 @@ export default {
       SubscriptionGroupController.subscriptionUpgradePage
     )
 
+    webRouter.get(
+      '/user/subscription/group/group-plan-per-user-prices',
+      AuthenticationController.requireLogin(),
+      RateLimiterMiddleware.rateLimit(subscriptionRateLimiter),
+      SubscriptionGroupController.getGroupPlanPerUserPrices
+    )
+
     webRouter.post(
       '/user/subscription/group/upgrade-subscription',
       AuthenticationController.requireLogin(),
diff --git a/services/web/app/src/Features/Subscription/SubscriptionUpdater.js b/services/web/app/src/Features/Subscription/SubscriptionUpdater.js
index 2e43454da9..9de194f262 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionUpdater.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionUpdater.js
@@ -10,8 +10,40 @@ const { DeletedSubscription } = require('../../models/DeletedSubscription')
 const logger = require('@overleaf/logger')
 const Features = require('../../infrastructure/Features')
 const UserAuditLogHandler = require('../User/UserAuditLogHandler')
+const UserUpdater = require('../User/UserUpdater')
 const AccountMappingHelper = require('../Analytics/AccountMappingHelper')
 const { SSOConfig } = require('../../models/SSOConfig')
+const mongoose = require('../../infrastructure/Mongoose')
+const Modules = require('../../infrastructure/Modules')
+
+/**
+ * @typedef {import('../../../../types/subscription/dashboard/subscription').Subscription} Subscription
+ * @typedef {import('../../../../types/subscription/dashboard/subscription').PaymentProvider} PaymentProvider
+ * @typedef {import('../../../../types/group-management/group-audit-log').GroupAuditLog} GroupAuditLog
+ * @import { AddOn } from '../../../../types/subscription/plan'
+ */
+
+/**
+ *
+ * @param {GroupAuditLog} auditLog
+ */
+async function subscriptionUpdateWithAuditLog(dbFilter, dbUpdate, auditLog) {
+  const session = await mongoose.startSession()
+
+  try {
+    await session.withTransaction(async () => {
+      await Subscription.updateOne(dbFilter, dbUpdate, { session }).exec()
+
+      await Modules.promises.hooks.fire(
+        'addGroupAuditLogEntry',
+        auditLog,
+        session
+      )
+    })
+  } finally {
+    await session.endSession()
+  }
+}
 
 /**
  * Change the admin of the given subscription.
@@ -51,7 +83,7 @@ async function syncSubscription(
   let subscription =
     await SubscriptionLocator.promises.getUsersSubscription(adminUserId)
   if (subscription == null) {
-    subscription = await _createNewSubscription(adminUserId)
+    subscription = await createNewSubscription(adminUserId)
   }
   await updateSubscriptionFromRecurly(
     recurlySubscription,
@@ -60,7 +92,7 @@ async function syncSubscription(
   )
 }
 
-async function addUserToGroup(subscriptionId, userId) {
+async function addUserToGroup(subscriptionId, userId, auditLog) {
   await UserAuditLogHandler.promises.addEntry(
     userId,
     'join-group-subscription',
@@ -68,10 +100,18 @@ async function addUserToGroup(subscriptionId, userId) {
     undefined,
     { subscriptionId }
   )
-  await Subscription.updateOne(
+
+  await subscriptionUpdateWithAuditLog(
     { _id: subscriptionId },
-    { $addToSet: { member_ids: userId } }
-  ).exec()
+    { $addToSet: { member_ids: userId } },
+    {
+      initiatorId: auditLog?.initiatorId,
+      ipAddress: auditLog?.ipAddress,
+      groupId: subscriptionId,
+      operation: 'join-group',
+    }
+  )
+
   await FeaturesUpdater.promises.refreshFeatures(userId, 'add-to-group')
   await _sendUserGroupPlanCodeUserProperty(userId)
   await _sendSubscriptionEvent(
@@ -81,7 +121,7 @@ async function addUserToGroup(subscriptionId, userId) {
   )
 }
 
-async function removeUserFromGroup(subscriptionId, userId) {
+async function removeUserFromGroup(subscriptionId, userId, auditLog) {
   await UserAuditLogHandler.promises.addEntry(
     userId,
     'leave-group-subscription',
@@ -89,10 +129,37 @@ async function removeUserFromGroup(subscriptionId, userId) {
     undefined,
     { subscriptionId }
   )
+
+  await subscriptionUpdateWithAuditLog(
+    { _id: subscriptionId },
+    { $pull: { member_ids: userId } },
+    {
+      initiatorId: auditLog?.initiatorId,
+      ipAddress: auditLog?.ipAddress,
+      groupId: subscriptionId,
+      operation: 'leave-group',
+      info: { userIdRemoved: userId },
+    }
+  )
+
   await Subscription.updateOne(
     { _id: subscriptionId },
     { $pull: { member_ids: userId } }
   ).exec()
+
+  const subscription = await Subscription.findById(subscriptionId)
+  if (subscription.managedUsersEnabled) {
+    await UserUpdater.promises.updateUser(
+      { _id: userId },
+      {
+        $unset: {
+          'enrollment.managedBy': 1,
+          'enrollment.enrolledAt': 1,
+        },
+      }
+    )
+  }
+
   await FeaturesUpdater.promises.refreshFeatures(
     userId,
     'remove-user-from-group'
@@ -160,7 +227,7 @@ async function deleteSubscription(subscription, deleterData) {
   await Subscription.deleteOne({ _id: subscription._id }).exec()
 
   // 4. refresh users features
-  await _scheduleRefreshFeatures(subscription)
+  await scheduleRefreshFeatures(subscription)
 }
 
 async function restoreSubscription(subscriptionId) {
@@ -201,7 +268,11 @@ async function refreshUsersFeatures(subscription) {
   }
 }
 
-async function _scheduleRefreshFeatures(subscription) {
+/**
+ *
+ * @param {Subscription} subscription
+ */
+async function scheduleRefreshFeatures(subscription) {
   const userIds = [subscription.admin_id].concat(subscription.member_ids || [])
   for (const userId of userIds) {
     await FeaturesUpdater.promises.scheduleRefreshFeatures(
@@ -226,7 +297,13 @@ async function createDeletedSubscription(subscription, deleterData) {
   await DeletedSubscription.findOneAndUpdate(filter, data, options).exec()
 }
 
-async function _createNewSubscription(adminUserId) {
+/**
+ * Creates a new subscription for the given admin user.
+ *
+ * @param {string} adminUserId
+ * @returns {Promise<Subscription>}
+ */
+async function createNewSubscription(adminUserId) {
   const subscription = new Subscription({
     admin_id: adminUserId,
     manager_ids: [adminUserId],
@@ -242,7 +319,7 @@ async function _deleteAndReplaceSubscriptionFromRecurly(
 ) {
   const adminUserId = subscription.admin_id
   await deleteSubscription(subscription, requesterData)
-  const newSubscription = await _createNewSubscription(adminUserId)
+  const newSubscription = await createNewSubscription(adminUserId)
   await updateSubscriptionFromRecurly(
     recurlySubscription,
     newSubscription,
@@ -256,38 +333,7 @@ async function updateSubscriptionFromRecurly(
   requesterData
 ) {
   if (recurlySubscription.state === 'expired') {
-    const hasManagedUsersFeature =
-      Features.hasFeature('saas') && subscription?.managedUsersEnabled
-
-    // If a payment lapses and if the group is managed or has group SSO, as a temporary measure we need to
-    // make sure that the group continues as-is and no destructive actions are taken.
-    if (hasManagedUsersFeature) {
-      logger.warn(
-        { subscriptionId: subscription._id },
-        'expired subscription has managedUsers feature enabled, skipping deletion'
-      )
-    } else {
-      let hasGroupSSOEnabled = false
-      if (subscription?.ssoConfig) {
-        const ssoConfig = await SSOConfig.findOne({
-          _id: subscription.ssoConfig._id || subscription.ssoConfig,
-        })
-          .lean()
-          .exec()
-        if (ssoConfig.enabled) {
-          hasGroupSSOEnabled = true
-        }
-      }
-
-      if (hasGroupSSOEnabled) {
-        logger.warn(
-          { subscriptionId: subscription._id },
-          'expired subscription has groupSSO feature enabled, skipping deletion'
-        )
-      } else {
-        await deleteSubscription(subscription, requesterData)
-      }
-    }
+    await handleExpiredSubscription(subscription, requesterData)
     return
   }
   const updatedPlanCode = recurlySubscription.plan.plan_code
@@ -356,7 +402,7 @@ async function updateSubscriptionFromRecurly(
     AnalyticsManager.registerAccountMapping(accountMapping)
   }
 
-  await _scheduleRefreshFeatures(subscription)
+  await scheduleRefreshFeatures(subscription)
 }
 
 async function _sendUserGroupPlanCodeUserProperty(userId) {
@@ -388,6 +434,41 @@ async function _sendUserGroupPlanCodeUserProperty(userId) {
   }
 }
 
+async function handleExpiredSubscription(subscription, requesterData) {
+  const hasManagedUsersFeature =
+    Features.hasFeature('saas') && subscription?.managedUsersEnabled
+
+  // If a payment lapses and if the group is managed or has group SSO, as a temporary measure we need to
+  // make sure that the group continues as-is and no destructive actions are taken.
+  if (hasManagedUsersFeature) {
+    logger.warn(
+      { subscriptionId: subscription._id },
+      'expired subscription has managedUsers feature enabled, skipping deletion'
+    )
+  } else {
+    let hasGroupSSOEnabled = false
+    if (subscription?.ssoConfig) {
+      const ssoConfig = await SSOConfig.findOne({
+        _id: subscription.ssoConfig._id || subscription.ssoConfig,
+      })
+        .lean()
+        .exec()
+      if (ssoConfig.enabled) {
+        hasGroupSSOEnabled = true
+      }
+    }
+
+    if (hasGroupSSOEnabled) {
+      logger.warn(
+        { subscriptionId: subscription._id },
+        'expired subscription has groupSSO feature enabled, skipping deletion'
+      )
+    } else {
+      await deleteSubscription(subscription, requesterData)
+    }
+  }
+}
+
 async function _sendSubscriptionEvent(userId, subscriptionId, event) {
   const subscription = await Subscription.findOne(
     { _id: subscriptionId },
@@ -425,9 +506,57 @@ async function _sendSubscriptionEventForAllMembers(subscriptionId, event) {
   }
 }
 
+/**
+ * Sets the plan code and addon state to revert the plan to in case of failed upgrades, or clears the last restore point if it was used/ voided
+ * @param {ObjectId} subscriptionId the mongo ID of the subscription to set the restore point for
+ * @param {string} planCode the plan code to revert to
+ * @param {Array<AddOn>} addOns the addOns to revert to
+ * @param {Boolean} consumed whether the restore point was used to revert a subscription
+ */
+async function setRestorePoint(subscriptionId, planCode, addOns, consumed) {
+  const update = {
+    $set: {
+      'lastSuccesfulSubscription.planCode': planCode,
+      'lastSuccesfulSubscription.addOns': addOns,
+    },
+  }
+
+  if (consumed) {
+    update.$inc = { timesRevertedDueToFailedPayment: 1 }
+  }
+
+  await Subscription.updateOne({ _id: subscriptionId }, update).exec()
+}
+
+/**
+ * Clears the restore point for a given subscription, and signals that the subscription was sucessfully reverted.
+ *
+ * @async
+ * @function setSubscriptionWasReverted
+ * @param {ObjectId} subscriptionId the mongo ID of the subscription to set the restore point for
+ * @returns {Promise<void>} Resolves when the restore point has been cleared.
+ */
+async function setSubscriptionWasReverted(subscriptionId) {
+  // consume the backup and flag that the subscription was reverted due to failed payment
+  await setRestorePoint(subscriptionId, null, null, true)
+}
+
+/**
+ * Clears the restore point for a given subscription, and signals that the subscription was not reverted.
+ *
+ * @async
+ * @function voidRestorePoint
+ * @param {string} subscriptionId - The unique identifier of the subscription.
+ * @returns {Promise<void>} Resolves when the restore point has been cleared.
+ */
+async function voidRestorePoint(subscriptionId) {
+  await setRestorePoint(subscriptionId, null, null, false)
+}
+
 module.exports = {
   updateAdmin: callbackify(updateAdmin),
   syncSubscription: callbackify(syncSubscription),
+  createNewSubscription: callbackify(createNewSubscription),
   deleteSubscription: callbackify(deleteSubscription),
   createDeletedSubscription: callbackify(createDeletedSubscription),
   addUserToGroup: callbackify(addUserToGroup),
@@ -437,9 +566,14 @@ module.exports = {
   deleteWithV1Id: callbackify(deleteWithV1Id),
   restoreSubscription: callbackify(restoreSubscription),
   updateSubscriptionFromRecurly: callbackify(updateSubscriptionFromRecurly),
+  scheduleRefreshFeatures: callbackify(scheduleRefreshFeatures),
+  setSubscriptionRestorePoint: callbackify(setRestorePoint),
+  setSubscriptionWasReverted: callbackify(setSubscriptionWasReverted),
+  voidRestorePoint: callbackify(voidRestorePoint),
   promises: {
     updateAdmin,
     syncSubscription,
+    createNewSubscription,
     addUserToGroup,
     refreshUsersFeatures,
     removeUserFromGroup,
@@ -449,5 +583,10 @@ module.exports = {
     deleteWithV1Id,
     restoreSubscription,
     updateSubscriptionFromRecurly,
+    scheduleRefreshFeatures,
+    setRestorePoint,
+    setSubscriptionWasReverted,
+    voidRestorePoint,
+    handleExpiredSubscription,
   },
 }
diff --git a/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js b/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
index aa3d577991..9672af6cd5 100644
--- a/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
+++ b/services/web/app/src/Features/Subscription/SubscriptionViewModelBuilder.js
@@ -1,14 +1,10 @@
 // ts-check
 const Settings = require('@overleaf/settings')
-const RecurlyWrapper = require('./RecurlyWrapper')
 const PlansLocator = require('./PlansLocator')
-const {
-  isStandaloneAiAddOnPlanCode,
-  MEMBERS_LIMIT_ADD_ON_CODE,
-} = require('./RecurlyEntities')
+const { isStandaloneAiAddOnPlanCode } = require('./AiHelper')
+const { MEMBERS_LIMIT_ADD_ON_CODE } = require('./PaymentProviderEntities')
 const SubscriptionFormatters = require('./SubscriptionFormatters')
 const SubscriptionLocator = require('./SubscriptionLocator')
-const SubscriptionUpdater = require('./SubscriptionUpdater')
 const InstitutionsGetter = require('../Institutions/InstitutionsGetter')
 const InstitutionsManager = require('../Institutions/InstitutionsManager')
 const PublishersGetter = require('../Publishers/PublishersGetter')
@@ -17,19 +13,18 @@ const _ = require('lodash')
 const async = require('async')
 const SubscriptionHelper = require('./SubscriptionHelper')
 const { callbackify } = require('@overleaf/promise-utils')
-const {
-  InvalidError,
-  NotFoundError,
-  V1ConnectionError,
-} = require('../Errors/Errors')
+const { V1ConnectionError } = require('../Errors/Errors')
 const FeaturesHelper = require('./FeaturesHelper')
+const { formatCurrency } = require('../../util/currency')
+const Modules = require('../../infrastructure/Modules')
 
 /**
  * @import { Subscription } from "../../../../types/project/dashboard/subscription"
+ * @import { Subscription as DBSubscription } from "../../models/Subscription"
  */
 
 function buildHostedLink(type) {
-  return `/user/subscription/recurly/${type}`
+  return `/user/subscription/payment/${type}`
 }
 
 // Downgrade from Mongoose object, so we can add custom attributes to object
@@ -39,37 +34,18 @@ function serializeMongooseObject(object) {
     : object
 }
 
-async function getRedirectToHostedPage(userId, pageType) {
-  if (!['billing-details', 'account-management'].includes(pageType)) {
-    throw new InvalidError('unexpected page type')
+async function isEligibleForGroupPlan(service, isInTrial) {
+  if (isInTrial) {
+    return false
   }
-  const personalSubscription =
-    await SubscriptionLocator.promises.getUsersSubscription(userId)
-  const recurlySubscriptionId = personalSubscription?.recurlySubscription_id
-  if (!recurlySubscriptionId) {
-    throw new NotFoundError('not a recurly subscription')
-  }
-  const recurlySubscription = await RecurlyWrapper.promises.getSubscription(
-    recurlySubscriptionId,
-    { includeAccount: true }
-  )
 
-  const recurlySubdomain = Settings.apis.recurly.subdomain
-  const hostedLoginToken = recurlySubscription.account.hosted_login_token
-  if (!hostedLoginToken) {
-    throw new Error('recurly account does not have hosted login token')
+  if (service === 'recurly') {
+    return true
   }
-  let path = ''
-  if (pageType === 'billing-details') {
-    path = 'billing_info/edit?ht='
-  }
-  return [
-    'https://',
-    recurlySubdomain,
-    '.recurly.com/account/',
-    path,
-    hostedLoginToken,
-  ].join('')
+  const [result] = await Modules.promises.hooks.fire(
+    'canUpgradeFromIndividualToGroup'
+  )
+  return result
 }
 
 async function buildUsersSubscriptionViewModel(user, locale = 'en') {
@@ -80,38 +56,16 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
     currentInstitutionsWithLicence,
     managedInstitutions,
     managedPublishers,
-    recurlySubscription,
-    recurlyCoupons,
+    fetchedPaymentRecord,
     plan,
   } = await async.auto({
     personalSubscription(cb) {
       SubscriptionLocator.getUsersSubscription(user, cb)
     },
-    recurlySubscription: [
+    fetchedPaymentRecord: [
       'personalSubscription',
       ({ personalSubscription }, cb) => {
-        if (
-          personalSubscription == null ||
-          personalSubscription.recurlySubscription_id == null ||
-          personalSubscription.recurlySubscription_id === ''
-        ) {
-          return cb(null, null)
-        }
-        RecurlyWrapper.getSubscription(
-          personalSubscription.recurlySubscription_id,
-          { includeAccount: true },
-          cb
-        )
-      },
-    ],
-    recurlyCoupons: [
-      'recurlySubscription',
-      ({ recurlySubscription }, cb) => {
-        if (!recurlySubscription) {
-          return cb(null, null)
-        }
-        const accountId = recurlySubscription.account.account_code
-        RecurlyWrapper.getAccountActiveCoupons(accountId, cb)
+        Modules.hooks.fire('getPaymentFromRecord', personalSubscription, cb)
       },
     ],
     plan: [
@@ -158,6 +112,8 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
     },
   })
 
+  const paymentRecord = fetchedPaymentRecord && fetchedPaymentRecord[0]
+
   if (memberGroupSubscriptions == null) {
     memberGroupSubscriptions = []
   } else {
@@ -170,9 +126,7 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
         _id: group._id,
         planCode: group.planCode,
         teamName: group.teamName,
-        admin_id: {
-          email: group.admin_id.email,
-        },
+        admin_id: { email: group.admin_id.email },
         userIsGroupManager,
       }
 
@@ -199,10 +153,7 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
         planCode: group.planCode,
         groupPlan: group.groupPlan,
         teamName: group.teamName,
-        admin_id: {
-          _id: group.admin_id._id,
-          email: group.admin_id.email,
-        },
+        admin_id: { _id: group.admin_id._id, email: group.admin_id.email },
         features: group.features,
         userIsGroupMember,
       }
@@ -216,9 +167,6 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
   if (managedInstitutions == null) {
     managedInstitutions = []
   }
-  if (recurlyCoupons == null) {
-    recurlyCoupons = []
-  }
 
   personalSubscription = serializeMongooseObject(personalSubscription)
 
@@ -235,14 +183,6 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
     personalSubscription.plan = plan
   }
 
-  // Subscription DB object contains a recurly property, used to cache trial info
-  // on the project-list. However, this can cause the wrong template to render,
-  // if we do not have any subscription data from Recurly (recurlySubscription)
-  // TODO: Delete this workaround once recurly cache property name migration rolled out.
-  if (personalSubscription) {
-    delete personalSubscription.recurly
-  }
-
   function getPlanOnlyDisplayPrice(
     totalPlanPriceInCents,
     taxRate,
@@ -251,8 +191,8 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
     // The MEMBERS_LIMIT_ADD_ON_CODE is considered as part of the new plan model
     const allAddOnsPriceInCentsExceptAdditionalLicensePrice = addOns.reduce(
       (prev, curr) => {
-        return curr.add_on_code !== MEMBERS_LIMIT_ADD_ON_CODE
-          ? curr.quantity * curr.unit_amount_in_cents + prev
+        return curr.code !== MEMBERS_LIMIT_ADD_ON_CODE
+          ? curr.quantity * curr.unitPrice + prev
           : prev
       },
       0
@@ -261,24 +201,24 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
       allAddOnsPriceInCentsExceptAdditionalLicensePrice +
       allAddOnsPriceInCentsExceptAdditionalLicensePrice * taxRate
 
-    return SubscriptionFormatters.formatPriceLocalized(
+    return formatCurrency(
       totalPlanPriceInCents -
         allAddOnsTotalPriceInCentsExceptAdditionalLicensePrice,
-      recurlySubscription.currency,
+      paymentRecord.subscription.currency,
       locale
     )
   }
 
   function getAddOnDisplayPricesWithoutAdditionalLicense(taxRate, addOns = []) {
     return addOns.reduce((prev, curr) => {
-      if (curr.add_on_code !== MEMBERS_LIMIT_ADD_ON_CODE) {
-        const priceInCents = curr.quantity * curr.unit_amount_in_cents
+      if (curr.code !== MEMBERS_LIMIT_ADD_ON_CODE) {
+        const priceInCents = curr.quantity * curr.unitPrice
         const totalPriceInCents = priceInCents + priceInCents * taxRate
 
         if (totalPriceInCents > 0) {
-          prev[curr.add_on_code] = SubscriptionFormatters.formatPriceLocalized(
+          prev[curr.code] = formatCurrency(
             totalPriceInCents,
-            recurlySubscription.currency,
+            paymentRecord.subscription.currency,
             locale
           )
         }
@@ -288,124 +228,148 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
     }, {})
   }
 
-  if (personalSubscription && recurlySubscription) {
-    const tax = recurlySubscription.tax_in_cents || 0
+  if (personalSubscription && paymentRecord && paymentRecord.subscription) {
+    // don't return subscription payment information
+    personalSubscription.service =
+      personalSubscription.paymentProvider?.service ?? 'recurly'
+    delete personalSubscription.paymentProvider
+    delete personalSubscription.recurly
+    delete personalSubscription.recurlySubscription_id
+
+    const tax = paymentRecord.subscription.taxAmount || 0
     // Some plans allow adding more seats than the base plan provides.
     // This is recorded as a subscription add on.
-    // Note: tax_in_cents already includes the tax for any addon.
+    // Note: taxAmount already includes the tax for any addon.
     let addOnPrice = 0
     let additionalLicenses = 0
-    const addOns = recurlySubscription.subscription_add_ons || []
-    const taxRate = recurlySubscription.tax_rate
-      ? parseFloat(recurlySubscription.tax_rate._)
-      : 0
+    const addOns = paymentRecord.subscription.addOns || []
+    const taxRate = paymentRecord.subscription.taxRate
     addOns.forEach(addOn => {
-      addOnPrice += addOn.quantity * addOn.unit_amount_in_cents
-      if (addOn.add_on_code === plan.membersLimitAddOn) {
+      addOnPrice += addOn.quantity * addOn.unitPrice
+      if (addOn.code === plan.membersLimitAddOn) {
         additionalLicenses += addOn.quantity
       }
     })
     const totalLicenses = (plan.membersLimit || 0) + additionalLicenses
-    personalSubscription.recurly = {
-      tax,
+    const isInTrial =
+      paymentRecord.subscription.trialPeriodEnd &&
+      paymentRecord.subscription.trialPeriodEnd.getTime() > Date.now()
+    personalSubscription.payment = {
       taxRate,
-      billingDetailsLink: buildHostedLink('billing-details'),
+      billingDetailsLink:
+        paymentRecord.subscription.service === 'recurly'
+          ? buildHostedLink('billing-details')
+          : null,
       accountManagementLink: buildHostedLink('account-management'),
       additionalLicenses,
       addOns,
       totalLicenses,
       nextPaymentDueAt: SubscriptionFormatters.formatDateTime(
-        recurlySubscription.current_period_ends_at
+        paymentRecord.subscription.periodEnd
       ),
       nextPaymentDueDate: SubscriptionFormatters.formatDate(
-        recurlySubscription.current_period_ends_at
+        paymentRecord.subscription.periodEnd
       ),
-      currency: recurlySubscription.currency,
-      state: recurlySubscription.state,
+      currency: paymentRecord.subscription.currency,
+      state: paymentRecord.subscription.state,
       trialEndsAtFormatted: SubscriptionFormatters.formatDateTime(
-        recurlySubscription.trial_ends_at
+        paymentRecord.subscription.trialPeriodEnd
+      ),
+      trialEndsAt: paymentRecord.subscription.trialPeriodEnd,
+      activeCoupons: paymentRecord.coupons,
+      accountEmail: paymentRecord.account.email,
+      hasPastDueInvoice: paymentRecord.account.hasPastDueInvoice,
+      pausedAt: paymentRecord.subscription.pausePeriodStart,
+      remainingPauseCycles: paymentRecord.subscription.remainingPauseCycles,
+      isEligibleForPause:
+        paymentRecord.subscription.service === 'recurly' &&
+        !personalSubscription.pendingPlan &&
+        !personalSubscription.groupPlan &&
+        !isInTrial &&
+        !paymentRecord.subscription.planCode.includes('ann') &&
+        !paymentRecord.subscription.addOns?.length > 0,
+      isEligibleForGroupPlan: await isEligibleForGroupPlan(
+        paymentRecord.subscription.service,
+        isInTrial
       ),
-      trial_ends_at: recurlySubscription.trial_ends_at,
-      activeCoupons: recurlyCoupons,
-      account: recurlySubscription.account,
-      pausedAt: recurlySubscription.paused_at,
-      remainingPauseCycles: recurlySubscription.remaining_pause_cycles,
     }
-    if (recurlySubscription.pending_subscription) {
-      const pendingPlan = PlansLocator.findLocalPlanInSettings(
-        recurlySubscription.pending_subscription.plan.plan_code
-      )
+
+    const isMonthlyCollaboratorPlan =
+      personalSubscription.planCode.includes('collaborator') &&
+      !personalSubscription.planCode.includes('ann') &&
+      !personalSubscription.plan.groupPlan
+    personalSubscription.payment.isEligibleForDowngradeUpsell =
+      !personalSubscription.payment.pausedAt &&
+      !personalSubscription.payment.remainingPauseCycles &&
+      isMonthlyCollaboratorPlan &&
+      !isInTrial &&
+      paymentRecord.subscription.service === 'recurly'
+
+    if (paymentRecord.subscription.pendingChange) {
+      const pendingPlanCode =
+        paymentRecord.subscription.pendingChange.nextPlanCode
+      const pendingPlan = PlansLocator.findLocalPlanInSettings(pendingPlanCode)
       if (pendingPlan == null) {
-        throw new Error(
-          `No plan found for planCode '${personalSubscription.planCode}'`
-        )
+        throw new Error(`No plan found for planCode '${pendingPlanCode}'`)
       }
       let pendingAdditionalLicenses = 0
       let pendingAddOnTax = 0
       let pendingAddOnPrice = 0
-      if (recurlySubscription.pending_subscription.subscription_add_ons) {
-        const pendingRecurlyAddons =
-          recurlySubscription.pending_subscription.subscription_add_ons
-        pendingRecurlyAddons.forEach(addOn => {
-          pendingAddOnPrice += addOn.quantity * addOn.unit_amount_in_cents
-          if (addOn.add_on_code === pendingPlan.membersLimitAddOn) {
+      if (paymentRecord.subscription.pendingChange.nextAddOns) {
+        const pendingAddOns =
+          paymentRecord.subscription.pendingChange.nextAddOns
+        pendingAddOns.forEach(addOn => {
+          pendingAddOnPrice += addOn.quantity * addOn.unitPrice
+          if (addOn.code === pendingPlan.membersLimitAddOn) {
             pendingAdditionalLicenses += addOn.quantity
           }
         })
         // Need to calculate tax ourselves as we don't get tax amounts for pending subs
         pendingAddOnTax =
-          personalSubscription.recurly.taxRate * pendingAddOnPrice
-        pendingPlan.addOns = pendingRecurlyAddons
+          personalSubscription.payment.taxRate * pendingAddOnPrice
+        pendingPlan.addOns = pendingAddOns
       }
       const pendingSubscriptionTax =
-        personalSubscription.recurly.taxRate *
-        recurlySubscription.pending_subscription.unit_amount_in_cents
-      const totalPriceInCents =
-        recurlySubscription.pending_subscription.unit_amount_in_cents +
+        personalSubscription.payment.taxRate *
+        paymentRecord.subscription.pendingChange.nextPlanPrice
+      const totalPrice =
+        paymentRecord.subscription.pendingChange.nextPlanPrice +
         pendingAddOnPrice +
         pendingAddOnTax +
         pendingSubscriptionTax
-      personalSubscription.recurly.displayPrice =
-        SubscriptionFormatters.formatPriceLocalized(
-          totalPriceInCents,
-          recurlySubscription.currency,
-          locale
-        )
-      personalSubscription.recurly.currentPlanDisplayPrice =
-        SubscriptionFormatters.formatPriceLocalized(
-          recurlySubscription.unit_amount_in_cents + addOnPrice + tax,
-          recurlySubscription.currency,
-          locale
-        )
-      personalSubscription.recurly.planOnlyDisplayPrice =
+
+      personalSubscription.payment.displayPrice = formatCurrency(
+        totalPrice,
+        paymentRecord.subscription.currency,
+        locale
+      )
+      personalSubscription.payment.planOnlyDisplayPrice =
         getPlanOnlyDisplayPrice(
-          totalPriceInCents,
+          totalPrice,
           taxRate,
-          recurlySubscription.pending_subscription.subscription_add_ons
+          paymentRecord.subscription.pendingChange.nextAddOns
         )
-      personalSubscription.recurly.addOnDisplayPricesWithoutAdditionalLicense =
+      personalSubscription.payment.addOnDisplayPricesWithoutAdditionalLicense =
         getAddOnDisplayPricesWithoutAdditionalLicense(
           taxRate,
-          recurlySubscription.pending_subscription.subscription_add_ons
+          paymentRecord.subscription.pendingChange.nextAddOns
         )
       const pendingTotalLicenses =
         (pendingPlan.membersLimit || 0) + pendingAdditionalLicenses
-      personalSubscription.recurly.pendingAdditionalLicenses =
+      personalSubscription.payment.pendingAdditionalLicenses =
         pendingAdditionalLicenses
-      personalSubscription.recurly.pendingTotalLicenses = pendingTotalLicenses
+      personalSubscription.payment.pendingTotalLicenses = pendingTotalLicenses
       personalSubscription.pendingPlan = pendingPlan
     } else {
-      const totalPriceInCents =
-        recurlySubscription.unit_amount_in_cents + addOnPrice + tax
-      personalSubscription.recurly.displayPrice =
-        SubscriptionFormatters.formatPriceLocalized(
-          totalPriceInCents,
-          recurlySubscription.currency,
-          locale
-        )
-      personalSubscription.recurly.planOnlyDisplayPrice =
-        getPlanOnlyDisplayPrice(totalPriceInCents, taxRate, addOns)
-      personalSubscription.recurly.addOnDisplayPricesWithoutAdditionalLicense =
+      const totalPrice = paymentRecord.subscription.planPrice + addOnPrice + tax
+      personalSubscription.payment.displayPrice = formatCurrency(
+        totalPrice,
+        paymentRecord.subscription.currency,
+        locale
+      )
+      personalSubscription.payment.planOnlyDisplayPrice =
+        getPlanOnlyDisplayPrice(totalPrice, taxRate, addOns)
+      personalSubscription.payment.addOnDisplayPricesWithoutAdditionalLicense =
         getAddOnDisplayPricesWithoutAdditionalLicense(taxRate, addOns)
     }
   }
@@ -422,9 +386,9 @@ async function buildUsersSubscriptionViewModel(user, locale = 'en') {
 
 /**
  * @param {{_id: string}} user
- * @returns {Promise<Subscription>}
+ * @returns {Promise<{bestSubscription:Subscription,individualSubscription:DBSubscription|null,memberGroupSubscriptions:DBSubscription[]}>}
  */
-async function getBestSubscription(user) {
+async function getUsersSubscriptionDetails(user) {
   let [
     individualSubscription,
     memberGroupSubscriptions,
@@ -437,23 +401,24 @@ async function getBestSubscription(user) {
   if (
     individualSubscription &&
     !individualSubscription.customAccount &&
-    individualSubscription.recurlySubscription_id &&
-    !individualSubscription.recurlyStatus?.state
+    SubscriptionHelper.getPaymentProviderSubscriptionId(
+      individualSubscription
+    ) &&
+    !SubscriptionHelper.getPaidSubscriptionState(individualSubscription)
   ) {
-    const recurlySubscription = await RecurlyWrapper.promises.getSubscription(
-      individualSubscription.recurlySubscription_id,
-      { includeAccount: true }
+    const paymentResults = await Modules.promises.hooks.fire(
+      'getPaymentFromRecordPromise',
+      individualSubscription
     )
-    await SubscriptionUpdater.promises.updateSubscriptionFromRecurly(
-      recurlySubscription,
+    await Modules.promises.hooks.fire(
+      'syncSubscription',
+      paymentResults[0]?.subscription,
       individualSubscription
     )
     individualSubscription =
       await SubscriptionLocator.promises.getUsersSubscription(user)
   }
-  let bestSubscription = {
-    type: 'free',
-  }
+  let bestSubscription = { type: 'free' }
   if (currentInstitutionsWithLicence?.length) {
     for (const institutionMembership of currentInstitutionsWithLicence) {
       const plan = PlansLocator.findLocalPlanInSettings(
@@ -511,10 +476,10 @@ async function getBestSubscription(user) {
       }
     }
   }
-  return bestSubscription
+  return { bestSubscription, individualSubscription, memberGroupSubscriptions }
 }
 
-function buildPlansList(currentPlan) {
+function buildPlansList(currentPlan, isInTrial) {
   const { plans } = Settings
 
   const allPlans = {}
@@ -528,7 +493,11 @@ function buildPlansList(currentPlan) {
     result.planCodesChangingAtTermEnd = _.map(
       _.filter(plans, plan => {
         if (!plan.hideFromUsers) {
-          return SubscriptionHelper.shouldPlanChangeAtTermEnd(currentPlan, plan)
+          return SubscriptionHelper.shouldPlanChangeAtTermEnd(
+            currentPlan,
+            plan,
+            isInTrial
+          )
         }
       }),
       'planCode'
@@ -577,7 +546,8 @@ function _isPlanEqualOrBetter(planA, planB) {
 
 function _getRemainingTrialDays(subscription) {
   const now = new Date()
-  const trialEndDate = subscription.recurlyStatus?.trialEndsAt
+  const trialEndDate =
+    SubscriptionHelper.getSubscriptionTrialEndsAt(subscription)
   return trialEndDate && trialEndDate > now
     ? Math.ceil(
         (trialEndDate.getTime() - now.getTime()) / (24 * 60 * 60 * 1000)
@@ -612,8 +582,8 @@ function buildGroupSubscriptionForView(groupSubscription) {
   }
 }
 
-function buildPlansListForSubscriptionDash(currentPlan) {
-  const allPlansData = buildPlansList(currentPlan)
+function buildPlansListForSubscriptionDash(currentPlan, isInTrial) {
+  const allPlansData = buildPlansList(currentPlan, isInTrial)
   const plans = []
   // only list individual and visible plans for "change plans" UI
   if (allPlansData.studentAccounts) {
@@ -642,10 +612,5 @@ module.exports = {
   buildUsersSubscriptionViewModel: callbackify(buildUsersSubscriptionViewModel),
   buildPlansList,
   buildPlansListForSubscriptionDash,
-  getBestSubscription: callbackify(getBestSubscription),
-  promises: {
-    buildUsersSubscriptionViewModel,
-    getRedirectToHostedPage,
-    getBestSubscription,
-  },
+  promises: { buildUsersSubscriptionViewModel, getUsersSubscriptionDetails },
 }
diff --git a/services/web/app/src/Features/Subscription/TeamInvitesController.mjs b/services/web/app/src/Features/Subscription/TeamInvitesController.mjs
index ca508755e6..1eb9ac2907 100644
--- a/services/web/app/src/Features/Subscription/TeamInvitesController.mjs
+++ b/services/web/app/src/Features/Subscription/TeamInvitesController.mjs
@@ -4,6 +4,7 @@ import OError from '@overleaf/o-error'
 import TeamInvitesHandler from './TeamInvitesHandler.js'
 import SessionManager from '../Authentication/SessionManager.js'
 import SubscriptionLocator from './SubscriptionLocator.js'
+import SubscriptionHelper from './SubscriptionHelper.js'
 import ErrorController from '../Errors/ErrorController.js'
 import EmailHelper from '../Helpers/EmailHelper.js'
 import UserGetter from '../User/UserGetter.js'
@@ -14,6 +15,7 @@ import EmailHandler from '../Email/EmailHandler.js'
 import { RateLimiter } from '../../infrastructure/RateLimiter.js'
 import Modules from '../../infrastructure/Modules.js'
 import UserAuditLogHandler from '../User/UserAuditLogHandler.js'
+import { sanitizeSessionUserForFrontEnd } from '../../infrastructure/FrontEndUser.js'
 
 const rateLimiters = {
   resendGroupInvite: new RateLimiter('resend-group-invite', {
@@ -36,10 +38,15 @@ async function createInvite(req, res, next) {
   }
 
   try {
+    const auditLog = {
+      initiatorId: teamManagerId,
+      ipAddress: req.ip,
+    }
     const invitedUserData = await TeamInvitesHandler.promises.createInvite(
       teamManagerId,
       subscription,
-      email
+      email,
+      auditLog
     )
     return res.json({ user: invitedUserData })
   } catch (err) {
@@ -82,12 +89,10 @@ async function viewInvite(req, res, next) {
     const personalSubscription =
       await SubscriptionLocator.promises.getUsersSubscription(userId)
 
-    const hasIndividualRecurlySubscription =
-      personalSubscription &&
-      personalSubscription.groupPlan === false &&
-      personalSubscription.recurlyStatus?.state !== 'canceled' &&
-      personalSubscription.recurlySubscription_id &&
-      personalSubscription.recurlySubscription_id !== ''
+    const hasIndividualPaidSubscription =
+      SubscriptionHelper.isIndividualActivePaidSubscription(
+        personalSubscription
+      )
 
     if (subscription?.managedUsersEnabled) {
       if (!subscription.populated('groupPolicy')) {
@@ -128,6 +133,9 @@ async function viewInvite(req, res, next) {
         logger.error({ err }, 'error getting subscription admin email')
       }
 
+      const usersSubscription =
+        await SubscriptionLocator.promises.getUserSubscriptionStatus(userId)
+
       return res.render('subscriptions/team/invite-managed', {
         inviterName: invite.inviterName,
         inviteToken: invite.token,
@@ -136,7 +144,8 @@ async function viewInvite(req, res, next) {
         currentManagedUserAdminEmail,
         groupSSOActive,
         subscriptionId: subscription._id.toString(),
-        user: sessionUser,
+        user: sanitizeSessionUserForFrontEnd(sessionUser),
+        usersSubscription,
       })
     } else {
       let currentManagedUserAdminEmail
@@ -150,13 +159,13 @@ async function viewInvite(req, res, next) {
       return res.render('subscriptions/team/invite', {
         inviterName: invite.inviterName,
         inviteToken: invite.token,
-        hasIndividualRecurlySubscription,
+        hasIndividualPaidSubscription,
         expired: req.query.expired,
         userRestrictions: Array.from(req.userRestrictions || []),
         currentManagedUserAdminEmail,
         groupSSOActive,
         subscriptionId: subscription._id.toString(),
-        user: sessionUser,
+        user: sanitizeSessionUserForFrontEnd(sessionUser),
       })
     }
   } else {
@@ -197,7 +206,8 @@ async function acceptInvite(req, res, next) {
 
   const subscription = await TeamInvitesHandler.promises.acceptInvite(
     token,
-    userId
+    userId,
+    req.ip
   )
   const groupSSOActive = (
     await Modules.promises.hooks.fire('hasGroupSSOEnabled', subscription)
diff --git a/services/web/app/src/Features/Subscription/TeamInvitesHandler.js b/services/web/app/src/Features/Subscription/TeamInvitesHandler.js
index 45a0495353..f7a4908355 100644
--- a/services/web/app/src/Features/Subscription/TeamInvitesHandler.js
+++ b/services/web/app/src/Features/Subscription/TeamInvitesHandler.js
@@ -22,6 +22,7 @@ const {
   callbackifyMultiResult,
 } = require('@overleaf/promise-utils')
 const NotificationsBuilder = require('../Notifications/NotificationsBuilder')
+const RecurlyClient = require('./RecurlyClient')
 
 async function getInvite(token) {
   const subscription = await Subscription.findOne({
@@ -64,19 +65,64 @@ async function importInvite(subscription, inviterName, email, token, sentAt) {
   return subscription.save()
 }
 
-async function acceptInvite(token, userId) {
+async function _deleteUserSubscription(userId, ipAddress) {
+  // Delete released user subscription to make it on a free plan
+  const subscription =
+    await SubscriptionLocator.promises.getUsersSubscription(userId)
+
+  if (subscription) {
+    logger.debug(
+      {
+        subscriptionId: subscription._id,
+      },
+      'deleting user subscription'
+    )
+
+    const deleterData = {
+      id: userId,
+      ip: ipAddress,
+    }
+    await SubscriptionUpdater.promises.deleteSubscription(
+      subscription,
+      deleterData
+    )
+
+    // Terminate the subscription in Recurly
+    if (subscription.recurlySubscription_id) {
+      try {
+        await RecurlyClient.promises.terminateSubscriptionByUuid(
+          subscription.recurlySubscription_id
+        )
+      } catch (err) {
+        logger.error(
+          { err, subscriptionId: subscription._id },
+          'terminating subscription failed'
+        )
+      }
+    }
+  }
+}
+
+async function acceptInvite(token, userId, ipAddress) {
   const { invite, subscription } = await getInvite(token)
   if (!invite) {
     throw new Errors.NotFoundError('invite not found')
   }
+  const auditLog = { initiatorId: userId, ipAddress }
 
-  await SubscriptionUpdater.promises.addUserToGroup(subscription._id, userId)
+  await SubscriptionUpdater.promises.addUserToGroup(
+    subscription._id,
+    userId,
+    auditLog
+  )
 
   if (subscription.managedUsersEnabled) {
+    await _deleteUserSubscription(userId, ipAddress)
     await Modules.promises.hooks.fire(
       'enrollInManagedSubscription',
       userId,
-      subscription
+      subscription,
+      auditLog
     )
   }
   if (subscription.ssoConfig) {
@@ -146,9 +192,11 @@ async function _createInvite(subscription, email, inviter) {
     emailData => emailData.email === email
   )
   if (isInvitingSelf) {
+    const auditLog = { initiatorId: inviter._id }
     await SubscriptionUpdater.promises.addUserToGroup(
       subscription._id,
-      inviter._id
+      inviter._id,
+      auditLog
     )
 
     // legacy: remove any invite that might have been created in the past
diff --git a/services/web/app/src/Features/Subscription/types.ts b/services/web/app/src/Features/Subscription/types.ts
index b4989c49ea..59453ac47c 100644
--- a/services/web/app/src/Features/Subscription/types.ts
+++ b/services/web/app/src/Features/Subscription/types.ts
@@ -1,3 +1,6 @@
-import { PaypalPaymentMethod, CreditCardPaymentMethod } from './RecurlyEntities'
+import {
+  PaypalPaymentMethod,
+  CreditCardPaymentMethod,
+} from './PaymentProviderEntities'
 
 export type PaymentMethod = PaypalPaymentMethod | CreditCardPaymentMethod
diff --git a/services/web/app/src/Features/Survey/SurveyHandler.mjs b/services/web/app/src/Features/Survey/SurveyHandler.mjs
index 009bc12a95..bcb9c4bee0 100644
--- a/services/web/app/src/Features/Survey/SurveyHandler.mjs
+++ b/services/web/app/src/Features/Survey/SurveyHandler.mjs
@@ -4,6 +4,7 @@ import crypto from 'node:crypto'
 import SurveyCache from './SurveyCache.mjs'
 import SubscriptionLocator from '../Subscription/SubscriptionLocator.js'
 import { callbackify } from '@overleaf/promise-utils'
+import UserGetter from '../User/UserGetter.js'
 
 /**
  * @import { Survey } from '../../../../types/project/dashboard/survey'
@@ -13,7 +14,7 @@ import { callbackify } from '@overleaf/promise-utils'
  * determines if there is a survey to show, given current surveys and rollout percentages
  * uses userId in computation, to ensure that rollout groups always contain same users
  * @param {string} userId
- * @returns {Promise<Survey | undefined>}
+ * @returns {Promise<Pick<Survey, 'name' | 'title' | 'text' | 'cta' | 'url'> | undefined>}
  */
 async function getSurvey(userId) {
   const survey = await SurveyCache.get(true)
@@ -26,14 +27,40 @@ async function getSurvey(userId) {
       }
     }
 
-    const { name, preText, linkText, url, options } = survey?.toObject() || {}
+    const { name, title, text, cta, url, options } = survey?.toObject() || {}
     // default to full rollout for backwards compatibility
     const rolloutPercentage = options?.rolloutPercentage || 100
     if (!_userInRolloutPercentile(userId, name, rolloutPercentage)) {
       return
     }
 
-    return { name, preText, linkText, url }
+    const { earliestSignupDate, latestSignupDate, excludeLabsUsers } =
+      survey.options || {}
+    if (earliestSignupDate || latestSignupDate || excludeLabsUsers) {
+      const user = await UserGetter.promises.getUser(userId, {
+        signUpDate: 1,
+        labsProgram: 1,
+      })
+      if (!user) {
+        return
+      }
+      const { signUpDate } = user
+      if (latestSignupDate) {
+        // Make the check inclusive
+        latestSignupDate.setHours(23, 59, 59, 999)
+        if (signUpDate > latestSignupDate) {
+          return
+        }
+      }
+      if (earliestSignupDate && signUpDate < earliestSignupDate) {
+        return
+      }
+      if (excludeLabsUsers && user.labsProgram) {
+        return
+      }
+    }
+
+    return { name, title, text, cta, url }
   }
 }
 
diff --git a/services/web/app/src/Features/Survey/SurveyManager.js b/services/web/app/src/Features/Survey/SurveyManager.js
index abaee90f13..7eac05f5d3 100644
--- a/services/web/app/src/Features/Survey/SurveyManager.js
+++ b/services/web/app/src/Features/Survey/SurveyManager.js
@@ -9,20 +9,57 @@ async function getSurvey() {
   }
 }
 
-async function updateSurvey({ name, preText, linkText, url, options }) {
+async function updateSurvey({ name, title, text, cta, url, options }) {
+  validateOptions(options)
   let survey = await getSurvey()
   if (!survey) {
     survey = new Survey()
   }
   survey.name = name
-  survey.preText = preText
-  survey.linkText = linkText
+  survey.title = title
+  survey.text = text
+  survey.cta = cta
   survey.url = url
   survey.options = options
   await survey.save()
   return survey
 }
 
+function validateOptions(options) {
+  if (!options) {
+    return
+  }
+  if (typeof options !== 'object') {
+    throw new Error('options must be an object')
+  }
+  const { earliestSignupDate, latestSignupDate } = options
+
+  const earliestDate = parseDate(earliestSignupDate)
+  const latestDate = parseDate(latestSignupDate)
+  if (earliestDate && latestDate) {
+    if (earliestDate > latestDate) {
+      throw new Error('earliestSignupDate must be before latestSignupDate')
+    }
+  }
+}
+
+function parseDate(date) {
+  if (date) {
+    if (typeof date !== 'string') {
+      throw new Error('Date must be a string')
+    }
+    if (date.match(/^\d{4}-\d{2}-\d{2}$/) === null) {
+      throw new Error('Date must be in YYYY-MM-DD format')
+    }
+    const asDate = new Date(date)
+    if (isNaN(asDate.getTime())) {
+      throw new Error('Date must be a valid date')
+    }
+    return asDate
+  }
+  return null
+}
+
 async function deleteSurvey() {
   const survey = await getSurvey()
   if (survey) {
diff --git a/services/web/app/src/Features/Templates/TemplatesController.js b/services/web/app/src/Features/Templates/TemplatesController.js
index ac82d0c5d3..257de2b0c3 100644
--- a/services/web/app/src/Features/Templates/TemplatesController.js
+++ b/services/web/app/src/Features/Templates/TemplatesController.js
@@ -6,26 +6,27 @@ const logger = require('@overleaf/logger')
 const { expressify } = require('@overleaf/promise-utils')
 
 const TemplatesController = {
-  getV1Template(req, res) {
-    const templateVersionId = req.params.Template_version_id
-    const templateId = req.query.id
-    if (!/^[0-9]+$/.test(templateVersionId) || !/^[0-9]+$/.test(templateId)) {
-      logger.err(
-        { templateVersionId, templateId },
-        'invalid template id or version'
-      )
-      return res.sendStatus(400)
-    }
+  async getV1Template(req, res) {
+    const templateId = req.params.Template_version_id
+    const templateVersionId = req.query.version
+//    if (!/^[0-9]+$/.test(templateVersionId) || !/^[0-9]+$/.test(templateId)) {
+//      logger.err(
+//        { templateVersionId, templateId },
+//        'invalid template id or version'
+//      )
+//      return res.sendStatus(400)
+//    }
     const data = {
       templateVersionId,
       templateId,
-      name: req.query.templateName,
-      compiler: ProjectHelper.compilerFromV1Engine(req.query.latexEngine),
-      imageName: req.query.texImage,
+      name: req.query.name,
+      compiler: req.query.compiler,
+      language: req.query.language,
+      imageName: req.query.imageName,
       mainFile: req.query.mainFile,
       brandVariationId: req.query.brandVariationId,
     }
-    return res.render(
+    res.render(
       path.resolve(
         __dirname,
         '../../../views/project/editor/new_from_template'
@@ -36,6 +37,7 @@ const TemplatesController = {
 
   async createProjectFromV1Template(req, res) {
     const userId = SessionManager.getLoggedInUserId(req.session)
+
     const project = await TemplatesManager.promises.createProjectFromV1Template(
       req.body.brandVariationId,
       req.body.compiler,
@@ -44,7 +46,8 @@ const TemplatesController = {
       req.body.templateName,
       req.body.templateVersionId,
       userId,
-      req.body.imageName
+      req.body.imageName,
+      req.body.language
     )
     delete req.session.templateData
     if (!project) {
@@ -55,7 +58,7 @@ const TemplatesController = {
 }
 
 module.exports = {
-  getV1Template: TemplatesController.getV1Template,
+  getV1Template: expressify(TemplatesController.getV1Template),
   createProjectFromV1Template: expressify(
     TemplatesController.createProjectFromV1Template
   ),
diff --git a/services/web/app/src/Features/Templates/TemplatesManager.js b/services/web/app/src/Features/Templates/TemplatesManager.js
index f105b6ae85..77cde12ea9 100644
--- a/services/web/app/src/Features/Templates/TemplatesManager.js
+++ b/services/web/app/src/Features/Templates/TemplatesManager.js
@@ -17,6 +17,8 @@ const settings = require('@overleaf/settings')
 const crypto = require('crypto')
 const Errors = require('../Errors/Errors')
 const { pipeline } = require('stream/promises')
+const ClsiCacheManager = require('../Compile/ClsiCacheManager')
+const TIMEOUT = 30000  // 30 sec
 
 const TemplatesManager = {
   async createProjectFromV1Template(
@@ -27,25 +29,19 @@ const TemplatesManager = {
     templateName,
     templateVersionId,
     userId,
-    imageName
+    imageName,
+    language
   ) {
-    const zipUrl = `${settings.apis.v1.url}/api/v1/overleaf/templates/${templateVersionId}`
+    const zipUrl = `${settings.apis.filestore.url}/template/${templateId}/v/${templateVersionId}/zip`
     const zipReq = await fetchStreamWithResponse(zipUrl, {
-      basicAuth: {
-        user: settings.apis.v1.user,
-        password: settings.apis.v1.pass,
-      },
-      signal: AbortSignal.timeout(settings.apis.v1.timeout),
+      signal: AbortSignal.timeout(TIMEOUT),
     })
 
     const projectName = ProjectDetailsHandler.fixProjectName(templateName)
     const dumpPath = `${settings.path.dumpFolder}/${crypto.randomUUID()}`
     const writeStream = fs.createWriteStream(dumpPath)
     try {
-      const attributes = {
-        fromV1TemplateId: templateId,
-        fromV1TemplateVersionId: templateVersionId,
-      }
+      const attributes = {}
       await pipeline(zipReq.stream, writeStream)
 
       if (zipReq.response.status !== 200) {
@@ -63,16 +59,24 @@ const TemplatesManager = {
           attributes
         )
 
+      const prepareClsiCacheInBackground = ClsiCacheManager.prepareClsiCache(
+        project._id,
+        userId,
+        { templateId, templateVersionId }
+      ).catch(err => {
+        logger.warn(
+          { err, templateId, templateVersionId, projectId: project._id },
+          'failed to prepare clsi-cache from template'
+        )
+      })
+
       await TemplatesManager._setCompiler(project._id, compiler)
       await TemplatesManager._setImage(project._id, imageName)
       await TemplatesManager._setMainFile(project._id, mainFile)
+      await TemplatesManager._setSpellCheckLanguage(project._id, language)
       await TemplatesManager._setBrandVariationId(project._id, brandVariationId)
 
-      const update = {
-        fromV1TemplateId: templateId,
-        fromV1TemplateVersionId: templateVersionId,
-      }
-      await Project.updateOne({ _id: project._id }, update, {})
+      await prepareClsiCacheInBackground
 
       return project
     } finally {
@@ -88,11 +92,12 @@ const TemplatesManager = {
   },
 
   async _setImage(projectId, imageName) {
-    if (!imageName) {
-      imageName = 'wl_texlive:2018.1'
+    try {
+      await ProjectOptionsHandler.setImageName(projectId, imageName)
+    } catch {
+      logger.warn({ imageName: imageName }, 'not available')
+      await ProjectOptionsHandler.setImageName(projectId, settings.currentImageName)
     }
-
-    await ProjectOptionsHandler.setImageName(projectId, imageName)
   },
 
   async _setMainFile(projectId, mainFile) {
@@ -102,6 +107,13 @@ const TemplatesManager = {
     await ProjectRootDocManager.setRootDocFromName(projectId, mainFile)
   },
 
+  async _setSpellCheckLanguage(projectId, language) {
+    if (language == null) {
+      return
+    }
+    await ProjectOptionsHandler.setSpellCheckLanguage(projectId, language)
+  },
+
   async _setBrandVariationId(projectId, brandVariationId) {
     if (brandVariationId == null) {
       return
diff --git a/services/web/app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler.mjs b/services/web/app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler.mjs
index c17b54ff1e..219db88b12 100644
--- a/services/web/app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler.mjs
+++ b/services/web/app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler.mjs
@@ -180,7 +180,11 @@ async function createFolder(userId, projectId, projectName, path) {
     return null
   }
 
-  const folder = await UpdateMerger.promises.createFolder(project._id, path)
+  const folder = await UpdateMerger.promises.createFolder(
+    project._id,
+    path,
+    userId
+  )
   return {
     folderId: folder._id,
     parentFolderId: folder.parentFolder_id,
diff --git a/services/web/app/src/Features/ThirdPartyDataStore/UpdateMerger.js b/services/web/app/src/Features/ThirdPartyDataStore/UpdateMerger.js
index e67d5fc30d..f68d366d8e 100644
--- a/services/web/app/src/Features/ThirdPartyDataStore/UpdateMerger.js
+++ b/services/web/app/src/Features/ThirdPartyDataStore/UpdateMerger.js
@@ -176,10 +176,11 @@ async function _readFileIntoTextArray(path) {
   return lines
 }
 
-async function createFolder(projectId, path) {
+async function createFolder(projectId, path, userId) {
   const { lastFolder: folder } = await EditorController.promises.mkdirp(
     projectId,
-    path
+    path,
+    userId
   )
   return folder
 }
diff --git a/services/web/app/src/Features/TokenAccess/TokenAccessController.mjs b/services/web/app/src/Features/TokenAccess/TokenAccessController.mjs
index ff4b93e88c..276524dd02 100644
--- a/services/web/app/src/Features/TokenAccess/TokenAccessController.mjs
+++ b/services/web/app/src/Features/TokenAccess/TokenAccessController.mjs
@@ -66,7 +66,7 @@ async function _handleV1Project(token, userId) {
       userId
     )
     // This should not happen anymore, but it does show
-    // a nice "contact support" message, so it can stay
+    // a nice "contact Support" message, so it can stay
     if (!docInfo) {
       return { v1Import: { status: 'cannotImport' } }
     }
diff --git a/services/web/app/src/Features/Tutorial/TutorialController.mjs b/services/web/app/src/Features/Tutorial/TutorialController.mjs
index 3672f8db0d..4f91b64f45 100644
--- a/services/web/app/src/Features/Tutorial/TutorialController.mjs
+++ b/services/web/app/src/Features/Tutorial/TutorialController.mjs
@@ -8,10 +8,17 @@ const VALID_KEYS = [
   'writefull-oauth-promotion',
   'bib-file-tpr-prompt',
   'ai-error-assistant-consent',
-  'code-editor-mode-prompt',
   'history-restore-promo',
   'us-gov-banner',
   'us-gov-banner-fedramp',
+  'full-project-search-promo',
+  'editor-popup-ux-survey',
+  'wf-features-moved',
+  'review-mode',
+  'new-error-logs-promo',
+  'try-redesign-again-nudge-promo',
+  'write-and-cite-nudge-in-linked-file',
+  'ide-redesign-new-survey-promo',
 ]
 
 async function completeTutorial(req, res, next) {
diff --git a/services/web/app/src/Features/Uploads/ProjectUploadController.mjs b/services/web/app/src/Features/Uploads/ProjectUploadController.mjs
index da2847d108..84b8738af3 100644
--- a/services/web/app/src/Features/Uploads/ProjectUploadController.mjs
+++ b/services/web/app/src/Features/Uploads/ProjectUploadController.mjs
@@ -66,8 +66,9 @@ function uploadProject(req, res, next) {
 async function uploadFile(req, res, next) {
   const timer = new metrics.Timer('file-upload')
   const name = req.body.name
-  const path = req.file?.path
+  const { path } = req.file
   const projectId = req.params.Project_id
+  const userId = SessionManager.getLoggedInUserId(req.session)
   let { folder_id: folderId } = req.query
   if (name == null || name.length === 0 || name.length > 150) {
     return res.status(422).json({
@@ -87,13 +88,12 @@ async function uploadFile(req, res, next) {
     })
     const { lastFolder } = await EditorController.promises.mkdirp(
       projectId,
-      Path.dirname(Path.join('/', path.fileSystem, relativePath))
+      Path.dirname(Path.join('/', path.fileSystem, relativePath)),
+      userId
     )
     folderId = lastFolder._id
   }
 
-  const userId = SessionManager.getLoggedInUserId(req.session)
-
   return FileSystemImportManager.addEntity(
     userId,
     projectId,
@@ -162,8 +162,14 @@ function multerMiddleware(req, res, next) {
         .status(422)
         .json({ success: false, error: req.i18n.translate('file_too_large') })
     }
-
-    return next(err)
+    if (err) return next(err)
+    if (!req.file?.path) {
+      logger.info({ req }, 'missing req.file.path on upload')
+      return res
+        .status(400)
+        .json({ success: false, error: 'invalid_upload_request' })
+    }
+    next()
   })
 }
 
diff --git a/services/web/app/src/Features/User/SAMLIdentityManager.js b/services/web/app/src/Features/User/SAMLIdentityManager.js
index dc790c59ca..0d3c382775 100644
--- a/services/web/app/src/Features/User/SAMLIdentityManager.js
+++ b/services/web/app/src/Features/User/SAMLIdentityManager.js
@@ -210,9 +210,13 @@ async function getUser(providerId, externalUserId, userIdAttribute) {
     )
   }
   const user = await User.findOne({
-    'samlIdentifiers.externalUserId': externalUserId.toString(),
-    'samlIdentifiers.providerId': providerId.toString(),
-    'samlIdentifiers.userIdAttribute': userIdAttribute.toString(),
+    samlIdentifiers: {
+      $elemMatch: {
+        externalUserId: externalUserId.toString(),
+        providerId: providerId.toString(),
+        userIdAttribute: userIdAttribute.toString(),
+      },
+    },
   }).exec()
 
   return user
diff --git a/services/web/app/src/Features/User/UserAuditLogHandler.js b/services/web/app/src/Features/User/UserAuditLogHandler.js
index b1d404303e..87cd810161 100644
--- a/services/web/app/src/Features/User/UserAuditLogHandler.js
+++ b/services/web/app/src/Features/User/UserAuditLogHandler.js
@@ -8,6 +8,7 @@ function _canHaveNoIpAddressId(operation, info) {
   if (operation === 'must-reset-password-set') return true
   if (operation === 'remove-email' && info.script) return true
   if (operation === 'release-managed-user' && info.script) return true
+  if (operation === 'unlink-dropbox' && info.batch) return true
   return false
 }
 
diff --git a/services/web/app/src/Features/User/UserController.js b/services/web/app/src/Features/User/UserController.js
index e4186d39a8..cabab8c891 100644
--- a/services/web/app/src/Features/User/UserController.js
+++ b/services/web/app/src/Features/User/UserController.js
@@ -387,6 +387,9 @@ async function updateUserSettings(req, res, next) {
   if (req.body.mathPreview != null) {
     user.ace.mathPreview = req.body.mathPreview
   }
+  if (req.body.breadcrumbs != null) {
+    user.ace.breadcrumbs = Boolean(req.body.breadcrumbs)
+  }
   if (req.body.referencesSearchMode != null) {
     const mode =
       req.body.referencesSearchMode === 'simple' ? 'simple' : 'advanced'
@@ -515,4 +518,5 @@ module.exports = {
   expireDeletedUsersAfterDuration: expressify(expireDeletedUsersAfterDuration),
   ensureAffiliationMiddleware: expressify(ensureAffiliationMiddleware),
   ensureAffiliation,
+  doLogout,
 }
diff --git a/services/web/app/src/Features/User/UserDeleter.js b/services/web/app/src/Features/User/UserDeleter.js
index 4009419ffe..c8d9891bf9 100644
--- a/services/web/app/src/Features/User/UserDeleter.js
+++ b/services/web/app/src/Features/User/UserDeleter.js
@@ -43,21 +43,32 @@ async function deleteUser(userId, options) {
 
   try {
     const user = await User.findById(userId).exec()
-    logger.debug({ user }, 'deleting user')
-
+    logger.info({ userId }, 'deleting user')
     await ensureCanDeleteUser(user)
+    logger.info({ userId }, 'cleaning up user')
     await _cleanupUser(user)
+    logger.info({ userId }, 'firing deleteUser hook')
     await Modules.promises.hooks.fire('deleteUser', userId)
+    logger.info({ userId }, 'adding delete-account audit log entry')
     await UserAuditLogHandler.promises.addEntry(
       userId,
       'delete-account',
       options.deleterUser ? options.deleterUser._id : userId,
       options.ipAddress
     )
+    logger.info({ userId }, 'creating deleted user record')
     await _createDeletedUser(user, options)
+    logger.info({ userId }, 'deleting user projects')
     await ProjectDeleter.promises.deleteUsersProjects(user._id)
-    await _sendDeleteEmail(user, options.force)
+    if (options.skipEmail) {
+      logger.info({ userId }, 'skipping sending deletion email to user')
+    } else {
+      logger.info({ userId }, 'sending deletion email to user')
+      await _sendDeleteEmail(user, options.force)
+    }
+    logger.info({ userId }, 'deleting user record')
     await deleteMongoUser(user._id)
+    logger.info({ userId }, 'user deletion complete')
   } catch (error) {
     logger.warn({ error, userId }, 'something went wrong deleting the user')
     throw error
@@ -76,17 +87,29 @@ async function deleteMongoUser(userId) {
 }
 
 async function expireDeletedUser(userId) {
-  await Modules.promises.hooks.fire('expireDeletedUser', userId)
-  const deletedUser = await DeletedUser.findOne({
-    'deleterData.deletedUserId': userId,
-  }).exec()
-
-  await Feedback.deleteMany({ userId }).exec()
-  await OnboardingDataCollectionManager.deleteOnboardingDataCollection(userId)
-
-  deletedUser.user = undefined
-  deletedUser.deleterData.deleterIpAddress = undefined
-  await deletedUser.save()
+  logger.info({ userId }, 'expiring deleted user')
+  try {
+    logger.info({ userId }, 'firing expireDeletedUser hook')
+    await Modules.promises.hooks.fire('expireDeletedUser', userId)
+    logger.info({ userId }, 'removing deleted user feedback records')
+    await Feedback.deleteMany({ userId }).exec()
+    logger.info({ userId }, 'removing deleted user onboarding data')
+    await OnboardingDataCollectionManager.deleteOnboardingDataCollection(userId)
+    logger.info({ userId }, 'redacting PII from the deleted user record')
+    const deletedUser = await DeletedUser.findOne({
+      'deleterData.deletedUserId': userId,
+    }).exec()
+    deletedUser.user = undefined
+    deletedUser.deleterData.deleterIpAddress = undefined
+    await deletedUser.save()
+    logger.info({ userId }, 'deleted user expiry complete')
+  } catch (error) {
+    logger.warn(
+      { error, userId },
+      'something went wrong expiring the deleted user'
+    )
+    throw error
+  }
 }
 
 async function expireDeletedUsersAfterDuration() {
@@ -101,11 +124,27 @@ async function expireDeletedUsersAfterDuration() {
   if (deletedUsers.length === 0) {
     return
   }
-
-  for (let i = 0; i < deletedUsers.length; i++) {
-    const deletedUserId = deletedUsers[i].deleterData.deletedUserId
-    await expireDeletedUser(deletedUserId)
-    await UserAuditLogEntry.deleteMany({ userId: deletedUserId }).exec()
+  logger.info(
+    { deletedUsers: deletedUsers.length, retentionPeriodInDays: DURATION },
+    'expiring batch of deleted users older than retention period'
+  )
+  try {
+    for (let i = 0; i < deletedUsers.length; i++) {
+      const deletedUserId = deletedUsers[i].deleterData.deletedUserId
+      await expireDeletedUser(deletedUserId)
+      logger.info({ deletedUserId }, 'removing deleted user audit log entries')
+      await UserAuditLogEntry.deleteMany({ userId: deletedUserId }).exec()
+    }
+    logger.info(
+      { deletedUsers: deletedUsers.length },
+      'batch of deleted users expired successfully'
+    )
+  } catch (error) {
+    logger.warn(
+      { error },
+      'something went wrong expiring batch of deleted users'
+    )
+    throw error
   }
 }
 
@@ -161,13 +200,22 @@ async function _createDeletedUser(user, options) {
 }
 
 async function _cleanupUser(user) {
+  const userId = user._id
+
+  logger.info({ userId }, '[cleanupUser] removing user sessions from Redis')
   await UserSessionsManager.promises.removeSessionsFromRedis(user)
+  logger.info({ userId }, '[cleanupUser] unsubscribing from newsletters')
   await NewsletterManager.promises.unsubscribe(user, { delete: true })
+  logger.info({ userId }, '[cleanupUser] cancelling subscription')
   await SubscriptionHandler.promises.cancelSubscription(user)
-  await InstitutionsAPI.promises.deleteAffiliations(user._id)
-  await SubscriptionUpdater.promises.removeUserFromAllGroups(user._id)
-  await UserMembershipsHandler.promises.removeUserFromAllEntities(user._id)
-  await Modules.promises.hooks.fire('cleanupPersonalAccessTokens', user._id, [
+  logger.info({ userId }, '[cleanupUser] deleting affiliations')
+  await InstitutionsAPI.promises.deleteAffiliations(userId)
+  logger.info({ userId }, '[cleanupUser] removing user from groups')
+  await SubscriptionUpdater.promises.removeUserFromAllGroups(userId)
+  logger.info({ userId }, '[cleanupUser] removing user from memberships')
+  await UserMembershipsHandler.promises.removeUserFromAllEntities(userId)
+  logger.info({ userId }, '[cleanupUser] removing personal access tokens')
+  await Modules.promises.hooks.fire('cleanupPersonalAccessTokens', userId, [
     'collabratec',
     'git_bridge',
   ])
diff --git a/services/web/app/src/Features/User/UserEmailsController.js b/services/web/app/src/Features/User/UserEmailsController.js
index 54ace10cb0..2f9be5427e 100644
--- a/services/web/app/src/Features/User/UserEmailsController.js
+++ b/services/web/app/src/Features/User/UserEmailsController.js
@@ -20,7 +20,6 @@ const { RateLimiter } = require('../../infrastructure/RateLimiter')
 const Features = require('../../infrastructure/Features')
 const tsscmp = require('tsscmp')
 const Modules = require('../../infrastructure/Modules')
-const SplitTestHandler = require('../SplitTests/SplitTestHandler')
 
 const AUDIT_LOG_TOKEN_PREFIX_LENGTH = 10
 
@@ -142,7 +141,7 @@ async function sendReconfirmation(req, res) {
   res.sendStatus(204)
 }
 
-async function sendExistingSecondaryEmailConfirmationCode(req, res) {
+async function sendExistingEmailConfirmationCode(req, res) {
   const userId = SessionManager.getLoggedInUserId(req.session)
   const email = EmailHelper.parseEmail(req.body.email)
   if (!email) {
@@ -527,18 +526,8 @@ async function primaryEmailCheckPage(req, res) {
     userId,
     'primary-email-check-page-displayed'
   )
-  const { variant } = await SplitTestHandler.promises.getAssignment(
-    req,
-    res,
-    'auth-pages-bs5'
-  )
 
-  const template =
-    variant === 'enabled'
-      ? 'user/primaryEmailCheck-bs5'
-      : 'user/primaryEmailCheck'
-
-  res.render(template)
+  res.render('user/primaryEmailCheck')
 }
 
 async function primaryEmailCheck(req, res) {
@@ -726,8 +715,8 @@ const UserEmailsController = {
 
   sendReconfirmation: expressify(sendReconfirmation),
 
-  sendExistingSecondaryEmailConfirmationCode: expressify(
-    sendExistingSecondaryEmailConfirmationCode
+  sendExistingEmailConfirmationCode: expressify(
+    sendExistingEmailConfirmationCode
   ),
 
   addSecondaryEmailPage: expressify(addSecondaryEmailPage),
diff --git a/services/web/app/src/Features/User/UserGetter.js b/services/web/app/src/Features/User/UserGetter.js
index 34d758add6..a5fbe42651 100644
--- a/services/web/app/src/Features/User/UserGetter.js
+++ b/services/web/app/src/Features/User/UserGetter.js
@@ -11,6 +11,8 @@ const Errors = require('../Errors/Errors')
 const Features = require('../../infrastructure/Features')
 const { User } = require('../../models/User')
 const { normalizeQuery, normalizeMultiQuery } = require('../Helpers/Mongo')
+const Modules = require('../../infrastructure/Modules')
+const FeaturesHelper = require('../Subscription/FeaturesHelper')
 
 function _lastDayToReconfirm(emailData, institutionData) {
   const globalReconfirmPeriod = settings.reconfirmNotificationDays
@@ -95,6 +97,21 @@ async function getUserFullEmails(userId) {
   )
 }
 
+async function getUserFeatures(userId) {
+  const user = await UserGetter.promises.getUser(userId, {
+    features: 1,
+  })
+  if (!user) {
+    throw new Error('User not Found')
+  }
+
+  const moduleFeatures =
+    (await Modules.promises.hooks.fire('getModuleProvidedFeatures', userId)) ||
+    []
+
+  return FeaturesHelper.computeFeatureSet([user.features, ...moduleFeatures])
+}
+
 async function getUserConfirmedEmails(userId) {
   const user = await UserGetter.promises.getUser(userId, {
     emails: 1,
@@ -120,6 +137,19 @@ async function getSsoUsersAtInstitution(institutionId, projection) {
   ).exec()
 }
 
+async function getWritefullData(userId) {
+  const user = await UserGetter.promises.getUser(userId, {
+    writefull: 1,
+  })
+  if (!user) {
+    throw new Error('user not found')
+  }
+  return {
+    isPremium: Boolean(user?.writefull?.isPremium),
+    premiumSource: user?.writefull?.premiumSource || null,
+  }
+}
+
 const UserGetter = {
   getSsoUsersAtInstitution: callbackify(getSsoUsersAtInstitution),
 
@@ -136,13 +166,7 @@ const UserGetter = {
     }
   },
 
-  getUserFeatures(userId, callback) {
-    this.getUser(userId, { features: 1 }, (error, user) => {
-      if (error) return callback(error)
-      if (!user) return callback(new Errors.NotFoundError('user not found'))
-      callback(null, user.features)
-    })
-  },
+  getUserFeatures: callbackify(getUserFeatures),
 
   getUserEmail(userId, callback) {
     this.getUser(userId, { email: 1 }, (error, user) =>
@@ -245,6 +269,7 @@ const UserGetter = {
   getUsers(query, projection, callback) {
     try {
       query = normalizeMultiQuery(query)
+      if (query?._id?.$in?.length === 0) return callback(null, []) // shortcut for getUsers([])
       db.users.find(query, { projection }).toArray(callback)
     } catch (err) {
       callback(err)
@@ -260,6 +285,7 @@ const UserGetter = {
       callback(error)
     })
   },
+  getWritefullData: callbackify(getWritefullData),
 }
 
 const decorateFullEmails = (
@@ -335,9 +361,16 @@ const decorateFullEmails = (
 }
 
 UserGetter.promises = promisifyAll(UserGetter, {
-  without: ['getSsoUsersAtInstitution', 'getUserFullEmails'],
+  without: [
+    'getSsoUsersAtInstitution',
+    'getUserFullEmails',
+    'getUserFeatures',
+    'getWritefullData',
+  ],
 })
 UserGetter.promises.getUserFullEmails = getUserFullEmails
 UserGetter.promises.getSsoUsersAtInstitution = getSsoUsersAtInstitution
+UserGetter.promises.getUserFeatures = getUserFeatures
+UserGetter.promises.getWritefullData = getWritefullData
 
 module.exports = UserGetter
diff --git a/services/web/app/src/Features/User/UserInfoController.js b/services/web/app/src/Features/User/UserInfoController.js
index 4eeea4f5e9..c95bc45af5 100644
--- a/services/web/app/src/Features/User/UserInfoController.js
+++ b/services/web/app/src/Features/User/UserInfoController.js
@@ -1,6 +1,7 @@
 const UserGetter = require('./UserGetter')
 const SessionManager = require('../Authentication/SessionManager')
 const { ObjectId } = require('mongodb-legacy')
+const { expressify } = require('@overleaf/promise-utils')
 
 function getLoggedInUsersPersonalInfo(req, res, next) {
   const userId = SessionManager.getLoggedInUserId(req.session)
@@ -78,9 +79,19 @@ function formatPersonalInfo(user) {
   return formattedUser
 }
 
+async function getUserFeatures(req, res, next) {
+  const userId = SessionManager.getLoggedInUserId(req.session)
+  if (!userId) {
+    throw new Error('User is not logged in')
+  }
+  const features = await UserGetter.promises.getUserFeatures(userId)
+  return res.json(features)
+}
+
 module.exports = {
   getLoggedInUsersPersonalInfo,
   getPersonalInfo,
   sendFormattedPersonalInfo,
   formatPersonalInfo,
+  getUserFeatures: expressify(getUserFeatures),
 }
diff --git a/services/web/app/src/Features/User/UserPagesController.mjs b/services/web/app/src/Features/User/UserPagesController.mjs
index 1c6ce7b82c..c7ad5b30f4 100644
--- a/services/web/app/src/Features/User/UserPagesController.mjs
+++ b/services/web/app/src/Features/User/UserPagesController.mjs
@@ -10,7 +10,6 @@ import SubscriptionLocator from '../Subscription/SubscriptionLocator.js'
 import _ from 'lodash'
 import { expressify } from '@overleaf/promise-utils'
 import Features from '../../infrastructure/Features.js'
-import SplitTestHandler from '../SplitTests/SplitTestHandler.js'
 import Modules from '../../infrastructure/Modules.js'
 
 async function settingsPage(req, res) {
@@ -53,10 +52,8 @@ async function settingsPage(req, res) {
   const reconfirmedViaSAML = _.get(req.session, ['saml', 'reconfirmed'])
   delete req.session.saml
   let shouldAllowEditingDetails = true
-  if (Settings.ldap && Settings.ldap.updateUserDetailsOnLogin) {
-    shouldAllowEditingDetails = false
-  }
-  if (Settings.saml && Settings.saml.updateUserDetailsOnLogin) {
+  const externalAuth = req.user.externalAuth
+  if (externalAuth && Settings[externalAuth].updateUserDetailsOnLogin) {
     shouldAllowEditingDetails = false
   }
   const oauthProviders = Settings.oauthProviders || {}
@@ -117,11 +114,6 @@ async function settingsPage(req, res) {
     )
   }
 
-  // Get the users write-and-cite assignment to switch between translation strings
-  await SplitTestHandler.promises.getAssignment(req, res, 'write-and-cite')
-  // Get the users papers-integration assignment to show the linking widget
-  await SplitTestHandler.promises.getAssignment(req, res, 'papers-integration')
-
   res.render('user/settings', {
     title: 'account_settings',
     user: {
@@ -154,6 +146,7 @@ async function settingsPage(req, res) {
         enabled: Boolean(user.aiErrorAssistant?.enabled),
       },
     },
+    labsExperiments: user.labsExperiments ?? [],
     hasPassword: !!user.hashedPassword,
     shouldAllowEditingDetails,
     oauthProviders: UserPagesController._translateProviderDescriptions(
@@ -180,6 +173,7 @@ async function settingsPage(req, res) {
     gitBridgeEnabled: Settings.enableGitBridge,
     isSaas: Features.hasFeature('saas'),
     memberOfSSOEnabledGroups,
+    capabilities: [...req.capabilitySet],
   })
 }
 
@@ -196,16 +190,8 @@ async function reconfirmAccountPage(req, res) {
   const pageData = {
     reconfirm_email: req.session.reconfirm_email,
   }
-  const { variant } = await SplitTestHandler.promises.getAssignment(
-    req,
-    res,
-    'auth-pages-bs5'
-  )
 
-  const template =
-    variant === 'enabled' ? 'user/reconfirm-bs5' : 'user/reconfirm'
-
-  res.render(template, pageData)
+  res.render('user/reconfirm', pageData)
 }
 
 const UserPagesController = {
@@ -307,14 +293,6 @@ const UserPagesController = {
   },
 
   async compromisedPasswordPage(req, res) {
-    // Populates splitTestVariants with a value for the split test name and allows
-    // Pug to read it
-    await SplitTestHandler.promises.getAssignment(
-      req,
-      res,
-      'bs5-misc-pages-platform'
-    )
-
     res.render('user/compromised_password')
   },
 
diff --git a/services/web/app/src/Features/User/UserUpdater.js b/services/web/app/src/Features/User/UserUpdater.js
index 627e73875d..f21ee9a1ed 100644
--- a/services/web/app/src/Features/User/UserUpdater.js
+++ b/services/web/app/src/Features/User/UserUpdater.js
@@ -11,7 +11,6 @@ const EmailHandler = require('../Email/EmailHandler')
 const EmailHelper = require('../Helpers/EmailHelper')
 const Errors = require('../Errors/Errors')
 const NewsletterManager = require('../Newsletter/NewsletterManager')
-const RecurlyWrapper = require('../Subscription/RecurlyWrapper')
 const UserAuditLogHandler = require('./UserAuditLogHandler')
 const AnalyticsManager = require('../Analytics/AnalyticsManager')
 const SubscriptionLocator = require('../Subscription/SubscriptionLocator')
@@ -252,7 +251,11 @@ async function setDefaultEmailAddress(
   }
 
   try {
-    await RecurlyWrapper.promises.updateAccountEmailAddress(user._id, email)
+    await Modules.promises.hooks.fire(
+      'updateAccountEmailAddress',
+      user._id,
+      email
+    )
   } catch (error) {
     // errors are ignored
   }
diff --git a/services/web/app/src/Features/UserMembership/UserMembershipController.mjs b/services/web/app/src/Features/UserMembership/UserMembershipController.mjs
index aaa8fa5812..1f2516b0f5 100644
--- a/services/web/app/src/Features/UserMembership/UserMembershipController.mjs
+++ b/services/web/app/src/Features/UserMembership/UserMembershipController.mjs
@@ -13,6 +13,7 @@ import { Parser as CSVParser } from 'json2csv'
 import { expressify } from '@overleaf/promise-utils'
 import PlansLocator from '../Subscription/PlansLocator.js'
 import RecurlyClient from '../Subscription/RecurlyClient.js'
+import Modules from '../../infrastructure/Modules.js'
 
 async function manageGroupMembers(req, res, next) {
   const { entity: subscription, entityConfig } = req
@@ -31,8 +32,11 @@ async function manageGroupMembers(req, res, next) {
   )
   const ssoConfig = await SSOConfig.findById(subscription.ssoConfig).exec()
   const plan = PlansLocator.findLocalPlanInSettings(subscription.planCode)
-  const userId = SessionManager.getLoggedInUserId(req.session)
+  const userId = SessionManager.getLoggedInUserId(req.session)?.toString()
   const isAdmin = subscription.admin_id.toString() === userId
+  const isUserGroupManager =
+    Boolean(subscription.manager_ids?.some(id => id.toString() === userId)) &&
+    !isAdmin
   const recurlySubscription = subscription.recurlySubscription_id
     ? await RecurlyClient.promises.getSubscription(
         subscription.recurlySubscription_id
@@ -51,6 +55,7 @@ async function manageGroupMembers(req, res, next) {
     users,
     groupSize: subscription.membersLimit,
     managedUsersActive: subscription.managedUsersEnabled,
+    isUserGroupManager,
     groupSSOActive: ssoConfig?.enabled,
     canUseFlexibleLicensing: plan?.canUseFlexibleLicensing,
     canUseAddSeatsFeature,
@@ -117,6 +122,56 @@ async function _renderManagersPage(req, res, next, template) {
   })
 }
 
+async function exportCsv(req, res) {
+  let ssoEnabled
+  const { entity, entityConfig } = req
+  const fields = ['email', 'last_logged_in_at', 'last_active_at']
+
+  const { managedUsersEnabled } = entity
+
+  let users = await UserMembershipHandler.promises.getUsers(
+    entity,
+    entityConfig
+  )
+
+  if (entity.ssoConfig) {
+    const ssoEnabledResult = await Modules.promises.hooks.fire(
+      'hasGroupSSOEnabled',
+      entity
+    )
+    ssoEnabled = ssoEnabledResult?.[0]
+  }
+
+  if (managedUsersEnabled) {
+    fields.push('managed')
+  }
+
+  if (ssoEnabled) {
+    fields.push('sso')
+  }
+
+  if (managedUsersEnabled || ssoEnabled) {
+    users = users.map(user => {
+      if (managedUsersEnabled) {
+        user.managed =
+          user.enrollment?.managedBy?.toString() === entity._id.toString()
+      }
+
+      if (ssoEnabled) {
+        user.sso = !!user.enrollment?.sso?.some(
+          groupLinked =>
+            groupLinked.groupId.toString() === entity._id.toString()
+        )
+      }
+      return user
+    })
+  }
+
+  const csvParser = new CSVParser({ fields })
+
+  csvAttachment(res, csvParser.parse(users), 'Group.csv')
+}
+
 export default {
   manageGroupMembers: expressify(manageGroupMembers),
   manageGroupManagers: expressify(manageGroupManagers),
@@ -204,22 +259,7 @@ export default {
       }
     )
   },
-  exportCsv(req, res, next) {
-    const { entity, entityConfig } = req
-    const fields = ['email', 'last_logged_in_at', 'last_active_at']
-
-    UserMembershipHandler.getUsers(
-      entity,
-      entityConfig,
-      function (error, users) {
-        if (error != null) {
-          return next(error)
-        }
-        const csvParser = new CSVParser({ fields })
-        csvAttachment(res, csvParser.parse(users), 'Group.csv')
-      }
-    )
-  },
+  exportCsv: expressify(exportCsv),
   new(req, res, next) {
     res.render('user_membership/new', {
       entityName: req.params.name,
diff --git a/services/web/app/src/Features/UserMembership/UserMembershipHandler.js b/services/web/app/src/Features/UserMembership/UserMembershipHandler.js
index 0632f6e50e..56d92e9c96 100644
--- a/services/web/app/src/Features/UserMembership/UserMembershipHandler.js
+++ b/services/web/app/src/Features/UserMembership/UserMembershipHandler.js
@@ -79,11 +79,7 @@ async function getPopulatedListOfMembers(entity, attributes) {
     }
   }
 
-  const users = await Promise.all(
-    userObjects.map(userObject =>
-      UserMembershipViewModel.promises.buildAsync(userObject)
-    )
-  )
+  const users = await UserMembershipViewModel.promises.buildAsync(userObjects)
 
   for (const user of users) {
     if (
diff --git a/services/web/app/src/Features/UserMembership/UserMembershipViewModel.js b/services/web/app/src/Features/UserMembership/UserMembershipViewModel.js
index 6c94f677b7..1d83a258ef 100644
--- a/services/web/app/src/Features/UserMembership/UserMembershipViewModel.js
+++ b/services/web/app/src/Features/UserMembership/UserMembershipViewModel.js
@@ -23,30 +23,59 @@ const UserMembershipViewModel = {
     }
   },
 
-  buildAsync(userOrIdOrEmail, callback) {
+  buildAsync(userOrIdOrEmailArray, callback) {
     if (callback == null) {
       callback = function () {}
     }
-    if (!isObjectIdInstance(userOrIdOrEmail)) {
-      // userOrIdOrEmail is a user or an email and can be parsed by #build
-      return callback(null, UserMembershipViewModel.build(userOrIdOrEmail))
-    }
 
-    const userId = userOrIdOrEmail
-    const projection = {
-      email: 1,
-      first_name: 1,
-      last_name: 1,
-      lastLoggedIn: 1,
-      lastActive: 1,
-      enrollment: 1,
-    }
-    return UserGetter.getUser(userId, projection, function (error, user) {
-      if (error != null || user == null) {
-        return callback(null, buildUserViewModelWithId(userId.toString()))
+    const userObjectIds = userOrIdOrEmailArray.filter(isObjectIdInstance)
+
+    return UserGetter.getUsers(
+      userObjectIds,
+      {
+        email: 1,
+        first_name: 1,
+        last_name: 1,
+        lastLoggedIn: 1,
+        lastActive: 1,
+        enrollment: 1,
+      },
+      function (error, users) {
+        const results = []
+
+        if (error != null) {
+          userOrIdOrEmailArray.forEach(item => {
+            if (isObjectIdInstance(item)) {
+              results.push(buildUserViewModelWithId(item.toString()))
+            } else {
+              // `item` is a user or an email and can be parsed by #build
+              results.push(UserMembershipViewModel.build(item))
+            }
+          })
+        } else {
+          const usersMap = new Map()
+          for (const user of users) {
+            usersMap.set(user._id.toString(), user)
+          }
+
+          userOrIdOrEmailArray.forEach(item => {
+            if (isObjectIdInstance(item)) {
+              const user = usersMap.get(item.toString())
+              if (user == null) {
+                results.push(buildUserViewModelWithId(item.toString()))
+              } else {
+                results.push(buildUserViewModel(user))
+              }
+            } else {
+              // `item` is a user or an email and can be parsed by #build
+              results.push(UserMembershipViewModel.build(item))
+            }
+          })
+        }
+
+        callback(null, results)
       }
-      return callback(null, buildUserViewModel(user))
-    })
+    )
   },
 }
 
diff --git a/services/web/app/src/infrastructure/ExpressLocals.js b/services/web/app/src/infrastructure/ExpressLocals.js
index 002c342eef..6e45e82bc8 100644
--- a/services/web/app/src/infrastructure/ExpressLocals.js
+++ b/services/web/app/src/infrastructure/ExpressLocals.js
@@ -19,6 +19,7 @@ const {
 const {
   addOptionalCleanupHandlerAfterDrainingConnections,
 } = require('./GracefulShutdown')
+const { sanitizeSessionUserForFrontEnd } = require('./FrontEndUser')
 
 const IEEE_BRAND_ID = Settings.ieeeBrandId
 
@@ -106,9 +107,9 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
 
   webRouter.use(function (req, res, next) {
     req.externalAuthenticationSystemUsed =
-      Features.externalAuthenticationSystemUsed
+      () => !!req?.user?.externalAuth
     res.locals.externalAuthenticationSystemUsed =
-      Features.externalAuthenticationSystemUsed
+      () => !!req?.user?.externalAuth
     req.hasFeature = res.locals.hasFeature = Features.hasFeature
     next()
   })
@@ -200,6 +201,9 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
         if (res.locals.isIEEE(brandVariation?.brand_id)) {
           return enableIeeeBranding ? 'ieee-' : ''
         } else if (userSettings && userSettings.overallTheme != null) {
+          if (!['', 'light-'].includes(userSettings.overallTheme)) {
+            return ''
+          }
           return userSettings.overallTheme
         }
       }
@@ -300,11 +304,7 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
   webRouter.use(function (req, res, next) {
     const currentUser = SessionManager.getSessionUser(req.session)
     if (currentUser != null) {
-      res.locals.user = {
-        email: currentUser.email,
-        first_name: currentUser.first_name,
-        last_name: currentUser.last_name,
-      }
+      res.locals.user = sanitizeSessionUserForFrontEnd(currentUser)
     }
     next()
   })
@@ -344,7 +344,7 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
     if (Settings.overleaf != null) {
       res.locals.overallThemes = [
         {
-          name: 'Default',
+          name: 'Dark',
           val: '',
           path: res.locals.buildCssPath(),
         },
@@ -353,6 +353,11 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
           val: 'light-',
           path: res.locals.buildCssPath('light-'),
         },
+        {
+          name: 'System',
+          val: 'system',
+          path: res.locals.buildCssPath(),
+        },
       ]
     }
     next()
@@ -423,12 +428,15 @@ module.exports = function (webRouter, privateApiRouter, publicApiRouter) {
         Settings.analytics &&
         Settings.analytics.ga &&
         Settings.analytics.ga.tokenV4,
+      propensityId: Settings?.analytics?.propensity?.id,
       cookieDomain: Settings.cookieDomain,
       templateLinks: Settings.templateLinks,
       labsEnabled: Settings.labs && Settings.labs.enable,
       wikiEnabled: Settings.overleaf != null || Settings.proxyLearn,
       templatesEnabled:
-        Settings.overleaf != null || Settings.templates?.user_id != null,
+        Settings.overleaf != null || Boolean(Settings.templates),
+      cioWriteKey: Settings.analytics?.cio?.writeKey,
+      cioSiteId: Settings.analytics?.cio?.siteId,
     }
     next()
   })
diff --git a/services/web/app/src/infrastructure/Features.js b/services/web/app/src/infrastructure/Features.js
index aaf51103b9..c26a768793 100644
--- a/services/web/app/src/infrastructure/Features.js
+++ b/services/web/app/src/infrastructure/Features.js
@@ -12,15 +12,12 @@ const trackChangesModuleAvailable =
 /**
  * @typedef {Object} Settings
  * @property {Object | undefined}  apis
- * @property {Object | undefined}  apis.linkedUrlProxy
- * @property {string | undefined}  apis.linkedUrlProxy.url
  * @property {Object | undefined}  apis.references
  * @property {string | undefined}  apis.references.url
  * @property {boolean | undefined} enableGithubSync
  * @property {boolean | undefined} enableGitBridge
  * @property {boolean | undefined} enableHomepage
- * @property {boolean | undefined} enableProjectHistoryBlobs
- * @property {boolean | undefined} disableFilestore
+ * @property {number} filestoreMigrationLevel
  * @property {boolean | undefined} enableSaml
  * @property {boolean | undefined} ldap
  * @property {boolean | undefined} oauth
@@ -30,6 +27,14 @@ const trackChangesModuleAvailable =
  */
 
 const Features = {
+  validateSettings() {
+    if (![0, 1, 2].includes(Settings.filestoreMigrationLevel)) {
+      throw new Error(
+        `invalid OVERLEAF_FILESTORE_MIGRATION_LEVEL=${Settings.filestoreMigrationLevel}, expected 0, 1 or 2`
+      )
+    }
+  },
+
   /**
    * @returns {boolean}
    */
@@ -56,7 +61,7 @@ const Features = {
       case 'registration-page':
         return (
           !Features.externalAuthenticationSystemUsed() ||
-          Boolean(Settings.overleaf)
+          Boolean(Settings.overleaf) || Settings.oidc?.allowedOIDCEmailDomains
         )
       case 'registration':
         return Boolean(Settings.overleaf)
@@ -69,7 +74,7 @@ const Features = {
       case 'oauth':
         return Boolean(Settings.oauth)
       case 'templates-server-pro':
-        return Boolean(Settings.templates?.user_id)
+        return Boolean(Settings.templates)
       case 'affiliations':
       case 'analytics':
         return Boolean(_.get(Settings, ['apis', 'v1', 'url']))
@@ -85,13 +90,12 @@ const Features = {
         )
       case 'link-url':
         return Boolean(
-          _.get(Settings, ['apis', 'linkedUrlProxy', 'url']) &&
-            Settings.enabledLinkedFileTypes.includes('url')
+          Settings.enabledLinkedFileTypes.includes('url')
         )
       case 'project-history-blobs':
-        return Boolean(Settings.enableProjectHistoryBlobs)
+        return Settings.filestoreMigrationLevel > 0
       case 'filestore':
-        return Boolean(Settings.disableFilestore) === false
+        return Settings.filestoreMigrationLevel < 2
       case 'support':
         return supportModuleAvailable
       case 'symbol-palette':
diff --git a/services/web/app/src/infrastructure/FileWriter.js b/services/web/app/src/infrastructure/FileWriter.js
index 2c98028f37..1a56f5fa26 100644
--- a/services/web/app/src/infrastructure/FileWriter.js
+++ b/services/web/app/src/infrastructure/FileWriter.js
@@ -1,9 +1,4 @@
-/* eslint-disable
-    n/handle-callback-err,
-    max-len,
-*/
 // TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
 /*
  * decaffeinate suggestions:
  * DS102: Remove unnecessary code created because of implicit returns
@@ -122,6 +117,16 @@ const FileWriter = {
         }).withCause(err || {})
       }
       if (err) {
+        stream.destroy()
+        writeStream.destroy()
+        fs.unlink(fsPath, error => {
+          if (error && error.code !== 'ENOENT') {
+            logger.warn(
+              { error, fsPath },
+              'Failed to delete partial file after error'
+            )
+          }
+        })
         OError.tag(
           err,
           '[writeStreamToDisk] something went wrong writing the stream to disk',
@@ -153,14 +158,16 @@ const FileWriter = {
     callback = _.once(callback)
 
     const stream = request.get(url)
-    stream.on('error', function (err) {
+    const errorHandler = function (err) {
       logger.warn(
         { err, identifier, url },
         '[writeUrlToDisk] something went wrong with writing to disk'
       )
       callback(err)
-    })
+    }
+    stream.on('error', errorHandler)
     stream.on('response', function (response) {
+      stream.removeListener('error', errorHandler)
       if (response.statusCode >= 200 && response.statusCode < 300) {
         FileWriter.writeStreamToDisk(identifier, stream, options, callback)
       } else {
diff --git a/services/web/app/src/infrastructure/FrontEndUser.js b/services/web/app/src/infrastructure/FrontEndUser.js
new file mode 100644
index 0000000000..5a4af9868c
--- /dev/null
+++ b/services/web/app/src/infrastructure/FrontEndUser.js
@@ -0,0 +1,15 @@
+function sanitizeSessionUserForFrontEnd(sessionUser) {
+  if (sessionUser != null) {
+    return {
+      email: sessionUser.email,
+      first_name: sessionUser.first_name,
+      last_name: sessionUser.last_name,
+    }
+  }
+
+  return null
+}
+
+module.exports = {
+  sanitizeSessionUserForFrontEnd,
+}
diff --git a/services/web/app/src/infrastructure/GracefulShutdown.js b/services/web/app/src/infrastructure/GracefulShutdown.js
index 2446397b1d..515f8b1e7e 100644
--- a/services/web/app/src/infrastructure/GracefulShutdown.js
+++ b/services/web/app/src/infrastructure/GracefulShutdown.js
@@ -52,8 +52,8 @@ async function runHandlers(stage, handlers, logOnly) {
 }
 
 /**
- * @param {import('net').Server} server
- * @param {string} signal
+ * @param {import('net').Server} [server]
+ * @param {number|string} [signal]
  */
 async function gracefulShutdown(server, signal) {
   logger.warn({ signal }, 'graceful shutdown: started shutdown sequence')
@@ -65,20 +65,22 @@ async function gracefulShutdown(server, signal) {
     true
   )
 
-  await sleep(Settings.gracefulShutdownDelayInMs)
-  try {
-    await new Promise((resolve, reject) => {
-      logger.warn({}, 'graceful shutdown: closing http server')
-      server.close(err => {
-        if (err) {
-          reject(OError.tag(err, 'http.Server.close failed'))
-        } else {
-          resolve()
-        }
+  if (server) {
+    await sleep(Settings.gracefulShutdownDelayInMs)
+    try {
+      await new Promise((resolve, reject) => {
+        logger.warn({}, 'graceful shutdown: closing http server')
+        server.close(err => {
+          if (err) {
+            reject(OError.tag(err, 'http.Server.close failed'))
+          } else {
+            resolve()
+          }
+        })
       })
-    })
-  } catch (err) {
-    throw OError.tag(err, 'stop traffic')
+    } catch (err) {
+      throw OError.tag(err, 'stop traffic')
+    }
   }
 
   await runHandlers(
diff --git a/services/web/app/src/infrastructure/Modules.js b/services/web/app/src/infrastructure/Modules.js
index a21be431c4..aea3aeb087 100644
--- a/services/web/app/src/infrastructure/Modules.js
+++ b/services/web/app/src/infrastructure/Modules.js
@@ -1,49 +1,52 @@
+// @ts-check
+
 const fs = require('fs')
 const Path = require('path')
 const { promisify, callbackify } = require('util')
 const Settings = require('@overleaf/settings')
 const Views = require('./Views')
 const _ = require('lodash')
+const Metrics = require('@overleaf/metrics')
+
+/** @import { WebModule } from "../../../types/web-module" */
+/** @import { RequestHandler } from "express" */
 
 const MODULE_BASE_PATH = Path.join(__dirname, '/../../../modules')
 
+/** @type {WebModule[]} */
 const _modules = []
 let _modulesLoaded = false
 const _hooks = {}
+
+/** @type {Record<string, RequestHandler[]>} */
 const _middleware = {}
 let _viewIncludes = {}
 
 async function modules() {
   if (!_modulesLoaded) {
+    const beforeLoadModules = performance.now()
     await loadModules()
+    Metrics.gauge('web_startup', performance.now() - beforeLoadModules, 1, {
+      path: 'loadModules',
+    })
   }
   return _modules
 }
 
 async function loadModulesImpl() {
-  const settingsCheckModuleCjs = Path.join(
-    MODULE_BASE_PATH,
-    'settings-check',
-    'index.js'
-  )
-  const settingsCheckModuleEsm = Path.join(
+  const settingsCheckModule = Path.join(
     MODULE_BASE_PATH,
     'settings-check',
     'index.mjs'
   )
-  if (fs.existsSync(settingsCheckModuleCjs)) {
-    await import(settingsCheckModuleCjs)
-  } else if (fs.existsSync(settingsCheckModuleEsm)) {
-    await import(settingsCheckModuleEsm)
+  if (fs.existsSync(settingsCheckModule)) {
+    await import(settingsCheckModule)
   }
   for (const moduleName of Settings.moduleImportSequence || []) {
-    let path
-    if (fs.existsSync(Path.join(MODULE_BASE_PATH, moduleName, 'index.mjs'))) {
-      path = Path.join(MODULE_BASE_PATH, moduleName, 'index.mjs')
-    } else {
-      path = Path.join(MODULE_BASE_PATH, moduleName, 'index.js')
-    }
-    const module = await import(path)
+    const module = await import(
+      Path.join(MODULE_BASE_PATH, moduleName, 'index.mjs')
+    )
+    /** @type {WebModule & {name: string}} */
     const loadedModule = module.default || module
 
     loadedModule.name = moduleName
@@ -147,8 +150,7 @@ async function linkedFileAgentsIncludes() {
 async function attachHooks() {
   for (const module of await modules()) {
     const { promises, ...hooks } = module.hooks || {}
-    for (const hook in promises || {}) {
-      const method = promises[hook]
+    for (const [hook, method] of Object.entries(promises || {})) {
       attachHook(hook, method)
     }
     for (const hook in hooks || {}) {
@@ -167,12 +169,14 @@ function attachHook(name, method) {
 
 async function attachMiddleware() {
   for (const module of await modules()) {
-    for (const middleware in module.middleware || {}) {
-      const method = module.middleware[middleware]
-      if (_middleware[middleware] == null) {
-        _middleware[middleware] = []
+    if (module.middleware) {
+      for (const middleware in module.middleware) {
+        const method = module.middleware[middleware]
+        if (_middleware[middleware] == null) {
+          _middleware[middleware] = []
+        }
+        _middleware[middleware].push(method)
       }
-      _middleware[middleware].push(method)
     }
   }
 }
@@ -192,6 +196,9 @@ async function fireHook(name, ...args) {
   return results
 }
 
+/**
+ * @param {string} name
+ */
 async function getMiddleware(name) {
   // ensure that modules are loaded if we need to call a middleware
   if (!_modulesLoaded) {
diff --git a/services/web/app/src/infrastructure/RedisWrapper.js b/services/web/app/src/infrastructure/RedisWrapper.js
index fecb00ab14..3017d03e47 100644
--- a/services/web/app/src/infrastructure/RedisWrapper.js
+++ b/services/web/app/src/infrastructure/RedisWrapper.js
@@ -3,8 +3,9 @@ const redis = require('@overleaf/redis-wrapper')
 const { addConnectionDrainer } = require('./GracefulShutdown')
 
 if (
-  typeof global.beforeEach === 'function' &&
-  process.argv.join(' ').match(/unit/)
+  (typeof global.beforeEach === 'function' &&
+    process.argv.join(' ').match(/unit/)) ||
+  process.env.VITEST
 ) {
   throw new Error(
     'It looks like unit tests are running, but you are connecting to Redis. Missing a stub?'
diff --git a/services/web/app/src/infrastructure/Server.mjs b/services/web/app/src/infrastructure/Server.mjs
index 3c7fd752d6..6aba16e682 100644
--- a/services/web/app/src/infrastructure/Server.mjs
+++ b/services/web/app/src/infrastructure/Server.mjs
@@ -134,7 +134,7 @@ app.set('views', fileURLToPath(new URL('../../views', import.meta.url)))
 app.set('view engine', 'pug')
 
 if (Settings.enabledServices.includes('web')) {
-  if (app.get('env') !== 'development') {
+  if (Settings.enablePugCache || app.get('env') !== 'development') {
     logger.debug('enabling view cache for production or acceptance tests')
     app.enable('view cache')
   }
@@ -372,6 +372,10 @@ if (Settings.enabledServices.includes('web')) {
 metrics.injectMetricsRoute(webRouter)
 metrics.injectMetricsRoute(privateApiRouter)
 
+const beforeRouterInitialize = performance.now()
 await Router.initialize(webRouter, privateApiRouter, publicApiRouter)
+metrics.gauge('web_startup', performance.now() - beforeRouterInitialize, 1, {
+  path: 'Router.initialize',
+})
 
 export default { app, server }
diff --git a/services/web/app/src/infrastructure/mongodb.js b/services/web/app/src/infrastructure/mongodb.js
index 70753dd38d..24103b2d82 100644
--- a/services/web/app/src/infrastructure/mongodb.js
+++ b/services/web/app/src/infrastructure/mongodb.js
@@ -33,7 +33,6 @@ addConnectionDrainer('mongodb', async () => {
 const internalDb = mongoClient.db()
 const db = {
   contacts: internalDb.collection('contacts'),
-  deletedFiles: internalDb.collection('deletedFiles'),
   deletedProjects: internalDb.collection('deletedProjects'),
   deletedSubscriptions: internalDb.collection('deletedSubscriptions'),
   deletedUsers: internalDb.collection('deletedUsers'),
@@ -49,6 +48,7 @@ const db = {
   githubSyncUserCredentials: internalDb.collection('githubSyncUserCredentials'),
   globalMetrics: internalDb.collection('globalMetrics'),
   grouppolicies: internalDb.collection('grouppolicies'),
+  groupAuditLogEntries: internalDb.collection('groupAuditLogEntries'),
   institutions: internalDb.collection('institutions'),
   messages: internalDb.collection('messages'),
   migrations: internalDb.collection('migrations'),
@@ -61,7 +61,6 @@ const db = {
   projectHistoryFailures: internalDb.collection('projectHistoryFailures'),
   projectHistoryGlobalBlobs: internalDb.collection('projectHistoryGlobalBlobs'),
   projectHistoryLabels: internalDb.collection('projectHistoryLabels'),
-  projectHistoryMetaData: internalDb.collection('projectHistoryMetaData'),
   projectHistorySyncState: internalDb.collection('projectHistorySyncState'),
   projectInvites: internalDb.collection('projectInvites'),
   projects: internalDb.collection('projects'),
@@ -81,6 +80,7 @@ const db = {
   userAuditLogEntries: internalDb.collection('userAuditLogEntries'),
   users: internalDb.collection('users'),
   onboardingDataCollection: internalDb.collection('onboardingDataCollection'),
+  scriptLogs: internalDb.collection('scriptLogs'),
 }
 
 const connectionPromise = mongoClient.connect()
@@ -129,10 +129,15 @@ async function getCollectionInternal(name) {
   return internalDb.collection(name)
 }
 
+async function waitForDb() {
+  await connectionPromise
+}
+
 module.exports = {
   db,
   ObjectId,
   connectionPromise,
+  waitForDb,
   getCollectionNames,
   getCollectionInternal,
   cleanupTestDatabase,
diff --git a/services/web/app/src/models/DeletedFile.js b/services/web/app/src/models/DeletedFile.js
deleted file mode 100644
index 45d30d8099..0000000000
--- a/services/web/app/src/models/DeletedFile.js
+++ /dev/null
@@ -1,21 +0,0 @@
-const mongoose = require('../infrastructure/Mongoose')
-const { Schema } = mongoose
-
-const DeletedFileSchema = new Schema(
-  {
-    name: String,
-    projectId: Schema.ObjectId,
-    created: {
-      type: Date,
-    },
-    linkedFileData: { type: Schema.Types.Mixed },
-    hash: {
-      type: String,
-    },
-    deletedAt: { type: Date },
-  },
-  { collection: 'deletedFiles', minimize: false }
-)
-
-exports.DeletedFile = mongoose.model('DeletedFile', DeletedFileSchema)
-exports.DeletedFileSchema = DeletedFileSchema
diff --git a/services/web/app/src/models/GroupAuditLogEntry.js b/services/web/app/src/models/GroupAuditLogEntry.js
new file mode 100644
index 0000000000..3bda4ebf95
--- /dev/null
+++ b/services/web/app/src/models/GroupAuditLogEntry.js
@@ -0,0 +1,23 @@
+const mongoose = require('../infrastructure/Mongoose')
+const { Schema } = mongoose
+
+const GroupAuditLogEntrySchema = new Schema(
+  {
+    groupId: { type: Schema.Types.ObjectId, index: true },
+    info: { type: Object },
+    initiatorId: { type: Schema.Types.ObjectId },
+    ipAddress: { type: String },
+    operation: { type: String },
+    timestamp: { type: Date, default: Date.now },
+  },
+  {
+    collection: 'groupAuditLogEntries',
+    minimize: false,
+  }
+)
+
+exports.GroupAuditLogEntry = mongoose.model(
+  'GroupAuditLogEntry',
+  GroupAuditLogEntrySchema
+)
+exports.GroupAuditLogEntrySchema = GroupAuditLogEntrySchema
diff --git a/services/web/app/src/models/GroupPolicy.js b/services/web/app/src/models/GroupPolicy.js
index e975834008..55728a2415 100644
--- a/services/web/app/src/models/GroupPolicy.js
+++ b/services/web/app/src/models/GroupPolicy.js
@@ -27,6 +27,9 @@ const GroupPolicySchema = new Schema(
 
     // User can't use the chat feature
     userCannotUseChat: Boolean,
+
+    // User can't use the Dropbox feature
+    userCannotUseDropbox: Boolean,
   },
   { minimize: false }
 )
diff --git a/services/web/app/src/models/OauthApplication.js b/services/web/app/src/models/OauthApplication.js
index f02a9850db..d7bd181fd6 100644
--- a/services/web/app/src/models/OauthApplication.js
+++ b/services/web/app/src/models/OauthApplication.js
@@ -10,6 +10,7 @@ const OauthApplicationSchema = new Schema(
     name: String,
     redirectUris: [String],
     scopes: [String],
+    pkceEnabled: Boolean,
   },
   {
     collection: 'oauthApplications',
diff --git a/services/web/app/src/models/Project.js b/services/web/app/src/models/Project.js
index 8da4b888d3..69db145038 100644
--- a/services/web/app/src/models/Project.js
+++ b/services/web/app/src/models/Project.js
@@ -12,18 +12,6 @@ const DeletedDocSchema = new Schema({
   deletedAt: { type: Date },
 })
 
-const DeletedFileSchema = new Schema({
-  name: String,
-  created: {
-    type: Date,
-  },
-  linkedFileData: { type: Schema.Types.Mixed },
-  hash: {
-    type: String,
-  },
-  deletedAt: { type: Date },
-})
-
 const ProjectSchema = new Schema(
   {
     name: { type: String, default: 'new project' },
@@ -54,7 +42,6 @@ const ProjectSchema = new Schema(
     archived: { type: Schema.Types.Mixed },
     trashed: [{ type: ObjectId, ref: 'User' }],
     deletedDocs: [DeletedDocSchema],
-    deletedFiles: [DeletedFileSchema],
     imageName: { type: String },
     brandVariationId: { type: String },
     track_changes: { type: Object },
@@ -99,6 +86,7 @@ const ProjectSchema = new Schema(
         allowDowngrade: { type: Boolean },
         zipFileArchivedInProject: { type: Boolean },
         rangesSupportEnabled: { type: Boolean },
+        otMigrationStage: { type: Number },
       },
     },
     collabratecUsers: [
diff --git a/services/web/app/src/models/SSOConfig.js b/services/web/app/src/models/SSOConfig.js
index 5d50d51d02..6734b29f57 100644
--- a/services/web/app/src/models/SSOConfig.js
+++ b/services/web/app/src/models/SSOConfig.js
@@ -10,6 +10,7 @@ const SSOConfigSchema = new Schema(
     userLastNameAttribute: { type: String },
     validated: { type: Boolean, default: false },
     enabled: { type: Boolean, default: false },
+    useSettingsUKAMF: { type: Boolean, default: false },
   },
 
   {
diff --git a/services/web/app/src/models/ScriptLog.mjs b/services/web/app/src/models/ScriptLog.mjs
new file mode 100644
index 0000000000..9cc6b8655f
--- /dev/null
+++ b/services/web/app/src/models/ScriptLog.mjs
@@ -0,0 +1,27 @@
+import Mongoose from '../infrastructure/Mongoose.js'
+
+export const ScriptLogSchema = new Mongoose.Schema(
+  {
+    canonicalName: { type: String, required: true },
+    filePathAtVersion: { type: String, required: true },
+    imageVersion: { type: String, required: true },
+    podName: { type: String, required: true },
+    startTime: { type: Date, default: Date.now },
+    endTime: { type: Date, default: null },
+    username: { type: String, required: true },
+    status: {
+      type: String,
+      enum: ['pending', 'success', 'error'],
+      default: 'pending',
+      required: true,
+    },
+    vars: { type: Object, required: true },
+    progressLogs: {
+      type: [{ timestamp: Date, message: String }],
+      required: true,
+    },
+  },
+  { minimize: false, collection: 'scriptLogs' }
+)
+
+export const ScriptLog = Mongoose.model('ScriptLog', ScriptLogSchema)
diff --git a/services/web/app/src/models/Subscription.js b/services/web/app/src/models/Subscription.js
index aae114846c..aa840a67de 100644
--- a/services/web/app/src/models/Subscription.js
+++ b/services/web/app/src/models/Subscription.js
@@ -25,16 +25,25 @@ const SubscriptionSchema = new Schema(
     invited_emails: [String],
     teamInvites: [TeamInviteSchema],
     recurlySubscription_id: String,
+    lastSuccesfulSubscription: {
+      planCode: {
+        type: String,
+      },
+      addOns: Schema.Types.Mixed,
+    },
+    timesRevertedDueToFailedPayment: { type: Number, default: 0 },
     teamName: { type: String },
     teamNotice: { type: String },
     planCode: { type: String },
     groupPlan: { type: Boolean, default: false },
+    domainCaptureEnabled: { type: Boolean, default: false },
     managedUsersEnabled: { type: Boolean, default: false },
     membersLimit: { type: Number, default: 0 },
     customAccount: Boolean,
     features: {
       managedUsers: { type: Boolean, default: true },
       groupSSO: { type: Boolean, default: true },
+      domainCapture: { type: Boolean, default: false },
     },
     addOns: Schema.Types.Mixed,
     overleaf: {
@@ -57,6 +66,23 @@ const SubscriptionSchema = new Schema(
         type: Date,
       },
     },
+    paymentProvider: {
+      service: {
+        type: String,
+      },
+      subscriptionId: {
+        type: String,
+      },
+      state: {
+        type: String,
+      },
+      trialStartedAt: {
+        type: Date,
+      },
+      trialEndsAt: {
+        type: Date,
+      },
+    },
     collectionMethod: {
       type: String,
       enum: ['automatic', 'manual'],
diff --git a/services/web/app/src/models/Survey.js b/services/web/app/src/models/Survey.js
index 5d56a20b54..01068ef49a 100644
--- a/services/web/app/src/models/Survey.js
+++ b/services/web/app/src/models/Survey.js
@@ -19,14 +19,18 @@ const SurveySchema = new Schema(
         message: `invalid, must match: ${NAME_REGEX}`,
       },
     },
-    preText: {
+    title: {
       type: String,
       required: true,
     },
-    linkText: {
+    text: {
       type: String,
       required: true,
     },
+    cta: {
+      type: String,
+      required: false,
+    },
     url: {
       type: String,
       required: true,
@@ -36,10 +40,20 @@ const SurveySchema = new Schema(
         type: Boolean,
         default: false,
       },
+      earliestSignupDate: {
+        type: Date,
+      },
+      latestSignupDate: {
+        type: Date,
+      },
       rolloutPercentage: {
         type: Number,
         default: 100,
       },
+      excludeLabsUsers: {
+        type: Boolean,
+        default: false,
+      },
     },
   },
   {
diff --git a/services/web/app/src/models/User.js b/services/web/app/src/models/User.js
index 73506f161c..bdf8a4c4ed 100644
--- a/services/web/app/src/models/User.js
+++ b/services/web/app/src/models/User.js
@@ -58,6 +58,7 @@ const UserSchema = new Schema(
       enrolledAt: { type: Date },
     },
     isAdmin: { type: Boolean, default: false },
+    adminRoles: { type: Array },
     staffAccess: {
       publisherMetrics: { type: Boolean, default: false },
       publisherManagement: { type: Boolean, default: false },
@@ -97,6 +98,7 @@ const UserSchema = new Schema(
       fontFamily: { type: String },
       lineHeight: { type: String },
       mathPreview: { type: Boolean, default: true },
+      breadcrumbs: { type: Boolean, default: true },
       referencesSearchMode: { type: String, default: 'advanced' }, // 'advanced' or 'simple'
       enableNewEditor: { type: Boolean },
     },
@@ -196,6 +198,7 @@ const UserSchema = new Schema(
       enabled: { type: Boolean, default: null },
       autoCreatedAccount: { type: Boolean, default: false },
       isPremium: { type: Boolean, default: false },
+      premiumSource: { type: String, default: null },
     },
     aiErrorAssistant: {
       enabled: { type: Boolean, default: true },
@@ -203,6 +206,7 @@ const UserSchema = new Schema(
     alphaProgram: { type: Boolean, default: false }, // experimental features
     betaProgram: { type: Boolean, default: false },
     labsProgram: { type: Boolean, default: false },
+    labsExperiments: { type: Array, default: [] },
     overleaf: {
       id: { type: Number },
       accessToken: { type: String },
@@ -222,6 +226,9 @@ const UserSchema = new Schema(
     analyticsId: { type: String },
     completedTutorials: Schema.Types.Mixed,
     suspended: { type: Boolean },
+    dsMobileApp: {
+      subscribed: { type: Boolean },
+    },
   },
   { minimize: false }
 )
diff --git a/services/web/app/src/router.mjs b/services/web/app/src/router.mjs
index 830620506a..c385be9b8e 100644
--- a/services/web/app/src/router.mjs
+++ b/services/web/app/src/router.mjs
@@ -66,6 +66,7 @@ import _ from 'lodash'
 import { plainTextResponse } from './infrastructure/Response.js'
 import PublicAccessLevels from './Features/Authorization/PublicAccessLevels.js'
 import SocketDiagnostics from './Features/SocketDiagnostics/SocketDiagnostics.mjs'
+import ClsiCacheController from './Features/Compile/ClsiCacheController.js'
 const ClsiCookieManager = ClsiCookieManagerFactory(
   Settings.apis.clsi != null ? Settings.apis.clsi.backendGroupName : undefined
 )
@@ -181,7 +182,7 @@ const rateLimiters = {
     duration: 60,
   }),
   sendConfirmation: new RateLimiter('send-confirmation', {
-    points: 1,
+    points: 2,
     duration: 60,
   }),
   sendChatMessage: new RateLimiter('send-chat-message', {
@@ -216,6 +217,8 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     CaptchaMiddleware.canSkipCaptcha
   )
 
+  await Modules.applyRouter(webRouter, privateApiRouter, publicApiRouter)
+
   webRouter.get('/login', UserPagesController.loginPage)
   AuthenticationController.addEndpointToLoginWhitelist('/login')
 
@@ -261,6 +264,8 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     '/read-only/one-time-login'
   )
 
+  await Modules.applyRouter(webRouter, privateApiRouter, publicApiRouter)
+
   webRouter.post('/logout', UserController.logout)
 
   webRouter.get('/restricted', AuthorizationMiddleware.restricted)
@@ -284,8 +289,6 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
   TokenAccessRouter.apply(webRouter)
   HistoryRouter.apply(webRouter, privateApiRouter)
 
-  await Modules.applyRouter(webRouter, privateApiRouter, publicApiRouter)
-
   if (Settings.enableSubscriptions) {
     webRouter.get(
       '/user/bonus',
@@ -344,7 +347,7 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     '/user/emails/send-confirmation-code',
     AuthenticationController.requireLogin(),
     RateLimiterMiddleware.rateLimit(rateLimiters.sendConfirmation),
-    UserEmailsController.sendExistingSecondaryEmailConfirmationCode
+    UserEmailsController.sendExistingEmailConfirmationCode
   )
 
   webRouter.post(
@@ -483,6 +486,11 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     AuthenticationController.requirePrivateApiAuth(),
     UserInfoController.getPersonalInfo
   )
+  webRouter.get(
+    '/user/features',
+    AuthenticationController.requireLogin(),
+    UserInfoController.getUserFeatures
+  )
 
   webRouter.get(
     '/user/reconfirm',
@@ -606,36 +614,21 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     CompileController.stopCompile
   )
 
-  // LEGACY: Used by the web download buttons, adds filename header, TODO: remove at some future date
   webRouter.get(
-    '/project/:Project_id/output/output.pdf',
+    '/project/:Project_id/output/cached/output.overleaf.json',
     AuthorizationMiddleware.ensureUserCanReadProject,
-    CompileController.downloadPdf
+    ClsiCacheController.getLatestBuildFromCache
   )
 
-  // PDF Download button
   webRouter.get(
-    /^\/download\/project\/([^/]*)\/output\/output\.pdf$/,
-    function (req, res, next) {
-      const params = { Project_id: req.params[0] }
-      req.params = params
-      next()
-    },
+    '/download/project/:Project_id/build/:buildId/output/cached/:filename',
     AuthorizationMiddleware.ensureUserCanReadProject,
-    CompileController.downloadPdf
+    ClsiCacheController.downloadFromCache
   )
 
   // PDF Download button for specific build
   webRouter.get(
-    /^\/download\/project\/([^/]*)\/build\/([0-9a-f-]+)\/output\/output\.pdf$/,
-    function (req, res, next) {
-      const params = {
-        Project_id: req.params[0],
-        build_id: req.params[1],
-      }
-      req.params = params
-      next()
-    },
+    '/download/project/:Project_id/build/:build_id/output/output.pdf',
     AuthorizationMiddleware.ensureUserCanReadProject,
     CompileController.downloadPdf
   )
@@ -646,22 +639,7 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     { params: ['Project_id'] }
   )
 
-  // Used by the pdf viewers
-  webRouter.get(
-    /^\/project\/([^/]*)\/output\/(.*)$/,
-    function (req, res, next) {
-      const params = {
-        Project_id: req.params[0],
-        file: req.params[1],
-      }
-      req.params = params
-      next()
-    },
-    rateLimiterMiddlewareOutputFiles,
-    AuthorizationMiddleware.ensureUserCanReadProject,
-    CompileController.getFileFromClsi
-  )
-  // direct url access to output files for a specific build (query string not required)
+  // direct url access to output files for a specific build
   webRouter.get(
     /^\/project\/([^/]*)\/build\/([0-9a-f-]+)\/output\/(.*)$/,
     function (req, res, next) {
@@ -678,24 +656,7 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     CompileController.getFileFromClsi
   )
 
-  // direct url access to output files for user but no build, to retrieve files when build fails
-  webRouter.get(
-    /^\/project\/([^/]*)\/user\/([0-9a-f-]+)\/output\/(.*)$/,
-    function (req, res, next) {
-      const params = {
-        Project_id: req.params[0],
-        user_id: req.params[1],
-        file: req.params[2],
-      }
-      req.params = params
-      next()
-    },
-    rateLimiterMiddlewareOutputFiles,
-    AuthorizationMiddleware.ensureUserCanReadProject,
-    CompileController.getFileFromClsi
-  )
-
-  // direct url access to output files for a specific user and build (query string not required)
+  // direct url access to output files for a specific user and build
   webRouter.get(
     /^\/project\/([^/]*)\/user\/([0-9a-f]+)\/build\/([0-9a-f-]+)\/output\/(.*)$/,
     function (req, res, next) {
@@ -956,6 +917,12 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     NotificationsController.markNotificationAsRead
   )
 
+  webRouter.get(
+    '/user/notification/:notificationId',
+    AuthenticationController.requireLogin(),
+    NotificationsController.getNotification
+  )
+
   // Deprecated in favour of /internal/project/:project_id but still used by versioning
   privateApiRouter.get(
     '/project/:project_id/details',
@@ -991,20 +958,6 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     InactiveProjectController.deactivateProject
   )
 
-  privateApiRouter.get(
-    /^\/internal\/project\/([^/]*)\/output\/(.*)$/,
-    function (req, res, next) {
-      const params = {
-        Project_id: req.params[0],
-        file: req.params[1],
-      }
-      req.params = params
-      next()
-    },
-    AuthenticationController.requirePrivateApiAuth(),
-    CompileController.getFileFromClsi
-  )
-
   privateApiRouter.get(
     '/project/:Project_id/doc/:doc_id',
     AuthenticationController.requirePrivateApiAuth(),
@@ -1247,7 +1200,9 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
       const sendRes = _.once(function (statusCode, message) {
         res.status(statusCode)
         plainTextResponse(res, message)
-        ClsiCookieManager.clearServerId(projectId, testUserId, () => {})
+        ClsiCookieManager.promises
+          .clearServerId(projectId, testUserId)
+          .catch(() => {})
       }) // force every compile to a new server
       // set a timeout
       let handler = setTimeout(function () {
@@ -1318,6 +1273,10 @@ async function initialize(webRouter, privateApiRouter, publicApiRouter) {
     TokenAccessController.grantTokenAccessReadOnly
   )
 
+  webRouter.get(['/learn*', '/blog*', '/latex*', '/for/*', '/contact*'], (req, res) => {
+    res.redirect(301, `https://www.overleaf.com${req.originalUrl}`)
+  })
+
   webRouter.get('/unsupported-browser', renderUnsupportedBrowserPage)
 
   webRouter.get('*', ErrorController.notFound)
diff --git a/services/web/app/templates/project_files/example-project/main.tex b/services/web/app/templates/project_files/example-project/main.tex
index 5199b66d9d..45d982a2f6 100644
--- a/services/web/app/templates/project_files/example-project/main.tex
+++ b/services/web/app/templates/project_files/example-project/main.tex
@@ -49,7 +49,7 @@ Note that your figure will automatically be placed in the most appropriate place
 
 \subsection{How to add Tables}
 
-Use the table and tabular environments for basic tables --- see Table~\ref{tab:widgets}, for example. For more information, please see this help article on \href{https://www.overleaf.com/learn/latex/tables}{tables}. 
+Use the table and tabular environments for basic tables --- see Table~\ref{tab:widgets}, for example. For more information, please see this help article on \href{https://www.overleaf.com/learn/latex/tables}{tables}.
 
 \begin{table}
 \centering
@@ -65,7 +65,7 @@ Gadgets & 13
 
 Comments can be added to your project by highlighting some text and clicking ``Add comment'' in the top right of the editor pane. To view existing comments, click on the Review menu in the toolbar above. To reply to a comment, click on the Reply button in the lower right corner of the comment. You can close the Review pane by clicking its name on the toolbar when you're done reviewing for the time being.
 
-Track changes are available on all our \href{https://www.overleaf.com/user/subscription/plans}{premium plans}, and can be toggled on or off using the option at the top of the Review pane. Track changes allow you to keep track of every change made to the document, along with the person making the change. 
+Track changes are available on all our \href{https://www.overleaf.com/user/subscription/plans}{premium plans}, and can be toggled on or off using the option at the top of the Review pane. Track changes allow you to keep track of every change made to the document, along with the person making the change.
 
 \subsection{How to add Lists}
 
@@ -97,7 +97,7 @@ If however you're using a more general template, such as this one, and would lik
 
 \subsection{How to change the document language and spell check settings}
 
-Overleaf supports many different languages, including multiple different languages within one document. 
+Overleaf supports many different languages, including multiple different languages within one document.
 
 To configure the document language, simply edit the option provided to the babel package in the preamble at the top of this example project. To learn more about the different options, please visit this help article on \href{https://www.overleaf.com/learn/latex/International_language_support}{international language support}.
 
@@ -111,9 +111,9 @@ If you have an \href{https://www.overleaf.com/user/subscription/plans}{upgraded
 
 \subsection{Good luck!}
 
-We hope you find Overleaf useful, and do take a look at our \href{https://www.overleaf.com/learn}{help library} for more tutorials and user guides! Please also let us know if you have any feedback using the Contact Us link at the bottom of the Overleaf menu --- or use the contact form at \url{https://www.overleaf.com/contact}.
+We hope you find Overleaf useful, and do take a look at our \href{https://www.overleaf.com/learn}{help library} for more tutorials and user guides! Please also let us know if you have any feedback using the \textbf{Contact us} link at the bottom of the Overleaf menu --- or use the contact form at \url{https://www.overleaf.com/contact}.
 
 \bibliographystyle{alpha}
 \bibliography{sample}
 
-\end{document}
\ No newline at end of file
+\end{document}
diff --git a/services/web/app/views/_cookie_banner.pug b/services/web/app/views/_cookie_banner.pug
index a164e48e83..7cbc569bc1 100644
--- a/services/web/app/views/_cookie_banner.pug
+++ b/services/web/app/views/_cookie_banner.pug
@@ -1,5 +1,13 @@
-.cookie-banner.hidden-print.hidden
-    .cookie-banner-content We only use cookies for essential purposes and to improve your experience on our site. You can find out more in our <a href="/legal#Cookies">cookie policy</a>.
-    .cookie-banner-actions
-        button(type="button" class="btn btn-link btn-sm" data-ol-cookie-banner-set-consent="essential") Essential cookies only
-        button(type="button" class="btn btn-primary btn-sm" data-ol-cookie-banner-set-consent="all") Accept all cookies
\ No newline at end of file
+section.cookie-banner.hidden-print.hidden(aria-label=translate('cookie_banner'))
+	.cookie-banner-content !{translate('cookie_banner_info', {}, [{ name: 'a', attrs: { href: '/legal#Cookies' }}])}
+	.cookie-banner-actions
+		button(
+			type='button'
+			class='btn btn-link btn-sm'
+			data-ol-cookie-banner-set-consent='essential'
+		) #{translate('essential_cookies_only')}
+		button(
+			type='button'
+			class='btn btn-primary btn-sm'
+			data-ol-cookie-banner-set-consent='all'
+		) #{translate('accept_all_cookies')}
diff --git a/services/web/app/views/_customer_io.pug b/services/web/app/views/_customer_io.pug
new file mode 100644
index 0000000000..61b4dc9f1d
--- /dev/null
+++ b/services/web/app/views/_customer_io.pug
@@ -0,0 +1,48 @@
+if(customerIoEnabled && ExposedSettings.cioWriteKey && ExposedSettings.cioSiteId)
+	-
+		function boolAttr(value) {
+			return value !== undefined ? String(value) : null;
+		}
+	script(type="text/javascript", id="cio-loader", nonce=scriptNonce, data-best-subscription=(usersBestSubscription && usersBestSubscription.type), data-ai-blocked=boolAttr(aiBlocked), data-has-ai-assist=boolAttr(hasAiAssist), data-cio-write-key=ExposedSettings.cioWriteKey, data-cio-site-id=ExposedSettings.cioSiteId, data-session-analytics-id=getSessionAnalyticsId(), data-user-id=getLoggedInUserId()).
+		
+		function parseBool(value) {
+			return value === 'true' ? true : value === 'false' ? false : undefined;
+		}
+		
+		var cioSettings = document.querySelector('#cio-loader').dataset;
+		var analyticsId = cioSettings.sessionAnalyticsId;
+		var siteId = cioSettings.cioSiteId;
+		var writeKey = cioSettings.cioWriteKey;
+		var userId = cioSettings.userId;
+		var usersBestSubscription = cioSettings.bestSubscription;
+		var aiBlocked = parseBool(cioSettings.aiBlocked);
+		var hasAiAssist = parseBool(cioSettings.hasAiAssist);
+
+
+		!function(){var i="cioanalytics", analytics=(window[i]=window[i]||[]);if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.setAttribute('data-global-customerio-analytics-key', i);t.src="https://cdp.customer.io/v1/analytics-js/snippet/" + key + "/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._writeKey=key;analytics._loadOptions=e};analytics.SNIPPET_VERSION="4.15.3";
+			analytics.load(
+				writeKey, 
+				{
+					disableClientPersistence: true,
+					"integrations": {
+						"Customer.io In-App Plugin": {
+							siteId
+						}
+					}
+				}
+			);
+			if (analyticsId) {
+				analytics.setAnonymousId(analyticsId);
+			};
+			
+			function addIfDefined(obj, key, value) {
+				if (typeof value !== 'undefined') obj[key] = value;
+			}
+			
+			var identifyData = {overleafId: userId};
+			addIfDefined(identifyData, 'best-subscription-type', usersBestSubscription);
+			addIfDefined(identifyData, 'aiBlocked', aiBlocked);
+			addIfDefined(identifyData, 'hasAiAssist', hasAiAssist);
+			
+			analytics.identify(analyticsId, identifyData);
+		}}();
diff --git a/services/web/app/views/_metadata.pug b/services/web/app/views/_metadata.pug
index a784860095..b28ca6abd2 100644
--- a/services/web/app/views/_metadata.pug
+++ b/services/web/app/views/_metadata.pug
@@ -1,123 +1,140 @@
-
 //- Title
-if (metadata && metadata.title)
-	title= metadata.title + ' - ' + settings.appName + ', ' + translate("online_latex_editor")
-	meta(name="twitter:title", content=metadata.title)
-	meta(name="og:title", content=metadata.title)
-else if (typeof(title) == "undefined")
-	title= settings.appName + ', '+ translate("online_latex_editor")
-	meta(name="twitter:title", content=settings.appName + ', '+ translate("online_latex_editor"))
-	meta(name="og:title", content=settings.appName + ', '+ translate("online_latex_editor"))
+if metadata && metadata.title
+	title(translate='no')= metadata.title + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
+	meta(name='twitter:title' content=metadata.title)
+	meta(name='og:title' content=metadata.title)
+else if typeof title == 'undefined'
+	title(translate='no')= settings.appName + ', ' + translate('online_latex_editor')
+	meta(
+		name='twitter:title'
+		content=settings.appName + ', ' + translate('online_latex_editor')
+	)
+	meta(
+		name='og:title'
+		content=settings.appName + ', ' + translate('online_latex_editor')
+	)
 else
-	title= translate(title) + ' - ' + settings.appName + ', ' + translate("online_latex_editor")
+	title(translate='no')= translate(title) + ' - ' + settings.appName + ', ' + translate('online_latex_editor')
 	//- to do - not translate?
-	meta(name="twitter:title", content=translate(title))
-	meta(name="og:title", content=translate(title))
+	meta(name='twitter:title' content=translate(title))
+	meta(name='og:title' content=translate(title))
 
 //- Description
-if (metadata && metadata.description)
-	meta(name="description" , content=metadata.description)
-	meta(itemprop="description" , content=metadata.description)
+if metadata && metadata.description
+	meta(name='description' content=metadata.description)
+	meta(itemprop='description' content=metadata.description)
 	//-twitter and og descriptions handeled in their sections below
 else
-	meta(name="description", content=translate("site_description"))
-	meta(itemprop="description", content=translate("site_description"))
+	meta(name='description' content=translate('site_description'))
+	meta(itemprop='description' content=translate('site_description'))
 
 //- Image
-if (metadata && metadata.image && metadata.image.fields)
+if metadata && metadata.image && metadata.image.fields
 	//- from the CMS
-	meta(itemprop="image", content=metadata.image.fields.file.url)
-	meta(name="image", content=metadata.image.fields.file.url)
-else if (metadata && metadata.image_src)
+	meta(itemprop='image' content=metadata.image.fields.file.url)
+	meta(name='image' content=metadata.image.fields.file.url)
+else if metadata && metadata.image_src
 	//- pages with custom metadata images, metadata.image_src is the full image URL
-	meta(itemprop="image", content=metadata.image_src)
-	meta(name="image", content=metadata.image_src)
-else if (settings.overleaf)
+	meta(itemprop='image' content=metadata.image_src)
+	meta(name='image' content=metadata.image_src)
+else if settings.overleaf
 	//- the default image for Overleaf
-	meta(itemprop="image", content=buildImgPath('ol-brand/overleaf_og_logo.png'))
-	meta(name="image", content=buildImgPath('ol-brand/overleaf_og_logo.png'))
+	meta(itemprop='image' content=buildImgPath('ol-brand/overleaf_og_logo.png'))
+	meta(name='image' content=buildImgPath('ol-brand/overleaf_og_logo.png'))
 else
 	//- the default image for Overleaf Community Edition/Server Pro
-	meta(itemprop="image", content='/apple-touch-icon.png')
-	meta(name="image", content='/apple-touch-icon.png')
+	meta(itemprop='image' content='/apple-touch-icon.png')
+	meta(name='image' content='/apple-touch-icon.png')
 
 //- Keywords
-if (metadata && metadata.keywords)
-	meta(name="keywords" content=metadata.keywords)
+if metadata && metadata.keywords
+	meta(name='keywords' content=metadata.keywords)
 
 //- Misc
-meta(itemprop="name", content=settings.appName + ", the Online LaTeX Editor")
+meta(itemprop='name' content=settings.appName + ', the Online LaTeX Editor')
 
-if (metadata && metadata.robotsNoindexNofollow)
-	meta(name="robots" content="noindex, nofollow")
+if metadata && metadata.robotsNoindexNofollow
+	meta(name='robots' content='noindex, nofollow')
 
 //- Twitter
-meta(name="twitter:card", content=metadata && metadata.twitterCardType ? metadata.twitterCardType : 'summary')
-if (settings.social && settings.social.twitter && settings.social.twitter.handle)
-	meta(name="twitter:site", content="@" + settings.social.twitter.handle)
-if (metadata && metadata.twitterDescription)
-	meta(name="twitter:description", content=metadata.twitterDescription)
+meta(
+	name='twitter:card'
+	content=metadata && metadata.twitterCardType ? metadata.twitterCardType : 'summary'
+)
+if settings.social && settings.social.twitter && settings.social.twitter.handle
+	meta(name='twitter:site' content='@' + settings.social.twitter.handle)
+if metadata && metadata.twitterDescription
+	meta(name='twitter:description' content=metadata.twitterDescription)
 else
-	meta(name="twitter:description", content=translate("site_description"))
-if (metadata && metadata.twitterImage && metadata.twitterImage.fields)
+	meta(name='twitter:description' content=translate('site_description'))
+if metadata && metadata.twitterImage && metadata.twitterImage.fields
 	//- from the CMS
-	meta(name="twitter:image", content=metadata.twitterImage.fields.file.url)
-	meta(name="twitter:image:alt", content=metadata.twitterImage.fields.title)
-else if (settings.overleaf)
+	meta(name='twitter:image' content=metadata.twitterImage.fields.file.url)
+	meta(name='twitter:image:alt' content=metadata.twitterImage.fields.title)
+else if settings.overleaf
 	//- the default image for Overleaf
-	meta(name="twitter:image", content=buildImgPath('ol-brand/overleaf_og_logo.png'))
+	meta(
+		name='twitter:image'
+		content=buildImgPath('ol-brand/overleaf_og_logo.png')
+	)
 else
 	//- the default image for Overleaf Community Edition/Server Pro
-	meta(name="twitter:image", content='/apple-touch-icon.png')
+	meta(name='twitter:image' content='/apple-touch-icon.png')
 
 //- Open Graph
 //- to do - add og:url
-if (settings.social && settings.social.facebook && settings.social.facebook.appId)
-	meta(property="fb:app_id", content=settings.social.facebook.appId)
+if settings.social && settings.social.facebook && settings.social.facebook.appId
+	meta(property='fb:app_id' content=settings.social.facebook.appId)
 
-if (metadata && metadata.openGraphDescription)
-	meta(property="og:description", content=metadata.openGraphDescription)
+if metadata && metadata.openGraphDescription
+	meta(property='og:description' content=metadata.openGraphDescription)
 else
-	meta(property="og:description", content=translate("site_description"))
+	meta(property='og:description' content=translate('site_description'))
 
-if (metadata && metadata.openGraphImage && metadata.openGraphImage.fields)
+if metadata && metadata.openGraphImage && metadata.openGraphImage.fields
 	//- from the CMS
-	meta(property="og:image", content=metadata.openGraphImage.fields.file.url)
-else if (settings.overleaf)
+	meta(property='og:image' content=metadata.openGraphImage.fields.file.url)
+else if settings.overleaf
 	//- the default image for Overleaf
-	meta(property="og:image", content=buildImgPath('ol-brand/overleaf_og_logo.png'))
+	meta(
+		property='og:image'
+		content=buildImgPath('ol-brand/overleaf_og_logo.png')
+	)
 else
 	//- the default image for Overleaf Community Edition/Server Pro
-	meta(property="og:image", content='/apple-touch-icon.png')
+	meta(property='og:image' content='/apple-touch-icon.png')
 
-if (metadata && metadata.openGraphType)
-	meta(property="og:type", metadata.openGraphType)
+if metadata && metadata.openGraphType
+	meta(property='og:type' metadata.openGraphType)
 else
-	meta(property="og:type", content="website")
+	meta(property='og:type' content='website')
 
-if (metadata && metadata.openGraphVideo)
+if metadata && metadata.openGraphVideo
 	//- from the CMS
-	meta(property="og:video", content=metadata.openGraphVideo)
+	meta(property='og:video' content=metadata.openGraphVideo)
 
 //- Viewport
 if !metadata || metadata.viewport !== false
-	meta(name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes")
+	meta(
+		name='viewport'
+		content='width=device-width, initial-scale=1.0, user-scalable=yes'
+	)
 
 //- Noindex
 if settings.robotsNoindex
-	meta(name="robots" content="noindex")
+	meta(name='robots' content='noindex')
 
 //- Icons
-link(rel="icon", sizes="32x32", href="/favicon-32x32.png")
-link(rel="icon", sizes="16x16", href="/favicon-16x16.png")
-link(rel="icon", href="/favicon.svg" type="image/svg+xml")
-link(rel="apple-touch-icon", href="/apple-touch-icon.png")
-link(rel="mask-icon", href="/mask-favicon.svg", color="#046530")
+link(rel='icon' sizes='32x32' href='/favicon-32x32.png')
+link(rel='icon' sizes='16x16' href='/favicon-16x16.png')
+link(rel='icon' href='/favicon.svg' type='image/svg+xml')
+link(rel='apple-touch-icon' href='/apple-touch-icon.png')
+link(rel='mask-icon' href='/mask-favicon.svg' color='#046530')
 
 //- Canonical Tag for SEO
-if (metadata && metadata.canonicalURL)
-	link(rel="canonical" href=metadata.canonicalURL)
+if metadata && metadata.canonicalURL
+	link(rel='canonical' href=metadata.canonicalURL)
 
 //- Manifest
 //- Does not currently contain a start_url to prevent browser installation prompts
-link(rel="manifest" href="/web.sitemanifest")
+link(rel='manifest' href='/web.sitemanifest')
diff --git a/services/web/app/views/_mixins/back_to_btns.pug b/services/web/app/views/_mixins/back_to_btns.pug
index da1c9c09db..c3a1f4f76e 100644
--- a/services/web/app/views/_mixins/back_to_btns.pug
+++ b/services/web/app/views/_mixins/back_to_btns.pug
@@ -1,4 +1,6 @@
 mixin back-to-btns(settingsAnchor)
-	a.btn.btn-secondary.text-capitalize(href=`/user/settings${settingsAnchor ? '#' + settingsAnchor : '' }`) #{translate('back_to_account_settings')}
-	| 
-	a.btn.btn-secondary.text-capitalize(href='/project') #{translate('back_to_your_projects')}
\ No newline at end of file
+	.d-flex.flex-column.flex-sm-row.gap-3
+		a.btn.btn-secondary(
+			href=`/user/settings${settingsAnchor ? '#' + settingsAnchor : '' }`
+		) #{translate('back_to_account_settings')}
+		a.btn.btn-secondary(href='/project') #{translate('back_to_your_projects')}
diff --git a/services/web/app/views/_mixins/begin_now_card.pug b/services/web/app/views/_mixins/begin_now_card.pug
index 8f9919553d..5ce33d7d61 100644
--- a/services/web/app/views/_mixins/begin_now_card.pug
+++ b/services/web/app/views/_mixins/begin_now_card.pug
@@ -1,10 +1,10 @@
-mixin begin_now_card()
+mixin begin_now_card(eventTracking, locationEventSegmentation)
 	- var registerURL = '/register'
 	- var plansURL = '/user/subscription/plans'
 	- var isUserLoggedIn = !!getSessionUser()
 
 	.begin-now-card
-		div.card.card-pattern
+		.card.card-pattern
 			.card-body
 				p.dm-mono
 					span.font-size-display-xs
@@ -18,8 +18,16 @@ mixin begin_now_card()
 					if !isUserLoggedIn
 						a.btn.btn-primary.card-link(
 							href=registerURL
+							event-tracking-mb=eventTracking ? 'true' : null
+							event-tracking=eventTracking
+							event-tracking-trigger=eventTracking ? 'click' : null
+							event-segmentation=eventTracking ? {location: locationEventSegmentation, destination: registerURL} : null
 						) #{translate("sign_up_for_free")}
 					a.btn.card-link(
-						class = isUserLoggedIn ? 'btn-primary' : 'btn-secondary'
 						href=plansURL
+						class={'btn-primary': isUserLoggedIn, 'btn-secondary': !isUserLoggedIn}
+						event-tracking-mb=eventTracking ? 'true' : null
+						event-tracking=eventTracking
+						event-tracking-trigger=eventTracking ? 'click' : null
+						event-segmentation=eventTracking ? {location: locationEventSegmentation, destination: plansURL} : null
 					) #{translate("explore_all_plans")}
diff --git a/services/web/app/views/_mixins/bookmarkable_tabset.pug b/services/web/app/views/_mixins/bookmarkable_tabset.pug
index 27ac74ef66..facf67755e 100644
--- a/services/web/app/views/_mixins/bookmarkable_tabset.pug
+++ b/services/web/app/views/_mixins/bookmarkable_tabset.pug
@@ -1,10 +1,10 @@
 mixin bookmarkable-tabset-header(id, title, active)
-	li(role="presentation")
+	li(role='presentation')
 		a.nav-link(
 			href='#' + id
-			class=(active ? 'active' : '')
+			class={active}
 			aria-controls=id
-			role="tab"
-			data-toggle="tab"
+			role='tab'
+			data-toggle='tab'
 			data-ol-bookmarkable-tab
 		) #{title}
diff --git a/services/web/app/views/_mixins/bootstrap_js.pug b/services/web/app/views/_mixins/bootstrap_js.pug
index 866b0b4218..746e811bf7 100644
--- a/services/web/app/views/_mixins/bootstrap_js.pug
+++ b/services/web/app/views/_mixins/bootstrap_js.pug
@@ -1,3 +1,3 @@
 mixin bootstrap-js(bootstrapVersion)
-	each file in (entrypointScripts(bootstrapVersion === 5 ? 'bootstrap-5' : 'bootstrap-3'))
-		script(type="text/javascript", nonce=scriptNonce, src=file)
+	each file in entrypointScripts(bootstrapVersion === 5 ? 'bootstrap-5' : 'bootstrap-3')
+		script(type='text/javascript' nonce=scriptNonce src=file)
diff --git a/services/web/app/views/_mixins/eyebrow.pug b/services/web/app/views/_mixins/eyebrow.pug
index c5f01a10db..3eae0b8308 100644
--- a/services/web/app/views/_mixins/eyebrow.pug
+++ b/services/web/app/views/_mixins/eyebrow.pug
@@ -1,5 +1,5 @@
 mixin eyebrow(text)
-    span.eyebrow-text
-        span(aria-hidden="true") {
-        span #{text}
-        span(aria-hidden="true") }
\ No newline at end of file
+	span.eyebrow-text
+		span(aria-hidden='true') {
+		span #{text}
+		span(aria-hidden='true') }
diff --git a/services/web/app/views/_mixins/faq_search-marketing.pug b/services/web/app/views/_mixins/faq_search-marketing.pug
index 8ec136e08e..b45168ec70 100644
--- a/services/web/app/views/_mixins/faq_search-marketing.pug
+++ b/services/web/app/views/_mixins/faq_search-marketing.pug
@@ -1,30 +1,40 @@
+include ./material_symbol.pug
+
 mixin faq_search-marketing(headerText, headerClass)
-	if (typeof(settings.algolia) != "undefined" && typeof(settings.algolia.indexes) != "undefined" && typeof(settings.algolia.indexes.wiki) != "undefined")
+	if typeof settings.algolia != 'undefined' && typeof settings.algolia.indexes != 'undefined' && typeof settings.algolia.indexes.wiki != 'undefined'
 		if headerText
 			div(class=headerClass) #{headerText}
-		.wiki
-			form.project-search.form-horizontal(role="search" data-ol-faq-search)
+		search.wiki
+			form.project-search.form-horizontal(role='search' data-ol-faq-search)
 				.form-group.has-feedback.has-feedback-left
 					.col-sm-12
-						input.form-control(type='text', placeholder="Search help library…")
-						i.fa.fa-search.form-control-feedback-left(aria-hidden="true")
-						i.fa.fa-times.form-control-feedback(
-							style="cursor: pointer;",
-							hidden
-							data-ol-clear-search
-							aria-hidden="true"
+						label.visually-hidden(for='search-help-library') Search help library…
+						input.form-control(
+							id='search-help-library'
+							type='search'
+							placeholder='Search help library…'
 						)
-						button.sr-only(
-							type="button"
+						+material-symbol('search').form-control-feedback-left(
+							aria-hidden='true'
+						)
+						+material-symbol('clear').form-control-feedback(
+							data-ol-clear-search
+							hidden
+						)
+						button.visually-hidden(
+							type='button'
 							hidden
 							data-ol-clear-search
 							aria-label=translate('clear_search')
 						)
 
-				.row(role="region" aria-label="search results")
-					.col-md-12()
+				.row(role='region' aria-label='search results')
+					.col-md-12
 						div(data-ol-search-results-wrapper)
-							span.sr-only(aria-live="polite" data-ol-search-sr-help-message)
+							span.visually-hidden(aria-live='polite' data-ol-search-sr-help-message)
 							div(data-ol-search-results)
-						.row-spaced-small.search-result.card.card-thin(hidden data-ol-search-no-results)
+						.row-spaced-small.search-result.card.card-thin(
+							hidden
+							data-ol-search-no-results
+						)
 							p #{translate("no_search_results")}
diff --git a/services/web/app/views/_mixins/foot_scripts.pug b/services/web/app/views/_mixins/foot_scripts.pug
index c6b65e81c7..07e154663e 100644
--- a/services/web/app/views/_mixins/foot_scripts.pug
+++ b/services/web/app/views/_mixins/foot_scripts.pug
@@ -1,6 +1,21 @@
-mixin foot-scripts()
+mixin foot-scripts
 	each file in entrypointScripts(entrypoint)
-		script(type="text/javascript", nonce=scriptNonce, src=file, defer=deferScripts)
-	if (settings.devToolbar.enabled)
-		each file in entrypointScripts("devToolbar")
-			script(type="text/javascript", nonce=scriptNonce, src=file, defer=deferScripts)
+		script(type='text/javascript' nonce=scriptNonce src=file defer=deferScripts)
+
+	if settings.devToolbar.enabled
+		each file in entrypointScripts('devToolbar')
+			script(
+				type='text/javascript'
+				nonce=scriptNonce
+				src=file
+				defer=deferScripts
+			)
+
+	if typeof suppressAnalytics == 'undefined'
+		each file in entrypointScripts('tracking')
+			script(
+				type='text/javascript'
+				nonce=scriptNonce
+				src=file
+				defer=deferScripts
+			)
diff --git a/services/web/app/views/_mixins/formMessages.pug b/services/web/app/views/_mixins/formMessages.pug
index 9ea239277a..a14bb2196a 100644
--- a/services/web/app/views/_mixins/formMessages.pug
+++ b/services/web/app/views/_mixins/formMessages.pug
@@ -1,91 +1,86 @@
-mixin formMessages()
-	div(
-		data-ol-form-messages='',
-		role="alert"
-	)
+include ./material_symbol
 
-mixin formMessagesNewStyle()
-	div(
-		data-ol-form-messages-new-style='',
-		role="alert"
-	)
+mixin formMessages
+	div(data-ol-form-messages='' role='alert')
+
+mixin formMessagesNewStyle(extraClass = 'form-messages-bottom-margin')
+	- const attrs = extraClass ? {class: extraClass} : {}
+	div(data-ol-form-messages-new-style='' role='alert')&attributes(attrs)
 
 mixin customFormMessage(key, kind)
 	if kind === 'success'
-		div.alert.alert-success(
-			hidden,
-			data-ol-custom-form-message=key,
-			role="alert"
-			aria-live="polite"
+		.alert.alert-success(
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='polite'
 		)
 			block
 	else if kind === 'danger'
-		div.alert.alert-danger(
-			hidden,
-			data-ol-custom-form-message=key,
-			role="alert"
-			aria-live="assertive"
+		.alert.alert-danger(
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='assertive'
 		)
 			block
 	else
-		div.alert.alert-warning(
-			hidden,
-			data-ol-custom-form-message=key,
-			role="alert"
-			aria-live="polite"
+		.alert.alert-warning(
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='polite'
 		)
 			block
 
-mixin customFormMessageNewStyle(key, kind)
+mixin customFormMessageNewStyle(key, kind, extraClass = 'mb-3')
+	- extraClass = extraClass ? ' ' + extraClass : ''
 	if kind === 'success'
-		div.notification.notification-type-success(
-				hidden,
-				data-ol-custom-form-message=key,
-				role="alert"
-				aria-live="polite"
-			)
-			div.notification-icon
-				span.material-symbols(aria-hidden="true") check_circle
-			div.notification-content.text-left
+		div(
+			class='notification notification-type-success' + extraClass
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='polite'
+		)
+			.notification-icon
+				+material-symbol('check_circle')
+			.notification-content.text-left
 				block
 	else if kind === 'danger'
-		div.notification.notification-type-error(
-			hidden,
-			data-ol-custom-form-message=key,
-			role="alert"
-			aria-live="polite"
+		div(
+			class='notification notification-type-error' + extraClass
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='polite'
 		)
-			div.notification-icon
-				span.material-symbols(aria-hidden="true") error
-			div.notification-content.text-left
+			.notification-icon
+				+material-symbol('error')
+			.notification-content.text-left
 				block
 	else
-		div.notification.notification-type-warning(
-				hidden,
-				data-ol-custom-form-message=key,
-				role="alert"
-				aria-live="polite"
-			)
-			div.notification-icon
-				span.material-symbols(aria-hidden="true") warning
-			div.notification-content.text-left
+		div(
+			class='notification notification-type-warning' + extraClass
+			hidden
+			data-ol-custom-form-message=key
+			role='alert'
+			aria-live='polite'
+		)
+			.notification-icon
+				+material-symbol('warning')
+			.notification-content.text-left
 				block
 
 mixin customValidationMessage(key)
-	div.invalid-feedback.mt-2(
-		hidden,
-		data-ol-custom-form-message=key
-	)
-		i.fa.fa-fw.fa-warning.me-1(aria-hidden="true")
+	.invalid-feedback.mt-2(hidden data-ol-custom-form-message=key)
+		i.fa.fa-fw.fa-warning.me-1(aria-hidden='true')
 		div
 			block
 
 mixin customValidationMessageNewStyle(key)
-	div.notification.notification-type-error(
-			hidden,
-			data-ol-custom-form-message=key
-		)
-		div.notification-icon
-			span.material-symbols(aria-hidden="true") error
-		div.notification-content.text-left.small
+	.notification.notification-type-error(hidden data-ol-custom-form-message=key)
+		.notification-icon
+			+material-symbol('error')
+		.notification-content.text-left.small
 			block
diff --git a/services/web/app/views/_mixins/links.pug b/services/web/app/views/_mixins/links.pug
index 9036f86e17..aaab08aefa 100644
--- a/services/web/app/views/_mixins/links.pug
+++ b/services/web/app/views/_mixins/links.pug
@@ -1,43 +1,25 @@
-mixin linkAdvisors(linkText, linkClass, track)
-	//- To Do: verify path
-	- var gaCategory = track && track.category ? track.category : 'All'
-	- var gaAction = track && track.action ? track.action : null
-	- var gaLabel = track && track.label ? track.label : null
-	- var mb = track && track.mb ? 'true' : null
-	- var mbSegmentation = track && track.segmentation ? track.segmentation : null
-	- var trigger = track && track.trigger ? track.trigger : null
-	a(href="/advisors" 
-		class=linkClass ? linkClass : ''
-		event-tracking-ga=gaCategory
-		event-tracking=gaAction
-		event-tracking-label=gaLabel
-		event-tracking-trigger=trigger
-		event-tracking-mb=mb
-		event-segmentation=mbSegmentation
-	)
-		span #{linkText ? linkText : 'advisor programme'}
+include ./material_symbol
 
 mixin linkBenefits(linkText, linkClass)
-	a(href=(settings.siteUrl ? settings.siteUrl : '') + "/for/authors" class=linkClass ? linkClass : '')
+	a(href=(settings.siteUrl ? settings.siteUrl : '') + '/for/authors' class=linkClass)
 		| #{linkText ? linkText : 'benefits'}
-		
+
 mixin linkBlog(linkText, linkClass, slug)
 	if slug
-		a(href=(settings.siteUrl ? settings.siteUrl : '') + "/blog/" + slug class=linkClass ? linkClass : '')
+		a(
+			href=(settings.siteUrl ? settings.siteUrl : '') + '/blog/' + slug
+			class=linkClass
+		)
 			| #{linkText ? linkText : 'blog'}
 
 mixin linkContact(linkText, linkClass)
-	a(href=(settings.siteUrl ? settings.siteUrl : '') + "/contact" class=linkClass ? linkClass : '')
+	a(href=(settings.siteUrl ? settings.siteUrl : '') + '/contact' class=linkClass)
 		| #{linkText ? linkText : 'contact'}
 
 mixin linkDash(linkText, linkClass)
-	a(href="/project" class=linkClass ? linkClass : '')
+	a(href='/project' class=linkClass)
 		| #{linkText ? linkText : 'project dashboard'}
 
-mixin linkEducation(linkText, linkClass)
-	a(href=(settings.siteUrl ? settings.siteUrl : '') + "/for/edu" class=linkClass ? linkClass : '')
-		| #{linkText ? linkText : 'teaching toolkit'}
-
 mixin linkInvite(linkText, linkClass, track)
 	- var gaCategory = track && track.category ? track.category : 'All'
 	- var gaAction = track && track.action ? track.action : null
@@ -46,8 +28,9 @@ mixin linkInvite(linkText, linkClass, track)
 	- var mbSegmentation = track && track.segmentation ? track.segmentation : null
 	- var trigger = track && track.trigger ? track.trigger : null
 
-	a(href="/user/bonus"
-		class=linkClass ? linkClass : ''
+	a(
+		href='/user/bonus'
+		class=linkClass
 		event-tracking-ga=gaCategory
 		event-tracking=gaAction
 		event-tracking-label=gaLabel
@@ -58,7 +41,7 @@ mixin linkInvite(linkText, linkClass, track)
 		span #{linkText ? linkText : 'invite your friends'}
 
 mixin linkPlansAndPricing(linkText, linkClass)
-	a(href="/user/subscription/plans" class=linkClass ? linkClass : '')
+	a(href='/user/subscription/plans' class=linkClass)
 		| #{linkText ? linkText : 'plans and pricing'}
 
 mixin linkPrintNewTab(linkText, linkClass, icon, track)
@@ -69,28 +52,29 @@ mixin linkPrintNewTab(linkText, linkClass, icon, track)
 	- var mbSegmentation = track && track.segmentation ? track.segmentation : null
 	- var trigger = track && track.trigger ? track.trigger : null
 
-	a(href='?media=print'
-		class=linkClass ? linkClass : ''
+	a(
+		href='?media=print'
+		class=linkClass
 		event-tracking-ga=gaCategory
 		event-tracking=gaAction
 		event-tracking-label=gaLabel
 		event-tracking-trigger=trigger
 		event-tracking-mb=mb
 		event-segmentation=mbSegmentation
-		target="_BLANK",
-		rel="noopener noreferrer"
+		target='_BLANK'
+		rel='noopener noreferrer'
 	)
 		if icon
-			i(class="fa fa-print")
+			i(class='fa fa-print')
 			| &nbsp;
 		span #{linkText ? linkText : 'print'}
 
 mixin linkSignIn(linkText, linkClass, redirect)
-	a(href=`/login${redirect ? '?redir=' + redirect : ''}` class=linkClass ? linkClass : '')
+	a(href=`/login${redirect ? '?redir=' + redirect : ''}` class=linkClass)
 		| #{linkText ? linkText : 'sign in'}
 
 mixin linkSignUp(linkText, linkClass, redirect)
-	a(href=`/register${redirect ? '?redir=' + redirect : ''}` class=linkClass ? linkClass : '')
+	a(href=`/register${redirect ? '?redir=' + redirect : ''}` class=linkClass)
 		| #{linkText ? linkText : 'sign up'}
 
 mixin linkTweet(linkText, linkClass, tweetText, track)
@@ -101,23 +85,33 @@ mixin linkTweet(linkText, linkClass, tweetText, track)
 	- var mb = track && track.mb ? 'true' : null
 	- var mbSegmentation = track && track.segmentation ? track.segmentation : null
 	- var trigger = track && track.trigger ? track.trigger : null
-	a(class="twitter-share-button " + linkClass
+	a(
+		class='twitter-share-button ' + linkClass
 		event-tracking-ga=gaCategory
 		event-tracking=gaAction
 		event-tracking-label=gaLabel
 		event-tracking-trigger=trigger
 		event-tracking-mb=mb
 		event-segmentation=mbSegmentation
-		href="https://twitter.com/intent/tweet?text=" + tweetText
-		target="_BLANK",
-		rel="noopener noreferrer"
+		href='https://twitter.com/intent/tweet?text=' + tweetText
+		target='_BLANK'
+		rel='noopener noreferrer'
 	) #{linkText ? linkText : 'tweet'}
 
 mixin linkUniversities(linkText, linkClass)
-	a(href=(settings.siteUrl ? settings.siteUrl : '') + "/for/universities" class=linkClass ? linkClass : '')
+	a(
+		href=(settings.siteUrl ? settings.siteUrl : '') + '/for/universities'
+		class=linkClass
+	)
 		| #{linkText ? linkText : 'universities'}
 
 mixin linkWithArrow({text, href, eventTracking, eventSegmentation, eventTrackingTrigger})
-	a.link-with-arrow(href=href event-tracking=eventTracking event-segmentation=eventSegmentation, event-tracking-trigger=eventTrackingTrigger event-tracking-mb)
+	a.link-with-arrow(
+		href=href
+		event-tracking=eventTracking
+		event-segmentation=eventSegmentation
+		event-tracking-trigger=eventTrackingTrigger
+		event-tracking-mb
+	)
 		| #{text}
-		i.material-symbols(aria-hidden="true") arrow_right_alt
+		+material-symbol('arrow_right_alt')
diff --git a/services/web/app/views/_mixins/material_symbol.pug b/services/web/app/views/_mixins/material_symbol.pug
new file mode 100644
index 0000000000..e4e8925f93
--- /dev/null
+++ b/services/web/app/views/_mixins/material_symbol.pug
@@ -0,0 +1,12 @@
+mixin material-symbol(icon, extraClass = null)
+	- extraClass = extraClass ? ' ' + extraClass : ''
+	span(aria-hidden='true' translate='no' class='material-symbols' + extraClass)&attributes(attributes)
+		| #{icon}
+
+mixin material-symbol-outlined(icon, extraClass = null)
+	- extraClass = extraClass ? ' ' + extraClass : ''
+	+material-symbol(icon, 'material-symbols-outlined' + extraClass)&attributes(attributes)
+
+mixin material-symbol-rounded(icon, extraClass = null)
+	- extraClass = extraClass ? ' ' + extraClass : ''
+	+material-symbol(icon, 'material-symbols-rounded' + extraClass)&attributes(attributes)
diff --git a/services/web/app/views/_mixins/navbar.pug b/services/web/app/views/_mixins/navbar.pug
index f3482d3b54..0ea2e4e3a0 100644
--- a/services/web/app/views/_mixins/navbar.pug
+++ b/services/web/app/views/_mixins/navbar.pug
@@ -1,23 +1,23 @@
 mixin nav-item
-	li(role="none")&attributes(attributes)
+	li(role='none')&attributes(attributes)
 		block
 
 mixin nav-link
-	a(role="menuitem").nav-link&attributes(attributes)
+	a.nav-link(role='menuitem')&attributes(attributes)
 		block
 
 mixin dropdown-menu
-	ul(role="menu").dropdown-menu&attributes(attributes)
+	ul.dropdown-menu(role='menu')&attributes(attributes)
 		block
 
 mixin dropdown-menu-item
-	li(role="none")
+	li(role='none')
 		block
 
 mixin dropdown-menu-link-item
 	+dropdown-menu-item
-		a(role="menuitem").dropdown-item&attributes(attributes)
+		a.dropdown-item(role='menuitem')&attributes(attributes)
 			block
-		
+
 mixin dropdown-menu-divider
-	li(role="separator").dropdown-divider.d-none.d-lg-block
+	li.dropdown-divider.d-none.d-lg-block(role='separator')
diff --git a/services/web/app/views/_mixins/notification.pug b/services/web/app/views/_mixins/notification.pug
index 3e336affdf..482dd540c5 100644
--- a/services/web/app/views/_mixins/notification.pug
+++ b/services/web/app/views/_mixins/notification.pug
@@ -1,26 +1,21 @@
 //- to be kept in sync with frontend/js/shared/components/notification.tsx
+include ./material_symbol
 
 mixin notificationIcon(type)
 	if type === 'info'
-		span.material-symbols(aria-hidden="true") info
+		+material-symbol('info')
 	else if type === 'success'
-		span.material-symbols(aria-hidden="true") check_circle
+		+material-symbol('check_circle')
 	else if type === 'error'
-		span.material-symbols(aria-hidden="true") error
+		+material-symbol('error')
 	else if type === 'warning'
-		span.material-symbols(aria-hidden="true") warning
-
+		+material-symbol('warning')
 
 mixin notification(options)
 	- var {ariaLive, id, type, title, content, disclaimer, className} = options
 	- var classNames = `notification notification-type-${type} ${className ? className : ''} ${isActionBelowContent ? 'notification-cta-below-content' : ''}`
 
-	div(
-		aria-live=ariaLive,
-		role="alert",
-		id=id,
-		class=classNames
-	)
+	div(aria-live=ariaLive role='alert' id=id class=classNames)
 		.notification-icon
 			+notificationIcon(type)
 		.notification-content-and-cta
@@ -39,4 +34,4 @@ mixin notification(options)
 		//- if isDismissible
 		//- 	.notification-close-btn
 		//- 		button(aria-label=translate('close'))
-		//- 			span.material-symbols(aria-hidden="true") close
+		//- 			+material-symbol("close")
diff --git a/services/web/app/views/_mixins/pagination.pug b/services/web/app/views/_mixins/pagination.pug
index ef5f62bd0e..a2422e8c5d 100644
--- a/services/web/app/views/_mixins/pagination.pug
+++ b/services/web/app/views/_mixins/pagination.pug
@@ -10,77 +10,74 @@ mixin pagination(pages, page_path, max_btns)
 		- var max_btns = max_btns || 4
 		- var prev_page = Math.max(parseInt(pages.current_page, 10) - max_btns, 1)
 		- var next_page = parseInt(pages.current_page, 10) + 1
-		- var next_index = 0;
-		- var full_page_path = page_path + "/page/"
+		- var next_index = 0
+		- var full_page_path = page_path + '/page/'
 
-		nav(role="navigation" aria-label=(translate("pagination_navigation")))
+		nav(role='navigation' aria-label=translate('pagination_navigation'))
 			ul.pagination
 				if pages.current_page > 1
 					li
-						a(
-							aria-label=translate("go_to_first_page")
-							href=page_path
-						)
-							span(aria-hidden="true") &lt;&lt;
+						a(aria-label=translate('go_to_first_page') href=page_path)
+							span(aria-hidden='true') &lt;&lt;
 							|
 							| First
 					li
 						a(
-							aria-label=translate("go_to_previous_page")
+							aria-label=translate('go_to_previous_page')
 							href=full_page_path + (parseInt(pages.current_page, 10) - 1)
-							rel="prev"
+							rel='prev'
 						)
-							span(aria-hidden="true") &lt;
+							span(aria-hidden='true') &lt;
 							|
 							| Prev
 
 				if pages.current_page - max_btns > 1
-					li(aria-hidden="true")
+					li(aria-hidden='true')
 						span …
 
 				while prev_page < pages.current_page
 					li
 						a(
-							aria-label=translate("go_to_page_x", {page: prev_page})
+							aria-label=translate('go_to_page_x', {page: prev_page})
 							href=full_page_path + prev_page
 						) #{prev_page}
 						- prev_page++
 
-				li(class="active")
+				li(class='active')
 					span(
-						aria-label=translate("current_page_page", {page: pages.current_page})
-						aria-current="true"
+						aria-label=translate('current_page_page', {page: pages.current_page})
+						aria-current='true'
 					) #{pages.current_page}
 
 				if pages.current_page < pages.total_pages
 					while next_page <= pages.total_pages && next_index < max_btns
 						li
 							a(
-								aria-label=translate("go_to_page_x", {page: next_page})
+								aria-label=translate('go_to_page_x', {page: next_page})
 								href=full_page_path + next_page
 							) #{next_page}
 						- next_page++
 						- next_index++
 
-					if next_page <= pages.total_pages 
-						li.ellipses(aria-hidden="true")
+					if next_page <= pages.total_pages
+						li.ellipses(aria-hidden='true')
 							span …
 
 					li
 						a(
-							aria-label=translate("go_to_next_page")
+							aria-label=translate('go_to_next_page')
 							href=full_page_path + (parseInt(pages.current_page, 10) + 1)
-							rel="next"
+							rel='next'
 						)
 							| Next
 							|
-							span(aria-hidden="true") &gt;
+							span(aria-hidden='true') &gt;
 
 					li
 						a(
-							aria-label=translate("go_to_last_page")
+							aria-label=translate('go_to_last_page')
 							href=full_page_path + pages.total_pages
 						)
 							| Last
 							|
-							span(aria-hidden="true") &gt;&gt;
+							span(aria-hidden='true') &gt;&gt;
diff --git a/services/web/app/views/_mixins/previous_page_link.pug b/services/web/app/views/_mixins/previous_page_link.pug
index 5218c6a6aa..9809409d4e 100644
--- a/services/web/app/views/_mixins/previous_page_link.pug
+++ b/services/web/app/views/_mixins/previous_page_link.pug
@@ -1,4 +1,6 @@
+include ./material_symbol
+
 mixin previous-page-link(href, text)
 	a.previous-page-link(href=href)
-		i.material-symbols.material-symbols-rounded(aria-hidden="true") arrow_left_alt
+		+material-symbol-rounded('arrow_left_alt')
 		| #{text}
diff --git a/services/web/app/views/_mixins/quote.pug b/services/web/app/views/_mixins/quote.pug
index 1590833e62..a414c4dcec 100644
--- a/services/web/app/views/_mixins/quote.pug
+++ b/services/web/app/views/_mixins/quote.pug
@@ -1,11 +1,12 @@
-mixin quoteLargeTextCentered(quote, person, position, affiliation, link, pictureUrl, pictureAltAttr)
+mixin quoteLargeTextCentered(quote, person, position, affiliation, link, pictureUrl)
 	blockquote.quote-large-text-centered
 		.quote !{quote}
 		if pictureUrl
 			.quote-img
-				img(src=pictureUrl alt=pictureAltAttr)
+				- var pictureAlt = `Photo of ${person}`
+				img(src=pictureUrl alt=pictureAlt)
 		footer
-			div.quote-person
+			.quote-person
 				strong #{person}
 			if person && position
 				div #{position}
@@ -28,24 +29,27 @@ mixin quoteLeftGreenBorder({quote, person, position, affiliation, link})
 
 mixin collinsQuote1
 	.card.card-dark-green-bg
-		-var quote = 'Overleaf is indispensable for us. We use it in our research, thesis writing, project proposals, and manuscripts for publication. When it comes to writing, it’s our main tool.'
-		-var quotePerson = 'Christopher Collins'
-		-var quotePersonPosition = 'Associate Professor and Lab Director, Ontario Tech University'
-		-var quotePersonImg = buildImgPath("advocates/collins.jpg")
-		+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg, quotePerson)
+		- var quote = 'Overleaf is indispensable for us. We use it in our research, thesis writing, project proposals, and manuscripts for publication. When it comes to writing, it’s our main tool.'
+		- var quotePerson = 'Christopher Collins'
+		- var quotePersonPosition = 'Associate Professor and Lab Director, Ontario Tech University'
+		- var quotePersonImg = buildImgPath('advocates/collins.jpg')
+		.card-body
+			+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg)
 
 mixin collinsQuote2
 	.card.card-dark-green-bg
-		-var quote = 'We are writing collaboratively right up until the last minute. We are faced with deadlines all the time, and Overleaf gives us the ability to polish right up until the last possible second.'
-		-var quotePerson = 'Christopher Collins'
-		-var quotePersonPosition = 'Associate Professor and Lab Director, Ontario Tech University'
-		-var quotePersonImg = buildImgPath("advocates/collins.jpg")
-		+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg, quotePerson)
+		- var quote = 'We are writing collaboratively right up until the last minute. We are faced with deadlines all the time, and Overleaf gives us the ability to polish right up until the last possible second.'
+		- var quotePerson = 'Christopher Collins'
+		- var quotePersonPosition = 'Associate Professor and Lab Director, Ontario Tech University'
+		- var quotePersonImg = buildImgPath('advocates/collins.jpg')
+		.card-body
+			+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg)
 
 mixin bennettQuote1
 	.card.card-dark-green-bg
-		-var quote = 'With Overleaf, we now have a process for developing technical documentation which has virtually eliminated the time required to properly format and layout documents.'
-		-var quotePerson = 'Andrew Bennett'
-		-var quotePersonPosition = 'Software Architect, Symplectic'
-		-var quotePersonImg = buildImgPath("advocates/bennett.jpg")
-		+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg, quotePerson)
\ No newline at end of file
+		- var quote = 'With Overleaf, we now have a process for developing technical documentation which has virtually eliminated the time required to properly format and layout documents.'
+		- var quotePerson = 'Andrew Bennett'
+		- var quotePersonPosition = 'Software Architect, Symplectic'
+		- var quotePersonImg = buildImgPath('advocates/bennett.jpg')
+		.card-body
+			+quoteLargeTextCentered(quote, quotePerson, quotePersonPosition, null, null, quotePersonImg)
diff --git a/services/web/app/views/_mixins/recaptcha.pug b/services/web/app/views/_mixins/recaptcha.pug
index 24e0c501ea..ec5604c825 100644
--- a/services/web/app/views/_mixins/recaptcha.pug
+++ b/services/web/app/views/_mixins/recaptcha.pug
@@ -1,2 +1,2 @@
-mixin recaptchaConditions()
+mixin recaptchaConditions
 	.recaptcha-branding !{translate("recaptcha_conditions", {}, [{}, {name: 'a', attrs: {href: 'https://policies.google.com/privacy', rel: 'noopener noreferrer', target: '_blank'}}, {name: 'a', attrs: {href: 'https://policies.google.com/terms', rel: 'noopener noreferrer', target: '_blank'}}])}
diff --git a/services/web/app/views/_mixins/reconfirm_affiliation-marketing.pug b/services/web/app/views/_mixins/reconfirm_affiliation-marketing.pug
index c42a3b439a..f54dd5d4ba 100644
--- a/services/web/app/views/_mixins/reconfirm_affiliation-marketing.pug
+++ b/services/web/app/views/_mixins/reconfirm_affiliation-marketing.pug
@@ -1,14 +1,11 @@
 mixin reconfirmAffiliationNotification-marketing(userEmail, location)
-	form(
-		data-ol-async-form
-		action='/user/emails/send-reconfirmation'
-	)
-		input(name="_csrf" type="hidden" value=csrfToken)
-		input(name="email" type="hidden" value=userEmail.email)
-		+formMessages()
+	form(data-ol-async-form action='/user/emails/send-reconfirmation')
+		input(name='_csrf' type='hidden' value=csrfToken)
+		input(name='email' type='hidden' value=userEmail.email)
+		+formMessages
 
 		.reconfirm-notification
-			div(data-ol-not-sent style="width:100%;")
+			div(data-ol-not-sent style='width: 100%')
 				i.fa.fa-warning
 
 				- var ssoEnabled = userEmail.affiliation && userEmail.affiliation.institution && userEmail.affiliation.institution.ssoEnabled
@@ -18,16 +15,16 @@ mixin reconfirmAffiliationNotification-marketing(userEmail, location)
 						data-ol-slow-link
 						href=`${settings.saml.ukamf.initPath}?university_id=${institutionId}&reconfirm=${location}`
 					)
-						span(data-ol-inflight="idle") #{translate("confirm_affiliation")}
-						span(hidden data-ol-inflight="pending") #{translate("pending")}…
+						span(data-ol-inflight='idle') #{translate("confirm_affiliation")}
+						span(hidden data-ol-inflight='pending') #{translate("pending")}…
 
 				else
 					button.btn-reconfirm.btn.btn-sm.btn-info(
-						type="submit"
+						type='submit'
 						data-ol-disabled-inflight
 					)
-						span(data-ol-inflight="idle") #{translate("confirm_affiliation")}
-						span(hidden data-ol-inflight="pending") #{translate("pending")}…
+						span(data-ol-inflight='idle') #{translate("confirm_affiliation")}
+						span(hidden data-ol-inflight='pending') #{translate("pending")}…
 
 				| !{translate("are_you_still_at", {institutionName: userEmail.affiliation.institution.name}, ['strong'])}&nbsp;
 
@@ -39,22 +36,19 @@ mixin reconfirmAffiliationNotification-marketing(userEmail, location)
 					| !{translate("please_reconfirm_institutional_email", {}, [{name: 'a', attrs: {href: '/user/settings?remove=' + userEmail.email}}])}
 
 				| &nbsp;
-				a(href="/learn/how-to/Institutional_Email_Reconfirmation" target="_blank") #{translate("learn_more")}
+				a(href='/learn/how-to/Institutional_Email_Reconfirmation' target='_blank') #{translate("learn_more")}
 
 			div(hidden data-ol-sent)
 				| !{translate("please_check_your_inbox_to_confirm", {institutionName: userEmail.affiliation.institution.name}, ['strong'])}
 				| &nbsp;
-				button.btn-inline-link(
-					type="submit"
-					data-ol-disabled-inflight
-				)
-					span(data-ol-inflight="idle") #{translate('resend_confirmation_email')}
-					span(hidden data-ol-inflight="pending") #{translate("pending")}…
+				button.btn-inline-link(type='submit' data-ol-disabled-inflight)
+					span(data-ol-inflight='idle') #{translate('resend_confirmation_email')}
+					span(hidden data-ol-inflight='pending') #{translate("pending")}…
 
 mixin reconfirmedAffiliationNotification-marketing(userEmail)
 	.alert.alert-info
 		.reconfirm-notification
-			div(style="width:100%;")
+			div(style='width: 100%')
 				//- extra div for flex styling
 				| !{translate("your_affiliation_is_confirmed", {institutionName: userEmail.affiliation.institution.name}, ['strong'])}
 				|
diff --git a/services/web/app/views/_mixins/terms_of_service.pug b/services/web/app/views/_mixins/terms_of_service.pug
index 0fc3887b42..b0b5aaf81d 100644
--- a/services/web/app/views/_mixins/terms_of_service.pug
+++ b/services/web/app/views/_mixins/terms_of_service.pug
@@ -1,3 +1,3 @@
 mixin termsOfServiceAgreement
-	div.tos-agreement-notice
+	.tos-agreement-notice
 		| !{translate("by_registering_you_agree_to_our_terms_of_service", {}, [{name: 'a', attrs: {href: '/legal#Terms', target: '_blank'}}, {name: 'a', attrs: {href: '/legal#Privacy', target: '_blank'}}])}
diff --git a/services/web/app/views/admin/index.pug b/services/web/app/views/admin/index.pug
index dbc8cbdb79..7a284d1f41 100644
--- a/services/web/app/views/admin/index.pug
+++ b/services/web/app/views/admin/index.pug
@@ -1,11 +1,8 @@
 extends ../layout-marketing
 include ../_mixins/bookmarkable_tabset
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block content
-	.content.content-alt#main-content
+	#main-content.content.content-alt
 		.container
 			.row
 				.col-sm-12
@@ -15,7 +12,7 @@ block content
 								h1 Admin Panel
 							.ol-tabs(data-ol-bookmarkable-tabset)
 								.nav-tabs-container
-									ul.nav.nav-tabs.align-left(role="tablist")
+									ul.nav.nav-tabs.align-left(role='tablist')
 										+bookmarkable-tabset-header('system-messages', 'System Messages', true)
 										+bookmarkable-tabset-header('open-sockets', 'Open Sockets')
 										+bookmarkable-tabset-header('open-close-editor', 'Open/Close Editor')
@@ -23,29 +20,28 @@ block content
 											+bookmarkable-tabset-header('tpds', 'TPDS/Dropbox Management')
 
 								.tab-content
-									.tab-pane.active(
-										role="tabpanel"
-										id='system-messages'
-									)
+									.tab-pane.active(role='tabpanel' id='system-messages')
 										each message in systemMessages
 											ul.system-messages
 												li.system-message.row-spaced #{message.content}
 										hr
-										form(method='post', action='/admin/messages')
-											input(name="_csrf", type="hidden", value=csrfToken)
+										form(method='post' action='/admin/messages')
+											input(name='_csrf' type='hidden' value=csrfToken)
 											.form-group
-												label.form-label(for="content")
-												input.form-control(name="content", type="text", placeholder="Message…", required)
-											button.btn.btn-primary(type="submit") Post Message
+												label.form-label(for='content')
+												input.form-control(
+													name='content'
+													type='text'
+													placeholder='Message…'
+													required
+												)
+											button.btn.btn-primary(type='submit') Post Message
 										hr
-										form(method='post', action='/admin/messages/clear')
-											input(name="_csrf", type="hidden", value=csrfToken)
-											button.btn.btn-danger(type="submit") Clear all messages
+										form(method='post' action='/admin/messages/clear')
+											input(name='_csrf' type='hidden' value=csrfToken)
+											button.btn.btn-danger(type='submit') Clear all messages
 
-									.tab-pane(
-										role="tabpanel"
-										id='open-sockets'
-									)
+									.tab-pane(role='tabpanel' id='open-sockets')
 										.row-spaced
 											ul
 												each agents, url in openSockets
@@ -54,52 +50,56 @@ block content
 															each agent in agents
 																li #{agent}
 
-									.tab-pane(
-										role="tabpanel"
-										id='open-close-editor'
-									)
+									.tab-pane(role='tabpanel' id='open-close-editor')
 										if hasFeature('saas')
 											| The "Open/Close Editor" feature is not available in SAAS.
 										else
 											.row-spaced
-												form(method='post',action='/admin/closeEditor')
-													input(name="_csrf", type="hidden", value=csrfToken)
-													button.btn.btn-danger(type="submit") Close Editor
+												form(method='post' action='/admin/closeEditor')
+													input(name='_csrf' type='hidden' value=csrfToken)
+													button.btn.btn-danger(type='submit') Close Editor
 												p.small Will stop anyone opening the editor. Will NOT disconnect already connected users.
 
 											.row-spaced
-												form(method='post',action='/admin/disconnectAllUsers')
-													input(name="_csrf", type="hidden", value=csrfToken)
-													button.btn.btn-danger(type="submit") Disconnect all users
+												form(method='post' action='/admin/disconnectAllUsers')
+													input(name='_csrf' type='hidden' value=csrfToken)
+													button.btn.btn-danger(type='submit') Disconnect all users
 												p.small Will force disconnect all users with the editor open. Make sure to close the editor first to avoid them reconnecting.
 
 											.row-spaced
-												form(method='post',action='/admin/openEditor')
-													input(name="_csrf", type="hidden", value=csrfToken)
-													button.btn.btn-danger(type="submit") Reopen Editor
+												form(method='post' action='/admin/openEditor')
+													input(name='_csrf' type='hidden' value=csrfToken)
+													button.btn.btn-danger(type='submit') Reopen Editor
 												p.small Will reopen the editor after closing.
 
 									if hasFeature('saas')
-										.tab-pane(
-											role="tabpanel"
-											id='tpds'
-										)
+										.tab-pane(role='tabpanel' id='tpds')
 											h3 Flush project to TPDS
 											.row
-												form.col-xs-6(method='post',action='/admin/flushProjectToTpds')
-													input(name="_csrf", type="hidden", value=csrfToken)
+												form.col-xs-6(method='post' action='/admin/flushProjectToTpds')
+													input(name='_csrf' type='hidden' value=csrfToken)
 													.form-group
 														label.form-label(for='project_id') project_id
-														input.form-control(type='text',  name='project_id', placeholder='project_id', required)
+														input.form-control(
+															name='project_id'
+															type='text'
+															placeholder='project_id'
+															required
+														)
 													.form-group
 														button.btn-primary.btn(type='submit') Flush
 											hr
 											h3 Poll Dropbox for user
 											.row
-												form.col-xs-6(method='post',action='/admin/pollDropboxForUser')
-													input(name="_csrf", type="hidden", value=csrfToken)
+												form.col-xs-6(method='post' action='/admin/pollDropboxForUser')
+													input(name='_csrf' type='hidden' value=csrfToken)
 													.form-group
 														label.form-label(for='user_id') user_id
-														input.form-control(type='text',  name='user_id', placeholder='user_id', required)
+														input.form-control(
+															name='user_id'
+															type='text'
+															placeholder='user_id'
+															required
+														)
 													.form-group
 														button.btn-primary.btn(type='submit') Poll
diff --git a/services/web/app/views/beta_program/opt_in.pug b/services/web/app/views/beta_program/opt_in.pug
index 2bbc26cfa7..c30cb78d9a 100644
--- a/services/web/app/views/beta_program/opt_in.pug
+++ b/services/web/app/views/beta_program/opt_in.pug
@@ -1,75 +1,71 @@
 extends ../layout-marketing
 include ../_mixins/back_to_btns
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container.beta-opt-in-wrapper
 			.row
-				.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
+				.col-lg-10.offset-lg-1.col-xl-8.offset-xl-2
 					.card
-						.page-header
-							h1 
-								| #{translate("sharelatex_beta_program")}
-						.beta-opt-in
-							.container-fluid
-								.row
-									.col-md-12
-										if user.betaProgram
-											p.text-centered
-												strong #{translate("beta_program_already_participating")}.
-											p !{translate("thank_you_for_being_part_of_our_beta_program", {}, ['strong'])}.
-										else
-											p.text-centered
-												strong #{translate("beta_program_not_participating")}.
-											p !{translate("beta_program_benefits", {}, ['strong'])}
+						.card-body
+							.page-header
+								h1
+									| #{translate("sharelatex_beta_program")}
+							.beta-opt-in
+								.container-fluid
+									.row
+										.col-lg-12
+											if user.betaProgram
+												p.text-center
+													strong #{translate("beta_program_already_participating")}.
+												p !{translate("thank_you_for_being_part_of_our_beta_program", {}, ['strong'])}.
+											else
+												p.text-center
+													strong #{translate("beta_program_not_participating")}.
+												p !{translate("beta_program_benefits", {}, ['strong'])}
 
-										p #[strong How it works:]
-										ul
-											li #{translate("beta_program_badge_description")}&nbsp;#[span(aria-label=translate("beta_feature_badge") role="img").beta-badge]
-											li !{translate("you_will_be_able_to_contact_us_any_time_to_share_your_feedback", {}, ['strong'])}.
-											li !{translate("we_may_also_contact_you_from_time_to_time_by_email_with_a_survey", {}, ['strong'])}.
-											li !{translate("you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page", {}, ['strong'])}.
-										p !{translate("note_features_under_development", {}, ['strong'])}.
+											p #[strong How it works:]
+											ul
+												li
+													| #{translate("beta_program_badge_description")}&nbsp;
+													span.badge.bg-warning-light-bg.text-warning(
+														aria-label=translate('beta_feature_badge')
+													)
+														span.badge-content β
+												li !{translate("you_will_be_able_to_contact_us_any_time_to_share_your_feedback", {}, ['strong'])}.
+												li !{translate("we_may_also_contact_you_from_time_to_time_by_email_with_a_survey", {}, ['strong'])}.
+												li !{translate("you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page", {}, ['strong'])}.
+											p !{translate("note_features_under_development", {}, ['strong'])}.
 
-								.row.text-centered
-									.col-md-12
-										if user.betaProgram
-											form(
-												data-ol-regular-form
-												method="post"
-												action="/beta/opt-out"
-												novalidate
-											)
-												input(type="hidden", name="_csrf", value=csrfToken)
-												.form-group
-													a(
-														href="https://forms.gle/CFEsmvZQTAwHCd3X9"
-														target="_blank"
-														rel="noopener noreferrer"
-													).btn.btn-primary.btn-lg #{translate("give_feedback")}
-												.form-group
-													button.btn.btn-secondary-info.btn-secondary.btn-sm(
-														type="submit"
-														data-ol-disabled-inflight
-													)
-														span(data-ol-inflight="idle") #{translate("beta_program_opt_out_action")}
-														span(hidden data-ol-inflight="pending") #{translate("processing")}…
-										else
-											form(
-												data-ol-regular-form
-												method="post",
-												action="/beta/opt-in"
-											)
-												input(type="hidden", name="_csrf", value=csrfToken)
-												.form-group
-													button.btn.btn-primary(
-														type="submit"
-														data-ol-disabled-inflight
-													)
-														span(data-ol-inflight="idle") #{translate("beta_program_opt_in_action")}
-														span(hidden data-ol-inflight="pending") #{translate("joining")}…
-							.page-separator
-							+back-to-btns()
+									.row.text-center
+										.col-lg-12
+											if user.betaProgram
+												form(
+													data-ol-regular-form
+													method='post'
+													action='/beta/opt-out'
+													novalidate
+												)
+													input(name='_csrf' type='hidden' value=csrfToken)
+													.form-group
+														a.btn.btn-primary.btn-lg(
+															href='https://forms.gle/CFEsmvZQTAwHCd3X9'
+															target='_blank'
+															rel='noopener noreferrer'
+														) #{translate("give_feedback")}
+													.form-group
+														button.btn.btn-secondary-info.btn-secondary.btn-sm(
+															type='submit'
+															data-ol-disabled-inflight
+														)
+															span(data-ol-inflight='idle') #{translate("beta_program_opt_out_action")}
+															span(hidden data-ol-inflight='pending') #{translate("processing")}…
+											else
+												form(data-ol-regular-form method='post' action='/beta/opt-in')
+													input(name='_csrf' type='hidden' value=csrfToken)
+													.form-group
+														button.btn.btn-primary(type='submit' data-ol-disabled-inflight)
+															span(data-ol-inflight='idle') #{translate("beta_program_opt_in_action")}
+															span(hidden data-ol-inflight='pending') #{translate("joining")}…
+								.page-separator
+								+back-to-btns
diff --git a/services/web/app/views/general/400.pug b/services/web/app/views/general/400.pug
index 9fc97823c5..749611b629 100644
--- a/services/web/app/views/general/400.pug
+++ b/services/web/app/views/general/400.pug
@@ -1,31 +1,28 @@
 extends ../layout/layout-no-js
 
 block vars
-	- metadata = { title: 'Something went wrong' }
-	- bootstrap5PageStatus = 'disabled'
+	- metadata = {title: 'Something went wrong'}
 
 block body
 	body.full-height
-		main.content.content-alt.full-height#main-content
+		main#main-content.content.content-alt.full-height
 			.container.full-height
 				.error-container.full-height
 					.error-details
 						p.error-status Something went wrong, sorry.
 						p.error-description
 							| There was a problem with your request.
-							if(message)
+							if message
 								|
 								| The error is:
-						if(message)
+						if message
 							p.error-box
 								| #{message}
 						p.error-description
 							| Please go back and try again.
 							| If the problem persists, please contact us at
 							|
-							a(href="mailto:" + settings.adminEmail) #{settings.adminEmail}
+							a(href='mailto:' + settings.adminEmail target='_blank') #{settings.adminEmail}
 							| .
 						p.error-actions
-							a.error-btn(href="javascript:history.back()") Back
-							| &nbsp;
-							a.btn.btn-secondary(href="/") Home
+							a.btn.btn-primary(href='/') Home
diff --git a/services/web/app/views/general/404.pug b/services/web/app/views/general/404.pug
index f4b5800cf2..ce92d6d56e 100644
--- a/services/web/app/views/general/404.pug
+++ b/services/web/app/views/general/404.pug
@@ -1,14 +1,11 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.error-container
 				.error-details
 					p.error-status Not found
 					p.error-description #{translate("cant_find_page")}
 					p.error-actions
-						a.error-btn(href="/") Home
+						a.error-btn(href='/') Home
diff --git a/services/web/app/views/general/500.pug b/services/web/app/views/general/500.pug
index 90cb1e3606..4ee242f242 100644
--- a/services/web/app/views/general/500.pug
+++ b/services/web/app/views/general/500.pug
@@ -1,24 +1,29 @@
 extends ../layout/layout-no-js
 
 block vars
-	- metadata = { title: 'Something went wrong' }
-	- bootstrap5PageStatus = 'disabled'
+	- metadata = {title: 'Something went wrong'}
 
 block body
 	body.full-height
-		main.content.content-alt.full-height#main-content
+		main#main-content.content.content-alt.full-height
 			.container.full-height
 				.error-container.full-height
 					.error-details
 						p.error-status Something went wrong, sorry.
-						p.error-description Our staff are probably looking into this, but if it continues, please check our status page at
+						if settings.statusPageUrl
+							p.error-description Our staff are probably looking into this, but if it continues, please check our status page at
+								|
+								|
+								a(href=settings.statusPageUrl target='_blank') #{new URL(settings.statusPageUrl).hostname}
+								|
+								| or contact us at
+								|
+								a(href='mailto:' + settings.adminEmail target='_blank') #{settings.adminEmail}
+								| .
+						else
+							| If the problem persists, please contact us at
 							|
-							|
-							a(href="http://" + settings.statusPageUrl) #{settings.statusPageUrl}
-							|
-							| or contact us at
-							|
-							a(href="mailto:" + settings.adminEmail) #{settings.adminEmail}
+							a(href='mailto:' + settings.adminEmail target='_blank') #{settings.adminEmail}
 							| .
 						p.error-actions
-							a.error-btn(href="/") Home
+							a.error-btn(href='/') Home
diff --git a/services/web/app/views/general/closed.pug b/services/web/app/views/general/closed.pug
index f4012997bd..5725e35ea6 100644
--- a/services/web/app/views/general/closed.pug
+++ b/services/web/app/views/general/closed.pug
@@ -1,19 +1,16 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content#main-content
+	main#main-content.content
 		.container
 			.row
-				.col-md-8.col-md-offset-2.text-center
+				.col-lg-8.offset-lg-2.text-center
 					.page-header
 						h1 Maintenance
 					p
 						if settings.statusPageUrl
 							| #{settings.appName} is currently down for maintenance.
-							| Please check our #[a(href='https://' + settings.statusPageUrl) status page]
+							| Please check our #[a(href=settings.statusPageUrl target='_blank') status page]
 							| for updates.
 						else
 							| #{settings.appName} is currently down for maintenance.
diff --git a/services/web/app/views/general/post-gateway.pug b/services/web/app/views/general/post-gateway.pug
index dcc844171a..86f379ac1b 100644
--- a/services/web/app/views/general/post-gateway.pug
+++ b/services/web/app/views/general/post-gateway.pug
@@ -4,23 +4,19 @@ block vars
 	- var suppressNavbar = true
 	- var suppressFooter = true
 	- var suppressSkipToContent = true
-	- var suppressCookieBanner = true
-	- bootstrap5PageStatus = 'disabled'
+	- var suppressPugCookieBanner = true
 
 block content
 	.content.content-alt
 		.container
 			.row
-				.col-md-6.col-md-offset-3
+				.col-lg-6.offset-lg-3
 					.card
-						p.text-center #{translate('processing_your_request')}
+						.card-body
+							p.text-center #{translate('processing_your_request')}
 
-	form(
-		data-ol-regular-form
-		data-ol-auto-submit
-		method="POST"
-	)
-		input(name="_csrf" type="hidden" value=csrfToken)
-		input(hidden name="viaGateway" type="submit" value="true")
-		for name in Object.keys(form_data)
-			input(name=name type="hidden" value=form_data[name])
+	form(data-ol-regular-form data-ol-auto-submit method='POST')
+		input(name='_csrf' type='hidden' value=csrfToken)
+		input(name='viaGateway' hidden type='submit' value='true')
+		each name in Object.keys(form_data)
+			input(name=name type='hidden' value=form_data[name])
diff --git a/services/web/app/views/general/unsupported-browser.pug b/services/web/app/views/general/unsupported-browser.pug
index f8806cf8d2..fbe6c218eb 100644
--- a/services/web/app/views/general/unsupported-browser.pug
+++ b/services/web/app/views/general/unsupported-browser.pug
@@ -1,12 +1,11 @@
 extends ../layout/layout-no-js
 
 block vars
-	- metadata = { title: 'Unsupported browser' }
-	- bootstrap5PageStatus = 'disabled'
+	- metadata = {title: 'Unsupported browser'}
 
 block body
 	body.full-height
-		main.content.content-alt.full-height#main-content
+		main#main-content.content.content-alt.full-height
 			.container.full-height
 				.error-container.full-height
 					.error-details
@@ -16,7 +15,7 @@ block body
 							br
 							| If you think you're seeing this message in error,
 							|
-							a(href="mailto:" + settings.adminEmail) please let us know
+							a(href='mailto:' + settings.adminEmail target='_blank') please let us know
 							| .
 
 						if fromURL
@@ -34,7 +33,7 @@ block body
 						p
 							| Support for beta or developer-preview browser versions cannot be guaranteed. Please
 							|
-							a(href="mailto:" + settings.adminEmail) get in touch
+							a(href='mailto:' + settings.adminEmail target='_blank') get in touch
 							|
 							| if you encounter any issues while using the service with beta or developer-preview releases of supported browsers.
 						p
@@ -42,5 +41,5 @@ block body
 						p
 							| If you cannot upgrade to one of the supported browsers,
 							|
-							a(href="mailto:" + settings.adminEmail) please let us know
+							a(href='mailto:' + settings.adminEmail target='_blank') please let us know
 							| .
diff --git a/services/web/app/views/layout-base.pug b/services/web/app/views/layout-base.pug
index be874f2076..99fd4244f5 100644
--- a/services/web/app/views/layout-base.pug
+++ b/services/web/app/views/layout-base.pug
@@ -2,11 +2,11 @@ include ./_mixins/foot_scripts
 
 doctype html
 html(
-	lang=(currentLngCode || 'en')
-	class=(fixedSizeDocument ? 'fixed-size-document' : undefined)
+	lang=currentLngCode || 'en'
+	class=fixedSizeDocument ? 'fixed-size-document' : undefined
 )
 	- metadata = metadata || {}
-	- let bootstrap5PageStatus = 'disabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+	- let bootstrap5PageStatus = 'enabled' // One of 'disabled' and 'enabled'
 	- let bootstrap5PageSplitTest = '' // Limits Bootstrap 5 usage on this page to users with an assignment of "enabled" for the specified split test. If left empty and bootstrap5PageStatus is "enabled", the page always uses Bootstrap 5.
 	- let isWebsiteRedesign = false
 	- let isApplicationPage = false
@@ -22,89 +22,128 @@ html(
 		include ./_metadata.pug
 
 		- const bootstrapVersion = bootstrap5PageStatus !== 'disabled' && (bootstrap5Override || bootstrap5PageSplitTest === '' || splitTestVariants[bootstrap5PageSplitTest] === 'enabled') ? 5 : 3
-	
+
 		//- Stylesheet
-		link(rel='stylesheet', href=buildCssPath(getCssThemeModifier(userSettings, brandVariation, enableIeeeBranding), bootstrapVersion), id="main-stylesheet")
+		link(
+			rel='stylesheet'
+			href=buildCssPath(getCssThemeModifier(userSettings, brandVariation, enableIeeeBranding), bootstrapVersion)
+			id='main-stylesheet'
+		)
 		block css
 			each file in entrypointStyles(entrypoint)
-				link(rel='stylesheet', href=file)
+				link(rel='stylesheet' href=file)
 
 		block _headLinks
 
-		if (typeof suppressRelAlternateLinks == "undefined")
+		if typeof suppressRelAlternateLinks == 'undefined'
 			if settings.i18n.subdomainLang
 				each subdomainDetails in settings.i18n.subdomainLang
 					if !subdomainDetails.hide
-						link(rel="alternate", href=subdomainDetails.url + currentUrl, hreflang=subdomainDetails.lngCode)
+						link(
+							rel='alternate'
+							href=subdomainDetails.url + currentUrl
+							hreflang=subdomainDetails.lngCode
+						)
 
-		if (entrypoint !== 'marketing')
-			link(rel="preload", href=buildJsPath(currentLngCode + "-json.js"), as="script", nonce=scriptNonce)
+		if entrypoint !== 'marketing'
+			link(
+				rel='preload'
+				href=buildJsPath(currentLngCode + '-json.js')
+				as='script'
+				nonce=scriptNonce
+			)
 
 		//- Scripts
-		if (typeof suppressGoogleAnalytics == "undefined")
+		if typeof suppressAnalytics == 'undefined'
 			include _google_analytics
 
 		block meta
-			meta(name="ol-csrfToken" content=csrfToken)
+			meta(name='ol-csrfToken' content=csrfToken)
 			//- Configure dynamically loaded assets (via webpack) to be downloaded from CDN
 			//- See: https://webpack.js.org/guides/public-path/#on-the-fly
-			meta(name="ol-baseAssetPath" content=buildBaseAssetPath())
-			meta(name="ol-mathJaxPath" content=mathJaxPath)
-			meta(name="ol-dictionariesRoot" content=dictionariesRoot)
+			meta(name='ol-baseAssetPath' content=buildBaseAssetPath())
+			meta(name='ol-mathJaxPath' content=mathJaxPath)
+			meta(name='ol-dictionariesRoot' content=dictionariesRoot)
 
-			meta(name="ol-usersEmail" content=getUserEmail())
-			meta(name="ol-ab" data-type="json" content={})
-			meta(name="ol-user_id" content=getLoggedInUserId())
+			meta(name='ol-usersEmail' content=getUserEmail())
+			meta(name='ol-ab' data-type='json' content={})
+			meta(name='ol-user_id' content=getLoggedInUserId())
 			//- Internationalisation settings
-			meta(name="ol-i18n" data-type="json" content={
-				currentLangCode: currentLngCode
-			})
+			meta(
+				name='ol-i18n'
+				data-type='json'
+				content={
+					currentLangCode: currentLngCode,
+				}
+			)
 			//- Expose some settings globally to the frontend
-			meta(name="ol-ExposedSettings" data-type="json" content=ExposedSettings)
-			meta(name="ol-splitTestVariants" data-type="json" content=splitTestVariants || {})
-			meta(name="ol-splitTestInfo" data-type="json" content=splitTestInfo || {})
+			meta(name='ol-ExposedSettings' data-type='json' content=ExposedSettings)
+			meta(
+				name='ol-splitTestVariants'
+				data-type='json'
+				content=splitTestVariants || {}
+			)
+			meta(name='ol-splitTestInfo' data-type='json' content=splitTestInfo || {})
 
-			if (typeof settings.algolia != "undefined")
-				meta(name="ol-algolia" data-type="json" content={
-					appId: settings.algolia.app_id,
-					apiKey: settings.algolia.read_only_api_key,
-					indexes: settings.algolia.indexes
-				})
+			if typeof settings.algolia != 'undefined'
+				meta(
+					name='ol-algolia'
+					data-type='json'
+					content={
+						appId: settings.algolia.app_id,
+						apiKey: settings.algolia.read_only_api_key,
+						indexes: settings.algolia.indexes,
+					}
+				)
 
-			meta(name="ol-isManagedAccount" data-type="boolean" content=isManagedAccount)
+			meta(
+				name='ol-isManagedAccount'
+				data-type='boolean'
+				content=isManagedAccount
+			)
 			each restriction in userRestrictions || []
-				meta(name='ol-cannot-' + restriction data-type="boolean" content=true)
-			meta(name="ol-bootstrapVersion" data-type="json" content=bootstrapVersion)
+				meta(name='ol-cannot-' + restriction data-type='boolean' content)
+			meta(name='ol-bootstrapVersion' data-type='json' content=bootstrapVersion)
 
 		block head-scripts
 
-	body(class={
-		'thin-footer': showThinFooter,
-		'website-redesign': isWebsiteRedesign === true || websiteRedesignOverride,
-		'application-page': isApplicationPage
-	}, data-theme="default")
-		if(settings.recaptcha && settings.recaptcha.siteKeyV3)
-			script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=" + settings.recaptcha.siteKeyV3, defer=deferScripts)
+	body(
+		class={
+			'thin-footer': showThinFooter,
+			'website-redesign': isWebsiteRedesign === true || websiteRedesignOverride,
+			'application-page': isApplicationPage,
+		}
+		data-theme='default'
+	)
+		if settings.recaptcha && settings.recaptcha.siteKeyV3
+			script(
+				type='text/javascript'
+				nonce=scriptNonce
+				src='https://www.recaptcha.net/recaptcha/api.js?render=' + settings.recaptcha.siteKeyV3
+				defer=deferScripts
+			)
 
-		if (typeof suppressSkipToContent == "undefined")
-			a(class="skip-to-content" href="#main-content") #{translate('skip_to_content')}
+		if typeof suppressSkipToContent == 'undefined'
+			a(class='skip-to-content' href='#main-content') #{translate('skip_to_content')}
 
 		block body
 
-		if (settings.devToolbar.enabled)
-			div#dev-toolbar
+		if settings.devToolbar.enabled
+			#dev-toolbar
 
 	block foot-scripts
 		+foot-scripts
 
-	script(type="text/javascript", nonce=scriptNonce).
-		window.addEventListener('DOMContentLoaded', function() {
+	include _customer_io
+
+	script(type='text/javascript' nonce=scriptNonce).
+		window.addEventListener('DOMContentLoaded', function () {
 			//- Look for bundle
 			var cdnBlocked = typeof Frontend === 'undefined'
 			//- Prevent loops
-			var noCdnAlreadyInUrl = window.location.href.indexOf("nocdn=true") != -1
-			if (cdnBlocked && !noCdnAlreadyInUrl && navigator.userAgent.indexOf("Googlebot") == -1) {
+			var noCdnAlreadyInUrl = window.location.href.indexOf('nocdn=true') != -1
+			if (cdnBlocked && !noCdnAlreadyInUrl && navigator.userAgent.indexOf('Googlebot') == -1) {
 				//- Set query param, server will not set CDN url
-				window.location.search += "&nocdn=true";
+				window.location.search += '&nocdn=true'
 			}
 		})
diff --git a/services/web/app/views/layout-marketing.pug b/services/web/app/views/layout-marketing.pug
index 20126beda3..26e4eb539d 100644
--- a/services/web/app/views/layout-marketing.pug
+++ b/services/web/app/views/layout-marketing.pug
@@ -7,7 +7,7 @@ block entrypointVar
 	- entrypoint = 'marketing'
 
 block body
-	if (typeof suppressNavbar === "undefined")
+	if typeof suppressNavbar === 'undefined'
 		if bootstrapVersion === 5
 			include layout/navbar-marketing-bootstrap-5
 		else
@@ -15,7 +15,7 @@ block body
 
 	block content
 
-	if (typeof suppressFooter === "undefined")
+	if typeof suppressFooter === 'undefined'
 		if showThinFooter
 			if bootstrapVersion === 5
 				include layout/thin-footer-bootstrap-5
@@ -24,13 +24,13 @@ block body
 		else
 			include layout/fat-footer
 
-	if (typeof(suppressCookieBanner) == 'undefined')
+	if typeof suppressPugCookieBanner == 'undefined'
 		include _cookie_banner
 
 	if bootstrapVersion === 5
-		!= moduleIncludes("contactModal-marketing-bootstrap-5", locals)
+		!= moduleIncludes('contactModal-marketing-bootstrap-5', locals)
 	else
-		!= moduleIncludes("contactModal-marketing", locals)
+		!= moduleIncludes('contactModal-marketing', locals)
 
 block prepend foot-scripts
 	+bootstrap-js(bootstrapVersion)
diff --git a/services/web/app/views/layout-react.pug b/services/web/app/views/layout-react.pug
index 4fba24c226..e9c4c932c4 100644
--- a/services/web/app/views/layout-react.pug
+++ b/services/web/app/views/layout-react.pug
@@ -7,75 +7,67 @@ include ./_mixins/bootstrap_js
 
 block entrypointVar
 	- entrypoint = 'marketing'
-		
+
 block isApplicationPageVar
 	- isApplicationPage = true
-		
-block append meta
-	if bootstrapVersion === 5
-		- const canDisplayAdminMenu = hasAdminAccess()
-		- const canDisplayAdminRedirect = canRedirectToAdminDomain()
-		- const sessionUser = getSessionUser()
-		- const staffAccess = sessionUser?.staffAccess
-		- const canDisplaySplitTestMenu = hasFeature('saas') && (canDisplayAdminMenu || staffAccess?.splitTestMetrics || staffAccess?.splitTestManagement)
-		- const canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
-		- const enableUpgradeButton = projectDashboardReact && usersBestSubscription && (usersBestSubscription.type === 'free' || usersBestSubscription.type === 'standalone-ai-add-on')
-		- const showSignUpLink = hasFeature('registration-page')
 
-		meta(name="ol-navbar" data-type="json" content={
+block append meta
+	- const canDisplayAdminMenu = hasAdminAccess()
+	- const canDisplayAdminRedirect = canRedirectToAdminDomain()
+	- const sessionUser = getSessionUser()
+	- const staffAccess = sessionUser?.staffAccess
+	- const canDisplaySplitTestMenu = hasFeature('saas') && (canDisplayAdminMenu || staffAccess?.splitTestMetrics || staffAccess?.splitTestManagement)
+	- const canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
+	- const canDisplayScriptLogMenu = hasFeature('saas') && canDisplayAdminMenu
+	- const enableUpgradeButton = projectDashboardReact && usersBestSubscription && (usersBestSubscription.type === 'free' || usersBestSubscription.type === 'standalone-ai-add-on')
+	- const showSignUpLink = hasFeature('registration-page')
+
+	meta(
+		name='ol-navbar'
+		data-type='json'
+		content={
 			customLogo: settings.nav.custom_logo,
 			title: nav.title,
 			canDisplayAdminMenu,
 			canDisplayAdminRedirect,
 			canDisplaySplitTestMenu,
 			canDisplaySurveyMenu,
+			canDisplayScriptLogMenu,
 			enableUpgradeButton,
 			suppressNavbarRight: !!suppressNavbarRight,
 			suppressNavContentLinks: !!suppressNavContentLinks,
 			showSubscriptionLink: nav.showSubscriptionLink,
 			showSignUpLink: showSignUpLink,
 			currentUrl: currentUrl,
-			sessionUser: sessionUser ? { email: sessionUser.email} : undefined,
+			sessionUser: sessionUser ? {email: sessionUser.email} : undefined,
 			adminUrl: settings.adminUrl,
-			items: cloneAndTranslateText(nav.header_extras)
-		})
-		meta(name="ol-footer" data-type="json" content={
+			items: cloneAndTranslateText(nav.header_extras),
+		}
+	)
+	meta(
+		name='ol-footer'
+		data-type='json'
+		content={
 			showThinFooter: showThinFooter,
 			showPoweredBy: !hasFeature('saas') && !settings.nav.hide_powered_by,
 			subdomainLang: settings.i18n.subdomainLang,
 			translatedLanguages: settings.translatedLanguages,
 			leftItems: cloneAndTranslateText(settings.nav.left_footer),
-			rightItems: settings.nav.right_footer
-		})
+			rightItems: settings.nav.right_footer,
+		}
+	)
 
 block body
-	if (typeof suppressNavbar === "undefined")
-		if bootstrapVersion === 5
-			include layout/navbar-marketing-react-bootstrap-5
-		else
-			include layout/navbar-marketing
+	if typeof suppressNavbar === 'undefined'
+		include layout/navbar-marketing-react-bootstrap-5
 
 	block content
 
-	if (typeof suppressFooter === "undefined")
+	if typeof suppressFooter === 'undefined'
 		if showThinFooter
-			if bootstrapVersion === 5
-				include layout/thin-footer-bootstrap-5
-			else
-				include layout/thin-footer
+			include layout/thin-footer-bootstrap-5
 		else
-			if bootstrapVersion === 5
-				include layout/fat-footer-react-bootstrap-5
-			else
-				include layout/fat-footer
+			include layout/fat-footer-react-bootstrap-5
 
-	if (typeof suppressCookieBanner === "undefined")
+	if typeof suppressPugCookieBanner === 'undefined'
 		include _cookie_banner
-
-	if bootstrapVersion === 3
-		!= moduleIncludes("contactModal-marketing", locals)
-		
-block prepend foot-scripts
-	//- Only include Bootstrap JS if using Bootstrap 3 
-	if bootstrapVersion === 3
-		+bootstrap-js(3)
diff --git a/services/web/app/views/layout-website-redesign-bootstrap-5.pug b/services/web/app/views/layout-website-redesign-bootstrap-5.pug
deleted file mode 100644
index 092f5b765d..0000000000
--- a/services/web/app/views/layout-website-redesign-bootstrap-5.pug
+++ /dev/null
@@ -1,29 +0,0 @@
-extends ./layout-base
-
-include ./_mixins/formMessages
-include ./_mixins/bootstrap_js
-
-block entrypointVar
-	- entrypoint = 'marketing'
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-	- isWebsiteRedesign = true
-
-block body
-	if (typeof(suppressNavbar) == "undefined")
-		include layout/navbar-marketing-bootstrap-5
-
-	block content
-
-	if (typeof(suppressFooter) == "undefined")
-		if showThinFooter
-			include layout/thin-footer-bootstrap-5
-		else
-			include layout/fat-footer-website-redesign
-
-	if (typeof(suppressCookieBanner) == 'undefined')
-		include _cookie_banner
-
-	!= moduleIncludes("contactModal-marketing-bootstrap-5", locals)
-
-block prepend foot-scripts
-	+bootstrap-js(5)
diff --git a/services/web/app/views/layout-website-redesign.pug b/services/web/app/views/layout-website-redesign.pug
index 37ba2f9f32..aa7fea9f07 100644
--- a/services/web/app/views/layout-website-redesign.pug
+++ b/services/web/app/views/layout-website-redesign.pug
@@ -6,22 +6,35 @@ include ./_mixins/bootstrap_js
 block entrypointVar
 	- entrypoint = 'marketing'
 
+block append meta
+	meta(name='ol-shouldLoadHotjar' data-type='boolean' content=shouldLoadHotjar)
+
 block body
-	if (typeof(suppressNavbar) == "undefined")
-		include layout/navbar-website-redesign
+	if typeof suppressNavbar == 'undefined'
+		if bootstrapVersion === 5
+			include layout/navbar-marketing-bootstrap-5
+		else
+			include layout/navbar-website-redesign
 
 	block content
 
-	if (typeof(suppressFooter) == "undefined")
+	if typeof suppressFooter == 'undefined'
 		if showThinFooter
-			include layout/thin-footer
+			if bootstrapVersion === 5
+				include layout/thin-footer-bootstrap-5
+			else
+				include layout/thin-footer
 		else
 			include layout/fat-footer-website-redesign
 
-	if (typeof(suppressCookieBanner) == 'undefined')
+	if typeof suppressPugCookieBanner == 'undefined'
 		include _cookie_banner
 
-	!= moduleIncludes("contactModal-marketing", locals)
+	block contactModal
+		if bootstrapVersion === 5
+			!= moduleIncludes('contactModal-marketing-bootstrap-5', locals)
+		else
+			!= moduleIncludes('contactModal-marketing', locals)
 
 block prepend foot-scripts
 	+bootstrap-js(bootstrapVersion)
diff --git a/services/web/app/views/layout/fat-footer-base.pug b/services/web/app/views/layout/fat-footer-base.pug
index 2e3dd2074f..e8380939f6 100644
--- a/services/web/app/views/layout/fat-footer-base.pug
+++ b/services/web/app/views/layout/fat-footer-base.pug
@@ -1,9 +1,9 @@
 .fat-footer-base
 	.fat-footer-base-section.fat-footer-base-meta
-		.fat-footer-base-item 
+		.fat-footer-base-item
 			.fat-footer-base-copyright © #{new Date().getFullYear()} Overleaf
-			a(href="/legal") #{translate('privacy_and_terms')}
-			a(href="https://www.digital-science.com/security-certifications/") #{translate('compliance')}
+			a(href='/legal') #{translate('privacy_and_terms')}
+			a(href='https://www.digital-science.com/security-certifications/') #{translate('compliance')}
 		ul.fat-footer-base-item.list-unstyled.fat-footer-base-language
 			if bootstrapVersion === 5
 				include language-picker-bootstrap-5
@@ -11,22 +11,53 @@
 				include language-picker
 	.fat-footer-base-section.fat-footer-base-social
 		.fat-footer-base-item
-			a.fat-footer-social.x-logo(href="https://x.com/overleaf")
-				svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 1227" height="25")
-					path(d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z")
+			a.fat-footer-social.x-logo(href='https://x.com/overleaf')
+				svg(
+					xmlns='http://www.w3.org/2000/svg'
+					viewBox='0 0 1200 1227'
+					height='25'
+				)
+					path(
+						d='M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z'
+					)
 				span.visually-hidden #{translate("app_on_x", {social: "X"})}
-			a.fat-footer-social.facebook-logo(href="https://www.facebook.com/overleaf.editor")
-				svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 666.66668 666.66717" height="25")
+			a.fat-footer-social.facebook-logo(
+				href='https://www.facebook.com/overleaf.editor'
+			)
+				svg(
+					xmlns='http://www.w3.org/2000/svg'
+					viewBox='0 0 666.66668 666.66717'
+					height='25'
+				)
 					defs
-						clipPath(id="a" clipPathUnits="userSpaceOnUse")
-							path(d="M0 700h700V0H0Z")
-					g(clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 -133.333 800)")
-						path.background(d="M0 0c0 138.071-111.929 250-250 250S-500 138.071-500 0c0-117.245 80.715-215.622 189.606-242.638v166.242h-51.552V0h51.552v32.919c0 85.092 38.508 124.532 122.048 124.532 15.838 0 43.167-3.105 54.347-6.211V81.986c-5.901.621-16.149.932-28.882.932-40.993 0-56.832-15.528-56.832-55.9V0h81.659l-14.028-76.396h-67.631v-171.773C-95.927-233.218 0-127.818 0 0" fill="#0866ff" transform="translate(600 350)")
-						path.text(d="m0 0 14.029 76.396H-67.63v27.019c0 40.372 15.838 55.899 56.831 55.899 12.733 0 22.981-.31 28.882-.931v69.253c-11.18 3.106-38.509 6.212-54.347 6.212-83.539 0-122.048-39.441-122.048-124.533V76.396h-51.552V0h51.552v-166.242a250.559 250.559 0 0 1 60.394-7.362c10.254 0 20.358.632 30.288 1.831V0Z" fill="#fff" transform="translate(447.918 273.604)")
+						clipPath(id='a' clipPathUnits='userSpaceOnUse')
+							path(d='M0 700h700V0H0Z')
+					g(
+						clip-path='url(#a)'
+						transform='matrix(1.33333 0 0 -1.33333 -133.333 800)'
+					)
+						path.background(
+							d='M0 0c0 138.071-111.929 250-250 250S-500 138.071-500 0c0-117.245 80.715-215.622 189.606-242.638v166.242h-51.552V0h51.552v32.919c0 85.092 38.508 124.532 122.048 124.532 15.838 0 43.167-3.105 54.347-6.211V81.986c-5.901.621-16.149.932-28.882.932-40.993 0-56.832-15.528-56.832-55.9V0h81.659l-14.028-76.396h-67.631v-171.773C-95.927-233.218 0-127.818 0 0'
+							fill='#0866ff'
+							transform='translate(600 350)'
+						)
+						path.text(
+							d='m0 0 14.029 76.396H-67.63v27.019c0 40.372 15.838 55.899 56.831 55.899 12.733 0 22.981-.31 28.882-.931v69.253c-11.18 3.106-38.509 6.212-54.347 6.212-83.539 0-122.048-39.441-122.048-124.533V76.396h-51.552V0h51.552v-166.242a250.559 250.559 0 0 1 60.394-7.362c10.254 0 20.358.632 30.288 1.831V0Z'
+							fill='#fff'
+							transform='translate(447.918 273.604)'
+						)
 				span.visually-hidden #{translate("app_on_x", {social: "Facebook"})}
-			a.fat-footer-social.linkedin-logo(href="https://www.linkedin.com/company/writelatex-limited")
-				svg(xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72 72" height="25")
-					g(fill="none" fill-rule="evenodd")
-						path.background(fill="#0B66C3" d="M8 72h56a8 8 0 0 0 8-8V8a8 8 0 0 0-8-8H8a8 8 0 0 0-8 8v56a8 8 0 0 0 8 8")
-						path.text(fill="#FFF" d="M62 62H51.316V43.802c0-4.99-1.896-7.777-5.845-7.777-4.296 0-6.54 2.901-6.54 7.777V62H28.632V27.333H38.93v4.67s3.096-5.729 10.453-5.729c7.353 0 12.617 4.49 12.617 13.777zM16.35 22.794c-3.508 0-6.35-2.864-6.35-6.397C10 12.864 12.842 10 16.35 10c3.507 0 6.347 2.864 6.347 6.397 0 3.533-2.84 6.397-6.348 6.397ZM11.032 62h10.736V27.333H11.033V62")
+			a.fat-footer-social.linkedin-logo(
+				href='https://www.linkedin.com/company/writelatex-limited'
+			)
+				svg(xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 72' height='25')
+					g(fill='none' fill-rule='evenodd')
+						path.background(
+							fill='#0B66C3'
+							d='M8 72h56a8 8 0 0 0 8-8V8a8 8 0 0 0-8-8H8a8 8 0 0 0-8 8v56a8 8 0 0 0 8 8'
+						)
+						path.text(
+							fill='#FFF'
+							d='M62 62H51.316V43.802c0-4.99-1.896-7.777-5.845-7.777-4.296 0-6.54 2.901-6.54 7.777V62H28.632V27.333H38.93v4.67s3.096-5.729 10.453-5.729c7.353 0 12.617 4.49 12.617 13.777zM16.35 22.794c-3.508 0-6.35-2.864-6.35-6.397C10 12.864 12.842 10 16.35 10c3.507 0 6.347 2.864 6.347 6.397 0 3.533-2.84 6.397-6.348 6.397ZM11.032 62h10.736V27.333H11.033V62'
+						)
 				span.visually-hidden #{translate("app_on_x", {social: "LinkedIn"})}
diff --git a/services/web/app/views/layout/fat-footer-website-redesign.pug b/services/web/app/views/layout/fat-footer-website-redesign.pug
index bde9113c75..5a613df44a 100644
--- a/services/web/app/views/layout/fat-footer-website-redesign.pug
+++ b/services/web/app/views/layout/fat-footer-website-redesign.pug
@@ -1,84 +1,89 @@
 footer.fat-footer.hidden-print.website-redesign-fat-footer
-	.fat-footer-container(role="navigation" aria-label=translate('footer_navigation'))
-		.fat-footer-sections(class=hideFatFooter ? 'hidden' : undefined)
-			.footer-section#footer-brand
-				a(href='/', aria-label=settings.appName).footer-brand
-					
+	.fat-footer-container(
+		role='navigation'
+		aria-label=translate('footer_navigation')
+	)
+		.fat-footer-sections(class={hidden: hideFatFooter})
+			#footer-brand.footer-section
+				a.footer-brand(href='/' aria-label=settings.appName)
+
 			.footer-section
 				h2.footer-section-heading #{translate('About')}
-					
+
 				ul.list-unstyled
 					li
-						a(href="/about") #{translate('footer_about_us')}
+						a(href='/about') #{translate('footer_about_us')}
 					li
-						a(href="/about/values") #{translate('our_values')}
+						a(href='https://digitalscience.pinpointhq.com/') #{translate('careers')}
 					li
-						a(href="/about/careers") #{translate('careers')}
+						a(href='/blog') #{translate('blog')}
+
+			.footer-section
+				h2.footer-section-heading #{translate('solutions')}
+
+				ul.list-unstyled
 					li
-						a(href="/for/press") !{translate('press_and_awards')}
+						a(href='/for/enterprises') #{translate('for_business')}
 					li
-						a(href="/blog") #{translate('blog')}
-						
+						a(href='/for/universities') #{translate('for_universities')}
+					li
+						a(href='/for/government') #{translate('for_government')}
+					li
+						a(href='/for/publishers') #{translate('for_publishers')}
+					li
+						a(href='/about/customer-stories') #{translate('customer_stories')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('learn')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/learn/latex/Learn_LaTeX_in_30_minutes") #{translate('latex_in_thirty_minutes')}
+						a(href='/learn/latex/Learn_LaTeX_in_30_minutes') #{translate('latex_in_thirty_minutes')}
 					li
-						a(href="/latex/templates") #{translate('templates')}
+						a(href='/latex/templates') #{translate('templates')}
 					li
-						a(href="/events/webinars") #{translate('webinars')}
+						a(href='/events/webinars') #{translate('webinars')}
 					li
-						a(href="/learn/latex/Tutorials") #{translate('tutorials')}
+						a(href='/learn/latex/Tutorials') #{translate('tutorials')}
 					li
-						a(href="/learn/latex/Inserting_Images") #{translate('how_to_insert_images')}
+						a(href='/learn/latex/Inserting_Images') #{translate('how_to_insert_images')}
 					li
-						a(href="/learn/latex/Tables") #{translate('how_to_create_tables')}
-						
+						a(href='/learn/latex/Tables') #{translate('how_to_create_tables')}
+
 			.footer-section
-				h2.footer-section-heading !{translate('footer_plans_and_pricing')}
-		
+				h2.footer-section-heading !{translate('pricing')}
+
 				ul.list-unstyled
 					li
-						a(href="/learn/how-to/Overleaf_premium_features") #{translate('premium_features')}
-					li
-						a(href="/user/subscription/plans?itm_referrer=footer-for-indv-groups") !{translate('for_individuals_and_groups')}
-					li
-						a(href="/for/enterprises") #{translate('for_business')}
-					li
-						a(href="/for/universities") #{translate('for_universities')}
+						a(href='/user/subscription/plans?itm_referrer=footer-for-indv') #{translate('for_individuals')}
 					li
 						a(
-							data-ol-for-students-link
-							href="/user/subscription/plans?itm_referrer=footer-for-students#student-annual"
-						) #{translate('for_students')}
+							href='/user/subscription/plans?plan=group&itm_referrer=footer-for-groups'
+						) !{translate('for_groups_and_organizations')}
 					li
-						a(href="/for/government") #{translate('for_government')}
-						
+						a(
+							href='/user/subscription/plans?itm_referrer=footer-for-students#student-annual'
+						) #{translate('for_students')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('get_involved')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/for/community/advisors") #{translate('become_an_advisor')}
-					li
-						a(href="https://forms.gle/67PSpN1bLnjGCmPQ9") #{translate('let_us_know_what_you_think')}
+						a(href='https://forms.gle/67PSpN1bLnjGCmPQ9') #{translate('let_us_know_what_you_think')}
 					if user
 						li
-							a(href="/beta/participate") #{translate('join_beta_program')}
-		
+							a(href='/beta/participate') #{translate('join_beta_program')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('help')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/about/why-latex") #{translate('why_latex')}
+						a(href='/learn') #{translate('Documentation')} 
 					li
-						a(href="/learn") #{translate('Documentation')} 
+						a(href='/contact') #{translate('footer_contact_us')} 
 					li
-						a(href="/contact") #{translate('footer_contact_us')}  
-					li
-						a(href="https://status.overleaf.com/") #{translate('website_status')}
-					
+						a(href='https://status.overleaf.com/') #{translate('website_status')}
+
 		include fat-footer-base
diff --git a/services/web/app/views/layout/fat-footer.pug b/services/web/app/views/layout/fat-footer.pug
index 95de4a3567..518511b11f 100644
--- a/services/web/app/views/layout/fat-footer.pug
+++ b/services/web/app/views/layout/fat-footer.pug
@@ -1,84 +1,89 @@
 footer.fat-footer.hidden-print
-	.fat-footer-container(role="navigation" aria-label=translate('footer_navigation'))
-		.fat-footer-sections(class=hideFatFooter ? 'hidden' : undefined)
-			.footer-section#footer-brand
-				a(href='/', aria-label=settings.appName).footer-brand
-					
+	.fat-footer-container(
+		role='navigation'
+		aria-label=translate('footer_navigation')
+	)
+		.fat-footer-sections(class={hidden: hideFatFooter})
+			#footer-brand.footer-section
+				a.footer-brand(href='/' aria-label=settings.appName)
+
 			.footer-section
 				h2.footer-section-heading #{translate('About')}
-					
+
 				ul.list-unstyled
 					li
-						a(href="/about") #{translate('footer_about_us')}
+						a(href='/about') #{translate('footer_about_us')}
 					li
-						a(href="/about/values") #{translate('our_values')}
+						a(href='https://digitalscience.pinpointhq.com/') #{translate('careers')}
 					li
-						a(href="/about/careers") #{translate('careers')}
+						a(href='/blog') #{translate('blog')}
+
+			.footer-section
+				h2.footer-section-heading #{translate('solutions')}
+
+				ul.list-unstyled
 					li
-						a(href="/for/press") !{translate('press_and_awards')}
+						a(href='/for/enterprises') #{translate('for_business')}
 					li
-						a(href="/blog") #{translate('blog')}
-						
+						a(href='/for/universities') #{translate('for_universities')}
+					li
+						a(href='/for/government') #{translate('for_government')}
+					li
+						a(href='/for/publishers') #{translate('for_publishers')}
+					li
+						a(href='/about/customer-stories') #{translate('customer_stories')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('learn')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/learn/latex/Learn_LaTeX_in_30_minutes") #{translate('latex_in_thirty_minutes')}
+						a(href='/learn/latex/Learn_LaTeX_in_30_minutes') #{translate('latex_in_thirty_minutes')}
 					li
-						a(href="/latex/templates") #{translate('templates')}
+						a(href='/latex/templates') #{translate('templates')}
 					li
-						a(href="/events/webinars") #{translate('webinars')}
+						a(href='/events/webinars') #{translate('webinars')}
 					li
-						a(href="/learn/latex/Tutorials") #{translate('tutorials')}
+						a(href='/learn/latex/Tutorials') #{translate('tutorials')}
 					li
-						a(href="/learn/latex/Inserting_Images") #{translate('how_to_insert_images')}
+						a(href='/learn/latex/Inserting_Images') #{translate('how_to_insert_images')}
 					li
-						a(href="/learn/latex/Tables") #{translate('how_to_create_tables')}
-						
+						a(href='/learn/latex/Tables') #{translate('how_to_create_tables')}
+
 			.footer-section
-				h2.footer-section-heading !{translate('footer_plans_and_pricing')}
-		
+				h2.footer-section-heading !{translate('pricing')}
+
 				ul.list-unstyled
 					li
-						a(href="/learn/how-to/Overleaf_premium_features") #{translate('premium_features')}
-					li
-						a(href="/user/subscription/plans?itm_referrer=footer-for-indv-groups") !{translate('for_individuals_and_groups')}
-					li
-						a(href="/for/enterprises") #{translate('for_enterprise')}
-					li
-						a(href="/for/universities") #{translate('for_universities')}
+						a(href='/user/subscription/plans?itm_referrer=footer-for-indv') #{translate('for_individuals')}
 					li
 						a(
-							data-ol-for-students-link
-							href="/user/subscription/plans?itm_referrer=footer-for-students#student-annual"
-						) #{translate('for_students')}
+							href='/user/subscription/plans?plan=group&itm_referrer=footer-for-groups'
+						) !{translate('for_groups_and_organizations')}
 					li
-						a(href="/for/government") #{translate('for_government')}
-						
+						a(
+							href='/user/subscription/plans?itm_referrer=footer-for-students#student-annual'
+						) #{translate('for_students')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('get_involved')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/for/community/advisors") #{translate('become_an_advisor')}
-					li
-						a(href="https://forms.gle/67PSpN1bLnjGCmPQ9") #{translate('let_us_know_what_you_think')}
+						a(href='https://forms.gle/67PSpN1bLnjGCmPQ9') #{translate('let_us_know_what_you_think')}
 					if user
 						li
-							a(href="/beta/participate") #{translate('join_beta_program')}
-		
+							a(href='/beta/participate') #{translate('join_beta_program')}
+
 			.footer-section
 				h2.footer-section-heading #{translate('help')}
-		
+
 				ul.list-unstyled
 					li
-						a(href="/about/why-latex") #{translate('why_latex')}
+						a(href='/learn') #{translate('Documentation')} 
 					li
-						a(href="/learn") #{translate('Documentation')} 
+						a(href='/contact') #{translate('footer_contact_us')} 
 					li
-						a(href="/contact") #{translate('footer_contact_us')}  
-					li
-						a(href="https://status.overleaf.com/") #{translate('website_status')}
-					
+						a(href='https://status.overleaf.com/') #{translate('website_status')}
+
 		include fat-footer-base
diff --git a/services/web/app/views/layout/language-picker-bootstrap-5.pug b/services/web/app/views/layout/language-picker-bootstrap-5.pug
index 47a9bc5d53..312b13ea18 100644
--- a/services/web/app/views/layout/language-picker-bootstrap-5.pug
+++ b/services/web/app/views/layout/language-picker-bootstrap-5.pug
@@ -1,25 +1,35 @@
-li.dropdown.dropup.subdued(dropdown).language-picker
+include ../_mixins/material_symbol
+
+li.dropdown.dropup.subdued.language-picker(dropdown)
 	button#language-picker-toggle.btn.btn-link.btn-inline-link(
-		dropdown-toggle,
-		data-ol-lang-selector-tooltip,
-		data-bs-toggle="dropdown",
-		aria-haspopup="true",
-		aria-expanded="false",
-		aria-label="Select " + translate('language'),
+		dropdown-toggle
+		data-ol-lang-selector-tooltip
+		data-bs-toggle='dropdown'
+		aria-haspopup='true'
+		aria-expanded='false'
+		aria-label='Select ' + translate('language')
 		tooltip=translate('language')
 		title=translate('language')
 	)
-		span.material-symbols(aria-hidden="true") translate
+		+material-symbol('translate')
 		| &nbsp;
 		span.language-picker-text #{settings.translatedLanguages[currentLngCode]}
 
-	ul.dropdown-menu.dropdown-menu-sm-width(role="menu" aria-labelledby="language-picker-toggle")
+	ul.dropdown-menu.dropdown-menu-sm-width(
+		role='menu'
+		aria-labelledby='language-picker-toggle'
+	)
 		li.dropdown-header #{translate("language")}
 		each subdomainDetails, subdomain in settings.i18n.subdomainLang
 			if !subdomainDetails.hide
 				- let isActive = subdomainDetails.lngCode === currentLngCode
 				li.lng-option
-					a.menu-indent(href=subdomainDetails.url+currentUrlWithQueryParams, role="menuitem", class=isActive ? 'dropdown-item active' : 'dropdown-item', aria-selected=isActive ? 'true' : 'false')
+					a.menu-indent(
+						href=subdomainDetails.url + currentUrlWithQueryParams
+						role='menuitem'
+						class=['dropdown-item', {active: isActive}]
+						aria-selected=isActive ? 'true' : 'false'
+					)
 						| #{settings.translatedLanguages[subdomainDetails.lngCode]}
 						if subdomainDetails.lngCode === currentLngCode
-							span.material-symbols.dropdown-item-trailing-icon(aria-hidden="true") check
+							+material-symbol('check', 'dropdown-item-trailing-icon')
diff --git a/services/web/app/views/layout/language-picker.pug b/services/web/app/views/layout/language-picker.pug
index d26d8a8bf7..e88ff716ec 100644
--- a/services/web/app/views/layout/language-picker.pug
+++ b/services/web/app/views/layout/language-picker.pug
@@ -1,13 +1,13 @@
-li.dropdown.dropup.subdued(dropdown).language-picker
-	a.dropdown-toggle#language-picker-toggle(
-		href="#",
-		dropdown-toggle,
-		data-ol-lang-selector-tooltip,
-		data-toggle="dropdown",
-		role="button"
-		aria-haspopup="true",
-		aria-expanded="false",
-		aria-label="Select " + translate('language'),
+li.dropdown.dropup.subdued.language-picker(dropdown)
+	a#language-picker-toggle.dropdown-toggle(
+		href='#'
+		dropdown-toggle
+		data-ol-lang-selector-tooltip
+		data-toggle='dropdown'
+		role='button'
+		aria-haspopup='true'
+		aria-expanded='false'
+		aria-label='Select ' + translate('language')
 		tooltip=translate('language')
 		title=translate('language')
 	)
@@ -15,10 +15,13 @@ li.dropdown.dropup.subdued(dropdown).language-picker
 		|
 		| #{settings.translatedLanguages[currentLngCode]}
 
-	ul.dropdown-menu(role="menu" aria-labelledby="language-picker-toggle")
+	ul.dropdown-menu(role='menu' aria-labelledby='language-picker-toggle')
 		li.dropdown-header #{translate("language")}
 		each subdomainDetails, subdomain in settings.i18n.subdomainLang
 			if !subdomainDetails.hide
 				li.lng-option
-					a.menu-indent(href=subdomainDetails.url+currentUrlWithQueryParams role="menuitem")
+					a.menu-indent(
+						href=subdomainDetails.url + currentUrlWithQueryParams
+						role='menuitem'
+					)
 						| #{settings.translatedLanguages[subdomainDetails.lngCode]}
diff --git a/services/web/app/views/layout/layout-no-js.pug b/services/web/app/views/layout/layout-no-js.pug
index c86721a810..76a31b72a5 100644
--- a/services/web/app/views/layout/layout-no-js.pug
+++ b/services/web/app/views/layout/layout-no-js.pug
@@ -1,18 +1,20 @@
 doctype html
-html(lang="en")
-
+html(lang='en')
 	- metadata = metadata || {}
 	block vars
 
 	head
-		if (metadata && metadata.title)
+		if metadata && metadata.title
 			title= metadata.title
 		if metadata && metadata.viewport
-			meta(name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes")
+			meta(
+				name='viewport'
+				content='width=device-width, initial-scale=1.0, user-scalable=yes'
+			)
 
-		link(rel="icon", href="/favicon.ico")
+		link(rel='icon' href='/favicon.ico')
 
 		if buildCssPath
-			link(rel="stylesheet", href=buildCssPath())
+			link(rel='stylesheet' href=buildCssPath('', 5))
 
 block body
diff --git a/services/web/app/views/layout/navbar-marketing-bootstrap-5.pug b/services/web/app/views/layout/navbar-marketing-bootstrap-5.pug
index 1c527c93d2..65e95a2290 100644
--- a/services/web/app/views/layout/navbar-marketing-bootstrap-5.pug
+++ b/services/web/app/views/layout/navbar-marketing-bootstrap-5.pug
@@ -1,71 +1,80 @@
 include ../_mixins/navbar
+include ../_mixins/material_symbol
 
-nav.navbar.navbar-default.navbar-main.navbar-expand-lg(class={
-	'website-redesign-navbar': isWebsiteRedesign
-})
+nav.navbar.navbar-default.navbar-main.navbar-expand-lg(
+	class={
+		'website-redesign-navbar': isWebsiteRedesign,
+	}
+)
 	.container-fluid.navbar-container
 		.navbar-header
 			if settings.nav.custom_logo
-				a(href='/', aria-label=settings.appName, style='background-image:url("'+settings.nav.custom_logo+'")').navbar-brand
-			else if (nav.title)
-				a(href='/', aria-label=settings.appName).navbar-title #{nav.title}
+				a.navbar-brand(
+					href='/'
+					aria-label=settings.appName
+					style='background-image:url("' + settings.nav.custom_logo + '")'
+				)
+			else if nav.title
+				a.navbar-title(href='/' aria-label=settings.appName) #{nav.title}
 			else
-				a(href='/', aria-label=settings.appName).navbar-brand
+				a.navbar-brand(href='/' aria-label=settings.appName)
 
 			- var enableUpgradeButton = projectDashboardReact && usersBestSubscription && (usersBestSubscription.type === 'free' || usersBestSubscription.type === 'standalone-ai-add-on')
-			if (enableUpgradeButton)
+			if enableUpgradeButton
 				a.btn.btn-primary.me-2.d-md-none(
-					href="/user/subscription/plans"
-					event-tracking="upgrade-button-click"
-					event-tracking-mb="true"
-					event-tracking-label="upgrade"
-					event-tracking-trigger="click"
-					event-segmentation='{"source": "dashboard-top", "project-dashboard-react": "enabled", "is-dashboard-sidebar-hidden": "true", "is-screen-width-less-than-768px": "true"}'
+					href='/user/subscription/plans'
+					event-tracking='upgrade-button-click'
+					event-tracking-mb='true'
+					event-tracking-label='upgrade'
+					event-tracking-trigger='click'
+					event-segmentation={source: 'dashboard-top', projectDashboardReact: 'enabled', isDashboardSidebarHidden: 'true', isScreenWidthLessThan768px: 'true'}
 				) #{translate("upgrade")}
 
 		- var canDisplayAdminMenu = hasAdminAccess()
 		- var canDisplayAdminRedirect = canRedirectToAdminDomain()
 		- var canDisplaySplitTestMenu = hasFeature('saas') && (canDisplayAdminMenu || (getSessionUser() && getSessionUser().staffAccess && (getSessionUser().staffAccess.splitTestMetrics || getSessionUser().staffAccess.splitTestManagement)))
 		- var canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
+		- var canDisplayScriptLogMenu = hasFeature('saas') && canDisplayAdminMenu
 
-		if (typeof suppressNavbarRight === "undefined")
-			button.navbar-toggler.collapsed(
-				type="button",
-				data-bs-toggle="collapse",
-				data-bs-target="#navbar-main-collapse"
-				aria-controls="navbar-main-collapse"
-				aria-expanded="false"
-				aria-label="Toggle " + translate('navigation')
+		if typeof suppressNavbarRight === 'undefined'
+			button#navbar-toggle-btn.navbar-toggler.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#navbar-main-collapse'
+				aria-controls='navbar-main-collapse'
+				aria-expanded='false'
+				aria-label='Toggle ' + translate('navigation')
 			)
-				i.fa.fa-bars(aria-hidden="true")
+				+material-symbol('menu')
 
-			.navbar-collapse.collapse#navbar-main-collapse
-				ul.nav.navbar-nav.navbar-right.ms-auto(role="menubar")
-					if (canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu)
+			#navbar-main-collapse.navbar-collapse.collapse
+				ul.nav.navbar-nav.navbar-right.ms-auto(role='menubar')
+					if canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu
 						+nav-item.dropdown.subdued
 							button.dropdown-toggle(
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-bs-toggle="dropdown"
-								role="menuitem"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "admin", "location": "top-menu"}
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-bs-toggle='dropdown'
+								role='menuitem'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'admin', location: 'top-menu'}
 							)
 								| Admin
-								span.caret
 							+dropdown-menu.dropdown-menu-end
 								if canDisplayAdminMenu
-									+dropdown-menu-link-item()(href="/admin") Manage Site
-									+dropdown-menu-link-item()(href="/admin/user") Manage Users
-									+dropdown-menu-link-item()(href="/admin/project") Project URL Lookup
+									+dropdown-menu-link-item(href='/admin') Manage Site
+									+dropdown-menu-link-item(href='/admin/user') Manage Users
+									+dropdown-menu-link-item(href='/admin/project') Project URL Lookup
 								if canDisplayAdminRedirect
-									+dropdown-menu-link-item()(href=settings.adminUrl) Switch to Admin
+									+dropdown-menu-link-item(href=settings.adminUrl) Switch to Admin
 								if canDisplaySplitTestMenu
-									+dropdown-menu-link-item()(href="/admin/split-test") Manage Feature Flags
+									+dropdown-menu-link-item(href='/admin/split-test') Manage Feature Flags
 								if canDisplaySurveyMenu
-									+dropdown-menu-link-item()(href="/admin/survey") Manage Surveys
+									+dropdown-menu-link-item(href='/admin/survey') Manage Surveys
+								if canDisplayScriptLogMenu
+									+dropdown-menu-link-item(href='/admin/script-logs') View Script Logs
 
 					// loop over header_extras
 					each item in nav.header_extras
@@ -84,47 +93,56 @@ nav.navbar.navbar-default.navbar-main.navbar-expand-lg(class={
 							if item.dropdown
 								+nav-item.dropdown(class=item.class)
 									button.dropdown-toggle(
-										aria-haspopup="true",
-										aria-expanded="false",
-										data-bs-toggle="dropdown"
-										role="menuitem"
-										event-tracking="menu-expand"
-										event-tracking-mb="true"
-										event-tracking-trigger="click"
-										event-segmentation={"item": item.trackingKey, "location": "top-menu"}
+										aria-haspopup='true'
+										aria-expanded='false'
+										data-bs-toggle='dropdown'
+										role='menuitem'
+										event-tracking='menu-expand'
+										event-tracking-mb='true'
+										event-tracking-trigger='click'
+										event-segmentation={item: item.trackingKey, location: 'top-menu'}
 									)
 										| !{translate(item.text)}
-										span.caret
 									+dropdown-menu.dropdown-menu-end
 										each child in item.dropdown
 											if child.divider
 												+dropdown-menu-divider
 											else if child.isContactUs
-												+dropdown-menu-link-item()(data-ol-open-contact-form-modal="contact-us" data-bs-target="#contactUsModal" href data-bs-toggle="modal" event-tracking="menu-click" event-tracking-mb="true" event-tracking-trigger="click" event-segmentation={"item": "contact", "location": "top-menu"})
+												+dropdown-menu-link-item(
+													data-ol-open-contact-form-modal='contact-us'
+													data-bs-target='#contactUsModal'
+													href
+													data-bs-toggle='modal'
+													event-tracking='menu-click'
+													event-tracking-mb='true'
+													event-tracking-trigger='click'
+													event-segmentation={item: 'contact', location: 'top-menu'}
+												)
 													span
 														| #{translate("contact_us")}
 											else
 												if child.url
-													+dropdown-menu-link-item()(
-														href=child.url,
-														class=child.class,
-														event-tracking="menu-click"
-														event-tracking-mb="true"
-														event-tracking-trigger="click"
-														event-segmentation={ item: child.trackingKey, location: 'top-menu' }
+													+dropdown-menu-link-item(
+														href=child.url
+														class=child.class
+														event-tracking='menu-click'
+														event-tracking-mb='true'
+														event-tracking-trigger='click'
+														event-segmentation={item: child.trackingKey, location: 'top-menu'}
 													) !{translate(child.text)}
 												else
-													+dropdown-menu-item !{translate(child.text)}
+													+dropdown-menu-item
+														| !{translate(child.text)}
 							else
 								+nav-item(class=item.class)
 									if item.url
 										+nav-link(
-											href=item.url,
-											class=item.class,
-											event-tracking="menu-click"
-											event-tracking-mb="true"
-											event-tracking-trigger="click"
-											event-segmentation={ item: item.trackingKey, location: 'top-menu' }
+											href=item.url
+											class=item.class
+											event-tracking='menu-click'
+											event-tracking-mb='true'
+											event-tracking-trigger='click'
+											event-segmentation={item: item.trackingKey, location: 'top-menu'}
 										) !{translate(item.text)}
 									else
 										| !{translate(item.text)}
@@ -135,49 +153,60 @@ nav.navbar.navbar-default.navbar-main.navbar-expand-lg(class={
 						if hasFeature('registration-page')
 							+nav-item.primary
 								+nav-link(
-									href="/register"
+									href='/register'
+									event-tracking='menu-click'
+									event-tracking-action='clicked'
+									event-tracking-trigger='click'
+									event-tracking-mb='true'
+									event-segmentation={page: currentUrl, item: 'register', location: 'top-menu'}
+								) #{translate('sign_up')}
+
+						// templates link
+						if settings.templates
+							+nav-item
+								+nav-link(
+									href="/templates"
 									event-tracking="menu-click"
 									event-tracking-action="clicked"
 									event-tracking-trigger="click"
 									event-tracking-mb="true"
-									event-segmentation={ page: currentUrl, item: 'register', location: 'top-menu' }
-								) #{translate('sign_up')}
+									event-segmentation={ page: currentUrl, item: 'templates', location: 'top-menu' }
+								) #{translate('templates')}
 
 						// login link
 						+nav-item
 							+nav-link(
-								href="/login"
-								event-tracking="menu-click"
-								event-tracking-action="clicked"
-								event-tracking-trigger="click"
-								event-tracking-mb="true"
-								event-segmentation={ page: currentUrl, item: 'login', location: 'top-menu' }
+								href='/login'
+								event-tracking='menu-click'
+								event-tracking-action='clicked'
+								event-tracking-trigger='click'
+								event-tracking-mb='true'
+								event-segmentation={page: currentUrl, item: 'login', location: 'top-menu'}
 							) #{translate('log_in')}
 
 					// projects link and account menu
 					if getSessionUser()
 						+nav-item
-							+nav-link(href="/project") #{translate('Projects')}
+							+nav-link(href='/project') #{translate('Projects')}
 						+nav-item.dropdown
 							button.dropdown-toggle(
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-bs-toggle="dropdown"
-								role="menuitem"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "account", "location": "top-menu"}
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-bs-toggle='dropdown'
+								role='menuitem'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'account', location: 'top-menu'}
 							)
 								| #{translate('Account')}
-								span.caret
 							+dropdown-menu.dropdown-menu-end
 								+dropdown-menu-item
-									div.disabled.dropdown-item #{getSessionUser().email}
+									.disabled.dropdown-item #{getSessionUser().email}
 								+dropdown-menu-divider
-								+dropdown-menu-link-item()(href="/user/settings") #{translate('Account Settings')}
+								+dropdown-menu-link-item(href='/user/settings') #{translate('account_settings')}
 								if nav.showSubscriptionLink
-									+dropdown-menu-link-item()(href="/user/subscription") #{translate('subscription')}
+									+dropdown-menu-link-item(href='/user/subscription') #{translate('subscription')}
 								+dropdown-menu-divider
 								+dropdown-menu-item
 									//-
@@ -185,14 +214,10 @@ nav.navbar.navbar-default.navbar-main.navbar-expand-lg(class={
 										this is that if the button is inside the form, screen readers will not count it in the total
 										number of menu items.
 									button.btn-link.text-left.dropdown-menu-button.dropdown-item(
-										role="menuitem",
-										tabindex="-1"
-										form="logOutForm"
+										role='menuitem'
+										tabindex='-1'
+										form='logOutForm'
 									)
 										| #{translate('log_out')}
-									form(
-										method="POST",
-										action="/logout",
-										id="logOutForm"
-									)
-										input(name='_csrf', type='hidden', value=csrfToken)
+									form(method='POST' action='/logout' id='logOutForm')
+										input(name='_csrf' type='hidden' value=csrfToken)
diff --git a/services/web/app/views/layout/navbar-marketing.pug b/services/web/app/views/layout/navbar-marketing.pug
index ebf698f726..64c3221c7b 100644
--- a/services/web/app/views/layout/navbar-marketing.pug
+++ b/services/web/app/views/layout/navbar-marketing.pug
@@ -1,71 +1,89 @@
-nav.navbar.navbar-default.navbar-main
+nav.navbar.navbar-default.navbar-main(
+	class={
+		'website-redesign-navbar': isWebsiteRedesign,
+	}
+)
 	.container-fluid
 		.navbar-header
-			if (typeof(suppressNavbarRight) == "undefined")
+			if typeof suppressNavbarRight == 'undefined'
 				button.navbar-toggle.collapsed(
-					type="button",
-					data-toggle="collapse",
-					data-target="#navbar-main-collapse"
-					aria-label="Toggle " + translate('navigation')
+					type='button'
+					data-toggle='collapse'
+					data-target='#navbar-main-collapse'
+					aria-label='Toggle ' + translate('navigation')
 				)
-					i.fa.fa-bars(aria-hidden="true")
+					i.fa.fa-bars(aria-hidden='true')
 			- var enableUpgradeButton = projectDashboardReact && usersBestSubscription && (usersBestSubscription.type === 'free' || usersBestSubscription.type === 'standalone-ai-add-on')
-			if (enableUpgradeButton)
-				a.btn.btn-primary.pull-right.me-2.visible-xs(
-					href="/user/subscription/plans"
-					event-tracking="upgrade-button-click"
-					event-tracking-mb="true"
-					event-tracking-label="upgrade"
-					event-tracking-trigger="click"
-					event-segmentation='{"source": "dashboard-top", "project-dashboard-react": "enabled", "is-dashboard-sidebar-hidden": "true", "is-screen-width-less-than-768px": "true"}'
+			if enableUpgradeButton
+				//- prettier-ignore
+				a.btn.btn-primary.float-end.me-2.visible-xs(
+					href='/user/subscription/plans'
+					event-tracking='upgrade-button-click'
+					event-tracking-mb='true'
+					event-tracking-label='upgrade'
+					event-tracking-trigger='click'
+					event-segmentation={
+						source: "dashboard-top",
+						"project-dashboard-react": "enabled",
+						"is-dashboard-sidebar-hidden": "true",
+						"is-screen-width-less-than-768px": "true"
+					}
 				) #{translate("upgrade")}
 			if settings.nav.custom_logo
-				a(href='/', aria-label=settings.appName, style='background-image:url("'+settings.nav.custom_logo+'")').navbar-brand
-			else if (nav.title)
-				a(href='/', aria-label=settings.appName).navbar-title #{nav.title}
+				a.navbar-brand(
+					href='/'
+					aria-label=settings.appName
+					style='background-image:url("' + settings.nav.custom_logo + '")'
+				)
+			else if nav.title
+				a.navbar-title(href='/' aria-label=settings.appName) #{nav.title}
 			else
-				a(href='/', aria-label=settings.appName).navbar-brand
+				a.navbar-brand(href='/' aria-label=settings.appName)
 
 		- var canDisplayAdminMenu = hasAdminAccess()
 		- var canDisplayAdminRedirect = canRedirectToAdminDomain()
 		- var canDisplaySplitTestMenu = hasFeature('saas') && (canDisplayAdminMenu || (getSessionUser() && getSessionUser().staffAccess && (getSessionUser().staffAccess.splitTestMetrics || getSessionUser().staffAccess.splitTestManagement)))
 		- var canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
+		- var canDisplayScriptLogMenu = hasFeature('saas') && canDisplayAdminMenu
 
-		if (typeof(suppressNavbarRight) == "undefined")
-			.navbar-collapse.collapse#navbar-main-collapse
+		if typeof suppressNavbarRight == 'undefined'
+			#navbar-main-collapse.navbar-collapse.collapse
 				ul.nav.navbar-nav.navbar-right
-					if (canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu)
+					if canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu
 						li.dropdown.subdued
 							a.dropdown-toggle(
-								href="#",
-								role="button",
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-toggle="dropdown"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "admin", "location": "top-menu"}
+								href='#'
+								role='button'
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-toggle='dropdown'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'admin', location: 'top-menu'}
 							)
 								| Admin
 								span.caret
 							ul.dropdown-menu
 								if canDisplayAdminMenu
 									li
-										a(href="/admin") Manage Site
+										a(href='/admin') Manage Site
 									li
-										a(href="/admin/user") Manage Users
+										a(href='/admin/user') Manage Users
 									li
-										a(href="/admin/project") Project URL Lookup
+										a(href='/admin/project') Project URL Lookup
 								if canDisplayAdminRedirect
 									li
 										a(href=settings.adminUrl) Switch to Admin
 								if canDisplaySplitTestMenu
 									li
-										a(href="/admin/split-test") Manage Feature Flags
+										a(href='/admin/split-test') Manage Feature Flags
 								if canDisplaySurveyMenu
 									li
-										a(href="/admin/survey") Manage Surveys
+										a(href='/admin/survey') Manage Surveys
+								if canDisplayScriptLogMenu
+									li
+										a(href='/admin/script-logs') View Script Logs
 
 					// loop over header_extras
 					each item in nav.header_extras
@@ -84,15 +102,15 @@ nav.navbar.navbar-default.navbar-main
 							if item.dropdown
 								li.dropdown(class=item.class)
 									a.dropdown-toggle(
-										href="#",
-										role="button",
-										aria-haspopup="true",
-										aria-expanded="false",
-										data-toggle="dropdown"
-										event-tracking="menu-expand"
-										event-tracking-mb="true"
-										event-tracking-trigger="click"
-										event-segmentation={"item": item.trackingKey, "location": "top-menu"}
+										href='#'
+										role='button'
+										aria-haspopup='true'
+										aria-expanded='false'
+										data-toggle='dropdown'
+										event-tracking='menu-expand'
+										event-tracking-mb='true'
+										event-tracking-trigger='click'
+										event-segmentation={item: item.trackingKey, location: 'top-menu'}
 									)
 										| !{translate(item.text)}
 										span.caret
@@ -102,18 +120,25 @@ nav.navbar.navbar-default.navbar-main
 												li.divider
 											else if child.isContactUs
 												li
-													a(data-ol-open-contact-form-modal="contact-us" href event-tracking="menu-click" event-tracking-mb="true" event-tracking-trigger="click" event-segmentation={"item": "contact", "location": "top-menu"})
+													a(
+														data-ol-open-contact-form-modal='contact-us'
+														href
+														event-tracking='menu-click'
+														event-tracking-mb='true'
+														event-tracking-trigger='click'
+														event-segmentation={item: 'contact', location: 'top-menu'}
+													)
 														span
 															| #{translate("contact_us")}
 											else
 												li
 													if child.url
 														a(
-															href=child.url,
-															class=child.class,
-															event-tracking="menu-click"
-															event-tracking-mb="true"
-															event-tracking-trigger="click"
+															href=child.url
+															class=child.class
+															event-tracking='menu-click'
+															event-tracking-mb='true'
+															event-tracking-trigger='click'
 															event-segmentation={item: item.trackingKey, location: 'top-menu'}
 														) !{translate(child.text)}
 													else
@@ -122,70 +147,82 @@ nav.navbar.navbar-default.navbar-main
 								li(class=item.class)
 									if item.url
 										a(
-											href=item.url,
-											class=item.class,
-											event-tracking="menu-click"
-											event-tracking-mb="true"
-											event-tracking-trigger="click"
-											event-segmentation={ item: item.trackingKey, location: 'top-menu' }
+											href=item.url
+											class=item.class
+											event-tracking='menu-click'
+											event-tracking-mb='true'
+											event-tracking-trigger='click'
+											event-segmentation={item: item.trackingKey, location: 'top-menu'}
 										) !{translate(item.text)}
 									else
 										| !{translate(item.text)}
 
 					// logged out
 					if !getSessionUser()
-						// register link
-						if hasFeature('registration-page')
-							li.primary
+						// templates link
+						if settings.templates
+							li
 								a(
-									href="/register"
+									href="/templates"
 									event-tracking="menu-click"
 									event-tracking-action="clicked"
 									event-tracking-trigger="click"
 									event-tracking-mb="true"
-									event-segmentation={ page: currentUrl, item: 'register', location: 'top-menu' }
+									event-segmentation={ page: currentUrl, item: 'templates', location: 'top-menu' }
+								) #{translate('templates')}
+
+						// register link
+						if hasFeature('registration-page')
+							li.primary
+								a(
+									href='/register'
+									event-tracking='menu-click'
+									event-tracking-action='clicked'
+									event-tracking-trigger='click'
+									event-tracking-mb='true'
+									event-segmentation={page: currentUrl, item: 'register', location: 'top-menu'}
 								) #{translate('sign_up')}
 
 						// login link
 						li
 							a(
-								href="/login"
-								event-tracking="menu-click"
-								event-tracking-action="clicked"
-								event-tracking-trigger="click"
-								event-tracking-mb="true"
-								event-segmentation={ page: currentUrl, item: 'login', location: 'top-menu' }
+								href='/login'
+								event-tracking='menu-click'
+								event-tracking-action='clicked'
+								event-tracking-trigger='click'
+								event-tracking-mb='true'
+								event-segmentation={page: currentUrl, item: 'login', location: 'top-menu'}
 							) #{translate('log_in')}
 
 					// projects link and account menu
 					if getSessionUser()
 						li
-							a(href="/project") #{translate('Projects')}
+							a(href='/project') #{translate('Projects')}
 						li.dropdown
 							a.dropdown-toggle(
-								href="#",
-								role="button",
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-toggle="dropdown"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "account", "location": "top-menu"}
+								href='#'
+								role='button'
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-toggle='dropdown'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'account', location: 'top-menu'}
 							)
 								| #{translate('Account')}
 								span.caret
 							ul.dropdown-menu
 								li
-									div.subdued #{getSessionUser().email}
+									.subdued #{getSessionUser().email}
 								li.divider.hidden-xs.hidden-sm
 								li
-									a(href="/user/settings") #{translate('Account Settings')}
+									a(href='/user/settings') #{translate('account_settings')}
 								if nav.showSubscriptionLink
 									li
-										a(href="/user/subscription") #{translate('subscription')}
+										a(href='/user/subscription') #{translate('subscription')}
 								li.divider.hidden-xs.hidden-sm
 								li
-									form(method="POST" action="/logout")
-										input(name='_csrf', type='hidden', value=csrfToken)
+									form(method='POST' action='/logout')
+										input(name='_csrf' type='hidden' value=csrfToken)
 										button.btn-link.text-left.dropdown-menu-button #{translate('log_out')}
diff --git a/services/web/app/views/layout/navbar-website-redesign.pug b/services/web/app/views/layout/navbar-website-redesign.pug
index 3e18ca94bc..210cf3a120 100644
--- a/services/web/app/views/layout/navbar-website-redesign.pug
+++ b/services/web/app/views/layout/navbar-website-redesign.pug
@@ -1,71 +1,84 @@
 nav.navbar.navbar-default.navbar-main.website-redesign-navbar
 	.container-fluid
 		.navbar-header
-			if (typeof(suppressNavbarRight) == "undefined")
-				button.navbar-toggle.collapsed(
-					type="button",
-					data-toggle="collapse",
-					data-target="#navbar-main-collapse"
-					aria-label="Toggle " + translate('navigation')
+			if typeof suppressNavbarRight == 'undefined'
+				button#navbar-toggle-btn.navbar-toggle.collapsed(
+					type='button'
+					data-toggle='collapse'
+					data-target='#navbar-main-collapse'
+					aria-label='Toggle ' + translate('navigation')
 				)
-					i.fa.fa-bars(aria-hidden="true")
+					i.fa.fa-bars(aria-hidden='true')
 			- var enableUpgradeButton = projectDashboardReact && usersBestSubscription && (usersBestSubscription.type === 'free' || usersBestSubscription.type === 'standalone-ai-add-on')
-			if (enableUpgradeButton)
-				a.btn.btn-primary.pull-right.me-2.visible-xs(
-					href="/user/subscription/plans"
-					event-tracking="upgrade-button-click"
-					event-tracking-mb="true"
-					event-tracking-label="upgrade"
-					event-tracking-trigger="click"
-					event-segmentation='{"source": "dashboard-top", "project-dashboard-react": "enabled", "is-dashboard-sidebar-hidden": "true", "is-screen-width-less-than-768px": "true"}'
+			if enableUpgradeButton
+				a.btn.btn-primary.float-end.me-2.visible-xs(
+					href='/user/subscription/plans'
+					event-tracking='upgrade-button-click'
+					event-tracking-mb='true'
+					event-tracking-label='upgrade'
+					event-tracking-trigger='click'
+					event-segmentation={
+						source: 'dashboard-top',
+						projectDashboardReact: 'enabled',
+						isDashboardSidebarHidden: 'true',
+						isScreenWidthLessThan768px: 'true',
+					}
 				) #{translate("upgrade")}
 			if settings.nav.custom_logo
-				a(href='/', aria-label=settings.appName, style='background-image:url("'+settings.nav.custom_logo+'")').navbar-brand
-			else if (nav.title)
-				a(href='/', aria-label=settings.appName).navbar-title #{nav.title}
+				a.navbar-brand(
+					href='/'
+					aria-label=settings.appName
+					style='background-image:url("' + settings.nav.custom_logo + '")'
+				)
+			else if nav.title
+				a.navbar-title(href='/' aria-label=settings.appName) #{nav.title}
 			else
-				a(href='/', aria-label=settings.appName).navbar-brand
+				a.navbar-brand(href='/' aria-label=settings.appName)
 
 		- var canDisplayAdminMenu = hasAdminAccess()
 		- var canDisplayAdminRedirect = canRedirectToAdminDomain()
 		- var canDisplaySplitTestMenu = hasFeature('saas') && (canDisplayAdminMenu || (getSessionUser() && getSessionUser().staffAccess && (getSessionUser().staffAccess.splitTestMetrics || getSessionUser().staffAccess.splitTestManagement)))
 		- var canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
+		- var canDisplayScriptLogMenu = hasFeature('saas') && canDisplayAdminMenu
 
-		if (typeof(suppressNavbarRight) == "undefined")
-			.navbar-collapse.collapse#navbar-main-collapse
+		if typeof suppressNavbarRight == 'undefined'
+			#navbar-main-collapse.navbar-collapse.collapse
 				ul.nav.navbar-nav.navbar-right
-					if (canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu)
+					if canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu
 						li.dropdown.subdued
 							a.dropdown-toggle(
-								href="#",
-								role="button",
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-toggle="dropdown"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "admin", "location": "top-menu"}
+								href='#'
+								role='button'
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-toggle='dropdown'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'admin', location: 'top-menu'}
 							)
 								| Admin
 								span.caret
 							ul.dropdown-menu
 								if canDisplayAdminMenu
 									li
-										a(href="/admin") Manage Site
+										a(href='/admin') Manage Site
 									li
-										a(href="/admin/user") Manage Users
+										a(href='/admin/user') Manage Users
 									li
-										a(href="/admin/project") Project URL Lookup
+										a(href='/admin/project') Project URL Lookup
 								if canDisplayAdminRedirect
 									li
 										a(href=settings.adminUrl) Switch to Admin
 								if canDisplaySplitTestMenu
 									li
-										a(href="/admin/split-test") Manage Feature Flags
+										a(href='/admin/split-test') Manage Feature Flags
 								if canDisplaySurveyMenu
 									li
-										a(href="/admin/survey") Manage Surveys
+										a(href='/admin/survey') Manage Surveys
+								if canDisplayScriptLogMenu
+									li
+										a(href='/admin/script-logs') View Script Logs
 
 					// loop over header_extras
 					each item in nav.header_extras
@@ -84,15 +97,15 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
 							if item.dropdown
 								li.dropdown(class=item.class)
 									a.dropdown-toggle(
-										href="#",
-										role="button",
-										aria-haspopup="true",
-										aria-expanded="false",
-										data-toggle="dropdown"
-										event-tracking="menu-expand"
-										event-tracking-mb="true"
-										event-tracking-trigger="click"
-										event-segmentation={"item": item.trackingKey, "location": "top-menu"}
+										href='#'
+										role='button'
+										aria-haspopup='true'
+										aria-expanded='false'
+										data-toggle='dropdown'
+										event-tracking='menu-expand'
+										event-tracking-mb='true'
+										event-tracking-trigger='click'
+										event-segmentation={item: item.trackingKey, location: 'top-menu'}
 									)
 										| !{translate(item.text)}
 										span.caret
@@ -102,18 +115,25 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
 												li.divider
 											else if child.isContactUs
 												li
-													a(data-ol-open-contact-form-modal="contact-us" href event-tracking="menu-click" event-tracking-mb="true" event-tracking-trigger="click" event-segmentation={"item": "contact", "location": "top-menu"})
+													a(
+														data-ol-open-contact-form-modal='contact-us'
+														href
+														event-tracking='menu-click'
+														event-tracking-mb='true'
+														event-tracking-trigger='click'
+														event-segmentation={item: 'contact', location: 'top-menu'}
+													)
 														span
 															| #{translate("contact_us")}
 											else
 												li
 													if child.url
 														a(
-															href=child.url,
-															class=child.class,
-															event-tracking="menu-click"
-															event-tracking-mb="true"
-															event-tracking-trigger="click"
+															href=child.url
+															class=child.class
+															event-tracking='menu-click'
+															event-tracking-mb='true'
+															event-tracking-trigger='click'
 															event-segmentation={item: child.trackingKey, location: 'top-menu'}
 														) !{translate(child.text)}
 													else
@@ -122,12 +142,12 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
 								li(class=item.class)
 									if item.url
 										a(
-											href=item.url,
-											class=item.class,
-											event-tracking="menu-click"
-											event-tracking-mb="true"
-											event-tracking-trigger="click"
-											event-segmentation={ item: item.trackingKey, location: 'top-menu' }
+											href=item.url
+											class=item.class
+											event-tracking='menu-click'
+											event-tracking-mb='true'
+											event-tracking-trigger='click'
+											event-segmentation={item: item.trackingKey, location: 'top-menu'}
 										) !{translate(item.text)}
 									else
 										| !{translate(item.text)}
@@ -138,54 +158,54 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
 						if hasFeature('registration-page')
 							li.primary
 								a(
-									href="/register"
-									event-tracking="menu-click"
-									event-tracking-action="clicked"
-									event-tracking-trigger="click"
-									event-tracking-mb="true"
-									event-segmentation={ page: currentUrl, item: 'register', location: 'top-menu' }
+									href='/register'
+									event-tracking='menu-click'
+									event-tracking-action='clicked'
+									event-tracking-trigger='click'
+									event-tracking-mb='true'
+									event-segmentation={page: currentUrl, item: 'register', location: 'top-menu'}
 								) #{translate('sign_up')}
 
 						// login link
 						li.secondary
 							a(
-								href="/login"
-								event-tracking="menu-click"
-								event-tracking-action="clicked"
-								event-tracking-trigger="click"
-								event-tracking-mb="true"
-								event-segmentation={ page: currentUrl, item: 'login', location: 'top-menu' }
+								href='/login'
+								event-tracking='menu-click'
+								event-tracking-action='clicked'
+								event-tracking-trigger='click'
+								event-tracking-mb='true'
+								event-segmentation={page: currentUrl, item: 'login', location: 'top-menu'}
 							) #{translate('log_in')}
 
 					// projects link and account menu
 					if getSessionUser()
 						li.secondary
-							a(href="/project") #{translate('Projects')}
+							a(href='/project') #{translate('Projects')}
 						li.secondary.dropdown
 							a.dropdown-toggle(
-								href="#",
-								role="button",
-								aria-haspopup="true",
-								aria-expanded="false",
-								data-toggle="dropdown"
-								event-tracking="menu-expand"
-								event-tracking-mb="true"
-								event-tracking-trigger="click"
-								event-segmentation={"item": "account", "location": "top-menu"}
+								href='#'
+								role='button'
+								aria-haspopup='true'
+								aria-expanded='false'
+								data-toggle='dropdown'
+								event-tracking='menu-expand'
+								event-tracking-mb='true'
+								event-tracking-trigger='click'
+								event-segmentation={item: 'account', location: 'top-menu'}
 							)
 								| #{translate('Account')}
 								span.caret
 							ul.dropdown-menu
 								li
-									div.subdued #{getSessionUser().email}
+									.subdued #{getSessionUser().email}
 								li.divider.hidden-xs.hidden-sm
 								li
-									a(href="/user/settings") #{translate('Account Settings')}
+									a(href='/user/settings') #{translate('account_settings')}
 								if nav.showSubscriptionLink
 									li
-										a(href="/user/subscription") #{translate('subscription')}
+										a(href='/user/subscription') #{translate('subscription')}
 								li.divider.hidden-xs.hidden-sm
 								li
-									form(method="POST" action="/logout")
-										input(name='_csrf', type='hidden', value=csrfToken)
+									form(method='POST' action='/logout')
+										input(name='_csrf' type='hidden' value=csrfToken)
 										button.btn-link.text-left.dropdown-menu-button #{translate('log_out')}
diff --git a/services/web/app/views/layout/thin-footer-bootstrap-5.pug b/services/web/app/views/layout/thin-footer-bootstrap-5.pug
index 1f06a054fc..4c29933ab1 100644
--- a/services/web/app/views/layout/thin-footer-bootstrap-5.pug
+++ b/services/web/app/views/layout/thin-footer-bootstrap-5.pug
@@ -25,7 +25,7 @@ footer.site-footer
 				each item in nav.left_footer
 					li
 						if item.url
-							a(href=item.url, class=item.class) !{translate(item.text)}
+							a(href=item.url class=item.class) !{translate(item.text)}
 						else
 							| !{item.text}
 
@@ -33,6 +33,6 @@ footer.site-footer
 				each item in nav.right_footer
 					li
 						if item.url
-							a(href=item.url, class=item.class, aria-label=item.label) !{item.text}
+							a(href=item.url class=item.class aria-label=item.label) !{item.text}
 						else
 							| !{item.text}
diff --git a/services/web/app/views/layout/thin-footer.pug b/services/web/app/views/layout/thin-footer.pug
index 6eeecf628a..879e337983 100644
--- a/services/web/app/views/layout/thin-footer.pug
+++ b/services/web/app/views/layout/thin-footer.pug
@@ -27,7 +27,7 @@ footer.site-footer
 				each item in nav.left_footer
 					li
 						if item.url
-							a(href=item.url, class=item.class) !{translate(item.text)}
+							a(href=item.url class=item.class) !{translate(item.text)}
 						else
 							| !{item.text}
 
@@ -35,6 +35,6 @@ footer.site-footer
 				each item in nav.right_footer
 					li
 						if item.url
-							a(href=item.url, class=item.class, aria-label=item.label) !{item.text}
+							a(href=item.url class=item.class aria-label=item.label) !{item.text}
 						else
 							| !{item.text}
diff --git a/services/web/app/views/project/editor/_meta.pug b/services/web/app/views/project/editor/_meta.pug
index 720802aba8..f45ce6aaf2 100644
--- a/services/web/app/views/project/editor/_meta.pug
+++ b/services/web/app/views/project/editor/_meta.pug
@@ -1,16 +1,18 @@
 meta(name="ol-project_id" content=project_id)
 meta(name="ol-projectName" content=projectName)
+meta(name="ol-projectOwnerHasPremiumOnPageLoad" data-type="boolean" content=projectOwnerHasPremiumOnPageLoad)
 meta(name="ol-userSettings" data-type="json" content=userSettings)
 meta(name="ol-user" data-type="json" content=user)
+meta(name="ol-labsExperiments" data-type="json" content=labsExperiments)
 meta(name="ol-learnedWords" data-type="json" content=learnedWords)
 meta(name="ol-anonymous" data-type="boolean" content=anonymous)
 meta(name="ol-brandVariation" data-type="json" content=brandVariation)
 meta(name="ol-isTokenMember" data-type="boolean" content=isTokenMember)
 meta(name="ol-isRestrictedTokenMember" data-type="boolean" content=isRestrictedTokenMember)
-meta(name="ol-maxDocLength" data-type="json" content=maxDocLength)
-meta(name="ol-maxReconnectGracefullyIntervalMs" data-type="json" content=maxReconnectGracefullyIntervalMs)
+meta(name="ol-maxDocLength" data-type="number" content=maxDocLength)
+meta(name="ol-maxReconnectGracefullyIntervalMs" data-type="number" content=maxReconnectGracefullyIntervalMs)
 meta(name="ol-wikiEnabled" data-type="boolean" content=settings.proxyLearn)
-meta(name="ol-chatEnabled" data-type="boolean" content=chatEnabled)
+meta(name="ol-capabilities" data-type="json" content=capabilities)
 meta(name="ol-projectHistoryBlobsEnabled" data-type="boolean" content=projectHistoryBlobsEnabled)
 meta(name="ol-gitBridgePublicBaseUrl" content=gitBridgePublicBaseUrl)
 meta(name="ol-gitBridgeEnabled" data-type="boolean" content=gitBridgeEnabled)
@@ -35,17 +37,11 @@ meta(name="ol-showTemplatesServerPro", data-type="boolean" content=showTemplates
 meta(name="ol-hasTrackChangesFeature", data-type="boolean" content=hasTrackChangesFeature)
 meta(name="ol-inactiveTutorials", data-type="json" content=user.inactiveTutorials)
 meta(name="ol-projectTags" data-type="json" content=projectTags)
-meta(name="ol-usedLatex" data-type="string" content=usedLatex)
 meta(name="ol-ro-mirror-on-client-no-local-storage" data-type="boolean" content=roMirrorOnClientNoLocalStorage)
 meta(name="ol-isSaas" data-type="boolean" content=isSaas)
 meta(name="ol-shouldLoadHotjar" data-type="boolean" content=shouldLoadHotjar)
-meta(name="ol-isReviewerRoleEnabled" data-type="boolean" content=isReviewerRoleEnabled)
-meta(name="ol-odcRole" data-type="string" content=odcRole)
-meta(name="ol-isPaywallChangeCompileTimeoutEnabled" data-type="boolean" content=isPaywallChangeCompileTimeoutEnabled)
 meta(name='ol-customerIoEnabled' data-type="boolean" content=customerIoEnabled)
-if(isPaywallChangeCompileTimeoutEnabled)
-	//- expose plans info to show prices in paywall-change-compile-timeout test 
-	meta(name="ol-paywallPlans", data-type="json" content=paywallPlans)
+meta(name='ol-compileSettings' data-type="json" content=compileSettings)
 if(isOverleafAssistBundleEnabled)
 	//- expose plans info to show prices in paywall-change-compile-timeout test 
 	meta(name="ol-addonPrices", data-type="json" content=addonPrices)
diff --git a/services/web/app/views/project/editor/new_from_template.pug b/services/web/app/views/project/editor/new_from_template.pug
index c3b40cecf5..6d35913141 100644
--- a/services/web/app/views/project/editor/new_from_template.pug
+++ b/services/web/app/views/project/editor/new_from_template.pug
@@ -1,37 +1,38 @@
 extends ../../layout-marketing
 
 block vars
-  - var suppressFooter = true
-  - var suppressCookieBanner = true
-  - var suppressSkipToContent = true
-  - bootstrap5PageStatus = 'disabled'
+	- var suppressFooter = true
+	- var suppressPugCookieBanner = true
+	- var suppressSkipToContent = true
 
 block content
-  .editor.full-size
-    .loading-screen()
-      .loading-screen-brand-container
-        .loading-screen-brand(
-          style="height: 20%;"
-        )
+	.editor.full-size
+		.loading-screen()
+			.loading-screen-brand-container
+				.loading-screen-brand(
+					style="height: 20%;"
+				)
 
-      h3.loading-screen-label() #{translate("Opening template")}
-        span.loading-screen-ellip .
-        span.loading-screen-ellip .
-        span.loading-screen-ellip .
+			h3.loading-screen-label() #{translate("Opening template")}
+				span.loading-screen-ellip .
+				span.loading-screen-ellip .
+				span.loading-screen-ellip .
 
-  form(
-    data-ol-regular-form
-    data-ol-auto-submit
-    method='POST'
-    action='/project/new/template/'
-  )
-    input(type="hidden", name="_csrf", value=csrfToken)
-    input(type="hidden" name="templateId" value=templateId)
-    input(type="hidden" name="templateVersionId" value=templateVersionId)
-    input(type="hidden" name="templateName" value=name)
-    input(type="hidden" name="compiler" value=compiler)
-    input(type="hidden" name="imageName" value=imageName)
-    input(type="hidden" name="mainFile" value=mainFile)
-    if brandVariationId
-      input(type="hidden" name="brandVariationId" value=brandVariationId)
-    input(hidden type="submit")
+	form(
+		data-ol-regular-form
+		data-ol-auto-submit
+		method='POST'
+		action='/project/new/template/'
+	)
+		input(type="hidden", name="_csrf", value=csrfToken)
+		input(type="hidden" name="templateId" value=templateId)
+		input(type="hidden" name="templateVersionId" value=templateVersionId)
+		input(type="hidden" name="templateName" value=name)
+		input(type="hidden" name="compiler" value=compiler)
+		if imageName
+			input(type="hidden" name="imageName" value=imageName)
+		input(type="hidden" name="mainFile" value=mainFile)
+		input(type="hidden" name="language" value=language)
+		if brandVariationId
+			input(type="hidden" name="brandVariationId" value=brandVariationId)
+		input(hidden type="submit")
diff --git a/services/web/app/views/project/editor/socket_diagnostics.pug b/services/web/app/views/project/editor/socket_diagnostics.pug
index 841f4b517b..31bf763b65 100644
--- a/services/web/app/views/project/editor/socket_diagnostics.pug
+++ b/services/web/app/views/project/editor/socket_diagnostics.pug
@@ -1,10 +1,9 @@
-extends ../../layout-marketing
+extends ../../layout-react
 
 block vars
 	- var suppressNavbar = true
 	- var suppressFooter = true
-	- var suppressGoogleAnalytics = true
-	- bootstrap5PageStatus = 'enabled'
+	- var suppressAnalytics = true
 	- isWebsiteRedesign = 'true'
 		
 block entrypointVar
diff --git a/services/web/app/views/project/ide-react-detached.pug b/services/web/app/views/project/ide-react-detached.pug
index 4c9a633b5f..fa695b1af5 100644
--- a/services/web/app/views/project/ide-react-detached.pug
+++ b/services/web/app/views/project/ide-react-detached.pug
@@ -7,12 +7,11 @@ block vars
 	- var suppressNavbar = true
 	- var suppressFooter = true
 	- var suppressSkipToContent = true
-	- var suppressCookieBanner = true
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+	- var suppressPugCookieBanner = true
 	- metadata.robotsNoindexNofollow = true
 
 block content
-	#pdf-preview-detached-root()
+	#pdf-preview-detached-root
 
 block append meta
 	include editor/_meta
diff --git a/services/web/app/views/project/ide-react.pug b/services/web/app/views/project/ide-react.pug
index a16345bbe9..8af9de8296 100644
--- a/services/web/app/views/project/ide-react.pug
+++ b/services/web/app/views/project/ide-react.pug
@@ -5,7 +5,6 @@ block vars
 	- var suppressFooter = true
 	- var suppressSkipToContent = true
 	- var deferScripts = true
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
 	- metadata.robotsNoindexNofollow = true
 	- enableIeeeBranding = false
 
@@ -16,7 +15,7 @@ block content
 	main#ide-root
 		.loading-screen
 			.loading-screen-brand-container
-				.loading-screen-brand(style="height: 20%;")
+				.loading-screen-brand(style='height: 20%')
 			h3.loading-screen-label #{translate("loading")}
 				span.loading-screen-ellip .
 				span.loading-screen-ellip .
@@ -26,4 +25,9 @@ block append meta
 	include editor/_meta
 
 block prepend foot-scripts
-	script(type="text/javascript", nonce=scriptNonce, src=(wsUrl || '/socket.io') + '/socket.io.js', defer=deferScripts)
+	script(
+		type='text/javascript'
+		nonce=scriptNonce
+		src=(wsUrl || '/socket.io') + '/socket.io.js'
+		defer=deferScripts
+	)
diff --git a/services/web/app/views/project/invite/not-valid.pug b/services/web/app/views/project/invite/not-valid.pug
index ac3eaed80a..3722ab7919 100644
--- a/services/web/app/views/project/invite/not-valid.pug
+++ b/services/web/app/views/project/invite/not-valid.pug
@@ -1,21 +1,18 @@
 extends ../../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-8.col-md-offset-2
+				.col-md-8.col-md-offset-2.offset-md-2
 					.card.project-invite-invalid
-						.page-header.text-centered
-							h1  #{translate("invite_not_valid")}
-						.row.text-center
-							.col-md-12
-								p
-									| #{translate("invite_not_valid_description")}.
-						.row.text-center.actions
-							.col-md-12
-								a.btn.btn-secondary-info.btn-secondary(href="/project") #{translate("back_to_your_projects")}
-							
+						.card-body
+							.page-header.text-center
+								h1 #{translate("invite_not_valid")}
+							.row.text-center
+								.col-12.col-md-12
+									p
+										| #{translate("invite_not_valid_description")}.
+							.row.text-center.actions
+								.col-12.col-md-12
+									a.btn.btn-secondary-info.btn-secondary(href='/project') #{translate("back_to_your_projects")}
diff --git a/services/web/app/views/project/invite/show.pug b/services/web/app/views/project/invite/show.pug
index 8d19a1edba..503ec78796 100644
--- a/services/web/app/views/project/invite/show.pug
+++ b/services/web/app/views/project/invite/show.pug
@@ -1,37 +1,35 @@
 extends ../../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-8.col-md-offset-2
+				.col-12.col-md-8.col-md-offset-2.offset-md-2
 					.card.project-invite-accept
-						.page-header.text-centered
-							h1 #{translate("user_wants_you_to_see_project", {username:owner.first_name, projectname:""})}
-								br
-								em #{project.name}
-						.row.text-center
-							.col-md-12
-								p
-									| #{translate("accepting_invite_as")}&nbsp;
-									em #{user.email}
-						.row
-							.col-md-12
-								form.form(
-									data-ol-regular-form
-									method="POST",
-									action="/project/"+invite.projectId+"/invite/token/"+token+"/accept"
-								)
-									input(name='_csrf', type='hidden', value=csrfToken)
-									input(name='token', type='hidden', value=token)
-									.form-group.text-center
-										button.btn.btn-lg.btn-primary(
-											type="submit"
-											data-ol-disabled-inflight
-										)
-											span(data-ol-inflight="idle") #{translate("join_project")}
-											span(hidden data-ol-inflight="pending") #{translate("joining")}…
-									.form-group.text-center
+						.card-body
+							.page-header.text-center
+								h1 #{translate("user_wants_you_to_see_project", {username:owner.first_name, projectname:""})}
+									br
+									em #{project.name}
+							.row.text-center
+								.col-12.col-md-12
+									p
+										| #{translate("accepting_invite_as")}&nbsp;
+										em #{user.email}
+							.row
+								.col-12.col-md-12
+									form.form(
+										data-ol-regular-form
+										method='POST'
+										action='/project/' + invite.projectId + '/invite/token/' + token + '/accept'
+									)
+										input(name='_csrf' type='hidden' value=csrfToken)
+										input(name='token' type='hidden' value=token)
+										.form-group.text-center
+											button.btn.btn-lg.btn-primary(
+												type='submit'
+												data-ol-disabled-inflight
+											)
+												span(data-ol-inflight='idle') #{translate("join_project")}
+												span(hidden data-ol-inflight='pending') #{translate("joining")}…
+										.form-group.text-center
diff --git a/services/web/app/views/project/list-react.pug b/services/web/app/views/project/list-react.pug
index d24ce08449..47bff344b6 100644
--- a/services/web/app/views/project/list-react.pug
+++ b/services/web/app/views/project/list-react.pug
@@ -7,38 +7,91 @@ block vars
 	- const suppressNavContentLinks = true
 	- const suppressNavbar = true
 	- const suppressFooter = true
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+	- const suppressPugCookieBanner = true
 
 block append meta
-	meta(name="ol-usersBestSubscription" data-type="json" content=usersBestSubscription)
-	meta(name="ol-notifications" data-type="json" content=notifications)
-	meta(name="ol-notificationsInstitution" data-type="json" content=notificationsInstitution)
-	meta(name="ol-userEmails" data-type="json" content=userEmails)
-	meta(name="ol-allInReconfirmNotificationPeriods" data-type="json" content=allInReconfirmNotificationPeriods)
-	meta(name="ol-user" data-type="json" content=user)
-	meta(name="ol-userAffiliations" data-type="json" content=userAffiliations)
-	meta(name="ol-reconfirmedViaSAML" content=reconfirmedViaSAML)
-	meta(name="ol-survey" data-type="json" content=survey)
-	meta(name="ol-tags" data-type="json" content=tags)
-	meta(name="ol-portalTemplates" data-type="json" content=portalTemplates)
-	meta(name="ol-prefetchedProjectsBlob" data-type="json" content=prefetchedProjectsBlob)
-	if (suggestedLanguageSubdomainConfig)
-		meta(name="ol-suggestedLanguage" data-type="json" content=Object.assign(suggestedLanguageSubdomainConfig, {
-			lngName: translate(suggestedLanguageSubdomainConfig.lngCode),
-			imgUrl: buildImgPath("flags/24/" + suggestedLanguageSubdomainConfig.lngCode + ".png")
-		}))
-	meta(name="ol-currentUrl" data-type="string" content=currentUrl)
-	meta(name="ol-showGroupsAndEnterpriseBanner" data-type="boolean" content=showGroupsAndEnterpriseBanner)
-	meta(name="ol-groupsAndEnterpriseBannerVariant" data-type="string" content=groupsAndEnterpriseBannerVariant)
-	meta(name="ol-showInrGeoBanner" data-type="boolean" content=showInrGeoBanner)
-	meta(name="ol-showBrlGeoBanner" data-type="boolean" content=showBrlGeoBanner)
-	meta(name="ol-recommendedCurrency" data-type="string" content=recommendedCurrency)
-	meta(name="ol-showLATAMBanner" data-type="boolean" content=showLATAMBanner)
-	meta(name="ol-groupSubscriptionsPendingEnrollment" data-type="json" content=groupSubscriptionsPendingEnrollment)
-	meta(name="ol-hasIndividualRecurlySubscription" data-type="boolean" content=hasIndividualRecurlySubscription)
-	meta(name="ol-groupSsoSetupSuccess" data-type="boolean" content=groupSsoSetupSuccess)
-	meta(name="ol-showUSGovBanner" data-type="boolean" content=showUSGovBanner)
-	meta(name="ol-usGovBannerVariant" data-type="string" content=usGovBannerVariant)
+	meta(
+		name='ol-usersBestSubscription'
+		data-type='json'
+		content=usersBestSubscription
+	)
+	meta(name='ol-notifications' data-type='json' content=notifications)
+	meta(
+		name='ol-notificationsInstitution'
+		data-type='json'
+		content=notificationsInstitution
+	)
+	meta(name='ol-userEmails' data-type='json' content=userEmails)
+	meta(
+		name='ol-allInReconfirmNotificationPeriods'
+		data-type='json'
+		content=allInReconfirmNotificationPeriods
+	)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-userAffiliations' data-type='json' content=userAffiliations)
+	meta(name='ol-reconfirmedViaSAML' content=reconfirmedViaSAML)
+	meta(name='ol-survey' data-type='json' content=survey)
+	meta(name='ol-tags' data-type='json' content=tags)
+	meta(name='ol-portalTemplates' data-type='json' content=portalTemplates)
+	meta(
+		name='ol-prefetchedProjectsBlob'
+		data-type='json'
+		content=prefetchedProjectsBlob
+	)
+	if suggestedLanguageSubdomainConfig
+		meta(
+			name='ol-suggestedLanguage'
+			data-type='json'
+			content=Object.assign(suggestedLanguageSubdomainConfig, {
+				lngName: translate(suggestedLanguageSubdomainConfig.lngCode),
+				imgUrl: buildImgPath('flags/24/' + suggestedLanguageSubdomainConfig.lngCode + '.png'),
+			})
+		)
+	meta(name='ol-currentUrl' data-type='string' content=currentUrl)
+	meta(
+		name='ol-showGroupsAndEnterpriseBanner'
+		data-type='boolean'
+		content=showGroupsAndEnterpriseBanner
+	)
+	meta(
+		name='ol-groupsAndEnterpriseBannerVariant'
+		data-type='string'
+		content=groupsAndEnterpriseBannerVariant
+	)
+	meta(name='ol-showInrGeoBanner' data-type='boolean' content=showInrGeoBanner)
+	meta(name='ol-showBrlGeoBanner' data-type='boolean' content=showBrlGeoBanner)
+	meta(
+		name='ol-recommendedCurrency'
+		data-type='string'
+		content=recommendedCurrency
+	)
+	meta(name='ol-showLATAMBanner' data-type='boolean' content=showLATAMBanner)
+	meta(
+		name='ol-groupSubscriptionsPendingEnrollment'
+		data-type='json'
+		content=groupSubscriptionsPendingEnrollment
+	)
+	meta(
+		name='ol-hasIndividualPaidSubscription'
+		data-type='boolean'
+		content=hasIndividualPaidSubscription
+	)
+	meta(
+		name='ol-groupSsoSetupSuccess'
+		data-type='boolean'
+		content=groupSsoSetupSuccess
+	)
+	meta(name='ol-showUSGovBanner' data-type='boolean' content=showUSGovBanner)
+	meta(
+		name='ol-usGovBannerVariant'
+		data-type='string'
+		content=usGovBannerVariant
+	)
+	meta(
+		name='ol-showAiAssistNotification'
+		data-type='boolean'
+		content=showAiAssistNotification
+	)
 
 block content
 	#project-list-root
diff --git a/services/web/app/views/project/token/access-react.pug b/services/web/app/views/project/token/access-react.pug
index 734ffa053f..6c01ad15b1 100644
--- a/services/web/app/views/project/token/access-react.pug
+++ b/services/web/app/views/project/token/access-react.pug
@@ -1,18 +1,17 @@
-extends ../../layout-marketing
+extends ../../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/token-access'
 
 block vars
 	- var suppressFooter = true
-	- var suppressCookieBanner = true
+	- var suppressPugCookieBanner = true
 	- var suppressSkipToContent = true
-	- bootstrap5PageStatus = 'enabled'
-		
+
 block append meta
-	meta(name="ol-postUrl" data-type="string" content=postUrl)
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-postUrl' data-type='string' content=postUrl)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	.content.content-alt#main-content
-		div#token-access-page
+	#main-content.content.content-alt
+		#token-access-page
diff --git a/services/web/app/views/project/token/sharing-updates.pug b/services/web/app/views/project/token/sharing-updates.pug
index 61cf8b5e6a..2f67e5a3c1 100644
--- a/services/web/app/views/project/token/sharing-updates.pug
+++ b/services/web/app/views/project/token/sharing-updates.pug
@@ -1,17 +1,17 @@
-extends ../../layout-marketing
+extends ../../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/sharing-updates'
 
 block vars
 	- var suppressFooter = true
-	- var suppressCookieBanner = true
+	- var suppressPugCookieBanner = true
 	- var suppressSkipToContent = true
-	- bootstrap5PageStatus = 'enabled'
 
 block append meta
-	meta(name="ol-project_id" data-type="string" content=projectId)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-project_id' data-type='string' content=projectId)
 
 block content
-	.content.content-alt#main-content
-		div#sharing-updates-page
+	#main-content.content.content-alt
+		#sharing-updates-page
diff --git a/services/web/app/views/referal/bonus.pug b/services/web/app/views/referal/bonus.pug
index ecd5a7160a..b1b2ccde41 100644
--- a/services/web/app/views/referal/bonus.pug
+++ b/services/web/app/views/referal/bonus.pug
@@ -1,49 +1,47 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
 	.content.content-alt#main-content
-		.container.bonus
+		.container#bonus
 			.row
-				.col-md-8.col-md-offset-2
+				.col-lg-8.offset-lg-2
 					.card
-						.container-fluid
-							.row
-								.col-md-10.col-md-offset-1
-									if (refered_user_count > 0)
-										p.thanks The Overleaf Bonus Program has been discontinued, but you'll continue to have access to the features you already earned.
-									else
-										p.thanks The Overleaf Bonus Program has been discontinued.
-									p.thanks Please <a href="/contact">contact us</a> if you have any questions.
-									
-							if (refered_user_count > 0)
-								.row.ab-bonus
-									.col-md-10.col-md-offset-1.bonus-banner(style="position: relative; height: 30px; margin-top: 20px;")
-										- for (var i = 0; i <= 10; i++) {
-											if (refered_user_count == i)
-												.number(style="left: "+i+"0%").active #{i}
-											else
-												.number(style="left: "+i+"0%") #{i}
-										- }
-	
-								.row.ab-bonus
-									.col-md-10.col-md-offset-1.bonus-banner
-										.progress
-											.progress-bar.progress-bar-info(style="width: "+refered_user_count+"0%")
-	
-								.row.ab-bonus
-									.col-md-10.col-md-offset-1.bonus-banner(style="position: relative; height: 110px;")
-										.perk(style="left: 10%;", class = refered_user_count >= 1 ? "active" : "") #{translate("one_free_collab")}
-										.perk(style="left: 30%;", class = refered_user_count >= 3 ? "active" : "") #{translate("three_free_collab")}
-										.perk(style="left: 60%;", class = refered_user_count >= 6 ? "active" : "") #{translate("free_dropbox_and_history")} + #{translate("three_free_collab")}
-										.perk(style="left: 90%;", class = refered_user_count >= 9 ? "active" : "") #{translate("free_dropbox_and_history")} + #{translate("unlimited_collabs")}
-								.row &nbsp;
-	
-								.row.ab-bonus
-									.col-md-10.col-md-offset-1.bonus-banner.bonus-status
-										if (refered_user_count == 1)
-											p.thanks You’ve introduced <strong>1</strong> person to #{settings.appName}.
+						.card-body
+							.container-fluid
+								.row
+									.col-lg-10.offset-lg-1
+										if (refered_user_count > 0)
+											p.thanks The Overleaf Bonus Program has been discontinued, but you'll continue to have access to the features you already earned.
 										else
-											p.thanks You’ve introduced <strong>#{refered_user_count}</strong> people to #{settings.appName}.
+											p.thanks The Overleaf Bonus Program has been discontinued.
+										p.thanks Please <a href="/contact">contact us</a> if you have any questions.
+										
+								if (refered_user_count > 0)
+									.row.ab-bonus
+										.col-lg-10.offset-lg-1(style="position: relative; height: 30px; margin-top: 20px;")
+											- for (var i = 0; i <= 10; i++) {
+												if (refered_user_count == i)
+													.number(style="left: "+i+"0%").active #{i}
+												else
+													.number(style="left: "+i+"0%") #{i}
+											- }
+		
+									.row.ab-bonus
+										.col-lg-10.offset-lg-1
+											.progress
+												.progress-bar.progress-bar-info(style="width: "+refered_user_count+"0%")
+		
+									.row.ab-bonus
+										.col-lg-10.offset-lg-1(style="position: relative; height: 110px;")
+											.perk(style="left: 10%;", class = refered_user_count >= 1 ? "active" : "") #{translate("one_free_collab")}
+											.perk(style="left: 30%;", class = refered_user_count >= 3 ? "active" : "") #{translate("three_free_collab")}
+											.perk(style="left: 60%;", class = refered_user_count >= 6 ? "active" : "") #{translate("free_dropbox_and_history")} + #{translate("three_free_collab")}
+											.perk(style="left: 90%;", class = refered_user_count >= 9 ? "active" : "") #{translate("free_dropbox_and_history")} + #{translate("unlimited_collabs")}
+									.row &nbsp;
+
+									.row.ab-bonus
+										.col-lg-10.offset-lg-1.bonus-status
+											if (refered_user_count == 1)
+												p.thanks You’ve introduced <strong>1</strong> person to #{settings.appName}.
+											else
+												p.thanks You’ve introduced <strong>#{refered_user_count}</strong> people to #{settings.appName}.
diff --git a/services/web/app/views/subscriptions/add-seats.pug b/services/web/app/views/subscriptions/add-seats.pug
index 9dd92da454..6fa644ee46 100644
--- a/services/web/app/views/subscriptions/add-seats.pug
+++ b/services/web/app/views/subscriptions/add-seats.pug
@@ -1,18 +1,20 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // Enforce BS5 version
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/add-seats'
 
 block append meta
-	meta(name="ol-subscriptionData" data-type="json" content=subscriptionData)
-	meta(name="ol-groupName", data-type="string", content=groupName)
-	meta(name="ol-subscriptionId", data-type="string", content=subscriptionId)
-	meta(name="ol-totalLicenses", data-type="number", content=totalLicenses)
-	meta(name="ol-isProfessional", data-type="boolean", content=isProfessional)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-groupName' data-type='string' content=groupName)
+	meta(name='ol-subscriptionId' data-type='string' content=subscriptionId)
+	meta(name='ol-totalLicenses' data-type='number' content=totalLicenses)
+	meta(name='ol-isProfessional' data-type='boolean' content=isProfessional)
+	meta(
+		name='ol-isCollectionMethodManual'
+		data-type='boolean'
+		content=isCollectionMethodManual
+	)
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		#add-seats-root
diff --git a/services/web/app/views/subscriptions/canceled-subscription-react.pug b/services/web/app/views/subscriptions/canceled-subscription-react.pug
index 653f75c481..a33732e1f6 100644
--- a/services/web/app/views/subscriptions/canceled-subscription-react.pug
+++ b/services/web/app/views/subscriptions/canceled-subscription-react.pug
@@ -1,13 +1,10 @@
 extends ../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/canceled-subscription'
 
 block append meta
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	main.content.content-alt#subscription-canceled-root
+	main#subscription-canceled-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/dashboard-react.pug b/services/web/app/views/subscriptions/dashboard-react.pug
index 388f60c864..854f788b79 100644
--- a/services/web/app/views/subscriptions/dashboard-react.pug
+++ b/services/web/app/views/subscriptions/dashboard-react.pug
@@ -1,36 +1,90 @@
 extends ../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/dashboard'
 
 block head-scripts
-	script(type="text/javascript", nonce=scriptNonce, src="https://js.recurly.com/v4/recurly.js")
+	script(
+		type='text/javascript'
+		nonce=scriptNonce
+		src='https://js.recurly.com/v4/recurly.js'
+	)
 
 block append meta
-	meta(name="ol-subscription" data-type="json" content=personalSubscription)
-	meta(name="ol-userCanExtendTrial" data-type="boolean" content=userCanExtendTrial)
-	meta(name="ol-managedGroupSubscriptions" data-type="json" content=managedGroupSubscriptions)
-	meta(name="ol-memberGroupSubscriptions" data-type="json" content=memberGroupSubscriptions)
-	meta(name="ol-managedInstitutions" data-type="json" content=managedInstitutions)
-	meta(name="ol-managedPublishers" data-type="json" content=managedPublishers)
-	meta(name="ol-planCodesChangingAtTermEnd" data-type="json", content=planCodesChangingAtTermEnd)
-	meta(name="ol-currentInstitutionsWithLicence" data-type="json" content=currentInstitutionsWithLicence)
-	meta(name="ol-hasSubscription" data-type="boolean" content=hasSubscription)
-	meta(name="ol-fromPlansPage" data-type="boolean" content=fromPlansPage)
-	meta(name="ol-plans", data-type="json" content=plans)
-	meta(name="ol-groupSettingsAdvertisedFor", data-type="json" content=groupSettingsAdvertisedFor)
-	meta(name="ol-canUseFlexibleLicensing", data-type="boolean", content=canUseFlexibleLicensing)
-	meta(name="ol-showGroupDiscount", data-type="boolean", content=showGroupDiscount)
-	meta(name="ol-groupSettingsEnabledFor", data-type="json" content=groupSettingsEnabledFor)
-	meta(name="ol-user" data-type="json" content=user)
-	if (personalSubscription && personalSubscription.recurly)
-		meta(name="ol-recurlyApiKey" content=settings.apis.recurly.publicKey)
-		meta(name="ol-recommendedCurrency" content=personalSubscription.recurly.currency)
-		meta(name="ol-groupPlans" data-type="json" content=groupPlans)
+	meta(name='ol-subscription' data-type='json' content=personalSubscription)
+	meta(
+		name='ol-userCanExtendTrial'
+		data-type='boolean'
+		content=userCanExtendTrial
+	)
+	meta(
+		name='ol-managedGroupSubscriptions'
+		data-type='json'
+		content=managedGroupSubscriptions
+	)
+	meta(
+		name='ol-memberGroupSubscriptions'
+		data-type='json'
+		content=memberGroupSubscriptions
+	)
+	meta(
+		name='ol-managedInstitutions'
+		data-type='json'
+		content=managedInstitutions
+	)
+	meta(name='ol-managedPublishers' data-type='json' content=managedPublishers)
+	meta(
+		name='ol-planCodesChangingAtTermEnd'
+		data-type='json'
+		content=planCodesChangingAtTermEnd
+	)
+	meta(
+		name='ol-currentInstitutionsWithLicence'
+		data-type='json'
+		content=currentInstitutionsWithLicence
+	)
+	meta(name='ol-hasSubscription' data-type='boolean' content=hasSubscription)
+	meta(name='ol-fromPlansPage' data-type='boolean' content=fromPlansPage)
+	meta(name='ol-plans' data-type='json' content=plans)
+	meta(
+		name='ol-groupSettingsAdvertisedFor'
+		data-type='json'
+		content=groupSettingsAdvertisedFor
+	)
+	meta(
+		name='ol-canUseFlexibleLicensing'
+		data-type='boolean'
+		content=canUseFlexibleLicensing
+	)
+	meta(
+		name='ol-showGroupDiscount'
+		data-type='boolean'
+		content=showGroupDiscount
+	)
+	meta(
+		name='ol-groupSettingsEnabledFor'
+		data-type='json'
+		content=groupSettingsEnabledFor
+	)
+	meta(
+		name='ol-hasAiAssistViaWritefull'
+		data-type='boolean'
+		content=hasAiAssistViaWritefull
+	)
+	meta(
+		name='ol-aiAssistViaWritefullSource'
+		data-type='string'
+		content=aiAssistViaWritefullSource
+	)
+	meta(name='ol-user' data-type='json' content=user)
+	if personalSubscription && personalSubscription.payment
+		meta(name='ol-recurlyApiKey' content=settings.apis.recurly.publicKey)
+		meta(
+			name='ol-recommendedCurrency'
+			content=personalSubscription.payment.currency
+		)
+		meta(name='ol-groupPlans' data-type='json' content=groupPlans)
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		#subscription-dashboard-root
diff --git a/services/web/app/views/subscriptions/manually-collected-subscription.pug b/services/web/app/views/subscriptions/manually-collected-subscription.pug
index b0e1db986b..a693ac749f 100644
--- a/services/web/app/views/subscriptions/manually-collected-subscription.pug
+++ b/services/web/app/views/subscriptions/manually-collected-subscription.pug
@@ -1,13 +1,11 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // Enforce BS5 version
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/manually-collected-subscription'
 
 block append meta
-	meta(name="ol-groupName", data-type="string", content=groupName)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-groupName' data-type='string' content=groupName)
 
 block content
-	main.content.content-alt#manually-collected-subscription-root
+	main#manually-collected-subscription-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/missing-billing-information.pug b/services/web/app/views/subscriptions/missing-billing-information.pug
index ddb2ac1693..d0a0e05ae8 100644
--- a/services/web/app/views/subscriptions/missing-billing-information.pug
+++ b/services/web/app/views/subscriptions/missing-billing-information.pug
@@ -1,13 +1,11 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // Enforce BS5 version
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/missing-billing-information'
 
 block append meta
-	meta(name="ol-groupName", data-type="string", content=groupName)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-groupName' data-type='string' content=groupName)
 
 block content
-	main.content.content-alt#missing-billing-information-root
+	main#missing-billing-information-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/plans/_faq_new.pug b/services/web/app/views/subscriptions/plans/_faq_new.pug
index 823931111f..5939ed3545 100644
--- a/services/web/app/views/subscriptions/plans/_faq_new.pug
+++ b/services/web/app/views/subscriptions/plans/_faq_new.pug
@@ -1,5 +1,6 @@
 include ./_plans_faq_tabs
 include ../../_mixins/eyebrow
+include ../../_mixins/material_symbol
 
 - var managingYourSubscription = 'managingYourSubscription'
 - var overleafIndividualPlans = 'overleafIndividualPlans'
@@ -8,58 +9,56 @@ include ../../_mixins/eyebrow
 	.row.row-spaced-extra-large
 		.col-md-12.faq-heading-container
 			h2
-				+eyebrow(translate("frequently_asked_questions"))
+				+eyebrow(translate('frequently_asked_questions'))
 				| #{translate("your_questions_answered")}
 
 	.row
 		.col-xs-12
-			.ol-tabs-scrollable
+			.ol-tabs.plans-faq-tabs
 				.nav-tabs-container
-					ul.nav.nav-tabs(role="tablist")
-						li.active(role="presentation")
-							a(
-								role="tab"
-								data-toggle="tab"
+					ul.nav.nav-tabs(role='tablist')
+						li(role='presentation')
+							a.active(
+								role='tab'
+								data-bs-toggle='tab'
 								href='#' + managingYourSubscription
 								aria-controls=managingYourSubscription
 							)
 								| #{translate('managing_your_subscription')}
-						li(role="presentation")
+						li(role='presentation')
 							a(
-								role="tab"
-								data-toggle="tab"
+								role='tab'
+								data-toggle='tab'
+								data-bs-toggle='tab'
 								href='#' + overleafIndividualPlans
 								aria-controls=overleafIndividualPlans
 							)
 								| #{translate('overleaf_individual_plans')}
-						li(role="presentation")
+						li(role='presentation')
 							a(
-								role="tab"
-								data-toggle="tab"
+								role='tab'
+								data-toggle='tab'
+								data-bs-toggle='tab'
 								href='#' + overleafGroupPlans
 								aria-controls=overleafGroupPlans
 							)
 								| #{translate('overleaf_group_plans')}
 
 				.tab-content
-					.tab-pane.active(
-						role="tabpanel"
-						id=managingYourSubscription
-					)
-						+managingYourSubscription()
-					.tab-pane(
-						role="tabpanel"
-						id=overleafIndividualPlans
-					)
-						+overleafIndividualPlans()
-					.tab-pane(
-						role="tabpanel"
-						id=overleafGroupPlans
-					)
-						+overleafGroupPlans()
+					.tab-pane.active(role='tabpanel' id=managingYourSubscription)
+						+managingYourSubscription
+					.tab-pane(role='tabpanel' id=overleafIndividualPlans)
+						+overleafIndividualPlans
+					.tab-pane(role='tabpanel' id=overleafGroupPlans)
+						+overleafGroupPlans
 
-	.row.plans-faq-support
-		span #{translate('still_have_questions')}
-		button(data-ol-open-contact-form-modal="general")
-			span(style="margin-right: 4px") #{translate('contact_support')}
-			i.icon-md.material-symbols.material-symbols-rounded.material-symbols-arrow-right(aria-hidden="true") arrow_right_alt
+	.row
+		.col-xs-12.plans-faq-support
+			span #{translate('still_have_questions')}
+			button(
+				data-ol-open-contact-form-modal='general'
+				data-bs-toggle='modal'
+				data-bs-target='#contactUsModal'
+			)
+				span(style='margin-right: 4px') #{translate('contact_support')}
+				+material-symbol-rounded('arrow_right_alt', 'icon-md')
diff --git a/services/web/app/views/subscriptions/plans/_plans_faq_tabs.pug b/services/web/app/views/subscriptions/plans/_plans_faq_tabs.pug
index 7f41c4d83e..a2a63b74d9 100644
--- a/services/web/app/views/subscriptions/plans/_plans_faq_tabs.pug
+++ b/services/web/app/views/subscriptions/plans/_plans_faq_tabs.pug
@@ -1,226 +1,334 @@
-mixin managingYourSubscription()
+include ../../_mixins/material_symbol
+
+mixin managingYourSubscription
 	.ol-accordions-container
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#managingYourSubscriptionQ1" aria-expanded="false" aria-controls="managingYourSubscriptionQ1")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#managingYourSubscriptionQ1'
+				aria-expanded='false'
+				aria-controls='managingYourSubscriptionQ1'
+			)
 				| Can I change plans or cancel later?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="managingYourSubscriptionQ1")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='managingYourSubscriptionQ1')
 				.custom-accordion-body
-					span Yes, you can do this at any time by going to 
-					strong Account > Subscription 
+					span Yes, you can do this at any time by going to
+					| &nbsp;
+					strong Account > Subscription
+					| &nbsp;
 					span when logged in to Overleaf. You can change plans, switch between monthly and annual billing options, or cancel to downgrade to the free plan. When canceling, your subscription will continue until the end of the billing period.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#managingYourSubscriptionQ2" aria-expanded="false" aria-controls="managingYourSubscriptionQ2")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#managingYourSubscriptionQ2'
+				aria-expanded='false'
+				aria-controls='managingYourSubscriptionQ2'
+			)
 				| If I change or cancel my Overleaf plan, will I lose my projects?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="managingYourSubscriptionQ2")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='managingYourSubscriptionQ2')
 				.custom-accordion-body
 					| No. Changing or canceling your plan won’t affect your projects, the only change will be to the features available to you. You can see which features are available only on paid plans in the comparison table.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#managingYourSubscriptionQ3" aria-expanded="false" aria-controls="managingYourSubscriptionQ3")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#managingYourSubscriptionQ3'
+				aria-expanded='false'
+				aria-controls='managingYourSubscriptionQ3'
+			)
 				| Can I pay by invoice or purchase order?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="managingYourSubscriptionQ3")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='managingYourSubscriptionQ3')
 				.custom-accordion-body
 					| This is possible when you’re purchasing a group subscription for five or more people, or a site license. For individual subscriptions, we can only accept payment online via credit card, debit card, or PayPal.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#managingYourSubscriptionQ4" aria-expanded="false" aria-controls="managingYourSubscriptionQ4")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#managingYourSubscriptionQ4'
+				aria-expanded='false'
+				aria-controls='managingYourSubscriptionQ4'
+			)
 				| How do I view/update the credit card being charged for my subscription?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="managingYourSubscriptionQ4")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='managingYourSubscriptionQ4')
 				.custom-accordion-body
-					| You can view and update the card on file by going to Account > 
+					span You can view and update the card on file by going to Account >
+					| &nbsp;
 					a.inline-green-link(
-						target="_blank"
-						href="/user/subscription"
-						event-tracking="plans-page-click"
-						event-tracking-mb="true"
-						event-tracking-trigger="click"
-						event-segmentation={ button: 'contact', location: 'faq' }
+						target='_blank'
+						href='/user/subscription'
+						event-tracking='plans-page-click'
+						event-tracking-mb='true'
+						event-tracking-trigger='click'
+						event-segmentation={button: 'contact', location: 'faq'}
 					)
 						span Subscription
 					| .
 
-
-
-
-mixin overleafIndividualPlans()
+mixin overleafIndividualPlans
 	.ol-accordions-container
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ1" aria-expanded="false" aria-controls="overleafIndividualPlansQ1")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ1'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ1'
+			)
 				| How does the free trial work?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ1")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ1')
 				.custom-accordion-body
-					span You get full access to your chosen plan during your 7-day free trial, and there’s no obligation to continue beyond the trial. Your card will be charged at the end of your trial unless you cancel before then. To cancel, go to 
-					strong Account > 
+					span You get full access to your chosen plan during your 7-day free trial, and there’s no obligation to continue beyond the trial. Your card will be charged at the end of your trial unless you cancel before then. To cancel, go to
+					| &nbsp;
+					strong Account >
+						| &nbsp;
 						a.inline-green-link(
-							target="_blank"
-							href="/user/subscription"
-							event-tracking="plans-page-click"
-							event-tracking-mb="true"
-							event-tracking-trigger="click"
-							event-segmentation={ button: 'contact', location: 'faq' }
+							target='_blank'
+							href='/user/subscription'
+							event-tracking='plans-page-click'
+							event-tracking-mb='true'
+							event-tracking-trigger='click'
+							event-segmentation={button: 'contact', location: 'faq'}
 						)
 							span Subscription
-					span  when logged in to Overleaf (the trial will continue for the full 7 days).
+					| &nbsp;
+					span when logged in to Overleaf (the trial will continue for the full 7 days).
 
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ2" aria-expanded="false" aria-controls="overleafIndividualPlansQ2")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ2'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ2'
+			)
 				| What’s a collaborator on an Overleaf individual subscription?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ2")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ2')
 				.custom-accordion-body
-					| A collaborator is someone you invite to work with you on a project. So, for example, on our Standard plan you can have up to 10 people collaborating with you on any given project. 
+					| A collaborator is someone you invite to work with you on a project. So, for example, on our Standard plan you can have up to 10 people collaborating with you on any given project.
 
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ3" aria-expanded="false" aria-controls="overleafIndividualPlansQ3")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ3'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ3'
+			)
 				| The individual Standard plan has 10 project collaborators, does it mean that 10 people will be upgraded?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ3")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ3')
 				.custom-accordion-body
-					span No. Only the subscriber’s account will be upgraded. An individual Standard subscription allows you to invite 10 people per project to edit the project with you. Your collaborators can access features such as the full document history and extended compile time, but 
-					strong only 
+					span No. Only the subscriber’s account will be upgraded. An individual Standard subscription allows you to invite 10 people per project to edit the project with you. Your collaborators can access features such as the full document history and extended compile time, but
+					| &nbsp;
+					strong only
+					| &nbsp;
 					span for the project(s) they’re working on with you. If your collaborators want access to those features on their own projects, they will need to purchase their own subscription. (If you work with the same people regularly, you might find a group subscription more cost effective.)
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ4" aria-expanded="false" aria-controls="overleafIndividualPlansQ4")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ4'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ4'
+			)
 				| Do collaborators also have access to the editing and collaboration features I’ve paid for?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ4")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ4')
 				.custom-accordion-body
-					span If you have an Overleaf subscription, then your project collaborators will have access to features like real-time track changes and document history, but 
-					strong only 
+					span If you have an Overleaf subscription, then your project collaborators will have access to features like real-time track changes and document history, but
+					| &nbsp;
+					strong only
+					| &nbsp;
 					span for the project(s) they’re working on with you. If your collaborators want access to those features on their own projects, they will need to purchase their own subscription. (If you work with the same people regularly, you might find a group subscription more cost effective.)
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ5" aria-expanded="false" aria-controls="overleafIndividualPlansQ5")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ5'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ5'
+			)
 				| Can I purchase an individual plan on behalf of someone else?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ5")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ5')
 				.custom-accordion-body
-					| Individual subscriptions must be purchased by the account that will be the end user. If you want to purchase a plan for someone else, you’ll need to provide them with relevant payment details to enable them to make the purchase. 
+					| Individual subscriptions must be purchased by the account that will be the end user. If you want to purchase a plan for someone else, you’ll need to provide them with relevant payment details to enable them to make the purchase.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ6" aria-expanded="false" aria-controls="overleafIndividualPlansQ6")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ6'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ6'
+			)
 				| Who is eligible for the Student plan?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ6")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ6')
 				.custom-accordion-body
 					| As the name suggests, the Student plan is only for students at educational institutions. This includes graduate students.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafIndividualPlansQ7" aria-expanded="false" aria-controls="overleafIndividualPlansQ7")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafIndividualPlansQ7'
+				aria-expanded='false'
+				aria-controls='overleafIndividualPlansQ7'
+			)
 				| Can I transfer an individual subscription to someone else?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafIndividualPlansQ7")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafIndividualPlansQ7')
 				.custom-accordion-body
-					| No. Individual plans can’t be transferred. 
+					| No. Individual plans can’t be transferred.
 
-
-
-
-
-mixin overleafGroupPlans()
+mixin overleafGroupPlans
 	.ol-accordions-container
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafGroupPlansQ1" aria-expanded="false" aria-controls="overleafGroupPlansQ1")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafGroupPlansQ1'
+				aria-expanded='false'
+				aria-controls='overleafGroupPlansQ1'
+			)
 				| What’s the difference between users and collaborators on an Overleaf group subscription?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafGroupPlansQ1")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafGroupPlansQ1')
 				.custom-accordion-body
-					div On any of our group plans, the number of users refers to the number of people you can invite to join your group. All of these people will have access to the plan’s paid-for features across all their projects, such as real-time track changes and document history. 
-					div.mt-2 Collaborators are people that your group users may invite to work with them on their projects. So, for example, if you have the Group Standard plan, the users in your group can invite up to 10 people to work with them on a project. And if you have the Group Professional plan, your users can invite as many people to work with them as they want.
+					div On any of our group plans, the number of users refers to the number of people you can invite to join your group. All of these people will have access to the plan’s paid-for features across all their projects, such as real-time track changes and document history.
+					.mt-2 Collaborators are people that your group users may invite to work with them on their projects. So, for example, if you have the Group Standard plan, the users in your group can invite up to 10 people to work with them on a project. And if you have the Group Professional plan, your users can invite as many people to work with them as they want.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafGroupPlansQ2" aria-expanded="false" aria-controls="overleafGroupPlansQ2")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafGroupPlansQ2'
+				aria-expanded='false'
+				aria-controls='overleafGroupPlansQ2'
+			)
 				| What is the benefit of purchasing an Overleaf Group plan?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafGroupPlansQ2")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafGroupPlansQ2')
 				.custom-accordion-body
-					| Our Group subscriptions allow you to purchase access to our premium features for multiple people. They’re easy to manage, help save on paperwork, and allow groups of 5 or more to purchase via purchase order (PO). We also offer discounts on purchases of Group subscriptions for more than 20 users; just get in touch with our 
+					span Our Group subscriptions allow you to purchase access to our premium features for multiple people. They’re easy to manage, help save on paperwork, and allow groups of 5 or more to purchase via purchase order (PO). We also offer discounts on purchases of Group subscriptions for more than 20 users; just get in touch with our
+					| &nbsp;
 					a.inline-green-link(
-						target="_blank"
-						href="/for/contact-sales"
-						event-tracking="plans-page-click"
-						event-tracking-mb="true"
-						event-tracking-trigger="click"
-						event-segmentation={ button: 'contact', location: 'faq' }
+						target='_blank'
+						href='/for/contact-sales'
+						event-tracking='plans-page-click'
+						event-tracking-mb='true'
+						event-tracking-trigger='click'
+						event-segmentation={button: 'contact', location: 'faq'}
 					)
 						span Sales team
 					| .
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafGroupPlansQ3" aria-expanded="false" aria-controls="overleafGroupPlansQ3")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafGroupPlansQ3'
+				aria-expanded='false'
+				aria-controls='overleafGroupPlansQ3'
+			)
 				| Who is eligible for the educational discount?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafGroupPlansQ3")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafGroupPlansQ3')
 				.custom-accordion-body
-					| The educational discount for group subscriptions is for students or faculty who are using Overleaf primarily for teaching. 
+					| The educational discount for group subscriptions is for students or faculty who are using Overleaf primarily for teaching.
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafGroupPlansQ4" aria-expanded="false" aria-controls="overleafGroupPlansQ4")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafGroupPlansQ4'
+				aria-expanded='false'
+				aria-controls='overleafGroupPlansQ4'
+			)
 				| How do I add more licenses to my group subscription, and what will it cost?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafGroupPlansQ4")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafGroupPlansQ4')
 				.custom-accordion-body
-					div 
-						| You can add up to 20 licenses using the 
+					div
+						span You can add up to 20 licenses using the
+						| &nbsp;
 						a.inline-green-link(
-							target="_blank"
-							href="/user/subscription"
-							event-tracking="plans-page-click"
-							event-tracking-mb="true"
-							event-tracking-trigger="click"
-							event-segmentation={ button: 'contact', location: 'faq' }
+							target='_blank'
+							href='/user/subscription'
+							event-tracking='plans-page-click'
+							event-tracking-mb='true'
+							event-tracking-trigger='click'
+							event-segmentation={button: 'contact', location: 'faq'}
 						)
 							span subscription management page
-						|  accessed by going to Account > 
+						| &nbsp;
+						span accessed by going to Account >
+						| &nbsp;
 						a.inline-green-link(
-							target="_blank"
-							href="/user/subscription"
-							event-tracking="plans-page-click"
-							event-tracking-mb="true"
-							event-tracking-trigger="click"
-							event-segmentation={ button: 'contact', location: 'faq' }
+							target='_blank'
+							href='/user/subscription'
+							event-tracking='plans-page-click'
+							event-tracking-mb='true'
+							event-tracking-trigger='click'
+							event-segmentation={button: 'contact', location: 'faq'}
 						)
 							span Subscription
-						|  when logged into Overleaf. The cost per license will be prorated at the current per license rate, and will end with your existing renewal date.
-					div.mt-2 
-						| If you need more than 20 licenses added to your subscription, please 
+						| &nbsp;
+						span when logged into Overleaf. The cost per license will be prorated at the current per license rate, and will end with your existing renewal date.
+					.mt-2
+						span If you need more than 20 licenses added to your subscription, please
+						| &nbsp;
 						a.inline-green-link(
-							target="_blank"
-							href="/for/contact-sales"
-							event-tracking="plans-page-click"
-							event-tracking-mb="true"
-							event-tracking-trigger="click"
-							event-segmentation={ button: 'contact', location: 'faq' }
+							target='_blank'
+							href='/for/contact-sales'
+							event-tracking='plans-page-click'
+							event-tracking-mb='true'
+							event-tracking-trigger='click'
+							event-segmentation={button: 'contact', location: 'faq'}
 						)
 							span contact the Sales team
 						| .
 		.custom-accordion-item
-			button.custom-accordion-header.collapsed(type="button" data-toggle="collapse" data-target="#overleafGroupPlansQ5" aria-expanded="false" aria-controls="overleafGroupPlansQ5")
+			button.custom-accordion-header.collapsed(
+				type='button'
+				data-bs-toggle='collapse'
+				data-bs-target='#overleafGroupPlansQ5'
+				aria-expanded='false'
+				aria-controls='overleafGroupPlansQ5'
+			)
 				| How do I upgrade my plan from Group Standard to Group Professional?
 				span.custom-accordion-icon
-					i.material-symbols.material-symbols-outlined(aria-hidden="true") keyboard_arrow_down
-			.collapse(id="overleafGroupPlansQ5")
+					+material-symbol-outlined('keyboard_arrow_down')
+			.collapse(id='overleafGroupPlansQ5')
 				.custom-accordion-body
-					| You can upgrade your plan from Group Standard to Group Professional on the 
+					span You can upgrade your plan from Group Standard to Group Professional on the
+					| &nbsp;
 					a.inline-green-link(
-						target="_blank"
-						href="/user/subscription"
-						event-tracking="plans-page-click"
-						event-tracking-mb="true"
-						event-tracking-trigger="click"
-						event-segmentation={ button: 'contact', location: 'faq' }
+						target='_blank'
+						href='/user/subscription'
+						event-tracking='plans-page-click'
+						event-tracking-mb='true'
+						event-tracking-trigger='click'
+						event-segmentation={button: 'contact', location: 'faq'}
 					)
 						span subscription management page
 					| .
diff --git a/services/web/app/views/subscriptions/preview-change.pug b/services/web/app/views/subscriptions/preview-change.pug
index 320d4d7bdc..2eaca5ac6a 100644
--- a/services/web/app/views/subscriptions/preview-change.pug
+++ b/services/web/app/views/subscriptions/preview-change.pug
@@ -1,14 +1,17 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled'
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/preview-change'
 
 block append meta
-	meta(name="ol-subscriptionChangePreview" data-type="json" content=changePreview)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(
+		name='ol-subscriptionChangePreview'
+		data-type='json'
+		content=changePreview
+	)
+	meta(name='ol-purchaseReferrer' data-type='string' content=purchaseReferrer)
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		#subscription-preview-change
diff --git a/services/web/app/views/subscriptions/subtotal-limit-exceeded.pug b/services/web/app/views/subscriptions/subtotal-limit-exceeded.pug
index bdbad595ee..df734232d6 100644
--- a/services/web/app/views/subscriptions/subtotal-limit-exceeded.pug
+++ b/services/web/app/views/subscriptions/subtotal-limit-exceeded.pug
@@ -1,13 +1,11 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // Enforce BS5 version
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/subtotal-limit-exceeded'
 
 block append meta
-	meta(name="ol-groupName", data-type="string", content=groupName)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-groupName' data-type='string' content=groupName)
 
 block content
-	main.content.content-alt#subtotal-limit-exceeded-root
+	main#subtotal-limit-exceeded-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/successful-subscription-react.pug b/services/web/app/views/subscriptions/successful-subscription-react.pug
index e7599e816a..9437b93b67 100644
--- a/services/web/app/views/subscriptions/successful-subscription-react.pug
+++ b/services/web/app/views/subscriptions/successful-subscription-react.pug
@@ -1,15 +1,12 @@
 extends ../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/successful-subscription'
 
 block append meta
-	meta(name="ol-subscription" data-type="json" content=personalSubscription)
-	meta(name="ol-postCheckoutRedirect" content=postCheckoutRedirect)
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-subscription' data-type='json' content=personalSubscription)
+	meta(name='ol-postCheckoutRedirect' content=postCheckoutRedirect)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	main.content.content-alt#subscription-success-root
+	main#subscription-success-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/team/group-invites.pug b/services/web/app/views/subscriptions/team/group-invites.pug
index cef44909eb..18286fd403 100644
--- a/services/web/app/views/subscriptions/team/group-invites.pug
+++ b/services/web/app/views/subscriptions/team/group-invites.pug
@@ -1,14 +1,11 @@
 extends ../../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-invites'
 
 block append meta
-	meta(name="ol-teamInvites" data-type="json" content=teamInvites)
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-teamInvites' data-type='json' content=teamInvites)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	main.content.content-alt.team-invite#group-invites-root
+	main#group-invites-root.content.content-alt.team-invite
diff --git a/services/web/app/views/subscriptions/team/invite-managed.pug b/services/web/app/views/subscriptions/team/invite-managed.pug
index 78599efb91..4010731c3f 100644
--- a/services/web/app/views/subscriptions/team/invite-managed.pug
+++ b/services/web/app/views/subscriptions/team/invite-managed.pug
@@ -1,21 +1,23 @@
 extends ../../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/invite-managed'
 
 block append meta
-	meta(name="ol-inviteToken" content=inviteToken)
-	meta(name="ol-inviterName" content=inviterName)
-	meta(name="ol-expired" data-type="boolean" content=expired)
-	meta(name="ol-alreadyEnrolled" data-type="boolean" content=alreadyEnrolled)
-	meta(name="ol-validationStatus" data-type="json" content=validationStatus)
-	meta(name="ol-currentManagedUserAdminEmail" data-type="string" content=currentManagedUserAdminEmail)
-	meta(name="ol-groupSSOActive" data-type="boolean" content=groupSSOActive)
-	meta(name="ol-subscriptionId" data-type="string" content=subscriptionId)
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-inviteToken' content=inviteToken)
+	meta(name='ol-inviterName' content=inviterName)
+	meta(name='ol-expired' data-type='boolean' content=expired)
+	meta(name='ol-alreadyEnrolled' data-type='boolean' content=alreadyEnrolled)
+	meta(name='ol-validationStatus' data-type='json' content=validationStatus)
+	meta(
+		name='ol-currentManagedUserAdminEmail'
+		data-type='string'
+		content=currentManagedUserAdminEmail
+	)
+	meta(name='ol-groupSSOActive' data-type='boolean' content=groupSSOActive)
+	meta(name='ol-subscriptionId' data-type='string' content=subscriptionId)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-usersSubscription' data-type='json' content=usersSubscription)
 
 block content
-	main.content.content-alt.team-invite#invite-managed-root
+	main#invite-managed-root.content.content-alt.team-invite
diff --git a/services/web/app/views/subscriptions/team/invite.pug b/services/web/app/views/subscriptions/team/invite.pug
index 75fd131ae2..717ccef611 100644
--- a/services/web/app/views/subscriptions/team/invite.pug
+++ b/services/web/app/views/subscriptions/team/invite.pug
@@ -1,20 +1,25 @@
 extends ../../layout-react
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/invite'
 
 block append meta
-	meta(name="ol-hasIndividualRecurlySubscription" data-type="boolean" content=hasIndividualRecurlySubscription)
-	meta(name="ol-inviterName" data-type="string" content=inviterName)
-	meta(name="ol-inviteToken" data-type="string" content=inviteToken)
-	meta(name="ol-currentManagedUserAdminEmail" data-type="string" content=currentManagedUserAdminEmail)
-	meta(name="ol-expired" data-type="boolean" content=expired)
-	meta(name="ol-groupSSOActive" data-type="boolean" content=groupSSOActive)
-	meta(name="ol-subscriptionId" data-type="string" content=subscriptionId)
-	meta(name="ol-user" data-type="json" content=user)
+	meta(
+		name='ol-hasIndividualPaidSubscription'
+		data-type='boolean'
+		content=hasIndividualPaidSubscription
+	)
+	meta(name='ol-inviterName' data-type='string' content=inviterName)
+	meta(name='ol-inviteToken' data-type='string' content=inviteToken)
+	meta(
+		name='ol-currentManagedUserAdminEmail'
+		data-type='string'
+		content=currentManagedUserAdminEmail
+	)
+	meta(name='ol-expired' data-type='boolean' content=expired)
+	meta(name='ol-groupSSOActive' data-type='boolean' content=groupSSOActive)
+	meta(name='ol-subscriptionId' data-type='string' content=subscriptionId)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	main.content.content-alt#invite-root
+	main#invite-root.content.content-alt
diff --git a/services/web/app/views/subscriptions/team/invite_logged_out.pug b/services/web/app/views/subscriptions/team/invite_logged_out.pug
index e994a6ce24..3e471fb4c9 100644
--- a/services/web/app/views/subscriptions/team/invite_logged_out.pug
+++ b/services/web/app/views/subscriptions/team/invite_logged_out.pug
@@ -1,15 +1,12 @@
-extends ../../layout-react
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+extends ../../layout-marketing
 
 block append meta
-	meta(name="ol-user" data-type="json" content=user)
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
 	- var colClass = bootstrapVersion === 5 ? 'col-lg-8 m-auto' : 'col-md-8 col-md-offset-2'
 
-	main.content.content-alt.team-invite#main-content
+	main#main-content.content.content-alt.team-invite
 		.container
 			.row
 				div(class=colClass)
@@ -17,17 +14,21 @@ block content
 						.card-body
 							.page-header
 								// TODO: Remove `team-invite-name` once we fully migrated to Bootstrap 5
-								h1.text-centered !{translate("invited_to_group", {inviterName: inviterName, appName: appName }, [{name: 'span', attrs: {class: 'team-invite-name'}}])}
+								h1.text-center !{translate("invited_to_group", {inviterName: inviterName, appName: appName }, [{name: 'span', attrs: {class: 'team-invite-name'}}])}
 
-							if (accountExists)
+							if accountExists
 								div
 									p #{translate("invited_to_group_login_benefits", {appName: appName})}
 									p #{translate("invited_to_group_login", {emailAddress: emailAddress})}
 									p
-										a.btn.btn-primary(href=`/login?redir=/subscription/invites/${inviteToken}${groupSSOActive ? "&hide_sso_login=true" : ""}`) #{translate("login_to_accept_invitation")}
+										a.btn.btn-primary(
+											href=`/login?redir=/subscription/invites/${inviteToken}${groupSSOActive ? "&hide_sso_login=true" : ""}`
+										) #{translate("login_to_accept_invitation")}
 							else
 								div
 									p #{translate("invited_to_group_register_benefits", {appName: appName})}
 									p #{translate("invited_to_group_register", {inviterName: inviterName})}
 									p
-										a.btn.btn-primary(href=`/register?redir=/subscription/invites/${inviteToken}${groupSSOActive ? "&hide_sso_login=true" : ""}`) #{translate("register_to_accept_invitation")}
+										a.btn.btn-primary(
+											href=`/register?redir=/subscription/invites/${inviteToken}${groupSSOActive ? "&hide_sso_login=true" : ""}`
+										) #{translate("register_to_accept_invitation")}
diff --git a/services/web/app/views/subscriptions/upgrade-group-subscription-react.pug b/services/web/app/views/subscriptions/upgrade-group-subscription-react.pug
index 4ac2999ee5..0c7f4ce993 100644
--- a/services/web/app/views/subscriptions/upgrade-group-subscription-react.pug
+++ b/services/web/app/views/subscriptions/upgrade-group-subscription-react.pug
@@ -1,15 +1,17 @@
-extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'enabled' // Enforce BS5 version
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/upgrade-group-subscription'
 
 block append meta
-	meta(name="ol-subscriptionChangePreview" data-type="json" content=changePreview)
-	meta(name="ol-totalLicenses", data-type="number", content=totalLicenses)
-	meta(name="ol-groupName", data-type="string", content=groupName)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(
+		name='ol-subscriptionChangePreview'
+		data-type='json'
+		content=changePreview
+	)
+	meta(name='ol-totalLicenses' data-type='number' content=totalLicenses)
+	meta(name='ol-groupName' data-type='string' content=groupName)
 
 block content
-	main.content.content-alt#upgrade-group-subscription-root
+	main#upgrade-group-subscription-root.content.content-alt
diff --git a/services/web/app/views/template_gallery/template-gallery.pug b/services/web/app/views/template_gallery/template-gallery.pug
new file mode 100644
index 0000000000..3838d30606
--- /dev/null
+++ b/services/web/app/views/template_gallery/template-gallery.pug
@@ -0,0 +1,18 @@
+extends ../layout-react
+
+block entrypointVar
+	- entrypoint = 'pages/template-gallery'
+
+block vars
+block vars
+	- const suppressNavContentLinks = true
+	- const suppressNavbar = true
+	- const suppressFooter = true
+	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+	- isWebsiteRedesign = false
+
+block append meta
+	meta(name="ol-templateCategory" data-type="string" content=category)
+
+block content
+	#template-gallery-root
diff --git a/services/web/app/views/template_gallery/template.pug b/services/web/app/views/template_gallery/template.pug
new file mode 100644
index 0000000000..e56fd8d2e5
--- /dev/null
+++ b/services/web/app/views/template_gallery/template.pug
@@ -0,0 +1,20 @@
+extends ../layout-react
+
+block entrypointVar
+	- entrypoint = 'pages/template'
+
+block vars
+	- const suppressNavContentLinks = true
+	- const suppressNavbar = true
+	- const suppressFooter = true
+	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
+	- isWebsiteRedesign = false
+
+block append meta
+	meta(name="ol-template" data-type="json" content=template)
+	meta(name="ol-languages" data-type="json" content=languages)
+	meta(name="ol-userIsAdmin" data-type="boolean" content=hasAdminAccess())
+
+block content
+	#template-root
+
diff --git a/services/web/app/views/user/accountSuspended.pug b/services/web/app/views/user/accountSuspended.pug
index da57f4d9ff..1a03beb4df 100644
--- a/services/web/app/views/user/accountSuspended.pug
+++ b/services/web/app/views/user/accountSuspended.pug
@@ -4,12 +4,12 @@ block vars
 	- var suppressNavbar = true
 	- var suppressFooter = true
 	- metadata.robotsNoindexNofollow = true
-	- bootstrap5PageStatus = 'disabled'
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container-custom-sm.mx-auto
 			.card
-				h3 #{translate('your_account_is_suspended')}
-				p #{translate('sorry_this_account_has_been_suspended')}
-				p !{translate('please_contact_us_if_you_think_this_is_in_error', {}, [{name: 'a', attrs: {href: `mailto:${settings.adminEmail}`}}])}
+				.card-body
+					h3 #{translate('your_account_is_suspended')}
+					p #{translate('sorry_this_account_has_been_suspended')}
+					p !{translate('please_contact_us_if_you_think_this_is_in_error', {}, [{name: 'a', attrs: {href: `mailto:${settings.adminEmail}`}}])}
diff --git a/services/web/app/views/user/addSecondaryEmail.pug b/services/web/app/views/user/addSecondaryEmail.pug
index 68c506c977..8f38df96aa 100644
--- a/services/web/app/views/user/addSecondaryEmail.pug
+++ b/services/web/app/views/user/addSecondaryEmail.pug
@@ -3,7 +3,6 @@ extends ../layout-react
 block vars
 	- var suppressNavbar = true
 	- var suppressSkipToContent = true
-	- bootstrap5PageStatus = 'enabled'
 
 block entrypointVar
 	- entrypoint = 'pages/user/add-secondary-email'
diff --git a/services/web/app/views/user/compromised_password.pug b/services/web/app/views/user/compromised_password.pug
index 27b85b718a..ccf32fc757 100644
--- a/services/web/app/views/user/compromised_password.pug
+++ b/services/web/app/views/user/compromised_password.pug
@@ -1,15 +1,13 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block vars
 	- var suppressNavbar = true
 	- var suppressFooter = true
-	- var suppressGoogleAnalytics = true
-	- bootstrap5PageStatus = 'enabled'
-	- bootstrap5PageSplitTest = 'bs5-misc-pages-platform'
+	- var suppressAnalytics = true
 
 block entrypointVar
 	- entrypoint = 'pages/compromised-password'
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		#compromised-password
diff --git a/services/web/app/views/user/confirmSecondaryEmail.pug b/services/web/app/views/user/confirmSecondaryEmail.pug
index 95927f2f05..4f143c16dc 100644
--- a/services/web/app/views/user/confirmSecondaryEmail.pug
+++ b/services/web/app/views/user/confirmSecondaryEmail.pug
@@ -1,15 +1,14 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block vars
 	- var suppressNavbar = true
 	- var suppressSkipToContent = true
-	- bootstrap5PageStatus = 'enabled'
 
 block entrypointVar
 	- entrypoint = 'pages/user/confirm-secondary-email'
 
 block append meta
-	meta(name="ol-email" content=email)
+	meta(name='ol-email' content=email)
 
 block content
 	main.content.content-alt
diff --git a/services/web/app/views/user/confirm_email.pug b/services/web/app/views/user/confirm_email.pug
index 37c04880b1..d783996076 100644
--- a/services/web/app/views/user/confirm_email.pug
+++ b/services/web/app/views/user/confirm_email.pug
@@ -1,60 +1,51 @@
 extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'disabled'
+include ../_mixins/notification
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-8.col-md-offset-2.col-lg-6.col-lg-offset-3
+				.col-lg-8.offset-lg-2.col-xl-6.offset-xl-3
 					.card
-						.page-header(data-ol-hide-on-error-message="confirm-email-wrong-user")
-							h1 #{translate("confirm_email")}
-						form(
-							method="POST"
-							action="/logout"
-							id="logoutForm"
-						)
-							input(type="hidden", name="_csrf", value=csrfToken)
-							input(type="hidden", name="redirect", value=currentUrlWithQueryParams)
-						form(
-							data-ol-async-form,
-							data-ol-auto-submit,
-							name="confirmEmailForm"
-							action="/user/emails/confirm",
-							method="POST",
-							id="confirmEmailForm",
-						)
-							input(type="hidden", name="_csrf", value=csrfToken)
-							input(type="hidden", name="token", value=token)
+						.card-body
+							.page-header(data-ol-hide-on-error-message='confirm-email-wrong-user')
+								h1 #{translate("confirm_email")}
+							form(method='POST' action='/logout' id='logoutForm')
+								input(name='_csrf' type='hidden' value=csrfToken)
+								input(name='redirect' type='hidden' value=currentUrlWithQueryParams)
+							form(
+								name='confirmEmailForm'
+								data-ol-async-form
+								data-ol-auto-submit
+								action='/user/emails/confirm'
+								method='POST'
+								id='confirmEmailForm'
+							)
+								input(name='_csrf' type='hidden' value=csrfToken)
+								input(name='token' type='hidden' value=token)
+
+								div(data-ol-not-sent)
+									+formMessages
+									div(data-ol-custom-form-message='confirm-email-wrong-user' hidden)
+										h1.h3 #{translate("we_cant_confirm_this_email")}
+										p !{translate("to_confirm_email_address_you_must_be_logged_in_with_the_requesting_account")}
+										p !{translate("you_are_currently_logged_in_as", {email: getUserEmail()})}
+										.actions
+											button.btn-primary.btn.w-100(form='logoutForm') #{translate('log_in_with_a_different_account')}
 
-							div(data-ol-not-sent)
-								+formMessages()
-								div(data-ol-custom-form-message="confirm-email-wrong-user" hidden)
-									h1.h3 #{translate("we_cant_confirm_this_email")}
-									p !{translate("to_confirm_email_address_you_must_be_logged_in_with_the_requesting_account")}
-									p !{translate("you_are_currently_logged_in_as", {email: getUserEmail()})}
 									.actions
-										button.btn-primary.btn.btn-block(
-											form="logoutForm"
-										) #{translate('log_in_with_a_different_account')}
+										button.btn-primary.btn.w-100(
+											type='submit'
+											data-ol-disabled-inflight
+											data-ol-hide-on-error-message='confirm-email-wrong-user'
+										)
+											span(data-ol-inflight='idle')
+												| #{translate('confirm')}
+											span(hidden data-ol-inflight='pending')
+												span.spinner-border.spinner-border-sm.mx-2(role='status')
 
-								.actions
-									button.btn-primary.btn.btn-block(
-										type='submit',
-										data-ol-disabled-inflight
-										data-ol-hide-on-error-message="confirm-email-wrong-user"
-									)
-										span(data-ol-inflight="idle")
-											| #{translate('confirm')}
-										span(hidden data-ol-inflight="pending")
-											i.fa.fa-fw.fa-spin.fa-spinner(aria-hidden="true")
-											| &nbsp;#{translate('confirming')}… 
-
-							div(hidden data-ol-sent)
-								.alert.alert-success
-									| #{translate('thank_you_email_confirmed')}
-								div.text-center
-									a.btn.btn-primary(href="/user/settings")
-										| #{translate('go_to_account_settings')}
+								div(hidden data-ol-sent)
+									+notification({ariaLive: 'polite', type: 'success', className: 'mb-3', content: translate('thank_you_email_confirmed')})
+									.text-center
+										a.btn.btn-primary(href='/user/settings')
+											| #{translate('go_to_account_settings')}
diff --git a/services/web/app/views/user/email-preferences.pug b/services/web/app/views/user/email-preferences.pug
index 465ffede37..2071f64705 100644
--- a/services/web/app/views/user/email-preferences.pug
+++ b/services/web/app/views/user/email-preferences.pug
@@ -1,49 +1,47 @@
 extends ../layout-marketing
 include ../_mixins/back_to_btns
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
+				.col-lg-10.offset-lg-1.col-xl-8.offset-xl-2
 					.card
-						.page-header
-							h1 #{translate("newsletter_info_title")}
+						.card-body
+							.page-header
+								h1 #{translate("newsletter_info_title")}
 
-						p #{translate("newsletter_info_summary")}
+							p #{translate("newsletter_info_summary")}
 
-						- var submitAction
-						if subscribed
-							- submitAction = '/user/newsletter/unsubscribe'
-							p !{translate("newsletter_info_subscribed", {}, ['strong'])}
-						else
-							- submitAction = '/user/newsletter/subscribe'
-							p !{translate("newsletter_info_unsubscribed", {}, ['strong'])}
+							- var submitAction
+							if subscribed
+								- submitAction = '/user/newsletter/unsubscribe'
+								p !{translate("newsletter_info_subscribed", {}, ['strong'])}
+							else
+								- submitAction = '/user/newsletter/subscribe'
+								p !{translate("newsletter_info_unsubscribed", {}, ['strong'])}
 
-						form(
-							data-ol-async-form
-							data-ol-reload-on-success
-							name="newsletterForm"
-							action=submitAction
-							method="POST"
-						)
-							input(name='_csrf', type='hidden', value=csrfToken)
-							+formMessages()
-							p.actions.text-center
-								if subscribed
-									button.btn-danger.btn(type='submit', data-ol-disabled-inflight)
-										span(data-ol-inflight="idle") #{translate("unsubscribe")}
-										span(hidden data-ol-inflight="pending") #{translate("saving")}…
-								else
-									button.btn-primary.btn(type='submit', data-ol-disabled-inflight)
-										span(data-ol-inflight="idle") #{translate("subscribe")}
-										span(hidden data-ol-inflight="pending") #{translate("saving")}…
+							form(
+								name='newsletterForm'
+								data-ol-async-form
+								data-ol-reload-on-success
+								action=submitAction
+								method='POST'
+							)
+								input(name='_csrf' type='hidden' value=csrfToken)
+								+formMessages
+								p.actions.text-center
+									if subscribed
+										button.btn-danger.btn(type='submit' data-ol-disabled-inflight)
+											span(data-ol-inflight='idle') #{translate("unsubscribe")}
+											span(hidden data-ol-inflight='pending') #{translate("saving")}…
+									else
+										button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+											span(data-ol-inflight='idle') #{translate("subscribe")}
+											span(hidden data-ol-inflight='pending') #{translate("saving")}…
 
-						if subscribed
-							p #{translate("newsletter_info_note")}
+							if subscribed
+								p #{translate("newsletter_info_note")}
 
-						.page-separator
-						+back-to-btns()
+							.page-separator
+							+back-to-btns
diff --git a/services/web/app/views/user/login.pug b/services/web/app/views/user/login.pug
index 9185b0b14b..907e45dbb7 100644
--- a/services/web/app/views/user/login.pug
+++ b/services/web/app/views/user/login.pug
@@ -1,52 +1,64 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-6.col-md-offset-3.col-lg-4.col-lg-offset-4
+				.col-lg-6.offset-lg-3.col-xl-4.offset-xl-4
 					.card
-						.page-header
-							if login_support_title
-								h1 !{login_support_title}
-							else
-								h1 #{translate("log_in")}					
-						form(data-ol-async-form, name="loginForm", action='/login', method="POST")
-							input(name='_csrf', type='hidden', value=csrfToken)
-							+formMessages()
-							+customFormMessage('invalid-password-retry-or-reset', 'danger')
-								| !{translate('email_or_password_wrong_try_again_or_reset', {}, [{ name: 'a', attrs: { href: '/user/password/reset', 'aria-describedby': 'resetPasswordDescription' } }])}
-								span.sr-only(id='resetPasswordDescription')
-									| #{translate('reset_password_link')}
-							+customValidationMessage('password-compromised')
-								| !{translate('password_compromised_try_again_or_use_known_device_or_reset', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}, {name: 'a', attrs: {href: '/user/password/reset', target: '_blank'}}])}.
-							.form-group
-								input.form-control(
-									type='email',
-									name='email',
-									required,
-									placeholder='email@example.com',
-									autofocus="true"
-								)
-							.form-group
-								input.form-control(
-									type='password',
-									name='password',
-									required,
-									placeholder='********',
-								)
-							.actions
-								button.btn-primary.btn(
-									type='submit',
-									data-ol-disabled-inflight
-								)
-									span(data-ol-inflight="idle") #{translate("login")}
-									span(hidden data-ol-inflight="pending") #{translate("logging_in")}…
-								a.pull-right(href='/user/password/reset') #{translate("forgot_your_password")}?
-							if login_support_text
-								hr
-								p.text-center !{login_support_text}	
-	
+						.card-body
+							.page-header
+								if login_support_title
+									h1 !{login_support_title}
+								else
+									h1 #{translate("log_in")} 
+							form(name='loginForm' data-ol-async-form action='/login' method='POST')
+								input(name='_csrf' type='hidden' value=csrfToken)
+								+formMessagesNewStyle
+								+customFormMessageNewStyle('invalid-password-retry-or-reset', 'danger')
+									| !{translate('email_or_password_wrong_try_again_or_reset', {}, [{ name: 'a', attrs: { href: '/user/password/reset', 'aria-describedby': 'resetPasswordDescription' } }])}
+									span.visually-hidden(id='resetPasswordDescription')
+										| #{translate('reset_password_link')}
+								+customFormMessageNewStyle('password-compromised')
+									| !{translate('password_compromised_try_again_or_use_known_device_or_reset', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}, {name: 'a', attrs: {href: '/user/password/reset', target: '_blank'}}])}.
+								.form-group
+									input.form-control(
+										name='email'
+										type=(settings.ldap && settings.ldap.enable) ? 'text' : 'email'
+										required
+										placeholder=(settings.ldap && settings.ldap.enable) ? settings.ldap.placeholder : 'email@example.com'
+										autofocus='true'
+									)
+								.form-group
+									input.form-control(
+										name='password'
+										type='password'
+										required
+										placeholder='********'
+									)
+								.actions
+									button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+										span(data-ol-inflight='idle') #{translate("login")}
+										span(hidden data-ol-inflight='pending') #{translate("logging_in")}…
+									a.float-end(href='/user/password/reset') #{translate("forgot_your_password")}?
+								if login_support_text
+									hr
+									p.text-center !{login_support_text}
+							if settings.saml && settings.saml.enable
+								.actions(style='margin-top: 30px;')
+									a.button.btn-secondary.btn(
+									href='/saml/login',
+										style="width: 100%;"
+										data-ol-disabled-inflight
+									)
+										span(data-ol-inflight="idle") #{settings.saml.identityServiceName}
+										span(hidden data-ol-inflight="pending") #{translate("logging_in")}…
+							if settings.oidc && settings.oidc.enable
+								.actions(style='margin-top: 30px;')
+									a.button.btn-secondary.btn(
+										href='/oidc/login',
+										style="width: 100%;"
+										data-ol-disabled-inflight
+									)
+										span(data-ol-inflight="idle") #{settings.oidc.identityServiceName}
+										span(hidden data-ol-inflight="pending") #{translate("logging_in")}…
diff --git a/services/web/app/views/user/one_time_login.pug b/services/web/app/views/user/one_time_login.pug
index 89e1491913..e5d50c5a2d 100644
--- a/services/web/app/views/user/one_time_login.pug
+++ b/services/web/app/views/user/one_time_login.pug
@@ -1,20 +1,18 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-6.col-md-offset-3.col-lg-4.col-lg-offset-4
+				.col-lg-6.offset-lg-3.col-xl-4.offset-xl-4
 					.card
-						.page-header
-							h1 We're back!
-						p Overleaf is now running normally.
-						p
-							| Please
-							|
-							a(href="/login") log in
-							|
-							| to continue working on your projects.
+						.card-body
+							.page-header
+								h1 We're back!
+							p Overleaf is now running normally.
+							p
+								| Please
+								|
+								a(href='/login') log in
+								|
+								| to continue working on your projects.
diff --git a/services/web/app/views/user/passwordReset-bs5.pug b/services/web/app/views/user/passwordReset-bs5.pug
deleted file mode 100644
index d92ec5ece6..0000000000
--- a/services/web/app/views/user/passwordReset-bs5.pug
+++ /dev/null
@@ -1,76 +0,0 @@
-extends ../layout-website-redesign-bootstrap-5
-include ../_mixins/recaptcha
-include ../_mixins/notification
-
-block vars
-	- var suppressNavbar = true
-	- var suppressFooter = true
-
-block content
-	- var showCaptcha = settings.recaptcha && settings.recaptcha.siteKey && !(settings.recaptcha.disabled && settings.recaptcha.disabled.passwordReset)
-
-	if showCaptcha
-		script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=explicit")
-		div(
-			id="recaptcha"
-			class="g-recaptcha"
-			data-sitekey=settings.recaptcha.siteKey
-			data-size="invisible"
-			data-badge="inline"
-		)
-
-	main#main-content(data-ol-captcha-retry-trigger-area="")
-		a.auth-aux-logo(href="/")
-			img(src=buildImgPath("ol-brand/overleaf-o-dark.svg") alt=settings.appName)
-		.auth-aux-container
-			form(
-				data-ol-async-form
-				name="passwordResetForm"
-				action="/user/password/reset"
-				method="POST"
-				captcha=(showCaptcha ? '' : false)
-				captcha-action-name=(showCaptcha ? "passwordReset" : false)
-			)
-				if error === 'password_reset_token_expired'
-					h1.h3.mb-3.mt-0 #{translate("sorry_your_token_expired")}
-					p #{translate('please_request_a_new_password_reset_email_and_follow_the_link')}.
-				else
-					h1.h3.mb-3.mt-0(data-ol-not-sent) #{translate("password_reset_sentence_case")}
-					h1.h3.mb-3.mt-0(hidden data-ol-sent) #{translate("check_your_email")}   
-					p.mb-3.pb-3(data-ol-not-sent) #{translate("enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password")}.
-
-				div(data-ol-not-sent)
-					+formMessages()
-					if error && error !== 'password_reset_token_expired'
-						+notification({ariaLive: 'assertive', type: 'error', className: 'mb-3', content: translate(error)})
-
-					div(data-ol-custom-form-message="no-password-allowed-due-to-sso" hidden)
-						+notification({ariaLive: 'polite', type: 'error', className: 'mb-3', content: translate("you_cant_reset_password_due_to_sso", {}, [{name: 'a', attrs: {href: '/sso-login'}}])})
-					input(type="hidden" name="_csrf" value=csrfToken)
-					.form-group.mb-3
-						label.form-label(for='email') #{translate("email")}
-						input.form-control#email(
-							aria-label="email"
-							type='email'
-							name='email'
-							required
-							autocomplete="username"
-							autofocus
-						)
-					.actions
-						button.btn.btn-primary.w-100.mb-3(
-							type='submit'
-							data-ol-disabled-inflight
-							aria-label=translate('reset_password_sentence_case')
-						)
-							span(data-ol-inflight="idle")
-								| #{translate("reset_password_sentence_case")}
-							span(hidden data-ol-inflight="pending")
-								| #{translate("requesting_password_reset")}…
-						a.btn.btn-ghost.w-100.mb-3(href="/login") #{translate("back_to_log_in")}
-				div(hidden data-ol-sent)
-					p.mb-4 #{translate('password_reset_email_sent')}
-					a.btn.btn-primary.w-100.mb-3(href="/login") #{translate('back_to_log_in')}
-
-			if showCaptcha
-				+recaptchaConditions
diff --git a/services/web/app/views/user/passwordReset.pug b/services/web/app/views/user/passwordReset.pug
index 410e79fbb2..b6cd42c840 100644
--- a/services/web/app/views/user/passwordReset.pug
+++ b/services/web/app/views/user/passwordReset.pug
@@ -1,84 +1,81 @@
-extends ../layout-marketing
+extends ../layout-website-redesign
 include ../_mixins/recaptcha
+include ../_mixins/notification
 
 block vars
-	- bootstrap5PageStatus = 'disabled'
+	- var suppressNavbar = true
+	- var suppressFooter = true
+	- isWebsiteRedesign = true
 
 block content
 	- var showCaptcha = settings.recaptcha && settings.recaptcha.siteKey && !(settings.recaptcha.disabled && settings.recaptcha.disabled.passwordReset)
 
 	if showCaptcha
-		script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=explicit")
+		script(
+			type='text/javascript'
+			nonce=scriptNonce
+			src='https://www.recaptcha.net/recaptcha/api.js?render=explicit'
+		)
 		div(
-			id="recaptcha"
-			class="g-recaptcha"
+			id='recaptcha'
+			class='g-recaptcha'
 			data-sitekey=settings.recaptcha.siteKey
-			data-size="invisible"
-			data-badge="inline"
+			data-size='invisible'
+			data-badge='inline'
 		)
 
-	main.content.content-alt#main-content(data-ol-captcha-retry-trigger-area="")
-		.container-custom-sm.mx-auto
-			.card
-				form(
-					data-ol-async-form
-					name="passwordResetForm"
-					action="/user/password/reset",
-					method="POST",
-					captcha=(showCaptcha ? '' : false),
-					captcha-action-name=(showCaptcha ? "passwordReset" : false),
-				)
-					if error === 'password_reset_token_expired'
-						h3.mt-0.mb-2 #{translate("sorry_your_token_expired")}
-						p #{translate('please_request_a_new_password_reset_email_and_follow_the_link')}.
-					else
-						h3.mt-0.mb-2(data-ol-not-sent) #{translate("password_reset")}
-						h3.mt-0.mb-2(hidden data-ol-sent) #{translate("check_your_email")}	
-						p(data-ol-not-sent) #{translate("enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password")}.
+	main#main-content(data-ol-captcha-retry-trigger-area='')
+		a.auth-aux-logo(href='/')
+			img(src=buildImgPath('ol-brand/overleaf-o-dark.svg') alt=settings.appName)
+		.auth-aux-container
+			form(
+				name='passwordResetForm'
+				captcha-action-name=showCaptcha ? 'passwordReset' : false
+				data-ol-async-form
+				action='/user/password/reset'
+				method='POST'
+				captcha=showCaptcha ? '' : false
+			)
+				if error === 'password_reset_token_expired'
+					h1.h3.mb-3.mt-0 #{translate("sorry_your_token_expired")}
+					p #{translate('please_request_a_new_password_reset_email_and_follow_the_link')}.
+				else
+					h1.h3.mb-3.mt-0(data-ol-not-sent) #{translate("password_reset")}
+					h1.h3.mb-3.mt-0(hidden data-ol-sent) #{translate("check_your_email")} 
+					p.mb-3.pb-3(data-ol-not-sent) #{translate("enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password")}.
 
-					div(data-ol-not-sent)
-						+formMessages()
-						if error && error !== 'password_reset_token_expired'
-							div.alert.alert-danger.mb-2(
-								role="alert"
-								aria-live="assertive"
-							)
-								| #{translate(error)}
+				div(data-ol-not-sent)
+					+formMessagesNewStyle
+					if error && error !== 'password_reset_token_expired'
+						+notification({ariaLive: 'assertive', type: 'error', className: 'mb-3', content: translate(error)})
 
-						div(data-ol-custom-form-message="no-password-allowed-due-to-sso" hidden)
-							.notification.notification-type-error(aria-live="polite" style="margin-bottom: 10px;")
-								.notification-icon
-									span.material-symbols.material-symbols-rounded(aria-hidden="true") error
-								.notification-content-and-cta
-									.notification-content
-										p
-											| !{translate("you_cant_reset_password_due_to_sso", {}, [{name: 'a', attrs: {href: '/sso-login'}}])}
-
-						input(type="hidden", name="_csrf", value=csrfToken)
-						.form-group.mb-3
-							label(for='email') #{translate("email")}
-							input.form-control#email(
-								aria-label="email"
-								type='email',
-								name='email',
-								placeholder=translate("enter_your_email_address"),
-								required,
-								autocomplete="username",
-								autofocus
-							)
-						.actions
-							button.btn.btn-primary.w-100(
-								type='submit',
-								data-ol-disabled-inflight,
-								aria-label=translate('request_password_reset_to_reconfirm')
-							)
-								span(data-ol-inflight="idle")
-									| #{translate("request_password_reset")}
-								span(hidden data-ol-inflight="pending")
-									| #{translate("requesting_password_reset")}…
-					div(hidden data-ol-sent)
-						p.mb-4 #{translate('password_reset_email_sent')}
-						a(href="/login") #{translate('back_to_log_in')}
+					div(data-ol-custom-form-message='no-password-allowed-due-to-sso' hidden)
+						+notification({ariaLive: 'polite', type: 'error', className: 'mb-3', content: translate('you_cant_reset_password_due_to_ldap_or_sso')})
+					input(name='_csrf' type='hidden' value=csrfToken)
+					.form-group.mb-3
+						label.form-label(for='email') #{translate("email")}
+						input#email.form-control(
+							name='email'
+							aria-label='email'
+							type='email'
+							required
+							autocomplete='username'
+							autofocus
+						)
+					.actions
+						button.btn.btn-primary.w-100.mb-3(
+							type='submit'
+							data-ol-disabled-inflight
+							aria-label=translate('reset_password_sentence_case')
+						)
+							span(data-ol-inflight='idle')
+								| #{translate("reset_password_sentence_case")}
+							span(hidden data-ol-inflight='pending')
+								| #{translate("requesting_password_reset")}…
+						a.btn.btn-ghost.w-100.mb-3(href='/login') #{translate("back_to_log_in")}
+				div(hidden data-ol-sent)
+					p.mb-4 #{translate('password_reset_email_sent')}
+					a.btn.btn-primary.w-100.mb-3(href='/login') #{translate('back_to_log_in')}
 
 			if showCaptcha
 				+recaptchaConditions
diff --git a/services/web/app/views/user/primaryEmailCheck-bs5.pug b/services/web/app/views/user/primaryEmailCheck-bs5.pug
deleted file mode 100644
index b04511a48f..0000000000
--- a/services/web/app/views/user/primaryEmailCheck-bs5.pug
+++ /dev/null
@@ -1,38 +0,0 @@
-extends ../layout-website-redesign-bootstrap-5
-
-block content
-	main#main-content
-		.auth-aux-container
-			img.w-50.d-block(src=buildImgPath("ol-brand/overleaf.svg") alt=settings.appName)
-			h1.h3.mb-3 #{translate("keep_your_account_safe")}
-			div(data-ol-multi-submit)
-				p.small.mb-4
-					| !{translate("primary_email_check_question", { email: getUserEmail() }, ["strong"])}
-				form(
-					data-ol-async-form
-					action="/user/emails/primary-email-check"
-					method="POST"
-				)
-					input(name='_csrf', type='hidden', value=csrfToken)
-					+formMessages()
-
-					button.btn.btn-primary.w-100.mb-3(
-						type='submit'
-						data-ol-disabled-inflight
-					)
-						span(data-ol-inflight="idle") #{translate("yes_that_is_correct")}
-						span(hidden data-ol-inflight="pending") #{translate("confirming")}…
-
-				a.btn.btn-secondary.w-100.mb-4(
-					href="/user/settings#add-email"
-					data-ol-slow-link
-					event-tracking="primary-email-check-change-email"
-					event-tracking-mb="true"
-					event-tracking-trigger="click"
-				)
-					span(data-ol-inflight="idle") #{translate("no_update_email")}
-					span(hidden data-ol-inflight="pending") #{translate("redirecting")}…  
-				p.small.mb-2
-					|  #{translate("keep_your_email_updated")}
-				p.small
-					|  !{translate("learn_more_about_emails", {}, [{name: 'a', attrs: {href: '/learn/how-to/Keeping_your_account_secure', 'event-tracking': 'primary-email-check-learn-more', 'event-tracking-mb': 'true', 'event-tracking-trigger': 'click' }}])}
diff --git a/services/web/app/views/user/primaryEmailCheck.pug b/services/web/app/views/user/primaryEmailCheck.pug
index 8a0f1e6e94..cd3f0399a0 100644
--- a/services/web/app/views/user/primaryEmailCheck.pug
+++ b/services/web/app/views/user/primaryEmailCheck.pug
@@ -1,42 +1,41 @@
-extends ../layout-marketing
+extends ../layout-website-redesign
 
 block vars
-	- bootstrap5PageStatus = 'disabled'
+	- isWebsiteRedesign = true
 
 block content
-	main.content.content-alt#main-content
-		.login-register-container.primary-email-check-container
-			.card.primary-email-check-card
-				img.primary-email-check-logo(src=buildImgPath("ol-brand/overleaf.svg") alt=settings.appName)
-				h3.primary-email-check-header #{translate("keep_your_account_safe")}
-				.login-register-form.primary-email-check-form(data-ol-multi-submit)
-					p.small
-						| !{translate("primary_email_check_question", { email: getUserEmail() }, ["strong"])}
-					form(
-						data-ol-async-form
-						action="/user/emails/primary-email-check"
-						method="POST"
-					)
-						input(name='_csrf', type='hidden', value=csrfToken)
-						+formMessages()
+	main#main-content
+		.auth-aux-container
+			img.w-50.d-block(
+				src=buildImgPath('ol-brand/overleaf.svg')
+				alt=settings.appName
+			)
+			h1.h3.mb-3 #{translate("keep_your_account_safe")}
+			div(data-ol-multi-submit)
+				p.small.mb-4
+					| !{translate("primary_email_check_question", { email: getUserEmail() }, ["strong"])}
+				form(
+					data-ol-async-form
+					action='/user/emails/primary-email-check'
+					method='POST'
+				)
+					input(name='_csrf' type='hidden' value=csrfToken)
+					+formMessagesNewStyle
 
-						button.btn-primary.btn.btn-block.btn-primary-email-check-button.primary-email-confirm-button(
-							type='submit'
-							data-ol-disabled-inflight
-						)
-							span(data-ol-inflight="idle") #{translate("yes_that_is_correct")}
-							span(hidden data-ol-inflight="pending") #{translate("confirming")}…
+					button.btn.btn-primary.w-100.mb-3(type='submit' data-ol-disabled-inflight)
+						span(data-ol-inflight='idle') #{translate("yes_that_is_correct")}
+						span(hidden data-ol-inflight='pending') #{translate("confirming")}…
 
-					a.btn-secondary.btn.btn-block.btn-primary-email-check-button.primary-email-change-button(
-						href="/user/settings#add-email"
-						data-ol-slow-link
-						event-tracking="primary-email-check-change-email"
-						event-tracking-mb="true"
-						event-tracking-trigger="click"
-					)
-						span(data-ol-inflight="idle") #{translate("no_update_email")}
-						span(hidden data-ol-inflight="pending") #{translate("redirecting")}…	
-					p.small
-						|  #{translate("keep_your_email_updated")}
-					p.small
-						|  !{translate("learn_more_about_emails", {}, [{name: 'a', attrs: {href: '/learn/how-to/Keeping_your_account_secure', 'event-tracking': 'primary-email-check-learn-more', 'event-tracking-mb': 'true', 'event-tracking-trigger': 'click' }}])}
+				a.btn.btn-secondary.w-100.mb-4(
+					href='/user/settings#add-email'
+					data-ol-slow-link
+					event-tracking='primary-email-check-change-email'
+					event-tracking-mb='true'
+					event-tracking-trigger='click'
+				)
+					span(data-ol-inflight='idle') #{translate("no_update_email")}
+					span(hidden data-ol-inflight='pending') #{translate("redirecting")}… 
+				p.small.mb-2
+					| #{translate("keep_your_email_updated")}
+				p.small
+					| !{translate("learn_more_about_emails", {}, [{name: 'a', attrs: {href: '/learn/how-to/Keeping_your_account_secure', 'event-tracking': 'primary-email-check-learn-more', 'event-tracking-mb': 'true', 'event-tracking-trigger': 'click' }}])}
diff --git a/services/web/app/views/user/reconfirm-bs5.pug b/services/web/app/views/user/reconfirm-bs5.pug
deleted file mode 100644
index 959abf26c6..0000000000
--- a/services/web/app/views/user/reconfirm-bs5.pug
+++ /dev/null
@@ -1,69 +0,0 @@
-extends ../layout-website-redesign-bootstrap-5
-include ../_mixins/recaptcha
-
-block content
-    - var email = reconfirm_email ? reconfirm_email : ""
-    - var showCaptcha = settings.recaptcha && settings.recaptcha.siteKey && !(settings.recaptcha.disabled && settings.recaptcha.disabled.passwordReset)
-
-    if showCaptcha
-        script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=explicit")
-        div(
-            id="recaptcha"
-            class="g-recaptcha"
-            data-sitekey=settings.recaptcha.siteKey
-            data-size="invisible"
-            data-badge="inline"
-        )
-
-    main#main-content(data-ol-captcha-retry-trigger-area="")
-        .container.auth-aux-container(style="max-width: 420px;")
-            form(
-                data-ol-async-form
-                name="reconfirmAccountForm"
-                action="/user/reconfirm"
-                method="POST"
-                aria-label=translate('request_reconfirmation_email')
-                captcha=(showCaptcha ? '' : false)
-                captcha-action-name=(showCaptcha ? "passwordReset" : false)
-            )
-                h1.h5.mb-3 #{translate("reconfirm_account")}
-                p #{translate('reconfirm_explained')}
-                    | 
-                    a(href=`mailto:${settings.adminEmail}`) #{settings.adminEmail}
-                    | .
-                
-                div(data-ol-not-sent)
-                    +formMessages()
-
-                    input(type="hidden" name="_csrf" value=csrfToken)
-                    .form-group.mb-3
-                        label.form-label(for='email') #{translate("please_enter_email")}
-                        input.form-control(
-                            aria-label="email"
-                            type='email'
-                            name='email'
-                            placeholder='email@example.com'
-                            required
-                            autofocus
-                            value=email
-                        )
-                    .actions
-                        button.btn.btn-primary.w-100(
-                            style="white-space: normal;"
-                            type='submit'
-                            data-ol-disabled-inflight
-                            aria-label=translate('request_password_reset_to_reconfirm')
-                        )
-                            span(data-ol-inflight="idle")
-                                | #{translate('request_password_reset_to_reconfirm')}
-                            span(hidden data-ol-inflight="pending")
-                                | #{translate('request_password_reset_to_reconfirm')}… 
-                div(hidden data-ol-sent)
-                    div.alert.alert-success(
-                        role="alert"
-                        aria-live="polite"
-                    )
-                        span #{translate('password_reset_email_sent')}
-
-            if showCaptcha
-                +recaptchaConditions
diff --git a/services/web/app/views/user/reconfirm.pug b/services/web/app/views/user/reconfirm.pug
index 5db1d811c7..876c28edaf 100644
--- a/services/web/app/views/user/reconfirm.pug
+++ b/services/web/app/views/user/reconfirm.pug
@@ -1,73 +1,73 @@
-extends ../layout-marketing
+extends ../layout-website-redesign
 include ../_mixins/recaptcha
 
 block vars
-	- bootstrap5PageStatus = 'disabled'
+	- isWebsiteRedesign = true
 
 block content
-	- var email = reconfirm_email ? reconfirm_email : ""
+	- var email = reconfirm_email ? reconfirm_email : ''
 	- var showCaptcha = settings.recaptcha && settings.recaptcha.siteKey && !(settings.recaptcha.disabled && settings.recaptcha.disabled.passwordReset)
 
 	if showCaptcha
-		script(type="text/javascript", nonce=scriptNonce, src="https://www.recaptcha.net/recaptcha/api.js?render=explicit")
+		script(
+			type='text/javascript'
+			nonce=scriptNonce
+			src='https://www.recaptcha.net/recaptcha/api.js?render=explicit'
+		)
 		div(
-			id="recaptcha"
-			class="g-recaptcha"
+			id='recaptcha'
+			class='g-recaptcha'
 			data-sitekey=settings.recaptcha.siteKey
-			data-size="invisible"
-			data-badge="inline"
+			data-size='invisible'
+			data-badge='inline'
 		)
 
-	main.content.content-alt#main-content(data-ol-captcha-retry-trigger-area="")
-		.container
-			.row
-				.col-sm-12.col-md-6.col-md-offset-3
-					.card
-						h1.card-header.text-capitalize #{translate("reconfirm")} #{translate("Account")}
-						p #{translate('reconfirm_explained')}&nbsp;
-							a(href=`mailto:${settings.adminEmail}`) #{settings.adminEmail}
-							| .
-						form(
-							data-ol-async-form
-							name="reconfirmAccountForm"
-							action="/user/reconfirm",
-							method="POST",
-							aria-label=translate('request_reconfirmation_email')
-							captcha=(showCaptcha ? '' : false),
-							captcha-action-name=(showCaptcha ? "passwordReset" : false)
+	main#main-content(data-ol-captcha-retry-trigger-area='')
+		.container.auth-aux-container(style='max-width: 420px')
+			form(
+				name='reconfirmAccountForm'
+				captcha-action-name=showCaptcha ? 'passwordReset' : false
+				data-ol-async-form
+				action='/user/reconfirm'
+				method='POST'
+				aria-label=translate('request_reconfirmation_email')
+				captcha=showCaptcha ? '' : false
+			)
+				h1.h5.mb-3 #{translate("reconfirm_account")}
+				p #{translate('reconfirm_explained')}
+					| &nbsp;
+					a(href=`mailto:${settings.adminEmail}`) #{settings.adminEmail}
+					| .
+
+				div(data-ol-not-sent)
+					+formMessagesNewStyle
+
+					input(name='_csrf' type='hidden' value=csrfToken)
+					.form-group.mb-3
+						label.form-label(for='email') #{translate("please_enter_email")}
+						input.form-control(
+							name='email'
+							aria-label='email'
+							type='email'
+							placeholder='email@example.com'
+							required
+							autofocus
+							value=email
 						)
-							div(data-ol-not-sent)
-								+formMessages()
-	
-								input(type="hidden", name="_csrf", value=csrfToken)
-								.form-group
-									label(for='email') #{translate("please_enter_email")}
-									input.form-control(
-										aria-label="email"
-										type='email',
-										name='email',
-										placeholder='email@example.com',
-										required,
-										autofocus
-										value=email
-									)
-								.actions
-									button.btn.btn-primary(
-										type='submit',
-										data-ol-disabled-inflight,
-										aria-label=translate('request_password_reset_to_reconfirm')
-									)
-										span(data-ol-inflight="idle")
-											| #{translate('request_password_reset_to_reconfirm')}
-										span(hidden data-ol-inflight="pending")
-											| #{translate('request_password_reset_to_reconfirm')}… 
-							div(hidden data-ol-sent)
-								div.alert.alert-success(
-									role="alert"
-									aria-live="polite"
-								)
-									span #{translate('password_reset_email_sent')}
-			.row
-				.col-sm-12.col-md-6.col-md-offset-3
-					if showCaptcha
-						+recaptchaConditions
+					.actions
+						button.btn.btn-primary.w-100(
+							style='white-space: normal'
+							type='submit'
+							data-ol-disabled-inflight
+							aria-label=translate('request_password_reset_to_reconfirm')
+						)
+							span(data-ol-inflight='idle')
+								| #{translate('request_password_reset_to_reconfirm')}
+							span(hidden data-ol-inflight='pending')
+								| #{translate('request_password_reset_to_reconfirm')}… 
+				div(hidden data-ol-sent)
+					.alert.alert-success(role='alert' aria-live='polite')
+						span #{translate('password_reset_email_sent')}
+
+			if showCaptcha
+				+recaptchaConditions
diff --git a/services/web/app/views/user/register.pug b/services/web/app/views/user/register.pug
index c35f3c04f0..ff53002ccb 100644
--- a/services/web/app/views/user/register.pug
+++ b/services/web/app/views/user/register.pug
@@ -1,13 +1,10 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.registration_message
+				.registration-message
 					if sharedProjectData.user_first_name !== undefined
 						h1 #{translate("user_wants_you_to_see_project", {username:sharedProjectData.user_first_name, projectname:""})}
 							em #{sharedProjectData.project_name}
@@ -15,21 +12,24 @@ block content
 							| #{translate("join_sl_to_view_project")}.
 						div
 							| #{translate("already_have_sl_account")}
-							a(href="/login")  #{translate("login_here")}
+							|
+							a(href='/login') #{translate("login_here")}
 					else if newTemplateData.templateName !== undefined
 						h1 #{translate("register_to_edit_template", {templateName:newTemplateData.templateName})}
 
 						div #{translate("already_have_sl_account")}
-							a(href="/login")  #{translate("login_here")}
+							|
+							a(href='/login') #{translate("login_here")}
 
 			.row
-				.col-md-8.col-md-offset-2.col-lg-6.col-lg-offset-3
+				.col-lg-8.offset-lg-2.col-xl-6.offset-xl-3
 					.card
-						.page-header
-							h1 #{translate("register")}
-						p
-							| Please contact
-							|
-							strong #{settings.adminEmail}
-							|
-							| to create an account.
+						.card-body
+							.page-header
+								h1 #{translate("register")}
+							p
+								| Please contact
+								|
+								strong #{settings.adminEmail}
+								|
+								| to create an account.
diff --git a/services/web/app/views/user/restricted.pug b/services/web/app/views/user/restricted.pug
index 949bd9b4b6..0140064a99 100644
--- a/services/web/app/views/user/restricted.pug
+++ b/services/web/app/views/user/restricted.pug
@@ -1,16 +1,14 @@
 extends ../layout-marketing
-
-block vars
-	- bootstrap5PageStatus = 'disabled'
+include ../_mixins/material_symbol
 
 block content
 	main.content#main-content
 		.container
 			.row
-				.col-md-8.col-md-offset-2.text-center
+				.col-md-8.offset-md-2.text-center
 					.page-header
-						h2 #{translate("restricted_no_permission")}
+						h1 #{translate("restricted_no_permission")}
 					p
-						a(href="/")
-							i.fa.fa-arrow-circle-o-left(aria-hidden="true")
-							|  #{translate("take_me_home")}
+						a.inline-material-symbols(href="/")
+							+material-symbol("arrow_left_alt")
+							| #{translate("take_me_home")}
diff --git a/services/web/app/views/user/sessions.pug b/services/web/app/views/user/sessions.pug
index 99905a960d..744b804687 100644
--- a/services/web/app/views/user/sessions.pug
+++ b/services/web/app/views/user/sessions.pug
@@ -1,72 +1,66 @@
 extends ../layout-marketing
 
-block vars
-	- bootstrap5PageStatus = 'disabled'
-
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
-				.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
+				.col-lg-10.offset-lg-1.col-xl-8.offset-xl-2
 					.card.clear-user-sessions
-						.page-header
-							h1  #{translate("your_sessions")}
+						.card-body
+							.page-header
+								h1 #{translate("your_sessions")}
 
-						if currentSession.ip_address && currentSession.session_created
-							h3 #{translate("current_session")}
-							div
-								table.table.table-striped
-									thead
-										tr
-											th #{translate("ip_address")}
-											th #{translate("session_created_at")}
-										tr
-											td #{currentSession.ip_address}
-											td #{moment(currentSession.session_created).utc().format('Do MMM YYYY, h:mm a')} UTC
-
-						h3 #{translate("other_sessions")}
-						div
-							p.small
-								| !{translate("clear_sessions_description")}
-
-						form(
-							data-ol-async-form
-							action='/user/sessions/clear'
-							method='POST'
-						)
-							input(name='_csrf' type='hidden' value=csrfToken)
-							div(data-ol-not-sent)
-								if sessions.length == 0
-									p.text-center
-										| #{translate("no_other_sessions")}
-
-								if sessions.length > 0
+							if currentSession.ip_address && currentSession.session_created
+								h3 #{translate("current_session")}
+								div
 									table.table.table-striped
 										thead
 											tr
 												th #{translate("ip_address")}
 												th #{translate("session_created_at")}
-										for session in sessions
 											tr
-												td #{session.ip_address}
-												td #{moment(session.session_created).utc().format('Do MMM YYYY, h:mm a')} UTC
+												td #{currentSession.ip_address}
+												td #{moment(currentSession.session_created).utc().format('Do MMM YYYY, h:mm a')} UTC
 
-									p.actions
-										.text-center
-											button.btn.btn-lg.btn-primary(
-												type="submit"
-												data-ol-disable-inflight
-											)
-												span(data-ol-inflight="idle") #{translate('clear_sessions')}
-												span(hidden data-ol-inflight="pending") #{translate("processing")}…
+							h3 #{translate("other_sessions")}
+							div
+								p.small
+									| !{translate("clear_sessions_description")}
 
-							div(hidden data-ol-sent)
-								p.text-center
-									| #{translate("no_other_sessions")}
+							form(data-ol-async-form action='/user/sessions/clear' method='POST')
+								input(name='_csrf' type='hidden' value=csrfToken)
+								div(data-ol-not-sent)
+									if sessions.length == 0
+										p.text-center
+											| #{translate("no_other_sessions")}
 
-								p.text-success.text-center
-									| #{translate('clear_sessions_success')}
-						.page-separator
-						a.btn.btn-secondary.text-capitalize(href='/user/settings') #{translate('back_to_account_settings')}
-						| 
-						a.btn.btn-secondary.text-capitalize(href='/project') #{translate('back_to_your_projects')}
+									if sessions.length > 0
+										table.table.table-striped
+											thead
+												tr
+													th #{translate("ip_address")}
+													th #{translate("session_created_at")}
+											each session in sessions
+												tr
+													td #{session.ip_address}
+													td #{moment(session.session_created).utc().format('Do MMM YYYY, h:mm a')} UTC
+
+										p.actions
+											.text-center
+												button.btn.btn-lg.btn-primary(
+													type='submit'
+													data-ol-disable-inflight
+												)
+													span(data-ol-inflight='idle') #{translate('clear_sessions')}
+													span(hidden data-ol-inflight='pending') #{translate("processing")}…
+
+								div(hidden data-ol-sent)
+									p.text-center
+										| #{translate("no_other_sessions")}
+
+									p.text-success.text-center
+										| #{translate('clear_sessions_success')}
+							.page-separator
+							.d-flex.gap-3
+								a.btn.btn-secondary(href='/user/settings') #{translate('back_to_account_settings')}
+								a.btn.btn-secondary(href='/project') #{translate('back_to_your_projects')}
diff --git a/services/web/app/views/user/setPassword-bs5.pug b/services/web/app/views/user/setPassword-bs5.pug
deleted file mode 100644
index be0c902a26..0000000000
--- a/services/web/app/views/user/setPassword-bs5.pug
+++ /dev/null
@@ -1,90 +0,0 @@
-extends ../layout-website-redesign-bootstrap-5
-
-block vars
-    - var suppressNavbar = true
-    - var suppressFooter = true
-
-block content
-    main#main-content
-        a.auth-aux-logo(href="/")
-            img(src=buildImgPath("ol-brand/overleaf-o-dark.svg") alt=settings.appName)
-        .auth-aux-container
-            form(
-                data-ol-async-form
-                name="passwordResetForm"
-                action="/user/password/set"
-                method="POST"
-                data-ol-hide-on-error="token-expired"
-            )
-                div(
-                    hidden
-                    data-ol-sent
-                )
-                    h1.h3.mb-3.mt-0 #{translate("password_updated")}
-                    p.mb-4 #{translate("your_password_has_been_successfully_changed")}.
-                    a.btn.btn-primary.w-100(href='/login') #{translate("log_in_now")}
-
-                div(data-ol-not-sent)
-                    h1.h3.mb-3.mt-0 #{translate("reset_your_password")}
-                    p(data-ol-hide-on-error-message="token-expired") #{translate("create_a_new_password_for_your_account")}.
-                    +formMessages()
-
-                    +customFormMessage('password-contains-email', 'danger')
-                        | #{translate('invalid_password_contains_email')}.
-                        | #{translate('use_a_different_password')}.
-
-                    +customFormMessage('password-too-similar', 'danger')
-                        | #{translate('invalid_password_too_similar')}.
-                        | #{translate('use_a_different_password')}.
-
-                    +customFormMessage('token-expired', 'danger')
-                        | #{translate('password_reset_token_expired')}
-                        br
-                        a(href="/user/password/reset")
-                            | #{translate('request_new_password_reset_email')}
-
-                    input(type="hidden" name="_csrf" value=csrfToken)
-                    input(type="text" hidden name="email" autocomplete="username" value=email)
-
-                    .form-group.mb-3
-                        label.form-label(for='passwordField', data-ol-hide-on-error-message="token-expired") #{translate("new_password")}
-                        input.form-control#passwordField(
-                            type='password'
-                            name='password'
-                            autocomplete="new-password"
-                            autofocus
-                            required
-                            minlength=settings.passwordStrengthOptions.length.min
-                        )
-
-                        +customValidationMessage('invalid-password')
-                            | #{translate('invalid_password')}.
-
-                        +customValidationMessage('password-must-be-different')
-                            | #{translate('password_cant_be_the_same_as_current_one')}.
-
-                        +customValidationMessage('password-must-be-strong')
-                            | !{translate('password_was_detected_on_a_public_list_of_known_compromised_passwords', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}])}.
-                            | #{translate('use_a_different_password')}.
-
-                        input(
-                            type="hidden"
-                            name="passwordResetToken"
-                            value=passwordResetToken
-                        )
-                    div(data-ol-hide-on-error-message="token-expired")
-                        div #{translate('in_order_to_have_a_secure_account_make_sure_your_password')}
-                        ul.mb-3.ps-4
-                            li #{translate('is_longer_than_n_characters', {n: settings.passwordStrengthOptions.length.min})}
-                            li #{translate('does_not_contain_or_significantly_match_your_email')}
-                            li #{translate('is_not_used_on_any_other_website')}
-                    .actions
-                        button.btn.btn-primary.w-100(
-                            type='submit'
-                            data-ol-disabled-inflight
-                            aria-label=translate('set_new_password')
-                        ) 
-                            span(data-ol-inflight="idle")
-                                | #{translate('set_new_password')}
-                            span(hidden data-ol-inflight="pending")
-                                | #{translate('set_new_password')}…
diff --git a/services/web/app/views/user/setPassword.pug b/services/web/app/views/user/setPassword.pug
index 5da2b6b59a..5081d22409 100644
--- a/services/web/app/views/user/setPassword.pug
+++ b/services/web/app/views/user/setPassword.pug
@@ -1,89 +1,87 @@
-extends ../layout-marketing
+extends ../layout-website-redesign
 
 block vars
-	- bootstrap5PageStatus = 'disabled'
+	- var suppressNavbar = true
+	- var suppressFooter = true
+	- isWebsiteRedesign = true
 
 block content
-	main.content.content-alt#main-content
-		.container-custom-sm.mx-auto
-			.card
-				form(
-					data-ol-async-form,
-					name="passwordResetForm",
-					action="/user/password/set",
-					method="POST",
-					data-ol-hide-on-error="token-expired"
-				)
-					div(
-						hidden
-						data-ol-sent
-					)
-						h3.mt-0.mb-2 #{translate("password_updated")}
-						p.mb-4 #{translate("your_password_has_been_successfully_changed")}.
-						a(href='/login') #{translate("log_in_now")}
+	main#main-content
+		a.auth-aux-logo(href='/')
+			img(src=buildImgPath('ol-brand/overleaf-o-dark.svg') alt=settings.appName)
+		.auth-aux-container
+			form(
+				name='passwordResetForm'
+				data-ol-async-form
+				action='/user/password/set'
+				method='POST'
+				data-ol-hide-on-error='token-expired'
+			)
+				div(hidden data-ol-sent)
+					h1.h3.mb-3.mt-0 #{translate("password_updated")}
+					p.mb-4 #{translate("your_password_has_been_successfully_changed")}.
+					a.btn.btn-primary.w-100(href='/login') #{translate("log_in_now")}
 
-					div(data-ol-not-sent)
-						h3.mt-0.mb-2 #{translate("reset_your_password")}
-						p(data-ol-hide-on-error-message="token-expired") #{translate("create_a_new_password_for_your_account")}.
-						+formMessages()
+				div(data-ol-not-sent)
+					h1.h3.mb-3.mt-0 #{translate("reset_your_password")}
+					p(data-ol-hide-on-error-message='token-expired') #{translate("create_a_new_password_for_your_account")}.
+					+formMessagesNewStyle
 
-						+customFormMessage('password-contains-email', 'danger')
-							| #{translate('invalid_password_contains_email')}.
+					+customFormMessageNewStyle('password-contains-email', 'danger')
+						| #{translate('invalid_password_contains_email')}.
+						| #{translate('use_a_different_password')}.
+
+					+customFormMessageNewStyle('password-too-similar', 'danger')
+						| #{translate('invalid_password_too_similar')}.
+						| #{translate('use_a_different_password')}.
+
+					+customFormMessageNewStyle('token-expired', 'danger')
+						| #{translate('password_reset_token_expired')}
+						br
+						a(href='/user/password/reset')
+							| #{translate('request_new_password_reset_email')}
+
+					input(name='_csrf' type='hidden' value=csrfToken)
+					input(name='email' type='text' hidden autocomplete='username' value=email)
+
+					.form-group.mb-3
+						label.form-label(
+							for='passwordField'
+							data-ol-hide-on-error-message='token-expired'
+						) #{translate("new_password")}
+						input#passwordField.form-control.auth-aux-new-password(
+							name='password'
+							type='password'
+							autocomplete='new-password'
+							autofocus
+							required
+							minlength=settings.passwordStrengthOptions.length.min
+						)
+
+						+customValidationMessageNewStyle('invalid-password')
+							| #{translate('invalid_password')}.
+
+						+customValidationMessageNewStyle('password-must-be-different')
+							| #{translate('password_cant_be_the_same_as_current_one')}.
+
+						+customValidationMessageNewStyle('password-must-be-strong')
+							| !{translate('password_was_detected_on_a_public_list_of_known_compromised_passwords', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}])}.
 							| #{translate('use_a_different_password')}.
 
-						+customFormMessage('password-too-similar', 'danger')
-							| #{translate('invalid_password_too_similar')}.
-							| #{translate('use_a_different_password')}.
-
-						+customFormMessage('token-expired', 'danger')
-							| #{translate('password_reset_token_expired')}
-							br
-							a(href="/user/password/reset")
-								| #{translate('request_new_password_reset_email')}
-
-						input(type="hidden", name="_csrf", value=csrfToken)
-						input(type="text" hidden name="email" autocomplete="username" value=email)
-
-						.form-group
-							label(for='passwordField', data-ol-hide-on-error-message="token-expired") #{translate("new_password")}
-							input.form-control#passwordField(
-								type='password',
-								name='password',
-								placeholder=translate("enter_your_new_password"),
-								autocomplete="new-password",
-								autofocus,
-								required,
-								minlength=settings.passwordStrengthOptions.length.min
-							)
-
-							+customValidationMessage('invalid-password')
-								| #{translate('invalid_password')}.
-
-							+customValidationMessage('password-must-be-different')
-								| #{translate('password_cant_be_the_same_as_current_one')}.
-
-							+customValidationMessage('password-must-be-strong')
-								| !{translate('password_was_detected_on_a_public_list_of_known_compromised_passwords', {}, [{name: 'a', attrs: {href: 'https://haveibeenpwned.com/passwords', rel: 'noopener noreferrer', target: '_blank'}}])}.
-								| #{translate('use_a_different_password')}.
-
-							input(
-								type="hidden",
-								name="passwordResetToken",
-								value=passwordResetToken
-							)
-						div(data-ol-hide-on-error-message="token-expired")
-							div #{translate('in_order_to_have_a_secure_account_make_sure_your_password')}
-							ul.mb-4.ps-4
-								li #{translate('is_longer_than_n_characters', {n: settings.passwordStrengthOptions.length.min})}
-								li #{translate('does_not_contain_or_significantly_match_your_email')}
-								li #{translate('is_not_used_on_any_other_website')}
-						.actions
-							button.btn.btn-primary.w-100(
-								type='submit',
-								data-ol-disabled-inflight
-								aria-label=translate('set_new_password')
-							) 
-								span(data-ol-inflight="idle")
-									| #{translate('set_new_password')}
-								span(hidden data-ol-inflight="pending")
-									| #{translate('set_new_password')}… 
+						input(name='passwordResetToken' type='hidden' value=passwordResetToken)
+					div(data-ol-hide-on-error-message='token-expired')
+						div #{translate('in_order_to_have_a_secure_account_make_sure_your_password')}
+						ul.mb-3.ps-4
+							li #{translate('is_longer_than_n_characters', {n: settings.passwordStrengthOptions.length.min})}
+							li #{translate('does_not_contain_or_significantly_match_your_email')}
+							li #{translate('is_not_used_on_any_other_website')}
+					.actions
+						button.btn.btn-primary.w-100(
+							type='submit'
+							data-ol-disabled-inflight
+							aria-label=translate('set_new_password')
+						) 
+							span(data-ol-inflight='idle')
+								| #{translate('set_new_password')}
+							span(hidden data-ol-inflight='pending')
+								| #{translate('set_new_password')}…
diff --git a/services/web/app/views/user/settings.pug b/services/web/app/views/user/settings.pug
index 45d6ebeb90..45d21c7572 100644
--- a/services/web/app/views/user/settings.pug
+++ b/services/web/app/views/user/settings.pug
@@ -2,37 +2,65 @@ extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/settings'
-		
+
 block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
 	- isWebsiteRedesign = true
 
 block append meta
-	meta(name="ol-hasPassword" data-type="boolean" content=hasPassword)
-	meta(name="ol-shouldAllowEditingDetails" data-type="boolean" content=shouldAllowEditingDetails)
-	meta(name="ol-oauthProviders", data-type="json", content=oauthProviders)
-	meta(name="ol-institutionLinked", data-type="json", content=institutionLinked)
-	meta(name="ol-samlError", data-type="json", content=samlError)
-	meta(name="ol-institutionEmailNonCanonical", content=institutionEmailNonCanonical)
+	meta(name='ol-hasPassword' data-type='boolean' content=hasPassword)
+	meta(
+		name='ol-shouldAllowEditingDetails'
+		data-type='boolean'
+		content=shouldAllowEditingDetails
+	)
+	meta(name='ol-oauthProviders' data-type='json' content=oauthProviders)
+	meta(name='ol-institutionLinked' data-type='json' content=institutionLinked)
+	meta(name='ol-samlError' data-type='json' content=samlError)
+	meta(
+		name='ol-institutionEmailNonCanonical'
+		content=institutionEmailNonCanonical
+	)
 
-	meta(name="ol-reconfirmedViaSAML", content=reconfirmedViaSAML)
-	meta(name="ol-reconfirmationRemoveEmail", content=reconfirmationRemoveEmail)
-	meta(name="ol-samlBeta", content=samlBeta)
-	meta(name="ol-ssoErrorMessage", content=ssoErrorMessage)
-	meta(name="ol-thirdPartyIds", data-type="json", content=thirdPartyIds || {})
-	meta(name="ol-passwordStrengthOptions", data-type="json", content=settings.passwordStrengthOptions || {})
-	meta(name="ol-isExternalAuthenticationSystemUsed" data-type="boolean" content=externalAuthenticationSystemUsed())
-	meta(name="ol-user" data-type="json" content=user)
-	meta(name="ol-dropbox" data-type="json" content=dropbox)
-	meta(name="ol-github" data-type="json" content=github)
-	meta(name="ol-projectSyncSuccessMessage", content=projectSyncSuccessMessage)
-	meta(name="ol-personalAccessTokens", data-type="json" content=personalAccessTokens)
-	meta(name="ol-emailAddressLimit", data-type="json", content=emailAddressLimit)
-	meta(name="ol-currentManagedUserAdminEmail" data-type="string" content=currentManagedUserAdminEmail)
-	meta(name="ol-gitBridgeEnabled" data-type="boolean" content=gitBridgeEnabled)
-	meta(name="ol-isSaas" data-type="boolean" content=isSaas)
-	meta(name="ol-memberOfSSOEnabledGroups" data-type="json" content=memberOfSSOEnabledGroups)
+	meta(name='ol-reconfirmedViaSAML' content=reconfirmedViaSAML)
+	meta(name='ol-reconfirmationRemoveEmail' content=reconfirmationRemoveEmail)
+	meta(name='ol-samlBeta' content=samlBeta)
+	meta(name='ol-ssoErrorMessage' content=ssoErrorMessage)
+	meta(name='ol-thirdPartyIds' data-type='json' content=thirdPartyIds || {})
+	meta(
+		name='ol-passwordStrengthOptions'
+		data-type='json'
+		content=settings.passwordStrengthOptions || {}
+	)
+	meta(
+		name='ol-isExternalAuthenticationSystemUsed'
+		data-type='boolean'
+		content=externalAuthenticationSystemUsed()
+	)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-labsExperiments' data-type='json' content=labsExperiments)
+	meta(name='ol-dropbox' data-type='json' content=dropbox)
+	meta(name='ol-github' data-type='json' content=github)
+	meta(name='ol-projectSyncSuccessMessage' content=projectSyncSuccessMessage)
+	meta(
+		name='ol-personalAccessTokens'
+		data-type='json'
+		content=personalAccessTokens
+	)
+	meta(name='ol-emailAddressLimit' data-type='number' content=emailAddressLimit)
+	meta(
+		name='ol-currentManagedUserAdminEmail'
+		data-type='string'
+		content=currentManagedUserAdminEmail
+	)
+	meta(name='ol-gitBridgeEnabled' data-type='boolean' content=gitBridgeEnabled)
+	meta(name='ol-isSaas' data-type='boolean' content=isSaas)
+	meta(
+		name='ol-memberOfSSOEnabledGroups'
+		data-type='json'
+		content=memberOfSSOEnabledGroups
+	)
+	meta(name='ol-capabilities' data-type='json' content=capabilities)
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		#settings-page-root
diff --git a/services/web/app/views/user_membership/group-managers-react.pug b/services/web/app/views/user_membership/group-managers-react.pug
index ed2f3454db..34414ddbf2 100644
--- a/services/web/app/views/user_membership/group-managers-react.pug
+++ b/services/web/app/views/user_membership/group-managers-react.pug
@@ -1,15 +1,13 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/group-managers'
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block append meta
-	meta(name="ol-users", data-type="json", content=users)
-	meta(name="ol-groupId", data-type="string", content=groupId)
-	meta(name="ol-groupName", data-type="string", content=name)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-users' data-type='json' content=users)
+	meta(name='ol-groupId' data-type='string' content=groupId)
+	meta(name='ol-groupName' data-type='string' content=name)
 
 block content
-	main.content.content-alt#subscription-manage-group-root
+	main#subscription-manage-group-root.content.content-alt
diff --git a/services/web/app/views/user_membership/group-members-react.pug b/services/web/app/views/user_membership/group-members-react.pug
index b146d0d143..7767cf026e 100644
--- a/services/web/app/views/user_membership/group-members-react.pug
+++ b/services/web/app/views/user_membership/group-members-react.pug
@@ -1,20 +1,35 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/group-members'
-		
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
 
 block append meta
-	meta(name="ol-users", data-type="json", content=users)
-	meta(name="ol-groupId", data-type="string", content=groupId)
-	meta(name="ol-groupName", data-type="string", content=name)
-	meta(name="ol-groupSize", data-type="json", content=groupSize)
-	meta(name="ol-managedUsersActive", data-type="boolean", content=managedUsersActive)
-	meta(name="ol-groupSSOActive", data-type="boolean", content=groupSSOActive)
-	meta(name="ol-canUseFlexibleLicensing", data-type="boolean", content=canUseFlexibleLicensing)
-	meta(name="ol-canUseAddSeatsFeature", data-type="boolean", content=canUseAddSeatsFeature)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-users' data-type='json' content=users)
+	meta(name='ol-groupId' data-type='string' content=groupId)
+	meta(name='ol-groupName' data-type='string' content=name)
+	meta(name='ol-groupSize' data-type='number' content=groupSize)
+	meta(
+		name='ol-managedUsersActive'
+		data-type='boolean'
+		content=managedUsersActive
+	)
+	meta(
+		name='ol-isUserGroupManager'
+		data-type='boolean'
+		content=isUserGroupManager
+	)
+	meta(name='ol-groupSSOActive' data-type='boolean' content=groupSSOActive)
+	meta(
+		name='ol-canUseFlexibleLicensing'
+		data-type='boolean'
+		content=canUseFlexibleLicensing
+	)
+	meta(
+		name='ol-canUseAddSeatsFeature'
+		data-type='boolean'
+		content=canUseAddSeatsFeature
+	)
 
 block content
-	main.content.content-alt#subscription-manage-group-root
+	main#subscription-manage-group-root.content.content-alt
diff --git a/services/web/app/views/user_membership/institution-managers-react.pug b/services/web/app/views/user_membership/institution-managers-react.pug
index dfe59364dc..9793058f6f 100644
--- a/services/web/app/views/user_membership/institution-managers-react.pug
+++ b/services/web/app/views/user_membership/institution-managers-react.pug
@@ -1,15 +1,13 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/institution-managers'
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block append meta
-	meta(name="ol-users", data-type="json", content=users)
-	meta(name="ol-groupId", data-type="string", content=groupId)
-	meta(name="ol-groupName", data-type="string", content=name)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-users' data-type='json' content=users)
+	meta(name='ol-groupId' data-type='string' content=groupId)
+	meta(name='ol-groupName' data-type='string' content=name)
 
 block content
-	main.content.content-alt#subscription-manage-group-root
+	main#subscription-manage-group-root.content.content-alt
diff --git a/services/web/app/views/user_membership/new.pug b/services/web/app/views/user_membership/new.pug
index 6a88249ca6..4e52ea160a 100644
--- a/services/web/app/views/user_membership/new.pug
+++ b/services/web/app/views/user_membership/new.pug
@@ -4,20 +4,13 @@ block vars
 	- bootstrap5PageStatus = 'disabled'
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
 			.row
 				.col-md-10.col-md-offset-1
 					h3 #{entityName} "#{entityId}" does not exists in v2
-					form(
-						data-ol-regular-form
-						method='post',
-						action=''
-					)
-						input(name="_csrf", type="hidden", value=csrfToken)
-						button.btn.btn-primary.text-capitalize(
-							type="submit",
-							data-ol-disabled-inflight
-						)
-							span(data-ol-inflight="idle") Create #{entityName} in v2
-							span(hidden data-ol-inflight="pending") #{translate("creating")}…
+					form(data-ol-regular-form method='post' action='')
+						input(name='_csrf' type='hidden' value=csrfToken)
+						button.btn.btn-primary(type='submit' data-ol-disabled-inflight)
+							span(data-ol-inflight='idle') Create #{entityName} in v2
+							span(hidden data-ol-inflight='pending') #{translate("creating")}…
diff --git a/services/web/app/views/user_membership/publisher-managers-react.pug b/services/web/app/views/user_membership/publisher-managers-react.pug
index 84bcbea80c..2f805079a7 100644
--- a/services/web/app/views/user_membership/publisher-managers-react.pug
+++ b/services/web/app/views/user_membership/publisher-managers-react.pug
@@ -1,15 +1,13 @@
-extends ../layout-marketing
+extends ../layout-react
 
 block entrypointVar
 	- entrypoint = 'pages/user/subscription/group-management/publisher-managers'
 
-block vars
-	- bootstrap5PageStatus = 'enabled' // One of 'disabled', 'enabled', and 'queryStringOnly'
-
 block append meta
-	meta(name="ol-users", data-type="json", content=users)
-	meta(name="ol-groupId", data-type="string", content=groupId)
-	meta(name="ol-groupName", data-type="string", content=name)
+	meta(name='ol-user' data-type='json' content=user)
+	meta(name='ol-users' data-type='json' content=users)
+	meta(name='ol-groupId' data-type='string' content=groupId)
+	meta(name='ol-groupName' data-type='string' content=name)
 
 block content
-	main.content.content-alt#subscription-manage-group-root
+	main#subscription-manage-group-root.content.content-alt
diff --git a/services/web/babel.config.json b/services/web/babel.config.json
index 9bb4c73829..0eee4a9880 100644
--- a/services/web/babel.config.json
+++ b/services/web/babel.config.json
@@ -6,7 +6,7 @@
       {
         "useBuiltIns": "usage",
         // This version must be aligned with the `core-js` version in `package.json`
-        "corejs": { "version": "3.38" },
+        "corejs": { "version": "3.41" },
         "exclude": [
           // Exclude Array.prototype.push polyfill, as it's not needed and affects performance in Chrome
           "es.array.push",
diff --git a/services/web/bin/routes b/services/web/bin/routes
index 2cf77e966c..707a5da161 100755
--- a/services/web/bin/routes
+++ b/services/web/bin/routes
@@ -39,9 +39,9 @@ const routerCall = callExpression => {
     (routerName === 'app' || routerName.match('^.*[rR]outer$'))
   ) {
     return {
-      routerName: routerName,
+      routerName,
       method: property.name,
-      args: args,
+      args,
     }
   } else {
     return null
@@ -55,27 +55,30 @@ const formatMethodCall = expression => {
 const parseAndPrintRoutesSync = path => {
   const content = fs.readFileSync(path)
   // Walk the AST (Abstract Syntax Tree)
-  acornWalk.simple(acorn.parse(content), {
-    // We only care about call expression ( like `a.b()` )
-    CallExpression(node) {
-      const call = routerCall(node)
-      if (call) {
-        const firstArg = _.first(call.args)
-        try {
-          print(
-            `  ${formatRouterName(call.routerName)}\t .${call.method} \t: ${
-              firstArg.value
-            } => ${call.args.slice(1).map(formatMethodCall).join(' => ')}`
-          )
-        } catch (e) {
-          print('>> Error')
-          print(e)
-          print(JSON.stringify(call))
-          process.exit(1)
+  acornWalk.simple(
+    acorn.parse(content, { sourceType: 'module', ecmaVersion: 2020 }),
+    {
+      // We only care about call expression ( like `a.b()` )
+      CallExpression(node) {
+        const call = routerCall(node)
+        if (call) {
+          const firstArg = _.first(call.args)
+          try {
+            print(
+              `  ${formatRouterName(call.routerName)}\t .${call.method} \t: ${
+                firstArg.value
+              } => ${call.args.slice(1).map(formatMethodCall).join(' => ')}`
+            )
+          } catch (e) {
+            print('>> Error')
+            print(e)
+            print(JSON.stringify(call))
+            process.exit(1)
+          }
         }
-      }
-    },
-  })
+      },
+    }
+  )
 }
 
 const routerNameMapping = {
@@ -101,7 +104,7 @@ const main = () => {
   }
 
   // Find all routers
-  glob('*[rR]outer.js', { matchBase: true }, (err, files) => {
+  glob('*[rR]outer.*js', { matchBase: true }, (err, files) => {
     if (err) {
       console.error(err)
       process.exit(1)
diff --git a/services/web/bin/test_unit_run_dir b/services/web/bin/test_unit_run_dir
new file mode 100755
index 0000000000..4d5d5ecb9a
--- /dev/null
+++ b/services/web/bin/test_unit_run_dir
@@ -0,0 +1,60 @@
+#!/bin/bash
+
+declare -a vitest_args=("$@")
+
+has_mocha_test=0
+has_vitest_test=0
+
+for dir_path in "$@"; do
+  if [ -n "$(find "$dir_path" -name "*.js" -type f -print -quit 2>/dev/null)" ]; then
+    has_mocha_test=1
+  fi
+
+  if [ -n "$(find "$dir_path" -name "*.test.mjs" -type f -print -quit 2>/dev/null)" ]; then
+    has_vitest_test=1
+  fi
+done
+
+if [[ -n "$MOCHA_GREP" ]]; then
+  vitest_args+=("--testNamePattern" "$MOCHA_GREP")
+fi
+
+if [[ -n "$VITEST_NO_CACHE" ]]; then
+  echo "Disabling cache for vitest."
+  vitest_args+=("--no-cache")
+fi
+
+echo "Running unit tests in directory: $*"
+
+# Remove this if/else when we have converted all module tests to vitest.
+if (( has_vitest_test == 1 )); then
+  npm run test:unit:esm -- "${vitest_args[@]}"
+  vitest_status=$?
+else
+  echo "No vitest tests found in $*, skipping vitest step."
+  vitest_status=0
+fi
+
+if (( has_mocha_test == 1 )); then
+  mocha --recursive --timeout 25000 --exit --grep="$MOCHA_GREP" --require test/unit/bootstrap.js --extension=js "$@"
+  mocha_status=$?
+else
+  echo "No mocha tests found in $TARGET_DIR, skipping mocha step."
+  mocha_status=0
+fi
+
+if [ "$mocha_status" -eq 0 ] && [ "$vitest_status" -eq 0 ]; then
+  exit 0
+fi
+
+# Report status briefly at the end for failures
+
+if [ "$mocha_status" -ne 0 ]; then
+  echo "Mocha tests failed with status: $mocha_status"
+fi
+
+if [ "$vitest_status" -ne 0 ]; then
+  echo "Vitest tests failed with status: $vitest_status"
+fi
+
+exit 1
diff --git a/services/web/cloudbuild-storybook.yaml b/services/web/cloudbuild-storybook.yaml
index ac9cfeba7d..be39704062 100644
--- a/services/web/cloudbuild-storybook.yaml
+++ b/services/web/cloudbuild-storybook.yaml
@@ -1,13 +1,13 @@
 steps:
   - id: npm_ci
-    name: "node:20.18.2"
+    name: "node:22.17.0"
     entrypoint: /bin/bash
     args:
       - '-c'
       - 'bin/npm_install_subset . libraries/* services/web'
 
   - id: build-storybook
-    name: 'node:20.18.2'
+    name: 'node:22.17.0'
     env:
       - 'BRANCH_NAME=$BRANCH_NAME'
       - 'BUILD_ID=$BUILD_ID'
@@ -49,7 +49,7 @@ steps:
       - deploy-storybook
 
   - id: create-storybook-index
-    name: 'node:20.18.2'
+    name: 'node:22.17.0'
     dir: services/web
     env:
       - 'BRANCH_NAME=$BRANCH_NAME'
diff --git a/services/web/config/settings.defaults.js b/services/web/config/settings.defaults.js
index 1f86da66a0..ca501daf51 100644
--- a/services/web/config/settings.defaults.js
+++ b/services/web/config/settings.defaults.js
@@ -1,4 +1,4 @@
-const Path = require('path')
+const Path = require('node:path')
 const { merge } = require('@overleaf/settings/merge')
 
 let defaultFeatures, siteUrl
@@ -242,6 +242,9 @@ module.exports = {
       submissionBackendClass:
         process.env.CLSI_SUBMISSION_BACKEND_CLASS || 'n2d',
     },
+    clsiCache: {
+      instances: JSON.parse(process.env.CLSI_CACHE_INSTANCES || '[]'),
+    },
     project_history: {
       sendProjectStructureOps: true,
       url: `http://${process.env.PROJECT_HISTORY_HOST || '127.0.0.1'}:3054`,
@@ -261,6 +264,9 @@ module.exports = {
     notifications: {
       url: `http://${process.env.NOTIFICATIONS_HOST || '127.0.0.1'}:3042`,
     },
+    references: {
+      url: `http://${process.env.REFERENCES_HOST || '127.0.0.1'}:3056`,
+    },
     webpack: {
       url: `http://${process.env.WEBPACK_HOST || '127.0.0.1'}:3808`,
     },
@@ -384,6 +390,7 @@ module.exports = {
   adminUrl: process.env.ADMIN_URL,
   adminOnlyLogin: process.env.ADMIN_ONLY_LOGIN === 'true',
   adminPrivilegeAvailable: process.env.ADMIN_PRIVILEGE_AVAILABLE === 'true',
+  adminRolesEnabled: false,
   blockCrossOriginRequests: process.env.BLOCK_CROSS_ORIGIN_REQUESTS === 'true',
   allowedOrigins: (process.env.ALLOWED_ORIGINS || siteUrl).split(','),
 
@@ -436,6 +443,9 @@ module.exports = {
     ','
   ),
 
+  filestoreMigrationLevel:
+    parseInt(process.env.OVERLEAF_FILESTORE_MIGRATION_LEVEL, 10) || 0,
+
   // i18n
   // ------
   //
@@ -707,12 +717,13 @@ module.exports = {
   //   - the doc content
   //   - text ranges spanning the whole doc
   //
-  // There's also overhead required for the JSON encoding and the UTF-8 encoding,
-  // theoretically up to 3 times the max doc length. On the other hand, we don't
-  // want to block the event loop with JSON parsing, so we try to find a
-  // practical compromise.
+  // There's also overhead required for the JSON encoding and the UTF-8
+  // encoding, theoretically up to 6 times the max doc length (e.g. a document
+  // entirely filled with "\u0011" characters). On the other hand, we don't want
+  // to block the event loop with JSON parsing, so we try to find a practical
+  // compromise.
   max_json_request_size:
-    parseInt(process.env.MAX_JSON_REQUEST_SIZE) || 6 * 1024 * 1024, // 6 MB
+    parseInt(process.env.MAX_JSON_REQUEST_SIZE) || 12 * 1024 * 1024, // 12 MB
 
   // Internal configs
   // ----------------
@@ -803,7 +814,10 @@ module.exports = {
     '/templates/index': '/templates/',
   },
 
-  reloadModuleViewsOnEachRequest: process.env.NODE_ENV === 'development',
+  enablePugCache: process.env.ENABLE_PUG_CACHE === 'true',
+  reloadModuleViewsOnEachRequest:
+    process.env.ENABLE_PUG_CACHE !== 'true' &&
+    process.env.NODE_ENV === 'development',
 
   rateLimit: {
     subnetRateLimiterDisabled:
@@ -890,6 +904,7 @@ module.exports = {
           'figcaption',
           'span',
           'source',
+          'track',
           'video',
           'del',
         ],
@@ -915,7 +930,7 @@ module.exports = {
           col: ['width'],
           figure: ['class', 'id', 'style'],
           figcaption: ['class', 'id', 'style'],
-          i: ['aria-hidden', 'aria-label', 'class', 'id'],
+          i: ['aria-hidden', 'aria-label', 'class', 'id', 'translate'],
           iframe: [
             'allowfullscreen',
             'frameborder',
@@ -940,6 +955,7 @@ module.exports = {
             'style',
           ],
           tr: ['class'],
+          track: ['src', 'kind', 'srcLang', 'label'],
           video: ['alt', 'class', 'controls', 'height', 'width'],
         },
       },
@@ -963,11 +979,13 @@ module.exports = {
     editorToolbarButtons: [],
     sourceEditorExtensions: [],
     sourceEditorComponents: [],
+    pdfLogEntryHeaderActionComponents: [],
     pdfLogEntryComponents: [],
     pdfLogEntriesComponents: [],
+    pdfPreviewPromotions: [],
     diagnosticActions: [],
     sourceEditorCompletionSources: [],
-    sourceEditorSymbolPalette: [],
+    sourceEditorSymbolPalette: ['@/features/symbol-palette/components/symbol-palette'],
     sourceEditorToolbarComponents: [],
     mainEditorLayoutModals: [],
     langFeedbackLinkingWidgets: [],
@@ -977,7 +995,7 @@ module.exports = {
     importProjectFromGithubModalWrapper: [],
     importProjectFromGithubMenu: [],
     editorLeftMenuSync: [],
-    editorLeftMenuManageTemplate: [],
+    editorLeftMenuManageTemplate: ['@/features/editor-left-menu/components/actions-manage-template'],
     oauth2Server: [],
     managedGroupSubscriptionEnrollmentNotification: [],
     managedGroupEnrollmentInvite: [],
@@ -989,11 +1007,28 @@ module.exports = {
     settingsEntries: [],
     autoCompleteExtensions: [],
     sectionTitleGenerators: [],
-    toastGenerators: [],
-    editorSidebarComponents: [],
-    fileTreeToolbarComponents: [],
+    toastGenerators: [
+      Path.resolve(
+        __dirname,
+        '../frontend/js/features/pdf-preview/components/synctex-toasts'
+      ),
+    ],
+    editorSidebarComponents: [
+      Path.resolve(
+        __dirname,
+        '../modules/full-project-search/frontend/js/components/full-project-search.tsx'
+      ),
+    ],
+    fileTreeToolbarComponents: [
+      Path.resolve(
+        __dirname,
+        '../modules/full-project-search/frontend/js/components/full-project-search-button.tsx'
+      ),
+    ],
+    fullProjectSearchPanel: [],
     integrationPanelComponents: [],
     referenceSearchSetting: [],
+    errorLogsComponents: [],
   },
 
   moduleImportSequence: [
@@ -1001,6 +1036,13 @@ module.exports = {
     'launchpad',
     'server-ce-scripts',
     'user-activate',
+    'sandboxed-compiles',
+    'symbol-palette',
+    'track-changes',
+    'authentication/ldap',
+    'authentication/saml',
+    'authentication/oidc',
+    'template-gallery',
   ],
   viewIncludes: {},
 
@@ -1027,6 +1069,20 @@ module.exports = {
   managedUsers: {
     enabled: false,
   },
+
+  oauthProviders: {
+    ...(process.env.EXTERNAL_AUTH && process.env.EXTERNAL_AUTH.includes('oidc') && {
+      [process.env.OVERLEAF_OIDC_PROVIDER_ID || 'oidc']: {
+        name: process.env.OVERLEAF_OIDC_PROVIDER_NAME || 'OIDC Provider',
+        descriptionKey: process.env.OVERLEAF_OIDC_PROVIDER_DESCRIPTION,
+        descriptionOptions: { link: process.env.OVERLEAF_OIDC_PROVIDER_INFO_LINK },
+        hideWhenNotLinked: process.env.OVERLEAF_OIDC_PROVIDER_HIDE_NOT_LINKED ?
+          process.env.OVERLEAF_OIDC_PROVIDER_HIDE_NOT_LINKED.toLowerCase() === 'true' : undefined,
+        linkPath: '/oidc/login',
+      },
+    }),
+  },
+
 }
 
 module.exports.mergeWith = function (overrides) {
diff --git a/services/web/cypress/fixtures/build/mock-writefull-api.js b/services/web/cypress/fixtures/build/mock-writefull-api.js
index 4ba52ba2c8..a70a28653e 100644
--- a/services/web/cypress/fixtures/build/mock-writefull-api.js
+++ b/services/web/cypress/fixtures/build/mock-writefull-api.js
@@ -1 +1,4 @@
-module.exports = {}
+module.exports = {
+  addEventListener: () => {},
+  removeEventListener: () => {},
+}
diff --git a/services/web/cypress/support/ct/commands/index.ts b/services/web/cypress/support/ct/commands/index.ts
index 4ad9c7940c..f5528bc1bb 100644
--- a/services/web/cypress/support/ct/commands/index.ts
+++ b/services/web/cypress/support/ct/commands/index.ts
@@ -1,4 +1,4 @@
-import { mount } from 'cypress/react'
+import { mount } from 'cypress/react18'
 
 // eslint-disable-next-line no-unused-vars,@typescript-eslint/no-namespace
 declare global {
diff --git a/services/web/cypress/support/ct/window.ts b/services/web/cypress/support/ct/window.ts
index 3f415cf3c5..ae2a194bc1 100644
--- a/services/web/cypress/support/ct/window.ts
+++ b/services/web/cypress/support/ct/window.ts
@@ -10,7 +10,6 @@ export function resetMeta() {
     hasLinkedProjectOutputFileFeature: true,
     hasLinkUrlFeature: true,
   })
-  window.metaAttributesCache.set('ol-bootstrapVersion', 5)
 }
 
 // Populate meta for top-level access in modules on import
diff --git a/services/web/cypress/support/shared/commands/compile.ts b/services/web/cypress/support/shared/commands/compile.ts
index 90567d8e74..44ee9c0805 100644
--- a/services/web/cypress/support/shared/commands/compile.ts
+++ b/services/web/cypress/support/shared/commands/compile.ts
@@ -43,8 +43,43 @@ const outputFiles = () => {
   ]
 }
 
-export const interceptCompile = (prefix = 'compile', times = 1) => {
-  cy.intercept(
+const compileFromCacheResponse = () => {
+  return {
+    fromCache: true,
+    status: 'success',
+    clsiServerId: 'foo',
+    clsiCacheShard: 'clsi-cache-zone-b-shard-1',
+    compileGroup: 'priority',
+    pdfDownloadDomain: 'https://clsi.test-overleaf.com',
+    outputFiles: outputFiles(),
+    options: {
+      rootResourcePath: 'main.tex',
+      imageName: 'texlive-full:2024.1',
+      compiler: 'pdflatex',
+      stopOnFirstError: false,
+      draft: false,
+    },
+  }
+}
+
+export const interceptCompileFromCacheRequest = ({
+  times,
+  promise,
+}: {
+  times: number
+  promise: Promise<void>
+}) => {
+  return cy.intercept(
+    { path: '/project/*/output/cached/output.overleaf.json', times },
+    async req => {
+      await promise
+      req.reply({ body: compileFromCacheResponse() })
+    }
+  )
+}
+
+export const interceptCompileRequest = ({ times = 1 } = {}) => {
+  return cy.intercept(
     { method: 'POST', pathname: '/project/*/compile', times },
     {
       body: {
@@ -55,11 +90,48 @@ export const interceptCompile = (prefix = 'compile', times = 1) => {
         outputFiles: outputFiles(),
       },
     }
-  ).as(`${prefix}`)
+  )
+}
+
+export const interceptCompile = ({
+  prefix = 'compile',
+  times = 1,
+  cached = false,
+  regular = true,
+  outputPDFFixture = 'output.pdf',
+} = {}) => {
+  if (cached) {
+    cy.intercept(
+      { path: '/project/*/output/cached/output.overleaf.json', times },
+      { body: compileFromCacheResponse() }
+    ).as(`${prefix}-cached`)
+  } else {
+    cy.intercept(
+      { pathname: '/project/*/output/cached/output.overleaf.json', times },
+      { statusCode: 404 }
+    ).as(`${prefix}-cached`)
+  }
+
+  if (regular) {
+    interceptCompileRequest({ times }).as(`${prefix}`)
+  } else {
+    cy.intercept(
+      { method: 'POST', pathname: '/project/*/compile', times },
+      {
+        body: {
+          status: 'unavailable',
+          clsiServerId: 'foo',
+          compileGroup: 'priority',
+          pdfDownloadDomain: 'https://clsi.test-overleaf.com',
+          outputFiles: [],
+        },
+      }
+    ).as(`${prefix}`)
+  }
 
   cy.intercept(
     { pathname: '/build/*/output.pdf', times },
-    { fixture: 'build/output.pdf,null' }
+    { fixture: `build/${outputPDFFixture},null` }
   ).as(`${prefix}-pdf`)
 
   cy.intercept(
@@ -73,12 +145,36 @@ export const interceptCompile = (prefix = 'compile', times = 1) => {
   ).as(`${prefix}-blg`)
 }
 
-export const waitForCompile = ({ prefix = 'compile', pdf = false } = {}) => {
-  cy.wait(`@${prefix}`)
+export const waitForCompile = ({
+  prefix = 'compile',
+  pdf = false,
+  cached = false,
+  regular = true,
+} = {}) => {
+  if (cached) {
+    cy.wait(`@${prefix}-cached`)
+  }
+  if (regular) {
+    cy.wait(`@${prefix}`)
+  }
+  return waitForCompileOutput({ prefix, pdf, cached })
+}
+
+export const waitForCompileOutput = ({
+  prefix = 'compile',
+  pdf = false,
+  cached = false,
+} = {}) => {
   cy.wait(`@${prefix}-log`)
+    .its('request.query.clsiserverid')
+    .should('eq', cached ? 'clsi-cache-zone-b-shard-1' : 'foo') // straight from cache if cached
   cy.wait(`@${prefix}-blg`)
+    .its('request.query.clsiserverid')
+    .should('eq', cached ? 'clsi-cache-zone-b-shard-1' : 'foo') // straight from cache if cached
   if (pdf) {
     cy.wait(`@${prefix}-pdf`)
+      .its('request.query.clsiserverid')
+      .should('eq', 'foo') // always from VM first
   }
   return cy.wrap(null)
 }
diff --git a/services/web/cypress/support/shared/commands/index.ts b/services/web/cypress/support/shared/commands/index.ts
index cd39f8f5d1..bb55fdddac 100644
--- a/services/web/cypress/support/shared/commands/index.ts
+++ b/services/web/cypress/support/shared/commands/index.ts
@@ -1,8 +1,10 @@
 import '@testing-library/cypress/add-commands'
 import {
   interceptCompile,
+  interceptCompileFromCacheRequest,
   waitForCompile,
   interceptDeferredCompile,
+  interceptCompileRequest,
 } from './compile'
 import { interceptEvents } from './events'
 import { interceptAsync } from './intercept-async'
@@ -21,6 +23,8 @@ declare global {
     interface Chainable {
       interceptAsync: typeof interceptAsync
       interceptCompile: typeof interceptCompile
+      interceptCompileRequest: typeof interceptCompileRequest
+      interceptCompileFromCacheRequest: typeof interceptCompileFromCacheRequest
       interceptEvents: typeof interceptEvents
       interceptMetadata: typeof interceptMetadata
       waitForCompile: typeof waitForCompile
@@ -36,6 +40,11 @@ declare global {
 
 Cypress.Commands.add('interceptAsync', interceptAsync)
 Cypress.Commands.add('interceptCompile', interceptCompile)
+Cypress.Commands.add('interceptCompileRequest', interceptCompileRequest)
+Cypress.Commands.add(
+  'interceptCompileFromCacheRequest',
+  interceptCompileFromCacheRequest
+)
 Cypress.Commands.add('interceptEvents', interceptEvents)
 Cypress.Commands.add('interceptMetadata', interceptMetadata)
 Cypress.Commands.add('waitForCompile', waitForCompile)
diff --git a/services/web/docker-compose.ci.yml b/services/web/docker-compose.ci.yml
index c277cc0e97..8376103315 100644
--- a/services/web/docker-compose.ci.yml
+++ b/services/web/docker-compose.ci.yml
@@ -13,6 +13,9 @@ services:
     logging:
       driver: local
     user: node
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:unit:app
     working_dir: /overleaf/services/web
     env_file: docker-compose.common.env
@@ -21,6 +24,7 @@ services:
       OVERLEAF_CONFIG:
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+      VITEST_NO_CACHE: true
     depends_on:
       - mongo
 
@@ -38,6 +42,9 @@ services:
       OVERLEAF_CONFIG:
     extra_hosts:
       - 'www.overleaf.test:127.0.0.1'
+    volumes:
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run test:acceptance:app
     user: root
     depends_on:
@@ -85,10 +92,10 @@ services:
     user: root
 
   redis:
-    image: redis
+    image: redis:7.4.3
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     logging:
       driver: none
     command: --replSet overleaf
diff --git a/services/web/docker-compose.common.env b/services/web/docker-compose.common.env
index 7f94f5714a..8facd00c2c 100644
--- a/services/web/docker-compose.common.env
+++ b/services/web/docker-compose.common.env
@@ -41,6 +41,6 @@ OVERLEAF_SAML_UPDATE_USER_DETAILS_ON_LOGIN=true
 OVERLEAF_SAML_CERT=MIIDXTCCAkWgAwIBAgIJAOvOeQ4xFTzsMA0GCSqGSIb3DQEBCwUAMEUxCzAJBgNVBAYTAkdCMRMwEQYDVQQIDApTb21lLVN0YXRlMSEwHwYDVQQKDBhJbnRlcm5ldCBXaWRnaXRzIFB0eSBMdGQwHhcNMTYxMTE1MTQxMjU5WhcNMjYxMTE1MTQxMjU5WjBFMQswCQYDVQQGEwJHQjETMBEGA1UECAwKU29tZS1TdGF0ZTEhMB8GA1UECgwYSW50ZXJuZXQgV2lkZ2l0cyBQdHkgTHRkMIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAxCT6MBe5G9VoLU8MfztOEbUhnwLp17ak8eFUqxqeXkkqtWB0b/cmIBU3xoQoO3dIF8PBzfqehqfYVhrNt/TFgcmDfmJnPJRL1RJWMW3VmiP5odJ3LwlkKbZpkeT3wZ8HEJIR1+zbpxiBNkbd2GbdR1iumcsHzMYX1A2CBj+ZMV5VijC+K4P0e9c05VsDEUtLmfeAasJAiumQoVVgAe/BpiXjICGGewa6EPFI7mKkifIRKOGxdRESwZZjxP30bI31oDN0cgKqIgSJtJ9nfCn9jgBMBkQHu42WMuaWD4jrGd7+vYdX+oIfArs9aKgAH5kUGhGdew2R9SpBefrhbNxG8QIDAQABo1AwTjAdBgNVHQ4EFgQU+aSojSyyLChP/IpZcafvSdhj7KkwHwYDVR0jBBgwFoAU+aSojSyyLChP/IpZcafvSdhj7KkwDAYDVR0TBAUwAwEB/zANBgkqhkiG9w0BAQsFAAOCAQEABl3+OOVLBWMKs6PjA8lPuloWDNzSr3v76oUcHqAb+cfbucjXrOVsS9RJ0X9yxvCQyfM9FfY43DbspnN3izYhdvbJD8kKLNf0LA5st+ZxLfy0ACyL2iyAwICaqndqxAjQYplFAHmpUiu1DiHckyBPekokDJd+ze95urHMOsaGS5RWPoKJVE0bkaAeZCmEu0NNpXRSBiuxXSTeSAJfv6kyE/rkdhzUKyUl/cGQFrsVYfAFQVA+W6CKOh74ErSEzSHQQYndl7nD33snD/YqdU1ROxV6aJzLKCg+sdj+wRXSP2u/UHnM4jW9TGJfhO42jzL6WVuEvr9q4l7zWzUQKKKhtQ==
 # DEVICE_HISTORY_SECRET has been generated using:
 # NOTE: crypto.generateKeySync was added in v15, v16 is the next LTS release.
-# $ docker run --rm node:20.18.2 --print 'require("crypto").generateKeySync("aes", { length: 256 }).export().toString("hex")'
+# $ docker run --rm node:22.17.0 --print 'require("crypto").generateKeySync("aes", { length: 256 }).export().toString("hex")'
 DEVICE_HISTORY_SECRET=1b46e6cdf72db02845da06c9517c9cfbbfa0d87357479f4e1df3ce160bd54807
 QUEUE_PROCESSING_ENABLED=true
diff --git a/services/web/docker-compose.cypress.yml b/services/web/docker-compose.cypress.yml
index 5c0cb95c1b..9568fef98f 100644
--- a/services/web/docker-compose.cypress.yml
+++ b/services/web/docker-compose.cypress.yml
@@ -4,6 +4,7 @@ services:
     volumes:
       - ../../:/overleaf
       - /tmp/.X11-unix:/tmp/.X11-unix
+      - ${XAUTHORITY:-/dev/null}:/home/node/.Xauthority
     working_dir: /overleaf/services/web
     entrypoint: npm
     command: run cypress:open-ct
diff --git a/services/web/docker-compose.yml b/services/web/docker-compose.yml
index c6a5aa7482..e0a4a064c5 100644
--- a/services/web/docker-compose.yml
+++ b/services/web/docker-compose.yml
@@ -6,11 +6,12 @@ volumes:
 services:
 
   test_unit:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/web
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     working_dir: /overleaf/services/web
     env_file: docker-compose.common.env
     environment:
@@ -20,17 +21,19 @@ services:
       LOG_LEVEL: ${LOG_LEVEL:-}
       NODE_ENV: test
       NODE_OPTIONS: "--unhandled-rejections=strict"
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:unit:app
     user: node
     depends_on:
       - mongo
 
   test_acceptance:
-    image: node:20.18.2
+    image: node:22.17.0
     volumes:
       - .:/overleaf/services/web
       - ../../node_modules:/overleaf/node_modules
       - ../../libraries:/overleaf/libraries
+      - ../../bin/shared/wait_for_it:/overleaf/bin/shared/wait_for_it
     user: node
     working_dir: /overleaf/services/web
     env_file: docker-compose.common.env
@@ -50,6 +53,7 @@ services:
       - mongo
       - saml
       - ldap
+    entrypoint: /overleaf/bin/shared/wait_for_it mongo:27017 --timeout=0 --
     command: npm run --silent test:acceptance:app
 
   test_frontend:
@@ -84,10 +88,10 @@ services:
       - "cypress:run-ct"
 
   redis:
-    image: redis
+    image: redis:7.4.3
 
   mongo:
-    image: mongo:6.0.13
+    image: mongo:8.0.11
     command: --replSet overleaf
     volumes:
       - ../../bin/shared/mongodb-init-replica-set.js:/docker-entrypoint-initdb.d/mongodb-init-replica-set.js
diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json
index b826f386fb..0d575ef916 100644
--- a/services/web/frontend/extracted-translations.json
+++ b/services/web/frontend/extracted-translations.json
@@ -1,16 +1,18 @@
 {
-  "12x_more_compile_time": "",
+  "0_free_suggestions": "",
   "1_2_width": "",
   "1_4_width": "",
+  "1_free_suggestion": "",
+  "24x_more_compile_time": "",
   "3_4_width": "",
   "About": "",
   "Account": "",
-  "Account Settings": "",
   "Documentation": "",
   "Get Involved": "",
   "Help": "",
   "Learn": "",
-  "Plans and Pricing": "",
+  "Pricing": "",
+  "Solutions": "",
   "a_custom_size_has_been_used_in_the_latex_code": "",
   "a_fatal_compile_error_that_completely_blocks_compilation": "",
   "a_file_with_that_name_already_exists_and_will_be_overriden": "",
@@ -24,26 +26,31 @@
   "about_to_delete_cert": "",
   "about_to_delete_projects": "",
   "about_to_delete_tag": "",
+  "about_to_delete_template": "",
   "about_to_delete_the_following_project": "",
   "about_to_delete_the_following_projects": "",
   "about_to_delete_user_preamble": "",
   "about_to_enable_managed_users": "",
   "about_to_leave_project": "",
   "about_to_leave_projects": "",
+  "about_to_remove_user_preamble": "",
   "about_to_trash_projects": "",
-  "about_writefull": "",
+  "abstract": "",
+  "accept_all_cookies": "",
   "accept_and_continue": "",
   "accept_change": "",
   "accept_change_error_description": "",
   "accept_change_error_title": "",
   "accept_invitation": "",
-  "accept_or_reject_each_changes_individually": "",
+  "accept_or_reject_individual_edits": "",
   "accept_selected_changes": "",
   "accept_terms_and_conditions": "",
   "accepted_invite": "",
+  "access_all_premium_features": "",
   "access_denied": "",
   "access_edit_your_projects": "",
   "access_levels_changed": "",
+  "access_your_favourite_features_faster_with_our_new_streamlined_editor": "",
   "account_billed_manually": "",
   "account_has_been_link_to_institution_account": "",
   "account_has_past_due_invoice_change_plan_warning": "",
@@ -58,6 +65,10 @@
   "add_add_on_to_your_plan": "",
   "add_additional_certificate": "",
   "add_affiliation": "",
+  "add_ai_assist": "",
+  "add_ai_assist_annual_and_get_unlimited_access": "",
+  "add_ai_assist_monthly_and_get_unlimited_access": "",
+  "add_ai_assist_to_your_plan": "",
   "add_another_address_line": "",
   "add_another_email": "",
   "add_another_token": "",
@@ -66,27 +77,24 @@
   "add_comment_error_message": "",
   "add_comment_error_title": "",
   "add_company_details": "",
-  "add_company_details_lowercase": "",
   "add_email_address": "",
   "add_email_to_claim_features": "",
   "add_error_assist_annual_to_your_projects": "",
   "add_error_assist_to_your_projects": "",
   "add_files": "",
-  "add_more_editors": "",
+  "add_more_collaborators": "",
   "add_more_licenses_to_my_plan": "",
   "add_more_managers": "",
   "add_new_email": "",
   "add_on": "",
   "add_ons": "",
   "add_or_remove_project_from_tag": "",
-  "add_overleaf_assist": "",
-  "add_overleaf_assist_to_your_group_subscription": "",
-  "add_overleaf_assist_to_your_institution": "",
-  "add_overleaf_assist_to_your_plan": "",
   "add_people": "",
   "add_role_and_department": "",
   "add_to_dictionary": "",
   "add_to_tag": "",
+  "add_unlimited_ai_to_overleaf": "",
+  "add_unlimited_ai_to_your_overleaf_plan": "",
   "add_your_comment_here": "",
   "add_your_first_group_member_now": "",
   "added_by_on": "",
@@ -100,7 +108,11 @@
   "after_that_well_bill_you_x_total_y_subtotal_z_tax_annually_on_date_unless_you_cancel": "",
   "aggregate_changed": "",
   "aggregate_to": "",
+  "agree": "",
   "agree_with_the_terms": "",
+  "ai_assist_in_overleaf_is_included_via_writefull_groups": "",
+  "ai_assist_in_overleaf_is_included_via_writefull_individual": "",
+  "ai_assist_unavailable_due_to_subscription_type": "",
   "ai_assistance_to_help_you": "",
   "ai_based_language_tools": "",
   "ai_can_make_mistakes": "",
@@ -119,12 +131,13 @@
   "all_premium_features_including": "",
   "all_projects": "",
   "all_projects_will_be_transferred_immediately": "",
+  "all_templates": "",
   "all_these_experiments_are_available_exclusively": "",
   "allows_to_search_by_author_title_etc_possible_to_pull_results_directly_from_your_reference_manager_if_connected": "",
-  "already_subscribed_try_refreshing_the_page": "",
   "an_email_has_already_been_sent_to": "",
   "an_error_occured_while_restoring_project": "",
   "an_error_occurred_when_verifying_the_coupon_code": "",
+  "and_upgrade_for_compile_time": "",
   "annual_discount": "",
   "anonymous": "",
   "anyone_with_link_can_edit": "",
@@ -149,6 +162,7 @@
   "ask_repo_owner_to_reconnect": "",
   "ask_repo_owner_to_renew_overleaf_subscription": "",
   "at_most_x_libraries_can_be_selected": "",
+  "author": "",
   "auto_close_brackets": "",
   "auto_compile": "",
   "auto_complete": "",
@@ -166,7 +180,6 @@
   "back_to_subscription": "",
   "back_to_your_projects": "",
   "basic_compile_time": "",
-  "become_an_advisor": "",
   "before_you_use_error_assistant": "",
   "beta_program_already_participating": "",
   "beta_program_benefits": "",
@@ -179,17 +192,22 @@
   "blank_project": "",
   "blocked_filename": "",
   "blog": "",
+  "bold": "",
+  "booktabs": "",
+  "breadcrumbs": "",
   "browser": "",
+  "bullet_list": "",
   "buy_licenses": "",
   "buy_more_licenses": "",
   "by_subscribing_you_agree_to_our_terms_of_service": "",
-  "can_edit_content": "",
   "can_link_institution_email_acct_to_institution_acct": "",
   "can_link_your_institution_acct_2": "",
   "can_now_relink_dropbox": "",
   "can_view_content": "",
   "cancel": "",
   "cancel_add_on": "",
+  "cancel_any_existing_subscriptions": "",
+  "cancel_any_existing_subscriptions_and_leave_any_group_subscriptions": "",
   "cancel_anytime": "",
   "cancel_my_account": "",
   "cancel_my_subscription": "",
@@ -202,11 +220,14 @@
   "cant_see_what_youre_looking_for_question": "",
   "caption_above": "",
   "caption_below": "",
+  "captions": "",
   "card_details": "",
   "card_details_are_not_valid": "",
   "card_must_be_authenticated_by_3dsecure": "",
   "card_payment": "",
   "careers": "",
+  "categories": "",
+  "category": "",
   "category_arrows": "",
   "category_greek": "",
   "category_misc": "",
@@ -215,6 +236,7 @@
   "center": "",
   "change": "",
   "change_currency": "",
+  "change_email": "",
   "change_language": "",
   "change_or_cancel-cancel": "",
   "change_or_cancel-change": "",
@@ -240,10 +262,10 @@
   "choose_from_group_members": "",
   "choose_how_you_search_your_references": "",
   "choose_which_experiments": "",
+  "citation": "",
   "clear_cached_files": "",
   "clear_search": "",
   "click_here_to_view_sl_in_lng": "",
-  "click_to_give_feedback": "",
   "click_to_unpause": "",
   "clicking_delete_will_remove_sso_config_and_clear_saml_data": "",
   "clone_with_git": "",
@@ -253,11 +275,10 @@
   "code_check_failed": "",
   "code_check_failed_explanation": "",
   "code_editor": "",
-  "code_editor_tooltip_message": "",
-  "code_editor_tooltip_title": "",
   "collaborate_online_and_offline": "",
   "collaborator_chat": "",
   "collabs_per_proj": "",
+  "collabs_per_proj_multiple": "",
   "collabs_per_proj_single": "",
   "collapse": "",
   "column_width": "",
@@ -266,6 +287,7 @@
   "comment": "",
   "comment_only": "",
   "comment_only_upgrade_for_track_changes": "",
+  "comment_only_upgrade_to_enable_track_changes": "",
   "common": "",
   "common_causes_of_compile_timeouts_include": "",
   "commons_plan_tooltip": "",
@@ -277,6 +299,8 @@
   "compile_error_entry_description": "",
   "compile_error_handling": "",
   "compile_larger_projects": "",
+  "compile_limit_reached": "",
+  "compile_limit_upgrade_prompt": "",
   "compile_mode": "",
   "compile_terminated_by_user": "",
   "compiler": "",
@@ -295,6 +319,7 @@
   "confirm_reject_selected_changes": "",
   "confirm_reject_selected_changes_plural": "",
   "confirm_remove_sso_config_enter_email": "",
+  "confirm_remove_user_type_email_address": "",
   "confirm_secondary_email": "",
   "confirm_your_email": "",
   "confirming": "",
@@ -313,6 +338,8 @@
   "continue_to": "",
   "continue_using_free_features": "",
   "continue_with_free_plan": "",
+  "cookie_banner": "",
+  "cookie_banner_info": "",
   "copied": "",
   "copy": "",
   "copy_code": "",
@@ -332,6 +359,7 @@
   "create_project_in_github": "",
   "created": "",
   "created_at": "",
+  "cross_reference": "",
   "current_file": "",
   "current_password": "",
   "currently_seeing_only_24_hrs_history": "",
@@ -339,12 +367,14 @@
   "currently_subscribed_to_plan": "",
   "custom": "",
   "custom_borders": "",
+  "customer_stories": "",
   "customize_your_group_subscription": "",
   "customizing_figures": "",
   "customizing_tables": "",
-  "dark_mode": "",
+  "date": "",
   "date_and_owner": "",
   "dealing_with_errors": "",
+  "decrease_indent": "",
   "delete": "",
   "delete_account": "",
   "delete_account_confirmation_label": "",
@@ -367,6 +397,7 @@
   "delete_sso_config": "",
   "delete_table": "",
   "delete_tag": "",
+  "delete_template": "",
   "delete_token": "",
   "delete_user": "",
   "delete_your_account": "",
@@ -375,6 +406,7 @@
   "deleted_by_id": "",
   "deleted_by_ip": "",
   "deleted_by_on": "",
+  "deleted_user": "",
   "deleting": "",
   "demonstrating_git_integration": "",
   "demonstrating_track_changes_feature": "",
@@ -388,15 +420,22 @@
   "disable_equation_preview": "",
   "disable_equation_preview_confirm": "",
   "disable_equation_preview_enable": "",
+  "disable_equation_preview_enable_in_settings": "",
   "disable_single_sign_on": "",
   "disable_sso": "",
   "disable_stop_on_first_error": "",
+  "disabled": "",
+  "disabling": "",
+  "disagree": "",
   "disconnected": "",
   "discount": "",
   "discount_of": "",
+  "discover_research_writing_toolkit": "",
+  "discover_research_writing_toolkit_description": "",
   "discover_the_fastest_way_to_search_and_cite": "",
-  "dismiss_error_popup": "",
+  "display": "",
   "display_deleted_user": "",
+  "display_math": "",
   "do_you_need_edit_access": "",
   "do_you_want_to_change_your_primary_email_address_to": "",
   "do_you_want_to_overwrite_it": "",
@@ -415,6 +454,7 @@
   "done": "",
   "dont_forget_you_currently_have": "",
   "dont_reload_or_close_this_tab": "",
+  "double_clicking_on_the_pdf_shows": "",
   "download": "",
   "download_all": "",
   "download_as_pdf": "",
@@ -451,16 +491,18 @@
   "edit": "",
   "edit_comment_error_message": "",
   "edit_comment_error_title": "",
+  "edit_content_directly": "",
   "edit_dictionary": "",
   "edit_dictionary_empty": "",
   "edit_dictionary_remove": "",
   "edit_figure": "",
   "edit_sso_configuration": "",
   "edit_tag": "",
+  "edit_template": "",
   "edit_your_custom_dictionary": "",
   "editing": "",
   "editing_captions": "",
-  "editing_tools_to_paraphrase_change_style_and_more": "",
+  "editing_tools": "",
   "editor": "",
   "editor_and_pdf": "",
   "editor_disconected_click_to_reconnect": "",
@@ -494,12 +536,11 @@
   "enable_single_sign_on": "",
   "enable_sso": "",
   "enable_stop_on_first_error_under_recompile_dropdown_menu": "",
-  "enable_stop_on_first_error_under_recompile_dropdown_menu_v2": "",
   "enabled": "",
   "enables_real_time_syntax_checking_in_the_editor": "",
+  "enabling": "",
   "end_of_document": "",
   "ensure_recover_account": "",
-  "enter_6_digit_code": "",
   "enter_any_size_including_units_or_valid_latex_command": "",
   "enter_image_url": "",
   "enter_the_code": "",
@@ -509,11 +550,12 @@
   "equation_preview": "",
   "error": "",
   "error_assist": "",
-  "error_assist_to_help_fixing_latex_errors": "",
+  "error_log": "",
   "error_opening_document": "",
   "error_opening_document_detail": "",
   "error_performing_request": "",
   "error_processing_file": "",
+  "essential_cookies_only": "",
   "example_project": "",
   "existing_plan_active_until_term_end": "",
   "expand": "",
@@ -532,6 +574,7 @@
   "fast": "",
   "fast_draft": "",
   "features_like_track_changes": "",
+  "figure": "",
   "file": "",
   "file_action_created": "",
   "file_action_deleted": "",
@@ -552,6 +595,7 @@
   "files_cannot_include_invalid_characters": "",
   "files_selected": "",
   "filter_projects": "",
+  "find": "",
   "find_out_more": "",
   "find_out_more_about_institution_login": "",
   "find_out_more_about_the_file_outline": "",
@@ -570,10 +614,13 @@
   "footer_about_us": "",
   "footer_contact_us": "",
   "footer_navigation": "",
-  "for_enterprise": "",
+  "footnotes": "",
+  "for_business": "",
   "for_government": "",
-  "for_individuals_and_groups": "",
+  "for_groups_and_organizations": "",
+  "for_individuals": "",
   "for_more_information_see_managed_accounts_section": "",
+  "for_publishers": "",
   "for_students": "",
   "for_universities": "",
   "format": "",
@@ -594,16 +641,22 @@
   "full_doc_history": "",
   "full_width": "",
   "future_payments": "",
+  "generate_from_text_or_image": "",
+  "generate_tables_and_equations": "",
   "generate_token": "",
   "generic_if_problem_continues_contact_us": "",
   "generic_linked_file_compile_error": "",
   "generic_something_went_wrong": "",
+  "get_ai_assist": "",
   "get_collaborative_benefits": "",
   "get_discounted_plan": "",
   "get_error_assist": "",
   "get_exclusive_access_to_labs": "",
   "get_in_touch": "",
-  "get_most_subscription_discover_premium_features": "",
+  "get_most_subscription_by_checking_ai_writefull": "",
+  "get_most_subscription_by_checking_overleaf": "",
+  "get_most_subscription_by_checking_overleaf_ai_writefull": "",
+  "get_real_time_track_changes": "",
   "git": "",
   "git_authentication_token": "",
   "git_authentication_token_create_modal_info_1": "",
@@ -613,8 +666,10 @@
   "git_bridge_modal_git_clone_your_project": "",
   "git_bridge_modal_learn_more_about_authentication_tokens": "",
   "git_bridge_modal_read_only": "",
+  "git_bridge_modal_review_access": "",
   "git_bridge_modal_see_once": "",
   "git_bridge_modal_use_previous_token": "",
+  "git_clone_project": "",
   "git_integration": "",
   "git_integration_info": "",
   "github": "",
@@ -645,15 +700,21 @@
   "github_workflow_files_delete_github_repo": "",
   "github_workflow_files_error": "",
   "give_feedback": "",
+  "give_feedback_about": "",
   "give_your_feedback": "",
   "go_next_page": "",
   "go_page": "",
   "go_prev_page": "",
+  "go_to_account_settings": "",
+  "go_to_code_location": "",
   "go_to_code_location_in_pdf": "",
   "go_to_overleaf": "",
   "go_to_pdf_location_in_code": "",
   "go_to_settings": "",
   "go_to_subscriptions": "",
+  "go_to_writefull": "",
+  "good_news_you_already_purchased_this_add_on": "",
+  "good_news_you_are_already_receiving_this_add_on_via_writefull": "",
   "group_admin": "",
   "group_invitations": "",
   "group_invite_has_been_sent_to_email": "",
@@ -670,6 +731,7 @@
   "group_sso_configure_service_provider_in_idp": "",
   "group_sso_documentation_links": "",
   "group_subscription": "",
+  "groups": "",
   "have_an_extra_backup": "",
   "have_more_days_to_try": "",
   "headers": "",
@@ -737,10 +799,12 @@
   "how_we_use_your_data": "",
   "how_we_use_your_data_explanation": "",
   "i_confirm_am_student": "",
+  "i_want_to_add_a_po_number": "",
   "i_want_to_stay": "",
   "id": "",
   "identify_errors_with_your_compile": "",
   "if_you_need_to_customize_your_table_further_you_can": "",
+  "if_you_need_to_delete_your_writefull_account": "",
   "if_you_want_more_than_x_licenses_on_your_plan_we_need_to_add_them_for_you": "",
   "if_you_want_to_reduce_the_number_of_licenses_please_contact_support": "",
   "if_your_occupation_not_listed_type_full_name": "",
@@ -762,6 +826,7 @@
   "imported_from_zotero_at_date": "",
   "importing": "",
   "importing_and_merging_changes_in_github": "",
+  "improved_dark_mode": "",
   "in_order_to_match_institutional_metadata_2": "",
   "in_order_to_match_institutional_metadata_associated": "",
   "include_caption": "",
@@ -769,7 +834,11 @@
   "include_results_from_your_reference_manager": "",
   "include_results_from_your_x_account": "",
   "include_the_error_message_and_ai_response": "",
+  "included_as_part_of_your_writefull_subscription": "",
+  "increase_indent": "",
   "increased_compile_timeout": "",
+  "inline": "",
+  "inline_math": "",
   "inr_discount_modal_info": "",
   "inr_discount_modal_title": "",
   "insert": "",
@@ -797,6 +866,7 @@
   "integrations": "",
   "integrations_like_github": "",
   "interested_in_cheaper_personal_plan": "",
+  "introducing_shorter_compile_timeout": "",
   "invalid_confirmation_code": "",
   "invalid_email": "",
   "invalid_file_name": "",
@@ -805,6 +875,7 @@
   "invalid_password_too_similar": "",
   "invalid_regular_expression": "",
   "invalid_request": "",
+  "invalid_upload_request": "",
   "invite": "",
   "invite_expired": "",
   "invite_more_collabs": "",
@@ -813,12 +884,14 @@
   "invite_resend_limit_hit": "",
   "invited_to_group": "",
   "invited_to_group_have_individual_subcription": "",
+  "inviting": "",
   "ip_address": "",
   "is_email_affiliated": "",
   "issued_on": "",
   "it_looks_like_that_didnt_work_you_can_try_again_or_get_in_touch": "",
-  "it_looks_like_your_account_is_billed_manually": "",
+  "it_looks_like_your_account_is_billed_manually_purchasing_additional_license_or_upgrading_subscription": "",
   "it_looks_like_your_payment_details_are_missing_please_update_your_billing_information": "",
+  "italics": "",
   "join_beta_program": "",
   "join_now": "",
   "join_overleaf_labs": "",
@@ -838,9 +911,8 @@
   "labels_help_you_to_reference_your_tables": "",
   "labs": "",
   "language": "",
-  "language_suggestions_for_texts_in_any_language": "",
+  "language_suggestions": "",
   "large_or_high-resolution_images_taking_too_long": "",
-  "large_or_high_resolution_images_taking_too_long_to_process": "",
   "last_active": "",
   "last_active_description": "",
   "last_edit": "",
@@ -849,19 +921,23 @@
   "last_name": "",
   "last_resort_trouble_shooting_guide": "",
   "last_suggested_fix": "",
+  "last_updated": "",
   "last_updated_date_by_x": "",
   "last_used": "",
   "latam_discount_modal_info": "",
   "latam_discount_modal_title": "",
+  "latest_updates": "",
   "latex_in_thirty_minutes": "",
   "latex_places_figures_according_to_a_special_algorithm": "",
   "latex_places_tables_according_to_a_special_algorithm": "",
+  "latex_templates": "",
+  "latex_templates_for_journal_articles": "",
   "layout": "",
   "layout_options": "",
   "layout_processing": "",
   "learn_more": "",
+  "learn_more_about": "",
   "learn_more_about_account": "",
-  "learn_more_about_compile_timeouts": "",
   "learn_more_about_link_sharing": "",
   "learn_more_about_managed_users": "",
   "learn_more_about_other_causes_of_compile_timeouts": "",
@@ -878,17 +954,12 @@
   "let_us_know_what_you_think": "",
   "lets_get_those_premium_features": "",
   "library": "",
-  "licenses": "",
+  "license": "",
+  "license_for_educational_purposes_confirmation": "",
   "limited_document_history": "",
   "limited_offer": "",
-  "limited_to_n_editors": "",
-  "limited_to_n_editors_or_reviewers": "",
-  "limited_to_n_editors_or_reviewers_per_project": "",
-  "limited_to_n_editors_or_reviewers_per_project_plural": "",
-  "limited_to_n_editors_or_reviewers_plural": "",
-  "limited_to_n_editors_per_project": "",
-  "limited_to_n_editors_per_project_plural": "",
-  "limited_to_n_editors_plural": "",
+  "limited_to_n_collaborators_per_project": "",
+  "limited_to_n_collaborators_per_project_plural": "",
   "line": "",
   "line_height": "",
   "line_width_is_the_width_of_the_line_in_the_current_environment": "",
@@ -930,6 +1001,7 @@
   "login_count": "",
   "login_to_accept_invitation": "",
   "login_with_service": "",
+  "logs": "",
   "logs_and_output_files": "",
   "looking_multiple_licenses": "",
   "looks_like_youre_at": "",
@@ -956,6 +1028,7 @@
   "manage_publisher_managers": "",
   "manage_sessions": "",
   "manage_subscription": "",
+  "manage_your_ai_assist_add_on": "",
   "managed": "",
   "managed_user_accounts": "",
   "managed_user_invite_has_been_sent_to_email": "",
@@ -966,10 +1039,12 @@
   "managers_management": "",
   "managing_your_subscription": "",
   "marked_as_resolved": "",
+  "math": "",
   "math_display": "",
   "math_inline": "",
   "maximum_files_uploaded_together": "",
   "maybe_later": "",
+  "members_added": "",
   "members_management": "",
   "mendeley_dynamic_sync_description": "",
   "mendeley_groups_loading_error": "",
@@ -996,12 +1071,15 @@
   "more_collabs_per_project": "",
   "more_comments": "",
   "more_compile_time": "",
+  "more_editor_toolbar_item": "",
   "more_info": "",
+  "more_logs_and_files": "",
   "more_options": "",
-  "more_options_for_border_settings_coming_soon": "",
   "my_library": "",
   "n_items": "",
   "n_items_plural": "",
+  "n_more_collaborators": "",
+  "n_more_collaborators_plural": "",
   "n_more_updates_above": "",
   "n_more_updates_above_plural": "",
   "n_more_updates_below": "",
@@ -1016,13 +1094,20 @@
   "need_more_than_x_licenses": "",
   "need_to_add_new_primary_before_remove": "",
   "need_to_leave": "",
+  "neither_agree_nor_disagree": "",
   "new_compile_domain_notice": "",
+  "new_create_tables_and_equations": "",
+  "new_error_logs_panel": "",
   "new_file": "",
   "new_folder": "",
-  "new_font_open_dyslexic": "",
+  "new_look_and_feel": "",
+  "new_look_and_placement_of_the_settings": "",
   "new_name": "",
+  "new_navigation_introducing_left_hand_side_rail_and_top_menus": "",
+  "new_overleaf_editor": "",
   "new_password": "",
   "new_project": "",
+  "new_project_name": "",
   "new_subscription_will_be_billed_immediately": "",
   "new_tag": "",
   "new_tag_name": "",
@@ -1057,6 +1142,7 @@
   "no_selection_select_file": "",
   "no_symbols_found": "",
   "no_thanks_cancel_now": "",
+  "no_templates_found": "",
   "normal": "",
   "normally_x_price_per_month": "",
   "normally_x_price_per_year": "",
@@ -1066,7 +1152,9 @@
   "notification_personal_and_group_subscriptions": "",
   "notification_project_invite_accepted_message": "",
   "notification_project_invite_message": "",
+  "now_you_can_search_your_whole_project_not_just_this_file": "",
   "number_of_users": "",
+  "numbered_list": "",
   "oauth_orcid_description": "",
   "of": "",
   "off": "",
@@ -1078,40 +1166,40 @@
   "on_free_plan_upgrade_to_access_features": "",
   "one_step_away_from_professional_features": "",
   "only_group_admin_or_managers_can_delete_your_account_1": "",
-  "only_group_admin_or_managers_can_delete_your_account_2": "",
+  "only_group_admin_or_managers_can_delete_your_account_10": "",
   "only_group_admin_or_managers_can_delete_your_account_3": "",
-  "only_group_admin_or_managers_can_delete_your_account_4": "",
-  "only_group_admin_or_managers_can_delete_your_account_5": "",
+  "only_group_admin_or_managers_can_delete_your_account_6": "",
+  "only_group_admin_or_managers_can_delete_your_account_7": "",
+  "only_group_admin_or_managers_can_delete_your_account_9": "",
   "only_importer_can_refresh": "",
   "open_action_menu": "",
   "open_advanced_reference_search": "",
+  "open_as_template": "",
   "open_file": "",
   "open_link": "",
   "open_path": "",
   "open_pdf_in_separate_tab": "",
   "open_project": "",
-  "open_survey": "",
   "open_target": "",
   "optional": "",
   "or": "",
   "organization_name": "",
-  "organize_projects": "",
   "organize_tags": "",
   "other": "",
-  "other_causes_of_compile_timeouts": "",
   "other_logs_and_files": "",
   "other_output_files": "",
   "our_team_will_get_back_to_you_shortly": "",
-  "our_values": "",
   "out_of_sync": "",
   "out_of_sync_detail": "",
   "output_file": "",
   "overall_theme": "",
   "overleaf": "",
-  "overleaf_assist_streamline_your_workflow": "",
   "overleaf_history_system": "",
+  "overleaf_is_easy_to_use": "",
   "overleaf_labs": "",
   "overleaf_logo": "",
+  "overleaf_template_gallery": "",
+  "overleafs_functionality_meets_my_needs": "",
   "overview": "",
   "overwrite": "",
   "overwriting_the_original_folder": "",
@@ -1130,6 +1218,7 @@
   "papers_sync_description": "",
   "papers_upgrade_prompt_content": "",
   "papers_upgrade_prompt_title": "",
+  "paragraph_styles": "",
   "partial_outline_warning": "",
   "password": "",
   "password_managed_externally": "",
@@ -1140,6 +1229,10 @@
   "pause_subscription": "",
   "pause_subscription_for": "",
   "pay_now": "",
+  "payment_error_3ds_failed": "",
+  "payment_error_generic": "",
+  "payment_error_intermittent_error": "",
+  "payment_error_update_payment_method": "",
   "payment_provider_unreachable_error": "",
   "payment_summary": "",
   "pdf_compile_in_progress_error": "",
@@ -1149,6 +1242,7 @@
   "pdf_in_separate_tab": "",
   "pdf_only": "",
   "pdf_only_hide_editor": "",
+  "pdf_preview": "",
   "pdf_preview_error": "",
   "pdf_rendering_error": "",
   "pdf_unavailable_for_download": "",
@@ -1159,20 +1253,22 @@
   "pending_invite": "",
   "per_license": "",
   "per_month": "",
+  "per_month_x_annually": "",
   "percent_is_the_percentage_of_the_line_width": "",
   "permanently_disables_the_preview": "",
   "personal_library": "",
   "pick_up_where_you_left_off": "",
   "plan": "",
   "plan_tooltip": "",
-  "please_ask_the_project_owner_to_upgrade_more_editors": "",
+  "please_ask_the_project_owner_to_upgrade_more_collaborators": "",
   "please_ask_the_project_owner_to_upgrade_to_track_changes": "",
   "please_change_primary_to_remove": "",
   "please_check_your_inbox_to_confirm": "",
   "please_compile_pdf_before_download": "",
+  "please_compile_pdf_before_publish_as_template": "",
   "please_compile_pdf_before_word_count": "",
-  "please_confirm_primary_email": "",
-  "please_confirm_secondary_email": "",
+  "please_confirm_primary_email_or_edit": "",
+  "please_confirm_secondary_email_or_edit": "",
   "please_confirm_your_email_before_making_it_default": "",
   "please_contact_support_to_makes_change_to_your_plan": "",
   "please_enter_confirmation_code": "",
@@ -1180,6 +1276,7 @@
   "please_link_before_making_primary": "",
   "please_provide_a_message": "",
   "please_provide_a_subject": "",
+  "please_provide_a_valid_email_address": "",
   "please_reconfirm_institutional_email": "",
   "please_reconfirm_your_affiliation_before_making_this_primary": "",
   "please_refresh": "",
@@ -1192,14 +1289,16 @@
   "plus_additional_collaborators_document_history_track_changes_and_more": "",
   "plus_more": "",
   "plus_x_additional_licenses_for_a_total_of_y_licenses": "",
+  "po_number": "",
+  "po_number_can_include_digits_and_letters_only": "",
+  "po_number_must_not_exceed_x_characters": "",
+  "po_number_must_not_exceed_x_characters_plural": "",
   "postal_code": "",
-  "postal_code_sentence_case": "",
   "premium": "",
   "premium_feature": "",
-  "premium_features": "",
   "premium_plan_label": "",
   "presentation_mode": "",
-  "press_and_awards": "",
+  "prev": "",
   "previous_page": "",
   "price": "",
   "primarily_work_study_question": "",
@@ -1221,11 +1320,11 @@
   "professional": "",
   "progress_bar_percentage": "",
   "project_approaching_file_limit": "",
-  "project_failed_to_compile": "",
   "project_figure_modal": "",
   "project_files": "",
   "project_flagged_too_many_compiles": "",
   "project_has_too_many_files": "",
+  "project_history_list": "",
   "project_last_published_at": "",
   "project_layout_sharing_submission": "",
   "project_linked_to": "",
@@ -1235,6 +1334,7 @@
   "project_ownership_transfer_confirmation_2": "",
   "project_renamed_or_deleted": "",
   "project_renamed_or_deleted_detail": "",
+  "project_search": "",
   "project_search_file_count": "",
   "project_search_file_count_plural": "",
   "project_search_result_count": "",
@@ -1270,7 +1370,10 @@
   "reactivate_subscription": "",
   "read_lines_from_path": "",
   "read_more": "",
+  "read_more_about_compile_timeout_changes": "",
+  "read_more_about_fix_prevent_timeout": "",
   "read_more_about_free_compile_timeouts_servers": "",
+  "read_only_dropbox_sync_message": "",
   "read_only_token": "",
   "read_write_token": "",
   "ready_to_join_x": "",
@@ -1293,8 +1396,10 @@
   "recurly_email_updated": "",
   "redirect_to_editor": "",
   "redirect_url": "",
+  "redo": "",
   "reduce_costs_group_licenses": "",
   "reference_error_relink_hint": "",
+  "reference_manager_lowercase": "",
   "reference_manager_searched_groups": "",
   "reference_managers": "",
   "reference_search": "",
@@ -1316,7 +1421,6 @@
   "remote_service_error": "",
   "remove": "",
   "remove_access": "",
-  "remove_email_address": "",
   "remove_from_group": "",
   "remove_link": "",
   "remove_manager": "",
@@ -1324,6 +1428,7 @@
   "remove_secondary_email_addresses": "",
   "remove_sso_login_option": "",
   "remove_tag": "",
+  "remove_user": "",
   "removed_from_project": "",
   "removing": "",
   "rename": "",
@@ -1344,12 +1449,10 @@
   "resend": "",
   "resend_confirmation_code": "",
   "resend_confirmation_email": "",
-  "resend_email": "",
   "resend_group_invite": "",
   "resend_link_sso": "",
   "resend_managed_user_invite": "",
   "resending_confirmation_code": "",
-  "resending_confirmation_email": "",
   "resize": "",
   "resolve_comment": "",
   "resolve_comment_error_message": "",
@@ -1371,9 +1474,10 @@
   "reverse_x_sort_order": "",
   "revert_pending_plan_change": "",
   "review": "",
-  "review_panel_comments_and_track_changes": "",
-  "review_your_peers_work": "",
+  "review_panel": "",
+  "review_panel_and_error_logs_moved_to_the_left": "",
   "reviewer": "",
+  "reviewer_dropbox_sync_message": "",
   "reviewing": "",
   "revoke": "",
   "revoke_invite": "",
@@ -1390,7 +1494,6 @@
   "saml_missing_signature_error": "",
   "saml_response": "",
   "save": "",
-  "save_20_percent_when_you_switch_to_annual": "",
   "save_or_cancel-cancel": "",
   "save_or_cancel-or": "",
   "save_or_cancel-save": "",
@@ -1400,7 +1503,6 @@
   "search": "",
   "search_all_project_files": "",
   "search_bib_files": "",
-  "search_by_author_journal_title_and_more_link_to_zotero_mendeley": "",
   "search_by_author_journal_title_and_more_link_to_zotero_mendeley_papers": "",
   "search_by_citekey_author_year_title": "",
   "search_command_find": "",
@@ -1426,8 +1528,9 @@
   "search_whole_word": "",
   "search_within_selection": "",
   "searched_path_for_lines_containing": "",
+  "searching_all_project_files_is_now_available": "",
   "security": "",
-  "see_changes_in_your_documents_live": "",
+  "see_suggestions_from_collaborators": "",
   "select_a_column_or_a_merged_cell_to_align": "",
   "select_a_column_to_adjust_column_width": "",
   "select_a_file": "",
@@ -1457,15 +1560,16 @@
   "select_image_from_project_files": "",
   "select_project": "",
   "select_projects": "",
+  "select_size": "",
   "select_tag": "",
   "select_user": "",
   "selected": "",
   "selection_deleted": "",
+  "send_confirmation_code": "",
   "send_first_message": "",
   "send_message": "",
   "send_request": "",
   "sending": "",
-  "sent": "",
   "server_error": "",
   "server_pro_license_entitlement_line_1": "",
   "server_pro_license_entitlement_line_2": "",
@@ -1479,7 +1583,6 @@
   "set_up_single_sign_on": "",
   "set_up_sso": "",
   "settings": "",
-  "settings_for_git_github_and_dropbox_integrations": "",
   "setup_another_account_under_a_personal_email_address": "",
   "share": "",
   "share_project": "",
@@ -1487,7 +1590,10 @@
   "sharelatex_beta_program": "",
   "shortcut_to_open_advanced_reference_search": "",
   "show_all_projects": "",
+  "show_breadcrumbs": "",
+  "show_breadcrumbs_in_toolbar": "",
   "show_document_preamble": "",
+  "show_equation_preview": "",
   "show_file_tree": "",
   "show_hotkeys": "",
   "show_in_code": "",
@@ -1497,6 +1603,7 @@
   "show_local_file_contents": "",
   "show_more": "",
   "show_outline": "",
+  "show_version_history": "",
   "show_x_more_projects": "",
   "showing_1_result": "",
   "showing_1_result_of_total": "",
@@ -1521,6 +1628,7 @@
   "sorry_there_was_an_issue_adding_x_users_to_your_subscription": "",
   "sorry_there_was_an_issue_upgrading_your_subscription": "",
   "sorry_you_can_only_change_to_group_from_trial_via_support": "",
+  "sorry_you_can_only_change_to_group_via_support": "",
   "sorry_your_table_cant_be_displayed_at_the_moment": "",
   "sort_by": "",
   "sort_by_x": "",
@@ -1579,6 +1687,7 @@
   "start_a_free_trial": "",
   "start_by_adding_your_email": "",
   "start_by_fixing_the_first_error_in_your_doc": "",
+  "start_by_fixing_the_first_error_in_your_document": "",
   "start_free_trial": "",
   "start_free_trial_without_exclamation": "",
   "start_the_conversation_by_saying_hello_or_sharing_an_update": "",
@@ -1592,6 +1701,8 @@
   "stop_on_validation_error": "",
   "store_your_work": "",
   "stretch_width_to_text": "",
+  "strongly_agree": "",
+  "strongly_disagree": "",
   "student": "",
   "student_disclaimer": "",
   "subject": "",
@@ -1611,6 +1722,7 @@
   "suggest_a_different_fix": "",
   "suggest_fix": "",
   "suggested": "",
+  "suggested_code": "",
   "suggested_fix_for_error_in_path": "",
   "suggestion_applied": "",
   "suggests_code_completions_while_typing": "",
@@ -1620,13 +1732,13 @@
   "sure_you_want_to_change_plan": "",
   "sure_you_want_to_delete": "",
   "sure_you_want_to_leave_group": "",
-  "switch_back_to_monthly_pay_20_more": "",
   "switch_compile_mode_for_faster_draft_compilation": "",
   "switch_to_editor": "",
   "switch_to_new_editor": "",
   "switch_to_old_editor": "",
   "switch_to_pdf": "",
   "switch_to_standard_plan": "",
+  "symbol": "",
   "symbol_palette": "",
   "sync": "",
   "sync_dropbox_github": "",
@@ -1637,6 +1749,7 @@
   "syntax_validation": "",
   "tab_connecting": "",
   "tab_no_longer_connected": "",
+  "table": "",
   "table_generator": "",
   "tag_color": "",
   "tag_name_cannot_exceed_characters": "",
@@ -1644,11 +1757,10 @@
   "tags": "",
   "take_short_survey": "",
   "take_survey": "",
-  "tc_everyone": "",
-  "tc_guests": "",
   "tell_the_project_owner_and_ask_them_to_upgrade": "",
   "template": "",
   "template_description": "",
+  "template_gallery": "",
   "template_title_taken_from_project_title": "",
   "templates": "",
   "temporarily_hides_the_preview": "",
@@ -1657,7 +1769,9 @@
   "test_configuration": "",
   "test_configuration_successful": "",
   "tex_live_version": "",
-  "texgpt_for_help_writing_latex": "",
+  "texgpt": "",
+  "text": "",
+  "thank_you": "",
   "thank_you_exclamation": "",
   "thank_you_for_your_feedback": "",
   "thanks_for_being_part_of_this_labs_experiment_your_feedback_will_help_us_make_the_new_editor_the_best_yet": "",
@@ -1691,6 +1805,12 @@
   "there_is_an_unrecoverable_latex_error": "",
   "there_was_a_problem_restoring_the_project_please_try_again_in_a_few_moments_or_contact_us": "",
   "they_lose_access_to_account": "",
+  "they_will_be_removed_from_the_group": "",
+  "they_will_continue_to_have_access_to_any_projects_shared_with_them": "",
+  "they_will_no_longer_be_a_managed_user": "",
+  "they_will_retain_ownership_of_projects_currently_owned_by_them_and_collaborators_will_become_read_only": "",
+  "they_will_retain_their_existing_account_on_the_free_plan": "",
+  "they_wont_be_able_to_log_in_with_sso_they_will_need_to_set_password": "",
   "this_action_cannot_be_reversed": "",
   "this_action_cannot_be_undone": "",
   "this_address_will_be_shown_on_the_invoice": "",
@@ -1701,14 +1821,14 @@
   "this_is_a_labs_experiment_for_the_new_overleaf_editor_some_features_are_still_in_progress": "",
   "this_is_a_new_feature": "",
   "this_is_the_file_that_references_pulled_from_your_reference_manager_will_be_added_to": "",
-  "this_project_already_has_maximum_editors": "",
+  "this_project_already_has_maximum_collaborators": "",
+  "this_project_compiled_but_soon_might_not": "",
   "this_project_contains_a_file_called_output": "",
+  "this_project_exceeded_collaborator_limit": "",
   "this_project_exceeded_compile_timeout_limit_on_free_plan": "",
-  "this_project_exceeded_editor_limit": "",
   "this_project_has_more_than_max_collabs": "",
   "this_project_is_public": "",
   "this_project_is_public_read_only": "",
-  "this_project_need_more_time_to_compile": "",
   "this_project_will_appear_in_your_dropbox_folder_at": "",
   "this_tool_helps_you_insert_figures": "",
   "this_tool_helps_you_insert_simple_tables_into_your_project_without_writing_latex_code_give_feedback": "",
@@ -1725,7 +1845,6 @@
   "to_confirm_transfer_enter_email_address": "",
   "to_confirm_unlink_all_users_enter_email": "",
   "to_continue_using_upgrade_or_change_your_browser": "",
-  "to_delete_your_writefull_account": "",
   "to_fix_this_you_can": "",
   "to_fix_this_you_can_ask_the_github_repository_owner": "",
   "to_insert_or_move_a_caption_make_sure_tabular_is_directly_within_table": "",
@@ -1759,6 +1878,8 @@
   "toolbar_editor": "",
   "toolbar_format_bold": "",
   "toolbar_format_italic": "",
+  "toolbar_generate_math": "",
+  "toolbar_generate_table": "",
   "toolbar_increase_indent": "",
   "toolbar_insert_citation": "",
   "toolbar_insert_cross_reference": "",
@@ -1768,6 +1889,7 @@
   "toolbar_insert_link": "",
   "toolbar_insert_math": "",
   "toolbar_insert_math_and_symbols": "",
+  "toolbar_insert_math_lowercase": "",
   "toolbar_insert_misc": "",
   "toolbar_insert_table": "",
   "toolbar_list_indentation": "",
@@ -1791,19 +1913,15 @@
   "tooltip_show_filetree": "",
   "tooltip_show_panel": "",
   "tooltip_show_pdf": "",
+  "total": "",
+  "total_due_in_x_days": "",
   "total_due_today": "",
   "total_per_month": "",
   "total_per_year": "",
   "total_today": "",
   "total_with_subtotal_and_tax": "",
   "total_words": "",
-  "track_any_change_in_real_time": "",
   "track_changes": "",
-  "track_changes_for_everyone": "",
-  "track_changes_for_guests": "",
-  "track_changes_for_x": "",
-  "track_changes_is_off": "",
-  "track_changes_is_on": "",
   "tracked_change_added": "",
   "tracked_change_deleted": "",
   "transfer_management_of_your_account": "",
@@ -1811,6 +1929,7 @@
   "transfer_management_resolve_following_issues": "",
   "transfer_this_users_projects": "",
   "transfer_this_users_projects_description": "",
+  "transferring": "",
   "trash": "",
   "trash_projects": "",
   "trashed": "",
@@ -1841,6 +1960,7 @@
   "unconfirmed": "",
   "undelete": "",
   "understanding_labels": "",
+  "undo": "",
   "unfold_line": "",
   "unique_identifier_attribute": "",
   "university": "",
@@ -1884,17 +2004,17 @@
   "updating": "",
   "upgrade": "",
   "upgrade_cc_btn": "",
-  "upgrade_for_12x_more_compile_time": "",
+  "upgrade_for_more_compile_time": "",
   "upgrade_my_plan": "",
   "upgrade_now": "",
   "upgrade_plan": "",
   "upgrade_summary": "",
-  "upgrade_to_add_more_editors_and_access_collaboration_features": "",
+  "upgrade_to_add_more_collaborators_and_access_collaboration_features": "",
   "upgrade_to_get_feature": "",
-  "upgrade_to_track_changes": "",
-  "upgrade_to_unlock_more_time": "",
+  "upgrade_to_review": "",
   "upgrade_your_subscription": "",
   "upload": "",
+  "upload_file": "",
   "upload_from_computer": "",
   "upload_project": "",
   "upload_zipped_project": "",
@@ -1914,6 +2034,7 @@
   "user_deletion_error": "",
   "user_deletion_password_reset_tip": "",
   "user_first_name_attribute": "",
+  "user_has_left_organization_and_need_to_transfer_their_projects": "",
   "user_last_name_attribute": "",
   "user_sessions": "",
   "using_latex": "",
@@ -1951,6 +2072,7 @@
   "view_only_downgraded": "",
   "view_only_reviewer_downgraded": "",
   "view_options": "",
+  "view_payment_portal": "",
   "view_pdf": "",
   "view_your_invoices": "",
   "viewer": "",
@@ -1959,7 +2081,6 @@
   "visual_editor": "",
   "visual_editor_is_only_available_for_tex_files": "",
   "want_change_to_apply_before_plan_end": "",
-  "we_are_testing_a_new_reference_search": "",
   "we_are_unable_to_generate_the_pdf_at_this_time": "",
   "we_are_unable_to_opt_you_into_this_experiment": "",
   "we_cant_find_any_sections_or_subsections_in_this_file": "",
@@ -1970,6 +2091,7 @@
   "we_sent_new_code": "",
   "we_will_charge_you_now_for_the_cost_of_your_additional_licenses_based_on_remaining_months": "",
   "we_will_charge_you_now_for_your_new_plan_based_on_the_remaining_months_of_your_current_subscription": "",
+  "we_will_invoice_you_now_for_the_additional_licenses_based_on_remaining_months": "",
   "we_will_use_your_existing_payment_method": "",
   "webinars": "",
   "website_status": "",
@@ -1979,28 +2101,32 @@
   "were_making_some_changes_to_project_sharing_this_means_you_will_be_visible": "",
   "were_performing_maintenance": "",
   "were_redesigning_our_editor_to_make_it_easier_to_use": "",
-  "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_this_project": "",
-  "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_your_project": "",
+  "were_reducing_compile_timeout": "",
+  "what_did_you_find_most_helpful": "",
   "what_do_you_need_help_with": "",
   "what_does_this_mean": "",
   "what_does_this_mean_for_you": "",
   "what_happens_when_sso_is_enabled": "",
   "what_should_we_call_you": "",
-  "whats_new": "",
-  "whats_next": "",
+  "whats_different_in_the_new_editor": "",
   "when_you_tick_the_include_caption_box": "",
-  "why_latex": "",
   "why_might_this_happen": "",
   "why_not_pause_instead": "",
   "wide": "",
   "will_lose_edit_access_on_date": "",
   "with_premium_subscription_you_also_get": "",
   "word_count": "",
+  "word_count_lower": "",
   "work_in_vim_or_emacs_emulation_mode": "",
   "work_offline": "",
   "work_offline_pull_to_overleaf": "",
+  "work_smarter_with_ai_assist": "",
+  "work_smarter_with_ai_assist_description": "",
   "work_with_non_overleaf_users": "",
   "work_with_other_github_users": "",
+  "write_faster_smarter_with_overleaf_and_writefull_ai_tools": "",
+  "write_smarter_right_now": "",
+  "write_smarter_right_now_description": "",
   "writefull": "",
   "writefull_loading_error_body": "",
   "writefull_loading_error_title": "",
@@ -2023,7 +2149,6 @@
   "you_are_a_manager_of_publisher_x": "",
   "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z": "",
   "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z_you": "",
-  "you_are_now_saving_20_percent": "",
   "you_are_on_a_paid_plan_contact_support_to_find_out_more": "",
   "you_are_on_x_plan_as_a_confirmed_member_of_institution_y": "",
   "you_are_on_x_plan_as_member_of_group_subscription_y_administered_by_z": "",
@@ -2033,10 +2158,12 @@
   "you_can_manage_your_reference_manager_integrations_from_your_account_settings_page": "",
   "you_can_now_enable_sso": "",
   "you_can_now_log_in_sso": "",
+  "you_can_now_search_and_add_references_from_your_rm_library_without_needing_to_import_files": "",
   "you_can_request_a_maximum_of_limit_fixes_per_day": "",
-  "you_can_select_or_invite": "",
-  "you_can_select_or_invite_plural": "",
+  "you_can_select_or_invite_collaborator": "",
+  "you_can_select_or_invite_collaborator_plural": "",
   "you_can_still_use_your_premium_features": "",
+  "you_cant_add_or_change_password_due_to_ldap_or_sso": "",
   "you_cant_add_or_change_password_due_to_sso": "",
   "you_cant_join_this_group_subscription": "",
   "you_dont_have_any_add_ons_on_your_account": "",
@@ -2050,6 +2177,7 @@
   "you_have_been_removed_from_this_project_and_will_be_redirected_to_project_dashboard": "",
   "you_have_x_licenses_and_your_plan_supports_up_to_y": "",
   "you_have_x_licenses_on_your_subscription": "",
+  "you_may_be_able_to_fix_issues_to_speed_up_the_compile": "",
   "you_need_to_configure_your_sso_settings": "",
   "you_unpaused_your_subscription": "",
   "you_will_be_able_to_reassign_subscription": "",
@@ -2067,6 +2195,7 @@
   "your_current_plan_gives_you": "",
   "your_current_plan_supports_up_to_x_licenses": "",
   "your_current_project_will_revert_to_the_version_from_time": "",
+  "your_feedback_matters_answer_two_quick_questions": "",
   "your_git_access_info": "",
   "your_git_access_info_bullet_1": "",
   "your_git_access_info_bullet_2": "",
@@ -2083,10 +2212,10 @@
   "your_plan_is_limited_to_n_editors": "",
   "your_plan_is_limited_to_n_editors_plural": "",
   "your_premium_plan_is_paused": "",
+  "your_project_compiled_but_soon_might_not": "",
+  "your_project_exceeded_collaborator_limit": "",
   "your_project_exceeded_compile_timeout_limit_on_free_plan": "",
-  "your_project_exceeded_editor_limit": "",
   "your_project_near_compile_timeout_limit": "",
-  "your_project_need_more_time_to_compile": "",
   "your_projects": "",
   "your_role": "",
   "your_subscription": "",
@@ -2105,7 +2234,7 @@
   "youre_signed_in_as_logout": "",
   "youve_added_more_licenses": "",
   "youve_added_x_more_licenses_to_your_subscription_invite_people": "",
-  "youve_lost_edit_access": "",
+  "youve_lost_collaboration_access": "",
   "youve_paused_your_subscription": "",
   "youve_unlinked_all_users": "",
   "youve_upgraded_your_plan": "",
diff --git a/services/web/frontend/fonts/material-symbols/MaterialSymbolsRoundedUnfilledPartialSlice.woff2 b/services/web/frontend/fonts/material-symbols/MaterialSymbolsRoundedUnfilledPartialSlice.woff2
index 14a5ef1e2b..34f7241410 100644
Binary files a/services/web/frontend/fonts/material-symbols/MaterialSymbolsRoundedUnfilledPartialSlice.woff2 and b/services/web/frontend/fonts/material-symbols/MaterialSymbolsRoundedUnfilledPartialSlice.woff2 differ
diff --git a/services/web/frontend/fonts/material-symbols/unfilled-symbols.mjs b/services/web/frontend/fonts/material-symbols/unfilled-symbols.mjs
index eca63fa035..09862b2d5f 100644
--- a/services/web/frontend/fonts/material-symbols/unfilled-symbols.mjs
+++ b/services/web/frontend/fonts/material-symbols/unfilled-symbols.mjs
@@ -4,25 +4,35 @@
 // You may need to hard reload your browser window to see the changes.
 
 export default /** @type {const} */ ([
+  'account_balance',
+  'auto_delete',
   'book_5',
   'brush',
+  'close',
   'code',
+  'content_copy',
   'create_new_folder',
+  'delete',
   'description',
+  'error',
   'experiment',
   'forum',
   'help',
   'image',
   'info',
   'integration_instructions',
+  'lightbulb',
   'note_add',
   'picture_as_pdf',
   'rate_review',
   'report',
+  'search',
   'settings',
   'space_dashboard',
   'table_chart',
+  'thumb_down',
+  'thumb_up',
+  'upload',
   'upload_file',
   'web_asset',
-  'error',
 ])
diff --git a/services/web/frontend/js/bootstrap-3.ts b/services/web/frontend/js/bootstrap-3.ts
index 2c7b3b8214..e9012b7555 100644
--- a/services/web/frontend/js/bootstrap-3.ts
+++ b/services/web/frontend/js/bootstrap-3.ts
@@ -2,3 +2,4 @@ import 'bootstrap'
 import './features/contact-form'
 import './features/bookmarkable-tab/index'
 import './features/tooltip/index-bs3'
+import './features/navbar/index'
diff --git a/services/web/frontend/js/bootstrap-5.ts b/services/web/frontend/js/bootstrap-5.ts
index b9dc3d8679..4b4b09ecfe 100644
--- a/services/web/frontend/js/bootstrap-5.ts
+++ b/services/web/frontend/js/bootstrap-5.ts
@@ -1,3 +1,4 @@
 import './features/bookmarkable-tab/index-bs5'
 import './features/tooltip/index-bs5'
+import './features/navbar/index'
 import 'bootstrap-5'
diff --git a/services/web/frontend/js/features/autoplay-video/index.js b/services/web/frontend/js/features/autoplay-video/index.js
index d706f9058b..0f66f67d65 100644
--- a/services/web/frontend/js/features/autoplay-video/index.js
+++ b/services/web/frontend/js/features/autoplay-video/index.js
@@ -1,3 +1,5 @@
+import { debugConsole } from '@/utils/debugging'
+
 function setup(videoEl) {
   const reducedMotionReduce = window.matchMedia(
     '(prefers-reduced-motion: reduce)'
@@ -35,10 +37,18 @@ function setup(videoEl) {
           videoIsVisible = true
           if (videoEl.readyState >= videoEl.HAVE_FUTURE_DATA) {
             if (!videoEl.ended) {
-              videoEl.play()
+              videoEl
+                .play()
+                .catch(error =>
+                  debugConsole.error('Video autoplay failed:', error)
+                )
+            } else {
+              videoEl
+                .play()
+                .catch(error =>
+                  debugConsole.error('Video autoplay failed:', error)
+                )
             }
-          } else {
-            videoEl.play()
           }
         } else {
           videoIsVisible = false
diff --git a/services/web/frontend/js/features/chat/components/chat-pane.tsx b/services/web/frontend/js/features/chat/components/chat-pane.tsx
index d51037762e..1ef4d46a31 100644
--- a/services/web/frontend/js/features/chat/components/chat-pane.tsx
+++ b/services/web/frontend/js/features/chat/components/chat-pane.tsx
@@ -114,4 +114,4 @@ function Placeholder() {
   )
 }
 
-export default withErrorBoundary(ChatPane, ChatFallbackError)
+export default withErrorBoundary(ChatPane, () => <ChatFallbackError />)
diff --git a/services/web/frontend/js/features/chat/components/message-content.tsx b/services/web/frontend/js/features/chat/components/message-content.tsx
index ad2e6a623f..3d86b4be68 100644
--- a/services/web/frontend/js/features/chat/components/message-content.tsx
+++ b/services/web/frontend/js/features/chat/components/message-content.tsx
@@ -34,7 +34,7 @@ const MessageContent: FC<{ content: string }> = ({ content }) => {
   }, [content, mounted])
 
   return (
-    <p ref={root}>
+    <p ref={root} translate="no">
       <Linkify>{content}</Linkify>
     </p>
   )
diff --git a/services/web/frontend/js/features/chat/components/message.tsx b/services/web/frontend/js/features/chat/components/message.tsx
index aa2779f1e8..dd5aeccb24 100644
--- a/services/web/frontend/js/features/chat/components/message.tsx
+++ b/services/web/frontend/js/features/chat/components/message.tsx
@@ -2,6 +2,7 @@ import { getHueForUserId } from '@/shared/utils/colors'
 import MessageContent from './message-content'
 import type { Message as MessageType } from '@/features/chat/context/chat-context'
 import { User } from '../../../../../types/user'
+import { useTranslation } from 'react-i18next'
 
 export interface MessageProps {
   message: MessageType
@@ -26,11 +27,16 @@ function getArrowStyle(user?: User) {
 }
 
 function Message({ message, fromSelf }: MessageProps) {
+  const { t } = useTranslation()
   return (
     <div className="message-wrapper">
       {!fromSelf && (
-        <div className="name">
-          <span>{message.user.first_name || message.user.email}</span>
+        <div className="name" translate="no">
+          <span>
+            {message.user
+              ? message.user.first_name || message.user.email
+              : t('deleted_user')}
+          </span>
         </div>
       )}
       <div className="message" style={getMessageStyle(message.user)}>
diff --git a/services/web/frontend/js/features/chat/context/chat-context.tsx b/services/web/frontend/js/features/chat/context/chat-context.tsx
index d2b078138d..2ef6fc9af3 100644
--- a/services/web/frontend/js/features/chat/context/chat-context.tsx
+++ b/services/web/frontend/js/features/chat/context/chat-context.tsx
@@ -20,6 +20,8 @@ import { useIdeContext } from '@/shared/context/ide-context'
 import getMeta from '@/utils/meta'
 import { debugConsole } from '@/utils/debugging'
 import { User } from '../../../../../types/user'
+import { useRailContext } from '@/features/ide-redesign/contexts/rail-context'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 const PAGE_SIZE = 50
 
@@ -27,7 +29,7 @@ export type Message = {
   id: string
   timestamp: number
   contents: string[]
-  user: User
+  user?: User
 }
 
 type State = {
@@ -190,17 +192,22 @@ export const ChatContext = createContext<
   | undefined
 >(undefined)
 
-export const ChatProvider: FC = ({ children }) => {
-  const chatEnabled = getMeta('ol-chatEnabled')
+export const ChatProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const chatEnabled = getMeta('ol-capabilities')?.includes('chat')
 
   const clientId = useRef<string>()
   if (clientId.current === undefined) {
     clientId.current = chatClientIdGenerator.generate()
   }
   const user = useUserContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
-  const { chatIsOpen } = useLayoutContext()
+  const { chatIsOpen: chatIsOpenOldEditor } = useLayoutContext()
+  const { selectedTab: selectedRailTab, isOpen: railIsOpen } = useRailContext()
+  const newEditor = useIsNewEditorEnabled()
+  const chatIsOpen = newEditor
+    ? selectedRailTab === 'chat' && railIsOpen
+    : chatIsOpenOldEditor
 
   const {
     hasFocus: windowHasFocus,
@@ -283,7 +290,7 @@ export const ChatProvider: FC = ({ children }) => {
   ])
 
   const sendMessage = useCallback(
-    content => {
+    (content: string) => {
       if (!chatEnabled) {
         debugConsole.warn(`chat is disabled, won't send message`)
         return
diff --git a/services/web/frontend/js/features/chat/utils/message-list-appender.js b/services/web/frontend/js/features/chat/utils/message-list-appender.js
index 3362bf6fa0..be7ed0cb37 100644
--- a/services/web/frontend/js/features/chat/utils/message-list-appender.js
+++ b/services/web/frontend/js/features/chat/utils/message-list-appender.js
@@ -15,6 +15,7 @@ export function appendMessage(messageList, message, uniqueMessageIds) {
     lastMessage &&
     message &&
     message.user &&
+    lastMessage.user &&
     message.user.id &&
     message.user.id === lastMessage.user.id &&
     message.timestamp - lastMessage.timestamp < TIMESTAMP_GROUP_SIZE
@@ -57,6 +58,7 @@ export function prependMessages(messageList, messages, uniqueMessageIds) {
       const shouldGroup =
         firstMessage &&
         message &&
+        firstMessage.user &&
         message.user &&
         message.user.id === firstMessage.user.id &&
         firstMessage.timestamp - message.timestamp < TIMESTAMP_GROUP_SIZE
diff --git a/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.jsx b/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.tsx
similarity index 82%
rename from services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.jsx
rename to services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.tsx
index 84d8151f0f..5754522360 100644
--- a/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.jsx
+++ b/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal-content.tsx
@@ -1,6 +1,5 @@
 /* eslint-disable jsx-a11y/no-autofocus */
-import PropTypes from 'prop-types'
-import { useCallback, useMemo, useState } from 'react'
+import { FormEvent, useCallback, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { postJSON } from '../../../infrastructure/fetch-json'
 import { CloneProjectTag } from './clone-project-tag'
@@ -16,6 +15,7 @@ import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
 import OLButton from '@/features/ui/components/ol/ol-button'
+import { Tag } from '../../../../../app/src/Features/Tags/types'
 
 export default function CloneProjectModalContent({
   handleHide,
@@ -25,10 +25,18 @@ export default function CloneProjectModalContent({
   projectId,
   projectName,
   projectTags,
+}: {
+  handleHide: () => void
+  inFlight: boolean
+  setInFlight: (inFlight: boolean) => void
+  handleAfterCloned: (clonedProject: any, tags: Tag[]) => void
+  projectId: string
+  projectName: string
+  projectTags: Tag[]
 }) {
   const { t } = useTranslation()
 
-  const [error, setError] = useState()
+  const [error, setError] = useState<string | boolean>()
   const [clonedProjectName, setClonedProjectName] = useState(
     `${projectName} (Copy)`
   )
@@ -42,7 +50,7 @@ export default function CloneProjectModalContent({
   )
 
   // form submission: clone the project if the name is valid
-  const handleSubmit = event => {
+  const handleSubmit = (event: FormEvent<HTMLFormElement>) => {
     event.preventDefault()
 
     if (!valid) {
@@ -75,7 +83,7 @@ export default function CloneProjectModalContent({
       })
   }
 
-  const removeTag = useCallback(tag => {
+  const removeTag = useCallback((tag: Tag) => {
     setClonedProjectTags(value => value.filter(item => item._id !== tag._id))
   }, [])
 
@@ -91,7 +99,7 @@ export default function CloneProjectModalContent({
             <OLFormLabel>{t('new_name')}</OLFormLabel>
             <OLFormControl
               type="text"
-              placeholder="New Project Name"
+              placeholder={t('new_project_name')}
               required
               value={clonedProjectName}
               onChange={event => setClonedProjectName(event.target.value)}
@@ -120,7 +128,11 @@ export default function CloneProjectModalContent({
 
         {error && (
           <Notification
-            content={error.length ? error : t('generic_something_went_wrong')}
+            content={
+              typeof error === 'string' && error.length
+                ? error
+                : t('generic_something_went_wrong')
+            }
             type="error"
           />
         )}
@@ -142,18 +154,3 @@ export default function CloneProjectModalContent({
     </>
   )
 }
-CloneProjectModalContent.propTypes = {
-  handleHide: PropTypes.func.isRequired,
-  inFlight: PropTypes.bool,
-  setInFlight: PropTypes.func.isRequired,
-  handleAfterCloned: PropTypes.func.isRequired,
-  projectId: PropTypes.string,
-  projectName: PropTypes.string,
-  projectTags: PropTypes.arrayOf(
-    PropTypes.shape({
-      _id: PropTypes.string.isRequired,
-      name: PropTypes.string.isRequired,
-      color: PropTypes.string,
-    })
-  ),
-}
diff --git a/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.jsx b/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.tsx
similarity index 71%
rename from services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.jsx
rename to services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.tsx
index 4ebc22545d..8c5793b87e 100644
--- a/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.jsx
+++ b/services/web/frontend/js/features/clone-project-modal/components/clone-project-modal.tsx
@@ -1,7 +1,8 @@
 import React, { memo, useCallback, useState } from 'react'
-import PropTypes from 'prop-types'
 import CloneProjectModalContent from './clone-project-modal-content'
 import OLModal from '@/features/ui/components/ol/ol-modal'
+import { ClonedProject } from '../../../../../types/project/dashboard/api'
+import { Tag } from '../../../../../app/src/Features/Tags/types'
 
 function CloneProjectModal({
   show,
@@ -10,6 +11,13 @@ function CloneProjectModal({
   projectId,
   projectName,
   projectTags,
+}: {
+  show: boolean
+  handleHide: () => void
+  handleAfterCloned: (clonedProject: ClonedProject, tags: Tag[]) => void
+  projectId: string
+  projectName: string
+  projectTags: Tag[]
 }) {
   const [inFlight, setInFlight] = useState(false)
 
@@ -42,19 +50,4 @@ function CloneProjectModal({
   )
 }
 
-CloneProjectModal.propTypes = {
-  handleHide: PropTypes.func.isRequired,
-  show: PropTypes.bool.isRequired,
-  handleAfterCloned: PropTypes.func.isRequired,
-  projectId: PropTypes.string,
-  projectName: PropTypes.string,
-  projectTags: PropTypes.arrayOf(
-    PropTypes.shape({
-      _id: PropTypes.string.isRequired,
-      name: PropTypes.string.isRequired,
-      color: PropTypes.string,
-    })
-  ),
-}
-
 export default memo(CloneProjectModal)
diff --git a/services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.jsx b/services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.tsx
similarity index 56%
rename from services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.jsx
rename to services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.tsx
index 2ebc6edece..cae44dc1e0 100644
--- a/services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.jsx
+++ b/services/web/frontend/js/features/clone-project-modal/components/editor-clone-project-modal-wrapper.tsx
@@ -1,18 +1,21 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import { useProjectContext } from '../../../shared/context/project-context'
 import withErrorBoundary from '../../../infrastructure/error-boundary'
 import CloneProjectModal from './clone-project-modal'
 
 const EditorCloneProjectModalWrapper = React.memo(
-  function EditorCloneProjectModalWrapper({ show, handleHide, openProject }) {
-    const {
-      _id: projectId,
-      name: projectName,
-      tags: projectTags,
-    } = useProjectContext()
+  function EditorCloneProjectModalWrapper({
+    show,
+    handleHide,
+    openProject,
+  }: {
+    show: boolean
+    handleHide: () => void
+    openProject: ({ project_id }: { project_id: string }) => void
+  }) {
+    const { project, tags: projectTags } = useProjectContext()
 
-    if (!projectName) {
+    if (!project) {
       // wait for useProjectContext
       return null
     } else {
@@ -21,8 +24,8 @@ const EditorCloneProjectModalWrapper = React.memo(
           handleHide={handleHide}
           show={show}
           handleAfterCloned={openProject}
-          projectId={projectId}
-          projectName={projectName}
+          projectId={project._id}
+          projectName={project.name}
           projectTags={projectTags}
         />
       )
@@ -30,10 +33,4 @@ const EditorCloneProjectModalWrapper = React.memo(
   }
 )
 
-EditorCloneProjectModalWrapper.propTypes = {
-  handleHide: PropTypes.func.isRequired,
-  show: PropTypes.bool.isRequired,
-  openProject: PropTypes.func.isRequired,
-}
-
 export default withErrorBoundary(EditorCloneProjectModalWrapper)
diff --git a/services/web/frontend/js/features/contact-form/index.js b/services/web/frontend/js/features/contact-form/index.js
index 0b4a4898aa..51aff806e3 100644
--- a/services/web/frontend/js/features/contact-form/index.js
+++ b/services/web/frontend/js/features/contact-form/index.js
@@ -23,7 +23,7 @@ document
   })
 
 document.querySelectorAll('[data-ol-contact-form]').forEach(el => {
-  el.addEventListener('submit', function (e) {
+  el.addEventListener('submit', function () {
     const emailValue = document.querySelector(
       '[data-ol-contact-form-email-input]'
     ).value
diff --git a/services/web/frontend/js/features/contact-form/search.js b/services/web/frontend/js/features/contact-form/search.js
index dddba6781f..eaa34bdeeb 100644
--- a/services/web/frontend/js/features/contact-form/search.js
+++ b/services/web/frontend/js/features/contact-form/search.js
@@ -1,6 +1,7 @@
 import _ from 'lodash'
 import { formatWikiHit, searchWiki } from '../algolia-search/search-wiki'
 import { sendMB } from '../../infrastructure/event-tracking'
+import { materialIcon } from '@/features/utils/material-icon'
 
 export function setupSearch(formEl) {
   const inputEl = formEl.querySelector('[name="subject"]')
@@ -45,9 +46,8 @@ export function setupSearch(formEl) {
         contentEl.innerHTML = pageName
         linkEl.append(contentEl)
 
-        const iconEl = document.createElement('i')
-        iconEl.className = 'fa fa-angle-right'
-        iconEl.setAttribute('aria-hidden', 'true')
+        const iconEl = materialIcon('open_in_new')
+        iconEl.classList.add('dropdown-item-trailing-icon')
         linkEl.append(iconEl)
 
         resultsEl.append(liEl)
diff --git a/services/web/frontend/js/features/cookie-banner/index.js b/services/web/frontend/js/features/cookie-banner/index.js
deleted file mode 100644
index 20f62db8a5..0000000000
--- a/services/web/frontend/js/features/cookie-banner/index.js
+++ /dev/null
@@ -1,51 +0,0 @@
-import getMeta from '@/utils/meta'
-
-function loadGA() {
-  if (window.olLoadGA) {
-    window.olLoadGA()
-  }
-}
-
-function setConsent(value) {
-  document.querySelector('.cookie-banner').classList.add('hidden')
-  const cookieDomain = getMeta('ol-ExposedSettings').cookieDomain
-  const oneYearInSeconds = 60 * 60 * 24 * 365
-  const cookieAttributes =
-    '; path=/' +
-    '; domain=' +
-    cookieDomain +
-    '; max-age=' +
-    oneYearInSeconds +
-    '; SameSite=Lax; Secure'
-  if (value === 'all') {
-    document.cookie = 'oa=1' + cookieAttributes
-    loadGA()
-    window.dispatchEvent(new CustomEvent('cookie-consent', { detail: true }))
-  } else {
-    document.cookie = 'oa=0' + cookieAttributes
-    window.dispatchEvent(new CustomEvent('cookie-consent', { detail: false }))
-  }
-}
-
-if (
-  getMeta('ol-ExposedSettings').gaToken ||
-  getMeta('ol-ExposedSettings').gaTokenV4
-) {
-  document
-    .querySelectorAll('[data-ol-cookie-banner-set-consent]')
-    .forEach(el => {
-      el.addEventListener('click', function (e) {
-        e.preventDefault()
-        const consentType = el.getAttribute('data-ol-cookie-banner-set-consent')
-        setConsent(consentType)
-      })
-    })
-
-  const oaCookie = document.cookie.split('; ').find(c => c.startsWith('oa='))
-  if (!oaCookie) {
-    const cookieBannerEl = document.querySelector('.cookie-banner')
-    if (cookieBannerEl) {
-      cookieBannerEl.classList.remove('hidden')
-    }
-  }
-}
diff --git a/services/web/frontend/js/features/cookie-banner/index.ts b/services/web/frontend/js/features/cookie-banner/index.ts
new file mode 100644
index 0000000000..2ea97e875a
--- /dev/null
+++ b/services/web/frontend/js/features/cookie-banner/index.ts
@@ -0,0 +1,32 @@
+import {
+  CookieConsentValue,
+  cookieBannerRequired,
+  hasMadeCookieChoice,
+  setConsent,
+} from '@/features/cookie-banner/utils'
+
+function toggleCookieBanner(hidden: boolean) {
+  const cookieBannerEl = document.querySelector('.cookie-banner')
+  if (cookieBannerEl) {
+    cookieBannerEl.classList.toggle('hidden', hidden)
+  }
+}
+
+if (cookieBannerRequired()) {
+  document
+    .querySelectorAll('[data-ol-cookie-banner-set-consent]')
+    .forEach(el => {
+      el.addEventListener('click', function (e) {
+        e.preventDefault()
+        toggleCookieBanner(true)
+        const consentType = el.getAttribute(
+          'data-ol-cookie-banner-set-consent'
+        ) as CookieConsentValue | null
+        setConsent(consentType)
+      })
+    })
+
+  if (!hasMadeCookieChoice()) {
+    toggleCookieBanner(false)
+  }
+}
diff --git a/services/web/frontend/js/features/cookie-banner/utils.ts b/services/web/frontend/js/features/cookie-banner/utils.ts
new file mode 100644
index 0000000000..5c045d4e71
--- /dev/null
+++ b/services/web/frontend/js/features/cookie-banner/utils.ts
@@ -0,0 +1,43 @@
+import getMeta from '@/utils/meta'
+
+export type CookieConsentValue = 'all' | 'essential'
+
+function loadGA() {
+  if (window.olLoadGA) {
+    window.olLoadGA()
+  }
+}
+
+export function setConsent(value: CookieConsentValue | null) {
+  const cookieDomain = getMeta('ol-ExposedSettings').cookieDomain
+  const oneYearInSeconds = 60 * 60 * 24 * 365
+  const cookieAttributes =
+    '; path=/' +
+    '; domain=' +
+    cookieDomain +
+    '; max-age=' +
+    oneYearInSeconds +
+    '; SameSite=Lax; Secure'
+  if (value === 'all') {
+    document.cookie = 'oa=1' + cookieAttributes
+    loadGA()
+    window.dispatchEvent(new CustomEvent('cookie-consent', { detail: true }))
+  } else {
+    document.cookie = 'oa=0' + cookieAttributes
+    window.dispatchEvent(new CustomEvent('cookie-consent', { detail: false }))
+  }
+}
+
+export function cookieBannerRequired() {
+  const exposedSettings = getMeta('ol-ExposedSettings')
+  return Boolean(
+    exposedSettings.gaToken ||
+      exposedSettings.gaTokenV4 ||
+      exposedSettings.propensityId ||
+      exposedSettings.hotjarId
+  )
+}
+
+export function hasMadeCookieChoice() {
+  return document.cookie.split('; ').some(c => c.startsWith('oa='))
+}
diff --git a/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx b/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
index e38bbc18ae..52664de105 100644
--- a/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
+++ b/services/web/frontend/js/features/dictionary/components/dictionary-modal-content.tsx
@@ -33,7 +33,7 @@ export default function DictionaryModalContent({
   const { isError, runAsync } = useAsync()
 
   const handleRemove = useCallback(
-    word => {
+    (word: string) => {
       runAsync(postJSON('/spelling/unlearn', { body: { word } }))
         .then(() => {
           setLearnedWords(prevLearnedWords => {
@@ -68,7 +68,9 @@ export default function DictionaryModalContent({
           <ul className="list-unstyled dictionary-entries-list">
             {[...learnedWords].sort(wordsSortFunction).map(learnedWord => (
               <li key={learnedWord} className="dictionary-entry">
-                <span className="dictionary-entry-name">{learnedWord}</span>
+                <span className="dictionary-entry-name" translate="no">
+                  {learnedWord}
+                </span>
                 <OLTooltip
                   id={`tooltip-remove-learned-word-${learnedWord}`}
                   description={t('edit_dictionary_remove')}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/actions-manage-template.tsx b/services/web/frontend/js/features/editor-left-menu/components/actions-manage-template.tsx
new file mode 100644
index 0000000000..f277111a91
--- /dev/null
+++ b/services/web/frontend/js/features/editor-left-menu/components/actions-manage-template.tsx
@@ -0,0 +1,72 @@
+import { useCallback, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import * as eventTracking from '../../../infrastructure/event-tracking'
+import getMeta from '../../../utils/meta'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { useDetachCompileContext } from '../../../shared/context/detach-compile-context'
+import EditorManageTemplateModalWrapper from '../../template/components/manage-template-modal/editor-manage-template-modal-wrapper'
+import LeftMenuButton from './left-menu-button'
+
+type TemplateManageResponse = {
+  template_id: string
+}
+
+export default function ActionsManageTemplate() {
+
+  const templatesAdmin = getMeta('ol-showTemplatesServerPro')
+  if (!templatesAdmin) {
+    return null
+  }
+
+  const [showModal, setShowModal] = useState(false)
+  const { pdfFile } = useDetachCompileContext()
+  const { t } = useTranslation()
+
+  const handleShowModal = useCallback(() => {
+    eventTracking.sendMB('left-menu-template')
+    setShowModal(true)
+  }, [])
+
+  const openTemplate = useCallback(
+    ({ template_id: templateId }: TemplateManageResponse) => {
+      location.assign(`/template/${templateId}`)
+    },
+    [location]
+  )
+
+  return (
+    <>
+      {pdfFile ? (
+        <LeftMenuButton onClick={handleShowModal} icon='open_in_new'>
+          {t('publish_as_template')}
+        </LeftMenuButton>
+      ) : (
+        <OLTooltip
+          id="disabled-publish-as-template"
+          description={t('please_compile_pdf_before_publish_as_template')}
+          overlayProps={{
+            placement: 'top',
+          }}
+        >
+          {/* OverlayTrigger won't fire unless the child is a non-react html element (e.g div, span) */}
+          <div>
+            <LeftMenuButton
+              icon='open_in_new'
+              disabled
+              disabledAccesibilityText={t(
+                'please_compile_pdf_before_publish_as_template'
+              )}
+            >
+              {t('publish_as_template')}
+            </LeftMenuButton>
+          </div>
+        </OLTooltip>
+      )}
+      <EditorManageTemplateModalWrapper
+        show={showModal}
+        handleHide={() => setShowModal(false)}
+        openTemplate={openTemplate}
+      />
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/actions-word-count.tsx b/services/web/frontend/js/features/editor-left-menu/components/actions-word-count.tsx
index 3e05c907d6..7832939541 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/actions-word-count.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/actions-word-count.tsx
@@ -1,15 +1,10 @@
 import { useState, useCallback } from 'react'
-import { useTranslation } from 'react-i18next'
-import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
 import WordCountModal from '../../word-count-modal/components/word-count-modal'
-import LeftMenuButton from './left-menu-button'
 import * as eventTracking from '../../../infrastructure/event-tracking'
-import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { WordCountButton } from '@/features/word-count-modal/components/word-count-button'
 
 export default function ActionsWordCount() {
   const [showModal, setShowModal] = useState(false)
-  const { pdfUrl } = useCompileContext()
-  const { t } = useTranslation()
 
   const handleShowModal = useCallback(() => {
     eventTracking.sendMB('left-menu-count')
@@ -18,32 +13,7 @@ export default function ActionsWordCount() {
 
   return (
     <>
-      {pdfUrl ? (
-        <LeftMenuButton onClick={handleShowModal} icon="match_case">
-          {t('word_count')}
-        </LeftMenuButton>
-      ) : (
-        <OLTooltip
-          id="disabled-word-count"
-          description={t('please_compile_pdf_before_word_count')}
-          overlayProps={{
-            placement: 'top',
-          }}
-        >
-          {/* OverlayTrigger won't fire unless the child is a non-react html element (e.g div, span) */}
-          <div>
-            <LeftMenuButton
-              icon="match_case"
-              disabled
-              disabledAccesibilityText={t(
-                'please_compile_pdf_before_word_count'
-              )}
-            >
-              {t('word_count')}
-            </LeftMenuButton>
-          </div>
-        </OLTooltip>
-      )}
+      <WordCountButton handleShowModal={handleShowModal} />
       <WordCountModal show={showModal} handleHide={() => setShowModal(false)} />
     </>
   )
diff --git a/services/web/frontend/js/features/editor-left-menu/components/download-pdf.tsx b/services/web/frontend/js/features/editor-left-menu/components/download-pdf.tsx
index 31e9073743..406c2b4cc5 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/download-pdf.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/download-pdf.tsx
@@ -9,7 +9,7 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 export default function DownloadPDF() {
   const { t } = useTranslation()
   const { pdfDownloadUrl, pdfUrl } = useCompileContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   function sendDownloadEvent() {
     eventTracking.sendMB('download-pdf-button-click', {
diff --git a/services/web/frontend/js/features/editor-left-menu/components/download-source.tsx b/services/web/frontend/js/features/editor-left-menu/components/download-source.tsx
index 6b25b2a28d..9c9e4b2471 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/download-source.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/download-source.tsx
@@ -6,7 +6,7 @@ import MaterialIcon from '@/shared/components/material-icon'
 
 export default function DownloadSource() {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   function sendDownloadEvent() {
     eventTracking.sendMB('download-zip-button-click', {
diff --git a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu-context.tsx b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu-context.tsx
index 8682b056ec..ed2b4e9736 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu-context.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu-context.tsx
@@ -9,17 +9,19 @@ export const EditorLeftMenuContext = createContext<
   EditorLeftMenuState | undefined
 >(undefined)
 
-export const EditorLeftMenuProvider: FC = ({ children }) => {
+export const EditorLeftMenuProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [value, setValue] = useState<EditorLeftMenuState>(() => ({
     settingToFocus: undefined,
   }))
 
   useEventListener(
     'ui.focus-setting',
-    useCallback(event => {
+    useCallback((event: CustomEvent<string>) => {
       setValue(value => ({
         ...value,
-        settingToFocus: (event as CustomEvent<string>).detail,
+        settingToFocus: event.detail,
       }))
     }, [])
   )
diff --git a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
index 392793ec9c..183e4d1836 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
@@ -3,7 +3,7 @@ import LeftMenuMask from './left-menu-mask'
 import classNames from 'classnames'
 import { lazy, memo, Suspense } from 'react'
 import { FullSizeLoadingSpinner } from '@/shared/components/loading-spinner'
-import { Offcanvas } from 'react-bootstrap-5'
+import { Offcanvas } from 'react-bootstrap'
 import { EditorLeftMenuProvider } from './editor-left-menu-context'
 import withErrorBoundary from '@/infrastructure/error-boundary'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
@@ -43,6 +43,7 @@ function EditorLeftMenu() {
             shown: leftMenuShown,
           })}
           id="left-menu"
+          data-testid="left-menu"
         >
           <LazyEditorLeftMenuWithErrorBoundary />
         </Offcanvas.Body>
diff --git a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
index e827c7e528..f1cd54750f 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
@@ -9,6 +9,7 @@ type Props = {
   disabledAccesibilityText?: string
   type?: 'button' | 'link'
   href?: string
+  translate?: React.HTMLAttributes<HTMLElement>['translate']
 }
 
 function LeftMenuButtonIcon({
@@ -34,14 +35,15 @@ export default function LeftMenuButton({
   disabledAccesibilityText,
   type = 'button',
   href,
+  translate,
 }: PropsWithChildren<Props>) {
   if (disabled) {
     return (
       <div className="left-menu-button link-disabled">
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
         {disabledAccesibilityText ? (
-          <span className="sr-only">{disabledAccesibilityText}</span>
+          <span className="visually-hidden">{disabledAccesibilityText}</span>
         ) : null}
       </div>
     )
@@ -51,7 +53,7 @@ export default function LeftMenuButton({
     return (
       <button onClick={onClick} className="left-menu-button">
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
       </button>
     )
   } else {
@@ -63,7 +65,7 @@ export default function LeftMenuButton({
         className="left-menu-button"
       >
         <LeftMenuButtonIcon svgIcon={svgIcon} icon={icon} />
-        <span>{children}</span>
+        <span translate={translate}>{children}</span>
       </a>
     )
   }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
index 8d7076ebd4..2eab7f25b5 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-compiler.tsx
@@ -34,6 +34,7 @@ export default function SettingsCompiler() {
       ]}
       label={t('compiler')}
       name="compiler"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
index 839bd499eb..8655a63cfc 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-document.tsx
@@ -43,6 +43,7 @@ export default function SettingsDocument() {
       options={validDocsOptions}
       label={t('main_document')}
       name="rootDocId"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
index 5f9ad51869..870ce48ca1 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-editor-theme.tsx
@@ -40,6 +40,7 @@ export default function SettingsEditorTheme() {
       options={options}
       label={t('editor_theme')}
       name="editorTheme"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
index 5a327093a4..61f85c1e70 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-font-family.tsx
@@ -1,7 +1,6 @@
 import { useTranslation } from 'react-i18next'
 import { useProjectSettingsContext } from '../../context/project-settings-context'
 import SettingsMenuSelect from './settings-menu-select'
-import BetaBadge from '@/shared/components/beta-badge'
 import { FontFamily } from '@/shared/utils/styles'
 
 export default function SettingsFontFamily() {
@@ -9,39 +8,26 @@ export default function SettingsFontFamily() {
   const { fontFamily, setFontFamily } = useProjectSettingsContext()
 
   return (
-    <div className="left-menu-setting-position">
-      <SettingsMenuSelect<FontFamily>
-        onChange={setFontFamily}
-        value={fontFamily}
-        options={[
-          {
-            value: 'monaco',
-            label: 'Monaco / Menlo / Consolas',
-          },
-          {
-            value: 'lucida',
-            label: 'Lucida / Source Code Pro',
-          },
-          {
-            value: 'opendyslexicmono',
-            label: 'OpenDyslexic Mono',
-          },
-        ]}
-        label={t('font_family')}
-        name="fontFamily"
-      />
-      <BetaBadge
-        phase="release"
-        link={{
-          href: 'https://docs.google.com/forms/d/e/1FAIpQLScOt_IHTrcaM_uitP9dgCo_r4dl4cy9Ry6LhYYcwTN4qDTDUg/viewform',
-          className: 'left-menu-setting-icon',
-        }}
-        tooltip={{
-          id: 'font-family-tooltip',
-          text: `${t('new_font_open_dyslexic')} ${t('click_to_give_feedback')}`,
-          placement: 'right',
-        }}
-      />
-    </div>
+    <SettingsMenuSelect<FontFamily>
+      onChange={setFontFamily}
+      value={fontFamily}
+      options={[
+        {
+          value: 'monaco',
+          label: 'Monaco / Menlo / Consolas',
+        },
+        {
+          value: 'lucida',
+          label: 'Lucida / Source Code Pro',
+        },
+        {
+          value: 'opendyslexicmono',
+          label: 'OpenDyslexic Mono',
+        },
+      ]}
+      label={t('font_family')}
+      name="fontFamily"
+      translateOptions="no"
+    />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
index f52347814a..a0499fe569 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-image-name.tsx
@@ -37,6 +37,7 @@ export default function SettingsImageName() {
       options={options}
       label={t('tex_live_version')}
       name="imageName"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
index a6a68cd5f9..c48486ec1c 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-menu-select.tsx
@@ -2,7 +2,7 @@ import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
 import OLFormSelect from '@/features/ui/components/ol/ol-form-select'
 import { ChangeEventHandler, useCallback, useEffect, useRef } from 'react'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 import { useEditorLeftMenuContext } from '@/features/editor-left-menu/components/editor-left-menu-context'
 
 type PossibleValue = string | number | boolean
@@ -28,6 +28,7 @@ type SettingsMenuSelectProps<T extends PossibleValue = string> = {
   onChange: (val: T) => void
   value?: T
   disabled?: boolean
+  translateOptions?: 'yes' | 'no'
 }
 
 export default function SettingsMenuSelect<T extends PossibleValue = string>({
@@ -39,6 +40,7 @@ export default function SettingsMenuSelect<T extends PossibleValue = string>({
   onChange,
   value,
   disabled = false,
+  translateOptions,
 }: SettingsMenuSelectProps<T>) {
   const handleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
     event => {
@@ -95,6 +97,7 @@ export default function SettingsMenuSelect<T extends PossibleValue = string>({
           value={value?.toString()}
           disabled={disabled}
           ref={selectRef}
+          translate={translateOptions}
         >
           {options.map(option => (
             <option
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
index 7adea8c57c..3a0269693e 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-pdf-viewer.tsx
@@ -23,6 +23,7 @@ export default function SettingsPdfViewer() {
       ]}
       label={t('pdf_viewer')}
       name="pdfViewer"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-spell-check-language.tsx b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-spell-check-language.tsx
index ecd0ced624..5529ecd871 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/settings/settings-spell-check-language.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/settings/settings-spell-check-language.tsx
@@ -4,7 +4,7 @@ import getMeta from '../../../../utils/meta'
 import { useProjectSettingsContext } from '../../context/project-settings-context'
 import SettingsMenuSelect from './settings-menu-select'
 import type { Optgroup } from './settings-menu-select'
-import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { supportsWebAssembly } from '@/utils/wasm'
 
 export default function SettingsSpellCheckLanguage() {
@@ -12,7 +12,7 @@ export default function SettingsSpellCheckLanguage() {
 
   const { spellCheckLanguage, setSpellCheckLanguage } =
     useProjectSettingsContext()
-  const { permissionsLevel } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
 
   const optgroup: Optgroup = useMemo(() => {
     const options = (getMeta('ol-languages') ?? [])
diff --git a/services/web/frontend/js/features/editor-left-menu/context/project-settings-context.tsx b/services/web/frontend/js/features/editor-left-menu/context/project-settings-context.tsx
index 20aa62b2d6..e5cd576ba1 100644
--- a/services/web/frontend/js/features/editor-left-menu/context/project-settings-context.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/context/project-settings-context.tsx
@@ -27,6 +27,7 @@ type ProjectSettingsSetterContextValue = {
   setLineHeight: (lineHeight: UserSettings['lineHeight']) => void
   setPdfViewer: (pdfViewer: UserSettings['pdfViewer']) => void
   setMathPreview: (mathPreview: UserSettings['mathPreview']) => void
+  setBreadcrumbs: (breadcrumbs: UserSettings['breadcrumbs']) => void
 }
 
 type ProjectSettingsContextValue = Partial<ProjectSettings> &
@@ -37,7 +38,9 @@ export const ProjectSettingsContext = createContext<
   ProjectSettingsContextValue | undefined
 >(undefined)
 
-export const ProjectSettingsProvider: FC = ({ children }) => {
+export const ProjectSettingsProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const {
     compiler,
     setCompiler,
@@ -72,6 +75,8 @@ export const ProjectSettingsProvider: FC = ({ children }) => {
     setPdfViewer,
     mathPreview,
     setMathPreview,
+    breadcrumbs,
+    setBreadcrumbs,
   } = useUserWideSettings()
 
   useProjectWideSettingsSocketListener()
@@ -108,6 +113,8 @@ export const ProjectSettingsProvider: FC = ({ children }) => {
       setPdfViewer,
       mathPreview,
       setMathPreview,
+      breadcrumbs,
+      setBreadcrumbs,
     }),
     [
       compiler,
@@ -140,6 +147,8 @@ export const ProjectSettingsProvider: FC = ({ children }) => {
       setPdfViewer,
       mathPreview,
       setMathPreview,
+      breadcrumbs,
+      setBreadcrumbs,
     ]
   )
 
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings-socket-listener.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings-socket-listener.tsx
index fde26a19d9..953084bd25 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings-socket-listener.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings-socket-listener.tsx
@@ -1,40 +1,38 @@
 import { useCallback, useEffect } from 'react'
 import { useIdeContext } from '../../../shared/context/ide-context'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
+import { useProjectContext } from '@/shared/context/project-context'
 import type { ProjectSettings } from '../utils/api'
 
 export default function useProjectWideSettingsSocketListener() {
   const { socket } = useIdeContext()
 
-  const [project, setProject] = useScopeValue<ProjectSettings | undefined>(
-    'project'
-  )
+  const { project, updateProject } = useProjectContext()
 
   const setCompiler = useCallback(
     (compiler: ProjectSettings['compiler']) => {
       if (project) {
-        setProject({ ...project, compiler })
+        updateProject({ compiler })
       }
     },
-    [project, setProject]
+    [project, updateProject]
   )
 
   const setImageName = useCallback(
     (imageName: ProjectSettings['imageName']) => {
       if (project) {
-        setProject({ ...project, imageName })
+        updateProject({ imageName })
       }
     },
-    [project, setProject]
+    [project, updateProject]
   )
 
   const setSpellCheckLanguage = useCallback(
     (spellCheckLanguage: ProjectSettings['spellCheckLanguage']) => {
       if (project) {
-        setProject({ ...project, spellCheckLanguage })
+        updateProject({ spellCheckLanguage })
       }
     },
-    [project, setProject]
+    [project, updateProject]
   )
 
   useEffect(() => {
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings.tsx
index 3e569f2757..0226e87678 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings.tsx
@@ -1,14 +1,14 @@
 import { useCallback } from 'react'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
 import type { ProjectSettings } from '../utils/api'
 import useRootDocId from './use-root-doc-id'
 import useSaveProjectSettings from './use-save-project-settings'
 import useSetSpellCheckLanguage from './use-set-spell-check-language'
 import { debugConsole } from '@/utils/debugging'
+import { useProjectContext } from '@/shared/context/project-context'
 
 export default function useProjectWideSettings() {
   // The value will be undefined on mount
-  const [project] = useScopeValue<ProjectSettings | undefined>('project')
+  const { project } = useProjectContext()
   const saveProjectSettings = useSaveProjectSettings()
 
   const setCompiler = useCallback(
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-root-doc-id.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-root-doc-id.tsx
index ca2e85841f..632a3b3ce7 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-root-doc-id.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-root-doc-id.tsx
@@ -1,13 +1,13 @@
 import { useCallback } from 'react'
-import { useEditorContext } from '../../../shared/context/editor-context'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
+import { useProjectContext } from '@/shared/context/project-context'
 import type { ProjectSettings } from '../utils/api'
 import useSaveProjectSettings from './use-save-project-settings'
 
 export default function useRootDocId() {
-  const [rootDocId] =
-    useScopeValue<ProjectSettings['rootDocId']>('project.rootDoc_id')
-  const { permissionsLevel } = useEditorContext()
+  const { project } = useProjectContext()
+  const rootDocId = project?.rootDocId
+  const { permissionsLevel } = useIdeReactContext()
   const saveProjectSettings = useSaveProjectSettings()
 
   const setRootDocIdFunc = useCallback(
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-save-project-settings.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-save-project-settings.tsx
index 07a20a10fa..425cfee74b 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-save-project-settings.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-save-project-settings.tsx
@@ -1,31 +1,21 @@
 import { type ProjectSettings, saveProjectSettings } from '../utils/api'
-import { useProjectContext } from '../../../shared/context/project-context'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
+import { useProjectContext } from '@/shared/context/project-context'
 
 export default function useSaveProjectSettings() {
-  // projectSettings value will be undefined on mount
-  const [projectSettings, setProjectSettings] = useScopeValue<
-    ProjectSettings | undefined
-  >('project')
-  const { _id: projectId } = useProjectContext()
+  const { projectId, project, updateProject } = useProjectContext()
 
   return async (
     key: keyof ProjectSettings,
     newSetting: ProjectSettings[keyof ProjectSettings]
   ) => {
-    if (projectSettings) {
-      const currentSetting = projectSettings[key]
+    if (project) {
+      const currentSetting = project[key]
       if (currentSetting !== newSetting) {
         await saveProjectSettings(projectId, {
           [key]: newSetting,
         })
 
-        // rootDocId is used in our tsx and our endpoint, but rootDoc_id is used in our project $scope, etc
-        // as we use both namings in many files, and convert back and forth,
-        // its complicated to seperate and choose one name for all usages
-        // todo: make rootDocId or rootDoc_id consistent, and remove need for this/ other conversions
-        const settingsKey = key === 'rootDocId' ? 'rootDoc_id' : key
-        setProjectSettings({ ...projectSettings, [settingsKey]: newSetting })
+        updateProject({ [key]: newSetting })
       }
     }
   }
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-set-overall-theme.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-set-overall-theme.tsx
index 6701c78d1f..a026da61e5 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-set-overall-theme.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-set-overall-theme.tsx
@@ -4,7 +4,7 @@ import { saveUserSettings } from '../utils/api'
 import { UserSettings } from '../../../../../types/user-settings'
 import { useUserSettingsContext } from '@/shared/context/user-settings-context'
 import getMeta from '@/utils/meta'
-import { isIEEEBranded } from '@/utils/is-ieee-branded'
+import { useActiveOverallTheme } from '@/shared/hooks/use-active-overall-theme'
 
 export default function useSetOverallTheme() {
   const { userSettings, setUserSettings } = useUserSettingsContext()
@@ -16,13 +16,13 @@ export default function useSetOverallTheme() {
     },
     [setUserSettings]
   )
+  const activeOverallTheme = useActiveOverallTheme()
 
   useEffect(() => {
     // Sets the body's data-theme attribute for theming
-    const theme =
-      overallTheme === 'light-' && !isIEEEBranded() ? 'light' : 'default'
-    document.body.dataset.theme = theme
-  }, [overallTheme])
+    document.body.dataset.theme =
+      activeOverallTheme === 'dark' ? 'default' : 'light'
+  }, [activeOverallTheme])
 
   return useCallback(
     (newOverallTheme: UserSettings['overallTheme']) => {
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-set-spell-check-language.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-set-spell-check-language.tsx
index 075b2106f3..51ea3673e3 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-set-spell-check-language.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-set-spell-check-language.tsx
@@ -1,12 +1,11 @@
 import { useCallback } from 'react'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
+import { useProjectContext } from '@/shared/context/project-context'
 import { type ProjectSettings, saveUserSettings } from '../utils/api'
 import useSaveProjectSettings from './use-save-project-settings'
 
 export default function useSetSpellCheckLanguage() {
-  const [spellCheckLanguage, setSpellCheckLanguage] = useScopeValue<
-    ProjectSettings['spellCheckLanguage']
-  >('project.spellCheckLanguage')
+  const { project } = useProjectContext()
+  const spellCheckLanguage = project?.spellCheckLanguage
   const saveProjectSettings = useSaveProjectSettings()
 
   return useCallback(
@@ -16,10 +15,8 @@ export default function useSetSpellCheckLanguage() {
         newSpellCheckLanguage !== spellCheckLanguage
 
       if (allowUpdate) {
-        setSpellCheckLanguage(newSpellCheckLanguage)
-
         // Save project settings is created from hooks because it will save the value on
-        // both server-side and client-side (angular scope)
+        // both server-side and client-side (project context)
         saveProjectSettings('spellCheckLanguage', newSpellCheckLanguage)
 
         // For user settings, we only need to save it on server-side,
@@ -27,6 +24,6 @@ export default function useSetSpellCheckLanguage() {
         saveUserSettings('spellCheckLanguage', newSpellCheckLanguage)
       }
     },
-    [setSpellCheckLanguage, spellCheckLanguage, saveProjectSettings]
+    [spellCheckLanguage, saveProjectSettings]
   )
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/hooks/use-user-wide-settings.tsx b/services/web/frontend/js/features/editor-left-menu/hooks/use-user-wide-settings.tsx
index 70202c9446..978148721a 100644
--- a/services/web/frontend/js/features/editor-left-menu/hooks/use-user-wide-settings.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/hooks/use-user-wide-settings.tsx
@@ -20,6 +20,7 @@ export default function useUserWideSettings() {
     lineHeight,
     pdfViewer,
     mathPreview,
+    breadcrumbs,
   } = userSettings
 
   const setOverallTheme = useSetOverallTheme()
@@ -93,6 +94,13 @@ export default function useUserWideSettings() {
     [saveUserSettings]
   )
 
+  const setBreadcrumbs = useCallback(
+    (breadcrumbs: UserSettings['breadcrumbs']) => {
+      saveUserSettings('breadcrumbs', breadcrumbs)
+    },
+    [saveUserSettings]
+  )
+
   return {
     autoComplete,
     setAutoComplete,
@@ -116,5 +124,7 @@ export default function useUserWideSettings() {
     setPdfViewer,
     mathPreview,
     setMathPreview,
+    breadcrumbs,
+    setBreadcrumbs,
   }
 }
diff --git a/services/web/frontend/js/features/editor-left-menu/utils/api.ts b/services/web/frontend/js/features/editor-left-menu/utils/api.ts
index 3954f7ea5c..122df91f8c 100644
--- a/services/web/frontend/js/features/editor-left-menu/utils/api.ts
+++ b/services/web/frontend/js/features/editor-left-menu/utils/api.ts
@@ -4,7 +4,7 @@ import { postJSON } from '../../../infrastructure/fetch-json'
 import { debugConsole } from '@/utils/debugging'
 import { UserSettings } from '../../../../../types/user-settings'
 
-export type ProjectSettings = {
+export interface ProjectSettings {
   compiler: ProjectCompiler
   imageName: string
   rootDocId: string
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.tsx
similarity index 76%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.tsx
index 78afcdde42..3336d59aa6 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/chat-toggle-button.tsx
@@ -1,10 +1,17 @@
-import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
 import OLBadge from '@/features/ui/components/ol/ol-badge'
 
-function ChatToggleButton({ chatIsOpen, unreadMessageCount, onClick }) {
+function ChatToggleButton({
+  chatIsOpen,
+  unreadMessageCount,
+  onClick,
+}: {
+  chatIsOpen: boolean
+  unreadMessageCount: number
+  onClick: () => void
+}) {
   const { t } = useTranslation()
   const classes = classNames('btn', 'btn-full-height', { active: chatIsOpen })
 
@@ -26,10 +33,4 @@ function ChatToggleButton({ chatIsOpen, unreadMessageCount, onClick }) {
   )
 }
 
-ChatToggleButton.propTypes = {
-  chatIsOpen: PropTypes.bool,
-  unreadMessageCount: PropTypes.number.isRequired,
-  onClick: PropTypes.func.isRequired,
-}
-
 export default ChatToggleButton
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.tsx
similarity index 67%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.tsx
index 80f3bc12b8..56d9f7b6ab 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/cobranding-logo.tsx
@@ -1,9 +1,11 @@
-import PropTypes from 'prop-types'
-
 function CobrandingLogo({
   brandVariationHomeUrl,
   brandVariationName,
   logoImgUrl,
+}: {
+  brandVariationHomeUrl: string
+  brandVariationName: string
+  logoImgUrl: string
 }) {
   return (
     <a
@@ -21,10 +23,4 @@ function CobrandingLogo({
   )
 }
 
-CobrandingLogo.propTypes = {
-  brandVariationHomeUrl: PropTypes.string.isRequired,
-  brandVariationName: PropTypes.string.isRequired,
-  logoImgUrl: PropTypes.string.isRequired,
-}
-
 export default CobrandingLogo
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/editor-navigation-toolbar-root.tsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/editor-navigation-toolbar-root.tsx
index 4b3795f70c..cb4ac6f194 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/editor-navigation-toolbar-root.tsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/editor-navigation-toolbar-root.tsx
@@ -1,11 +1,13 @@
 import React, { useState, useCallback } from 'react'
 import ToolbarHeader from './toolbar-header'
 import { useEditorContext } from '../../../shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { useChatContext } from '../../chat/context/chat-context'
 import { useLayoutContext } from '../../../shared/context/layout-context'
 import { useProjectContext } from '../../../shared/context/project-context'
 import * as eventTracking from '../../../infrastructure/event-tracking'
 import { Doc } from '../../../../../types/doc'
+import { OnlineUser } from '@/features/ide-react/context/online-users-context'
 
 function isOpentoString(open: boolean) {
   return open ? 'open' : 'close'
@@ -17,7 +19,7 @@ const EditorNavigationToolbarRoot = React.memo(
     openDoc,
     openShareProjectModal,
   }: {
-    onlineUsersArray: any[]
+    onlineUsersArray: OnlineUser[]
     openDoc: (doc: Doc, { gotoLine }: { gotoLine: number }) => void
     openShareProjectModal: () => void
   }) {
@@ -26,12 +28,10 @@ const EditorNavigationToolbarRoot = React.memo(
       features: { trackChangesVisible },
     } = useProjectContext()
 
-    const {
-      cobranding,
-      isRestrictedTokenMember,
-      renameProject,
-      permissionsLevel,
-    } = useEditorContext()
+    const { cobranding, isRestrictedTokenMember, renameProject } =
+      useEditorContext()
+
+    const { permissionsLevel } = useIdeReactContext()
 
     const {
       chatIsOpen,
@@ -56,7 +56,7 @@ const EditorNavigationToolbarRoot = React.memo(
     }, [chatIsOpen, setChatIsOpen, markMessagesAsRead])
 
     const toggleReviewPanelOpen = useCallback(
-      event => {
+      (event: any) => {
         event.preventDefault()
         eventTracking.sendMB('navigation-clicked-review', {
           action: isOpentoString(!reviewPanelOpen),
@@ -93,7 +93,7 @@ const EditorNavigationToolbarRoot = React.memo(
     }, [setLeftMenuShown])
 
     const goToUser = useCallback(
-      user => {
+      (user: OnlineUser) => {
         if (user.doc && typeof user.row === 'number') {
           openDoc(user.doc, { gotoLine: user.row + 1 })
         }
@@ -103,7 +103,6 @@ const EditorNavigationToolbarRoot = React.memo(
 
     return (
       <ToolbarHeader
-        // @ts-ignore: TODO(convert ToolbarHeader to TSX)
         cobranding={cobranding}
         onShowLeftMenuClick={onShowLeftMenuClick}
         chatIsOpen={chatIsOpen}
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.tsx
similarity index 74%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.tsx
index 644efd7a1a..093296e476 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/history-toggle-button.tsx
@@ -1,8 +1,7 @@
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
 
-function HistoryToggleButton({ onClick }) {
+function HistoryToggleButton({ onClick }: { onClick: () => void }) {
   const { t } = useTranslation()
 
   return (
@@ -11,12 +10,9 @@ function HistoryToggleButton({ onClick }) {
         <MaterialIcon type="history" className="align-middle" />
         <p className="toolbar-label">{t('history')}</p>
       </button>
+      <div id="toolbar-cio-history" className="toolbar-cio-tooltip" />
     </div>
   )
 }
 
-HistoryToggleButton.propTypes = {
-  onClick: PropTypes.func.isRequired,
-}
-
 export default HistoryToggleButton
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/layout-dropdown-button.tsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/layout-dropdown-button.tsx
index 748dd565c8..addd6a013e 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/layout-dropdown-button.tsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/layout-dropdown-button.tsx
@@ -1,5 +1,5 @@
 import { memo, useCallback, forwardRef } from 'react'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 import {
   Dropdown,
   DropdownItem,
@@ -172,7 +172,7 @@ export const LayoutDropdownButtonUi = ({
   return (
     <>
       {processing && (
-        <div aria-live="assertive" className="sr-only">
+        <div aria-live="assertive" className="visually-hidden">
           {t('layout_processing')}
         </div>
       )}
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.tsx
similarity index 77%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.tsx
index fa3d8fa46c..fb059737dd 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/menu-button.tsx
@@ -1,8 +1,7 @@
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
 
-function MenuButton({ onClick }) {
+function MenuButton({ onClick }: { onClick: () => void }) {
   const { t } = useTranslation()
 
   return (
@@ -15,8 +14,4 @@ function MenuButton({ onClick }) {
   )
 }
 
-MenuButton.propTypes = {
-  onClick: PropTypes.func.isRequired,
-}
-
 export default MenuButton
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
similarity index 77%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
index 700bc5eb05..e9d8f52506 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/online-users-widget.tsx
@@ -1,5 +1,4 @@
 import React from 'react'
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import {
   Dropdown,
@@ -11,17 +10,27 @@ import {
 import { getBackgroundColorForUserId } from '@/shared/utils/colors'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import MaterialIcon from '@/shared/components/material-icon'
+import { OnlineUser } from '@/features/ide-react/context/online-users-context'
 
-function OnlineUsersWidget({ onlineUsers, goToUser }) {
+function OnlineUsersWidget({
+  onlineUsers,
+  goToUser,
+}: {
+  onlineUsers: OnlineUser[]
+  goToUser: (user: OnlineUser) => void
+}) {
   const { t } = useTranslation()
 
   const shouldDisplayDropdown = onlineUsers.length >= 4
 
   if (shouldDisplayDropdown) {
     return (
-      <Dropdown id="online-users" className="online-users" align="end">
+      <Dropdown className="online-users" align="end">
         <DropdownToggle
+          id="online-users"
           as={DropDownToggleButton}
+          // @ts-ignore: fix type of DropdownToggle with "as" prop so that it can accept
+          // custom props for that component
           onlineUserCount={onlineUsers.length}
         />
         <DropdownMenu>
@@ -51,6 +60,7 @@ function OnlineUsersWidget({ onlineUsers, goToUser }) {
             id="online-user"
             description={user.name}
             overlayProps={{ placement: 'bottom', trigger: ['hover', 'focus'] }}
+            tooltipProps={{ translate: 'no' }}
           >
             <span>
               {/* OverlayTrigger won't fire unless UserIcon is wrapped in a span */}
@@ -63,17 +73,15 @@ function OnlineUsersWidget({ onlineUsers, goToUser }) {
   }
 }
 
-OnlineUsersWidget.propTypes = {
-  onlineUsers: PropTypes.arrayOf(
-    PropTypes.shape({
-      user_id: PropTypes.string.isRequired,
-      name: PropTypes.string.isRequired,
-    })
-  ).isRequired,
-  goToUser: PropTypes.func.isRequired,
-}
-
-function UserIcon({ user, showName, onClick }) {
+function UserIcon({
+  user,
+  showName,
+  onClick,
+}: {
+  user: OnlineUser
+  showName?: boolean
+  onClick?: (user: OnlineUser) => void
+}) {
   const backgroundColor = getBackgroundColorForUserId(user.user_id)
 
   function handleOnClick() {
@@ -93,16 +101,10 @@ function UserIcon({ user, showName, onClick }) {
   )
 }
 
-UserIcon.propTypes = {
-  user: PropTypes.shape({
-    user_id: PropTypes.string.isRequired,
-    name: PropTypes.string.isRequired,
-  }),
-  showName: PropTypes.bool,
-  onClick: PropTypes.func,
-}
-
-const DropDownToggleButton = React.forwardRef((props, ref) => {
+const DropDownToggleButton = React.forwardRef<
+  HTMLButtonElement,
+  { onlineUserCount: number; onClick: React.MouseEventHandler }
+>((props, ref) => {
   const { t } = useTranslation()
   return (
     <OLTooltip
@@ -125,9 +127,4 @@ const DropDownToggleButton = React.forwardRef((props, ref) => {
 
 DropDownToggleButton.displayName = 'DropDownToggleButton'
 
-DropDownToggleButton.propTypes = {
-  onlineUserCount: PropTypes.number.isRequired,
-  onClick: PropTypes.func,
-}
-
 export default OnlineUsersWidget
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.tsx
similarity index 75%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.tsx
index f0aed3674d..359ce92ffb 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/share-project-button.tsx
@@ -1,8 +1,7 @@
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
 
-function ShareProjectButton({ onClick }) {
+function ShareProjectButton({ onClick }: { onClick: () => void }) {
   const { t } = useTranslation()
 
   return (
@@ -11,12 +10,9 @@ function ShareProjectButton({ onClick }) {
         <MaterialIcon type="group_add" className="align-middle" />
         <p className="toolbar-label">{t('share')}</p>
       </button>
+      <div id="toolbar-cio-share" className="toolbar-cio-tooltip" />
     </div>
   )
 }
 
-ShareProjectButton.propTypes = {
-  onClick: PropTypes.func.isRequired,
-}
-
 export default ShareProjectButton
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.tsx
similarity index 79%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.tsx
index 97bfa763cc..d116c9b881 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.tsx
@@ -1,5 +1,4 @@
-import React from 'react'
-import PropTypes from 'prop-types'
+import React, { ElementType } from 'react'
 import { useTranslation } from 'react-i18next'
 import MenuButton from './menu-button'
 import CobrandingLogo from './cobranding-logo'
@@ -18,19 +17,50 @@ import getMeta from '@/utils/meta'
 import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 import { canUseNewEditor } from '@/features/ide-redesign/utils/new-editor-utils'
 import TryNewEditorButton from '../try-new-editor-button'
+import { OnlineUser } from '@/features/ide-react/context/online-users-context'
+import { Cobranding } from '../../../../../types/cobranding'
 
-const [publishModalModules] = importOverleafModules('publishModal')
+const [publishModalModules] = importOverleafModules('publishModal') as {
+  import: { default: ElementType }
+  path: string
+}[]
 const PublishButton = publishModalModules?.import.default
 
 const offlineModeToolbarButtons = importOverleafModules(
   'offlineModeToolbarButtons'
-)
+) as {
+  import: { default: ElementType }
+  path: string
+}[]
+
 // double opt-in
 const enableROMirrorOnClient =
   isSplitTestEnabled('ro-mirror-on-client') &&
   new URLSearchParams(window.location.search).get('ro-mirror-on-client') ===
     'enabled'
 
+export type ToolbarHeaderProps = {
+  cobranding: Cobranding | undefined
+  onShowLeftMenuClick: () => void
+  chatIsOpen: boolean
+  toggleChatOpen: () => void
+  reviewPanelOpen: boolean
+  toggleReviewPanelOpen: (e: React.MouseEvent) => void
+  historyIsOpen: boolean
+  toggleHistoryOpen: () => void
+  unreadMessageCount: number
+  onlineUsers: OnlineUser[]
+  goToUser: (user: OnlineUser) => void
+  isRestrictedTokenMember: boolean | undefined
+  hasPublishPermissions: boolean
+  chatVisible: boolean
+  projectName: string
+  renameProject: (name: string) => void
+  hasRenamePermissions: boolean
+  openShareModal: () => void
+  trackChangesVisible: boolean | undefined
+}
+
 const ToolbarHeader = React.memo(function ToolbarHeader({
   cobranding,
   onShowLeftMenuClick,
@@ -51,8 +81,8 @@ const ToolbarHeader = React.memo(function ToolbarHeader({
   hasRenamePermissions,
   openShareModal,
   trackChangesVisible,
-}) {
-  const chatEnabled = getMeta('ol-chatEnabled')
+}: ToolbarHeaderProps) {
+  const chatEnabled = getMeta('ol-capabilities')?.includes('chat')
 
   const { t } = useTranslation()
   const shouldDisplayPublishButton = hasPublishPermissions && PublishButton
@@ -132,26 +162,4 @@ const ToolbarHeader = React.memo(function ToolbarHeader({
   )
 })
 
-ToolbarHeader.propTypes = {
-  onShowLeftMenuClick: PropTypes.func.isRequired,
-  cobranding: PropTypes.object,
-  chatIsOpen: PropTypes.bool,
-  toggleChatOpen: PropTypes.func.isRequired,
-  reviewPanelOpen: PropTypes.bool,
-  toggleReviewPanelOpen: PropTypes.func.isRequired,
-  historyIsOpen: PropTypes.bool,
-  toggleHistoryOpen: PropTypes.func.isRequired,
-  unreadMessageCount: PropTypes.number.isRequired,
-  onlineUsers: PropTypes.array.isRequired,
-  goToUser: PropTypes.func.isRequired,
-  isRestrictedTokenMember: PropTypes.bool,
-  hasPublishPermissions: PropTypes.bool,
-  chatVisible: PropTypes.bool,
-  projectName: PropTypes.string.isRequired,
-  renameProject: PropTypes.func.isRequired,
-  hasRenamePermissions: PropTypes.bool,
-  openShareModal: PropTypes.func.isRequired,
-  trackChangesVisible: PropTypes.bool,
-}
-
 export default ToolbarHeader
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.tsx
similarity index 80%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.tsx
index 5b74c71e84..927e6ec2c5 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/track-changes-toggle-button.tsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
@@ -7,6 +6,10 @@ function TrackChangesToggleButton({
   trackChangesIsOpen,
   disabled,
   onMouseDown,
+}: {
+  trackChangesIsOpen: boolean
+  disabled?: boolean
+  onMouseDown: (e: React.MouseEvent) => void
 }) {
   const { t } = useTranslation()
   const classes = classNames('btn', 'btn-full-height', {
@@ -25,14 +28,9 @@ function TrackChangesToggleButton({
         <MaterialIcon type="rate_review" className="align-middle" />
         <p className="toolbar-label">{t('review')}</p>
       </button>
+      <div id="toolbar-cio-review" className="toolbar-cio-tooltip" />
     </div>
   )
 }
 
-TrackChangesToggleButton.propTypes = {
-  trackChangesIsOpen: PropTypes.bool,
-  disabled: PropTypes.bool,
-  onMouseDown: PropTypes.func.isRequired,
-}
-
 export default TrackChangesToggleButton
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.jsx b/services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.tsx
similarity index 96%
rename from services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.jsx
rename to services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.tsx
index 594dd9feec..b5bbc1a0ba 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.jsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/components/upgrade-prompt.tsx
@@ -5,7 +5,7 @@ import OLButton from '@/features/ui/components/ol/ol-button'
 function UpgradePrompt() {
   const { t } = useTranslation()
 
-  function handleClick(e) {
+  function handleClick() {
     eventTracking.send('subscription-funnel', 'code-editor', 'upgrade')
     eventTracking.sendMB('upgrade-button-click', { source: 'code-editor' })
   }
diff --git a/services/web/frontend/js/features/editor-navigation-toolbar/try-new-editor-button.tsx b/services/web/frontend/js/features/editor-navigation-toolbar/try-new-editor-button.tsx
index 91cc150ff6..c9b85025de 100644
--- a/services/web/frontend/js/features/editor-navigation-toolbar/try-new-editor-button.tsx
+++ b/services/web/frontend/js/features/editor-navigation-toolbar/try-new-editor-button.tsx
@@ -7,6 +7,7 @@ import { useTranslation } from 'react-i18next'
 const TryNewEditorButton = () => {
   const { t } = useTranslation()
   const { setShowSwitcherModal } = useIdeRedesignSwitcherContext()
+
   const onClick = useCallback(() => {
     setShowSwitcherModal(true)
   }, [setShowSwitcherModal])
@@ -17,7 +18,7 @@ const TryNewEditorButton = () => {
         onClick={onClick}
         size="sm"
         leadingIcon={<MaterialIcon type="experiment" unfilled />}
-        variant="info"
+        variant="secondary"
       >
         {t('try_the_new_editor')}
       </OLButton>
diff --git a/services/web/frontend/js/features/event-tracking/search-events.ts b/services/web/frontend/js/features/event-tracking/search-events.ts
index 9829a2024e..630d07aeaa 100644
--- a/services/web/frontend/js/features/event-tracking/search-events.ts
+++ b/services/web/frontend/js/features/event-tracking/search-events.ts
@@ -4,7 +4,10 @@ type SearchEventSegmentation = {
   'search-open':
     | ({
         searchType: 'full-project'
-      } & ({ method: 'keyboard' } | { method: 'button'; location: 'toolbar' }))
+      } & (
+        | { method: 'keyboard' }
+        | { method: 'button'; location: 'toolbar' | 'search-form' | 'rail' }
+      ))
     | ({
         searchType: 'document'
         mode: 'visual' | 'source'
diff --git a/services/web/frontend/js/features/faq-search/index.js b/services/web/frontend/js/features/faq-search/index.js
index bb0b11b7a4..1ddf26beb4 100644
--- a/services/web/frontend/js/features/faq-search/index.js
+++ b/services/web/frontend/js/features/faq-search/index.js
@@ -2,7 +2,7 @@ import _ from 'lodash'
 import { formatWikiHit, searchWiki } from '../algolia-search/search-wiki'
 
 function setupSearch(formEl) {
-  const inputEl = formEl.querySelector('input[type="text"]')
+  const inputEl = formEl.querySelector('input[type="search"]')
   const resultsEl = formEl.querySelector('[data-ol-search-results]')
   const wrapperEl = formEl.querySelector('[data-ol-search-results-wrapper]')
   const noResultsEl = formEl.querySelector('[data-ol-search-no-results]')
@@ -102,6 +102,7 @@ function setupSearch(formEl) {
 
   // display initial results
   handleChange()
+  updateClearBtnVisibility()
 }
 
 document.querySelectorAll('[data-ol-faq-search]').forEach(setupSearch)
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-context-menu.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-context-menu.tsx
index 5e66614dcd..18b8ee117d 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-context-menu.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-context-menu.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from 'react'
+import React, { useCallback, useEffect, useRef } from 'react'
 import ReactDOM from 'react-dom'
 import {
   Dropdown,
@@ -13,30 +13,34 @@ function FileTreeContextMenu() {
   const { fileTreeReadOnly } = useFileTreeData()
   const { contextMenuCoords, setContextMenuCoords } = useFileTreeMainContext()
   const toggleButtonRef = useRef<HTMLButtonElement | null>(null)
+  const keyboardInputRef = useRef(false)
 
   useEffect(() => {
     if (contextMenuCoords) {
       toggleButtonRef.current = document.querySelector(
         '.entity-menu-toggle'
       ) as HTMLButtonElement | null
-      focusContextMenu()
     }
   }, [contextMenuCoords])
 
-  if (!contextMenuCoords || fileTreeReadOnly) return null
+  useEffect(() => {
+    if (contextMenuCoords && keyboardInputRef.current) {
+      const firstDropdownMenuItem = document.querySelector(
+        '#dropdown-file-tree-context-menu .dropdown-item:not([disabled])'
+      ) as HTMLButtonElement | null
 
-  // A11y - Move the focus to the context menu when it opens
-  function focusContextMenu() {
-    const BS3contextMenu = document.querySelector(
-      '[aria-labelledby="dropdown-file-tree-context-menu"]'
-    ) as HTMLElement | null
-    BS3contextMenu?.focus()
-  }
+      if (firstDropdownMenuItem) {
+        firstDropdownMenuItem.focus()
+      }
+    }
+  }, [contextMenuCoords])
 
   function close() {
+    if (!contextMenuCoords) return
     setContextMenuCoords(null)
+
     if (toggleButtonRef.current) {
-      // A11y - Move the focus back to the toggle button when the context menu closes by pressing the Esc key
+      // A11y - Focus moves back to the trigger button when the context menu is dismissed
       toggleButtonRef.current.focus()
     }
   }
@@ -45,14 +49,33 @@ function FileTreeContextMenu() {
     if (!wantOpen) close()
   }
 
-  // A11y - Close the context menu when the user presses the Tab key
-  // Focus should move to the next element in the filetree
-  function handleKeyDown(event: React.KeyboardEvent<Element>) {
-    if (event.key === 'Tab') {
+  function handleClose(event: React.KeyboardEvent<Element>) {
+    if (event.key === 'Tab' || event.key === 'Escape') {
+      event.preventDefault()
       close()
     }
   }
 
+  const handleKeyDown = useCallback(() => {
+    keyboardInputRef.current = true
+  }, [])
+
+  const handleMouseDown = useCallback(() => {
+    keyboardInputRef.current = false
+  }, [])
+
+  useEffect(() => {
+    document.addEventListener('keydown', handleKeyDown)
+    document.addEventListener('mousedown', handleMouseDown)
+
+    return () => {
+      document.removeEventListener('keydown', handleKeyDown)
+      document.removeEventListener('mousedown', handleMouseDown)
+    }
+  }, [handleKeyDown, handleMouseDown])
+
+  if (!contextMenuCoords || fileTreeReadOnly) return null
+
   return ReactDOM.createPortal(
     <div style={contextMenuCoords} className="context-menu">
       <Dropdown
@@ -63,8 +86,7 @@ function FileTreeContextMenu() {
             ? 'up'
             : 'down'
         }
-        focusFirstItemOnShow // A11y - Focus the first item in the context menu when it opens since the menu is rendered at the root level
-        onKeyDown={handleKeyDown}
+        onKeyDown={handleClose}
         onToggle={handleToggle}
       >
         <DropdownMenu
@@ -79,14 +101,4 @@ function FileTreeContextMenu() {
   )
 }
 
-// fake component required as Dropdowns require a Toggle, even tho we don't want
-// one for the context menu
-const FakeDropDownToggle = React.forwardRef<undefined, { bsRole: string }>(
-  ({ bsRole }, ref) => {
-    return null
-  }
-)
-
-FakeDropDownToggle.displayName = 'FakeDropDownToggle'
-
 export default FileTreeContextMenu
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-context.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-context.tsx
index 2913c6f9e0..6beecd7e0f 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-context.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-context.tsx
@@ -9,13 +9,15 @@ import { FC } from 'react'
 // FileTreeActionable: global UI state for actions (rename, delete, etc.)
 // FileTreeMutable: provides entities mutation operations
 // FileTreeSelectable: handles selection and multi-selection
-const FileTreeContext: FC<{
-  refProviders: Record<string, boolean>
-  setRefProviderEnabled: (provider: string, value: boolean) => void
-  setStartedFreeTrial: (value: boolean) => void
-  onSelect: () => void
-  fileTreeContainer?: HTMLDivElement
-}> = ({
+const FileTreeContext: FC<
+  React.PropsWithChildren<{
+    refProviders: Record<string, boolean>
+    setRefProviderEnabled: (provider: string, value: boolean) => void
+    setStartedFreeTrial: (value: boolean) => void
+    onSelect: () => void
+    fileTreeContainer?: HTMLDivElement
+  }>
+> = ({
   refProviders,
   setRefProviderEnabled,
   setStartedFreeTrial,
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.jsx
deleted file mode 100644
index ceaafc6fa8..0000000000
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import OLNotification from '@/features/ui/components/ol/ol-notification'
-import PropTypes from 'prop-types'
-
-export default function DangerMessage({ children }) {
-  return <OLNotification type="error" content={children} />
-}
-DangerMessage.propTypes = {
-  children: PropTypes.any.isRequired,
-}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.tsx
new file mode 100644
index 0000000000..d6b7173cb0
--- /dev/null
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/danger-message.tsx
@@ -0,0 +1,9 @@
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+
+export default function DangerMessage({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return <OLNotification type="error" content={children} />
+}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.tsx
similarity index 79%
rename from services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.jsx
rename to services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.tsx
index 0c9ab381c6..244ef1a76b 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.jsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/error-message.tsx
@@ -1,5 +1,4 @@
-import PropTypes from 'prop-types'
-import { useTranslation } from 'react-i18next'
+import { useTranslation, Trans } from 'react-i18next'
 import { FetchError } from '../../../../infrastructure/fetch-json'
 import RedirectToLogin from './redirect-to-login'
 import {
@@ -8,9 +7,16 @@ import {
   InvalidFilenameError,
 } from '../../errors'
 import DangerMessage from './danger-message'
+import getMeta from '@/utils/meta'
 
-export default function ErrorMessage({ error }) {
+// TODO: Update the error type when we properly type FileTreeActionableContext
+export default function ErrorMessage({
+  error,
+}: {
+  error: string | Record<string, any>
+}) {
   const { t } = useTranslation()
+  const { isOverleaf } = getMeta('ol-ExposedSettings')
   const fileNameLimit = 150
 
   // the error is a string
@@ -42,6 +48,22 @@ export default function ErrorMessage({ error }) {
           </DangerMessage>
         )
 
+      case 'invalid_upload_request':
+        if (!isOverleaf) {
+          return (
+            <DangerMessage>{t('generic_something_went_wrong')}</DangerMessage>
+          )
+        }
+        return (
+          <DangerMessage>
+            <Trans
+              i18nKey="invalid_upload_request"
+              // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
+              components={[<a href="/contact" target="_blank" />]}
+            />
+          </DangerMessage>
+        )
+
       case 'duplicate_file_name':
         return (
           <DangerMessage>
@@ -119,6 +141,3 @@ export default function ErrorMessage({ error }) {
       return <DangerMessage>{t('generic_something_went_wrong')}</DangerMessage>
   }
 }
-ErrorMessage.propTypes = {
-  error: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,
-}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.tsx
similarity index 85%
rename from services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.jsx
rename to services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.tsx
index a76768c4df..80c53f1b63 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.jsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-create-name-input.tsx
@@ -1,7 +1,6 @@
 import { useRef, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useFileTreeCreateName } from '../../contexts/file-tree-create-name'
-import PropTypes from 'prop-types'
 import {
   BlockedFilenameError,
   DuplicateFilenameError,
@@ -23,6 +22,15 @@ export default function FileTreeCreateNameInput({
   placeholder,
   error,
   inFlight,
+}: {
+  label?: string
+  focusName?: boolean
+  classes?: {
+    formGroup?: string
+  }
+  placeholder?: string
+  error?: string | Record<string, any>
+  inFlight: boolean
 }) {
   const { t } = useTranslation()
 
@@ -30,7 +38,7 @@ export default function FileTreeCreateNameInput({
   const { name, setName, touchedName, validName } = useFileTreeCreateName()
 
   // focus the first part of the filename if needed
-  const inputRef = useRef(null)
+  const inputRef = useRef<HTMLInputElement>(null)
 
   useEffect(() => {
     if (inputRef.current && focusName) {
@@ -73,18 +81,7 @@ export default function FileTreeCreateNameInput({
   )
 }
 
-FileTreeCreateNameInput.propTypes = {
-  focusName: PropTypes.bool,
-  label: PropTypes.string,
-  classes: PropTypes.shape({
-    formGroup: PropTypes.string,
-  }),
-  placeholder: PropTypes.string,
-  error: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
-  inFlight: PropTypes.bool.isRequired,
-}
-
-function ErrorMessage({ error }) {
+function ErrorMessage({ error }: { error: string | Record<string, any> }) {
   const { t } = useTranslation()
 
   // if (typeof error === 'string') {
@@ -124,6 +121,3 @@ function ErrorMessage({ error }) {
       return null // other errors are displayed elsewhere
   }
 }
-ErrorMessage.propTypes = {
-  error: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired,
-}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.tsx
similarity index 79%
rename from services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.jsx
rename to services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.tsx
index 3432d7b1b8..d1966f1b5d 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.jsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-footer.tsx
@@ -2,7 +2,6 @@ import { useTranslation } from 'react-i18next'
 import { useFileTreeCreateForm } from '../../contexts/file-tree-create-form'
 import { useFileTreeActionable } from '../../contexts/file-tree-actionable'
 import { useFileTreeData } from '../../../../shared/context/file-tree-data-context'
-import PropTypes from 'prop-types'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 
@@ -26,21 +25,33 @@ export function FileTreeModalCreateFileFooterContent({
   valid,
   fileCount,
   inFlight,
-  newFileCreateMode,
   cancel,
+  newFileCreateMode,
+}: {
+  valid: boolean
+  fileCount:
+    | {
+        limit: number
+        status: string
+        value: number
+      }
+    | number
+  inFlight: boolean
+  cancel: () => void
+  newFileCreateMode?: string
 }) {
   const { t } = useTranslation()
 
   return (
     <>
-      {fileCount.status === 'warning' && (
+      {typeof fileCount !== 'number' && fileCount.status === 'warning' && (
         <div className="modal-footer-left approaching-file-limit">
           {t('project_approaching_file_limit')} ({fileCount.value}/
           {fileCount.limit})
         </div>
       )}
 
-      {fileCount.status === 'error' && (
+      {typeof fileCount !== 'number' && fileCount.status === 'error' && (
         <OLNotification
           type="error"
           className="at-file-limit"
@@ -73,14 +84,3 @@ export function FileTreeModalCreateFileFooterContent({
     </>
   )
 }
-FileTreeModalCreateFileFooterContent.propTypes = {
-  cancel: PropTypes.func.isRequired,
-  fileCount: PropTypes.shape({
-    limit: PropTypes.number.isRequired,
-    status: PropTypes.string.isRequired,
-    value: PropTypes.number.isRequired,
-  }).isRequired,
-  inFlight: PropTypes.bool.isRequired,
-  newFileCreateMode: PropTypes.string,
-  valid: PropTypes.bool.isRequired,
-}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.tsx
similarity index 64%
rename from services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.jsx
rename to services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.tsx
index 259dac3144..eb7e0466f4 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.jsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-modal-create-file-mode.tsx
@@ -1,11 +1,17 @@
 import classnames from 'classnames'
-import PropTypes from 'prop-types'
 import { useFileTreeActionable } from '../../contexts/file-tree-actionable'
 import * as eventTracking from '../../../../infrastructure/event-tracking'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import MaterialIcon from '@/shared/components/material-icon'
 
-export default function FileTreeModalCreateFileMode({ mode, icon, label }) {
+export default function FileTreeModalCreateFileMode({
+  mode,
+  icon,
+  label,
+}: {
+  mode: string
+  icon: string
+  label: string
+}) {
   const { newFileCreateMode, startCreatingFile } = useFileTreeActionable()
 
   const handleClick = () => {
@@ -19,17 +25,10 @@ export default function FileTreeModalCreateFileMode({ mode, icon, label }) {
         variant="link"
         onClick={handleClick}
         className="modal-new-file-mode"
+        leadingIcon={icon}
       >
-        <MaterialIcon type={icon} />
-        &nbsp;
         {label}
       </OLButton>
     </li>
   )
 }
-
-FileTreeModalCreateFileMode.propTypes = {
-  mode: PropTypes.string.isRequired,
-  icon: PropTypes.string.isRequired,
-  label: PropTypes.string.isRequired,
-}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-upload-conflicts.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-upload-conflicts.tsx
index 9d8a66122c..c582edef23 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-upload-conflicts.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/file-tree-upload-conflicts.tsx
@@ -96,7 +96,7 @@ export function FolderUploadConflicts({
   setError: (error: string) => void
 }) {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   // Don't allow overwriting files with a folder
   const hasFileConflict = conflicts.some(conflict => conflict.type === 'file')
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-import-from-project.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-import-from-project.tsx
index f8be632986..8084043af8 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-import-from-project.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-import-from-project.tsx
@@ -24,7 +24,7 @@ import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
 import OLForm from '@/features/ui/components/ol/ol-form'
 import OLFormSelect from '@/features/ui/components/ol/ol-form-select'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 
 export default function FileTreeImportFromProject() {
   const { t } = useTranslation()
@@ -50,7 +50,7 @@ export default function FileTreeImportFromProject() {
 
   // use the basename of a path as the file name
   const setNameFromPath = useCallback(
-    path => {
+    (path: string) => {
       const filename = path.split('/').pop()
 
       if (filename) {
@@ -191,7 +191,7 @@ function SelectProject({
   setSelectedProject,
 }: SelectProjectProps) {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   const { data, error, loading } = useUserProjects()
 
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.tsx
index 2ffd591032..afd0bf3671 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/modes/file-tree-upload-doc.tsx
@@ -28,7 +28,7 @@ export default function FileTreeUploadDoc() {
   const { parentFolderId, cancel, droppedFiles, setDroppedFiles } =
     useFileTreeActionable()
   const { fileTreeData } = useFileTreeData()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   const [error, setError] = useState<string>()
 
@@ -176,7 +176,6 @@ export default function FileTreeUploadDoc() {
         // close the modal when all the uploads completed successfully
         .on('complete', result => {
           if (!result.failed.length) {
-            // $scope.$emit('done', { name: name })
             cancel()
           }
         })
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-create/redirect-to-login.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-create/redirect-to-login.tsx
index ab32fcecdb..13ba08b86f 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-create/redirect-to-login.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-create/redirect-to-login.tsx
@@ -6,7 +6,7 @@ import { useLocation } from '../../../../shared/hooks/use-location'
 // handle "not-logged-in" errors by redirecting to the login page
 export default function RedirectToLogin() {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const [secondsToRedirect, setSecondsToRedirect] = useState(10)
   const location = useLocation()
 
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
index 3b67073316..48006b0dee 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-doc.tsx
@@ -28,6 +28,7 @@ function FileTreeDoc({
       {...selectableEntityProps}
       aria-label={name}
       tabIndex={0}
+      translate="no"
     >
       <FileTreeItemInner
         id={id}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.jsx b/services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.tsx
similarity index 74%
rename from services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.jsx
rename to services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.tsx
index fffc4f5ae1..e9076cc3c3 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.jsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-draggable-preview-layer.tsx
@@ -1,6 +1,6 @@
 import { useRef } from 'react'
-import PropTypes from 'prop-types'
 import classNames from 'classnames'
+import { XYCoord } from 'react-dnd'
 
 // a custom component rendered on top of a draggable area that renders the
 // dragged item. See
@@ -12,8 +12,13 @@ function FileTreeDraggablePreviewLayer({
   isDragging,
   item,
   clientOffset,
+}: {
+  isOver: boolean
+  isDragging: boolean
+  item: { title: string }
+  clientOffset: XYCoord | null
 }) {
-  const ref = useRef()
+  const ref = useRef<HTMLDivElement>(null)
 
   return (
     <div
@@ -36,29 +41,16 @@ function FileTreeDraggablePreviewLayer({
   )
 }
 
-FileTreeDraggablePreviewLayer.propTypes = {
-  isOver: PropTypes.bool.isRequired,
-  isDragging: PropTypes.bool.isRequired,
-  item: PropTypes.shape({
-    title: PropTypes.string,
-  }),
-  clientOffset: PropTypes.shape({
-    x: PropTypes.number,
-    y: PropTypes.number,
-  }),
-}
-
-function DraggablePreviewItem({ title }) {
+function DraggablePreviewItem({ title }: { title: string }) {
   return <div className="dnd-draggable-preview-item">{title}</div>
 }
 
-DraggablePreviewItem.propTypes = {
-  title: PropTypes.string.isRequired,
-}
-
 // makes the preview item follow the cursor.
 // See https://react-dnd.github.io/react-dnd/docs/api/drag-layer-monitor
-function getItemStyle(clientOffset, containerOffset) {
+function getItemStyle(
+  clientOffset: XYCoord | null,
+  containerOffset: DOMRect | undefined
+) {
   if (!containerOffset || !clientOffset) {
     return {
       display: 'none',
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
index 5ad8481349..a35646b6d6 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-folder.tsx
@@ -67,6 +67,7 @@ function FileTreeFolder({
         className={classNames(selectableEntityProps.className, {
           'dnd-droppable-hover': isOverRoot || isOverList,
         })}
+        translate="no"
       >
         <FileTreeItemInner
           id={id}
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-inner.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-inner.tsx
index de211c6c07..816aa46fb8 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-inner.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-inner.tsx
@@ -1,7 +1,7 @@
 import { useFileTreeSelectable } from '../contexts/file-tree-selectable'
 import { FC, useCallback } from 'react'
 
-const FileTreeInner: FC = ({ children }) => {
+const FileTreeInner: FC<React.PropsWithChildren> = ({ children }) => {
   const { setIsRootFolderSelected, selectedEntityIds, select } =
     useFileTreeSelectable()
 
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-menu-items.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-menu-items.tsx
index 28f4a47c9b..571156a0a4 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-menu-items.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-menu-items.tsx
@@ -25,14 +25,15 @@ function FileTreeItemMenuItems() {
     selectedFileName,
   } = useFileTreeActionable()
 
-  const { owner } = useProjectContext()
+  const { project } = useProjectContext()
+  const projectOwner = project?.owner?._id
 
   const downloadWithAnalytics = useCallback(() => {
     // we are only interested in downloads of bib files WRT analytics, for the purposes of promoting the tpr integrations
     if (selectedFileName?.endsWith('.bib')) {
-      eventTracking.sendMB('download-bib-file', { projectOwner: owner._id })
+      eventTracking.sendMB('download-bib-file', { projectOwner })
     }
-  }, [selectedFileName, owner])
+  }, [selectedFileName, projectOwner])
 
   const createWithAnalytics = useCallback(() => {
     eventTracking.sendMB('new-file-click', { location: 'file-menu' })
diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-root.tsx b/services/web/frontend/js/features/file-tree/components/file-tree-root.tsx
index 561e1b5e1d..17ca5bf504 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-root.tsx
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-root.tsx
@@ -6,7 +6,7 @@ import FileTreeContext from './file-tree-context'
 import FileTreeDraggablePreviewLayer from './file-tree-draggable-preview-layer'
 import FileTreeFolderList from './file-tree-folder-list'
 import FileTreeToolbar from './file-tree-toolbar'
-import FileTreeToolbarNew from '@/features/ide-redesign/components/file-tree-toolbar'
+import FileTreeToolbarNew from '@/features/ide-redesign/components/file-tree/file-tree-toolbar'
 import FileTreeModalDelete from './modals/file-tree-modal-delete'
 import FileTreeModalCreateFolder from './modals/file-tree-modal-create-folder'
 import FileTreeModalError from './modals/file-tree-modal-error'
@@ -40,7 +40,7 @@ const FileTreeRoot = React.memo<{
 }) {
   const [fileTreeContainer, setFileTreeContainer] =
     useState<HTMLDivElement | null>(null)
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const { fileTreeData } = useFileTreeData()
   const isReady = Boolean(projectId && fileTreeData)
   const newEditor = useIsNewEditorEnabled()
diff --git a/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.jsx b/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.tsx
similarity index 87%
rename from services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.jsx
rename to services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.tsx
index 850b603229..7342c1f752 100644
--- a/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.jsx
+++ b/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-create-folder.tsx
@@ -1,5 +1,4 @@
-import { useEffect, useState } from 'react'
-import PropTypes from 'prop-types'
+import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useRefWithAutoFocus } from '../../../../shared/hooks/use-ref-with-auto-focus'
 import { useFileTreeActionable } from '../../contexts/file-tree-actionable'
@@ -109,19 +108,25 @@ function InputName({
   validName,
   setValidName,
   handleCreateFolder,
+}: {
+  name: string
+  setName: (name: string) => void
+  validName: boolean
+  setValidName: (validName: boolean) => void
+  handleCreateFolder: () => void
 }) {
-  const { autoFocusedRef } = useRefWithAutoFocus()
+  const { autoFocusedRef } = useRefWithAutoFocus<HTMLInputElement>()
 
-  function handleFocus(ev) {
+  function handleFocus(ev: React.FocusEvent<HTMLInputElement>) {
     ev.target.setSelectionRange(0, -1)
   }
 
-  function handleChange(ev) {
+  function handleChange(ev: React.ChangeEvent<HTMLInputElement>) {
     setValidName(isCleanFilename(ev.target.value.trim()))
     setName(ev.target.value)
   }
 
-  function handleKeyDown(ev) {
+  function handleKeyDown(ev: React.KeyboardEvent<HTMLInputElement>) {
     if (ev.key === 'Enter' && validName) {
       handleCreateFolder()
     }
@@ -140,12 +145,4 @@ function InputName({
   )
 }
 
-InputName.propTypes = {
-  name: PropTypes.string.isRequired,
-  setName: PropTypes.func.isRequired,
-  validName: PropTypes.bool.isRequired,
-  setValidName: PropTypes.func.isRequired,
-  handleCreateFolder: PropTypes.func.isRequired,
-}
-
 export default FileTreeModalCreateFolder
diff --git a/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-delete.jsx b/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-delete.jsx
index ba80a9ffee..1d99d47c6a 100644
--- a/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-delete.jsx
+++ b/services/web/frontend/js/features/file-tree/components/modals/file-tree-modal-delete.jsx
@@ -9,6 +9,7 @@ import OLModal, {
 } from '@/features/ui/components/ol/ol-modal'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
+import { useFileTreeSelectable } from '../../contexts/file-tree-selectable'
 
 function FileTreeModalDelete() {
   const { t } = useTranslation()
@@ -22,6 +23,8 @@ function FileTreeModalDelete() {
     error,
   } = useFileTreeActionable()
 
+  const { select } = useFileTreeSelectable()
+
   if (!isDeleting) return null // the modal will not be rendered; return early
 
   function handleHide() {
@@ -29,6 +32,7 @@ function FileTreeModalDelete() {
   }
 
   function handleDelete() {
+    select([])
     finishDeleting()
   }
 
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.tsx
index 6223c49054..1c144bcf80 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-actionable.tsx
@@ -57,6 +57,7 @@ const FileTreeActionableContext = createContext<
       newFileCreateMode: any | null
       error: any | null
       canDelete: boolean
+      canBulkDelete: boolean
       canRename: boolean
       canCreate: boolean
       parentFolderId: string
@@ -218,8 +219,10 @@ function fileTreeActionableReducer(state: State, action: Action) {
   }
 }
 
-export const FileTreeActionableProvider: FC = ({ children }) => {
-  const { _id: projectId } = useProjectContext()
+export const FileTreeActionableProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const { projectId } = useProjectContext()
   const { fileTreeReadOnly } = useFileTreeData()
   const { indexAllReferences } = useReferencesContext()
   const { write } = usePermissionsContext()
@@ -400,7 +403,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   }, [fileTreeData, selectedEntityIds])
 
   const finishCreatingEntity = useCallback(
-    entity => {
+    (entity: any) => {
       const error = validateCreate(fileTreeData, parentFolderId, entity)
       if (error) {
         return Promise.reject(error)
@@ -412,7 +415,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   )
 
   const finishCreatingFolder = useCallback(
-    name => {
+    (name: any) => {
       dispatch({ type: ACTION_TYPES.CREATING_FOLDER })
       return finishCreatingEntity({ endpoint: 'folder', name })
         .then(() => {
@@ -425,7 +428,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
     [finishCreatingEntity]
   )
 
-  const startCreatingFile = useCallback(newFileCreateMode => {
+  const startCreatingFile = useCallback((newFileCreateMode: any) => {
     dispatch({ type: ACTION_TYPES.START_CREATE_FILE, newFileCreateMode })
   }, [])
 
@@ -438,7 +441,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   }, [startCreatingFile])
 
   const finishCreatingDocOrFile = useCallback(
-    entity => {
+    (entity: any) => {
       dispatch({ type: ACTION_TYPES.CREATING_FILE })
 
       return finishCreatingEntity(entity)
@@ -453,7 +456,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   )
 
   const finishCreatingDoc = useCallback(
-    entity => {
+    (entity: any) => {
       entity.endpoint = 'doc'
       return finishCreatingDocOrFile(entity)
     },
@@ -461,7 +464,7 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   )
 
   const finishCreatingLinkedFile = useCallback(
-    entity => {
+    (entity: any) => {
       entity.endpoint = 'linked_file'
       return finishCreatingDocOrFile(entity)
     },
@@ -507,6 +510,8 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
   const value = useMemo(
     () => ({
       canDelete: write && selectedEntityIds.size > 0 && !isRootFolderSelected,
+      canBulkDelete:
+        write && selectedEntityIds.size > 1 && !isRootFolderSelected,
       canRename: write && selectedEntityIds.size === 1 && !isRootFolderSelected,
       canCreate: write && selectedEntityIds.size < 2,
       ...state,
@@ -543,8 +548,8 @@ export const FileTreeActionableProvider: FC = ({ children }) => {
       isDuplicate,
       isRootFolderSelected,
       parentFolderId,
-      selectedEntityIds.size,
       selectedFileName,
+      selectedEntityIds.size,
       startCreatingDocOrFile,
       startCreatingFile,
       startCreatingFolder,
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-create-form.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-create-form.tsx
index 93315ec836..8d9e0b596e 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-create-form.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-create-form.tsx
@@ -16,7 +16,9 @@ export const useFileTreeCreateForm = () => {
   return context
 }
 
-const FileTreeCreateFormProvider: FC = ({ children }) => {
+const FileTreeCreateFormProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   // is the form valid
   const [valid, setValid] = useState(false)
 
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-create-name.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-create-name.tsx
index ed9a8f4a38..59b2dc6fcc 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-create-name.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-create-name.tsx
@@ -28,10 +28,9 @@ type State = {
   touchedName: boolean
 }
 
-const FileTreeCreateNameProvider: FC<{ initialName?: string }> = ({
-  children,
-  initialName = '',
-}) => {
+const FileTreeCreateNameProvider: FC<
+  React.PropsWithChildren<{ initialName?: string }>
+> = ({ children, initialName = '' }) => {
   const [state, setName] = useReducer(
     (state: State, name: string) => ({
       name, // the file name
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.tsx
index c255c25231..e6f8cac3f8 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-draggable.tsx
@@ -18,9 +18,11 @@ import { isAcceptableFile } from '@/features/file-tree/util/is-acceptable-file'
 import { FileTreeFindResult } from '@/features/ide-react/types/file-tree'
 
 const DRAGGABLE_TYPE = 'ENTITY'
-export const FileTreeDraggableProvider: FC<{
-  fileTreeContainer?: HTMLDivElement
-}> = ({ fileTreeContainer, children }) => {
+export const FileTreeDraggableProvider: FC<
+  React.PropsWithChildren<{
+    fileTreeContainer?: HTMLDivElement
+  }>
+> = ({ fileTreeContainer, children }) => {
   const options = useMemo(
     () => ({ rootElement: fileTreeContainer }),
     [fileTreeContainer]
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-main.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-main.tsx
index 85872fe129..d8cceb31c3 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-main.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-main.tsx
@@ -25,11 +25,13 @@ export function useFileTreeMainContext() {
   return context
 }
 
-export const FileTreeMainProvider: FC<{
-  refProviders: object
-  setRefProviderEnabled: (provider: string, value: boolean) => void
-  setStartedFreeTrial: (value: boolean) => void
-}> = ({
+export const FileTreeMainProvider: FC<
+  React.PropsWithChildren<{
+    refProviders: object
+    setRefProviderEnabled: (provider: string, value: boolean) => void
+    setStartedFreeTrial: (value: boolean) => void
+  }>
+> = ({
   refProviders,
   setRefProviderEnabled,
   setStartedFreeTrial,
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-path.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-path.tsx
index 593d51c6e1..e0b860be87 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-path.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-path.tsx
@@ -22,7 +22,9 @@ export const FileTreePathContext = createContext<
   FileTreePathContextValue | undefined
 >(undefined)
 
-export const FileTreePathProvider: FC = ({ children }) => {
+export const FileTreePathProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { fileTreeData }: { fileTreeData: Folder } = useFileTreeData()
   const projectId = getMeta('ol-project_id')
 
diff --git a/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.tsx b/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.tsx
index f52fe385e5..9e0bfc71df 100644
--- a/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.tsx
+++ b/services/web/frontend/js/features/file-tree/contexts/file-tree-selectable.tsx
@@ -1,3 +1,6 @@
+// TODO: The types in this file have mismatches between string and string[] and
+// it's not immediately clear how to resolve it. I've therefore left in a bunch
+// of `any` types. We should fix this.
 import {
   createContext,
   useCallback,
@@ -120,10 +123,13 @@ function fileTreeSelectableReadOnlyReducer(
   }
 }
 
-export const FileTreeSelectableProvider: FC<{
-  onSelect: (value: FindResult[]) => void
-}> = ({ onSelect, children }) => {
-  const { _id: projectId, rootDocId } = useProjectContext()
+export const FileTreeSelectableProvider: FC<
+  React.PropsWithChildren<{
+    onSelect: (value: FindResult[]) => void
+  }>
+> = ({ onSelect, children }) => {
+  const { projectId, project } = useProjectContext()
+  const rootDocId = project?.rootDocId
 
   const [initialSelectedEntityId] = usePersistedState(
     `doc.open_id.${projectId}`,
@@ -206,21 +212,24 @@ export const FileTreeSelectableProvider: FC<{
     )
   )
 
-  const select = useCallback(id => {
+  const select = useCallback((id: any) => {
     dispatch({ type: ACTION_TYPES.SELECT, id })
   }, [])
 
-  const unselect = useCallback(id => {
+  const unselect = useCallback((id: any) => {
     dispatch({ type: ACTION_TYPES.UNSELECT, id })
   }, [])
 
-  const selectOrMultiSelectEntity = useCallback((id, isMultiSelect) => {
-    const actionType = isMultiSelect
-      ? ACTION_TYPES.MULTI_SELECT
-      : ACTION_TYPES.SELECT
+  const selectOrMultiSelectEntity = useCallback(
+    (id: any, isMultiSelect: any) => {
+      const actionType = isMultiSelect
+        ? ACTION_TYPES.MULTI_SELECT
+        : ACTION_TYPES.SELECT
 
-    dispatch({ type: actionType, id })
-  }, [])
+      dispatch({ type: actionType, id })
+    },
+    []
+  )
 
   // TODO: wrap in useMemo
   const value = {
@@ -254,7 +263,7 @@ export function useSelectableEntity(id: string, type: string) {
   const isSelected = selectedEntityIds.has(id)
 
   const buildSelectedRange = useCallback(
-    id => {
+    (id: string) => {
       const selected = []
 
       let started = false
@@ -306,7 +315,7 @@ export function useSelectableEntity(id: string, type: string) {
   }, [fileTreeData, selectedEntityIds, view])
 
   const handleEvent = useCallback(
-    ev => {
+    (ev: any) => {
       ev.stopPropagation()
       // use Command (macOS) or Ctrl (other OS) to select multiple items,
       // as long as the root folder wasn't selected
@@ -342,7 +351,7 @@ export function useSelectableEntity(id: string, type: string) {
   )
 
   const handleClick = useCallback(
-    ev => {
+    (ev: any) => {
       handleEvent(ev)
       if (!ev.ctrlKey && !ev.metaKey) {
         setContextMenuCoords(null)
@@ -352,7 +361,7 @@ export function useSelectableEntity(id: string, type: string) {
   )
 
   const handleKeyPress = useCallback(
-    ev => {
+    (ev: any) => {
       if (ev.key === 'Enter' || ev.key === ' ') {
         handleEvent(ev)
       }
@@ -361,7 +370,7 @@ export function useSelectableEntity(id: string, type: string) {
   )
 
   const handleContextMenu = useCallback(
-    ev => {
+    (ev: any) => {
       // make sure the right-clicked entity gets selected
       if (!selectedEntityIds.has(id)) {
         handleEvent(ev)
diff --git a/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.ts b/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.ts
index b6197ce5a9..a9f15721fc 100644
--- a/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.ts
+++ b/services/web/frontend/js/features/file-tree/hooks/file-tree-socket-listener.ts
@@ -25,7 +25,7 @@ export function useFileTreeSocketListener(onDelete: (entity: any) => void) {
 
   const selectEntityIfCreatedByUser = useCallback(
     // hack to automatically re-open refreshed linked files
-    (entityId, entityName, userId) => {
+    (entityId: any, entityName: any, userId: string) => {
       // If the created entity's user exists and is the current user
       if (userId && user?.id === userId) {
         // And we're expecting a refreshed socket for this entity
diff --git a/services/web/frontend/js/features/file-view/components/file-view-header.tsx b/services/web/frontend/js/features/file-view/components/file-view-header.tsx
index ca228a9304..0c9a218bc8 100644
--- a/services/web/frontend/js/features/file-view/components/file-view-header.tsx
+++ b/services/web/frontend/js/features/file-view/components/file-view-header.tsx
@@ -49,7 +49,7 @@ type FileViewHeaderProps = {
 }
 
 export default function FileViewHeader({ file }: FileViewHeaderProps) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const { fileTreeReadOnly } = useFileTreeData()
   const { t } = useTranslation()
 
diff --git a/services/web/frontend/js/features/file-view/components/file-view-image.tsx b/services/web/frontend/js/features/file-view/components/file-view-image.tsx
index 62a1fd0159..dfa117841d 100644
--- a/services/web/frontend/js/features/file-view/components/file-view-image.tsx
+++ b/services/web/frontend/js/features/file-view/components/file-view-image.tsx
@@ -11,7 +11,7 @@ export default function FileViewImage({
   onLoad: () => void
   onError: () => void
 }) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   return (
     <img
       src={fileUrl(projectId, file.id, file.hash)}
diff --git a/services/web/frontend/js/features/file-view/components/file-view-refresh-button.tsx b/services/web/frontend/js/features/file-view/components/file-view-refresh-button.tsx
index 622e101ae6..eafe369500 100644
--- a/services/web/frontend/js/features/file-view/components/file-view-refresh-button.tsx
+++ b/services/web/frontend/js/features/file-view/components/file-view-refresh-button.tsx
@@ -31,7 +31,7 @@ export default function FileViewRefreshButton({
   setRefreshError,
   file,
 }: FileViewRefreshButtonProps) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const [refreshing, setRefreshing] = useState(false)
   const isMountedRef = useIsMounted()
 
diff --git a/services/web/frontend/js/features/file-view/components/file-view-text.tsx b/services/web/frontend/js/features/file-view/components/file-view-text.tsx
index a94e7ec6c5..1b1d575300 100644
--- a/services/web/frontend/js/features/file-view/components/file-view-text.tsx
+++ b/services/web/frontend/js/features/file-view/components/file-view-text.tsx
@@ -16,7 +16,7 @@ export default function FileViewText({
   onLoad: () => void
   onError: () => void
 }) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   const [textPreview, setTextPreview] = useState('')
   const [shouldShowDots, setShouldShowDots] = useState(false)
diff --git a/services/web/frontend/js/features/form-helpers/hydrate-form.js b/services/web/frontend/js/features/form-helpers/hydrate-form.js
index 9c00dd43ae..3d546203fc 100644
--- a/services/web/frontend/js/features/form-helpers/hydrate-form.js
+++ b/services/web/frontend/js/features/form-helpers/hydrate-form.js
@@ -3,6 +3,8 @@ import { FetchError, postJSON } from '../../infrastructure/fetch-json'
 import { canSkipCaptcha, validateCaptchaV2 } from './captcha'
 import inputValidator from './input-validator'
 import { disableElement, enableElement } from '../utils/disableElement'
+import { isBootstrap5 } from '@/features/utils/bootstrap-5'
+import { materialIcon } from '@/features/utils/material-icon'
 
 // Form helper(s) to handle:
 // - Attaching to the relevant form elements
@@ -133,6 +135,63 @@ function hideFormElements(formEl) {
   }
 }
 
+/**
+ * Creates a notification element from a message object, with BS5 classes.
+ *
+ * @param {Object} message
+ * @param {'error' | 'success' | 'warning' | 'info'} message.type
+ * @param {string} message.key
+ * @param {string} message.text
+ * @param {string[]} message.hints
+ * @returns {HTMLDivElement}
+ */
+function createNotificationFromMessageBS5(message) {
+  const messageEl = document.createElement('div')
+  messageEl.className = classNames('mb-3 notification', {
+    'notification-type-error': message.type === 'error',
+    'notification-type-success': message.type === 'success',
+    'notification-type-warning': message.type === 'warning',
+    'notification-type-info': message.type === 'info',
+  })
+  messageEl.setAttribute('aria-live', 'assertive')
+  messageEl.setAttribute('role', message.type === 'error' ? 'alert' : 'status')
+
+  const materialIcon = {
+    info: 'info',
+    success: 'check_circle',
+    error: 'error',
+    warning: 'warning',
+  }[message.type]
+  if (materialIcon) {
+    const iconEl = document.createElement('div')
+    iconEl.className = 'notification-icon'
+    const iconSpan = materialIcon(materialIcon)
+    iconEl.append(iconSpan)
+    messageEl.append(iconEl)
+  }
+
+  const contentAndCtaEl = document.createElement('div')
+  contentAndCtaEl.className = 'notification-content-and-cta'
+
+  const contentEl = document.createElement('div')
+  contentEl.className = 'notification-content'
+  contentEl.append(message.text || `Error: ${message.key}`)
+
+  if (message.hints && message.hints.length) {
+    const listEl = document.createElement('ul')
+    message.hints.forEach(hint => {
+      const listItemEl = document.createElement('li')
+      listItemEl.textContent = hint
+      listEl.append(listItemEl)
+    })
+    contentEl.append(listEl)
+  }
+  contentAndCtaEl.append(contentEl)
+  messageEl.append(contentAndCtaEl)
+
+  return messageEl
+}
+
 // TODO: remove the showMessages function after every form alerts are updated to use the new style
 // TODO: rename showMessagesNewStyle to showMessages after the above is done
 function showMessages(formEl, messageBag) {
@@ -157,6 +216,9 @@ function showMessages(formEl, messageBag) {
       customErrorElements.forEach(el => {
         el.hidden = false
       })
+    } else if (isBootstrap5()) {
+      const notification = createNotificationFromMessageBS5(message)
+      messagesEl.append(notification)
     } else {
       // No custom error element for key on page, append a new error message
       const messageEl = document.createElement('div')
@@ -251,10 +313,9 @@ function showMessagesNewStyle(formEl, messageBag) {
       }
 
       // create the left icon
-      const icon = document.createElement('span')
-      icon.className = 'material-symbols'
-      icon.setAttribute('aria-hidden', 'true')
-      icon.innerText = message.type === 'error' ? 'error' : 'check_circle'
+      const icon = materialIcon(
+        message.type === 'error' ? 'error' : 'check_circle'
+      )
       const messageIcon = document.createElement('div')
       messageIcon.className = 'notification-icon'
       messageIcon.appendChild(icon)
@@ -311,7 +372,7 @@ function formSentHelper(el) {
 }
 
 function formValidationHelper(el) {
-  el.querySelectorAll('input').forEach(inputEl => {
+  el.querySelectorAll('input, textarea').forEach(inputEl => {
     if (
       inputEl.willValidate &&
       !inputEl.hasAttribute('data-ol-no-custom-form-validation-messages')
diff --git a/services/web/frontend/js/features/form-helpers/input-validator.js b/services/web/frontend/js/features/form-helpers/input-validator.js
index 411c6c0e83..25038b6a1a 100644
--- a/services/web/frontend/js/features/form-helpers/input-validator.js
+++ b/services/web/frontend/js/features/form-helpers/input-validator.js
@@ -1,9 +1,25 @@
+import { isBootstrap5 } from '@/features/utils/bootstrap-5'
+import { materialIcon } from '@/features/utils/material-icon'
+
 export default function inputValidator(inputEl) {
   const messageEl = document.createElement('div')
   messageEl.className =
     inputEl.getAttribute('data-ol-validation-message-classes') ||
-    'small text-danger mt-2'
+    'small text-danger mt-2 form-text'
   messageEl.hidden = true
+
+  const messageInnerEl = messageEl.appendChild(document.createElement('span'))
+  messageInnerEl.className = 'form-text-inner'
+
+  const messageTextNode = document.createTextNode('')
+
+  // In Bootstrap 5, add an icon
+  if (isBootstrap5()) {
+    const iconEl = materialIcon('error')
+    messageInnerEl.append(iconEl)
+  }
+  messageInnerEl.append(messageTextNode)
+
   inputEl.insertAdjacentElement('afterend', messageEl)
 
   // Hide messages until the user leaves the input field or submits the form.
@@ -54,7 +70,7 @@ export default function inputValidator(inputEl) {
       // Require another blur before displaying errors again.
       canDisplayErrorMessages = false
     } else {
-      messageEl.textContent = inputEl.validationMessage
+      messageTextNode.data = inputEl.validationMessage
       messageEl.hidden = false
     }
   }
diff --git a/services/web/frontend/js/features/group-management/components/add-seats/add-seats.tsx b/services/web/frontend/js/features/group-management/components/add-seats/add-seats.tsx
index 7163fd2cee..f598ee9ddc 100644
--- a/services/web/frontend/js/features/group-management/components/add-seats/add-seats.tsx
+++ b/services/web/frontend/js/features/group-management/components/add-seats/add-seats.tsx
@@ -13,9 +13,10 @@ import {
   FormGroup,
   FormLabel,
   FormControl,
-} from 'react-bootstrap-5'
+} from 'react-bootstrap'
 import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
 import Button from '@/features/ui/components/bootstrap-5/button'
+import PoNumber from '@/features/group-management/components/add-seats/po-number'
 import CostSummary from '@/features/group-management/components/add-seats/cost-summary'
 import RequestStatus from '@/features/group-management/components/request-status'
 import useAsync from '@/shared/hooks/use-async'
@@ -29,8 +30,10 @@ import {
 } from '../../../../../../types/subscription/subscription-change-preview'
 import { MergeAndOverride, Nullable } from '../../../../../../types/utils'
 import { sendMB } from '../../../../infrastructure/event-tracking'
+import handleStripePaymentAction from '@/features/subscription/util/handle-stripe-payment-action'
 
 export const MAX_NUMBER_OF_USERS = 20
+export const MAX_NUMBER_OF_PO_NUMBER_CHARACTERS = 50
 
 type CostSummaryData = MergeAndOverride<
   SubscriptionChangePreview,
@@ -41,9 +44,11 @@ function AddSeats() {
   const { t } = useTranslation()
   const groupName = getMeta('ol-groupName')
   const subscriptionId = getMeta('ol-subscriptionId')
-  const totalLicenses = Number(getMeta('ol-totalLicenses'))
+  const totalLicenses = getMeta('ol-totalLicenses')
   const isProfessional = getMeta('ol-isProfessional')
+  const isCollectionMethodManual = getMeta('ol-isCollectionMethodManual')
   const [addSeatsInputError, setAddSeatsInputError] = useState<string>()
+  const [poNumberInputError, setPoNumberInputError] = useState<string>()
   const [shouldContactSales, setShouldContactSales] = useState(false)
   const controller = useAbortController()
   const { signal: addSeatsSignal } = useAbortController()
@@ -56,13 +61,12 @@ function AddSeats() {
     reset: resetCostSummaryData,
     error: errorCostSummary,
   } = useAsync<CostSummaryData, FetchError>()
-  const {
-    isLoading: isAddingSeats,
-    isError: isErrorAddingSeats,
-    isSuccess: isSuccessAddingSeats,
-    runAsync: runAsyncAddSeats,
-    data: addedSeatsData,
-  } = useAsync<{ adding: number }>()
+  const [isAddingSeats, setIsAddingSeats] = useState(false)
+  const [isErrorAddingSeats, setIsErrorAddingSeats] = useState(false)
+  const [isSuccessAddingSeats, setIsSuccessAddingSeats] = useState(false)
+  const [addedSeatsData, setAddedSeatsData] = useState<{
+    adding: number
+  } | null>(null)
   const {
     isLoading: isSendingMailToSales,
     isError: isErrorSendingMailToSales,
@@ -119,6 +123,38 @@ function AddSeats() {
     }
   }
 
+  const poNumberValidationSchema = useMemo(() => {
+    return yup
+      .string()
+      .matches(
+        /^[\p{L}\p{N}]*$/u,
+        t('po_number_can_include_digits_and_letters_only')
+      )
+      .max(
+        MAX_NUMBER_OF_PO_NUMBER_CHARACTERS,
+        t('po_number_must_not_exceed_x_characters', {
+          count: MAX_NUMBER_OF_PO_NUMBER_CHARACTERS,
+        })
+      )
+  }, [t])
+
+  const validatePoNumber = async (value: string | undefined) => {
+    try {
+      await poNumberValidationSchema.validate(value)
+      setPoNumberInputError(undefined)
+
+      return true
+    } catch (error) {
+      if (error instanceof yup.ValidationError) {
+        setPoNumberInputError(error.errors[0])
+      } else {
+        debugConsole.error(error)
+      }
+
+      return false
+    }
+  }
+
   const handleSeatsChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
     const value = e.target.value === '' ? undefined : e.target.value
     const isValidSeatsNumber = await validateSeats(value)
@@ -151,8 +187,14 @@ function AddSeats() {
       formData.get('seats') === ''
         ? undefined
         : (formData.get('seats') as string)
+    const poNumber = !formData.get('po_number')
+      ? undefined
+      : (formData.get('po_number') as string)
 
-    if (!(await validateSeats(rawSeats))) {
+    if (
+      !(await validateSeats(rawSeats)) ||
+      !(await validatePoNumber(poNumber))
+    ) {
       return
     }
 
@@ -166,6 +208,7 @@ function AddSeats() {
           signal: contactSalesSignal,
           body: {
             adding: rawSeats,
+            poNumber,
           },
         }
       )
@@ -174,18 +217,34 @@ function AddSeats() {
       sendMB('flex-add-users-form', {
         action: 'click-add-user-button',
       })
-      const post = postJSON('/user/subscription/group/add-users/create', {
-        signal: addSeatsSignal,
-        body: { adding: Number(rawSeats) },
-      })
-      runAsyncAddSeats(post)
-        .then(() => {
+      setIsAddingSeats(true)
+      try {
+        const response = await postJSON<{
+          adding: number
+        }>('/user/subscription/group/add-users/create', {
+          signal: addSeatsSignal,
+          body: {
+            adding: Number(rawSeats),
+            poNumber,
+          },
+        })
+        sendMB('flex-add-users-success')
+        setIsSuccessAddingSeats(true)
+        setAddedSeatsData(response)
+      } catch (error) {
+        const { handled } = await handleStripePaymentAction(error as FetchError)
+        if (handled) {
           sendMB('flex-add-users-success')
-        })
-        .catch(() => {
-          debugConsole.error()
-          sendMB('flex-add-users-error')
-        })
+          setIsSuccessAddingSeats(true)
+          setAddedSeatsData({ adding: Number(rawSeats) })
+          return
+        }
+        debugConsole.error(error)
+        sendMB('flex-add-users-error')
+        setIsErrorAddingSeats(true)
+      } finally {
+        setIsAddingSeats(false)
+      }
     }
   }
 
@@ -323,6 +382,12 @@ function AddSeats() {
                       <FormText type="error">{addSeatsInputError}</FormText>
                     )}
                   </FormGroup>
+                  {isCollectionMethodManual && (
+                    <PoNumber
+                      error={poNumberInputError}
+                      validate={validatePoNumber}
+                    />
+                  )}
                 </div>
                 <CostSummarySection
                   isLoadingCostSummary={isLoadingCostSummary}
diff --git a/services/web/frontend/js/features/group-management/components/add-seats/cost-summary.tsx b/services/web/frontend/js/features/group-management/components/add-seats/cost-summary.tsx
index 8571813c76..21e19ce257 100644
--- a/services/web/frontend/js/features/group-management/components/add-seats/cost-summary.tsx
+++ b/services/web/frontend/js/features/group-management/components/add-seats/cost-summary.tsx
@@ -1,5 +1,5 @@
 import { Trans, useTranslation } from 'react-i18next'
-import { Card, ListGroup } from 'react-bootstrap-5'
+import { Card, ListGroup } from 'react-bootstrap'
 import { formatCurrency } from '@/shared/utils/currency'
 import { formatTime } from '@/features/utils/format-date'
 import {
@@ -7,6 +7,7 @@ import {
   SubscriptionChangePreview,
 } from '../../../../../../types/subscription/subscription-change-preview'
 import { MergeAndOverride } from '../../../../../../types/utils'
+import getMeta from '@/utils/meta'
 
 type CostSummaryProps = {
   subscriptionChange: MergeAndOverride<
@@ -18,6 +19,7 @@ type CostSummaryProps = {
 
 function CostSummary({ subscriptionChange, totalLicenses }: CostSummaryProps) {
   const { t } = useTranslation()
+  const isCollectionMethodManual = getMeta('ol-isCollectionMethodManual')
   const factor = 100
 
   return (
@@ -109,7 +111,13 @@ function CostSummary({ subscriptionChange, totalLicenses }: CostSummaryProps) {
                   className="bg-transparent border-0 px-0 gap-3 card-description-secondary"
                   data-testid="total"
                 >
-                  <strong className="me-auto">{t('total_due_today')}</strong>
+                  <strong className="me-auto">
+                    {isCollectionMethodManual
+                      ? t('total_due_in_x_days', {
+                          days: subscriptionChange.netTerms,
+                        })
+                      : t('total_due_today')}
+                  </strong>
                   <strong data-testid="price">
                     {formatCurrency(
                       subscriptionChange.immediateCharge.total,
@@ -121,9 +129,14 @@ function CostSummary({ subscriptionChange, totalLicenses }: CostSummaryProps) {
               <hr className="m-0" />
             </div>
             <div>
-              {t(
-                'we_will_charge_you_now_for_the_cost_of_your_additional_licenses_based_on_remaining_months'
-              )}
+              {isCollectionMethodManual
+                ? t(
+                    'we_will_invoice_you_now_for_the_additional_licenses_based_on_remaining_months',
+                    { days: subscriptionChange.netTerms }
+                  )
+                : t(
+                    'we_will_charge_you_now_for_the_cost_of_your_additional_licenses_based_on_remaining_months'
+                  )}
             </div>
             <div>
               {t(
@@ -143,7 +156,8 @@ function CostSummary({ subscriptionChange, totalLicenses }: CostSummaryProps) {
                   ),
                   date: formatTime(
                     subscriptionChange.nextInvoice.date,
-                    'MMMM D'
+                    'MMMM D',
+                    true
                   ),
                 }
               )}
diff --git a/services/web/frontend/js/features/group-management/components/add-seats/po-number.tsx b/services/web/frontend/js/features/group-management/components/add-seats/po-number.tsx
new file mode 100644
index 0000000000..c6257553d6
--- /dev/null
+++ b/services/web/frontend/js/features/group-management/components/add-seats/po-number.tsx
@@ -0,0 +1,44 @@
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { FormControl, FormGroup, FormLabel } from 'react-bootstrap'
+import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
+import OLFormCheckbox from '@/features/ui/components/ol/ol-form-checkbox'
+
+type PoNumberProps = {
+  error: string | undefined
+  validate: (value: string | undefined) => Promise<boolean>
+}
+
+function PoNumber({ error, validate }: PoNumberProps) {
+  const { t } = useTranslation()
+  const [isPoNumberChecked, setIsPoNumberChecked] = useState(false)
+
+  return (
+    <>
+      <FormGroup className="mt-3">
+        <OLFormCheckbox
+          label={t('i_want_to_add_a_po_number')}
+          id="po-number-checkbox"
+          checked={isPoNumberChecked}
+          onChange={e => setIsPoNumberChecked(e.target.checked)}
+        />
+      </FormGroup>
+      {isPoNumberChecked && (
+        <FormGroup className="mt-2" controlId="po-number">
+          <FormLabel>{t('po_number')}</FormLabel>
+          <FormControl
+            type="text"
+            required
+            className="w-25"
+            name="po_number"
+            onChange={async e => await validate(e.target.value)}
+            isInvalid={Boolean(error)}
+          />
+          {Boolean(error) && <FormText type="error">{error}</FormText>}
+        </FormGroup>
+      )}
+    </>
+  )
+}
+
+export default PoNumber
diff --git a/services/web/frontend/js/features/group-management/components/add-seats/root.tsx b/services/web/frontend/js/features/group-management/components/add-seats/root.tsx
index e6d9ae4700..af6d74928d 100644
--- a/services/web/frontend/js/features/group-management/components/add-seats/root.tsx
+++ b/services/web/frontend/js/features/group-management/components/add-seats/root.tsx
@@ -1,5 +1,6 @@
 import useWaitForI18n from '../../../../shared/hooks/use-wait-for-i18n'
 import AddSeats from '@/features/group-management/components/add-seats/add-seats'
+import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 function Root() {
   const { isReady } = useWaitForI18n()
@@ -8,7 +9,11 @@ function Root() {
     return null
   }
 
-  return <AddSeats />
+  return (
+    <SplitTestProvider>
+      <AddSeats />
+    </SplitTestProvider>
+  )
 }
 
 export default Root
diff --git a/services/web/frontend/js/features/group-management/components/card.tsx b/services/web/frontend/js/features/group-management/components/card.tsx
index 04b858ba7a..ff51231f5a 100644
--- a/services/web/frontend/js/features/group-management/components/card.tsx
+++ b/services/web/frontend/js/features/group-management/components/card.tsx
@@ -1,7 +1,7 @@
 import { useTranslation } from 'react-i18next'
 import getMeta from '@/utils/meta'
 import useWaitForI18n from '@/shared/hooks/use-wait-for-i18n'
-import { Card as BSCard, CardBody, Col, Row } from 'react-bootstrap-5'
+import { Card as BSCard, CardBody, Col, Row } from 'react-bootstrap'
 import IconButton from '@/features/ui/components/bootstrap-5/icon-button'
 
 type CardProps = {
diff --git a/services/web/frontend/js/features/group-management/components/group-members.tsx b/services/web/frontend/js/features/group-management/components/group-members.tsx
index 366c1b7640..4e94645c94 100644
--- a/services/web/frontend/js/features/group-management/components/group-members.tsx
+++ b/services/web/frontend/js/features/group-management/components/group-members.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useState } from 'react'
+import React, { ChangeEvent, useCallback, useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import useWaitForI18n from '../../../shared/hooks/use-wait-for-i18n'
 import getMeta from '../../../utils/meta'
@@ -13,6 +13,7 @@ import OLCard from '@/features/ui/components/ol/ol-card'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 import OLFormText from '@/features/ui/components/ol/ol-form-text'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
 
 export default function GroupMembers() {
   const { isReady } = useWaitForI18n()
@@ -26,6 +27,7 @@ export default function GroupMembers() {
     removeMemberError,
     inviteMemberLoading,
     inviteError,
+    memberAdded,
     paths,
   } = useGroupMembersContext()
   const [emailString, setEmailString] = useState<string>('')
@@ -37,7 +39,7 @@ export default function GroupMembers() {
   const canUseAddSeatsFeature = getMeta('ol-canUseAddSeatsFeature')
 
   const handleEmailsChange = useCallback(
-    e => {
+    (e: ChangeEvent<HTMLInputElement>) => {
       setEmailString(e.target.value)
     },
     [setEmailString]
@@ -111,7 +113,7 @@ export default function GroupMembers() {
               className="page-header mb-4"
               data-testid="page-header-members-details"
             >
-              <div className="pull-right">
+              <div className="float-end">
                 {selectedUsers.length === 0 && groupSizeDetails()}
                 {removeMemberLoading ? (
                   <OLButton variant="danger" disabled>
@@ -140,6 +142,13 @@ export default function GroupMembers() {
                 data-testid="add-more-members-form"
               >
                 <p className="small">{t('invite_more_members')}</p>
+                {memberAdded && (
+                  <OLNotification
+                    content={t('members_added')}
+                    type="success"
+                    className="mt-2 mb-3"
+                  />
+                )}
                 <ErrorAlert error={inviteError} />
                 <form onSubmit={onAddMembersSubmit}>
                   <OLRow>
@@ -157,6 +166,7 @@ export default function GroupMembers() {
                         variant="primary"
                         onClick={onAddMembersSubmit}
                         isLoading={inviteMemberLoading}
+                        loadingLabel={t('inviting')}
                       >
                         {t('invite')}
                       </OLButton>
diff --git a/services/web/frontend/js/features/group-management/components/managers-table.tsx b/services/web/frontend/js/features/group-management/components/managers-table.tsx
index 5efe2ffbb9..d91b4acc67 100644
--- a/services/web/frontend/js/features/group-management/components/managers-table.tsx
+++ b/services/web/frontend/js/features/group-management/components/managers-table.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useState } from 'react'
+import { ChangeEvent, FormEvent, useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { deleteJSON, FetchError, postJSON } from '@/infrastructure/fetch-json'
 import getMeta from '../../../utils/meta'
@@ -58,7 +58,7 @@ export function ManagersTable({
   const [removeMemberError, setRemoveMemberError] = useState<APIError>()
 
   const addManagers = useCallback(
-    e => {
+    (e: FormEvent | React.MouseEvent) => {
       e.preventDefault()
       setInviteError(undefined)
       const emails = parseEmails(emailString)
@@ -92,7 +92,7 @@ export function ManagersTable({
   )
 
   const removeManagers = useCallback(
-    e => {
+    (e: React.MouseEvent) => {
       e.preventDefault()
       setRemoveMemberError(undefined)
       ;(async () => {
@@ -131,7 +131,7 @@ export function ManagersTable({
   )
 
   const handleEmailsChange = useCallback(
-    e => {
+    (e: ChangeEvent<HTMLInputElement>) => {
       setEmailString(e.target.value)
     },
     [setEmailString]
@@ -153,7 +153,7 @@ export function ManagersTable({
               className="page-header mb-4"
               data-testid="page-header-members-details"
             >
-              <div className="pull-right">
+              <div className="float-end">
                 {removeMemberInflightCount > 0 ? (
                   <OLButton variant="danger" disabled>
                     {t('removing')}&hellip;
diff --git a/services/web/frontend/js/features/group-management/components/manually-collected-subscription.tsx b/services/web/frontend/js/features/group-management/components/manually-collected-subscription.tsx
index 2b2c111716..b2f2580b5f 100644
--- a/services/web/frontend/js/features/group-management/components/manually-collected-subscription.tsx
+++ b/services/web/frontend/js/features/group-management/components/manually-collected-subscription.tsx
@@ -1,9 +1,15 @@
 import { Trans, useTranslation } from 'react-i18next'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 import Card from '@/features/group-management/components/card'
+import useWaitForI18n from '@/shared/hooks/use-wait-for-i18n'
 
 function ManuallyCollectedSubscription() {
   const { t } = useTranslation()
+  const { isReady } = useWaitForI18n()
+
+  if (!isReady) {
+    return null
+  }
 
   return (
     <Card>
@@ -12,7 +18,7 @@ function ManuallyCollectedSubscription() {
         title={t('account_billed_manually')}
         content={
           <Trans
-            i18nKey="it_looks_like_your_account_is_billed_manually"
+            i18nKey="it_looks_like_your_account_is_billed_manually_purchasing_additional_license_or_upgrading_subscription"
             components={[
               // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
               <a href="/contact" rel="noreferrer noopener" />,
diff --git a/services/web/frontend/js/features/group-management/components/members-table/dropdown-button.tsx b/services/web/frontend/js/features/group-management/components/members-table/dropdown-button.tsx
index 691a4b3636..9e7038363a 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/dropdown-button.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/dropdown-button.tsx
@@ -19,7 +19,8 @@ import { useGroupMembersContext } from '../../context/group-members-context'
 import getMeta from '@/utils/meta'
 import MaterialIcon from '@/shared/components/material-icon'
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
+import { sendMB } from '@/infrastructure/event-tracking'
 
 type resendInviteResponse = {
   success: boolean
@@ -28,6 +29,7 @@ type resendInviteResponse = {
 type ManagedUserDropdownButtonProps = {
   user: User
   openOffboardingModalForUser: (user: User) => void
+  openRemoveModalForUser: (user: User) => void
   openUnlinkUserModal: (user: User) => void
   groupId: string
   setGroupUserAlert: Dispatch<SetStateAction<GroupUserAlert>>
@@ -36,6 +38,7 @@ type ManagedUserDropdownButtonProps = {
 export default function DropdownButton({
   user,
   openOffboardingModalForUser,
+  openRemoveModalForUser,
   openUnlinkUserModal,
   groupId,
   setGroupUserAlert,
@@ -57,14 +60,15 @@ export default function DropdownButton({
 
   const managedUsersActive = getMeta('ol-managedUsersActive')
   const groupSSOActive = getMeta('ol-groupSSOActive')
-
+  const userId = getMeta('ol-user_id')
+  const isUserGroupManager = getMeta('ol-isUserGroupManager')
   const userPending = user.invite
   const isGroupSSOLinked =
     !userPending && user.enrollment?.sso?.some(sso => sso.groupId === groupId)
   const isUserManaged = !userPending && user.enrollment?.managedBy === groupId
 
   const handleResendManagedUserInvite = useCallback(
-    async user => {
+    async (user: User) => {
       try {
         const result = await runResendManagedUserInviteAsync(
           postJSON(
@@ -96,7 +100,7 @@ export default function DropdownButton({
   )
 
   const handleResendLinkSSOInviteAsync = useCallback(
-    async user => {
+    async (user: User) => {
       try {
         const result = await runResendLinkSSOInviteAsync(
           postJSON(`/manage/groups/${groupId}/resendSSOLinkInvite/${user._id}`)
@@ -126,7 +130,7 @@ export default function DropdownButton({
   )
 
   const handleResendGroupInvite = useCallback(
-    async user => {
+    async (user: User) => {
       try {
         await runResendGroupInviteAsync(
           postJSON(`/manage/groups/${groupId}/resendInvite/`, {
@@ -169,9 +173,15 @@ export default function DropdownButton({
   }
 
   const onDeleteUserClick = () => {
+    sendMB('delete-managed-user-selected')
     openOffboardingModalForUser(user)
   }
 
+  const onReleaseUserClick = () => {
+    sendMB('remove-managed-user-selected')
+    openRemoveModalForUser(user)
+  }
+
   const onRemoveFromGroup = () => {
     removeMember(user)
   }
@@ -229,10 +239,13 @@ export default function DropdownButton({
       </MenuItemButton>
     )
   }
-  if (isUserManaged && !user.isEntityAdmin) {
+  if (
+    isUserManaged &&
+    !user.isEntityAdmin &&
+    (!isUserGroupManager || userId !== user._id)
+  ) {
     buttons.push(
       <MenuItemButton
-        className="delete-user-action"
         key="delete-user-action"
         data-testid="delete-user-action"
         onClick={onDeleteUserClick}
@@ -240,13 +253,21 @@ export default function DropdownButton({
         {t('delete_user')}
       </MenuItemButton>
     )
+    buttons.push(
+      <MenuItemButton
+        key="release-user-action"
+        data-testid="release-user-action"
+        onClick={onReleaseUserClick}
+      >
+        {t('remove_user')}
+      </MenuItemButton>
+    )
   } else if (!isUserManaged) {
     buttons.push(
       <MenuItemButton
         key="remove-user-action"
         data-testid="remove-user-action"
         onClick={onRemoveFromGroup}
-        className="delete-user-action"
         variant="danger"
       >
         {t('remove_from_group')}
@@ -256,7 +277,7 @@ export default function DropdownButton({
 
   if (buttons.length === 0) {
     buttons.push(
-      <DropdownListItem>
+      <DropdownListItem key="no-actions-available">
         <DropdownItem
           as="button"
           tabIndex={-1}
@@ -291,7 +312,6 @@ type MenuItemButtonProps = {
 function MenuItemButton({
   children,
   onClick,
-  className,
   isLoading,
   variant,
   'data-testid': dataTestId,
diff --git a/services/web/frontend/js/features/group-management/components/members-table/managed-user-status.tsx b/services/web/frontend/js/features/group-management/components/members-table/managed-user-status.tsx
index 5ed360de9c..14f4657fe7 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/managed-user-status.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/managed-user-status.tsx
@@ -30,9 +30,6 @@ export default function ManagedUserStatus({ user }: ManagedUserStatusProps) {
     </span>
   )
 
-  if (user.isEntityAdmin) {
-    return <span className="security-state-group-admin" />
-  }
   if (user.invite) {
     return managedUserInvite
   }
diff --git a/services/web/frontend/js/features/group-management/components/members-table/member-row.tsx b/services/web/frontend/js/features/group-management/components/members-table/member-row.tsx
index 2398cbbf9d..d898494959 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/member-row.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/member-row.tsx
@@ -16,6 +16,7 @@ import classnames from 'classnames'
 type ManagedUserRowProps = {
   user: User
   openOffboardingModalForUser: (user: User) => void
+  openRemoveModalForUser: (user: User) => void
   openUnlinkUserModal: (user: User) => void
   groupId: string
   setGroupUserAlert: Dispatch<SetStateAction<GroupUserAlert>>
@@ -24,6 +25,7 @@ type ManagedUserRowProps = {
 export default function MemberRow({
   user,
   openOffboardingModalForUser,
+  openRemoveModalForUser,
   openUnlinkUserModal,
   setGroupUserAlert,
   groupId,
@@ -112,6 +114,7 @@ export default function MemberRow({
         <DropdownButton
           user={user}
           openOffboardingModalForUser={openOffboardingModalForUser}
+          openRemoveModalForUser={openRemoveModalForUser}
           openUnlinkUserModal={openUnlinkUserModal}
           setGroupUserAlert={setGroupUserAlert}
           groupId={groupId}
diff --git a/services/web/frontend/js/features/group-management/components/members-table/members-list.tsx b/services/web/frontend/js/features/group-management/components/members-table/members-list.tsx
index 2fe9339dda..8a46a225bb 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/members-list.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/members-list.tsx
@@ -1,10 +1,11 @@
-import { useState } from 'react'
+import { useState, useRef, useEffect, useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { User } from '../../../../../../types/group-management/user'
 import { useGroupMembersContext } from '../../context/group-members-context'
 import type { GroupUserAlert } from '../../utils/types'
 import MemberRow from './member-row'
 import OffboardManagedUserModal from './offboard-managed-user-modal'
+import RemoveManagedUserModal from '@/features/group-management/components/members-table/remove-managed-user-modal'
 import ListAlert from './list-alert'
 import SelectAllCheckbox from './select-all-checkbox'
 import classNames from 'classnames'
@@ -12,6 +13,9 @@ import getMeta from '@/utils/meta'
 import UnlinkUserModal from './unlink-user-modal'
 import OLTable from '@/features/ui/components/ol/ol-table'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import Pagination from '@/shared/components/pagination'
+
+const USERS_DISPLAY_LIMIT = 50
 
 type ManagedUsersListProps = {
   groupId: string
@@ -22,12 +26,38 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
   const [userToOffboard, setUserToOffboard] = useState<User | undefined>(
     undefined
   )
+  const [userToRemove, setUserToRemove] = useState<User | undefined>(undefined)
   const [groupUserAlert, setGroupUserAlert] =
     useState<GroupUserAlert>(undefined)
   const [userToUnlink, setUserToUnlink] = useState<User | undefined>(undefined)
   const { users } = useGroupMembersContext()
   const managedUsersActive = getMeta('ol-managedUsersActive')
   const groupSSOActive = getMeta('ol-groupSSOActive')
+  const tHeadRowRef = useRef<HTMLTableRowElement>(null)
+  const [pagination, setPagination] = useState({ currPage: 1, totalPages: 1 })
+
+  const usersForCurrentPage = useMemo(
+    () =>
+      users.slice(
+        (pagination.currPage - 1) * USERS_DISPLAY_LIMIT,
+        pagination.currPage * USERS_DISPLAY_LIMIT
+      ),
+    [users, pagination.currPage]
+  )
+
+  const handlePageClick = (
+    _e: React.MouseEvent<HTMLButtonElement>,
+    page: number
+  ) => {
+    setPagination(p => ({ ...p, currPage: page }))
+  }
+
+  useEffect(() => {
+    setPagination(p => ({
+      ...p,
+      totalPages: Math.ceil(users.length / USERS_DISPLAY_LIMIT),
+    }))
+  }, [users.length])
 
   return (
     <div>
@@ -53,7 +83,7 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
         data-testid="managed-entities-table"
       >
         <thead>
-          <tr>
+          <tr ref={tHeadRowRef}>
             <SelectAllCheckbox />
             <th className="cell-email">{t('email')}</th>
             <th className="cell-name">{t('name')}</th>
@@ -83,16 +113,22 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
         <tbody>
           {users.length === 0 && (
             <tr>
-              <td className="text-center" colSpan={5}>
+              <td
+                className="text-center"
+                colSpan={
+                  tHeadRowRef.current?.querySelectorAll('th').length ?? 0
+                }
+              >
                 <small>{t('no_members')}</small>
               </td>
             </tr>
           )}
-          {users.map(user => (
+          {usersForCurrentPage.map(user => (
             <MemberRow
               key={user.email}
               user={user}
               openOffboardingModalForUser={setUserToOffboard}
+              openRemoveModalForUser={setUserToRemove}
               openUnlinkUserModal={setUserToUnlink}
               setGroupUserAlert={setGroupUserAlert}
               groupId={groupId}
@@ -100,6 +136,15 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
           ))}
         </tbody>
       </OLTable>
+      {pagination.totalPages > 1 && (
+        <div className="d-flex justify-content-center">
+          <Pagination
+            handlePageClick={handlePageClick}
+            currentPage={pagination.currPage}
+            totalPages={pagination.totalPages}
+          />
+        </div>
+      )}
       {userToOffboard && (
         <OffboardManagedUserModal
           user={userToOffboard}
@@ -108,6 +153,13 @@ export default function MembersList({ groupId }: ManagedUsersListProps) {
           onClose={() => setUserToOffboard(undefined)}
         />
       )}
+      {userToRemove && (
+        <RemoveManagedUserModal
+          user={userToRemove}
+          groupId={groupId}
+          onClose={() => setUserToRemove(undefined)}
+        />
+      )}
       {userToUnlink && (
         <UnlinkUserModal
           user={userToUnlink}
diff --git a/services/web/frontend/js/features/group-management/components/members-table/offboard-managed-user-modal.tsx b/services/web/frontend/js/features/group-management/components/members-table/offboard-managed-user-modal.tsx
index 4edf771d55..d4709bf6c3 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/offboard-managed-user-modal.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/offboard-managed-user-modal.tsx
@@ -17,6 +17,7 @@ import OLNotification from '@/features/ui/components/ol/ol-notification'
 import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
 import OLFormSelect from '@/features/ui/components/ol/ol-form-select'
+import { sendMB } from '@/infrastructure/event-tracking'
 
 type OffboardManagedUserModalProps = {
   user: User
@@ -48,8 +49,9 @@ export default function OffboardManagedUserModal({
   const shouldEnableDeleteUserButton =
     suppliedEmail === user.email && !!selectedRecipientId
 
-  const handleDeleteUserSubmit = (event: any) => {
+  const handleDeleteUserSubmit = (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault()
+    sendMB('delete-managed-user-confirmed')
     runAsync(
       postJSON(`/manage/groups/${groupId}/offboardManagedUser/${user._id}`, {
         body: {
@@ -101,7 +103,6 @@ export default function OffboardManagedUserModal({
             <OLFormSelect
               aria-label={t('select_user')}
               required
-              placeholder={t('choose_from_group_members')}
               value={selectedRecipientId || ''}
               onChange={e => setSelectedRecipientId(e.target.value)}
             >
@@ -142,6 +143,7 @@ export default function OffboardManagedUserModal({
             type="submit"
             variant="danger"
             disabled={isLoading || isSuccess || !shouldEnableDeleteUserButton}
+            loadingLabel={t('deleting')}
             isLoading={isLoading}
           >
             {t('delete_user')}
diff --git a/services/web/frontend/js/features/group-management/components/members-table/remove-managed-user-modal.tsx b/services/web/frontend/js/features/group-management/components/members-table/remove-managed-user-modal.tsx
new file mode 100644
index 0000000000..c3c6f8caa4
--- /dev/null
+++ b/services/web/frontend/js/features/group-management/components/members-table/remove-managed-user-modal.tsx
@@ -0,0 +1,138 @@
+import { User } from '../../../../../../types/group-management/user'
+import { useState } from 'react'
+import useAsync from '@/shared/hooks/use-async'
+import { useTranslation, Trans } from 'react-i18next'
+import { useLocation } from '@/shared/hooks/use-location'
+import { FetchError, postJSON } from '@/infrastructure/fetch-json'
+import { debugConsole } from '@/utils/debugging'
+import OLModal, {
+  OLModalBody,
+  OLModalFooter,
+  OLModalHeader,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
+import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
+import { sendMB } from '@/infrastructure/event-tracking'
+
+type RemoveManagedUserModalProps = {
+  user: User
+  groupId: string
+  onClose: () => void
+}
+
+export default function RemoveManagedUserModal({
+  user,
+  groupId,
+  onClose,
+}: RemoveManagedUserModalProps) {
+  const { t } = useTranslation()
+  const location = useLocation()
+  const { isLoading, isSuccess, error, setError, runAsync } = useAsync<
+    any,
+    any
+  >()
+  const [suppliedEmail, setSuppliedEmail] = useState<string>()
+  const shouldEnableRemoveUserButton = suppliedEmail === user.email
+  const userFullName = user.last_name
+    ? `${user.first_name || ''} ${user.last_name || ''}`
+    : user.first_name
+
+  const handleReleaseUserSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault()
+    sendMB('remove-managed-user-confirmed')
+    runAsync(
+      postJSON(`/manage/groups/${groupId}/release-managed-user/${user._id}`, {
+        body: {
+          verificationEmail: suppliedEmail,
+        },
+      })
+        .then(() => {
+          location.reload()
+        })
+        .catch(err => {
+          setError(
+            err instanceof FetchError ? err.getUserFacingMessage() : err.message
+          )
+          debugConsole.error(err)
+        })
+    )
+  }
+
+  return (
+    <OLModal id={`release-user-modal-${user._id}`} show onHide={onClose}>
+      <form onSubmit={handleReleaseUserSubmit} data-testid="release-user-form">
+        <OLModalHeader>
+          <OLModalTitle>{t('remove_user')}</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            {t('about_to_remove_user_preamble', {
+              userName: userFullName,
+              userEmail: user.email,
+            })}
+          </p>
+          <ul>
+            <li>{t('they_will_be_removed_from_the_group')}</li>
+            <li>{t('they_will_no_longer_be_a_managed_user')}</li>
+            <li>
+              {t('they_will_retain_their_existing_account_on_the_free_plan')}
+            </li>
+            <li>
+              {t(
+                'they_will_retain_ownership_of_projects_currently_owned_by_them_and_collaborators_will_become_read_only'
+              )}
+            </li>
+            <li>
+              {t(
+                'they_will_continue_to_have_access_to_any_projects_shared_with_them'
+              )}
+            </li>
+            <li>
+              {t(
+                'they_wont_be_able_to_log_in_with_sso_they_will_need_to_set_password'
+              )}
+            </li>
+          </ul>
+          <p>
+            <Trans
+              i18nKey="user_has_left_organization_and_need_to_transfer_their_projects"
+              components={[<b />]} // eslint-disable-line react/jsx-key
+            />
+          </p>
+          <OLFormGroup controlId="supplied-email-input">
+            <OLFormLabel>
+              {t('confirm_remove_user_type_email_address', {
+                userName: userFullName,
+              })}
+            </OLFormLabel>
+            <OLFormControl
+              type="email"
+              aria-label={t('email')}
+              onChange={e => setSuppliedEmail(e.target.value)}
+            />
+          </OLFormGroup>
+          {error && (
+            <OLNotification type="error" content={error} className="mb-0" />
+          )}
+        </OLModalBody>
+        <OLModalFooter>
+          <OLButton variant="secondary" onClick={onClose}>
+            {t('cancel')}
+          </OLButton>
+          <OLButton
+            type="submit"
+            variant="danger"
+            disabled={isLoading || isSuccess || !shouldEnableRemoveUserButton}
+            isLoading={isLoading}
+          >
+            {t('remove_user')}
+          </OLButton>
+        </OLModalFooter>
+      </form>
+    </OLModal>
+  )
+}
diff --git a/services/web/frontend/js/features/group-management/components/members-table/select-user-checkbox.tsx b/services/web/frontend/js/features/group-management/components/members-table/select-user-checkbox.tsx
index a2d32810bc..19aec5d6c7 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/select-user-checkbox.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/select-user-checkbox.tsx
@@ -16,7 +16,7 @@ export default function SelectUserCheckbox({
     useGroupMembersContext()
 
   const handleSelectUser = useCallback(
-    (event, user) => {
+    (event: React.ChangeEvent<HTMLInputElement>, user: User) => {
       if (event.target.checked) {
         selectUser(user)
       } else {
diff --git a/services/web/frontend/js/features/group-management/components/members-table/unlink-user-modal.tsx b/services/web/frontend/js/features/group-management/components/members-table/unlink-user-modal.tsx
index f63bda765e..ce583a09e3 100644
--- a/services/web/frontend/js/features/group-management/components/members-table/unlink-user-modal.tsx
+++ b/services/web/frontend/js/features/group-management/components/members-table/unlink-user-modal.tsx
@@ -47,7 +47,7 @@ export default function UnlinkUserModal({
   }, [groupId, updateMemberView, user])
 
   const handleUnlink = useCallback(
-    event => {
+    (event: React.MouseEvent) => {
       event.preventDefault()
       setHasError(undefined)
       if (!user) {
@@ -108,7 +108,11 @@ export default function UnlinkUserModal({
         </p>
       </OLModalBody>
       <OLModalFooter>
-        <OLButton variant="secondary" disabled={unlinkInFlight}>
+        <OLButton
+          variant="secondary"
+          disabled={unlinkInFlight}
+          onClick={onClose}
+        >
           {t('cancel')}
         </OLButton>
         <OLButton
diff --git a/services/web/frontend/js/features/group-management/components/missing-billing-information.tsx b/services/web/frontend/js/features/group-management/components/missing-billing-information.tsx
index 499e57f27f..cd8e8ef743 100644
--- a/services/web/frontend/js/features/group-management/components/missing-billing-information.tsx
+++ b/services/web/frontend/js/features/group-management/components/missing-billing-information.tsx
@@ -16,7 +16,7 @@ function MissingBillingInformation() {
             components={[
               // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
               <a
-                href="/user/subscription/recurly/billing-details"
+                href="/user/subscription/payment/billing-details"
                 rel="noreferrer noopener"
               />,
               // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
diff --git a/services/web/frontend/js/features/group-management/components/request-status.tsx b/services/web/frontend/js/features/group-management/components/request-status.tsx
index e7bf3d9cff..637380ac13 100644
--- a/services/web/frontend/js/features/group-management/components/request-status.tsx
+++ b/services/web/frontend/js/features/group-management/components/request-status.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { Card, CardBody, Row, Col } from 'react-bootstrap-5'
+import { Card, CardBody, Row, Col } from 'react-bootstrap'
 import Button from '@/features/ui/components/bootstrap-5/button'
 import MaterialIcon from '@/shared/components/material-icon'
 import getMeta from '@/utils/meta'
diff --git a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-plan-details.tsx b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-plan-details.tsx
index a0a95fc692..85088d74af 100644
--- a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-plan-details.tsx
+++ b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-plan-details.tsx
@@ -1,7 +1,7 @@
 import getMeta from '@/utils/meta'
 import { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { Card, Row, Col } from 'react-bootstrap-5'
+import { Card, Row, Col } from 'react-bootstrap'
 import MaterialIcon from '@/shared/components/material-icon'
 import { formatCurrency } from '@/shared/utils/currency'
 
diff --git a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-upgrade-summary.tsx b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-upgrade-summary.tsx
index d7546ccfa7..6d3f76e5a2 100644
--- a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-upgrade-summary.tsx
+++ b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription-upgrade-summary.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { Card, ListGroup } from 'react-bootstrap-5'
+import { Card, ListGroup } from 'react-bootstrap'
 import { formatCurrency } from '@/shared/utils/currency'
 import { formatTime } from '@/features/utils/format-date'
 import {
@@ -100,7 +100,11 @@ function UpgradeSummary({ subscriptionChange }: UpgradeSummaryProps) {
                 subscriptionChange.nextInvoice.tax.amount,
                 subscriptionChange.currency
               ),
-              date: formatTime(subscriptionChange.nextInvoice.date, 'MMMM D'),
+              date: formatTime(
+                subscriptionChange.nextInvoice.date,
+                'MMMM D',
+                true
+              ),
             }
           )}
           {subscriptionChange.immediateCharge.discount !== 0 &&
diff --git a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription.tsx b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription.tsx
index f5750ae349..b4ce898ecb 100644
--- a/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription.tsx
+++ b/services/web/frontend/js/features/group-management/components/upgrade-subscription/upgrade-subscription.tsx
@@ -1,35 +1,49 @@
 import getMeta from '@/utils/meta'
-import { postJSON } from '@/infrastructure/fetch-json'
+import { FetchError, postJSON } from '@/infrastructure/fetch-json'
 import { useTranslation, Trans } from 'react-i18next'
-import { Card, Row, Col } from 'react-bootstrap-5'
+import { Card, Row, Col } from 'react-bootstrap'
 import IconButton from '@/features/ui/components/bootstrap-5/icon-button'
 import Button from '@/features/ui/components/bootstrap-5/button'
 import UpgradeSubscriptionPlanDetails from './upgrade-subscription-plan-details'
-import useAsync from '@/shared/hooks/use-async'
 import RequestStatus from '../request-status'
 import UpgradeSummary, {
   SubscriptionChange,
 } from './upgrade-subscription-upgrade-summary'
 import { debugConsole } from '@/utils/debugging'
 import { sendMB } from '../../../../infrastructure/event-tracking'
+import handleStripePaymentAction from '@/features/subscription/util/handle-stripe-payment-action'
+import { useState } from 'react'
 
 function UpgradeSubscription() {
   const { t } = useTranslation()
   const groupName = getMeta('ol-groupName')
   const preview = getMeta('ol-subscriptionChangePreview') as SubscriptionChange
-  const { isError, runAsync, isSuccess, isLoading } = useAsync()
-  const onSubmit = () => {
+  const [isError, setIsError] = useState(false)
+  const [isLoading, setIsLoading] = useState(false)
+  const [isSuccess, setIsSuccess] = useState(false)
+  const onSubmit = async () => {
     sendMB('flex-upgrade-form', {
       action: 'click-upgrade-button',
     })
-    runAsync(postJSON('/user/subscription/group/upgrade-subscription'))
-      .then(() => {
+    setIsLoading(true)
+
+    try {
+      await postJSON('/user/subscription/group/upgrade-subscription')
+      sendMB('flex-upgrade-success')
+      setIsSuccess(true)
+    } catch (error) {
+      const { handled } = await handleStripePaymentAction(error as FetchError)
+      if (handled) {
         sendMB('flex-upgrade-success')
-      })
-      .catch(() => {
-        debugConsole.error()
-        sendMB('flex-upgrade-error')
-      })
+        setIsSuccess(true)
+        return
+      }
+      debugConsole.error(error)
+      sendMB('flex-upgrade-error')
+      setIsError(true)
+    } finally {
+      setIsLoading(false)
+    }
   }
 
   if (isSuccess) {
diff --git a/services/web/frontend/js/features/group-management/components/user-row.tsx b/services/web/frontend/js/features/group-management/components/user-row.tsx
index 895cc69f04..505dd83e76 100644
--- a/services/web/frontend/js/features/group-management/components/user-row.tsx
+++ b/services/web/frontend/js/features/group-management/components/user-row.tsx
@@ -21,7 +21,7 @@ export default function UserRow({
   const { t } = useTranslation()
 
   const handleSelectUser = useCallback(
-    (event, user) => {
+    (event: React.ChangeEvent<HTMLInputElement>, user: User) => {
       if (event.target.checked) {
         selectUser(user)
       } else {
diff --git a/services/web/frontend/js/features/group-management/context/group-members-context.tsx b/services/web/frontend/js/features/group-management/context/group-members-context.tsx
index 748d845e9d..ae875c435e 100644
--- a/services/web/frontend/js/features/group-management/context/group-members-context.tsx
+++ b/services/web/frontend/js/features/group-management/context/group-members-context.tsx
@@ -31,6 +31,7 @@ export type GroupMembersContextValue = {
   updateMemberView: (userId: string, updatedUser: User) => void
   inviteMemberLoading: boolean
   inviteError?: APIError
+  memberAdded: boolean
   paths: { [key: string]: string }
 }
 
@@ -58,6 +59,7 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
   const [inviteError, setInviteError] = useState<APIError>()
   const [removeMemberInflightCount, setRemoveMemberInflightCount] = useState(0)
   const [removeMemberError, setRemoveMemberError] = useState<APIError>()
+  const [memberAdded, setMemberAdded] = useState(false)
 
   const groupId = getMeta('ol-groupId')
 
@@ -72,9 +74,11 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
   )
 
   const addMembers = useCallback(
-    emailString => {
+    (emailString: string) => {
       setInviteError(undefined)
+      setMemberAdded(false)
       const emails = parseEmails(emailString)
+      let isError = false
       mapSeries(emails, async email => {
         setInviteUserInflightCount(count => count + 1)
         try {
@@ -94,15 +98,22 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
         } catch (error: unknown) {
           debugConsole.error(error)
           setInviteError((error as FetchError)?.data?.error || {})
+          isError = true
         }
-        setInviteUserInflightCount(count => count - 1)
+        setInviteUserInflightCount(count => {
+          const newCount = count - 1
+          if (newCount === 0 && !isError) {
+            setMemberAdded(true)
+          }
+          return newCount
+        })
       })
     },
     [paths.addMember, users, setUsers]
   )
 
   const removeMember = useCallback(
-    async user => {
+    async (user: User) => {
       let url
       if (paths.removeInvite && user.invite && user._id == null) {
         url = `${paths.removeInvite}/${encodeURIComponent(user.email)}`
@@ -126,7 +137,7 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
   )
 
   const removeMembers = useCallback(
-    e => {
+    (e: any) => {
       e.preventDefault()
       setRemoveMemberError(undefined)
       ;(async () => {
@@ -142,7 +153,7 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
   )
 
   const updateMemberView = useCallback(
-    (userId, updatedUser) => {
+    (userId: string, updatedUser: User) => {
       setUsers(
         users.map(u => {
           if (u._id === userId) {
@@ -173,6 +184,7 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
       removeMemberError,
       inviteMemberLoading: inviteUserInflightCount > 0,
       inviteError,
+      memberAdded,
       paths,
     }),
     [
@@ -191,6 +203,7 @@ export function GroupMembersProvider({ children }: GroupMembersProviderProps) {
       removeMemberError,
       inviteUserInflightCount,
       inviteError,
+      memberAdded,
       paths,
     ]
   )
diff --git a/services/web/frontend/js/features/header-footer-react/index.tsx b/services/web/frontend/js/features/header-footer-react/index.tsx
index e808b58322..94a43b65fa 100644
--- a/services/web/frontend/js/features/header-footer-react/index.tsx
+++ b/services/web/frontend/js/features/header-footer-react/index.tsx
@@ -1,22 +1,23 @@
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import getMeta from '@/utils/meta'
-import DefaultNavbar from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
+import { DefaultNavbarRoot } from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
 import Footer from '@/features/ui/components/bootstrap-5/footer/footer'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 const navbarElement = document.getElementById('navbar-container')
 if (navbarElement) {
   const navbarProps = getMeta('ol-navbar')
-  ReactDOM.render(
+  const root = createRoot(navbarElement)
+  root.render(
     <SplitTestProvider>
-      <DefaultNavbar {...navbarProps} />
-    </SplitTestProvider>,
-    navbarElement
+      <DefaultNavbarRoot {...navbarProps} />
+    </SplitTestProvider>
   )
 }
 
 const footerElement = document.getElementById('footer-container')
 if (footerElement) {
   const footerProps = getMeta('ol-footer')
-  ReactDOM.render(<Footer {...footerProps} />, footerElement)
+  const root = createRoot(footerElement)
+  root.render(<Footer {...footerProps} />)
 }
diff --git a/services/web/frontend/js/features/history/components/change-list/change-list.tsx b/services/web/frontend/js/features/history/components/change-list/change-list.tsx
index cb0e93fae4..0078cc2916 100644
--- a/services/web/frontend/js/features/history/components/change-list/change-list.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/change-list.tsx
@@ -2,19 +2,18 @@ import ToggleSwitch from './toggle-switch'
 import AllHistoryList from './all-history-list'
 import LabelsList from './labels-list'
 import { useHistoryContext } from '../../context/history-context'
+import { useTranslation } from 'react-i18next'
 
 function ChangeList() {
   const { labelsOnly, setLabelsOnly } = useHistoryContext()
+  const { t } = useTranslation()
 
   return (
-    <aside className="change-list">
+    <aside className="change-list" aria-label={t('project_history_list')}>
       <div className="history-header history-toggle-switch-container">
         <ToggleSwitch labelsOnly={labelsOnly} setLabelsOnly={setLabelsOnly} />
       </div>
-      <div
-        className="history-version-list-container"
-        data-history-version-list-container
-      >
+      <div className="history-version-list-container">
         {labelsOnly ? <LabelsList /> : <AllHistoryList />}
       </div>
     </aside>
diff --git a/services/web/frontend/js/features/history/components/change-list/changes.tsx b/services/web/frontend/js/features/history/components/change-list/changes.tsx
index ea5e495be3..6e3c1ca30e 100644
--- a/services/web/frontend/js/features/history/components/change-list/changes.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/changes.tsx
@@ -23,6 +23,7 @@ function Changes({ pathnames, projectOps }: ChangesProps) {
           <div
             className="history-version-change-doc"
             data-testid="history-version-change-doc"
+            translate="no"
           >
             {pathname}
           </div>
@@ -41,6 +42,7 @@ function Changes({ pathnames, projectOps }: ChangesProps) {
           <div
             className="history-version-change-doc"
             data-testid="history-version-change-doc"
+            translate="no"
           >
             {getProjectOpDoc(op)}
           </div>
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/actions-dropdown.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/actions-dropdown.tsx
index 90f23cf746..df31a6c58f 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/actions-dropdown.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/actions-dropdown.tsx
@@ -2,27 +2,22 @@ import React, { ReactNode } from 'react'
 import {
   Dropdown,
   DropdownMenu,
+  DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
-import BS5DropdownToggleWithTooltip from '@/features/ui/components/bootstrap-5/dropdown-toggle-with-tooltip'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 
 type ActionDropdownProps = {
   id: string
   children: React.ReactNode
-  parentSelector?: string
   isOpened: boolean
   iconTag: ReactNode
-  toolTipDescription: string
+  tooltipDescription: string
   setIsOpened: (isOpened: boolean) => void
 }
 
-function BS5ActionsDropdown({
-  id,
-  children,
-  isOpened,
-  iconTag,
-  setIsOpened,
-  toolTipDescription,
-}: Omit<ActionDropdownProps, 'parentSelector'>) {
+function ActionsDropdown(props: ActionDropdownProps) {
+  const { id, children, isOpened, iconTag, setIsOpened, tooltipDescription } =
+    props
   return (
     <Dropdown
       align="end"
@@ -30,16 +25,23 @@ function BS5ActionsDropdown({
       show={isOpened}
       onToggle={open => setIsOpened(open)}
     >
-      <BS5DropdownToggleWithTooltip
+      <OLTooltip
         id={`history-version-dropdown-${id}`}
-        className="history-version-dropdown-menu-btn"
-        aria-label={toolTipDescription}
-        toolTipDescription={toolTipDescription}
-        overlayTriggerProps={{ placement: 'bottom' }}
-        tooltipProps={{ hidden: isOpened }}
+        description={tooltipDescription}
+        overlayProps={{ placement: 'bottom' }}
+        hidden={isOpened}
       >
-        {iconTag}
-      </BS5DropdownToggleWithTooltip>
+        {/* OverlayTrigger won't fire unless the child is a non-react html element (e.g div, span) */}
+        <span>
+          <DropdownToggle
+            id={`history-version-dropdown-toggle-${id}`}
+            className="history-version-dropdown-menu-btn"
+            as="button"
+          >
+            {iconTag}
+          </DropdownToggle>
+        </span>
+      </OLTooltip>
       <DropdownMenu className="history-version-dropdown-menu">
         {children}
       </DropdownMenu>
@@ -47,8 +49,4 @@ function BS5ActionsDropdown({
   )
 }
 
-function ActionsDropdown(props: ActionDropdownProps) {
-  return <BS5ActionsDropdown {...props} />
-}
-
 export default ActionsDropdown
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/compare-version-dropdown.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/compare-version-dropdown.tsx
index 6cf2d54f1f..11967e3302 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/compare-version-dropdown.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/compare-version-dropdown.tsx
@@ -21,8 +21,7 @@ function CompareVersionDropdown({
       id={id}
       isOpened={isOpened}
       setIsOpened={setIsOpened}
-      parentSelector="[data-history-version-list-container]"
-      toolTipDescription={t('compare')}
+      tooltipDescription={t('compare')}
       iconTag={
         <MaterialIcon
           type="align_space_even"
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown-content.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown-content.tsx
index ac7a0044d8..43858f7eb3 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown-content.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown-content.tsx
@@ -28,11 +28,7 @@ function HistoryDropdownContent({
   return (
     <>
       {permissions.labelVersion && (
-        <AddLabel
-          projectId={projectId}
-          version={version}
-          closeDropdown={closeDropdown}
-        />
+        <AddLabel version={version} closeDropdown={closeDropdown} />
       )}
       <Download
         projectId={projectId}
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown.tsx
index a0c20671d2..79667c74d2 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/history-dropdown.tsx
@@ -20,12 +20,11 @@ function HistoryDropdown({
     <ActionsDropdown
       id={id}
       isOpened={isOpened}
-      toolTipDescription={t('more_actions')}
+      tooltipDescription={t('more_actions')}
       setIsOpened={setIsOpened}
       iconTag={
         <MaterialIcon type="more_vert" accessibilityLabel={t('more_actions')} />
       }
-      parentSelector="[data-history-version-list-container]"
     >
       {children}
     </ActionsDropdown>
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/add-label.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/add-label.tsx
index 882bb9a439..1381b620d4 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/add-label.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/add-label.tsx
@@ -4,18 +4,12 @@ import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-ite
 import OLTagIcon from '@/features/ui/components/ol/icons/ol-tag-icon'
 import AddLabelModal from '../../add-label-modal'
 
-type DownloadProps = {
-  projectId: string
+type AddLabelProps = {
   version: number
   closeDropdown: () => void
 }
 
-function AddLabel({
-  version,
-  projectId,
-  closeDropdown,
-  ...props
-}: DownloadProps) {
+function AddLabel({ version, closeDropdown, ...props }: AddLabelProps) {
   const { t } = useTranslation()
   const [showModal, setShowModal] = useState(false)
 
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare-items.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare-items.tsx
index 78ba0aae75..dd236ed98b 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare-items.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare-items.tsx
@@ -34,7 +34,7 @@ function CompareItems({
             toVTimestamp: selRange.toVTimestamp,
           }}
           closeDropdown={closeDropdown}
-          toolTipDescription={t('history_compare_from_this_version')}
+          tooltipDescription={t('history_compare_from_this_version')}
           icon={
             <MaterialIcon
               type="align_end"
@@ -52,7 +52,7 @@ function CompareItems({
             toVTimestamp: updateRange.toVTimestamp,
           }}
           closeDropdown={closeDropdown}
-          toolTipDescription={t('history_compare_up_to_this_version')}
+          tooltipDescription={t('history_compare_up_to_this_version')}
           icon={
             <MaterialIcon
               type="align_start"
diff --git a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare.tsx b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare.tsx
index 90b02d1ea5..92745579c3 100644
--- a/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/dropdown/menu-item/compare.tsx
@@ -6,14 +6,14 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 type CompareProps = {
   comparisonRange: UpdateRange
   icon: ReactNode
-  toolTipDescription?: string
+  tooltipDescription?: string
   closeDropdown: () => void
 }
 
 function Compare({
   comparisonRange,
   closeDropdown,
-  toolTipDescription,
+  tooltipDescription,
   icon,
 }: CompareProps) {
   const { setSelection } = useHistoryContext()
@@ -32,12 +32,12 @@ function Compare({
 
   return (
     <OLTooltip
-      description={toolTipDescription}
+      description={tooltipDescription}
       id="compare-btn"
       overlayProps={{ placement: 'left' }}
     >
       <button className="history-compare-btn" onClick={handleCompareVersion}>
-        <span className="visually-hidden">{toolTipDescription}</span>
+        <span className="visually-hidden">{tooltipDescription}</span>
         {icon}
       </button>
     </OLTooltip>
diff --git a/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx b/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx
index 8053792db9..f4c528670c 100644
--- a/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx
@@ -1,16 +1,8 @@
 import { useTranslation } from 'react-i18next'
-import Icon from '../../../../shared/components/icon'
 import { useCallback, useEffect, useState } from 'react'
 import * as eventTracking from '../../../../infrastructure/event-tracking'
 import StartFreeTrialButton from '../../../../shared/components/start-free-trial-button'
-
-function FeatureItem({ text }: { text: string }) {
-  return (
-    <li>
-      <Icon type="check" /> {text}
-    </li>
-  )
-}
+import UpgradeBenefits from '@/shared/components/upgrade-benefits'
 
 export function OwnerPaywallPrompt() {
   const { t } = useTranslation()
@@ -34,16 +26,7 @@ export function OwnerPaywallPrompt() {
           {t('upgrade_to_get_feature', { feature: 'full project history' })}
         </strong>
       </p>
-      <ul className="history-feature-list">
-        <FeatureItem text={t('unlimited_projects')} />
-        <FeatureItem
-          text={t('collabs_per_proj', { collabcount: 'Multiple' })}
-        />
-        <FeatureItem text={t('full_doc_history')} />
-        <FeatureItem text={t('sync_to_dropbox')} />
-        <FeatureItem text={t('sync_to_github')} />
-        <FeatureItem text={t('compile_larger_projects')} />
-      </ul>
+      <UpgradeBenefits className="history-feature-list" />
       <p>
         <StartFreeTrialButton
           source="history"
diff --git a/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx b/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
index 18736c4f37..c766c4e25b 100644
--- a/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/tag-tooltip.tsx
@@ -87,6 +87,7 @@ const ChangeTag = forwardRef<HTMLElement, TagProps>(
           className="history-version-badge"
           data-testid="history-version-badge"
           {...props}
+          translate={isPseudoCurrentStateLabel ? 'yes' : 'no'}
         >
           {isPseudoCurrentStateLabel
             ? t('history_label_project_current_state')
@@ -147,24 +148,32 @@ function TagTooltip({ label, currentUserId, showTooltip }: LabelBadgesProps) {
 
   const isPseudoCurrentStateLabel = isPseudoLabel(label)
   const currentLabelData = allLabels?.find(({ id }) => id === label.id)
-  const labelOwnerName =
-    currentLabelData && !isPseudoLabel(currentLabelData)
-      ? currentLabelData.user_display_name
-      : t('anonymous')
+  const isAnonymous = !currentLabelData || isPseudoLabel(currentLabelData)
+  const labelOwnerName = isAnonymous
+    ? t('anonymous')
+    : currentLabelData.user_display_name
+  const labelOwnerNameComponent = isAnonymous ? (
+    labelOwnerName
+  ) : (
+    <span translate="no">{labelOwnerName}</span>
+  )
 
   return !isPseudoCurrentStateLabel ? (
     <OLTooltip
       description={
         <div className="history-version-label-tooltip">
           <div className="history-version-label-tooltip-row">
-            <b className="history-version-label-tooltip-row-comment">
+            <b
+              className="history-version-label-tooltip-row-comment"
+              translate="no"
+            >
               <OLTagIcon />
               &nbsp;
               {label.comment}
             </b>
           </div>
           <div className="history-version-label-tooltip-row">
-            {t('history_label_created_by')} {labelOwnerName}
+            {t('history_label_created_by')} {labelOwnerNameComponent}
           </div>
           <div className="history-version-label-tooltip-row">
             <time>
diff --git a/services/web/frontend/js/features/history/components/change-list/toggle-switch.tsx b/services/web/frontend/js/features/history/components/change-list/toggle-switch.tsx
index 478630808c..078f092c51 100644
--- a/services/web/frontend/js/features/history/components/change-list/toggle-switch.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/toggle-switch.tsx
@@ -61,7 +61,9 @@ function ToggleSwitch({ labelsOnly, setLabelsOnly }: ToggleSwitchProps) {
 
   return (
     <fieldset className="toggle-switch">
-      <legend className="sr-only">{t('history_view_a11y_description')}</legend>
+      <legend className="visually-hidden">
+        {t('history_view_a11y_description')}
+      </legend>
       <input
         type="radio"
         name="labels-only-toggle-switch"
diff --git a/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx b/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
index ed1da6e757..b72eeb2fc4 100644
--- a/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
+++ b/services/web/frontend/js/features/history/components/change-list/user-name-with-colored-badge.tsx
@@ -14,6 +14,7 @@ function UserNameWithColoredBadge({
   currentUserId,
 }: UserNameWithColoredBadgeProps) {
   const { t } = useTranslation()
+  let allowBrowserTranslate = true
 
   let userName: string
   if (!user) {
@@ -22,8 +23,10 @@ function UserNameWithColoredBadge({
     userName = t('you')
   } else if ('displayName' in user) {
     userName = user.displayName
+    allowBrowserTranslate = false
   } else {
     userName = formatUserName(user)
+    allowBrowserTranslate = false
   }
 
   return (
@@ -32,7 +35,12 @@ function UserNameWithColoredBadge({
         className="history-version-user-badge-color"
         style={{ backgroundColor: getBackgroundColorForUserId(user?.id) }}
       />
-      <span className="history-version-user-badge-text">{userName}</span>
+      <span
+        className="history-version-user-badge-text"
+        translate={allowBrowserTranslate ? 'yes' : 'no'}
+      >
+        {userName}
+      </span>
     </>
   )
 }
diff --git a/services/web/frontend/js/features/history/components/diff-view/diff-view.tsx b/services/web/frontend/js/features/history/components/diff-view/diff-view.tsx
index 82695a8189..7f2a834ef6 100644
--- a/services/web/frontend/js/features/history/components/diff-view/diff-view.tsx
+++ b/services/web/frontend/js/features/history/components/diff-view/diff-view.tsx
@@ -5,7 +5,7 @@ import { Diff, DocDiffResponse } from '../../services/types/doc'
 import { useHistoryContext } from '../../context/history-context'
 import { diffDoc } from '../../services/api'
 import { highlightsFromDiffResponse } from '../../utils/highlights-from-diff-response'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import useAsync from '../../../../shared/hooks/use-async'
 import { useTranslation } from 'react-i18next'
 
@@ -14,7 +14,7 @@ function DiffView() {
   const { isLoading, data, runAsync } = useAsync<DocDiffResponse>()
   const { t } = useTranslation()
   const { updateRange, selectedFile } = selection
-  const handleError = useErrorHandler()
+  const { showBoundary } = useErrorBoundary()
 
   useEffect(() => {
     if (!updateRange || !selectedFile?.pathname || loadingFileDiffs) {
@@ -33,7 +33,7 @@ function DiffView() {
         abortController.signal
       )
     )
-      .catch(handleError)
+      .catch(showBoundary)
       .finally(() => {
         abortController = null
       })
@@ -50,7 +50,7 @@ function DiffView() {
     updateRange,
     selectedFile,
     loadingFileDiffs,
-    handleError,
+    showBoundary,
   ])
 
   const diff = useMemo(() => {
diff --git a/services/web/frontend/js/features/history/components/diff-view/document-diff-viewer.tsx b/services/web/frontend/js/features/history/components/diff-view/document-diff-viewer.tsx
index d99f9521ec..324ad38935 100644
--- a/services/web/frontend/js/features/history/components/diff-view/document-diff-viewer.tsx
+++ b/services/web/frontend/js/features/history/components/diff-view/document-diff-viewer.tsx
@@ -77,7 +77,7 @@ function DocumentDiffViewer({
 
   // Append the editor view DOM to the container node when mounted
   const containerRef = useCallback(
-    node => {
+    (node: HTMLDivElement) => {
       if (node) {
         node.appendChild(view.dom)
       }
diff --git a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
index 3b788eb046..7088588e27 100644
--- a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
+++ b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-doc.tsx
@@ -1,9 +1,12 @@
 import { memo } from 'react'
 import classNames from 'classnames'
 import HistoryFileTreeItem from './history-file-tree-item'
-import iconTypeFromName from '../../../file-tree/util/icon-type-from-name'
+import iconTypeFromName, {
+  newEditorIconTypeFromName,
+} from '../../../file-tree/util/icon-type-from-name'
 import type { FileDiff } from '../../services/types/file'
 import MaterialIcon from '@/shared/components/material-icon'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 type HistoryFileTreeDocProps = {
   file: FileDiff
@@ -20,6 +23,16 @@ function HistoryFileTreeDoc({
   onClick,
   onKeyDown,
 }: HistoryFileTreeDocProps) {
+  const newEditor = useIsNewEditorEnabled()
+  const icon = newEditor ? (
+    <MaterialIcon
+      unfilled
+      type={newEditorIconTypeFromName(name)}
+      className="file-tree-icon"
+    />
+  ) : (
+    <MaterialIcon type={iconTypeFromName(name)} className="file-tree-icon" />
+  )
   return (
     <li
       role="treeitem"
@@ -29,16 +42,12 @@ function HistoryFileTreeDoc({
       aria-selected={selected}
       aria-label={name}
       tabIndex={0}
+      translate="no"
     >
       <HistoryFileTreeItem
         name={name}
         operation={'operation' in file ? file.operation : undefined}
-        icons={
-          <MaterialIcon
-            type={iconTypeFromName(name)}
-            className="file-tree-icon"
-          />
-        }
+        icons={icon}
       />
     </li>
   )
diff --git a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
index 6c2c912f8c..738b0a4688 100644
--- a/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
+++ b/services/web/frontend/js/features/history/components/file-tree/history-file-tree-folder.tsx
@@ -6,6 +6,7 @@ import HistoryFileTreeFolderList from './history-file-tree-folder-list'
 
 import type { HistoryDoc, HistoryFileTree } from '../../utils/file-tree'
 import MaterialIcon from '@/shared/components/material-icon'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 type HistoryFileTreeFolderProps = {
   name: string
@@ -35,6 +36,7 @@ function HistoryFileTreeFolder({
   docs,
 }: HistoryFileTreeFolderProps) {
   const { t } = useTranslation()
+  const newEditor = useIsNewEditorEnabled()
 
   const [expanded, setExpanded] = useState(() => {
     return hasChanges({ name, folders, docs })
@@ -52,10 +54,12 @@ function HistoryFileTreeFolder({
           className="file-tree-expand-icon"
         />
       </button>
-      <MaterialIcon
-        type={expanded ? 'folder_open' : 'folder'}
-        className="file-tree-folder-icon"
-      />
+      {!newEditor && (
+        <MaterialIcon
+          type={expanded ? 'folder_open' : 'folder'}
+          className="file-tree-folder-icon"
+        />
+      )}
     </>
   )
 
@@ -75,11 +79,16 @@ function HistoryFileTreeFolder({
             setExpanded(!expanded)
           }
         }}
+        translate="no"
       >
         <HistoryFileTreeItem name={name} icons={icons} />
       </li>
       {expanded ? (
-        <HistoryFileTreeFolderList folders={folders} docs={docs} />
+        <HistoryFileTreeFolderList
+          folders={folders}
+          docs={docs}
+          rootClassName="history-file-tree-list-inner"
+        />
       ) : null}
     </>
   )
diff --git a/services/web/frontend/js/features/history/context/history-context.tsx b/services/web/frontend/js/features/history/context/history-context.tsx
index 7dc2c996c5..a7a0746e3c 100644
--- a/services/web/frontend/js/features/history/context/history-context.tsx
+++ b/services/web/frontend/js/features/history/context/history-context.tsx
@@ -25,7 +25,7 @@ import {
   Update,
 } from '../services/types/update'
 import { Selection } from '../services/types/selection'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import { getUpdateForVersion } from '../utils/history-details'
 import { getHueForUserId } from '@/shared/utils/colors'
 
@@ -78,13 +78,10 @@ const updatesInfoInitialState: HistoryContextValue['updatesInfo'] = {
 function useHistory() {
   const { view } = useLayoutContext()
   const user = useUserContext()
-  const project = useProjectContext()
+  const { projectId, project, features } = useProjectContext()
   const userId = user.id
-  const projectId = project._id
-  const projectOwnerId = project.owner?._id
-  const userHasFullFeature = Boolean(
-    project.features?.versioning || user.isAdmin
-  )
+  const projectOwnerId = project?.owner?._id
+  const userHasFullFeature = Boolean(features.versioning || user.isAdmin)
   const currentUserIsOwner = projectOwnerId === userId
 
   const [selection, setSelection] = useState<Selection>(selectionInitialState)
@@ -99,7 +96,7 @@ function useHistory() {
   )
 
   const updatesAbortControllerRef = useRef<AbortController | null>(null)
-  const handleError = useErrorHandler()
+  const { showBoundary } = useErrorBoundary()
 
   const fetchNextBatchOfUpdates = useCallback(() => {
     // If there is an in-flight request for updates, just let it complete, by
@@ -199,11 +196,11 @@ function useHistory() {
           loadingState: 'ready',
         })
       })
-      .catch(handleError)
+      .catch(showBoundary)
       .finally(() => {
         updatesAbortControllerRef.current = null
       })
-  }, [updatesInfo, projectId, labels, handleError, userHasFullFeature])
+  }, [updatesInfo, projectId, labels, showBoundary, userHasFullFeature])
 
   // Abort in-flight updates request on unmount
   useEffect(() => {
@@ -284,7 +281,7 @@ function useHistory() {
           }
         })
       })
-      .catch(handleError)
+      .catch(showBoundary)
       .finally(() => {
         setLoadingFileDiffs(false)
         abortController = null
@@ -295,7 +292,7 @@ function useHistory() {
         abortController.abort()
       }
     }
-  }, [projectId, fromV, toV, updateForToV, handleError])
+  }, [projectId, fromV, toV, updateForToV, showBoundary])
 
   useEffect(() => {
     // Set update range if there isn't one and updates have loaded
diff --git a/services/web/frontend/js/features/history/context/hooks/use-restore-deleted-file.ts b/services/web/frontend/js/features/history/context/hooks/use-restore-deleted-file.ts
index 226991e3b1..621bd9b148 100644
--- a/services/web/frontend/js/features/history/context/hooks/use-restore-deleted-file.ts
+++ b/services/web/frontend/js/features/history/context/hooks/use-restore-deleted-file.ts
@@ -4,7 +4,7 @@ import { restoreFile } from '../../services/api'
 import { isFileRemoved } from '../../utils/file-diff'
 import { useHistoryContext } from '../history-context'
 import type { HistoryContextValue } from '../types/history-context-value'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import { useFileTreeData } from '@/shared/context/file-tree-data-context'
 import { findInTree } from '@/features/file-tree/util/find-in-tree'
 import { useCallback, useEffect, useState } from 'react'
@@ -21,9 +21,9 @@ type RestorationState =
 
 export function useRestoreDeletedFile() {
   const { projectId } = useHistoryContext()
-  const { setView } = useLayoutContext()
+  const { restoreView } = useLayoutContext()
   const { openDocWithId, openFileWithId } = useEditorManagerContext()
-  const handleError = useErrorHandler()
+  const { showBoundary } = useErrorBoundary()
   const { fileTreeData } = useFileTreeData()
   const [state, setState] = useState<RestorationState>('idle')
   const [restoredFileMetadata, setRestoredFileMetadata] =
@@ -37,7 +37,7 @@ export function useRestoreDeletedFile() {
       if (result) {
         setState('complete')
         const { _id: id } = result.entity
-        setView('editor')
+        restoreView()
 
         if (restoredFileMetadata.type === 'doc') {
           openDocWithId(id)
@@ -52,21 +52,21 @@ export function useRestoreDeletedFile() {
     restoredFileMetadata,
     openDocWithId,
     openFileWithId,
-    setView,
+    restoreView,
   ])
 
   useEffect(() => {
     if (state === 'waitingForFileTree') {
       const timer = window.setTimeout(() => {
         setState('timedOut')
-        handleError(new Error('timed out'))
+        showBoundary(new Error('timed out'))
       }, 3000)
 
       return () => {
         window.clearTimeout(timer)
       }
     }
-  }, [handleError, state])
+  }, [showBoundary, state])
 
   const restoreDeletedFile = useCallback(
     (selection: HistoryContextValue['selection']) => {
@@ -93,13 +93,13 @@ export function useRestoreDeletedFile() {
             },
             error => {
               setState('error')
-              handleError(error)
+              showBoundary(error)
             }
           )
         }
       }
     },
-    [handleError, projectId]
+    [showBoundary, projectId]
   )
 
   return { restoreDeletedFile, isLoading }
diff --git a/services/web/frontend/js/features/history/context/hooks/use-restore-project.ts b/services/web/frontend/js/features/history/context/hooks/use-restore-project.ts
index ec4e4a4ef8..7813ae0c5c 100644
--- a/services/web/frontend/js/features/history/context/hooks/use-restore-project.ts
+++ b/services/web/frontend/js/features/history/context/hooks/use-restore-project.ts
@@ -1,13 +1,13 @@
 import { useCallback, useState } from 'react'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import { restoreProjectToVersion } from '../../services/api'
 import { useLayoutContext } from '@/shared/context/layout-context'
 
 type RestorationState = 'initial' | 'restoring' | 'restored' | 'error'
 
 export const useRestoreProject = () => {
-  const handleError = useErrorHandler()
-  const { setView } = useLayoutContext()
+  const { showBoundary } = useErrorBoundary()
+  const { restoreView } = useLayoutContext()
 
   const [restorationState, setRestorationState] =
     useState<RestorationState>('initial')
@@ -18,14 +18,14 @@ export const useRestoreProject = () => {
       restoreProjectToVersion(projectId, version)
         .then(() => {
           setRestorationState('restored')
-          setView('editor')
+          restoreView()
         })
         .catch(err => {
           setRestorationState('error')
-          handleError(err)
+          showBoundary(err)
         })
     },
-    [handleError, setView]
+    [showBoundary, restoreView]
   )
 
   return {
diff --git a/services/web/frontend/js/features/history/context/hooks/use-restore-selected-file.ts b/services/web/frontend/js/features/history/context/hooks/use-restore-selected-file.ts
index 12b72faafd..d514129e9a 100644
--- a/services/web/frontend/js/features/history/context/hooks/use-restore-selected-file.ts
+++ b/services/web/frontend/js/features/history/context/hooks/use-restore-selected-file.ts
@@ -3,7 +3,7 @@ import { restoreFileToVersion } from '../../services/api'
 import { isFileRemoved } from '../../utils/file-diff'
 import { useHistoryContext } from '../history-context'
 import type { HistoryContextValue } from '../types/history-context-value'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import { useFileTreeData } from '@/shared/context/file-tree-data-context'
 import { findInTree } from '@/features/file-tree/util/find-in-tree'
 import { useCallback, useEffect, useState } from 'react'
@@ -22,9 +22,9 @@ type RestoreState =
 
 export function useRestoreSelectedFile() {
   const { projectId } = useHistoryContext()
-  const { setView } = useLayoutContext()
+  const { restoreView } = useLayoutContext()
   const { openDocWithId, openFileWithId } = useEditorManagerContext()
-  const handleError = useErrorHandler()
+  const { showBoundary } = useErrorBoundary()
   const { fileTreeData } = useFileTreeData()
   const [state, setState] = useState<RestoreState>('idle')
   const [restoredFileMetadata, setRestoredFileMetadata] =
@@ -38,7 +38,7 @@ export function useRestoreSelectedFile() {
       if (result) {
         setState('complete')
         const { _id: id } = result.entity
-        setView('editor')
+        restoreView()
 
         if (restoredFileMetadata.type === 'doc') {
           openDocWithId(id)
@@ -53,21 +53,21 @@ export function useRestoreSelectedFile() {
     restoredFileMetadata,
     openDocWithId,
     openFileWithId,
-    setView,
+    restoreView,
   ])
 
   useEffect(() => {
     if (state === 'waitingForFileTree') {
       const timer = window.setTimeout(() => {
         setState('timedOut')
-        handleError(new Error('timed out'))
+        showBoundary(new Error('timed out'))
       }, RESTORE_FILE_TIMEOUT)
 
       return () => {
         window.clearTimeout(timer)
       }
     }
-  }, [handleError, state])
+  }, [showBoundary, state])
 
   const restoreSelectedFile = useCallback(
     (selection: HistoryContextValue['selection']) => {
@@ -91,13 +91,13 @@ export function useRestoreSelectedFile() {
             },
             error => {
               setState('error')
-              handleError(error)
+              showBoundary(error)
             }
           )
         }
       }
     },
-    [handleError, projectId]
+    [showBoundary, projectId]
   )
 
   return { restoreSelectedFile, isLoading }
diff --git a/services/web/frontend/js/features/history/extensions/highlights.ts b/services/web/frontend/js/features/history/extensions/highlights.ts
index ce274cf724..1f81f82e74 100644
--- a/services/web/frontend/js/features/history/extensions/highlights.ts
+++ b/services/web/frontend/js/features/history/extensions/highlights.ts
@@ -238,7 +238,7 @@ class EmptyLineAdditionMarkerWidget extends WidgetType {
     super()
   }
 
-  toDOM(view: EditorView): HTMLElement {
+  toDOM(): HTMLElement {
     const element = document.createElement('span')
     element.classList.add(
       'ol-cm-empty-line-addition-marker',
@@ -255,7 +255,7 @@ class EmptyLineDeletionMarkerWidget extends WidgetType {
     super()
   }
 
-  toDOM(view: EditorView): HTMLElement {
+  toDOM(): HTMLElement {
     const element = document.createElement('span')
     element.classList.add(
       'ol-cm-empty-line-deletion-marker',
@@ -297,7 +297,7 @@ class ChangeGutterMarker extends GutterMarker {
     super()
   }
 
-  toDOM(view: EditorView) {
+  toDOM() {
     const el = document.createElement('div')
     el.className = 'ol-cm-changed-line-gutter'
     el.style.setProperty('--hue', this.hue.toString())
diff --git a/services/web/frontend/js/features/history/services/types/file.ts b/services/web/frontend/js/features/history/services/types/file.ts
index 4fb1330087..e517fdb518 100644
--- a/services/web/frontend/js/features/history/services/types/file.ts
+++ b/services/web/frontend/js/features/history/services/types/file.ts
@@ -30,9 +30,5 @@ export interface FileRenamed extends FileWithEditable {
   operation: Extract<FileOperation, 'renamed'>
 }
 
-export type FileDiff =
-  | FileAdded
-  | FileRemoved
-  | FileEdited
-  | FileRenamed
-  | FileUnchanged
+export type FileChanged = FileAdded | FileRemoved | FileEdited | FileRenamed
+export type FileDiff = FileChanged | FileUnchanged
diff --git a/services/web/frontend/js/features/history/utils/file-diff.ts b/services/web/frontend/js/features/history/utils/file-diff.ts
index 3d5febbb10..c78fd3275c 100644
--- a/services/web/frontend/js/features/history/utils/file-diff.ts
+++ b/services/web/frontend/js/features/history/utils/file-diff.ts
@@ -1,24 +1,24 @@
-import type {
+import {
+  FileChanged,
   FileDiff,
   FileRemoved,
   FileRenamed,
-  FileWithEditable,
 } from '../services/types/file'
 
+export function isFileChanged(fileDiff: FileDiff): fileDiff is FileChanged {
+  return 'operation' in fileDiff
+}
+
 export function isFileRenamed(fileDiff: FileDiff): fileDiff is FileRenamed {
-  return (fileDiff as FileRenamed).operation === 'renamed'
+  return isFileChanged(fileDiff) && fileDiff.operation === 'renamed'
 }
 
 export function isFileRemoved(fileDiff: FileDiff): fileDiff is FileRemoved {
-  return (fileDiff as FileRemoved).operation === 'removed'
-}
-
-function isFileWithEditable(fileDiff: FileDiff): fileDiff is FileWithEditable {
-  return 'editable' in (fileDiff as FileWithEditable)
+  return isFileChanged(fileDiff) && fileDiff.operation === 'removed'
 }
 
 export function isFileEditable(fileDiff: FileDiff) {
-  return isFileWithEditable(fileDiff)
+  return 'editable' in fileDiff
     ? fileDiff.editable
     : fileDiff.operation === 'edited'
 }
diff --git a/services/web/frontend/js/features/history/utils/file-tree.ts b/services/web/frontend/js/features/history/utils/file-tree.ts
index 423621902c..e997457e8d 100644
--- a/services/web/frontend/js/features/history/utils/file-tree.ts
+++ b/services/web/frontend/js/features/history/utils/file-tree.ts
@@ -1,6 +1,6 @@
 import _ from 'lodash'
 import type { FileDiff, FileRenamed } from '../services/types/file'
-import { isFileEditable, isFileRemoved } from './file-diff'
+import { isFileChanged, isFileEditable, isFileRemoved } from './file-diff'
 
 export type FileTreeEntity = {
   name?: string
@@ -65,22 +65,29 @@ export function fileTreeDiffToFileTreeData(
   const folders: HistoryFileTree[] = []
   const docs: HistoryDoc[] = []
 
-  for (const file of fileTreeDiff) {
-    if (file.type === 'file') {
-      const deletedAtV = isFileRemoved(file) ? file.deletedAtV : undefined
-
-      const newDoc: HistoryDoc = {
-        pathname: file.pathname ?? '',
-        name: file.name ?? '',
-        deletedAtV,
-        editable: isFileEditable(file),
-        operation: 'operation' in file ? file.operation : undefined,
+  for (const fileDiff of fileTreeDiff) {
+    if (fileDiff.type === 'file') {
+      if (isFileChanged(fileDiff)) {
+        docs.push({
+          pathname: fileDiff.pathname ?? '',
+          name: fileDiff.name ?? '',
+          editable: isFileEditable(fileDiff),
+          operation: fileDiff.operation,
+          deletedAtV: isFileRemoved(fileDiff) ? fileDiff.deletedAtV : undefined,
+        })
+      } else {
+        docs.push({
+          pathname: fileDiff.pathname ?? '',
+          name: fileDiff.name ?? '',
+          editable: isFileEditable(fileDiff),
+        })
       }
-
-      docs.push(newDoc)
-    } else if (file.type === 'folder') {
-      if (file.children) {
-        const folder = fileTreeDiffToFileTreeData(file.children, file.name)
+    } else if (fileDiff.type === 'folder') {
+      if (fileDiff.children) {
+        const folder = fileTreeDiffToFileTreeData(
+          fileDiff.children,
+          fileDiff.name
+        )
         folders.push(folder)
       }
     }
diff --git a/services/web/frontend/js/features/hotkeys-modal/components/hotkeys-modal-bottom-text.jsx b/services/web/frontend/js/features/hotkeys-modal/components/hotkeys-modal-bottom-text.jsx
index db6507e823..a11b79f004 100644
--- a/services/web/frontend/js/features/hotkeys-modal/components/hotkeys-modal-bottom-text.jsx
+++ b/services/web/frontend/js/features/hotkeys-modal/components/hotkeys-modal-bottom-text.jsx
@@ -10,8 +10,9 @@ export default function HotkeysModalBottomText() {
           // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
           <a
             onClick={() => eventTracking.sendMB('left-menu-hotkeys-template')}
-            href="/articles/overleaf-keyboard-shortcuts/qykqfvmxdnjf"
+            href="https://www.overleaf.com/articles/overleaf-keyboard-shortcuts/qykqfvmxdnjf"
             target="_blank"
+            rel="noreferrer"
           />,
         ]}
       />
diff --git a/services/web/frontend/js/features/ide-react/components/alerts/alerts.tsx b/services/web/frontend/js/features/ide-react/components/alerts/alerts.tsx
index 98f23d8f2a..4829913ade 100644
--- a/services/web/frontend/js/features/ide-react/components/alerts/alerts.tsx
+++ b/services/web/frontend/js/features/ide-react/components/alerts/alerts.tsx
@@ -2,11 +2,9 @@ import { useTranslation } from 'react-i18next'
 import { LostConnectionAlert } from './lost-connection-alert'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
 import { debugging } from '@/utils/debugging'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import { createPortal } from 'react-dom'
 import { useGlobalAlertsContainer } from '@/features/ide-react/context/global-alerts-context'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
-import OLButton from '@/features/ui/components/ol/ol-button'
 
 export function Alerts() {
   const { t } = useTranslation()
@@ -19,8 +17,6 @@ export function Alerts() {
   } = useConnectionContext()
   const globalAlertsContainer = useGlobalAlertsContainer()
 
-  const [synctexError] = useScopeValue('sync_tex_error')
-
   if (!globalAlertsContainer) {
     return null
   }
@@ -50,24 +46,6 @@ export function Alerts() {
         />
       ) : null}
 
-      {synctexError ? (
-        <OLNotification
-          type="warning"
-          content={<strong>{t('synctex_failed')}</strong>}
-          action={
-            <OLButton
-              href="/learn/how-to/SyncTeX_Errors"
-              target="_blank"
-              id="synctex-more-info-button"
-              variant="secondary"
-              size="sm"
-            >
-              {t('more_info')}
-            </OLButton>
-          }
-        />
-      ) : null}
-
       {connectionState.inactiveDisconnect ||
       (connectionState.readyState === WebSocket.CLOSED &&
         (connectionState.error === 'rate-limited' ||
diff --git a/services/web/frontend/js/features/ide-react/components/editor-and-pdf.tsx b/services/web/frontend/js/features/ide-react/components/editor-and-pdf.tsx
index 6a9e4cd441..a7ae12515e 100644
--- a/services/web/frontend/js/features/ide-react/components/editor-and-pdf.tsx
+++ b/services/web/frontend/js/features/ide-react/components/editor-and-pdf.tsx
@@ -58,7 +58,10 @@ export const EditorAndPdf: FC = () => {
       >
         {selectedEntityCount === 0 && <NoSelectionPane />}
         {selectedEntityCount === 1 && openEntity?.type === 'fileRef' && (
-          <FileView file={fileViewFile(openEntity.entity)} />
+          <FileView
+            file={fileViewFile(openEntity.entity)}
+            key={openEntity.entity._id}
+          />
         )}
         {selectedEntityCount > 1 && (
           <MultipleSelectionPane selectedEntityCount={selectedEntityCount} />
diff --git a/services/web/frontend/js/features/ide-react/components/editor-survey.tsx b/services/web/frontend/js/features/ide-react/components/editor-survey.tsx
new file mode 100644
index 0000000000..e28aa7698d
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/components/editor-survey.tsx
@@ -0,0 +1,211 @@
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLFormCheckbox from '@/features/ui/components/ol/ol-form-checkbox'
+import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
+import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
+import { OLToast } from '@/features/ui/components/ol/ol-toast'
+import { OLToastContainer } from '@/features/ui/components/ol/ol-toast-container'
+import { useEditorContext } from '@/shared/context/editor-context'
+import useTutorial from '@/shared/hooks/promotions/use-tutorial'
+import { useCallback, useEffect, useMemo, useState } from 'react'
+import { sendMB } from '@/infrastructure/event-tracking'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useTranslation } from 'react-i18next'
+
+type EditorSurveyPage = 'ease-of-use' | 'meets-my-needs' | 'thank-you'
+
+export default function EditorSurvey() {
+  return (
+    <OLToastContainer className="editor-survey-toast">
+      <EditorSurveyContent />
+    </OLToastContainer>
+  )
+}
+
+const TUTORIAL_KEY = 'editor-popup-ux-survey'
+
+const EditorSurveyContent = () => {
+  const [easeOfUse, setEaseOfUse] = useState<number | null>(null)
+  const [meetsMyNeeds, setMeetsMyNeeds] = useState<number | null>(null)
+  const [page, setPage] = useState<EditorSurveyPage>('ease-of-use')
+  const { inactiveTutorials } = useEditorContext()
+  const hasCompletedSurvey = inactiveTutorials.includes(TUTORIAL_KEY)
+  const newEditor = useIsNewEditorEnabled()
+
+  const { t } = useTranslation()
+
+  const {
+    tryShowingPopup: tryShowingSurvey,
+    showPopup: showSurvey,
+    dismissTutorial: dismissSurvey,
+    completeTutorial: completeSurvey,
+  } = useTutorial(TUTORIAL_KEY, {
+    name: TUTORIAL_KEY,
+  })
+
+  useEffect(() => {
+    if (!hasCompletedSurvey) {
+      tryShowingSurvey()
+    }
+  }, [hasCompletedSurvey, tryShowingSurvey])
+
+  const onSubmit = useCallback(() => {
+    sendMB('editor-survey-submit', {
+      easeOfUse,
+      meetsMyNeeds,
+      newEditor,
+    })
+    setPage('thank-you')
+    completeSurvey({ event: 'promo-click', action: 'complete' })
+  }, [easeOfUse, meetsMyNeeds, completeSurvey, newEditor])
+
+  if (!showSurvey && page !== 'thank-you') {
+    return null
+  }
+
+  if (page === 'ease-of-use') {
+    return (
+      <OLToast
+        className="editor-survey-question-toast"
+        content={
+          <EditorSurveyQuestion
+            questionText={t('overleaf_is_easy_to_use')}
+            name="ease-of-use"
+            buttonText={t('next')}
+            onButtonClick={() => setPage('meets-my-needs')}
+            value={easeOfUse}
+            onValueChange={setEaseOfUse}
+            onDismiss={dismissSurvey}
+          />
+        }
+        type="info"
+      />
+    )
+  }
+  if (page === 'meets-my-needs') {
+    return (
+      <OLToast
+        className="editor-survey-question-toast"
+        content={
+          <EditorSurveyQuestion
+            questionText={t('overleafs_functionality_meets_my_needs')}
+            name="meets-my-needs"
+            buttonText={t('submit_title')}
+            onButtonClick={onSubmit}
+            value={meetsMyNeeds}
+            onValueChange={setMeetsMyNeeds}
+            onDismiss={dismissSurvey}
+          />
+        }
+        type="info"
+      />
+    )
+  }
+
+  return <OLToast type="info" content={t('thank_you')} autoHide delay={3000} />
+}
+
+const EditorSurveyQuestion = ({
+  onDismiss,
+  name,
+  questionText,
+  buttonText,
+  onButtonClick,
+  value,
+  onValueChange,
+}: {
+  onDismiss: () => void
+  name: string
+  questionText: string
+  buttonText: string
+  onButtonClick: () => void
+  value: number | null
+  onValueChange: (newValue: number) => void
+}) => {
+  const { t } = useTranslation()
+
+  const options = useMemo(
+    () => [
+      {
+        value: 1,
+        description: t('strongly_disagree'),
+      },
+      {
+        value: 2,
+        description: t('disagree'),
+      },
+      {
+        value: 3,
+        description: t('neither_agree_nor_disagree'),
+      },
+      {
+        value: 4,
+        description: t('agree'),
+      },
+      {
+        value: 5,
+        description: t('strongly_agree'),
+      },
+    ],
+    [t]
+  )
+
+  const onChange = useCallback(
+    (event: React.ChangeEvent<HTMLInputElement>) => {
+      const newValue = event.target.value
+      if (newValue) {
+        onValueChange(Number(newValue))
+      }
+    },
+    [onValueChange]
+  )
+
+  return (
+    <div className="editor-survey-question">
+      <div className="editor-survey-question-top-line">
+        <div>{t('your_feedback_matters_answer_two_quick_questions')}</div>
+        <OLIconButton
+          variant="ghost"
+          size="sm"
+          icon="close"
+          accessibilityLabel={t('close')}
+          onClick={onDismiss}
+        />
+      </div>
+      <div>
+        <label className="editor-survey-question-label" htmlFor={name}>
+          {questionText}
+        </label>
+        <OLForm className="editor-survey-question-form">
+          <OLFormGroup className="editor-survey-question-options">
+            {options.map(({ value: optionValue, description }) => (
+              <OLFormCheckbox
+                key={optionValue}
+                name={name}
+                type="radio"
+                value={optionValue}
+                id={optionValue.toString()}
+                label={optionValue}
+                checked={optionValue === value}
+                onChange={onChange}
+                aria-label={`${optionValue} ${description}`}
+              />
+            ))}
+          </OLFormGroup>
+        </OLForm>
+        <div className="editor-survey-option-labels">
+          <div>{t('strongly_disagree')}</div>
+          <div>{t('strongly_agree')}</div>
+        </div>
+      </div>
+      <OLButton
+        size="sm"
+        variant="secondary"
+        onClick={onButtonClick}
+        disabled={!value}
+      >
+        {buttonText}
+      </OLButton>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-react/components/editor/editor-pane.tsx b/services/web/frontend/js/features/ide-react/components/editor/editor-pane.tsx
index 77ffcd6cd4..b93a18db9f 100644
--- a/services/web/frontend/js/features/ide-react/components/editor/editor-pane.tsx
+++ b/services/web/frontend/js/features/ide-react/components/editor/editor-pane.tsx
@@ -1,23 +1,24 @@
 import { Panel, PanelGroup } from 'react-resizable-panels'
 import React, { FC, lazy, Suspense } from 'react'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import SourceEditor from '@/features/source-editor/components/source-editor'
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import { EditorScopeValue } from '@/features/ide-react/scope-adapters/editor-manager-context-adapter'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import classNames from 'classnames'
 import { LoadingPane } from '@/features/ide-react/components/editor/loading-pane'
 import { FullSizeLoadingSpinner } from '@/shared/components/loading-spinner'
 import { VerticalResizeHandle } from '@/features/ide-react/components/resize/vertical-resize-handle'
 import { useFileTreeOpenContext } from '@/features/ide-react/context/file-tree-open-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
 const SymbolPalettePane = lazy(
   () => import('@/features/ide-react/components/editor/symbol-palette-pane')
 )
 
 export const EditorPane: FC = () => {
-  const [editor] = useScopeValue<EditorScopeValue>('editor')
+  const { showSymbolPalette } = useEditorPropertiesContext()
   const { selectedEntityCount, openEntity } = useFileTreeOpenContext()
-  const { currentDocumentId, isLoading } = useEditorManagerContext()
+  const { isLoading } = useEditorManagerContext()
+  const { currentDocumentId } = useEditorOpenDocContext()
 
   if (!currentDocumentId) {
     return null
@@ -39,7 +40,7 @@ export const EditorPane: FC = () => {
           {isLoading && <LoadingPane />}
         </Panel>
 
-        {editor.showSymbolPalette && (
+        {showSymbolPalette && (
           <>
             <VerticalResizeHandle id="editor-symbol-palette" />
             <Panel
diff --git a/services/web/frontend/js/features/ide-react/components/history-root.tsx b/services/web/frontend/js/features/ide-react/components/history-root.tsx
index 07e6c5f663..c349bd0829 100644
--- a/services/web/frontend/js/features/ide-react/components/history-root.tsx
+++ b/services/web/frontend/js/features/ide-react/components/history-root.tsx
@@ -10,4 +10,6 @@ const HistoryRoot = () => (
   </HistoryProvider>
 )
 
-export default withErrorBoundary(memo(HistoryRoot), ErrorBoundaryFallback)
+export default withErrorBoundary(memo(HistoryRoot), () => (
+  <ErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/ide-react/components/ide-root.tsx b/services/web/frontend/js/features/ide-react/components/ide-root.tsx
index 874f534386..795de6c56d 100644
--- a/services/web/frontend/js/features/ide-react/components/ide-root.tsx
+++ b/services/web/frontend/js/features/ide-react/components/ide-root.tsx
@@ -15,4 +15,6 @@ const IdeRoot: FC = () => {
   )
 }
 
-export default withErrorBoundary(memo(IdeRoot), GenericErrorBoundaryFallback)
+export default withErrorBoundary(memo(IdeRoot), () => (
+  <GenericErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/ide-react/components/layout/ide-page.tsx b/services/web/frontend/js/features/ide-react/components/layout/ide-page.tsx
index fa235560e8..488d5476a7 100644
--- a/services/web/frontend/js/features/ide-react/components/layout/ide-page.tsx
+++ b/services/web/frontend/js/features/ide-react/components/layout/ide-page.tsx
@@ -10,7 +10,13 @@ import { useHasLintingError } from '@/features/ide-react/hooks/use-has-linting-e
 import { Modals } from '@/features/ide-react/components/modals/modals'
 import { GlobalAlertsProvider } from '@/features/ide-react/context/global-alerts-context'
 import { GlobalToasts } from '../global-toasts'
-import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import {
+  canUseNewEditor,
+  useIsNewEditorEnabled,
+} from '@/features/ide-redesign/utils/new-editor-utils'
+import EditorSurvey from '../editor-survey'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
+import { useStatusFavicon } from '@/features/ide-react/hooks/use-status-favicon'
 
 const MainLayoutNew = lazy(
   () => import('@/features/ide-redesign/components/main-layout')
@@ -25,8 +31,12 @@ export default function IdePage() {
   useEditingSessionHeartbeat() // send a batched event when user is active
   useRegisterUserActivity() // record activity and ensure connection when user is active
   useHasLintingError() // pass editor:lint hasLintingError to the compiler
+  useStatusFavicon() // update the favicon based on the compile status
 
   const newEditor = useIsNewEditorEnabled()
+  const canAccessNewEditor = canUseNewEditor()
+  const editorSurveyFlag = useFeatureFlag('editor-popup-ux-survey')
+  const showEditorSurvey = editorSurveyFlag && !canAccessNewEditor
 
   return (
     <GlobalAlertsProvider>
@@ -44,6 +54,7 @@ export default function IdePage() {
         </>
       )}
       <GlobalToasts />
+      {showEditorSurvey && <EditorSurvey />}
     </GlobalAlertsProvider>
   )
 }
diff --git a/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx b/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
index b0a65e12bb..93382d613a 100644
--- a/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
+++ b/services/web/frontend/js/features/ide-react/components/layout/main-layout.tsx
@@ -47,7 +47,8 @@ export const MainLayout: FC = () => {
     handlePaneExpand: handleChatExpand,
   } = useChatPane()
 
-  const chatEnabled = getMeta('ol-chatEnabled') && !isRestrictedTokenMember
+  const chatEnabled =
+    getMeta('ol-capabilities')?.includes('chat') && !isRestrictedTokenMember
 
   const { t } = useTranslation()
 
diff --git a/services/web/frontend/js/features/ide-react/components/modals/generic-confirm-modal.tsx b/services/web/frontend/js/features/ide-react/components/modals/generic-confirm-modal.tsx
index de35bee52f..fd27985ba6 100644
--- a/services/web/frontend/js/features/ide-react/components/modals/generic-confirm-modal.tsx
+++ b/services/web/frontend/js/features/ide-react/components/modals/generic-confirm-modal.tsx
@@ -25,10 +25,10 @@ function GenericConfirmModal({
   message,
   confirmLabel,
   primaryVariant = 'primary',
+  onConfirm,
   ...modalProps
 }: GenericConfirmModalProps) {
   const { t } = useTranslation()
-  const handleConfirmClick = modalProps.onConfirm
 
   return (
     <OLModal {...modalProps}>
@@ -42,7 +42,7 @@ function GenericConfirmModal({
         <OLButton variant="secondary" onClick={() => modalProps.onHide()}>
           {t('cancel')}
         </OLButton>
-        <OLButton variant={primaryVariant} onClick={handleConfirmClick}>
+        <OLButton variant={primaryVariant} onClick={onConfirm}>
           {confirmLabel || t('ok')}
         </OLButton>
       </OLModalFooter>
diff --git a/services/web/frontend/js/features/ide-react/components/resize/horizontal-resize-handle.tsx b/services/web/frontend/js/features/ide-react/components/resize/horizontal-resize-handle.tsx
index ef68b216e9..7ba48e30db 100644
--- a/services/web/frontend/js/features/ide-react/components/resize/horizontal-resize-handle.tsx
+++ b/services/web/frontend/js/features/ide-react/components/resize/horizontal-resize-handle.tsx
@@ -10,7 +10,9 @@ type HorizontalResizeHandleOwnProps = {
 }
 
 export const HorizontalResizeHandle: FC<
-  HorizontalResizeHandleOwnProps & PanelResizeHandleProps
+  React.PropsWithChildren<
+    HorizontalResizeHandleOwnProps & PanelResizeHandleProps
+  >
 > = ({ children, resizable = true, onDoubleClick, ...props }) => {
   const { t } = useTranslation()
   const [isDragging, setIsDragging] = useState(false)
diff --git a/services/web/frontend/js/features/ide-react/components/resize/horizontal-toggler.tsx b/services/web/frontend/js/features/ide-react/components/resize/horizontal-toggler.tsx
index fba41ee8d8..a5079d397a 100644
--- a/services/web/frontend/js/features/ide-react/components/resize/horizontal-toggler.tsx
+++ b/services/web/frontend/js/features/ide-react/components/resize/horizontal-toggler.tsx
@@ -1,5 +1,6 @@
 import classNames from 'classnames'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import MaterialIcon from '@/shared/components/material-icon'
 
 type HorizontalTogglerType = 'west' | 'east'
 
@@ -42,7 +43,16 @@ export function HorizontalToggler({
         aria-label={description}
         title=""
         onClick={() => setIsOpen(!isOpen)}
-      />
+      >
+        <MaterialIcon
+          type={
+            (togglerType === 'west' && isOpen) ||
+            (togglerType === 'east' && !isOpen)
+              ? 'chevron_left'
+              : 'chevron_right'
+          }
+        />
+      </button>
     </OLTooltip>
   )
 }
diff --git a/services/web/frontend/js/features/ide-react/components/unsaved-docs/unsaved-docs.tsx b/services/web/frontend/js/features/ide-react/components/unsaved-docs/unsaved-docs.tsx
index f70a550060..7f19737c90 100644
--- a/services/web/frontend/js/features/ide-react/components/unsaved-docs/unsaved-docs.tsx
+++ b/services/web/frontend/js/features/ide-react/components/unsaved-docs/unsaved-docs.tsx
@@ -1,5 +1,5 @@
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { FC, useCallback, useEffect, useRef, useState } from 'react'
 import { PermissionsLevel } from '@/features/ide-react/types/permissions'
 import { UnsavedDocsLockedAlert } from '@/features/ide-react/components/unsaved-docs/unsaved-docs-locked-alert'
@@ -12,7 +12,7 @@ const MAX_UNSAVED_SECONDS = 30 // lock the editor after this time if unsaved
 
 export const UnsavedDocs: FC = () => {
   const { openDocs, debugTimers } = useEditorManagerContext()
-  const { permissionsLevel, setPermissionsLevel } = useEditorContext()
+  const { permissionsLevel, setPermissionsLevel } = useIdeReactContext()
   const [isLocked, setIsLocked] = useState(false)
   const [unsavedDocs, setUnsavedDocs] = useState(new Map<string, number>())
   const globalAlertsContainer = useGlobalAlertsContainer()
@@ -30,7 +30,7 @@ export const UnsavedDocs: FC = () => {
   useEventListener(
     'beforeunload',
     useCallback(
-      event => {
+      (event: BeforeUnloadEvent) => {
         if (openDocs.hasUnsavedChanges()) {
           // https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
           event.preventDefault()
diff --git a/services/web/frontend/js/features/ide-react/context/command-registry-context.tsx b/services/web/frontend/js/features/ide-react/context/command-registry-context.tsx
new file mode 100644
index 0000000000..ff54c21f2a
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/context/command-registry-context.tsx
@@ -0,0 +1,188 @@
+import { isMac } from '@/shared/utils/os'
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useState,
+} from 'react'
+
+type CommandInvocationContext = {
+  location?: string
+}
+
+export type Command = {
+  label: string
+  id: string
+  handler?: (context: CommandInvocationContext) => void
+  href?: string
+  disabled?: boolean
+}
+
+const CommandRegistryContext = createContext<CommandRegistry | undefined>(
+  undefined
+)
+
+export type Shortcut = { key: string }
+
+export type Shortcuts = Record<string, Shortcut[]>
+
+type CommandRegistry = {
+  registry: Map<string, Command>
+  register: (...elements: Command[]) => void
+  unregister: (...id: string[]) => void
+  shortcuts: Shortcuts
+}
+
+export const CommandRegistryProvider: React.FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const [registry, setRegistry] = useState(new Map<string, Command>())
+  const register = useCallback((...elements: Command[]) => {
+    setRegistry(
+      registry =>
+        new Map([
+          ...registry,
+          ...elements.map(element => [element.id, element] as const),
+        ])
+    )
+  }, [])
+
+  const unregister = useCallback((...ids: string[]) => {
+    setRegistry(
+      registry => new Map([...registry].filter(([key]) => !ids.includes(key)))
+    )
+  }, [])
+
+  // NOTE: This is where we'd add functionality for customising shortcuts.
+  const shortcuts: Record<string, Shortcut[]> = useMemo(
+    () => ({
+      undo: [
+        {
+          key: 'Mod-z',
+        },
+      ],
+      redo: [
+        {
+          key: 'Mod-y',
+        },
+        {
+          key: 'Mod-Shift-Z',
+        },
+      ],
+      find: [{ key: 'Mod-f' }],
+      'select-all': [{ key: 'Mod-a' }],
+      'insert-comment': [{ key: 'Mod-Shift-C' }],
+      'format-bold': [{ key: 'Mod-b' }],
+      'format-italics': [{ key: 'Mod-i' }],
+    }),
+    []
+  )
+
+  return (
+    <CommandRegistryContext.Provider
+      value={{ registry, register, unregister, shortcuts }}
+    >
+      {children}
+    </CommandRegistryContext.Provider>
+  )
+}
+
+export const useCommandRegistry = (): CommandRegistry => {
+  const context = useContext(CommandRegistryContext)
+  if (!context) {
+    throw new Error(
+      'useCommandRegistry must be used within a CommandRegistryProvider'
+    )
+  }
+  return context
+}
+
+function parseShortcut(shortcut: Shortcut) {
+  // Based on KeyBinding type of CodeMirror 6
+  let alt = false
+  let ctrl = false
+  let shift = false
+  let meta = false
+
+  let character = null
+  // isMac ? shortcut.mac : shortcut.key etc.
+  const shortcutString = shortcut.key ?? ''
+  const keys = shortcutString.split(/-(?!$)/) ?? []
+
+  for (let i = 0; i < keys.length; i++) {
+    const isLast = i === keys.length - 1
+    const key = keys[i]
+    if (!key) {
+      throw new Error('Empty key in shortcut: ' + shortcutString)
+    }
+    if (key === 'Alt' || (!isLast && key === 'a')) {
+      alt = true
+    } else if (
+      key === 'Ctrl' ||
+      key === 'Control' ||
+      (!isLast && key === 'c')
+    ) {
+      ctrl = true
+    } else if (key === 'Shift' || (!isLast && key === 's')) {
+      shift = true
+    } else if (key === 'Meta' || key === 'Cmd' || (!isLast && key === 'm')) {
+      meta = true
+    } else if (key === 'Mod') {
+      if (isMac) {
+        meta = true
+      } else {
+        ctrl = true
+      }
+    } else {
+      if (key === 'Space') {
+        character = ' '
+      }
+      if (!isLast) {
+        throw new Error(
+          'Character key must be last in shortcut: ' + shortcutString
+        )
+      }
+      if (key.length !== 1) {
+        throw new Error(`Invalid key '${key}' in shortcut: ${shortcutString}`)
+      }
+      if (character) {
+        throw new Error('Multiple characters in shortcut: ' + shortcutString)
+      }
+      character = key
+    }
+  }
+  if (!character) {
+    throw new Error('No character in shortcut: ' + shortcutString)
+  }
+
+  return {
+    alt,
+    ctrl,
+    shift,
+    meta,
+    character,
+  }
+}
+
+export const formatShortcut = (shortcut: Shortcut): string => {
+  const { alt, ctrl, shift, meta, character } = parseShortcut(shortcut)
+
+  if (isMac) {
+    return [
+      ctrl ? '⌃' : '',
+      alt ? '⌥' : '',
+      shift ? '⇧' : '',
+      meta ? '⌘' : '',
+      character.toUpperCase(),
+    ].join('')
+  }
+
+  return [
+    ctrl ? 'Ctrl' : '',
+    shift ? 'Shift' : '',
+    meta ? 'Meta' : '',
+    alt ? 'Alt' : '',
+    character.toUpperCase(),
+  ].join(' ')
+}
diff --git a/services/web/frontend/js/features/ide-react/context/connection-context.tsx b/services/web/frontend/js/features/ide-react/context/connection-context.tsx
index 8cffc2485e..cb2b24d737 100644
--- a/services/web/frontend/js/features/ide-react/context/connection-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/connection-context.tsx
@@ -36,7 +36,9 @@ export const ConnectionContext = createContext<
   ConnectionContextValue | undefined
 >(undefined)
 
-export const ConnectionProvider: FC = ({ children }) => {
+export const ConnectionProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const location = useLocation()
 
   const [connectionManager] = useState(() => new ConnectionManager())
diff --git a/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx b/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
index cc82723aa1..fcc430dcdb 100644
--- a/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/editor-manager-context.tsx
@@ -9,8 +9,6 @@ import {
   useState,
 } from 'react'
 import { sendMB } from '@/infrastructure/event-tracking'
-import useScopeValue from '@/shared/hooks/use-scope-value'
-import { useIdeContext } from '@/shared/context/ide-context'
 import { OpenDocuments } from '@/features/ide-react/editor/open-documents'
 import EditorWatchdogManager from '@/features/ide-react/connection/editor-watchdog-manager'
 import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
@@ -18,6 +16,7 @@ import { useConnectionContext } from '@/features/ide-react/context/connection-co
 import { debugConsole } from '@/utils/debugging'
 import { DocumentContainer } from '@/features/ide-react/editor/document-container'
 import { useLayoutContext } from '@/shared/context/layout-context'
+import { useUserContext } from '@/shared/context/user-context'
 import { GotoLineOptions } from '@/features/ide-react/types/goto-line-options'
 import { Doc } from '../../../../../types/doc'
 import { useFileTreeData } from '@/shared/context/file-tree-data-context'
@@ -34,10 +33,9 @@ import { EditorType } from '@/features/ide-react/editor/types/editor-type'
 import { DocId } from '../../../../../types/project-settings'
 import { Update } from '@/features/history/services/types/update'
 import { useDebugDiffTracker } from '../hooks/use-debug-diff-tracker'
-import { useEditorContext } from '@/shared/context/editor-context'
-import useScopeValueSetterOnly from '@/shared/hooks/use-scope-value-setter-only'
-import { BinaryFile } from '@/features/file-view/types/binary-file'
 import { convertFileRefToBinaryFile } from '@/features/ide-react/util/file-view'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
 export interface GotoOffsetOptions {
   gotoOffset: number
@@ -53,9 +51,6 @@ interface OpenDocOptions
 
 export type EditorManager = {
   getEditorType: () => EditorType | null
-  showSymbolPalette: boolean
-  currentDocument: DocumentContainer | null
-  currentDocumentId: DocId | null
   getCurrentDocValue: () => string | null
   getCurrentDocumentId: () => DocId | null
   setIgnoringExternalUpdates: (value: boolean) => void
@@ -64,15 +59,8 @@ export type EditorManager = {
   openDocs: OpenDocuments
   openFileWithId: (fileId: string) => void
   openInitialDoc: (docId: string) => void
-  openDocName: string | null
-  setOpenDocName: (openDocName: string) => void
   isLoading: boolean
-  trackChanges: boolean
   jumpToLine: (options: GotoLineOptions) => void
-  wantTrackChanges: boolean
-  setWantTrackChanges: React.Dispatch<
-    React.SetStateAction<EditorManager['wantTrackChanges']>
-  >
   debugTimers: React.MutableRefObject<Record<string, number>>
 }
 
@@ -88,37 +76,33 @@ export const EditorManagerContext = createContext<EditorManager | undefined>(
   undefined
 )
 
-export const EditorManagerProvider: FC = ({ children }) => {
+export const EditorManagerProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { t } = useTranslation()
-  const { scopeStore } = useIdeContext()
-  const { reportError, eventEmitter, projectId } = useIdeReactContext()
-  const { setOutOfSync } = useEditorContext()
+  const { reportError, eventEmitter, projectId, setOutOfSync } =
+    useIdeReactContext()
   const { socket, closeConnection, connectionState } = useConnectionContext()
-  const { view, setView } = useLayoutContext()
+  const { view, setView, setOpenFile } = useLayoutContext()
   const { showGenericMessageModal, genericModalVisible, showOutOfSyncModal } =
     useModalsContext()
-
-  const [showSymbolPalette, setShowSymbolPalette] = useScopeValue<boolean>(
-    'editor.showSymbolPalette'
-  )
-  const [showVisual] = useScopeValue<boolean>('editor.showVisual')
-  const [currentDocument, setCurrentDocument] =
-    useScopeValue<DocumentContainer | null>('editor.sharejs_doc')
-  const [currentDocumentId, setCurrentDocumentId] = useScopeValue<DocId | null>(
-    'editor.open_doc_id'
-  )
-  const [openDocName, setOpenDocName] = useScopeValue<string | null>(
-    'editor.open_doc_name'
-  )
-  const [opening, setOpening] = useScopeValue<boolean>('editor.opening')
-  const [errorState, setIsInErrorState] =
-    useScopeValue<boolean>('editor.error_state')
-  const [trackChanges, setTrackChanges] = useScopeValue<boolean>(
-    'editor.trackChanges'
-  )
-  const [wantTrackChanges, setWantTrackChanges] = useScopeValue<boolean>(
-    'editor.wantTrackChanges'
-  )
+  const { id: userId } = useUserContext()
+  const {
+    showVisual,
+    opening,
+    setOpening,
+    errorState,
+    setErrorState,
+    setTrackChanges,
+    wantTrackChanges,
+  } = useEditorPropertiesContext()
+  const {
+    currentDocumentId,
+    setCurrentDocumentId,
+    setOpenDocName,
+    currentDocument,
+    setCurrentDocument,
+  } = useEditorOpenDocContext()
 
   const wantTrackChangesRef = useRef(wantTrackChanges)
   useEffect(() => {
@@ -194,22 +178,6 @@ export const EditorManagerProvider: FC = ({ children }) => {
 
   const editorOpenDocEpochRef = useRef(0)
 
-  // TODO: This looks dodgy because it wraps a state setter and is itself
-  // stored in React state in the scope store. The problem is that it needs to
-  // be exposed via the scope store because some components access it that way;
-  // it would be better to simply access it from a context, but the current
-  // implementation in EditorManager interacts with Angular scope to update
-  // the layout. Once Angular is gone, this can become a context method.
-  useEffect(() => {
-    scopeStore.set('editor.toggleSymbolPalette', () => {
-      setShowSymbolPalette(show => {
-        const newValue = !show
-        sendMB(newValue ? 'symbol-palette-show' : 'symbol-palette-hide')
-        return newValue
-      })
-    })
-  }, [scopeStore, setShowSymbolPalette])
-
   const getEditorType = useCallback((): EditorType | null => {
     if (!currentDocument) {
       return null
@@ -307,7 +275,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
       const tryToggle = () => {
         const saved = doc.getInflightOp() == null && doc.getPendingOp() == null
         if (saved) {
-          doc.setTrackingChanges(want)
+          doc.setTrackChangesUserId(want ? userId : null)
           setTrackChanges(want)
         } else {
           syncTimeoutRef.current = window.setTimeout(tryToggle, 100)
@@ -316,7 +284,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
 
       tryToggle()
     },
-    [setTrackChanges]
+    [setTrackChanges, userId]
   )
 
   const doOpenNewDocument = useCallback(
@@ -517,8 +485,6 @@ export const EditorManagerProvider: FC = ({ children }) => {
     [fileTreeData, openDoc]
   )
 
-  const [, setOpenFile] = useScopeValueSetterOnly<BinaryFile | null>('openFile')
-
   const openFileWithId = useCallback(
     (fileRefId: string) => {
       const fileRef = findFileRefEntityById(fileTreeData, fileRefId)
@@ -580,7 +546,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
         editorContent =
           typeof editorContent === 'string'
             ? editorContent
-            : document.doc?._doc.snapshot
+            : document.getSnapshot()
 
         // Tear down the ShareJsDoc.
         if (document.doc) document.doc.clearInflightAndPendingOps()
@@ -592,7 +558,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
         reportError(error, meta)
 
         // Tell the user about the error state.
-        setIsInErrorState(true)
+        setErrorState(true)
         // Ensure that the editor is locked
         setOutOfSync(true)
         // Display the "out of sync" modal
@@ -619,7 +585,7 @@ export const EditorManagerProvider: FC = ({ children }) => {
     eventEmitter,
     openDoc,
     reportError,
-    setIsInErrorState,
+    setErrorState,
     showGenericMessageModal,
     showOutOfSyncModal,
     setOutOfSync,
@@ -666,31 +632,20 @@ export const EditorManagerProvider: FC = ({ children }) => {
   const value: EditorManager = useMemo(
     () => ({
       getEditorType,
-      showSymbolPalette,
-      currentDocument,
-      currentDocumentId,
       getCurrentDocValue,
       getCurrentDocumentId,
       setIgnoringExternalUpdates,
       openDocWithId,
       openDoc,
       openDocs,
-      openDocName,
-      setOpenDocName,
-      trackChanges,
       isLoading,
       openFileWithId,
       openInitialDoc,
       jumpToLine,
-      wantTrackChanges,
-      setWantTrackChanges,
       debugTimers,
     }),
     [
       getEditorType,
-      showSymbolPalette,
-      currentDocument,
-      currentDocumentId,
       getCurrentDocValue,
       getCurrentDocumentId,
       setIgnoringExternalUpdates,
@@ -699,13 +654,8 @@ export const EditorManagerProvider: FC = ({ children }) => {
       openDocs,
       openFileWithId,
       openInitialDoc,
-      openDocName,
-      setOpenDocName,
-      trackChanges,
       isLoading,
       jumpToLine,
-      wantTrackChanges,
-      setWantTrackChanges,
       debugTimers,
     ]
   )
diff --git a/services/web/frontend/js/features/ide-react/context/editor-open-doc-context.tsx b/services/web/frontend/js/features/ide-react/context/editor-open-doc-context.tsx
new file mode 100644
index 0000000000..61de80dfde
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/context/editor-open-doc-context.tsx
@@ -0,0 +1,66 @@
+import {
+  createContext,
+  Dispatch,
+  FC,
+  PropsWithChildren,
+  SetStateAction,
+  useContext,
+  useState,
+} from 'react'
+import { DocId } from '../../../../../types/project-settings'
+import useExposedState from '@/shared/hooks/use-exposed-state'
+import { DocumentContainer } from '@/features/ide-react/editor/document-container'
+
+export interface EditorOpenDocContextState {
+  currentDocumentId: DocId | null
+  openDocName: string | null
+  currentDocument: DocumentContainer | null
+}
+
+interface EditorOpenDocContextValue extends EditorOpenDocContextState {
+  setCurrentDocumentId: Dispatch<SetStateAction<DocId | null>>
+  setOpenDocName: Dispatch<SetStateAction<string | null>>
+  setCurrentDocument: Dispatch<SetStateAction<DocumentContainer | null>>
+}
+
+export const EditorOpenDocContext = createContext<
+  EditorOpenDocContextValue | undefined
+>(undefined)
+
+export const EditorOpenDocProvider: FC<PropsWithChildren> = ({ children }) => {
+  const [currentDocumentId, setCurrentDocumentId] =
+    useExposedState<DocId | null>(null, 'editor.open_doc_id')
+  const [openDocName, setOpenDocName] = useExposedState<string | null>(
+    null,
+    'editor.open_doc_name'
+  )
+  const [currentDocument, setCurrentDocument] =
+    useState<DocumentContainer | null>(null)
+
+  const value = {
+    currentDocumentId,
+    setCurrentDocumentId,
+    openDocName,
+    setOpenDocName,
+    currentDocument,
+    setCurrentDocument,
+  }
+
+  return (
+    <EditorOpenDocContext.Provider value={value}>
+      {children}
+    </EditorOpenDocContext.Provider>
+  )
+}
+
+export const useEditorOpenDocContext = (): EditorOpenDocContextValue => {
+  const context = useContext(EditorOpenDocContext)
+
+  if (!context) {
+    throw new Error(
+      'useEditorOpenDocContext is only available inside EditorOpenDocContext.Provider'
+    )
+  }
+
+  return context
+}
diff --git a/services/web/frontend/js/features/ide-react/context/editor-properties-context.tsx b/services/web/frontend/js/features/ide-react/context/editor-properties-context.tsx
new file mode 100644
index 0000000000..e8fb82efa1
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/context/editor-properties-context.tsx
@@ -0,0 +1,114 @@
+import {
+  createContext,
+  Dispatch,
+  FC,
+  PropsWithChildren,
+  SetStateAction,
+  useCallback,
+  useContext,
+  useState,
+} from 'react'
+import customLocalStorage from '@/infrastructure/local-storage'
+import usePersistedState from '@/shared/hooks/use-persisted-state'
+import getMeta from '@/utils/meta'
+import { useUnstableStoreSync } from '@/shared/hooks/use-unstable-store-sync'
+import { sendMB } from '@/infrastructure/event-tracking'
+
+// Context value type
+export type EditorPropertiesContextValue = {
+  showVisual: boolean
+  setShowVisual: Dispatch<SetStateAction<boolean>>
+  showSymbolPalette: boolean
+  setShowSymbolPalette: Dispatch<SetStateAction<boolean>>
+  toggleSymbolPalette: () => void
+  opening: boolean
+  setOpening: Dispatch<SetStateAction<boolean>>
+  trackChanges: boolean
+  setTrackChanges: Dispatch<SetStateAction<boolean>>
+  wantTrackChanges: boolean
+  setWantTrackChanges: Dispatch<SetStateAction<boolean>>
+  errorState: boolean
+  setErrorState: Dispatch<SetStateAction<boolean>>
+}
+
+export const EditorPropertiesContext = createContext<
+  EditorPropertiesContextValue | undefined
+>(undefined)
+
+function showVisualFallbackValue() {
+  const projectId = getMeta('ol-project_id')
+  const editorModeKey = `editor.mode.${projectId}`
+  const editorModeVal = customLocalStorage.getItem(editorModeKey)
+
+  if (editorModeVal) {
+    // clean up the old key
+    customLocalStorage.removeItem(editorModeKey)
+  }
+
+  return editorModeVal === 'rich-text'
+}
+
+export const EditorPropertiesProvider: FC<PropsWithChildren> = ({
+  children,
+}) => {
+  const [showVisual, setShowVisual] = usePersistedState(
+    `editor.lastUsedMode`,
+    showVisualFallbackValue(),
+    {
+      converter: {
+        toPersisted: showVisual => (showVisual ? 'visual' : 'code'),
+        fromPersisted: mode => mode === 'visual',
+      },
+    }
+  )
+
+  // Sync the showVisual state with the exposed store
+  useUnstableStoreSync('editor.showVisual', showVisual)
+
+  const [showSymbolPalette, setShowSymbolPalette] = useState(false)
+
+  const toggleSymbolPalette = useCallback(() => {
+    setShowSymbolPalette(show => {
+      const newValue = !show
+      sendMB(newValue ? 'symbol-palette-show' : 'symbol-palette-hide')
+      return newValue
+    })
+  }, [setShowSymbolPalette])
+
+  const [opening, setOpening] = useState(true)
+  const [trackChanges, setTrackChanges] = useState(false)
+  const [wantTrackChanges, setWantTrackChanges] = useState(false)
+  const [errorState, setErrorState] = useState(false)
+
+  const value = {
+    showVisual,
+    setShowVisual,
+    showSymbolPalette,
+    setShowSymbolPalette,
+    toggleSymbolPalette,
+    opening,
+    setOpening,
+    trackChanges,
+    setTrackChanges,
+    wantTrackChanges,
+    setWantTrackChanges,
+    errorState,
+    setErrorState,
+  }
+
+  return (
+    <EditorPropertiesContext.Provider value={value}>
+      {children}
+    </EditorPropertiesContext.Provider>
+  )
+}
+
+export const useEditorPropertiesContext = (): EditorPropertiesContextValue => {
+  const context = useContext(EditorPropertiesContext)
+  if (!context) {
+    throw new Error(
+      'useEditorPropertiesContext is only available inside EditorPropertiesContext.Provider'
+    )
+  }
+  return context
+}
diff --git a/services/web/frontend/js/features/ide-react/context/editor-view-context.tsx b/services/web/frontend/js/features/ide-react/context/editor-view-context.tsx
new file mode 100644
index 0000000000..e6bc055afc
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/context/editor-view-context.tsx
@@ -0,0 +1,49 @@
+import {
+  createContext,
+  Dispatch,
+  FC,
+  PropsWithChildren,
+  SetStateAction,
+  useContext,
+} from 'react'
+import { EditorView } from '@codemirror/view'
+import useExposedState from '@/shared/hooks/use-exposed-state'
+
+export type EditorContextValue = {
+  view: EditorView | null
+  setView: Dispatch<SetStateAction<EditorView | null>>
+}
+
+// This provides access to the CodeMirror EditorView instance outside the editor
+// component itself, including external extensions (in particular, Writefull)
+export const EditorViewContext = createContext<EditorContextValue | undefined>(
+  undefined
+)
+
+export const EditorViewProvider: FC<PropsWithChildren> = ({ children }) => {
+  const [view, setView] = useExposedState<EditorView | null>(
+    null,
+    'editor.view'
+  )
+
+  const value = {
+    view,
+    setView,
+  }
+
+  return (
+    <EditorViewContext.Provider value={value}>
+      {children}
+    </EditorViewContext.Provider>
+  )
+}
+
+export const useEditorViewContext = (): EditorContextValue => {
+  const context = useContext(EditorViewContext)
+  if (!context) {
+    throw new Error(
+      'useEditorViewContext is only available inside EditorViewProvider'
+    )
+  }
+  return context
+}
diff --git a/services/web/frontend/js/features/ide-react/context/file-tree-open-context.tsx b/services/web/frontend/js/features/ide-react/context/file-tree-open-context.tsx
index eec94f5d99..8c9078514c 100644
--- a/services/web/frontend/js/features/ide-react/context/file-tree-open-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/file-tree-open-context.tsx
@@ -11,8 +11,7 @@ import {
 import { useProjectContext } from '@/shared/context/project-context'
 import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import useScopeValueSetterOnly from '@/shared/hooks/use-scope-value-setter-only'
-import { BinaryFile } from '@/features/file-view/types/binary-file'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import {
   FileTreeDocumentFindResult,
   FileTreeFileRefFindResult,
@@ -22,6 +21,7 @@ import { debugConsole } from '@/utils/debugging'
 import { convertFileRefToBinaryFile } from '@/features/ide-react/util/file-view'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { FileRef } from '../../../../../types/file-ref'
+import { useLayoutContext } from '@/shared/context/layout-context'
 
 const FileTreeOpenContext = createContext<
   | {
@@ -36,12 +36,16 @@ const FileTreeOpenContext = createContext<
   | undefined
 >(undefined)
 
-export const FileTreeOpenProvider: FC = ({ children }) => {
-  const { rootDocId, owner } = useProjectContext()
+export const FileTreeOpenProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const { project } = useProjectContext()
+  const rootDocId = project?.rootDocId
+  const projectOwner = project?.owner?._id
   const { eventEmitter, projectJoined } = useIdeReactContext()
-  const { openDocWithId, currentDocumentId, openInitialDoc } =
-    useEditorManagerContext()
-  const [, setOpenFile] = useScopeValueSetterOnly<BinaryFile | null>('openFile')
+  const { openDocWithId, openInitialDoc } = useEditorManagerContext()
+  const { currentDocumentId } = useEditorOpenDocContext()
+  const { setOpenFile } = useLayoutContext()
   const [openEntity, setOpenEntity] = useState<
     FileTreeDocumentFindResult | FileTreeFileRefFindResult | null
   >(null)
@@ -79,7 +83,7 @@ export const FileTreeOpenProvider: FC = ({ children }) => {
         openDocWithId(selected.entity._id, { keepCurrentView: true })
         if (selected.entity.name.endsWith('.bib')) {
           sendMB('open-bib-file', {
-            projectOwner: owner._id,
+            projectOwner,
             isSampleFile: selected.entity.name === 'sample.bib',
             linkedFileProvider: null,
           })
@@ -94,7 +98,7 @@ export const FileTreeOpenProvider: FC = ({ children }) => {
       if (openFile) {
         if (selected?.entity?.name?.endsWith('.bib')) {
           sendMB('open-bib-file', {
-            projectOwner: owner._id,
+            projectOwner,
             isSampleFile: false,
             linkedFileProvider: (selected.entity as FileRef).linkedFileData
               ?.provider,
@@ -103,7 +107,7 @@ export const FileTreeOpenProvider: FC = ({ children }) => {
         window.dispatchEvent(new CustomEvent('file-view:file-opened'))
       }
     },
-    [fileTreeReady, setOpenFile, openDocWithId, owner]
+    [fileTreeReady, setOpenFile, openDocWithId, projectOwner]
   )
 
   const handleFileTreeDelete = useCallback(
diff --git a/services/web/frontend/js/features/ide-react/context/global-alerts-context.tsx b/services/web/frontend/js/features/ide-react/context/global-alerts-context.tsx
index d2dfefd8c0..52b67c2e11 100644
--- a/services/web/frontend/js/features/ide-react/context/global-alerts-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/global-alerts-context.tsx
@@ -4,7 +4,9 @@ const GlobalAlertsContext = createContext<HTMLDivElement | null | undefined>(
   undefined
 )
 
-export const GlobalAlertsProvider: FC = ({ children }) => {
+export const GlobalAlertsProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [globalAlertsContainer, setGlobalAlertsContainer] =
     useState<HTMLDivElement | null>(null)
 
diff --git a/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx b/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
index 313989903a..cad238f53c 100644
--- a/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/ide-react-context.tsx
@@ -8,7 +8,6 @@ import React, {
   useCallback,
 } from 'react'
 import { ReactScopeValueStore } from '@/features/ide-react/scope-value-store/react-scope-value-store'
-import populateLayoutScope from '@/features/ide-react/scope-adapters/layout-context-adapter'
 import { IdeProvider } from '@/shared/context/ide-context'
 import {
   createIdeEventEmitter,
@@ -16,11 +15,12 @@ import {
 } from '@/features/ide-react/create-ide-event-emitter'
 import { JoinProjectPayload } from '@/features/ide-react/connection/join-project-payload'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
-import { getMockIde } from '@/shared/context/mock/mock-ide'
-import { populateEditorScope } from '@/features/ide-react/scope-adapters/editor-manager-context-adapter'
 import { postJSON } from '@/infrastructure/fetch-json'
 import { ReactScopeEventEmitter } from '@/features/ide-react/scope-event-emitter/react-scope-event-emitter'
 import getMeta from '@/utils/meta'
+import { type PermissionsLevel } from '@/features/ide-react/types/permissions'
+import { useProjectContext } from '@/shared/context/project-context'
+import { ProjectMetadata } from '@/shared/context/types/project-metadata'
 
 const LOADED_AT = new Date()
 
@@ -33,58 +33,31 @@ type IdeReactContextValue = {
   >
   reportError: (error: any, meta?: Record<string, any>) => void
   projectJoined: boolean
+  permissionsLevel: PermissionsLevel
+  setPermissionsLevel: (permissionsLevel: PermissionsLevel) => void
+  setOutOfSync: (value: boolean) => void
 }
 
 export const IdeReactContext = createContext<IdeReactContextValue | undefined>(
   undefined
 )
 
-function populateIdeReactScope(store: ReactScopeValueStore) {
-  store.set('settings', {})
-  store.set('sync_tex_error', false)
-}
-
-function populateProjectScope(store: ReactScopeValueStore) {
-  store.allowNonExistentPath('project', true)
-  store.set('permissionsLevel', 'readOnly')
-  store.set('permissions', {
-    read: true,
-    write: false,
-    admin: false,
-    comment: true,
-  })
-}
-
-function populatePdfScope(store: ReactScopeValueStore) {
-  store.allowNonExistentPath('pdf', true)
-}
-
-export function createReactScopeValueStore(projectId: string) {
-  const scopeStore = new ReactScopeValueStore()
-
-  // Populate the scope value store with default values that will be used by
-  // nested contexts that refer to scope values. The ideal would be to leave
-  // initialization of store values up to the nested context, which would keep
-  // initialization code together with the context and would only populate
-  // necessary values in the store, but this is simpler for now
-  populateIdeReactScope(scopeStore)
-  populateEditorScope(scopeStore, projectId)
-  populateLayoutScope(scopeStore)
-  populateProjectScope(scopeStore)
-  populatePdfScope(scopeStore)
-
-  scopeStore.allowNonExistentPath('hasLintingError')
-
-  return scopeStore
-}
-
-export const IdeReactProvider: FC = ({ children }) => {
+export const IdeReactProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const projectId = getMeta('ol-project_id')
-  const [scopeStore] = useState(() => createReactScopeValueStore(projectId))
   const [eventEmitter] = useState(createIdeEventEmitter)
+  const [permissionsLevel, setPermissionsLevel] =
+    useState<PermissionsLevel>('readOnly')
+  const [outOfSync, setOutOfSync] = useState(false)
   const [scopeEventEmitter] = useState(
     () => new ReactScopeEventEmitter(eventEmitter)
   )
+  const [unstableStore] = useState(() => {
+    const store = new ReactScopeValueStore()
+    // Add dummy editor.ready key for Writefull, that relies on this calling
+    // back once after watching it
+    store.set('editor.ready', undefined)
+    return store
+  })
   const [startedFreeTrial, setStartedFreeTrial] = useState(false)
   const release = getMeta('ol-ExposedSettings')?.sentryRelease ?? null
 
@@ -93,6 +66,8 @@ export const IdeReactProvider: FC = ({ children }) => {
   const [projectJoined, setProjectJoined] = useState(false)
 
   const { socket, getSocketDebuggingInfo } = useConnectionContext()
+  const { joinProject, project } = useProjectContext()
+  const spellCheckLanguage = project?.spellCheckLanguage
 
   const reportError = useCallback(
     (error: any, meta?: Record<string, any>) => {
@@ -104,7 +79,7 @@ export const IdeReactProvider: FC = ({ children }) => {
         performance_now: performance.now(),
         release,
         client_load: LOADED_AT,
-        spellCheckLanguage: scopeStore.get('project.spellCheckLanguage'),
+        spellCheckLanguage,
         ...getSocketDebuggingInfo(),
       }
 
@@ -123,65 +98,77 @@ export const IdeReactProvider: FC = ({ children }) => {
         },
       })
     },
-    [release, projectId, getSocketDebuggingInfo, scopeStore]
+    [release, projectId, getSocketDebuggingInfo, spellCheckLanguage]
   )
 
   // Populate scope values when joining project, then fire project:joined event
   useEffect(() => {
     function handleJoinProjectResponse({
-      project,
+      project: {
+        rootDoc_id: rootDocId,
+        publicAccesLevel: publicAccessLevel,
+        ..._project
+      },
       permissionsLevel,
     }: JoinProjectPayload) {
-      scopeStore.set('project', { rootDoc_id: null, ...project })
-      scopeStore.set('permissionsLevel', permissionsLevel)
-      // Make watchers update immediately
-      scopeStore.flushUpdates()
+      const project = { ..._project, rootDocId, publicAccessLevel }
+
+      // Cast the project from the payload as ProjectMetadata to ensure it has
+      // the correct type for the context. It must be close enough because the
+      // data structure hasn't changed and it worked previously. This type
+      // coercion was previously sidestepped by adding the project to the scope
+      // store, which does not enforce types.
+      joinProject(project as unknown as ProjectMetadata)
+
+      setPermissionsLevel(permissionsLevel)
       eventEmitter.emit('project:joined', { project, permissionsLevel })
       setProjectJoined(true)
     }
 
-    function handleMainBibliographyDocUpdated(payload: string) {
-      scopeStore.set('project.mainBibliographyDoc_id', payload)
-    }
-
     socket.on('joinProjectResponse', handleJoinProjectResponse)
-    socket.on('mainBibliographyDocUpdated', handleMainBibliographyDocUpdated)
 
     return () => {
       socket.removeListener('joinProjectResponse', handleJoinProjectResponse)
-      socket.removeListener(
-        'mainBibliographyDocUpdated',
-        handleMainBibliographyDocUpdated
-      )
     }
-  }, [socket, eventEmitter, scopeStore])
+  }, [socket, eventEmitter, joinProject])
 
   const ide = useMemo(() => {
     return {
-      ...getMockIde(),
+      _id: projectId,
       socket,
       reportError,
     }
-  }, [socket, reportError])
+  }, [projectId, socket, reportError])
 
   const value = useMemo(
     () => ({
       eventEmitter,
       startedFreeTrial,
       setStartedFreeTrial,
+      permissionsLevel: outOfSync ? 'readOnly' : permissionsLevel,
+      setPermissionsLevel,
+      setOutOfSync,
       projectId,
       reportError,
       projectJoined,
     }),
-    [eventEmitter, projectId, projectJoined, reportError, startedFreeTrial]
+    [
+      eventEmitter,
+      outOfSync,
+      permissionsLevel,
+      projectId,
+      projectJoined,
+      reportError,
+      startedFreeTrial,
+    ]
   )
 
   return (
     <IdeReactContext.Provider value={value}>
       <IdeProvider
         ide={ide}
-        scopeStore={scopeStore}
         scopeEventEmitter={scopeEventEmitter}
+        unstableStore={unstableStore}
       >
         {children}
       </IdeProvider>
diff --git a/services/web/frontend/js/features/ide-react/context/ide-redesign-switcher-context.tsx b/services/web/frontend/js/features/ide-react/context/ide-redesign-switcher-context.tsx
index 464812d663..6eb8cd6d0b 100644
--- a/services/web/frontend/js/features/ide-react/context/ide-redesign-switcher-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/ide-redesign-switcher-context.tsx
@@ -16,7 +16,9 @@ export const IdeRedesignSwitcherContext = createContext<
   IdeRedesignSwitcherContextValue | undefined
 >(undefined)
 
-export const IdeRedesignSwitcherProvider: FC = ({ children }) => {
+export const IdeRedesignSwitcherProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [showSwitcherModal, setShowSwitcherModal] = useState(false)
 
   return (
diff --git a/services/web/frontend/js/features/ide-react/context/metadata-context.tsx b/services/web/frontend/js/features/ide-react/context/metadata-context.tsx
index c1e9d14502..f8aeec6ca9 100644
--- a/services/web/frontend/js/features/ide-react/context/metadata-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/metadata-context.tsx
@@ -10,10 +10,9 @@ import {
 } from 'react'
 import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import { getJSON, postJSON } from '@/infrastructure/fetch-json'
 import { useOnlineUsersContext } from '@/features/ide-react/context/online-users-context'
-import { useEditorContext } from '@/shared/context/editor-context'
 import useSocketListener from '@/features/ide-react/hooks/use-socket-listener'
 import useEventListener from '@/shared/hooks/use-event-listener'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
@@ -47,14 +46,13 @@ export const MetadataContext = createContext<
   | undefined
 >(undefined)
 
-export const MetadataProvider: FC = ({ children }) => {
+export const MetadataProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const { t } = useTranslation()
-  const { eventEmitter, projectId } = useIdeReactContext()
+  const { eventEmitter, permissionsLevel, projectId } = useIdeReactContext()
   const { socket } = useConnectionContext()
   const { onlineUsersCount } = useOnlineUsersContext()
-  const { permissionsLevel } = useEditorContext()
   const permissions = usePermissionsContext()
-  const { currentDocument } = useEditorManagerContext()
+  const { currentDocument } = useEditorOpenDocContext()
   const { showGenericMessageModal } = useModalsContext()
 
   const [documents, setDocuments] = useState<DocumentsMetadata>({})
diff --git a/services/web/frontend/js/features/ide-react/context/modals-context.tsx b/services/web/frontend/js/features/ide-react/context/modals-context.tsx
index 097ce37120..a00b676262 100644
--- a/services/web/frontend/js/features/ide-react/context/modals-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/modals-context.tsx
@@ -30,7 +30,9 @@ type ModalsContextValue = {
 
 const ModalsContext = createContext<ModalsContextValue | undefined>(undefined)
 
-export const ModalsContextProvider: FC = ({ children }) => {
+export const ModalsContextProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [showGenericModal, setShowGenericModal] = useState(false)
   const [showConfirmModal, setShowConfirmModal] = useState(false)
   const [genericMessageModalData, setGenericMessageModalData] =
diff --git a/services/web/frontend/js/features/ide-react/context/online-users-context.tsx b/services/web/frontend/js/features/ide-react/context/online-users-context.tsx
index baae763633..84a1b7d71f 100644
--- a/services/web/frontend/js/features/ide-react/context/online-users-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/online-users-context.tsx
@@ -18,7 +18,7 @@ import useSocketListener from '@/features/ide-react/hooks/use-socket-listener'
 import { debugConsole } from '@/utils/debugging'
 import { IdeEvents } from '@/features/ide-react/create-ide-event-emitter'
 import { getHueForUserId } from '@/shared/utils/colors'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 
 export type OnlineUser = {
   id: string
@@ -65,10 +65,12 @@ export const OnlineUsersContext = createContext<
   OnlineUsersContextValue | undefined
 >(undefined)
 
-export const OnlineUsersProvider: FC = ({ children }) => {
+export const OnlineUsersProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { eventEmitter } = useIdeReactContext()
   const { socket } = useConnectionContext()
-  const { currentDocumentId } = useEditorManagerContext()
+  const { currentDocumentId } = useEditorOpenDocContext()
   const { fileTreeData } = useFileTreeData()
 
   const [onlineUsers, setOnlineUsers] = useState<Record<string, OnlineUser>>({})
@@ -93,7 +95,7 @@ export const OnlineUsersProvider: FC = ({ children }) => {
       for (const [clientId, user] of Object.entries(onlineUsers)) {
         const decoratedUser = { ...user }
         const docId = user.doc_id
-        if (docId) {
+        if (docId && fileTreeData) {
           decoratedUser.doc = findDocEntityById(fileTreeData, docId)
         }
 
diff --git a/services/web/frontend/js/features/ide-react/context/outline-context.tsx b/services/web/frontend/js/features/ide-react/context/outline-context.tsx
index 41c2c7b0f1..40c2cb1928 100644
--- a/services/web/frontend/js/features/ide-react/context/outline-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/outline-context.tsx
@@ -14,7 +14,7 @@ import * as eventTracking from '@/infrastructure/event-tracking'
 import { isValidTeXFile } from '@/main/is-valid-tex-file'
 import localStorage from '@/infrastructure/local-storage'
 import { useProjectContext } from '@/shared/context/project-context'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 
 export type PartialFlatOutline = {
   level: number
@@ -42,7 +42,7 @@ const OutlineContext = createContext<
   | undefined
 >(undefined)
 
-export const OutlineProvider: FC = ({ children }) => {
+export const OutlineProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const [flatOutline, setFlatOutline] = useState<FlatOutlineState>(undefined)
   const [currentlyHighlightedLine, setCurrentlyHighlightedLine] =
     useState<number>(-1)
@@ -55,7 +55,7 @@ export const OutlineProvider: FC = ({ children }) => {
 
   useEventListener(
     'file-view:file-opened',
-    useCallback(_ => {
+    useCallback(() => {
       setBinaryFileOpened(true)
     }, [])
   )
@@ -63,7 +63,7 @@ export const OutlineProvider: FC = ({ children }) => {
   useEventListener(
     'scroll:editor:update',
     useCallback(
-      evt => {
+      (evt: CustomEvent) => {
         if (ignoreNextScroll) {
           setIgnoreNextScroll(false)
           return
@@ -77,7 +77,7 @@ export const OutlineProvider: FC = ({ children }) => {
   useEventListener(
     'cursor:editor:update',
     useCallback(
-      evt => {
+      (evt: CustomEvent) => {
         if (ignoreNextCursorUpdate) {
           setIgnoreNextCursorUpdate(false)
           return
@@ -90,7 +90,7 @@ export const OutlineProvider: FC = ({ children }) => {
 
   useEventListener(
     'doc:after-opened',
-    useCallback(evt => {
+    useCallback((evt: CustomEvent) => {
       if (evt.detail.isNewDoc) {
         setIgnoreNextCursorUpdate(true)
       }
@@ -118,13 +118,13 @@ export const OutlineProvider: FC = ({ children }) => {
     [flatOutline, currentlyHighlightedLine]
   )
 
-  const { openDocName } = useEditorManagerContext()
+  const { openDocName } = useEditorOpenDocContext()
   const isTexFile = useMemo(
     () => (openDocName ? isValidTeXFile(openDocName) : false),
     [openDocName]
   )
 
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const storageKey = `file_outline.expanded.${projectId}`
 
   const [outlineExpanded, setOutlineExpanded] = useState(
diff --git a/services/web/frontend/js/features/ide-react/context/permissions-context.tsx b/services/web/frontend/js/features/ide-react/context/permissions-context.tsx
index 2f8fa65096..c3621aac23 100644
--- a/services/web/frontend/js/features/ide-react/context/permissions-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/permissions-context.tsx
@@ -1,12 +1,11 @@
-import { createContext, useContext, useEffect } from 'react'
+import { createContext, useContext, useEffect, useState } from 'react'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
-import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import getMeta from '@/utils/meta'
 import {
   Permissions,
   PermissionsLevel,
 } from '@/features/ide-react/types/permissions'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import { DeepReadonly } from '../../../../../types/utils'
 import useViewerPermissions from '@/shared/hooks/use-viewer-permissions'
 import { useProjectContext } from '@/shared/context/project-context'
@@ -79,16 +78,27 @@ const noTrackChangesPermissionsMap: typeof permissionsMap = {
   owner: permissionsMap.owner,
 }
 
-export const PermissionsProvider: React.FC = ({ children }) => {
+const defaultPermissions: Permissions = {
+  read: true,
+  write: true,
+  admin: false,
+  comment: true,
+  resolveOwnComments: false,
+  resolveAllComments: false,
+  trackedWrite: true,
+  labelVersion: false,
+}
+
+export const PermissionsProvider: React.FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [permissions, setPermissions] =
-    useScopeValue<Readonly<Permissions>>('permissions')
+    useState<Permissions>(defaultPermissions)
   const { connectionState } = useConnectionContext()
-  const { permissionsLevel } = useEditorContext() as {
-    permissionsLevel: PermissionsLevel
-  }
+  const { permissionsLevel } = useIdeReactContext()
   const hasViewerPermissions = useViewerPermissions()
   const anonymous = getMeta('ol-anonymous')
-  const project = useProjectContext()
+  const { features } = useProjectContext()
 
   useEffect(() => {
     let activePermissionsMap
@@ -96,7 +106,7 @@ export const PermissionsProvider: React.FC = ({ children }) => {
       activePermissionsMap = linkSharingWarningPermissionsMap
     } else if (anonymous) {
       activePermissionsMap = anonymousPermissionsMap
-    } else if (!project.features.trackChanges) {
+    } else if (!features.trackChanges) {
       activePermissionsMap = noTrackChangesPermissionsMap
     } else {
       activePermissionsMap = permissionsMap
@@ -107,7 +117,7 @@ export const PermissionsProvider: React.FC = ({ children }) => {
     permissionsLevel,
     setPermissions,
     hasViewerPermissions,
-    project.features.trackChanges,
+    features.trackChanges,
   ])
 
   useEffect(() => {
diff --git a/services/web/frontend/js/features/ide-react/context/react-context-root.tsx b/services/web/frontend/js/features/ide-react/context/react-context-root.tsx
index 9551777813..6236f2bfe2 100644
--- a/services/web/frontend/js/features/ide-react/context/react-context-root.tsx
+++ b/services/web/frontend/js/features/ide-react/context/react-context-root.tsx
@@ -1,10 +1,13 @@
-import { FC } from 'react'
+import React, { FC, PropsWithChildren } from 'react'
 import { ChatProvider } from '@/features/chat/context/chat-context'
 import { ConnectionProvider } from './connection-context'
 import { DetachCompileProvider } from '@/shared/context/detach-compile-context'
 import { DetachProvider } from '@/shared/context/detach-context'
 import { EditorManagerProvider } from '@/features/ide-react/context/editor-manager-context'
+import { EditorOpenDocProvider } from '@/features/ide-react/context/editor-open-doc-context'
+import { EditorPropertiesProvider } from '@/features/ide-react/context/editor-properties-context'
 import { EditorProvider } from '@/shared/context/editor-context'
+import { EditorViewProvider } from '@/features/ide-react/context/editor-view-context'
 import { FileTreeDataProvider } from '@/shared/context/file-tree-data-context'
 import { FileTreeOpenProvider } from '@/features/ide-react/context/file-tree-open-context'
 import { FileTreePathProvider } from '@/features/file-tree/contexts/file-tree-path'
@@ -23,20 +26,26 @@ import { ReferencesProvider } from '@/features/ide-react/context/references-cont
 import { SnapshotProvider } from '@/features/ide-react/context/snapshot-context'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 import { UserProvider } from '@/shared/context/user-context'
+import { UserFeaturesProvider } from '@/shared/context/user-features-context'
 import { UserSettingsProvider } from '@/shared/context/user-settings-context'
 import { IdeRedesignSwitcherProvider } from './ide-redesign-switcher-context'
+import { CommandRegistryProvider } from './command-registry-context'
 
-export const ReactContextRoot: FC<{ providers?: Record<string, FC> }> = ({
-  children,
-  providers = {},
-}) => {
+export const ReactContextRoot: FC<
+  React.PropsWithChildren<{
+    providers?: Record<string, FC<PropsWithChildren>>
+  }>
+> = ({ children, providers = {} }) => {
   const Providers = {
     ChatProvider,
     ConnectionProvider,
     DetachCompileProvider,
     DetachProvider,
     EditorManagerProvider,
+    EditorOpenDocProvider,
+    EditorPropertiesProvider,
     EditorProvider,
+    EditorViewProvider,
     FileTreeDataProvider,
     FileTreeOpenProvider,
     FileTreePathProvider,
@@ -57,6 +66,8 @@ export const ReactContextRoot: FC<{ providers?: Record<string, FC> }> = ({
     UserProvider,
     UserSettingsProvider,
     IdeRedesignSwitcherProvider,
+    CommandRegistryProvider,
+    UserFeaturesProvider,
     ...providers,
   }
 
@@ -64,53 +75,63 @@ export const ReactContextRoot: FC<{ providers?: Record<string, FC> }> = ({
     <Providers.SplitTestProvider>
       <Providers.ModalsContextProvider>
         <Providers.ConnectionProvider>
-          <Providers.IdeReactProvider>
-            <Providers.UserProvider>
-              <Providers.UserSettingsProvider>
-                <Providers.ProjectProvider>
+          <Providers.ProjectProvider>
+            <Providers.IdeReactProvider>
+              <Providers.UserProvider>
+                <Providers.UserSettingsProvider>
                   <Providers.SnapshotProvider>
-                    <Providers.FileTreeDataProvider>
-                      <Providers.FileTreePathProvider>
-                        <Providers.ReferencesProvider>
-                          <Providers.DetachProvider>
+                    <Providers.DetachProvider>
+                      <Providers.EditorPropertiesProvider>
+                        <Providers.EditorViewProvider>
+                          <Providers.EditorOpenDocProvider>
                             <Providers.EditorProvider>
-                              <Providers.PermissionsProvider>
-                                <Providers.LayoutProvider>
-                                  <Providers.ProjectSettingsProvider>
-                                    <Providers.EditorManagerProvider>
-                                      <Providers.LocalCompileProvider>
-                                        <Providers.DetachCompileProvider>
-                                          <Providers.ChatProvider>
-                                            <Providers.FileTreeOpenProvider>
-                                              <Providers.OnlineUsersProvider>
-                                                <Providers.MetadataProvider>
-                                                  <Providers.OutlineProvider>
-                                                    <Providers.RailProvider>
-                                                      <Providers.IdeRedesignSwitcherProvider>
-                                                        {children}
-                                                      </Providers.IdeRedesignSwitcherProvider>
-                                                    </Providers.RailProvider>
-                                                  </Providers.OutlineProvider>
-                                                </Providers.MetadataProvider>
-                                              </Providers.OnlineUsersProvider>
-                                            </Providers.FileTreeOpenProvider>
-                                          </Providers.ChatProvider>
-                                        </Providers.DetachCompileProvider>
-                                      </Providers.LocalCompileProvider>
-                                    </Providers.EditorManagerProvider>
-                                  </Providers.ProjectSettingsProvider>
-                                </Providers.LayoutProvider>
-                              </Providers.PermissionsProvider>
+                              <Providers.FileTreeDataProvider>
+                                <Providers.FileTreePathProvider>
+                                  <Providers.ReferencesProvider>
+                                    <Providers.UserFeaturesProvider>
+                                      <Providers.PermissionsProvider>
+                                        <Providers.RailProvider>
+                                          <Providers.LayoutProvider>
+                                            <Providers.ProjectSettingsProvider>
+                                              <Providers.EditorManagerProvider>
+                                                <Providers.LocalCompileProvider>
+                                                  <Providers.DetachCompileProvider>
+                                                    <Providers.ChatProvider>
+                                                      <Providers.FileTreeOpenProvider>
+                                                        <Providers.OnlineUsersProvider>
+                                                          <Providers.MetadataProvider>
+                                                            <Providers.OutlineProvider>
+                                                              <Providers.IdeRedesignSwitcherProvider>
+                                                                <Providers.CommandRegistryProvider>
+                                                                  {children}
+                                                                </Providers.CommandRegistryProvider>
+                                                              </Providers.IdeRedesignSwitcherProvider>
+                                                            </Providers.OutlineProvider>
+                                                          </Providers.MetadataProvider>
+                                                        </Providers.OnlineUsersProvider>
+                                                      </Providers.FileTreeOpenProvider>
+                                                    </Providers.ChatProvider>
+                                                  </Providers.DetachCompileProvider>
+                                                </Providers.LocalCompileProvider>
+                                              </Providers.EditorManagerProvider>
+                                            </Providers.ProjectSettingsProvider>
+                                          </Providers.LayoutProvider>
+                                        </Providers.RailProvider>
+                                      </Providers.PermissionsProvider>
+                                    </Providers.UserFeaturesProvider>
+                                  </Providers.ReferencesProvider>
+                                </Providers.FileTreePathProvider>
+                              </Providers.FileTreeDataProvider>
                             </Providers.EditorProvider>
-                          </Providers.DetachProvider>
-                        </Providers.ReferencesProvider>
-                      </Providers.FileTreePathProvider>
-                    </Providers.FileTreeDataProvider>
+                          </Providers.EditorOpenDocProvider>
+                        </Providers.EditorViewProvider>
+                      </Providers.EditorPropertiesProvider>
+                    </Providers.DetachProvider>
                   </Providers.SnapshotProvider>
-                </Providers.ProjectProvider>
-              </Providers.UserSettingsProvider>
-            </Providers.UserProvider>
-          </Providers.IdeReactProvider>
+                </Providers.UserSettingsProvider>
+              </Providers.UserProvider>
+            </Providers.IdeReactProvider>
+          </Providers.ProjectProvider>
         </Providers.ConnectionProvider>
       </Providers.ModalsContextProvider>
     </Providers.SplitTestProvider>
diff --git a/services/web/frontend/js/features/ide-react/context/references-context.tsx b/services/web/frontend/js/features/ide-react/context/references-context.tsx
index 36f33ba7b1..3b250658f1 100644
--- a/services/web/frontend/js/features/ide-react/context/references-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/references-context.tsx
@@ -26,7 +26,9 @@ export const ReferencesContext = createContext<
   | undefined
 >(undefined)
 
-export const ReferencesProvider: FC = ({ children }) => {
+export const ReferencesProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { fileTreeData } = useFileTreeData()
   const { eventEmitter, projectId } = useIdeReactContext()
   const { socket } = useConnectionContext()
@@ -60,7 +62,7 @@ export const ReferencesProvider: FC = ({ children }) => {
       // avoid reindexing references if the bib file has not changed since the
       // last time they were indexed
       const docId = doc.doc_id
-      const snapshot = doc._doc.snapshot
+      const snapshot = doc.getSnapshot()
       const now = Date.now()
       const sha1 = generateSHA1Hash(
         'blob ' + snapshot.length + '\x00' + snapshot
diff --git a/services/web/frontend/js/features/ide-react/context/snapshot-context.tsx b/services/web/frontend/js/features/ide-react/context/snapshot-context.tsx
index 686940f612..34b782b5bf 100644
--- a/services/web/frontend/js/features/ide-react/context/snapshot-context.tsx
+++ b/services/web/frontend/js/features/ide-react/context/snapshot-context.tsx
@@ -24,10 +24,14 @@ export const StubSnapshotUtils = {
       throw new Error('not implemented')
     }
   },
+  // unused vars kept to document the interface
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   buildFileTree(snapshot: Snapshot): Folder {
     throw new Error('not implemented')
   },
-  createFolder(_id: string, name: string): Folder {
+  // unused vars kept to document the interface
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  createFolder(id: string, name: string): Folder {
     throw new Error('not implemented')
   },
 }
@@ -50,8 +54,8 @@ export const SnapshotContext = createContext<
   | undefined
 >(undefined)
 
-export const SnapshotProvider: FC = ({ children }) => {
-  const { _id: projectId } = useProjectContext()
+export const SnapshotProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const { projectId } = useProjectContext()
   const [snapshotLoadingState, setSnapshotLoadingState] =
     useState<SnapshotLoadingState>('')
   const [snapshotUpdater] = useState(() => new SnapshotUpdater(projectId))
diff --git a/services/web/frontend/js/features/ide-react/editor/document-container.ts b/services/web/frontend/js/features/ide-react/editor/document-container.ts
index 9172ec9ff8..28bcb955d1 100644
--- a/services/web/frontend/js/features/ide-react/editor/document-container.ts
+++ b/services/web/frontend/js/features/ide-react/editor/document-container.ts
@@ -2,7 +2,7 @@
 // Migrated from services/web/frontend/js/ide/editor/Document.js
 
 import RangesTracker from '@overleaf/ranges-tracker'
-import { ShareJsDoc } from './share-js-doc'
+import { OTType, ShareJsDoc } from './share-js-doc'
 import { debugConsole } from '@/utils/debugging'
 import { Socket } from '@/features/ide-react/connection/types/socket'
 import { IdeEventEmitter } from '@/features/ide-react/create-ide-event-emitter'
@@ -28,6 +28,7 @@ import {
 } from '@/features/ide-react/editor/types/document'
 import { ThreadId } from '../../../../../types/review-panel/review-panel'
 import getMeta from '@/utils/meta'
+import OError from '@overleaf/o-error'
 
 const MAX_PENDING_OP_SIZE = 64
 
@@ -195,9 +196,13 @@ export class DocumentContainer extends EventEmitter {
     return this.doc?.hasBufferedOps()
   }
 
-  setTrackingChanges(track_changes: boolean) {
+  setTrackChangesUserId(userId: string | null) {
+    this.track_changes_as = userId
     if (this.doc) {
-      this.doc.track_changes = track_changes
+      this.doc.setTrackChangesUserId(userId)
+    }
+    if (this.cm6) {
+      this.cm6.setTrackChangesUserId(userId)
     }
   }
 
@@ -447,16 +452,36 @@ export class DocumentContainer extends EventEmitter {
         'joinDoc',
         this.doc_id,
         this.doc.getVersion(),
-        { encodeRanges: true, age: this.doc.getTimeSinceLastServerActivity() },
-        (error, docLines, version, updates, ranges) => {
+        {
+          encodeRanges: true,
+          age: this.doc.getTimeSinceLastServerActivity(),
+          supportsHistoryOT: true,
+        },
+        (
+          error,
+          docLines,
+          version,
+          updates,
+          ranges,
+          type = 'sharejs-text-ot'
+        ) => {
           if (error) {
             callback?.(error)
             return
           }
           this.joined = true
           this.doc?.catchUp(updates)
-          this.decodeRanges(ranges)
-          this.catchUpRanges(ranges?.changes, ranges?.comments)
+          if (this.doc?.getType() !== type) {
+            // TODO(24596): page reload after checking for pending ops?
+            throw new OError('ot type mismatch', {
+              got: type,
+              want: this.doc?.getType(),
+            })
+          }
+          if (type === 'sharejs-text-ot') {
+            this.decodeRanges(ranges)
+            this.catchUpRanges(ranges?.changes, ranges?.comments)
+          }
           callback?.()
         }
       )
@@ -464,8 +489,18 @@ export class DocumentContainer extends EventEmitter {
       this.socket.emit(
         'joinDoc',
         this.doc_id,
-        { encodeRanges: true },
-        (error, docLines, version, updates, ranges) => {
+        {
+          encodeRanges: true,
+          supportsHistoryOT: true,
+        },
+        (
+          error,
+          docLines,
+          version,
+          updates,
+          ranges,
+          type: OTType = 'sharejs-text-ot'
+        ) => {
           if (error) {
             callback?.(error)
             return
@@ -477,9 +512,12 @@ export class DocumentContainer extends EventEmitter {
             version,
             this.socket,
             this.globalEditorWatchdogManager,
-            this.ideEventEmitter
+            this.ideEventEmitter,
+            type
           )
-          this.decodeRanges(ranges)
+          if (type === 'sharejs-text-ot') {
+            this.decodeRanges(ranges)
+          }
           this.ranges = new RangesTracker(ranges?.changes, ranges?.comments)
           this.bindToShareJsDocEvents()
           callback?.()
@@ -561,7 +599,7 @@ export class DocumentContainer extends EventEmitter {
     this.doc.on('remoteop', (...ops: AnyOperation[]) => {
       return this.trigger('remoteop', ...ops)
     })
-    this.doc.on('op:sent', (op: AnyOperation) => {
+    this.doc.on('op:sent', () => {
       return this.trigger('op:sent')
     })
     this.doc.on('op:acknowledged', (op: AnyOperation) => {
@@ -571,7 +609,7 @@ export class DocumentContainer extends EventEmitter {
       })
       return this.trigger('op:acknowledged')
     })
-    this.doc.on('op:timeout', (op: AnyOperation) => {
+    this.doc.on('op:timeout', () => {
       this.trigger('op:timeout')
       return this.onError(new Error('op timed out'))
     })
@@ -580,7 +618,9 @@ export class DocumentContainer extends EventEmitter {
     this.doc.on(
       'change',
       (ops: AnyOperation[], oldSnapshot: any, msg: Message) => {
-        this.applyOpsToRanges(ops, msg)
+        if (this.getType() === 'sharejs-text-ot') {
+          this.applyOpsToRanges(ops, msg)
+        }
         if (docChangedTimeout) {
           window.clearTimeout(docChangedTimeout)
         }
diff --git a/services/web/frontend/js/features/ide-react/editor/share-js-doc.ts b/services/web/frontend/js/features/ide-react/editor/share-js-doc.ts
index b56d6443dd..5b362299d2 100644
--- a/services/web/frontend/js/features/ide-react/editor/share-js-doc.ts
+++ b/services/web/frontend/js/features/ide-react/editor/share-js-doc.ts
@@ -2,7 +2,7 @@
 // Migrated from services/web/frontend/js/ide/editor/ShareJsDoc.js
 
 import EventEmitter from '../../../utils/EventEmitter'
-import { Doc } from '@/vendor/libs/sharejs'
+import sharejs, { Doc } from '@/vendor/libs/sharejs'
 import { Socket } from '@/features/ide-react/connection/types/socket'
 import { debugConsole } from '@/utils/debugging'
 import { decodeUtf8 } from '@/utils/decode-utf8'
@@ -17,6 +17,16 @@ import {
 import { EditorFacade } from '@/features/source-editor/extensions/realtime'
 import { recordDocumentFirstChangeEvent } from '@/features/event-tracking/document-first-change-event'
 import getMeta from '@/utils/meta'
+import { historyOTType } from './share-js-history-ot-type'
+import {
+  StringFileData,
+  TrackedChangeList,
+  EditOperationBuilder,
+} from 'overleaf-editor-core'
+import {
+  StringFileRawData,
+  RawEditOperation,
+} from 'overleaf-editor-core/lib/types'
 
 // All times below are in milliseconds
 const SINGLE_USER_FLUSH_DELAY = 2000
@@ -27,6 +37,7 @@ const FATAL_OP_TIMEOUT = 45000
 const RECENT_ACK_LIMIT = 2 * SINGLE_USER_FLUSH_DELAY
 
 type Update = Record<string, any>
+export type OTType = 'sharejs-text-ot' | 'history-ot'
 
 type Connection = {
   send: (update: Update) => void
@@ -35,7 +46,6 @@ type Connection = {
 }
 
 export class ShareJsDoc extends EventEmitter {
-  type: string
   track_changes = false
   track_changes_id_seeds: TrackChangesIdSeeds | null = null
   connection: Connection
@@ -57,12 +67,22 @@ export class ShareJsDoc extends EventEmitter {
     version: number,
     readonly socket: Socket,
     private readonly globalEditorWatchdogManager: EditorWatchdogManager,
-    private readonly eventEmitter: IdeEventEmitter
+    private readonly eventEmitter: IdeEventEmitter,
+    readonly type: OTType = 'sharejs-text-ot'
   ) {
     super()
-    this.type = 'text'
+    let sharejsType
     // Decode any binary bits of data
-    const snapshot = docLines.map(line => decodeUtf8(line)).join('\n')
+    let snapshot: string | StringFileData
+    if (this.type === 'history-ot') {
+      snapshot = StringFileData.fromRaw(
+        docLines as unknown as StringFileRawData
+      )
+      sharejsType = historyOTType
+    } else {
+      snapshot = docLines.map(line => decodeUtf8(line)).join('\n')
+      sharejsType = sharejs.types.text
+    }
 
     this.connection = {
       send: (update: Update) => {
@@ -89,7 +109,7 @@ export class ShareJsDoc extends EventEmitter {
     }
 
     this._doc = new Doc(this.connection, this.doc_id, {
-      type: this.type,
+      type: sharejsType,
     })
     this._doc.setFlushDelay(SINGLE_USER_FLUSH_DELAY)
     this._doc.on('change', (...args: any[]) => {
@@ -140,13 +160,22 @@ export class ShareJsDoc extends EventEmitter {
     this.removeCarriageReturnCharFromShareJsDoc()
   }
 
+  setTrackChangesUserId(userId: string | null) {
+    this.track_changes = userId != null
+  }
+
+  getTrackedChanges() {
+    if (this._doc.otType === 'history-ot') {
+      return this._doc.snapshot.getTrackedChanges() as TrackedChangeList
+    } else {
+      return null
+    }
+  }
+
   private removeCarriageReturnCharFromShareJsDoc() {
     const doc = this._doc
-    if (doc.snapshot.indexOf('\r') === -1) {
-      return
-    }
     let nextPos
-    while ((nextPos = doc.snapshot.indexOf('\r')) !== -1) {
+    while ((nextPos = doc.getText().indexOf('\r')) !== -1) {
       debugConsole.log('[ShareJsDoc] remove-carriage-return-char', nextPos)
       doc.del(nextPos, 1)
     }
@@ -237,7 +266,15 @@ export class ShareJsDoc extends EventEmitter {
   // issues are resolved.
   processUpdateFromServer(message: Message) {
     try {
-      this._doc._onMessage(message)
+      if (this.type === 'history-ot' && message.op != null) {
+        const ops = message.op as RawEditOperation[]
+        this._doc._onMessage({
+          ...message,
+          op: ops.map(EditOperationBuilder.fromJSON),
+        })
+      } else {
+        this._doc._onMessage(message)
+      }
     } catch (error) {
       // Version mismatches are thrown as errors
       debugConsole.log(error)
@@ -259,7 +296,7 @@ export class ShareJsDoc extends EventEmitter {
   }
 
   getSnapshot() {
-    return this._doc.snapshot as string | undefined
+    return this._doc.getText() as string
   }
 
   getVersion() {
diff --git a/services/web/frontend/js/features/ide-react/editor/share-js-history-ot-type.ts b/services/web/frontend/js/features/ide-react/editor/share-js-history-ot-type.ts
new file mode 100644
index 0000000000..81243bb8c7
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/editor/share-js-history-ot-type.ts
@@ -0,0 +1,84 @@
+import {
+  EditOperation,
+  EditOperationTransformer,
+  StringFileData,
+} from 'overleaf-editor-core'
+import { ShareDoc } from '../../../../../types/share-doc'
+
+type Api = {
+  otType: 'history-ot'
+  trackChangesUserId: string | null
+
+  getText(): string
+  getLength(): number
+}
+
+const api: Api & ThisType<Api & ShareDoc & { snapshot: StringFileData }> = {
+  otType: 'history-ot',
+  trackChangesUserId: null,
+
+  getText() {
+    return this.snapshot.getContent({ filterTrackedDeletes: true })
+  },
+
+  getLength() {
+    return this.snapshot.getStringLength()
+  },
+}
+
+export const historyOTType = {
+  api,
+
+  transformX(ops1: EditOperation[], ops2: EditOperation[]) {
+    // Dynamic programming algorithm: gradually transform both sides in a nested
+    // loop.
+    const left = [...ops1]
+    const right = [...ops2]
+    for (let i = 0; i < left.length; i++) {
+      for (let j = 0; j < right.length; j++) {
+        // At this point:
+        // left[0..i] is ops1[0..i] rebased over ops2[0..j-1]
+        // right[0..j] is ops2[0..j] rebased over ops1[0..i-1]
+        const [a, b] = EditOperationTransformer.transform(left[i], right[j])
+        left[i] = a
+        right[j] = b
+      }
+    }
+    return [left, right]
+  },
+
+  apply(snapshot: StringFileData, ops: EditOperation[]) {
+    const afterFile = StringFileData.fromRaw(snapshot.toRaw())
+    for (const op of ops) {
+      afterFile.edit(op)
+    }
+    return afterFile
+  },
+
+  compose(ops1: EditOperation[], ops2: EditOperation[]) {
+    const ops = [...ops1, ...ops2]
+    let currentOp = ops.shift()
+    if (currentOp === undefined) {
+      // No ops to process
+      return []
+    }
+    const result = []
+    for (const op of ops) {
+      if (currentOp.canBeComposedWith(op)) {
+        currentOp = currentOp.compose(op)
+      } else {
+        result.push(currentOp)
+        currentOp = op
+      }
+    }
+    result.push(currentOp)
+    return result
+  },
+
+  // Do not provide normalize, used by submitOp to fixup bad input.
+  // normalize(op: TextOperation) {}
+
+  // Do not provide invert, only needed for reverting a rejected update.
+  // We are displaying an out-of-sync modal when an op is rejected.
+  // invert(op: TextOperation) {}
+}
diff --git a/services/web/frontend/js/features/ide-react/editor/types/document.ts b/services/web/frontend/js/features/ide-react/editor/types/document.ts
index 44d36c0e48..f6e5f6aebb 100644
--- a/services/web/frontend/js/features/ide-react/editor/types/document.ts
+++ b/services/web/frontend/js/features/ide-react/editor/types/document.ts
@@ -1,4 +1,6 @@
+import { StringFileData } from 'overleaf-editor-core'
 import { AnyOperation } from '../../../../../../types/change'
+import { RawEditOperation } from 'overleaf-editor-core/lib/types'
 
 export type Version = number
 
@@ -8,6 +10,23 @@ export type ShareJsOperation = AnyOperation[]
 
 export type TrackChangesIdSeeds = { inflight: string; pending: string }
 
+export interface ShareJsTextType<Snapshot = any, Operation = any> {
+  transformX(op1: Operation, op2: Operation): Operation[]
+  apply(snapshot: Snapshot, op: Operation): Snapshot
+  compose(op1: Operation, op2: Operation): Operation
+
+  api: {
+    insert(pos: number, text: string, fromUndo: boolean): void
+    del(pos: number, length: number, fromUndo: boolean): void
+    getText(): string
+    getLength(): number
+    _register(): void
+  }
+
+  // stub-interface, provided by sharejs.Doc
+  submitOp(op: Operation): void
+}
+
 // TODO: check the properties of this type
 export type Message = {
   v: Version
@@ -16,5 +35,7 @@ export type Message = {
     type?: string
   }
   doc?: string
-  snapshot?: string
+  snapshot?: string | StringFileData
+  type?: ShareJsTextType
+  op?: AnyOperation[] | RawEditOperation[]
 }
diff --git a/services/web/frontend/js/features/ide-react/hooks/use-chat-pane.ts b/services/web/frontend/js/features/ide-react/hooks/use-chat-pane.ts
index 0c6d816181..44b165fd57 100644
--- a/services/web/frontend/js/features/ide-react/hooks/use-chat-pane.ts
+++ b/services/web/frontend/js/features/ide-react/hooks/use-chat-pane.ts
@@ -1,6 +1,7 @@
 import { useLayoutContext } from '@/shared/context/layout-context'
 import useCollapsiblePanel from '@/features/ide-react/hooks/use-collapsible-panel'
-import { useCallback, useRef, useState } from 'react'
+import useDebounce from '@/shared/hooks/use-debounce'
+import { useCallback, useEffect, useRef, useState } from 'react'
 import { ImperativePanelHandle } from 'react-resizable-panels'
 
 export const useChatPane = () => {
@@ -8,6 +9,17 @@ export const useChatPane = () => {
   const [resizing, setResizing] = useState(false)
   const panelRef = useRef<ImperativePanelHandle>(null)
 
+  // Keep track of a debounced local state variable for panel openness and
+  // only update the external openness state when the debounced value changes.
+  // This prevents successive calls to onCollapse and onExpand from
+  // react-resizable-panels updating the openness state multiple times in quick
+  // succession, which causes confusing behaviour that is different in React 17
+  // and 18. Collapsing the chat pane on initialization is necessary because
+  // react-resizable-panels does not provide a way to specify both that a panel
+  // should be collapsed and a default size for the panel when expanded.
+  const [localIsOpen, setLocalIsOpen] = useState(isOpen)
+  const debouncedLocalIsOpen = useDebounce(localIsOpen, 100)
+
   useCollapsiblePanel(isOpen, panelRef)
 
   const togglePane = useCallback(() => {
@@ -15,12 +27,16 @@ export const useChatPane = () => {
   }, [setIsOpen])
 
   const handlePaneExpand = useCallback(() => {
-    setIsOpen(true)
-  }, [setIsOpen])
+    setLocalIsOpen(true)
+  }, [])
 
   const handlePaneCollapse = useCallback(() => {
-    setIsOpen(false)
-  }, [setIsOpen])
+    setLocalIsOpen(false)
+  }, [])
+
+  useEffect(() => {
+    setIsOpen(debouncedLocalIsOpen)
+  }, [debouncedLocalIsOpen, setIsOpen])
 
   return {
     isOpen,
diff --git a/services/web/frontend/js/features/ide-react/hooks/use-command-provider.ts b/services/web/frontend/js/features/ide-react/hooks/use-command-provider.ts
new file mode 100644
index 0000000000..088304b39d
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/hooks/use-command-provider.ts
@@ -0,0 +1,21 @@
+import { DependencyList, useEffect } from 'react'
+import {
+  Command,
+  useCommandRegistry,
+} from '../context/command-registry-context'
+
+export const useCommandProvider = (
+  generateElements: () => Command[] | undefined,
+  dependencies: DependencyList
+) => {
+  const { register, unregister } = useCommandRegistry()
+  useEffect(() => {
+    const elements = generateElements()
+    if (!elements) return
+    register(...elements)
+    return () => {
+      unregister(...elements.map(element => element.id))
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, dependencies)
+}
diff --git a/services/web/frontend/js/features/ide-react/hooks/use-editing-session-heartbeat.ts b/services/web/frontend/js/features/ide-react/hooks/use-editing-session-heartbeat.ts
index d264766d76..cdb0a151ae 100644
--- a/services/web/frontend/js/features/ide-react/hooks/use-editing-session-heartbeat.ts
+++ b/services/web/frontend/js/features/ide-react/hooks/use-editing-session-heartbeat.ts
@@ -6,10 +6,15 @@ import { debugConsole } from '@/utils/debugging'
 import { useCallback, useEffect, useRef } from 'react'
 import useEventListener from '@/shared/hooks/use-event-listener'
 import useDomEventListener from '@/shared/hooks/use-dom-event-listener'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
-function createEditingSessionHeartbeatData(editorType: EditorType) {
+function createEditingSessionHeartbeatData(
+  editorType: EditorType,
+  newEditor: boolean
+) {
   return {
     editorType,
+    editorRedesign: newEditor,
   }
 }
 
@@ -25,6 +30,7 @@ function sendEditingSessionHeartbeat(
 export function useEditingSessionHeartbeat() {
   const { projectId } = useIdeReactContext()
   const { getEditorType } = useEditorManagerContext()
+  const newEditor = useIsNewEditorEnabled()
 
   // Keep track of how many heartbeats we've sent so that we can calculate how
   // long to wait until the next one
@@ -51,7 +57,10 @@ export function useEditingSessionHeartbeat() {
 
     heartBeatSentRecentlyRef.current = true
 
-    const segmentation = createEditingSessionHeartbeatData(editorType)
+    const segmentation = createEditingSessionHeartbeatData(
+      editorType,
+      newEditor
+    )
 
     debugConsole.log('[Event] send heartbeat request', segmentation)
     sendEditingSessionHeartbeat(projectId, segmentation)
@@ -71,7 +80,7 @@ export function useEditingSessionHeartbeat() {
     heartBeatResetTimerRef.current = window.setTimeout(() => {
       heartBeatSentRecentlyRef.current = false
     }, backoffSecs * 1000)
-  }, [getEditorType, projectId])
+  }, [getEditorType, projectId, newEditor])
 
   // Hook the heartbeat up to editor events
   useEventListener('cursor:editor:update', editingSessionHeartbeat)
diff --git a/services/web/frontend/js/features/ide-react/hooks/use-socket-listeners.ts b/services/web/frontend/js/features/ide-react/hooks/use-socket-listeners.ts
index 6b2f305593..55d9f01ba9 100644
--- a/services/web/frontend/js/features/ide-react/hooks/use-socket-listeners.ts
+++ b/services/web/frontend/js/features/ide-react/hooks/use-socket-listeners.ts
@@ -4,7 +4,7 @@ import {
   listProjectInvites,
   listProjectMembers,
 } from '@/features/share-project-modal/utils/api'
-import useScopeValue from '@/shared/hooks/use-scope-value'
+import { useProjectContext } from '@/shared/context/project-context'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
 import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
@@ -12,17 +12,13 @@ import { debugConsole } from '@/utils/debugging'
 import { useCallback } from 'react'
 import { PublicAccessLevel } from '../../../../../types/public-access-level'
 import { useLocation } from '@/shared/hooks/use-location'
-import { useEditorContext } from '@/shared/context/editor-context'
 
 function useSocketListeners() {
   const { t } = useTranslation()
   const { socket } = useConnectionContext()
-  const { projectId } = useIdeReactContext()
   const { showGenericMessageModal } = useModalsContext()
-  const { permissionsLevel } = useEditorContext()
-  const [, setPublicAccessLevel] = useScopeValue('project.publicAccesLevel')
-  const [, setProjectMembers] = useScopeValue('project.members')
-  const [, setProjectInvites] = useScopeValue('project.invites')
+  const { permissionsLevel } = useIdeReactContext()
+  const { projectId, updateProject } = useProjectContext()
   const location = useLocation()
 
   useSocketListener(
@@ -53,10 +49,10 @@ function useSocketListeners() {
     useCallback(
       (data: { newAccessLevel?: PublicAccessLevel }) => {
         if (data.newAccessLevel) {
-          setPublicAccessLevel(data.newAccessLevel)
+          updateProject({ publicAccessLevel: data.newAccessLevel })
         }
       },
-      [setPublicAccessLevel]
+      [updateProject]
     )
   )
 
@@ -67,13 +63,13 @@ function useSocketListeners() {
       listProjectMembers(projectId)
         .then(({ members }) => {
           if (members) {
-            setProjectMembers(members)
+            updateProject({ members })
           }
         })
         .catch(err => {
           debugConsole.error('Error fetching members for project', err)
         })
-    }, [projectId, setProjectMembers])
+    }, [projectId, updateProject])
   )
 
   useSocketListener(
@@ -85,7 +81,7 @@ function useSocketListeners() {
           listProjectMembers(projectId)
             .then(({ members }) => {
               if (members) {
-                setProjectMembers(members)
+                updateProject({ members })
               }
             })
             .catch(err => {
@@ -97,7 +93,7 @@ function useSocketListeners() {
           listProjectInvites(projectId)
             .then(({ invites }) => {
               if (invites) {
-                setProjectInvites(invites)
+                updateProject({ invites })
               }
             })
             .catch(err => {
@@ -105,7 +101,29 @@ function useSocketListeners() {
             })
         }
       },
-      [projectId, setProjectInvites, setProjectMembers, permissionsLevel]
+      [projectId, updateProject, permissionsLevel]
+    )
+  )
+
+  useSocketListener(
+    socket,
+    'mainBibliographyDocUpdated',
+    useCallback(
+      (payload: string) => {
+        updateProject({ mainBibliographyDocId: payload })
+      },
+      [updateProject]
+    )
+  )
+
+  useSocketListener(
+    socket,
+    'projectNameUpdated',
+    useCallback(
+      (payload: string) => {
+        updateProject({ name: payload })
+      },
+      [updateProject]
     )
   )
 }
diff --git a/services/web/frontend/js/features/ide-react/hooks/use-status-favicon.ts b/services/web/frontend/js/features/ide-react/hooks/use-status-favicon.ts
new file mode 100644
index 0000000000..c65d49e042
--- /dev/null
+++ b/services/web/frontend/js/features/ide-react/hooks/use-status-favicon.ts
@@ -0,0 +1,75 @@
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import { useEffect, useState } from 'react'
+import usePreviousValue from '@/shared/hooks/use-previous-value'
+
+const RESET_AFTER_MS = 5_000
+
+const COMPILE_ICONS = {
+  ERROR: '/favicon-error.svg',
+  COMPILING: '/favicon-compiling.svg',
+  COMPILED: '/favicon-compiled.svg',
+  UNCOMPILED: '/favicon.svg',
+}
+
+type CompileStatus = keyof typeof COMPILE_ICONS
+
+const useCompileStatus = (): CompileStatus => {
+  const compileContext = useCompileContext()
+  if (compileContext.uncompiled) return 'UNCOMPILED'
+  if (compileContext.compiling) return 'COMPILING'
+  if (compileContext.error) return 'ERROR'
+  return 'COMPILED'
+}
+
+const removeFavicon = () => {
+  const existingFavicons = document.head.querySelectorAll(
+    "link[rel='icon']"
+  ) as NodeListOf<HTMLLinkElement>
+  existingFavicons.forEach(favicon => {
+    if (favicon.href.endsWith('.svg')) favicon.parentNode?.removeChild(favicon)
+  })
+}
+
+const updateFavicon = (status: CompileStatus = 'UNCOMPILED') => {
+  removeFavicon()
+  const linkElement = document.createElement('link')
+  linkElement.rel = 'icon'
+  linkElement.href = COMPILE_ICONS[status]
+  linkElement.type = 'image/svg+xml'
+  linkElement.setAttribute('data-compile-status', 'true')
+  document.head.appendChild(linkElement)
+}
+
+const isActive = () => !document.hidden
+
+const useIsWindowActive = () => {
+  const [isWindowActive, setIsWindowActive] = useState(isActive())
+  useEffect(() => {
+    const handleVisibilityChange = () => setIsWindowActive(isActive())
+    document.addEventListener('visibilitychange', handleVisibilityChange)
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange)
+    }
+  }, [])
+  return isWindowActive
+}
+
+export const useStatusFavicon = () => {
+  const compileStatus = useCompileStatus()
+  const previousCompileStatus = usePreviousValue(compileStatus)
+  const isWindowActive = useIsWindowActive()
+
+  useEffect(() => {
+    if (previousCompileStatus !== compileStatus) {
+      return updateFavicon(compileStatus)
+    }
+
+    if (
+      isWindowActive &&
+      (compileStatus === 'COMPILED' || compileStatus === 'ERROR')
+    ) {
+      const timeout = setTimeout(updateFavicon, RESET_AFTER_MS)
+      return () => clearTimeout(timeout)
+    }
+  }, [compileStatus, isWindowActive, previousCompileStatus])
+}
diff --git a/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts b/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts
deleted file mode 100644
index 537c501c72..0000000000
--- a/services/web/frontend/js/features/ide-react/scope-adapters/editor-manager-context-adapter.ts
+++ /dev/null
@@ -1,83 +0,0 @@
-import { ReactScopeValueStore } from '@/features/ide-react/scope-value-store/react-scope-value-store'
-import customLocalStorage from '@/infrastructure/local-storage'
-import getMeta from '@/utils/meta'
-import { DocumentContainer } from '@/features/ide-react/editor/document-container'
-
-export type EditorScopeValue = {
-  showSymbolPalette: false
-  toggleSymbolPalette: () => void
-  sharejs_doc: DocumentContainer | null
-  open_doc_id: string | null
-  open_doc_name: string | null
-  opening: boolean
-  trackChanges: boolean
-  wantTrackChanges: boolean
-  showVisual: boolean
-  error_state: boolean
-}
-
-export function populateEditorScope(
-  store: ReactScopeValueStore,
-  projectId: string
-) {
-  store.set('project.name', null)
-
-  const editor: Omit<EditorScopeValue, 'showVisual'> = {
-    showSymbolPalette: false,
-    toggleSymbolPalette: () => {},
-    sharejs_doc: null,
-    open_doc_id: null,
-    open_doc_name: null,
-    opening: true,
-    trackChanges: false,
-    wantTrackChanges: false,
-    error_state: false,
-  }
-  store.set('editor', editor)
-
-  store.persisted(
-    'editor.showVisual',
-    getMeta('ol-usedLatex') === 'never' || showVisualFallbackValue(projectId),
-    `editor.lastUsedMode`,
-    {
-      toPersisted: showVisual => (showVisual ? 'visual' : 'code'),
-      fromPersisted: mode => mode === 'visual',
-    }
-  )
-
-  store.persisted(
-    'editor.codeEditorOpened',
-    codeEditorOpenedFallbackValue(),
-    'editor.codeEditorOpened'
-  )
-  store.watch('editor.showVisual', showVisual => {
-    if (store.get('editor.codeEditorOpened') !== true && showVisual === false) {
-      store.set('editor.codeEditorOpened', true)
-    }
-  })
-}
-
-function showVisualFallbackValue(projectId: string) {
-  const editorModeKey = `editor.mode.${projectId}`
-  const editorModeVal = customLocalStorage.getItem(editorModeKey)
-
-  if (editorModeVal) {
-    // clean up the old key
-    customLocalStorage.removeItem(editorModeKey)
-  }
-
-  return editorModeVal === 'rich-text'
-}
-
-function codeEditorOpenedFallbackValue() {
-  const signUpDate = getMeta('ol-user').signUpDate
-  if (
-    typeof signUpDate === 'string' &&
-    new Date(signUpDate) < new Date('2024-08-02')
-  ) {
-    // if signUpDate is before releasing "codeEditorOpened" value
-    // it is assumed that the user has opened the code editor at some point
-    return true
-  }
-  return false
-}
diff --git a/services/web/frontend/js/features/ide-react/scope-adapters/layout-context-adapter.ts b/services/web/frontend/js/features/ide-react/scope-adapters/layout-context-adapter.ts
deleted file mode 100644
index 88f252f70b..0000000000
--- a/services/web/frontend/js/features/ide-react/scope-adapters/layout-context-adapter.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { ReactScopeValueStore } from '../scope-value-store/react-scope-value-store'
-import getMeta from '@/utils/meta'
-
-const reviewPanelStorageKey = `ui.reviewPanelOpen.${getMeta('ol-project_id')}`
-
-export default function populateLayoutScope(store: ReactScopeValueStore) {
-  store.set('ui.view', 'editor')
-  store.set('openFile', null)
-  store.persisted('ui.chatOpen', false, 'ui.chatOpen')
-  store.persisted('ui.reviewPanelOpen', false, reviewPanelStorageKey)
-  store.set('ui.leftMenuShown', false)
-  store.set('ui.miniReviewPanelVisible', false)
-  store.set('ui.pdfLayout', 'sideBySide')
-}
diff --git a/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx b/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
index 18b7567f41..1c21df0f82 100644
--- a/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/breadcrumbs.tsx
@@ -1,16 +1,15 @@
-import { findInTreeOrThrow } from '@/features/file-tree/util/find-in-tree'
+import {
+  findInTree,
+  findInTreeOrThrow,
+} from '@/features/file-tree/util/find-in-tree'
 import { useFileTreeOpenContext } from '@/features/ide-react/context/file-tree-open-context'
 import { useOutlineContext } from '@/features/ide-react/context/outline-context'
 import useNestedOutline from '@/features/outline/hooks/use-nested-outline'
 import getChildrenLines from '@/features/outline/util/get-children-lines'
-import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
 import MaterialIcon from '@/shared/components/material-icon'
 import { useFileTreeData } from '@/shared/context/file-tree-data-context'
-import { getPanel } from '@codemirror/view'
 import { Fragment, useMemo } from 'react'
 import { Outline } from '@/features/source-editor/utils/tree-operations/outline'
-import { createPortal } from 'react-dom'
-import { createBreadcrumbsPanel } from '@/features/source-editor/extensions/breadcrumbs-panel'
 
 const constructOutlineHierarchy = (
   items: Outline[],
@@ -37,49 +36,54 @@ const constructOutlineHierarchy = (
 }
 
 export default function Breadcrumbs() {
-  const view = useCodeMirrorViewContext()
-  const panel = getPanel(view, createBreadcrumbsPanel)
-
-  if (!panel) {
-    return null
-  }
-  return createPortal(<BreadcrumbsContent />, panel.dom)
-}
-
-function BreadcrumbsContent() {
   const { openEntity } = useFileTreeOpenContext()
   const { fileTreeData } = useFileTreeData()
   const outline = useNestedOutline()
   const { highlightedLine, canShowOutline } = useOutlineContext()
 
   const folderHierarchy = useMemo(() => {
-    if (!openEntity || !fileTreeData) {
+    if (openEntity?.type !== 'doc' || !fileTreeData) {
       return []
     }
 
-    return openEntity.path
-      .filter(id => id !== fileTreeData._id) // Filter out the root folder
-      .map(id => {
-        return findInTreeOrThrow(fileTreeData, id)?.entity
-      })
+    try {
+      return openEntity.path
+        .filter(id => id !== fileTreeData._id) // Filter out the root folder
+        .map(id => {
+          return findInTreeOrThrow(fileTreeData, id)?.entity
+        })
+    } catch {
+      // If any of the folders in the path are not found, the entire hierarchy
+      // is invalid.
+      return []
+    }
   }, [openEntity, fileTreeData])
 
+  const fileName = useMemo(() => {
+    // NOTE: openEntity.entity.name may not always be accurate, so we read it
+    // from the file tree data instead.
+    if (openEntity?.type !== 'doc' || !fileTreeData) {
+      return undefined
+    }
+    return findInTree(fileTreeData, openEntity.entity._id)?.entity.name
+  }, [fileTreeData, openEntity])
+
   const outlineHierarchy = useMemo(() => {
-    if (!canShowOutline || !outline) {
+    if (openEntity?.type !== 'doc' || !canShowOutline || !outline) {
       return []
     }
 
     return constructOutlineHierarchy(outline.items, highlightedLine)
-  }, [outline, highlightedLine, canShowOutline])
+  }, [outline, highlightedLine, canShowOutline, openEntity])
 
-  if (!openEntity || !fileTreeData) {
+  if (openEntity?.type !== 'doc' || !fileTreeData) {
     return null
   }
 
   const numOutlineItems = outlineHierarchy.length
 
   return (
-    <div className="ol-cm-breadcrumbs">
+    <div className="ol-cm-breadcrumbs" translate="no">
       {folderHierarchy.map(folder => (
         <Fragment key={folder._id}>
           <div>{folder.name}</div>
@@ -87,7 +91,7 @@ function BreadcrumbsContent() {
         </Fragment>
       ))}
       <MaterialIcon unfilled type="description" />
-      <div>{openEntity.entity.name}</div>
+      <div>{fileName}</div>
       {numOutlineItems > 0 && <Chevron />}
       {outlineHierarchy.map((section, idx) => (
         <Fragment key={section.line}>
diff --git a/services/web/frontend/js/features/ide-redesign/components/chat/chat.tsx b/services/web/frontend/js/features/ide-redesign/components/chat/chat.tsx
index d76d82cb22..54d098c6c8 100644
--- a/services/web/frontend/js/features/ide-redesign/components/chat/chat.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/chat/chat.tsx
@@ -2,7 +2,6 @@ import ChatFallbackError from '@/features/chat/components/chat-fallback-error'
 import InfiniteScroll from '@/features/chat/components/infinite-scroll'
 import MessageInput from '@/features/chat/components/message-input'
 import { useChatContext } from '@/features/chat/context/chat-context'
-import OLBadge from '@/features/ui/components/ol/ol-badge'
 import { FetchError } from '@/infrastructure/fetch-json'
 import { FullSizeLoadingSpinner } from '@/shared/components/loading-spinner'
 import MaterialIcon from '@/shared/components/material-icon'
@@ -10,7 +9,8 @@ import { useUserContext } from '@/shared/context/user-context'
 import { lazy, Suspense, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import classNames from 'classnames'
-import { RailPanelHeader } from '../rail'
+import { RailIndicator } from '../rail-indicator'
+import RailPanelHeader from '../rail-panel-header'
 
 const MessageList = lazy(() => import('../../../chat/components/message-list'))
 
@@ -19,7 +19,7 @@ export const ChatIndicator = () => {
   if (unreadMessageCount === 0) {
     return null
   }
-  return <OLBadge bg="info">{unreadMessageCount}</OLBadge>
+  return <RailIndicator count={unreadMessageCount} type="info" />
 }
 
 const Loading = () => <FullSizeLoadingSpinner delay={500} className="pt-4" />
diff --git a/services/web/frontend/js/features/ide-redesign/components/chat/message.tsx b/services/web/frontend/js/features/ide-redesign/components/chat/message.tsx
index a3676e2216..6822db39da 100644
--- a/services/web/frontend/js/features/ide-redesign/components/chat/message.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/chat/message.tsx
@@ -1,17 +1,33 @@
 import { MessageProps } from '@/features/chat/components/message'
 import { User } from '../../../../../../types/user'
-import { getHueForUserId } from '@/shared/utils/colors'
+import {
+  getBackgroundColorForUserId,
+  hslStringToLuminance,
+} from '@/shared/utils/colors'
 import MessageContent from '@/features/chat/components/message-content'
 import classNames from 'classnames'
-
-function hue(user?: User) {
-  return user ? getHueForUserId(user.id) : 0
-}
+import MaterialIcon from '@/shared/components/material-icon'
+import { t } from 'i18next'
 
 function getAvatarStyle(user?: User) {
+  if (!user?.id) {
+    // Deleted user
+    return {
+      backgroundColor: 'var(--bg-light-disabled)',
+      borderColor: 'var(--bg-light-disabled)',
+      color: 'var(--content-disabled)',
+    }
+  }
+
+  const backgroundColor = getBackgroundColorForUserId(user.id)
+
   return {
-    borderColor: `hsl(${hue(user)}, 85%, 40%)`,
-    backgroundColor: `hsl(${hue(user)}, 85%, 40%`,
+    borderColor: backgroundColor,
+    backgroundColor,
+    color:
+      hslStringToLuminance(backgroundColor) < 0.5
+        ? 'var(--content-primary-dark)'
+        : 'var(--content-primary)',
   }
 }
 
@@ -22,7 +38,11 @@ function Message({ message, fromSelf }: MessageProps) {
         <div className="message-avatar-placeholder" />
         {!fromSelf && (
           <div className="message-author">
-            <span>{message.user.first_name || message.user.email}</span>
+            <span>
+              {message.user?.id && message.user.email
+                ? message.user.first_name || message.user.email
+                : t('deleted_user')}
+            </span>
           </div>
         )}
       </div>
@@ -32,8 +52,15 @@ function Message({ message, fromSelf }: MessageProps) {
             {!fromSelf && index === message.contents.length - 1 ? (
               <div className="message-avatar">
                 <div className="avatar" style={getAvatarStyle(message.user)}>
-                  {message.user.first_name?.charAt(0) ||
-                    message.user.email.charAt(0)}
+                  {message.user?.id && message.user.email ? (
+                    message.user.first_name?.charAt(0) ||
+                    message.user.email.charAt(0)
+                  ) : (
+                    <MaterialIcon
+                      type="delete"
+                      className="message-avatar-deleted-user-icon"
+                    />
+                  )}
                 </div>
               </div>
             ) : (
diff --git a/services/web/frontend/js/features/ide-redesign/components/editor-panel.tsx b/services/web/frontend/js/features/ide-redesign/components/editor-panel.tsx
index 18fcad1395..d8204da5da 100644
--- a/services/web/frontend/js/features/ide-redesign/components/editor-panel.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/editor-panel.tsx
@@ -12,7 +12,10 @@ export default function EditorPanel() {
     <div className="ide-redesign-editor-container">
       {selectedEntityCount === 0 && <NoSelectionPane />}
       {selectedEntityCount === 1 && openEntity?.type === 'fileRef' && (
-        <FileView file={fileViewFile(openEntity.entity)} />
+        <FileView
+          file={fileViewFile(openEntity.entity)}
+          key={openEntity.entity._id}
+        />
       )}
       {selectedEntityCount > 1 && (
         <MultipleSelectionPane selectedEntityCount={selectedEntityCount} />
diff --git a/services/web/frontend/js/features/ide-redesign/components/editor.tsx b/services/web/frontend/js/features/ide-redesign/components/editor.tsx
index 6c5e0b40db..785ba1fb99 100644
--- a/services/web/frontend/js/features/ide-redesign/components/editor.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/editor.tsx
@@ -1,8 +1,6 @@
 import { LoadingPane } from '@/features/ide-react/components/editor/loading-pane'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import { EditorScopeValue } from '@/features/ide-react/scope-adapters/editor-manager-context-adapter'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import { useFileTreeOpenContext } from '@/features/ide-react/context/file-tree-open-context'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import classNames from 'classnames'
 import SourceEditor from '@/features/source-editor/components/source-editor'
 import { Panel, PanelGroup } from 'react-resizable-panels'
@@ -10,20 +8,20 @@ import { VerticalResizeHandle } from '@/features/ide-react/components/resize/ver
 import { Suspense } from 'react'
 import { FullSizeLoadingSpinner } from '@/shared/components/loading-spinner'
 import SymbolPalettePane from '@/features/ide-react/components/editor/symbol-palette-pane'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
 export const Editor = () => {
-  const [editor] = useScopeValue<EditorScopeValue>('editor')
+  const { opening, errorState, showSymbolPalette } =
+    useEditorPropertiesContext()
   const { selectedEntityCount, openEntity } = useFileTreeOpenContext()
-  const { currentDocumentId } = useEditorManagerContext()
+  const { currentDocumentId, currentDocument } = useEditorOpenDocContext()
 
   if (!currentDocumentId) {
     return null
   }
 
   const isLoading = Boolean(
-    (!editor.sharejs_doc || editor.opening) &&
-      !editor.error_state &&
-      editor.open_doc_id
+    (!currentDocument || opening) && !errorState && currentDocumentId
   )
 
   return (
@@ -44,7 +42,7 @@ export const Editor = () => {
           <SourceEditor />
           {isLoading && <LoadingPane />}
         </Panel>
-        {editor.showSymbolPalette && (
+        {showSymbolPalette && (
           <>
             <VerticalResizeHandle id="ide-redesign-editor-symbol-palette" />
             <Panel
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/error-indicator.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-indicator.tsx
new file mode 100644
index 0000000000..7b721a1d51
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-indicator.tsx
@@ -0,0 +1,25 @@
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import { RailIndicator } from '../rail-indicator'
+
+export default function ErrorIndicator() {
+  const { logEntries } = useCompileContext()
+
+  if (!logEntries) {
+    return null
+  }
+
+  const errorCount = Number(logEntries.errors?.length)
+  const warningCount = Number(logEntries.warnings?.length)
+  const totalCount = errorCount + warningCount
+
+  if (totalCount === 0) {
+    return null
+  }
+
+  return (
+    <RailIndicator
+      count={totalCount}
+      type={errorCount > 0 ? 'danger' : 'warning'}
+    />
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-header.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-header.tsx
new file mode 100644
index 0000000000..2f3a54b095
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-header.tsx
@@ -0,0 +1,98 @@
+import { useTranslation } from 'react-i18next'
+import RailPanelHeader from '../rail-panel-header'
+import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import {
+  Dropdown,
+  DropdownMenu,
+  DropdownToggle,
+} from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import PdfFileList from '@/features/pdf-preview/components/pdf-file-list'
+import { forwardRef } from 'react'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+
+export default function ErrorLogsHeader() {
+  const { t } = useTranslation()
+
+  return (
+    <RailPanelHeader
+      title={t('logs')}
+      actions={[
+        <DownloadFileDropdown key="download-files" />,
+        <ClearCacheButton key="clear-cache" />,
+      ]}
+    />
+  )
+}
+
+const ClearCacheButton = () => {
+  const { compiling, clearCache, clearingCache } = useCompileContext()
+  const { t } = useTranslation()
+
+  return (
+    <OLTooltip
+      id="clear-cache"
+      description={t('clear_cached_files')}
+      overlayProps={{ placement: 'bottom' }}
+    >
+      <OLIconButton
+        unfilled
+        onClick={() => clearCache()}
+        className="rail-panel-header-button-subdued"
+        icon="auto_delete"
+        isLoading={clearingCache}
+        disabled={clearingCache || compiling}
+        accessibilityLabel={t('clear_cached_files')}
+        size="sm"
+      />
+    </OLTooltip>
+  )
+}
+
+const DownloadFileDropdown = () => {
+  const { fileList } = useCompileContext()
+
+  const { t } = useTranslation()
+
+  return (
+    <Dropdown align="end">
+      <DropdownToggle
+        as={DownloadFileDropdownToggleButton}
+        id="dropdown-files-dropdown-toggle"
+      >
+        {t('other_logs_and_files')}
+      </DropdownToggle>
+      {fileList && (
+        <DropdownMenu id="dropdown-files-logs-pane-list">
+          <PdfFileList fileList={fileList} />
+        </DropdownMenu>
+      )}
+    </Dropdown>
+  )
+}
+
+const DownloadFileDropdownToggleButton = forwardRef<
+  HTMLButtonElement,
+  { onClick: React.MouseEventHandler }
+>(function DownloadFileDropdownToggleButton({ onClick }, ref) {
+  const { compiling, fileList } = useCompileContext()
+  const { t } = useTranslation()
+
+  return (
+    <OLTooltip
+      id="more-logs-and-files"
+      description={t('more_logs_and_files')}
+      overlayProps={{ placement: 'bottom' }}
+    >
+      <OLIconButton
+        ref={ref}
+        onClick={onClick}
+        className="rail-panel-header-button-subdued"
+        icon="download"
+        disabled={compiling || !fileList}
+        accessibilityLabel={t('other_logs_and_files')}
+        size="sm"
+      />
+    </OLTooltip>
+  )
+})
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-panel.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-panel.tsx
new file mode 100644
index 0000000000..2cff048256
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs-panel.tsx
@@ -0,0 +1,14 @@
+import { PdfPreviewProvider } from '@/features/pdf-preview/components/pdf-preview-provider'
+import ErrorLogs from './error-logs'
+import ErrorLogsHeader from './error-logs-header'
+
+export default function ErrorLogsPanel() {
+  return (
+    <PdfPreviewProvider>
+      <div className="error-logs-panel">
+        <ErrorLogsHeader />
+        <ErrorLogs />
+      </div>
+    </PdfPreviewProvider>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs.tsx
new file mode 100644
index 0000000000..ffc305939f
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/error-logs.tsx
@@ -0,0 +1,146 @@
+import { useTranslation } from 'react-i18next'
+import { ElementType, memo, useMemo, useState } from 'react'
+import { usePdfPreviewContext } from '@/features/pdf-preview/components/pdf-preview-provider'
+import StopOnFirstErrorPrompt from '@/features/pdf-preview/components/stop-on-first-error-prompt'
+import PdfPreviewError from '@/features/pdf-preview/components/pdf-preview-error'
+import PdfValidationIssue from '@/features/pdf-preview/components/pdf-validation-issue'
+import PdfLogsEntries from '@/features/pdf-preview/components/pdf-logs-entries'
+import PdfPreviewErrorBoundaryFallback from '@/features/pdf-preview/components/pdf-preview-error-boundary-fallback'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import { Nav, NavLink, TabContainer, TabContent } from 'react-bootstrap'
+import { LogEntry as LogEntryData } from '@/features/pdf-preview/util/types'
+import LogEntry from './log-entry'
+import importOverleafModules from '../../../../../macros/import-overleaf-module.macro'
+
+const logsComponents: Array<{
+  import: { default: ElementType }
+  path: string
+}> = importOverleafModules('errorLogsComponents')
+
+type ErrorLogTab = {
+  key: string
+  label: string
+  entries: LogEntryData[] | undefined
+}
+
+function ErrorLogs() {
+  const { error, logEntries, rawLog, validationIssues, stoppedOnFirstError } =
+    useCompileContext()
+
+  const tabs = useMemo(() => {
+    return [
+      { key: 'all', label: 'All', entries: logEntries?.all },
+      { key: 'errors', label: 'Errors', entries: logEntries?.errors },
+      { key: 'warnings', label: 'Warnings', entries: logEntries?.warnings },
+      { key: 'info', label: 'Info', entries: logEntries?.typesetting },
+    ]
+  }, [logEntries])
+
+  const { loadingError } = usePdfPreviewContext()
+
+  const { t } = useTranslation()
+
+  const [activeTab, setActiveTab] = useState<string | null>('all')
+
+  const entries = useMemo(() => {
+    return tabs.find(tab => tab.key === activeTab)?.entries || []
+  }, [activeTab, tabs])
+
+  const includeErrors = activeTab === 'all' || activeTab === 'errors'
+  const includeWarnings = activeTab === 'all' || activeTab === 'warnings'
+
+  return (
+    <TabContainer onSelect={setActiveTab} defaultActiveKey={activeTab ?? 'all'}>
+      <Nav defaultActiveKey="all" className="error-logs-tabs">
+        {tabs.map(tab => (
+          <TabHeader key={tab.key} tab={tab} active={activeTab === tab.key} />
+        ))}
+      </Nav>
+      {logsComponents.map(({ import: { default: Component }, path }) => (
+        <Component key={path} />
+      ))}
+      <TabContent className="error-logs">
+        <div className="logs-pane-content">
+          {stoppedOnFirstError && includeErrors && <StopOnFirstErrorPrompt />}
+
+          {loadingError && (
+            <PdfPreviewError
+              error="pdf-viewer-loading-error"
+              includeErrors={includeErrors}
+              includeWarnings={includeWarnings}
+            />
+          )}
+
+          {error && (
+            <PdfPreviewError
+              error={error}
+              includeErrors={includeErrors}
+              includeWarnings={includeWarnings}
+            />
+          )}
+
+          {includeErrors &&
+            validationIssues &&
+            Object.entries(validationIssues).map(([name, issue]) => (
+              <PdfValidationIssue key={name} name={name} issue={issue} />
+            ))}
+
+          {entries && (
+            <PdfLogsEntries
+              entries={entries}
+              hasErrors={
+                includeErrors &&
+                logEntries?.errors &&
+                logEntries?.errors.length > 0
+              }
+            />
+          )}
+
+          {rawLog && activeTab === 'all' && (
+            <LogEntry
+              headerTitle={t('raw_logs')}
+              rawContent={rawLog}
+              entryAriaLabel={t('raw_logs_description')}
+              level="raw"
+              alwaysExpandRawContent
+              showSourceLocationLink={false}
+            />
+          )}
+        </div>
+      </TabContent>
+    </TabContainer>
+  )
+}
+
+function formatErrorNumber(num: number | undefined) {
+  if (num === undefined) {
+    return undefined
+  }
+
+  if (num > 99) {
+    return '99+'
+  }
+
+  return Math.floor(num).toString()
+}
+
+const TabHeader = ({ tab, active }: { tab: ErrorLogTab; active: boolean }) => {
+  return (
+    <NavLink
+      eventKey={tab.key}
+      className="error-logs-tab-header"
+      active={active}
+    >
+      {tab.label}
+      <div className="error-logs-tab-count">
+        {/* TODO: it would be nice if this number included custom errors */}
+        {formatErrorNumber(tab.entries?.length)}
+      </div>
+    </NavLink>
+  )
+}
+
+export default withErrorBoundary(memo(ErrorLogs), () => (
+  <PdfPreviewErrorBoundaryFallback type="logs" />
+))
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry-header.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry-header.tsx
new file mode 100644
index 0000000000..3b4c9f6347
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry-header.tsx
@@ -0,0 +1,162 @@
+import classNames from 'classnames'
+import { useState, useRef, MouseEventHandler, ElementType } from 'react'
+import { useTranslation } from 'react-i18next'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import {
+  ErrorLevel,
+  SourceLocation,
+  LogEntry as LogEntryData,
+} from '@/features/pdf-preview/util/types'
+import useResizeObserver from '@/features/preview/hooks/use-resize-observer'
+import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
+import importOverleafModules from '../../../../../macros/import-overleaf-module.macro'
+import MaterialIcon from '@/shared/components/material-icon'
+
+const actionComponents = importOverleafModules(
+  'pdfLogEntryHeaderActionComponents'
+) as {
+  import: { default: ElementType }
+  path: string
+}[]
+
+function LogEntryHeader({
+  sourceLocation,
+  level,
+  headerTitle,
+  logType,
+  showSourceLocationLink = true,
+  onSourceLocationClick,
+  collapsed,
+  onToggleCollapsed,
+  id,
+  logEntry,
+  actionButtonsOverride,
+  openCollapseIconOverride,
+}: {
+  headerTitle: string | React.ReactNode
+  level: ErrorLevel
+  logType?: string
+  sourceLocation?: SourceLocation
+  showSourceLocationLink?: boolean
+  onSourceLocationClick?: MouseEventHandler<HTMLButtonElement>
+  collapsed: boolean
+  onToggleCollapsed: () => void
+  id?: string
+  logEntry?: LogEntryData
+  actionButtonsOverride?: React.ReactNode
+  openCollapseIconOverride?: string
+}) {
+  const { t } = useTranslation()
+  const logLocationSpanRef = useRef<HTMLSpanElement>(null)
+  const [locationSpanOverflown, setLocationSpanOverflown] = useState(false)
+
+  useResizeObserver(
+    logLocationSpanRef,
+    locationSpanOverflown,
+    checkLocationSpanOverflow
+  )
+
+  const file = sourceLocation ? sourceLocation.file : null
+  const line = sourceLocation ? sourceLocation.line : null
+  const logEntryHeaderTextClasses = classNames('log-entry-header-text', {
+    'log-entry-header-text-error': level === 'error',
+    'log-entry-header-text-warning': level === 'warning',
+    'log-entry-header-text-info': level === 'info' || level === 'typesetting',
+    'log-entry-header-text-success': level === 'success',
+    'log-entry-header-text-raw': level === 'raw',
+  })
+
+  function checkLocationSpanOverflow(observedElement: ResizeObserverEntry) {
+    const spanEl = observedElement.target
+    const isOverflowing = spanEl.scrollWidth > spanEl.clientWidth
+    setLocationSpanOverflown(isOverflowing)
+  }
+
+  const locationText =
+    showSourceLocationLink && file ? `${file}${line ? `, ${line}` : ''}` : null
+
+  // Because we want an ellipsis on the left-hand side (e.g. "...longfilename.tex"), the
+  // `log-entry-location` class has text laid out from right-to-left using the CSS
+  // rule `direction: rtl;`.
+  // This works most of the times, except when the first character of the filename is considered
+  // a punctuation mark, like `/` (e.g. `/foo/bar/baz.sty`). In this case, because of
+  // right-to-left writing rules, the punctuation mark is moved to the right-side of the string,
+  // resulting in `...bar/baz.sty/` instead of `...bar/baz.sty`.
+  // To avoid this edge-case, we wrap the `logLocationLinkText` in two directional formatting
+  // characters:
+  //   * \u202A LEFT-TO-RIGHT EMBEDDING Treat the following text as embedded left-to-right.
+  //   * \u202C POP DIRECTIONAL FORMATTING End the scope of the last LRE, RLE, RLO, or LRO.
+  // This essentially tells the browser that, althought the text is laid out from right-to-left,
+  // the wrapped portion of text should follow left-to-right writing rules.
+  const formattedLocationText = locationText ? (
+    <span ref={logLocationSpanRef} className="log-entry-location">
+      {`\u202A${locationText}\u202C`}
+    </span>
+  ) : null
+
+  const headerTitleText = logType ? `${logType} ${headerTitle}` : headerTitle
+
+  return (
+    <header className="log-entry-header-card">
+      <OLTooltip
+        id={`expand-collapse-${locationText}`}
+        description={collapsed ? t('expand') : t('collapse')}
+        overlayProps={{ placement: 'bottom' }}
+      >
+        <button
+          data-action="expand-collapse"
+          data-collapsed={collapsed}
+          className="log-entry-header-button"
+          onClick={onToggleCollapsed}
+          aria-label={collapsed ? t('expand') : t('collapse')}
+        >
+          <MaterialIcon
+            type={
+              openCollapseIconOverride ??
+              (collapsed ? 'chevron_right' : 'expand_more')
+            }
+          />
+          <div className="log-entry-header-content">
+            <h3 className={logEntryHeaderTextClasses}>{headerTitleText}</h3>
+            {locationSpanOverflown && formattedLocationText && locationText ? (
+              <OLTooltip
+                id={locationText}
+                description={locationText}
+                overlayProps={{ placement: 'left' }}
+                tooltipProps={{ className: 'log-location-tooltip' }}
+              >
+                {formattedLocationText}
+              </OLTooltip>
+            ) : (
+              formattedLocationText
+            )}
+          </div>
+        </button>
+      </OLTooltip>
+
+      {actionButtonsOverride ?? (
+        <div className="log-entry-header-actions">
+          {showSourceLocationLink && (
+            <OLTooltip
+              id={`go-to-location-${locationText}`}
+              description={t('go_to_code_location')}
+              overlayProps={{ placement: 'bottom' }}
+            >
+              <OLIconButton
+                onClick={onSourceLocationClick}
+                variant="ghost"
+                icon="my_location"
+                accessibilityLabel={t('go_to_code_location')}
+              />
+            </OLTooltip>
+          )}
+          {actionComponents.map(({ import: { default: Component }, path }) => (
+            <Component key={path} logEntry={logEntry} id={id} />
+          ))}
+        </div>
+      )}
+    </header>
+  )
+}
+
+export default LogEntryHeader
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry.tsx
new file mode 100644
index 0000000000..4ff66ba6d3
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/log-entry.tsx
@@ -0,0 +1,140 @@
+import {
+  Dispatch,
+  MouseEventHandler,
+  useCallback,
+  memo,
+  SetStateAction,
+  useState,
+} from 'react'
+import HumanReadableLogsHints from '../../../../ide/human-readable-logs/HumanReadableLogsHints'
+import { sendMB } from '@/infrastructure/event-tracking'
+import {
+  ErrorLevel,
+  LogEntry as LogEntryData,
+  SourceLocation,
+} from '@/features/pdf-preview/util/types'
+import LogEntryHeader from './log-entry-header'
+import PdfLogEntryContent from '@/features/pdf-preview/components/pdf-log-entry-content'
+import classNames from 'classnames'
+
+type LogEntryProps = {
+  headerTitle: string | React.ReactNode
+  level: ErrorLevel
+  ruleId?: string
+  rawContent?: string
+  logType?: string
+  formattedContent?: React.ReactNode
+  extraInfoURL?: string | null
+  sourceLocation?: SourceLocation
+  showSourceLocationLink?: boolean
+  entryAriaLabel?: string
+  contentDetails?: string[]
+  onSourceLocationClick?: (sourceLocation: SourceLocation) => void
+  index?: number
+  logEntry?: LogEntryData
+  id?: string
+  alwaysExpandRawContent?: boolean
+  className?: string
+  actionButtonsOverride?: React.ReactNode
+  openCollapseIconOverride?: string
+}
+
+function LogEntry(props: LogEntryProps) {
+  const [collapsed, setCollapsed] = useState(props.index !== 0)
+
+  return (
+    <ControlledLogEntry
+      {...props}
+      collapsed={collapsed}
+      setCollapsed={setCollapsed}
+    />
+  )
+}
+
+export function ControlledLogEntry({
+  ruleId,
+  headerTitle,
+  rawContent,
+  logType,
+  formattedContent,
+  extraInfoURL,
+  level,
+  sourceLocation,
+  showSourceLocationLink = true,
+  entryAriaLabel = undefined,
+  contentDetails,
+  onSourceLocationClick,
+  index,
+  logEntry,
+  id,
+  alwaysExpandRawContent = false,
+  className,
+  collapsed,
+  setCollapsed,
+  actionButtonsOverride,
+  openCollapseIconOverride,
+}: LogEntryProps & {
+  collapsed: boolean
+  setCollapsed: Dispatch<SetStateAction<boolean>>
+}) {
+  if (ruleId && HumanReadableLogsHints[ruleId]) {
+    const hint = HumanReadableLogsHints[ruleId]
+    formattedContent = hint.formattedContent(contentDetails)
+    extraInfoURL = hint.extraInfoURL
+  }
+
+  const handleLogEntryLinkClick: MouseEventHandler<HTMLButtonElement> =
+    useCallback(
+      event => {
+        event.preventDefault()
+
+        if (onSourceLocationClick && sourceLocation) {
+          onSourceLocationClick(sourceLocation)
+
+          const parts = sourceLocation?.file?.split('.')
+          const extension =
+            parts?.length && parts?.length > 1 ? parts.pop() : ''
+          sendMB('log-entry-link-click', { level, ruleId, extension })
+        }
+      },
+      [level, onSourceLocationClick, ruleId, sourceLocation]
+    )
+
+  return (
+    <div
+      className={classNames('log-entry', className)}
+      data-ruleid={ruleId}
+      data-log-entry-id={id}
+      aria-label={entryAriaLabel}
+    >
+      <LogEntryHeader
+        level={level}
+        sourceLocation={sourceLocation}
+        headerTitle={headerTitle}
+        logType={logType}
+        showSourceLocationLink={showSourceLocationLink}
+        onSourceLocationClick={handleLogEntryLinkClick}
+        collapsed={collapsed}
+        onToggleCollapsed={() => setCollapsed(collapsed => !collapsed)}
+        id={id}
+        logEntry={logEntry}
+        actionButtonsOverride={actionButtonsOverride}
+        openCollapseIconOverride={openCollapseIconOverride}
+      />
+      <div
+        className={classNames('horizontal-divider', { hidden: collapsed })}
+      />
+      <PdfLogEntryContent
+        className={classNames({ hidden: collapsed })}
+        alwaysExpandRawContent={alwaysExpandRawContent}
+        rawContent={rawContent}
+        formattedContent={formattedContent}
+        extraInfoURL={extraInfoURL}
+        index={index}
+        logEntry={logEntry}
+      />
+    </div>
+  )
+}
+
+export default memo(LogEntry)
diff --git a/services/web/frontend/js/features/ide-redesign/components/error-logs/old-error-pane.tsx b/services/web/frontend/js/features/ide-redesign/components/error-logs/old-error-pane.tsx
new file mode 100644
index 0000000000..7794747d30
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/error-logs/old-error-pane.tsx
@@ -0,0 +1,10 @@
+import PdfLogsViewer from '@/features/pdf-preview/components/pdf-logs-viewer'
+import { PdfPreviewProvider } from '@/features/pdf-preview/components/pdf-preview-provider'
+
+export default function OldErrorPane() {
+  return (
+    <PdfPreviewProvider>
+      <PdfLogsViewer alwaysVisible />
+    </PdfPreviewProvider>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/errors.tsx b/services/web/frontend/js/features/ide-redesign/components/errors.tsx
deleted file mode 100644
index 73b3ae4bc1..0000000000
--- a/services/web/frontend/js/features/ide-redesign/components/errors.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import PdfLogsViewer from '@/features/pdf-preview/components/pdf-logs-viewer'
-import { PdfPreviewProvider } from '@/features/pdf-preview/components/pdf-preview-provider'
-import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
-import OLBadge from '@/features/ui/components/ol/ol-badge'
-
-export const ErrorIndicator = () => {
-  const { logEntries } = useCompileContext()
-
-  if (!logEntries) {
-    return null
-  }
-
-  const errorCount = Number(logEntries.errors?.length)
-  const warningCount = Number(logEntries.warnings?.length)
-  const totalCount = errorCount + warningCount
-
-  if (totalCount === 0) {
-    return null
-  }
-
-  return (
-    <OLBadge bg={errorCount > 0 ? 'danger' : 'warning'}>{totalCount}</OLBadge>
-  )
-}
-
-export const ErrorPane = () => {
-  return (
-    <PdfPreviewProvider>
-      <PdfLogsViewer alwaysVisible />
-    </PdfPreviewProvider>
-  )
-}
diff --git a/services/web/frontend/js/features/ide-redesign/components/file-tree-toolbar.tsx b/services/web/frontend/js/features/ide-redesign/components/file-tree-toolbar.tsx
deleted file mode 100644
index cdc28ef4b7..0000000000
--- a/services/web/frontend/js/features/ide-redesign/components/file-tree-toolbar.tsx
+++ /dev/null
@@ -1,112 +0,0 @@
-import { useTranslation } from 'react-i18next'
-import * as eventTracking from '../../../infrastructure/event-tracking'
-import { useFileTreeActionable } from '@/features/file-tree/contexts/file-tree-actionable'
-import { useFileTreeData } from '@/shared/context/file-tree-data-context'
-import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import MaterialIcon, {
-  AvailableUnfilledIcon,
-} from '@/shared/components/material-icon'
-import React from 'react'
-import useCollapsibleFileTree from '../hooks/use-collapsible-file-tree'
-
-function FileTreeToolbar() {
-  const { t } = useTranslation()
-  const { fileTreeExpanded, toggleFileTreeExpanded } = useCollapsibleFileTree()
-
-  return (
-    <div className="file-tree-toolbar">
-      <button
-        className="file-tree-expand-collapse-button"
-        onClick={toggleFileTreeExpanded}
-        aria-label={
-          fileTreeExpanded ? t('hide_file_tree') : t('show_file_tree')
-        }
-      >
-        <MaterialIcon
-          type={
-            fileTreeExpanded ? 'keyboard_arrow_down' : 'keyboard_arrow_right'
-          }
-        />
-        <h4>{t('file_tree')}</h4>
-      </button>
-      <FileTreeActionButtons />
-    </div>
-  )
-}
-
-function FileTreeActionButtons() {
-  const { t } = useTranslation()
-  const { fileTreeReadOnly } = useFileTreeData()
-
-  const {
-    canCreate,
-    startCreatingFolder,
-    startCreatingDocOrFile,
-    startUploadingDocOrFile,
-  } = useFileTreeActionable()
-
-  if (!canCreate || fileTreeReadOnly) return null
-
-  const createWithAnalytics = () => {
-    eventTracking.sendMB('new-file-click', { location: 'toolbar' })
-    startCreatingDocOrFile()
-  }
-
-  const uploadWithAnalytics = () => {
-    eventTracking.sendMB('upload-click', { location: 'toolbar' })
-    startUploadingDocOrFile()
-  }
-
-  return (
-    <div className="file-tree-toolbar-action-buttons">
-      <FileTreeActionButton
-        id="new-file"
-        description={t('new_file')}
-        onClick={createWithAnalytics}
-        iconType="note_add"
-      />
-      <FileTreeActionButton
-        id="new-folder"
-        description={t('new_folder')}
-        onClick={startCreatingFolder}
-        iconType="create_new_folder"
-      />
-      <FileTreeActionButton
-        id="upload"
-        description={t('upload')}
-        onClick={uploadWithAnalytics}
-        iconType="upload_file"
-      />
-    </div>
-  )
-}
-
-function FileTreeActionButton({
-  id,
-  description,
-  onClick,
-  iconType,
-}: {
-  id: string
-  description: string
-  onClick: () => void
-  iconType: AvailableUnfilledIcon
-}) {
-  return (
-    <OLTooltip
-      id={id}
-      description={description}
-      overlayProps={{ placement: 'bottom' }}
-    >
-      <button className="btn file-tree-toolbar-action-button" onClick={onClick}>
-        <MaterialIcon
-          unfilled
-          type={iconType}
-          accessibilityLabel={description}
-        />
-      </button>
-    </OLTooltip>
-  )
-}
-
-export default FileTreeToolbar
diff --git a/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-button.tsx b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-button.tsx
new file mode 100644
index 0000000000..5678db58c8
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-button.tsx
@@ -0,0 +1,33 @@
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import MaterialIcon, {
+  AvailableUnfilledIcon,
+} from '@/shared/components/material-icon'
+import React from 'react'
+
+export default function FileTreeActionButton({
+  id,
+  description,
+  onClick,
+  iconType,
+}: {
+  id: string
+  description: string
+  onClick: () => void
+  iconType: AvailableUnfilledIcon
+}) {
+  return (
+    <OLTooltip
+      id={id}
+      description={description}
+      overlayProps={{ placement: 'bottom' }}
+    >
+      <button className="btn file-tree-toolbar-action-button" onClick={onClick}>
+        <MaterialIcon
+          unfilled
+          type={iconType}
+          accessibilityLabel={description}
+        />
+      </button>
+    </OLTooltip>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-buttons.tsx b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-buttons.tsx
new file mode 100644
index 0000000000..bcac7c4ba9
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-action-buttons.tsx
@@ -0,0 +1,115 @@
+import { useTranslation } from 'react-i18next'
+import * as eventTracking from '../../../../infrastructure/event-tracking'
+import { useFileTreeActionable } from '@/features/file-tree/contexts/file-tree-actionable'
+import { useFileTreeData } from '@/shared/context/file-tree-data-context'
+import React from 'react'
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
+import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
+import FileTreeActionButton from './file-tree-action-button'
+import { useRailContext } from '../../contexts/rail-context'
+
+export default function FileTreeActionButtons() {
+  const { t } = useTranslation()
+  const { fileTreeReadOnly } = useFileTreeData()
+  const { write } = usePermissionsContext()
+  const { handlePaneCollapse } = useRailContext()
+
+  const {
+    canCreate,
+    canBulkDelete,
+    startDeleting,
+    startCreatingFolder,
+    startCreatingDocOrFile,
+    startUploadingDocOrFile,
+  } = useFileTreeActionable()
+
+  useCommandProvider(() => {
+    if (!canCreate || fileTreeReadOnly || !write) return
+    return [
+      {
+        label: t('new_file'),
+        id: 'new_file',
+        handler: ({ location }) => {
+          eventTracking.sendMB('new-file-click', { location })
+          startCreatingDocOrFile()
+        },
+      },
+      {
+        label: t('new_folder'),
+        id: 'new_folder',
+        handler: startCreatingFolder,
+      },
+      {
+        label: t('upload_file'),
+        id: 'upload_file',
+        handler: ({ location }) => {
+          eventTracking.sendMB('upload-click', { location })
+          startUploadingDocOrFile()
+        },
+      },
+    ]
+  }, [
+    canCreate,
+    fileTreeReadOnly,
+    startCreatingDocOrFile,
+    t,
+    startCreatingFolder,
+    startUploadingDocOrFile,
+    write,
+  ])
+
+  if (fileTreeReadOnly) return null
+
+  const createWithAnalytics = () => {
+    eventTracking.sendMB('new-file-click', { location: 'toolbar' })
+    startCreatingDocOrFile()
+  }
+
+  const uploadWithAnalytics = () => {
+    eventTracking.sendMB('upload-click', { location: 'toolbar' })
+    startUploadingDocOrFile()
+  }
+
+  return (
+    <div className="file-tree-toolbar-action-buttons">
+      {canCreate && (
+        <FileTreeActionButton
+          id="new-file"
+          description={t('new_file')}
+          onClick={createWithAnalytics}
+          iconType="note_add"
+        />
+      )}
+      {canCreate && (
+        <FileTreeActionButton
+          id="new-folder"
+          description={t('new_folder')}
+          onClick={startCreatingFolder}
+          iconType="create_new_folder"
+        />
+      )}
+      {canCreate && (
+        <FileTreeActionButton
+          id="upload"
+          description={t('upload')}
+          onClick={uploadWithAnalytics}
+          iconType="upload"
+        />
+      )}
+      {canBulkDelete && (
+        <FileTreeActionButton
+          id="delete"
+          description={t('delete')}
+          onClick={startDeleting}
+          iconType="delete"
+        />
+      )}
+      <FileTreeActionButton
+        id="close"
+        description={t('close')}
+        onClick={handlePaneCollapse}
+        iconType="close"
+      />
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/file-tree-outline-panel.tsx b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-outline-panel.tsx
similarity index 95%
rename from services/web/frontend/js/features/ide-redesign/components/file-tree-outline-panel.tsx
rename to services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-outline-panel.tsx
index bf69d40e59..62c228973e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/file-tree-outline-panel.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-outline-panel.tsx
@@ -3,7 +3,7 @@ import { FileTree } from '@/features/ide-react/components/file-tree'
 import { OutlineContainer } from '@/features/outline/components/outline-container'
 import { VerticalResizeHandle } from '@/features/ide-react/components/resize/vertical-resize-handle'
 import { useOutlinePane } from '@/features/ide-react/hooks/use-outline-pane'
-import useCollapsibleFileTree from '../hooks/use-collapsible-file-tree'
+import useCollapsibleFileTree from '../../hooks/use-collapsible-file-tree'
 import classNames from 'classnames'
 
 function FileTreeOutlinePanel() {
diff --git a/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-toolbar.tsx b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-toolbar.tsx
new file mode 100644
index 0000000000..231f98e7d7
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/file-tree/file-tree-toolbar.tsx
@@ -0,0 +1,32 @@
+import { useTranslation } from 'react-i18next'
+import MaterialIcon from '@/shared/components/material-icon'
+import React from 'react'
+import useCollapsibleFileTree from '../../hooks/use-collapsible-file-tree'
+import FileTreeActionButtons from './file-tree-action-buttons'
+
+function FileTreeToolbar() {
+  const { t } = useTranslation()
+  const { fileTreeExpanded, toggleFileTreeExpanded } = useCollapsibleFileTree()
+
+  return (
+    <div className="file-tree-toolbar">
+      <button
+        className="file-tree-expand-collapse-button"
+        onClick={toggleFileTreeExpanded}
+        aria-label={
+          fileTreeExpanded ? t('hide_file_tree') : t('show_file_tree')
+        }
+      >
+        <MaterialIcon
+          type={
+            fileTreeExpanded ? 'keyboard_arrow_down' : 'keyboard_arrow_right'
+          }
+        />
+        <h4>{t('file_tree')}</h4>
+      </button>
+      <FileTreeActionButtons />
+    </div>
+  )
+}
+
+export default FileTreeToolbar
diff --git a/services/web/frontend/js/features/ide-redesign/components/full-project-search-panel.tsx b/services/web/frontend/js/features/ide-redesign/components/full-project-search-panel.tsx
new file mode 100644
index 0000000000..926341ce89
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/full-project-search-panel.tsx
@@ -0,0 +1,19 @@
+import { ElementType } from 'react'
+import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
+
+const componentModule = importOverleafModules('fullProjectSearchPanel')[0] as
+  | {
+      import: { default: ElementType }
+      path: string
+    }
+  | undefined
+
+export const FullProjectSearchPanel = () => {
+  if (!componentModule) {
+    return null
+  }
+  const FullProjectSearch = componentModule.import.default
+  return <FullProjectSearch />
+}
+
+export const hasFullProjectSearch = Boolean(componentModule)
diff --git a/services/web/frontend/js/features/ide-redesign/components/integrations-panel/integrations-panel.tsx b/services/web/frontend/js/features/ide-redesign/components/integrations-panel/integrations-panel.tsx
index d1e4358907..e477602e3e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/integrations-panel/integrations-panel.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/integrations-panel/integrations-panel.tsx
@@ -1,7 +1,7 @@
 import { ElementType } from 'react'
 import importOverleafModules from '../../../../../macros/import-overleaf-module.macro'
-import { RailPanelHeader } from '../rail'
 import { useTranslation } from 'react-i18next'
+import RailPanelHeader from '../rail-panel-header'
 
 const integrationPanelComponents = importOverleafModules(
   'integrationPanelComponents'
diff --git a/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx b/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx
new file mode 100644
index 0000000000..6b9cc657b5
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx
@@ -0,0 +1,32 @@
+import { useState } from 'react'
+import LabsExperimentWidget from '../../../shared/components/labs/labs-experiments-widget'
+import { isInExperiment } from '@/utils/labs-utils'
+import { useTranslation } from 'react-i18next'
+import labsIcon from '../images/labs-icon.svg'
+
+const EditorRedesignLabsWidget = ({
+  labsProgram,
+  setErrorMessage,
+}: {
+  labsProgram: boolean
+  setErrorMessage: (err: string) => void
+}) => {
+  const { t } = useTranslation()
+  const [optedIn, setOptedIn] = useState(isInExperiment('editor-redesign'))
+  return (
+    <LabsExperimentWidget
+      description={t(
+        'access_your_favourite_features_faster_with_our_new_streamlined_editor'
+      )}
+      experimentName="editor-redesign"
+      logo={<img src={labsIcon} alt="" aria-hidden="true" />}
+      labsEnabled={labsProgram}
+      setErrorMessage={setErrorMessage}
+      optedIn={optedIn}
+      setOptedIn={setOptedIn}
+      title={t('new_overleaf_editor')}
+    />
+  )
+}
+
+export default EditorRedesignLabsWidget
diff --git a/services/web/frontend/js/features/ide-redesign/components/main-layout.tsx b/services/web/frontend/js/features/ide-redesign/components/main-layout.tsx
index cf71ed07cb..8ec00a397e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/main-layout.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/main-layout.tsx
@@ -8,10 +8,17 @@ import { HorizontalToggler } from '@/features/ide-react/components/resize/horizo
 import { useTranslation } from 'react-i18next'
 import { usePdfPane } from '@/features/ide-react/hooks/use-pdf-pane'
 import { useLayoutContext } from '@/shared/context/layout-context'
-import { useState } from 'react'
+import { ElementType, useState } from 'react'
 import EditorPanel from './editor-panel'
 import { useRailContext } from '../contexts/rail-context'
 import HistoryContainer from '@/features/ide-react/components/history-container'
+import { DefaultSynctexControl } from '@/features/pdf-preview/components/detach-synctex-control'
+import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
+
+const mainEditorLayoutModalsModules: Array<{
+  import: { default: ElementType }
+  path: string
+}> = importOverleafModules('mainEditorLayoutModals')
 
 export default function MainLayout() {
   const [resizing, setResizing] = useState(false)
@@ -49,6 +56,9 @@ export default function MainLayout() {
             <PanelGroup
               autoSaveId="ide-redesign-editor-and-pdf-panel-group"
               direction="horizontal"
+              className={classNames({
+                hidden: view === 'history',
+              })}
             >
               <Panel
                 id="ide-redesign-editor-panel"
@@ -80,6 +90,11 @@ export default function MainLayout() {
                   tooltipWhenOpen={t('tooltip_hide_pdf')}
                   tooltipWhenClosed={t('tooltip_show_pdf')}
                 />
+                {pdfLayout === 'sideBySide' && (
+                  <div className="synctex-controls">
+                    <DefaultSynctexControl />
+                  </div>
+                )}
               </HorizontalResizeHandle>
               <Panel
                 collapsible
@@ -95,11 +110,21 @@ export default function MainLayout() {
                 onCollapse={handlePdfPaneCollapse}
               >
                 <PdfPreview />
+                {pdfLayout === 'flat' && view === 'pdf' && (
+                  <div className="synctex-controls" hidden>
+                    <DefaultSynctexControl />
+                  </div>
+                )}
               </Panel>
             </PanelGroup>
           </Panel>
         </PanelGroup>
       </div>
+      {mainEditorLayoutModalsModules.map(
+        ({ import: { default: Component }, path }) => (
+          <Component key={path} />
+        )
+      )}
     </div>
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/online-users/online-users-widget.tsx b/services/web/frontend/js/features/ide-redesign/components/online-users/online-users-widget.tsx
new file mode 100644
index 0000000000..2d30297e51
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/online-users/online-users-widget.tsx
@@ -0,0 +1,145 @@
+import { OnlineUser } from '@/features/ide-react/context/online-users-context'
+import {
+  Dropdown,
+  DropdownHeader,
+  DropdownItem,
+  DropdownMenu,
+  DropdownToggle,
+} from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import {
+  getBackgroundColorForUserId,
+  hslStringToLuminance,
+} from '@/shared/utils/colors'
+import classNames from 'classnames'
+import { useCallback, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+
+// Should be kept in sync with $max-user-circles-displayed CSS constant
+const MAX_USER_CIRCLES_DISPLAYED = 5
+
+// We don't want a +1 circle since we could just show the user instead
+const MAX_USERS_WITH_OVERFLOW_VISIBLE = MAX_USER_CIRCLES_DISPLAYED - 1
+
+export const OnlineUsersWidget = ({
+  onlineUsers,
+  goToUser,
+}: {
+  onlineUsers: OnlineUser[]
+  goToUser: (user: OnlineUser) => void
+}) => {
+  const hasOverflow = onlineUsers.length > MAX_USER_CIRCLES_DISPLAYED
+  const usersBeforeOverflow = useMemo(
+    () =>
+      hasOverflow
+        ? onlineUsers.slice(0, MAX_USERS_WITH_OVERFLOW_VISIBLE)
+        : onlineUsers,
+    [onlineUsers, hasOverflow]
+  )
+  const usersInOverflow = useMemo(
+    () =>
+      hasOverflow ? onlineUsers.slice(MAX_USERS_WITH_OVERFLOW_VISIBLE) : [],
+    [onlineUsers, hasOverflow]
+  )
+
+  return (
+    <div className="online-users-row">
+      {usersBeforeOverflow.map((user, index) => (
+        <OnlineUserWidget
+          key={`${user.user_id}_${index}`}
+          user={user}
+          goToUser={goToUser}
+          id={`online-user-${user.user_id}_${index}`}
+        />
+      ))}
+      {hasOverflow && (
+        <OnlineUserOverflow goToUser={goToUser} users={usersInOverflow} />
+      )}
+    </div>
+  )
+}
+
+const OnlineUserWidget = ({
+  user,
+  goToUser,
+  id,
+}: {
+  user: OnlineUser
+  goToUser: (user: OnlineUser) => void
+  id: string
+}) => {
+  const onClick = useCallback(() => {
+    goToUser(user)
+  }, [goToUser, user])
+  return (
+    <OLTooltip
+      id={id}
+      description={user.name}
+      overlayProps={{
+        placement: 'bottom',
+        trigger: ['hover', 'focus'],
+        delay: 0,
+      }}
+    >
+      <button className="online-users-row-button" onClick={onClick}>
+        <OnlineUserCircle user={user} />
+      </button>
+    </OLTooltip>
+  )
+}
+
+const OnlineUserCircle = ({ user }: { user: OnlineUser }) => {
+  const backgroundColor = getBackgroundColorForUserId(user.user_id)
+  const luminance = hslStringToLuminance(backgroundColor)
+  const [character] = [...user.name]
+  return (
+    <span
+      className={classNames('online-user-circle', {
+        'online-user-circle-light-font': luminance < 0.5,
+        'online-user-circle-dark-font': luminance >= 0.5,
+      })}
+      style={{ backgroundColor }}
+    >
+      {character}
+    </span>
+  )
+}
+
+const OnlineUserOverflow = ({
+  goToUser,
+  users,
+}: {
+  goToUser: (user: OnlineUser) => void
+  users: OnlineUser[]
+}) => {
+  const { t } = useTranslation()
+  return (
+    <Dropdown align="end">
+      <DropdownToggle className="online-users-row-button online-user-overflow-toggle">
+        <OLTooltip
+          id="connected-users"
+          description={t('n_more_collaborators', { count: users.length })}
+          overlayProps={{ placement: 'bottom' }}
+        >
+          <span className="online-user-circle">+{users.length}</span>
+        </OLTooltip>
+      </DropdownToggle>
+      <DropdownMenu className="online-user-overflow-dropdown">
+        <DropdownHeader aria-hidden="true">
+          {t('connected_users')}
+        </DropdownHeader>
+        {users.map((user, index) => (
+          <li role="none" key={`${user.user_id}_${index}`}>
+            <DropdownItem
+              as="button"
+              tabIndex={-1}
+              onClick={() => goToUser(user)}
+            >
+              <OnlineUserCircle user={user} /> {user.name}
+            </DropdownItem>
+          </li>
+        ))}
+      </DropdownMenu>
+    </Dropdown>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-code-check-failed-banner.tsx b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-code-check-failed-banner.tsx
new file mode 100644
index 0000000000..ea7c9894d7
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-code-check-failed-banner.tsx
@@ -0,0 +1,22 @@
+import MaterialIcon from '@/shared/components/material-icon'
+import { useTranslation } from 'react-i18next'
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+
+export default function PdfCodeCheckFailedBanner() {
+  const { t } = useTranslation()
+
+  const { codeCheckFailed } = useCompileContext()
+
+  if (!codeCheckFailed) {
+    return null
+  }
+
+  return (
+    <div className="pdf-code-check-failed-banner-container">
+      <div className="pdf-code-check-failed-banner">
+        <MaterialIcon unfilled type="picture_as_pdf" />
+        {t('code_check_failed_explanation')}
+      </div>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-error-state.tsx b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-error-state.tsx
index 2de51dc11e..a4f53ae614 100644
--- a/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-error-state.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-error-state.tsx
@@ -5,54 +5,114 @@ import { useRailContext } from '../../contexts/rail-context'
 import { usePdfPreviewContext } from '@/features/pdf-preview/components/pdf-preview-provider'
 import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
 import { useIsNewEditorEnabled } from '../../utils/new-editor-utils'
+import { upgradePlan } from '@/main/account-upgrade'
+import classNames from 'classnames'
 
 function PdfErrorState() {
   const { loadingError } = usePdfPreviewContext()
   // TODO ide-redesign-cleanup: rename showLogs to something else and check usages
-  const { showLogs } = useCompileContext()
-  const { t } = useTranslation()
-  const { setSelectedTab: setSelectedRailTab } = useRailContext()
+  const { hasShortCompileTimeout, error, showLogs } = useCompileContext()
   const newEditor = useIsNewEditorEnabled()
 
   if (!newEditor || (!loadingError && !showLogs)) {
     return null
   }
 
+  if (hasShortCompileTimeout && error === 'timedout') {
+    return <CompileTimeoutErrorState />
+  }
+
+  return <GeneralErrorState />
+}
+
+const GeneralErrorState = () => {
+  const { t } = useTranslation()
+  const { openTab: openRailTab } = useRailContext()
+
   return (
-    <div className="pdf-error-state">
-      <div className="pdf-error-state-top-section">
-        <div className="pdf-error-state-warning-icon">
-          <MaterialIcon type="warning" />
-        </div>
-        <div className="pdf-error-state-text">
-          <p className="pdf-error-state-label">{t('pdf_couldnt_compile')}</p>
-          <p className="pdf-error-state-description">
-            {t('we_are_unable_to_generate_the_pdf_at_this_time')}
-          </p>
-        </div>
+    <ErrorState
+      title={t('pdf_couldnt_compile')}
+      description={t('we_are_unable_to_generate_the_pdf_at_this_time')}
+      iconType="warning"
+      iconClassName="pdf-error-state-warning-icon"
+      actions={
         <OLButton
           variant="secondary"
           size="sm"
           onClick={() => {
-            setSelectedRailTab('errors')
+            openRailTab('errors')
           }}
         >
           {t('check_logs')}
         </OLButton>
-      </div>
-      <div className="pdf-error-state-info-box">
-        <div className="pdf-error-state-info-box-title">
-          <MaterialIcon type="info" unfilled />
-          {t('why_might_this_happen')}
+      }
+      extraContent={
+        <div className="pdf-error-state-info-box">
+          <div className="pdf-error-state-info-box-title">
+            <MaterialIcon type="info" unfilled />
+            {t('why_might_this_happen')}
+          </div>
+          <ul className="pdf-error-state-info-box-text">
+            <li>{t('there_is_an_unrecoverable_latex_error')}</li>
+            <li>{t('the_document_environment_contains_no_content')}</li>
+            <li>{t('this_project_contains_a_file_called_output')}</li>
+          </ul>
         </div>
-        <ul className="pdf-error-state-info-box-text">
-          <li>{t('there_is_an_unrecoverable_latex_error')}</li>
-          <li>{t('the_document_environment_contains_no_content')}</li>
-          <li>{t('this_project_contains_a_file_called_output')}</li>
-        </ul>
-      </div>
-    </div>
+      }
+    />
   )
 }
 
+const CompileTimeoutErrorState = () => {
+  const { t } = useTranslation()
+
+  return (
+    <ErrorState
+      title={t('compile_limit_reached')}
+      description={t('compile_limit_upgrade_prompt')}
+      iconType="running_with_errors"
+      actions={
+        <OLButton
+          variant="premium"
+          size="sm"
+          onClick={() => upgradePlan('compile-timeout')}
+        >
+          {t('upgrade')}
+        </OLButton>
+      }
+    />
+  )
+}
+
+const ErrorState = ({
+  title,
+  description,
+  iconType,
+  actions,
+  iconClassName,
+  extraContent,
+}: {
+  title: string
+  description: string
+  iconType: string
+  actions: React.ReactNode
+  iconClassName?: string
+  extraContent?: React.ReactNode
+}) => {
+  return (
+    <div className="pdf-error-state">
+      <div className="pdf-error-state-top-section">
+        <div className={classNames('pdf-error-state-icon', iconClassName)}>
+          <MaterialIcon type={iconType} />
+        </div>
+        <div className="pdf-error-state-text">
+          <p className="pdf-error-state-label">{title}</p>
+          <p className="pdf-error-state-description">{description}</p>
+        </div>
+        {actions}
+      </div>
+      {extraContent}
+    </div>
+  )
+}
 export default PdfErrorState
diff --git a/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.jsx b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.tsx
similarity index 71%
rename from services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.jsx
rename to services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.tsx
index f2cdca095c..b11dcaa7cf 100644
--- a/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.jsx
+++ b/services/web/frontend/js/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar.tsx
@@ -2,6 +2,8 @@ import { memo } from 'react'
 import OlButtonToolbar from '@/features/ui/components/ol/ol-button-toolbar'
 import PdfCompileButton from '@/features/pdf-preview/components/pdf-compile-button'
 import PdfHybridDownloadButton from '@/features/pdf-preview/components/pdf-hybrid-download-button'
+import { DetachedSynctexControl } from '@/features/pdf-preview/components/detach-synctex-control'
+import SwitchToEditorButton from '@/features/pdf-preview/components/switch-to-editor-button'
 
 function PdfPreviewHybridToolbar() {
   // TODO: add detached pdf logic
@@ -13,7 +15,9 @@ function PdfPreviewHybridToolbar() {
       </div>
       <div className="toolbar-pdf-right">
         <div className="toolbar-pdf-controls" id="toolbar-pdf-controls" />
-        {/* TODO: should we have switch to editor/code check/synctex buttons? */}
+        <SwitchToEditorButton />
+        <DetachedSynctexControl />
+        {/* TODO: should we have code check? */}
       </div>
     </OlButtonToolbar>
   )
diff --git a/services/web/frontend/js/features/ide-redesign/components/rail-indicator.tsx b/services/web/frontend/js/features/ide-redesign/components/rail-indicator.tsx
new file mode 100644
index 0000000000..d6cf15ebc4
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/rail-indicator.tsx
@@ -0,0 +1,17 @@
+import OLBadge from '@/features/ui/components/ol/ol-badge'
+
+type RailIndicatorProps = {
+  type: 'danger' | 'warning' | 'info'
+  count: number
+}
+
+function formatNumber(num: number) {
+  if (num > 99) {
+    return '99+'
+  }
+  return Math.floor(num).toString()
+}
+
+export const RailIndicator = ({ count, type }: RailIndicatorProps) => {
+  return <OLBadge bg={type}>{formatNumber(count)}</OLBadge>
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/rail-panel-header.tsx b/services/web/frontend/js/features/ide-redesign/components/rail-panel-header.tsx
new file mode 100644
index 0000000000..47d45c6c46
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/rail-panel-header.tsx
@@ -0,0 +1,38 @@
+import { useTranslation } from 'react-i18next'
+import { useRailContext } from '../contexts/rail-context'
+import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
+import React from 'react'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+
+export default function RailPanelHeader({
+  title,
+  actions,
+}: {
+  title: string
+  actions?: React.ReactNode[]
+}) {
+  const { t } = useTranslation()
+  const { handlePaneCollapse } = useRailContext()
+  return (
+    <header className="rail-panel-header">
+      <h4 className="rail-panel-title">{title}</h4>
+
+      <div className="rail-panel-header-actions">
+        {actions}
+        <OLTooltip
+          id="close-rail-panel"
+          description={t('close')}
+          overlayProps={{ placement: 'bottom' }}
+        >
+          <OLIconButton
+            onClick={handlePaneCollapse}
+            className="rail-panel-header-button-subdued"
+            icon="close"
+            accessibilityLabel={t('close')}
+            size="sm"
+          />
+        </OLTooltip>
+      </div>
+    </header>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/rail.tsx b/services/web/frontend/js/features/ide-redesign/components/rail.tsx
index 8610f1696e..42374583ab 100644
--- a/services/web/frontend/js/features/ide-redesign/components/rail.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/rail.tsx
@@ -1,25 +1,24 @@
-import { FC, ReactElement, useCallback, useMemo } from 'react'
-import { Nav, NavLink, Tab, TabContainer } from 'react-bootstrap-5'
+import { FC, forwardRef, ReactElement, useCallback, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import { Nav, NavLink, Tab, TabContainer } from 'react-bootstrap'
 import MaterialIcon, {
   AvailableUnfilledIcon,
 } from '@/shared/components/material-icon'
 import { Panel } from 'react-resizable-panels'
 import { useLayoutContext } from '@/shared/context/layout-context'
-import { ErrorIndicator, ErrorPane } from './errors'
+import ErrorIndicator from './error-logs/error-indicator'
 import {
   RailModalKey,
   RailTabKey,
   useRailContext,
 } from '../contexts/rail-context'
-import FileTreeOutlinePanel from './file-tree-outline-panel'
+import FileTreeOutlinePanel from './file-tree/file-tree-outline-panel'
 import { ChatIndicator, ChatPane } from './chat/chat'
 import getMeta from '@/utils/meta'
 import { HorizontalResizeHandle } from '@/features/ide-react/components/resize/horizontal-resize-handle'
 import { HorizontalToggler } from '@/features/ide-react/components/resize/horizontal-toggler'
-import { useTranslation } from 'react-i18next'
 import classNames from 'classnames'
 import IntegrationsPanel from './integrations-panel/integrations-panel'
-import OLButton from '@/features/ui/components/ol/ol-button'
 import {
   Dropdown,
   DropdownDivider,
@@ -31,58 +30,48 @@ import { RailHelpShowHotkeysModal } from './help/keyboard-shortcuts'
 import { RailHelpContactUsModal } from './help/contact-us'
 import { HistorySidebar } from '@/features/ide-react/components/history-sidebar'
 import DictionarySettingsModal from './settings/editor-settings/dictionary-settings-modal'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { useChatContext } from '@/features/chat/context/chat-context'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
+import {
+  FullProjectSearchPanel,
+  hasFullProjectSearch,
+} from './full-project-search-panel'
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+import ErrorLogsPanel from './error-logs/error-logs-panel'
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import OldErrorPane from './error-logs/old-error-pane'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
+import { useSurveyUrl } from '../hooks/use-survey-url'
+import { useProjectContext } from '@/shared/context/project-context'
+import usePreviousValue from '@/shared/hooks/use-previous-value'
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
 
 type RailElement = {
   icon: AvailableUnfilledIcon
   key: RailTabKey
-  component: ReactElement
+  component: ReactElement | null
   indicator?: ReactElement
+  title: string
   hide?: boolean
+  disabled?: boolean
+  mountOnFirstLoad?: boolean
 }
 
 type RailActionButton = {
   key: string
   icon: AvailableUnfilledIcon
+  title: string
   action: () => void
 }
 type RailDropdown = {
   key: string
   icon: AvailableUnfilledIcon
+  title: string
   dropdown: ReactElement
 }
 type RailAction = RailDropdown | RailActionButton
 
-const RAIL_TABS: RailElement[] = [
-  {
-    key: 'file-tree',
-    icon: 'description',
-    component: <FileTreeOutlinePanel />,
-  },
-  {
-    key: 'integrations',
-    icon: 'integration_instructions',
-    component: <IntegrationsPanel />,
-  },
-  {
-    key: 'review-panel',
-    icon: 'rate_review',
-    component: <>Review panel</>,
-  },
-  {
-    key: 'chat',
-    icon: 'forum',
-    component: <ChatPane />,
-    indicator: <ChatIndicator />,
-    hide: !getMeta('ol-chatEnabled'),
-  },
-  {
-    key: 'errors',
-    icon: 'report',
-    component: <ErrorPane />,
-    indicator: <ErrorIndicator />,
-  },
-]
-
 const RAIL_MODALS: {
   key: RailModalKey
   modalComponentFunction: FC<{ show: boolean }>
@@ -102,11 +91,12 @@ const RAIL_MODALS: {
 ]
 
 export const RailLayout = () => {
+  const { sendEvent } = useEditorAnalytics()
   const { t } = useTranslation()
   const {
     activeModal,
     selectedTab,
-    setSelectedTab,
+    openTab,
     isOpen,
     setIsOpen,
     panelRef,
@@ -115,46 +105,150 @@ export const RailLayout = () => {
     togglePane,
     setResizing,
   } = useRailContext()
+  const { logEntries } = useCompileContext()
+  const { features } = useProjectContext()
+  const errorLogsDisabled = !logEntries
 
   const { view, setLeftMenuShown } = useLayoutContext()
 
+  const { markMessagesAsRead } = useChatContext()
+
   const isHistoryView = view === 'history'
 
+  const newErrorlogs = useFeatureFlag('new-editor-error-logs-redesign')
+
+  const railTabs: RailElement[] = useMemo(
+    () => [
+      {
+        key: 'file-tree',
+        icon: 'description',
+        title: t('file_tree'),
+        component: <FileTreeOutlinePanel />,
+        // NOTE: We always need to mount the file tree on first load
+        // since it is responsible for opening the initial document.
+        mountOnFirstLoad: true,
+      },
+      {
+        key: 'full-project-search',
+        icon: 'search',
+        title: t('project_search'),
+        component: <FullProjectSearchPanel />,
+        hide: !hasFullProjectSearch,
+      },
+      {
+        key: 'integrations',
+        icon: 'integration_instructions',
+        title: t('integrations'),
+        component: <IntegrationsPanel />,
+      },
+      {
+        key: 'review-panel',
+        icon: 'rate_review',
+        title: t('review_panel'),
+        component: null,
+        hide: !features.trackChangesVisible,
+        disabled: view !== 'editor',
+      },
+      {
+        key: 'chat',
+        icon: 'forum',
+        component: <ChatPane />,
+        indicator: <ChatIndicator />,
+        title: t('chat'),
+        hide: !getMeta('ol-capabilities')?.includes('chat'),
+      },
+      {
+        key: 'errors',
+        icon: 'report',
+        title: t('error_log'),
+        component: newErrorlogs ? <ErrorLogsPanel /> : <OldErrorPane />,
+        indicator: <ErrorIndicator />,
+        disabled: errorLogsDisabled,
+      },
+    ],
+    [t, features.trackChangesVisible, newErrorlogs, errorLogsDisabled, view]
+  )
+
   const railActions: RailAction[] = useMemo(
     () => [
       {
         key: 'support',
         icon: 'help',
+        title: t('help'),
         dropdown: <RailHelpDropdown />,
       },
       {
         key: 'settings',
         icon: 'settings',
-        action: () => setLeftMenuShown(true),
+        title: t('settings'),
+        action: () => {
+          sendEvent('rail-click', { tab: 'settings' })
+          setLeftMenuShown(true)
+        },
       },
     ],
-    [setLeftMenuShown]
+    [setLeftMenuShown, t, sendEvent]
+  )
+
+  useCommandProvider(
+    () => [
+      {
+        id: 'open-settings',
+        handler: () => {
+          setLeftMenuShown(true)
+        },
+        label: t('settings'),
+      },
+    ],
+    [t, setLeftMenuShown]
   )
 
   const onTabSelect = useCallback(
     (key: string | null) => {
       if (key === selectedTab) {
         togglePane()
+        sendEvent('rail-click', { tab: key, type: 'toggle' })
       } else {
         // HACK: Apparently the onSelect event is triggered with href attributes
         // from DropdownItems
-        if (!RAIL_TABS.some(tab => !tab.hide && tab.key === key)) {
+        if (!railTabs.some(tab => !tab.hide && tab.key === key)) {
           // Attempting to open a non-existent tab
           return
         }
+        const keyOrDefault = (key ?? 'file-tree') as RailTabKey
         // Change the selected tab and make sure it's open
-        setSelectedTab((key ?? 'file-tree') as RailTabKey)
-        setIsOpen(true)
+        openTab(keyOrDefault)
+        sendEvent('rail-click', { tab: keyOrDefault })
+        if (keyOrDefault === 'full-project-search') {
+          sendSearchEvent('search-open', {
+            searchType: 'full-project',
+            method: 'button',
+            location: 'rail',
+          })
+        }
+
+        if (key === 'chat') {
+          markMessagesAsRead()
+        }
       }
     },
-    [setSelectedTab, selectedTab, setIsOpen, togglePane]
+    [openTab, togglePane, selectedTab, railTabs, sendEvent, markMessagesAsRead]
   )
 
+  const isReviewPanelOpen = selectedTab === 'review-panel'
+
+  const prevTab = usePreviousValue(selectedTab)
+
+  const tabHasChanged = useMemo(() => {
+    return prevTab !== selectedTab
+  }, [prevTab, selectedTab])
+
+  const onCollapse = useCallback(() => {
+    if (!tabHasChanged) {
+      handlePaneCollapse()
+    }
+  }, [tabHasChanged, handlePaneCollapse])
+
   return (
     <TabContainer
       mountOnEnter // Only render when necessary (so that we can lazy load tab content)
@@ -166,17 +260,19 @@ export const RailLayout = () => {
     >
       <div className={classNames('ide-rail', { hidden: isHistoryView })}>
         <Nav activeKey={selectedTab} className="ide-rail-tabs-nav">
-          {RAIL_TABS.filter(({ hide }) => !hide).map(
-            ({ icon, key, indicator }) => (
+          {railTabs
+            .filter(({ hide }) => !hide)
+            .map(({ icon, key, indicator, title, disabled }) => (
               <RailTab
                 open={isOpen && selectedTab === key}
                 key={key}
                 eventKey={key}
                 icon={icon}
                 indicator={indicator}
+                title={title}
+                disabled={disabled}
               />
-            )
-          )}
+            ))}
           <div className="flex-grow-1" />
           {railActions?.map(action => (
             <RailActionElement key={action.key} action={action} />
@@ -184,30 +280,44 @@ export const RailLayout = () => {
         </Nav>
       </div>
       <Panel
-        id="ide-redesign-sidebar-panel"
+        id={
+          newErrorlogs
+            ? `ide-redesign-sidebar-panel-${selectedTab}`
+            : 'ide-redesign-sidebar-panel'
+        }
+        className={classNames({ hidden: isReviewPanelOpen })}
         order={1}
         defaultSize={15}
         minSize={5}
         maxSize={80}
         ref={panelRef}
         collapsible
-        onCollapse={handlePaneCollapse}
+        onCollapse={onCollapse}
         onExpand={handlePaneExpand}
       >
         {isHistoryView && <HistorySidebar />}
         <div
-          className={classNames('ide-rail-content', { hidden: isHistoryView })}
+          className={classNames('ide-rail-content', {
+            hidden: isHistoryView,
+          })}
         >
-          <Tab.Content>
-            {RAIL_TABS.filter(({ hide }) => !hide).map(({ key, component }) => (
-              <Tab.Pane eventKey={key} key={key}>
-                {component}
-              </Tab.Pane>
-            ))}
+          <Tab.Content className="ide-rail-tab-content">
+            {railTabs
+              .filter(({ hide }) => !hide)
+              .map(({ key, component, mountOnFirstLoad }) => (
+                <Tab.Pane
+                  eventKey={key}
+                  key={key}
+                  mountOnEnter={!mountOnFirstLoad}
+                >
+                  {component}
+                </Tab.Pane>
+              ))}
           </Tab.Content>
         </div>
       </Panel>
       <HorizontalResizeHandle
+        className={classNames({ hidden: isReviewPanelOpen })}
         resizable
         hitAreaMargins={{ coarse: 0, fine: 0 }}
         onDoubleClick={togglePane}
@@ -229,42 +339,54 @@ export const RailLayout = () => {
   )
 }
 
-const RailTab = ({
-  icon,
-  eventKey,
-  open,
-  indicator,
-}: {
-  icon: AvailableUnfilledIcon
-  eventKey: string
-  open: boolean
-  indicator?: ReactElement
-}) => {
+const RailTab = forwardRef<
+  HTMLAnchorElement,
+  {
+    icon: AvailableUnfilledIcon
+    eventKey: string
+    open: boolean
+    indicator?: ReactElement
+    title: string
+    disabled?: boolean
+  }
+>(({ icon, eventKey, open, indicator, title, disabled = false }, ref) => {
   return (
-    <NavLink
-      eventKey={eventKey}
-      className={classNames('ide-rail-tab-link', {
-        'open-rail': open,
-      })}
+    <OLTooltip
+      id={`rail-tab-tooltip-${eventKey}`}
+      description={title}
+      overlayProps={{ delay: 0, placement: 'right' }}
     >
-      {open ? (
-        <MaterialIcon className="ide-rail-tab-link-icon" type={icon} />
-      ) : (
-        <MaterialIcon className="ide-rail-tab-link-icon" type={icon} unfilled />
-      )}
-      {indicator}
-    </NavLink>
+      <NavLink
+        ref={ref}
+        eventKey={eventKey}
+        className={classNames('ide-rail-tab-link', {
+          'open-rail': open,
+        })}
+        disabled={disabled}
+      >
+        {open ? (
+          <MaterialIcon
+            className="ide-rail-tab-link-icon"
+            type={icon}
+            accessibilityLabel={title}
+          />
+        ) : (
+          <MaterialIcon
+            className="ide-rail-tab-link-icon"
+            type={icon}
+            accessibilityLabel={title}
+            unfilled
+          />
+        )}
+        {indicator}
+      </NavLink>
+    </OLTooltip>
   )
-}
+})
+
+RailTab.displayName = 'RailTab'
 
 const RailActionElement = ({ action }: { action: RailAction }) => {
-  const icon = (
-    <MaterialIcon
-      className="ide-rail-tab-link-icon"
-      type={action.icon}
-      unfilled
-    />
-  )
   const onActionClick = useCallback(() => {
     if ('action' in action) {
       action.action()
@@ -274,45 +396,52 @@ const RailActionElement = ({ action }: { action: RailAction }) => {
   if ('dropdown' in action) {
     return (
       <Dropdown align="end" drop="end">
-        <DropdownToggle
-          id="rail-help-dropdown-btn"
-          className="ide-rail-tab-link ide-rail-tab-button ide-rail-tab-dropdown"
-          as="button"
+        <OLTooltip
+          id={`rail-dropdown-tooltip-${action.key}`}
+          description={action.title}
+          overlayProps={{ delay: 0, placement: 'right' }}
         >
-          {icon}
-        </DropdownToggle>
+          <span>
+            <DropdownToggle
+              id="rail-help-dropdown-btn"
+              className="ide-rail-tab-link ide-rail-tab-button ide-rail-tab-dropdown"
+              as="button"
+              aria-label={action.title}
+            >
+              <MaterialIcon
+                className="ide-rail-tab-link-icon"
+                type={action.icon}
+                unfilled
+              />
+            </DropdownToggle>
+          </span>
+        </OLTooltip>
         {action.dropdown}
       </Dropdown>
     )
   } else {
     return (
-      <button
-        onClick={onActionClick}
-        className="ide-rail-tab-link ide-rail-tab-button"
-        type="button"
+      <OLTooltip
+        id={`rail-tab-tooltip-${action.key}`}
+        description={action.title}
+        overlayProps={{ delay: 0, placement: 'right' }}
       >
-        {icon}
-      </button>
+        <button
+          onClick={onActionClick}
+          className="ide-rail-tab-link ide-rail-tab-button"
+          aria-label={action.title}
+        >
+          <MaterialIcon
+            className="ide-rail-tab-link-icon"
+            type={action.icon}
+            unfilled
+          />
+        </button>
+      </OLTooltip>
     )
   }
 }
 
-export const RailPanelHeader: FC<{ title: string }> = ({ title }) => {
-  const { handlePaneCollapse } = useRailContext()
-  return (
-    <header className="rail-panel-header">
-      <h4 className="rail-panel-title">{title}</h4>
-      <OLButton
-        onClick={handlePaneCollapse}
-        className="rail-panel-header-button-subdued"
-        size="sm"
-      >
-        <MaterialIcon type="close" />
-      </OLButton>
-    </header>
-  )
-}
-
 const RailHelpDropdown = () => {
   const showSupport = getMeta('ol-showSupport')
   const { t } = useTranslation()
@@ -323,6 +452,8 @@ const RailHelpDropdown = () => {
   const openContactUsModal = useCallback(() => {
     setActiveModal('contact-us')
   }, [setActiveModal])
+  const surveyURL = useSurveyUrl()
+
   return (
     <DropdownMenu>
       <DropdownItem onClick={openKeyboardShortcutsModal}>
@@ -343,7 +474,7 @@ const RailHelpDropdown = () => {
         </DropdownItem>
       )}
       <DropdownItem
-        href="https://forms.gle/soyVStc5qDx9na1Z6"
+        href={surveyURL}
         role="menuitem"
         target="_blank"
         rel="noopener noreferrer"
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
index eba0fc5b6c..1a1a3f1c1e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/editor-theme-setting.tsx
@@ -41,6 +41,7 @@ export default function EditorThemeSetting() {
       options={options}
       onChange={setEditorTheme}
       value={editorTheme}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
index d0310e2b1b..f1c279cf23 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/appearance-settings/font-family-setting.tsx
@@ -27,6 +27,7 @@ export default function FontFamilySetting() {
       onChange={setFontFamily}
       value={fontFamily}
       width="wide"
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
index c007a0608e..1da6a167c6 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/compiler-setting.tsx
@@ -38,6 +38,7 @@ export default function CompilerSetting() {
       options={OPTIONS}
       onChange={setCompiler}
       value={compiler}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
index 0574657971..0a7166ae68 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/image-name-setting.tsx
@@ -38,6 +38,7 @@ export default function ImageNameSetting() {
       options={options}
       onChange={setImageName}
       value={imageName}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
index bd493a018a..719ea4da5a 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/compiler-settings/root-document-setting.tsx
@@ -44,6 +44,7 @@ export default function RootDocumentSetting() {
       options={validDocsOptions}
       onChange={setRootDocId}
       value={rootDocId}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
index 957acdce6e..3d9db79c3d 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/dropdown-setting.tsx
@@ -2,7 +2,7 @@ import OLFormSelect from '@/features/ui/components/ol/ol-form-select'
 import { ChangeEventHandler, useCallback } from 'react'
 import Setting from './setting'
 import classNames from 'classnames'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 
 type PossibleValue = string | number | boolean
 
@@ -31,6 +31,7 @@ type SettingsMenuSelectProps<T extends PossibleValue = string> = {
   disabled?: boolean
   width?: 'default' | 'wide'
   loading?: boolean
+  translateOptions?: 'yes' | 'no'
 }
 
 export default function DropdownSetting<T extends PossibleValue = string>({
@@ -44,6 +45,7 @@ export default function DropdownSetting<T extends PossibleValue = string>({
   disabled = false,
   width = 'default',
   loading = false,
+  translateOptions,
 }: SettingsMenuSelectProps<T>) {
   const handleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
     event => {
@@ -78,6 +80,7 @@ export default function DropdownSetting<T extends PossibleValue = string>({
           onChange={handleChange}
           value={value?.toString()}
           disabled={disabled}
+          translate={translateOptions}
         >
           {options.map(option => (
             <option
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/breadcrumbs-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/breadcrumbs-setting.tsx
new file mode 100644
index 0000000000..c4dff10485
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/breadcrumbs-setting.tsx
@@ -0,0 +1,18 @@
+import { useProjectSettingsContext } from '@/features/editor-left-menu/context/project-settings-context'
+import ToggleSetting from '../toggle-setting'
+import { useTranslation } from 'react-i18next'
+
+export default function BreadcrumbsSetting() {
+  const { breadcrumbs, setBreadcrumbs } = useProjectSettingsContext()
+  const { t } = useTranslation()
+
+  return (
+    <ToggleSetting
+      id="breadcrumbs-setting"
+      label={t('breadcrumbs')}
+      description={t('show_breadcrumbs_in_toolbar')}
+      checked={breadcrumbs}
+      onChange={setBreadcrumbs}
+    />
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/editor-settings.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/editor-settings.tsx
index 28dcef8a9b..a58b0c101e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/editor-settings.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/editor-settings.tsx
@@ -9,6 +9,7 @@ import PDFViewerSetting from './pdf-viewer-setting'
 import SpellCheckSetting from './spell-check-setting'
 import DictionarySetting from './dictionary-setting'
 import importOverleafModules from '../../../../../../macros/import-overleaf-module.macro'
+import BreadcrumbsSetting from './breadcrumbs-setting'
 
 const [referenceSearchSettingModule] = importOverleafModules(
   'referenceSearchSetting'
@@ -33,6 +34,7 @@ export default function EditorSettings() {
         <DictionarySetting />
       </SettingsSection>
       <SettingsSection title={t('tools')}>
+        <BreadcrumbsSetting />
         <MathPreviewSetting />
       </SettingsSection>
     </>
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
index 20d1e56d11..87e5bba5cc 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/editor-settings/pdf-viewer-setting.tsx
@@ -22,6 +22,7 @@ export default function PDFViewerSetting() {
       ]}
       onChange={setPdfViewer}
       value={pdfViewer}
+      translateOptions="no"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal-body.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal-body.tsx
index f1a6099c6d..99b3cea3eb 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal-body.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal-body.tsx
@@ -1,18 +1,15 @@
 import MaterialIcon, {
   AvailableUnfilledIcon,
 } from '@/shared/components/material-icon'
-import { ReactElement, useMemo, useState } from 'react'
+import { ReactElement } from 'react'
+
 import {
   Nav,
   NavLink,
   TabContainer,
   TabContent,
   TabPane,
-} from 'react-bootstrap-5'
-import { useTranslation } from 'react-i18next'
-import EditorSettings from './editor-settings/editor-settings'
-import AppearanceSettings from './appearance-settings/appearance-settings'
-import CompilerSettings from './compiler-settings/compiler-settings'
+} from 'react-bootstrap'
 
 export type SettingsEntry = SettingsLink | SettingsTab
 
@@ -30,41 +27,15 @@ type SettingsLink = {
   title: string
 }
 
-export const SettingsModalBody = () => {
-  const { t } = useTranslation()
-  const settingsTabs: SettingsEntry[] = useMemo(
-    () => [
-      {
-        key: 'editor',
-        title: t('editor'),
-        icon: 'code',
-        component: <EditorSettings />,
-      },
-      {
-        key: 'compiler',
-        title: t('compiler'),
-        icon: 'picture_as_pdf',
-        component: <CompilerSettings />,
-      },
-      {
-        key: 'appearance',
-        title: t('appearance'),
-        icon: 'brush',
-        component: <AppearanceSettings />,
-      },
-      {
-        key: 'account_settings',
-        title: t('account_settings'),
-        icon: 'settings',
-        href: '/user/settings',
-      },
-    ],
-    [t]
-  )
-  const [activeTab, setActiveTab] = useState<string | null | undefined>(
-    settingsTabs[0]?.key
-  )
-
+export const SettingsModalBody = ({
+  activeTab,
+  setActiveTab,
+  settingsTabs,
+}: {
+  activeTab: string | null | undefined
+  setActiveTab: (tab: string | null | undefined) => void
+  settingsTabs: SettingsEntry[]
+}) => {
   return (
     <TabContainer
       transition={false}
diff --git a/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal.tsx b/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal.tsx
index 8ee804159f..c4461a669d 100644
--- a/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/settings/settings-modal.tsx
@@ -5,24 +5,76 @@ import OLModal, {
 } from '@/features/ui/components/ol/ol-modal'
 import { useLayoutContext } from '@/shared/context/layout-context'
 import { useTranslation } from 'react-i18next'
-import { SettingsModalBody } from './settings-modal-body'
+import { SettingsEntry, SettingsModalBody } from './settings-modal-body'
+
+import AppearanceSettings from './appearance-settings/appearance-settings'
+import CompilerSettings from './compiler-settings/compiler-settings'
+import EditorSettings from './editor-settings/editor-settings'
+import { useMemo, useState } from 'react'
 
 const SettingsModal = () => {
   // TODO ide-redesign-cleanup: Either rename the field, or introduce a separate
   // one
   const { leftMenuShown, setLeftMenuShown } = useLayoutContext()
   const { t } = useTranslation()
+  const settingsTabs: SettingsEntry[] = useMemo(
+    () => [
+      {
+        key: 'editor',
+        title: t('editor'),
+        icon: 'code',
+        component: <EditorSettings />,
+      },
+      {
+        key: 'compiler',
+        title: t('compiler'),
+        icon: 'picture_as_pdf',
+        component: <CompilerSettings />,
+      },
+      {
+        key: 'appearance',
+        title: t('appearance'),
+        icon: 'brush',
+        component: <AppearanceSettings />,
+      },
+      {
+        key: 'account_settings',
+        title: t('account_settings'),
+        icon: 'settings',
+        href: '/user/settings',
+      },
+      {
+        key: 'subscription',
+        title: t('subscription'),
+        icon: 'account_balance',
+        href: '/user/subscription',
+      },
+    ],
+    [t]
+  )
+  const [activeTab, setActiveTab] = useState<string | null | undefined>(
+    settingsTabs[0]?.key
+  )
   return (
     <OLModal
       show={leftMenuShown}
       onHide={() => setLeftMenuShown(false)}
       size="lg"
+      backdropClassName={
+        activeTab === 'appearance'
+          ? 'ide-settings-modal-transparent-backdrop'
+          : undefined
+      }
     >
       <OLModalHeader closeButton>
         <OLModalTitle>{t('settings')}</OLModalTitle>
       </OLModalHeader>
       <OLModalBody className="ide-settings-modal-body">
-        <SettingsModalBody />
+        <SettingsModalBody
+          activeTab={activeTab}
+          setActiveTab={setActiveTab}
+          settingsTabs={settingsTabs}
+        />
       </OLModalBody>
     </OLModal>
   )
diff --git a/services/web/frontend/js/features/ide-redesign/components/switcher-modal/modal.tsx b/services/web/frontend/js/features/ide-redesign/components/switcher-modal/modal.tsx
index 11807e1a53..be3868ed89 100644
--- a/services/web/frontend/js/features/ide-redesign/components/switcher-modal/modal.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/switcher-modal/modal.tsx
@@ -14,6 +14,9 @@ import {
 import Notification from '@/shared/components/notification'
 import { useSwitchEnableNewEditorState } from '../../hooks/use-switch-enable-new-editor-state'
 import { Trans, useTranslation } from 'react-i18next'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
+import { useSurveyUrl } from '../../hooks/use-survey-url'
 
 export const IdeRedesignSwitcherModal = () => {
   const { t } = useTranslation()
@@ -66,13 +69,21 @@ const SwitcherModalContentEnabled: FC<ModalContentProps> = ({
   loading,
 }) => {
   const { t } = useTranslation()
+  const { sendEvent } = useEditorAnalytics()
   const disable = useCallback(() => {
+    sendEvent('editor-redesign-toggle', {
+      action: 'disable',
+      location: 'modal',
+    })
     setEditorRedesignStatus(false)
       .then(hide)
       .catch(() => {
         // do nothing, we're already showing the error
       })
-  }, [setEditorRedesignStatus, hide])
+  }, [setEditorRedesignStatus, hide, sendEvent])
+
+  const surveyURL = useSurveyUrl()
+
   return (
     <>
       <OLModalBody>
@@ -98,7 +109,7 @@ const SwitcherModalContentEnabled: FC<ModalContentProps> = ({
           {t('cancel')}
         </OLButton>
         <OLButton
-          href="https://forms.gle/soyVStc5qDx9na1Z6"
+          href={surveyURL}
           target="_blank"
           rel="noopener noreferrer"
           variant="primary"
@@ -116,13 +127,18 @@ const SwitcherModalContentDisabled: FC<ModalContentProps> = ({
   loading,
 }) => {
   const { t } = useTranslation()
+  const { sendEvent } = useEditorAnalytics()
   const enable = useCallback(() => {
+    sendEvent('editor-redesign-toggle', {
+      action: 'enable',
+      location: 'modal',
+    })
     setEditorRedesignStatus(true)
       .then(hide)
       .catch(() => {
         // do nothing, we're already showing the error
       })
-  }, [setEditorRedesignStatus, hide])
+  }, [setEditorRedesignStatus, hide, sendEvent])
   return (
     <>
       <OLModalBody>
@@ -145,19 +161,26 @@ const SwitcherModalContentDisabled: FC<ModalContentProps> = ({
 
 const SwitcherWhatsNew = () => {
   const { t } = useTranslation()
+  const newErrorlogs = useFeatureFlag('new-editor-error-logs-redesign')
+
   return (
     <div className="ide-redesign-switcher-modal-whats-new">
-      <h4>{t('whats_new')}</h4>
+      <h4>{t('latest_updates')}</h4>
       <ul>
-        <li>{t('chat')}</li>
-        <li>{t('settings_for_git_github_and_dropbox_integrations')}</li>
-        <li>{t('dark_mode')}</li>
+        {newErrorlogs && <li>{t('new_error_logs_panel')}</li>}
+        <li>{t('searching_all_project_files_is_now_available')}</li>
+        <li>{t('double_clicking_on_the_pdf_shows')}</li>
       </ul>
       <hr />
-      <h4>{t('whats_next')}</h4>
+      <h4>{t('whats_different_in_the_new_editor')}</h4>
       <ul>
-        <li>{t('history')}</li>
-        <li>{t('review_panel_comments_and_track_changes')}</li>
+        <li>{t('new_look_and_feel')}</li>
+        <li>
+          {t('new_navigation_introducing_left_hand_side_rail_and_top_menus')}
+        </li>
+        <li>{t('new_look_and_placement_of_the_settings')}</li>
+        <li>{t('improved_dark_mode')}</li>
+        <li>{t('review_panel_and_error_logs_moved_to_the_left')}</li>
       </ul>
     </div>
   )
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-button.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-button.tsx
index db26928599..eb51dd51c8 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-button.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-button.tsx
@@ -1,41 +1,40 @@
-import OLButton from '@/features/ui/components/ol/ol-button'
-import MaterialIcon from '@/shared/components/material-icon'
+import { useTranslation } from 'react-i18next'
+import classNames from 'classnames'
 import {
   Dropdown,
   DropdownMenu,
   DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
-import React, { forwardRef } from 'react'
 import ChangeLayoutOptions from './change-layout-options'
-
-const LayoutDropdownToggleButton = forwardRef<
-  HTMLButtonElement,
-  {
-    onClick: (e: React.MouseEvent<HTMLButtonElement>) => void
-  }
->(({ onClick }, ref) => {
-  return (
-    <OLButton
-      size="sm"
-      className="ide-redesign-toolbar-button-subdued"
-      ref={ref}
-      onClick={onClick}
-      leadingIcon={<MaterialIcon unfilled type="space_dashboard" />}
-    />
-  )
-})
-
-LayoutDropdownToggleButton.displayName = 'LayoutDropdownToggleButton'
+import MaterialIcon from '@/shared/components/material-icon'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 
 export default function ChangeLayoutButton() {
+  const { t } = useTranslation()
+  const toggleButtonClassName = classNames(
+    'ide-redesign-toolbar-button-subdued',
+    'ide-redesign-toolbar-dropdown-toggle-subdued',
+    'ide-redesign-toolbar-button-icon'
+  )
+
   return (
     <div className="ide-redesign-toolbar-button-container">
       <Dropdown className="toolbar-item layout-dropdown" align="end">
-        <DropdownToggle
-          id="layout-dropdown-btn"
-          className="btn-full-height"
-          as={LayoutDropdownToggleButton}
-        />
+        <OLTooltip
+          id="tooltip-open-layout-options"
+          description={t('layout_options')}
+          overlayProps={{ delay: 0, placement: 'bottom' }}
+        >
+          <span>
+            <DropdownToggle
+              id="layout-dropdown-btn"
+              className={toggleButtonClassName}
+              aria-label={t('layout_options')}
+            >
+              <MaterialIcon type="space_dashboard" unfilled />
+            </DropdownToggle>
+          </span>
+        </OLTooltip>
         <DropdownMenu>
           <ChangeLayoutOptions />
         </DropdownMenu>
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-options.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-options.tsx
index 3c3126e8da..0ca4531e2f 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-options.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/change-layout-options.tsx
@@ -9,10 +9,10 @@ import {
 } from '@/shared/context/layout-context'
 import React, { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
-import * as eventTracking from '../../../../infrastructure/event-tracking'
 import useEventListener from '@/shared/hooks/use-event-listener'
 import { DetachRole } from '@/shared/context/detach-context'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
 
 type LayoutOption = 'sideBySide' | 'editorOnly' | 'pdfOnly' | 'detachedPdf'
 
@@ -87,6 +87,7 @@ const LayoutDropdownItem = ({
 }
 
 export default function ChangeLayoutOptions() {
+  const { sendEvent } = useEditorAnalytics()
   const {
     reattach,
     detach,
@@ -99,16 +100,16 @@ export default function ChangeLayoutOptions() {
 
   const handleDetach = useCallback(() => {
     detach()
-    eventTracking.sendMB('project-layout-detach')
-  }, [detach])
+    sendEvent('project-layout-detach')
+  }, [detach, sendEvent])
 
   const handleReattach = useCallback(() => {
     if (detachRole !== 'detacher') {
       return
     }
     reattach()
-    eventTracking.sendMB('project-layout-reattach')
-  }, [detachRole, reattach])
+    sendEvent('project-layout-reattach')
+  }, [detachRole, reattach, sendEvent])
 
   // reattach when the PDF pane opens
   useEventListener('ui:pdf-open', handleReattach)
@@ -117,12 +118,12 @@ export default function ChangeLayoutOptions() {
     (newLayout: IdeLayout, newView?: IdeView) => {
       handleReattach()
       changeLayout(newLayout, newView)
-      eventTracking.sendMB('project-layout-change', {
+      sendEvent('project-layout-change', {
         layout: newLayout,
         view: newView,
       })
     },
-    [changeLayout, handleReattach]
+    [changeLayout, handleReattach, sendEvent]
   )
 
   const { t } = useTranslation()
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/command-dropdown.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/command-dropdown.tsx
new file mode 100644
index 0000000000..2dc696cdbf
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/command-dropdown.tsx
@@ -0,0 +1,176 @@
+import {
+  Command,
+  formatShortcut,
+  Shortcuts,
+  useCommandRegistry,
+} from '@/features/ide-react/context/command-registry-context'
+import {
+  DropdownDivider,
+  DropdownHeader,
+} from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import {
+  MenuBarDropdown,
+  NestedMenuBarDropdown,
+} from '@/shared/components/menu-bar/menu-bar-dropdown'
+import { MenuBarOption } from '@/shared/components/menu-bar/menu-bar-option'
+import { Fragment, useCallback, useMemo } from 'react'
+
+type CommandId = string
+type TaggedCommand = Command & {
+  type: 'command'
+  shortcuts?: Shortcuts[CommandId]
+}
+type Entry<T> = T | GroupStructure<T>
+type GroupStructure<T> = {
+  id: string
+  title: string
+  children: Array<Entry<T>>
+}
+export type MenuSectionStructure<T = CommandId> = {
+  title?: string
+  id: string
+  children: Array<Entry<T>>
+}
+export type MenuStructure<T = CommandId> = Array<MenuSectionStructure<T>>
+
+const CommandDropdown = ({
+  menu,
+  title,
+  id,
+}: {
+  menu: MenuStructure<CommandId>
+  title: string
+  id: string
+}) => {
+  const { registry, shortcuts } = useCommandRegistry()
+  const populatedSections = useMemo(
+    () =>
+      menu
+        .map(section => populateSectionOrGroup(section, registry, shortcuts))
+        .filter(x => x.children.length > 0),
+    [menu, registry, shortcuts]
+  )
+
+  if (populatedSections.length === 0) {
+    return null
+  }
+
+  return (
+    <MenuBarDropdown
+      title={title}
+      id={id}
+      className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
+    >
+      {populatedSections.map((section, index) => {
+        return (
+          <Fragment key={section.id}>
+            {index > 0 && <DropdownDivider />}
+            {section.title && <DropdownHeader>{section.title}</DropdownHeader>}
+            {section.children.map(child => (
+              <CommandDropdownChild item={child} key={child.id} />
+            ))}
+          </Fragment>
+        )
+      })}
+    </MenuBarDropdown>
+  )
+}
+
+export const CommandSection = ({
+  section: sectionStructure,
+}: {
+  section: MenuSectionStructure<CommandId>
+}) => {
+  const { registry, shortcuts } = useCommandRegistry()
+  const section = populateSectionOrGroup(sectionStructure, registry, shortcuts)
+  if (section.children.length === 0) {
+    return null
+  }
+  return (
+    <>
+      {section.title && <DropdownHeader>{section.title}</DropdownHeader>}
+      {section.children.map(child => (
+        <CommandDropdownChild item={child} key={child.id} />
+      ))}
+    </>
+  )
+}
+
+const CommandDropdownChild = ({ item }: { item: Entry<TaggedCommand> }) => {
+  const onClickHandler = useCallback(() => {
+    if (isTaggedCommand(item)) {
+      item.handler?.({ location: 'menu-bar' })
+    }
+  }, [item])
+
+  if (isTaggedCommand(item)) {
+    return (
+      <MenuBarOption
+        eventKey={item.id}
+        key={item.id}
+        title={item.label}
+        // eslint-disable-next-line react/jsx-handler-names
+        onClick={onClickHandler}
+        href={item.href}
+        disabled={item.disabled}
+        trailingIcon={
+          item.shortcuts && <span>{formatShortcut(item.shortcuts[0])}</span>
+        }
+      />
+    )
+  } else {
+    return (
+      <NestedMenuBarDropdown title={item.title} id={item.id} key={item.id}>
+        {item.children.map(subChild => {
+          return <CommandDropdownChild item={subChild} key={subChild.id} />
+        })}
+      </NestedMenuBarDropdown>
+    )
+  }
+}
+
+export default CommandDropdown
+
+function populateSectionOrGroup<
+  T extends { children: Array<Entry<CommandId>> },
+>(
+  section: T,
+  registry: Map<string, Command>,
+  shortcuts: Shortcuts
+): Omit<T, 'children'> & {
+  children: Array<Entry<TaggedCommand>>
+} {
+  const { children, ...rest } = section
+  return {
+    ...rest,
+    children: children
+      .map(child => {
+        if (typeof child !== 'string') {
+          const populatedChild = populateSectionOrGroup(
+            child,
+            registry,
+            shortcuts
+          )
+          if (populatedChild.children.length === 0) {
+            // Skip empty groups
+            return undefined
+          }
+          return populatedChild
+        }
+        const command = registry.get(child)
+        if (command) {
+          return {
+            ...command,
+            shortcuts: shortcuts[command.id],
+            type: 'command' as const,
+          }
+        }
+        return undefined
+      })
+      .filter(x => x !== undefined),
+  }
+}
+
+function isTaggedCommand(item: Entry<TaggedCommand>): item is TaggedCommand {
+  return 'type' in item && item.type === 'command'
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/download-project.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/download-project.tsx
index e40f385fa1..9be57c130e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/download-project.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/download-project.tsx
@@ -1,3 +1,4 @@
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
 import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { isSmallDevice, sendMB } from '@/infrastructure/event-tracking'
@@ -8,7 +9,7 @@ import { useTranslation } from 'react-i18next'
 
 export const DownloadProjectZip = () => {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const sendDownloadEvent = useCallback(() => {
     sendMB('download-zip-button-click', {
       projectId,
@@ -17,6 +18,17 @@ export const DownloadProjectZip = () => {
     })
   }, [projectId])
 
+  useCommandProvider(
+    () => [
+      {
+        id: 'download-as-source-zip',
+        href: `/project/${projectId}/download/zip`,
+        label: t('download_as_source_zip'),
+      },
+    ],
+    [t, projectId]
+  )
+
   return (
     <OLDropdownMenuItem
       href={`/project/${projectId}/download/zip`}
@@ -32,7 +44,7 @@ export const DownloadProjectZip = () => {
 export const DownloadProjectPDF = () => {
   const { t } = useTranslation()
   const { pdfDownloadUrl, pdfUrl } = useCompileContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const sendDownloadEvent = useCallback(() => {
     sendMB('download-pdf-button-click', {
       projectId,
@@ -41,6 +53,25 @@ export const DownloadProjectPDF = () => {
     })
   }, [projectId])
 
+  useCommandProvider(
+    () => [
+      {
+        id: 'download-pdf',
+        disabled: !pdfUrl,
+        href: pdfDownloadUrl || pdfUrl,
+        handler: ({ location }) => {
+          sendMB('download-pdf-button-click', {
+            projectId,
+            location,
+            isSmallDevice,
+          })
+        },
+        label: t('download_as_pdf'),
+      },
+    ],
+    [t, pdfUrl, projectId, pdfDownloadUrl]
+  )
+
   const button = (
     <OLDropdownMenuItem
       href={pdfDownloadUrl || pdfUrl}
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/duplicate-project.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/duplicate-project.tsx
new file mode 100644
index 0000000000..1cfa4581b7
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/duplicate-project.tsx
@@ -0,0 +1,48 @@
+import EditorCloneProjectModalWrapper from '@/features/clone-project-modal/components/editor-clone-project-modal-wrapper'
+import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
+import { useLocation } from '@/shared/hooks/use-location'
+import getMeta from '@/utils/meta'
+import { useCallback, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+
+type ProjectCopyResponse = {
+  project_id: string
+}
+
+export const DuplicateProject = () => {
+  const { sendEvent } = useEditorAnalytics()
+  const { t } = useTranslation()
+  const [showModal, setShowModal] = useState(false)
+  const location = useLocation()
+  const anonymous = getMeta('ol-anonymous')
+
+  const openProject = useCallback(
+    ({ project_id: projectId }: ProjectCopyResponse) => {
+      location.assign(`/project/${projectId}`)
+    },
+    [location]
+  )
+
+  const handleShowModal = useCallback(() => {
+    sendEvent('copy-project', { location: 'project-title-dropdown' })
+    setShowModal(true)
+  }, [sendEvent])
+
+  if (anonymous) {
+    return null
+  }
+
+  return (
+    <>
+      <OLDropdownMenuItem onClick={handleShowModal}>
+        {t('make_a_copy')}
+      </OLDropdownMenuItem>
+      <EditorCloneProjectModalWrapper
+        show={showModal}
+        handleHide={() => setShowModal(false)}
+        openProject={openProject}
+      />
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/labs-actions.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/labs-actions.tsx
index 735c0cfd27..69c38d3b6a 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/labs-actions.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/labs-actions.tsx
@@ -4,6 +4,7 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import MaterialIcon from '@/shared/components/material-icon'
 import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
+import { useSurveyUrl } from '../../hooks/use-survey-url'
 
 export const LabsActions = () => {
   const { t } = useTranslation()
@@ -11,6 +12,8 @@ export const LabsActions = () => {
   const openEditorRedesignSwitcherModal = useCallback(() => {
     setShowSwitcherModal(true)
   }, [setShowSwitcherModal])
+  const surveyURL = useSurveyUrl()
+
   return (
     <>
       <div className="ide-redesign-toolbar-button-container">
@@ -23,7 +26,7 @@ export const LabsActions = () => {
         >
           <OLButton
             size="sm"
-            variant="info"
+            variant="secondary"
             className="ide-redesign-labs-button"
             onClick={openEditorRedesignSwitcherModal}
             leadingIcon={<MaterialIcon type="experiment" unfilled />}
@@ -34,7 +37,7 @@ export const LabsActions = () => {
       </div>
       <div className="ide-redesign-toolbar-button-container">
         <a
-          href="https://forms.gle/soyVStc5qDx9na1Z6"
+          href={surveyURL}
           rel="noopener noreferrer"
           target="_blank"
           className="ide-redesign-toolbar-labs-feedback-link"
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/logos.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/logos.tsx
new file mode 100644
index 0000000000..8f6c60682c
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/logos.tsx
@@ -0,0 +1,46 @@
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import MaterialIcon from '@/shared/components/material-icon'
+import { useTranslation } from 'react-i18next'
+import { Cobranding } from '../../../../../../types/cobranding'
+
+type ToolbarLogosProps = {
+  cobranding?: Cobranding
+}
+
+export const ToolbarLogos = ({ cobranding }: ToolbarLogosProps) => {
+  const { t } = useTranslation()
+
+  return (
+    <div className="ide-redesign-toolbar-logos">
+      <OLTooltip
+        id="tooltip-home-button"
+        description={t('back_to_your_projects')}
+        overlayProps={{ delay: 0, placement: 'bottom' }}
+      >
+        <div className="ide-redesign-toolbar-home-button">
+          <a href="/project" className="ide-redesign-toolbar-home-link">
+            <span className="toolbar-ol-logo" aria-label={t('overleaf_logo')} />
+            <MaterialIcon type="home" className="toolbar-ol-home-button" />
+          </a>
+        </div>
+      </OLTooltip>
+      {cobranding && cobranding.logoImgUrl && (
+        <>
+          <span className="ide-redesign-toolbar-cobranding-separator" />
+          <a
+            className="ide-redesign-toolbar-cobranding-link"
+            href={cobranding.brandVariationHomeUrl}
+            target="_blank"
+            rel="noreferrer noopener"
+          >
+            <img
+              src={cobranding.logoImgUrl}
+              className="ide-redesign-toolbar-cobranding-logo"
+              alt={cobranding.brandVariationName}
+            />
+          </a>
+        </>
+      )}
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/menu-bar.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/menu-bar.tsx
index e28fcc34a7..acb737b33b 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/menu-bar.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/menu-bar.tsx
@@ -1,20 +1,32 @@
 import {
   DropdownDivider,
   DropdownHeader,
+  DropdownItem,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
 import { MenuBar } from '@/shared/components/menu-bar/menu-bar'
-import {
-  MenuBarDropdown,
-  NestedMenuBarDropdown,
-} from '@/shared/components/menu-bar/menu-bar-dropdown'
+import { MenuBarDropdown } from '@/shared/components/menu-bar/menu-bar-dropdown'
 import { MenuBarOption } from '@/shared/components/menu-bar/menu-bar-option'
 import { useTranslation } from 'react-i18next'
 import ChangeLayoutOptions from './change-layout-options'
-import { MouseEventHandler, useCallback } from 'react'
+import { MouseEventHandler, useCallback, useMemo, useState } from 'react'
 import { useIdeRedesignSwitcherContext } from '@/features/ide-react/context/ide-redesign-switcher-context'
 import { useSwitchEnableNewEditorState } from '../../hooks/use-switch-enable-new-editor-state'
 import MaterialIcon from '@/shared/components/material-icon'
 import OLSpinner from '@/features/ui/components/ol/ol-spinner'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
+import CommandDropdown, {
+  CommandSection,
+  MenuSectionStructure,
+  MenuStructure,
+} from './command-dropdown'
+import { useRailContext } from '../../contexts/rail-context'
+import WordCountModal from '@/features/word-count-modal/components/word-count-modal'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
+import { useProjectSettingsContext } from '@/features/editor-left-menu/context/project-settings-context'
+import { useSurveyUrl } from '../../hooks/use-survey-url'
 
 export const ToolbarMenuBar = () => {
   const { t } = useTranslation()
@@ -22,137 +34,276 @@ export const ToolbarMenuBar = () => {
   const openEditorRedesignSwitcherModal = useCallback(() => {
     setShowSwitcherModal(true)
   }, [setShowSwitcherModal])
+  const { setView, view } = useLayoutContext()
+  const { pdfUrl } = useCompileContext()
+  const wordCountEnabled = pdfUrl || isSplitTestEnabled('word-count-client')
+  const [showWordCountModal, setShowWordCountModal] = useState(false)
+
+  useCommandProvider(
+    () => [
+      {
+        type: 'command',
+        label: t('show_version_history'),
+        handler: () => {
+          setView(view === 'history' ? 'editor' : 'history')
+        },
+        id: 'show_version_history',
+      },
+      {
+        type: 'command',
+        label: t('word_count_lower'),
+        disabled: !wordCountEnabled,
+        handler: () => {
+          setShowWordCountModal(true)
+        },
+        id: 'word_count',
+      },
+    ],
+    [t, setView, view, wordCountEnabled]
+  )
+  const fileMenuStructure: MenuStructure = useMemo(
+    () => [
+      {
+        id: 'file-file-tree',
+        children: ['new_file', 'new_folder', 'upload_file'],
+      },
+      { id: 'file-tools', children: ['show_version_history', 'word_count'] },
+      {
+        id: 'file-download',
+        children: ['download-as-source-zip', 'download-pdf'],
+      },
+      {
+        id: 'settings',
+        children: ['open-settings'],
+      },
+    ],
+    []
+  )
+
+  const editMenuStructure: MenuStructure = useMemo(
+    () => [
+      {
+        id: 'edit-undo-redo',
+        children: ['undo', 'redo'],
+      },
+      {
+        id: 'edit-search',
+        children: ['find', 'select-all'],
+      },
+    ],
+    []
+  )
+
+  const insertMenuStructure: MenuStructure = useMemo(
+    () => [
+      {
+        id: 'insert-latex',
+        children: [
+          {
+            id: 'insert-math-group',
+            title: t('math'),
+            children: ['insert-inline-math', 'insert-display-math'],
+          },
+          'insert-symbol',
+          {
+            id: 'insert-figure-group',
+            title: t('figure'),
+            children: [
+              'insert-figure-from-computer',
+              'insert-figure-from-project-files',
+              'insert-figure-from-another-project',
+              'insert-figure-from-url',
+            ],
+          },
+          'insert-table',
+          'insert-citation',
+          'insert-link',
+          'insert-cross-reference',
+        ],
+      },
+      {
+        id: 'insert-comment',
+        children: ['comment'],
+      },
+    ],
+    [t]
+  )
+
+  const formatMenuStructure: MenuStructure = useMemo(
+    () => [
+      {
+        id: 'format-text',
+        children: ['format-bold', 'format-italics'],
+      },
+      {
+        id: 'format-list',
+        children: [
+          'format-bullet-list',
+          'format-numbered-list',
+          'format-increase-indentation',
+          'format-decrease-indentation',
+        ],
+      },
+      {
+        id: 'format-paragraph',
+        title: t('paragraph_styles'),
+        children: [
+          'format-style-normal',
+          'format-style-section',
+          'format-style-subsection',
+          'format-style-subsubsection',
+          'format-style-paragraph',
+          'format-style-subparagraph',
+        ],
+      },
+    ],
+    [t]
+  )
+
+  const pdfControlsMenuSectionStructure: MenuSectionStructure = useMemo(
+    () => ({
+      title: t('pdf_preview'),
+      id: 'pdf-controls',
+      children: [
+        'view-pdf-presentation-mode',
+        'view-pdf-zoom-in',
+        'view-pdf-zoom-out',
+        'view-pdf-fit-width',
+        'view-pdf-fit-height',
+      ],
+    }),
+    [t]
+  )
+
+  const { mathPreview, setMathPreview, breadcrumbs, setBreadcrumbs } =
+    useProjectSettingsContext()
+
+  const toggleMathPreview = useCallback(() => {
+    setMathPreview(!mathPreview)
+  }, [setMathPreview, mathPreview])
+
+  const toggleBreadcrumbs = useCallback(() => {
+    setBreadcrumbs(!breadcrumbs)
+  }, [setBreadcrumbs, breadcrumbs])
+
+  const { setActiveModal } = useRailContext()
+  const openKeyboardShortcutsModal = useCallback(() => {
+    setActiveModal('keyboard-shortcuts')
+  }, [setActiveModal])
+  const openContactUsModal = useCallback(() => {
+    setActiveModal('contact-us')
+  }, [setActiveModal])
+
+  const surveyURL = useSurveyUrl()
+
   return (
-    <MenuBar
-      className="ide-redesign-toolbar-menu-bar"
-      id="toolbar-menu-bar-item"
-    >
-      <MenuBarDropdown
-        title={t('file')}
-        id="file"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
+    <>
+      <MenuBar
+        className="ide-redesign-toolbar-menu-bar"
+        id="toolbar-menu-bar-item"
       >
-        <MenuBarOption title="New file" />
-        <MenuBarOption title="New folder" />
-        <MenuBarOption title="Upload file" />
-        <DropdownDivider />
-        <MenuBarOption title="Show version history" />
-        <DropdownDivider />
-        <MenuBarOption title="Download as source (.zip)" />
-        <MenuBarOption title="Download as PDF" />
-        <DropdownDivider />
-        <MenuBarOption title="New project" />
-      </MenuBarDropdown>
-      <MenuBarDropdown
-        title={t('edit')}
-        id="edit"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
-      >
-        <MenuBarOption title="Undo" />
-        <MenuBarOption title="Redo" />
-        <DropdownDivider />
-        <MenuBarOption title="Cut" />
-        <MenuBarOption title="Copy" />
-        <MenuBarOption title="Paste" />
-        <MenuBarOption title="Paste without formatting" />
-        <DropdownDivider />
-        <MenuBarOption title="Find" />
-        <MenuBarOption title="Select all" />
-      </MenuBarDropdown>
-      <MenuBarDropdown
-        title={t('view')}
-        id="view"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
-      >
-        <ChangeLayoutOptions />
-        <DropdownHeader>Editor settings</DropdownHeader>
-        <MenuBarOption title="Show breadcrumbs" />
-        <MenuBarOption title="Show equation preview" />
-        <DropdownHeader>PDF preview</DropdownHeader>
-        <MenuBarOption title="Presentation mode" />
-        <MenuBarOption title="Zoom in" />
-        <MenuBarOption title="Zoom out" />
-        <MenuBarOption title="Fit to width" />
-        <MenuBarOption title="Fit to height" />
-      </MenuBarDropdown>
-      <MenuBarDropdown
-        title={t('insert')}
-        id="insert"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
-      >
-        <NestedMenuBarDropdown title="Math" id="math">
-          <MenuBarOption title="Generate from text or image" />
-          <DropdownDivider />
-          <MenuBarOption title="Inline math" />
-          <MenuBarOption title="Display math" />
-        </NestedMenuBarDropdown>
-        <MenuBarOption title="Symbol" />
-        <NestedMenuBarDropdown title="Figure" id="figure">
-          <MenuBarOption title="Upload from computer" />
-          <MenuBarOption title="From project files" />
-          <MenuBarOption title="From another project" />
-          <MenuBarOption title="From URL" />
-        </NestedMenuBarDropdown>
-        <MenuBarOption title="Table" />
-        <MenuBarOption title="Citation" />
-        <MenuBarOption title="Link" />
-        <MenuBarOption title="Cross-reference" />
-        <DropdownDivider />
-        <MenuBarOption title="Comment" />
-      </MenuBarDropdown>
-      <MenuBarDropdown
-        title={t('format')}
-        id="format"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
-      >
-        <MenuBarOption title="Bold" />
-        <MenuBarOption title="Italics" />
-        <DropdownDivider />
-        <MenuBarOption title="Bullet list" />
-        <MenuBarOption title="Numbered list" />
-        <MenuBarOption title="Increase indentation" />
-        <MenuBarOption title="Decrease indentation" />
-        <DropdownDivider />
-        <DropdownHeader>Paragraph styles</DropdownHeader>
-        <MenuBarOption title="Normal text" />
-        <MenuBarOption title="Section" />
-        <MenuBarOption title="Subsection" />
-        <MenuBarOption title="Subsubsection" />
-        <MenuBarOption title="Paragraph" />
-        <MenuBarOption title="Subparagraph" />
-      </MenuBarDropdown>
-      <MenuBarDropdown
-        title={t('help')}
-        id="help"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
-      >
-        <MenuBarOption title="Keyboard shortcuts" />
-        <MenuBarOption title="Documentation" />
-        <DropdownDivider />
-        <MenuBarOption title="Contact us" />
-        <MenuBarOption title="Give feedback" />
-        <DropdownDivider />
-        <SwitchToOldEditorMenuBarOption />
-        <MenuBarOption
-          title="What's new?"
-          onClick={openEditorRedesignSwitcherModal}
+        <CommandDropdown menu={fileMenuStructure} title={t('file')} id="file" />
+        <CommandDropdown menu={editMenuStructure} title={t('edit')} id="edit" />
+        <CommandDropdown
+          menu={insertMenuStructure}
+          title={t('insert')}
+          id="insert"
         />
-      </MenuBarDropdown>
-    </MenuBar>
+        <MenuBarDropdown
+          title={t('view')}
+          id="view"
+          className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
+        >
+          <ChangeLayoutOptions />
+          <DropdownDivider />
+          <DropdownHeader>Editor settings</DropdownHeader>
+          <MenuBarOption
+            eventKey="show_breadcrumbs"
+            title={t('show_breadcrumbs')}
+            leadingIcon={
+              breadcrumbs ? 'check' : <DropdownItem.EmptyLeadingIcon />
+            }
+            onClick={toggleBreadcrumbs}
+          />
+          <MenuBarOption
+            eventKey="show_equation_preview"
+            title={t('show_equation_preview')}
+            leadingIcon={
+              mathPreview ? 'check' : <DropdownItem.EmptyLeadingIcon />
+            }
+            onClick={toggleMathPreview}
+          />
+          <DropdownDivider />
+          <CommandSection section={pdfControlsMenuSectionStructure} />
+        </MenuBarDropdown>
+        <CommandDropdown
+          menu={formatMenuStructure}
+          title={t('format')}
+          id="format"
+        />
+        <MenuBarDropdown
+          title={t('help')}
+          id="help"
+          className="ide-redesign-toolbar-dropdown-toggle-subdued ide-redesign-toolbar-button-subdued"
+        >
+          <MenuBarOption
+            eventKey="keyboard_shortcuts"
+            title={t('keyboard_shortcuts')}
+            onClick={openKeyboardShortcutsModal}
+          />
+          <MenuBarOption
+            title={t('documentation')}
+            eventKey="documentation"
+            href="/learn"
+            target="_blank"
+            rel="noopener noreferrer"
+          />
+          <DropdownDivider />
+          <MenuBarOption
+            eventKey="contact_us"
+            title={t('contact_us')}
+            onClick={openContactUsModal}
+          />
+          <MenuBarOption
+            eventKey="give_feedback"
+            title={t('give_feedback')}
+            href={surveyURL}
+            target="_blank"
+            rel="noopener noreferrer"
+          />
+          <DropdownDivider />
+          <SwitchToOldEditorMenuBarOption />
+          <MenuBarOption
+            eventKey="whats_new"
+            title="What's new?"
+            onClick={openEditorRedesignSwitcherModal}
+          />
+        </MenuBarDropdown>
+      </MenuBar>
+      <WordCountModal
+        show={showWordCountModal}
+        handleHide={() => setShowWordCountModal(false)}
+      />
+    </>
   )
 }
 
 const SwitchToOldEditorMenuBarOption = () => {
   const { loading, error, setEditorRedesignStatus } =
     useSwitchEnableNewEditorState()
+  const { sendEvent } = useEditorAnalytics()
 
   const disable: MouseEventHandler = useCallback(
     event => {
       // Don't close the dropdown
       event.stopPropagation()
+      sendEvent('editor-redesign-toggle', {
+        action: 'disable',
+        location: 'menu-bar',
+      })
       setEditorRedesignStatus(false)
     },
-    [setEditorRedesignStatus]
+    [setEditorRedesignStatus, sendEvent]
   )
   let icon = null
   if (loading) {
@@ -162,6 +313,7 @@ const SwitchToOldEditorMenuBarOption = () => {
   }
   return (
     <MenuBarOption
+      eventKey="switch_to_old_editor"
       title="Switch to old editor"
       onClick={disable}
       disabled={loading}
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/online-users.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/online-users.tsx
index d8fb314907..4d937fa89c 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/online-users.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/online-users.tsx
@@ -1,10 +1,10 @@
-import OnlineUsersWidget from '@/features/editor-navigation-toolbar/components/online-users-widget'
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
 import {
   OnlineUser,
   useOnlineUsersContext,
 } from '@/features/ide-react/context/online-users-context'
 import { useCallback } from 'react'
+import { OnlineUsersWidget } from '../online-users/online-users-widget'
 
 export const OnlineUsers = () => {
   const { openDoc } = useEditorManagerContext()
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
index 4cf10b37f3..b975909f6e 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/project-title.tsx
@@ -9,17 +9,21 @@ import { useProjectContext } from '@/shared/context/project-context'
 import { useTranslation } from 'react-i18next'
 import importOverleafModules from '../../../../../macros/import-overleaf-module.macro'
 import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { DownloadProjectPDF, DownloadProjectZip } from './download-project'
 import { useCallback, useState } from 'react'
 import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
 import EditableLabel from './editable-label'
+import { DuplicateProject } from './duplicate-project'
 
 const [publishModalModules] = importOverleafModules('publishModal')
-const SubmitProjectButton = publishModalModules?.import.NewPublishToolbarButton
+const SubmitProjectButton = publishModalModules?.import.NewPublishDropdownButton
 
 export const ToolbarProjectTitle = () => {
+  const { cobranding } = useEditorContext()
   const { t } = useTranslation()
-  const { permissionsLevel, renameProject } = useEditorContext()
+  const { renameProject } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
   const { name } = useProjectContext()
   const shouldDisplaySubmitButton =
     (permissionsLevel === 'owner' || permissionsLevel === 'readAndWrite') &&
@@ -27,7 +31,7 @@ export const ToolbarProjectTitle = () => {
   const hasRenamePermissions = permissionsLevel === 'owner'
   const [isRenaming, setIsRenaming] = useState(false)
   const onRename = useCallback(
-    name => {
+    (name: string) => {
       if (name) {
         renameProject(name)
       }
@@ -52,19 +56,21 @@ export const ToolbarProjectTitle = () => {
   }
 
   return (
-    <Dropdown align="start">
+    <Dropdown align="start" className="ide-redesign-toolbar-project-dropdown">
       <DropdownToggle
         id="project-title-options"
-        className="ide-redesign-toolbar-dropdown-toggle-subdued fw-bold  ide-redesign-toolbar-button-subdued"
+        className="ide-redesign-toolbar-project-dropdown-toggle ide-redesign-toolbar-dropdown-toggle-subdued fw-bold ide-redesign-toolbar-button-subdued"
       >
-        {name}
+        <span className="ide-redesign-toolbar-project-name" translate="no">
+          {name}
+        </span>
         <MaterialIcon
           type="keyboard_arrow_down"
           accessibilityLabel={t('project_title_options')}
         />
       </DropdownToggle>
       <DropdownMenu renderOnMount>
-        {shouldDisplaySubmitButton && (
+        {shouldDisplaySubmitButton && !cobranding && (
           <>
             <SubmitProjectButton />
             <DropdownDivider />
@@ -73,6 +79,7 @@ export const ToolbarProjectTitle = () => {
         <DownloadProjectPDF />
         <DownloadProjectZip />
         <DropdownDivider />
+        <DuplicateProject />
         <OLDropdownMenuItem
           onClick={() => {
             setIsRenaming(true)
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/show-history-button.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/show-history-button.tsx
index 460fff20fc..5540dc5d3b 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/show-history-button.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/show-history-button.tsx
@@ -1,21 +1,24 @@
-import OLButton from '@/features/ui/components/ol/ol-button'
-import MaterialIcon from '@/shared/components/material-icon'
 import { useTranslation } from 'react-i18next'
+import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import * as eventTracking from '../../../../infrastructure/event-tracking'
 import { useLayoutContext } from '@/shared/context/layout-context'
 import { useCallback } from 'react'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
 
 export default function ShowHistoryButton() {
   const { t } = useTranslation()
-  const { view, setView } = useLayoutContext()
+  const { view, setView, restoreView } = useLayoutContext()
+  const { sendEvent } = useEditorAnalytics()
 
   const toggleHistoryOpen = useCallback(() => {
     const action = view === 'history' ? 'close' : 'open'
-    eventTracking.sendMB('navigation-clicked-history', { action })
-
-    setView(view === 'history' ? 'editor' : 'history')
-  }, [view, setView])
+    sendEvent('navigation-clicked-history', { action })
+    if (view === 'history') {
+      restoreView()
+    } else {
+      setView('history')
+    }
+  }, [view, setView, sendEvent, restoreView])
 
   return (
     <div className="ide-redesign-toolbar-button-container">
@@ -24,12 +27,11 @@ export default function ShowHistoryButton() {
         description={t('history')}
         overlayProps={{ delay: 0, placement: 'bottom' }}
       >
-        <OLButton
-          size="sm"
-          variant="ghost"
-          className="ide-redesign-toolbar-button-subdued"
-          leadingIcon={<MaterialIcon type="history" />}
+        <OLIconButton
+          icon="history"
+          className="ide-redesign-toolbar-button-subdued ide-redesign-toolbar-button-icon"
           onClick={toggleHistoryOpen}
+          accessibilityLabel={t('history')}
         />
       </OLTooltip>
     </div>
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx
index e9c05cbffc..abe2012231 100644
--- a/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/toolbar.tsx
@@ -1,5 +1,3 @@
-import MaterialIcon from '@/shared/components/material-icon'
-import { useTranslation } from 'react-i18next'
 import { ToolbarMenuBar } from './menu-bar'
 import { ToolbarProjectTitle } from './project-title'
 import { OnlineUsers } from './online-users'
@@ -7,40 +5,63 @@ import ShareProjectButton from './share-project-button'
 import ChangeLayoutButton from './change-layout-button'
 import ShowHistoryButton from './show-history-button'
 import { LabsActions } from './labs-actions'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import BackToEditorButton from '@/features/editor-navigation-toolbar/components/back-to-editor-button'
+import { useCallback } from 'react'
+import * as eventTracking from '../../../../infrastructure/event-tracking'
+import { ToolbarLogos } from './logos'
+import { useEditorContext } from '@/shared/context/editor-context'
+import importOverleafModules from '../../../../../macros/import-overleaf-module.macro'
+import UpgradeButton from './upgrade-button'
+import getMeta from '@/utils/meta'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
+
+const [publishModalModules] = importOverleafModules('publishModal')
+const SubmitProjectButton = publishModalModules?.import.NewPublishToolbarButton
 
 export const Toolbar = () => {
+  const { view, restoreView } = useLayoutContext()
+  const { cobranding } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
+  const shouldDisplaySubmitButton =
+    (permissionsLevel === 'owner' || permissionsLevel === 'readAndWrite') &&
+    SubmitProjectButton
+
+  const handleBackToEditorClick = useCallback(() => {
+    eventTracking.sendMB('navigation-clicked-history', { action: 'close' })
+    restoreView()
+  }, [restoreView])
+
+  if (view === 'history') {
+    return (
+      <div className="ide-redesign-toolbar">
+        <div className="d-flex align-items-center">
+          <BackToEditorButton onClick={handleBackToEditorClick} />
+        </div>
+        <ToolbarProjectTitle />
+        <div /> {/* Empty div used for spacing */}
+      </div>
+    )
+  }
+
   return (
     <div className="ide-redesign-toolbar">
-      <ToolbarMenus />
-      <ToolbarProjectTitle />
-      <ToolbarButtons />
-    </div>
-  )
-}
-
-const ToolbarMenus = () => {
-  const { t } = useTranslation()
-  return (
-    <div className="ide-redesign-toolbar-menu">
-      <div className="ide-redesign-toolbar-home-button">
-        <a href="/project" className="ide-redesign-toolbar-home-link">
-          <span className="toolbar-ol-logo" aria-label={t('overleaf_logo')} />
-          <MaterialIcon type="home" className="toolbar-ol-home-button" />
-        </a>
+      <div className="ide-redesign-toolbar-menu">
+        <ToolbarLogos cobranding={cobranding} />
+        <ToolbarMenuBar />
+      </div>
+      <ToolbarProjectTitle />
+      <div className="ide-redesign-toolbar-actions">
+        <LabsActions />
+        <OnlineUsers />
+        <ShowHistoryButton />
+        <ChangeLayoutButton />
+        {shouldDisplaySubmitButton && cobranding && (
+          <SubmitProjectButton cobranding={cobranding} />
+        )}
+        <ShareProjectButton />
+        {getMeta('ol-showUpgradePrompt') && <UpgradeButton />}
       </div>
-      <ToolbarMenuBar />
-    </div>
-  )
-}
-
-const ToolbarButtons = () => {
-  return (
-    <div className="ide-redesign-toolbar-actions">
-      <LabsActions />
-      <OnlineUsers />
-      <ShowHistoryButton />
-      <ChangeLayoutButton />
-      <ShareProjectButton />
     </div>
   )
 }
diff --git a/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx b/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx
new file mode 100644
index 0000000000..b3059de5af
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/toolbar/upgrade-button.tsx
@@ -0,0 +1,26 @@
+import { useTranslation } from 'react-i18next'
+import * as eventTracking from '../../../../infrastructure/event-tracking'
+import OLButton from '@/features/ui/components/ol/ol-button'
+
+export default function UpgradeButton() {
+  const { t } = useTranslation()
+
+  function handleClick() {
+    eventTracking.send('subscription-funnel', 'code-editor', 'upgrade')
+    eventTracking.sendMB('upgrade-button-click', { source: 'code-editor' })
+  }
+
+  return (
+    <div className="ide-redesign-toolbar-button-container">
+      <OLButton
+        variant="premium"
+        size="sm"
+        href="/user/subscription/plans?itm_referrer=editor-header-upgrade-prompt"
+        target="_blank"
+        onClick={handleClick}
+      >
+        {t('upgrade')}
+      </OLButton>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/components/tooltip-promo.tsx b/services/web/frontend/js/features/ide-redesign/components/tooltip-promo.tsx
new file mode 100644
index 0000000000..f5d21376b1
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/tooltip-promo.tsx
@@ -0,0 +1,73 @@
+import Close from '@/shared/components/close'
+import { useEditorContext } from '@/shared/context/editor-context'
+import useTutorial from '@/shared/hooks/promotions/use-tutorial'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import classNames from 'classnames'
+import { useCallback, useEffect } from 'react'
+import { Overlay, OverlayProps, Popover } from 'react-bootstrap'
+
+export default function TooltipPromotion({
+  target,
+  tutorialKey,
+  eventData,
+  className,
+  content,
+  header,
+  placement = 'bottom',
+  splitTestName,
+}: {
+  target: HTMLElement | null
+  tutorialKey: string
+  eventData: Record<string, any>
+  className?: string
+  content: string
+  header?: string
+  placement?: OverlayProps['placement']
+  splitTestName?: string
+}) {
+  const { inactiveTutorials } = useEditorContext()
+  const { showPopup, tryShowingPopup, hideUntilReload, dismissTutorial } =
+    useTutorial(tutorialKey, eventData)
+
+  useEffect(() => {
+    if (!inactiveTutorials.includes(tutorialKey)) {
+      tryShowingPopup()
+    }
+  }, [tryShowingPopup, inactiveTutorials, tutorialKey])
+
+  const isInSplitTestIfNeeded = splitTestName
+    ? isSplitTestEnabled(splitTestName)
+    : true
+
+  const onHide = useCallback(() => {
+    hideUntilReload()
+  }, [hideUntilReload])
+
+  if (!target || !isInSplitTestIfNeeded) {
+    return null
+  }
+
+  return (
+    <Overlay
+      placement={placement}
+      show={showPopup}
+      target={target}
+      rootClose
+      onHide={onHide}
+    >
+      <Popover>
+        {header && (
+          <Popover.Header>
+            {header}
+            <Close variant="dark" onDismiss={dismissTutorial} />
+          </Popover.Header>
+        )}
+
+        <Popover.Body className={classNames(className)}>
+          {content}
+          {!header && <Close variant="dark" onDismiss={dismissTutorial} />}
+        </Popover.Body>
+      </Popover>
+    </Overlay>
+  )
+}
diff --git a/services/web/frontend/js/features/ide-redesign/contexts/rail-context.tsx b/services/web/frontend/js/features/ide-redesign/contexts/rail-context.tsx
index 1f14b294ea..a98d3693c5 100644
--- a/services/web/frontend/js/features/ide-redesign/contexts/rail-context.tsx
+++ b/services/web/frontend/js/features/ide-redesign/contexts/rail-context.tsx
@@ -1,4 +1,7 @@
-import useCollapsiblePanel from '@/features/ide-react/hooks/use-collapsible-panel'
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+import useEventListener from '@/shared/hooks/use-event-listener'
+import usePersistedState from '@/shared/hooks/use-persisted-state'
+import { isMac } from '@/shared/utils/os'
 import {
   createContext,
   Dispatch,
@@ -6,6 +9,7 @@ import {
   SetStateAction,
   useCallback,
   useContext,
+  useLayoutEffect,
   useMemo,
   useRef,
   useState,
@@ -18,13 +22,13 @@ export type RailTabKey =
   | 'review-panel'
   | 'chat'
   | 'errors'
+  | 'full-project-search'
 
 export type RailModalKey = 'keyboard-shortcuts' | 'contact-us' | 'dictionary'
 
 const RailContext = createContext<
   | {
       selectedTab: RailTabKey
-      setSelectedTab: Dispatch<SetStateAction<RailTabKey>>
       isOpen: boolean
       setIsOpen: Dispatch<SetStateAction<boolean>>
       panelRef: React.RefObject<ImperativePanelHandle>
@@ -35,12 +39,13 @@ const RailContext = createContext<
       setResizing: Dispatch<SetStateAction<boolean>>
       activeModal: RailModalKey | null
       setActiveModal: Dispatch<SetStateAction<RailModalKey | null>>
+      openTab: (tab: RailTabKey) => void
     }
   | undefined
 >(undefined)
 
-export const RailProvider: FC = ({ children }) => {
-  const [isOpen, setIsOpen] = useState(true)
+export const RailProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const [isOpen, setIsOpen] = usePersistedState('rail-is-open', true)
   const [resizing, setResizing] = useState(false)
   const [activeModal, setActiveModalInternal] = useState<RailModalKey | null>(
     null
@@ -51,28 +56,80 @@ export const RailProvider: FC = ({ children }) => {
     }, [])
 
   const panelRef = useRef<ImperativePanelHandle>(null)
-  useCollapsiblePanel(isOpen, panelRef)
 
   const togglePane = useCallback(() => {
     setIsOpen(value => !value)
-  }, [])
+  }, [setIsOpen])
 
   const handlePaneExpand = useCallback(() => {
     setIsOpen(true)
-  }, [])
+  }, [setIsOpen])
 
   const handlePaneCollapse = useCallback(() => {
     setIsOpen(false)
-  }, [])
+  }, [setIsOpen])
 
-  // NOTE: The file tree **MUST** be the first tab to be opened
-  //       since it is responsible for opening the initial document.
-  const [selectedTab, setSelectedTab] = useState<RailTabKey>('file-tree')
+  const [selectedTab, setSelectedTab] = usePersistedState<RailTabKey>(
+    'selected-rail-tab',
+    'file-tree'
+  )
+
+  // Keep the panel collapse/expanded state in sync with isOpen and selectedTab
+  useLayoutEffect(() => {
+    const panelHandle = panelRef.current
+
+    if (panelHandle) {
+      if (isOpen) {
+        panelHandle.expand()
+      } else {
+        panelHandle.collapse()
+      }
+    }
+  }, [isOpen, selectedTab])
+
+  const openTab = useCallback(
+    (tab: RailTabKey) => {
+      setSelectedTab(tab)
+      setIsOpen(true)
+    },
+    [setIsOpen, setSelectedTab]
+  )
+
+  useEventListener(
+    'ui.toggle-review-panel',
+    useCallback(() => {
+      if (isOpen && selectedTab === 'review-panel') {
+        handlePaneCollapse()
+      } else {
+        openTab('review-panel')
+      }
+    }, [handlePaneCollapse, selectedTab, isOpen, openTab])
+  )
+
+  useEventListener(
+    'keydown',
+    useCallback(
+      (event: KeyboardEvent) => {
+        if (
+          (isMac ? event.metaKey : event.ctrlKey) &&
+          event.shiftKey &&
+          event.code === 'KeyF'
+        ) {
+          event.preventDefault()
+          sendSearchEvent('search-open', {
+            searchType: 'full-project',
+            method: 'keyboard',
+          })
+          openTab('full-project-search')
+        }
+      },
+      [openTab]
+    )
+  )
 
   const value = useMemo(
     () => ({
       selectedTab,
-      setSelectedTab,
       isOpen,
       setIsOpen,
       panelRef,
@@ -83,10 +140,10 @@ export const RailProvider: FC = ({ children }) => {
       setResizing,
       activeModal,
       setActiveModal,
+      openTab,
     }),
     [
       selectedTab,
-      setSelectedTab,
       isOpen,
       setIsOpen,
       panelRef,
@@ -97,6 +154,7 @@ export const RailProvider: FC = ({ children }) => {
       setResizing,
       activeModal,
       setActiveModal,
+      openTab,
     ]
   )
 
diff --git a/services/web/frontend/js/features/ide-redesign/hooks/use-survey-url.tsx b/services/web/frontend/js/features/ide-redesign/hooks/use-survey-url.tsx
new file mode 100644
index 0000000000..fadc077b70
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/hooks/use-survey-url.tsx
@@ -0,0 +1,9 @@
+import { useFeatureFlag } from '@/shared/context/split-test-context'
+
+export const useSurveyUrl = () => {
+  const newErrorlogs = useFeatureFlag('new-editor-error-logs-redesign')
+  if (newErrorlogs) {
+    return 'https://forms.gle/83QJ9ALJkiugxTZf8'
+  }
+  return 'https://forms.gle/soyVStc5qDx9na1Z6'
+}
diff --git a/services/web/frontend/js/features/ide-redesign/hooks/use-toolbar-menu-editor-commands.tsx b/services/web/frontend/js/features/ide-redesign/hooks/use-toolbar-menu-editor-commands.tsx
new file mode 100644
index 0000000000..ba96d049f8
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/hooks/use-toolbar-menu-editor-commands.tsx
@@ -0,0 +1,326 @@
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
+import {
+  useCodeMirrorStateContext,
+  useCodeMirrorViewContext,
+} from '@/features/source-editor/components/codemirror-context'
+import { FigureModalSource } from '@/features/source-editor/components/figure-modal/figure-modal-context'
+import * as commands from '@/features/source-editor/extensions/toolbar/commands'
+import { setSectionHeadingLevel } from '@/features/source-editor/extensions/toolbar/sections'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import getMeta from '@/utils/meta'
+import { redo, selectAll, undo } from '@codemirror/commands'
+import { openSearchPanel } from '@codemirror/search'
+import { useCallback } from 'react'
+import { useTranslation } from 'react-i18next'
+import { useIsNewEditorEnabled } from '../utils/new-editor-utils'
+import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
+import { language } from '@codemirror/language'
+
+export const useToolbarMenuBarEditorCommands = () => {
+  const view = useCodeMirrorViewContext()
+  const state = useCodeMirrorStateContext()
+  const { t } = useTranslation()
+  const { view: layoutView } = useLayoutContext()
+  const editorIsVisible = layoutView === 'editor'
+  const { trackedWrite } = usePermissionsContext()
+  const languageName = state.facet(language)?.name
+  const isTeXFile = languageName === 'latex'
+
+  const openFigureModal = useCallback((source: FigureModalSource) => {
+    window.dispatchEvent(
+      new CustomEvent('figure-modal:open', {
+        detail: { source },
+      })
+    )
+  }, [])
+
+  const newEditor = useIsNewEditorEnabled()
+
+  useCommandProvider(() => {
+    if (!newEditor || !editorIsVisible) {
+      return
+    }
+
+    return [
+      /************************************
+       *          Edit menu
+       ************************************/
+      {
+        id: 'undo',
+        label: t('undo'),
+        handler: () => {
+          undo(view)
+          view.focus()
+        },
+        disabled: !trackedWrite,
+      },
+      {
+        id: 'redo',
+        label: t('redo'),
+        handler: () => {
+          redo(view)
+          view.focus()
+        },
+        disabled: !trackedWrite,
+      },
+      {
+        id: 'find',
+        label: t('find'),
+        handler: () => {
+          openSearchPanel(view)
+        },
+      },
+      {
+        id: 'select-all',
+        label: t('select_all'),
+        handler: () => {
+          selectAll(view)
+          view.focus()
+        },
+      },
+    ]
+  }, [editorIsVisible, t, view, trackedWrite, newEditor])
+
+  // LaTeX commands
+  useCommandProvider(() => {
+    if (!newEditor || !editorIsVisible) {
+      return
+    }
+    if (!isTeXFile || !trackedWrite) {
+      return
+    }
+
+    return [
+      /************************************
+       *         Insert menu
+       ************************************/
+      {
+        id: 'insert-inline-math',
+        label: t('inline_math'),
+        handler: () => {
+          commands.wrapInInlineMath(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'insert-display-math',
+        label: t('display_math'),
+        handler: () => {
+          commands.wrapInDisplayMath(view)
+          view.focus()
+        },
+      },
+      {
+        label: t('upload_from_computer'),
+        id: 'insert-figure-from-computer',
+        handler: () => {
+          openFigureModal(FigureModalSource.FILE_UPLOAD)
+        },
+      },
+      {
+        label: t('from_project_files'),
+        id: 'insert-figure-from-project-files',
+        handler: () => {
+          openFigureModal(FigureModalSource.FILE_TREE)
+        },
+      },
+      {
+        label: t('from_another_project'),
+        id: 'insert-figure-from-another-project',
+        handler: () => {
+          openFigureModal(FigureModalSource.OTHER_PROJECT)
+        },
+      },
+      {
+        label: t('from_url'),
+        id: 'insert-figure-from-url',
+        handler: () => {
+          openFigureModal(FigureModalSource.FROM_URL)
+        },
+      },
+      {
+        id: 'insert-table',
+        label: t('table'),
+        handler: () => {
+          commands.insertTable(view, 3, 3)
+          view.focus()
+        },
+      },
+      {
+        id: 'insert-citation',
+        label: t('citation'),
+        handler: () => {
+          commands.insertCite(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'insert-link',
+        label: t('link'),
+        handler: () => {
+          commands.wrapInHref(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'insert-cross-reference',
+        label: t('cross_reference'),
+        handler: () => {
+          commands.insertRef(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'comment',
+        label: t('comment'),
+        handler: () => {
+          commands.addComment()
+        },
+        disabled: state.selection.main.empty,
+      },
+      /************************************
+       *         Format menu
+       ************************************/
+      {
+        id: 'format-bold',
+        label: t('bold'),
+        handler: () => {
+          commands.toggleBold(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-italics',
+        label: t('italics'),
+        handler: () => {
+          commands.toggleItalic(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-bullet-list',
+        label: t('bullet_list'),
+        handler: () => {
+          commands.toggleBulletList(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-numbered-list',
+        label: t('numbered_list'),
+        handler: () => {
+          commands.toggleNumberedList(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-increase-indentation',
+        label: t('increase_indent'),
+        handler: () => {
+          commands.indentIncrease(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-decrease-indentation',
+        label: t('decrease_indent'),
+        handler: () => {
+          commands.indentDecrease(view)
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-normal',
+        label: t('normal'),
+        handler: () => {
+          setSectionHeadingLevel(view, 'text')
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-section',
+        label: 'Section',
+        handler: () => {
+          setSectionHeadingLevel(view, 'section')
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-subsection',
+        label: 'Subsection',
+        handler: () => {
+          setSectionHeadingLevel(view, 'subsection')
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-subsubsection',
+        label: 'Subsubsection',
+        handler: () => {
+          setSectionHeadingLevel(view, 'subsubsection')
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-paragraph',
+        label: 'Paragraph',
+        handler: () => {
+          setSectionHeadingLevel(view, 'paragraph')
+          view.focus()
+        },
+      },
+      {
+        id: 'format-style-subparagraph',
+        label: 'Subparagraph',
+        handler: () => {
+          setSectionHeadingLevel(view, 'subparagraph')
+          view.focus()
+        },
+      },
+    ]
+  }, [
+    view,
+    t,
+    editorIsVisible,
+    openFigureModal,
+    newEditor,
+    trackedWrite,
+    isTeXFile,
+    state.selection.main.empty,
+  ])
+
+  const { toggleSymbolPalette } = useEditorPropertiesContext()
+  const symbolPaletteAvailable = getMeta('ol-symbolPaletteAvailable')
+  useCommandProvider(() => {
+    if (!newEditor || !editorIsVisible) {
+      return
+    }
+
+    if (!symbolPaletteAvailable) {
+      return
+    }
+
+    if (!isTeXFile || !trackedWrite) {
+      return
+    }
+
+    return [
+      {
+        id: 'insert-symbol',
+        label: t('symbol'),
+        handler: () => {
+          toggleSymbolPalette?.()
+        },
+      },
+    ]
+  }, [
+    symbolPaletteAvailable,
+    t,
+    toggleSymbolPalette,
+    editorIsVisible,
+    isTeXFile,
+    trackedWrite,
+    newEditor,
+  ])
+}
diff --git a/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg b/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg
new file mode 100644
index 0000000000..f26bd28bfb
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg
@@ -0,0 +1,4 @@
+<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 8C0 3.58172 3.58172 0 8 0H28C32.4183 0 36 3.58172 36 8V28C36 32.4183 32.4183 36 28 36H8C3.58172 36 0 32.4183 0 28V8Z" fill="#EAF6EF"/>
+<path d="M14.8 16.95L16.95 14.775L15.55 13.35L15.15 13.75C14.9667 13.9333 14.7333 14.0333 14.45 14.05C14.1833 14.05 13.95 13.95 13.75 13.75C13.55 13.55 13.45 13.3167 13.45 13.05C13.45 12.7667 13.55 12.525 13.75 12.325L14.125 11.95L13 10.825L10.825 13L14.8 16.95ZM23 25.175L25.175 23L24.05 21.875L23.65 22.25C23.45 22.45 23.2167 22.55 22.95 22.55C22.6833 22.55 22.45 22.45 22.25 22.25C22.05 22.05 21.95 21.8167 21.95 21.55C21.95 21.2833 22.05 21.05 22.25 20.85L22.625 20.45L21.2 19.05L19.05 21.2L23 25.175ZM22.225 12.425L23.625 13.825L25.025 12.425L23.6 11L22.225 12.425ZM10 27C9.71667 27 9.475 26.9083 9.275 26.725C9.09167 26.525 9 26.2833 9 26V23.175C9 23.0417 9.025 22.9167 9.075 22.8C9.125 22.6667 9.2 22.55 9.3 22.45L13.375 18.375L9.05 14.05C8.76667 13.7667 8.625 13.4167 8.625 13C8.625 12.5833 8.76667 12.2333 9.05 11.95L11.95 9.05C12.2333 8.76667 12.5833 8.63333 13 8.65C13.4167 8.65 13.7667 8.79167 14.05 9.075L18.4 13.4L22.175 9.6C22.375 9.4 22.6 9.25 22.85 9.15C23.1 9.05 23.3583 9 23.625 9C23.8917 9 24.15 9.05 24.4 9.15C24.65 9.25 24.875 9.4 25.075 9.6L26.4 10.95C26.6 11.15 26.75 11.375 26.85 11.625C26.95 11.875 27 12.1333 27 12.4C27 12.6667 26.95 12.925 26.85 13.175C26.75 13.4083 26.6 13.625 26.4 13.825L22.625 17.625L26.95 21.95C27.2333 22.2333 27.375 22.5833 27.375 23C27.375 23.4167 27.2333 23.7667 26.95 24.05L24.05 26.95C23.7667 27.2333 23.4167 27.375 23 27.375C22.5833 27.375 22.2333 27.2333 21.95 26.95L17.625 22.625L13.55 26.7C13.45 26.8 13.3333 26.875 13.2 26.925C13.0833 26.975 12.9583 27 12.825 27H10Z" fill="#195936"/>
+</svg>
diff --git a/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts b/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
index 5dbffab7d5..5b53ae8a6e 100644
--- a/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
+++ b/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
@@ -1,9 +1,9 @@
 import { useUserSettingsContext } from '@/shared/context/user-settings-context'
+import { isInExperiment } from '@/utils/labs-utils'
 import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 
-// TODO: For now we're using the feature flag, but eventually we'll read this
-// from labs.
-export const canUseNewEditor = () => isSplitTestEnabled('editor-redesign')
+export const canUseNewEditor = () =>
+  isInExperiment('editor-redesign') || isSplitTestEnabled('editor-redesign')
 
 export const useIsNewEditorEnabled = () => {
   const { userSettings } = useUserSettingsContext()
diff --git a/services/web/frontend/js/features/mathjax/load-mathjax.ts b/services/web/frontend/js/features/mathjax/load-mathjax.ts
index 0d9153ba56..c80d8a3d85 100644
--- a/services/web/frontend/js/features/mathjax/load-mathjax.ts
+++ b/services/web/frontend/js/features/mathjax/load-mathjax.ts
@@ -30,6 +30,10 @@ export const loadMathJax = async (options?: {
             // Implements support for the \bm command from the bm package. It bolds the argument in math mode.
             // https://github.com/mathjax/MathJax/issues/1219#issuecomment-341059843
             bm: ['\\boldsymbol{#1}', 1],
+            // MathJax 3 renders \coloneq as :- whereas the mathtools package
+            // renders it as :=. Here we override the \coloneq macro to produce
+            // the := symbol.
+            coloneq: '\\coloneqq',
           },
           inlineMath,
           displayMath: [
diff --git a/services/web/frontend/js/features/navbar/index.ts b/services/web/frontend/js/features/navbar/index.ts
new file mode 100644
index 0000000000..d9d7c28bcf
--- /dev/null
+++ b/services/web/frontend/js/features/navbar/index.ts
@@ -0,0 +1,9 @@
+const toggleButton = document.getElementById('navbar-toggle-btn') as HTMLElement
+
+toggleButton?.addEventListener('click', () => {
+  // Delay allows Bootstrap to update aria-expanded first
+  setTimeout(() => {
+    const isExpanded = toggleButton.getAttribute('aria-expanded') === 'true'
+    document.body.classList.toggle('no-scroll', isExpanded)
+  }, 5)
+})
diff --git a/services/web/frontend/js/features/outline/components/outline-item.tsx b/services/web/frontend/js/features/outline/components/outline-item.tsx
index 08a6b0f942..05539bdf13 100644
--- a/services/web/frontend/js/features/outline/components/outline-item.tsx
+++ b/services/web/frontend/js/features/outline/components/outline-item.tsx
@@ -62,6 +62,7 @@ const OutlineItem = memo(function OutlineItem({
       role="treeitem"
       aria-current={isHighlighted}
       aria-label={outlineItem.title}
+      translate="no"
     >
       <div className="outline-item-row">
         {!!outlineItem.children && (
diff --git a/services/web/frontend/js/features/pdf-preview/components/compile-time-changing-soon.tsx b/services/web/frontend/js/features/pdf-preview/components/compile-time-changing-soon.tsx
new file mode 100644
index 0000000000..9d9bc53711
--- /dev/null
+++ b/services/web/frontend/js/features/pdf-preview/components/compile-time-changing-soon.tsx
@@ -0,0 +1,122 @@
+import Notification from '@/shared/components/notification'
+import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
+import { Trans, useTranslation } from 'react-i18next'
+import * as eventTracking from '@/infrastructure/event-tracking'
+import { FC } from 'react'
+
+export const CompileTimeoutChangingSoon: FC<{
+  isProjectOwner?: boolean
+  handleDismissChangingSoon: () => void
+  segmentation?: eventTracking.Segmentation
+}> = ({ isProjectOwner = false, handleDismissChangingSoon, segmentation }) => {
+  const { t } = useTranslation()
+
+  const sendInfoClickEvent = () => {
+    eventTracking.sendMB('paywall-info-click', {
+      'paywall-type': 'compile-time-warning',
+      ...segmentation,
+      content: 'blog',
+    })
+  }
+
+  const compileTimeoutChangesBlogLink = (
+    /* eslint-disable-next-line jsx-a11y/anchor-has-content */
+    <a
+      aria-label={t('read_more_about_compile_timeout_changes')}
+      href="/blog/changes-to-free-compile-timeout"
+      key="compileTimeoutBlogLink1"
+      rel="noopener noreferrer"
+      target="_blank"
+      onClick={sendInfoClickEvent}
+    />
+  )
+
+  const fixingCompileTimeoutsLearnLink = (
+    /* eslint-disable-next-line jsx-a11y/anchor-has-content */
+    <a
+      aria-label={t('read_more_about_fix_prevent_timeout')}
+      href="/learn/how-to/Fixing_and_preventing_compile_timeouts"
+      key="compileTimeoutBlogLink2"
+      target="_blank"
+      rel="noopener noreferrer"
+    />
+  )
+
+  if (isProjectOwner) {
+    return (
+      <Notification
+        action={
+          <StartFreeTrialButton
+            segmentation={segmentation}
+            source="compile-time-warning"
+            buttonProps={{
+              variant: 'secondary',
+              size: 'sm',
+            }}
+          >
+            {t('start_free_trial_without_exclamation')}
+          </StartFreeTrialButton>
+        }
+        ariaLive="polite"
+        content={
+          <div>
+            <p>
+              <Trans
+                i18nKey="introducing_shorter_compile_timeout"
+                components={[compileTimeoutChangesBlogLink]}
+              />
+            </p>
+            <p className="row-spaced">
+              <Trans
+                i18nKey="you_may_be_able_to_fix_issues_to_speed_up_the_compile"
+                components={[fixingCompileTimeoutsLearnLink]}
+              />{' '}
+              <Trans
+                i18nKey="and_upgrade_for_compile_time"
+                components={{ strong: <strong /> }}
+              />
+            </p>
+          </div>
+        }
+        title={t('your_project_compiled_but_soon_might_not')}
+        type="warning"
+        isActionBelowContent
+        isDismissible
+        onDismiss={handleDismissChangingSoon}
+      />
+    )
+  }
+
+  return (
+    <Notification
+      ariaLive="polite"
+      content={
+        <div>
+          <p>
+            <Trans
+              i18nKey="introducing_shorter_compile_timeout"
+              components={[compileTimeoutChangesBlogLink]}
+            />{' '}
+            <Trans
+              i18nKey="you_may_be_able_to_fix_issues_to_speed_up_the_compile"
+              components={[fixingCompileTimeoutsLearnLink]}
+            />
+          </p>
+          <p className="row-spaced">
+            <Trans
+              i18nKey="tell_the_project_owner_and_ask_them_to_upgrade"
+              components={[
+                // eslint-disable-next-line react/jsx-key
+                <strong />,
+              ]}
+            />
+          </p>
+        </div>
+      }
+      title={t('this_project_compiled_but_soon_might_not')}
+      type="warning"
+      isDismissible
+      onDismiss={handleDismissChangingSoon}
+    />
+  )
+}
diff --git a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx
index 09cfb5ddee..463ba55be8 100644
--- a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx
@@ -1,21 +1,24 @@
 import Notification from '@/shared/components/notification'
 import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
+import * as eventTracking from '../../../infrastructure/event-tracking'
 import { useTranslation } from 'react-i18next'
 import { FC } from 'react'
 
 export const CompileTimeWarningUpgradePromptInner: FC<{
   handleDismissWarning: () => void
-}> = ({ handleDismissWarning }) => {
+  segmentation: eventTracking.Segmentation
+}> = ({ handleDismissWarning, segmentation }) => {
   const { t } = useTranslation()
 
   return (
     <Notification
       action={
         <StartFreeTrialButton
-          variant="new-10s"
           source="compile-time-warning"
+          segmentation={segmentation}
           buttonProps={{
             variant: 'secondary',
+            size: 'sm',
           }}
         >
           {t('start_free_trial_without_exclamation')}
@@ -27,7 +30,7 @@ export const CompileTimeWarningUpgradePromptInner: FC<{
           <div>
             <span>{t('your_project_near_compile_timeout_limit')}</span>
           </div>
-          <strong>{t('upgrade_for_12x_more_compile_time')}</strong>
+          <strong>{t('upgrade_for_more_compile_time')}</strong>
           {'. '}
         </div>
       }
diff --git a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt.tsx b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt.tsx
index b6d56df936..164c3c3275 100644
--- a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt.tsx
@@ -1,23 +1,56 @@
-import { memo, useCallback, useEffect, useState } from 'react'
+import { memo, useCallback, useEffect, useMemo, useState } from 'react'
 import * as eventTracking from '@/infrastructure/event-tracking'
 import { useDetachCompileContext } from '@/shared/context/detach-compile-context'
 import usePersistedState from '@/shared/hooks/use-persisted-state'
 import { CompileTimeWarningUpgradePromptInner } from '@/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner'
 import getMeta from '@/utils/meta'
+import { CompileTimeoutChangingSoon } from './compile-time-changing-soon'
 
 function CompileTimeWarningUpgradePrompt() {
   const { isProjectOwner, deliveryLatencies, compiling, showLogs, error } =
     useDetachCompileContext()
 
   const [showWarning, setShowWarning] = useState(false)
+  const [showChangingSoon, setShowChangingSoon] = useState(false)
   const [dismissedUntilWarning, setDismissedUntilWarning] = usePersistedState<
     Date | undefined
   >(`has-dismissed-10s-compile-time-warning-until`)
+  const { reducedTimeoutWarning } = getMeta('ol-compileSettings')
+  const warningThreshold = reducedTimeoutWarning === 'enabled' ? 7 : 10
+
+  const sharedSegmentation = useMemo(
+    () => ({
+      '10s-timeout-warning': reducedTimeoutWarning,
+      'is-owner': isProjectOwner,
+    }),
+    [isProjectOwner, reducedTimeoutWarning]
+  )
+
+  const warningSegmentation = useMemo(
+    () => ({
+      content: 'warning',
+      compileTime: warningThreshold,
+      ...sharedSegmentation,
+    }),
+    [sharedSegmentation, warningThreshold]
+  )
+
+  const changingSoonSegmentation = useMemo(
+    () => ({
+      content: 'changes',
+      compileTime: 10,
+      ...sharedSegmentation,
+    }),
+    [sharedSegmentation]
+  )
 
   const handleNewCompile = useCallback(
-    compileTime => {
+    (compileTime: number) => {
       setShowWarning(false)
-      if (compileTime > 10000) {
+      setShowChangingSoon(false)
+      if (reducedTimeoutWarning === 'enabled' && compileTime > 10000) {
+        setShowChangingSoon(true)
+      } else if (compileTime > warningThreshold * 1000) {
         if (isProjectOwner) {
           if (
             !dismissedUntilWarning ||
@@ -25,26 +58,52 @@ function CompileTimeWarningUpgradePrompt() {
           ) {
             setShowWarning(true)
             eventTracking.sendMB('compile-time-warning-displayed', {
-              time: 10,
+              compileTime: warningThreshold,
               isProjectOwner,
             })
           }
         }
       }
     },
-    [isProjectOwner, dismissedUntilWarning]
+    [
+      isProjectOwner,
+      dismissedUntilWarning,
+      reducedTimeoutWarning,
+      warningThreshold,
+    ]
   )
 
   const handleDismissWarning = useCallback(() => {
     eventTracking.sendMB('compile-time-warning-dismissed', {
-      time: 10,
+      compileTime: warningThreshold,
       isProjectOwner,
     })
+    eventTracking.sendMB('paywall-dismiss', {
+      'paywall-type': 'compile-time-warning',
+      content: 'warning',
+      compileTime: warningThreshold,
+      ...sharedSegmentation,
+    })
     setShowWarning(false)
     const until = new Date()
     until.setDate(until.getDate() + 1) // 1 day
     setDismissedUntilWarning(until)
-  }, [isProjectOwner, setDismissedUntilWarning])
+  }, [
+    isProjectOwner,
+    setDismissedUntilWarning,
+    warningThreshold,
+    sharedSegmentation,
+  ])
+
+  const handleDismissChangingSoon = useCallback(() => {
+    eventTracking.sendMB('paywall-dismiss', {
+      'paywall-type': 'compile-time-warning',
+      compileTime: 10,
+      content: 'changes',
+      ...sharedSegmentation,
+    })
+    setShowChangingSoon(false)
+  }, [sharedSegmentation])
 
   useEffect(() => {
     if (compiling || error || showLogs) return
@@ -55,21 +114,32 @@ function CompileTimeWarningUpgradePrompt() {
     return null
   }
 
-  if (compiling || error || showLogs) {
+  if (
+    compiling ||
+    error ||
+    showLogs ||
+    !deliveryLatencies.compileTimeServerE2E
+  ) {
     return null
   }
 
-  if (!showWarning) {
+  if (!showWarning && !showChangingSoon) {
     return null
   }
 
-  // if showWarning is true then the 10s warning is shown
-
   return (
     <div>
       {showWarning && isProjectOwner && (
         <CompileTimeWarningUpgradePromptInner
           handleDismissWarning={handleDismissWarning}
+          segmentation={warningSegmentation}
+        />
+      )}
+      {showChangingSoon && (
+        <CompileTimeoutChangingSoon
+          isProjectOwner={isProjectOwner}
+          handleDismissChangingSoon={handleDismissChangingSoon}
+          segmentation={changingSoonSegmentation}
         />
       )}
     </div>
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-compile-button.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-compile-button.tsx
index b2b78d9e19..d693fe071f 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-compile-button.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-compile-button.tsx
@@ -75,11 +75,13 @@ function PdfCompileButton() {
       'btn-striped-animated': hasChanges,
     },
     'no-left-border',
-    'dropdown-button-toggle'
+    'dropdown-button-toggle',
+    'compile-dropdown-toggle'
   )
 
   const buttonClassName = classNames(
     'align-items-center py-0 no-left-radius px-3',
+    'compile-button',
     {
       'btn-striped-animated': hasChanges,
     }
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-file-list.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-file-list.tsx
index 8ed0b86d9b..753aa32805 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-file-list.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-file-list.tsx
@@ -24,7 +24,11 @@ function PdfFileList({ fileList }: { fileList: PdfFileDataList }) {
 
       {fileList.top.map(file => (
         <li key={file.path} role="menuitem">
-          <DropdownItem role="link" download={basename(file)} href={file.url}>
+          <DropdownItem
+            role="link"
+            download={basename(file)}
+            href={file.downloadURL || file.url}
+          >
             {file.path}
           </DropdownItem>
         </li>
@@ -36,7 +40,11 @@ function PdfFileList({ fileList }: { fileList: PdfFileDataList }) {
 
       {fileList.other.map(file => (
         <li key={file.path} role="menuitem">
-          <DropdownItem role="link" download={basename(file)} href={file.url}>
+          <DropdownItem
+            role="link"
+            download={basename(file)}
+            href={file.downloadURL || file.url}
+          >
             {file.path}
           </DropdownItem>
         </li>
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-download-button.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-download-button.tsx
index bf0b0378d2..4a6991f30b 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-download-button.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-hybrid-download-button.tsx
@@ -9,7 +9,7 @@ import MaterialIcon from '@/shared/components/material-icon'
 function PdfHybridDownloadButton() {
   const { pdfDownloadUrl } = useCompileContext()
 
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   const { t } = useTranslation()
   const description = pdfDownloadUrl
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-js-viewer.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-js-viewer.tsx
index 04332d2485..e0ed7fdb78 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-js-viewer.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-js-viewer.tsx
@@ -23,7 +23,7 @@ type PdfJsViewerProps = {
 }
 
 function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   const { setError, firstRenderDone, highlights, position, setPosition } =
     useCompileContext()
@@ -62,10 +62,10 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
 
   // create the viewer when the container is mounted
   const handleContainer = useCallback(
-    parent => {
+    (parent: HTMLDivElement | null) => {
       if (parent) {
         try {
-          setPdfJsWrapper(new PDFJSWrapper(parent.firstChild))
+          setPdfJsWrapper(new PDFJSWrapper(parent.firstChild as HTMLDivElement))
         } catch (error: any) {
           setLoadingError(true)
           captureException(error)
@@ -144,6 +144,10 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
       setRawScale(scale.scale)
     }
 
+    const handlePageChanging = (event: { pageNumber: number }) => {
+      setPage(event.pageNumber)
+    }
+
     // `pagesinit` fires when the data for rendering the first page is ready.
     pdfJsWrapper.eventBus.on('pagesinit', handlePagesinit)
     // `pagerendered` fires when a page was actually rendered.
@@ -151,12 +155,15 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
     // Once a page has been rendered we can set the initial current page number.
     pdfJsWrapper.eventBus.on('pagerendered', handleRenderedInitialPageNumber)
     pdfJsWrapper.eventBus.on('scalechanging', handleScaleChanged)
+    // `pagechanging` fires when the page number changes.
+    pdfJsWrapper.eventBus.on('pagechanging', handlePageChanging)
 
     return () => {
       pdfJsWrapper.eventBus.off('pagesinit', handlePagesinit)
       pdfJsWrapper.eventBus.off('pagerendered', handleRendered)
       pdfJsWrapper.eventBus.off('pagerendered', handleRenderedInitialPageNumber)
       pdfJsWrapper.eventBus.off('scalechanging', handleScaleChanged)
+      pdfJsWrapper.eventBus.off('pagechanging', handlePageChanging)
     }
   }, [pdfJsWrapper, firstRenderDone, startFetch])
 
@@ -168,10 +175,10 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
       setStartFetch(performance.now())
 
       const abortController = new AbortController()
-      const handleFetchError = (err: Error) => {
+      const handleFetchError = (err: any) => {
         if (abortController.signal.aborted) return
         // The error is already logged at the call-site with additional context.
-        if (err instanceof PDFJS.MissingPDFException) {
+        if (err instanceof PDFJS.ResponseException && err.missing) {
           setError('rendering-error-expected')
         } else {
           setError('rendering-error')
@@ -385,7 +392,7 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
 
   // set the scale in response to zoom option changes
   const setZoom = useCallback(
-    zoom => {
+    (zoom: any) => {
       switch (zoom) {
         case 'zoom-in':
           if (pdfJsWrapper) {
@@ -430,7 +437,7 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
   }, [pdfJsWrapper])
 
   const handleKeyDown = useCallback(
-    event => {
+    (event: React.KeyboardEvent) => {
       if (!initialised || !pdfJsWrapper) {
         return
       }
@@ -490,7 +497,12 @@ function PdfJsViewer({ url, pdfFile }: PdfJsViewerProps) {
       onKeyDown={handleKeyDown}
       tabIndex={-1}
     >
-      <div className="pdfjs-viewer-inner" tabIndex={0} role="tabpanel">
+      <div
+        className="pdfjs-viewer-inner"
+        tabIndex={0}
+        role="tabpanel"
+        data-testid="pdfjs-viewer-inner"
+      >
         <div className="pdfViewer" />
       </div>
       {toolbarInfoLoaded && (
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-content.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-content.tsx
index 8c9a9d7761..17378f6c74 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-content.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-content.tsx
@@ -3,6 +3,7 @@ import PdfLogEntryRawContent from './pdf-log-entry-raw-content'
 import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
 import { LogEntry } from '../util/types'
 import { ElementType } from 'react'
+import classNames from 'classnames'
 
 const pdfLogEntryComponents = importOverleafModules(
   'pdfLogEntryComponents'
@@ -17,17 +18,21 @@ export default function PdfLogEntryContent({
   extraInfoURL,
   index,
   logEntry,
+  alwaysExpandRawContent = false,
+  className,
 }: {
   rawContent?: string
   formattedContent?: React.ReactNode
   extraInfoURL?: string | null
   index?: number
   logEntry?: LogEntry
+  alwaysExpandRawContent?: boolean
+  className?: string
 }) {
   const { t } = useTranslation()
 
   return (
-    <div className="log-entry-content">
+    <div className={classNames('log-entry-content', className)}>
       {formattedContent && (
         <div className="log-entry-formatted-content">{formattedContent}</div>
       )}
@@ -48,7 +53,11 @@ export default function PdfLogEntryContent({
         )}
 
       {rawContent && (
-        <PdfLogEntryRawContent rawContent={rawContent} collapsedSize={150} />
+        <PdfLogEntryRawContent
+          rawContent={rawContent}
+          collapsedSize={150}
+          alwaysExpanded={alwaysExpandRawContent}
+        />
       )}
     </div>
   )
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
index ab0957b331..7c3258f8c6 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry-raw-content.tsx
@@ -3,25 +3,28 @@ import { useResizeObserver } from '../../../shared/hooks/use-resize-observer'
 import { useTranslation } from 'react-i18next'
 import classNames from 'classnames'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import Icon from '../../../shared/components/icon'
 
 export default function PdfLogEntryRawContent({
   rawContent,
   collapsedSize = 0,
+  alwaysExpanded = false,
 }: {
   rawContent: string
   collapsedSize?: number
+  alwaysExpanded?: boolean
 }) {
-  const [expanded, setExpanded] = useState(false)
-  const [needsExpander, setNeedsExpander] = useState(true)
+  const [expanded, setExpanded] = useState(alwaysExpanded)
+  const [needsExpander, setNeedsExpander] = useState(!alwaysExpanded)
 
   const { elementRef } = useResizeObserver(
     useCallback(
-      element => {
+      (element: Element) => {
         if (element.scrollHeight === 0) return // skip update when logs-pane is closed
-        setNeedsExpander(element.scrollHeight > collapsedSize)
+        setNeedsExpander(
+          !alwaysExpanded && element.scrollHeight > collapsedSize
+        )
       },
-      [collapsedSize]
+      [collapsedSize, alwaysExpanded]
     )
   )
 
@@ -35,7 +38,7 @@ export default function PdfLogEntryRawContent({
           height: expanded || !needsExpander ? 'auto' : collapsedSize,
         }}
       >
-        <pre className="log-entry-content-raw" ref={elementRef}>
+        <pre className="log-entry-content-raw" ref={elementRef} translate="no">
           {rawContent.trim()}
         </pre>
       </div>
@@ -49,17 +52,10 @@ export default function PdfLogEntryRawContent({
           <OLButton
             variant="secondary"
             size="sm"
+            leadingIcon={expanded ? 'expand_less' : 'expand_more'}
             onClick={() => setExpanded(value => !value)}
           >
-            {expanded ? (
-              <>
-                <Icon type="angle-up" /> {t('collapse')}
-              </>
-            ) : (
-              <>
-                <Icon type="angle-down" /> {t('expand')}
-              </>
-            )}
+            {expanded ? t('collapse') : t('expand')}
           </OLButton>
         </div>
       )}
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry.tsx
index 349ad79047..23ae2dca5d 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-log-entry.tsx
@@ -1,4 +1,3 @@
-import classNames from 'classnames'
 import { memo, MouseEventHandler, useCallback } from 'react'
 import PreviewLogEntryHeader from '../../preview/components/preview-log-entry-header'
 import PdfLogEntryContent from './pdf-log-entry-content'
@@ -6,6 +5,9 @@ import HumanReadableLogsHints from '../../../ide/human-readable-logs/HumanReadab
 import { sendMB } from '@/infrastructure/event-tracking'
 import getMeta from '@/utils/meta'
 import { ErrorLevel, LogEntry, SourceLocation } from '../util/types'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import NewLogEntry from '@/features/ide-redesign/components/error-logs/log-entry'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
 
 function PdfLogEntry({
   ruleId,
@@ -18,12 +20,9 @@ function PdfLogEntry({
   level,
   sourceLocation,
   showSourceLocationLink = true,
-  showCloseButton = false,
   entryAriaLabel = undefined,
-  customClass,
   contentDetails,
   onSourceLocationClick,
-  onClose,
   index,
   logEntry,
   id,
@@ -38,12 +37,9 @@ function PdfLogEntry({
   extraInfoURL?: string | null
   sourceLocation?: SourceLocation
   showSourceLocationLink?: boolean
-  showCloseButton?: boolean
   entryAriaLabel?: string
-  customClass?: string
   contentDetails?: string[]
   onSourceLocationClick?: (sourceLocation: SourceLocation) => void
-  onClose?: () => void
   index?: number
   logEntry?: LogEntry
   id?: string
@@ -73,9 +69,34 @@ function PdfLogEntry({
       [level, onSourceLocationClick, ruleId, sourceLocation]
     )
 
+  const newEditor = useIsNewEditorEnabled()
+  const newErrorlogs = useFeatureFlag('new-editor-error-logs-redesign')
+
+  if (newEditor && newErrorlogs) {
+    return (
+      <NewLogEntry
+        index={index}
+        id={id}
+        logEntry={logEntry}
+        ruleId={ruleId}
+        headerTitle={headerTitle}
+        formattedContent={formattedContent}
+        rawContent={rawContent}
+        logType={logType}
+        level={level}
+        contentDetails={contentDetails}
+        entryAriaLabel={entryAriaLabel}
+        sourceLocation={sourceLocation}
+        onSourceLocationClick={onSourceLocationClick}
+        showSourceLocationLink={showSourceLocationLink}
+        extraInfoURL={extraInfoURL}
+      />
+    )
+  }
+
   return (
     <div
-      className={classNames('log-entry', customClass)}
+      className="log-entry"
       aria-label={entryAriaLabel}
       data-ruleid={ruleId}
       data-log-entry-id={id}
@@ -88,8 +109,6 @@ function PdfLogEntry({
         logType={logType}
         showSourceLocationLink={showSourceLocationLink}
         onSourceLocationClick={handleLogEntryLinkClick}
-        showCloseButton={showCloseButton}
-        onClose={onClose}
       />
 
       {(rawContent || formattedContent || showAiErrorAssistant) && (
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.tsx
index ec834432fe..f9f91c84fa 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-logs-viewer.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { memo, useState } from 'react'
+import { memo } from 'react'
 import classnames from 'classnames'
 import PdfValidationIssue from './pdf-validation-issue'
 import StopOnFirstErrorPrompt from './stop-on-first-error-prompt'
@@ -14,42 +14,31 @@ import PdfCodeCheckFailedNotice from './pdf-code-check-failed-notice'
 import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
 import PdfLogEntry from './pdf-log-entry'
 import { usePdfPreviewContext } from '@/features/pdf-preview/components/pdf-preview-provider'
-import TimeoutUpgradePaywallPrompt from './timeout-upgrade-paywall-prompt'
 import getMeta from '@/utils/meta'
 
 function PdfLogsViewer({ alwaysVisible = false }: { alwaysVisible?: boolean }) {
   const {
     codeCheckFailed,
     error,
-    hasShortCompileTimeout,
     logEntries,
     rawLog,
     validationIssues,
     showLogs,
     stoppedOnFirstError,
-    isProjectOwner,
   } = useCompileContext()
 
   const { loadingError } = usePdfPreviewContext()
 
+  const { compileTimeout } = getMeta('ol-compileSettings')
+
   const { t } = useTranslation()
 
-  const [
-    isShowingPrimaryCompileTimeoutPaywall,
-    setIsShowingPrimaryCompileTimeoutPaywall,
-  ] = useState(false)
-  const isPaywallChangeCompileTimeoutEnabled = getMeta(
-    'ol-isPaywallChangeCompileTimeoutEnabled'
-  )
-
-  const isCompileTimeoutPaywallDisplay =
-    isProjectOwner && isPaywallChangeCompileTimeoutEnabled
-
   return (
     <div
       className={classnames('logs-pane', {
         hidden: !showLogs && !alwaysVisible && !loadingError,
       })}
+      data-testid="logs-pane"
     >
       <div className="logs-pane-content">
         {codeCheckFailed && <PdfCodeCheckFailedNotice />}
@@ -58,14 +47,8 @@ function PdfLogsViewer({ alwaysVisible = false }: { alwaysVisible?: boolean }) {
 
         {loadingError && <PdfPreviewError error="pdf-viewer-loading-error" />}
 
-        {hasShortCompileTimeout && error === 'timedout' ? (
-          isCompileTimeoutPaywallDisplay ? (
-            <TimeoutUpgradePaywallPrompt
-              setIsShowingPrimary={setIsShowingPrimaryCompileTimeoutPaywall}
-            />
-          ) : (
-            <TimeoutUpgradePromptNew />
-          )
+        {compileTimeout < 60 && error === 'timedout' ? (
+          <TimeoutUpgradePromptNew />
         ) : (
           <>{error && <PdfPreviewError error={error} />}</>
         )}
@@ -91,12 +74,10 @@ function PdfLogsViewer({ alwaysVisible = false }: { alwaysVisible?: boolean }) {
           />
         )}
 
-        {!isShowingPrimaryCompileTimeoutPaywall && (
-          <div className="logs-pane-actions">
-            <PdfClearCacheButton />
-            <PdfDownloadFilesButton />
-          </div>
-        )}
+        <div className="logs-pane-actions">
+          <PdfClearCacheButton />
+          <PdfDownloadFilesButton />
+        </div>
       </div>
     </div>
   )
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-page-number-control.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-page-number-control.tsx
index 80e2c8e66a..af35d538d8 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-page-number-control.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-page-number-control.tsx
@@ -57,6 +57,7 @@ function PdfPageNumberControl({
       <div className="pdfjs-page-number-input">
         <form onSubmit={handleSubmit}>
           <input
+            aria-label={t('page_current', { page })}
             inputMode="numeric"
             value={pageInputValue}
             onFocus={event => event.target.select()}
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-detached-root.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-detached-root.tsx
index e3dc967fb2..4cded9970e 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-detached-root.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-detached-root.tsx
@@ -1,4 +1,4 @@
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import PdfPreview from './pdf-preview'
 import useWaitForI18n from '../../../shared/hooks/use-wait-for-i18n'
 import { ReactContextRoot } from '@/features/ide-react/context/react-context-root'
@@ -21,5 +21,6 @@ export default PdfPreviewDetachedRoot // for testing
 
 const element = document.getElementById('pdf-preview-detached-root')
 if (element) {
-  ReactDOM.render(<PdfPreviewDetachedRoot />, element)
+  const root = createRoot(element)
+  root.render(<PdfPreviewDetachedRoot />)
 }
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-error.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-error.tsx
index 89387c232e..89726b411d 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-error.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-error.tsx
@@ -6,7 +6,15 @@ import { useDetachCompileContext as useCompileContext } from '../../../shared/co
 import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-error'
 import getMeta from '../../../utils/meta'
 
-function PdfPreviewError({ error }: { error: string }) {
+function PdfPreviewError({
+  error,
+  includeWarnings = true,
+  includeErrors = true,
+}: {
+  error: string
+  includeWarnings?: boolean
+  includeErrors?: boolean
+}) {
   const { t } = useTranslation()
 
   const { startCompile } = useCompileContext()
@@ -14,191 +22,217 @@ function PdfPreviewError({ error }: { error: string }) {
   switch (error) {
     case 'rendering-error-expected':
       return (
-        <PdfLogEntry
-          headerTitle={t('pdf_rendering_error')}
-          formattedContent={
-            <>
-              <Trans
-                i18nKey="something_went_wrong_rendering_pdf_expected"
-                components={[
-                  // eslint-disable-next-line react/jsx-key
-                  <OLButton
-                    variant="info"
-                    size="sm"
-                    onClick={() => startCompile()}
-                  />,
-                ]}
-              />
-              <br />
-              <br />
-              <Trans
-                i18nKey="last_resort_trouble_shooting_guide"
-                components={[
-                  // eslint-disable-next-line jsx-a11y/anchor-has-content
-                  <a
-                    href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
-                    target="_blank"
-                    key="troubleshooting-link"
-                  />,
-                ]}
-              />
-            </>
-          }
-          level="warning"
-        />
+        includeWarnings && (
+          <PdfLogEntry
+            headerTitle={t('pdf_rendering_error')}
+            formattedContent={
+              <>
+                <Trans
+                  i18nKey="something_went_wrong_rendering_pdf_expected"
+                  components={[
+                    // eslint-disable-next-line react/jsx-key
+                    <OLButton
+                      variant="primary"
+                      size="sm"
+                      onClick={() => startCompile()}
+                    />,
+                  ]}
+                />
+                <br />
+                <br />
+                <Trans
+                  i18nKey="last_resort_trouble_shooting_guide"
+                  components={[
+                    // eslint-disable-next-line jsx-a11y/anchor-has-content
+                    <a
+                      href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
+                      target="_blank"
+                      key="troubleshooting-link"
+                    />,
+                  ]}
+                />
+              </>
+            }
+            level="warning"
+          />
+        )
       )
 
     case 'rendering-error':
       return (
-        <ErrorLogEntry title={t('pdf_rendering_error')}>
-          {t('something_went_wrong_rendering_pdf')}
-          &nbsp;
-          <Trans
-            i18nKey="try_recompile_project_or_troubleshoot"
-            components={[
-              // eslint-disable-next-line jsx-a11y/anchor-has-content
-              <a
-                href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
-                target="_blank"
-                key="troubleshooting-link"
-              />,
-            ]}
-          />
-          {getMeta('ol-compilesUserContentDomain') && (
-            <>
-              <br />
-              <br />
-              <Trans
-                i18nKey="new_compile_domain_notice"
-                values={{
-                  compilesUserContentDomain: new URL(
-                    getMeta('ol-compilesUserContentDomain')
-                  ).hostname,
-                }}
-                shouldUnescape
-                tOptions={{ interpolation: { escapeValue: true } }}
-                components={[
-                  <code key="domain" />,
-                  /* eslint-disable-next-line jsx-a11y/anchor-has-content */
-                  <a
-                    href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
-                    target="_blank"
-                    key="troubleshooting-link"
-                  />,
-                ]}
-              />
-            </>
-          )}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('pdf_rendering_error')}>
+            {t('something_went_wrong_rendering_pdf')}
+            &nbsp;
+            <Trans
+              i18nKey="try_recompile_project_or_troubleshoot"
+              components={[
+                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                <a
+                  href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
+                  target="_blank"
+                  key="troubleshooting-link"
+                />,
+              ]}
+            />
+            {getMeta('ol-compilesUserContentDomain') && (
+              <>
+                <br />
+                <br />
+                <Trans
+                  i18nKey="new_compile_domain_notice"
+                  values={{
+                    compilesUserContentDomain: new URL(
+                      getMeta('ol-compilesUserContentDomain')
+                    ).hostname,
+                  }}
+                  shouldUnescape
+                  tOptions={{ interpolation: { escapeValue: true } }}
+                  components={[
+                    <code key="domain" />,
+                    /* eslint-disable-next-line jsx-a11y/anchor-has-content */
+                    <a
+                      href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
+                      target="_blank"
+                      key="troubleshooting-link"
+                    />,
+                  ]}
+                />
+              </>
+            )}
+          </ErrorLogEntry>
+        )
       )
 
     case 'clsi-maintenance':
       return (
-        <ErrorLogEntry title={t('server_error')}>
-          {t('clsi_maintenance')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('server_error')}>
+            {t('clsi_maintenance')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'clsi-unavailable':
       return (
-        <ErrorLogEntry title={t('server_error')}>
-          {t('clsi_unavailable')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('server_error')}>
+            {t('clsi_unavailable')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'too-recently-compiled':
       return (
-        <ErrorLogEntry title={t('server_error')}>
-          {t('too_recently_compiled')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('server_error')}>
+            {t('too_recently_compiled')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'terminated':
       return (
-        <ErrorLogEntry title={t('terminated')}>
-          {t('compile_terminated_by_user')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('terminated')}>
+            {t('compile_terminated_by_user')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'rate-limited':
       return (
-        <ErrorLogEntry title={t('pdf_compile_rate_limit_hit')}>
-          {t('project_flagged_too_many_compiles')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('pdf_compile_rate_limit_hit')}>
+            {t('project_flagged_too_many_compiles')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'compile-in-progress':
       return (
-        <ErrorLogEntry title={t('pdf_compile_in_progress_error')}>
-          {t('pdf_compile_try_again')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('pdf_compile_in_progress_error')}>
+            {t('pdf_compile_try_again')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'autocompile-disabled':
       return (
-        <ErrorLogEntry title={t('autocompile_disabled')}>
-          {t('autocompile_disabled_reason')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('autocompile_disabled')}>
+            {t('autocompile_disabled_reason')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'project-too-large':
       return (
-        <ErrorLogEntry title={t('project_too_large')}>
-          {t('project_too_much_editable_text')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('project_too_large')}>
+            {t('project_too_much_editable_text')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'timedout':
-      return <TimedOutLogEntry />
+      return includeErrors && <TimedOutLogEntry />
 
     case 'failure':
       return (
-        <ErrorLogEntry title={t('no_pdf_error_title')}>
-          {t('no_pdf_error_explanation')}
+        includeErrors && (
+          <ErrorLogEntry title={t('no_pdf_error_title')}>
+            {t('no_pdf_error_explanation')}
 
-          <ul className="my-1 ps-3">
-            <li>{t('no_pdf_error_reason_unrecoverable_error')}</li>
-            <li>
-              <Trans
-                i18nKey="no_pdf_error_reason_no_content"
-                components={{ code: <code /> }}
-              />
-            </li>
-            <li>
-              <Trans
-                i18nKey="no_pdf_error_reason_output_pdf_already_exists"
-                components={{ code: <code /> }}
-              />
-            </li>
-          </ul>
-        </ErrorLogEntry>
+            <ul className="my-1 ps-3">
+              <li>{t('no_pdf_error_reason_unrecoverable_error')}</li>
+              <li>
+                <Trans
+                  i18nKey="no_pdf_error_reason_no_content"
+                  components={{ code: <code /> }}
+                />
+              </li>
+              <li>
+                <Trans
+                  i18nKey="no_pdf_error_reason_output_pdf_already_exists"
+                  components={{ code: <code /> }}
+                />
+              </li>
+            </ul>
+          </ErrorLogEntry>
+        )
       )
 
     case 'clear-cache':
       return (
-        <ErrorLogEntry title={t('server_error')}>
-          {t('somthing_went_wrong_compiling')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('server_error')}>
+            {t('somthing_went_wrong_compiling')}
+          </ErrorLogEntry>
+        )
       )
 
     case 'pdf-viewer-loading-error':
       return (
-        <ErrorLogEntry title={t('pdf_rendering_error')}>
-          <Trans
-            i18nKey="something_went_wrong_loading_pdf_viewer"
-            components={[
-              <strong key="strong-" />,
-              // eslint-disable-next-line jsx-a11y/anchor-has-content
-              <a
-                href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
-                target="_blank"
-                key="troubleshooting-link"
-              />,
-              // eslint-disable-next-line jsx-a11y/anchor-has-content
-              <a key="contact-link" target="_blank" href="/contact" />,
-            ]}
-          />
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('pdf_rendering_error')}>
+            <Trans
+              i18nKey="something_went_wrong_loading_pdf_viewer"
+              components={[
+                <strong key="strong-" />,
+                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                <a
+                  href="/learn/how-to/Resolving_access%2C_loading%2C_and_display_problems"
+                  target="_blank"
+                  key="troubleshooting-link"
+                />,
+                // eslint-disable-next-line jsx-a11y/anchor-has-content
+                <a key="contact-link" target="_blank" href="/contact" />,
+              ]}
+            />
+          </ErrorLogEntry>
+        )
       )
 
     case 'validation-problems':
@@ -207,9 +241,11 @@ function PdfPreviewError({ error }: { error: string }) {
     case 'error':
     default:
       return (
-        <ErrorLogEntry title={t('server_error')}>
-          {t('somthing_went_wrong_compiling')}
-        </ErrorLogEntry>
+        includeErrors && (
+          <ErrorLogEntry title={t('server_error')}>
+            {t('somthing_went_wrong_compiling')}
+          </ErrorLogEntry>
+        )
       )
   }
 }
@@ -281,7 +317,7 @@ function TimedOutLogEntry() {
                 components={[
                   // eslint-disable-next-line react/jsx-key
                   <OLButton
-                    variant="info"
+                    variant="primary"
                     size="sm"
                     onClick={handleEnableStopOnFirstErrorClick}
                   />,
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-hybrid-toolbar.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-hybrid-toolbar.tsx
index 4a000e9a41..b5b9c8609c 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-hybrid-toolbar.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-hybrid-toolbar.tsx
@@ -9,7 +9,7 @@ import PdfHybridDownloadButton from './pdf-hybrid-download-button'
 import PdfHybridCodeCheckButton from './pdf-hybrid-code-check-button'
 import PdfOrphanRefreshButton from './pdf-orphan-refresh-button'
 import { DetachedSynctexControl } from './detach-synctex-control'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 
 const ORPHAN_UI_TIMEOUT_MS = 5000
 
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-messages.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-messages.tsx
index 80acf7f079..8caf805b8d 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-messages.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-messages.tsx
@@ -1,5 +1,7 @@
 import { FC } from 'react'
 
-export const PdfPreviewMessages: FC = ({ children }) => {
+export const PdfPreviewMessages: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   return <div className="pdf-preview-messages">{children}</div>
 }
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-pane.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-pane.tsx
index 8133ff31ee..82f2946d63 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-pane.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-pane.tsx
@@ -1,4 +1,4 @@
-import { memo, Suspense } from 'react'
+import { ElementType, memo, Suspense } from 'react'
 import classNames from 'classnames'
 import PdfLogsViewer from './pdf-logs-viewer'
 import PdfViewer from './pdf-viewer'
@@ -11,13 +11,21 @@ import { PdfPreviewProvider } from './pdf-preview-provider'
 import PdfPreviewHybridToolbarNew from '@/features/ide-redesign/components/pdf-preview/pdf-preview-hybrid-toolbar'
 import PdfErrorState from '@/features/ide-redesign/components/pdf-preview/pdf-error-state'
 import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
+import PdfCodeCheckFailedBanner from '@/features/ide-redesign/components/pdf-preview/pdf-code-check-failed-banner'
+import getMeta from '@/utils/meta'
 
 function PdfPreviewPane() {
-  const { pdfUrl, hasShortCompileTimeout } = useCompileContext()
+  const { pdfUrl } = useCompileContext()
+  const { compileTimeout } = getMeta('ol-compileSettings')
   const classes = classNames('pdf', 'full-size', {
     'pdf-empty': !pdfUrl,
   })
   const newEditor = useIsNewEditorEnabled()
+  const pdfPromotions = importOverleafModules('pdfPreviewPromotions') as {
+    import: { default: ElementType }
+    path: string
+  }[]
 
   return (
     <div className={classes}>
@@ -27,15 +35,19 @@ function PdfPreviewPane() {
         ) : (
           <PdfHybridPreviewToolbar />
         )}
+        {newEditor && <PdfCodeCheckFailedBanner />}
         <PdfPreviewMessages>
-          {hasShortCompileTimeout && <CompileTimeWarningUpgradePrompt />}
+          {compileTimeout < 60 && <CompileTimeWarningUpgradePrompt />}
         </PdfPreviewMessages>
         <Suspense fallback={<FullSizeLoadingSpinner delay={500} />}>
-          <div className="pdf-viewer">
+          <div className="pdf-viewer" data-testid="pdf-viewer">
             <PdfViewer />
           </div>
         </Suspense>
         {newEditor ? <PdfErrorState /> : <PdfLogsViewer />}
+        {pdfPromotions.map(({ import: { default: Component }, path }) => (
+          <Component key={path} />
+        ))}
       </PdfPreviewProvider>
     </div>
   )
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-provider.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-provider.tsx
index 38d5bb79bc..46c20b24d6 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview-provider.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview-provider.tsx
@@ -12,13 +12,15 @@ export const usePdfPreviewContext = () => {
   const context = useContext(PdfPreviewContext)
   if (!context) {
     throw new Error(
-      'usePdfPreviewContext is only avalable inside PdfPreviewProvider'
+      'usePdfPreviewContext is only available inside PdfPreviewProvider'
     )
   }
   return context
 }
 
-export const PdfPreviewProvider: FC = ({ children }) => {
+export const PdfPreviewProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [loadingError, setLoadingError] = useState(false)
 
   const value = useMemo(
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-preview.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-preview.tsx
index b0e692e201..e7757e99cd 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-preview.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-preview.tsx
@@ -3,10 +3,16 @@ import { memo } from 'react'
 import withErrorBoundary from '../../../infrastructure/error-boundary'
 import PdfPreviewErrorBoundaryFallback from './pdf-preview-error-boundary-fallback'
 import { useLayoutContext } from '../../../shared/context/layout-context'
+import { VisualPreview } from './visual-preview'
+import { useEditorViewContext } from '@/features/ide-react/context/editor-view-context'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
 
 function PdfPreview() {
   const { detachRole } = useLayoutContext()
+  const { view } = useEditorViewContext()
+  const visualPreviewEnabled = useFeatureFlag('visual-preview')
   if (detachRole === 'detacher') return null
+  if (visualPreviewEnabled && view) return <VisualPreview view={view} />
   return <PdfPreviewPane />
 }
 
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-synctex-controls.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-synctex-controls.tsx
index 5373d0975a..aee9a12549 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-synctex-controls.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-synctex-controls.tsx
@@ -1,31 +1,16 @@
 import classNames from 'classnames'
-import { memo, useCallback, useEffect, useState, useRef, useMemo } from 'react'
-import { useProjectContext } from '../../../shared/context/project-context'
-import { getJSON } from '../../../infrastructure/fetch-json'
+import { memo, useCallback, useMemo } from 'react'
 import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
 import { useLayoutContext } from '../../../shared/context/layout-context'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
 import { useTranslation } from 'react-i18next'
-import useIsMounted from '../../../shared/hooks/use-is-mounted'
-import useAbortController from '../../../shared/hooks/use-abort-controller'
-import useDetachState from '../../../shared/hooks/use-detach-state'
-import useDetachAction from '../../../shared/hooks/use-detach-action'
-import localStorage from '../../../infrastructure/local-storage'
-import { useFileTreeData } from '../../../shared/context/file-tree-data-context'
-import useScopeEventListener from '../../../shared/hooks/use-scope-event-listener'
 import * as eventTracking from '../../../infrastructure/event-tracking'
-import { debugConsole } from '@/utils/debugging'
-import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import MaterialIcon from '@/shared/components/material-icon'
-import { Spinner } from 'react-bootstrap-5'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import useEventListener from '@/shared/hooks/use-event-listener'
-import { CursorPosition } from '@/features/ide-react/types/cursor-position'
-import { isValidTeXFile } from '@/main/is-valid-tex-file'
-import { PdfScrollPosition } from '@/shared/hooks/use-pdf-scroll-position'
-import { Placement } from 'react-bootstrap-5/types'
+import { Spinner } from 'react-bootstrap'
+import { Placement } from 'react-bootstrap/types'
+import useSynctex from '../hooks/use-synctex'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
 
 const GoToCodeButton = memo(function GoToCodeButton({
   syncToCode,
@@ -73,17 +58,19 @@ const GoToCodeButton = memo(function GoToCodeButton({
       description={t('go_to_pdf_location_in_code')}
       overlayProps={overlayProps}
     >
-      <OLButton
-        variant="secondary"
-        size="sm"
-        onClick={syncToCodeWithButton}
-        disabled={syncToCodeInFlight}
-        className={buttonClasses}
-        aria-label={t('go_to_pdf_location_in_code')}
-      >
-        {buttonIcon}
-        {isDetachLayout ? <span>&nbsp;{t('show_in_code')}</span> : ''}
-      </OLButton>
+      <span>
+        <OLButton
+          variant="secondary"
+          size="sm"
+          onClick={syncToCodeWithButton}
+          disabled={syncToCodeInFlight}
+          className={buttonClasses}
+          aria-label={t('go_to_pdf_location_in_code')}
+        >
+          {buttonIcon}
+          {isDetachLayout ? <span>&nbsp;{t('show_in_code')}</span> : ''}
+        </OLButton>
+      </span>
     </OLTooltip>
   )
 })
@@ -122,283 +109,38 @@ const GoToPdfButton = memo(function GoToPdfButton({
       description={t('go_to_code_location_in_pdf')}
       overlayProps={{ placement: tooltipPlacement }}
     >
-      <OLButton
-        variant="secondary"
-        size="sm"
-        onClick={syncToPdf}
-        disabled={syncToPdfInFlight || !canSyncToPdf}
-        className={buttonClasses}
-        aria-label={t('go_to_code_location_in_pdf')}
-      >
-        {buttonIcon}
-        {isDetachLayout ? <span>&nbsp;{t('show_in_pdf')}</span> : ''}
-      </OLButton>
+      <span>
+        <OLButton
+          variant="secondary"
+          size="sm"
+          onClick={syncToPdf}
+          disabled={syncToPdfInFlight || !canSyncToPdf}
+          className={buttonClasses}
+          aria-label={t('go_to_code_location_in_pdf')}
+        >
+          {buttonIcon}
+          {isDetachLayout ? <span>&nbsp;{t('show_in_pdf')}</span> : ''}
+        </OLButton>
+      </span>
     </OLTooltip>
   )
 })
 
 function PdfSynctexControls() {
-  const { _id: projectId, rootDocId } = useProjectContext()
-
   const { detachRole } = useLayoutContext()
-
+  const { pdfUrl, pdfViewer, position } = useCompileContext()
   const {
-    clsiServerId,
-    pdfUrl,
-    pdfViewer,
-    position,
-    setShowLogs,
-    setHighlights,
-  } = useCompileContext()
+    syncToCode,
+    syncToPdf,
+    syncToCodeInFlight,
+    syncToPdfInFlight,
+    canSyncToPdf,
+  } = useSynctex()
+  const visualPreviewEnabled = useFeatureFlag('visual-preview')
 
-  const { selectedEntities } = useFileTreeData()
-  const { findEntityByPath, dirname, pathInFolder } = useFileTreePathContext()
-  const { getCurrentDocumentId, openDocWithId, openDocName } =
-    useEditorManagerContext()
-
-  const [cursorPosition, setCursorPosition] = useState<CursorPosition | null>(
-    () => {
-      const position = localStorage.getItem(
-        `doc.position.${getCurrentDocumentId()}`
-      )
-      return position ? position.cursorPosition : null
-    }
-  )
-
-  const isMounted = useIsMounted()
-
-  const { signal } = useAbortController()
-
-  useEventListener(
-    'cursor:editor:update',
-    useCallback(event => setCursorPosition(event.detail), [])
-  )
-
-  const [syncToPdfInFlight, setSyncToPdfInFlight] = useState(false)
-  const [syncToCodeInFlight, setSyncToCodeInFlight] = useDetachState(
-    'sync-to-code-inflight',
-    false,
-    'detacher',
-    'detached'
-  )
-
-  const [, setSynctexError] = useScopeValue('sync_tex_error')
-
-  const getCurrentFilePath = useCallback(() => {
-    const docId = getCurrentDocumentId()
-
-    if (!docId || !rootDocId) {
-      return null
-    }
-
-    let path = pathInFolder(docId)
-
-    if (!path) {
-      return null
-    }
-
-    // If the root file is folder/main.tex, then synctex sees the path as folder/./main.tex
-    const rootDocDirname = dirname(rootDocId)
-
-    if (rootDocDirname) {
-      path = path.replace(RegExp(`^${rootDocDirname}`), `${rootDocDirname}/.`)
-    }
-
-    return path
-  }, [dirname, getCurrentDocumentId, pathInFolder, rootDocId])
-
-  const goToCodeLine = useCallback(
-    (file, line) => {
-      if (file) {
-        const doc = findEntityByPath(file)?.entity
-        if (!doc) {
-          debugConsole.warn(`Document with path ${file} not found`)
-          return
-        }
-
-        openDocWithId(doc._id, {
-          gotoLine: line,
-        })
-      } else {
-        setSynctexError(true)
-
-        window.setTimeout(() => {
-          if (isMounted.current) {
-            setSynctexError(false)
-          }
-        }, 4000)
-      }
-    },
-    [findEntityByPath, openDocWithId, isMounted, setSynctexError]
-  )
-
-  const goToPdfLocation = useCallback(
-    params => {
-      setSyncToPdfInFlight(true)
-
-      if (clsiServerId) {
-        params += `&clsiserverid=${clsiServerId}`
-      }
-
-      getJSON(`/project/${projectId}/sync/code?${params}`, { signal })
-        .then(data => {
-          setShowLogs(false)
-          setHighlights(data.pdf)
-        })
-        .catch(debugConsole.error)
-        .finally(() => {
-          if (isMounted.current) {
-            setSyncToPdfInFlight(false)
-          }
-        })
-    },
-    [
-      clsiServerId,
-      isMounted,
-      projectId,
-      setShowLogs,
-      setHighlights,
-      setSyncToPdfInFlight,
-      signal,
-    ]
-  )
-
-  const cursorPositionRef = useRef(cursorPosition)
-
-  useEffect(() => {
-    cursorPositionRef.current = cursorPosition
-  }, [cursorPosition])
-
-  const syncToPdf = useCallback(() => {
-    const file = getCurrentFilePath()
-
-    if (cursorPositionRef.current) {
-      const { row, column } = cursorPositionRef.current
-
-      const params = new URLSearchParams({
-        file: file ?? '',
-        line: String(row + 1),
-        column: String(column),
-      }).toString()
-
-      eventTracking.sendMB('jump-to-location', {
-        direction: 'code-location-in-pdf',
-        method: 'arrow',
-      })
-
-      goToPdfLocation(params)
-    }
-  }, [getCurrentFilePath, goToPdfLocation])
-
-  useScopeEventListener(
-    'cursor:editor:syncToPdf',
-    useCallback(() => {
-      syncToPdf()
-    }, [syncToPdf])
-  )
-
-  const positionRef = useRef(position)
-  useEffect(() => {
-    positionRef.current = position
-  }, [position])
-
-  const _syncToCode = useCallback(
-    ({
-      position = positionRef.current,
-      visualOffset = 0,
-    }: {
-      position?: PdfScrollPosition
-      visualOffset?: number
-    }) => {
-      if (!position) {
-        return
-      }
-
-      setSyncToCodeInFlight(true)
-      // FIXME: this actually works better if it's halfway across the
-      // page (or the visible part of the page). Synctex doesn't
-      // always find the right place in the file when the point is at
-      // the edge of the page, it sometimes returns the start of the
-      // next paragraph instead.
-      const h = position.offset.left
-
-      // Compute the vertical position to pass to synctex, which
-      // works with coordinates increasing from the top of the page
-      // down.  This matches the browser's DOM coordinate of the
-      // click point, but the pdf position is measured from the
-      // bottom of the page so we need to invert it.
-      let v = 0
-      if (position.pageSize?.height) {
-        v += position.pageSize.height - position.offset.top // measure from pdf point (inverted)
-      } else {
-        v += position.offset.top // measure from html click position
-      }
-      v += visualOffset
-
-      const params = new URLSearchParams({
-        page: position.page + 1,
-        h: h.toFixed(2),
-        v: v.toFixed(2),
-      })
-
-      if (clsiServerId) {
-        params.set('clsiserverid', clsiServerId)
-      }
-
-      getJSON(`/project/${projectId}/sync/pdf?${params}`, { signal })
-        .then(data => {
-          const [{ file, line }] = data.code
-          goToCodeLine(file, line)
-        })
-        .catch(debugConsole.error)
-        .finally(() => {
-          if (isMounted.current) {
-            setSyncToCodeInFlight(false)
-          }
-        })
-    },
-    [
-      clsiServerId,
-      projectId,
-      signal,
-      isMounted,
-      setSyncToCodeInFlight,
-      goToCodeLine,
-    ]
-  )
-
-  const syncToCode = useDetachAction(
-    'sync-to-code',
-    _syncToCode,
-    'detached',
-    'detacher'
-  )
-
-  useEventListener(
-    'synctex:sync-to-position',
-    useCallback(event => syncToCode({ position: event.detail }), [syncToCode])
-  )
-
-  const [hasSingleSelectedDoc, setHasSingleSelectedDoc] = useDetachState(
-    'has-single-selected-doc',
-    false,
-    'detacher',
-    'detached'
-  )
-
-  useEffect(() => {
-    if (selectedEntities.length !== 1) {
-      setHasSingleSelectedDoc(false)
-      return
-    }
-
-    if (selectedEntities[0].type !== 'doc') {
-      setHasSingleSelectedDoc(false)
-      return
-    }
-
-    setHasSingleSelectedDoc(true)
-  }, [selectedEntities, setHasSingleSelectedDoc])
+  if (visualPreviewEnabled) {
+    return null
+  }
 
   if (!position) {
     return null
@@ -408,12 +150,6 @@ function PdfSynctexControls() {
     return null
   }
 
-  const canSyncToPdf: boolean =
-    hasSingleSelectedDoc &&
-    cursorPosition &&
-    openDocName &&
-    isValidTeXFile(openDocName)
-
   if (detachRole === 'detacher') {
     return (
       <GoToPdfButton
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-viewer-controls-toolbar.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-viewer-controls-toolbar.tsx
index 0b44ef5b5d..fed34bf3ee 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-viewer-controls-toolbar.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-viewer-controls-toolbar.tsx
@@ -6,6 +6,9 @@ import PdfZoomDropdown from './pdf-zoom-dropdown'
 import { useResizeObserver } from '@/shared/hooks/use-resize-observer'
 import PdfViewerControlsMenuButton from './pdf-viewer-controls-menu-button'
 import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
+import { useCommandProvider } from '@/features/ide-react/hooks/use-command-provider'
+import { useTranslation } from 'react-i18next'
+import { useLayoutContext } from '@/shared/context/layout-context'
 
 type PdfViewerControlsToolbarProps = {
   requestPresentationMode: () => void
@@ -26,6 +29,7 @@ function PdfViewerControlsToolbar({
   totalPages,
   pdfContainer,
 }: PdfViewerControlsToolbarProps) {
+  const { t } = useTranslation()
   const { showLogs } = useCompileContext()
 
   const toolbarControlsElement = document.querySelector('#toolbar-pdf-controls')
@@ -33,14 +37,51 @@ function PdfViewerControlsToolbar({
   const [availableWidth, setAvailableWidth] = useState<number>(1000)
 
   const handleResize = useCallback(
-    element => {
-      setAvailableWidth(element.offsetWidth)
+    (element: Element) => {
+      setAvailableWidth((element as HTMLElement).offsetWidth)
     },
     [setAvailableWidth]
   )
 
   const { elementRef: pdfControlsRef } = useResizeObserver(handleResize)
 
+  const { view: ideView, pdfLayout } = useLayoutContext()
+  const editorOnly = ideView !== 'pdf' && pdfLayout === 'flat'
+
+  useCommandProvider(() => {
+    if (editorOnly) {
+      return
+    }
+
+    return [
+      {
+        id: 'view-pdf-presentation-mode',
+        label: t('presentation_mode'),
+        handler: requestPresentationMode,
+      },
+      {
+        id: 'view-pdf-zoom-in',
+        label: t('zoom_in'),
+        handler: () => setZoom('zoom-in'),
+      },
+      {
+        id: 'view-pdf-zoom-out',
+        label: t('zoom_out'),
+        handler: () => setZoom('zoom-out'),
+      },
+      {
+        id: 'view-pdf-fit-width',
+        label: t('fit_to_width'),
+        handler: () => setZoom('page-width'),
+      },
+      {
+        id: 'view-pdf-fit-height',
+        label: t('fit_to_height'),
+        handler: () => setZoom('page-height'),
+      },
+    ]
+  }, [t, requestPresentationMode, setZoom, editorOnly])
+
   if (!toolbarControlsElement) {
     return null
   }
diff --git a/services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx b/services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx
index 75d0663c80..d0dc2cdbaa 100644
--- a/services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/pdf-zoom-dropdown.tsx
@@ -172,7 +172,7 @@ function PdfZoomDropdown({
 
 function Shortcut({ keys }: { keys: string[] }) {
   return (
-    <span className="pull-right">
+    <span className="float-end">
       {keys.map((key, idx) => (
         <span
           className={classNames({
diff --git a/services/web/frontend/js/features/pdf-preview/components/stop-on-first-error-prompt.tsx b/services/web/frontend/js/features/pdf-preview/components/stop-on-first-error-prompt.tsx
index a693d57e70..d6b7aae433 100644
--- a/services/web/frontend/js/features/pdf-preview/components/stop-on-first-error-prompt.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/stop-on-first-error-prompt.tsx
@@ -28,7 +28,11 @@ export default function StopOnFirstErrorPrompt() {
             // eslint-disable-next-line react/jsx-key
             components={[<strong />]}
           />{' '}
-          <OLButton variant="info" size="sm" onClick={handleDisableButtonClick}>
+          <OLButton
+            variant="primary"
+            size="sm"
+            onClick={handleDisableButtonClick}
+          >
             {t('disable_stop_on_first_error')}
           </OLButton>
         </>
diff --git a/services/web/frontend/js/features/pdf-preview/components/switch-to-editor-button.tsx b/services/web/frontend/js/features/pdf-preview/components/switch-to-editor-button.tsx
index 4b94825e04..b7410de7b1 100644
--- a/services/web/frontend/js/features/pdf-preview/components/switch-to-editor-button.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/switch-to-editor-button.tsx
@@ -4,7 +4,7 @@ import OLButton from '@/features/ui/components/ol/ol-button'
 import { useLayoutContext } from '../../../shared/context/layout-context'
 
 function SwitchToEditorButton() {
-  const { pdfLayout, setView, detachRole } = useLayoutContext()
+  const { pdfLayout, restoreView, detachRole } = useLayoutContext()
 
   const { t } = useTranslation()
 
@@ -17,7 +17,7 @@ function SwitchToEditorButton() {
   }
 
   function handleClick() {
-    setView('editor')
+    restoreView()
     window.setTimeout(() => {
       window.dispatchEvent(new Event('editor:focus'))
     })
diff --git a/services/web/frontend/js/features/pdf-preview/components/synctex-toasts.tsx b/services/web/frontend/js/features/pdf-preview/components/synctex-toasts.tsx
new file mode 100644
index 0000000000..62806b85e9
--- /dev/null
+++ b/services/web/frontend/js/features/pdf-preview/components/synctex-toasts.tsx
@@ -0,0 +1,47 @@
+import { GlobalToastGeneratorEntry } from '@/features/ide-react/components/global-toasts'
+import { useTranslation } from 'react-i18next'
+import OLButton from '@/features/ui/components/ol/ol-button'
+
+export const SynctexFileErrorToast = () => {
+  const { t } = useTranslation()
+
+  return (
+    <div className="synctex-error-toast-content">
+      <span>{t('synctex_failed')}</span>
+
+      <OLButton
+        href="/learn/how-to/SyncTeX_Errors"
+        target="_blank"
+        variant="secondary"
+        size="sm"
+      >
+        {t('more_info')}
+      </OLButton>
+    </div>
+  )
+}
+
+const generators: GlobalToastGeneratorEntry[] = [
+  {
+    key: 'synctex:file-error',
+    generator: () => ({
+      content: <SynctexFileErrorToast />,
+      type: 'warning',
+      autoHide: true,
+      delay: 4000,
+      isDismissible: true,
+    }),
+  },
+]
+
+export default generators
+
+export const showFileErrorToast = () => {
+  window.dispatchEvent(
+    new CustomEvent('ide:show-toast', {
+      detail: {
+        key: 'synctex:file-error',
+      },
+    })
+  )
+}
diff --git a/services/web/frontend/js/features/pdf-preview/components/timeout-message-after-paywall-dismissal.tsx b/services/web/frontend/js/features/pdf-preview/components/timeout-message-after-paywall-dismissal.tsx
deleted file mode 100644
index db6140085f..0000000000
--- a/services/web/frontend/js/features/pdf-preview/components/timeout-message-after-paywall-dismissal.tsx
+++ /dev/null
@@ -1,197 +0,0 @@
-import getMeta from '@/utils/meta'
-import { Trans, useTranslation } from 'react-i18next'
-import { memo, useCallback, useEffect } from 'react'
-import { useDetachCompileContext } from '@/shared/context/detach-compile-context'
-import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
-import MaterialIcon from '@/shared/components/material-icon'
-import { useStopOnFirstError } from '@/shared/hooks/use-stop-on-first-error'
-import * as eventTracking from '@/infrastructure/event-tracking'
-import PdfLogEntry from './pdf-log-entry'
-
-function TimeoutMessageAfterPaywallDismissal() {
-  const {
-    startCompile,
-    lastCompileOptions,
-    setAnimateCompileDropdownArrow,
-    isProjectOwner,
-  } = useDetachCompileContext()
-
-  const { enableStopOnFirstError } = useStopOnFirstError({
-    eventSource: 'timeout-new',
-  })
-
-  const handleEnableStopOnFirstErrorClick = useCallback(() => {
-    enableStopOnFirstError()
-    startCompile({ stopOnFirstError: true })
-    setAnimateCompileDropdownArrow(true)
-  }, [enableStopOnFirstError, startCompile, setAnimateCompileDropdownArrow])
-
-  return (
-    <div className="website-redesign timeout-upgrade-paywall-prompt">
-      <CompileTimeout isProjectOwner={isProjectOwner} />
-      {getMeta('ol-ExposedSettings').enableSubscriptions && (
-        <PreventTimeoutHelpMessage
-          handleEnableStopOnFirstErrorClick={handleEnableStopOnFirstErrorClick}
-          lastCompileOptions={lastCompileOptions}
-          isProjectOwner={isProjectOwner}
-        />
-      )}
-    </div>
-  )
-}
-
-type CompileTimeoutProps = {
-  isProjectOwner: boolean
-}
-
-const CompileTimeout = memo(function CompileTimeout({
-  isProjectOwner,
-}: CompileTimeoutProps) {
-  const { t } = useTranslation()
-
-  useEffect(() => {
-    eventTracking.sendMB('paywall-prompt', {
-      'paywall-type': 'compile-timeout',
-      'paywall-version': 'secondary',
-    })
-  }, [])
-
-  function onPaywallClick() {
-    eventTracking.sendMB('paywall-click', {
-      'paywall-type': 'compile-timeout',
-      'paywall-version': 'secondary',
-    })
-  }
-
-  return (
-    <PdfLogEntry
-      headerTitle={t('project_failed_to_compile')}
-      headerIcon={
-        <MaterialIcon
-          type="error"
-          className="log-entry-header-title"
-          size="2x"
-          unfilled
-        />
-      }
-      formattedContent={
-        getMeta('ol-ExposedSettings').enableSubscriptions && (
-          <>
-            <p className="compile-timeout-message">
-              {isProjectOwner ? (
-                <div>
-                  <p>{t('your_project_need_more_time_to_compile')}</p>
-                  <p>{t('upgrade_to_unlock_more_time')}</p>
-                </div>
-              ) : (
-                <div>
-                  <p>{t('this_project_need_more_time_to_compile')}</p>
-                  <p>{t('upgrade_to_unlock_more_time')}</p>
-                </div>
-              )}
-            </p>
-
-            {isProjectOwner === false && (
-              <Trans
-                i18nKey="tell_the_project_owner_and_ask_them_to_upgrade"
-                components={[
-                  // eslint-disable-next-line react/jsx-key
-                  <strong />,
-                ]}
-              />
-            )}
-
-            {isProjectOwner && (
-              <div className="log-entry-cta-container">
-                <StartFreeTrialButton
-                  source="compile-timeout"
-                  buttonProps={{ variant: 'secondary' }}
-                  handleClick={onPaywallClick}
-                >
-                  {t('try_for_free')}
-                </StartFreeTrialButton>
-              </div>
-            )}
-          </>
-        )
-      }
-      // @ts-ignore
-      entryAriaLabel={t('your_compile_timed_out')}
-      level="error"
-    />
-  )
-})
-
-type PreventTimeoutHelpMessageProps = {
-  lastCompileOptions: any
-  handleEnableStopOnFirstErrorClick: () => void
-  isProjectOwner: boolean
-}
-
-const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
-  lastCompileOptions,
-  handleEnableStopOnFirstErrorClick,
-  isProjectOwner,
-}: PreventTimeoutHelpMessageProps) {
-  const { t } = useTranslation()
-
-  return (
-    <PdfLogEntry
-      headerTitle={t('other_causes_of_compile_timeouts')}
-      formattedContent={
-        <>
-          <ul>
-            <li>
-              {t('large_or_high_resolution_images_taking_too_long_to_process')}
-            </li>
-            <li>
-              <Trans
-                i18nKey="a_fatal_compile_error_that_completely_blocks_compilation"
-                components={[
-                  // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
-                  <a
-                    href="/learn/how-to/Fixing_and_preventing_compile_timeouts#Step_3:_Assess_your_project_for_time-consuming_tasks_and_fatal_errors"
-                    rel="noopener noreferrer"
-                    target="_blank"
-                  />,
-                ]}
-              />
-              {!lastCompileOptions.stopOnFirstError && (
-                <>
-                  {' '}
-                  <Trans
-                    i18nKey="enable_stop_on_first_error_under_recompile_dropdown_menu_v2"
-                    components={[
-                      // eslint-disable-next-line react/jsx-key
-                      <strong className="log-bold-text" />,
-                      // eslint-disable-next-line react/jsx-key
-                      <strong className="log-bold-text" />,
-                    ]}
-                  />{' '}
-                </>
-              )}
-            </li>
-          </ul>
-          <p className="mb-0">
-            <Trans
-              i18nKey="learn_more_about_compile_timeouts"
-              components={[
-                // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
-                <a
-                  href="/learn/how-to/Fixing_and_preventing_compile_timeouts"
-                  rel="noopener noreferrer"
-                  target="_blank"
-                />,
-              ]}
-            />
-          </p>
-        </>
-      }
-      // @ts-ignore
-      entryAriaLabel={t('reasons_for_compile_timeouts')}
-      level="raw"
-    />
-  )
-})
-
-export default memo(TimeoutMessageAfterPaywallDismissal)
diff --git a/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-paywall-prompt.tsx b/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-paywall-prompt.tsx
deleted file mode 100644
index b156890232..0000000000
--- a/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-paywall-prompt.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import { Dispatch, SetStateAction, useEffect, useMemo, useState } from 'react'
-import getMeta from '@/utils/meta'
-import * as eventTracking from '@/infrastructure/event-tracking'
-import TimeoutMessageAfterPaywallDismissal from './timeout-message-after-paywall-dismissal'
-import { UpgradePrompt } from '@/shared/components/upgrade-prompt'
-
-const studentRoles = [
-  'High-school student',
-  'Undergraduate student',
-  "Master's student (e.g. MSc, MA)",
-  'Doctoral student (e.g. PhD, MD, EngD)',
-]
-
-type Segmentation = Record<
-  string,
-  string | number | boolean | undefined | unknown | any
->
-
-interface TimeoutUpgradePaywallPromptProps {
-  setIsShowingPrimary: Dispatch<SetStateAction<boolean>>
-}
-
-function TimeoutUpgradePaywallPrompt({
-  setIsShowingPrimary,
-}: TimeoutUpgradePaywallPromptProps) {
-  const odcRole = getMeta('ol-odcRole')
-  const planPrices = getMeta('ol-paywallPlans')
-  const isStudent = useMemo(() => studentRoles.includes(odcRole), [odcRole])
-
-  const [isPaywallDismissed, setIsPaywallDismissed] = useState<boolean>(false)
-
-  function sendPaywallEvent(event: string, segmentation?: Segmentation) {
-    eventTracking.sendMB(event, {
-      'paywall-type': 'compile-timeout',
-      'paywall-version': 'primary',
-      ...segmentation,
-    })
-  }
-
-  function onClose() {
-    sendPaywallEvent('paywall-dismiss')
-    setIsPaywallDismissed(true)
-    setIsShowingPrimary(false)
-  }
-
-  function onClickInfoLink() {
-    sendPaywallEvent('paywall-info-click', { content: 'plans' })
-  }
-
-  function onClickPaywall() {
-    sendPaywallEvent('paywall-click', {
-      plan: isStudent ? 'student' : 'collaborator',
-    })
-  }
-
-  useEffect(() => {
-    sendPaywallEvent('paywall-prompt', {
-      plan: isStudent ? 'student' : 'collaborator',
-    })
-    setIsShowingPrimary(true)
-  }, [isStudent, setIsShowingPrimary])
-
-  return (
-    <div>
-      {!isPaywallDismissed ? (
-        <UpgradePrompt
-          title="Unlock more compile time"
-          summary="Your project took too long to compile and timed out."
-          onClose={onClose}
-          planPricing={{
-            student: planPrices?.student,
-            standard: planPrices?.collaborator,
-          }}
-          itmCampaign="compile-timeout"
-          isStudent={isStudent}
-          onClickInfoLink={onClickInfoLink}
-          onClickPaywall={onClickPaywall}
-        />
-      ) : (
-        <TimeoutMessageAfterPaywallDismissal />
-      )}
-    </div>
-  )
-}
-
-export default TimeoutUpgradePaywallPrompt
diff --git a/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-prompt-new.tsx b/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-prompt-new.tsx
index 58613c785c..1c4a7089da 100644
--- a/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-prompt-new.tsx
+++ b/services/web/frontend/js/features/pdf-preview/components/timeout-upgrade-prompt-new.tsx
@@ -1,7 +1,7 @@
 import { Trans, useTranslation } from 'react-i18next'
 import { useDetachCompileContext } from '../../../shared/context/detach-compile-context'
 import StartFreeTrialButton from '../../../shared/components/start-free-trial-button'
-import { memo, useCallback } from 'react'
+import { memo, useCallback, useMemo } from 'react'
 import PdfLogEntry from './pdf-log-entry'
 import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-error'
 import OLButton from '@/features/ui/components/ol/ol-button'
@@ -26,14 +26,29 @@ function TimeoutUpgradePromptNew() {
     setAnimateCompileDropdownArrow(true)
   }, [enableStopOnFirstError, startCompile, setAnimateCompileDropdownArrow])
 
+  const { reducedTimeoutWarning, compileTimeout } =
+    getMeta('ol-compileSettings')
+
+  const sharedSegmentation = useMemo(
+    () => ({
+      '10s-timeout-warning': reducedTimeoutWarning,
+      'is-owner': isProjectOwner,
+      compileTime: compileTimeout,
+    }),
+    [isProjectOwner, reducedTimeoutWarning, compileTimeout]
+  )
+
   return (
     <>
-      <CompileTimeout isProjectOwner={isProjectOwner} />
+      <CompileTimeout
+        isProjectOwner={isProjectOwner}
+        segmentation={sharedSegmentation}
+      />
       {getMeta('ol-ExposedSettings').enableSubscriptions && (
         <PreventTimeoutHelpMessage
           handleEnableStopOnFirstErrorClick={handleEnableStopOnFirstErrorClick}
           lastCompileOptions={lastCompileOptions}
-          isProjectOwner={isProjectOwner}
+          segmentation={sharedSegmentation}
         />
       )}
     </>
@@ -42,10 +57,12 @@ function TimeoutUpgradePromptNew() {
 
 type CompileTimeoutProps = {
   isProjectOwner: boolean
+  segmentation: eventTracking.Segmentation
 }
 
 const CompileTimeout = memo(function CompileTimeout({
   isProjectOwner,
+  segmentation,
 }: CompileTimeoutProps) {
   const { t } = useTranslation()
 
@@ -62,7 +79,7 @@ const CompileTimeout = memo(function CompileTimeout({
             </p>
             {isProjectOwner ? (
               <p>
-                <strong>{t('upgrade_for_12x_more_compile_time')}</strong>{' '}
+                <strong>{t('upgrade_for_more_compile_time')}</strong>{' '}
                 {t(
                   'plus_additional_collaborators_document_history_track_changes_and_more'
                 )}
@@ -82,6 +99,7 @@ const CompileTimeout = memo(function CompileTimeout({
                 <StartFreeTrialButton
                   source="compile-timeout"
                   buttonProps={{ variant: 'primary', className: 'w-100' }}
+                  segmentation={segmentation}
                 >
                   {t('start_a_free_trial')}
                 </StartFreeTrialButton>
@@ -100,18 +118,19 @@ const CompileTimeout = memo(function CompileTimeout({
 type PreventTimeoutHelpMessageProps = {
   lastCompileOptions: any
   handleEnableStopOnFirstErrorClick: () => void
-  isProjectOwner: boolean
+  segmentation: eventTracking.Segmentation
 }
 
 const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
   lastCompileOptions,
   handleEnableStopOnFirstErrorClick,
-  isProjectOwner,
+  segmentation,
 }: PreventTimeoutHelpMessageProps) {
   const { t } = useTranslation()
 
   function sendInfoClickEvent() {
     eventTracking.sendMB('paywall-info-click', {
+      ...segmentation,
       'paywall-type': 'compile-timeout',
       content: 'blog',
     })
@@ -121,7 +140,7 @@ const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
     /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
     <a
       aria-label={t('read_more_about_free_compile_timeouts_servers')}
-      href="/blog/changes-to-free-compile-timeouts-and-servers"
+      href="/blog/changes-to-free-compile-timeout"
       rel="noopener noreferrer"
       target="_blank"
       onClick={sendInfoClickEvent}
@@ -133,6 +152,16 @@ const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
       headerTitle={t('reasons_for_compile_timeouts')}
       formattedContent={
         <>
+          {segmentation?.['10s-timeout-warning'] === 'enabled' && (
+            <p>
+              <em>
+                <Trans
+                  i18nKey="were_reducing_compile_timeout"
+                  components={[compileTimeoutChangesBlogLink]}
+                />
+              </em>
+            </p>
+          )}
           <p>{t('common_causes_of_compile_timeouts_include')}:</p>
           <ul>
             <li>
@@ -194,23 +223,6 @@ const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({
               ]}
             />
           </p>
-          <p>
-            <em>
-              <>
-                {isProjectOwner ? (
-                  <Trans
-                    i18nKey="weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_your_project"
-                    components={[compileTimeoutChangesBlogLink]}
-                  />
-                ) : (
-                  <Trans
-                    i18nKey="weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_this_project"
-                    components={[compileTimeoutChangesBlogLink]}
-                  />
-                )}
-              </>
-            </em>
-          </p>
         </>
       }
       // @ts-ignore
diff --git a/services/web/frontend/js/features/pdf-preview/components/visual-preview.tsx b/services/web/frontend/js/features/pdf-preview/components/visual-preview.tsx
new file mode 100644
index 0000000000..074d26501a
--- /dev/null
+++ b/services/web/frontend/js/features/pdf-preview/components/visual-preview.tsx
@@ -0,0 +1,165 @@
+import { FC, useEffect, useRef, useState } from 'react'
+import {
+  CodeMirrorStateContext,
+  CodeMirrorViewContext,
+} from '@/features/source-editor/components/codemirror-context'
+import { EditorView } from '@codemirror/view'
+import { EditorState, StateEffect } from '@codemirror/state'
+import useIsMounted from '@/shared/hooks/use-is-mounted'
+import { docName } from '@/features/source-editor/extensions/doc-name'
+import {
+  language,
+  Metadata,
+  setMetadata,
+} from '@/features/source-editor/extensions/language'
+import { showContentWhenParsed } from '@/features/source-editor/extensions/visual/visual'
+import { usePhrases } from '@/features/source-editor/hooks/use-phrases'
+import {
+  setEditorTheme,
+  theme,
+} from '@/features/source-editor/extensions/theme'
+import { useFileTreeData } from '@/shared/context/file-tree-data-context'
+import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
+import {
+  visualHighlightStyle,
+  visualTheme,
+} from '@/features/source-editor/extensions/visual/visual-theme'
+import { tableGeneratorTheme } from '@/features/source-editor/extensions/visual/table-generator'
+import { atomicDecorations } from '@/features/source-editor/extensions/visual/atomic-decorations'
+import { markDecorations } from '@/features/source-editor/extensions/visual/mark-decorations'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { isValidTeXFile } from '@/main/is-valid-tex-file'
+import { mousedown } from '@/features/source-editor/extensions/visual/selection'
+
+export const VisualPreview: FC<{ view: EditorView }> = ({ view }) => {
+  const [previewState, setPreviewState] = useState<EditorState>()
+
+  const { fileTreeData } = useFileTreeData()
+  const { previewByPath } = useFileTreePathContext()
+  const { currentDocument, openDocName } = useEditorOpenDocContext()
+  const phrases = usePhrases()
+
+  const isMountedRef = useIsMounted()
+  const viewRef = useRef<EditorView | undefined>()
+  const containerRef = useRef<HTMLDivElement>(null)
+  const previewByPathRef = useRef(previewByPath)
+  const metadataRef = useRef<Metadata>({
+    labels: new Set(),
+    packageNames: new Set(),
+    referenceKeys: new Set(),
+    commands: [],
+    fileTreeData,
+  })
+
+  useEffect(() => {
+    if (!currentDocument) {
+      return
+    }
+
+    const state = EditorState.create({
+      doc: view.state.doc,
+      extensions: [
+        EditorView.lineWrapping,
+        EditorState.readOnly.of(true),
+        EditorView.editable.of(false),
+        EditorState.phrases.of(phrases),
+        docName('main.tex'),
+        language('main.tex', metadataRef.current, { syntaxValidation: false }),
+        theme({
+          fontSize: 14,
+          fontFamily: 'monaco',
+          lineHeight: 'normal',
+          activeOverallTheme: 'light',
+        }),
+        EditorView.theme({
+          '&.cm-editor': {
+            background: '#fff',
+          },
+          '.ol-cm-preamble-wrapper, .ol-cm-end-document-widget': {
+            visibility: 'hidden',
+          },
+        }),
+        visualTheme,
+        visualHighlightStyle,
+        tableGeneratorTheme,
+        mousedown,
+        atomicDecorations({
+          previewByPath: previewByPathRef.current,
+        }),
+        markDecorations, // NOTE: must be after atomicDecorations, so that mark decorations wrap inline widgets
+        showContentWhenParsed,
+        EditorView.contentAttributes.of({ 'aria-label': 'Visual preview' }),
+      ],
+    })
+
+    const preview = new EditorView({
+      state,
+      dispatchTransactions(trs) {
+        preview.update(trs)
+        if (isMountedRef.current) {
+          setPreviewState(preview.state)
+        }
+      },
+      scrollTo: EditorView.scrollIntoView(state.selection.main, {
+        y: 'center',
+      }),
+    })
+
+    setEditorTheme('overleaf').then(spec => {
+      preview.dispatch(spec)
+    })
+
+    containerRef.current?.replaceChildren(preview.dom)
+
+    viewRef.current = preview
+
+    view.dispatch({
+      effects: StateEffect.appendConfig.of([
+        EditorView.updateListener.of(update => {
+          if (update.docChanged) {
+            for (const tr of update.transactions) {
+              preview.dispatch({
+                changes: tr.changes,
+              })
+            }
+          }
+
+          if (update.selectionSet) {
+            preview.dispatch({
+              effects: EditorView.scrollIntoView(update.state.selection.main, {
+                y: 'center',
+              }),
+            })
+          }
+        }),
+      ]),
+    })
+  }, [phrases, view, currentDocument, isMountedRef])
+
+  useEffect(() => {
+    if (fileTreeData) {
+      metadataRef.current.fileTreeData = fileTreeData
+      window.setTimeout(() => {
+        viewRef.current?.dispatch(setMetadata(metadataRef.current))
+      })
+    }
+  }, [fileTreeData, view])
+
+  useEffect(() => {
+    return () => {
+      viewRef.current?.destroy()
+    }
+  }, [view])
+
+  if (!openDocName || !isValidTeXFile(openDocName)) {
+    return null
+  }
+
+  return (
+    <CodeMirrorStateContext.Provider value={previewState}>
+      <CodeMirrorViewContext.Provider value={viewRef.current}>
+        <div ref={containerRef} style={{ height: '100%' }} />
+      </CodeMirrorViewContext.Provider>
+    </CodeMirrorStateContext.Provider>
+  )
+}
diff --git a/services/web/frontend/js/features/pdf-preview/hooks/use-log-events.ts b/services/web/frontend/js/features/pdf-preview/hooks/use-log-events.ts
index d849786026..771a2d3b4e 100644
--- a/services/web/frontend/js/features/pdf-preview/hooks/use-log-events.ts
+++ b/services/web/frontend/js/features/pdf-preview/hooks/use-log-events.ts
@@ -1,14 +1,20 @@
-import { useEffect } from 'react'
+import { useCallback, useEffect } from 'react'
 import { useLayoutContext } from '@/shared/context/layout-context'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useRailContext } from '@/features/ide-redesign/contexts/rail-context'
+import { useEditorContext } from '@/shared/context/editor-context'
 
 /**
  * This hook adds an event listener for events dispatched from the editor to the compile logs pane
  */
 export const useLogEvents = (setShowLogs: (show: boolean) => void) => {
   const { pdfLayout, setView } = useLayoutContext()
+  const newEditor = useIsNewEditorEnabled()
+  const { openTab: openRailTab } = useRailContext()
+  const { hasPremiumSuggestion } = useEditorContext()
 
-  useEffect(() => {
-    const listener = (event: Event) => {
+  const handleViewCompileLogEntryEventOldEditor = useCallback(
+    (event: Event) => {
       const { id, suggestFix } = (
         event as CustomEvent<{ id: string; suggestFix?: boolean }>
       ).detail
@@ -52,6 +58,68 @@ export const useLogEvents = (setShowLogs: (show: boolean) => void) => {
           }
         }
       })
+    },
+    [pdfLayout, setView, setShowLogs]
+  )
+
+  const handleViewCompileLogEntryEventNewEditor = useCallback(
+    (event: Event) => {
+      const { id, suggestFix } = (
+        event as CustomEvent<{ id: string; suggestFix?: boolean }>
+      ).detail
+
+      openRailTab('errors')
+
+      window.setTimeout(() => {
+        const logEntry = document.querySelector(
+          `.log-entry[data-log-entry-id="${id}"]`
+        )
+
+        if (logEntry) {
+          logEntry.scrollIntoView({
+            block: 'start',
+            inline: 'nearest',
+          })
+
+          const expandCollapseButton =
+            logEntry.querySelector<HTMLButtonElement>(
+              'button[data-action="expand-collapse"]'
+            )
+
+          const collapsed = expandCollapseButton?.dataset.collapsed === 'true'
+
+          if (collapsed) {
+            expandCollapseButton.click()
+          }
+
+          if (suggestFix) {
+            if (hasPremiumSuggestion) {
+              logEntry
+                .querySelector<HTMLButtonElement>(
+                  'button[data-action="suggest-fix"]'
+                )
+                ?.click()
+            } else {
+              window.dispatchEvent(
+                new CustomEvent('aiAssist:showPaywall', {
+                  detail: { origin: 'suggest-fix' },
+                })
+              )
+            }
+          }
+        }
+      })
+    },
+    [openRailTab, hasPremiumSuggestion]
+  )
+
+  useEffect(() => {
+    const listener = (event: Event) => {
+      if (newEditor) {
+        handleViewCompileLogEntryEventNewEditor(event)
+      } else {
+        handleViewCompileLogEntryEventOldEditor(event)
+      }
     }
 
     window.addEventListener('editor:view-compile-log-entry', listener)
@@ -59,5 +127,9 @@ export const useLogEvents = (setShowLogs: (show: boolean) => void) => {
     return () => {
       window.removeEventListener('editor:view-compile-log-entry', listener)
     }
-  }, [pdfLayout, setView, setShowLogs])
+  }, [
+    handleViewCompileLogEntryEventNewEditor,
+    handleViewCompileLogEntryEventOldEditor,
+    newEditor,
+  ])
 }
diff --git a/services/web/frontend/js/features/pdf-preview/hooks/use-presentation-mode.ts b/services/web/frontend/js/features/pdf-preview/hooks/use-presentation-mode.ts
index 7c76c6b17d..32fe582435 100644
--- a/services/web/frontend/js/features/pdf-preview/hooks/use-presentation-mode.ts
+++ b/services/web/frontend/js/features/pdf-preview/hooks/use-presentation-mode.ts
@@ -33,8 +33,8 @@ export default function usePresentationMode(
   }, [handlePageChange, page])
 
   const clickListener = useCallback(
-    event => {
-      if (event.target.tagName === 'A') {
+    (event: MouseEvent) => {
+      if ((event.target as HTMLElement).tagName === 'A') {
         return
       }
 
@@ -48,7 +48,7 @@ export default function usePresentationMode(
   )
 
   const arrowKeyListener = useCallback(
-    event => {
+    (event: KeyboardEvent) => {
       switch (event.key) {
         case 'ArrowLeft':
         case 'ArrowUp':
diff --git a/services/web/frontend/js/features/pdf-preview/hooks/use-synctex.ts b/services/web/frontend/js/features/pdf-preview/hooks/use-synctex.ts
new file mode 100644
index 0000000000..51c8eefc7c
--- /dev/null
+++ b/services/web/frontend/js/features/pdf-preview/hooks/use-synctex.ts
@@ -0,0 +1,309 @@
+import { useCallback, useEffect, useState, useRef } from 'react'
+import { useProjectContext } from '../../../shared/context/project-context'
+import { getJSON } from '../../../infrastructure/fetch-json'
+import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
+import useIsMounted from '../../../shared/hooks/use-is-mounted'
+import useAbortController from '../../../shared/hooks/use-abort-controller'
+import useDetachState from '../../../shared/hooks/use-detach-state'
+import useDetachAction from '../../../shared/hooks/use-detach-action'
+import localStorage from '../../../infrastructure/local-storage'
+import { useFileTreeData } from '../../../shared/context/file-tree-data-context'
+import useScopeEventListener from '../../../shared/hooks/use-scope-event-listener'
+import * as eventTracking from '../../../infrastructure/event-tracking'
+import { debugConsole } from '@/utils/debugging'
+import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
+import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import useEventListener from '@/shared/hooks/use-event-listener'
+import { CursorPosition } from '@/features/ide-react/types/cursor-position'
+import { isValidTeXFile } from '@/main/is-valid-tex-file'
+import { PdfScrollPosition } from '@/shared/hooks/use-pdf-scroll-position'
+import { showFileErrorToast } from '@/features/pdf-preview/components/synctex-toasts'
+import { sendMB } from '@/infrastructure/event-tracking'
+
+export default function useSynctex(): {
+  syncToPdf: () => void
+  syncToCode: ({ visualOffset }: { visualOffset?: number }) => void
+  syncToPdfInFlight: boolean
+  syncToCodeInFlight: boolean
+  canSyncToPdf: boolean
+} {
+  const { projectId, project } = useProjectContext()
+  const rootDocId = project?.rootDocId
+
+  const { clsiServerId, pdfFile, position, setShowLogs, setHighlights } =
+    useCompileContext()
+
+  const { selectedEntities } = useFileTreeData()
+  const { findEntityByPath, dirname, pathInFolder } = useFileTreePathContext()
+  const { openDocName } = useEditorOpenDocContext()
+  const { getCurrentDocumentId, openDocWithId } = useEditorManagerContext()
+
+  const [cursorPosition, setCursorPosition] = useState<CursorPosition | null>(
+    () => {
+      const position = localStorage.getItem(
+        `doc.position.${getCurrentDocumentId()}`
+      )
+      return position ? position.cursorPosition : null
+    }
+  )
+
+  const isMounted = useIsMounted()
+
+  const { signal } = useAbortController()
+
+  useEventListener(
+    'cursor:editor:update',
+    useCallback((event: CustomEvent) => setCursorPosition(event.detail), [])
+  )
+
+  const [syncToPdfInFlight, setSyncToPdfInFlight] = useState(false)
+  const [syncToCodeInFlight, setSyncToCodeInFlight] = useDetachState(
+    'sync-to-code-inflight',
+    false,
+    'detacher',
+    'detached'
+  )
+
+  const getCurrentFilePath = useCallback(() => {
+    const docId = getCurrentDocumentId()
+
+    if (!docId || !rootDocId) {
+      return null
+    }
+
+    let path = pathInFolder(docId)
+
+    if (!path) {
+      return null
+    }
+
+    // If the root file is folder/main.tex, then synctex sees the path as folder/./main.tex
+    const rootDocDirname = dirname(rootDocId)
+
+    if (rootDocDirname) {
+      path = path.replace(RegExp(`^${rootDocDirname}`), `${rootDocDirname}/.`)
+    }
+
+    return path
+  }, [dirname, getCurrentDocumentId, pathInFolder, rootDocId])
+
+  const goToCodeLine = useCallback(
+    (file?: string, line?: number) => {
+      if (file) {
+        const doc = findEntityByPath(file)?.entity
+        if (doc) {
+          openDocWithId(doc._id, {
+            gotoLine: line,
+          })
+          return
+        }
+      }
+      showFileErrorToast()
+    },
+    [findEntityByPath, openDocWithId]
+  )
+
+  const goToPdfLocation = useCallback(
+    (params: string) => {
+      setSyncToPdfInFlight(true)
+
+      if (clsiServerId) {
+        params += `&clsiserverid=${clsiServerId}`
+      }
+      if (pdfFile?.editorId) params += `&editorId=${pdfFile.editorId}`
+      if (pdfFile?.build) params += `&buildId=${pdfFile.build}`
+
+      getJSON(`/project/${projectId}/sync/code?${params}`, { signal })
+        .then(data => {
+          setShowLogs(false)
+          setHighlights(data.pdf)
+          if (data.downloadedFromCache) {
+            sendMB('synctex-downloaded-from-cache', {
+              projectId,
+              method: 'code',
+            })
+          }
+        })
+        .catch(debugConsole.error)
+        .finally(() => {
+          if (isMounted.current) {
+            setSyncToPdfInFlight(false)
+          }
+        })
+    },
+    [
+      pdfFile,
+      clsiServerId,
+      isMounted,
+      projectId,
+      setShowLogs,
+      setHighlights,
+      setSyncToPdfInFlight,
+      signal,
+    ]
+  )
+
+  const cursorPositionRef = useRef(cursorPosition)
+
+  useEffect(() => {
+    cursorPositionRef.current = cursorPosition
+  }, [cursorPosition])
+
+  const syncToPdf = useCallback(() => {
+    const file = getCurrentFilePath()
+
+    if (cursorPositionRef.current) {
+      const { row, column } = cursorPositionRef.current
+
+      const params = new URLSearchParams({
+        file: file ?? '',
+        line: String(row + 1),
+        column: String(column),
+      }).toString()
+
+      eventTracking.sendMB('jump-to-location', {
+        direction: 'code-location-in-pdf',
+        method: 'arrow',
+      })
+
+      goToPdfLocation(params)
+    }
+  }, [getCurrentFilePath, goToPdfLocation])
+
+  useScopeEventListener(
+    'cursor:editor:syncToPdf',
+    useCallback(() => {
+      syncToPdf()
+    }, [syncToPdf])
+  )
+
+  const positionRef = useRef(position)
+  useEffect(() => {
+    positionRef.current = position
+  }, [position])
+
+  const _syncToCode = useCallback(
+    ({
+      position = positionRef.current,
+      visualOffset = 0,
+    }: {
+      position?: PdfScrollPosition
+      visualOffset?: number
+    }) => {
+      if (!position) {
+        return
+      }
+
+      setSyncToCodeInFlight(true)
+      // FIXME: this actually works better if it's halfway across the
+      // page (or the visible part of the page). Synctex doesn't
+      // always find the right place in the file when the point is at
+      // the edge of the page, it sometimes returns the start of the
+      // next paragraph instead.
+      const h = position.offset.left
+
+      // Compute the vertical position to pass to synctex, which
+      // works with coordinates increasing from the top of the page
+      // down.  This matches the browser's DOM coordinate of the
+      // click point, but the pdf position is measured from the
+      // bottom of the page so we need to invert it.
+      let v = 0
+      if (position.pageSize?.height) {
+        v += position.pageSize.height - position.offset.top // measure from pdf point (inverted)
+      } else {
+        v += position.offset.top // measure from html click position
+      }
+      v += visualOffset
+
+      const params = new URLSearchParams({
+        page: position.page + 1,
+        h: h.toFixed(2),
+        v: v.toFixed(2),
+      })
+
+      if (clsiServerId) {
+        params.set('clsiserverid', clsiServerId)
+      }
+      if (pdfFile?.editorId) params.set('editorId', pdfFile.editorId)
+      if (pdfFile?.build) params.set('buildId', pdfFile.build)
+
+      getJSON(`/project/${projectId}/sync/pdf?${params}`, { signal })
+        .then(data => {
+          const [{ file, line }] = data.code
+          goToCodeLine(file, line)
+          if (data.downloadedFromCache) {
+            sendMB('synctex-downloaded-from-cache', {
+              projectId,
+              method: 'pdf',
+            })
+          }
+        })
+        .catch(debugConsole.error)
+        .finally(() => {
+          if (isMounted.current) {
+            setSyncToCodeInFlight(false)
+          }
+        })
+    },
+    [
+      pdfFile,
+      clsiServerId,
+      projectId,
+      signal,
+      isMounted,
+      setSyncToCodeInFlight,
+      goToCodeLine,
+    ]
+  )
+
+  const syncToCode = useDetachAction(
+    'sync-to-code',
+    _syncToCode,
+    'detached',
+    'detacher'
+  )
+
+  useEventListener(
+    'synctex:sync-to-position',
+    useCallback(
+      (event: CustomEvent) => syncToCode({ position: event.detail }),
+      [syncToCode]
+    )
+  )
+
+  const [hasSingleSelectedDoc, setHasSingleSelectedDoc] = useDetachState(
+    'has-single-selected-doc',
+    false,
+    'detacher',
+    'detached'
+  )
+
+  useEffect(() => {
+    if (selectedEntities.length !== 1) {
+      setHasSingleSelectedDoc(false)
+      return
+    }
+
+    if (selectedEntities[0].type !== 'doc') {
+      setHasSingleSelectedDoc(false)
+      return
+    }
+
+    setHasSingleSelectedDoc(true)
+  }, [selectedEntities, setHasSingleSelectedDoc])
+
+  const canSyncToPdf: boolean =
+    hasSingleSelectedDoc &&
+    cursorPosition &&
+    openDocName &&
+    isValidTeXFile(openDocName)
+
+  return {
+    syncToCode,
+    syncToPdf,
+    syncToPdfInFlight,
+    syncToCodeInFlight,
+    canSyncToPdf,
+  }
+}
diff --git a/services/web/frontend/js/features/pdf-preview/util/compiler.js b/services/web/frontend/js/features/pdf-preview/util/compiler.js
index 495d0ea8d1..d938cb3893 100644
--- a/services/web/frontend/js/features/pdf-preview/util/compiler.js
+++ b/services/web/frontend/js/features/pdf-preview/util/compiler.js
@@ -2,7 +2,7 @@ import { isMainFile } from './editor-files'
 import getMeta from '../../../utils/meta'
 import { deleteJSON, postJSON } from '../../../infrastructure/fetch-json'
 import { debounce } from 'lodash'
-import { trackPdfDownload } from './metrics'
+import { EDITOR_SESSION_ID, trackPdfDownload } from './metrics'
 import { enablePdfCaching } from './pdf-caching-flags'
 import { debugConsole } from '@/utils/debugging'
 import { signalWithTimeout } from '@/utils/abort-signal'
@@ -109,6 +109,7 @@ export default class DocumentCompiler {
         // if there was previously a server error
         incrementalCompilesEnabled: !this.error,
         stopOnFirstError: options.stopOnFirstError,
+        editorId: EDITOR_SESSION_ID,
       }
 
       const data = await postJSON(
diff --git a/services/web/frontend/js/features/pdf-preview/util/file-list.ts b/services/web/frontend/js/features/pdf-preview/util/file-list.ts
index 106234f1fe..a8a37a9e2b 100644
--- a/services/web/frontend/js/features/pdf-preview/util/file-list.ts
+++ b/services/web/frontend/js/features/pdf-preview/util/file-list.ts
@@ -11,14 +11,22 @@ const ignoreFiles = ['output.fls', 'output.fdb_latexmk']
 
 export function buildFileList(
   outputFiles: Map<string, CompileOutputFile>,
-  { clsiServerId, compileGroup, outputFilesArchive }: CompileResponseData
+  {
+    clsiServerId,
+    clsiCacheShard,
+    compileGroup,
+    outputFilesArchive,
+    fromCache = false,
+  }: CompileResponseData
 ): PdfFileDataList {
   const files: PdfFileDataList = { top: [], other: [] }
 
   if (outputFiles) {
     const params = new URLSearchParams()
 
-    if (clsiServerId) {
+    if (fromCache) {
+      params.set('clsiserverid', clsiCacheShard || 'cache')
+    } else if (clsiServerId) {
       params.set('clsiserverid', clsiServerId)
     }
     if (compileGroup) {
diff --git a/services/web/frontend/js/features/pdf-preview/util/highlights.js b/services/web/frontend/js/features/pdf-preview/util/highlights.js
index a2da6b2621..2fb204ac11 100644
--- a/services/web/frontend/js/features/pdf-preview/util/highlights.js
+++ b/services/web/frontend/js/features/pdf-preview/util/highlights.js
@@ -1,28 +1,55 @@
 import { PDFJS } from '@/features/pdf-preview/util/pdf-js'
 
 export function buildHighlightElement(highlight, viewer) {
-  const pageView = viewer.getPageView(highlight.page - 1)
+  const { viewport, div } = viewer.getPageView(highlight.page - 1)
 
-  const viewport = pageView.viewport
+  // page coordinates from synctex
+  const rectangle = {
+    left: highlight.h,
+    right: highlight.h + highlight.width,
+    top: highlight.v,
+    bottom: highlight.v + highlight.height,
+  }
 
-  const height = viewport.viewBox[3]
+  // needed because PDF page origin is at the bottom left
+  const viewBoxHeight = viewport.viewBox[3] + 10
 
-  const rect = viewport.convertToViewportRectangle([
-    highlight.h, // xMin
-    height - (highlight.v + highlight.height) + 10, // yMin
-    highlight.h + highlight.width, // xMax
-    height - highlight.v + 10, // yMax
+  // account for scaling
+  const viewportRectangle = viewport.convertToViewportRectangle([
+    rectangle.left,
+    viewBoxHeight - rectangle.bottom,
+    rectangle.right,
+    viewBoxHeight - rectangle.top,
   ])
 
-  const [left, top, right, bottom] = PDFJS.Util.normalizeRect(rect)
+  // flip top/bottom, left/right if needed
+  const normalizedRectangle = PDFJS.Util.normalizeRect(viewportRectangle)
+
+  const [left, top, right, bottom] = normalizedRectangle
+
+  // restrict to within the page container
+  const clampedRectangle = {
+    left: Math.max(left, 0),
+    right: Math.min(right, div.clientWidth),
+    top: Math.max(top, 0),
+    bottom: Math.min(bottom, div.clientHeight),
+  }
+
+  // convert to screen positions
+  const positions = {
+    left: div.offsetLeft + clampedRectangle.left,
+    right: div.offsetLeft + clampedRectangle.right,
+    top: div.offsetTop + clampedRectangle.top,
+    bottom: div.offsetTop + clampedRectangle.bottom,
+  }
 
   const element = document.createElement('div')
-  element.style.left = Math.floor(pageView.div.offsetLeft + left) + 'px'
-  element.style.top = Math.floor(pageView.div.offsetTop + top) + 'px'
-  element.style.width = Math.ceil(right - left) + 'px'
-  element.style.height = Math.ceil(bottom - top) + 'px'
-  element.style.backgroundColor = 'rgba(255,255,0)'
   element.style.position = 'absolute'
+  element.style.left = Math.floor(positions.left) + 'px'
+  element.style.top = Math.floor(positions.top) + 'px'
+  element.style.width = Math.floor(positions.right - positions.left) + 'px'
+  element.style.height = Math.floor(positions.bottom - positions.top) + 'px'
+  element.style.backgroundColor = 'rgb(255,255,0)'
   element.style.display = 'inline-block'
   element.style.scrollMargin = '72px'
   element.style.pointerEvents = 'none'
diff --git a/services/web/frontend/js/features/pdf-preview/util/metrics.js b/services/web/frontend/js/features/pdf-preview/util/metrics.js
index e80c2138a5..435594cb6e 100644
--- a/services/web/frontend/js/features/pdf-preview/util/metrics.js
+++ b/services/web/frontend/js/features/pdf-preview/util/metrics.js
@@ -8,7 +8,7 @@ import { debugConsole } from '@/utils/debugging'
 const VERSION = 9
 
 // editing session id
-const EDITOR_SESSION_ID = uuid()
+export const EDITOR_SESSION_ID = uuid()
 
 const pdfCachingMetrics = {
   viewerId: EDITOR_SESSION_ID,
diff --git a/services/web/frontend/js/features/pdf-preview/util/output-files.js b/services/web/frontend/js/features/pdf-preview/util/output-files.js
index 49724942fb..0903ec10e3 100644
--- a/services/web/frontend/js/features/pdf-preview/util/output-files.js
+++ b/services/web/frontend/js/features/pdf-preview/util/output-files.js
@@ -4,6 +4,7 @@ import { enablePdfCaching } from './pdf-caching-flags'
 import { debugConsole } from '@/utils/debugging'
 import { dirname, findEntityByPath } from '@/features/file-tree/util/path'
 import '@/utils/readable-stream-async-iterator-polyfill'
+import { EDITOR_SESSION_ID } from '@/features/pdf-preview/util/metrics'
 
 // Warnings that may disappear after a second LaTeX pass
 const TRANSIENT_WARNING_REGEX = /^(Reference|Citation).+undefined on input line/
@@ -15,10 +16,14 @@ export function handleOutputFiles(outputFiles, projectId, data) {
   const outputFile = outputFiles.get('output.pdf')
   if (!outputFile) return null
 
+  outputFile.editorId = outputFile.editorId || EDITOR_SESSION_ID
+  outputFile.clsiCacheShard = data.clsiCacheShard || 'cache'
+
   // build the URL for viewing the PDF in the preview UI
-  const params = new URLSearchParams({
-    compileGroup: data.compileGroup,
-  })
+  const params = new URLSearchParams()
+  if (data.compileGroup) {
+    params.set('compileGroup', data.compileGroup)
+  }
 
   if (data.clsiServerId) {
     params.set('clsiserverid', data.clsiServerId)
@@ -34,10 +39,14 @@ export function handleOutputFiles(outputFiles, projectId, data) {
     data.pdfDownloadDomain
   )}?${params}`
 
-  // build the URL for downloading the PDF
-  params.set('popupDownload', 'true') // save PDF download as file
+  if (data.fromCache) {
+    outputFile.pdfDownloadUrl = outputFile.downloadURL
+  } else {
+    // build the URL for downloading the PDF
+    params.set('popupDownload', 'true') // save PDF download as file
 
-  outputFile.pdfDownloadUrl = `/download/project/${projectId}/build/${outputFile.build}/output/output.pdf?${params}`
+    outputFile.pdfDownloadUrl = `/download/project/${projectId}/build/${outputFile.build}/output/output.pdf?${params}`
+  }
 
   return outputFile
 }
@@ -134,6 +143,10 @@ export const handleLogFiles = async (outputFiles, data, signal) => {
   return result
 }
 
+/**
+ * @typedef {import('../../../../../types/annotation').Annotation} Annotation
+ * @returns {Record<string, Annotation[]>}
+ */
 export function buildLogEntryAnnotations(entries, fileTreeData, rootDocId) {
   const rootDocDirname = dirname(fileTreeData, rootDocId)
 
diff --git a/services/web/frontend/js/features/pdf-preview/util/pdf-caching-flags.js b/services/web/frontend/js/features/pdf-preview/util/pdf-caching-flags.js
index 8c15dc4550..fb2a5b12b2 100644
--- a/services/web/frontend/js/features/pdf-preview/util/pdf-caching-flags.js
+++ b/services/web/frontend/js/features/pdf-preview/util/pdf-caching-flags.js
@@ -26,3 +26,8 @@ export const prefetchingEnabled = isFlagEnabled('pdf-caching-prefetching')
 export const prefetchLargeEnabled = isFlagEnabled('pdf-caching-prefetch-large')
 export const enablePdfCaching = isFlagEnabled('pdf-caching-mode')
 export const trackPdfDownloadEnabled = isFlagEnabled('track-pdf-download')
+export const projectOwnerHasPremiumOnPageLoad = getMeta(
+  'ol-projectOwnerHasPremiumOnPageLoad'
+)
+export const fallBackToClsiCache =
+  projectOwnerHasPremiumOnPageLoad && isFlagEnabled('populate-clsi-cache')
diff --git a/services/web/frontend/js/features/pdf-preview/util/pdf-caching-transport.js b/services/web/frontend/js/features/pdf-preview/util/pdf-caching-transport.js
index cb7433ee52..f568c634a4 100644
--- a/services/web/frontend/js/features/pdf-preview/util/pdf-caching-transport.js
+++ b/services/web/frontend/js/features/pdf-preview/util/pdf-caching-transport.js
@@ -1,17 +1,20 @@
 import OError from '@overleaf/o-error'
 import { fallbackRequest, fetchRange } from './pdf-caching'
 import { captureException } from '@/infrastructure/error-reporter'
-import { getPdfCachingMetrics } from './metrics'
+import { EDITOR_SESSION_ID, getPdfCachingMetrics } from './metrics'
 import {
   cachedUrlLookupEnabled,
   enablePdfCaching,
   prefetchingEnabled,
   prefetchLargeEnabled,
   trackPdfDownloadEnabled,
+  fallBackToClsiCache,
 } from './pdf-caching-flags'
 import { isNetworkError } from '@/utils/is-network-error'
 import { debugConsole } from '@/utils/debugging'
 import { PDFJS } from './pdf-js'
+import { sendMB } from '@/infrastructure/event-tracking'
+import getMeta from '@/utils/meta'
 
 // 30 seconds: The shutdown grace period of a clsi pre-emp instance.
 const STALE_OUTPUT_REQUEST_THRESHOLD_MS = 30 * 1000
@@ -21,6 +24,7 @@ export function generatePdfCachingTransportFactory() {
   if (!enablePdfCaching && !trackPdfDownloadEnabled) {
     return () => undefined
   }
+  const projectId = getMeta('ol-project_id')
   const usageScore = new Map()
   const cachedUrls = new Map()
   const metrics = Object.assign(getPdfCachingMetrics(), {
@@ -50,12 +54,21 @@ export function generatePdfCachingTransportFactory() {
     constructor({ url, pdfFile, abortController, handleFetchError }) {
       super(pdfFile.size, new Uint8Array())
       this.url = url
+      pdfFile.ranges = pdfFile.ranges || []
+      pdfFile.editorId = pdfFile.editorId || EDITOR_SESSION_ID
       this.pdfFile = pdfFile
       // Clone the chunks as the objectId field is encoded to a Uint8Array.
-      this.pdfRanges = pdfFile.ranges.map(r => Object.assign({}, r))
+      this.leanPdfRanges = pdfFile.ranges.map(r => Object.assign({}, r))
       this.handleFetchError = handleFetchError
       this.abortController = abortController
       this.startTime = performance.now()
+      this.sentEventFallbackToClsiCache = false
+
+      const params = new URL(url).searchParams
+      // drop no needed params
+      params.delete('enable_pdf_caching')
+      params.delete('verify_chunks')
+      this.queryForChunks = params.toString()
     }
 
     abort() {
@@ -63,11 +76,12 @@ export function generatePdfCachingTransportFactory() {
     }
 
     requestDataRange(start, end) {
+      let recordFallbackToClsiCache = false
       const abortSignal = this.abortController.signal
       const getDebugInfo = () => ({
         // Sentry does not serialize objects in twice nested objects.
         // Move the ranges to the root level to see them in Sentry.
-        pdfRanges: this.pdfRanges,
+        pdfRanges: this.leanPdfRanges,
         pdfFile: Object.assign({}, this.pdfFile, {
           ranges: '[extracted]',
           // Hide prefetched chunks as these include binary blobs.
@@ -83,7 +97,7 @@ export function generatePdfCachingTransportFactory() {
         performance.now() - this.startTime > STALE_OUTPUT_REQUEST_THRESHOLD_MS
       const is404 = err => OError.getFullInfo(err).statusCode === 404
       const isFromOutputPDFRequest = err =>
-        OError.getFullInfo(err).url === this.url
+        OError.getFullInfo(err).url?.includes?.('/output.pdf') === true
 
       // Do not consider "expected 404s" and network errors as pdf caching
       //  failures.
@@ -96,11 +110,68 @@ export function generatePdfCachingTransportFactory() {
         (is404(err) || isNetworkError(err)) &&
         (isStaleOutputRequest() || isFromOutputPDFRequest(err))
 
+      const usesCache = url => {
+        if (!url) return false
+        const u = new URL(url)
+        return (
+          u.pathname.endsWith(
+            `build/${this.pdfFile.editorId}-${this.pdfFile.build}/output/output.pdf`
+          ) &&
+          (u.searchParams.get('clsiserverid') === 'cache' ||
+            u.searchParams.get('clsiserverid')?.startsWith('clsi-cache-'))
+        )
+      }
+      const canTryFromCache = err => {
+        if (!fallBackToClsiCache) return false
+        if (!is404(err)) return false
+        return !usesCache(OError.getFullInfo(err).url)
+      }
+      const getOutputPDFURLFromCache = () => {
+        if (usesCache(this.url)) return this.url
+        const u = new URL(this.url)
+        u.searchParams.set('clsiserverid', this.pdfFile.clsiCacheShard)
+        u.pathname = u.pathname.replace(
+          /build\/[a-f0-9-]+\//,
+          `build/${this.pdfFile.editorId}-${this.pdfFile.build}/`
+        )
+        return u.href
+      }
+      const fetchFromCache = async () => {
+        // Try fetching the chunk from clsi-cache
+        const url = getOutputPDFURLFromCache()
+        return fallbackRequest({
+          file: this.pdfFile,
+          url,
+          start,
+          end,
+          abortSignal,
+        })
+          .then(blob => {
+            // Send the next output.pdf request directly to the cache.
+            this.url = url
+            // Only try downloading chunks that were cached previously
+            this.pdfFile.ranges = this.pdfFile.ranges.filter(r =>
+              cachedUrls.has(r.hash)
+            )
+            recordFallbackToClsiCache = true
+            return blob
+          })
+          .catch(err => {
+            const { statusCode, url } = OError.getFullInfo(err)
+            throw OError.tag(
+              new PDFJS.ResponseException(undefined, statusCode, true),
+              'cache-fallback',
+              { statusCode, url, err }
+            )
+          })
+      }
+
       fetchRange({
         url: this.url,
         start,
         end,
         file: this.pdfFile,
+        queryForChunks: this.queryForChunks,
         metrics,
         usageScore,
         cachedUrls,
@@ -109,9 +180,15 @@ export function generatePdfCachingTransportFactory() {
         prefetchLargeEnabled,
         cachedUrlLookupEnabled,
         abortSignal,
+        canTryFromCache,
+        fallbackToCacheURL: getOutputPDFURLFromCache(),
+        recordFallbackToClsiCache: () => {
+          recordFallbackToClsiCache = true
+        },
       })
         .catch(err => {
           if (abortSignal.aborted) return
+          if (canTryFromCache(err)) return fetchFromCache()
           if (isExpectedError(err)) {
             if (is404(err)) {
               // A regular pdf-js request would have seen this 404 as well.
@@ -120,11 +197,12 @@ export function generatePdfCachingTransportFactory() {
               metrics.failedCount++
               metrics.failedOnce = true
             }
-            throw OError.tag(new PDFJS.MissingPDFException(), 'caching', {
-              statusCode: OError.getFullInfo(err).statusCode,
-              url: OError.getFullInfo(err).url,
-              err,
-            })
+            const { statusCode, url } = OError.getFullInfo(err)
+            throw OError.tag(
+              new PDFJS.ResponseException(undefined, statusCode, true),
+              'caching',
+              { statusCode, url, err }
+            )
           }
           metrics.failedCount++
           metrics.failedOnce = true
@@ -140,30 +218,41 @@ export function generatePdfCachingTransportFactory() {
             },
           })
           return fallbackRequest({
+            file: this.pdfFile,
             url: this.url,
             start,
             end,
             abortSignal,
           }).catch(err => {
+            if (canTryFromCache(err)) return fetchFromCache()
             if (isExpectedError(err)) {
-              throw OError.tag(new PDFJS.MissingPDFException(), 'fallback', {
-                statusCode: OError.getFullInfo(err).statusCode,
-                url: OError.getFullInfo(err).url,
-                err,
-              })
+              const { statusCode, url } = OError.getFullInfo(err)
+              throw OError.tag(
+                new PDFJS.ResponseException(undefined, statusCode, true),
+                'fallback',
+                { statusCode, url, err }
+              )
             }
             throw err
           })
         })
         .then(blob => {
           if (abortSignal.aborted) return
+          if (recordFallbackToClsiCache && !this.sentEventFallbackToClsiCache) {
+            // Record once per PDF preview. Technically we should record once per 90min (output cache age), but keep it simple for now.
+            this.sentEventFallbackToClsiCache = true
+            sendMB('fallback-to-clsi-cache', {
+              projectId,
+              ageMS: Math.ceil(performance.now() - this.startTime),
+            })
+          }
           this.onDataRange(start, blob)
         })
         .catch(err => {
           if (abortSignal.aborted) return
           err = OError.tag(err, 'fatal pdf download error', getDebugInfo())
           debugConsole.error(err)
-          if (!(err instanceof PDFJS.MissingPDFException)) {
+          if (!(err instanceof PDFJS.ResponseException && err.missing)) {
             captureException(err, {
               tags: {
                 fromPdfCaching: true,
diff --git a/services/web/frontend/js/features/pdf-preview/util/pdf-caching.js b/services/web/frontend/js/features/pdf-preview/util/pdf-caching.js
index 0e3a40d730..c3dba41d8b 100644
--- a/services/web/frontend/js/features/pdf-preview/util/pdf-caching.js
+++ b/services/web/frontend/js/features/pdf-preview/util/pdf-caching.js
@@ -21,6 +21,28 @@ const CHUNK_USAGE_THRESHOLD_CACHED = 42
 // 42 * 0.7^11 < 1, aka we keep stale entries around for 11 compiles.
 const CHUNK_USAGE_STALE_DECAY_RATE = 0.7
 
+let cacheFlag = 'default'
+// Work around a Chrome bug: https://issues.chromium.org/issues/40542704
+// Multiple simultaneous requests to same URL with Range header cause failure (block backend returns ERR_CACHE_OPERATION_NOT_SUPPORTED)
+const CACHE_NO_STORE = 'no-store'
+
+/**
+ * @param {string} url
+ * @param {RequestInit} init
+ */
+async function fetchWithBrowserCacheFallback(url, init) {
+  try {
+    return await fetch(url, init)
+  } catch (err) {
+    if (init.headers?.has('Range') && init.cache !== CACHE_NO_STORE) {
+      cacheFlag = CACHE_NO_STORE
+      init.cache = CACHE_NO_STORE
+      return await fetch(url, init)
+    }
+    throw err
+  }
+}
+
 /**
  * @param {Object} file
  */
@@ -225,7 +247,6 @@ function usageAboveThreshold(chunk) {
 function cutRequestAmplification({
   potentialChunks,
   usageScore,
-  cachedUrls,
   metrics,
   start,
   end,
@@ -470,21 +491,30 @@ export function checkChunkResponse(response, estimatedSize, init) {
   }
 }
 
+function getDynamicChunkInit({ file, start, end, signal }) {
+  // Avoid making range request when downloading the PDF file in full.
+  const isFullFile = start === 0 && end === file.size
+  return {
+    cache: cacheFlag,
+    headers: new Headers(
+      isFullFile ? {} : { Range: `bytes=${start}-${end - 1}` }
+    ),
+    signal,
+  }
+}
+
 /**
  *
+ * @param {Object} file
  * @param {string} url
  * @param {number} start
  * @param {number} end
  * @param {AbortSignal} abortSignal
  */
-export async function fallbackRequest({ url, start, end, abortSignal }) {
+export async function fallbackRequest({ file, url, start, end, abortSignal }) {
   try {
-    const init = {
-      cache: 'no-store',
-      headers: { Range: `bytes=${start}-${end - 1}` },
-      signal: abortSignal,
-    }
-    const response = await fetch(url, init)
+    const init = getDynamicChunkInit({ file, start, end, signal: abortSignal })
+    const response = await fetchWithBrowserCacheFallback(url, init)
     checkChunkResponse(response, end - start, init)
     return await response.arrayBuffer()
   } catch (e) {
@@ -494,6 +524,7 @@ export async function fallbackRequest({ url, start, end, abortSignal }) {
 
 /**
  *
+ * @param {Object} file
  * @param {string} url
  * @param {number} start
  * @param {number} end
@@ -501,10 +532,24 @@ export async function fallbackRequest({ url, start, end, abortSignal }) {
  * @param {Uint8Array} actual
  * @param {AbortSignal} abortSignal
  */
-async function verifyRange({ url, start, end, metrics, actual, abortSignal }) {
+async function verifyRange({
+  file,
+  url,
+  start,
+  end,
+  metrics,
+  actual,
+  abortSignal,
+}) {
   let expectedRaw
   try {
-    expectedRaw = await fallbackRequest({ url, start, end, abortSignal })
+    expectedRaw = await fallbackRequest({
+      file,
+      url,
+      start,
+      end,
+      abortSignal,
+    })
   } catch (error) {
     throw OError.tag(error, 'cannot verify range', { url, start, end })
   }
@@ -541,9 +586,13 @@ function skipPrefetched(chunks, prefetched, start, end) {
  * @param {Object|Object[]} chunk
  * @param {string} url
  * @param {RequestInit} init
- * @param {Map<string, string>} cachedUrls
+ * @param {Map<string, {url:string,init:RequestInit}>} cachedUrls
  * @param {Object} metrics
  * @param {boolean} cachedUrlLookupEnabled
+ * @param {() => boolean} canTryFromCache
+ * @param {string} fallbackToCacheURL
+ * @param {Object} file
+ * @param {() => void} recordFallbackToClsiCache
  */
 async function fetchChunk({
   chunk,
@@ -552,18 +601,26 @@ async function fetchChunk({
   cachedUrls,
   metrics,
   cachedUrlLookupEnabled,
+  canTryFromCache,
+  fallbackToCacheURL,
+  file,
+  recordFallbackToClsiCache,
 }) {
   const estimatedSize = Array.isArray(chunk)
     ? estimateSizeOfMultipartResponse(chunk)
     : chunk.end - chunk.start
 
   const oldUrl = cachedUrls.get(chunk.hash)
-  if (cachedUrlLookupEnabled && chunk.hash && oldUrl && oldUrl !== url) {
+  if (cachedUrlLookupEnabled && chunk.hash && oldUrl && oldUrl.url !== url) {
     // When the clsi server id changes, the content id changes too and as a
     //  result all the browser cache keys (aka urls) get invalidated.
     // We memorize the previous browser cache keys in `cachedUrls`.
     try {
-      const response = await fetch(oldUrl, init)
+      oldUrl.init.signal = init.signal
+      const response = await fetchWithBrowserCacheFallback(
+        oldUrl.url,
+        oldUrl.init
+      )
       if (response.status === 200) {
         checkChunkResponse(response, estimatedSize, init)
         metrics.oldUrlHitCount += 1
@@ -577,10 +634,48 @@ async function fetchChunk({
     } catch (e) {
       // Fallback to the latest url.
     }
+    cachedUrls.delete(chunk.hash) // clear cached state
+  }
+  let response
+  try {
+    response = await fetchWithBrowserCacheFallback(url, init)
+    checkChunkResponse(response, estimatedSize, init)
+    if (chunk.hash) {
+      delete init.signal // omit the signal from the cache
+      cachedUrls.set(chunk.hash, { url, init })
+    }
+  } catch (err1) {
+    if (chunk.hash) {
+      cachedUrls.delete(chunk.hash)
+    }
+    const hasOthersCached = cachedUrls.size > 0
+    const info = { url, init, statusCode: response?.status }
+    const errTagged = OError.tag(err1, 'add info for canTryFromCache', info)
+    if (hasOthersCached && canTryFromCache(errTagged) && fallbackToCacheURL) {
+      // Only try downloading chunks that were cached previously
+      file.ranges = file.ranges.filter(r => cachedUrls.has(r.hash))
+      // Try harder at fetching the chunk, fallback to cache
+      url = fallbackToCacheURL
+      if (chunk.hash) {
+        init = getDynamicChunkInit({
+          file,
+          // skip object id prefix
+          start: chunk.start + chunk.objectId.byteLength,
+          end: chunk.end,
+          signal: init.signal,
+        })
+      }
+      try {
+        response = await fetchWithBrowserCacheFallback(url, init)
+        checkChunkResponse(response, estimatedSize, init)
+        recordFallbackToClsiCache()
+      } catch (err2) {
+        throw err1
+      }
+    } else {
+      throw err1
+    }
   }
-  const response = await fetch(url, init)
-  checkChunkResponse(response, estimatedSize, init)
-  if (chunk.hash) cachedUrls.set(chunk.hash, url)
   return response
 }
 
@@ -720,6 +815,7 @@ class Timer {
  * @param {number} start
  * @param {number} end
  * @param {Object} file
+ * @param {queryForChunks} start
  * @param {Object} metrics
  * @param {Map} usageScore
  * @param {Map} cachedUrls
@@ -728,12 +824,16 @@ class Timer {
  * @param {boolean} prefetchLargeEnabled
  * @param {boolean} tryOldCachedUrlEnabled
  * @param {AbortSignal} abortSignal
+ * @param {() => boolean} canTryFromCache
+ * @param {string} fallbackToCacheURL
+ * @param {() => void} recordFallbackToClsiCache
  */
 export async function fetchRange({
   url,
   start,
   end,
   file,
+  queryForChunks,
   metrics,
   usageScore,
   cachedUrls,
@@ -742,6 +842,9 @@ export async function fetchRange({
   prefetchLargeEnabled,
   cachedUrlLookupEnabled,
   abortSignal,
+  canTryFromCache,
+  fallbackToCacheURL,
+  recordFallbackToClsiCache,
 }) {
   const timer = new Timer()
   timer.startBlockingCompute()
@@ -793,7 +896,7 @@ export async function fetchRange({
       fetchedCount: 1,
       fetchedBytes: size,
     })
-    return fallbackRequest({ url, start, end, abortSignal })
+    return fallbackRequest({ file, url, start, end, abortSignal })
   }
 
   if (prefetchingEnabled) {
@@ -819,8 +922,8 @@ export async function fetchRange({
         chunk: dynamicChunks[0],
         url,
         init: {
-          cache: 'no-store',
-          headers: { Range: `bytes=${byteRanges}` },
+          cache: cacheFlag,
+          headers: new Headers({ Range: `bytes=${byteRanges}` }),
         },
       })
       break
@@ -833,8 +936,10 @@ export async function fetchRange({
           chunk,
           url,
           init: {
-            cache: 'no-store',
-            headers: { Range: `bytes=${chunk.start}-${chunk.end - 1}` },
+            cache: cacheFlag,
+            headers: new Headers({
+              Range: `bytes=${chunk.start}-${chunk.end - 1}`,
+            }),
           },
         })
       })
@@ -844,17 +949,12 @@ export async function fetchRange({
         chunk: dynamicChunks,
         url,
         init: {
-          cache: 'no-store',
-          headers: { Range: `bytes=${byteRanges}` },
+          cache: cacheFlag,
+          headers: new Headers({ Range: `bytes=${byteRanges}` }),
         },
       })
   }
 
-  const params = new URL(url).searchParams
-  // drop no needed params
-  params.delete('enable_pdf_caching')
-  params.delete('verify_chunks')
-  const query = params.toString()
   // The schema of `url` is https://domain/project/:id/user/:id/build/... for
   //  authenticated and https://domain/project/:id/build/... for
   //  unauthenticated users. Cut it before /build/.
@@ -863,7 +963,7 @@ export async function fetchRange({
   const requests = chunks
     .map(chunk => ({
       chunk,
-      url: `${perUserPrefix}/content/${file.contentId}/${chunk.hash}?${query}`,
+      url: `${perUserPrefix}/content/${file.contentId}/${chunk.hash}?${queryForChunks}`,
       init: {},
     }))
     .concat(coalescedDynamicChunks)
@@ -886,6 +986,10 @@ export async function fetchRange({
           cachedUrls,
           metrics,
           cachedUrlLookupEnabled,
+          canTryFromCache,
+          fallbackToCacheURL,
+          file,
+          recordFallbackToClsiCache,
         })
         timer.startBlockingCompute()
         const boundary = getMultipartBoundary(response, chunk)
diff --git a/services/web/frontend/js/features/pdf-preview/util/pdf-js-wrapper.ts b/services/web/frontend/js/features/pdf-preview/util/pdf-js-wrapper.ts
index fca9b7fecb..9f6ba7316a 100644
--- a/services/web/frontend/js/features/pdf-preview/util/pdf-js-wrapper.ts
+++ b/services/web/frontend/js/features/pdf-preview/util/pdf-js-wrapper.ts
@@ -57,7 +57,7 @@ export default class PDFJSWrapper {
     url: string
     pdfFile: Record<string, any>
     abortController: AbortController
-    handleFetchError: (error: Error) => void
+    handleFetchError: (error: any) => void
   }) {
     this.url = url
 
@@ -90,7 +90,10 @@ export default class PDFJSWrapper {
 
       return doc
     } catch (error: any) {
-      if (!error || error.name !== 'MissingPDFException') {
+      if (
+        !error ||
+        !(error instanceof PDFJS.ResponseException && error.missing === true)
+      ) {
         captureException(error, {
           tags: { handler: 'pdf-preview' },
         })
diff --git a/services/web/frontend/js/features/pdf-preview/util/pdf-js.ts b/services/web/frontend/js/features/pdf-preview/util/pdf-js.ts
index 51a3bc9891..097055eecb 100644
--- a/services/web/frontend/js/features/pdf-preview/util/pdf-js.ts
+++ b/services/web/frontend/js/features/pdf-preview/util/pdf-js.ts
@@ -1,3 +1,4 @@
+import '@/utils/abortsignal-polyfill'
 import * as PDFJS from 'pdfjs-dist'
 import type { DocumentInitParameters } from 'pdfjs-dist/types/src/display/api'
 
@@ -10,6 +11,8 @@ PDFJS.GlobalWorkerOptions.workerPort = new Worker(
 
 export const imageResourcesPath = '/images/pdfjs-dist/'
 const cMapUrl = '/js/pdfjs-dist/cmaps/'
+const wasmUrl = '/js/pdfjs-dist/wasm/'
+const iccUrl = '/js/pdfjs-dist/iccs/'
 const standardFontDataUrl = '/fonts/pdfjs-dist/'
 
 const params = new URLSearchParams(window.location.search)
@@ -23,6 +26,8 @@ export const loadPdfDocumentFromUrl = (
   PDFJS.getDocument({
     url,
     cMapUrl,
+    wasmUrl,
+    iccUrl,
     standardFontDataUrl,
     disableFontFace,
     disableAutoFetch: true, // only fetch the data needed for the displayed pages
diff --git a/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx b/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
index 28f163a753..f5b1f49ce6 100644
--- a/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
+++ b/services/web/frontend/js/features/preview/components/preview-log-entry-header.tsx
@@ -14,9 +14,7 @@ function PreviewLogEntryHeader({
   headerIcon,
   logType,
   showSourceLocationLink = true,
-  showCloseButton = false,
   onSourceLocationClick,
-  onClose,
 }: {
   headerTitle: string | React.ReactNode
   level: ErrorLevel
@@ -24,9 +22,7 @@ function PreviewLogEntryHeader({
   logType?: string
   sourceLocation?: SourceLocation
   showSourceLocationLink?: boolean
-  showCloseButton?: boolean
   onSourceLocationClick?: MouseEventHandler<HTMLButtonElement>
-  onClose?: () => void
 }) {
   const { t } = useTranslation()
   const logLocationSpanRef = useRef<HTMLSpanElement>(null)
@@ -90,7 +86,11 @@ function PreviewLogEntryHeader({
       onClick={onSourceLocationClick}
     >
       <MaterialIcon type="link" />
-      <span ref={logLocationSpanRef} className="log-entry-header-link-location">
+      <span
+        ref={logLocationSpanRef}
+        className="log-entry-header-link-location"
+        translate="no"
+      >
         {`\u202A${locationLinkText}\u202C`}
       </span>
     </OLButton>
@@ -109,23 +109,13 @@ function PreviewLogEntryHeader({
           id={locationLinkText}
           description={locationLinkText}
           overlayProps={{ placement: 'left' }}
-          tooltipProps={{ className: 'log-location-tooltip' }}
+          tooltipProps={{ className: 'log-location-tooltip', translate: 'no' }}
         >
           {locationLink}
         </OLTooltip>
       ) : (
         locationLink
       )}
-      {showCloseButton ? (
-        <OLButton
-          variant="link"
-          className="btn-inline-link log-entry-header-link"
-          aria-label={t('dismiss_error_popup')}
-          onClick={onClose}
-        >
-          <span aria-hidden="true">&times;</span>
-        </OLButton>
-      ) : null}
     </header>
   )
 }
diff --git a/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.jsx b/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.jsx
deleted file mode 100644
index 774dba826e..0000000000
--- a/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.jsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import { useCallback } from 'react'
-import PropTypes from 'prop-types'
-import { Trans, useTranslation } from 'react-i18next'
-import OLButton from '@/features/ui/components/ol/ol-button'
-import PreviewLogEntryHeader from './preview-log-entry-header'
-import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
-import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-error'
-import MaterialIcon from '@/shared/components/material-icon'
-
-function PreviewLogsPaneMaxEntries({ totalEntries, entriesShown, hasErrors }) {
-  const { t } = useTranslation()
-  const { startCompile, stoppedOnFirstError, setAnimateCompileDropdownArrow } =
-    useCompileContext()
-  const { enableStopOnFirstError } = useStopOnFirstError({
-    eventSource: 'too-many-logs',
-  })
-
-  const title = t('log_entry_maximum_entries_title', {
-    total: totalEntries,
-    displayed: entriesShown,
-  })
-
-  const handleEnableStopOnFirstErrorClick = useCallback(() => {
-    enableStopOnFirstError()
-    startCompile({ stopOnFirstError: true })
-    setAnimateCompileDropdownArrow(true)
-  }, [enableStopOnFirstError, startCompile, setAnimateCompileDropdownArrow])
-
-  return (
-    <div className="log-entry" aria-label={t('log_entry_maximum_entries')}>
-      <PreviewLogEntryHeader level="raw" headerTitle={title} />
-      <div className="log-entry-content">
-        <div className="log-entry-formatted-content">
-          {hasErrors && !stoppedOnFirstError ? (
-            <>
-              <p>
-                <MaterialIcon type="lightbulb" className="align-middle" />
-                &nbsp;
-                <strong>{t('tip')}: </strong>
-                <Trans
-                  i18nKey="log_entry_maximum_entries_enable_stop_on_first_error"
-                  components={[
-                    <OLButton
-                      variant="info"
-                      size="sm"
-                      key="enable-stop-on-first-error"
-                      onClick={handleEnableStopOnFirstErrorClick}
-                    />,
-                    // eslint-disable-next-line jsx-a11y/anchor-has-content
-                    <a
-                      key="learn-more"
-                      href="https://www.overleaf.com/learn/latex/Questions/Tips_and_Tricks_for_Troubleshooting_LaTeX"
-                    />,
-                  ]}
-                />{' '}
-              </p>
-              <p>{t('log_entry_maximum_entries_see_full_logs')}</p>
-            </>
-          ) : (
-            <p>
-              <MaterialIcon type="lightbulb" className="align-middle" />
-              &nbsp;
-              <strong>{t('tip')}: </strong>
-              {t('log_entry_maximum_entries_see_full_logs')}
-            </p>
-          )}
-        </div>
-      </div>
-    </div>
-  )
-}
-
-PreviewLogsPaneMaxEntries.propTypes = {
-  totalEntries: PropTypes.number,
-  entriesShown: PropTypes.number,
-  hasErrors: PropTypes.bool,
-}
-
-export default PreviewLogsPaneMaxEntries
diff --git a/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.tsx b/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.tsx
new file mode 100644
index 0000000000..f0109a6c03
--- /dev/null
+++ b/services/web/frontend/js/features/preview/components/preview-logs-pane-max-entries.tsx
@@ -0,0 +1,94 @@
+import { useCallback } from 'react'
+import { Trans, useTranslation } from 'react-i18next'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
+import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-error'
+import MaterialIcon from '@/shared/components/material-icon'
+import PdfLogEntry from '@/features/pdf-preview/components/pdf-log-entry'
+
+function PreviewLogsPaneMaxEntries({
+  totalEntries,
+  entriesShown,
+  hasErrors,
+}: {
+  totalEntries: number
+  entriesShown: number
+  hasErrors?: boolean
+}) {
+  const { t } = useTranslation()
+
+  const title = t('log_entry_maximum_entries_title', {
+    total: totalEntries,
+    displayed: entriesShown,
+  })
+
+  return (
+    <PdfLogEntry
+      entryAriaLabel={t('log_entry_maximum_entries')}
+      headerTitle={title}
+      level="raw"
+      formattedContent={
+        <PreviewLogsPaneMaxEntriesContent hasErrors={hasErrors} />
+      }
+    />
+  )
+}
+
+function PreviewLogsPaneMaxEntriesContent({
+  hasErrors,
+}: {
+  hasErrors?: boolean
+}) {
+  const { t } = useTranslation()
+  const { startCompile, stoppedOnFirstError, setAnimateCompileDropdownArrow } =
+    useCompileContext()
+  const { enableStopOnFirstError } = useStopOnFirstError({
+    eventSource: 'too-many-logs',
+  })
+
+  const handleEnableStopOnFirstErrorClick = useCallback(() => {
+    enableStopOnFirstError()
+    startCompile({ stopOnFirstError: true })
+    setAnimateCompileDropdownArrow(true)
+  }, [enableStopOnFirstError, startCompile, setAnimateCompileDropdownArrow])
+
+  if (hasErrors && !stoppedOnFirstError) {
+    return (
+      <>
+        <p>
+          <MaterialIcon type="lightbulb" className="align-middle" />
+          &nbsp;
+          <strong>{t('tip')}: </strong>
+          <Trans
+            i18nKey="log_entry_maximum_entries_enable_stop_on_first_error"
+            components={[
+              <OLButton
+                variant="primary"
+                size="sm"
+                key="enable-stop-on-first-error"
+                onClick={handleEnableStopOnFirstErrorClick}
+              />,
+              // eslint-disable-next-line jsx-a11y/anchor-has-content
+              <a
+                key="learn-more"
+                href="https://www.overleaf.com/learn/latex/Questions/Tips_and_Tricks_for_Troubleshooting_LaTeX"
+              />,
+            ]}
+          />{' '}
+        </p>
+        <p>{t('log_entry_maximum_entries_see_full_logs')}</p>
+      </>
+    )
+  }
+
+  return (
+    <p>
+      <MaterialIcon type="lightbulb" className="align-middle" />
+      &nbsp;
+      <strong>{t('tip')}: </strong>
+      {t('log_entry_maximum_entries_see_full_logs')}
+    </p>
+  )
+}
+
+export default PreviewLogsPaneMaxEntries
diff --git a/services/web/frontend/js/features/project-list/components/color-picker/color-picker.tsx b/services/web/frontend/js/features/project-list/components/color-picker/color-picker.tsx
index 9634e47d62..ca2621e003 100644
--- a/services/web/frontend/js/features/project-list/components/color-picker/color-picker.tsx
+++ b/services/web/frontend/js/features/project-list/components/color-picker/color-picker.tsx
@@ -44,7 +44,7 @@ function ColorPickerItem({ color, name }: ColorPickerItemProps) {
       tabIndex={0}
       onKeyDown={handleKeyDown}
     >
-      <span id={name} className="sr-only">
+      <span id={name} className="visually-hidden">
         {t('select_color', { name })}
       </span>
       {!pickingCustomColor && color === selectedColor && (
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx
index e687c8a362..ca4cb55b64 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/commons-plan.tsx
@@ -15,7 +15,10 @@ function CommonsPlan({
 }: CommonsPlanProps) {
   const { t } = useTranslation()
   const currentPlanLabel = (
-    <Trans i18nKey="premium_plan_label" components={{ b: <strong /> }} />
+    <Trans
+      i18nKey="premium_plan_label"
+      components={{ b: <strong translate="no" /> }}
+    />
   )
 
   return (
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx
index 20bfe55479..b07a4e164a 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/current-plan-widget.tsx
@@ -4,6 +4,7 @@ import GroupPlan from './group-plan'
 import CommonsPlan from './commons-plan'
 import PausedPlan from './paused-plan'
 import getMeta from '../../../../utils/meta'
+import { getUserSubscriptionState } from '../../util/user'
 
 function CurrentPlanWidget() {
   const usersBestSubscription = getMeta('ol-usersBestSubscription')
@@ -13,13 +14,17 @@ function CurrentPlanWidget() {
   }
 
   const { type } = usersBestSubscription
-  const isFreePlan = type === 'free' || type === 'standalone-ai-add-on'
-  const isIndividualPlan = type === 'individual'
+  const isFreePlan =
+    type === 'free' ||
+    type === 'standalone-ai-add-on' ||
+    (type === 'individual' && usersBestSubscription.plan?.name === 'Free')
+  const isIndividualPlan =
+    type === 'individual' && !(usersBestSubscription.plan?.name === 'Free')
   const isGroupPlan = type === 'group'
   const isCommonsPlan = type === 'commons'
   const isPaused =
     isIndividualPlan &&
-    usersBestSubscription.subscription?.recurlyStatus?.state === 'paused'
+    getUserSubscriptionState(usersBestSubscription) === 'paused'
 
   const featuresPageURL = '/learn/how-to/Overleaf_premium_features'
   const subscriptionPageUrl = '/user/subscription'
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx
index fe3fb18125..feffb68598 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/free-plan.tsx
@@ -10,7 +10,10 @@ type FreePlanProps = Pick<FreePlanSubscription, 'featuresPageURL'>
 function FreePlan({ featuresPageURL }: FreePlanProps) {
   const { t } = useTranslation()
   const currentPlanLabel = (
-    <Trans i18nKey="free_plan_label" components={{ b: <strong /> }} />
+    <Trans
+      i18nKey="free_plan_label"
+      components={{ b: <strong translate="no" /> }}
+    />
   )
 
   const handleClick = () => {
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx
index 235c34ba15..ff0fc1420a 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/group-plan.tsx
@@ -8,6 +8,18 @@ type GroupPlanProps = Pick<
   'subscription' | 'plan' | 'remainingTrialDays' | 'featuresPageURL'
 >
 
+function getFriendlyPlanName(planName: string): string {
+  if (planName.toLowerCase().includes('professional')) {
+    return 'Professional'
+  } else if (planName.toLowerCase().includes('collaborator')) {
+    return 'Standard'
+  }
+  // fallback on plan name
+  else {
+    return planName
+  }
+}
+
 function GroupPlan({
   featuresPageURL,
   subscription,
@@ -15,21 +27,26 @@ function GroupPlan({
   remainingTrialDays,
 }: GroupPlanProps) {
   const { t } = useTranslation()
+  const planNameComponent = <strong translate="no" />
+  const friendlyPlanName = getFriendlyPlanName(plan.name)
   const currentPlanLabel =
     remainingTrialDays >= 0 ? (
       remainingTrialDays === 1 ? (
-        <Trans i18nKey="trial_last_day" components={{ b: <strong /> }} />
+        <Trans i18nKey="trial_last_day" components={{ b: planNameComponent }} />
       ) : (
         <Trans
           i18nKey="trial_remaining_days"
-          components={{ b: <strong /> }}
+          components={{ b: planNameComponent }}
           values={{ days: remainingTrialDays }}
           shouldUnescape
           tOptions={{ interpolation: { escapeValue: true } }}
         />
       )
     ) : (
-      <Trans i18nKey="premium_plan_label" components={{ b: <strong /> }} />
+      <Trans
+        i18nKey="premium_plan_label"
+        components={{ b: planNameComponent }}
+      />
     )
 
   return (
@@ -39,10 +56,10 @@ function GroupPlan({
         description={
           subscription.teamName != null
             ? t('group_plan_with_name_tooltip', {
-                plan: plan.name,
+                plan: friendlyPlanName,
                 groupName: subscription.teamName,
               })
-            : t('group_plan_tooltip', { plan: plan.name })
+            : t('group_plan_tooltip', { plan: friendlyPlanName })
         }
         id="group-plan"
         overlayProps={{ placement: 'bottom' }}
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx
index f0870ac12a..e4723cf718 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/individual-plan.tsx
@@ -14,21 +14,25 @@ function IndividualPlan({
   remainingTrialDays,
 }: IndividualPlanProps) {
   const { t } = useTranslation()
+  const planNameComponent = <strong translate="no" />
   const currentPlanLabel =
     remainingTrialDays >= 0 ? (
       remainingTrialDays === 1 ? (
-        <Trans i18nKey="trial_last_day" components={{ b: <strong /> }} />
+        <Trans i18nKey="trial_last_day" components={{ b: planNameComponent }} />
       ) : (
         <Trans
           i18nKey="trial_remaining_days"
-          components={{ b: <strong /> }}
+          components={{ b: planNameComponent }}
           values={{ days: remainingTrialDays }}
           shouldUnescape
           tOptions={{ interpolation: { escapeValue: true } }}
         />
       )
     ) : (
-      <Trans i18nKey="premium_plan_label" components={{ b: <strong /> }} />
+      <Trans
+        i18nKey="premium_plan_label"
+        components={{ b: planNameComponent }}
+      />
     )
 
   return (
diff --git a/services/web/frontend/js/features/project-list/components/current-plan-widget/paused-plan.tsx b/services/web/frontend/js/features/project-list/components/current-plan-widget/paused-plan.tsx
index a501731b18..f282800c61 100644
--- a/services/web/frontend/js/features/project-list/components/current-plan-widget/paused-plan.tsx
+++ b/services/web/frontend/js/features/project-list/components/current-plan-widget/paused-plan.tsx
@@ -13,7 +13,7 @@ function PausedPlan({ subscriptionPageUrl }: PausedPlanProps) {
       i18nKey="your_premium_plan_is_paused"
       components={[
         // eslint-disable-next-line react/jsx-key
-        <strong />,
+        <strong translate="no" />,
       ]}
     />
   )
diff --git a/services/web/frontend/js/features/project-list/components/dropdown/actions-dropdown.tsx b/services/web/frontend/js/features/project-list/components/dropdown/actions-dropdown.tsx
index 058f0319ce..7b2bd909f8 100644
--- a/services/web/frontend/js/features/project-list/components/dropdown/actions-dropdown.tsx
+++ b/services/web/frontend/js/features/project-list/components/dropdown/actions-dropdown.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 import {
   Dropdown,
   DropdownItem,
diff --git a/services/web/frontend/js/features/project-list/components/dropdown/sort-by-dropdown.tsx b/services/web/frontend/js/features/project-list/components/dropdown/sort-by-dropdown.tsx
index 0d23aebf57..db92561728 100644
--- a/services/web/frontend/js/features/project-list/components/dropdown/sort-by-dropdown.tsx
+++ b/services/web/frontend/js/features/project-list/components/dropdown/sort-by-dropdown.tsx
@@ -12,7 +12,7 @@ import {
   DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
 
-function Item({ onClick, text, iconType, screenReaderText }: SortBtnProps) {
+function Item({ onClick, text, iconType }: SortBtnProps) {
   return (
     <DropdownItem
       as="button"
diff --git a/services/web/frontend/js/features/project-list/components/modals/create-tag-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/create-tag-modal.tsx
index eac01b918a..51d44865a9 100644
--- a/services/web/frontend/js/features/project-list/components/modals/create-tag-modal.tsx
+++ b/services/web/frontend/js/features/project-list/components/modals/create-tag-modal.tsx
@@ -55,7 +55,7 @@ export default function CreateTagModal({
   }, [runAsync, tagName, selectedColor, onCreate])
 
   const handleSubmit = useCallback(
-    e => {
+    (e: React.FormEvent) => {
       e.preventDefault()
       runCreateTag()
     },
@@ -85,7 +85,7 @@ export default function CreateTagModal({
       </OLModalHeader>
 
       <OLModalBody>
-        <OLForm id="create-tag-modal-form" onSubmit={handleSubmit}>
+        <OLForm onSubmit={handleSubmit}>
           <OLFormGroup controlId="create-tag-modal-form">
             <OLFormLabel>{t('new_tag_name')}</OLFormLabel>
             <OLFormControl
diff --git a/services/web/frontend/js/features/project-list/components/modals/edit-tag-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/edit-tag-modal.tsx
index e7aa93e649..4f32c668d2 100644
--- a/services/web/frontend/js/features/project-list/components/modals/edit-tag-modal.tsx
+++ b/services/web/frontend/js/features/project-list/components/modals/edit-tag-modal.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useState } from 'react'
+import { FormEvent, useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Tag } from '../../../../../../app/src/Features/Tags/types'
 import useAsync from '../../../../shared/hooks/use-async'
@@ -56,7 +56,7 @@ export function EditTagModal({ id, tag, onEdit, onClose }: EditTagModalProps) {
   )
 
   const handleSubmit = useCallback(
-    e => {
+    (e: FormEvent) => {
       e.preventDefault()
       if (tag) {
         runEditTag(tag._id)
diff --git a/services/web/frontend/js/features/project-list/components/modals/manage-tag-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/manage-tag-modal.tsx
index ceec6de972..9c1445efe9 100644
--- a/services/web/frontend/js/features/project-list/components/modals/manage-tag-modal.tsx
+++ b/services/web/frontend/js/features/project-list/components/modals/manage-tag-modal.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useState } from 'react'
+import { FormEvent, useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import useAsync from '../../../../shared/hooks/use-async'
 import { useRefWithAutoFocus } from '../../../../shared/hooks/use-ref-with-auto-focus'
@@ -73,7 +73,7 @@ export function ManageTagModal({
   )
 
   const handleSubmit = useCallback(
-    e => {
+    (e: FormEvent) => {
       e.preventDefault()
       if (tag) {
         runUpdateTag(tag._id)
diff --git a/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx b/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx
index 9b4e48673e..e970c793d3 100644
--- a/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx
+++ b/services/web/frontend/js/features/project-list/components/modals/rename-project-modal.tsx
@@ -1,4 +1,11 @@
-import { memo, useCallback, useEffect, useMemo, useState } from 'react'
+import {
+  FormEvent,
+  memo,
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from 'react'
 import { useTranslation } from 'react-i18next'
 import * as eventTracking from '../../../../infrastructure/event-tracking'
 import { Project } from '../../../../../../types/project/dashboard/api'
@@ -58,7 +65,7 @@ function RenameProjectModal({
   }, [project.name])
 
   const handleSubmit = useCallback(
-    event => {
+    (event: FormEvent) => {
       event.preventDefault()
 
       if (!isValid) return
diff --git a/services/web/frontend/js/features/project-list/components/new-project-button/modal-content-new-project-form.tsx b/services/web/frontend/js/features/project-list/components/new-project-button/modal-content-new-project-form.tsx
index 13e0458127..5f03416a39 100644
--- a/services/web/frontend/js/features/project-list/components/new-project-button/modal-content-new-project-form.tsx
+++ b/services/web/frontend/js/features/project-list/components/new-project-button/modal-content-new-project-form.tsx
@@ -38,6 +38,7 @@ function ModalContentNewProjectForm({ onCancel, template = 'none' }: Props) {
   const { t } = useTranslation()
   const { autoFocusedRef } = useRefWithAutoFocus<HTMLInputElement>()
   const [projectName, setProjectName] = useState('')
+  const [redirecting, setRedirecting] = useState(false)
   const { isLoading, isError, error, runAsync } = useAsync<NewProjectData>()
   const location = useLocation()
 
@@ -52,6 +53,8 @@ function ModalContentNewProjectForm({ onCancel, template = 'none' }: Props) {
     )
       .then(data => {
         if (data.project_id) {
+          // prevents clicking on create again between async load of next page and pending state being finished
+          setRedirecting(true)
           location.assign(`/project/${data.project_id}`)
         }
       })
@@ -100,7 +103,7 @@ function ModalContentNewProjectForm({ onCancel, template = 'none' }: Props) {
         <OLButton
           variant="primary"
           onClick={createNewProject}
-          disabled={projectName === '' || isLoading}
+          disabled={projectName === '' || isLoading || redirecting}
           isLoading={isLoading}
         >
           {t('create')}
diff --git a/services/web/frontend/js/features/project-list/components/notifications/accessibility-survey-banner.tsx b/services/web/frontend/js/features/project-list/components/notifications/accessibility-survey-banner.tsx
index 0cbf782262..a77dd450f7 100644
--- a/services/web/frontend/js/features/project-list/components/notifications/accessibility-survey-banner.tsx
+++ b/services/web/frontend/js/features/project-list/components/notifications/accessibility-survey-banner.tsx
@@ -27,7 +27,7 @@ function AccessibilitySurveyBanner() {
 
   return (
     <Notification
-      className="sr-only"
+      className="visually-hidden"
       type="info"
       onDismiss={handleClose}
       content={<p>{t('help_improve_screen_reader_fill_out_this_survey')}</p>}
diff --git a/services/web/frontend/js/features/project-list/components/notifications/ai-assist-banner.tsx b/services/web/frontend/js/features/project-list/components/notifications/ai-assist-banner.tsx
new file mode 100644
index 0000000000..dd6d0a0e97
--- /dev/null
+++ b/services/web/frontend/js/features/project-list/components/notifications/ai-assist-banner.tsx
@@ -0,0 +1,128 @@
+import { memo, useCallback, useEffect } from 'react'
+import Notification from './notification'
+import { useTranslation } from 'react-i18next'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import { sendMB } from '@/infrastructure/event-tracking'
+import sparkle from '@/shared/svgs/sparkle-2-stars.svg'
+import { useSplitTest } from '@/shared/context/split-test-context'
+import { useProjectListContext } from '../../context/project-list-context'
+import getMeta from '@/utils/meta'
+import usePersistedState from '@/shared/hooks/use-persisted-state'
+
+function AiAssistBanner() {
+  const { title, description, cta } = useTitleDescription()
+  const { totalProjectsCount } = useProjectListContext()
+  const [dismissed, setDismissed] = usePersistedState(
+    'ai-assist-notification-banner-dismissed',
+    false
+  )
+  const { variant } = useSplitTest('ai-assist-notification')
+  const { t } = useTranslation()
+
+  useEffect(() => {
+    if (!dismissed) {
+      sendMB('promo-prompt', {
+        location: 'dashboard-banner',
+        name: 'ai-assist',
+        variant,
+      })
+    }
+  }, [dismissed, variant])
+
+  const handleClose = useCallback(() => {
+    sendMB('promo-dismiss', {
+      location: 'dashboard-banner',
+      name: 'ai-assist',
+      variant,
+    })
+    setDismissed(true)
+  }, [setDismissed, variant])
+
+  const handleUpgradeClick = useCallback(() => {
+    sendMB('promo-click', {
+      location: 'dashboard-banner',
+      name: 'ai-assist',
+      variant,
+      type: 'click-upgrade',
+    })
+  }, [variant])
+
+  const handleLearnMoreClick = useCallback(() => {
+    sendMB('promo-click', {
+      location: 'dashboard-banner',
+      name: 'ai-assist',
+      type: 'click-learn-more',
+      variant,
+    })
+  }, [variant])
+
+  if (
+    !title ||
+    dismissed ||
+    totalProjectsCount === 0 ||
+    !getMeta('ol-showAiAssistNotification')
+  ) {
+    return null
+  }
+
+  return (
+    <Notification
+      type="offer"
+      customIcon={<img aria-hidden="true" alt="" src={sparkle} width={32} />}
+      iconPlacement="center"
+      title={title}
+      onDismiss={handleClose}
+      content={
+        <p>
+          {description}{' '}
+          <a onClick={handleLearnMoreClick} href="/about/ai-features">
+            {t('learn_more')}
+          </a>
+          .
+        </p>
+      }
+      action={
+        <OLButton
+          variant="secondary"
+          href="/user/subscription/plans#ai-assist"
+          onClick={handleUpgradeClick}
+        >
+          {cta}
+        </OLButton>
+      }
+    />
+  )
+}
+
+function useTitleDescription() {
+  const { variant } = useSplitTest('ai-assist-notification')
+  const { t } = useTranslation()
+
+  switch (variant) {
+    case 'work-smarter':
+      return {
+        title: t('work_smarter_with_ai_assist'),
+        description: t('work_smarter_with_ai_assist_description'),
+        cta: t('add_ai_assist'),
+      }
+    case 'discover-toolkit':
+      return {
+        title: t('discover_research_writing_toolkit'),
+        description: t('discover_research_writing_toolkit_description'),
+        cta: t('add_ai_assist'),
+      }
+    case 'write-smarter':
+      return {
+        title: t('write_smarter_right_now'),
+        description: t('write_smarter_right_now_description'),
+        cta: t('add_ai_assist'),
+      }
+    default:
+      return {
+        title: null,
+        description: null,
+        cta: null,
+      }
+  }
+}
+export default memo(AiAssistBanner)
diff --git a/services/web/frontend/js/features/project-list/components/notifications/groups/confirm-email.tsx b/services/web/frontend/js/features/project-list/components/notifications/groups/confirm-email.tsx
index ca73d87a0c..93386ff9a3 100644
--- a/services/web/frontend/js/features/project-list/components/notifications/groups/confirm-email.tsx
+++ b/services/web/frontend/js/features/project-list/components/notifications/groups/confirm-email.tsx
@@ -1,16 +1,10 @@
 import { Trans, useTranslation } from 'react-i18next'
 import Notification from '../notification'
 import getMeta from '../../../../../utils/meta'
-import useAsync from '../../../../../shared/hooks/use-async'
 import { useProjectListContext } from '../../../context/project-list-context'
-import {
-  postJSON,
-  getUserFacingMessage,
-} from '../../../../../infrastructure/fetch-json'
 import { UserEmailData } from '../../../../../../../types/user-email'
-import { debugConsole } from '@/utils/debugging'
-import OLButton from '@/features/ui/components/ol/ol-button'
-import LoadingSpinner from '@/shared/components/loading-spinner'
+import ResendConfirmationCodeModal from '@/features/settings/components/emails/resend-confirmation-code-modal'
+import { ReactNode, useState } from 'react'
 
 const ssoAvailable = ({ samlProviderId, affiliation }: UserEmailData) => {
   const { hasSamlFeature, hasSamlBeta } = getMeta('ol-ExposedSettings')
@@ -79,6 +73,12 @@ const EMAIL_DELETION_SCHEDULE = {
   '2025-09-03': '2025-03-03',
 }
 
+const dateOptions: Intl.DateTimeFormatOptions = {
+  month: 'long',
+  day: 'numeric',
+  year: 'numeric',
+}
+
 // Emails that remain unconfirmed after 90 days will be removed from the account
 function getEmailDeletionDate(emailData: UserEmailData, signUpDate: string) {
   if (emailData.default) return false
@@ -101,9 +101,9 @@ function getEmailDeletionDate(emailData: UserEmailData, signUpDate: string) {
       )
       if (currentDate >= notificationStartDate) {
         if (currentDate > emailDeletionDate) {
-          return new Date().toLocaleDateString()
+          return new Date().toLocaleDateString(undefined, dateOptions)
         }
-        return emailDeletionDate.toLocaleDateString()
+        return emailDeletionDate.toLocaleDateString(undefined, dateOptions)
       }
     }
   }
@@ -114,12 +114,17 @@ function getEmailDeletionDate(emailData: UserEmailData, signUpDate: string) {
 function ConfirmEmailNotification({
   userEmail,
   signUpDate,
+  setIsLoading,
+  isLoading,
 }: {
   userEmail: UserEmailData
   signUpDate: string
+  setIsLoading: (loading: boolean) => void
+  isLoading: boolean
 }) {
   const { t } = useTranslation()
-  const { isLoading, isSuccess, isError, error, runAsync } = useAsync()
+  const [isSuccess, setIsSuccess] = useState(false)
+  const emailAddress = userEmail.email
 
   // We consider secondary emails added on or after 22.03.2024 to be trusted for account recovery
   // https://github.com/overleaf/internal/pull/17572
@@ -127,6 +132,7 @@ function ConfirmEmailNotification({
   const emailDeletionDate = getEmailDeletionDate(userEmail, signUpDate)
   const isPrimary = userEmail.default
 
+  const isEmailConfirmed = !!userEmail.lastConfirmedAt
   const isEmailTrusted =
     userEmail.lastConfirmedAt &&
     new Date(userEmail.lastConfirmedAt) >= emailTrustCutoffDate
@@ -134,163 +140,97 @@ function ConfirmEmailNotification({
   const shouldShowCommonsNotification =
     emailHasLicenceAfterConfirming(userEmail) && isOnFreeOrIndividualPlan()
 
-  const handleResendConfirmationEmail = ({ email }: UserEmailData) => {
-    runAsync(
-      postJSON('/user/emails/resend_confirmation', {
-        body: { email },
-      })
-    ).catch(debugConsole.error)
-  }
-
   if (isSuccess) {
     return null
   }
 
-  if (!userEmail.lastConfirmedAt && !shouldShowCommonsNotification) {
-    return (
-      <Notification
-        type="warning"
-        content={
-          <div data-testid="pro-notification-body">
-            {isLoading ? (
-              <div data-testid="loading-resending-confirmation-email">
-                <LoadingSpinner
-                  loadingText={t('resending_confirmation_email')}
-                />
-              </div>
-            ) : isError ? (
-              <div aria-live="polite">{getUserFacingMessage(error)}</div>
-            ) : (
-              <>
-                <p>
-                  {isPrimary
-                    ? t('please_confirm_primary_email', {
-                        emailAddress: userEmail.email,
-                      })
-                    : t('please_confirm_secondary_email', {
-                        emailAddress: userEmail.email,
-                      })}
-                </p>
-                {emailDeletionDate && (
-                  <p>
-                    {t('email_remove_by_date', { date: emailDeletionDate })}
-                  </p>
-                )}
-              </>
-            )}
-          </div>
-        }
-        action={
-          <>
-            <OLButton
-              variant="secondary"
-              onClick={() => handleResendConfirmationEmail(userEmail)}
-            >
-              {t('resend_confirmation_email')}
-            </OLButton>
-            <OLButton variant="link" href="/user/settings">
-              {isPrimary
-                ? t('change_primary_email')
-                : t('remove_email_address')}
-            </OLButton>
-          </>
-        }
-      />
-    )
-  }
+  const confirmationCodeModal = (
+    <ResendConfirmationCodeModal
+      email={emailAddress}
+      onSuccess={() => setIsSuccess(true)}
+      setGroupLoading={setIsLoading}
+      groupLoading={isLoading}
+      triggerVariant="secondary"
+    />
+  )
 
-  if (!isEmailTrusted && !isPrimary && !shouldShowCommonsNotification) {
-    return (
-      <Notification
-        type="warning"
-        content={
-          <div data-testid="not-trusted-notification-body">
-            {isLoading ? (
-              <div data-testid="error-id">
-                <LoadingSpinner
-                  loadingText={t('resending_confirmation_email')}
-                />
-              </div>
-            ) : isError ? (
-              <div aria-live="polite">{getUserFacingMessage(error)}</div>
-            ) : (
-              <>
-                <p>
-                  <b>{t('confirm_secondary_email')}</b>
-                </p>
-                <p>
-                  {t('reconfirm_secondary_email', {
-                    emailAddress: userEmail.email,
-                  })}
-                </p>
-                <p>{t('ensure_recover_account')}</p>
-              </>
-            )}
-          </div>
-        }
-        action={
-          <>
-            <OLButton
-              variant="secondary"
-              onClick={() => handleResendConfirmationEmail(userEmail)}
-            >
-              {t('resend_confirmation_email')}
-            </OLButton>
-            <OLButton
-              variant="link"
-              href="/user/settings"
-              style={{ textDecoration: 'underline' }}
-            >
-              {t('remove_email_address')}
-            </OLButton>
-          </>
-        }
-      />
-    )
-  }
+  let notificationType: 'info' | 'warning' | undefined
+  let notificationBody: ReactNode | undefined
 
-  // Only show the notification if a) a commons license is available and b) the
-  // user is on a free or individual plan. Users on a group or Commons plan
-  // already have premium features.
   if (shouldShowCommonsNotification) {
+    notificationType = 'info'
+    notificationBody = (
+      <>
+        <Trans
+          i18nKey="one_step_away_from_professional_features"
+          components={[<strong />]} // eslint-disable-line react/jsx-key
+        />
+        <br />
+        <Trans
+          i18nKey="institution_has_overleaf_subscription"
+          values={{
+            institutionName: userEmail.affiliation?.institution.name,
+            emailAddress,
+          }}
+          shouldUnescape
+          tOptions={{ interpolation: { escapeValue: true } }}
+          components={[<strong />]} // eslint-disable-line react/jsx-key
+        />
+      </>
+    )
+  } else if (!isEmailConfirmed) {
+    notificationType = 'warning'
+    notificationBody = (
+      <>
+        <p>
+          {isPrimary ? (
+            <Trans
+              i18nKey="please_confirm_primary_email_or_edit"
+              shouldUnescape
+              tOptions={{ interpolation: { escapeValue: true } }}
+              values={{ emailAddress }}
+              components={[
+                // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
+                <a href="/user/settings" />,
+              ]}
+            />
+          ) : (
+            <Trans
+              i18nKey="please_confirm_secondary_email_or_edit"
+              shouldUnescape
+              tOptions={{ interpolation: { escapeValue: true } }}
+              values={{ emailAddress }}
+              components={[
+                // eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key
+                <a href="/user/settings" />,
+              ]}
+            />
+          )}
+        </p>
+        {emailDeletionDate && (
+          <p>{t('email_remove_by_date', { date: emailDeletionDate })}</p>
+        )}
+      </>
+    )
+  } else if (!isEmailTrusted && !isPrimary) {
+    notificationType = 'warning'
+    notificationBody = (
+      <>
+        <p>
+          <b>{t('confirm_secondary_email')}</b>
+        </p>
+        <p>{t('reconfirm_secondary_email', { emailAddress })}</p>
+        <p>{t('ensure_recover_account')}</p>
+      </>
+    )
+  }
+
+  if (notificationType) {
     return (
       <Notification
-        type="info"
-        content={
-          <div data-testid="notification-body">
-            {isLoading ? (
-              <LoadingSpinner loadingText={t('resending_confirmation_email')} />
-            ) : isError ? (
-              <div aria-live="polite">{getUserFacingMessage(error)}</div>
-            ) : (
-              <>
-                <Trans
-                  i18nKey="one_step_away_from_professional_features"
-                  components={[<strong />]} // eslint-disable-line react/jsx-key
-                />
-                <br />
-                <Trans
-                  i18nKey="institution_has_overleaf_subscription"
-                  values={{
-                    institutionName: userEmail.affiliation?.institution.name,
-                    emailAddress: userEmail.email,
-                  }}
-                  shouldUnescape
-                  tOptions={{ interpolation: { escapeValue: true } }}
-                  components={[<strong />]} // eslint-disable-line react/jsx-key
-                />
-              </>
-            )}
-          </div>
-        }
-        action={
-          <OLButton
-            variant="secondary"
-            onClick={() => handleResendConfirmationEmail(userEmail)}
-          >
-            {t('resend_email')}
-          </OLButton>
-        }
+        type={notificationType}
+        content={notificationBody}
+        action={confirmationCodeModal}
       />
     )
   }
@@ -302,6 +242,7 @@ function ConfirmEmail() {
   const { totalProjectsCount } = useProjectListContext()
   const userEmails = getMeta('ol-userEmails') || []
   const signUpDate = getMeta('ol-user')?.signUpDate
+  const [isLoading, setIsLoading] = useState(false)
 
   if (!totalProjectsCount || !userEmails.length || !signUpDate) {
     return null
@@ -315,6 +256,8 @@ function ConfirmEmail() {
             key={`confirm-email-${userEmail.email}`}
             userEmail={userEmail}
             signUpDate={signUpDate}
+            isLoading={isLoading}
+            setIsLoading={setIsLoading}
           />
         ) : null
       })}
diff --git a/services/web/frontend/js/features/project-list/components/notifications/groups/group-invitation/hooks/use-group-invitation-notification.tsx b/services/web/frontend/js/features/project-list/components/notifications/groups/group-invitation/hooks/use-group-invitation-notification.tsx
index 6c25513124..f62571b722 100644
--- a/services/web/frontend/js/features/project-list/components/notifications/groups/group-invitation/hooks/use-group-invitation-notification.tsx
+++ b/services/web/frontend/js/features/project-list/components/notifications/groups/group-invitation/hooks/use-group-invitation-notification.tsx
@@ -9,6 +9,7 @@ import type { NotificationGroupInvitation } from '../../../../../../../../../typ
 import useAsync from '../../../../../../../shared/hooks/use-async'
 import {
   FetchError,
+  getJSON,
   postJSON,
   putJSON,
 } from '../../../../../../../infrastructure/fetch-json'
@@ -43,60 +44,65 @@ type UseGroupInvitationNotificationReturnType = {
 export function useGroupInvitationNotification(
   notification: NotificationGroupInvitation
 ): UseGroupInvitationNotificationReturnType {
-  const {
-    _id: notificationId,
-    messageOpts: { token, managedUsersEnabled },
-  } = notification
-
+  const { _id: notificationId } = notification
   const [groupInvitationStatus, setGroupInvitationStatus] =
     useState<GroupInvitationStatus>(GroupInvitationStatus.Idle)
-  const { runAsync, isLoading: isAcceptingInvitation } = useAsync<
-    never,
-    FetchError
-  >()
+  const { runAsync, isLoading } = useAsync<void, FetchError>()
+  const { runAsync: runAsyncNotification, isLoading: isLoadingNotification } =
+    useAsync<NotificationGroupInvitation, FetchError>()
   const location = useLocation()
   const { handleDismiss } = useAsyncDismiss()
 
-  const hasIndividualRecurlySubscription = getMeta(
-    'ol-hasIndividualRecurlySubscription'
+  const hasIndividualPaidSubscription = getMeta(
+    'ol-hasIndividualPaidSubscription'
   )
 
   useEffect(() => {
-    if (hasIndividualRecurlySubscription) {
+    if (hasIndividualPaidSubscription) {
       setGroupInvitationStatus(
         GroupInvitationStatus.CancelIndividualSubscription
       )
     } else {
       setGroupInvitationStatus(GroupInvitationStatus.AskToJoin)
     }
-  }, [hasIndividualRecurlySubscription])
+  }, [hasIndividualPaidSubscription])
 
   const acceptGroupInvite = useCallback(() => {
-    if (managedUsersEnabled) {
-      location.assign(`/subscription/invites/${token}/`)
-    } else {
-      runAsync(
-        putJSON(`/subscription/invites/${token}/`, {
-          body: {
-            _csrf: getMeta('ol-csrfToken'),
-          },
-        })
-      )
-        .then(() => {
-          setGroupInvitationStatus(GroupInvitationStatus.SuccessfullyJoined)
-        })
-        .catch(err => {
-          debugConsole.error(err)
-          setGroupInvitationStatus(GroupInvitationStatus.Error)
-        })
-        .finally(() => {
-          // remove notification automatically in the browser
-          window.setTimeout(() => {
-            setGroupInvitationStatus(GroupInvitationStatus.NotificationIsHidden)
-          }, SUCCESSFUL_NOTIF_TIME_BEFORE_HIDDEN)
-        })
-    }
-  }, [runAsync, token, location, managedUsersEnabled])
+    // Fetch the latest notification data to ensure it's up-to-date
+    runAsyncNotification(getJSON(`/user/notification/${notificationId}`))
+      .then(notification => {
+        const {
+          messageOpts: { token, managedUsersEnabled },
+        } = notification
+        if (managedUsersEnabled) {
+          location.assign(`/subscription/invites/${token}/`)
+        } else {
+          runAsync(
+            putJSON(`/subscription/invites/${token}/`, {
+              body: {
+                _csrf: getMeta('ol-csrfToken'),
+              },
+            })
+          )
+            .then(() => {
+              setGroupInvitationStatus(GroupInvitationStatus.SuccessfullyJoined)
+            })
+            .catch(err => {
+              debugConsole.error(err)
+              setGroupInvitationStatus(GroupInvitationStatus.Error)
+            })
+            .finally(() => {
+              // remove notification automatically in the browser
+              window.setTimeout(() => {
+                setGroupInvitationStatus(
+                  GroupInvitationStatus.NotificationIsHidden
+                )
+              }, SUCCESSFUL_NOTIF_TIME_BEFORE_HIDDEN)
+            })
+        }
+      })
+      .catch(debugConsole.error)
+  }, [runAsync, runAsyncNotification, notificationId, location])
 
   const cancelPersonalSubscription = useCallback(() => {
     setGroupInvitationStatus(GroupInvitationStatus.AskToJoin)
@@ -114,6 +120,8 @@ export function useGroupInvitationNotification(
     setGroupInvitationStatus(GroupInvitationStatus.NotificationIsHidden)
   }, [])
 
+  const isAcceptingInvitation = isLoadingNotification || isLoading
+
   return {
     isAcceptingInvitation,
     groupInvitationStatus,
diff --git a/services/web/frontend/js/features/project-list/components/notifications/notification.tsx b/services/web/frontend/js/features/project-list/components/notifications/notification.tsx
index b8c399d2f2..46b53da673 100644
--- a/services/web/frontend/js/features/project-list/components/notifications/notification.tsx
+++ b/services/web/frontend/js/features/project-list/components/notifications/notification.tsx
@@ -3,7 +3,14 @@ import NewNotification from '@/shared/components/notification'
 
 type NotificationProps = Pick<
   React.ComponentProps<typeof NewNotification>,
-  'type' | 'action' | 'content' | 'onDismiss' | 'className' | 'title'
+  | 'type'
+  | 'action'
+  | 'content'
+  | 'onDismiss'
+  | 'className'
+  | 'title'
+  | 'customIcon'
+  | 'iconPlacement'
 >
 
 function Notification({ className, ...props }: NotificationProps) {
diff --git a/services/web/frontend/js/features/project-list/components/notifications/user-notifications.tsx b/services/web/frontend/js/features/project-list/components/notifications/user-notifications.tsx
index ef1fd85088..89570b9240 100644
--- a/services/web/frontend/js/features/project-list/components/notifications/user-notifications.tsx
+++ b/services/web/frontend/js/features/project-list/components/notifications/user-notifications.tsx
@@ -13,6 +13,7 @@ import {
   DeprecatedBrowser,
   isDeprecatedBrowser,
 } from '@/shared/components/deprecated-browser'
+import AiAssistBanner from './ai-assist-banner'
 
 const [enrollmentNotificationModule] = importOverleafModules(
   'managedGroupSubscriptionEnrollmentNotification'
@@ -52,6 +53,7 @@ function UserNotifications() {
         <GroupsAndEnterpriseBanner />
         {USGovBanner && <USGovBanner />}
 
+        <AiAssistBanner />
         <AccessibilitySurveyBanner />
 
         {isDeprecatedBrowser() && <DeprecatedBrowser />}
diff --git a/services/web/frontend/js/features/project-list/components/project-list-default.tsx b/services/web/frontend/js/features/project-list/components/project-list-default.tsx
deleted file mode 100644
index 307e11e490..0000000000
--- a/services/web/frontend/js/features/project-list/components/project-list-default.tsx
+++ /dev/null
@@ -1,119 +0,0 @@
-import { useProjectListContext } from '../context/project-list-context'
-import { useTranslation } from 'react-i18next'
-import CurrentPlanWidget from './current-plan-widget/current-plan-widget'
-import NewProjectButton from './new-project-button'
-import ProjectListTable from './table/project-list-table'
-import SurveyWidget from './survey-widget'
-import UserNotifications from './notifications/user-notifications'
-import SearchForm from './search-form'
-import ProjectsDropdown from './dropdown/projects-dropdown'
-import SortByDropdown from './dropdown/sort-by-dropdown'
-import ProjectTools from './table/project-tools/project-tools'
-import ProjectListTitle from './title/project-list-title'
-import Sidebar from './sidebar/sidebar'
-import LoadMore from './load-more'
-import OLCol from '@/features/ui/components/ol/ol-col'
-import OLRow from '@/features/ui/components/ol/ol-row'
-import { TableContainer } from '@/features/ui/components/bootstrap-5/table'
-import DashApiError from '@/features/project-list/components/dash-api-error'
-
-export default function ProjectListDefault() {
-  const { t } = useTranslation()
-  const {
-    error,
-    searchText,
-    setSearchText,
-    selectedProjects,
-    filter,
-    tags,
-    selectedTagId,
-  } = useProjectListContext()
-
-  const selectedTag = tags.find(tag => tag._id === selectedTagId)
-
-  const tableTopArea = (
-    <div className="pt-2 pb-3 d-md-none d-flex gap-2">
-      <NewProjectButton
-        id="new-project-button-projects-table"
-        showAddAffiliationWidget
-      />
-      <SearchForm
-        inputValue={searchText}
-        setInputValue={setSearchText}
-        filter={filter}
-        selectedTag={selectedTag}
-        className="overflow-hidden flex-grow-1"
-      />
-    </div>
-  )
-
-  return (
-    <>
-      <Sidebar />
-      <div className="project-list-main-react">
-        {error ? <DashApiError /> : ''}
-        <OLRow>
-          <OLCol>
-            <UserNotifications />
-          </OLCol>
-        </OLRow>
-        <div className="project-list-header-row">
-          <ProjectListTitle
-            filter={filter}
-            selectedTag={selectedTag}
-            selectedTagId={selectedTagId}
-            className="text-truncate d-none d-md-block"
-          />
-          <div className="project-tools">
-            <div className="d-none d-md-block">
-              {selectedProjects.length === 0 ? (
-                <CurrentPlanWidget />
-              ) : (
-                <ProjectTools />
-              )}
-            </div>
-            <div className="d-md-none">
-              <CurrentPlanWidget />
-            </div>
-          </div>
-        </div>
-        <OLRow className="d-none d-md-block">
-          <OLCol lg={7}>
-            <SearchForm
-              inputValue={searchText}
-              setInputValue={setSearchText}
-              filter={filter}
-              selectedTag={selectedTag}
-            />
-          </OLCol>
-        </OLRow>
-        <div className="project-list-sidebar-survey-wrapper d-md-none">
-          <SurveyWidget />
-        </div>
-        <div className="mt-1 d-md-none">
-          <div
-            role="toolbar"
-            className="projects-toolbar"
-            aria-label={t('projects')}
-          >
-            <ProjectsDropdown />
-            <SortByDropdown />
-          </div>
-        </div>
-        <OLRow className="row-spaced">
-          <OLCol>
-            <TableContainer bordered>
-              {tableTopArea}
-              <ProjectListTable />
-            </TableContainer>
-          </OLCol>
-        </OLRow>
-        <OLRow className="row-spaced">
-          <OLCol>
-            <LoadMore />
-          </OLCol>
-        </OLRow>
-      </div>
-    </>
-  )
-}
diff --git a/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx b/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
index a9870f2a30..07319ffaf1 100644
--- a/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
+++ b/services/web/frontend/js/features/project-list/components/project-list-ds-nav.tsx
@@ -16,13 +16,15 @@ import { TableContainer } from '@/features/ui/components/bootstrap-5/table'
 import DashApiError from '@/features/project-list/components/dash-api-error'
 import getMeta from '@/utils/meta'
 import DefaultNavbar from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
-import FatFooter from '@/features/ui/components/bootstrap-5/footer/fat-footer'
+import Footer from '@/features/ui/components/bootstrap-5/footer/footer'
 import SidebarDsNav from '@/features/project-list/components/sidebar/sidebar-ds-nav'
 import SystemMessages from '@/shared/components/system-messages'
 import overleafLogo from '@/shared/svgs/overleaf-a-ds-solution-mallard.svg'
+import CookieBanner from '@/shared/components/cookie-banner'
 
 export function ProjectListDsNav() {
   const navbarProps = getMeta('ol-navbar')
+  const footerProps = getMeta('ol-footer')
   const { t } = useTranslation()
   const {
     error,
@@ -54,7 +56,12 @@ export function ProjectListDsNav() {
 
   return (
     <div className="project-ds-nav-page website-redesign">
-      <DefaultNavbar {...navbarProps} customLogo={overleafLogo} showCloseIcon />
+      <SystemMessages />
+      <DefaultNavbar
+        {...navbarProps}
+        overleafLogo={overleafLogo}
+        showCloseIcon
+      />
       <main className="project-list-wrapper">
         <SidebarDsNav />
         <div className="project-ds-nav-content-and-messages">
@@ -117,11 +124,9 @@ export function ProjectListDsNav() {
                 </div>
               </div>
             </div>
-            <FatFooter />
-          </div>
-          <div>
-            <SystemMessages />
+            <Footer {...footerProps} />
           </div>
+          <CookieBanner />
         </div>
       </main>
     </div>
diff --git a/services/web/frontend/js/features/project-list/components/project-list-root.tsx b/services/web/frontend/js/features/project-list/components/project-list-root.tsx
index 5de7d9372e..d5b4257f03 100644
--- a/services/web/frontend/js/features/project-list/components/project-list-root.tsx
+++ b/services/web/frontend/js/features/project-list/components/project-list-root.tsx
@@ -16,12 +16,9 @@ import getMeta from '@/utils/meta'
 import DefaultNavbar from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
 import Footer from '@/features/ui/components/bootstrap-5/footer/footer'
 import WelcomePageContent from '@/features/project-list/components/welcome-page-content'
-import ProjectListDefault from '@/features/project-list/components/project-list-default'
 import { ProjectListDsNav } from '@/features/project-list/components/project-list-ds-nav'
-import {
-  DsNavStyleProvider,
-  hasDsNav,
-} from '@/features/project-list/components/use-is-ds-nav'
+import { DsNavStyleProvider } from '@/features/project-list/components/use-is-ds-nav'
+import CookieBanner from '@/shared/components/cookie-banner'
 
 function ProjectListRoot() {
   const { isReady } = useWaitForI18n()
@@ -87,36 +84,26 @@ function ProjectListPageContent() {
       <LoadingBranded loadProgress={loadProgress} label={t('loading')} />
     )
 
-    if (hasDsNav()) {
-      return loadingComponent
-    } else {
-      return (
-        <DefaultNavbarAndFooter>
-          <div className="loading-container">{loadingComponent}</div>
-        </DefaultNavbarAndFooter>
-      )
-    }
+    return loadingComponent
   }
 
   if (totalProjectsCount === 0) {
     return (
-      <DefaultPageContentWrapper>
-        <WelcomePageContent />
-      </DefaultPageContentWrapper>
-    )
-  } else if (hasDsNav()) {
-    return (
-      <DsNavStyleProvider>
-        <ProjectListDsNav />
-      </DsNavStyleProvider>
-    )
-  } else {
-    return (
-      <DefaultPageContentWrapper>
-        <ProjectListDefault />
-      </DefaultPageContentWrapper>
+      <>
+        <DefaultPageContentWrapper>
+          <WelcomePageContent />
+        </DefaultPageContentWrapper>
+        <CookieBanner />
+      </>
     )
   }
+  return (
+    <DsNavStyleProvider>
+      <ProjectListDsNav />
+    </DsNavStyleProvider>
+  )
 }
 
-export default withErrorBoundary(ProjectListRoot, GenericErrorBoundaryFallback)
+export default withErrorBoundary(ProjectListRoot, () => (
+  <GenericErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/project-list/components/sidebar/sidebar-ds-nav.tsx b/services/web/frontend/js/features/project-list/components/sidebar/sidebar-ds-nav.tsx
index 74bdc5a8e2..e548d994ec 100644
--- a/services/web/frontend/js/features/project-list/components/sidebar/sidebar-ds-nav.tsx
+++ b/services/web/frontend/js/features/project-list/components/sidebar/sidebar-ds-nav.tsx
@@ -5,7 +5,7 @@ import NewProjectButton from '../new-project-button'
 import SidebarFilters from './sidebar-filters'
 import AddAffiliation, { useAddAffiliation } from '../add-affiliation'
 import { usePersistedResize } from '@/shared/hooks/use-resize'
-import { Dropdown } from 'react-bootstrap-5'
+import { Dropdown } from 'react-bootstrap'
 import getMeta from '@/utils/meta'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { useTranslation } from 'react-i18next'
@@ -33,7 +33,7 @@ function SidebarDsNav() {
   const sendMB = useSendProjectListMB()
   const { sessionUser, showSubscriptionLink, items } = getMeta('ol-navbar')
   const helpItem = items.find(
-    item => item.text === 'help'
+    item => item.text === 'help_and_resources'
   ) as NavbarDropdownItemData
   const { containerRef, scrolledUp, scrolledDown } = useScrolled()
   return (
@@ -49,7 +49,11 @@ function SidebarDsNav() {
         id="new-project-button-sidebar"
         className={scrolledDown ? 'show-shadow' : undefined}
       />
-      <div className="project-list-sidebar-scroll" ref={containerRef}>
+      <div
+        className="project-list-sidebar-scroll"
+        ref={containerRef}
+        data-testid="project-list-sidebar-scroll"
+      >
         <SidebarFilters />
         {showAddAffiliationWidget && <hr />}
         <AddAffiliation />
@@ -73,6 +77,7 @@ function SidebarDsNav() {
                   sendMB('menu-expand', { item: 'help', location: 'sidebar' })
                 }
               }}
+              role="menu"
             >
               <Dropdown.Toggle role="menuitem" aria-label={t('help')}>
                 <OLTooltip
@@ -117,6 +122,7 @@ function SidebarDsNav() {
                     })
                   }
                 }}
+                role="menu"
               >
                 <Dropdown.Toggle role="menuitem" aria-label={t('Account')}>
                   <OLTooltip
@@ -152,7 +158,7 @@ function SidebarDsNav() {
             </>
           )}
         </div>
-        <div className="ds-nav-ds-name">
+        <div className="ds-nav-ds-name" translate="no">
           <span>Digital Science</span>
         </div>
       </div>
diff --git a/services/web/frontend/js/features/project-list/components/sidebar/sidebar-filters.tsx b/services/web/frontend/js/features/project-list/components/sidebar/sidebar-filters.tsx
index ad908238ca..ffd3e3c416 100644
--- a/services/web/frontend/js/features/project-list/components/sidebar/sidebar-filters.tsx
+++ b/services/web/frontend/js/features/project-list/components/sidebar/sidebar-filters.tsx
@@ -5,7 +5,6 @@ import {
 } from '../../context/project-list-context'
 import TagsList from './tags-list'
 import ProjectsFilterMenu from '../projects-filter-menu'
-import { hasDsNav } from '@/features/project-list/components/use-is-ds-nav'
 
 type SidebarFilterProps = {
   filter: Filter
@@ -38,11 +37,9 @@ export default function SidebarFilters() {
       <SidebarFilter filter="shared" text={t('shared_with_you')} />
       <SidebarFilter filter="archived" text={t('archived_projects')} />
       <SidebarFilter filter="trashed" text={t('trashed_projects')} />
-      {hasDsNav() && (
-        <li role="none">
-          <hr />
-        </li>
-      )}
+      <li aria-hidden="true">
+        <hr />
+      </li>
       <TagsList />
     </ul>
   )
diff --git a/services/web/frontend/js/features/project-list/components/sidebar/sidebar.tsx b/services/web/frontend/js/features/project-list/components/sidebar/sidebar.tsx
deleted file mode 100644
index 55bab83261..0000000000
--- a/services/web/frontend/js/features/project-list/components/sidebar/sidebar.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import NewProjectButton from '../new-project-button'
-import SidebarFilters from './sidebar-filters'
-import AddAffiliation, { useAddAffiliation } from '../add-affiliation'
-import SurveyWidget from '../survey-widget'
-import { usePersistedResize } from '../../../../shared/hooks/use-resize'
-
-function Sidebar() {
-  const { show: showAddAffiliationWidget } = useAddAffiliation()
-  const { mousePos, getHandleProps, getTargetProps } = usePersistedResize({
-    name: 'project-sidebar',
-  })
-
-  return (
-    <div
-      className="project-list-sidebar-wrapper-react d-none d-md-block"
-      {...getTargetProps({
-        style: {
-          ...(mousePos?.x && { flexBasis: `${mousePos.x}px` }),
-        },
-      })}
-    >
-      <div className="project-list-sidebar-subwrapper">
-        <aside className="project-list-sidebar-react">
-          <NewProjectButton id="new-project-button-sidebar" />
-          <SidebarFilters />
-          {showAddAffiliationWidget && <hr />}
-          <AddAffiliation />
-        </aside>
-        <div className="project-list-sidebar-survey-wrapper">
-          <SurveyWidget />
-        </div>
-      </div>
-      <div
-        {...getHandleProps({
-          style: {
-            position: 'absolute',
-            zIndex: 1,
-            top: 0,
-            right: '-2px',
-            height: '100%',
-            width: '4px',
-          },
-        })}
-      />
-    </div>
-  )
-}
-
-export default Sidebar
diff --git a/services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx b/services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx
index 6b1c0db706..1c6298603c 100644
--- a/services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx
+++ b/services/web/frontend/js/features/project-list/components/sidebar/tags-list.tsx
@@ -1,7 +1,6 @@
 import { sortBy } from 'lodash'
 import { useTranslation } from 'react-i18next'
 import { DotsThreeVertical, Plus, TagSimple } from '@phosphor-icons/react'
-import MaterialIcon from '../../../../shared/components/material-icon'
 import {
   UNCATEGORIZED_KEY,
   useProjectListContext,
@@ -14,7 +13,6 @@ import {
   DropdownMenu,
   DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
-import { hasDsNav } from '@/features/project-list/components/use-is-ds-nav'
 
 export default function TagsList() {
   const { t } = useTranslation()
@@ -42,16 +40,11 @@ export default function TagsList() {
         aria-hidden="true"
         data-testid="organize-projects"
       >
-        {hasDsNav() ? t('organize_tags') : t('organize_projects')}
+        {t('organize_tags')}
       </li>
       <li className="tag">
         <button type="button" className="tag-name" onClick={openCreateTagModal}>
-          {hasDsNav() ? (
-            <Plus weight="bold" />
-          ) : (
-            <MaterialIcon type="add" className="tag-list-icon" />
-          )}
-
+          <Plus weight="bold" />
           <span className="name">{t('new_tag')}</span>
         </button>
       </li>
@@ -64,6 +57,7 @@ export default function TagsList() {
             <button
               type="button"
               className="tag-name"
+              translate="no"
               onClick={e =>
                 handleSelectTag(e as unknown as React.MouseEvent, tag._id)
               }
@@ -73,11 +67,7 @@ export default function TagsList() {
                   color: getTagColor(tag),
                 }}
               >
-                {hasDsNav() ? (
-                  <TagSimple weight="fill" className="tag-list-icon" />
-                ) : (
-                  <MaterialIcon type="label" className="tag-list-icon" />
-                )}
+                <TagSimple weight="fill" className="tag-list-icon" />
               </span>
               <span className="name">
                 {tag.name}{' '}
@@ -93,7 +83,7 @@ export default function TagsList() {
                 id={`${tag._id}-dropdown-toggle`}
                 data-testid="tag-dropdown-toggle"
               >
-                {hasDsNav() && <DotsThreeVertical weight="bold" />}
+                <DotsThreeVertical weight="bold" />
               </DropdownToggle>
               <DropdownMenu className="dropdown-menu-sm-width">
                 <DropdownItem
diff --git a/services/web/frontend/js/features/project-list/components/survey-widget-ds-nav.tsx b/services/web/frontend/js/features/project-list/components/survey-widget-ds-nav.tsx
index 41e76cf797..9264b3288d 100644
--- a/services/web/frontend/js/features/project-list/components/survey-widget-ds-nav.tsx
+++ b/services/web/frontend/js/features/project-list/components/survey-widget-ds-nav.tsx
@@ -1,11 +1,9 @@
 import usePersistedState from '../../../shared/hooks/use-persisted-state'
 import getMeta from '../../../utils/meta'
 import { useCallback } from 'react'
-import classnames from 'classnames'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import { useTranslation } from 'react-i18next'
 import { X } from '@phosphor-icons/react'
-import { useHideDsSurvey } from '@/features/project-list/components/use-is-ds-nav'
 
 export function SurveyWidgetDsNav() {
   const { t } = useTranslation()
@@ -14,7 +12,6 @@ export function SurveyWidgetDsNav() {
     `dismissed-${survey?.name}`,
     false
   )
-  const hideDsSurvey = useHideDsSurvey()
 
   const dismissSurvey = useCallback(() => {
     setDismissedSurvey(true)
@@ -24,19 +21,13 @@ export function SurveyWidgetDsNav() {
     return null
   }
 
-  // Hide the survey for users who have sidebar-navigation-ui-update:
-  // They've had it for months. We don't need their feedback anymore
-  if (hideDsSurvey && survey?.name === 'ds-nav') {
-    return null
-  }
-
   return (
-    <div className={classnames('user-notifications', `survey-${survey.name}`)}>
+    <div className="user-notifications">
       <div className="notification-entry">
         <div role="alert" className="survey-notification">
           <div className="notification-body">
-            <p className="fw-bold fs-6 pe-4">{survey.preText}</p>
-            <p>{survey.linkText}</p>
+            <p className="fw-bold fs-6 pe-4">{survey.title}</p>
+            <p>{survey.text}</p>
             <OLButton
               variant="secondary"
               size="sm"
@@ -44,7 +35,7 @@ export function SurveyWidgetDsNav() {
               target="_blank"
               rel="noreferrer noopener"
             >
-              {t('take_survey')}
+              {survey.cta || t('take_survey')}
             </OLButton>
           </div>
           <OLButton
diff --git a/services/web/frontend/js/features/project-list/components/survey-widget.tsx b/services/web/frontend/js/features/project-list/components/survey-widget.tsx
deleted file mode 100644
index a5604d6b01..0000000000
--- a/services/web/frontend/js/features/project-list/components/survey-widget.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import usePersistedState from '../../../shared/hooks/use-persisted-state'
-import getMeta from '../../../utils/meta'
-import { useCallback } from 'react'
-import Close from '@/shared/components/close'
-
-export default function SurveyWidget() {
-  const survey = getMeta('ol-survey')
-  const [dismissedSurvey, setDismissedSurvey] = usePersistedState(
-    `dismissed-${survey?.name}`,
-    false
-  )
-
-  const dismissSurvey = useCallback(() => {
-    setDismissedSurvey(true)
-  }, [setDismissedSurvey])
-
-  if (!survey?.name || dismissedSurvey) {
-    return null
-  }
-
-  // Short-term hard-coded special case: hide the "DS nav" survey for users on
-  // the default variant
-  if (survey?.name === 'ds-nav') {
-    return null
-  }
-
-  return (
-    <div className="user-notifications">
-      <div className="notification-entry">
-        <div role="alert" className="survey-notification">
-          <div className="notification-body">
-            {survey.preText}&nbsp;
-            <a
-              className="project-list-sidebar-survey-link"
-              href={survey.url}
-              target="_blank"
-              rel="noreferrer noopener"
-            >
-              {survey.linkText}
-            </a>
-          </div>
-          <div className="notification-close notification-close-button-style">
-            <Close variant="dark" onDismiss={() => dismissSurvey()} />
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
diff --git a/services/web/frontend/js/features/project-list/components/table/cells/inline-tags.tsx b/services/web/frontend/js/features/project-list/components/table/cells/inline-tags.tsx
index b3b6fec9cb..26ca42bac3 100644
--- a/services/web/frontend/js/features/project-list/components/table/cells/inline-tags.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/cells/inline-tags.tsx
@@ -57,6 +57,7 @@ function InlineTag({ tag, projectId }: InlineTagProps) {
         onClick: () => handleRemoveTag(tag._id, projectId),
       }}
       className="ms-2"
+      translate="no"
     >
       {tag.name}
     </Tag>
diff --git a/services/web/frontend/js/features/project-list/components/table/cells/last-updated-cell.tsx b/services/web/frontend/js/features/project-list/components/table/cells/last-updated-cell.tsx
index b6417e92d4..6e7ada6a28 100644
--- a/services/web/frontend/js/features/project-list/components/table/cells/last-updated-cell.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/cells/last-updated-cell.tsx
@@ -19,7 +19,7 @@ export default function LastUpdatedCell({ project }: LastUpdatedCellProps) {
       overlayProps={{ placement: 'top', trigger: ['hover', 'focus'] }}
     >
       {project.lastUpdatedBy ? (
-        <span>
+        <span translate="no">
           <LastUpdatedBy
             lastUpdatedBy={project.lastUpdatedBy}
             lastUpdatedDate={lastUpdatedDate}
diff --git a/services/web/frontend/js/features/project-list/components/table/cells/owner-cell.tsx b/services/web/frontend/js/features/project-list/components/table/cells/owner-cell.tsx
index b72350cf14..4795c1da2f 100644
--- a/services/web/frontend/js/features/project-list/components/table/cells/owner-cell.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/cells/owner-cell.tsx
@@ -47,7 +47,7 @@ export default function OwnerCell({ project }: OwnerCellProps) {
 
   return (
     <>
-      {ownerName === 'You' ? t('you') : ownerName}
+      <span translate="no">{ownerName === 'You' ? t('you') : ownerName}</span>
       {project.source === 'token' && (
         <LinkSharingIcon project={project} prependSpace={!!project.owner} />
       )}
diff --git a/services/web/frontend/js/features/project-list/components/table/project-checkbox.tsx b/services/web/frontend/js/features/project-list/components/table/project-checkbox.tsx
index 80a6574e6b..e1aabf8ab0 100644
--- a/services/web/frontend/js/features/project-list/components/table/project-checkbox.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/project-checkbox.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback } from 'react'
+import { ChangeEvent, memo, useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useProjectListContext } from '@/features/project-list/context/project-list-context'
 import OLFormCheckbox from '@/features/ui/components/ol/ol-form-checkbox'
@@ -10,7 +10,7 @@ export const ProjectCheckbox = memo<{ projectId: string; projectName: string }>(
       useProjectListContext()
 
     const handleCheckboxChange = useCallback(
-      event => {
+      (event: ChangeEvent<HTMLInputElement>) => {
         toggleSelectedProject(projectId, event.target.checked)
       },
       [projectId, toggleSelectedProject]
diff --git a/services/web/frontend/js/features/project-list/components/table/project-list-owner-name.tsx b/services/web/frontend/js/features/project-list/components/table/project-list-owner-name.tsx
index 8f056249ab..faff041fa8 100644
--- a/services/web/frontend/js/features/project-list/components/table/project-list-owner-name.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/project-list-owner-name.tsx
@@ -7,7 +7,7 @@ export const ProjectListOwnerName = memo<{ ownerName: string }>(
 
     const x = ownerName === 'You' ? t('you') : ownerName
 
-    return <> — {t('owned_by_x', { x })}</>
+    return <span translate="no"> — {t('owned_by_x', { x })}</span>
   }
 )
 ProjectListOwnerName.displayName = 'ProjectListOwnerName'
diff --git a/services/web/frontend/js/features/project-list/components/table/project-list-table-row.tsx b/services/web/frontend/js/features/project-list/components/table/project-list-table-row.tsx
index 70a13b4a8c..87e2880022 100644
--- a/services/web/frontend/js/features/project-list/components/table/project-list-table-row.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/project-list-table-row.tsx
@@ -22,7 +22,9 @@ function ProjectListTableRow({ project, selected }: ProjectListTableRowProps) {
         <ProjectCheckbox projectId={project.id} projectName={project.name} />
       </td>
       <td className="dash-cell-name">
-        <a href={`/project/${project.id}`}>{project.name}</a>{' '}
+        <a href={`/project/${project.id}`} translate="no">
+          {project.name}
+        </a>{' '}
         <InlineTags className="d-none d-md-inline" projectId={project.id} />
       </td>
       <td className="dash-cell-date-owner pb-0 d-md-none">
diff --git a/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/tags-dropdown.tsx b/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/tags-dropdown.tsx
index 35f906f1b2..19b4eb0a8a 100644
--- a/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/tags-dropdown.tsx
+++ b/services/web/frontend/js/features/project-list/components/table/project-tools/buttons/tags-dropdown.tsx
@@ -14,6 +14,7 @@ import {
   DropdownMenu,
   DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import { Tag } from '../../../../../../../../app/src/Features/Tags/types'
 
 function TagsDropdown() {
   const {
@@ -26,7 +27,7 @@ function TagsDropdown() {
   const { openCreateTagModal, CreateTagModal } = useTag()
 
   const handleOpenCreateTagModal = useCallback(
-    e => {
+    (e: React.MouseEvent) => {
       e.preventDefault()
       openCreateTagModal()
     },
@@ -34,7 +35,7 @@ function TagsDropdown() {
   )
 
   const handleAddTagToSelectedProjects = useCallback(
-    (e, tagId) => {
+    (e: React.MouseEvent, tagId: string) => {
       e.preventDefault()
       const tag = tags.find(tag => tag._id === tagId)
       const projectIds = []
@@ -50,7 +51,7 @@ function TagsDropdown() {
   )
 
   const handleRemoveTagFromSelectedProjects = useCallback(
-    (e, tagId) => {
+    (e: React.MouseEvent, tagId: string) => {
       e.preventDefault()
       for (const selectedProject of selectedProjects) {
         removeProjectFromTagInView(tagId, selectedProject.id)
@@ -64,7 +65,7 @@ function TagsDropdown() {
   )
 
   const containsAllSelectedProjects = useCallback(
-    tag => {
+    (tag: Tag) => {
       for (const project of selectedProjects) {
         if (!(tag.project_ids || []).includes(project.id)) {
           return false
@@ -90,7 +91,7 @@ function TagsDropdown() {
           data-testid="project-tools-more-dropdown-menu"
         >
           <DropdownHeader>{t('add_to_tag')}</DropdownHeader>
-          {sortBy(tags, tag => tag.name?.toLowerCase()).map((tag, index) => (
+          {sortBy(tags, tag => tag.name?.toLowerCase()).map(tag => (
             <li role="none" key={tag._id}>
               <DropdownItem
                 onClick={e =>
@@ -110,6 +111,7 @@ function TagsDropdown() {
                     <DropdownItem.EmptyLeadingIcon />
                   )
                 }
+                translate="no"
               >
                 <div className="badge-tag-content">
                   <span className="badge-prepend">
diff --git a/services/web/frontend/js/features/project-list/components/tags-list.tsx b/services/web/frontend/js/features/project-list/components/tags-list.tsx
index 8f20f15a83..923da2c115 100644
--- a/services/web/frontend/js/features/project-list/components/tags-list.tsx
+++ b/services/web/frontend/js/features/project-list/components/tags-list.tsx
@@ -12,10 +12,9 @@ import { DropdownItem } from '@/features/ui/components/bootstrap-5/dropdown-menu
 
 type TagsListProps = {
   onTagClick?: () => void
-  onEditClick?: () => void
 }
 
-function TagsList({ onTagClick, onEditClick }: TagsListProps) {
+function TagsList({ onTagClick }: TagsListProps) {
   const { t } = useTranslation()
   const { tags, untaggedProjectsCount, selectedTagId, selectTag } =
     useProjectListContext()
diff --git a/services/web/frontend/js/features/project-list/components/title/project-list-title.tsx b/services/web/frontend/js/features/project-list/components/title/project-list-title.tsx
index 97b4fdb457..c562831977 100644
--- a/services/web/frontend/js/features/project-list/components/title/project-list-title.tsx
+++ b/services/web/frontend/js/features/project-list/components/title/project-list-title.tsx
@@ -16,9 +16,11 @@ function ProjectListTitle({
 }) {
   const { t } = useTranslation()
   let message = t('projects')
+  let extraProps = {}
 
   if (selectedTag) {
     message = `${selectedTag.name}`
+    extraProps = { translate: 'no' }
   } else if (selectedTagId === UNCATEGORIZED_KEY) {
     message = t('uncategorized_projects')
   } else {
@@ -42,7 +44,12 @@ function ProjectListTitle({
   }
 
   return (
-    <div className={classnames('project-list-title', className)}>{message}</div>
+    <div
+      className={classnames('project-list-title', className)}
+      {...extraProps}
+    >
+      {message}
+    </div>
   )
 }
 
diff --git a/services/web/frontend/js/features/project-list/components/use-is-ds-nav.tsx b/services/web/frontend/js/features/project-list/components/use-is-ds-nav.tsx
index 91ba19ab22..9734cefda3 100644
--- a/services/web/frontend/js/features/project-list/components/use-is-ds-nav.tsx
+++ b/services/web/frontend/js/features/project-list/components/use-is-ds-nav.tsx
@@ -1,16 +1,4 @@
 import { createContext, type FC, type ReactNode, useContext } from 'react'
-import { useSplitTestContext } from '@/shared/context/split-test-context'
-import getMeta from '@/utils/meta'
-
-export const hasDsNav = () => getMeta('ol-ExposedSettings').isOverleaf
-
-/**
- * This hook returns whether the user has the split-test assignment 'sidebar-navigation-ui-update'
- */
-export const useHideDsSurvey = () => {
-  const { splitTestVariants } = useSplitTestContext()
-  return splitTestVariants['sidebar-navigation-ui-update'] === 'active'
-}
 
 /**
  * This context wraps elements that should be styled according to the sidebar-navigation-ui-update redesign
@@ -18,9 +6,11 @@ export const useHideDsSurvey = () => {
  */
 const DsNavStyleContext = createContext<boolean | undefined>(undefined)
 
-export const DsNavStyleProvider: FC<{
-  children: ReactNode
-}> = ({ children }) => (
+export const DsNavStyleProvider: FC<
+  React.PropsWithChildren<{
+    children: ReactNode
+  }>
+> = ({ children }) => (
   <DsNavStyleContext.Provider value>{children}</DsNavStyleContext.Provider>
 )
 
diff --git a/services/web/frontend/js/features/project-list/components/welcome-message-new/welcome-message-link.tsx b/services/web/frontend/js/features/project-list/components/welcome-message-new/welcome-message-link.tsx
index b5ec5c6cd2..179fb70b83 100644
--- a/services/web/frontend/js/features/project-list/components/welcome-message-new/welcome-message-link.tsx
+++ b/services/web/frontend/js/features/project-list/components/welcome-message-new/welcome-message-link.tsx
@@ -23,12 +23,7 @@ export default function WelcomeMessageLink({
         rel="noopener"
       >
         <p>{title}</p>
-        <img
-          className="welcome-message-card-img"
-          src={imgSrc}
-          alt={title}
-          aria-hidden="true"
-        />
+        <img className="welcome-message-card-img" src={imgSrc} alt="" />
       </a>
     </div>
   )
diff --git a/services/web/frontend/js/features/project-list/context/project-list-context.tsx b/services/web/frontend/js/features/project-list/context/project-list-context.tsx
index 918a54781d..cb0bce5715 100644
--- a/services/web/frontend/js/features/project-list/context/project-list-context.tsx
+++ b/services/web/frontend/js/features/project-list/context/project-list-context.tsx
@@ -293,7 +293,7 @@ export function ProjectListProvider({ children }: ProjectListProviderProps) {
   }, [selectedProjectIds, visibleProjects])
 
   const selectOrUnselectAllProjects = useCallback(
-    checked => {
+    (checked: any) => {
       setSelectedProjectIds(prevSelectedProjectIds => {
         const selectedProjectIds = new Set(prevSelectedProjectIds)
         for (const project of visibleProjects) {
diff --git a/services/web/frontend/js/features/project-list/hooks/use-tag.tsx b/services/web/frontend/js/features/project-list/hooks/use-tag.tsx
index 6a745883c7..e90e9a7984 100644
--- a/services/web/frontend/js/features/project-list/hooks/use-tag.tsx
+++ b/services/web/frontend/js/features/project-list/hooks/use-tag.tsx
@@ -50,7 +50,7 @@ function useTag() {
   )
 
   const handleEditTag = useCallback(
-    (e, tagId) => {
+    (e: React.MouseEvent, tagId: string) => {
       e.preventDefault()
       const tag = find(tags, ['_id', tagId])
       if (tag) {
@@ -69,7 +69,7 @@ function useTag() {
   )
 
   const handleDeleteTag = useCallback(
-    (e, tagId) => {
+    (e: React.MouseEvent, tagId: string) => {
       e.preventDefault()
       const tag = find(tags, ['_id', tagId])
       if (tag) {
@@ -80,7 +80,7 @@ function useTag() {
   )
 
   const onDelete = useCallback(
-    tagId => {
+    (tagId: string) => {
       deleteTag(tagId)
       setDeletingTag(undefined)
     },
@@ -88,7 +88,7 @@ function useTag() {
   )
 
   const handleManageTag = useCallback(
-    (e, tagId) => {
+    (e: React.MouseEvent, tagId: string) => {
       e.preventDefault()
       const tag = find(tags, ['_id', tagId])
       if (tag) {
diff --git a/services/web/frontend/js/features/project-list/util/user.ts b/services/web/frontend/js/features/project-list/util/user.ts
index cb63ba3aee..cd2abe07d5 100644
--- a/services/web/frontend/js/features/project-list/util/user.ts
+++ b/services/web/frontend/js/features/project-list/util/user.ts
@@ -1,4 +1,5 @@
 import { UserRef } from '../../../../../types/project/dashboard/api'
+import { Subscription } from '../../../../../types/project/dashboard/subscription'
 import getMeta from '@/utils/meta'
 
 export function getUserName(user: UserRef) {
@@ -20,3 +21,16 @@ export function getUserName(user: UserRef) {
 
   return 'None'
 }
+
+export function getUserSubscriptionState(subscription: Subscription) {
+  if ('subscription' in subscription) {
+    if (subscription.subscription.recurlyStatus?.state) {
+      return subscription.subscription.recurlyStatus.state
+    }
+    if (subscription.subscription.paymentProvider) {
+      return subscription.subscription.paymentProvider.state
+    }
+  }
+
+  return null
+}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-mode-promo.tsx b/services/web/frontend/js/features/review-panel-new/components/review-mode-promo.tsx
new file mode 100644
index 0000000000..0979cc58ac
--- /dev/null
+++ b/services/web/frontend/js/features/review-panel-new/components/review-mode-promo.tsx
@@ -0,0 +1,80 @@
+import { FC, RefObject, useCallback, useEffect } from 'react'
+import { Button, Overlay, Popover } from 'react-bootstrap'
+import Close from '@/shared/components/close'
+
+export const ReviewModePromo: FC<{
+  target: RefObject<HTMLSpanElement>
+  showPopup: boolean
+  tryShowingPopup: () => void
+  hideUntilReload: () => void
+  completeTutorial: (props: {
+    action: 'complete'
+    event: 'promo-click' | 'promo-dismiss'
+  }) => void
+}> = ({
+  showPopup,
+  tryShowingPopup,
+  hideUntilReload,
+  completeTutorial,
+  target,
+}) => {
+  useEffect(() => {
+    tryShowingPopup()
+  }, [tryShowingPopup])
+
+  const handleHide = useCallback(() => {
+    hideUntilReload()
+  }, [hideUntilReload])
+
+  const handleClose = useCallback(() => {
+    completeTutorial({
+      action: 'complete',
+      event: 'promo-dismiss',
+    })
+  }, [completeTutorial])
+
+  const handleAccept = useCallback(() => {
+    completeTutorial({
+      action: 'complete',
+      event: 'promo-click',
+    })
+  }, [completeTutorial])
+
+  if (!showPopup) {
+    return null
+  }
+
+  return (
+    <Overlay
+      target={target.current}
+      placement="bottom"
+      show
+      onHide={handleHide}
+    >
+      <Popover>
+        <Popover.Body style={{ width: 246 }}>
+          <Close variant="dark" onDismiss={handleClose} />
+          <p style={{ fontWeight: 'bold' }}>Track changes have moved</p>
+          <p>
+            Choose <b>Reviewing</b> mode in the dropdown to turn on track
+            changes.
+          </p>
+          <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
+            <Button
+              href="/learn/how-to/Reviewing_and_reviewers_on_Overleaf"
+              target="_blank"
+              size="sm"
+              variant="link"
+              style={{ color: 'inherit' }}
+            >
+              Learn more
+            </Button>
+            <Button onClick={handleAccept} size="sm" variant="secondary">
+              OK
+            </Button>
+          </div>
+        </Popover.Body>
+      </Popover>
+    </Overlay>
+  )
+}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-mode-switcher.tsx b/services/web/frontend/js/features/review-panel-new/components/review-mode-switcher.tsx
index de1a5faaf0..b95b1a11b4 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-mode-switcher.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-mode-switcher.tsx
@@ -1,4 +1,4 @@
-import { forwardRef, memo, MouseEventHandler, useState } from 'react'
+import { forwardRef, memo, MouseEventHandler, useRef, useState } from 'react'
 import {
   Dropdown,
   DropdownMenu,
@@ -17,8 +17,13 @@ import { usePermissionsContext } from '@/features/ide-react/context/permissions-
 import usePersistedState from '@/shared/hooks/use-persisted-state'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { useProjectContext } from '@/shared/context/project-context'
 import UpgradeTrackChangesModal from './upgrade-track-changes-modal'
+import { ReviewModePromo } from '@/features/review-panel-new/components/review-mode-promo'
+import useTutorial from '@/shared/hooks/promotions/use-tutorial'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
 
 type Mode = 'view' | 'review' | 'edit'
 
@@ -27,8 +32,9 @@ const useCurrentMode = (): Mode => {
   const user = useUserContext()
   const trackChangesForCurrentUser =
     trackChanges?.onForEveryone ||
-    (user && user.id && trackChanges?.onForMembers[user.id])
-  const { permissionsLevel } = useEditorContext()
+    (user?.id && trackChanges?.onForMembers[user.id]) ||
+    (!user?.id && trackChanges?.onForGuests)
+  const { permissionsLevel } = useIdeReactContext()
 
   if (permissionsLevel === 'readOnly') {
     return 'view'
@@ -43,14 +49,16 @@ const useCurrentMode = (): Mode => {
 
 function ReviewModeSwitcher() {
   const { t } = useTranslation()
-  const { saveTrackChangesForCurrentUser } =
+  const user = useUserContext()
+  const { saveTrackChangesForCurrentUser, saveTrackChanges } =
     useTrackChangesStateActionsContext()
   const mode = useCurrentMode()
-  const { permissionsLevel } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
   const { write, trackedWrite } = usePermissionsContext()
-  const project = useProjectContext()
+  const { features } = useProjectContext()
   const [showUpgradeModal, setShowUpgradeModal] = useState(false)
   const showViewOption = permissionsLevel === 'readOnly'
+  const view = useCodeMirrorViewContext()
 
   return (
     <div className="review-mode-switcher-container">
@@ -64,6 +72,7 @@ function ReviewModeSwitcher() {
             disabled={!write}
             onClick={() => {
               if (mode === 'edit') {
+                view.focus()
                 return
               }
               sendMB('editing-mode-change', {
@@ -71,9 +80,14 @@ function ReviewModeSwitcher() {
                 previousMode: mode,
                 newMode: 'edit',
               })
-              saveTrackChangesForCurrentUser(false)
+              if (user?.id) {
+                saveTrackChangesForCurrentUser(false)
+              } else {
+                saveTrackChanges({ on_for_guests: false })
+              }
+              view.focus()
             }}
-            description={t('can_edit_content')}
+            description={t('edit_content_directly')}
             leadingIcon="edit"
             active={write && mode === 'edit'}
           >
@@ -83,9 +97,10 @@ function ReviewModeSwitcher() {
             disabled={permissionsLevel === 'readOnly'}
             onClick={() => {
               if (mode === 'review') {
+                view.focus()
                 return
               }
-              if (!project.features.trackChanges) {
+              if (!features.trackChanges) {
                 setShowUpgradeModal(true)
               } else {
                 sendMB('editing-mode-change', {
@@ -93,7 +108,12 @@ function ReviewModeSwitcher() {
                   previousMode: mode,
                   newMode: 'review',
                 })
-                saveTrackChangesForCurrentUser(true)
+                if (user?.id) {
+                  saveTrackChangesForCurrentUser(true)
+                } else {
+                  saveTrackChanges({ on_for_guests: true })
+                }
+                view.focus()
               }
             }}
             description={
@@ -141,6 +161,7 @@ const ModeSwitcherToggleButton = forwardRef<
         iconType="edit"
         label={t('editing')}
         ariaExpanded={ariaExpanded}
+        currentMode={mode}
       />
     )
   } else if (mode === 'review') {
@@ -152,6 +173,7 @@ const ModeSwitcherToggleButton = forwardRef<
         iconType="rate_review"
         label={t('reviewing')}
         ariaExpanded={ariaExpanded}
+        currentMode={mode}
       />
     )
   }
@@ -164,6 +186,7 @@ const ModeSwitcherToggleButton = forwardRef<
       iconType="visibility"
       label={t('viewing')}
       ariaExpanded={ariaExpanded}
+      currentMode={mode}
     />
   )
 })
@@ -176,31 +199,72 @@ const ModeSwitcherToggleButtonContent = forwardRef<
     iconType: string
     label: string
     ariaExpanded: boolean
+    currentMode: string
   }
->(({ onClick, className, iconType, label, ariaExpanded }, ref) => {
+>(({ onClick, className, iconType, label, ariaExpanded, currentMode }, ref) => {
   const [isFirstTimeUsed, setIsFirstTimeUsed] = usePersistedState(
     `modeSwitcherFirstTimeUsed`,
     true
   )
 
+  const tutorialProps = useTutorial('review-mode', {
+    name: 'review-mode-notification',
+  })
+
+  const user = useUserContext()
+  const { features } = useProjectContext()
+  const { reviewPanelOpen } = useLayoutContext()
+  const { inactiveTutorials } = useEditorContext()
+
+  const hasCompletedReviewModeTutorial =
+    inactiveTutorials.includes('review-mode')
+
+  const canShowReviewModePromo =
+    reviewPanelOpen &&
+    currentMode !== 'review' &&
+    features.trackChanges &&
+    user.signUpDate &&
+    user.signUpDate < '2025-03-15' &&
+    !hasCompletedReviewModeTutorial
+
+  const containerRef = useRef<HTMLSpanElement | null>(null)
+
   return (
-    <button
-      className={classNames('review-mode-switcher-toggle-button', className, {
-        'review-mode-switcher-toggle-button-expanded': isFirstTimeUsed,
-      })}
-      ref={ref}
-      onClick={event => {
-        setIsFirstTimeUsed(false)
-        onClick(event)
-      }}
-      aria-expanded={ariaExpanded}
-    >
-      <MaterialIcon className="material-symbols-outlined" type={iconType} />
-      <div className="review-mode-switcher-toggle-label" aria-label={label}>
-        {label}
-      </div>
-      <MaterialIcon type="keyboard_arrow_down" />
-    </button>
+    <>
+      <span ref={containerRef}>
+        <button
+          className={classNames(
+            'review-mode-switcher-toggle-button',
+            className,
+            {
+              'review-mode-switcher-toggle-button-expanded': isFirstTimeUsed,
+            }
+          )}
+          ref={ref}
+          onClick={event => {
+            setIsFirstTimeUsed(false)
+            if (!hasCompletedReviewModeTutorial) {
+              tutorialProps.completeTutorial({
+                action: 'complete',
+                event: 'promo-click',
+              })
+            }
+            onClick(event)
+          }}
+          aria-expanded={ariaExpanded}
+        >
+          <MaterialIcon className="material-symbols-outlined" type={iconType} />
+          <div className="review-mode-switcher-toggle-label" aria-label={label}>
+            {label}
+          </div>
+          <MaterialIcon type="keyboard_arrow_down" />
+        </button>
+      </span>
+
+      {canShowReviewModePromo && (
+        <ReviewModePromo target={containerRef} {...tutorialProps} />
+      )}
+    </>
   )
 })
 
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-action-icons.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-action-icons.tsx
new file mode 100644
index 0000000000..717f7a94ff
--- /dev/null
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-action-icons.tsx
@@ -0,0 +1,29 @@
+import { memo } from 'react'
+import MaterialIcon from '@/shared/components/material-icon'
+
+export const AddIcon = memo(function AddIcon() {
+  return (
+    <MaterialIcon
+      className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-accept"
+      type="add_circle"
+    />
+  )
+})
+
+export const DeleteIcon = memo(function DeleteIcon() {
+  return (
+    <MaterialIcon
+      className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-reject"
+      type="delete"
+    />
+  )
+})
+
+export const EditIcon = memo(function EditIcon() {
+  return (
+    <MaterialIcon
+      className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-changed"
+      type="edit"
+    />
+  )
+})
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx
index 7213dc46ff..f3e8b88a47 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx
@@ -36,7 +36,7 @@ export const ReviewPanelAddComment = memo<{
   }, [view, threadId])
 
   const submitForm = useCallback(
-    async message => {
+    async (message: string) => {
       setSubmitting(true)
 
       const content = view.state.sliceDoc(from, to)
@@ -85,14 +85,15 @@ export const ReviewPanelAddComment = memo<{
   // We cannot use the autofocus attribute as we need to wait until the parent element
   // has been positioned (with the "top" attribute) to avoid scrolling to the initial
   // position of the element
-  const observerCallback = useCallback(mutationList => {
+  const observerCallback = useCallback((mutationList: MutationRecord[]) => {
     if (hasBeenFocused.current) {
       return
     }
 
     for (const mutation of mutationList) {
-      if (mutation.target.style.top) {
-        const textArea = mutation.target.getElementsByTagName('textarea')[0]
+      const target = mutation.target as HTMLElement
+      if (target.style.top) {
+        const textArea = target.getElementsByTagName('textarea')[0]
         if (textArea) {
           textArea.focus()
           hasBeenFocused.current = true
@@ -101,19 +102,25 @@ export const ReviewPanelAddComment = memo<{
     }
   }, [])
 
+  const observerRef = useRef<MutationObserver | null>(null)
+
   const handleElement = useCallback(
     (element: HTMLElement | null) => {
       if (element) {
         element.dispatchEvent(new Event('review-panel:position'))
 
-        const observer = new MutationObserver(observerCallback)
+        observerRef.current = new MutationObserver(observerCallback)
         const entryWrapper = element.closest('.review-panel-entry')
         if (entryWrapper) {
-          observer.observe(entryWrapper, {
+          observerRef.current.observe(entryWrapper, {
             attributes: true,
             attributeFilter: ['style'],
           })
-          return () => observer.disconnect()
+        }
+      } else {
+        // [TODO React 19] return a cleanup function instead of using null element
+        if (observerRef.current) {
+          observerRef.current.disconnect()
         }
       }
     },
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-change-action.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-change-action.tsx
new file mode 100644
index 0000000000..532dc9a466
--- /dev/null
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-change-action.tsx
@@ -0,0 +1,36 @@
+import Tooltip from '@/features/ui/components/bootstrap-5/tooltip'
+import { ComponentProps, memo, MouseEventHandler } from 'react'
+import { PreventSelectingEntry } from '@/features/review-panel-new/components/review-panel-prevent-selecting'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import MaterialIcon from '@/shared/components/material-icon'
+
+const changeActionTooltipProps: Partial<ComponentProps<typeof Tooltip>> = {
+  overlayProps: { placement: 'bottom' },
+  tooltipProps: { className: 'review-panel-tooltip' },
+}
+
+export const ChangeAction = memo<{
+  id: string
+  label: string
+  type: string
+  handleClick: MouseEventHandler<HTMLButtonElement>
+}>(function ChangeAction({ id, label, type, handleClick }) {
+  return (
+    <PreventSelectingEntry>
+      <OLTooltip id={id} description={label} {...changeActionTooltipProps}>
+        <button
+          type="button"
+          className="btn"
+          onClick={handleClick}
+          tabIndex={0}
+        >
+          <MaterialIcon
+            type={type}
+            className="review-panel-entry-actions-icon"
+            accessibilityLabel={label}
+          />
+        </button>
+      </OLTooltip>
+    </PreventSelectingEntry>
+  )
+})
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
index 06d10ece2b..a153b1e1d4 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback, useState } from 'react'
+import { memo, useCallback, useMemo, useState } from 'react'
 import { useRangesActionsContext } from '../context/ranges-context'
 import {
   Change,
@@ -8,8 +8,6 @@ import {
 import { useTranslation } from 'react-i18next'
 import classnames from 'classnames'
 import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
-import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import MaterialIcon from '@/shared/components/material-icon'
 import { FormatTimeBasedOnYear } from '@/shared/components/format-time-based-on-year'
 import { useChangesUsersContext } from '../context/changes-users-context'
 import { ReviewPanelChangeUser } from './review-panel-change-user'
@@ -17,7 +15,12 @@ import { ReviewPanelEntry } from './review-panel-entry'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
 import { ExpandableContent } from './review-panel-expandable-content'
 import { useUserContext } from '@/shared/context/user-context'
-import { PreventSelectingEntry } from './review-panel-prevent-selecting'
+import { ChangeAction } from '@/features/review-panel-new/components/review-panel-change-action'
+import {
+  AddIcon,
+  DeleteIcon,
+  EditIcon,
+} from '@/features/review-panel-new/components/review-panel-action-icons'
 
 export const ReviewPanelChange = memo<{
   change: Change<EditOperation>
@@ -27,8 +30,8 @@ export const ReviewPanelChange = memo<{
   docId: string
   hoverRanges?: boolean
   hovered?: boolean
-  onEnter?: (changeId: string) => void
-  onLeave?: (changeId: string) => void
+  handleEnter?: (changeId: string) => void
+  handleLeave?: () => void
 }>(
   ({
     change,
@@ -38,8 +41,8 @@ export const ReviewPanelChange = memo<{
     hoverRanges,
     editable = true,
     hovered,
-    onEnter,
-    onLeave,
+    handleEnter,
+    handleLeave,
   }) => {
     const { t } = useTranslation()
     const { acceptChanges, rejectChanges } = useRangesActionsContext()
@@ -68,6 +71,34 @@ export const ReviewPanelChange = memo<{
       }
     }, [acceptChanges, aggregate, change.id, showGenericMessageModal, t])
 
+    const rejectHandler = useCallback(async () => {
+      if (aggregate) {
+        await rejectChanges(change.id, aggregate.id)
+      } else {
+        await rejectChanges(change.id)
+      }
+    }, [aggregate, change, rejectChanges])
+
+    const translations = useMemo(
+      () => ({
+        accept_change: t('accept_change'),
+        reject_change: t('reject_change'),
+        aggregate_changed: t('aggregate_changed'),
+        aggregate_to: t('aggregate_to'),
+        tracked_change_added: t('tracked_change_added'),
+        tracked_change_deleted: t('tracked_change_deleted'),
+      }),
+      [t]
+    )
+
+    const { handleMouseEnter, handleMouseLeave } = useMemo(
+      () => ({
+        handleMouseEnter: handleEnter && (() => handleEnter(change.id)),
+        handleMouseLeave: handleLeave && (() => handleLeave()),
+      }),
+      [change.id, handleEnter, handleLeave]
+    )
+
     if (!changesUsers) {
       // if users are not loaded yet, do not show "Unknown" user
       return null
@@ -90,14 +121,14 @@ export const ReviewPanelChange = memo<{
         docId={docId}
         hoverRanges={hoverRanges}
         disabled={accepting}
-        onEnterEntryIndicator={onEnter && (() => onEnter(change.id))}
-        onLeaveEntryIndicator={onLeave && (() => onLeave(change.id))}
+        handleEnter={handleMouseEnter}
+        handleLeave={handleMouseLeave}
         entryIndicator="edit"
       >
         <div
           className="review-panel-entry-content"
-          onMouseEnter={onEnter && (() => onEnter(change.id))}
-          onMouseLeave={onLeave && (() => onLeave(change.id))}
+          onMouseEnter={handleMouseEnter}
+          onMouseLeave={handleMouseLeave}
         >
           <div className="review-panel-entry-header">
             <div>
@@ -111,56 +142,22 @@ export const ReviewPanelChange = memo<{
             {editable && (
               <div className="review-panel-entry-actions">
                 {permissions.write && (
-                  <PreventSelectingEntry>
-                    <OLTooltip
-                      id="accept-change"
-                      overlayProps={{ placement: 'bottom' }}
-                      description={t('accept_change')}
-                      tooltipProps={{ className: 'review-panel-tooltip' }}
-                    >
-                      <button
-                        type="button"
-                        className="btn"
-                        onClick={acceptHandler}
-                        tabIndex={0}
-                      >
-                        <MaterialIcon
-                          type="check"
-                          className="review-panel-entry-actions-icon"
-                          accessibilityLabel={t('accept_change')}
-                        />
-                      </button>
-                    </OLTooltip>
-                  </PreventSelectingEntry>
+                  <ChangeAction
+                    id="accept-change"
+                    label={translations.accept_change}
+                    type="check"
+                    handleClick={acceptHandler}
+                  />
                 )}
 
                 {(permissions.write ||
                   (permissions.trackedWrite && isChangeAuthor)) && (
-                  <PreventSelectingEntry>
-                    <OLTooltip
-                      id="reject-change"
-                      description={t('reject_change')}
-                      overlayProps={{ placement: 'bottom' }}
-                      tooltipProps={{ className: 'review-panel-tooltip' }}
-                    >
-                      <button
-                        tabIndex={0}
-                        type="button"
-                        className="btn"
-                        onClick={() =>
-                          aggregate
-                            ? rejectChanges(change.id, aggregate.id)
-                            : rejectChanges(change.id)
-                        }
-                      >
-                        <MaterialIcon
-                          className="review-panel-entry-actions-icon"
-                          accessibilityLabel={t('reject_change')}
-                          type="close"
-                        />
-                      </button>
-                    </OLTooltip>
-                  </PreventSelectingEntry>
+                  <ChangeAction
+                    id="reject-change"
+                    label={translations.reject_change}
+                    type="close"
+                    handleClick={rejectHandler}
+                  />
                 )}
               </div>
             )}
@@ -169,21 +166,11 @@ export const ReviewPanelChange = memo<{
           <div className="review-panel-change-body">
             {'i' in change.op && (
               <>
-                {aggregateChange ? (
-                  <MaterialIcon
-                    className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-changed"
-                    type="edit"
-                  />
-                ) : (
-                  <MaterialIcon
-                    className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-accept"
-                    type="add_circle"
-                  />
-                )}
+                {aggregateChange ? <EditIcon /> : <AddIcon />}
 
                 {aggregateChange ? (
                   <span>
-                    {t('aggregate_changed')}:{' '}
+                    {translations.aggregate_changed}:{' '}
                     <del className="review-panel-content-highlight">
                       <ExpandableContent
                         inline
@@ -191,7 +178,7 @@ export const ReviewPanelChange = memo<{
                         checkNewLines={false}
                       />
                     </del>{' '}
-                    {t('aggregate_to')}{' '}
+                    {translations.aggregate_to}{' '}
                     <ExpandableContent
                       inline
                       content={change.op.i}
@@ -200,7 +187,7 @@ export const ReviewPanelChange = memo<{
                   </span>
                 ) : (
                   <span>
-                    {t('tracked_change_added')}:&nbsp;
+                    {translations.tracked_change_added}:&nbsp;
                     <ins className="review-panel-content-highlight">
                       <ExpandableContent
                         content={change.op.i}
@@ -214,13 +201,9 @@ export const ReviewPanelChange = memo<{
 
             {'d' in change.op && (
               <>
-                <MaterialIcon
-                  className="review-panel-entry-icon review-panel-entry-change-icon review-panel-entry-icon-reject"
-                  type="delete"
-                />
-
+                <DeleteIcon />
                 <span>
-                  {t('tracked_change_deleted')}:&nbsp;
+                  {translations.tracked_change_deleted}:&nbsp;
                   <del className="review-panel-content-highlight">
                     <ExpandableContent
                       content={change.op.d}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
index c85c69d7b7..6ae385936b 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment-content.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback, useState } from 'react'
+import { Dispatch, memo, SetStateAction, useCallback, useState } from 'react'
 import { Change, CommentOperation } from '../../../../../types/change'
 import { ReviewPanelMessage } from './review-panel-message'
 import { useTranslation } from 'react-i18next'
@@ -21,8 +21,8 @@ export const ReviewPanelCommentContent = memo<{
   onDeleteMessage?: (commentId: CommentId) => Promise<void>
   onDeleteThread?: (threadId: ThreadId) => Promise<void>
   onResolve?: () => Promise<void>
-  onLeave?: (changeId: string) => void
-  onEnter?: (changeId: string) => void
+  onLeave?: () => void
+  onEnter?: () => void
 }>(
   ({
     comment,
@@ -41,7 +41,7 @@ export const ReviewPanelCommentContent = memo<{
     const [submitting, setSubmitting] = useState(false)
 
     const handleSubmit = useCallback(
-      (content, setContent) => {
+      (content: string, setContent: Dispatch<SetStateAction<string>>) => {
         if (!onReply || submitting) {
           return
         }
@@ -69,8 +69,8 @@ export const ReviewPanelCommentContent = memo<{
     return (
       <div
         className="review-panel-entry-content"
-        onMouseEnter={onEnter && (() => onEnter(comment.id))}
-        onMouseLeave={onLeave && (() => onLeave(comment.id))}
+        onMouseEnter={onEnter}
+        onMouseLeave={onLeave}
       >
         {thread.messages.map((message, i) => {
           const isReply = i !== 0
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment.tsx
index dd6366f091..c7f60aac35 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-comment.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-comment.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback, useState } from 'react'
+import { memo, useCallback, useMemo, useState } from 'react'
 import { Change, CommentOperation } from '../../../../../types/change'
 import {
   useThreadsActionsContext,
@@ -21,160 +21,169 @@ export const ReviewPanelComment = memo<{
   docId: string
   top?: number
   hoverRanges?: boolean
-  onEnter?: (changeId: string) => void
-  onLeave?: (changeId: string) => void
+  handleEnter?: (changeId: string) => void
+  handleLeave?: (changeId: string) => void
   hovered?: boolean
-}>(({ comment, top, hovered, onEnter, onLeave, docId, hoverRanges }) => {
-  const threads = useThreadsContext()
-  const {
-    resolveThread,
-    editMessage,
-    deleteMessage,
-    deleteOwnMessage,
-    deleteThread,
-    addMessage,
-  } = useThreadsActionsContext()
-  const { showGenericMessageModal } = useModalsContext()
-  const { t } = useTranslation()
-  const permissions = usePermissionsContext()
-
-  const [processing, setProcessing] = useState(false)
-
-  const handleResolveComment = useCallback(async () => {
-    setProcessing(true)
-    try {
-      await resolveThread(comment.op.t)
-    } catch (err) {
-      debugConsole.error(err)
-      showGenericMessageModal(
-        t('resolve_comment_error_title'),
-        t('resolve_comment_error_message')
-      )
-    } finally {
-      setProcessing(false)
-    }
-  }, [comment.op.t, resolveThread, showGenericMessageModal, t])
-
-  const handleEditMessage = useCallback(
-    async (commentId: CommentId, content: string) => {
-      setProcessing(true)
-      try {
-        await editMessage(comment.op.t, commentId, content)
-      } catch (err) {
-        debugConsole.error(err)
-        showGenericMessageModal(
-          t('edit_comment_error_title'),
-          t('edit_comment_error_message')
-        )
-      } finally {
-        setProcessing(false)
-      }
-    },
-    [comment.op.t, editMessage, showGenericMessageModal, t]
-  )
-
-  const handleDeleteMessage = useCallback(
-    async (commentId: CommentId) => {
-      setProcessing(true)
-      try {
-        if (permissions.resolveAllComments) {
-          // Owners and editors can delete any message
-          await deleteMessage(comment.op.t, commentId)
-        } else if (permissions.resolveOwnComments) {
-          // Reviewers can only delete their own messages
-          await deleteOwnMessage(comment.op.t, commentId)
-        }
-      } catch (err) {
-        debugConsole.error(err)
-        showGenericMessageModal(
-          t('delete_comment_error_title'),
-          t('delete_comment_error_message')
-        )
-      } finally {
-        setProcessing(false)
-      }
-    },
-    [
-      comment.op.t,
+}>(
+  ({ comment, top, hovered, handleEnter, handleLeave, docId, hoverRanges }) => {
+    const threads = useThreadsContext()
+    const {
+      resolveThread,
+      editMessage,
       deleteMessage,
       deleteOwnMessage,
-      showGenericMessageModal,
-      t,
-      permissions.resolveOwnComments,
-      permissions.resolveAllComments,
-    ]
-  )
+      deleteThread,
+      addMessage,
+    } = useThreadsActionsContext()
+    const { showGenericMessageModal } = useModalsContext()
+    const { t } = useTranslation()
+    const permissions = usePermissionsContext()
 
-  const handleDeleteThread = useCallback(
-    async (commentId: ThreadId) => {
+    const [processing, setProcessing] = useState(false)
+
+    const handleResolveComment = useCallback(async () => {
       setProcessing(true)
       try {
-        await deleteThread(commentId)
+        await resolveThread(comment.op.t)
       } catch (err) {
         debugConsole.error(err)
         showGenericMessageModal(
-          t('delete_comment_error_title'),
-          t('delete_comment_error_message')
+          t('resolve_comment_error_title'),
+          t('resolve_comment_error_message')
         )
       } finally {
         setProcessing(false)
       }
-    },
-    [deleteThread, showGenericMessageModal, t]
-  )
+    }, [comment.op.t, resolveThread, showGenericMessageModal, t])
 
-  const handleSubmitReply = useCallback(
-    async (content: string) => {
-      setProcessing(true)
-      try {
-        await addMessage(comment.op.t, content)
-      } catch (err) {
-        debugConsole.error(err)
-        showGenericMessageModal(
-          t('add_comment_error_title'),
-          t('add_comment_error_message')
-        )
-        throw err
-      } finally {
-        setProcessing(false)
+    const handleEditMessage = useCallback(
+      async (commentId: CommentId, content: string) => {
+        setProcessing(true)
+        try {
+          await editMessage(comment.op.t, commentId, content)
+        } catch (err) {
+          debugConsole.error(err)
+          showGenericMessageModal(
+            t('edit_comment_error_title'),
+            t('edit_comment_error_message')
+          )
+        } finally {
+          setProcessing(false)
+        }
+      },
+      [comment.op.t, editMessage, showGenericMessageModal, t]
+    )
+
+    const handleDeleteMessage = useCallback(
+      async (commentId: CommentId) => {
+        setProcessing(true)
+        try {
+          if (permissions.resolveAllComments) {
+            // Owners and editors can delete any message
+            await deleteMessage(comment.op.t, commentId)
+          } else if (permissions.resolveOwnComments) {
+            // Reviewers can only delete their own messages
+            await deleteOwnMessage(comment.op.t, commentId)
+          }
+        } catch (err) {
+          debugConsole.error(err)
+          showGenericMessageModal(
+            t('delete_comment_error_title'),
+            t('delete_comment_error_message')
+          )
+        } finally {
+          setProcessing(false)
+        }
+      },
+      [
+        comment.op.t,
+        deleteMessage,
+        deleteOwnMessage,
+        showGenericMessageModal,
+        t,
+        permissions.resolveOwnComments,
+        permissions.resolveAllComments,
+      ]
+    )
+
+    const handleDeleteThread = useCallback(
+      async (commentId: ThreadId) => {
+        setProcessing(true)
+        try {
+          await deleteThread(commentId)
+        } catch (err) {
+          debugConsole.error(err)
+          showGenericMessageModal(
+            t('delete_comment_error_title'),
+            t('delete_comment_error_message')
+          )
+        } finally {
+          setProcessing(false)
+        }
+      },
+      [deleteThread, showGenericMessageModal, t]
+    )
+
+    const handleSubmitReply = useCallback(
+      async (content: string) => {
+        setProcessing(true)
+        try {
+          await addMessage(comment.op.t, content)
+        } catch (err) {
+          debugConsole.error(err)
+          showGenericMessageModal(
+            t('add_comment_error_title'),
+            t('add_comment_error_message')
+          )
+          throw err
+        } finally {
+          setProcessing(false)
+        }
+      },
+      [addMessage, comment.op.t, showGenericMessageModal, t]
+    )
+
+    const { handleMouseEnter, handleMouseLeave } = useMemo(() => {
+      return {
+        handleMouseEnter: handleEnter && (() => handleEnter(comment.id)),
+        handleMouseLeave: handleLeave && (() => handleLeave(comment.id)),
       }
-    },
-    [addMessage, comment.op.t, showGenericMessageModal, t]
-  )
+    }, [comment.id, handleEnter, handleLeave])
 
-  const thread = threads?.[comment.op.t]
-  if (!thread || thread.resolved || thread.messages.length === 0) {
-    return null
+    const thread = threads?.[comment.op.t]
+    if (!thread || thread.resolved || thread.messages.length === 0) {
+      return null
+    }
+
+    return (
+      <ReviewPanelEntry
+        className={classnames('review-panel-entry-comment', {
+          'review-panel-entry-loaded': !!threads?.[comment.op.t],
+          'review-panel-entry-hover': hovered,
+        })}
+        docId={docId}
+        top={top}
+        op={comment.op}
+        position={comment.op.p}
+        hoverRanges={hoverRanges}
+        disabled={processing}
+        handleEnter={handleMouseEnter}
+        handleLeave={handleMouseLeave}
+        entryIndicator="comment"
+      >
+        <ReviewPanelCommentContent
+          comment={comment}
+          isResolved={false}
+          onLeave={handleMouseLeave}
+          onEnter={handleMouseEnter}
+          onResolve={handleResolveComment}
+          onEdit={handleEditMessage}
+          onDeleteMessage={handleDeleteMessage}
+          onDeleteThread={handleDeleteThread}
+          onReply={handleSubmitReply}
+        />
+      </ReviewPanelEntry>
+    )
   }
-
-  return (
-    <ReviewPanelEntry
-      className={classnames('review-panel-entry-comment', {
-        'review-panel-entry-loaded': !!threads?.[comment.op.t],
-        'review-panel-entry-hover': hovered,
-      })}
-      docId={docId}
-      top={top}
-      op={comment.op}
-      position={comment.op.p}
-      hoverRanges={hoverRanges}
-      disabled={processing}
-      onEnterEntryIndicator={onEnter && (() => onEnter(comment.id))}
-      onLeaveEntryIndicator={onLeave && (() => onLeave(comment.id))}
-      entryIndicator="comment"
-    >
-      <ReviewPanelCommentContent
-        comment={comment}
-        isResolved={false}
-        onLeave={onLeave}
-        onEnter={onEnter}
-        onResolve={handleResolveComment}
-        onEdit={handleEditMessage}
-        onDeleteMessage={handleDeleteMessage}
-        onDeleteThread={handleDeleteThread}
-        onReply={handleSubmitReply}
-      />
-    </ReviewPanelEntry>
-  )
-})
+)
 ReviewPanelComment.displayName = 'ReviewPanelComment'
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-container.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-container.tsx
index 9ee8bc4062..f7ee56f105 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-container.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-container.tsx
@@ -2,37 +2,21 @@ import ReactDOM from 'react-dom'
 import { useCodeMirrorViewContext } from '../../source-editor/components/codemirror-context'
 import { memo } from 'react'
 import ReviewPanel from './review-panel'
-import { useLayoutContext } from '@/shared/context/layout-context'
-import { useRangesContext } from '../context/ranges-context'
-import { useThreadsContext } from '@/features/review-panel-new/context/threads-context'
-import { hasActiveRange } from '@/features/review-panel-new/utils/has-active-range'
-import TrackChangesOnWidget from './track-changes-on-widget'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
 import ReviewModeSwitcher from './review-mode-switcher'
-import getMeta from '@/utils/meta'
+import useReviewPanelLayout from '../hooks/use-review-panel-layout'
 
 function ReviewPanelContainer() {
   const view = useCodeMirrorViewContext()
-  const ranges = useRangesContext()
-  const threads = useThreadsContext()
-  const { reviewPanelOpen } = useLayoutContext()
-  const { wantTrackChanges } = useEditorManagerContext()
-  const enableReviewerRole = getMeta('ol-isReviewerRoleEnabled')
+  const { showPanel, mini } = useReviewPanelLayout()
 
   if (!view) {
     return null
   }
 
-  const hasCommentOrChange = hasActiveRange(ranges, threads)
-  const showPanel = reviewPanelOpen || hasCommentOrChange
-  const showTrackChangesWidget =
-    !enableReviewerRole && wantTrackChanges && !reviewPanelOpen
-
   return ReactDOM.createPortal(
     <>
-      {showTrackChangesWidget && <TrackChangesOnWidget />}
-      {enableReviewerRole && <ReviewModeSwitcher />}
-      {showPanel && <ReviewPanel mini={!reviewPanelOpen} />}
+      <ReviewModeSwitcher />
+      {showPanel && <ReviewPanel mini={mini} />}
     </>,
     view.scrollDOM
   )
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-current-file.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-current-file.tsx
index db9933d66b..8a700f090c 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-current-file.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-current-file.tsx
@@ -33,6 +33,7 @@ import ReviewPanelMoreCommentsButton from './review-panel-more-comments-button'
 import useMoreCommments from '../hooks/use-more-comments'
 import { Decoration } from '@codemirror/view'
 import { debounce } from 'lodash'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 type AggregatedRanges = {
   changes: Change<EditOperation>[]
@@ -46,6 +47,7 @@ const ReviewPanelCurrentFile: FC = () => {
   const threads = useThreadsContext()
   const state = useCodeMirrorStateContext()
   const [hoveredEntry, setHoveredEntry] = useState<string | null>(null)
+  const newEditor = useIsNewEditorEnabled()
 
   const hoverTimeout = useRef<number>(0)
   const handleEntryEnter = useCallback((id: string) => {
@@ -53,7 +55,7 @@ const ReviewPanelCurrentFile: FC = () => {
     setHoveredEntry(id)
   }, [])
 
-  const handleEntryLeave = useCallback((id: string) => {
+  const handleEntryLeave = useCallback(() => {
     clearTimeout(hoverTimeout.current)
     hoverTimeout.current = window.setTimeout(() => {
       setHoveredEntry(null)
@@ -242,7 +244,8 @@ const ReviewPanelCurrentFile: FC = () => {
       const positioningRes = positionItems(
         containerRef.current,
         previousFocusedItem.current.get(docId),
-        docId
+        docId,
+        newEditor
       )
 
       onEntriesPositioned()
@@ -254,7 +257,7 @@ const ReviewPanelCurrentFile: FC = () => {
         )
       }
     }
-  }, [ranges?.docId, onEntriesPositioned])
+  }, [ranges?.docId, onEntriesPositioned, newEditor])
 
   useEffect(() => {
     const timer = window.setTimeout(() => {
@@ -295,7 +298,11 @@ const ReviewPanelCurrentFile: FC = () => {
   }
 
   return (
-    <>
+    <div
+      role="tabpanel"
+      id="review-panel-current-file"
+      aria-labelledby="review-panel-tab-button-current-file"
+    >
       {showEmptyState && <ReviewPanelEmptyState />}
       {onMoreCommentsAboveClick && (
         <ReviewPanelMoreCommentsButton
@@ -329,8 +336,8 @@ const ReviewPanelCurrentFile: FC = () => {
                 top={positions.get(change.id)}
                 aggregate={aggregatedRanges.aggregates.get(change.id)}
                 hovered={hoveredEntry === change.id}
-                onEnter={handleEntryEnter}
-                onLeave={handleEntryLeave}
+                handleEnter={handleEntryEnter}
+                handleLeave={handleEntryLeave}
               />
             )
         )}
@@ -344,8 +351,8 @@ const ReviewPanelCurrentFile: FC = () => {
                 comment={comment}
                 top={positions.get(comment.id)}
                 hovered={hoveredEntry === comment.id}
-                onEnter={handleEntryEnter}
-                onLeave={handleEntryLeave}
+                handleEnter={handleEntryEnter}
+                handleLeave={handleEntryLeave}
               />
             )
         )}
@@ -356,7 +363,7 @@ const ReviewPanelCurrentFile: FC = () => {
           direction="downward"
         />
       )}
-    </>
+    </div>
   )
 }
 
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-indicator.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-indicator.tsx
new file mode 100644
index 0000000000..ee14dc24f5
--- /dev/null
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-indicator.tsx
@@ -0,0 +1,27 @@
+import { memo, MouseEventHandler } from 'react'
+import MaterialIcon from '@/shared/components/material-icon'
+
+export const EntryIndicator = memo<{
+  handleMouseEnter?: MouseEventHandler<HTMLDivElement>
+  handleMouseLeave?: MouseEventHandler<HTMLDivElement>
+  handleMouseDown?: MouseEventHandler<HTMLDivElement>
+  type: string
+}>(function EntryIndicator({
+  handleMouseEnter,
+  handleMouseLeave,
+  handleMouseDown,
+  type,
+}) {
+  return (
+    <div
+      className="review-panel-entry-indicator"
+      onMouseEnter={handleMouseEnter}
+      onMouseLeave={handleMouseLeave}
+      onMouseDown={handleMouseDown} // Using onMouseDown rather than onClick to guarantee that it fires before onFocus
+      role="button"
+      tabIndex={0}
+    >
+      <MaterialIcon type={type} className="review-panel-entry-icon" />
+    </div>
+  )
+})
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
index 932813faef..221e297c4b 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry-user.tsx
@@ -3,16 +3,18 @@ import { buildName } from '../utils/build-name'
 import { ReviewPanelUser } from '../../../../../types/review-panel/review-panel'
 import { ChangesUser } from '../context/changes-users-context'
 import { getBackgroundColorForUserId } from '@/shared/utils/colors'
+import { useTranslation } from 'react-i18next'
 
 const ReviewPanelEntryUser = ({
   user,
 }: {
   user?: ReviewPanelUser | ChangesUser
 }) => {
-  const userName = buildName(user)
+  const { t } = useTranslation()
+  const userName = user ? buildName(user) : t('deleted_user')
 
   return (
-    <div className="review-panel-entry-user">
+    <div className="review-panel-entry-user" translate="no">
       <span
         className="review-panel-entry-user-color-badge"
         style={{
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry.tsx
index 03fde3fd67..3576b7b542 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-entry.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-entry.tsx
@@ -11,24 +11,26 @@ import {
   highlightRanges,
 } from '@/features/source-editor/extensions/ranges'
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import { useLayoutContext } from '@/shared/context/layout-context'
 import { EditorSelection } from '@codemirror/state'
-import MaterialIcon from '@/shared/components/material-icon'
 import { OFFSET_FOR_ENTRIES_ABOVE } from '../utils/position-items'
+import useReviewPanelLayout from '../hooks/use-review-panel-layout'
+import { EntryIndicator } from './review-panel-entry-indicator'
 
-export const ReviewPanelEntry: FC<{
-  position: number
-  op: AnyOperation
-  docId: string
-  top?: number
-  className?: string
-  selectLineOnFocus?: boolean
-  hoverRanges?: boolean
-  disabled?: boolean
-  onEnterEntryIndicator?: () => void
-  onLeaveEntryIndicator?: () => void
-  entryIndicator?: 'comment' | 'edit'
-}> = ({
+export const ReviewPanelEntry: FC<
+  React.PropsWithChildren<{
+    position: number
+    op: AnyOperation
+    docId: string
+    top?: number
+    className?: string
+    selectLineOnFocus?: boolean
+    hoverRanges?: boolean
+    disabled?: boolean
+    handleEnter?: () => void
+    handleLeave?: () => void
+    entryIndicator?: 'comment' | 'edit'
+  }>
+> = ({
   children,
   position,
   top,
@@ -38,8 +40,8 @@ export const ReviewPanelEntry: FC<{
   docId,
   hoverRanges = true,
   disabled,
-  onEnterEntryIndicator,
-  onLeaveEntryIndicator,
+  handleEnter,
+  handleLeave,
   entryIndicator,
 }) => {
   const state = useCodeMirrorStateContext()
@@ -48,17 +50,13 @@ export const ReviewPanelEntry: FC<{
   const [selected, setSelected] = useState(false)
   const [focused, setFocused] = useState(false)
   const [textareaFocused, setTextareaFocused] = useState(false)
-  const { setReviewPanelOpen } = useLayoutContext()
+  const { openReviewPanel } = useReviewPanelLayout()
   const highlighted = isSelectionWithinOp(op, state.selection.main)
   const entryRef = useRef<HTMLDivElement>(null)
   const mousePressedRef = useRef(false)
 
-  const openReviewPanel = useCallback(() => {
-    setReviewPanelOpen(true)
-  }, [setReviewPanelOpen])
-
   const selectEntry = useCallback(
-    event => {
+    (event: React.FocusEvent | React.MouseEvent) => {
       setFocused(true)
 
       if (event.target instanceof HTMLTextAreaElement) {
@@ -196,19 +194,12 @@ export const ReviewPanelEntry: FC<{
       }}
     >
       {entryIndicator && (
-        <div
-          className="review-panel-entry-indicator"
-          onMouseEnter={onEnterEntryIndicator}
-          onMouseLeave={onLeaveEntryIndicator}
-          onMouseDown={openReviewPanel} // Using onMouseDown rather than onClick to guarantee that it fires before onFocus
-          role="button"
-          tabIndex={0}
-        >
-          <MaterialIcon
-            type={entryIndicator}
-            className="review-panel-entry-icon"
-          />
-        </div>
+        <EntryIndicator
+          type={entryIndicator}
+          handleMouseEnter={handleEnter}
+          handleMouseLeave={handleLeave}
+          handleMouseDown={openReviewPanel}
+        />
       )}
       {children}
     </div>
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
index 3850614281..2e107159ed 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-expandable-content.tsx
@@ -1,24 +1,26 @@
-import { FC, useCallback, useRef, useState } from 'react'
+import { memo, useCallback, useRef, useState } from 'react'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import { useTranslation } from 'react-i18next'
 import classNames from 'classnames'
 import { PreventSelectingEntry } from './review-panel-prevent-selecting'
 
-export const ExpandableContent: FC<{
+export const ExpandableContent = memo<{
   className?: string
   content: string
   contentLimit?: number
   newLineCharsLimit?: number
   checkNewLines?: boolean
   inline?: boolean
-}> = ({
+  translate?: 'yes' | 'no'
+}>(function ExpandableContent({
   content,
   className,
   contentLimit = 50,
   newLineCharsLimit = 3,
   checkNewLines = true,
   inline = false,
-}) => {
+  translate,
+}) {
   const { t } = useTranslation()
   const contentRef = useRef<HTMLDivElement>(null)
   const [isExpanded, setIsExpanded] = useState(false)
@@ -50,6 +52,7 @@ export const ExpandableContent: FC<{
       <div
         ref={contentRef}
         className={classNames('review-panel-expandable-content', className)}
+        translate={translate}
       >
         {isExpanded ? content : content.slice(0, limit)}
         {isOverflowing && !isExpanded && '...'}
@@ -83,7 +86,7 @@ export const ExpandableContent: FC<{
       </div>
     </>
   )
-}
+})
 
 function indexOfNthLine(content: string, n: number) {
   if (n < 1) return null
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-header.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-header.tsx
index 6dafe4dcf0..ab5d5509e8 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-header.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-header.tsx
@@ -1,39 +1,18 @@
-import { FC, memo, useState } from 'react'
+import { FC, memo } from 'react'
 import { ReviewPanelResolvedThreadsButton } from './review-panel-resolved-threads-button'
-import { ReviewPanelTrackChangesMenu } from './review-panel-track-changes-menu'
-import ReviewPanelTrackChangesMenuButton from './review-panel-track-changes-menu-button'
-import { useLayoutContext } from '@/shared/context/layout-context'
 import { useTranslation } from 'react-i18next'
-import getMeta from '@/utils/meta'
 import { PanelHeading } from '@/shared/components/panel-heading'
-
-const isReviewerRoleEnabled = getMeta('ol-isReviewerRoleEnabled')
+import useReviewPanelLayout from '../hooks/use-review-panel-layout'
 
 const ReviewPanelHeader: FC = () => {
-  const [trackChangesMenuExpanded, setTrackChangesMenuExpanded] =
-    useState(false)
-  const { setReviewPanelOpen } = useLayoutContext()
+  const { closeReviewPanel } = useReviewPanelLayout()
   const { t } = useTranslation()
 
   return (
     <div className="review-panel-header">
-      <PanelHeading
-        title={t('review')}
-        handleClose={() => setReviewPanelOpen(false)}
-      >
-        {isReviewerRoleEnabled && <ReviewPanelResolvedThreadsButton />}
+      <PanelHeading title={t('review')} handleClose={closeReviewPanel}>
+        <ReviewPanelResolvedThreadsButton />
       </PanelHeading>
-      {!isReviewerRoleEnabled && (
-        <div className="review-panel-tools">
-          <ReviewPanelResolvedThreadsButton />
-          <ReviewPanelTrackChangesMenuButton
-            menuExpanded={trackChangesMenuExpanded}
-            setMenuExpanded={setTrackChangesMenuExpanded}
-          />
-        </div>
-      )}
-
-      {trackChangesMenuExpanded && <ReviewPanelTrackChangesMenu />}
     </div>
   )
 }
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
index ae3a66f729..41c8a8d5a2 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-message.tsx
@@ -40,7 +40,7 @@ export const ReviewPanelMessage: FC<{
   const user = useUserContext()
   const permissions = usePermissionsContext()
 
-  const isCommentAuthor = user.id === message.user.id
+  const isCommentAuthor = Boolean(message.user && user.id === message.user.id)
   const canEdit = isCommentAuthor && permissions.comment
   const canResolve =
     permissions.resolveAllComments ||
@@ -135,6 +135,7 @@ export const ReviewPanelMessage: FC<{
           contentLimit={100}
           checkNewLines
           content={message.content}
+          translate="no"
         />
       )}
 
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-overview.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-overview.tsx
index 575419677d..0f2a9ea49a 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-overview.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-overview.tsx
@@ -48,7 +48,11 @@ export const ReviewPanelOverview: FC = () => {
   }, [rangesForDocs])
 
   return (
-    <div className="review-panel-overview">
+    <div
+      className="review-panel-overview"
+      id="review-panel-overview"
+      aria-labelledby="review-panel-tab-button-overview"
+    >
       {error && <div>{t('something_went_wrong')}</div>}
 
       {showEmptyState && <ReviewPanelEmptyState />}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-prevent-selecting.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-prevent-selecting.tsx
index cad04048ce..30cc8a2439 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-prevent-selecting.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-prevent-selecting.tsx
@@ -1,5 +1,7 @@
-const stopPropagation = (e: React.FocusEvent | React.MouseEvent) =>
+const stopPropagation = (e: React.FocusEvent | React.MouseEvent) => {
   e.stopPropagation()
+  e.preventDefault()
+}
 
 export const PreventSelectingEntry = ({
   children,
@@ -8,7 +10,11 @@ export const PreventSelectingEntry = ({
 }) => {
   return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-    <div onFocus={stopPropagation} onMouseUp={stopPropagation}>
+    <div
+      onMouseDown={stopPropagation}
+      onFocus={stopPropagation}
+      onMouseUp={stopPropagation}
+    >
       {children}
     </div>
   )
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
index 53ac6d2192..76a12cd1c3 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-thread.tsx
@@ -73,7 +73,10 @@ export const ReviewPanelResolvedThread: FC<{
             i18nKey="from_filename"
             components={[
               // eslint-disable-next-line react/jsx-key
-              <span className="review-panel-resolved-comment-filename" />,
+              <span
+                className="review-panel-resolved-comment-filename"
+                translate="no"
+              />,
             ]}
             values={{ filename: docName }}
             shouldUnescape
@@ -121,6 +124,7 @@ export const ReviewPanelResolvedThread: FC<{
           className="review-panel-resolved-comment-quoted-text-quote"
           content={comment?.op.c}
           checkNewLines
+          translate="no"
         />
       </div>
 
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-threads-button.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-threads-button.tsx
index b44f39c16e..93192800ed 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-threads-button.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-resolved-threads-button.tsx
@@ -5,7 +5,6 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { ReviewPanelResolvedThreadsMenu } from './review-panel-resolved-threads-menu'
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
-import getMeta from '@/utils/meta'
 
 export const ReviewPanelResolvedThreadsButton: FC = () => {
   const [expanded, setExpanded] = useState(false)
@@ -20,13 +19,10 @@ export const ReviewPanelResolvedThreadsButton: FC = () => {
         description={t('resolved_comments')}
       >
         <button
-          className={
-            getMeta('ol-isReviewerRoleEnabled')
-              ? 'review-panel-resolved-comments-toggle-reviewer-role'
-              : 'review-panel-resolved-comments-toggle'
-          }
+          className="review-panel-resolved-comments-toggle"
           ref={buttonRef}
           onClick={() => setExpanded(true)}
+          aria-label={t('resolved_comments')}
         >
           <MaterialIcon type="inbox" />
         </button>
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx
index b7a1709b4d..dff291e573 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-tabs.tsx
@@ -16,6 +16,10 @@ const ReviewPanelTabs: FC = () => {
   return (
     <>
       <button
+        role="tab"
+        aria-selected={subView === 'cur_file'}
+        aria-controls="review-panel-current-file"
+        id="review-panel-tab-button-current-file"
         className={classnames('review-panel-tab', {
           'review-panel-tab-active': subView === 'cur_file',
         })}
@@ -25,6 +29,10 @@ const ReviewPanelTabs: FC = () => {
         {t('current_file')}
       </button>
       <button
+        role="tab"
+        aria-selected={subView === 'overview'}
+        aria-controls="review-panel-overview"
+        id="review-panel-tab-button-overview"
         className={classnames('review-panel-tab', {
           'review-panel-tab-active': subView === 'overview',
         })}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu-button.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu-button.tsx
deleted file mode 100644
index 60657e82d3..0000000000
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu-button.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import { FC, memo, useState } from 'react'
-import { Trans } from 'react-i18next'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
-import MaterialIcon from '@/shared/components/material-icon'
-import { useProjectContext } from '@/shared/context/project-context'
-import UpgradeTrackChangesModal from '@/features/review-panel-new/components/upgrade-track-changes-modal'
-import { send, sendMB } from '@/infrastructure/event-tracking'
-
-const sendAnalytics = () => {
-  send('subscription-funnel', 'editor-click-feature', 'real-time-track-changes')
-  sendMB('paywall-prompt', {
-    'paywall-type': 'track-changes',
-  })
-}
-
-const ReviewPanelTrackChangesMenuButton: FC<{
-  menuExpanded: boolean
-  setMenuExpanded: React.Dispatch<React.SetStateAction<boolean>>
-}> = ({ menuExpanded, setMenuExpanded }) => {
-  const project = useProjectContext()
-  const { wantTrackChanges } = useEditorManagerContext()
-
-  const [showModal, setShowModal] = useState(false)
-
-  const handleTrackChangesMenuExpand = () => {
-    if (project.features.trackChanges) {
-      setMenuExpanded(value => !value)
-    } else {
-      sendAnalytics()
-      setShowModal(true)
-    }
-  }
-
-  return (
-    <>
-      <button
-        className="track-changes-menu-button"
-        onClick={handleTrackChangesMenuExpand}
-      >
-        {wantTrackChanges && <div className="track-changes-indicator-circle" />}
-        {wantTrackChanges ? (
-          <Trans
-            i18nKey="track_changes_is_on"
-            components={{ strong: <strong /> }}
-          />
-        ) : (
-          <Trans
-            i18nKey="track_changes_is_off"
-            components={{ strong: <strong /> }}
-          />
-        )}
-        <MaterialIcon type={menuExpanded ? 'expand_more' : 'chevron_right'} />
-      </button>
-
-      <UpgradeTrackChangesModal show={showModal} setShow={setShowModal} />
-    </>
-  )
-}
-
-export default memo(ReviewPanelTrackChangesMenuButton)
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu.tsx
deleted file mode 100644
index 85f5cb4c26..0000000000
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-track-changes-menu.tsx
+++ /dev/null
@@ -1,92 +0,0 @@
-import { FC } from 'react'
-import TrackChangesToggle from '@/features/review-panel-new/components/track-changes-toggle'
-import { useProjectContext } from '@/shared/context/project-context'
-import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
-import { useTranslation } from 'react-i18next'
-import {
-  useTrackChangesStateActionsContext,
-  useTrackChangesStateContext,
-} from '../context/track-changes-state-context'
-import { useChangesUsersContext } from '../context/changes-users-context'
-import { buildName } from '../utils/build-name'
-
-export const ReviewPanelTrackChangesMenu: FC = () => {
-  const { t } = useTranslation()
-  const permissions = usePermissionsContext()
-  const project = useProjectContext()
-  const trackChanges = useTrackChangesStateContext()
-  const { saveTrackChanges } = useTrackChangesStateActionsContext()
-  const changesUsers = useChangesUsersContext()
-
-  if (trackChanges === undefined || !changesUsers) {
-    return null
-  }
-
-  const { onForEveryone, onForGuests, onForMembers } = trackChanges
-
-  const canToggle = project.features.trackChanges && permissions.write
-
-  return (
-    <div className="rp-tc-state">
-      <div className="rp-tc-state-item">
-        <span className="rp-tc-state-item-name">{t('tc_everyone')}</span>
-
-        <TrackChangesToggle
-          id="track-changes-everyone"
-          description={t('track_changes_for_everyone')}
-          handleToggle={() =>
-            saveTrackChanges(onForEveryone ? { on_for: {} } : { on: true })
-          }
-          value={onForEveryone}
-          disabled={!canToggle}
-        />
-      </div>
-
-      {[project.owner, ...project.members].map(member => {
-        const user = changesUsers.get(member._id) ?? member
-        const name = buildName(user)
-
-        const value = onForEveryone || onForMembers[member._id] === true
-
-        return (
-          <div key={member._id} className="rp-tc-state-item">
-            <span className="rp-tc-state-item-name">{name}</span>
-
-            <TrackChangesToggle
-              id={`track-changes-${member._id}`}
-              description={t('track_changes_for_x', { name })}
-              handleToggle={() => {
-                saveTrackChanges({
-                  on_for: {
-                    ...onForMembers,
-                    [member._id]: !value,
-                  },
-                  on_for_guests: onForGuests,
-                })
-              }}
-              value={value}
-              disabled={!canToggle || onForEveryone}
-            />
-          </div>
-        )
-      })}
-
-      <div className="rp-tc-state-item">
-        <span className="rp-tc-state-item-name">{t('tc_guests')}</span>
-
-        <TrackChangesToggle
-          id="track-changes-guests"
-          description={t('track_changes_for_guests')}
-          handleToggle={() =>
-            saveTrackChanges({
-              on_for: onForMembers,
-              on_for_guests: !onForGuests,
-            })
-          }
-          value={onForGuests}
-          disabled={!canToggle || onForEveryone}
-        />
-      </div>
-    </div>
-  )
-}
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel.tsx
index 3a20892f1c..74405ba276 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel.tsx
@@ -6,16 +6,18 @@ import { ReviewPanelOverview } from './review-panel-overview'
 import classnames from 'classnames'
 import { useReviewPanelStyles } from '@/features/review-panel-new/hooks/use-review-panel-styles'
 import { useReviewPanelViewContext } from '../context/review-panel-view-context'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 const ReviewPanel: FC<{ mini?: boolean }> = ({ mini = false }) => {
   const choosenSubView = useReviewPanelViewContext()
+  const newEditor = useIsNewEditorEnabled()
 
   const activeSubView = useMemo(
     () => (mini ? 'cur_file' : choosenSubView),
     [choosenSubView, mini]
   )
 
-  const style = useReviewPanelStyles(mini)
+  const style = useReviewPanelStyles()
 
   const className = classnames('review-panel-container', {
     'review-panel-mini': mini,
@@ -23,14 +25,18 @@ const ReviewPanel: FC<{ mini?: boolean }> = ({ mini = false }) => {
   })
 
   return (
-    <div className={className} style={style}>
+    <div className={className} style={style} data-testid="review-panel">
       <div id="review-panel-inner" className="review-panel-inner">
-        {!mini && <ReviewPanelHeader />}
+        {!newEditor && !mini && <ReviewPanelHeader />}
 
         {activeSubView === 'cur_file' && <ReviewPanelCurrentFile />}
         {activeSubView === 'overview' && <ReviewPanelOverview />}
 
-        <div className="review-panel-footer">
+        <div
+          className="review-panel-footer"
+          id="review-panel-tabs"
+          role="tablist"
+        >
           <ReviewPanelTabs />
         </div>
       </div>
diff --git a/services/web/frontend/js/features/review-panel-new/components/review-tooltip-menu.tsx b/services/web/frontend/js/features/review-panel-new/components/review-tooltip-menu.tsx
index 1b996ebf0b..f26542ebe9 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-tooltip-menu.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-tooltip-menu.tsx
@@ -31,15 +31,13 @@ import { isCursorNearViewportEdge } from '@/features/source-editor/utils/is-curs
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
 import { numberOfChangesInSelection } from '../utils/changes-in-selection'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 import classNames from 'classnames'
 import useEventListener from '@/shared/hooks/use-event-listener'
-import getMeta from '@/utils/meta'
+import useReviewPanelLayout from '../hooks/use-review-panel-layout'
 
-const isReviewerRoleEnabled = getMeta('ol-isReviewerRoleEnabled')
-const TRACK_CHANGES_ON_WIDGET_HEIGHT = 25
 const EDIT_MODE_SWITCH_WIDGET_HEIGHT = 40
-const CM_LINE_RIGHT_PADDING = isReviewerRoleEnabled ? 8 : 2
+const CM_LINE_RIGHT_PADDING = 8
 const TOOLTIP_SHOW_DELAY = 120
 
 const ReviewTooltipMenu: FC = () => {
@@ -48,8 +46,7 @@ const ReviewTooltipMenu: FC = () => {
   const isViewer = useViewerPermissions()
   const [show, setShow] = useState(true)
   const { setView } = useReviewPanelViewActionsContext()
-  const { setReviewPanelOpen } = useLayoutContext()
-
+  const { openReviewPanel } = useReviewPanelLayout()
   const tooltipState = state.field(reviewTooltipStateField, false)?.tooltip
   const previousTooltipState = usePreviousValue(tooltipState)
 
@@ -65,7 +62,7 @@ const ReviewTooltipMenu: FC = () => {
       return
     }
 
-    setReviewPanelOpen(true)
+    openReviewPanel()
     setView('cur_file')
 
     const effects = isCursorNearViewportEdge(view, main.anchor)
@@ -77,7 +74,7 @@ const ReviewTooltipMenu: FC = () => {
 
     view.dispatch({ effects })
     setShow(false)
-  }, [setReviewPanelOpen, setView, setShow, view])
+  }, [openReviewPanel, setView, setShow, view])
 
   useEventListener('add-new-review-comment', addComment)
 
@@ -107,7 +104,7 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
   const ranges = useRangesContext()
   const { acceptChanges, rejectChanges } = useRangesActionsContext()
   const { showGenericConfirmModal } = useModalsContext()
-  const { wantTrackChanges } = useEditorManagerContext()
+  const { wantTrackChanges } = useEditorPropertiesContext()
   const [tooltipStyle, setTooltipStyle] = useState<CSSProperties | undefined>()
   const [visible, setVisible] = useState(false)
 
@@ -131,8 +128,8 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
     showGenericConfirmModal({
       message: t('confirm_accept_selected_changes', { count: nChanges }),
       title: t('accept_selected_changes'),
-      onConfirm: () => {
-        acceptChanges(...changeIdsInSelection)
+      onConfirm: async () => {
+        await acceptChanges(...changeIdsInSelection)
       },
       primaryVariant: 'danger',
     })
@@ -153,8 +150,8 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
     showGenericConfirmModal({
       message: t('confirm_reject_selected_changes', { count: nChanges }),
       title: t('reject_selected_changes'),
-      onConfirm: () => {
-        rejectChanges(...changeIdsInSelection)
+      onConfirm: async () => {
+        await rejectChanges(...changeIdsInSelection)
       },
       primaryVariant: 'danger',
     })
@@ -190,16 +187,9 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
           return
         }
 
-        let widgetOffset = 0
-        if (isReviewerRoleEnabled) {
-          widgetOffset = EDIT_MODE_SWITCH_WIDGET_HEIGHT
-        } else if (wantTrackChanges && !reviewPanelOpen) {
-          widgetOffset = TRACK_CHANGES_ON_WIDGET_HEIGHT
-        }
-
         return {
           position: 'fixed' as const,
-          top: scrollDomRect.top + widgetOffset,
+          top: scrollDomRect.top + EDIT_MODE_SWITCH_WIDGET_HEIGHT,
           right: window.innerWidth - editorRightPos,
         }
       },
@@ -244,6 +234,7 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
             <button
               className="review-tooltip-menu-button"
               onClick={acceptChangesHandler}
+              aria-label={t('accept_selected_changes')}
             >
               <MaterialIcon type="check" />
             </button>
@@ -256,6 +247,7 @@ const ReviewTooltipMenuContent: FC<{ onAddComment: () => void }> = ({
             <button
               className="review-tooltip-menu-button"
               onClick={rejectChangesHandler}
+              aria-label={t('reject_selected_changes')}
             >
               <MaterialIcon type="clear" />
             </button>
diff --git a/services/web/frontend/js/features/review-panel-new/components/track-changes-on-widget.tsx b/services/web/frontend/js/features/review-panel-new/components/track-changes-on-widget.tsx
deleted file mode 100644
index 63ee10060f..0000000000
--- a/services/web/frontend/js/features/review-panel-new/components/track-changes-on-widget.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Trans } from 'react-i18next'
-import { EditorView } from '@codemirror/view'
-import classnames from 'classnames'
-import { useCodeMirrorStateContext } from '@/features/source-editor/components/codemirror-context'
-import { useLayoutContext } from '@/shared/context/layout-context'
-import { useCallback } from 'react'
-
-function TrackChangesOnWidget() {
-  const { setReviewPanelOpen } = useLayoutContext()
-  const state = useCodeMirrorStateContext()
-  const darkTheme = state.facet(EditorView.darkTheme)
-
-  const openReviewPanel = useCallback(() => {
-    setReviewPanelOpen(true)
-  }, [setReviewPanelOpen])
-
-  return (
-    <div className="review-panel-in-editor-widgets">
-      <div className="review-panel-in-editor-widgets-inner">
-        <button
-          className={classnames('review-panel-track-changes-indicator', {
-            'review-panel-track-changes-indicator-on-dark': darkTheme,
-          })}
-          onClick={openReviewPanel}
-        >
-          <Trans
-            i18nKey="track_changes_is_on"
-            components={{ strong: <strong /> }}
-          />
-        </button>
-      </div>
-    </div>
-  )
-}
-
-export default TrackChangesOnWidget
diff --git a/services/web/frontend/js/features/review-panel-new/components/upgrade-track-changes-modal.tsx b/services/web/frontend/js/features/review-panel-new/components/upgrade-track-changes-modal.tsx
index 2c3205d902..4611060438 100644
--- a/services/web/frontend/js/features/review-panel-new/components/upgrade-track-changes-modal.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/upgrade-track-changes-modal.tsx
@@ -26,15 +26,15 @@ function UpgradeTrackChangesModal({
   setShow,
 }: UpgradeTrackChangesModalProps) {
   const { t } = useTranslation()
-  const project = useProjectContext()
+  const { project } = useProjectContext()
   const user = useUserContext()
 
   return (
     <OLModal show={show} onHide={() => setShow(false)}>
       <OLModalHeader closeButton>
-        <OLModalTitle>{t('upgrade_to_track_changes')}</OLModalTitle>
+        <OLModalTitle>{t('upgrade_to_review')}</OLModalTitle>
       </OLModalHeader>
-      <OLModalBody>
+      <OLModalBody className="upgrade-track-changes-modal">
         <div className="teaser-video-container">
           {/* eslint-disable-next-line jsx-a11y/media-has-caption */}
           <video className="teaser-video" autoPlay loop>
@@ -45,41 +45,36 @@ function UpgradeTrackChangesModal({
             />
           </video>
         </div>
-        <h4 className="teaser-title">
-          {t('see_changes_in_your_documents_live')}
-        </h4>
+        <h4 className="teaser-title">{t('get_real_time_track_changes')}</h4>
         <OLRow>
           <OLCol lg={{ span: 10, offset: 1 }}>
             <ul className="list-unstyled">
               {[
-                t('track_any_change_in_real_time'),
-                t('review_your_peers_work'),
-                t('accept_or_reject_each_changes_individually'),
+                t('see_suggestions_from_collaborators'),
+                t('accept_or_reject_individual_edits'),
+                t('access_all_premium_features'),
               ].map(translation => (
                 <li key={translation}>
-                  <MaterialIcon type="check" className="align-text-bottom" />
-                  &nbsp;{translation}
+                  <MaterialIcon type="check" className="check-icon" />
+                  <span>{translation}</span>
                 </li>
               ))}
             </ul>
           </OLCol>
         </OLRow>
-        <p className="small">
-          {t('already_subscribed_try_refreshing_the_page')}
-        </p>
-        {project.owner && (
+        {Boolean(project?.owner) && (
           <div className="text-center">
-            {project.owner._id === user.id ? (
+            {project?.owner._id === user.id ? (
               user.allowedFreeTrial ? (
                 <OLButton
-                  variant="primary"
+                  variant="premium"
                   onClick={() => startFreeTrial('track-changes')}
                 >
                   {t('try_it_for_free')}
                 </OLButton>
               ) : (
                 <OLButton
-                  variant="primary"
+                  variant="premium"
                   onClick={() => upgradePlan('project-sharing')}
                 >
                   {t('upgrade')}
diff --git a/services/web/frontend/js/features/review-panel-new/context/changes-users-context.tsx b/services/web/frontend/js/features/review-panel-new/context/changes-users-context.tsx
index e875736f52..98220ea639 100644
--- a/services/web/frontend/js/features/review-panel-new/context/changes-users-context.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/changes-users-context.tsx
@@ -26,8 +26,11 @@ export const ChangesUsersContext = createContext<ChangesUsers | undefined>(
   undefined
 )
 
-export const ChangesUsersProvider: FC = ({ children }) => {
-  const { _id: projectId, members, owner } = useProjectContext()
+export const ChangesUsersProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const { projectId, project } = useProjectContext()
+  const { members, owner } = project || {}
   const { isRestrictedTokenMember } = useEditorContext()
 
   const [changesUsers, setChangesUsers] = useState<ChangesUsers>()
@@ -47,6 +50,9 @@ export const ChangesUsersProvider: FC = ({ children }) => {
 
   // add the project owner and members to the changes users data
   const value = useMemo(() => {
+    if (!owner || !members) {
+      return
+    }
     const value: ChangesUsers = new Map(changesUsers)
     value.set(owner._id, { ...owner, id: owner._id })
     for (const member of members) {
diff --git a/services/web/frontend/js/features/review-panel-new/context/ranges-context.tsx b/services/web/frontend/js/features/review-panel-new/context/ranges-context.tsx
index 0ed20347c8..f5e9c94c09 100644
--- a/services/web/frontend/js/features/review-panel-new/context/ranges-context.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/ranges-context.tsx
@@ -21,7 +21,7 @@ import { useIdeReactContext } from '@/features/ide-react/context/ide-react-conte
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
 import useSocketListener from '@/features/ide-react/hooks/use-socket-listener'
 import { throttle } from 'lodash'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 
 export type Ranges = {
   docId: string
@@ -32,8 +32,8 @@ export type Ranges = {
 export const RangesContext = createContext<Ranges | undefined>(undefined)
 
 type RangesActions = {
-  acceptChanges: (...ids: string[]) => void
-  rejectChanges: (...ids: string[]) => void
+  acceptChanges: (...ids: string[]) => Promise<void>
+  rejectChanges: (...ids: string[]) => Promise<void>
 }
 
 const buildRanges = (currentDocument: DocumentContainer | null) => {
@@ -78,10 +78,10 @@ const buildRanges = (currentDocument: DocumentContainer | null) => {
 
 const RangesActionsContext = createContext<RangesActions | undefined>(undefined)
 
-export const RangesProvider: FC = ({ children }) => {
+export const RangesProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const view = useCodeMirrorViewContext()
   const { projectId } = useIdeReactContext()
-  const { currentDocument } = useEditorManagerContext()
+  const { currentDocument } = useEditorOpenDocContext()
   const { socket } = useConnectionContext()
   const [ranges, setRanges] = useState<Ranges | undefined>(() =>
     buildRanges(currentDocument)
@@ -166,7 +166,7 @@ export const RangesProvider: FC = ({ children }) => {
           setRanges(buildRanges(currentDocument))
         }
       },
-      rejectChanges(...ids: string[]) {
+      async rejectChanges(...ids: string[]) {
         if (currentDocument?.ranges) {
           view.dispatch(rejectChanges(view.state, currentDocument.ranges, ids))
         }
diff --git a/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx b/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
index 34cb175129..ad943772d0 100644
--- a/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/review-panel-providers.tsx
@@ -4,8 +4,16 @@ import { ChangesUsersProvider } from './changes-users-context'
 import { TrackChangesStateProvider } from './track-changes-state-context'
 import { ThreadsProvider } from './threads-context'
 import { ReviewPanelViewProvider } from './review-panel-view-context'
+import { useProjectContext } from '@/shared/context/project-context'
+
+export const ReviewPanelProviders: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const { features } = useProjectContext()
+  if (!features.trackChangesVisible) {
+    return children
+  }
 
-export const ReviewPanelProviders: FC = ({ children }) => {
   return (
     <ReviewPanelViewProvider>
       <ChangesUsersProvider>
diff --git a/services/web/frontend/js/features/review-panel-new/context/review-panel-view-context.tsx b/services/web/frontend/js/features/review-panel-new/context/review-panel-view-context.tsx
index 7305c68fc0..03d274a8af 100644
--- a/services/web/frontend/js/features/review-panel-new/context/review-panel-view-context.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/review-panel-view-context.tsx
@@ -20,7 +20,9 @@ const ReviewPanelViewActionsContext = createContext<ViewActions | undefined>(
   undefined
 )
 
-export const ReviewPanelViewProvider: FC = ({ children }) => {
+export const ReviewPanelViewProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [view, setView] = useState<View>('cur_file')
 
   const actions = useMemo(
diff --git a/services/web/frontend/js/features/review-panel-new/context/threads-context.tsx b/services/web/frontend/js/features/review-panel-new/context/threads-context.tsx
index fce47e9054..6b73073bfc 100644
--- a/services/web/frontend/js/features/review-panel-new/context/threads-context.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/threads-context.tsx
@@ -20,7 +20,7 @@ import { UserId } from '../../../../../types/user'
 import { deleteJSON, getJSON, postJSON } from '@/infrastructure/fetch-json'
 import RangesTracker from '@overleaf/ranges-tracker'
 import { CommentOperation } from '../../../../../types/change'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import { useEditorContext } from '@/shared/context/editor-context'
 import { debugConsole } from '@/utils/debugging'
 import { captureException } from '@/infrastructure/error-reporter'
@@ -48,9 +48,9 @@ const ThreadsActionsContext = createContext<ThreadsActions | undefined>(
   undefined
 )
 
-export const ThreadsProvider: FC = ({ children }) => {
-  const { _id: projectId } = useProjectContext()
-  const { currentDocument } = useEditorManagerContext()
+export const ThreadsProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const { projectId } = useProjectContext()
+  const { currentDocument } = useEditorOpenDocContext()
   const { isRestrictedTokenMember } = useEditorContext()
 
   // const [error, setError] = useState<Error>()
@@ -89,7 +89,7 @@ export const ThreadsProvider: FC = ({ children }) => {
       ) => {
         setData(value => {
           if (value) {
-            const { submitting, ...thread } = value[threadId] ?? {
+            const { submitting: _submitting, ...thread } = value[threadId] ?? {
               messages: [],
             }
 
@@ -225,7 +225,7 @@ export const ThreadsProvider: FC = ({ children }) => {
   useSocketListener(
     socket,
     'new-comment-threads',
-    useCallback(threads => {
+    useCallback((threads: any) => {
       setData(prevState => {
         const newThreads = { ...prevState }
         for (const threadId of Object.keys(threads)) {
diff --git a/services/web/frontend/js/features/review-panel-new/context/track-changes-state-context.tsx b/services/web/frontend/js/features/review-panel-new/context/track-changes-state-context.tsx
index b9eb61c7a5..e68ef1fec1 100644
--- a/services/web/frontend/js/features/review-panel-new/context/track-changes-state-context.tsx
+++ b/services/web/frontend/js/features/review-panel-new/context/track-changes-state-context.tsx
@@ -11,13 +11,12 @@ import {
 import useSocketListener from '@/features/ide-react/hooks/use-socket-listener'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
 import { useProjectContext } from '@/shared/context/project-context'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 import { useUserContext } from '@/shared/context/user-context'
 import { postJSON } from '@/infrastructure/fetch-json'
 import useEventListener from '@/shared/hooks/use-event-listener'
-import { ProjectContextValue } from '@/shared/context/types/project-context'
+import { ProjectMetadata } from '@/shared/context/types/project-metadata'
 import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
-import getMeta from '@/utils/meta'
 
 export type TrackChangesState = {
   onForEveryone: boolean
@@ -44,17 +43,19 @@ const TrackChangesStateActionsContext = createContext<
   TrackChangesStateActions | undefined
 >(undefined)
 
-export const TrackChangesStateProvider: FC = ({ children }) => {
+export const TrackChangesStateProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const permissions = usePermissionsContext()
   const { socket } = useConnectionContext()
-  const project = useProjectContext()
+  const { projectId, project, features } = useProjectContext()
   const user = useUserContext()
-  const { setWantTrackChanges } = useEditorManagerContext()
+  const { setWantTrackChanges } = useEditorPropertiesContext()
 
   // TODO: update project.trackChangesState instead?
   const [trackChangesValue, setTrackChangesValue] = useState<
-    ProjectContextValue['trackChangesState']
-  >(project.trackChangesState ?? false)
+    ProjectMetadata['trackChangesState']
+  >(project?.trackChangesState ?? false)
 
   useSocketListener(socket, 'toggle-track-changes', setTrackChangesValue)
 
@@ -87,35 +88,25 @@ export const TrackChangesStateProvider: FC = ({ children }) => {
 
   const saveTrackChanges = useCallback(
     async (trackChangesBody: SaveTrackChangesRequestBody) => {
-      postJSON(`/project/${project._id}/track_changes`, {
+      postJSON(`/project/${projectId}/track_changes`, {
         body: trackChangesBody,
       })
     },
-    [project._id]
+    [projectId]
   )
 
   const saveTrackChangesForCurrentUser = useCallback(
     async (trackChanges: boolean) => {
       if (user.id) {
-        if (getMeta('ol-isReviewerRoleEnabled')) {
-          saveTrackChanges({
-            on_for: {
-              ...onForMembers,
-              [user.id]: trackChanges,
-            },
-          })
-        } else {
-          saveTrackChanges({
-            on_for: {
-              ...onForMembers,
-              [user.id]: trackChanges,
-            },
-            on_for_guests: onForGuests,
-          })
-        }
+        saveTrackChanges({
+          on_for: {
+            ...onForMembers,
+            [user.id]: trackChanges,
+          },
+        })
       }
     },
-    [onForMembers, onForGuests, user.id, saveTrackChanges]
+    [onForMembers, user.id, saveTrackChanges]
   )
 
   const actions = useMemo(
@@ -131,35 +122,24 @@ export const TrackChangesStateProvider: FC = ({ children }) => {
     useCallback(() => {
       if (
         user.id &&
-        project.features.trackChanges &&
+        features.trackChanges &&
         permissions.write &&
         !onForEveryone
       ) {
         const value = onForMembers[user.id]
-        if (getMeta('ol-isReviewerRoleEnabled')) {
-          actions.saveTrackChanges({
-            on_for: {
-              ...onForMembers,
-              [user.id]: !value,
-            },
-          })
-        } else {
-          actions.saveTrackChanges({
-            on_for: {
-              ...onForMembers,
-              [user.id]: !value,
-            },
-            on_for_guests: onForGuests,
-          })
-        }
+        actions.saveTrackChanges({
+          on_for: {
+            ...onForMembers,
+            [user.id]: !value,
+          },
+        })
       }
     }, [
       actions,
       onForMembers,
-      onForGuests,
       onForEveryone,
       permissions.write,
-      project.features.trackChanges,
+      features.trackChanges,
       user.id,
     ])
   )
diff --git a/services/web/frontend/js/features/review-panel-new/hooks/use-more-comments.ts b/services/web/frontend/js/features/review-panel-new/hooks/use-more-comments.ts
index 5fbc94d241..f541839e03 100644
--- a/services/web/frontend/js/features/review-panel-new/hooks/use-more-comments.ts
+++ b/services/web/frontend/js/features/review-panel-new/hooks/use-more-comments.ts
@@ -8,7 +8,7 @@ import {
 import { DecorationSet, EditorView } from '@codemirror/view'
 import { EditorSelection } from '@codemirror/state'
 import _ from 'lodash'
-import { useLayoutContext } from '@/shared/context/layout-context'
+import useReviewPanelLayout from './use-review-panel-layout'
 
 const useMoreCommments = (
   changes: Change<EditOperation>[],
@@ -20,7 +20,8 @@ const useMoreCommments = (
   onMoreCommentsBelowClick: null | (() => void)
 } => {
   const view = useCodeMirrorViewContext()
-  const { reviewPanelOpen } = useLayoutContext()
+  const { showPanel, mini } = useReviewPanelLayout()
+  const reviewPanelOpen = showPanel && !mini
 
   const [positionAbove, setPositionAbove] = useState<number | null>(null)
   const [positionBelow, setPositionBelow] = useState<number | null>(null)
diff --git a/services/web/frontend/js/features/review-panel-new/hooks/use-overview-file-collapsed.ts b/services/web/frontend/js/features/review-panel-new/hooks/use-overview-file-collapsed.ts
index fcc3f9a053..f2f12ec664 100644
--- a/services/web/frontend/js/features/review-panel-new/hooks/use-overview-file-collapsed.ts
+++ b/services/web/frontend/js/features/review-panel-new/hooks/use-overview-file-collapsed.ts
@@ -2,12 +2,41 @@ import { useCallback } from 'react'
 import { DocId } from '../../../../../types/project-settings'
 import { useProjectContext } from '../../../shared/context/project-context'
 import usePersistedState from '../../../shared/hooks/use-persisted-state'
+import { debugConsole } from '@/utils/debugging'
+
+const safeStringify = (value: unknown) => {
+  try {
+    return JSON.stringify(value)
+  } catch (e) {
+    debugConsole.error('double stringify exception', e)
+    return ''
+  }
+}
+
+const safeParse = (value: string) => {
+  try {
+    return JSON.parse(value)
+  } catch (e) {
+    debugConsole.error('double parse exception', e)
+    return null
+  }
+}
 
 export default function useOverviewFileCollapsed(docId: DocId) {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const [collapsedDocs, setCollapsedDocs] = usePersistedState<
-    Record<DocId, boolean>
-  >(`docs_collapsed_state:${projectId}`, {}, false, true)
+    Record<DocId, boolean>,
+    string
+  >(
+    `docs_collapsed_state:${projectId}`,
+    {},
+    {
+      converter: {
+        fromPersisted: safeParse,
+        toPersisted: safeStringify,
+      },
+    }
+  )
 
   const toggleCollapsed = useCallback(() => {
     setCollapsedDocs((collapsedDocs: Record<DocId, boolean>) => {
diff --git a/services/web/frontend/js/features/review-panel-new/hooks/use-project-ranges.ts b/services/web/frontend/js/features/review-panel-new/hooks/use-project-ranges.ts
index 95e854d9ca..23ff05479e 100644
--- a/services/web/frontend/js/features/review-panel-new/hooks/use-project-ranges.ts
+++ b/services/web/frontend/js/features/review-panel-new/hooks/use-project-ranges.ts
@@ -6,7 +6,7 @@ import useSocketListener from '@/features/ide-react/hooks/use-socket-listener'
 import { useConnectionContext } from '@/features/ide-react/context/connection-context'
 
 export default function useProjectRanges() {
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const [error, setError] = useState<Error>()
   const [projectRanges, setProjectRanges] = useState<Map<string, Ranges>>()
   const [loading, setLoading] = useState(true)
diff --git a/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-layout.ts b/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-layout.ts
new file mode 100644
index 0000000000..97f3deac16
--- /dev/null
+++ b/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-layout.ts
@@ -0,0 +1,55 @@
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useRangesContext } from '../context/ranges-context'
+import { useThreadsContext } from '@/features/review-panel-new/context/threads-context'
+import { hasActiveRange } from '@/features/review-panel-new/utils/has-active-range'
+import { useRailContext } from '@/features/ide-redesign/contexts/rail-context'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useCallback } from 'react'
+
+export default function useReviewPanelLayout(): {
+  showPanel: boolean
+  showHeader: boolean
+  mini: boolean
+  openReviewPanel: () => void
+  closeReviewPanel: () => void
+} {
+  const ranges = useRangesContext()
+  const threads = useThreadsContext()
+  const {
+    selectedTab: selectedRailTab,
+    isOpen: railIsOpen,
+    openTab: openRailTab,
+    setIsOpen: setRailIsOpen,
+  } = useRailContext()
+  const { reviewPanelOpen: reviewPanelOpenOldEditor, setReviewPanelOpen } =
+    useLayoutContext()
+
+  const newEditor = useIsNewEditorEnabled()
+
+  const reviewPanelOpen = newEditor
+    ? selectedRailTab === 'review-panel' && railIsOpen
+    : reviewPanelOpenOldEditor
+
+  const openReviewPanel = useCallback(() => {
+    if (newEditor) {
+      openRailTab('review-panel')
+    } else {
+      setReviewPanelOpen(true)
+    }
+  }, [newEditor, setReviewPanelOpen, openRailTab])
+
+  const closeReviewPanel = useCallback(() => {
+    if (newEditor) {
+      setRailIsOpen(false)
+    } else {
+      setReviewPanelOpen(false)
+    }
+  }, [newEditor, setReviewPanelOpen, setRailIsOpen])
+
+  const hasCommentOrChange = hasActiveRange(ranges, threads)
+  const showPanel = reviewPanelOpen || !!hasCommentOrChange
+  const mini = !reviewPanelOpen
+  const showHeader = showPanel && !mini
+
+  return { showPanel, showHeader, mini, openReviewPanel, closeReviewPanel }
+}
diff --git a/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-styles.ts b/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-styles.ts
index f40e42e9a5..727701ccc3 100644
--- a/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-styles.ts
+++ b/services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-styles.ts
@@ -1,14 +1,11 @@
 import { CSSProperties, useCallback, useEffect, useState } from 'react'
 import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
-import getMeta from '@/utils/meta'
 
-export const useReviewPanelStyles = (mini: boolean) => {
+export const useReviewPanelStyles = () => {
   const view = useCodeMirrorViewContext()
 
   const [styles, setStyles] = useState<CSSProperties>({
-    '--review-panel-header-height': getMeta('ol-isReviewerRoleEnabled')
-      ? '36px'
-      : '69px',
+    '--review-panel-header-height': '36px',
   } as CSSProperties)
 
   const updateScrollDomVariables = useCallback((element: HTMLDivElement) => {
@@ -30,13 +27,6 @@ export const useReviewPanelStyles = (mini: boolean) => {
     }))
   }, [])
 
-  useEffect(() => {
-    setStyles(value => ({
-      ...value,
-      '--review-panel-width': mini ? '22px' : '230px',
-    }))
-  }, [mini])
-
   useEffect(() => {
     if ('ResizeObserver' in window) {
       const scrollDomObserver = new window.ResizeObserver(entries =>
diff --git a/services/web/frontend/js/features/review-panel-new/utils/build-name.ts b/services/web/frontend/js/features/review-panel-new/utils/build-name.ts
index 9bfb6902c4..bd1fbf1a12 100644
--- a/services/web/frontend/js/features/review-panel-new/utils/build-name.ts
+++ b/services/web/frontend/js/features/review-panel-new/utils/build-name.ts
@@ -1,15 +1,17 @@
-export const buildName = (user?: {
+export const buildName = (user: {
   first_name?: string
   last_name?: string
   email?: string
 }) => {
-  const name = [user?.first_name, user?.last_name].filter(Boolean).join(' ')
+  const name = [user.first_name, user.last_name].filter(Boolean).join(' ')
 
   if (name) {
     return name
   }
-  if (user?.email) {
+
+  if (user.email) {
     return user.email.split('@')[0]
   }
+
   return 'Unknown'
 }
diff --git a/services/web/frontend/js/features/review-panel-new/utils/has-active-range.ts b/services/web/frontend/js/features/review-panel-new/utils/has-active-range.ts
index 0934aef59f..7b636c69a3 100644
--- a/services/web/frontend/js/features/review-panel-new/utils/has-active-range.ts
+++ b/services/web/frontend/js/features/review-panel-new/utils/has-active-range.ts
@@ -15,8 +15,9 @@ export const hasActiveRange = (
     return true
   }
 
-  for (const thread of Object.values(threads)) {
-    if (!thread.resolved) {
+  for (const comment of ranges.comments) {
+    const thread = threads[comment.op.t]
+    if (thread && !thread.resolved) {
       return true
     }
   }
diff --git a/services/web/frontend/js/features/review-panel-new/utils/position-items.ts b/services/web/frontend/js/features/review-panel-new/utils/position-items.ts
index 26fecc19de..e38e663ab0 100644
--- a/services/web/frontend/js/features/review-panel-new/utils/position-items.ts
+++ b/services/web/frontend/js/features/review-panel-new/utils/position-items.ts
@@ -1,15 +1,15 @@
-import getMeta from '@/utils/meta'
 import { debounce } from 'lodash'
 
 export const OFFSET_FOR_ENTRIES_ABOVE = 70
-const COLLAPSED_HEADER_HEIGHT = getMeta('ol-isReviewerRoleEnabled') ? 42 : 75
+const COLLAPSED_HEADER_HEIGHT = 42
 const GAP_BETWEEN_ENTRIES = 4
 
 export const positionItems = debounce(
   (
     element: HTMLDivElement,
     previousFocusedItemIndex: number | undefined,
-    docId: string
+    docId: string,
+    newEditor: boolean
   ) => {
     const items = Array.from(
       element.querySelectorAll<HTMLDivElement>('.review-panel-entry')
@@ -42,39 +42,45 @@ export const positionItems = debounce(
       return
     }
 
-    const activeItemTop = getTopPosition(activeItem, activeItemIndex === 0)
+    const activeItemTop = getTopPosition(
+      activeItem,
+      activeItemIndex === 0,
+      newEditor
+    )
 
-    activeItem.style.top = `${activeItemTop}px`
-    activeItem.style.visibility = 'visible'
-    const focusedItemRect = activeItem.getBoundingClientRect()
+    const positions: [HTMLElement, number][] = []
+    positions.push([activeItem, activeItemTop])
 
     // above the active item
     let topLimit = activeItemTop
     for (let i = activeItemIndex - 1; i >= 0; i--) {
       const item = items[i]
-      const rect = item.getBoundingClientRect()
-      let top = getTopPosition(item, i === 0)
-      const bottom = top + rect.height
+      const height = item.offsetHeight
+      let top = getTopPosition(item, i === 0, newEditor)
+      const bottom = top + height
       if (bottom > topLimit) {
-        top = topLimit - rect.height - GAP_BETWEEN_ENTRIES
+        top = topLimit - height - GAP_BETWEEN_ENTRIES
       }
-      item.style.top = `${top}px`
-      item.style.visibility = 'visible'
+      positions.push([item, top])
       topLimit = top
     }
 
     // below the active item
-    let bottomLimit = activeItemTop + focusedItemRect.height
+    let bottomLimit = activeItemTop + activeItem.offsetHeight
     for (let i = activeItemIndex + 1; i < items.length; i++) {
       const item = items[i]
-      const rect = item.getBoundingClientRect()
-      let top = getTopPosition(item, false)
+      const height = item.offsetHeight
+      let top = getTopPosition(item, false, newEditor)
       if (top < bottomLimit) {
         top = bottomLimit + GAP_BETWEEN_ENTRIES
       }
+      positions.push([item, top])
+      bottomLimit = top + height
+    }
+
+    for (const [item, top] of positions) {
       item.style.top = `${top}px`
       item.style.visibility = 'visible'
-      bottomLimit = top + rect.height
     }
 
     return {
@@ -86,7 +92,16 @@ export const positionItems = debounce(
   { leading: false, trailing: true, maxWait: 1000 }
 )
 
-function getTopPosition(item: HTMLDivElement, isFirstEntry: boolean) {
+function getTopPosition(
+  item: HTMLDivElement,
+  isFirstEntry: boolean,
+  newEditor: boolean
+) {
   const offset = isFirstEntry ? 0 : OFFSET_FOR_ENTRIES_ABOVE
+
+  if (newEditor) {
+    return Math.max(offset, Number(item.dataset.top))
+  }
+
   return Math.max(COLLAPSED_HEADER_HEIGHT + offset, Number(item.dataset.top))
 }
diff --git a/services/web/frontend/js/features/settings/components/account-info-section.tsx b/services/web/frontend/js/features/settings/components/account-info-section.tsx
index 4fd410d89f..1ff865e757 100644
--- a/services/web/frontend/js/features/settings/components/account-info-section.tsx
+++ b/services/web/frontend/js/features/settings/components/account-info-section.tsx
@@ -70,7 +70,7 @@ function AccountInfoSection() {
 
   return (
     <>
-      <h3>{t('update_account_info')}</h3>
+      <h3 id="update-account-info">{t('update_account_info')}</h3>
       <form id="account-info-form" onSubmit={handleSubmit}>
         {hasAffiliationsFeature ? null : (
           <ReadOrWriteFormGroup
@@ -128,6 +128,7 @@ function AccountInfoSection() {
               disabled={!isFormValid}
               isLoading={isLoading}
               loadingLabel={t('saving') + '…'}
+              aria-labelledby={isLoading ? undefined : 'update-account-info'}
             >
               {t('update')}
             </OLButton>
diff --git a/services/web/frontend/js/features/settings/components/emails-section.tsx b/services/web/frontend/js/features/settings/components/emails-section.tsx
index a8bc54b017..e58dcd213a 100644
--- a/services/web/frontend/js/features/settings/components/emails-section.tsx
+++ b/services/web/frontend/js/features/settings/components/emails-section.tsx
@@ -26,6 +26,20 @@ function EmailsSectionContent() {
   // Only show the "add email" button if the user has permission to add a secondary email
   const hideAddSecondaryEmail = getMeta('ol-cannot-add-secondary-email')
 
+  // Sort emails: primary first, then confirmed secondary emails, then unconfirmed secondary emails
+  const sortedUserEmails = [...userEmails].sort((a, b) => {
+    // Primary email comes first
+    if (a.default) return -1
+    if (b.default) return 1
+
+    // Then sort by confirmation status
+    if (a.confirmedAt && !b.confirmedAt) return -1
+    if (!a.confirmedAt && b.confirmedAt) return 1
+
+    // If both have the same status, sort by email string
+    return a.email.localeCompare(b.email)
+  })
+
   return (
     <>
       <h2 className="h3">{t('emails_and_affiliations_title')}</h2>
@@ -54,7 +68,7 @@ function EmailsSectionContent() {
           </div>
         ) : (
           <>
-            {userEmails?.map(userEmail => (
+            {sortedUserEmails.map(userEmail => (
               <Fragment key={userEmail.email}>
                 <EmailsRow userEmailData={userEmail} primary={primary} />
                 <div className="horizontal-divider" />
diff --git a/services/web/frontend/js/features/settings/components/emails/actions/make-primary/confirmation-modal.tsx b/services/web/frontend/js/features/settings/components/emails/actions/make-primary/confirmation-modal.tsx
index cdc1b9d481..66f4da7c99 100644
--- a/services/web/frontend/js/features/settings/components/emails/actions/make-primary/confirmation-modal.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/actions/make-primary/confirmation-modal.tsx
@@ -1,5 +1,4 @@
 import { useTranslation, Trans } from 'react-i18next'
-import AccessibleModal from '../../../../../../shared/components/accessible-modal'
 import { MergeAndOverride } from '../../../../../../../../types/utils'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLModal, {
@@ -11,7 +10,7 @@ import OLModal, {
 import { type UserEmailData } from '../../../../../../../../types/user-email'
 
 type ConfirmationModalProps = MergeAndOverride<
-  React.ComponentProps<typeof AccessibleModal>,
+  React.ComponentProps<typeof OLModal>,
   {
     email: string
     isConfirmDisabled: boolean
diff --git a/services/web/frontend/js/features/settings/components/emails/actions/remove.tsx b/services/web/frontend/js/features/settings/components/emails/actions/remove.tsx
index 136efc04e4..36123cdd1e 100644
--- a/services/web/frontend/js/features/settings/components/emails/actions/remove.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/actions/remove.tsx
@@ -37,7 +37,7 @@ type RemoveProps = {
 
 function Remove({ userEmailData, deleteEmailAsync }: RemoveProps) {
   const { t } = useTranslation()
-  const { state, deleteEmail, resetLeaversSurveyExpiration } =
+  const { state, deleteEmail, resetLeaversSurveyExpiration, setLoading } =
     useUserEmailsContext()
   const isManaged = getMeta('ol-isManagedAccount')
 
@@ -62,8 +62,12 @@ function Remove({ userEmailData, deleteEmailAsync }: RemoveProps) {
       .then(() => {
         deleteEmail(userEmailData.email)
         resetLeaversSurveyExpiration(userEmailData)
+        // Reset the global loading state before this row is unmounted
+        setLoading(false)
+      })
+      .catch(() => {
+        setLoading(false)
       })
-      .catch(() => {})
   }
 
   if (deleteEmailAsync.isLoading) {
diff --git a/services/web/frontend/js/features/settings/components/emails/add-email/country-input.tsx b/services/web/frontend/js/features/settings/components/emails/add-email/country-input.tsx
index 77f219c070..e94b39c935 100644
--- a/services/web/frontend/js/features/settings/components/emails/add-email/country-input.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/add-email/country-input.tsx
@@ -24,10 +24,8 @@ function Downshift({ setValue, inputRef }: CountryInputProps) {
     getLabelProps,
     getMenuProps,
     getInputProps,
-    getComboboxProps,
     getItemProps,
     highlightedIndex,
-    openMenu,
     selectedItem,
   } = useCombobox({
     inputValue,
@@ -50,7 +48,7 @@ function Downshift({ setValue, inputRef }: CountryInputProps) {
 
   return (
     <div className={classnames('dropdown', 'd-block')}>
-      <div {...getComboboxProps()}>
+      <div>
         {/* eslint-disable-next-line jsx-a11y/label-has-for */}
         <label {...getLabelProps()} className="visually-hidden">
           {t('country')}
@@ -60,16 +58,11 @@ function Downshift({ setValue, inputRef }: CountryInputProps) {
             onChange: (event: React.ChangeEvent<HTMLInputElement>) => {
               setInputValue(event.target.value)
             },
-            onFocus: () => {
-              if (!isOpen) {
-                openMenu()
-              }
-            },
             ref: inputRef,
           })}
+          append={<i className="caret" aria-hidden />}
           placeholder={t('country')}
         />
-        <i className="caret" />
       </div>
       <ul
         {...getMenuProps()}
diff --git a/services/web/frontend/js/features/settings/components/emails/add-email/input.tsx b/services/web/frontend/js/features/settings/components/emails/add-email/input.tsx
index e79d652f6b..c5884dbd9c 100644
--- a/services/web/frontend/js/features/settings/components/emails/add-email/input.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/add-email/input.tsx
@@ -32,6 +32,7 @@ export type DomainInfo = {
     name: string
     ssoEnabled?: boolean
     ssoBeta?: boolean
+    departments?: string[]
   }
 }
 
diff --git a/services/web/frontend/js/features/settings/components/emails/add-email/institution-fields.tsx b/services/web/frontend/js/features/settings/components/emails/add-email/institution-fields.tsx
index 49b7de61e7..bb491f4713 100644
--- a/services/web/frontend/js/features/settings/components/emails/add-email/institution-fields.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/add-email/institution-fields.tsx
@@ -75,16 +75,21 @@ function InstitutionFields({
   }, [newEmailMatchedDomain, setRole, setDepartment])
 
   useEffect(() => {
+    if (newEmailMatchedDomain?.university?.departments?.length) {
+      setDepartments(newEmailMatchedDomain.university.departments)
+      return
+    }
+
+    // fallback if not matched on domain
     const selectedKnownUniversity = countryCode
       ? universities[countryCode]?.find(({ name }) => name === universityName)
       : undefined
-
     if (selectedKnownUniversity && selectedKnownUniversity.departments.length) {
       setDepartments(selectedKnownUniversity.departments)
     } else {
       setDepartments([...defaultDepartments])
     }
-  }, [countryCode, universities, universityName])
+  }, [countryCode, universities, universityName, newEmailMatchedDomain])
 
   // Fetch country institution
   useEffect(() => {
diff --git a/services/web/frontend/js/features/settings/components/emails/add-secondary-email-prompt.tsx b/services/web/frontend/js/features/settings/components/emails/add-secondary-email-prompt.tsx
index 04bc4edbd1..8355138a14 100644
--- a/services/web/frontend/js/features/settings/components/emails/add-secondary-email-prompt.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/add-secondary-email-prompt.tsx
@@ -8,6 +8,7 @@ import MaterialIcon from '@/shared/components/material-icon'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { ReCaptcha2 } from '../../../../shared/components/recaptcha-2'
 import { useRecaptcha } from '../../../../shared/hooks/use-recaptcha'
+import { useLocation } from '@/shared/hooks/use-location'
 
 import { postJSON } from '../../../../infrastructure/fetch-json'
 import RecaptchaConditions from '@/shared/components/recaptcha-conditions'
@@ -25,6 +26,7 @@ export function AddSecondaryEmailPrompt() {
   const [error, setError] = useState<AddSecondaryEmailError | undefined>()
   const [isSubmitting, setIsSubmitting] = useState<boolean>(false)
   const { ref: recaptchaRef, getReCaptchaToken } = useRecaptcha()
+  const location = useLocation()
 
   if (!isReady) {
     return null
diff --git a/services/web/frontend/js/features/settings/components/emails/confirm-email-form.tsx b/services/web/frontend/js/features/settings/components/emails/confirm-email-form.tsx
index 66aaee9cce..49b114d9c2 100644
--- a/services/web/frontend/js/features/settings/components/emails/confirm-email-form.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/confirm-email-form.tsx
@@ -2,13 +2,14 @@ import { postJSON } from '@/infrastructure/fetch-json'
 import useWaitForI18n from '@/shared/hooks/use-wait-for-i18n'
 import Notification from '@/shared/components/notification'
 import getMeta from '@/utils/meta'
-import { FormEvent, MouseEventHandler, useState } from 'react'
+import { FormEvent, MouseEventHandler, ReactNode, useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import LoadingSpinner from '@/shared/components/loading-spinner'
 import MaterialIcon from '@/shared/components/material-icon'
 import { sendMB } from '@/infrastructure/event-tracking'
 import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
 import OLButton from '@/features/ui/components/ol/ol-button'
+import { useLocation } from '@/shared/hooks/use-location'
 
 type Feedback = {
   type: 'input' | 'alert'
@@ -27,6 +28,7 @@ type ConfirmEmailFormProps = {
   interstitial: boolean
   isModal?: boolean
   onCancel?: () => void
+  outerError?: string
 }
 
 export function ConfirmEmailForm({
@@ -40,15 +42,17 @@ export function ConfirmEmailForm({
   interstitial,
   isModal,
   onCancel,
+  outerError,
 }: ConfirmEmailFormProps) {
   const { t } = useTranslation()
   const [confirmationCode, setConfirmationCode] = useState('')
   const [feedback, setFeedback] = useState<Feedback | null>(null)
   const [isConfirming, setIsConfirming] = useState(false)
   const [isResending, setIsResending] = useState(false)
+  const [hasResent, setHasResent] = useState(false)
   const [successRedirectPath, setSuccessRedirectPath] = useState('')
   const { isReady } = useWaitForI18n()
-
+  const outerErrorDisplay = (!hasResent && outerError) || null
   const errorHandler = (err: any, actionType?: string) => {
     let errorName = err?.data?.message?.key || 'generic_something_went_wrong'
 
@@ -131,6 +135,7 @@ export function ConfirmEmailForm({
       })
       .finally(() => {
         setIsResending(false)
+        setHasResent(true)
       })
 
     sendMB('email-verification-click', {
@@ -158,8 +163,15 @@ export function ConfirmEmailForm({
     )
   }
 
-  let intro = <h5 className="h5">{t('confirm_your_email')}</h5>
-  if (isModal) intro = <h5 className="h5">{t('we_sent_code')}</h5>
+  let intro: ReactNode | null = (
+    <h5 className="h5">{t('confirm_your_email')}</h5>
+  )
+  if (isModal)
+    intro = outerErrorDisplay ? (
+      <div className="mt-4" />
+    ) : (
+      <h3 className="h5">{outerErrorDisplay ? null : t('we_sent_code')}</h3>
+    )
   if (interstitial)
     intro = (
       <h1 className="h3 interstitial-header">{t('confirm_your_email')}</h1>
@@ -170,14 +182,17 @@ export function ConfirmEmailForm({
       onSubmit={submitHandler}
       onInvalid={invalidFormHandler}
       className="confirm-email-form"
+      data-testid="confirm-email-form"
     >
       <div className="confirm-email-form-inner">
-        {feedback?.type === 'alert' && (
+        {(feedback?.type === 'alert' || outerErrorDisplay) && (
           <Notification
             ariaLive="polite"
             className="confirm-email-alert"
-            type={feedback.style}
-            content={<ErrorMessage error={feedback.message} />}
+            type={outerErrorDisplay ? 'error' : feedback!.style}
+            content={
+              outerErrorDisplay || <ErrorMessage error={feedback!.message!} />
+            }
           />
         )}
 
@@ -191,7 +206,6 @@ export function ConfirmEmailForm({
         <input
           id="one-time-code"
           className="form-control"
-          placeholder={t('enter_6_digit_code')}
           inputMode="numeric"
           required
           value={confirmationCode}
@@ -200,6 +214,7 @@ export function ConfirmEmailForm({
           maxLength={6}
           autoComplete="one-time-code"
           autoFocus // eslint-disable-line jsx-a11y/no-autofocus
+          disabled={!!outerErrorDisplay}
         />
         <div aria-live="polite">
           {feedback?.type === 'input' && (
@@ -214,7 +229,7 @@ export function ConfirmEmailForm({
 
         <div className="form-actions">
           <OLButton
-            disabled={isResending}
+            disabled={isResending || !!outerErrorDisplay}
             type="submit"
             isLoading={isConfirming}
             loadingLabel={t('confirming')}
@@ -254,6 +269,7 @@ function ConfirmEmailSuccessfullForm({
   successButtonText: string
   redirectTo: string
 }) {
+  const location = useLocation()
   const submitHandler = (e: FormEvent<HTMLFormElement>) => {
     e.preventDefault()
     location.assign(redirectTo)
diff --git a/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx b/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
index eb0563d2c2..ba8077b07c 100644
--- a/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/downshift-input.tsx
@@ -47,10 +47,8 @@ function Downshift({
     getLabelProps,
     getMenuProps,
     getInputProps,
-    getComboboxProps,
     getItemProps,
     highlightedIndex,
-    openMenu,
     selectedItem,
   } = useCombobox({
     inputValue,
@@ -82,8 +80,7 @@ function Downshift({
 
   return (
     <div className={classnames('dropdown', 'd-block')}>
-      <div {...getComboboxProps()}>
-        {/* eslint-disable-next-line jsx-a11y/label-has-for */}
+      <div>
         <OLFormLabel
           {...getLabelProps()}
           className={showLabel ? '' : 'visually-hidden'}
@@ -95,11 +92,6 @@ function Downshift({
             onChange: (event: React.ChangeEvent<HTMLInputElement>) => {
               setValue(event.target.value)
             },
-            onFocus: () => {
-              if (!isOpen) {
-                openMenu()
-              }
-            },
             ref: inputRef,
           })}
           placeholder={placeholder}
diff --git a/services/web/frontend/js/features/settings/components/emails/email.tsx b/services/web/frontend/js/features/settings/components/emails/email.tsx
index f8dc172765..ae2410939c 100644
--- a/services/web/frontend/js/features/settings/components/emails/email.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/email.tsx
@@ -3,6 +3,7 @@ import { UserEmailData } from '../../../../../../types/user-email'
 import { ssoAvailableForInstitution } from '../../utils/sso'
 import OLBadge from '@/features/ui/components/ol/ol-badge'
 import ResendConfirmationCodeModal from '@/features/settings/components/emails/resend-confirmation-code-modal'
+import { useUserEmailsContext } from '@/features/settings/context/user-email-context'
 
 type EmailProps = {
   userEmailData: UserEmailData
@@ -10,7 +11,11 @@ type EmailProps = {
 
 function Email({ userEmailData }: EmailProps) {
   const { t } = useTranslation()
-
+  const {
+    state,
+    setLoading: setUserEmailsContextLoading,
+    getEmails,
+  } = useUserEmailsContext()
   const ssoAvailable = ssoAvailableForInstitution(
     userEmailData.affiliation?.institution || null
   )
@@ -30,7 +35,13 @@ function Email({ userEmailData }: EmailProps) {
           <strong>{t('unconfirmed')}.</strong>
           <br />
           {!ssoAvailable && (
-            <ResendConfirmationCodeModal email={userEmailData.email} />
+            <ResendConfirmationCodeModal
+              email={userEmailData.email}
+              setGroupLoading={setUserEmailsContextLoading}
+              groupLoading={state.isLoading}
+              onSuccess={getEmails}
+              triggerVariant="link"
+            />
           )}
         </div>
       )}
diff --git a/services/web/frontend/js/features/settings/components/emails/institution-and-role.tsx b/services/web/frontend/js/features/settings/components/emails/institution-and-role.tsx
index c00a4f053a..21368c39ff 100644
--- a/services/web/frontend/js/features/settings/components/emails/institution-and-role.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/institution-and-role.tsx
@@ -115,7 +115,7 @@ function InstitutionAndRole({ userEmailData }: InstitutionAndRoleProps) {
           >
             {!affiliation.department && !affiliation.role
               ? t('add_role_and_department')
-              : t('change')}
+              : t('change_email')}
           </OLButton>
         </div>
       ) : (
diff --git a/services/web/frontend/js/features/settings/components/emails/reconfirmation-info/reconfirmation-info-prompt-text.tsx b/services/web/frontend/js/features/settings/components/emails/reconfirmation-info/reconfirmation-info-prompt-text.tsx
index 4dace050ef..898649504d 100644
--- a/services/web/frontend/js/features/settings/components/emails/reconfirmation-info/reconfirmation-info-prompt-text.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/reconfirmation-info/reconfirmation-info-prompt-text.tsx
@@ -4,19 +4,16 @@ import { Institution } from '../../../../../../../types/institution'
 type ReconfirmationInfoPromptTextProps = {
   primary: boolean
   institutionName: Institution['name']
-  icon?: React.ReactElement // BS3 only
 }
 
 function ReconfirmationInfoPromptText({
   primary,
   institutionName,
-  icon,
 }: ReconfirmationInfoPromptTextProps) {
   const { t } = useTranslation()
 
   return (
     <>
-      {icon}
       <Trans
         i18nKey="are_you_still_at"
         values={{
diff --git a/services/web/frontend/js/features/settings/components/emails/resend-confirmation-code-modal.tsx b/services/web/frontend/js/features/settings/components/emails/resend-confirmation-code-modal.tsx
index 0c7b1394fe..b17337924e 100644
--- a/services/web/frontend/js/features/settings/components/emails/resend-confirmation-code-modal.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/resend-confirmation-code-modal.tsx
@@ -1,10 +1,8 @@
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import Icon from '../../../../shared/components/icon'
 import { FetchError, postJSON } from '@/infrastructure/fetch-json'
 import useAsync from '../../../../shared/hooks/use-async'
 import { UserEmailData } from '../../../../../../types/user-email'
-import { useUserEmailsContext } from '../../context/user-email-context'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLModal, {
   OLModalBody,
@@ -16,39 +14,33 @@ import { ConfirmEmailForm } from '@/features/settings/components/emails/confirm-
 
 type ResendConfirmationEmailButtonProps = {
   email: UserEmailData['email']
+  groupLoading: boolean
+  setGroupLoading: (loading: boolean) => void
+  onSuccess: () => void
+  triggerVariant: 'link' | 'secondary'
 }
 
 function ResendConfirmationCodeModal({
   email,
+  groupLoading,
+  setGroupLoading,
+  onSuccess,
+  triggerVariant,
 }: ResendConfirmationEmailButtonProps) {
   const { t } = useTranslation()
   const { error, isLoading, isError, runAsync } = useAsync()
-  const {
-    state,
-    setLoading: setUserEmailsContextLoading,
-    getEmails,
-  } = useUserEmailsContext()
   const [modalVisible, setModalVisible] = useState(false)
 
-  // Update global isLoading prop
   useEffect(() => {
-    setUserEmailsContextLoading(isLoading)
-  }, [setUserEmailsContextLoading, isLoading])
+    setGroupLoading(isLoading)
+  }, [isLoading, setGroupLoading])
 
   const handleResendConfirmationEmail = async () => {
     await runAsync(
       postJSON('/user/emails/send-confirmation-code', { body: { email } })
     )
-      .then(() => setModalVisible(true))
       .catch(() => {})
-  }
-
-  if (isLoading) {
-    return (
-      <>
-        <Icon type="refresh" spin fw /> {t('sending')}&hellip;
-      </>
-    )
+      .finally(() => setModalVisible(true))
   }
 
   const rateLimited =
@@ -77,9 +69,16 @@ function ResendConfirmationCodeModal({
               confirmationEndpoint="/user/emails/confirm-code"
               email={email}
               onSuccessfulConfirmation={() => {
-                getEmails()
+                onSuccess()
                 setModalVisible(false)
               }}
+              outerError={
+                isError
+                  ? rateLimited
+                    ? t('too_many_requests')
+                    : t('generic_something_went_wrong')
+                  : undefined
+              }
             />
           </OLModalBody>
           <OLModalFooter>
@@ -94,21 +93,14 @@ function ResendConfirmationCodeModal({
         </OLModal>
       )}
       <OLButton
-        variant="link"
-        disabled={state.isLoading || isLoading}
+        variant={triggerVariant}
+        disabled={groupLoading}
+        isLoading={isLoading}
         onClick={handleResendConfirmationEmail}
-        className="btn-inline-link"
+        className={triggerVariant === 'link' ? 'btn-inline-link' : undefined}
       >
-        {t('resend_confirmation_code')}
+        {t('send_confirmation_code')}
       </OLButton>
-      <br />
-      {isError && (
-        <div className="text-danger">
-          {rateLimited
-            ? t('too_many_requests')
-            : t('generic_something_went_wrong')}
-        </div>
-      )}
     </>
   )
 }
diff --git a/services/web/frontend/js/features/settings/components/emails/row.tsx b/services/web/frontend/js/features/settings/components/emails/row.tsx
index fd74281ad8..3cbb84ef9b 100644
--- a/services/web/frontend/js/features/settings/components/emails/row.tsx
+++ b/services/web/frontend/js/features/settings/components/emails/row.tsx
@@ -28,7 +28,7 @@ function EmailsRow({ userEmailData, primary }: EmailsRowProps) {
 
   return (
     <>
-      <OLRow>
+      <OLRow data-testid="email-row">
         <OLCol lg={4}>
           <EmailCell>
             <Email userEmailData={userEmailData} />
diff --git a/services/web/frontend/js/features/settings/components/leave/modal-content.tsx b/services/web/frontend/js/features/settings/components/leave/modal-content.tsx
index 9ac29d790c..ffe9a99263 100644
--- a/services/web/frontend/js/features/settings/components/leave/modal-content.tsx
+++ b/services/web/frontend/js/features/settings/components/leave/modal-content.tsx
@@ -10,8 +10,6 @@ import {
   OLModalTitle,
 } from '@/features/ui/components/ol/ol-modal'
 
-const WRITEFULL_SUPPORT_EMAIL = 'support@writefull.com'
-
 type LeaveModalContentProps = {
   handleHide: () => void
   inFlight: boolean
@@ -46,13 +44,16 @@ function LeaveModalContentBlock({
       />
       <p>
         <Trans
-          i18nKey="to_delete_your_writefull_account"
-          values={{ email: WRITEFULL_SUPPORT_EMAIL }}
-          shouldUnescape
-          tOptions={{ interpolation: { escapeValue: true } }}
+          i18nKey="if_you_need_to_delete_your_writefull_account"
           components={{
-            // eslint-disable-next-line jsx-a11y/anchor-has-content
-            a: <a href={`mailto:${WRITEFULL_SUPPORT_EMAIL}`} />,
+            a: (
+              // eslint-disable-next-line jsx-a11y/anchor-has-content
+              <a
+                href="https://my.writefull.com/account"
+                target="_blank"
+                rel="noopener noreferrer"
+              />
+            ),
           }}
         />
       </p>
diff --git a/services/web/frontend/js/features/settings/components/leavers-survey-alert.tsx b/services/web/frontend/js/features/settings/components/leavers-survey-alert.tsx
index 55ada55ff0..a7668a2fca 100644
--- a/services/web/frontend/js/features/settings/components/leavers-survey-alert.tsx
+++ b/services/web/frontend/js/features/settings/components/leavers-survey-alert.tsx
@@ -20,7 +20,7 @@ export function LeaversSurveyAlert() {
   const [hide, setHide] = usePersistedState(
     'hideInstitutionalLeaversSurvey',
     false,
-    true
+    { listen: true }
   )
 
   function handleDismiss() {
diff --git a/services/web/frontend/js/features/settings/components/linking-section.tsx b/services/web/frontend/js/features/settings/components/linking-section.tsx
index 69d2dc268e..411d38e650 100644
--- a/services/web/frontend/js/features/settings/components/linking-section.tsx
+++ b/services/web/frontend/js/features/settings/components/linking-section.tsx
@@ -90,9 +90,7 @@ function LinkingSection() {
       <p className="small">{t('linked_accounts_explained')}</p>
       {haslangFeedbackLinkingWidgets ? (
         <>
-          <h3 id="language-feedback" className="text-capitalize">
-            {t('ai_features')}
-          </h3>
+          <h3 id="language-feedback">{t('ai_features')}</h3>
           <div className="settings-widgets-container">
             {langFeedbackLinkingWidgets.map(
               ({ import: { default: widget }, path }, widgetIndex) => (
@@ -108,9 +106,7 @@ function LinkingSection() {
       ) : null}
       {hasIntegrationLinkingSection ? (
         <>
-          <h3 id="project-sync" className="text-capitalize">
-            {t('project_synchronisation')}
-          </h3>
+          <h3 id="project-sync">{t('project_synchronisation')}</h3>
           {projectSyncSuccessMessage ? (
             <OLNotification
               type="success"
@@ -119,7 +115,7 @@ function LinkingSection() {
           ) : null}
           <div className="settings-widgets-container">
             {allIntegrationLinkingWidgets.map(
-              ({ import: importObject, path }, widgetIndex) => (
+              ({ import: importObject }, widgetIndex) => (
                 <ModuleLinkingWidget
                   key={Object.keys(importObject)[0]}
                   ModuleComponent={Object.values(importObject)[0]}
@@ -134,12 +130,10 @@ function LinkingSection() {
       ) : null}
       {hasReferencesLinkingSection ? (
         <>
-          <h3 id="references" className="text-capitalize">
-            {t('reference_managers')}
-          </h3>
+          <h3 id="references">{t('reference_managers')}</h3>
           <div className="settings-widgets-container">
             {referenceLinkingWidgets.map(
-              ({ import: importObject, path }, widgetIndex) => (
+              ({ import: importObject }, widgetIndex) => (
                 <ModuleLinkingWidget
                   key={Object.keys(importObject)[0]}
                   ModuleComponent={Object.values(importObject)[0]}
@@ -152,9 +146,7 @@ function LinkingSection() {
       ) : null}
       {hasSSOLinkingSection ? (
         <>
-          <h3 id="linked-accounts" className="text-capitalize">
-            {t('linked_accounts')}
-          </h3>
+          <h3 id="linked-accounts">{t('linked_accounts')}</h3>
           {ssoErrorMessage ? (
             <OLNotification
               type="error"
@@ -212,7 +204,8 @@ function SSOLinkingWidgetContainer({
   const { t } = useTranslation()
   const { unlink } = useSSOContext()
 
-  let description = ''
+  let description = subscription.provider.descriptionKey ||
+    `${t('login_with_service', { service: subscription.provider.name, })}.`
   switch (subscription.providerId) {
     case 'collabratec':
       description = t('linked_collabratec_description')
diff --git a/services/web/frontend/js/features/settings/components/linking/enable-widget.tsx b/services/web/frontend/js/features/settings/components/linking/enable-widget.tsx
index 2568b520fb..de916ac9f2 100644
--- a/services/web/frontend/js/features/settings/components/linking/enable-widget.tsx
+++ b/services/web/frontend/js/features/settings/components/linking/enable-widget.tsx
@@ -103,7 +103,7 @@ export function ActionButton({
         href="/user/subscription/plans"
         onClick={trackUpgradeClick}
       >
-        <span className="text-capitalize">{t('upgrade')}</span>
+        <span>{t('upgrade')}</span>
       </OLButton>
     )
   } else if (linked) {
diff --git a/services/web/frontend/js/features/settings/components/linking/integration-widget.tsx b/services/web/frontend/js/features/settings/components/linking/integration-widget.tsx
index def60625a2..62c569067a 100644
--- a/services/web/frontend/js/features/settings/components/linking/integration-widget.tsx
+++ b/services/web/frontend/js/features/settings/components/linking/integration-widget.tsx
@@ -20,6 +20,7 @@ function trackLinkingClick(integration: string) {
 }
 
 type IntegrationLinkingWidgetProps = {
+  id: string
   logo: ReactNode
   title: string
   description: string
@@ -35,6 +36,7 @@ type IntegrationLinkingWidgetProps = {
 }
 
 export function IntegrationLinkingWidget({
+  id,
   logo,
   title,
   description,
@@ -65,19 +67,20 @@ export function IntegrationLinkingWidget({
       <div>{logo}</div>
       <div className="description-container">
         <div className="title-row">
-          <h4>{title}</h4>
+          <h4 id={id}>{title}</h4>
           {!hasFeature && <OLBadge bg="info">{t('premium_feature')}</OLBadge>}
         </div>
         <p className="small">
           {description}{' '}
           <a href={helpPath} target="_blank" rel="noreferrer">
-            {t('learn_more')}
+            {t('learn_more_about', { appName: title })}
           </a>
         </p>
         {hasFeature && statusIndicator}
       </div>
       <div>
         <ActionButton
+          titleId={id}
           integration={title}
           hasFeature={hasFeature}
           linked={linked}
@@ -105,6 +108,7 @@ type ActionButtonProps = {
   handleUnlinkClick: () => void
   linkPath: string
   disabled?: boolean
+  titleId: string
 }
 
 function ActionButton({
@@ -114,16 +118,20 @@ function ActionButton({
   linkPath,
   disabled,
   integration,
+  titleId,
 }: ActionButtonProps) {
   const { t } = useTranslation()
+  const linkTextId = `${titleId}-link`
+
   if (!hasFeature) {
     return (
       <OLButton
         variant="primary"
         href="/user/subscription/plans"
         onClick={() => trackUpgradeClick(integration)}
+        aria-labelledby={`${titleId} ${linkTextId}`}
       >
-        <span className="text-capitalize">{t('upgrade')}</span>
+        <span id={linkTextId}>{t('upgrade')}</span>
       </OLButton>
     )
   } else if (linked) {
@@ -140,14 +148,13 @@ function ActionButton({
     return (
       <>
         {disabled ? (
-          <OLButton disabled variant="secondary" className="text-capitalize">
+          <OLButton disabled variant="secondary">
             {t('link')}
           </OLButton>
         ) : (
           <OLButton
             variant="secondary"
             href={linkPath}
-            className="text-capitalize"
             onClick={() => trackLinkingClick(integration)}
           >
             {t('link')}
diff --git a/services/web/frontend/js/features/settings/components/linking/sso-widget.tsx b/services/web/frontend/js/features/settings/components/linking/sso-widget.tsx
index 8d5bc169d1..bb767d984c 100644
--- a/services/web/frontend/js/features/settings/components/linking/sso-widget.tsx
+++ b/services/web/frontend/js/features/settings/components/linking/sso-widget.tsx
@@ -4,6 +4,7 @@ import { FetchError } from '../../../../infrastructure/fetch-json'
 import IEEELogo from '../../../../shared/svgs/ieee-logo'
 import GoogleLogo from '../../../../shared/svgs/google-logo'
 import OrcidLogo from '../../../../shared/svgs/orcid-logo'
+import OpenIDLogo from '../../../../shared/svgs/openid-logo'
 import LinkingStatus from './status'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLModal, {
@@ -17,6 +18,7 @@ const providerLogos: { readonly [p: string]: JSX.Element } = {
   collabratec: <IEEELogo />,
   google: <GoogleLogo />,
   orcid: <OrcidLogo />,
+  oidc: <OpenIDLogo />,
 }
 
 type SSOLinkingWidgetProps = {
@@ -66,16 +68,16 @@ export function SSOLinkingWidget({
 
   return (
     <div className="settings-widget-container">
-      <div>{providerLogos[providerId]}</div>
+      <div>{providerLogos[providerId] || providerLogos['oidc']}</div>
       <div className="description-container">
         <div className="title-row">
-          <h4>{title}</h4>
+          <h4 id={providerId}>{title}</h4>
         </div>
         <p className="small">
           {description?.replace(/<[^>]+>/g, '')}{' '}
           {helpPath ? (
             <a href={helpPath} target="_blank" rel="noreferrer">
-              {t('learn_more')}
+              {t('learn_more_about', { appName: title })}
             </a>
           ) : null}
         </p>
@@ -85,6 +87,7 @@ export function SSOLinkingWidget({
       </div>
       <div>
         <ActionButton
+          titleId={providerId}
           unlinkRequestInflight={unlinkRequestInflight}
           accountIsLinked={linked}
           linkPath={`${linkPath}?intent=link`}
@@ -106,6 +109,7 @@ type ActionButtonProps = {
   accountIsLinked?: boolean
   linkPath: string
   onUnlinkClick: () => void
+  titleId: string
 }
 
 function ActionButton({
@@ -113,8 +117,11 @@ function ActionButton({
   accountIsLinked,
   linkPath,
   onUnlinkClick,
+  titleId,
 }: ActionButtonProps) {
   const { t } = useTranslation()
+  const linkTextId = `${titleId}-link`
+
   if (unlinkRequestInflight) {
     return (
       <OLButton variant="danger-ghost" disabled>
@@ -123,13 +130,23 @@ function ActionButton({
     )
   } else if (accountIsLinked) {
     return (
-      <OLButton variant="danger-ghost" onClick={onUnlinkClick}>
+      <OLButton
+        variant="danger-ghost"
+        onClick={onUnlinkClick}
+        aria-labelledby={`${linkTextId} ${titleId}`}
+        id={linkTextId}
+      >
         {t('unlink')}
       </OLButton>
     )
   } else {
     return (
-      <OLButton variant="secondary" href={linkPath} className="text-capitalize">
+      <OLButton
+        variant="secondary"
+        href={linkPath}
+        aria-labelledby={`${linkTextId} ${titleId}`}
+        id={linkTextId}
+      >
         {t('link')}
       </OLButton>
     )
diff --git a/services/web/frontend/js/features/settings/components/linking/status.tsx b/services/web/frontend/js/features/settings/components/linking/status.tsx
index c2c95c68b2..670a272cdf 100644
--- a/services/web/frontend/js/features/settings/components/linking/status.tsx
+++ b/services/web/frontend/js/features/settings/components/linking/status.tsx
@@ -1,5 +1,6 @@
 import { ReactNode } from 'react'
-import Icon from '../../../../shared/components/icon'
+import MaterialIcon from '@/shared/components/material-icon'
+import OLSpinner from '@/features/ui/components/ol/ol-spinner'
 
 type Status = 'pending' | 'success' | 'error'
 
@@ -28,29 +29,20 @@ function StatusIcon({ status }: StatusIconProps) {
   switch (status) {
     case 'success':
       return (
-        <Icon
-          type="check-circle"
-          fw
+        <MaterialIcon
+          type="check_circle"
           className="settings-widget-status-icon status-success"
         />
       )
     case 'error':
       return (
-        <Icon
-          type="times-circle"
-          fw
+        <MaterialIcon
+          type="cancel"
           className="settings-widget-status-icon status-error"
         />
       )
     case 'pending':
-      return (
-        <Icon
-          type="circle"
-          fw
-          className="settings-widget-status-icon status-pending"
-          spin
-        />
-      )
+      return <OLSpinner size="sm" />
     default:
       return null
   }
diff --git a/services/web/frontend/js/features/settings/components/password-section.tsx b/services/web/frontend/js/features/settings/components/password-section.tsx
index 739636e998..c09ad50562 100644
--- a/services/web/frontend/js/features/settings/components/password-section.tsx
+++ b/services/web/frontend/js/features/settings/components/password-section.tsx
@@ -39,11 +39,7 @@ function CanOnlyLogInThroughSSO() {
   return (
     <p>
       <Trans
-        i18nKey="you_cant_add_or_change_password_due_to_sso"
-        components={[
-          // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
-          <a href="/learn/how-to/Logging_in_with_Group_single_sign-on" />,
-        ]}
+        i18nKey="you_cant_add_or_change_password_due_to_ldap_or_sso"
       />
     </p>
   )
diff --git a/services/web/frontend/js/features/settings/context/user-email-context.tsx b/services/web/frontend/js/features/settings/context/user-email-context.tsx
index 6d470d271e..579c46143d 100644
--- a/services/web/frontend/js/features/settings/context/user-email-context.tsx
+++ b/services/web/frontend/js/features/settings/context/user-email-context.tsx
@@ -224,7 +224,9 @@ function useUserEmails() {
   const [
     showInstitutionalLeaversSurveyUntil,
     setShowInstitutionalLeaversSurveyUntil,
-  ] = usePersistedState('showInstitutionalLeaversSurveyUntil', 0, true)
+  ] = usePersistedState('showInstitutionalLeaversSurveyUntil', 0, {
+    listen: true,
+  })
   const [state, unsafeDispatch] = useReducer(reducer, initialState)
   const dispatch = useSafeDispatch(unsafeDispatch)
   const { data, isLoading, isError, isSuccess, runAsync } =
@@ -312,13 +314,13 @@ type UserEmailsProviderProps = {
   children: React.ReactNode
 } & Record<string, unknown>
 
-function UserEmailsProvider(props: UserEmailsProviderProps) {
+export function UserEmailsProvider(props: UserEmailsProviderProps) {
   const value = useUserEmails()
 
   return <UserEmailsContext.Provider value={value} {...props} />
 }
 
-const useUserEmailsContext = () => {
+export const useUserEmailsContext = () => {
   const context = useContext(UserEmailsContext)
 
   if (context === undefined) {
@@ -328,6 +330,4 @@ const useUserEmailsContext = () => {
   return context
 }
 
-type EmailContextType = ReturnType<typeof useUserEmailsContext>
-
-export { UserEmailsProvider, useUserEmailsContext, EmailContextType }
+export type EmailContextType = ReturnType<typeof useUserEmailsContext>
diff --git a/services/web/frontend/js/features/share-project-modal/components/access-levels-changed.tsx b/services/web/frontend/js/features/share-project-modal/components/access-levels-changed.tsx
index e0ac152a58..37c9259b73 100644
--- a/services/web/frontend/js/features/share-project-modal/components/access-levels-changed.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/access-levels-changed.tsx
@@ -29,11 +29,11 @@ export default function AccessLevelsChanged({
         }
         content={
           somePendingEditorsResolved ? (
-            <p>{t('your_project_exceeded_editor_limit')}</p>
+            <p>{t('your_project_exceeded_collaborator_limit')}</p>
           ) : (
             <p>
-              {t('this_project_exceeded_editor_limit')}{' '}
-              {t('you_can_select_or_invite', {
+              {t('this_project_exceeded_collaborator_limit')}{' '}
+              {t('you_can_select_or_invite_collaborator', {
                 count: features.collaborators,
               })}
             </p>
diff --git a/services/web/frontend/js/features/share-project-modal/components/add-collaborators.jsx b/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
similarity index 66%
rename from services/web/frontend/js/features/share-project-modal/components/add-collaborators.jsx
rename to services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
index aa5948cb6f..157f23b116 100644
--- a/services/web/frontend/js/features/share-project-modal/components/add-collaborators.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/add-collaborators.tsx
@@ -2,21 +2,19 @@ import { useEffect, useState, useMemo, useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useMultipleSelection } from 'downshift'
 import { useShareProjectContext } from './share-project-modal'
-import SelectCollaborators from './select-collaborators'
+import SelectCollaborators, { ContactItem } from './select-collaborators'
 import { resendInvite, sendInvite } from '../utils/api'
 import { useUserContacts } from '../hooks/use-user-contacts'
 import useIsMounted from '@/shared/hooks/use-is-mounted'
 import { useProjectContext } from '@/shared/context/project-context'
 import { sendMB } from '@/infrastructure/event-tracking'
 import ClickableElementEnhancer from '@/shared/components/clickable-element-enhancer'
-import PropTypes from 'prop-types'
 import OLForm from '@/features/ui/components/ol/ol-form'
 import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import { Select } from '@/shared/components/select'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import getMeta from '@/utils/meta'
 
-export default function AddCollaborators({ readOnly }) {
+export default function AddCollaborators({ readOnly }: { readOnly?: boolean }) {
   const [privileges, setPrivileges] = useState('readAndWrite')
 
   const isMounted = useIsMounted()
@@ -25,9 +23,10 @@ export default function AddCollaborators({ readOnly }) {
 
   const { t } = useTranslation()
 
-  const { updateProject, setInFlight, setError } = useShareProjectContext()
+  const { setInFlight, setError } = useShareProjectContext()
 
-  const { _id: projectId, members, invites, features } = useProjectContext()
+  const { projectId, project, features, updateProject } = useProjectContext()
+  const { members, invites } = project || {}
 
   const currentMemberEmails = useMemo(
     () => (members || []).map(member => member.email).sort(),
@@ -44,7 +43,7 @@ export default function AddCollaborators({ readOnly }) {
     )
   }, [contacts, currentMemberEmails])
 
-  const multipleSelectionProps = useMultipleSelection({
+  const multipleSelectionProps = useMultipleSelection<ContactItem>({
     initialActiveIndex: 0,
     initialSelectedItems: [],
   })
@@ -84,9 +83,7 @@ export default function AddCollaborators({ readOnly }) {
       let data
 
       try {
-        const invite = (invites || []).find(
-          invite => invite.email === normalisedEmail
-        )
+        const invite = invites?.find(invite => invite.email === normalisedEmail)
 
         if (invite) {
           data = await resendInvite(projectId, invite)
@@ -94,15 +91,43 @@ export default function AddCollaborators({ readOnly }) {
           data = await sendInvite(projectId, email, privileges)
         }
 
+        const role = data?.invite?.privileges
+        const membersAndInvites = (members || []).concat(invites || [])
+        const previousEditorsAmount = membersAndInvites.filter(
+          member => member.privileges === 'readAndWrite'
+        ).length
+        const previousReviewersAmount = membersAndInvites.filter(
+          member => member.privileges === 'review'
+        ).length
+        const previousViewersAmount = membersAndInvites.filter(
+          member => member.privileges === 'readOnly'
+        ).length
+
         sendMB('collaborator-invited', {
           project_id: projectId,
           // invitation is only populated on successful invite, meaning that for paywall and other cases this will be null
           successful_invite: !!data.invite,
           users_updated: !!(data.users || data.user),
-          current_collaborators_amount: members.length,
-          current_invites_amount: invites.length,
+          current_collaborators_amount: members?.length || 0,
+          current_invites_amount: invites?.length || 0,
+          role,
+          previousEditorsAmount,
+          previousReviewersAmount,
+          previousViewersAmount,
+          newEditorsAmount:
+            role === 'readAndWrite'
+              ? previousEditorsAmount + 1
+              : previousEditorsAmount,
+          newReviewersAmount:
+            role === 'review'
+              ? previousReviewersAmount + 1
+              : previousReviewersAmount,
+          newViewersAmount:
+            role === 'readOnly'
+              ? previousViewersAmount + 1
+              : previousViewersAmount,
         })
-      } catch (error) {
+      } catch (error: any) {
         setInFlight(false)
         setError(
           error.data?.errorReason ||
@@ -118,15 +143,15 @@ export default function AddCollaborators({ readOnly }) {
         setInFlight(false)
       } else if (data.invite) {
         updateProject({
-          invites: invites.concat(data.invite),
+          invites: invites?.concat(data.invite) || [data.invite],
         })
       } else if (data.users) {
         updateProject({
-          members: members.concat(data.users),
+          members: members?.concat(data.users) || data.users,
         })
       } else if (data.user) {
         updateProject({
-          members: members.concat(data.user),
+          members: members?.concat(data.user) || [data.user],
         })
       }
 
@@ -150,14 +175,18 @@ export default function AddCollaborators({ readOnly }) {
   ])
 
   const privilegeOptions = useMemo(() => {
-    const options = [
+    const options: {
+      key: string
+      label: string
+      description?: string | null
+    }[] = [
       {
         key: 'readAndWrite',
         label: t('editor'),
       },
     ]
 
-    if (getMeta('ol-isReviewerRoleEnabled')) {
+    if (features.trackChangesVisible) {
       options.push({
         key: 'review',
         label: t('reviewer'),
@@ -173,7 +202,7 @@ export default function AddCollaborators({ readOnly }) {
     })
 
     return options
-  }, [features.trackChanges, t])
+  }, [features.trackChanges, features.trackChangesVisible, t])
 
   return (
     <OLForm className="add-collabs">
@@ -187,18 +216,22 @@ export default function AddCollaborators({ readOnly }) {
       </OLFormGroup>
 
       <OLFormGroup>
-        <div className="pull-right add-collaborator-controls">
+        <div className="float-end add-collaborator-controls">
           <Select
             dataTestId="add-collaborator-select"
             items={privilegeOptions}
             itemToKey={item => item.key}
-            itemToString={item => item.label}
-            itemToSubtitle={item => item.description || ''}
-            itemToDisabled={item => readOnly && item.key === 'readAndWrite'}
+            itemToString={item => item?.label || ''}
+            itemToSubtitle={item => item?.description || ''}
+            itemToDisabled={item => !!(readOnly && item?.key !== 'readOnly')}
             selected={privilegeOptions.find(
               option => option.key === privileges
             )}
-            onSelectedItemChanged={item => setPrivileges(item.key)}
+            onSelectedItemChanged={item => {
+              if (item) {
+                setPrivileges(item.key)
+              }
+            }}
           />
           <ClickableElementEnhancer
             as={OLButton}
@@ -212,7 +245,3 @@ export default function AddCollaborators({ readOnly }) {
     </OLForm>
   )
 }
-
-AddCollaborators.propTypes = {
-  readOnly: PropTypes.bool,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/collaborators-limit-upgrade.tsx b/services/web/frontend/js/features/share-project-modal/components/collaborators-limit-upgrade.tsx
index 450e42669d..4b63c63e08 100644
--- a/services/web/frontend/js/features/share-project-modal/components/collaborators-limit-upgrade.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/collaborators-limit-upgrade.tsx
@@ -15,10 +15,12 @@ export default function CollaboratorsLimitUpgrade() {
       <Notification
         type="info"
         customIcon={<img src={addMoreEditorsImage} alt="" aria-hidden="true" />}
-        title={t('add_more_editors')}
+        title={t('add_more_collaborators')}
         content={
           <p>
-            {t('upgrade_to_add_more_editors_and_access_collaboration_features')}
+            {t(
+              'upgrade_to_add_more_collaborators_and_access_collaboration_features'
+            )}
           </p>
         }
         isActionBelowContent
diff --git a/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx b/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
index 433d16d9c7..c8a7216e2c 100644
--- a/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/edit-member.tsx
@@ -1,30 +1,29 @@
 import { useState, useEffect, useMemo } from 'react'
-import PropTypes from 'prop-types'
-import { useTranslation } from 'react-i18next'
+import { Trans, useTranslation } from 'react-i18next'
 import { useShareProjectContext } from './share-project-modal'
 import TransferOwnershipModal from './transfer-ownership-modal'
 import { removeMemberFromProject, updateMember } from '../utils/api'
 import { useProjectContext } from '@/shared/context/project-context'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { Select } from '@/shared/components/select'
-import type { ProjectContextMember } from '@/shared/context/types/project-context'
+import type { ProjectMember } from '@/shared/context/types/project-metadata'
 import { PermissionsLevel } from '@/features/ide-react/types/permissions'
 import { linkSharingEnforcementDate } from '../utils/link-sharing'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import OLCol from '@/features/ui/components/ol/ol-col'
 import MaterialIcon from '@/shared/components/material-icon'
-import getMeta from '@/utils/meta'
 import { useUserContext } from '@/shared/context/user-context'
-import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import { upgradePlan } from '@/main/account-upgrade'
 
 type PermissionsOption = PermissionsLevel | 'removeAccess' | 'downgraded'
 
 type EditMemberProps = {
-  member: ProjectContextMember
+  member: ProjectMember
   hasExceededCollaboratorLimit: boolean
   hasBeenDowngraded: boolean
   canAddCollaborators: boolean
+  isReviewerOnFreeProject?: boolean
 }
 
 type Privilege = {
@@ -37,6 +36,7 @@ export default function EditMember({
   hasExceededCollaboratorLimit,
   hasBeenDowngraded,
   canAddCollaborators,
+  isReviewerOnFreeProject,
 }: EditMemberProps) {
   const [privileges, setPrivileges] = useState<PermissionsOption>(
     member.privileges
@@ -51,8 +51,9 @@ export default function EditMember({
     setPrivileges(member.privileges)
   }, [member.privileges])
 
-  const { updateProject, monitorRequest } = useShareProjectContext()
-  const { _id: projectId, members, invites } = useProjectContext()
+  const { monitorRequest } = useShareProjectContext()
+  const { projectId, project, updateProject } = useProjectContext()
+  const { members, invites } = project || {}
   const user = useUserContext()
 
   // Immediately commit this change if it's lower impact (eg. editor > viewer)
@@ -88,14 +89,15 @@ export default function EditMember({
     } else if (newPrivileges === 'removeAccess') {
       monitorRequest(() => removeMemberFromProject(projectId, member)).then(
         () => {
-          const updatedMembers = members.filter(existing => existing !== member)
+          const updatedMembers =
+            members?.filter(existing => existing !== member) || []
           updateProject({
             members: updatedMembers,
           })
           sendMB('collaborator-removed', {
             project_id: projectId,
             current_collaborators_amount: updatedMembers.length,
-            current_invites_amount: invites.length,
+            current_invites_amount: invites?.length || 0,
           })
         }
       )
@@ -110,9 +112,10 @@ export default function EditMember({
         })
       ).then(() => {
         updateProject({
-          members: members.map(item =>
-            item._id === member._id ? { ...item, newPrivileges } : item
-          ),
+          members:
+            members?.map(item =>
+              item._id === member._id ? { ...item, newPrivileges } : item
+            ) || [],
         })
       })
     }
@@ -144,7 +147,7 @@ export default function EditMember({
       }}
     >
       <OLFormGroup className="project-member row">
-        <OLCol xs={7}>
+        <OLCol xs={8}>
           <div className="project-member-email-icon">
             <MaterialIcon
               type={
@@ -179,11 +182,26 @@ export default function EditMember({
                   })}
                 </div>
               )}
+              {isReviewerOnFreeProject && (
+                <div className="small">
+                  <Trans
+                    i18nKey="comment_only_upgrade_to_enable_track_changes"
+                    components={[
+                      // eslint-disable-next-line react/jsx-key
+                      <OLButton
+                        variant="link"
+                        className="btn-inline-link"
+                        onClick={() => upgradePlan('track-changes')}
+                      />,
+                    ]}
+                  />
+                </div>
+              )}
             </div>
           </div>
         </OLCol>
 
-        <OLCol xs={5} className="project-member-actions">
+        <OLCol xs={4} className="project-member-actions">
           {confirmRemoval && (
             <ChangePrivilegesActions
               handleReset={() => setPrivileges(member.privileges)}
@@ -211,15 +229,6 @@ export default function EditMember({
     </form>
   )
 }
-EditMember.propTypes = {
-  member: PropTypes.shape({
-    _id: PropTypes.string.isRequired,
-    email: PropTypes.string.isRequired,
-    privileges: PropTypes.string.isRequired,
-  }),
-  hasExceededCollaboratorLimit: PropTypes.bool.isRequired,
-  canAddCollaborators: PropTypes.bool.isRequired,
-}
 
 type SelectPrivilegeProps = {
   value: string
@@ -239,7 +248,7 @@ function SelectPrivilege({
 
   const privileges = useMemo(
     (): Privilege[] =>
-      getMeta('ol-isReviewerRoleEnabled')
+      features.trackChangesVisible
         ? [
             { key: 'owner', label: t('make_owner') },
             { key: 'readAndWrite', label: t('editor') },
@@ -253,7 +262,7 @@ function SelectPrivilege({
             { key: 'readOnly', label: t('viewer') },
             { key: 'removeAccess', label: t('remove_access') },
           ],
-    [t]
+    [features.trackChangesVisible, t]
   )
 
   const downgradedPseudoPrivilege: Privilege = {
@@ -266,27 +275,13 @@ function SelectPrivilege({
       return ''
     }
 
-    if (hasBeenDowngraded) {
-      if (isSplitTestEnabled('reviewer-role')) {
-        return t('limited_to_n_editors_or_reviewers', {
-          count: features.collaborators,
-        })
-      } else {
-        return t('limited_to_n_editors', { count: features.collaborators })
-      }
-    } else if (
-      !canAddCollaborators &&
-      !['readAndWrite', 'review'].includes(value)
+    if (
+      hasBeenDowngraded ||
+      (!canAddCollaborators && !['readAndWrite', 'review'].includes(value))
     ) {
-      if (isSplitTestEnabled('reviewer-role')) {
-        return t('limited_to_n_editors_or_reviewers_per_project', {
-          count: features.collaborators,
-        })
-      } else {
-        return t('limited_to_n_editors_per_project', {
-          count: features.collaborators,
-        })
-      }
+      return t('limited_to_n_collaborators_per_project', {
+        count: features.collaborators,
+      })
     } else {
       return ''
     }
diff --git a/services/web/frontend/js/features/share-project-modal/components/editor-over-limit-modal.tsx b/services/web/frontend/js/features/share-project-modal/components/editor-over-limit-modal.tsx
index 2764a57d8e..acfdc0a3e0 100644
--- a/services/web/frontend/js/features/share-project-modal/components/editor-over-limit-modal.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/editor-over-limit-modal.tsx
@@ -3,14 +3,17 @@ import EditorOverLimitModalContent from './editor-over-limit-modal-content'
 import customLocalStorage from '@/infrastructure/local-storage'
 import { useProjectContext } from '@/shared/context/project-context'
 import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { sendMB } from '@/infrastructure/event-tracking'
 import OLModal from '@/features/ui/components/ol/ol-modal'
 
 const EditorOverLimitModal = () => {
   const [show, setShow] = useState(false)
 
-  const { isProjectOwner, permissionsLevel } = useEditorContext()
-  const { members, features, _id: projectId } = useProjectContext()
+  const { isProjectOwner } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
+  const { project, features, projectId } = useProjectContext()
+  const members = project?.members
 
   const handleHide = () => {
     setShow(false)
@@ -22,7 +25,12 @@ const EditorOverLimitModal = () => {
   useEffect(() => {
     const showModalCooldownHours = 24
     const hasExceededCollaboratorLimit = () => {
-      if (isProjectOwner || !features || permissionsLevel === 'readOnly') {
+      if (
+        isProjectOwner ||
+        !features ||
+        !members ||
+        permissionsLevel === 'readOnly'
+      ) {
         return false
       }
 
diff --git a/services/web/frontend/js/features/share-project-modal/components/invite.jsx b/services/web/frontend/js/features/share-project-modal/components/invite.tsx
similarity index 78%
rename from services/web/frontend/js/features/share-project-modal/components/invite.jsx
rename to services/web/frontend/js/features/share-project-modal/components/invite.tsx
index 3ca6f60d66..391a6f69dd 100644
--- a/services/web/frontend/js/features/share-project-modal/components/invite.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/invite.tsx
@@ -1,5 +1,4 @@
 import { useCallback } from 'react'
-import PropTypes from 'prop-types'
 import { useShareProjectContext } from './share-project-modal'
 import { useTranslation } from 'react-i18next'
 import MemberPrivileges from './member-privileges'
@@ -11,8 +10,15 @@ import OLCol from '@/features/ui/components/ol/ol-col'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import MaterialIcon from '@/shared/components/material-icon'
+import { ProjectMember } from '@/shared/context/types/project-metadata'
 
-export default function Invite({ invite, isProjectOwner }) {
+export default function Invite({
+  invite,
+  isProjectOwner,
+}: {
+  invite: ProjectMember
+  isProjectOwner: boolean
+}) {
   const { t } = useTranslation()
   return (
     <OLRow className="project-invite">
@@ -38,15 +44,10 @@ export default function Invite({ invite, isProjectOwner }) {
   )
 }
 
-Invite.propTypes = {
-  invite: PropTypes.object.isRequired,
-  isProjectOwner: PropTypes.bool.isRequired,
-}
-
-function ResendInvite({ invite }) {
+function ResendInvite({ invite }: { invite: ProjectMember }) {
   const { t } = useTranslation()
   const { monitorRequest, setError, inFlight } = useShareProjectContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   // const buttonRef = useRef(null)
   //
@@ -66,7 +67,9 @@ function ResendInvite({ invite }) {
           // if (buttonRef.current) {
           //   buttonRef.current.blur()
           // }
-          document.activeElement.blur()
+          if (document.activeElement) {
+            ;(document.activeElement as HTMLElement).blur()
+          }
         }),
     [invite, monitorRequest, projectId, setError]
   )
@@ -84,27 +87,25 @@ function ResendInvite({ invite }) {
   )
 }
 
-ResendInvite.propTypes = {
-  invite: PropTypes.object.isRequired,
-}
-
-function RevokeInvite({ invite }) {
+function RevokeInvite({ invite }: { invite: ProjectMember }) {
   const { t } = useTranslation()
-  const { updateProject, monitorRequest } = useShareProjectContext()
-  const { _id: projectId, invites, members } = useProjectContext()
+  const { monitorRequest } = useShareProjectContext()
+  const { projectId, project, updateProject } = useProjectContext()
+  const { invites, members } = project || {}
 
-  function handleClick(event) {
+  function handleClick(event: React.MouseEvent) {
     event.preventDefault()
 
     monitorRequest(() => revokeInvite(projectId, invite)).then(() => {
-      const updatedInvites = invites.filter(existing => existing !== invite)
+      const updatedInvites =
+        invites?.filter(existing => existing !== invite) || []
       updateProject({
         invites: updatedInvites,
       })
       sendMB('collaborator-invite-revoked', {
         project_id: projectId,
         current_invites_amount: updatedInvites.length,
-        current_collaborators_amount: members.length,
+        current_collaborators_amount: members?.length || 0,
       })
     })
   }
@@ -126,7 +127,3 @@ function RevokeInvite({ invite }) {
     </OLTooltip>
   )
 }
-
-RevokeInvite.propTypes = {
-  invite: PropTypes.object.isRequired,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/link-sharing.jsx b/services/web/frontend/js/features/share-project-modal/components/link-sharing.tsx
similarity index 84%
rename from services/web/frontend/js/features/share-project-modal/components/link-sharing.jsx
rename to services/web/frontend/js/features/share-project-modal/components/link-sharing.tsx
index 4e9e60c28c..e4db7e9a68 100644
--- a/services/web/frontend/js/features/share-project-modal/components/link-sharing.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/link-sharing.tsx
@@ -1,8 +1,7 @@
 import { useCallback, useState, useEffect } from 'react'
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import { useShareProjectContext } from './share-project-modal'
-import { setProjectAccessLevel } from '../utils/api'
+import { setPublicAccessLevel } from '../utils/api'
 import { CopyToClipboard } from '@/shared/components/copy-to-clipboard'
 import { useProjectContext } from '@/shared/context/project-context'
 import * as eventTracking from '../../../infrastructure/event-tracking'
@@ -18,23 +17,34 @@ import OLButton from '@/features/ui/components/ol/ol-button'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import MaterialIcon from '@/shared/components/material-icon'
 
+type Tokens = {
+  readAndWrite: string
+  readAndWriteHashPrefix: string
+  readAndWritePrefix: string
+  readOnly: string
+  readOnlyHashPrefix: string
+}
+
+type AccessLevel = 'private' | 'tokenBased' | 'readAndWrite' | 'readOnly'
+
 export default function LinkSharing() {
   const [inflight, setInflight] = useState(false)
   const [showLinks, setShowLinks] = useState(true)
 
   const { monitorRequest } = useShareProjectContext()
 
-  const { _id: projectId, publicAccessLevel } = useProjectContext()
+  const { projectId, project } = useProjectContext()
+  const { publicAccessLevel } = project || {}
 
   // set the access level of a project
   const setAccessLevel = useCallback(
-    newPublicAccessLevel => {
+    (newPublicAccessLevel: string) => {
       setInflight(true)
       sendMB('link-sharing-click-off', {
         project_id: projectId,
       })
       monitorRequest(() =>
-        setProjectAccessLevel(projectId, newPublicAccessLevel)
+        setPublicAccessLevel(projectId, newPublicAccessLevel)
       )
         .then(() => {
           // NOTE: not calling `updateProject` here as it receives data via
@@ -75,6 +85,7 @@ export default function LinkSharing() {
     case 'readAndWrite':
     case 'readOnly':
       return (
+        // TODO: do we even need this anymore?
         <LegacySharing
           setAccessLevel={setAccessLevel}
           accessLevel={publicAccessLevel}
@@ -87,7 +98,17 @@ export default function LinkSharing() {
   }
 }
 
-function PrivateSharing({ setAccessLevel, inflight, projectId, setShowLinks }) {
+function PrivateSharing({
+  setAccessLevel,
+  inflight,
+  projectId,
+  setShowLinks,
+}: {
+  setAccessLevel: (level: AccessLevel) => void
+  inflight: boolean
+  projectId: string
+  setShowLinks: (show: boolean) => void
+}) {
   const { t } = useTranslation()
   return (
     <OLRow className="public-access-level">
@@ -113,23 +134,21 @@ function PrivateSharing({ setAccessLevel, inflight, projectId, setShowLinks }) {
   )
 }
 
-PrivateSharing.propTypes = {
-  setAccessLevel: PropTypes.func.isRequired,
-  inflight: PropTypes.bool,
-  projectId: PropTypes.string,
-  setShowLinks: PropTypes.func.isRequired,
-}
-
 function TokenBasedSharing({
   setAccessLevel,
   inflight,
   setShowLinks,
   showLinks,
+}: {
+  setAccessLevel: (level: AccessLevel) => void
+  inflight: boolean
+  setShowLinks: (show: boolean) => void
+  showLinks: boolean
 }) {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
-  const [tokens, setTokens] = useState(null)
+  const [tokens, setTokens] = useState<Tokens | null>(null)
 
   const { signal } = useAbortController()
 
@@ -190,14 +209,15 @@ function TokenBasedSharing({
   )
 }
 
-TokenBasedSharing.propTypes = {
-  setAccessLevel: PropTypes.func.isRequired,
-  inflight: PropTypes.bool,
-  setShowLinks: PropTypes.func.isRequired,
-  showLinks: PropTypes.bool,
-}
-
-function LegacySharing({ accessLevel, setAccessLevel, inflight }) {
+function LegacySharing({
+  accessLevel,
+  setAccessLevel,
+  inflight,
+}: {
+  accessLevel: AccessLevel
+  setAccessLevel: (level: AccessLevel) => void
+  inflight: boolean
+}) {
   const { t } = useTranslation()
 
   return (
@@ -223,17 +243,11 @@ function LegacySharing({ accessLevel, setAccessLevel, inflight }) {
   )
 }
 
-LegacySharing.propTypes = {
-  accessLevel: PropTypes.string.isRequired,
-  setAccessLevel: PropTypes.func.isRequired,
-  inflight: PropTypes.bool,
-}
-
 export function ReadOnlyTokenLink() {
   const { t } = useTranslation()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
-  const [tokens, setTokens] = useState(null)
+  const [tokens, setTokens] = useState<Tokens | null>(null)
 
   const { signal } = useAbortController()
 
@@ -260,7 +274,17 @@ export function ReadOnlyTokenLink() {
   )
 }
 
-function AccessToken({ token, tokenHashPrefix, path, tooltipId }) {
+function AccessToken({
+  token,
+  tokenHashPrefix,
+  path,
+  tooltipId,
+}: {
+  token?: string
+  tokenHashPrefix?: string
+  path: string
+  tooltipId: string
+}) {
   const { t } = useTranslation()
   const { isAdmin } = useUserContext()
 
@@ -288,13 +312,6 @@ function AccessToken({ token, tokenHashPrefix, path, tooltipId }) {
   )
 }
 
-AccessToken.propTypes = {
-  token: PropTypes.string,
-  tokenHashPrefix: PropTypes.string,
-  tooltipId: PropTypes.string.isRequired,
-  path: PropTypes.string.isRequired,
-}
-
 function LinkSharingInfo() {
   const { t } = useTranslation()
 
diff --git a/services/web/frontend/js/features/share-project-modal/components/member-privileges.jsx b/services/web/frontend/js/features/share-project-modal/components/member-privileges.tsx
similarity index 61%
rename from services/web/frontend/js/features/share-project-modal/components/member-privileges.jsx
rename to services/web/frontend/js/features/share-project-modal/components/member-privileges.tsx
index bae354858a..0ed0d9bb8a 100644
--- a/services/web/frontend/js/features/share-project-modal/components/member-privileges.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/member-privileges.tsx
@@ -1,7 +1,11 @@
-import PropTypes from 'prop-types'
+import { ProjectMember } from '@/shared/context/types/project-metadata'
 import { useTranslation } from 'react-i18next'
 
-export default function MemberPrivileges({ privileges }) {
+export default function MemberPrivileges({
+  privileges,
+}: {
+  privileges: ProjectMember['privileges']
+}) {
   const { t } = useTranslation()
 
   switch (privileges) {
@@ -18,6 +22,3 @@ export default function MemberPrivileges({ privileges }) {
       return null
   }
 }
-MemberPrivileges.propTypes = {
-  privileges: PropTypes.string.isRequired,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/owner-info.jsx b/services/web/frontend/js/features/share-project-modal/components/owner-info.tsx
similarity index 85%
rename from services/web/frontend/js/features/share-project-modal/components/owner-info.jsx
rename to services/web/frontend/js/features/share-project-modal/components/owner-info.tsx
index c289c41568..2f30dd2f20 100644
--- a/services/web/frontend/js/features/share-project-modal/components/owner-info.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/owner-info.tsx
@@ -6,14 +6,14 @@ import MaterialIcon from '@/shared/components/material-icon'
 
 export default function OwnerInfo() {
   const { t } = useTranslation()
-  const { owner } = useProjectContext()
+  const { project } = useProjectContext()
 
   return (
     <OLRow className="project-member">
       <OLCol xs={8}>
         <div className="project-member-email-icon">
           <MaterialIcon type="person" />
-          <div className="email-warning">{owner?.email}</div>
+          <div className="email-warning">{project?.owner.email}</div>
         </div>
       </OLCol>
       <OLCol xs={4} className="text-end">
diff --git a/services/web/frontend/js/features/share-project-modal/components/select-collaborators.jsx b/services/web/frontend/js/features/share-project-modal/components/select-collaborators.tsx
similarity index 84%
rename from services/web/frontend/js/features/share-project-modal/components/select-collaborators.jsx
rename to services/web/frontend/js/features/share-project-modal/components/select-collaborators.tsx
index ffaadb6b01..40c17c44f3 100644
--- a/services/web/frontend/js/features/share-project-modal/components/select-collaborators.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/select-collaborators.tsx
@@ -1,14 +1,20 @@
 import { useEffect, useMemo, useState, useRef, useCallback } from 'react'
-import PropTypes from 'prop-types'
 import { useTranslation } from 'react-i18next'
 import { matchSorter } from 'match-sorter'
-import { useCombobox } from 'downshift'
+import { useCombobox, UseMultipleSelectionReturnValue } from 'downshift'
 import classnames from 'classnames'
 
 import MaterialIcon from '@/shared/components/material-icon'
 import Tag from '@/features/ui/components/bootstrap-5/tag'
 import { DropdownItem } from '@/features/ui/components/bootstrap-5/dropdown-menu'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
+import { Contact } from '../utils/types'
+
+export type ContactItem = {
+  email: string
+  display: string
+  type: string
+}
 
 // Unicode characters in these Unicode groups:
 //  "General Punctuation — Spaces"
@@ -21,6 +27,11 @@ export default function SelectCollaborators({
   options,
   placeholder,
   multipleSelectionProps,
+}: {
+  loading: boolean
+  options: Contact[]
+  placeholder: string
+  multipleSelectionProps: UseMultipleSelectionReturnValue<ContactItem>
 }) {
   const { t } = useTranslation()
   const {
@@ -58,12 +69,14 @@ export default function SelectCollaborators({
     })
   }, [unselectedOptions, inputValue])
 
-  const inputRef = useRef(null)
+  const inputRef = useRef<HTMLInputElement>(null)
 
   const focusInput = useCallback(() => {
     if (inputRef.current) {
       window.setTimeout(() => {
-        inputRef.current.focus()
+        if (inputRef.current) {
+          inputRef.current.focus()
+        }
       }, 10)
     }
   }, [inputRef])
@@ -80,7 +93,7 @@ export default function SelectCollaborators({
     return true
   }, [inputValue, selectedItems])
 
-  function stateReducer(state, actionAndChanges) {
+  function stateReducer(_: unknown, actionAndChanges: any) {
     const { type, changes } = actionAndChanges
     // force selected item to be null so that adding, removing, then re-adding the same collaborator is recognised as a selection change
     if (type === useCombobox.stateChangeTypes.InputChange) {
@@ -94,7 +107,6 @@ export default function SelectCollaborators({
     getLabelProps,
     getMenuProps,
     getInputProps,
-    getComboboxProps,
     highlightedIndex,
     getItemProps,
     reset,
@@ -102,9 +114,9 @@ export default function SelectCollaborators({
     inputValue,
     defaultHighlightedIndex: 0,
     items: filteredOptions,
-    itemToString: item => item && item.name,
+    itemToString: item => (item && item.name) || '',
     stateReducer,
-    onStateChange: ({ inputValue, type, selectedItem }) => {
+    onStateChange: ({ type, selectedItem }) => {
       switch (type) {
         // add a selected item on Enter (keypress), click or blur
         case useCombobox.stateChangeTypes.InputKeyDownEnter:
@@ -120,7 +132,7 @@ export default function SelectCollaborators({
   })
 
   const addNewItem = useCallback(
-    (_email, focus = true) => {
+    (_email: string, focus = true) => {
       const email = _email.replace(matchAllSpaces, '')
 
       if (
@@ -171,11 +183,7 @@ export default function SelectCollaborators({
 
       <div className="host">
         {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}
-        <div
-          {...getComboboxProps()}
-          className="tags form-control"
-          onClick={focusInput}
-        >
+        <div className="tags form-control" onClick={focusInput}>
           {selectedItems.map((selectedItem, index) => (
             <SelectedItem
               key={`selected-item-${index}`}
@@ -205,7 +213,7 @@ export default function SelectCollaborators({
                   addNewItem(inputValue, false)
                 },
                 onChange: e => {
-                  setInputValue(e.target.value)
+                  setInputValue((e.target as HTMLInputElement).value)
                 },
                 onClick: () => focusInput,
                 onKeyDown: event => {
@@ -235,7 +243,7 @@ export default function SelectCollaborators({
                   const data =
                     // modern browsers
                     event.clipboardData?.getData('text/plain') ??
-                    // IE11
+                    // @ts-ignore IE11
                     window.clipboardData?.getData('text')
 
                   if (data) {
@@ -281,20 +289,18 @@ export default function SelectCollaborators({
     </div>
   )
 }
-SelectCollaborators.propTypes = {
-  loading: PropTypes.bool.isRequired,
-  options: PropTypes.array.isRequired,
-  placeholder: PropTypes.string,
-  multipleSelectionProps: PropTypes.shape({
-    getSelectedItemProps: PropTypes.func.isRequired,
-    getDropdownProps: PropTypes.func.isRequired,
-    addSelectedItem: PropTypes.func.isRequired,
-    removeSelectedItem: PropTypes.func.isRequired,
-    selectedItems: PropTypes.array.isRequired,
-  }).isRequired,
-}
 
-function Option({ selected, item, getItemProps, index }) {
+function Option({
+  selected,
+  item,
+  getItemProps,
+  index,
+}: {
+  selected: boolean
+  item: Contact
+  getItemProps: (any: any) => any
+  index: number
+}) {
   return (
     <li {...getItemProps({ item, index })}>
       <DropdownItem
@@ -311,24 +317,21 @@ function Option({ selected, item, getItemProps, index }) {
   )
 }
 
-Option.propTypes = {
-  selected: PropTypes.bool.isRequired,
-  item: PropTypes.shape({
-    display: PropTypes.string.isRequired,
-  }),
-  index: PropTypes.number.isRequired,
-  getItemProps: PropTypes.func.isRequired,
-}
-
 function SelectedItem({
   removeSelectedItem,
   selectedItem,
   focusInput,
   getSelectedItemProps,
   index,
+}: {
+  removeSelectedItem: (item: ContactItem) => void
+  selectedItem: ContactItem
+  focusInput: () => void
+  getSelectedItemProps: (any: any) => any
+  index: number
 }) {
   const handleClick = useCallback(
-    event => {
+    (event: React.MouseEvent) => {
       event.preventDefault()
       event.stopPropagation()
       removeSelectedItem(selectedItem)
@@ -349,13 +352,3 @@ function SelectedItem({
     </Tag>
   )
 }
-
-SelectedItem.propTypes = {
-  focusInput: PropTypes.func.isRequired,
-  removeSelectedItem: PropTypes.func.isRequired,
-  selectedItem: PropTypes.shape({
-    display: PropTypes.string.isRequired,
-  }),
-  getSelectedItemProps: PropTypes.func.isRequired,
-  index: PropTypes.number.isRequired,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/send-invites-notice.tsx b/services/web/frontend/js/features/share-project-modal/components/send-invites-notice.tsx
index 5efe27d443..155f908ed4 100644
--- a/services/web/frontend/js/features/share-project-modal/components/send-invites-notice.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/send-invites-notice.tsx
@@ -7,7 +7,8 @@ import OLRow from '@/features/ui/components/ol/ol-row'
 import OLCol from '@/features/ui/components/ol/ol-col'
 
 export default function SendInvitesNotice() {
-  const { publicAccessLevel } = useProjectContext()
+  const { project } = useProjectContext()
+  const { publicAccessLevel } = project || {}
   const { isPendingEditor } = useEditorContext()
   const { t } = useTranslation()
 
@@ -17,11 +18,15 @@ export default function SendInvitesNotice() {
         <Notification
           isActionBelowContent
           type="info"
-          title={t('youve_lost_edit_access')}
+          title={t('youve_lost_collaboration_access')}
           content={
             <div>
-              <p>{t('this_project_already_has_maximum_editors')}</p>
-              <p>{t('please_ask_the_project_owner_to_upgrade_more_editors')}</p>
+              <p>{t('this_project_already_has_maximum_collaborators')}</p>
+              <p>
+                {t(
+                  'please_ask_the_project_owner_to_upgrade_more_collaborators'
+                )}
+              </p>
             </div>
           }
         />
diff --git a/services/web/frontend/js/features/share-project-modal/components/send-invites.jsx b/services/web/frontend/js/features/share-project-modal/components/send-invites.tsx
similarity index 80%
rename from services/web/frontend/js/features/share-project-modal/components/send-invites.jsx
rename to services/web/frontend/js/features/share-project-modal/components/send-invites.tsx
index f27d42f404..da704d039f 100644
--- a/services/web/frontend/js/features/share-project-modal/components/send-invites.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/send-invites.tsx
@@ -2,7 +2,6 @@ import AddCollaborators from './add-collaborators'
 import AddCollaboratorsUpgrade from './add-collaborators-upgrade'
 import CollaboratorsLimitUpgrade from './collaborators-limit-upgrade'
 import AccessLevelsChanged from './access-levels-changed'
-import PropTypes from 'prop-types'
 import OLRow from '@/features/ui/components/ol/ol-row'
 
 export default function SendInvites({
@@ -10,6 +9,11 @@ export default function SendInvites({
   hasExceededCollaboratorLimit,
   haveAnyEditorsBeenDowngraded,
   somePendingEditorsResolved,
+}: {
+  canAddCollaborators: boolean
+  hasExceededCollaboratorLimit: boolean
+  haveAnyEditorsBeenDowngraded: boolean
+  somePendingEditorsResolved: boolean
 }) {
   return (
     <OLRow className="invite-controls">
@@ -30,10 +34,3 @@ export default function SendInvites({
     </OLRow>
   )
 }
-
-SendInvites.propTypes = {
-  canAddCollaborators: PropTypes.bool,
-  hasExceededCollaboratorLimit: PropTypes.bool,
-  haveAnyEditorsBeenDowngraded: PropTypes.bool,
-  somePendingEditorsResolved: PropTypes.bool,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/share-modal-body.tsx b/services/web/frontend/js/features/share-project-modal/components/share-modal-body.tsx
index 500834d30d..c12ad1d2a5 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-modal-body.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/share-modal-body.tsx
@@ -12,7 +12,8 @@ import RecaptchaConditions from '@/shared/components/recaptcha-conditions'
 import getMeta from '@/utils/meta'
 
 export default function ShareModalBody() {
-  const { members, invites, features } = useProjectContext()
+  const { project, features } = useProjectContext()
+  const { members, invites } = project || {}
   const { isProjectOwner } = useEditorContext()
 
   // whether the project has not reached the collaborator limit
@@ -26,12 +27,12 @@ export default function ShareModalBody() {
       return true
     }
 
-    const editorInvites = invites.filter(
-      invite => invite.privileges !== 'readOnly'
-    ).length
+    const editorInvites =
+      invites?.filter(invite => invite.privileges !== 'readOnly').length || 0
 
     return (
-      members.filter(member => member.privileges !== 'readOnly').length +
+      (members?.filter(member => member.privileges !== 'readOnly').length ||
+        0) +
         editorInvites <
       (features.collaborators ?? 1)
     )
@@ -40,11 +41,11 @@ export default function ShareModalBody() {
   // determine if some but not all pending editors' permissions have been resolved,
   // for moving between warning and info notification states etc.
   const somePendingEditorsResolved = useMemo(() => {
-    return (
-      members.some(member =>
+    return Boolean(
+      members?.some(member =>
         ['readAndWrite', 'review'].includes(member.privileges)
       ) &&
-      members.some(member => member.pendingEditor || member.pendingReviewer)
+        members?.some(member => member.pendingEditor || member.pendingReviewer)
     )
   }, [members])
 
@@ -56,13 +57,14 @@ export default function ShareModalBody() {
     if (features.collaborators === -1) {
       return false
     }
-    return members.some(
-      member => member.pendingEditor || member.pendingReviewer
+    return (
+      members?.some(member => member.pendingEditor || member.pendingReviewer) ||
+      false
     )
   }, [features, isProjectOwner, members])
 
   const hasExceededCollaboratorLimit = useMemo(() => {
-    if (!isProjectOwner || !features) {
+    if (!isProjectOwner || !features || !members) {
       return false
     }
 
@@ -77,6 +79,9 @@ export default function ShareModalBody() {
   }, [features, isProjectOwner, members])
 
   const sortedMembers = useMemo(() => {
+    if (!members) {
+      return []
+    }
     return [
       ...members.filter(member => member.privileges === 'readAndWrite'),
       ...members.filter(member => member.pendingEditor),
@@ -117,13 +122,16 @@ export default function ShareModalBody() {
               member.pendingEditor || member.pendingReviewer
             )}
             canAddCollaborators={canAddCollaborators}
+            isReviewerOnFreeProject={
+              member.privileges === 'review' && !features.trackChanges
+            }
           />
         ) : (
           <ViewMember key={member._id} member={member} />
         )
       )}
 
-      {invites.map(invite => (
+      {(invites || []).map(invite => (
         <Invite
           key={invite._id}
           invite={invite}
diff --git a/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.tsx b/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.tsx
index cabf2ddd70..3f08fdf3a1 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/share-project-modal-content.tsx
@@ -11,7 +11,7 @@ import OLModal, {
 } from '@/features/ui/components/ol/ol-modal'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
 
 const ReadOnlyTokenLink = lazy(() =>
   import('./link-sharing').then(({ ReadOnlyTokenLink }) => ({
diff --git a/services/web/frontend/js/features/share-project-modal/components/share-project-modal.tsx b/services/web/frontend/js/features/share-project-modal/components/share-project-modal.tsx
index 7a4139e2de..6dabc9f9d8 100644
--- a/services/web/frontend/js/features/share-project-modal/components/share-project-modal.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/share-project-modal.tsx
@@ -9,12 +9,10 @@ import ShareProjectModalContent from './share-project-modal-content'
 import { useProjectContext } from '@/shared/context/project-context'
 import { useSplitTestContext } from '@/shared/context/split-test-context'
 import { sendMB } from '@/infrastructure/event-tracking'
-import { ProjectContextUpdateValue } from '@/shared/context/types/project-context'
 import { useEditorContext } from '@/shared/context/editor-context'
 import customLocalStorage from '@/infrastructure/local-storage'
 
 type ShareProjectContextValue = {
-  updateProject: (project: ProjectContextUpdateValue) => void
   monitorRequest: <T extends Promise<unknown>>(request: () => T) => T
   inFlight: boolean
   setInFlight: React.Dispatch<
@@ -61,7 +59,7 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
     useState<ShareProjectContextValue['inFlight']>(false)
   const [error, setError] = useState<ShareProjectContextValue['error']>()
 
-  const project = useProjectContext()
+  const { project, projectId } = useProjectContext()
   const { isProjectOwner } = useEditorContext()
 
   const { splitTestVariants } = useSplitTestContext()
@@ -70,7 +68,7 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
   // is over collaborator limit or has pending editors (once every 24 hours)
   useEffect(() => {
     const hasExceededCollaboratorLimit = () => {
-      if (!isProjectOwner || !project.features) {
+      if (!isProjectOwner || !project || !project.features) {
         return false
       }
 
@@ -88,7 +86,7 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
     }
 
     if (hasExceededCollaboratorLimit()) {
-      const localStorageKey = `last-shown-share-modal.${project._id}`
+      const localStorageKey = `last-shown-share-modal.${projectId}`
       const lastShownShareModalTime =
         customLocalStorage.getItem(localStorageKey)
       if (
@@ -99,17 +97,17 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
         customLocalStorage.setItem(localStorageKey, Date.now())
       }
     }
-  }, [project, isProjectOwner, handleOpen])
+  }, [project, isProjectOwner, handleOpen, projectId])
 
   // send tracking event when the modal is opened
   useEffect(() => {
     if (show) {
       sendMB('share-modal-opened', {
         splitTestVariant: splitTestVariants['null-test-share-modal'],
-        project_id: project._id,
+        project_id: projectId,
       })
     }
-  }, [splitTestVariants, project._id, show])
+  }, [splitTestVariants, projectId, show])
 
   // reset error when the modal is opened
   useEffect(() => {
@@ -126,7 +124,7 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
   }, [handleHide, inFlight])
 
   // update `error` and `inFlight` while sending a request
-  const monitorRequest = useCallback(request => {
+  const monitorRequest = useCallback((request: () => any) => {
     setError(undefined)
     setInFlight(true)
 
@@ -147,12 +145,6 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
     return promise
   }, [])
 
-  // merge the new data with the old project data
-  const updateProject = useCallback(
-    data => Object.assign(project, data),
-    [project]
-  )
-
   if (!project) {
     return null
   }
@@ -160,7 +152,6 @@ const ShareProjectModal = React.memo(function ShareProjectModal({
   return (
     <ShareProjectContext.Provider
       value={{
-        updateProject,
         monitorRequest,
         inFlight,
         setInFlight,
diff --git a/services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.jsx b/services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.tsx
similarity index 87%
rename from services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.jsx
rename to services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.tsx
index 81961d7ede..707d9d4b91 100644
--- a/services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/transfer-ownership-modal.tsx
@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
-import PropTypes from 'prop-types'
 import { transferProjectOwnership } from '../utils/api'
 import { useProjectContext } from '@/shared/context/project-context'
 import { useLocation } from '@/shared/hooks/use-location'
@@ -12,16 +11,23 @@ import OLModal, {
 } from '@/features/ui/components/ol/ol-modal'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import { Spinner } from 'react-bootstrap-5'
+import { Spinner } from 'react-bootstrap'
+import { ProjectMember } from '@/shared/context/types/project-metadata'
 
-export default function TransferOwnershipModal({ member, cancel }) {
+export default function TransferOwnershipModal({
+  member,
+  cancel,
+}: {
+  member: ProjectMember
+  cancel: () => void
+}) {
   const { t } = useTranslation()
 
   const [inflight, setInflight] = useState(false)
   const [error, setError] = useState(false)
   const location = useLocation()
 
-  const { _id: projectId, name: projectName } = useProjectContext()
+  const { projectId, name: projectName } = useProjectContext()
 
   function confirm() {
     setError(false)
@@ -82,7 +88,3 @@ export default function TransferOwnershipModal({ member, cancel }) {
     </OLModal>
   )
 }
-TransferOwnershipModal.propTypes = {
-  member: PropTypes.object.isRequired,
-  cancel: PropTypes.func.isRequired,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/view-member.jsx b/services/web/frontend/js/features/share-project-modal/components/view-member.tsx
similarity index 68%
rename from services/web/frontend/js/features/share-project-modal/components/view-member.jsx
rename to services/web/frontend/js/features/share-project-modal/components/view-member.tsx
index 3faec91612..1822af9ce3 100644
--- a/services/web/frontend/js/features/share-project-modal/components/view-member.jsx
+++ b/services/web/frontend/js/features/share-project-modal/components/view-member.tsx
@@ -1,10 +1,10 @@
-import PropTypes from 'prop-types'
 import MemberPrivileges from './member-privileges'
 import OLRow from '@/features/ui/components/ol/ol-row'
 import OLCol from '@/features/ui/components/ol/ol-col'
 import MaterialIcon from '@/shared/components/material-icon'
+import { ProjectMember } from '@/shared/context/types/project-metadata'
 
-export default function ViewMember({ member }) {
+export default function ViewMember({ member }: { member: ProjectMember }) {
   return (
     <OLRow className="project-member">
       <OLCol xs={8}>
@@ -19,11 +19,3 @@ export default function ViewMember({ member }) {
     </OLRow>
   )
 }
-
-ViewMember.propTypes = {
-  member: PropTypes.shape({
-    _id: PropTypes.string.isRequired,
-    email: PropTypes.string.isRequired,
-    privileges: PropTypes.string.isRequired,
-  }).isRequired,
-}
diff --git a/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal-content.tsx b/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal-content.tsx
index 622e8c859e..7fb3de5e74 100644
--- a/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal-content.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal-content.tsx
@@ -24,8 +24,8 @@ export default function ViewOnlyAccessModalContent({
       </OLModalHeader>
 
       <OLModalBody>
-        <p>{t('this_project_already_has_maximum_editors')}</p>
-        <p>{t('please_ask_the_project_owner_to_upgrade_more_editors')}</p>
+        <p>{t('this_project_already_has_maximum_collaborators')}</p>
+        <p>{t('please_ask_the_project_owner_to_upgrade_more_collaborators')}</p>
       </OLModalBody>
       <OLModalFooter>
         <OLButton
diff --git a/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal.tsx b/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal.tsx
index ab2ea023bb..daae76bd7a 100644
--- a/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal.tsx
+++ b/services/web/frontend/js/features/share-project-modal/components/view-only-access-modal.tsx
@@ -3,15 +3,17 @@ import ViewOnlyAccessModalContent from './view-only-access-modal-content'
 import customLocalStorage from '@/infrastructure/local-storage'
 import { useProjectContext } from '@/shared/context/project-context'
 import { useEditorContext } from '@/shared/context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { sendMB } from '@/infrastructure/event-tracking'
 import OLModal from '@/features/ui/components/ol/ol-modal'
 
 const ViewOnlyAccessModal = () => {
   const [show, setShow] = useState(false)
 
-  const { isProjectOwner, isPendingEditor, permissionsLevel } =
-    useEditorContext()
-  const { members, features, _id: projectId } = useProjectContext()
+  const { isProjectOwner, isPendingEditor } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
+  const { features, projectId, project } = useProjectContext()
+  const members = project?.members
 
   const handleHide = () => {
     setShow(false)
diff --git a/services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.js b/services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.ts
similarity index 85%
rename from services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.js
rename to services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.ts
index f23af1fbd3..35f9f9db9f 100644
--- a/services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.js
+++ b/services/web/frontend/js/features/share-project-modal/hooks/use-user-contacts.ts
@@ -1,10 +1,11 @@
 import { useEffect, useState } from 'react'
 import { getJSON } from '../../../infrastructure/fetch-json'
 import useAbortController from '../../../shared/hooks/use-abort-controller'
+import { Contact } from '../utils/types'
 
 export function useUserContacts() {
   const [loading, setLoading] = useState(true)
-  const [data, setData] = useState(null)
+  const [data, setData] = useState<Contact[] | null>(null)
   const [error, setError] = useState(false)
 
   const { signal } = useAbortController()
@@ -21,7 +22,7 @@ export function useUserContacts() {
   return { loading, data, error }
 }
 
-function buildContact(contact) {
+function buildContact(contact: Omit<Contact, 'name' | 'display'>): Contact {
   const [emailPrefix] = contact.email.split('@')
 
   // the name is not just the default "email prefix as first name"
diff --git a/services/web/frontend/js/features/share-project-modal/utils/api.js b/services/web/frontend/js/features/share-project-modal/utils/api.js
index d52b6a4857..38b2040f2b 100644
--- a/services/web/frontend/js/features/share-project-modal/utils/api.js
+++ b/services/web/frontend/js/features/share-project-modal/utils/api.js
@@ -47,7 +47,7 @@ export function transferProjectOwnership(projectId, member) {
   })
 }
 
-export function setProjectAccessLevel(projectId, publicAccessLevel) {
+export function setPublicAccessLevel(projectId, publicAccessLevel) {
   return postJSON(`/project/${projectId}/settings/admin`, {
     body: { publicAccessLevel },
   })
diff --git a/services/web/frontend/js/features/share-project-modal/utils/types.ts b/services/web/frontend/js/features/share-project-modal/utils/types.ts
new file mode 100644
index 0000000000..9636f14fb5
--- /dev/null
+++ b/services/web/frontend/js/features/share-project-modal/utils/types.ts
@@ -0,0 +1,9 @@
+export type Contact = {
+  id: string
+  display: string
+  email: string
+  first_name: string
+  last_name: string
+  name: string
+  type: 'user'
+}
diff --git a/services/web/frontend/js/features/socket-diagnostics/components/diagnostic-component.tsx b/services/web/frontend/js/features/socket-diagnostics/components/diagnostic-component.tsx
index 7adddc5329..91829a09e2 100644
--- a/services/web/frontend/js/features/socket-diagnostics/components/diagnostic-component.tsx
+++ b/services/web/frontend/js/features/socket-diagnostics/components/diagnostic-component.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import classnames from 'classnames'
 import type { ConnectionStatus } from './types'
-import { Badge, Button } from 'react-bootstrap-5'
+import { Badge, Button } from 'react-bootstrap'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 import MaterialIcon from '@/shared/components/material-icon'
 
diff --git a/services/web/frontend/js/features/socket-diagnostics/components/socket-diagnostics.tsx b/services/web/frontend/js/features/socket-diagnostics/components/socket-diagnostics.tsx
index 498a9ecc23..39876d250e 100644
--- a/services/web/frontend/js/features/socket-diagnostics/components/socket-diagnostics.tsx
+++ b/services/web/frontend/js/features/socket-diagnostics/components/socket-diagnostics.tsx
@@ -7,7 +7,7 @@ import {
   DiagnosticItem,
   ErrorAlert,
 } from './diagnostic-component'
-import { Col, Container, Row } from 'react-bootstrap-5'
+import { Col, Container, Row } from 'react-bootstrap'
 import MaterialIcon from '@/shared/components/material-icon'
 import OLFormCheckbox from '@/features/ui/components/ol/ol-form-checkbox'
 import { CopyToClipboard } from '@/shared/components/copy-to-clipboard'
diff --git a/services/web/frontend/js/features/socket-diagnostics/components/use-socket-manager.ts b/services/web/frontend/js/features/socket-diagnostics/components/use-socket-manager.ts
index a0035052f5..9636c8e282 100644
--- a/services/web/frontend/js/features/socket-diagnostics/components/use-socket-manager.ts
+++ b/services/web/frontend/js/features/socket-diagnostics/components/use-socket-manager.ts
@@ -79,7 +79,7 @@ export function useSocketManager() {
         const beforeTime = info.data.time
         const now = Date.now()
         const latency = now - beforeTime
-        const clockDelta = (beforeTime + beforeTime) / 2 - info.serverTime
+        const clockDelta = (beforeTime + now) / 2 - info.serverTime
         setDebugInfo(prev => ({
           ...prev,
           received: prev.received + 1,
diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
index 2c6e08a536..4bdfe2682c 100644
--- a/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
+++ b/services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
@@ -17,8 +17,8 @@ import {
   CodeMirrorViewContext,
 } from './codemirror-context'
 import MathPreviewTooltip from './math-preview-tooltip'
-import Breadcrumbs from '@/features/ide-redesign/components/breadcrumbs'
-import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useToolbarMenuBarEditorCommands } from '@/features/ide-redesign/hooks/use-toolbar-menu-editor-commands'
+import { useProjectContext } from '@/shared/context/project-context'
 
 // TODO: remove this when definitely no longer used
 export * from './codemirror-context'
@@ -39,8 +39,6 @@ function CodeMirrorEditor() {
 
   const isMounted = useIsMounted()
 
-  const newEditor = useIsNewEditorEnabled()
-
   // create the view using the initial state and intercept transactions
   const viewRef = useRef<EditorView | null>(null)
   if (viewRef.current === null) {
@@ -62,33 +60,41 @@ function CodeMirrorEditor() {
   return (
     <CodeMirrorStateContext.Provider value={state}>
       <CodeMirrorViewContext.Provider value={viewRef.current}>
-        <ReviewPanelProviders>
-          <CodemirrorOutline />
-          <CodeMirrorView />
-          <FigureModal />
-          <CodeMirrorSearch />
-          <CodeMirrorToolbar />
-          {sourceEditorToolbarComponents.map(
-            ({ import: { default: Component }, path }) => (
-              <Component key={path} />
-            )
-          )}
-          {newEditor && <Breadcrumbs />}
-          <CodeMirrorCommandTooltip />
-
-          <MathPreviewTooltip />
-          <ReviewTooltipMenu />
-          <ReviewPanelNew />
-
-          {sourceEditorComponents.map(
-            ({ import: { default: Component }, path }) => (
-              <Component key={path} />
-            )
-          )}
-        </ReviewPanelProviders>
+        <CodeMirrorEditorComponents />
       </CodeMirrorViewContext.Provider>
     </CodeMirrorStateContext.Provider>
   )
 }
 
+function CodeMirrorEditorComponents() {
+  useToolbarMenuBarEditorCommands()
+  const { features } = useProjectContext()
+
+  return (
+    <ReviewPanelProviders>
+      <CodemirrorOutline />
+      <CodeMirrorView />
+      <FigureModal />
+      <CodeMirrorSearch />
+      <CodeMirrorToolbar />
+      {sourceEditorToolbarComponents.map(
+        ({ import: { default: Component }, path }) => (
+          <Component key={path} />
+        )
+      )}
+      <CodeMirrorCommandTooltip />
+
+      <MathPreviewTooltip />
+      {features.trackChangesVisible && <ReviewTooltipMenu />}
+      {features.trackChangesVisible && <ReviewPanelNew />}
+
+      {sourceEditorComponents.map(
+        ({ import: { default: Component }, path }) => (
+          <Component key={path} />
+        )
+      )}
+    </ReviewPanelProviders>
+  )
+}
+
 export default memo(CodeMirrorEditor)
diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
index a51075cb46..a65232f94d 100644
--- a/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
+++ b/services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
@@ -2,7 +2,15 @@ import {
   useCodeMirrorStateContext,
   useCodeMirrorViewContext,
 } from './codemirror-context'
-import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import {
+  FC,
+  FormEvent,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react'
 import { runScopeHandlers } from '@codemirror/view'
 import {
   closeSearchPanel,
@@ -28,6 +36,7 @@ import { getStoredSelection, setStoredSelection } from '../extensions/search'
 import { debounce } from 'lodash'
 import { EditorSelection, EditorState } from '@codemirror/state'
 import { sendSearchEvent } from '@/features/event-tracking/search-events'
+import { FullProjectSearchButton } from './full-project-search-button'
 
 const MATCH_COUNT_DEBOUNCE_WAIT = 100 // the amount of ms to wait before counting matches
 const MAX_MATCH_COUNT = 999 // the maximum number of matches to count
@@ -46,7 +55,7 @@ type MatchPositions = {
   interrupted: boolean
 }
 
-const CodeMirrorSearchForm: FC = () => {
+const CodeMirrorSearchForm: FC<React.PropsWithChildren> = () => {
   const view = useCodeMirrorViewContext()
   const state = useCodeMirrorStateContext()
 
@@ -72,7 +81,7 @@ const CodeMirrorSearchForm: FC = () => {
   const inputRef = useRef<HTMLInputElement | null>(null)
   const replaceRef = useRef<HTMLInputElement | null>(null)
 
-  const handleInputRef = useCallback(node => {
+  const handleInputRef = useCallback((node: HTMLInputElement) => {
     inputRef.current = node
 
     // focus the search input when the panel opens
@@ -82,11 +91,11 @@ const CodeMirrorSearchForm: FC = () => {
     }
   }, [])
 
-  const handleReplaceRef = useCallback(node => {
+  const handleReplaceRef = useCallback((node: HTMLInputElement) => {
     replaceRef.current = node
   }, [])
 
-  const handleSubmit = useCallback(event => {
+  const handleSubmit = useCallback((event: FormEvent) => {
     event.preventDefault()
   }, [])
 
@@ -119,8 +128,8 @@ const CodeMirrorSearchForm: FC = () => {
   }, [handleChange, state, view])
 
   const handleFormKeyDown = useCallback(
-    event => {
-      if (runScopeHandlers(view, event, 'search-panel')) {
+    (event: React.KeyboardEvent<HTMLFormElement>) => {
+      if (runScopeHandlers(view, event.nativeEvent, 'search-panel')) {
         event.preventDefault()
       }
     },
@@ -129,7 +138,7 @@ const CodeMirrorSearchForm: FC = () => {
 
   // Returns true if the event was handled, false otherwise
   const handleEmacsNavigation = useCallback(
-    event => {
+    (event: KeyboardEvent) => {
       const emacsCtrlSeq =
         emacsKeybindingsActive &&
         event.ctrlKey &&
@@ -157,7 +166,14 @@ const CodeMirrorSearchForm: FC = () => {
           event.stopPropagation()
           event.preventDefault()
           closeSearchPanel(view)
-          document.dispatchEvent(new CustomEvent('cm:emacs-close-search-panel'))
+          // Wait for the search panel to close before moving the cursor
+          window.setTimeout(
+            () =>
+              document.dispatchEvent(
+                new CustomEvent('cm:emacs-close-search-panel')
+              ),
+            0
+          )
           return true
         }
         default: {
@@ -169,7 +185,7 @@ const CodeMirrorSearchForm: FC = () => {
   )
 
   const handleSearchKeyDown = useCallback(
-    event => {
+    (event: React.KeyboardEvent<HTMLInputElement>) => {
       switch (event.key) {
         case 'Enter':
           event.preventDefault()
@@ -185,13 +201,13 @@ const CodeMirrorSearchForm: FC = () => {
           }
           break
       }
-      handleEmacsNavigation(event)
+      handleEmacsNavigation(event.nativeEvent)
     },
     [view, handleEmacsNavigation, emacsKeybindingsActive]
   )
 
   const handleReplaceKeyDown = useCallback(
-    event => {
+    (event: React.KeyboardEvent<HTMLInputElement>) => {
       switch (event.key) {
         case 'Enter':
           event.preventDefault()
@@ -210,7 +226,7 @@ const CodeMirrorSearchForm: FC = () => {
           }
         }
       }
-      handleEmacsNavigation(event)
+      handleEmacsNavigation(event.nativeEvent)
     },
     [view, handleEmacsNavigation]
   )
@@ -424,6 +440,8 @@ const CodeMirrorSearchForm: FC = () => {
             </OLButton>
           </OLButtonGroup>
 
+          <FullProjectSearchButton query={query} />
+
           {position !== null && (
             <div className="ol-cm-search-form-position">
               {position.current === null ? '?' : position.current} {t('of')}{' '}
diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx
index 4eb9ed2842..b106968c60 100644
--- a/services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx
+++ b/services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx
@@ -20,6 +20,13 @@ import { minimumListDepthForSelection } from '../utils/tree-operations/ancestors
 import { debugConsole } from '@/utils/debugging'
 import { useTranslation } from 'react-i18next'
 import { ToggleSearchButton } from '@/features/source-editor/components/toolbar/toggle-search-button'
+import ReviewPanelHeader from '@/features/review-panel-new/components/review-panel-header'
+import useReviewPanelLayout from '@/features/review-panel-new/hooks/use-review-panel-layout'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import Breadcrumbs from '@/features/ide-redesign/components/breadcrumbs'
+import classNames from 'classnames'
+import { useUserSettingsContext } from '@/shared/context/user-settings-context'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
 
 export const CodeMirrorToolbar = () => {
   const view = useCodeMirrorViewContext()
@@ -36,6 +43,10 @@ const Toolbar = memo(function Toolbar() {
   const { t } = useTranslation()
   const state = useCodeMirrorStateContext()
   const view = useCodeMirrorViewContext()
+  const {
+    userSettings: { breadcrumbs },
+  } = useUserSettingsContext()
+  const visualPreviewEnabled = useFeatureFlag('visual-preview')
 
   const [overflowed, setOverflowed] = useState(false)
 
@@ -46,6 +57,9 @@ const Toolbar = memo(function Toolbar() {
 
   const listDepth = minimumListDepthForSelection(state)
 
+  const newEditor = useIsNewEditorEnabled()
+  const { showHeader: showReviewPanelHeader } = useReviewPanelLayout()
+
   const {
     open: overflowOpen,
     onToggle: setOverflowOpen,
@@ -98,7 +112,7 @@ const Toolbar = memo(function Toolbar() {
   // calculate overflow when buttons change
   const observerRef = useRef<MutationObserver | null>(null)
   const handleButtons = useCallback(
-    node => {
+    (node: HTMLDivElement) => {
       if (!('MutationObserver' in window)) {
         return
       }
@@ -131,50 +145,61 @@ const Toolbar = memo(function Toolbar() {
   const showActions = !state.readOnly && !insideTable
 
   return (
-    <div
-      role="toolbar"
-      aria-label={t('toolbar_editor')}
-      className="ol-cm-toolbar toolbar-editor"
-      ref={elementRef}
-    >
-      <EditorSwitch />
-      {showActions && (
-        <ToolbarItems
-          state={state}
-          languageName={languageName}
-          visual={visual}
-          listDepth={listDepth}
-        />
-      )}
-
-      <div className="ol-cm-toolbar-button-group ol-cm-toolbar-stretch">
-        {showActions && (
-          <ToolbarOverflow
-            overflowed={overflowed}
-            overflowOpen={overflowOpen}
-            setOverflowOpen={setOverflowOpen}
-            overflowRef={overflowRef}
-          >
+    <>
+      {newEditor && showReviewPanelHeader && <ReviewPanelHeader />}
+      <div
+        id="ol-cm-toolbar-wrapper"
+        className={classNames('ol-cm-toolbar-wrapper', {
+          'ol-cm-toolbar-wrapper-indented': newEditor && showReviewPanelHeader,
+        })}
+      >
+        <div
+          role="toolbar"
+          aria-label={t('toolbar_editor')}
+          className="ol-cm-toolbar toolbar-editor"
+          ref={elementRef}
+        >
+          {!visualPreviewEnabled && <EditorSwitch />}
+          {showActions && (
             <ToolbarItems
               state={state}
-              overflowed={overflowedItemsRef.current}
               languageName={languageName}
               visual={visual}
               listDepth={listDepth}
             />
-          </ToolbarOverflow>
-        )}
-      </div>
+          )}
 
-      <div
-        className="ol-cm-toolbar-button-group ol-cm-toolbar-end"
-        ref={handleButtons}
-      >
-        <ToggleSearchButton state={state} />
-        <SwitchToPDFButton />
-        <DetacherSynctexControl />
-        <DetachCompileButtonWrapper />
+          <div className="ol-cm-toolbar-button-group ol-cm-toolbar-stretch">
+            {showActions && (
+              <ToolbarOverflow
+                overflowed={overflowed}
+                overflowOpen={overflowOpen}
+                setOverflowOpen={setOverflowOpen}
+                overflowRef={overflowRef}
+              >
+                <ToolbarItems
+                  state={state}
+                  overflowed={overflowedItemsRef.current}
+                  languageName={languageName}
+                  visual={visual}
+                  listDepth={listDepth}
+                />
+              </ToolbarOverflow>
+            )}
+          </div>
+
+          <div
+            className="ol-cm-toolbar-button-group ol-cm-toolbar-end"
+            ref={handleButtons}
+          >
+            <ToggleSearchButton state={state} />
+            <SwitchToPDFButton />
+            <DetacherSynctexControl />
+            <DetachCompileButtonWrapper />
+          </div>
+        </div>
+        {newEditor && breadcrumbs && <Breadcrumbs />}
       </div>
-    </div>
+    </>
   )
 })
diff --git a/services/web/frontend/js/features/source-editor/components/codemirror-view.tsx b/services/web/frontend/js/features/source-editor/components/codemirror-view.tsx
index c369aa63a1..4968e10367 100644
--- a/services/web/frontend/js/features/source-editor/components/codemirror-view.tsx
+++ b/services/web/frontend/js/features/source-editor/components/codemirror-view.tsx
@@ -1,16 +1,16 @@
 import { memo, useCallback, useEffect } from 'react'
 import { useCodeMirrorViewContext } from './codemirror-context'
 import useCodeMirrorScope from '../hooks/use-codemirror-scope'
-import useScopeValueSetterOnly from '@/shared/hooks/use-scope-value-setter-only'
+import { useEditorViewContext } from '@/features/ide-react/context/editor-view-context'
 
 function CodeMirrorView() {
   const view = useCodeMirrorViewContext()
 
-  const [, setView] = useScopeValueSetterOnly('editor.view')
+  const { setView } = useEditorViewContext()
 
   // append the editor view dom to the container node when mounted
   const containerRef = useCallback(
-    node => {
+    (node: HTMLDivElement) => {
       if (node) {
         node.appendChild(view.dom)
       }
@@ -25,7 +25,8 @@ function CodeMirrorView() {
     }
   }, [view])
 
-  // add the editor view to the scope value store, so it can be accessed by external extensions
+  // Add the CodeMirror view to the editor view context so that it can be
+  // accessed outside the editor component
   useEffect(() => {
     setView(view)
   }, [setView, view])
diff --git a/services/web/frontend/js/features/source-editor/components/command-tooltip/href-tooltip.tsx b/services/web/frontend/js/features/source-editor/components/command-tooltip/href-tooltip.tsx
index 0e157c3a64..0a9cab34ea 100644
--- a/services/web/frontend/js/features/source-editor/components/command-tooltip/href-tooltip.tsx
+++ b/services/web/frontend/js/features/source-editor/components/command-tooltip/href-tooltip.tsx
@@ -1,4 +1,4 @@
-import { FC, useCallback, useEffect, useRef, useState } from 'react'
+import { FC, FormEvent, useCallback, useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import {
   useCodeMirrorStateContext,
@@ -71,7 +71,7 @@ export const HrefTooltipContent: FC = () => {
   }, [view])
 
   const handleSubmit = useCallback(
-    event => {
+    (event: FormEvent) => {
       event.preventDefault()
       view.dispatch(closeCommandTooltip())
       view.focus()
diff --git a/services/web/frontend/js/features/source-editor/components/editor-switch-beginner-tooltip.tsx b/services/web/frontend/js/features/source-editor/components/editor-switch-beginner-tooltip.tsx
deleted file mode 100644
index 02da586eef..0000000000
--- a/services/web/frontend/js/features/source-editor/components/editor-switch-beginner-tooltip.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import { ReactElement, useCallback, useEffect, useRef, useState } from 'react'
-import Tooltip from '../../../shared/components/tooltip'
-import Close from '@/shared/components/close'
-import { useEditorContext } from '@/shared/context/editor-context'
-import useTutorial from '@/shared/hooks/promotions/use-tutorial'
-import { useUserContext } from '@/shared/context/user-context'
-import useScopeValue from '@/shared/hooks/use-scope-value'
-import { useTranslation } from 'react-i18next'
-import getMeta from '@/utils/meta'
-
-const CODE_EDITOR_TOOLTIP_TIMEOUT = 1000
-export const codeEditorModePrompt = 'code-editor-mode-prompt'
-
-export const EditorSwitchBeginnerTooltip = ({
-  children,
-}: {
-  children: ReactElement
-}) => {
-  const toolbarRef = useRef<any>(null)
-  const user = useUserContext()
-  const { inactiveTutorials } = useEditorContext()
-  const { t } = useTranslation()
-  const [codeEditorOpened] = useScopeValue('editor.codeEditorOpened')
-  const { completeTutorial } = useTutorial(codeEditorModePrompt, {
-    location: 'logs',
-    name: codeEditorModePrompt,
-  })
-  const [tooltipShown, setTooltipShown] = useState(false)
-
-  const shouldShowCodeEditorTooltip = useCallback(() => {
-    if (inactiveTutorials.includes(codeEditorModePrompt)) {
-      return false
-    }
-
-    if (getMeta('ol-usedLatex') !== 'never') {
-      // only show tooltip to the users that never used LaTeX (submitted in onboarding data collection)
-      return false
-    }
-
-    if (codeEditorOpened) {
-      // dont show tooltip if code editor was opened at some point
-      return false
-    }
-
-    const msSinceSignedUp =
-      user.signUpDate && Date.now() - new Date(user.signUpDate).getTime()
-
-    if (msSinceSignedUp && msSinceSignedUp < 24 * 60 * 60 * 1000) {
-      // dont show tooltip if user has signed up is less than 24 hours
-      return false
-    }
-
-    return true
-  }, [codeEditorOpened, inactiveTutorials, user.signUpDate])
-
-  const showCodeEditorTooltip = useCallback(() => {
-    if (toolbarRef.current && 'show' in toolbarRef.current) {
-      toolbarRef.current.show()
-      setTooltipShown(true)
-    }
-  }, [])
-
-  const hideCodeEditorTooltip = useCallback(() => {
-    if (toolbarRef.current && 'hide' in toolbarRef.current) {
-      toolbarRef.current.hide()
-      setTooltipShown(false)
-    }
-  }, [])
-
-  useEffect(() => {
-    if (tooltipShown && codeEditorOpened) {
-      hideCodeEditorTooltip()
-    }
-  }, [codeEditorOpened, hideCodeEditorTooltip, tooltipShown])
-
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      if (shouldShowCodeEditorTooltip()) {
-        showCodeEditorTooltip()
-      }
-    }, CODE_EDITOR_TOOLTIP_TIMEOUT)
-
-    return () => clearTimeout(timeout)
-  }, [showCodeEditorTooltip, shouldShowCodeEditorTooltip])
-
-  return (
-    <Tooltip
-      id="editor-switch-tooltip"
-      description={
-        <div>
-          <Close
-            variant="dark"
-            onDismiss={() => {
-              hideCodeEditorTooltip()
-              completeTutorial({ event: 'promo-click', action: 'complete' })
-            }}
-          />
-          <div className="tooltip-title">{t('code_editor_tooltip_title')}</div>
-          <div>{t('code_editor_tooltip_message')}</div>
-        </div>
-      }
-      tooltipProps={{
-        className: 'editor-switch-tooltip',
-      }}
-      overlayProps={{
-        ref: toolbarRef,
-        placement: 'bottom',
-        shouldUpdatePosition: true,
-        // @ts-ignore
-        // trigger: null is used to prevent the tooltip from showing on hover
-        // but it is not allowed in the type definition
-        trigger: null,
-      }}
-    >
-      {children}
-    </Tooltip>
-  )
-}
diff --git a/services/web/frontend/js/features/source-editor/components/editor-switch.tsx b/services/web/frontend/js/features/source-editor/components/editor-switch.tsx
index bdeecfad79..5890b6c04e 100644
--- a/services/web/frontend/js/features/source-editor/components/editor-switch.tsx
+++ b/services/web/frontend/js/features/source-editor/components/editor-switch.tsx
@@ -1,38 +1,26 @@
 import { ChangeEvent, FC, memo, useCallback } from 'react'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import useTutorial from '@/shared/hooks/promotions/use-tutorial'
 import { sendMB } from '../../../infrastructure/event-tracking'
 import { isValidTeXFile } from '../../../main/is-valid-tex-file'
 import { useTranslation } from 'react-i18next'
-import {
-  EditorSwitchBeginnerTooltip,
-  codeEditorModePrompt,
-} from './editor-switch-beginner-tooltip'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
 function EditorSwitch() {
   const { t } = useTranslation()
-  const [visual, setVisual] = useScopeValue('editor.showVisual')
-  const [codeEditorOpened] = useScopeValue('editor.codeEditorOpened')
-  const { openDocName } = useEditorManagerContext()
+  const { showVisual: visual, setShowVisual: setVisual } =
+    useEditorPropertiesContext()
+  const { openDocName } = useEditorOpenDocContext()
 
   const richTextAvailable = openDocName ? isValidTeXFile(openDocName) : false
-  const { completeTutorial } = useTutorial(codeEditorModePrompt, {
-    location: 'logs',
-    name: codeEditorModePrompt,
-  })
 
   const handleChange = useCallback(
-    event => {
+    (event: ChangeEvent<HTMLInputElement>) => {
       const editorType = event.target.value
 
       switch (editorType) {
         case 'cm6':
           setVisual(false)
-          if (!codeEditorOpened) {
-            completeTutorial({ event: 'promo-click', action: 'complete' })
-          }
           break
 
         case 'rich-text':
@@ -42,7 +30,7 @@ function EditorSwitch() {
 
       sendMB('editor-switch-change', { editorType })
     },
-    [codeEditorOpened, completeTutorial, setVisual]
+    [setVisual]
   )
 
   return (
@@ -51,7 +39,7 @@ function EditorSwitch() {
       aria-label={t('toolbar_code_visual_editor_switch')}
     >
       <fieldset className="toggle-switch">
-        <legend className="sr-only">Editor mode.</legend>
+        <legend className="visually-hidden">Editor mode.</legend>
 
         <input
           type="radio"
@@ -62,11 +50,9 @@ function EditorSwitch() {
           checked={!richTextAvailable || !visual}
           onChange={handleChange}
         />
-        <EditorSwitchBeginnerTooltip>
-          <label htmlFor="editor-switch-cm6" className="toggle-switch-label">
-            <span>{t('code_editor')}</span>
-          </label>
-        </EditorSwitchBeginnerTooltip>
+        <label htmlFor="editor-switch-cm6" className="toggle-switch-label">
+          <span>{t('code_editor')}</span>
+        </label>
 
         <RichTextToggle
           checked={richTextAvailable && visual}
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-context.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-context.tsx
index db4bce4c90..dce0beabe4 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-context.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-context.tsx
@@ -80,7 +80,9 @@ const FigureModalExistingFigureContext = createContext<
   | undefined
 >(undefined)
 
-export const FigureModalProvider: FC = ({ children }) => {
+export const FigureModalProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [state, dispatch] = useReducer(reducer, {
     source: FigureModalSource.NONE,
     helpShown: false,
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-help.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-help.tsx
index e65e21b5ea..d5f8f0f1fe 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-help.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal-help.tsx
@@ -1,7 +1,10 @@
 import { FC } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 
-const LearnWikiLink: FC<{ article: string }> = ({ article, children }) => {
+const LearnWikiLink: FC<React.PropsWithChildren<{ article: string }>> = ({
+  article,
+  children,
+}) => {
   return <a href={`/learn/latex/${article}`}>{children}</a>
 }
 
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal.tsx
index 08494d1832..b392b7e627 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal.tsx
@@ -104,7 +104,8 @@ const FigureModalContent = () => {
   const hide = useCallback(() => {
     dispatch({ source: FigureModalSource.NONE })
     view.requestMeasure()
-    view.focus()
+    // Wait for the modal to close before focusing the editor
+    window.setTimeout(() => view.focus(), 0)
   }, [dispatch, view])
 
   useEventListener(
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-other-project-source.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-other-project-source.tsx
index 6ab6acb6a0..12c6ba0e7a 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-other-project-source.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-other-project-source.tsx
@@ -34,7 +34,7 @@ export const FigureModalOtherProjectSource: FC = () => {
   const { t } = useTranslation()
   const view = useCodeMirrorViewContext()
   const { dispatch } = useFigureModalContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const { loading: projectsLoading, data: projects, error } = useUserProjects()
   const [selectedProject, setSelectedProject] = useState<null | Project>(null)
   const { hasLinkedProjectFileFeature, hasLinkedProjectOutputFileFeature } =
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-upload-source.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-upload-source.tsx
index 94877fb233..b92398ef4b 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-upload-source.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-upload-source.tsx
@@ -34,7 +34,7 @@ export const FigureModalUploadFileSource: FC = () => {
   const { t } = useTranslation()
   const view = useCodeMirrorViewContext()
   const { dispatch, pastedImageData } = useFigureModalContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const { rootFile } = useCurrentProjectFolders()
   const [folder, setFolder] = useState<File | null>(null)
   const [nameDirty, setNameDirty] = useState<boolean>(false)
diff --git a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-url-source.tsx b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-url-source.tsx
index 2db449e172..c93ebd5c94 100644
--- a/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-url-source.tsx
+++ b/services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-url-source.tsx
@@ -46,7 +46,7 @@ export const FigureModalUrlSource: FC = () => {
   const [url, setUrl] = useState<string>('')
   const [nameDirty, setNameDirty] = useState<boolean>(false)
   const [name, setName] = useState<string>('')
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
   const { rootFile } = useCurrentProjectFolders()
   const [folder, setFolder] = useState<File>(rootFile)
 
diff --git a/services/web/frontend/js/features/source-editor/components/full-project-search-button.tsx b/services/web/frontend/js/features/source-editor/components/full-project-search-button.tsx
new file mode 100644
index 0000000000..be02fdbe3c
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/components/full-project-search-button.tsx
@@ -0,0 +1,173 @@
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { closeSearchPanel, SearchQuery } from '@codemirror/search'
+import { forwardRef, memo, Ref, useCallback, useEffect, useRef } from 'react'
+import { useCodeMirrorViewContext } from './codemirror-context'
+import MaterialIcon from '@/shared/components/material-icon'
+import { useTranslation } from 'react-i18next'
+import { Overlay, Popover } from 'react-bootstrap'
+import Close from '@/shared/components/close'
+import useTutorial from '@/shared/hooks/promotions/use-tutorial'
+import { useEditorContext } from '@/shared/context/editor-context'
+import getMeta from '@/utils/meta'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useRailContext } from '@/features/ide-redesign/contexts/rail-context'
+
+const PROMOTION_SIGNUP_CUT_OFF_DATE = new Date('2025-04-22T00:00:00Z')
+
+export const FullProjectSearchButton = ({ query }: { query: SearchQuery }) => {
+  const view = useCodeMirrorViewContext()
+  const { t } = useTranslation()
+  const { setProjectSearchIsOpen } = useLayoutContext()
+  const newEditor = useIsNewEditorEnabled()
+  const { openTab } = useRailContext()
+  const ref = useRef<HTMLButtonElement>(null)
+
+  const { inactiveTutorials } = useEditorContext()
+
+  const hasCompletedTutorial = inactiveTutorials.includes(
+    'full-project-search-promo'
+  )
+
+  const { showPopup, tryShowingPopup, hideUntilReload, completeTutorial } =
+    useTutorial('full-project-search-promo', {
+      name: 'full-project-search-promotion',
+    })
+
+  let isEligibleForPromotion = true
+  const signUpDateString = getMeta('ol-user')?.signUpDate
+  if (!signUpDateString) {
+    isEligibleForPromotion = false
+  } else {
+    const signupDate = new Date(signUpDateString)
+    if (signupDate > PROMOTION_SIGNUP_CUT_OFF_DATE) {
+      isEligibleForPromotion = false
+    }
+  }
+
+  const openFullProjectSearch = useCallback(() => {
+    if (newEditor) {
+      openTab('full-project-search')
+    } else {
+      setProjectSearchIsOpen(true)
+    }
+    closeSearchPanel(view)
+    window.setTimeout(() => {
+      window.dispatchEvent(
+        new CustomEvent('editor:full-project-search', { detail: query })
+      )
+    }, 200)
+  }, [setProjectSearchIsOpen, query, view, newEditor, openTab])
+
+  const onClick = useCallback(() => {
+    sendSearchEvent('search-open', {
+      searchType: 'full-project',
+      method: 'button',
+      location: 'search-form',
+    })
+    openFullProjectSearch()
+    if (!hasCompletedTutorial && isEligibleForPromotion) {
+      completeTutorial({ action: 'complete', event: 'promo-click' })
+    }
+  }, [
+    completeTutorial,
+    openFullProjectSearch,
+    hasCompletedTutorial,
+    isEligibleForPromotion,
+  ])
+
+  return (
+    <>
+      <OLTooltip
+        id="open-full-project-search"
+        overlayProps={{ placement: 'bottom' }}
+        description={t('search_all_project_files')}
+      >
+        <OLButton variant="secondary" size="sm" ref={ref} onClick={onClick}>
+          <MaterialIcon
+            type="manage_search"
+            accessibilityLabel={t('search_all_project_files')}
+          />
+        </OLButton>
+      </OLTooltip>
+      {!hasCompletedTutorial && isEligibleForPromotion && (
+        <PromotionOverlay
+          ref={ref}
+          showPopup={showPopup}
+          tryShowingPopup={tryShowingPopup}
+          completeTutorial={completeTutorial}
+          hideUntilReload={hideUntilReload}
+        />
+      )}
+    </>
+  )
+}
+
+type PromotionOverlayProps = {
+  showPopup: boolean
+  tryShowingPopup: () => void
+  completeTutorial: (event: {
+    action: 'complete'
+    event: 'promo-dismiss'
+  }) => void
+  hideUntilReload: () => void
+}
+
+const PromotionOverlay = forwardRef<HTMLButtonElement, PromotionOverlayProps>(
+  function PromotionOverlay(
+    props: PromotionOverlayProps,
+    ref: Ref<HTMLButtonElement>
+  ) {
+    if (typeof ref === 'function' || !ref?.current) {
+      return null
+    }
+
+    return <PromotionContent target={ref.current} {...props} />
+  }
+)
+
+const PromotionContent = memo(function PromotionContent({
+  showPopup,
+  tryShowingPopup,
+  completeTutorial,
+  hideUntilReload,
+  target,
+}: PromotionOverlayProps & {
+  target: HTMLButtonElement
+}) {
+  const { t } = useTranslation()
+
+  useEffect(() => {
+    tryShowingPopup()
+  }, [tryShowingPopup])
+
+  const onHide = useCallback(() => {
+    hideUntilReload()
+  }, [hideUntilReload])
+
+  const onClose = useCallback(() => {
+    completeTutorial({
+      action: 'complete',
+      event: 'promo-dismiss',
+    })
+  }, [completeTutorial])
+
+  return (
+    <Overlay
+      placement="top"
+      show={showPopup}
+      target={target}
+      rootClose
+      onHide={onHide}
+    >
+      <Popover>
+        <Popover.Body>
+          <Close variant="dark" onDismiss={onClose} />
+          {t('now_you_can_search_your_whole_project_not_just_this_file')}
+        </Popover.Body>
+      </Popover>
+    </Overlay>
+  )
+})
diff --git a/services/web/frontend/js/features/source-editor/components/math-preview-tooltip.tsx b/services/web/frontend/js/features/source-editor/components/math-preview-tooltip.tsx
index 4e2a200f44..cfa88d292d 100644
--- a/services/web/frontend/js/features/source-editor/components/math-preview-tooltip.tsx
+++ b/services/web/frontend/js/features/source-editor/components/math-preview-tooltip.tsx
@@ -13,7 +13,7 @@ import OLModal, {
 } from '@/features/ui/components/ol/ol-modal'
 import MaterialIcon from '@/shared/components/material-icon'
 import useEventListener from '@/shared/hooks/use-event-listener'
-import { FC, useCallback, useLayoutEffect, useRef, useState } from 'react'
+import { FC, useCallback, useState } from 'react'
 import { Trans, useTranslation } from 'react-i18next'
 import {
   useCodeMirrorStateContext,
@@ -23,6 +23,7 @@ import { mathPreviewStateField } from '../extensions/math-preview'
 import { getTooltip } from '@codemirror/view'
 import ReactDOM from 'react-dom'
 import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
 
 const MathPreviewTooltipContainer: FC = () => {
   const state = useCodeMirrorStateContext()
@@ -34,9 +35,9 @@ const MathPreviewTooltipContainer: FC = () => {
     return null
   }
 
-  const { tooltip, mathContent } = mathPreviewState
+  const { tooltip } = mathPreviewState
 
-  if (!tooltip || !mathContent) {
+  if (!tooltip) {
     return null
   }
 
@@ -46,17 +47,20 @@ const MathPreviewTooltipContainer: FC = () => {
     return null
   }
 
-  return ReactDOM.createPortal(
-    <MathPreviewTooltip mathContent={mathContent} />,
-    tooltipView.dom
-  )
+  const inner = tooltipView.dom.querySelector('#ol-cm-math-tooltip')
+
+  if (!inner) {
+    return null
+  }
+
+  return ReactDOM.createPortal(<MathPreviewTooltipMenu />, inner)
 }
 
-const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
-  mathContent,
-}) => {
+const MathPreviewTooltipMenu: FC = () => {
   const { t } = useTranslation()
 
+  const newEditor = useIsNewEditorEnabled()
+
   const [showDisableModal, setShowDisableModal] = useState(false)
   const { setMathPreview } = useProjectSettingsContext()
   const openDisableModal = useCallback(() => setShowDisableModal(true), [])
@@ -66,8 +70,6 @@ const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
     window.dispatchEvent(new Event('editor:hideMathTooltip'))
   }, [])
 
-  const mathRef = useRef<HTMLSpanElement>(null)
-
   const keyDownListener = useCallback(
     (event: KeyboardEvent) => {
       if (event.key === 'Escape') {
@@ -79,50 +81,40 @@ const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
 
   useEventListener('keydown', keyDownListener)
 
-  useLayoutEffect(() => {
-    if (mathRef.current) {
-      mathRef.current.replaceChildren(mathContent)
-    }
-  }, [mathContent])
-
   return (
     <>
-      <div className="ol-cm-math-tooltip">
-        <span ref={mathRef} />
-
-        <Dropdown align="end">
-          <DropdownToggle
-            id="some-id"
-            className="math-tooltip-options-toggle"
-            variant="secondary"
-            size="sm"
+      <Dropdown align="end">
+        <DropdownToggle
+          id="some-id"
+          className="math-tooltip-options-toggle"
+          variant="secondary"
+          size="sm"
+        >
+          <MaterialIcon
+            type="more_vert"
+            accessibilityLabel={t('more_options')}
+          />
+        </DropdownToggle>
+        <DropdownMenu flip={false}>
+          <OLDropdownMenuItem
+            onClick={onHide}
+            description={t('temporarily_hides_the_preview')}
+            trailingIcon={
+              <span className="math-tooltip-options-keyboard-shortcut">
+                Esc
+              </span>
+            }
           >
-            <MaterialIcon
-              type="more_vert"
-              accessibilityLabel={t('more_options')}
-            />
-          </DropdownToggle>
-          <DropdownMenu flip={false}>
-            <OLDropdownMenuItem
-              onClick={onHide}
-              description={t('temporarily_hides_the_preview')}
-              trailingIcon={
-                <span className="math-tooltip-options-keyboard-shortcut">
-                  Esc
-                </span>
-              }
-            >
-              {t('hide')}
-            </OLDropdownMenuItem>
-            <OLDropdownMenuItem
-              onClick={openDisableModal}
-              description={t('permanently_disables_the_preview')}
-            >
-              {t('disable')}
-            </OLDropdownMenuItem>
-          </DropdownMenu>
-        </Dropdown>
-      </div>
+            {t('hide')}
+          </OLDropdownMenuItem>
+          <OLDropdownMenuItem
+            onClick={openDisableModal}
+            description={t('permanently_disables_the_preview')}
+          >
+            {t('disable')}
+          </OLDropdownMenuItem>
+        </DropdownMenu>
+      </Dropdown>
 
       {showDisableModal && (
         <OLModal show onHide={closeDisableModal}>
@@ -133,10 +125,17 @@ const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
           <OLModalBody>
             {t('disable_equation_preview_confirm')}
             <br />
-            <Trans
-              i18nKey="disable_equation_preview_enable"
-              components={{ b: <strong /> }}
-            />
+            {newEditor ? (
+              <Trans
+                i18nKey="disable_equation_preview_enable_in_settings"
+                components={{ b: <strong /> }}
+              />
+            ) : (
+              <Trans
+                i18nKey="disable_equation_preview_enable"
+                components={{ b: <strong /> }}
+              />
+            )}
           </OLModalBody>
 
           <OLModalFooter>
diff --git a/services/web/frontend/js/features/source-editor/components/paste-html/pasted-content-menu.tsx b/services/web/frontend/js/features/source-editor/components/paste-html/pasted-content-menu.tsx
index 7fed825d33..11ed441e33 100644
--- a/services/web/frontend/js/features/source-editor/components/paste-html/pasted-content-menu.tsx
+++ b/services/web/frontend/js/features/source-editor/components/paste-html/pasted-content-menu.tsx
@@ -7,7 +7,6 @@ import {
   useRef,
   useState,
 } from 'react'
-import Icon from '../../../../shared/components/icon'
 import { useTranslation } from 'react-i18next'
 import { EditorView } from '@codemirror/view'
 import { PastedContent } from '../../extensions/visual/pasted-content'
@@ -135,7 +134,7 @@ export const PastedContentMenu: FC<{
                 }}
               >
                 <span style={{ visibility: formatted ? 'visible' : 'hidden' }}>
-                  <Icon type="check" fw />
+                  <MaterialIcon type="check" />
                 </span>
                 <span className="ol-cm-pasted-content-menu-item-label">
                   {t('paste_with_formatting')}
@@ -155,7 +154,7 @@ export const PastedContentMenu: FC<{
                 }}
               >
                 <span style={{ visibility: formatted ? 'hidden' : 'visible' }}>
-                  <Icon type="check" fw />
+                  <MaterialIcon type="check" />
                 </span>
                 <span className="ol-cm-pasted-content-menu-item-label">
                   {t('paste_without_formatting')}
diff --git a/services/web/frontend/js/features/source-editor/components/source-editor.tsx b/services/web/frontend/js/features/source-editor/components/source-editor.tsx
index d71f896687..ca3e8123a8 100644
--- a/services/web/frontend/js/features/source-editor/components/source-editor.tsx
+++ b/services/web/frontend/js/features/source-editor/components/source-editor.tsx
@@ -16,4 +16,6 @@ function SourceEditor() {
   )
 }
 
-export default withErrorBoundary(memo(SourceEditor), ErrorBoundaryFallback)
+export default withErrorBoundary(memo(SourceEditor), () => (
+  <ErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/cell.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/cell.tsx
index cf705240bd..3e4484c6ae 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/cell.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/cell.tsx
@@ -176,8 +176,8 @@ export const Cell: FC<{
   }, [cellData.content, editing, view])
 
   const onInput = useCallback(
-    e => {
-      update(filterInput(e.target.value))
+    (e: React.FormEvent<HTMLTextAreaElement>) => {
+      update(filterInput((e.target as HTMLTextAreaElement).value))
     },
     [update, filterInput]
   )
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/editing-context.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/editing-context.tsx
index 24b8688f20..01696a9f3c 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/editing-context.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/editing-context.tsx
@@ -38,7 +38,9 @@ export const useEditingContext = () => {
   return context
 }
 
-export const EditingContextProvider: FC = ({ children }) => {
+export const EditingContextProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { table } = useTableContext()
   const [cellData, setCellData] = useState<EditingContextData | null>(null)
   const [initialContent, setInitialContent] = useState<string | undefined>(
@@ -85,7 +87,7 @@ export const EditingContextProvider: FC = ({ children }) => {
   }, [setCellData])
 
   const startEditing = useCallback(
-    (rowIndex: number, cellIndex: number, initialContent = undefined) => {
+    (rowIndex: number, cellIndex: number, initialContent?: string) => {
       if (cellData?.dirty) {
         // We're already editing something else
         commitCellData()
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/selection-context.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/selection-context.tsx
index b7854dc2de..7010eef144 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/selection-context.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/selection-context.tsx
@@ -411,7 +411,9 @@ export const useSelectionContext = () => {
   return context
 }
 
-export const SelectionContextProvider: FC = ({ children }) => {
+export const SelectionContextProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [selection, setSelection] = useState<TableSelection | null>(null)
   const [dragging, setDragging] = useState(false)
   return (
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/table-context.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/table-context.tsx
index 6b0557afb7..43fe869a2f 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/table-context.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/table-context.tsx
@@ -34,13 +34,15 @@ const TableContext = createContext<
   | undefined
 >(undefined)
 
-export const TableProvider: FC<{
-  tableData: ParsedTableData
-  tableNode: SyntaxNode | null
-  tabularNode: SyntaxNode
-  view: EditorView
-  directTableChild?: boolean
-}> = ({
+export const TableProvider: FC<
+  React.PropsWithChildren<{
+    tableData: ParsedTableData
+    tableNode: SyntaxNode | null
+    tabularNode: SyntaxNode
+    view: EditorView
+    directTableChild?: boolean
+  }>
+> = ({
   tableData,
   children,
   tableNode,
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/tabular-context.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/tabular-context.tsx
index be098d0a68..e9328f0504 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/contexts/tabular-context.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/contexts/tabular-context.tsx
@@ -21,7 +21,7 @@ const TabularContext = createContext<
   | undefined
 >(undefined)
 
-export const TabularProvider: FC = ({ children }) => {
+export const TabularProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const ref = useRef<HTMLDivElement>(null)
   const [helpShown, setHelpShown] = useState(false)
   const [columnWidthModalShown, setColumnWidthModalShown] = useState(false)
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/tabular.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/tabular.tsx
index c012cda12e..50f15d71b8 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/tabular.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/tabular.tsx
@@ -139,6 +139,33 @@ export class TableData {
     if (this.rows.length === 0 || this.columns.length === 0) {
       return null
     }
+    const hasTopRule = this.rows[0].borderTop === 1
+    const hasMidRule =
+      this.rows[1]?.borderTop === 1 &&
+      (this.rows.length === 2 || this.rows[1]?.borderBottom === 0)
+    const hasBottomRule =
+      this.rows[this.rows.length - 1].borderBottom === 1 &&
+      (this.rows.length === 2 ||
+        this.rows[this.rows.length - 1].borderTop === 0)
+
+    if (hasTopRule && hasMidRule && hasBottomRule) {
+      let isBooktabs = true
+      // Check for no other borders
+      for (const row of this.rows.slice(2, -1)) {
+        if (row.borderTop > 0 || row.borderBottom > 0) {
+          isBooktabs = false
+        }
+      }
+      for (const column of this.columns) {
+        if (column.borderLeft > 0 || column.borderRight > 0) {
+          isBooktabs = false
+        }
+      }
+      if (isBooktabs) {
+        return BorderTheme.BOOKTABS
+      }
+    }
+
     const lastRow = this.rows[this.rows.length - 1]
     const hasBottomBorder = lastRow.borderBottom > 0
     const firstColumn = this.columns[0]
@@ -180,8 +207,10 @@ export class TableData {
 
     if (hasAllRowBorders && hasAllColumnBorders) {
       return BorderTheme.FULLY_BORDERED
-    } else {
+    } else if (!hasAllRowBorders && !hasAllColumnBorders) {
       return BorderTheme.NO_BORDERS
+    } else {
+      return null
     }
   }
 }
@@ -273,7 +302,7 @@ export const Tabular: FC<{
   )
 }
 
-const TabularWrapper: FC = () => {
+const TabularWrapper: FC<React.PropsWithChildren> = () => {
   const { setSelection, selection } = useSelectionContext()
   const { commitCellData, cellData } = useEditingContext()
   const { ref } = useTabularContext()
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx
index cc56059182..d23031f7bd 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx
@@ -163,7 +163,10 @@ const ColumnWidthModalBody = () => {
                 <Select
                   label={
                     <>
-                      &nbsp;<span className="sr-only">{t('length_unit')}</span>
+                      &nbsp;
+                      <span className="visually-hidden">
+                        {t('length_unit')}
+                      </span>
                     </>
                   }
                   items={UNITS}
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/commands.ts b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/commands.ts
index 0d8798f275..ab58179586 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/commands.ts
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/commands.ts
@@ -20,8 +20,224 @@ import { WidthSelection } from './column-width-modal/column-width'
 export enum BorderTheme {
   NO_BORDERS = 0,
   FULLY_BORDERED = 1,
+  BOOKTABS = 2,
 }
 /* eslint-enable no-unused-vars */
+
+type ThemeGenerator = {
+  column: (
+    number: number,
+    numColumns: number
+  ) => { left: boolean; right: boolean }
+  row: (number: number, numRows: number) => string | false
+  lastRow?: () => string | false
+  multicolumn: () => { left: boolean; right: boolean }
+}
+
+const themeGenerators: Record<BorderTheme, ThemeGenerator> = {
+  [BorderTheme.NO_BORDERS]: {
+    column: () => ({ left: false, right: false }),
+    row: () => false,
+    multicolumn: () => ({ left: false, right: false }),
+  },
+  [BorderTheme.FULLY_BORDERED]: {
+    column: (number: number, numColumns: number) => ({
+      left: true,
+      right: number === numColumns - 1,
+    }),
+    row: () => '\\hline',
+    multicolumn: () => ({ left: true, right: true }),
+    lastRow: () => '\\hline',
+  },
+  [BorderTheme.BOOKTABS]: {
+    column: () => ({
+      left: false,
+      right: false,
+    }),
+    row: (number: number) => {
+      if (number === 0) {
+        return '\\toprule'
+      }
+      if (number === 1) {
+        return '\\midrule'
+      }
+      return false
+    },
+    lastRow: () => '\\bottomrule',
+    multicolumn: () => ({ left: false, right: false }),
+  },
+}
+
+function applyBorderTheme(
+  generator: ThemeGenerator,
+  view: EditorView,
+  table: TableData,
+  positions: Positions,
+  rowSeparators: RowSeparator[]
+): ChangeSpec[] {
+  const changes: ChangeSpec[] = []
+
+  // Update specification
+  const spec = view.state.sliceDoc(
+    positions.columnDeclarations.from,
+    positions.columnDeclarations.to
+  )
+  const columnSpecification = parseColumnSpecifications(spec)
+  columnSpecification.forEach((column, index) => {
+    const { left, right } = generator.column(index, columnSpecification.length)
+    column.borderLeft = left ? 1 : 0
+    column.borderRight = right ? 1 : 0
+  })
+  const newSpec = generateColumnSpecification(columnSpecification)
+  if (newSpec !== spec) {
+    changes.push({
+      from: positions.columnDeclarations.from,
+      to: positions.columnDeclarations.to,
+      insert: newSpec,
+    })
+  }
+
+  for (let i = 0; i < positions.rowPositions.length; i++) {
+    const row = positions.rowPositions[i]
+    const topBorder = generator.row(i, positions.rowPositions.length)
+    if (topBorder) {
+      let borderPresent = false
+      for (const hline of row.hlines) {
+        if (hline.from > rowSeparators[i]?.to) {
+          continue
+        }
+        if (borderPresent) {
+          // Remove extra border
+          changes.push({
+            from: hline.from,
+            to: hline.to,
+            insert: '',
+          })
+        } else {
+          const type = view.state.sliceDoc(hline.from, hline.to)
+          if (type.trim() !== topBorder) {
+            // Replace with the correct border
+            changes.push({
+              from: hline.from,
+              to: hline.to,
+              insert: topBorder,
+            })
+          }
+          borderPresent = true
+        }
+      }
+      if (!borderPresent) {
+        // Add the border
+        changes.push({
+          from: row.from,
+          to: row.from,
+          insert: topBorder,
+        })
+      }
+    } else {
+      for (const hline of row.hlines) {
+        if (hline.from > rowSeparators[i]?.to) {
+          continue
+        }
+        changes.push({
+          from: hline.from,
+          to: hline.to,
+          insert: '',
+        })
+      }
+    }
+  }
+
+  const lastRow = positions.rowPositions[positions.rowPositions.length - 1]
+  const lastRowBorder = generator.lastRow?.()
+  const hasLastRowSeparator =
+    positions.rowPositions.length === rowSeparators.length
+  if (hasLastRowSeparator) {
+    if (lastRowBorder) {
+      let borderPresent = false
+      for (const hline of lastRow.hlines) {
+        if (hline.from < rowSeparators[positions.rowPositions.length - 1].to) {
+          continue
+        }
+        if (borderPresent) {
+          // Remove extra border
+          changes.push({
+            from: hline.from,
+            to: hline.to,
+            insert: '',
+          })
+        } else {
+          const type = view.state.sliceDoc(hline.from, hline.to)
+          if (type.trim() !== lastRowBorder) {
+            // Replace with the correct border
+            changes.push({
+              from: hline.from,
+              to: hline.to,
+              insert: lastRowBorder,
+            })
+          }
+          borderPresent = true
+        }
+      }
+      if (!borderPresent) {
+        const rowSeparator = rowSeparators[positions.rowPositions.length - 1]
+
+        // Add the border
+        changes.push({
+          from: rowSeparator.to,
+          to: rowSeparator.to,
+          insert: ` ${lastRowBorder}`,
+        })
+      }
+    } else {
+      for (const hline of lastRow.hlines) {
+        if (hline.from < rowSeparators[positions.rowPositions.length - 1].to) {
+          continue
+        }
+        changes.push({
+          from: hline.from,
+          to: hline.to,
+          insert: '',
+        })
+      }
+    }
+  } else if (lastRowBorder) {
+    changes.push({
+      from: lastRow.to,
+      to: lastRow.to,
+      insert: `\\\\ ${lastRowBorder}`,
+    })
+  }
+
+  // Update multicolumn
+  for (const row of table.rows) {
+    for (const cell of row.cells) {
+      if (cell.multiColumn) {
+        const { left, right } = generator.multicolumn()
+        const spec = view.state.sliceDoc(
+          cell.multiColumn.columns.from,
+          cell.multiColumn.columns.to
+        )
+        const columnSpecification = parseColumnSpecifications(spec)
+        columnSpecification.forEach(column => {
+          column.borderLeft = left ? 1 : 0
+          column.borderRight = right ? 1 : 0
+        })
+        const newSpec = generateColumnSpecification(columnSpecification)
+        if (newSpec !== spec) {
+          changes.push({
+            from: cell.multiColumn.columns.from,
+            to: cell.multiColumn.columns.to,
+            insert: newSpec,
+          })
+        }
+      }
+    }
+  }
+
+  return changes
+}
+
 export const setBorders = (
   view: EditorView,
   theme: BorderTheme,
@@ -29,118 +245,18 @@ export const setBorders = (
   rowSeparators: RowSeparator[],
   table: TableData
 ) => {
-  const specification = view.state.sliceDoc(
-    positions.columnDeclarations.from,
-    positions.columnDeclarations.to
+  const generator = themeGenerators[theme]
+  const changes = applyBorderTheme(
+    generator,
+    view,
+    table,
+    positions,
+    rowSeparators
   )
-  if (theme === BorderTheme.NO_BORDERS) {
-    const removeColumnBorders = view.state.changes({
-      from: positions.columnDeclarations.from,
-      to: positions.columnDeclarations.to,
-      insert: specification.replace(/\|/g, ''),
-    })
-    const removeHlines: ChangeSpec[] = []
-    for (const row of positions.rowPositions) {
-      for (const hline of row.hlines) {
-        removeHlines.push({
-          from: hline.from,
-          to: hline.to,
-          insert: '',
-        })
-      }
-    }
-    const removeMulticolumnBorders: ChangeSpec[] = []
-    for (const row of table.rows) {
-      for (const cell of row.cells) {
-        if (cell.multiColumn) {
-          const specification = view.state.sliceDoc(
-            cell.multiColumn.columns.from,
-            cell.multiColumn.columns.to
-          )
-          removeMulticolumnBorders.push({
-            from: cell.multiColumn.columns.from,
-            to: cell.multiColumn.columns.to,
-            insert: specification.replace(/\|/g, ''),
-          })
-        }
-      }
-    }
-    view.dispatch({
-      changes: [
-        removeColumnBorders,
-        ...removeHlines,
-        ...removeMulticolumnBorders,
-      ],
-    })
-  } else if (theme === BorderTheme.FULLY_BORDERED) {
-    const newSpec = generateColumnSpecification(
-      addColumnBordersToSpecification(table.columns)
-    )
 
-    const insertColumns = view.state.changes({
-      from: positions.columnDeclarations.from,
-      to: positions.columnDeclarations.to,
-      insert: newSpec,
-    })
-
-    const insertHlines: ChangeSpec[] = []
-    for (const row of positions.rowPositions) {
-      if (row.hlines.length === 0) {
-        insertHlines.push(
-          view.state.changes({
-            from: row.from,
-            to: row.from,
-            insert: ' \\hline ',
-          })
-        )
-      }
-    }
-    const lastRow = positions.rowPositions[positions.rowPositions.length - 1]
-    if (lastRow.hlines.length < 2) {
-      let toInsert = ' \\hline'
-      if (rowSeparators.length < positions.rowPositions.length) {
-        // We need a trailing \\
-        toInsert = ` \\\\${toInsert}`
-      }
-      insertHlines.push(
-        view.state.changes({
-          from: lastRow.to,
-          to: lastRow.to,
-          insert: toInsert,
-        })
-      )
-    }
-    const addMulticolumnBorders: ChangeSpec[] = []
-    for (const row of table.rows) {
-      for (const cell of row.cells) {
-        if (cell.multiColumn) {
-          addMulticolumnBorders.push({
-            from: cell.multiColumn.columns.from,
-            to: cell.multiColumn.columns.to,
-            insert: generateColumnSpecification(
-              addColumnBordersToSpecification(
-                cell.multiColumn.columns.specification
-              )
-            ),
-          })
-        }
-      }
-    }
-
-    view.dispatch({
-      changes: [insertColumns, ...insertHlines, ...addMulticolumnBorders],
-    })
-  }
-}
-
-const addColumnBordersToSpecification = (specification: ColumnDefinition[]) => {
-  const newSpec = specification.map(column => ({
-    ...column,
-    borderLeft: 1,
-    borderRight: 0,
-  }))
-  newSpec[newSpec.length - 1].borderRight = 1
-  return newSpec
+  view.dispatch({
+    changes,
+  })
 }
 
 export const setAlignment = (
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button-menu.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button-menu.tsx
index f8bd056f58..d63ed7b706 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button-menu.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button-menu.tsx
@@ -7,13 +7,15 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import MaterialIcon from '../../../../../shared/components/material-icon'
 import { useTabularContext } from '../contexts/tabular-context'
 
-export const ToolbarButtonMenu: FC<{
-  id: string
-  label: string
-  icon: string
-  disabled?: boolean
-  disabledLabel?: string
-}> = memo(function ButtonMenu({
+export const ToolbarButtonMenu: FC<
+  React.PropsWithChildren<{
+    id: string
+    label: string
+    icon: string
+    disabled?: boolean
+    disabledLabel?: string
+  }>
+> = memo(function ButtonMenu({
   icon,
   id,
   label,
@@ -34,7 +36,7 @@ export const ToolbarButtonMenu: FC<{
         event.preventDefault()
         event.stopPropagation()
       }}
-      onClick={event => {
+      onClick={() => {
         onToggle(!open)
       }}
       disabled={disabled}
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button.tsx
index 6368da025b..e6d39f6054 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button.tsx
@@ -28,12 +28,12 @@ export const ToolbarButton = memo<{
   disabledLabel,
 }) {
   const view = useCodeMirrorViewContext()
-  const handleMouseDown = useCallback(event => {
+  const handleMouseDown = useCallback((event: React.MouseEvent) => {
     event.preventDefault()
   }, [])
 
   const handleClick = useCallback(
-    event => {
+    (event: React.MouseEvent) => {
       if (command) {
         emitTableGeneratorEvent(view, id)
         event.preventDefault()
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-dropdown.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-dropdown.tsx
index 6fab575472..bbb046a4f8 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-dropdown.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-dropdown.tsx
@@ -9,16 +9,18 @@ import { emitTableGeneratorEvent } from '../analytics'
 import { useCodeMirrorViewContext } from '../../codemirror-context'
 import classNames from 'classnames'
 
-export const ToolbarDropdown: FC<{
-  id: string
-  label?: string
-  btnClassName?: string
-  icon?: string
-  tooltip?: string
-  disabled?: boolean
-  disabledTooltip?: string
-  showCaret?: boolean
-}> = ({
+export const ToolbarDropdown: FC<
+  React.PropsWithChildren<{
+    id: string
+    label?: string
+    btnClassName?: string
+    icon?: string
+    tooltip?: string
+    disabled?: boolean
+    disabledTooltip?: string
+    showCaret?: boolean
+  }>
+> = ({
   id,
   label,
   children,
@@ -112,12 +114,14 @@ export const ToolbarDropdown: FC<{
 }
 
 export const ToolbarDropdownItem: FC<
-  Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> & {
-    command: () => void
-    id: string
-    icon?: string
-    active?: boolean
-  }
+  React.PropsWithChildren<
+    Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'> & {
+      command: () => void
+      id: string
+      icon?: string
+      active?: boolean
+    }
+  >
 > = ({ children, command, id, icon, active, ...props }) => {
   const view = useCodeMirrorViewContext()
   const onClick = useCallback(() => {
diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar.tsx
index 1e92398f6f..637764fd76 100644
--- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar.tsx
+++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar.tsx
@@ -3,7 +3,6 @@ import { useSelectionContext } from '../contexts/selection-context'
 import { ToolbarButton } from './toolbar-button'
 import { ToolbarButtonMenu } from './toolbar-button-menu'
 import { ToolbarDropdown, ToolbarDropdownItem } from './toolbar-dropdown'
-import MaterialIcon from '../../../../../shared/components/material-icon'
 import {
   BorderTheme,
   insertColumn,
@@ -47,6 +46,8 @@ export const Toolbar = memo(function Toolbar() {
         return t('all_borders')
       case BorderTheme.NO_BORDERS:
         return t('no_borders')
+      case BorderTheme.BOOKTABS:
+        return t('booktabs')
       default:
         return t('custom_borders')
     }
@@ -203,12 +204,22 @@ export const Toolbar = memo(function Toolbar() {
           >
             {t('no_borders')}
           </ToolbarDropdownItem>
-          <div className="table-generator-border-options-coming-soon">
-            <div className="info-icon">
-              <MaterialIcon type="info" />
-            </div>
-            {t('more_options_for_border_settings_coming_soon')}
-          </div>
+          <ToolbarDropdownItem
+            id="table-generator-borders-booktabs"
+            command={() => {
+              setBorders(
+                view,
+                BorderTheme.BOOKTABS,
+                positions,
+                rowSeparators,
+                table
+              )
+            }}
+            active={table.getBorderTheme() === BorderTheme.BOOKTABS}
+            icon="border_top"
+          >
+            {t('booktabs')}
+          </ToolbarDropdownItem>
         </ToolbarDropdown>
       </div>
       <div className="table-generator-button-group">
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/button-menu.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/button-menu.tsx
index 6f5bd52dbc..086ecc66e5 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/button-menu.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/button-menu.tsx
@@ -1,4 +1,4 @@
-import { FC, memo, useRef } from 'react'
+import { FC, memo, useEffect, useRef } from 'react'
 import useDropdown from '../../../../shared/hooks/use-dropdown'
 import OLListGroup from '@/features/ui/components/ol/ol-list-group'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
@@ -8,20 +8,36 @@ import { EditorView } from '@codemirror/view'
 import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
 import { useCodeMirrorViewContext } from '../codemirror-context'
 
-export const ToolbarButtonMenu: FC<{
-  id: string
-  label: string
-  icon: React.ReactNode
-  altCommand?: (view: EditorView) => void
-}> = memo(function ButtonMenu({ icon, id, label, altCommand, children }) {
+export const ToolbarButtonMenu: FC<
+  React.PropsWithChildren<{
+    id: string
+    label: string
+    icon: React.ReactNode
+    disablePopover?: boolean
+    altCommand?: (view: EditorView) => void
+  }>
+> = memo(function ButtonMenu({
+  icon,
+  id,
+  label,
+  altCommand,
+  disablePopover,
+  children,
+}) {
   const target = useRef<any>(null)
   const { open, onToggle, ref } = useDropdown()
   const view = useCodeMirrorViewContext()
 
+  useEffect(() => {
+    if (disablePopover && open) {
+      onToggle(false)
+    }
+  }, [open, disablePopover, onToggle])
+
   const button = (
     <button
       type="button"
-      className="ol-cm-toolbar-button btn"
+      className="ol-cm-toolbar-button"
       aria-label={label}
       onMouseDown={event => {
         event.preventDefault()
@@ -45,7 +61,7 @@ export const ToolbarButtonMenu: FC<{
 
   const overlay = (
     <OLOverlay
-      show={open}
+      show={open && !disablePopover}
       target={target.current}
       placement="bottom"
       container={view.dom}
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/math-dropdown.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/math-dropdown.tsx
index 0cead93358..748a04d7cb 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/math-dropdown.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/math-dropdown.tsx
@@ -1,25 +1,59 @@
+import { DropdownHeader } from '@/features/ui/components/bootstrap-5/dropdown-menu'
 import { ToolbarButtonMenu } from './button-menu'
 import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
 import MaterialIcon from '../../../../shared/components/material-icon'
 import { useTranslation } from 'react-i18next'
 import { useCodeMirrorViewContext } from '../codemirror-context'
+import { useEditorContext } from '@/shared/context/editor-context'
 import {
   wrapInDisplayMath,
   wrapInInlineMath,
 } from '../../extensions/toolbar/commands'
 import { memo } from 'react'
 import OLListGroupItem from '@/features/ui/components/ol/ol-list-group-item'
+import sparkleWhite from '@/shared/svgs/sparkle-small-white.svg'
+import sparkle from '@/shared/svgs/ai-sparkle-text.svg'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 
 export const MathDropdown = memo(function MathDropdown() {
   const { t } = useTranslation()
   const view = useCodeMirrorViewContext()
+  const { writefullInstance } = useEditorContext()
 
+  const wfRebrandEnabled = isSplitTestEnabled('overleaf-assist-bundle')
   return (
     <ToolbarButtonMenu
       id="toolbar-math"
       label={t('toolbar_insert_math')}
       icon={<MaterialIcon type="calculate" />}
     >
+      {wfRebrandEnabled && writefullInstance && (
+        <>
+          <DropdownHeader className="ol-cm-toolbar-header mx-2">
+            {t('toolbar_insert_math_lowercase')}
+          </DropdownHeader>
+          <OLListGroupItem
+            aria-label={t('toolbar_generate_math')}
+            onClick={() => {
+              writefullInstance?.openEquationGenerator()
+            }}
+          >
+            <img
+              alt="sparkle"
+              className="ol-cm-toolbar-ai-sparkle-gradient"
+              src={sparkle}
+              aria-hidden="true"
+            />
+            <img
+              alt="sparkle"
+              className="ol-cm-toolbar-ai-sparkle-white"
+              src={sparkleWhite}
+              aria-hidden="true"
+            />
+            <span>{t('generate_from_text_or_image')}</span>
+          </OLListGroupItem>
+        </>
+      )}
       <OLListGroupItem
         aria-label={t('toolbar_insert_inline_math')}
         onClick={event => {
@@ -30,7 +64,7 @@ export const MathDropdown = memo(function MathDropdown() {
         }}
       >
         <MaterialIcon type="123" />
-        <span>{t('toolbar_insert_inline_math')}</span>
+        <span>{t('inline')}</span>
       </OLListGroupItem>
       <OLListGroupItem
         aria-label={t('toolbar_insert_display_math')}
@@ -42,7 +76,7 @@ export const MathDropdown = memo(function MathDropdown() {
         }}
       >
         <MaterialIcon type="view_day" />
-        <span>{t('toolbar_insert_display_math')}</span>
+        <span>{t('display')}</span>
       </OLListGroupItem>
     </ToolbarButtonMenu>
   )
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/overflow.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/overflow.tsx
index 574780f761..b564505387 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/overflow.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/overflow.tsx
@@ -1,17 +1,22 @@
-import { FC, useRef } from 'react'
+import { FC, useCallback, useEffect, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
 import classnames from 'classnames'
 import MaterialIcon from '@/shared/components/material-icon'
 import { useCodeMirrorViewContext } from '../codemirror-context'
 import OLOverlay from '@/features/ui/components/ol/ol-overlay'
 import OLPopover from '@/features/ui/components/ol/ol-popover'
 
-export const ToolbarOverflow: FC<{
-  overflowed: boolean
-  overflowOpen: boolean
-  setOverflowOpen: (open: boolean) => void
-  overflowRef?: React.Ref<HTMLDivElement>
-}> = ({ overflowed, overflowOpen, setOverflowOpen, overflowRef, children }) => {
+export const ToolbarOverflow: FC<
+  React.PropsWithChildren<{
+    overflowed: boolean
+    overflowOpen: boolean
+    setOverflowOpen: (open: boolean) => void
+    overflowRef?: React.Ref<HTMLDivElement>
+  }>
+> = ({ overflowed, overflowOpen, setOverflowOpen, overflowRef, children }) => {
+  const { t } = useTranslation()
   const buttonRef = useRef<HTMLButtonElement>(null)
+  const keyboardInputRef = useRef(false)
   const view = useCodeMirrorViewContext()
 
   const className = classnames(
@@ -22,6 +27,46 @@ export const ToolbarOverflow: FC<{
     }
   )
 
+  // A11y - Move the focus inside the popover to the first toolbar button when it opens
+  const handlePopoverFocus = useCallback(() => {
+    if (keyboardInputRef.current) {
+      const firstToolbarItem = document.querySelector(
+        '#popover-toolbar-overflow .ol-cm-toolbar-overflow button:not([disabled])'
+      ) as HTMLButtonElement | null
+
+      if (firstToolbarItem) {
+        firstToolbarItem.focus()
+      }
+    }
+  }, [])
+
+  const handleKeyDown = useCallback(() => {
+    keyboardInputRef.current = true
+  }, [])
+
+  const handleMouseDown = useCallback(() => {
+    keyboardInputRef.current = false
+  }, [])
+
+  useEffect(() => {
+    document.addEventListener('keydown', handleKeyDown)
+    document.addEventListener('mousedown', handleMouseDown)
+
+    return () => {
+      document.removeEventListener('keydown', handleKeyDown)
+      document.removeEventListener('mousedown', handleMouseDown)
+    }
+  }, [handleKeyDown, handleMouseDown])
+
+  // A11y - Move the focus back to the trigger when the popover is dismissed
+  const handleCloseAndReturnFocus = useCallback(() => {
+    setOverflowOpen(false)
+
+    if (keyboardInputRef.current && buttonRef.current) {
+      buttonRef.current.focus()
+    }
+  }, [setOverflowOpen])
+
   return (
     <>
       <button
@@ -29,7 +74,9 @@ export const ToolbarOverflow: FC<{
         type="button"
         id="toolbar-more"
         className={className}
-        aria-label="More"
+        aria-label={t('more_editor_toolbar_item')}
+        aria-expanded={overflowOpen}
+        aria-controls="popover-toolbar-overflow"
         onMouseDown={event => {
           event.preventDefault()
           event.stopPropagation()
@@ -49,9 +96,14 @@ export const ToolbarOverflow: FC<{
         // containerPadding={0}
         transition
         rootClose
-        onHide={() => setOverflowOpen(false)}
+        onHide={handleCloseAndReturnFocus}
+        onEntered={handlePopoverFocus}
       >
-        <OLPopover id="popover-toolbar-overflow" ref={overflowRef}>
+        <OLPopover
+          id="popover-toolbar-overflow"
+          ref={overflowRef}
+          role="toolbar"
+        >
           <div className="ol-cm-toolbar-overflow">{children}</div>
         </OLPopover>
       </OLOverlay>
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/section-heading-dropdown.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/section-heading-dropdown.tsx
index 19c0bf8e52..18b6985549 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/section-heading-dropdown.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/section-heading-dropdown.tsx
@@ -13,7 +13,7 @@ import OLPopover from '@/features/ui/components/ol/ol-popover'
 import useEventListener from '../../../../shared/hooks/use-event-listener'
 import useDropdown from '../../../../shared/hooks/use-dropdown'
 import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
-import Icon from '../../../../shared/components/icon'
+import MaterialIcon from '@/shared/components/material-icon'
 import { useTranslation } from 'react-i18next'
 
 const levels = new Map([
@@ -66,7 +66,7 @@ export const SectionHeadingDropdown = () => {
         onClick={() => setOverflowOpen(!overflowOpen)}
       >
         <span>{currentLabel}</span>
-        <Icon type="caret-down" fw />
+        <MaterialIcon type="expand_more" />
       </button>
 
       {overflowOpen && (
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/table-dropdown.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/table-dropdown.tsx
new file mode 100644
index 0000000000..a191b63600
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/table-dropdown.tsx
@@ -0,0 +1,104 @@
+import { DropdownHeader } from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import { ToolbarButtonMenu } from './button-menu'
+import MaterialIcon from '../../../../shared/components/material-icon'
+import { useTranslation } from 'react-i18next'
+import { useEditorContext } from '@/shared/context/editor-context'
+import { memo, useRef, useCallback } from 'react'
+import OLListGroupItem from '@/features/ui/components/ol/ol-list-group-item'
+import sparkleWhite from '@/shared/svgs/sparkle-small-white.svg'
+import sparkle from '@/shared/svgs/ai-sparkle-text.svg'
+import { TableInserterDropdown } from './table-inserter-dropdown'
+import OLOverlay from '@/features/ui/components/ol/ol-overlay'
+import OLPopover from '@/features/ui/components/ol/ol-popover'
+import useDropdown from '../../../../shared/hooks/use-dropdown'
+import * as commands from '../../extensions/toolbar/commands'
+import { useCodeMirrorViewContext } from '../codemirror-context'
+import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
+
+export const TableDropdown = memo(function TableDropdown() {
+  const { t } = useTranslation()
+  const { writefullInstance } = useEditorContext()
+  const selectSizeDropdown = useDropdown()
+  const target = useRef<any>(null)
+  const view = useCodeMirrorViewContext()
+
+  const onSizeSelected = useCallback(
+    (sizeX: number, sizeY: number) => {
+      selectSizeDropdown.onToggle(false)
+      commands.insertTable(view, sizeX, sizeY)
+      emitToolbarEvent(view, 'table-generator-insert-table')
+      view.focus()
+    },
+    [selectSizeDropdown, view]
+  )
+
+  return (
+    <>
+      <div ref={target}>
+        <ToolbarButtonMenu
+          id="toolbar-table"
+          label={t('toolbar_insert_table')}
+          disablePopover={selectSizeDropdown.open}
+          icon={<MaterialIcon type="table_chart" />}
+        >
+          <DropdownHeader className="ol-cm-toolbar-header mx-2">
+            {t('toolbar_table_insert_table_lowercase')}
+          </DropdownHeader>
+          <OLListGroupItem
+            aria-label={t('toolbar_generate_table')}
+            onClick={() => {
+              writefullInstance?.openTableGenerator()
+            }}
+          >
+            <img
+              alt="sparkle"
+              className="ol-cm-toolbar-ai-sparkle-gradient"
+              src={sparkle}
+              aria-hidden="true"
+            />
+            <img
+              alt="sparkle"
+              className="ol-cm-toolbar-ai-sparkle-white"
+              src={sparkleWhite}
+              aria-hidden="true"
+            />
+            <span>{t('generate_from_text_or_image')}</span>
+          </OLListGroupItem>
+          <div className="ol-cm-toolbar-dropdown-divider mx-2 my-0" />
+          <OLListGroupItem
+            aria-label={t('toolbar_insert_table')}
+            onMouseDown={event => {
+              event.preventDefault()
+              event.stopPropagation()
+            }}
+            onClick={event => {
+              selectSizeDropdown.onToggle(!selectSizeDropdown.open)
+              // prevent click event from bubbling up to the toolbar overflow button causing it to close
+              event.stopPropagation()
+            }}
+          >
+            <span>{t('select_size')}</span>
+          </OLListGroupItem>
+        </ToolbarButtonMenu>
+        <OLOverlay
+          show={selectSizeDropdown.open}
+          target={target.current}
+          placement="bottom"
+          container={view.dom}
+          containerPadding={0}
+          transition
+          rootClose
+          onHide={() => selectSizeDropdown.onToggle(false)}
+        >
+          <OLPopover
+            id="toolbar-table-menu"
+            ref={selectSizeDropdown.ref}
+            className="ol-cm-toolbar-button-menu-popover ol-cm-toolbar-button-menu-popover-unstyled"
+          >
+            <TableInserterDropdown onSizeSelected={onSizeSelected} />
+          </OLPopover>
+        </OLOverlay>
+      </div>
+    </>
+  )
+})
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown-legacy.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown-legacy.tsx
new file mode 100644
index 0000000000..0756c2364d
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown-legacy.tsx
@@ -0,0 +1,128 @@
+import { FC, memo, useCallback, useRef, useState } from 'react'
+import * as commands from '../../extensions/toolbar/commands'
+import { useTranslation } from 'react-i18next'
+import useDropdown from '../../../../shared/hooks/use-dropdown'
+import { useCodeMirrorViewContext } from '../codemirror-context'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import OLOverlay from '@/features/ui/components/ol/ol-overlay'
+import OLPopover from '@/features/ui/components/ol/ol-popover'
+import MaterialIcon from '../../../../shared/components/material-icon'
+import classNames from 'classnames'
+import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
+
+export const LegacyTableDropdown = memo(() => {
+  const { t } = useTranslation()
+  const { open, onToggle, ref } = useDropdown()
+  const view = useCodeMirrorViewContext()
+  const target = useRef<any>(null)
+
+  const onSizeSelected = useCallback(
+    (sizeX: number, sizeY: number) => {
+      onToggle(false)
+      commands.insertTable(view, sizeX, sizeY)
+      emitToolbarEvent(view, 'table-generator-insert-table')
+      view.focus()
+    },
+    [view, onToggle]
+  )
+
+  return (
+    <>
+      <OLTooltip
+        hidden={open}
+        id="toolbar-table"
+        description={<div>{t('toolbar_insert_table')}</div>}
+        overlayProps={{ placement: 'bottom' }}
+      >
+        <button
+          type="button"
+          className="ol-cm-toolbar-button"
+          aria-label={t('toolbar_insert_table')}
+          onMouseDown={event => {
+            event.preventDefault()
+            event.stopPropagation()
+          }}
+          onClick={() => {
+            onToggle(!open)
+          }}
+          ref={target}
+        >
+          <MaterialIcon type="table_chart" />
+        </button>
+      </OLTooltip>
+      <OLOverlay
+        show={open}
+        target={target.current}
+        placement="bottom"
+        container={view.dom}
+        containerPadding={0}
+        transition
+        rootClose
+        onHide={() => onToggle(false)}
+      >
+        <OLPopover
+          id="toolbar-table-menu"
+          ref={ref}
+          className="ol-cm-toolbar-button-menu-popover ol-cm-toolbar-button-menu-popover-unstyled"
+        >
+          <div className="ol-cm-toolbar-table-grid-popover">
+            <SizeGrid sizeX={10} sizeY={10} onSizeSelected={onSizeSelected} />
+          </div>
+        </OLPopover>
+      </OLOverlay>
+    </>
+  )
+})
+LegacyTableDropdown.displayName = 'TableInserterDropdown'
+
+const range = (start: number, end: number) =>
+  Array.from({ length: end - start + 1 }, (v, k) => k + start)
+
+const SizeGrid: FC<{
+  sizeX: number
+  sizeY: number
+  onSizeSelected: (sizeX: number, sizeY: number) => void
+}> = ({ sizeX, sizeY, onSizeSelected }) => {
+  const [currentSize, setCurrentSize] = useState<{
+    sizeX: number
+    sizeY: number
+  }>({ sizeX: 0, sizeY: 0 })
+  const { t } = useTranslation()
+  let label = t('toolbar_table_insert_table_lowercase')
+  if (currentSize.sizeX > 0 && currentSize.sizeY > 0) {
+    label = t('toolbar_table_insert_size_table', {
+      size: `${currentSize.sizeY}×${currentSize.sizeX}`,
+    })
+  }
+  return (
+    <>
+      <div className="ol-cm-toolbar-table-size-label">{label}</div>
+      <table
+        className="ol-cm-toolbar-table-grid"
+        onMouseLeave={() => {
+          setCurrentSize({ sizeX: 0, sizeY: 0 })
+        }}
+      >
+        <tbody>
+          {range(1, sizeY).map(y => (
+            <tr key={y}>
+              {range(1, sizeX).map(x => (
+                // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+                <td
+                  className={classNames('ol-cm-toolbar-table-cell', {
+                    active: currentSize.sizeX >= x && currentSize.sizeY >= y,
+                  })}
+                  key={x}
+                  onMouseEnter={() => {
+                    setCurrentSize({ sizeX: x, sizeY: y })
+                  }}
+                  onMouseUp={() => onSizeSelected(x, y)}
+                />
+              ))}
+            </tr>
+          ))}
+        </tbody>
+      </table>
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown.tsx
index 1385f9ba98..f9f81d518a 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown.tsx
@@ -1,78 +1,18 @@
-import { FC, memo, useCallback, useRef, useState } from 'react'
-import * as commands from '../../extensions/toolbar/commands'
-import { useTranslation } from 'react-i18next'
-import useDropdown from '../../../../shared/hooks/use-dropdown'
-import { useCodeMirrorViewContext } from '../codemirror-context'
-import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import OLOverlay from '@/features/ui/components/ol/ol-overlay'
-import OLPopover from '@/features/ui/components/ol/ol-popover'
-import MaterialIcon from '../../../../shared/components/material-icon'
+import { FC, useState } from 'react'
 import classNames from 'classnames'
-import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
-
-export const TableInserterDropdown = memo(() => {
-  const { t } = useTranslation()
-  const { open, onToggle, ref } = useDropdown()
-  const view = useCodeMirrorViewContext()
-  const target = useRef<any>(null)
-
-  const onSizeSelected = useCallback(
-    (sizeX: number, sizeY: number) => {
-      onToggle(false)
-      commands.insertTable(view, sizeX, sizeY)
-      emitToolbarEvent(view, 'table-generator-insert-table')
-      view.focus()
-    },
-    [view, onToggle]
-  )
+import { useTranslation } from 'react-i18next'
 
+export const TableInserterDropdown = ({
+  onSizeSelected,
+}: {
+  onSizeSelected: (sizeX: number, sizeY: number) => void
+}) => {
   return (
-    <>
-      <OLTooltip
-        hidden={open}
-        id="toolbar-table"
-        description={<div>{t('toolbar_insert_table')}</div>}
-        overlayProps={{ placement: 'bottom' }}
-      >
-        <button
-          type="button"
-          className="ol-cm-toolbar-button btn"
-          aria-label={t('toolbar_insert_table')}
-          onMouseDown={event => {
-            event.preventDefault()
-            event.stopPropagation()
-          }}
-          onClick={() => {
-            onToggle(!open)
-          }}
-          ref={target}
-        >
-          <MaterialIcon type="table_chart" />
-        </button>
-      </OLTooltip>
-      <OLOverlay
-        show={open}
-        target={target.current}
-        placement="bottom"
-        container={view.dom}
-        containerPadding={0}
-        transition
-        rootClose
-        onHide={() => onToggle(false)}
-      >
-        <OLPopover
-          id="toolbar-table-menu"
-          ref={ref}
-          className="ol-cm-toolbar-button-menu-popover ol-cm-toolbar-button-menu-popover-unstyled"
-        >
-          <div className="ol-cm-toolbar-table-grid-popover">
-            <SizeGrid sizeX={10} sizeY={10} onSizeSelected={onSizeSelected} />
-          </div>
-        </OLPopover>
-      </OLOverlay>
-    </>
+    <div className="ol-cm-toolbar-table-grid-popover">
+      <SizeGrid sizeX={10} sizeY={10} onSizeSelected={onSizeSelected} />
+    </div>
   )
-})
+}
 TableInserterDropdown.displayName = 'TableInserterDropdown'
 
 const range = (start: number, end: number) =>
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-button.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-button.tsx
index cca40f1c7f..af939a7b8c 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-button.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-button.tsx
@@ -31,12 +31,12 @@ export const ToolbarButton = memo<{
 }) {
   const view = useCodeMirrorViewContext()
 
-  const handleMouseDown = useCallback(event => {
+  const handleMouseDown = useCallback((event: React.MouseEvent) => {
     event.preventDefault()
   }, [])
 
   const handleClick = useCallback(
-    event => {
+    (event: React.MouseEvent) => {
       emitToolbarEvent(view, id)
       if (command) {
         event.preventDefault()
diff --git a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
index b313bf6534..3404976d44 100644
--- a/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
+++ b/services/web/frontend/js/features/source-editor/components/toolbar/toolbar-items.tsx
@@ -9,9 +9,13 @@ import getMeta from '../../../../utils/meta'
 import { InsertFigureDropdown } from './insert-figure-dropdown'
 import { useTranslation } from 'react-i18next'
 import { MathDropdown } from './math-dropdown'
-import { TableInserterDropdown } from './table-inserter-dropdown'
+import { TableDropdown } from './table-dropdown'
+import { LegacyTableDropdown } from './table-inserter-dropdown-legacy'
 import { withinFormattingCommand } from '@/features/source-editor/utils/tree-operations/formatting'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 import { isMac } from '@/shared/utils/os'
+import { useProjectContext } from '@/shared/context/project-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
 export const ToolbarItems: FC<{
   state: EditorState
@@ -27,12 +31,17 @@ export const ToolbarItems: FC<{
   listDepth,
 }) {
   const { t } = useTranslation()
-  const { toggleSymbolPalette, showSymbolPalette } = useEditorContext()
+  const { showSymbolPalette, toggleSymbolPalette } =
+    useEditorPropertiesContext()
+  const { writefullInstance } = useEditorContext()
+  const { features } = useProjectContext()
   const isActive = withinFormattingCommand(state)
 
   const symbolPaletteAvailable = getMeta('ol-symbolPaletteAvailable')
   const showGroup = (group: string) => !overflowed || overflowed.has(group)
 
+  const wfRebrandEnabled = isSplitTestEnabled('overleaf-assist-bundle')
+
   return (
     <>
       {showGroup('group-history') && (
@@ -122,13 +131,15 @@ export const ToolbarItems: FC<{
                 command={commands.wrapInHref}
                 icon="add_link"
               />
-              <ToolbarButton
-                id="toolbar-add-comment"
-                label={t('add_comment')}
-                disabled={state.selection.main.empty}
-                command={commands.addComment}
-                icon="add_comment"
-              />
+              {features.trackChangesVisible && (
+                <ToolbarButton
+                  id="toolbar-add-comment"
+                  label={t('add_comment')}
+                  disabled={state.selection.main.empty}
+                  command={commands.addComment}
+                  icon="add_comment"
+                />
+              )}
               <ToolbarButton
                 id="toolbar-ref"
                 label={t('toolbar_insert_cross_reference')}
@@ -142,7 +153,11 @@ export const ToolbarItems: FC<{
                 icon="book_5"
               />
               <InsertFigureDropdown />
-              <TableInserterDropdown />
+              {wfRebrandEnabled && writefullInstance ? (
+                <TableDropdown />
+              ) : (
+                <LegacyTableDropdown />
+              )}
             </div>
           )}
           {showGroup('group-list') && (
diff --git a/services/web/frontend/js/features/source-editor/extensions/before-change-doc.ts b/services/web/frontend/js/features/source-editor/extensions/before-change-doc.ts
new file mode 100644
index 0000000000..324e27600f
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/extensions/before-change-doc.ts
@@ -0,0 +1,3 @@
+import { StateEffect } from '@codemirror/state'
+
+export const beforeChangeDocEffect = StateEffect.define()
diff --git a/services/web/frontend/js/features/source-editor/extensions/breadcrumbs-panel.ts b/services/web/frontend/js/features/source-editor/extensions/breadcrumbs-panel.ts
index 1207f1a54d..9572b16567 100644
--- a/services/web/frontend/js/features/source-editor/extensions/breadcrumbs-panel.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/breadcrumbs-panel.ts
@@ -1,15 +1,16 @@
-import { canUseNewEditor } from '@/features/ide-redesign/utils/new-editor-utils'
-import { Compartment, Extension, TransactionSpec } from '@codemirror/state'
-import { EditorView, showPanel } from '@codemirror/view'
-
-export function createBreadcrumbsPanel() {
-  const dom = document.createElement('div')
-  dom.classList.add('ol-cm-breadcrumbs-portal')
-  return { dom, top: true }
-}
+import { EditorView } from '@codemirror/view'
 
 const breadcrumbsTheme = EditorView.baseTheme({
+  '.ol-cm-breadcrumbs-portal': {
+    display: 'flex',
+    pointerEvents: 'none !important',
+    '& > *': {
+      pointerEvents: 'all',
+    },
+  },
   '.ol-cm-breadcrumbs': {
+    height: 'var(--breadcrumbs-height)',
+    flex: 1,
     display: 'flex',
     alignItems: 'center',
     gap: 'var(--spacing-01)',
@@ -21,41 +22,22 @@ const breadcrumbsTheme = EditorView.baseTheme({
       flexShrink: '0',
     },
   },
-  '&light .ol-cm-breadcrumbs': {
-    color: 'var(--content-secondary)',
-    backgroundColor: 'var(--bg-light-primary)',
-    borderBottom: '1px solid #ddd',
-  },
   '&light .ol-cm-breadcrumb-chevron': {
     color: 'var(--neutral-30)',
   },
-  '&dark .ol-cm-breadcrumbs': {
-    color: 'var(--content-secondary-dark)',
-    backgroundColor: 'var(--bg-dark-primary)',
-  },
   '&dark .ol-cm-breadcrumb-chevron': {
     color: 'var(--neutral-50)',
   },
 })
 
-const breadcrumbsConf = new Compartment()
-
-const breadcrumbsEnabled: Extension = [
-  showPanel.of(createBreadcrumbsPanel),
-  breadcrumbsTheme,
-]
-const breadcrumbsDisabled: Extension = []
-
-export const setBreadcrumbsEnabled = (enabled: boolean): TransactionSpec => ({
-  effects: breadcrumbsConf.reconfigure(
-    enabled ? breadcrumbsEnabled : breadcrumbsDisabled
-  ),
-})
-
 /**
  * A panel which contains the editor breadcrumbs
  */
-export const breadcrumbPanel = (enableNewEditor: boolean) => {
-  const enabled = canUseNewEditor() && enableNewEditor
-  return breadcrumbsConf.of(enabled ? breadcrumbsEnabled : breadcrumbsDisabled)
+export function breadcrumbPanel() {
+  return [
+    EditorView.editorAttributes.of({
+      style: '--breadcrumbs-height: 28px;',
+    }),
+    breadcrumbsTheme,
+  ]
 }
diff --git a/services/web/frontend/js/features/source-editor/extensions/bundle.ts b/services/web/frontend/js/features/source-editor/extensions/bundle.ts
index 1a57ba829b..a11839105d 100644
--- a/services/web/frontend/js/features/source-editor/extensions/bundle.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/bundle.ts
@@ -1,5 +1,6 @@
 import { syntaxTree } from '@codemirror/language'
 import {
+  ChangeSet,
   EditorSelection,
   Prec,
   StateEffect,
@@ -13,9 +14,16 @@ import {
   ViewPlugin,
   WidgetType,
 } from '@codemirror/view'
+import {
+  undo,
+  redo,
+  invertedEffects,
+  isolateHistory,
+} from '@codemirror/commands'
 import { CodeMirror, Vim, getCM } from '@replit/codemirror-vim'
 
 export default {
+  ChangeSet,
   Decoration,
   EditorSelection,
   EditorView,
@@ -27,6 +35,10 @@ export default {
   hoverTooltip,
   keymap,
   syntaxTree,
+  undo,
+  redo,
+  invertedEffects,
+  isolateHistory,
 }
 
 export const CodeMirrorVim = {
diff --git a/services/web/frontend/js/features/source-editor/extensions/cursor-highlights.ts b/services/web/frontend/js/features/source-editor/extensions/cursor-highlights.ts
index 78d2903825..3fef2b2771 100644
--- a/services/web/frontend/js/features/source-editor/extensions/cursor-highlights.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/cursor-highlights.ts
@@ -166,7 +166,7 @@ export const setCursorHighlights = (
 
 class CursorMarker extends RectangleMarker {
   constructor(
-    private highlight: Highlight,
+    public highlight: Highlight,
     className: string,
     left: number,
     top: number,
@@ -181,13 +181,25 @@ class CursorMarker extends RectangleMarker {
     element.style.setProperty('--hue', String(this.highlight.hue))
     return element
   }
+
+  update(element: HTMLDivElement, prev: CursorMarker) {
+    if (!super.update(element, prev)) {
+      return false
+    }
+    element.style.setProperty('--hue', String(this.highlight.hue))
+    return true
+  }
+
+  eq(other: CursorMarker) {
+    return super.eq(other) && this.highlight.hue === other.highlight.hue
+  }
 }
 
 // draw the collaborator cursors in a separate layer, so they don't affect word wrapping
 const cursorHighlightsLayer = layer({
   above: true,
   class: 'ol-cm-cursorHighlightsLayer',
-  update: (update, layer) => {
+  update: update => {
     return (
       update.docChanged ||
       update.selectionSet ||
diff --git a/services/web/frontend/js/features/source-editor/extensions/cursor-position.ts b/services/web/frontend/js/features/source-editor/extensions/cursor-position.ts
index efde64f40e..0cd69d8b1f 100644
--- a/services/web/frontend/js/features/source-editor/extensions/cursor-position.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/cursor-position.ts
@@ -42,7 +42,7 @@ export const cursorPosition = ({
     // Asynchronously dispatch cursor position when the selection changes and
     // provide a little debouncing. Using requestAnimationFrame postpones it
     // until the next CM6 DOM update.
-    ViewPlugin.define(view => {
+    ViewPlugin.define(() => {
       let animationFrameRequest: number | null = null
 
       return {
diff --git a/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts b/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts
index af31353a23..413317ec0a 100644
--- a/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts
@@ -71,7 +71,7 @@ const cursorLayer = layer({
       updateHasMouseDownEffect(update)
     )
   },
-  mount(dom, view) {
+  mount(dom) {
     dom.style.animationDuration = '1200ms'
   },
   class: 'cm-cursorLayer',
@@ -90,7 +90,7 @@ const selectionLayer = layer({
     }
     return markers
   },
-  update(update, dom) {
+  update(update) {
     return (
       update.docChanged ||
       update.selectionSet ||
diff --git a/services/web/frontend/js/features/source-editor/extensions/empty-line-filler.ts b/services/web/frontend/js/features/source-editor/extensions/empty-line-filler.ts
index 647463d608..49d9b195b9 100644
--- a/services/web/frontend/js/features/source-editor/extensions/empty-line-filler.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/empty-line-filler.ts
@@ -9,13 +9,13 @@ import {
 import browser from './browser'
 
 class EmptyLineWidget extends WidgetType {
-  toDOM(view: EditorView): HTMLElement {
+  toDOM(): HTMLElement {
     const element = document.createElement('span')
     element.className = 'ol-cm-filler'
     return element
   }
 
-  eq(widget: EmptyLineWidget) {
+  eq() {
     return true
   }
 }
diff --git a/services/web/frontend/js/features/source-editor/extensions/history-ot.ts b/services/web/frontend/js/features/source-editor/extensions/history-ot.ts
new file mode 100644
index 0000000000..91a58599fb
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/extensions/history-ot.ts
@@ -0,0 +1,449 @@
+import { Decoration, EditorView, WidgetType } from '@codemirror/view'
+import {
+  EditorState,
+  StateEffect,
+  StateField,
+  Transaction,
+} from '@codemirror/state'
+import {
+  CommentList,
+  EditOperation,
+  TextOperation,
+  TrackingProps,
+  TrackedChangeList,
+} from 'overleaf-editor-core'
+import { DocumentContainer } from '@/features/ide-react/editor/document-container'
+import { HistoryOTShareDoc } from '../../../../../types/share-doc'
+
+export const historyOT = (currentDoc: DocumentContainer) => {
+  const trackedChanges =
+    currentDoc.doc?.getTrackedChanges() ?? new TrackedChangeList([])
+  const positionMapper = new PositionMapper(trackedChanges)
+  return [
+    updateSender,
+    trackChangesUserIdState,
+    shareDocState.init(() => currentDoc?.doc?._doc ?? null),
+    commentsState,
+    trackedChangesState.init(() => ({
+      decorations: buildTrackedChangesDecorations(
+        trackedChanges,
+        positionMapper
+      ),
+      positionMapper,
+    })),
+    trackedChangesTheme,
+  ]
+}
+
+export const shareDocState = StateField.define<HistoryOTShareDoc | null>({
+  create() {
+    return null
+  },
+
+  update(value) {
+    // this state is constant
+    return value
+  },
+})
+
+const trackedChangesTheme = EditorView.baseTheme({
+  '.ol-cm-change-i, .ol-cm-change-highlight-i, .ol-cm-change-focus-i': {
+    backgroundColor: 'rgba(44, 142, 48, 0.30)',
+  },
+  '&light .ol-cm-change-c, &light .ol-cm-change-highlight-c, &light .ol-cm-change-focus-c':
+    {
+      backgroundColor: 'rgba(243, 177, 17, 0.30)',
+    },
+  '&dark .ol-cm-change-c, &dark .ol-cm-change-highlight-c, &dark .ol-cm-change-focus-c':
+    {
+      backgroundColor: 'rgba(194, 93, 11, 0.15)',
+    },
+  '.ol-cm-change': {
+    padding: 'var(--half-leading, 0) 0',
+  },
+  '.ol-cm-change-highlight': {
+    padding: 'var(--half-leading, 0) 0',
+  },
+  '.ol-cm-change-focus': {
+    padding: 'var(--half-leading, 0) 0',
+  },
+  '&light .ol-cm-change-d': {
+    borderLeft: '2px dotted #c5060b',
+    marginLeft: '-1px',
+  },
+  '&dark .ol-cm-change-d': {
+    borderLeft: '2px dotted #c5060b',
+    marginLeft: '-1px',
+  },
+  '&light .ol-cm-change-d-highlight': {
+    borderLeft: '3px solid #c5060b',
+    marginLeft: '-2px',
+  },
+  '&dark .ol-cm-change-d-highlight': {
+    borderLeft: '3px solid #c5060b',
+    marginLeft: '-2px',
+  },
+  '&light .ol-cm-change-d-focus': {
+    borderLeft: '3px solid #B83A33',
+    marginLeft: '-2px',
+  },
+  '&dark .ol-cm-change-d-focus': {
+    borderLeft: '3px solid #B83A33',
+    marginLeft: '-2px',
+  },
+})
+
+export const updateTrackedChangesEffect =
+  StateEffect.define<TrackedChangeList>()
+
+const buildTrackedChangesDecorations = (
+  trackedChanges: TrackedChangeList,
+  positionMapper: PositionMapper
+) => {
+  const decorations = []
+  for (const change of trackedChanges.asSorted()) {
+    if (change.tracking.type === 'insert') {
+      decorations.push(
+        Decoration.mark({
+          class: 'ol-cm-change ol-cm-change-i',
+          tracking: change.tracking,
+        }).range(
+          positionMapper.toCM6(change.range.pos),
+          positionMapper.toCM6(change.range.end)
+        )
+      )
+    } else {
+      decorations.push(
+        Decoration.widget({
+          widget: new ChangeDeletedWidget(),
+          side: 1,
+        }).range(positionMapper.toCM6(change.range.pos))
+      )
+    }
+  }
+
+  return Decoration.set(decorations, true)
+}
+
+class ChangeDeletedWidget extends WidgetType {
+  toDOM() {
+    const widget = document.createElement('span')
+    widget.classList.add('ol-cm-change')
+    widget.classList.add('ol-cm-change-d')
+    return widget
+  }
+
+  eq() {
+    return true
+  }
+}
+
+export const trackedChangesState = StateField.define({
+  create() {
+    return {
+      decorations: Decoration.none,
+      positionMapper: new PositionMapper(new TrackedChangeList([])),
+    }
+  },
+
+  update(value, transaction) {
+    if (
+      (transaction.docChanged && !transaction.annotation(Transaction.remote)) ||
+      transaction.effects.some(effect => effect.is(updateTrackedChangesEffect))
+    ) {
+      const shareDoc = transaction.startState.field(shareDocState)
+      if (shareDoc != null) {
+        const trackedChanges = shareDoc.snapshot.getTrackedChanges()
+        const positionMapper = new PositionMapper(trackedChanges)
+        value = {
+          decorations: buildTrackedChangesDecorations(
+            trackedChanges,
+            positionMapper
+          ),
+          positionMapper,
+        }
+      }
+    }
+
+    return value
+  },
+
+  provide(field) {
+    return EditorView.decorations.from(field, value => value.decorations)
+  },
+})
+
+const setTrackChangesUserIdEffect = StateEffect.define<string | null>()
+
+export const setTrackChangesUserId = (userId: string | null) => {
+  return {
+    effects: setTrackChangesUserIdEffect.of(userId),
+  }
+}
+
+const trackChangesUserIdState = StateField.define<string | null>({
+  create() {
+    return null
+  },
+
+  update(value, transaction) {
+    for (const effect of transaction.effects) {
+      if (effect.is(setTrackChangesUserIdEffect)) {
+        value = effect.value
+      }
+    }
+    return value
+  },
+})
+
+const updateCommentsEffect = StateEffect.define<CommentList>()
+
+export const updateComments = (comments: CommentList) => {
+  return {
+    effects: updateCommentsEffect.of(comments),
+  }
+}
+
+const buildCommentsDecorations = (comments: CommentList) =>
+  Decoration.set(
+    comments.toArray().flatMap(comment =>
+      comment.ranges.map(range =>
+        Decoration.mark({
+          class: 'tracked-change-comment',
+          id: comment.id,
+          resolved: comment.resolved,
+        }).range(range.pos, range.end)
+      )
+    ),
+    true
+  )
+
+const commentsState = StateField.define({
+  create() {
+    return Decoration.none // TODO: init from snapshot
+  },
+
+  update(value, transaction) {
+    if (transaction.docChanged) {
+      value = value.map(transaction.changes)
+    }
+
+    for (const effect of transaction.effects) {
+      if (effect.is(updateCommentsEffect)) {
+        value = buildCommentsDecorations(effect.value)
+      }
+    }
+
+    return value
+  },
+
+  provide(field) {
+    return EditorView.decorations.from(field)
+  },
+})
+
+export const historyOTOperationEffect = StateEffect.define<EditOperation[]>()
+
+const updateSender = EditorState.transactionExtender.of(tr => {
+  if (!tr.docChanged || tr.annotation(Transaction.remote)) {
+    return {}
+  }
+
+  const trackingUserId = tr.startState.field(trackChangesUserIdState)
+  const positionMapper = tr.startState.field(trackedChangesState).positionMapper
+  const startDoc = tr.startState.doc
+  const opBuilder = new OperationBuilder(
+    positionMapper.toSnapshot(startDoc.length)
+  )
+
+  if (trackingUserId == null) {
+    // Not tracking changes
+    tr.changes.iterChanges((fromA, toA, fromB, toB, inserted) => {
+      // insert
+      if (inserted.length > 0) {
+        const pos = positionMapper.toSnapshot(fromA)
+        opBuilder.insert(pos, inserted.toString())
+      }
+
+      // deletion
+      if (toA > fromA) {
+        const start = positionMapper.toSnapshot(fromA)
+        const end = positionMapper.toSnapshot(toA)
+        opBuilder.delete(start, end - start)
+      }
+    })
+  } else {
+    // Tracking changes
+    const timestamp = new Date()
+    tr.changes.iterChanges((fromA, toA, fromB, toB, inserted) => {
+      // insertion
+      if (inserted.length > 0) {
+        const pos = positionMapper.toSnapshot(fromA)
+        opBuilder.trackedInsert(
+          pos,
+          inserted.toString(),
+          trackingUserId,
+          timestamp
+        )
+      }
+
+      // deletion
+      if (toA > fromA) {
+        const start = positionMapper.toSnapshot(fromA)
+        const end = positionMapper.toSnapshot(toA)
+        opBuilder.trackedDelete(start, end - start, trackingUserId, timestamp)
+      }
+    })
+  }
+
+  const op = opBuilder.finish()
+  const shareDoc = tr.startState.field(shareDocState)
+  if (shareDoc != null) {
+    shareDoc.submitOp([op])
+  }
+
+  return {}
+})
+
+/**
+ * Incrementally builds a TextOperation from a series of inserts and deletes.
+ *
+ * This relies on inserts and deletes being ordered by document position. This
+ * is not clear in the documentation, but has been confirmed by Marijn in
+ * https://discuss.codemirror.net/t/iterators-can-be-hard-to-work-with-for-beginners/3533/10
+ */
+class OperationBuilder {
+  /**
+   * Source document length
+   */
+  private docLength: number
+
+  /**
+   * Position in the source document
+   */
+  private pos: number
+
+  /**
+   * Operation built
+   */
+  private op: TextOperation
+
+  constructor(docLength: number) {
+    this.docLength = docLength
+    this.op = new TextOperation()
+    this.pos = 0
+  }
+
+  insert(pos: number, text: string) {
+    this.retainUntil(pos)
+    this.op.insert(text)
+  }
+
+  delete(pos: number, length: number) {
+    this.retainUntil(pos)
+    this.op.remove(length)
+    this.pos += length
+  }
+
+  trackedInsert(pos: number, text: string, userId: string, timestamp: Date) {
+    this.retainUntil(pos)
+    this.op.insert(text, {
+      tracking: new TrackingProps('insert', userId, timestamp),
+    })
+  }
+
+  trackedDelete(pos: number, length: number, userId: string, timestamp: Date) {
+    this.retainUntil(pos)
+    this.op.retain(length, {
+      tracking: new TrackingProps('delete', userId, timestamp),
+    })
+    this.pos += length
+  }
+
+  retainUntil(pos: number) {
+    if (pos > this.pos) {
+      this.op.retain(pos - this.pos)
+      this.pos = pos
+    } else if (pos < this.pos) {
+      throw Error(
+        `Out of order: position ${pos} comes before current position: ${this.pos}`
+      )
+    }
+  }
+
+  finish() {
+    this.retainUntil(this.docLength)
+    return this.op
+  }
+}
+
+type OffsetTable = { pos: number; map: (pos: number) => number }[]
+
+class PositionMapper {
+  private offsets: {
+    toCM6: OffsetTable
+    toSnapshot: OffsetTable
+  }
+
+  constructor(trackedChanges: TrackedChangeList) {
+    this.offsets = {
+      toCM6: [{ pos: 0, map: pos => pos }],
+      toSnapshot: [{ pos: 0, map: pos => pos }],
+    }
+
+    // Offset of the snapshot pos relative to the CM6 pos
+    let offset = 0
+    for (const change of trackedChanges.asSorted()) {
+      if (change.tracking.type === 'delete') {
+        const deleteLength = change.range.length
+        const deletePos = change.range.pos
+        const oldOffset = offset
+        const newOffset = offset + deleteLength
+        this.offsets.toSnapshot.push({
+          pos: change.range.pos - offset + 1,
+          map: pos => pos + newOffset,
+        })
+        this.offsets.toCM6.push({
+          pos: change.range.pos,
+          map: () => deletePos - oldOffset,
+        })
+        this.offsets.toCM6.push({
+          pos: change.range.pos + deleteLength,
+          map: pos => pos - newOffset,
+        })
+        offset = newOffset
+      }
+    }
+  }
+
+  toCM6(snapshotPos: number) {
+    return this.mapPos(snapshotPos, this.offsets.toCM6)
+  }
+
+  toSnapshot(cm6Pos: number) {
+    return this.mapPos(cm6Pos, this.offsets.toSnapshot)
+  }
+
+  mapPos(pos: number, offsets: OffsetTable) {
+    // Binary search for the offset at the last position before pos
+    let low = 0
+    let high = offsets.length - 1
+    while (low < high) {
+      const middle = Math.ceil((low + high) / 2)
+      const entry = offsets[middle]
+      if (entry.pos < pos) {
+        // This entry could be the right offset, but lower entries are too low
+        // Because we used Math.ceil(), middle is higher than low and the
+        // algorithm progresses.
+        low = middle
+      } else if (entry.pos > pos) {
+        // This entry is too high
+        high = middle - 1
+      } else {
+        // This is the right entry
+        return entry.map(pos)
+      }
+    }
+    return offsets[low].map(pos)
+  }
+}
diff --git a/services/web/frontend/js/features/source-editor/extensions/index.ts b/services/web/frontend/js/features/source-editor/extensions/index.ts
index 5daa597df3..9471bb5aad 100644
--- a/services/web/frontend/js/features/source-editor/extensions/index.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/index.ts
@@ -35,7 +35,7 @@ import importOverleafModules from '../../../../macros/import-overleaf-module.mac
 import { emptyLineFiller } from './empty-line-filler'
 import { goToLinePanel } from './go-to-line'
 import { drawSelection } from './draw-selection'
-import { visual } from './visual/visual'
+import { sourceOnly, visual } from './visual/visual'
 import { inlineBackground } from './inline-background'
 import { indentationMarkers } from './indentation-markers'
 import { codemirrorDevTools } from '../languages/latex/codemirror-dev-tools'
@@ -50,8 +50,10 @@ import { docName } from './doc-name'
 import { fileTreeItemDrop } from './file-tree-item-drop'
 import { mathPreview } from './math-preview'
 import { ranges } from './ranges'
+import { historyOT } from './history-ot'
 import { trackDetachedComments } from './track-detached-comments'
 import { reviewTooltip } from './review-tooltip'
+import { tooltipsReposition } from './tooltips-reposition'
 
 const moduleExtensions: Array<(options: Record<string, any>) => Extension> =
   importOverleafModules('sourceEditorExtensions').map(
@@ -77,6 +79,10 @@ export const createExtensions = (options: Record<string, any>): Extension[] => [
   EditorState.allowMultipleSelections.of(true),
   // A built-in extension that enables soft line wrapping.
   EditorView.lineWrapping,
+  sourceOnly(
+    options.visual.visual,
+    EditorView.contentAttributes.of({ 'aria-label': 'Source Editor editing' })
+  ),
   // A built-in extension that re-indents input if the language defines an indentOnInput field in its language data.
   indentOnInput(),
   lineWrappingIndentation(options.visual.visual),
@@ -134,7 +140,7 @@ export const createExtensions = (options: Record<string, any>): Extension[] => [
   cursorHighlights(),
   autoPair(options.settings),
   editable(),
-  search(),
+  search(options.initialSearchQuery),
   phrases(options.phrases),
   spelling(options.spelling),
   shortcuts,
@@ -142,13 +148,15 @@ export const createExtensions = (options: Record<string, any>): Extension[] => [
   // NOTE: `emptyLineFiller` needs to be before `trackChanges`,
   // so the decorations are added in the correct order.
   emptyLineFiller(),
-  ranges(),
+  options.currentDoc.currentDocument.getType() === 'history-ot'
+    ? historyOT(options.currentDoc.currentDocument)
+    : ranges(),
   trackDetachedComments(options.currentDoc),
   visual(options.visual),
   mathPreview(options.settings.mathPreview),
   reviewTooltip(),
   toolbarPanel(),
-  breadcrumbPanel(options.settings.enableNewEditor),
+  breadcrumbPanel(),
   verticalOverflow(),
   highlightActiveLine(options.visual.visual),
   // The built-in extension that highlights the active line in the gutter.
@@ -163,4 +171,5 @@ export const createExtensions = (options: Record<string, any>): Extension[] => [
   effectListeners(),
   geometryChangeEvent(),
   fileTreeItemDrop(),
+  tooltipsReposition(),
 ]
diff --git a/services/web/frontend/js/features/source-editor/extensions/keybindings.ts b/services/web/frontend/js/features/source-editor/extensions/keybindings.ts
index 3e67b4b753..01c39d67ba 100644
--- a/services/web/frontend/js/features/source-editor/extensions/keybindings.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/keybindings.ts
@@ -34,17 +34,14 @@ const customiseVimOnce = (_Vim: typeof Vim, _CodeMirror: typeof CodeMirror) => {
   // Allow copy via Ctrl-C in insert mode
   _Vim.unmap('<C-c>', 'insert')
 
-  _Vim.defineAction(
-    'insertModeCtrlC',
-    (cm: CodeMirror, actionArgs: object, state: any) => {
-      if (hasNonEmptySelection(cm)) {
-        navigator.clipboard.writeText(cm.getSelection())
-        cm.setSelection(cm.getCursor(), cm.getCursor())
-      } else {
-        _Vim.exitInsertMode(cm)
-      }
+  _Vim.defineAction('insertModeCtrlC', (cm: CodeMirror) => {
+    if (hasNonEmptySelection(cm)) {
+      navigator.clipboard.writeText(cm.getSelection())
+      cm.setSelection(cm.getCursor(), cm.getCursor())
+    } else {
+      _Vim.exitInsertMode(cm)
     }
-  )
+  })
 
   // Overwrite the moveByCharacters command with a decoration-aware version
   _Vim.defineMotion(
diff --git a/services/web/frontend/js/features/source-editor/extensions/keymaps.ts b/services/web/frontend/js/features/source-editor/extensions/keymaps.ts
index 7dfaee8d02..e90cf04fd7 100644
--- a/services/web/frontend/js/features/source-editor/extensions/keymaps.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/keymaps.ts
@@ -20,6 +20,8 @@ const ignoredDefaultMacKeybindings = new Set([
   // We replace these with our custom visual-line versions
   'Mod-Backspace',
   'Mod-Delete',
+  // Disable toggleTabFocusMode as it conflicts with ” on a Swedish keyboard layout
+  'Shift-Alt-m',
 ])
 
 const filteredDefaultKeymap = defaultKeymap.filter(
diff --git a/services/web/frontend/js/features/source-editor/extensions/language.ts b/services/web/frontend/js/features/source-editor/extensions/language.ts
index b36c14135c..721fb48587 100644
--- a/services/web/frontend/js/features/source-editor/extensions/language.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/language.ts
@@ -20,7 +20,7 @@ type Options = {
   syntaxValidation: boolean
 }
 
-type Metadata = {
+export type Metadata = {
   labels: Set<string>
   packageNames: Set<string>
   commands: Command[]
diff --git a/services/web/frontend/js/features/source-editor/extensions/math-preview.ts b/services/web/frontend/js/features/source-editor/extensions/math-preview.ts
index d946769fb3..1b9e051978 100644
--- a/services/web/frontend/js/features/source-editor/extensions/math-preview.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/math-preview.ts
@@ -1,10 +1,4 @@
-import {
-  EditorView,
-  repositionTooltips,
-  showTooltip,
-  Tooltip,
-  ViewPlugin,
-} from '@codemirror/view'
+import { EditorView, showTooltip, Tooltip, ViewPlugin } from '@codemirror/view'
 import {
   Compartment,
   EditorState,
@@ -24,8 +18,8 @@ import { documentCommands } from '../languages/latex/document-commands'
 import { debugConsole } from '@/utils/debugging'
 import { nodeHasError } from '../utils/tree-operations/common'
 import { documentEnvironments } from '../languages/latex/document-environments'
+import { repositionAllTooltips } from './tooltips-reposition'
 
-const REPOSITION_EVENT = 'editor:repositionMathTooltips'
 const HIDE_TOOLTIP_EVENT = 'editor:hideMathTooltip'
 
 export const mathPreview = (enabled: boolean): Extension => {
@@ -44,7 +38,6 @@ export const setMathPreview = (enabled: boolean): TransactionSpec => ({
 
 export const mathPreviewStateField = StateField.define<{
   tooltip: Tooltip | null
-  mathContent: HTMLDivElement | null
   hide: boolean
 }>({
   create: buildInitialState,
@@ -52,7 +45,7 @@ export const mathPreviewStateField = StateField.define<{
   update(state, tr) {
     for (const effect of tr.effects) {
       if (effect.is(hideTooltipEffect)) {
-        return { tooltip: null, hide: true, mathContent: null }
+        return { tooltip: null, hide: true }
       }
     }
 
@@ -61,19 +54,18 @@ export const mathPreviewStateField = StateField.define<{
 
       if (mathContainer) {
         if (state.hide) {
-          return { tooltip: null, hide: true, mathContent: null }
+          return { tooltip: null, hide: true }
         } else {
           const mathContent = buildTooltipContent(tr.state, mathContainer)
 
           return {
             tooltip: buildTooltip(mathContainer, mathContent),
-            mathContent,
             hide: false,
           }
         }
       }
 
-      return { tooltip: null, hide: false, mathContent: null }
+      return { tooltip: null, hide: false }
     }
 
     return state
@@ -83,19 +75,16 @@ export const mathPreviewStateField = StateField.define<{
     showTooltip.compute([field], state => state.field(field).tooltip),
 
     ViewPlugin.define(view => {
-      const listener = () => repositionTooltips(view)
       const hideTooltip = () => {
         view.dispatch({
           effects: hideTooltipEffect.of(null),
         })
       }
 
-      window.addEventListener(REPOSITION_EVENT, listener)
       window.addEventListener(HIDE_TOOLTIP_EVENT, hideTooltip)
 
       return {
         destroy() {
-          window.removeEventListener(REPOSITION_EVENT, listener)
           window.removeEventListener(HIDE_TOOLTIP_EVENT, hideTooltip)
         },
       }
@@ -159,6 +148,11 @@ function buildTooltip(
     create() {
       const dom = document.createElement('div')
       dom.classList.add('ol-cm-math-tooltip-container')
+      const innerElt = document.createElement('div')
+      innerElt.classList.add('ol-cm-math-tooltip')
+      innerElt.id = 'ol-cm-math-tooltip'
+      innerElt.appendChild(mathContent)
+      dom.appendChild(innerElt)
 
       return { dom, overlap: true, offset: { x: 0, y: 8 } }
     },
@@ -217,7 +211,7 @@ const buildTooltipContent = (
   renderMath(math.content, math.displayMode, element, definitions)
     .then(() => {
       element.style.opacity = '1'
-      window.dispatchEvent(new Event(REPOSITION_EVENT))
+      repositionAllTooltips()
     })
     .catch(error => {
       debugConsole.error(error)
diff --git a/services/web/frontend/js/features/source-editor/extensions/ranges.ts b/services/web/frontend/js/features/source-editor/extensions/ranges.ts
index 8dc4489d57..81d6fdbd86 100644
--- a/services/web/frontend/js/features/source-editor/extensions/ranges.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/ranges.ts
@@ -68,7 +68,7 @@ export const rangesDataField = StateField.define<RangesData | null>({
 export const ranges = () => [
   rangesDataField,
   // handle viewportChanged updates
-  ViewPlugin.define(view => {
+  ViewPlugin.define(() => {
     let timer: number
 
     return {
@@ -397,6 +397,9 @@ const trackChangesTheme = EditorView.baseTheme({
     {
       backgroundColor: 'rgba(194, 93, 11, 0.15)',
     },
+  '.ol-cm-change-focus .ol-cm-change': {
+    backgroundColor: 'transparent',
+  },
   '.ol-cm-change': {
     padding: 'var(--half-leading, 0) 0',
   },
@@ -422,12 +425,4 @@ const trackChangesTheme = EditorView.baseTheme({
     borderLeft: '3px solid #c5060b',
     marginLeft: '-2px',
   },
-  '&light .ol-cm-change-d-focus': {
-    borderLeft: '3px solid #B83A33',
-    marginLeft: '-2px',
-  },
-  '&dark .ol-cm-change-d-focus': {
-    borderLeft: '3px solid #B83A33',
-    marginLeft: '-2px',
-  },
 })
diff --git a/services/web/frontend/js/features/source-editor/extensions/realtime.ts b/services/web/frontend/js/features/source-editor/extensions/realtime.ts
index 36d9956a76..58cfa8712a 100644
--- a/services/web/frontend/js/features/source-editor/extensions/realtime.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/realtime.ts
@@ -1,10 +1,34 @@
-import { Prec, Transaction, Annotation, ChangeSpec } from '@codemirror/state'
+import {
+  Prec,
+  Transaction,
+  Annotation,
+  ChangeSpec,
+  Text,
+  StateEffect,
+} from '@codemirror/state'
 import { EditorView, ViewPlugin } from '@codemirror/view'
 import { EventEmitter } from 'events'
 import RangesTracker from '@overleaf/ranges-tracker'
-import { ShareDoc } from '../../../../../types/share-doc'
+import {
+  ShareDoc,
+  ShareLatexOTShareDoc,
+  HistoryOTShareDoc,
+} from '../../../../../types/share-doc'
 import { debugConsole } from '@/utils/debugging'
 import { DocumentContainer } from '@/features/ide-react/editor/document-container'
+import {
+  EditOperation,
+  TextOperation,
+  InsertOp,
+  RemoveOp,
+  RetainOp,
+} from 'overleaf-editor-core'
+import {
+  updateTrackedChangesEffect,
+  setTrackChangesUserId,
+  trackedChangesState,
+  shareDocState,
+} from './history-ot'
 
 /*
  * Integrate CodeMirror 6 with the real-time system, via ShareJS.
@@ -25,8 +49,10 @@ import { DocumentContainer } from '@/features/ide-react/editor/document-containe
  *   - frontend/js/features/ide-react/connection/editor-watchdog-manager.js
  */
 
+type Origin = 'remote' | 'undo' | 'reject' | undefined
+
 export type ChangeDescription = {
-  origin: 'remote' | 'undo' | 'reject' | undefined
+  origin: Origin
   inserted: boolean
   removed: boolean
 }
@@ -76,15 +102,22 @@ export const realtime = (
   return Prec.highest([realtimePlugin, ensureRealtimePlugin])
 }
 
+type OTAdapter = {
+  handleUpdateFromCM(
+    transactions: readonly Transaction[],
+    ranges?: RangesTracker
+  ): void
+  attachShareJs(): void
+}
+
 export class EditorFacade extends EventEmitter {
-  public shareDoc: ShareDoc | null
+  private otAdapter: OTAdapter | null
   public events: EventEmitter
-  private maxDocLength?: number
 
   constructor(public view: EditorView) {
     super()
     this.view = view
-    this.shareDoc = null
+    this.otAdapter = null
     this.events = new EventEmitter()
   }
 
@@ -118,23 +151,62 @@ export class EditorFacade extends EventEmitter {
     this.cmChange({ from: position, to: position + text.length }, origin)
   }
 
+  attachShareJs(shareDoc: ShareDoc, maxDocLength?: number) {
+    this.otAdapter =
+      shareDoc.otType === 'history-ot'
+        ? new HistoryOTAdapter(this, shareDoc, maxDocLength)
+        : new ShareLatexOTAdapter(this, shareDoc, maxDocLength)
+    this.otAdapter.attachShareJs()
+  }
+
+  detachShareJs() {
+    this.otAdapter = null
+  }
+
+  handleUpdateFromCM(
+    transactions: readonly Transaction[],
+    ranges?: RangesTracker
+  ) {
+    if (this.otAdapter == null) {
+      throw new Error('Trying to process updates with no otAdapter')
+    }
+
+    this.otAdapter.handleUpdateFromCM(transactions, ranges)
+  }
+
+  setTrackChangesUserId(userId: string | null) {
+    if (this.otAdapter instanceof HistoryOTAdapter) {
+      this.view.dispatch(setTrackChangesUserId(userId))
+    }
+  }
+}
+
+class ShareLatexOTAdapter {
+  constructor(
+    public editor: EditorFacade,
+    private shareDoc: ShareLatexOTShareDoc,
+    private maxDocLength?: number
+  ) {
+    this.editor = editor
+    this.shareDoc = shareDoc
+    this.maxDocLength = maxDocLength
+  }
+
   // Connect to ShareJS, passing changes to the CodeMirror view
   // as new transactions.
   // This is a broad immitation of helper functions supplied in
   // the sharejs library. (See vendor/libs/sharejs, in particular
   // the 'attach_ace' helper)
-  attachShareJs(shareDoc: ShareDoc, maxDocLength?: number) {
-    this.shareDoc = shareDoc
-    this.maxDocLength = maxDocLength
-
+  attachShareJs() {
+    const shareDoc = this.shareDoc
     const check = () => {
       // run in a timeout so it checks the editor content once this update has been applied
       window.setTimeout(() => {
-        const editorText = this.getValue()
+        const editorText = this.editor.getValue()
         const otText = shareDoc.getText()
 
         if (editorText !== otText) {
-          shareDoc.emit('error', 'Text does not match in CodeMirror 6')
+          this.shareDoc.emit('error', 'Text does not match in CodeMirror 6')
           debugConsole.error('Text does not match!')
           debugConsole.error('editor: ' + editorText)
           debugConsole.error('ot:     ' + otText)
@@ -143,12 +215,12 @@ export class EditorFacade extends EventEmitter {
     }
 
     const onInsert = (pos: number, text: string) => {
-      this.cmInsert(pos, text, 'remote')
+      this.editor.cmInsert(pos, text, 'remote')
       check()
     }
 
     const onDelete = (pos: number, text: string) => {
-      this.cmDelete(pos, text, 'remote')
+      this.editor.cmDelete(pos, text, 'remote')
       check()
     }
 
@@ -161,7 +233,7 @@ export class EditorFacade extends EventEmitter {
       shareDoc.removeListener('insert', onInsert)
       shareDoc.removeListener('delete', onDelete)
       delete shareDoc.detach_cm6
-      this.shareDoc = null
+      this.editor.detachShareJs()
     }
   }
 
@@ -175,10 +247,6 @@ export class EditorFacade extends EventEmitter {
     const trackedDeletesLength =
       ranges != null ? ranges.getTrackedDeletesLength() : 0
 
-    if (!shareDoc) {
-      throw new Error('Trying to process updates with no shareDoc')
-    }
-
     for (const transaction of transactions) {
       if (transaction.docChanged) {
         const origin = chooseOrigin(transaction)
@@ -234,7 +302,7 @@ export class EditorFacade extends EventEmitter {
               removed,
             }
 
-            this.emit('change', this, changeDescription)
+            this.editor.emit('change', this.editor, changeDescription)
           }
         )
       }
@@ -242,6 +310,154 @@ export class EditorFacade extends EventEmitter {
   }
 }
 
+class HistoryOTAdapter {
+  constructor(
+    public editor: EditorFacade,
+    private shareDoc: HistoryOTShareDoc,
+    private maxDocLength?: number
+  ) {
+    this.editor = editor
+    this.shareDoc = shareDoc
+    this.maxDocLength = maxDocLength
+  }
+
+  attachShareJs() {
+    this.checkContent()
+
+    const onRemoteOp = this.onRemoteOp.bind(this)
+    this.shareDoc.on('remoteop', onRemoteOp)
+
+    this.shareDoc.detach_cm6 = () => {
+      this.shareDoc.removeListener('remoteop', onRemoteOp)
+      delete this.shareDoc.detach_cm6
+      this.editor.detachShareJs()
+    }
+  }
+
+  handleUpdateFromCM(transactions: readonly Transaction[]) {
+    for (const transaction of transactions) {
+      if (
+        this.maxDocLength &&
+        transaction.changes.newLength >= this.maxDocLength
+      ) {
+        this.shareDoc.emit(
+          'error',
+          new Error('document length is greater than maxDocLength')
+        )
+        return
+      }
+
+      const origin = chooseOrigin(transaction)
+      transaction.changes.iterChanges((fromA, toA, fromB, toB, inserted) => {
+        this.onCodeMirrorChange(fromA, toA, fromB, toB, inserted, origin)
+      })
+    }
+  }
+
+  onRemoteOp(operations: EditOperation[]) {
+    const positionMapper =
+      this.editor.view.state.field(trackedChangesState).positionMapper
+    const changes: ChangeSpec[] = []
+    let trackedChangesUpdated = false
+    for (const operation of operations) {
+      if (operation instanceof TextOperation) {
+        let cursor = 0
+        for (const op of operation.ops) {
+          if (op instanceof InsertOp) {
+            if (op.tracking?.type !== 'delete') {
+              changes.push({
+                from: positionMapper.toCM6(cursor),
+                insert: op.insertion,
+              })
+            }
+            trackedChangesUpdated = true
+          } else if (op instanceof RemoveOp) {
+            changes.push({
+              from: positionMapper.toCM6(cursor),
+              to: positionMapper.toCM6(cursor + op.length),
+            })
+            cursor += op.length
+            trackedChangesUpdated = true
+          } else if (op instanceof RetainOp) {
+            if (op.tracking != null) {
+              if (op.tracking.type === 'delete') {
+                changes.push({
+                  from: positionMapper.toCM6(cursor),
+                  to: positionMapper.toCM6(cursor + op.length),
+                })
+              }
+              trackedChangesUpdated = true
+            }
+            cursor += op.length
+          }
+        }
+      }
+
+      const view = this.editor.view
+      const effects: StateEffect<any>[] = []
+      const scrollEffect = view
+        .scrollSnapshot()
+        .map(view.state.changes(changes))
+      if (scrollEffect != null) {
+        effects.push(scrollEffect)
+      }
+      if (trackedChangesUpdated) {
+        const shareDoc = this.editor.view.state.field(shareDocState)
+        if (shareDoc != null) {
+          const trackedChanges = shareDoc.snapshot.getTrackedChanges()
+          effects.push(updateTrackedChangesEffect.of(trackedChanges))
+        }
+      }
+
+      view.dispatch({
+        changes,
+        effects,
+        annotations: [
+          Transaction.remote.of(true),
+          Transaction.addToHistory.of(false),
+        ],
+      })
+    }
+  }
+
+  onCodeMirrorChange(
+    fromA: number,
+    toA: number,
+    fromB: number,
+    toB: number,
+    insertedText: Text,
+    origin: Origin
+  ) {
+    const insertedLength = insertedText.length
+    const removedLength = toA - fromA
+    const inserted = insertedLength > 0
+    const removed = removedLength > 0
+
+    const changeDescription: ChangeDescription = {
+      origin,
+      inserted,
+      removed,
+    }
+
+    this.editor.emit('change', this.editor, changeDescription)
+  }
+
+  checkContent() {
+    // run in a timeout so it checks the editor content once this update has been applied
+    window.setTimeout(() => {
+      const editorText = this.editor.getValue()
+      const otText = this.shareDoc.getText()
+
+      if (editorText !== otText) {
+        this.shareDoc.emit('error', 'Text does not match in CodeMirror 6')
+        debugConsole.error('Text does not match!')
+        debugConsole.error('editor: ' + editorText)
+        debugConsole.error('ot:     ' + otText)
+      }
+    }, 0)
+  }
+}
+
 export const trackChangesAnnotation = Annotation.define()
 
 const chooseOrigin = (transaction: Transaction) => {
diff --git a/services/web/frontend/js/features/source-editor/extensions/search.ts b/services/web/frontend/js/features/source-editor/extensions/search.ts
index 48e58a4bca..17fc4b027d 100644
--- a/services/web/frontend/js/features/source-editor/extensions/search.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/search.ts
@@ -15,6 +15,7 @@ import {
   KeyBinding,
   keymap,
   ViewPlugin,
+  ViewUpdate,
 } from '@codemirror/view'
 import {
   Annotation,
@@ -29,6 +30,7 @@ import {
 } from '@codemirror/state'
 import { sendSearchEvent } from '@/features/event-tracking/search-events'
 import { isVisual } from '@/features/source-editor/extensions/visual/visual'
+import { beforeChangeDocEffect } from '@/features/source-editor/extensions/before-change-doc'
 
 const restoreSearchQueryAnnotation = Annotation.define<boolean>()
 
@@ -110,10 +112,6 @@ const highlightSelectionMatchesExtension = highlightSelectionMatches({
   wholeWords: true,
 })
 
-// store the search query for use when switching between files
-// TODO: move this into EditorContext?
-let searchQuery: SearchQuery | null
-
 const scrollToMatch = (range: SelectionRange, view: EditorView) => {
   const coords = {
     from: view.coordsAtPos(range.from),
@@ -153,7 +151,7 @@ const searchEventKeymap: KeyBinding[] = [
 /**
  * A collection of extensions related to the search feature.
  */
-export const search = () => {
+export const search = (initialSearchQuery: SearchQuery | null) => {
   let open = false
 
   return [
@@ -195,9 +193,7 @@ export const search = () => {
             }
           },
           destroy() {
-            window.setTimeout(() => {
-              open = false // in a timeout, so the view plugin below can run its destroy method first
-            }, 0)
+            open = false
           },
         }
       },
@@ -205,8 +201,8 @@ export const search = () => {
 
     // restore a stored search and re-open the search panel
     ViewPlugin.define(view => {
-      if (searchQuery) {
-        const _searchQuery = searchQuery
+      if (initialSearchQuery) {
+        const _searchQuery = initialSearchQuery
         window.setTimeout(() => {
           openSearchPanel(view)
           view.dispatch({
@@ -217,9 +213,21 @@ export const search = () => {
       }
 
       return {
-        destroy() {
-          // persist the current search query if the panel is open
-          searchQuery = open ? getSearchQuery(view.state) : null
+        // Fire an event containing the search query before a document change
+        // so that it can be persisted for the next document
+        update(update: ViewUpdate) {
+          for (const tr of update.transactions) {
+            for (const effect of tr.effects) {
+              if (effect.is(beforeChangeDocEffect)) {
+                const searchQuery = open ? getSearchQuery(view.state) : null
+                window.dispatchEvent(
+                  new CustomEvent('search-panel-before-doc-change', {
+                    detail: searchQuery,
+                  })
+                )
+              }
+            }
+          }
         },
       }
     }),
diff --git a/services/web/frontend/js/features/source-editor/extensions/shortcuts.ts b/services/web/frontend/js/features/source-editor/extensions/shortcuts.ts
index e293f4bd6c..0430b39eea 100644
--- a/services/web/frontend/js/features/source-editor/extensions/shortcuts.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/shortcuts.ts
@@ -46,11 +46,11 @@ export const shortcuts = Prec.high(
   keymap.of([
     {
       key: 'Tab',
-      run: indentMore,
+      run: indentMore, // note: not using indentWithTab as the user may want to insert tab spaces within a line
     },
     {
       key: 'Shift-Tab',
-      run: indentLess,
+      run: indentLess, // note: not using indentWithTab as the user may want to insert tab spaces within a line
     },
     {
       key: 'Mod-y',
diff --git a/services/web/frontend/js/features/source-editor/extensions/spelling/context-menu.tsx b/services/web/frontend/js/features/source-editor/extensions/spelling/context-menu.tsx
index a38c9c9065..deac7d2956 100644
--- a/services/web/frontend/js/features/source-editor/extensions/spelling/context-menu.tsx
+++ b/services/web/frontend/js/features/source-editor/extensions/spelling/context-menu.tsx
@@ -1,3 +1,4 @@
+import { createRoot } from 'react-dom/client'
 import {
   StateField,
   StateEffect,
@@ -12,7 +13,6 @@ import {
   getSpellCheckLanguage,
 } from '@/features/source-editor/extensions/spelling/index'
 import { sendMB } from '@/infrastructure/event-tracking'
-import ReactDOM from 'react-dom'
 import { SpellingSuggestions } from '@/features/source-editor/extensions/spelling/spelling-suggestions'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 import { addLearnedWord } from '@/features/source-editor/extensions/spelling/learned-words'
@@ -159,7 +159,8 @@ const createSpellingSuggestionList = (word: Word) => (view: EditorView) => {
   const dom = document.createElement('div')
   dom.classList.add('ol-cm-spelling-context-menu-tooltip')
 
-  ReactDOM.render(
+  const root = createRoot(dom)
+  root.render(
     <SplitTestProvider>
       <SpellingSuggestions
         word={word}
@@ -235,12 +236,11 @@ const createSpellingSuggestionList = (word: Word) => (view: EditorView) => {
           })
         }}
       />
-    </SplitTestProvider>,
-    dom
+    </SplitTestProvider>
   )
 
   const destroy = () => {
-    ReactDOM.unmountComponentAtNode(dom)
+    root.unmount()
   }
 
   return { dom, destroy }
diff --git a/services/web/frontend/js/features/source-editor/extensions/spelling/spellchecker.ts b/services/web/frontend/js/features/source-editor/extensions/spelling/spellchecker.ts
index eecccf5787..84054a8183 100644
--- a/services/web/frontend/js/features/source-editor/extensions/spelling/spellchecker.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/spelling/spellchecker.ts
@@ -21,6 +21,7 @@ export class SpellChecker {
   private waitingForParser = false
   private firstCheckPending = false
   private trackedChanges: ChangeSet
+  private destroyed = false
   private readonly segmenter?: Intl.Segmenter
 
   // eslint-disable-next-line no-useless-constructor
@@ -60,6 +61,7 @@ export class SpellChecker {
 
   destroy() {
     this._clearPendingSpellCheck()
+    this.destroyed = true
   }
 
   _abortRequest() {
@@ -260,10 +262,22 @@ export class SpellChecker {
   }
 
   spellCheckAsap(view: EditorView) {
+    if (this.destroyed) {
+      debugConsole.warn(
+        'spellCheckAsap called after spellchecker was destroyed. Ignoring.'
+      )
+      return
+    }
     this._asyncSpellCheck(view, 0)
   }
 
   scheduleSpellCheck(view: EditorView) {
+    if (this.destroyed) {
+      debugConsole.warn(
+        'scheduleSpellCheck called after spellchecker was destroyed. Ignoring.'
+      )
+      return
+    }
     this._asyncSpellCheck(view, 1000)
   }
 
diff --git a/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions-language.tsx b/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions-language.tsx
index 59c995f760..be65d00bfa 100644
--- a/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions-language.tsx
+++ b/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions-language.tsx
@@ -1,7 +1,7 @@
 import { memo, useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import { Dropdown } from 'react-bootstrap-5'
+import { Dropdown } from 'react-bootstrap'
 import MaterialIcon from '@/shared/components/material-icon'
 
 export const SpellingSuggestionsLanguage = memo<{
diff --git a/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions.tsx b/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions.tsx
index 4fc78bccc2..724f79c652 100644
--- a/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions.tsx
+++ b/services/web/frontend/js/features/source-editor/extensions/spelling/spelling-suggestions.tsx
@@ -15,7 +15,7 @@ import { SpellingSuggestionsLanguage } from './spelling-suggestions-language'
 import { captureException } from '@/infrastructure/error-reporter'
 import { debugConsole } from '@/utils/debugging'
 import { SpellCheckLanguage } from '../../../../../../types/project-settings'
-import { Dropdown } from 'react-bootstrap-5'
+import { Dropdown } from 'react-bootstrap'
 
 const ITEMS_TO_SHOW = 8
 
diff --git a/services/web/frontend/js/features/source-editor/extensions/theme.ts b/services/web/frontend/js/features/source-editor/extensions/theme.ts
index 2fd6a77533..3b3ac4afdf 100644
--- a/services/web/frontend/js/features/source-editor/extensions/theme.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/theme.ts
@@ -3,12 +3,8 @@ import { Annotation, Compartment, TransactionSpec } from '@codemirror/state'
 import { syntaxHighlighting } from '@codemirror/language'
 import { classHighlighter } from './class-highlighter'
 import classNames from 'classnames'
-import {
-  FontFamily,
-  LineHeight,
-  OverallTheme,
-  userStyles,
-} from '@/shared/utils/styles'
+import { FontFamily, LineHeight, userStyles } from '@/shared/utils/styles'
+import { ActiveOverallTheme } from '@/shared/hooks/use-active-overall-theme'
 
 const optionsThemeConf = new Compartment()
 const selectedThemeConf = new Compartment()
@@ -18,7 +14,7 @@ type Options = {
   fontSize: number
   fontFamily: FontFamily
   lineHeight: LineHeight
-  overallTheme: OverallTheme
+  activeOverallTheme: ActiveOverallTheme
 }
 
 export const theme = (options: Options) => [
@@ -58,7 +54,7 @@ const createThemeFromOptions = ({
   fontSize = 12,
   fontFamily = 'monaco',
   lineHeight = 'normal',
-  overallTheme = '',
+  activeOverallTheme = 'dark',
 }: Options) => {
   // Theme styles that depend on settings.
   const styles = userStyles({ fontSize, fontFamily, lineHeight })
@@ -66,7 +62,9 @@ const createThemeFromOptions = ({
   return [
     EditorView.editorAttributes.of({
       class: classNames(
-        overallTheme === '' ? 'overall-theme-dark' : 'overall-theme-light'
+        activeOverallTheme === 'dark'
+          ? 'overall-theme-dark'
+          : 'overall-theme-light'
       ),
       style: Object.entries({
         '--font-size': styles.fontSize,
diff --git a/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts b/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
index ae8dfc8578..24d43eb236 100644
--- a/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/toolbar/toolbar-panel.ts
@@ -23,9 +23,11 @@ export function createToolbarPanel() {
 }
 
 const toolbarTheme = EditorView.theme({
-  '.ol-cm-toolbar': {
+  '.ol-cm-toolbar-wrapper': {
     backgroundColor: 'var(--editor-toolbar-bg)',
     color: 'var(--toolbar-btn-color)',
+  },
+  '.ol-cm-toolbar': {
     flex: 1,
     display: 'flex',
     overflowX: 'hidden',
@@ -57,6 +59,26 @@ const toolbarTheme = EditorView.theme({
       },
     },
   },
+  '.ol-cm-toolbar-header': {
+    color: 'var(--toolbar-btn-color)',
+  },
+  '.ol-cm-toolbar-dropdown-divider': {
+    borderBottom: '1px solid',
+    borderColor: 'var(--toolbar-dropdown-divider-color)',
+  },
+  // here render both the icons, and hide one depending on if its dark or light mode with &.overall-theme-dark
+  '.ol-cm-toolbar-ai-sparkle-gradient': {
+    display: 'block',
+  },
+  '.ol-cm-toolbar-ai-sparkle-white': {
+    display: 'none',
+  },
+  '&.overall-theme-dark .ol-cm-toolbar-ai-sparkle-gradient': {
+    display: 'none',
+  },
+  '&.overall-theme-dark .ol-cm-toolbar-ai-sparkle-white': {
+    display: 'block',
+  },
   '.ol-cm-toolbar-button-menu-popover': {
     backgroundColor: 'initial',
     '& > .popover-content, & > .popover-body': {
@@ -216,7 +238,7 @@ const toolbarTheme = EditorView.theme({
       color: 'inherit',
     },
     '& .ol-cm-toolbar-menu': {
-      width: '120px',
+      minWidth: '120px',
       display: 'flex',
       flexDirection: 'column',
       boxSizing: 'border-box',
@@ -297,8 +319,18 @@ const toolbarTheme = EditorView.theme({
   },
 })
 
+const toolbarBorderTheme = EditorView.baseTheme({
+  '&light.overall-theme-dark .cm-panels-top': {
+    borderBottom: '1px solid var(--border-divider-dark)',
+  },
+})
+
 /**
  * A panel which contains the editor toolbar, provided by a state field which allows the toolbar to be toggled,
  * and styles for the toolbar.
  */
-export const toolbarPanel = () => [toolbarState, toolbarTheme]
+export const toolbarPanel = () => [
+  toolbarState,
+  toolbarTheme,
+  toolbarBorderTheme,
+]
diff --git a/services/web/frontend/js/features/source-editor/extensions/tooltips-reposition.ts b/services/web/frontend/js/features/source-editor/extensions/tooltips-reposition.ts
new file mode 100644
index 0000000000..cb350b2e06
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/extensions/tooltips-reposition.ts
@@ -0,0 +1,20 @@
+import { repositionTooltips, ViewPlugin } from '@codemirror/view'
+
+const REPOSITION_EVENT = 'editor:repositionAllTooltips'
+
+export const tooltipsReposition = () =>
+  ViewPlugin.define(view => {
+    const listener = () => repositionTooltips(view)
+
+    window.addEventListener(REPOSITION_EVENT, listener)
+
+    return {
+      destroy() {
+        window.removeEventListener(REPOSITION_EVENT, listener)
+      },
+    }
+  })
+
+export const repositionAllTooltips = () => {
+  window.dispatchEvent(new Event(REPOSITION_EVENT))
+}
diff --git a/services/web/frontend/js/features/source-editor/extensions/vertical-overflow.ts b/services/web/frontend/js/features/source-editor/extensions/vertical-overflow.ts
index 20505ed95d..873343c2bc 100644
--- a/services/web/frontend/js/features/source-editor/extensions/vertical-overflow.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/vertical-overflow.ts
@@ -188,7 +188,7 @@ class TopPaddingWidget extends WidgetType {
     this.height = height
   }
 
-  toDOM(view: EditorView): HTMLElement {
+  toDOM(): HTMLElement {
     const element = document.createElement('div')
     element.style.height = this.height + 'px'
     return element
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/atomic-decorations.ts b/services/web/frontend/js/features/source-editor/extensions/visual/atomic-decorations.ts
index d852c9d77c..03b9aea758 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/atomic-decorations.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/atomic-decorations.ts
@@ -1066,6 +1066,44 @@ export const atomicDecorations = (options: Options) => {
               )
             )
           }
+        } else if (
+          nodeRef.type.is('FootnoteCommand') ||
+          nodeRef.type.is('EndnoteCommand')
+        ) {
+          const textArgumentNode = nodeRef.node.getChild('TextArgument')
+          if (textArgumentNode) {
+            if (
+              state.readOnly &&
+              selectionIntersects(state.selection, nodeRef)
+            ) {
+              // a special case for a read-only document:
+              // always display the content, styled differently from the main content.
+              decorations.push(
+                ...decorateArgumentBraces(
+                  new BraceWidget(),
+                  textArgumentNode,
+                  nodeRef.from
+                ),
+                Decoration.mark({
+                  class: 'ol-cm-footnote ol-cm-footnote-view',
+                }).range(textArgumentNode.from, textArgumentNode.to)
+              )
+            } else {
+              if (shouldDecorate(state, nodeRef)) {
+                // collapse the footnote when the selection is outside it
+                decorations.push(
+                  Decoration.replace({
+                    widget: new FootnoteWidget(
+                      nodeRef.type.is('FootnoteCommand')
+                        ? 'footnote'
+                        : 'endnote'
+                    ),
+                  }).range(nodeRef.from, nodeRef.to)
+                )
+                return false
+              }
+            }
+          }
         } else if (nodeRef.type.is('UnknownCommand')) {
           // a command that's not defined separately by the grammar
           const commandNode = nodeRef.node
@@ -1091,43 +1129,6 @@ export const atomicDecorations = (options: Options) => {
                   )
                   return false
                 }
-              } else if (
-                commandName === '\\footnote' ||
-                commandName === '\\endnote'
-              ) {
-                if (textArgumentNode) {
-                  if (
-                    state.readOnly &&
-                    selectionIntersects(state.selection, nodeRef)
-                  ) {
-                    // a special case for a read-only document:
-                    // always display the content, styled differently from the main content.
-                    decorations.push(
-                      ...decorateArgumentBraces(
-                        new BraceWidget(),
-                        textArgumentNode,
-                        nodeRef.from
-                      ),
-                      Decoration.mark({
-                        class: 'ol-cm-footnote ol-cm-footnote-view',
-                      }).range(textArgumentNode.from, textArgumentNode.to)
-                    )
-                  } else {
-                    if (shouldDecorate(state, nodeRef)) {
-                      // collapse the footnote when the selection is outside it
-                      decorations.push(
-                        Decoration.replace({
-                          widget: new FootnoteWidget(
-                            commandName === '\\footnote'
-                              ? 'footnote'
-                              : 'endnote'
-                          ),
-                        }).range(nodeRef.from, nodeRef.to)
-                      )
-                      return false
-                    }
-                  }
-                }
               } else if (commandName === '\\LaTeX') {
                 if (shouldDecorate(state, nodeRef)) {
                   decorations.push(
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/paste-html.ts b/services/web/frontend/js/features/source-editor/extensions/visual/paste-html.ts
index ec9e3bd7bd..01db7b18ba 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/paste-html.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/paste-html.ts
@@ -487,6 +487,7 @@ const tabular = (element: HTMLTableElement) => {
     alignment: string
     borderLeft: boolean
     borderRight: boolean
+    inferred?: boolean
   }> = []
 
   const rows = element.querySelectorAll('tr')
@@ -500,16 +501,29 @@ const tabular = (element: HTMLTableElement) => {
 
     for (const cell of cells) {
       // NOTE: reading the alignment and borders from the first cell definition in each column
-      if (definitions[index] === undefined) {
-        const { textAlign, borderLeftStyle, borderRightStyle } = cell.style
+      const colspan = Number(cell.getAttribute('colspan') ?? 1)
+      const { textAlign, borderLeftStyle, borderRightStyle } = cell.style
 
-        definitions[index] = {
-          alignment: textAlign,
-          borderLeft: visibleBorderStyle(borderLeftStyle),
-          borderRight: visibleBorderStyle(borderRightStyle),
+      for (let i = 0; i < colspan; i++) {
+        if (
+          // There's no definition for this column
+          definitions[index + i] === undefined ||
+          // There's an inferred definition of the column, and we're a cell that
+          // can accurately represent the whole column, since we're not a
+          // multicolumn cell ourselves.
+          (colspan === 1 && definitions[index + i].inferred)
+        ) {
+          definitions[index + i] = {
+            alignment: textAlign,
+            borderLeft: visibleBorderStyle(borderLeftStyle),
+            borderRight: visibleBorderStyle(borderRightStyle),
+            // We can't trust the details from a multicolumn cell to represent the
+            // whole column, so we mark it as inferred.
+            inferred: colspan > 1,
+          }
         }
       }
-      index += Number(cell.getAttribute('colspan') ?? 1)
+      index += colspan
     }
   }
 
@@ -614,9 +628,12 @@ const nextRowHasBorderStyle = (
 }
 
 const startMulticolumn = (element: HTMLTableCellElement): string => {
+  const { textAlign, borderLeftStyle, borderRightStyle } = element.style
   const colspan = Number(element.getAttribute('colspan') || 1)
-  const alignment = cellAlignment.get(element.style.textAlign) ?? 'l'
-  return `\\multicolumn{${colspan}}{${alignment}}{`
+  const alignment = cellAlignment.get(textAlign) ?? 'l'
+  const borderLeft = visibleBorderStyle(borderLeftStyle)
+  const borderRight = visibleBorderStyle(borderRightStyle)
+  return `\\multicolumn{${colspan}}{${borderLeft ? '|' : ''}${alignment}${borderRight ? '|' : ''}}{`
 }
 
 const startMultirow = (element: HTMLTableCellElement): string => {
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/pasted-content.tsx b/services/web/frontend/js/features/source-editor/extensions/visual/pasted-content.tsx
index 3cb669d927..9235028c33 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/pasted-content.tsx
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/pasted-content.tsx
@@ -7,7 +7,7 @@ import {
 import { Decoration, EditorView, WidgetType } from '@codemirror/view'
 import { undo } from '@codemirror/commands'
 import { ancestorNodeOfType } from '../../utils/tree-operations/ancestors'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import { PastedContentMenu } from '../../components/paste-html/pasted-content-menu'
 import { SplitTestProvider } from '../../../../shared/context/split-test-context'
 
@@ -100,6 +100,9 @@ const pastedContentTheme = EditorView.baseTheme({
     '&:hover': {
       backgroundColor: 'rgba(125, 125, 125, 0.2)',
     },
+    '& .material-symbols': {
+      verticalAlign: 'middle',
+    },
   },
   '.ol-cm-pasted-content-menu-item-label': {
     flex: 1,
@@ -171,7 +174,8 @@ class PastedContentMenuWidget extends WidgetType {
 
   toDOM(view: EditorView) {
     const element = document.createElement('span')
-    ReactDOM.render(
+    const root = createRoot(element)
+    root.render(
       <SplitTestProvider>
         <PastedContentMenu
           insertPastedContent={this.insertPastedContent}
@@ -179,8 +183,7 @@ class PastedContentMenuWidget extends WidgetType {
           formatted={this.formatted}
           pastedContent={this.pastedContent}
         />
-      </SplitTestProvider>,
-      element
+      </SplitTestProvider>
     )
     return element
   }
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/table-generator.ts b/services/web/frontend/js/features/source-editor/extensions/visual/table-generator.ts
index 42cc6cc5de..10772e3dc6 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/table-generator.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/table-generator.ts
@@ -322,6 +322,7 @@ export const tableGeneratorTheme = EditorView.baseTheme({
   },
 
   '.table-generator-cell-input': {
+    color: 'inherit',
     'background-color': 'transparent',
     width: '100%',
     'text-align': 'inherit',
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
index 357bb99248..255acae0a6 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-theme.ts
@@ -379,6 +379,9 @@ const mainVisualTheme = EditorView.theme({
     display: 'flex',
     justifyContent: 'space-between',
     alignItems: 'center',
+    '& .material-symbols': {
+      verticalAlign: 'middle',
+    },
   },
   '.ol-cm-preamble-expand-icon': {
     width: '32px',
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/begin.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/begin.ts
index 70e508d93e..1826b48719 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/begin.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/begin.ts
@@ -45,6 +45,7 @@ export class BeginWidget extends WidgetType {
     return element.getBoundingClientRect()
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   buildName(name: HTMLSpanElement, view: EditorView) {
     name.textContent = this.environment
   }
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/editable-graphics.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/editable-graphics.ts
index abdc9ba484..aae3befefa 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/editable-graphics.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/editable-graphics.ts
@@ -2,6 +2,7 @@ import { EditorView } from '@codemirror/view'
 import { GraphicsWidget } from './graphics'
 import { editFigureDataEffect } from '../../figure-modal'
 import { emitToolbarEvent } from '../../toolbar/utils/analytics'
+import { materialIcon } from '@/features/utils/material-icon'
 
 export class EditableGraphicsWidget extends GraphicsWidget {
   setEditDispatcher(button: HTMLButtonElement, view: EditorView) {
@@ -49,10 +50,19 @@ export class EditableGraphicsWidget extends GraphicsWidget {
     const button = document.createElement('button')
     button.setAttribute('aria-label', view.state.phrase('edit_figure'))
     this.setEditDispatcher(button, view)
-    button.classList.add('btn', 'btn-secondary', 'ol-cm-graphics-edit-button')
-    const buttonLabel = document.createElement('span')
-    buttonLabel.classList.add('fa', 'fa-pencil')
-    button.append(buttonLabel)
+    button.classList.add(
+      'btn',
+      'btn-secondary',
+      'ol-cm-graphics-edit-button',
+      'icon-button',
+      'd-inline-grid'
+    )
+
+    const buttonContent = button.appendChild(document.createElement('span'))
+    buttonContent.className = 'button-content'
+
+    buttonContent.appendChild(materialIcon('edit'))
+
     return button
   }
 
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/end.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/end.ts
index 232399de3b..3ca2439ae1 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/end.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/end.ts
@@ -7,7 +7,7 @@ export class EndWidget extends WidgetType {
     return element
   }
 
-  eq(widget: EndWidget) {
+  eq() {
     return true
   }
 
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/environment-line.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/environment-line.ts
index d6ab42503e..d506ac2c38 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/environment-line.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/environment-line.ts
@@ -1,4 +1,4 @@
-import { EditorView, WidgetType } from '@codemirror/view'
+import { WidgetType } from '@codemirror/view'
 
 export class EnvironmentLineWidget extends WidgetType {
   constructor(
@@ -8,7 +8,7 @@ export class EnvironmentLineWidget extends WidgetType {
     super()
   }
 
-  toDOM(view: EditorView) {
+  toDOM() {
     const element = document.createElement('div')
     element.classList.add(`ol-cm-environment-${this.environment}`)
     element.classList.add('ol-cm-environment-edge')
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/preamble.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/preamble.ts
index 5f37469ab1..d1d9d77b44 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/preamble.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/preamble.ts
@@ -1,6 +1,34 @@
 import { EditorSelection, StateEffect } from '@codemirror/state'
 import { EditorView, WidgetType } from '@codemirror/view'
 import { SyntaxNode } from '@lezer/common'
+import { materialIcon } from '@/features/utils/material-icon'
+
+function createIcon({
+  type,
+  accessibilityLabel,
+  className,
+}: {
+  type: string
+  accessibilityLabel: string
+  className?: string
+}) {
+  const docFragment = document.createDocumentFragment()
+
+  const buttonIcon = materialIcon(type)
+  if (className) {
+    buttonIcon.classList.add(className)
+  }
+  docFragment.append(buttonIcon)
+
+  if (accessibilityLabel) {
+    const accessibilityLabelEl = document.createElement('span')
+    accessibilityLabelEl.className = 'visually-hidden'
+    accessibilityLabelEl.textContent = accessibilityLabel
+    docFragment.append(accessibilityLabelEl)
+  }
+
+  return docFragment
+}
 
 export type Preamble = {
   from: number
@@ -29,20 +57,20 @@ export class PreambleWidget extends WidgetType {
     const element = document.createElement('div')
     wrapper.appendChild(element)
     element.classList.add('ol-cm-preamble-widget')
-    const expandIcon = document.createElement('i')
-    expandIcon.classList.add(
-      'ol-cm-preamble-expand-icon',
-      'fa',
-      'fa-chevron-down'
-    )
+    const expandIcon = createIcon({
+      type: 'expand_more',
+      accessibilityLabel: view.state.phrase('expand'),
+      className: 'ol-cm-preamble-expand-icon',
+    })
     const helpText = document.createElement('div')
     const helpLink = document.createElement('a')
     helpLink.href =
       '/learn/latex/Learn_LaTeX_in_30_minutes#The_preamble_of_a_document'
     helpLink.target = '_blank'
-    const icon = document.createElement('i')
-    icon.classList.add('fa', 'fa-question-circle')
-    icon.title = view.state.phrase('learn_more')
+    const icon = createIcon({
+      type: 'help',
+      accessibilityLabel: view.state.phrase('learn_more'),
+    })
     helpLink.appendChild(icon)
     const textNode = document.createElement('span')
     textNode.classList.add('ol-cm-preamble-text')
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/table-rendering-error.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/table-rendering-error.ts
index 63ad0a297a..df6fb6df20 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/table-rendering-error.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/table-rendering-error.ts
@@ -1,5 +1,6 @@
 import { EditorView, WidgetType } from '@codemirror/view'
 import { SyntaxNode } from '@lezer/common'
+import { materialIcon } from '@/features/utils/material-icon'
 
 export class TableRenderingErrorWidget extends WidgetType {
   private hasTableNode: boolean
@@ -14,11 +15,7 @@ export class TableRenderingErrorWidget extends WidgetType {
     warning.role = 'alert'
     const icon = document.createElement('div')
     icon.classList.add('notification-icon')
-    const iconType = document.createElement('span')
-    iconType.classList.add('material-symbols')
-    iconType.setAttribute('aria-hidden', 'true')
-    iconType.textContent = 'info'
-    icon.appendChild(iconType)
+    icon.appendChild(materialIcon('info'))
     warning.appendChild(icon)
     const messageWrapper = document.createElement('div')
     messageWrapper.classList.add('notification-content-and-cta')
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/tabular.tsx b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/tabular.tsx
index 70fd240922..ce708b75c3 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/tabular.tsx
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual-widgets/tabular.tsx
@@ -1,10 +1,12 @@
+import { createRoot, Root } from 'react-dom/client'
 import { EditorView, WidgetType } from '@codemirror/view'
 import { SyntaxNode } from '@lezer/common'
-import * as ReactDOM from 'react-dom'
 import { Tabular } from '../../../components/table-generator/tabular'
 import { ParsedTableData } from '../../../components/table-generator/utils'
 
 export class TabularWidget extends WidgetType {
+  static roots: WeakMap<HTMLElement, Root> = new WeakMap()
+
   constructor(
     private parsedTableData: ParsedTableData,
     private tabularNode: SyntaxNode,
@@ -15,13 +17,21 @@ export class TabularWidget extends WidgetType {
     super()
   }
 
+  renderInDOMContainer(children: React.ReactNode, element: HTMLElement) {
+    const root = TabularWidget.roots.get(element) || createRoot(element)
+    if (!TabularWidget.roots.has(element)) {
+      TabularWidget.roots.set(element, root)
+    }
+    root.render(children)
+  }
+
   toDOM(view: EditorView) {
     const element = document.createElement('div')
     element.classList.add('ol-cm-tabular')
     if (this.tableNode) {
       element.classList.add('ol-cm-environment-table')
     }
-    ReactDOM.render(
+    this.renderInDOMContainer(
       <Tabular
         view={view}
         tabularNode={this.tabularNode}
@@ -46,7 +56,7 @@ export class TabularWidget extends WidgetType {
   }
 
   updateDOM(element: HTMLElement, view: EditorView): boolean {
-    ReactDOM.render(
+    this.renderInDOMContainer(
       <Tabular
         view={view}
         tabularNode={this.tabularNode}
@@ -68,6 +78,10 @@ export class TabularWidget extends WidgetType {
   }
 
   destroy(element: HTMLElement) {
-    ReactDOM.unmountComponentAtNode(element)
+    const root = TabularWidget.roots.get(element)
+    if (root) {
+      TabularWidget.roots.delete(element)
+      root.unmount()
+    }
   }
 }
diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/visual.ts b/services/web/frontend/js/features/source-editor/extensions/visual/visual.ts
index e644910c59..f0e4a25ff7 100644
--- a/services/web/frontend/js/features/source-editor/extensions/visual/visual.ts
+++ b/services/web/frontend/js/features/source-editor/extensions/visual/visual.ts
@@ -94,7 +94,7 @@ const parsedAttributesConf = new Compartment()
  * A view plugin which shows the editor content, makes it focusable,
  * and restores the scroll position, once the initial decorations have been applied.
  */
-const showContentWhenParsed = [
+export const showContentWhenParsed = [
   parsedAttributesConf.of([EditorView.editable.of(false)]),
   ViewPlugin.define(view => {
     const showContent = () => {
@@ -178,4 +178,5 @@ const extension = (options: Options) => [
   showContentWhenParsed,
   pasteHtml,
   tableGeneratorTheme,
+  EditorView.contentAttributes.of({ 'aria-label': 'Visual Editor editing' }),
 ]
diff --git a/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts b/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts
index fac88acc9e..fb29613f7f 100644
--- a/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts
+++ b/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts
@@ -1,6 +1,5 @@
 import { useCallback, useEffect, useRef } from 'react'
 import { EditorState } from '@codemirror/state'
-import useScopeValue from '../../../shared/hooks/use-scope-value'
 import useScopeEventEmitter from '../../../shared/hooks/use-scope-event-emitter'
 import useEventListener from '../../../shared/hooks/use-event-listener'
 import useScopeEventListener from '../../../shared/hooks/use-scope-event-listener'
@@ -33,7 +32,7 @@ import { setSpellCheckLanguage } from '../extensions/spelling'
 import { setKeybindings } from '../extensions/keybindings'
 import { Highlight } from '../../../../../types/highlight'
 import { EditorView } from '@codemirror/view'
-import { useErrorHandler } from 'react-error-boundary'
+import { useErrorBoundary } from 'react-error-boundary'
 import { setVisual } from '../extensions/visual/visual'
 import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import { useUserSettingsContext } from '@/shared/context/user-settings-context'
@@ -51,22 +50,28 @@ import { updateRanges } from '@/features/source-editor/extensions/ranges'
 import { useThreadsContext } from '@/features/review-panel-new/context/threads-context'
 import { useHunspell } from '@/features/source-editor/hooks/use-hunspell'
 import { Permissions } from '@/features/ide-react/types/permissions'
-import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { GotoOffsetOptions } from '@/features/ide-react/context/editor-manager-context'
+import { GotoLineOptions } from '@/features/ide-react/types/goto-line-options'
 import { useOnlineUsersContext } from '@/features/ide-react/context/online-users-context'
-import { setBreadcrumbsEnabled } from '../extensions/breadcrumbs-panel'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { useProjectContext } from '@/shared/context/project-context'
+import { usePermissionsContext } from '@/features/ide-react/context/permissions-context'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
+import { SearchQuery } from '@codemirror/search'
+import { beforeChangeDocEffect } from '@/features/source-editor/extensions/before-change-doc'
+import { useActiveOverallTheme } from '@/shared/hooks/use-active-overall-theme'
 
 function useCodeMirrorScope(view: EditorView) {
   const { fileTreeData } = useFileTreeData()
 
-  const [permissions] = useScopeValue<Permissions>('permissions')
+  const permissions: Permissions = usePermissionsContext()
 
   // set up scope listeners
 
   const { logEntryAnnotations, editedSinceCompileStarted, compiling } =
     useCompileContext()
 
-  const { currentDocument, openDocName, trackChanges } =
-    useEditorManagerContext()
+  const { openDocName, currentDocument } = useEditorOpenDocContext()
   const metadata = useMetadataContext()
 
   const { id: userId } = useUserContext()
@@ -75,7 +80,6 @@ function useCodeMirrorScope(view: EditorView) {
     fontFamily,
     fontSize,
     lineHeight,
-    overallTheme,
     autoComplete,
     editorTheme,
     autoPairDelimiters,
@@ -85,23 +89,20 @@ function useCodeMirrorScope(view: EditorView) {
     referencesSearchMode,
     enableNewEditor,
   } = userSettings
+  const activeOverallTheme = useActiveOverallTheme()
 
   const { onlineUserCursorHighlights } = useOnlineUsersContext()
 
-  let [spellCheckLanguage] = useScopeValue<string>('project.spellCheckLanguage')
+  const { project, features: projectFeatures } = useProjectContext()
+  let spellCheckLanguage = project?.spellCheckLanguage || ''
   // spell check is off when read-only
   if (!permissions.write && !permissions.trackedWrite) {
     spellCheckLanguage = ''
   }
 
-  const [projectFeatures] =
-    useScopeValue<Record<string, boolean | string | number | undefined>>(
-      'project.features'
-    )
-
   const hunspellManager = useHunspell(spellCheckLanguage)
 
-  const [visual] = useScopeValue<boolean>('editor.showVisual')
+  const { showVisual: visual, trackChanges } = useEditorPropertiesContext()
 
   const { referenceKeys } = useReferencesContext()
 
@@ -119,7 +120,7 @@ function useCodeMirrorScope(view: EditorView) {
     fontFamily,
     fontSize,
     lineHeight,
-    overallTheme,
+    activeOverallTheme,
     editorTheme,
   })
 
@@ -128,7 +129,7 @@ function useCodeMirrorScope(view: EditorView) {
       fontFamily,
       fontSize,
       lineHeight,
-      overallTheme,
+      activeOverallTheme,
       editorTheme,
     }
 
@@ -137,14 +138,14 @@ function useCodeMirrorScope(view: EditorView) {
         fontFamily,
         fontSize,
         lineHeight,
-        overallTheme,
+        activeOverallTheme,
       })
     )
 
     setEditorTheme(editorTheme).then(spec => {
       view.dispatch(spec)
     })
-  }, [view, fontFamily, fontSize, lineHeight, overallTheme, editorTheme])
+  }, [view, fontFamily, fontSize, lineHeight, activeOverallTheme, editorTheme])
 
   const settingsRef = useRef({
     autoComplete,
@@ -182,9 +183,9 @@ function useCodeMirrorScope(view: EditorView) {
 
     if (currentDocument) {
       if (trackChanges) {
-        currentDocument.track_changes_as = userId || 'anonymous'
+        currentDocument.setTrackChangesUserId(userId ?? 'anonymous')
       } else {
-        currentDocument.track_changes_as = null
+        currentDocument.setTrackChangesUserId(null)
       }
     }
   }, [userId, currentDocument, trackChanges])
@@ -266,7 +267,17 @@ function useCodeMirrorScope(view: EditorView) {
     visual: showVisual,
   })
 
-  const handleError = useErrorHandler()
+  // Persist the search query in this hook when the document changes by keeping
+  // a reference to the search query in sync with the editor state
+  const searchQueryRef = useRef<SearchQuery | null>(null)
+  useEventListener(
+    'search-panel-before-doc-change',
+    useCallback((event: CustomEvent) => {
+      searchQueryRef.current = event.detail
+    }, [])
+  )
+
+  const { showBoundary } = useErrorBoundary()
 
   const handleException = useCallback((exception: any) => {
     captureException(exception, {
@@ -290,6 +301,13 @@ function useCodeMirrorScope(view: EditorView) {
     if (currentDocument) {
       debugConsole.log('creating new editor state')
 
+      // Warn any interested extension that the document is about to change,
+      // allowing it to perform any necessary actions before creating the new
+      // state. destroy() is too late because the new state is already created
+      view.dispatch({
+        effects: beforeChangeDocEffect.of(null),
+      })
+
       const state = EditorState.create({
         doc: currentDocument.getSnapshot(),
         extensions: createExtensions({
@@ -305,7 +323,8 @@ function useCodeMirrorScope(view: EditorView) {
           spelling: spellingRef.current,
           visual: visualRef.current,
           projectFeatures: projectFeaturesRef.current,
-          handleError,
+          initialSearchQuery: searchQueryRef.current,
+          showBoundary,
           handleException,
         }),
       })
@@ -336,7 +355,7 @@ function useCodeMirrorScope(view: EditorView) {
     }
     // IMPORTANT: This effect must not depend on anything variable apart from currentDocument,
     // as the editor state is recreated when the effect runs.
-  }, [view, currentDocument, handleError, handleException])
+  }, [view, currentDocument, showBoundary, handleException])
 
   useEffect(() => {
     if (openDocName) {
@@ -436,20 +455,13 @@ function useCodeMirrorScope(view: EditorView) {
     settingsRef.current.referencesSearchMode = referencesSearchMode
   }, [referencesSearchMode])
 
-  useEffect(() => {
-    settingsRef.current.enableNewEditor = enableNewEditor
-    window.setTimeout(() => {
-      view.dispatch(setBreadcrumbsEnabled(enableNewEditor))
-    })
-  }, [view, enableNewEditor])
-
   const emitSyncToPdf = useScopeEventEmitter('cursor:editor:syncToPdf')
 
   // select and scroll to position on editor:gotoLine event (from synctex)
   useScopeEventListener(
     'editor:gotoLine',
     useCallback(
-      (_event, options) => {
+      (_event: any, options: GotoLineOptions) => {
         setCursorLineAndScroll(
           view,
           options.gotoLine,
@@ -468,7 +480,7 @@ function useCodeMirrorScope(view: EditorView) {
   useScopeEventListener(
     'editor:gotoOffset',
     useCallback(
-      (_event, options) => {
+      (_event: any, options: GotoOffsetOptions) => {
         setCursorPositionAndScroll(view, options.gotoOffset)
       },
       [view]
diff --git a/services/web/frontend/js/features/source-editor/languages/latex/latex-indent-service.ts b/services/web/frontend/js/features/source-editor/languages/latex/latex-indent-service.ts
index 08c1798032..d1e8e84bc4 100644
--- a/services/web/frontend/js/features/source-editor/languages/latex/latex-indent-service.ts
+++ b/services/web/frontend/js/features/source-editor/languages/latex/latex-indent-service.ts
@@ -1,7 +1,7 @@
 import { indentService } from '@codemirror/language'
 
 export const latexIndentService = () =>
-  indentService.of((indentContext, pos) => {
+  indentService.of(indentContext => {
     // only use this for insertNewLineAndIndent
     if (indentContext.simulatedBreak) {
       // match the indentation of the previous line (if present)
diff --git a/services/web/frontend/js/features/source-editor/languages/latex/linter/latex-linter.worker.js b/services/web/frontend/js/features/source-editor/languages/latex/linter/latex-linter.worker.js
index 0bfaf94d62..c496ce767f 100644
--- a/services/web/frontend/js/features/source-editor/languages/latex/linter/latex-linter.worker.js
+++ b/services/web/frontend/js/features/source-editor/languages/latex/linter/latex-linter.worker.js
@@ -2087,7 +2087,10 @@ if (typeof onmessage !== 'undefined') {
 }
 // export dummy class for testing
 export default class LintWorker {
+  // unused vars kept to document the interface
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   postMessage(message) {}
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   addEventListener(eventName, listener) {}
   Parse(text) {
     return Parse(text)
diff --git a/services/web/frontend/js/features/source-editor/lezer-latex/latex.grammar b/services/web/frontend/js/features/source-editor/lezer-latex/latex.grammar
index 8f9080807c..fb8657a48c 100644
--- a/services/web/frontend/js/features/source-editor/lezer-latex/latex.grammar
+++ b/services/web/frontend/js/features/source-editor/lezer-latex/latex.grammar
@@ -108,7 +108,9 @@
     TextStrikeOutCtrlSeq,
     EmphasisCtrlSeq,
     UnderlineCtrlSeq,
-    SetLengthCtrlSeq
+    SetLengthCtrlSeq,
+    FootnoteCtrlSeq,
+    EndnoteCtrlSeq
 }
 
 @external specialize {EnvName} specializeEnvName from "./tokens.mjs" {
@@ -410,6 +412,12 @@ KnownCommand<ArgumentType> {
     } |
     SetLengthCommand {
         SetLengthCtrlSeq optionalWhitespace? ShortTextArgument optionalWhitespace? ShortTextArgument
+    } |
+    FootnoteCommand {
+        FootnoteCtrlSeq optionalWhitespace? OptionalArgument? optionalWhitespace? TextArgument
+    } |
+    EndnoteCommand {
+        EndnoteCtrlSeq optionalWhitespace? OptionalArgument? optionalWhitespace? TextArgument
     }
 }
 
diff --git a/services/web/frontend/js/features/source-editor/lezer-latex/tokens.mjs b/services/web/frontend/js/features/source-editor/lezer-latex/tokens.mjs
index 933f2fc9a9..1c5bf6f51b 100644
--- a/services/web/frontend/js/features/source-editor/lezer-latex/tokens.mjs
+++ b/services/web/frontend/js/features/source-editor/lezer-latex/tokens.mjs
@@ -99,6 +99,8 @@ import {
   EmphasisCtrlSeq,
   UnderlineCtrlSeq,
   SetLengthCtrlSeq,
+  FootnoteCtrlSeq,
+  EndnoteCtrlSeq,
 } from './latex.terms.mjs'
 
 const MAX_ARGUMENT_LOOKAHEAD = 100
@@ -605,6 +607,8 @@ const otherKnowncommands = {
   '\\emph': EmphasisCtrlSeq,
   '\\underline': UnderlineCtrlSeq,
   '\\setlength': SetLengthCtrlSeq,
+  '\\footnote': FootnoteCtrlSeq,
+  '\\endnote': EndnoteCtrlSeq,
 }
 // specializer for control sequences
 // return new tokens for specific control sequences
@@ -692,6 +696,8 @@ const equationArrayEnvNames = new Set([
   'rcases*',
   'IEEEeqnarray',
   'IEEEeqnarray*',
+  'subeqnarray',
+  'subeqnarray*',
 ])
 
 const verbatimEnvNames = new Set([
diff --git a/services/web/frontend/js/features/source-editor/themes/cm6/dracula-license.txt b/services/web/frontend/js/features/source-editor/themes/cm6/dracula-license.txt
index d70d8cae37..fbeb04a425 100644
--- a/services/web/frontend/js/features/source-editor/themes/cm6/dracula-license.txt
+++ b/services/web/frontend/js/features/source-editor/themes/cm6/dracula-license.txt
@@ -5,31 +5,11 @@ Source: https://github.com/ajaxorg/ace/
 The theme's original license is copied below:
 
 ***** BEGIN LICENSE BLOCK *****
-Distributed under the BSD license:
+Copyright © 2017 Zeno Rocha <hi@zenorocha.com>
 
-Copyright (c) 2010, Ajax.org B.V.
-All rights reserved.
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 
-Redistribution and use in source and binary forms, with or without
-modification, are permitted provided that the following conditions are met:
-    * Redistributions of source code must retain the above copyright
-      notice, this list of conditions and the following disclaimer.
-    * Redistributions in binary form must reproduce the above copyright
-      notice, this list of conditions and the following disclaimer in the
-      documentation and/or other materials provided with the distribution.
-    * Neither the name of Ajax.org B.V. nor the
-      names of its contributors may be used to endorse or promote products
-      derived from this software without specific prior written permission.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
-ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
-WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
-DISCLAIMED. IN NO EVENT SHALL AJAX.ORG B.V. BE LIABLE FOR ANY
-DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
-(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
-LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
-ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
-(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
-SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
 
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 ***** END LICENSE BLOCK *****
\ No newline at end of file
diff --git a/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark-license.txt b/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark-license.txt
new file mode 100644
index 0000000000..2c74f30ab5
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark-license.txt
@@ -0,0 +1,16 @@
+Derived from the Dracula theme for the Ace editor, with the background colour changed.
+Conversion by Overleaf from Ace to CodeMirror 6.
+
+Source: https://github.com/ajaxorg/ace/
+
+The theme's original license is copied below:
+
+***** BEGIN LICENSE BLOCK *****
+Copyright © 2017 Zeno Rocha <hi@zenorocha.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+***** END LICENSE BLOCK *****
\ No newline at end of file
diff --git a/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark.json b/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark.json
new file mode 100644
index 0000000000..1fba763622
--- /dev/null
+++ b/services/web/frontend/js/features/source-editor/themes/cm6/overleaf_dark.json
@@ -0,0 +1,75 @@
+{
+  "theme": {
+    ".cm-gutters": {
+      "backgroundColor": "transparent",
+      "borderRightColor": "transparent",
+      "background": "#1b222c",
+      "color": "rgb(144,145,148)"
+    },
+    "&": {
+      "backgroundColor": "#1b222c",
+      "color": "#f8f8f2"
+    },
+    ".cm-cursor, .cm-dropCursor": {
+      "color": "#f8f8f0"
+    },
+    "&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection, .cm-searchMatch.cm-searchMatch.cm-searchMatch-selected": {
+      "background": "#44475a"
+    },
+    "&.cm-focused .cm-matchingBracket, &.cm-focused .cm-nonmatchingBracket": {
+      "margin": 0,
+      "outline": "1px solid #a29709"
+    },
+    ".cm-activeLine": {
+      "background": "#44475a"
+    },
+    ".cm-activeLineGutter": {
+      "backgroundColor": "#44475a"
+    },
+    ".cm-selectionMatch.cm-selectionMatch, .cm-searchMatch.cm-searchMatch": {
+      "boxShadow": "0px 0px 0px 1px inset #a29709",
+      "borderRadius": "3px",
+      "margin": 0
+    },
+    ".cm-foldPlaceholder": {
+      "backgroundColor": "#50fa7b",
+      "borderColor": "#f8f8f2"
+    }
+  },
+  "highlightStyle": {
+    ".tok-keyword": {
+      "color": "#ff79c6"
+    },
+    ".tok-literal": {
+      "color": "#ff79c6"
+    },
+    ".tok-typeName": {
+      "color": "#8be9fd",
+      "fontStyle": "italic"
+    },
+    ".tok-invalid": {
+      "color": "#F8F8F0",
+      "backgroundColor": "#ff79c6"
+    },
+    ".tok-string": {
+      "color": "#f1fa8c"
+    },
+    ".tok-comment": {
+      "color": "#6272a4"
+    },
+    ".tok-attributeValue": {
+      "color": "#ffb86c",
+      "fontStyle": "italic"
+    },
+    ".tok-attributeName": {
+      "color": "#50fa7b"
+    },
+    ".tok-function": {
+      "color": "#50fa7b"
+    },
+    ".tok-tagName": {
+      "color": "#ff79c6"
+    }
+  },
+  "dark": true
+}
diff --git a/services/web/frontend/js/features/source-editor/themes/scripts/overrides.json b/services/web/frontend/js/features/source-editor/themes/scripts/overrides.json
index 2e03ba3ece..62147ce3f0 100644
--- a/services/web/frontend/js/features/source-editor/themes/scripts/overrides.json
+++ b/services/web/frontend/js/features/source-editor/themes/scripts/overrides.json
@@ -61,6 +61,18 @@
       }
     }
   },
+  "overleaf-dark": {
+    "highlightStyle": {
+      ".tok-literal": {
+        "color": "#ff79c6"
+      }
+    },
+    "theme": {
+      ".cm-selectionMatch.cm-selectionMatch, .cm-searchMatch.cm-searchMatch": {
+        "boxShadow": "0px 0px 0px 1px inset #a29709"
+      }
+    }
+  },
   "gruvbox": {
     "theme": {
       ".cm-selectionMatch.cm-selectionMatch, .cm-searchMatch.cm-searchMatch": {
diff --git a/services/web/frontend/js/features/subscription/components/canceled-subscription/canceled.tsx b/services/web/frontend/js/features/subscription/components/canceled-subscription/canceled.tsx
index 60551a4970..aed8bc27db 100644
--- a/services/web/frontend/js/features/subscription/components/canceled-subscription/canceled.tsx
+++ b/services/web/frontend/js/features/subscription/components/canceled-subscription/canceled.tsx
@@ -32,7 +32,7 @@ function Canceled() {
                 href="/project"
                 rel="noopener noreferrer"
               >
-                &lt; {t('back_to_your_projects')}
+                {t('back_to_your_projects')}
               </a>
             </p>
           </OLPageContentCard>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/free-plan.tsx b/services/web/frontend/js/features/subscription/components/dashboard/free-plan.tsx
index ce4c2baaa5..1f9583dd8b 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/free-plan.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/free-plan.tsx
@@ -1,7 +1,10 @@
 import { useTranslation, Trans } from 'react-i18next'
+import WritefullManagedBundleAddOn from '@/features/subscription/components/dashboard/states/active/change-plan/modals/writefull-bundle-management-modal'
+import getMeta from '@/utils/meta'
 
 function FreePlan() {
   const { t } = useTranslation()
+  const hasAiAssistViaWritefull = getMeta('ol-hasAiAssistViaWritefull')
 
   return (
     <>
@@ -26,6 +29,12 @@ function FreePlan() {
       <a className="btn btn-primary me-1" href="/user/subscription/plans">
         {t('upgrade_now')}
       </a>
+      {hasAiAssistViaWritefull && (
+        <>
+          <h2 className="h3 fw-bold">{t('add_ons')}</h2>
+          <WritefullManagedBundleAddOn />
+        </>
+      )}
     </>
   )
 }
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/group-settings-button.tsx b/services/web/frontend/js/features/subscription/components/dashboard/group-settings-button.tsx
index 7430e8cca7..5233f74d31 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/group-settings-button.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/group-settings-button.tsx
@@ -3,8 +3,6 @@ import { useTranslation } from 'react-i18next'
 import { useLocation } from '@/shared/hooks/use-location'
 import MaterialIcon from '@/shared/components/material-icon'
 import OLTag from '@/features/ui/components/ol/ol-tag'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { bsVersion } from '@/features/utils/bootstrap-5'
 import { ManagedGroupSubscription } from '../../../../../../types/subscription/dashboard/subscription'
 import { sendMB } from '../../../../infrastructure/event-tracking'
 import starIcon from '../../images/star-gradient.svg'
@@ -24,7 +22,7 @@ function AvailableWithGroupProfessionalBadge() {
     <OLTag
       prepend={<img aria-hidden="true" src={starIcon} alt="" />}
       contentProps={{
-        className: bsVersion({ bs5: 'mw-100' }),
+        className: 'mw-100',
         onClick: handleUpgradeClick,
       }}
     >
@@ -82,35 +80,17 @@ export function GroupSettingsButtonWithAdBadge({
     useGroupSettingsButton(subscription)
 
   return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <div className="row-link text-muted">
-          <div className="icon">
-            <MaterialIcon type="settings" />
-          </div>
-          <div className="text">
-            <div className="heading">{heading}</div>
-            <div className="subtext">{groupSettingRowSubText}</div>
-          </div>
-          <span>
-            <AvailableWithGroupProfessionalBadge />
-          </span>
+    <li className="list-group-item row-link">
+      <div className="row-link-inner">
+        <MaterialIcon type="settings" className="p-2 p-md-3 text-muted" />
+        <div className="flex-grow-1 text-truncate text-muted">
+          <strong>{heading}</strong>
+          <div className="text-truncate">{groupSettingRowSubText}</div>
         </div>
-      }
-      bs5={
-        <li className="list-group-item row-link">
-          <div className="row-link-inner">
-            <MaterialIcon type="settings" className="p-2 p-md-3 text-muted" />
-            <div className="flex-grow-1 text-truncate text-muted">
-              <strong>{heading}</strong>
-              <div className="text-truncate">{groupSettingRowSubText}</div>
-            </div>
-            <span className="p-2 p-md-3">
-              <AvailableWithGroupProfessionalBadge />
-            </span>
-          </div>
-        </li>
-      }
-    />
+        <span className="p-2 p-md-3">
+          <AvailableWithGroupProfessionalBadge />
+        </span>
+      </div>
+    </li>
   )
 }
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/leave-group-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/leave-group-modal.tsx
index d56b0c80b8..99a80da3f4 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/leave-group-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/leave-group-modal.tsx
@@ -71,11 +71,6 @@ export default function LeaveGroupModal() {
           disabled={inflight}
           isLoading={inflight}
           loadingLabel={t('processing_uppercase') + '…'}
-          bs3Props={{
-            loading: inflight
-              ? t('processing_uppercase') + '…'
-              : t('leave_now'),
-          }}
         >
           {t('leave_now')}
         </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/managed-group-subscriptions.tsx b/services/web/frontend/js/features/subscription/components/dashboard/managed-group-subscriptions.tsx
index 18b43bd7da..a79cac06ac 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/managed-group-subscriptions.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/managed-group-subscriptions.tsx
@@ -7,8 +7,6 @@ import { Trans, useTranslation } from 'react-i18next'
 import { useSubscriptionDashboardContext } from '../../context/subscription-dashboard-context'
 import { RowLink } from './row-link'
 import { ManagedGroupSubscription } from '../../../../../../types/subscription/dashboard/subscription'
-import { bsVersion } from '@/features/utils/bootstrap-5'
-import classnames from 'classnames'
 
 function ManagedGroupAdministrator({
   subscription,
@@ -104,9 +102,7 @@ export default function ManagedGroupSubscriptions() {
       {managedGroupSubscriptions.map(subscription => {
         return (
           <div key={`managed-group-${subscription._id}`}>
-            <h2 className={classnames('h3', bsVersion({ bs5: 'fw-bold' }))}>
-              {t('group_management')}
-            </h2>
+            <h2 className="h3 fw-bold">{t('group_management')}</h2>
             <p>
               <ManagedGroupAdministrator subscription={subscription} />
             </p>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/managed-institution.tsx b/services/web/frontend/js/features/subscription/components/dashboard/managed-institution.tsx
index a63b872919..bd5856da2f 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/managed-institution.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/managed-institution.tsx
@@ -20,7 +20,10 @@ export default function ManagedInstitution({
   const { updateManagedInstitution } = useSubscriptionDashboardContext()
 
   const changeInstitutionalEmailSubscription = useCallback(
-    (e, institutionId: Institution['v1Id']) => {
+    (
+      e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+      institutionId: Institution['v1Id']
+    ) => {
       const updateSubscription = async (institutionId: Institution['v1Id']) => {
         setSubscriptionChanging(true)
         try {
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/pause-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/pause-modal.tsx
index 5d767d5fb6..b9b79a28f9 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/pause-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/pause-modal.tsx
@@ -10,12 +10,12 @@ import OLModal, {
 import { Select } from '@/shared/components/select'
 import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 import Button from '@/features/ui/components/bootstrap-5/button'
-import { Stack } from 'react-bootstrap-5'
+import { Stack } from 'react-bootstrap'
 import { debugConsole } from '@/utils/debugging'
 import * as eventTracking from '../../../../infrastructure/event-tracking'
 import PauseDuck from '../../images/pause-duck.svg'
 import GenericErrorAlert from './generic-error-alert'
-import { RecurlySubscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../types/subscription/dashboard/subscription'
 
 const pauseMonthDurationOptions = [1, 2, 3]
 
@@ -35,13 +35,13 @@ export default function PauseSubscriptionModal() {
   const location = useLocation()
 
   function handleCancelSubscriptionClick() {
-    const subscription = personalSubscription as RecurlySubscription
+    const subscription = personalSubscription as PaidSubscription
     eventTracking.sendMB('subscription-page-cancel-button-click', {
       plan_code: subscription?.planCode,
       is_trial:
-        subscription?.recurly.trialEndsAtFormatted &&
-        subscription?.recurly.trial_ends_at &&
-        new Date(subscription.recurly.trial_ends_at).getTime() > Date.now(),
+        subscription?.payment.trialEndsAtFormatted &&
+        subscription?.payment.trialEndsAt &&
+        new Date(subscription.payment.trialEndsAt).getTime() > Date.now(),
     })
     setShowCancellation(true)
   }
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-recurly-sync-email.tsx b/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-sync-email.tsx
similarity index 79%
rename from services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-recurly-sync-email.tsx
rename to services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-sync-email.tsx
index 1425609264..5f38a6be9e 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-recurly-sync-email.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription-sync-email.tsx
@@ -7,23 +7,23 @@ import OLNotification from '@/features/ui/components/ol/ol-notification'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
 
-function PersonalSubscriptionRecurlySyncEmail() {
+function PersonalSubscriptionSyncEmail() {
   const { t } = useTranslation()
   const { personalSubscription } = useSubscriptionDashboardContext()
   const userEmail = getMeta('ol-usersEmail')
   const { isLoading, isSuccess, runAsync } = useAsync()
 
+  if (!personalSubscription || !('payment' in personalSubscription)) return null
+
+  const accountEmail = personalSubscription.payment.accountEmail
+
+  if (!userEmail || accountEmail === userEmail) return null
+
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault()
     runAsync(postJSON('/user/subscription/account/email'))
   }
 
-  if (!personalSubscription || !('recurly' in personalSubscription)) return null
-
-  const recurlyEmail = personalSubscription.recurly.account.email
-
-  if (!userEmail || recurlyEmail === userEmail) return null
-
   return (
     <>
       <form onSubmit={handleSubmit}>
@@ -39,7 +39,7 @@ function PersonalSubscriptionRecurlySyncEmail() {
                 <Trans
                   i18nKey="recurly_email_update_needed"
                   components={[<em />, <em />]} // eslint-disable-line react/jsx-key
-                  values={{ recurlyEmail, userEmail }}
+                  values={{ recurlyEmail: accountEmail, userEmail }}
                   shouldUnescape
                   tOptions={{ interpolation: { escapeValue: true } }}
                 />
@@ -51,9 +51,6 @@ function PersonalSubscriptionRecurlySyncEmail() {
                   disabled={isLoading}
                   isLoading={isLoading}
                   loadingLabel={t('updating')}
-                  bs3Props={{
-                    loading: isLoading ? t('updating') + '…' : t('update'),
-                  }}
                 >
                   {t('update')}
                 </OLButton>
@@ -67,4 +64,4 @@ function PersonalSubscriptionRecurlySyncEmail() {
   )
 }
 
-export default PersonalSubscriptionRecurlySyncEmail
+export default PersonalSubscriptionSyncEmail
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription.tsx b/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription.tsx
index 7f56daf750..b174751528 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/personal-subscription.tsx
@@ -1,17 +1,17 @@
 import { Trans, useTranslation } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../types/subscription/dashboard/subscription'
 import { PausedSubscription } from './states/active/paused'
 import { ActiveSubscriptionNew } from '@/features/subscription/components/dashboard/states/active/active-new'
 import { CanceledSubscription } from './states/canceled'
 import { ExpiredSubscription } from './states/expired'
 import { useSubscriptionDashboardContext } from '../../context/subscription-dashboard-context'
-import PersonalSubscriptionRecurlySyncEmail from './personal-subscription-recurly-sync-email'
+import PersonalSubscriptionSyncEmail from './personal-subscription-sync-email'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 
 function PastDueSubscriptionAlert({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
   return (
@@ -21,7 +21,7 @@ function PastDueSubscriptionAlert({
         <>
           {t('account_has_past_due_invoice_change_plan_warning')}{' '}
           <a
-            href={subscription.recurly.accountManagementLink}
+            href={subscription.payment.accountManagementLink}
             target="_blank"
             rel="noreferrer noopener"
           >
@@ -36,10 +36,10 @@ function PastDueSubscriptionAlert({
 function PersonalSubscriptionStates({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
-  const state = subscription?.recurly.state
+  const state = subscription?.payment.state
 
   if (state === 'active') {
     // This version handles subscriptions with and without addons
@@ -62,7 +62,7 @@ function PersonalSubscription() {
 
   if (!personalSubscription) return null
 
-  if (!('recurly' in personalSubscription)) {
+  if (!('payment' in personalSubscription)) {
     return (
       <p>
         <Trans
@@ -75,12 +75,11 @@ function PersonalSubscription() {
 
   return (
     <>
-      {personalSubscription.recurly.account.has_past_due_invoice._ ===
-        'true' && (
+      {personalSubscription.payment.hasPastDueInvoice && (
         <PastDueSubscriptionAlert subscription={personalSubscription} />
       )}
       <PersonalSubscriptionStates
-        subscription={personalSubscription as RecurlySubscription}
+        subscription={personalSubscription as PaidSubscription}
       />
       {recurlyLoadError && (
         <OLNotification
@@ -89,7 +88,7 @@ function PersonalSubscription() {
         />
       )}
       <hr />
-      <PersonalSubscriptionRecurlySyncEmail />
+      <PersonalSubscriptionSyncEmail />
     </>
   )
 }
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/premium-features-link.tsx b/services/web/frontend/js/features/subscription/components/dashboard/premium-features-link.tsx
index 068857f6c8..14d9c8682a 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/premium-features-link.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/premium-features-link.tsx
@@ -1,10 +1,63 @@
 import { Trans } from 'react-i18next'
+import { Subscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { AI_ADD_ON_CODE, isStandaloneAiPlanCode } from '../../data/add-on-codes'
+
+function PremiumFeaturesLink({
+  subscription,
+}: {
+  subscription?: Subscription
+}) {
+  const hasAiAddon = subscription?.addOns?.some(
+    addOn => addOn.addOnCode === AI_ADD_ON_CODE
+  )
+  const onAiStandalonePlan = isStandaloneAiPlanCode(subscription?.planCode)
+
+  if (onAiStandalonePlan) {
+    return (
+      <p>
+        <Trans
+          i18nKey="get_most_subscription_by_checking_ai_writefull"
+          components={[
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/latex/Error_Assist" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a
+              href="https://help.writefull.com/writefull-for-overleaf--user-guide"
+              target="_blank"
+              rel="noopener"
+            />,
+          ]}
+        />
+      </p>
+    )
+  }
+
+  if (hasAiAddon) {
+    return (
+      <p>
+        <Trans
+          i18nKey="get_most_subscription_by_checking_overleaf_ai_writefull"
+          components={[
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/how-to/Overleaf_premium_features" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a href="/learn/latex/Error_Assist" />,
+            // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+            <a
+              href="https://help.writefull.com/writefull-for-overleaf--user-guide"
+              target="_blank"
+              rel="noopener"
+            />,
+          ]}
+        />
+      </p>
+    )
+  }
 
-function PremiumFeaturesLink() {
   return (
     <p>
       <Trans
-        i18nKey="get_most_subscription_discover_premium_features"
+        i18nKey="get_most_subscription_by_checking_overleaf"
         components={[
           // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
           <a href="/learn/how-to/Overleaf_premium_features" />,
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/redirect-alerts.tsx b/services/web/frontend/js/features/subscription/components/dashboard/redirect-alerts.tsx
new file mode 100644
index 0000000000..9dea4e1e46
--- /dev/null
+++ b/services/web/frontend/js/features/subscription/components/dashboard/redirect-alerts.tsx
@@ -0,0 +1,26 @@
+import { useTranslation } from 'react-i18next'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+
+export function RedirectAlerts() {
+  const queryParams = new URLSearchParams(window.location.search)
+  const redirectReason = queryParams.get('redirect-reason')
+  const { t } = useTranslation()
+
+  if (!redirectReason) {
+    return null
+  }
+
+  let warning
+  if (redirectReason === 'writefull-entitled') {
+    warning = t('good_news_you_are_already_receiving_this_add_on_via_writefull')
+  } else if (redirectReason === 'double-buy') {
+    warning = t('good_news_you_already_purchased_this_add_on')
+  } else if (redirectReason === 'ai-assist-unavailable') {
+    warning = t('ai_assist_unavailable_due_to_subscription_type')
+  } else {
+    return null
+  }
+
+  return <OLNotification type="warning" content={<>{warning}</>} />
+}
+export default RedirectAlerts
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/row-link.tsx b/services/web/frontend/js/features/subscription/components/dashboard/row-link.tsx
index fec6f03c53..42e331fdd0 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/row-link.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/row-link.tsx
@@ -1,5 +1,4 @@
 import MaterialIcon from '../../../../shared/components/material-icon'
-import { isBootstrap5 } from '@/features/utils/bootstrap-5'
 
 type RowLinkProps = {
   href: string
@@ -8,28 +7,7 @@ type RowLinkProps = {
   icon: string
 }
 
-export function RowLink(props: RowLinkProps) {
-  return isBootstrap5() ? <BS5RowLink {...props} /> : <BS3RowLink {...props} />
-}
-
-function BS3RowLink({ href, heading, subtext, icon }: RowLinkProps) {
-  return (
-    <a href={href} className="row-link">
-      <div className="icon">
-        <MaterialIcon type={icon} />
-      </div>
-      <div className="text">
-        <div className="heading">{heading}</div>
-        <div className="subtext">{subtext}</div>
-      </div>
-      <div className="icon arrow">
-        <MaterialIcon type="keyboard_arrow_right" />
-      </div>
-    </a>
-  )
-}
-
-function BS5RowLink({ href, heading, subtext, icon }: RowLinkProps) {
+export function RowLink({ href, heading, subtext, icon }: RowLinkProps) {
   return (
     <li className="list-group-item row-link">
       <a href={href} className="row-link-inner">
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/active-new.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/active-new.tsx
index 067888f918..465fc60ef7 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/active-new.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/active-new.tsx
@@ -1,7 +1,7 @@
 import { useTranslation, Trans } from 'react-i18next'
 import { PriceExceptions } from '../../../shared/price-exceptions'
 import { useSubscriptionDashboardContext } from '../../../../context/subscription-dashboard-context'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { CancelSubscriptionButton } from './cancel-subscription-button'
 import { CancelSubscription } from './cancel-plan/cancel-subscription'
 import { TrialEnding } from './trial-ending'
@@ -12,15 +12,13 @@ import { ChangeToGroupModal } from './change-plan/modals/change-to-group-modal'
 import { CancelAiAddOnModal } from '@/features/subscription/components/dashboard/states/active/change-plan/modals/cancel-ai-add-on-modal'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import isInFreeTrial from '../../../../util/is-in-free-trial'
-import { bsVersion } from '@/features/utils/bootstrap-5'
 import AddOns from '@/features/subscription/components/dashboard/states/active/add-ons'
 import {
   AI_ADD_ON_CODE,
-  AI_STANDALONE_PLAN_CODE,
+  AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE,
   isStandaloneAiPlanCode,
 } from '@/features/subscription/data/add-on-codes'
 import getMeta from '@/utils/meta'
-import classnames from 'classnames'
 import SubscriptionRemainder from '@/features/subscription/components/dashboard/states/active/subscription-remainder'
 import { sendMB } from '../../../../../../infrastructure/event-tracking'
 import PauseSubscriptionModal from '@/features/subscription/components/dashboard/pause-modal'
@@ -35,7 +33,7 @@ import Notification from '@/shared/components/notification'
 export function ActiveSubscriptionNew({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
   const {
@@ -74,19 +72,23 @@ export function ActiveSubscriptionNew({
 
   const handlePlanChange = () => setModalIdShown('change-plan')
   const handleCancelClick = (addOnCode: string) => {
-    if ([AI_STANDALONE_PLAN_CODE, AI_ADD_ON_CODE].includes(addOnCode)) {
+    if (
+      [AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE, AI_ADD_ON_CODE].includes(
+        addOnCode
+      )
+    ) {
       setModalIdShown('cancel-ai-add-on')
     }
   }
   const hasPendingPause = Boolean(
-    subscription.recurly.state === 'active' &&
-      subscription.recurly.remainingPauseCycles &&
-      subscription.recurly.remainingPauseCycles > 0
+    subscription.payment.state === 'active' &&
+      subscription.payment.remainingPauseCycles &&
+      subscription.payment.remainingPauseCycles > 0
   )
 
   const isLegacyPlan =
-    subscription.recurly.totalLicenses !==
-    subscription.recurly.additionalLicenses
+    subscription.payment.totalLicenses !==
+    subscription.payment.additionalLicenses
 
   return (
     <>
@@ -100,14 +102,12 @@ export function ActiveSubscriptionNew({
           />
         )}
       </div>
-      <h2 className={classnames('h3', bsVersion({ bs5: 'fw-bold' }))}>
-        {t('billing')}
-      </h2>
+      <h2 className="h3 fw-bold">{t('billing')}</h2>
       <p className="mb-1">
         {subscription.plan.annual ? (
           <Trans
             i18nKey="billed_annually_at"
-            values={{ price: subscription.recurly.displayPrice }}
+            values={{ price: subscription.payment.displayPrice }}
             shouldUnescape
             tOptions={{ interpolation: { escapeValue: true } }}
             components={[
@@ -120,7 +120,7 @@ export function ActiveSubscriptionNew({
         ) : (
           <Trans
             i18nKey="billed_monthly_at"
-            values={{ price: subscription.recurly.displayPrice }}
+            values={{ price: subscription.payment.displayPrice }}
             shouldUnescape
             tOptions={{ interpolation: { escapeValue: true } }}
             components={[
@@ -135,28 +135,40 @@ export function ActiveSubscriptionNew({
       <p className="mb-1">
         <Trans
           i18nKey="renews_on"
-          values={{ date: subscription.recurly.nextPaymentDueDate }}
+          values={{ date: subscription.payment.nextPaymentDueDate }}
           shouldUnescape
           tOptions={{ interpolation: { escapeValue: true } }}
           components={[<strong />]} // eslint-disable-line react/jsx-key
         />
       </p>
       <div>
-        <a
-          href={subscription.recurly.accountManagementLink}
-          target="_blank"
-          rel="noreferrer noopener"
-          className="me-2"
-        >
-          {t('view_invoices')}
-        </a>
-        <a
-          href={subscription.recurly.billingDetailsLink}
-          target="_blank"
-          rel="noreferrer noopener"
-        >
-          {t('view_billing_details')}
-        </a>
+        {subscription.payment.billingDetailsLink ? (
+          <>
+            <a
+              href={subscription.payment.accountManagementLink}
+              target="_blank"
+              rel="noreferrer noopener"
+              className="me-2"
+            >
+              {t('view_invoices')}
+            </a>
+            <a
+              href={subscription.payment.billingDetailsLink}
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              {t('view_billing_details')}
+            </a>
+          </>
+        ) : (
+          <a
+            href={subscription.payment.accountManagementLink}
+            rel="noreferrer noopener"
+            className="me-2"
+          >
+            {t('view_payment_portal')}
+          </a>
+        )}
       </div>
       <div className="mt-3">
         <PriceExceptions subscription={subscription} />
@@ -169,31 +181,27 @@ export function ActiveSubscriptionNew({
         )}
       </div>
       <hr />
-      <h2 className={classnames('h3', bsVersion({ bs5: 'fw-bold' }))}>
-        {t('plan')}
-      </h2>
-      <h3 className={classnames('h5 mt-0 mb-1', bsVersion({ bs5: 'fw-bold' }))}>
-        {planName}
-      </h3>
+      <h2 className="h3 fw-bold">{t('plan')}</h2>
+      <h3 className="h5 mt-0 mb-1 fw-bold">{planName}</h3>
       {subscription.pendingPlan &&
         subscription.pendingPlan.name !== subscription.plan.name && (
           <p className="mb-1">{t('want_change_to_apply_before_plan_end')}</p>
         )}
-      {isInFreeTrial(subscription.recurly.trial_ends_at) &&
-        subscription.recurly.trialEndsAtFormatted && (
+      {isInFreeTrial(subscription.payment.trialEndsAt) &&
+        subscription.payment.trialEndsAtFormatted && (
           <TrialEnding
-            trialEndsAtFormatted={subscription.recurly.trialEndsAtFormatted}
+            trialEndsAtFormatted={subscription.payment.trialEndsAtFormatted}
             className="mb-1"
           />
         )}
-      {subscription.recurly.totalLicenses > 0 && (
+      {subscription.payment.totalLicenses > 0 && (
         <p className="mb-1">
-          {isLegacyPlan && subscription.recurly.additionalLicenses > 0 ? (
+          {isLegacyPlan && subscription.payment.additionalLicenses > 0 ? (
             <Trans
               i18nKey="plus_x_additional_licenses_for_a_total_of_y_licenses"
               values={{
-                count: subscription.recurly.totalLicenses,
-                additionalLicenses: subscription.recurly.additionalLicenses,
+                count: subscription.payment.totalLicenses,
+                additionalLicenses: subscription.payment.additionalLicenses,
               }}
               shouldUnescape
               tOptions={{ interpolation: { escapeValue: true } }}
@@ -202,7 +210,7 @@ export function ActiveSubscriptionNew({
           ) : (
             <Trans
               i18nKey="supports_up_to_x_licenses"
-              values={{ count: subscription.recurly.totalLicenses }}
+              values={{ count: subscription.payment.totalLicenses }}
               shouldUnescape
               tOptions={{ interpolation: { escapeValue: true } }}
               components={[<strong />]} // eslint-disable-line react/jsx-key
@@ -217,7 +225,7 @@ export function ActiveSubscriptionNew({
               i18nKey="your_subscription_will_pause_on"
               values={{
                 planName: subscription.plan.name,
-                pauseDate: subscription.recurly.nextPaymentDueAt,
+                pauseDate: subscription.payment.nextPaymentDueAt,
                 reactivationDate: getFormattedRenewalDate(),
               }}
               shouldUnescape
@@ -235,10 +243,10 @@ export function ActiveSubscriptionNew({
         <p className="mb-1">
           {subscription.plan.annual
             ? t('x_price_per_year', {
-                price: subscription.recurly.planOnlyDisplayPrice,
+                price: subscription.payment.planOnlyDisplayPrice,
               })
             : t('x_price_per_month', {
-                price: subscription.recurly.planOnlyDisplayPrice,
+                price: subscription.payment.planOnlyDisplayPrice,
               })}
         </p>
       )}
@@ -269,7 +277,7 @@ export function ActiveSubscriptionNew({
 }
 
 type PlanActionsProps = {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
   onStandalonePlan: boolean
   handlePlanChange: () => void
   hasPendingPause: boolean
@@ -309,12 +317,11 @@ function PlanActions({
         <FlexibleGroupLicensingActions subscription={subscription} />
       ) : (
         <>
-          {!hasPendingPause &&
-            subscription.recurly.account.has_past_due_invoice._ !== 'true' && (
-              <OLButton variant="secondary" onClick={handlePlanChange}>
-                {t('change_plan')}
-              </OLButton>
-            )}
+          {!hasPendingPause && !subscription.payment.hasPastDueInvoice && (
+            <OLButton variant="secondary" onClick={handlePlanChange}>
+              {t('change_plan')}
+            </OLButton>
+          )}
         </>
       )}
       {hasPendingPause && (
@@ -343,11 +350,11 @@ function PlanActions({
 function FlexibleGroupLicensingActions({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
 
-  if (subscription.pendingPlan) {
+  if (subscription.pendingPlan || subscription.payment.hasPastDueInvoice) {
     return null
   }
 
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/active.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/active.tsx
index edc9fbfc33..2fdffac311 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/active.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/active.tsx
@@ -1,7 +1,7 @@
 import { useTranslation, Trans } from 'react-i18next'
 import { PriceExceptions } from '../../../shared/price-exceptions'
 import { useSubscriptionDashboardContext } from '../../../../context/subscription-dashboard-context'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { CancelSubscriptionButton } from './cancel-subscription-button'
 import { CancelSubscription } from './cancel-plan/cancel-subscription'
 import { PendingPlanChange } from './pending-plan-change'
@@ -27,7 +27,7 @@ import LoadingSpinner from '@/shared/components/loading-spinner'
 export function ActiveSubscription({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
   const {
@@ -46,9 +46,9 @@ export function ActiveSubscription({
   if (showCancellation) return <CancelSubscription />
 
   const hasPendingPause =
-    subscription.recurly.state === 'active' &&
-    subscription.recurly.remainingPauseCycles &&
-    subscription.recurly.remainingPauseCycles > 0
+    subscription.payment.state === 'active' &&
+    subscription.payment.remainingPauseCycles &&
+    subscription.payment.remainingPauseCycles > 0
 
   const handleCancelPendingPauseClick = async () => {
     try {
@@ -96,19 +96,19 @@ export function ActiveSubscription({
           </>
         )}
         {!subscription.pendingPlan &&
-          subscription.recurly.additionalLicenses > 0 && (
+          subscription.payment.additionalLicenses > 0 && (
             <>
               {' '}
               <PendingAdditionalLicenses
-                additionalLicenses={subscription.recurly.additionalLicenses}
-                totalLicenses={subscription.recurly.totalLicenses}
+                additionalLicenses={subscription.payment.additionalLicenses}
+                totalLicenses={subscription.payment.totalLicenses}
               />
             </>
           )}
         {!recurlyLoadError &&
           !subscription.groupPlan &&
           !hasPendingPause &&
-          subscription.recurly.account.has_past_due_invoice._ !== 'true' && (
+          !subscription.payment.hasPastDueInvoice && (
             <>
               {' '}
               <OLButton
@@ -128,10 +128,10 @@ export function ActiveSubscription({
       {(!subscription.pendingPlan ||
         subscription.pendingPlan.name === subscription.plan.name) &&
         subscription.plan.groupPlan && <ContactSupportToChangeGroupPlan />}
-      {isInFreeTrial(subscription.recurly.trial_ends_at) &&
-        subscription.recurly.trialEndsAtFormatted && (
+      {isInFreeTrial(subscription.payment.trialEndsAt) &&
+        subscription.payment.trialEndsAtFormatted && (
           <TrialEnding
-            trialEndsAtFormatted={subscription.recurly.trialEndsAtFormatted}
+            trialEndsAtFormatted={subscription.payment.trialEndsAtFormatted}
           />
         )}
 
@@ -142,7 +142,7 @@ export function ActiveSubscription({
               i18nKey="your_subscription_will_pause_on"
               values={{
                 planName: subscription.plan.name,
-                pauseDate: subscription.recurly.nextPaymentDueAt,
+                pauseDate: subscription.payment.nextPaymentDueAt,
                 reactivationDate: getFormattedRenewalDate(),
               }}
               shouldUnescape
@@ -174,7 +174,7 @@ export function ActiveSubscription({
         <Trans
           i18nKey="next_payment_of_x_collectected_on_y"
           values={{
-            paymentAmmount: subscription.recurly.displayPrice,
+            paymentAmmount: subscription.payment.displayPrice,
             collectionDate: getFormattedRenewalDate(),
           }}
           shouldUnescape
@@ -192,7 +192,7 @@ export function ActiveSubscription({
       <PriceExceptions subscription={subscription} />
       <p className="d-inline-flex flex-wrap gap-1">
         <a
-          href={subscription.recurly.billingDetailsLink}
+          href={subscription.payment.billingDetailsLink}
           target="_blank"
           rel="noreferrer noopener"
           className="btn btn-secondary-info btn-secondary"
@@ -200,7 +200,7 @@ export function ActiveSubscription({
           {t('update_your_billing_details')}
         </a>{' '}
         <a
-          href={subscription.recurly.accountManagementLink}
+          href={subscription.payment.accountManagementLink}
           target="_blank"
           rel="noreferrer noopener"
           className="btn btn-secondary-info btn-secondary"
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/add-ons.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/add-ons.tsx
index c17d52fb91..82952445e6 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/add-ons.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/add-ons.tsx
@@ -1,19 +1,21 @@
 import { useTranslation } from 'react-i18next'
-import { Dropdown, DropdownMenu, DropdownToggle } from 'react-bootstrap-5'
+import getMeta from '@/utils/meta'
+import { Dropdown, DropdownMenu, DropdownToggle } from 'react-bootstrap'
 import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
 import MaterialIcon from '@/shared/components/material-icon'
 import {
   ADD_ON_NAME,
   AI_ADD_ON_CODE,
-  AI_STANDALONE_ANNUAL_PLAN_CODE,
-  AI_STANDALONE_PLAN_CODE,
+  AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE,
+  AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE,
 } from '@/features/subscription/data/add-on-codes'
 import sparkle from '@/shared/svgs/sparkle.svg'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { LICENSE_ADD_ON } from '@/features/group-management/components/upgrade-subscription/upgrade-subscription-plan-details'
+import WritefullManagedBundleAddOn from './change-plan/modals/writefull-bundle-management-modal'
 
 type AddOnsProps = {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
   onStandalonePlan: boolean
   handleCancelClick: (code: string) => void
 }
@@ -30,8 +32,8 @@ type AddOnProps = {
 function resolveAddOnName(addOnCode: string) {
   switch (addOnCode) {
     case AI_ADD_ON_CODE:
-    case AI_STANDALONE_ANNUAL_PLAN_CODE:
-    case AI_STANDALONE_PLAN_CODE:
+    case AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE:
+    case AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE:
       return ADD_ON_NAME
   }
 }
@@ -104,35 +106,42 @@ function AddOns({
   handleCancelClick,
 }: AddOnsProps) {
   const { t } = useTranslation()
+  const hasAiAssistViaWritefull = getMeta('ol-hasAiAssistViaWritefull')
   const addOnsDisplayPrices = onStandalonePlan
     ? {
-        [AI_STANDALONE_PLAN_CODE]: subscription.recurly.displayPrice,
+        [AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE]:
+          subscription.payment.displayPrice,
       }
-    : subscription.recurly.addOnDisplayPricesWithoutAdditionalLicense
+    : subscription.payment.addOnDisplayPricesWithoutAdditionalLicense
   const addOnsToDisplay = onStandalonePlan
-    ? [{ addOnCode: AI_STANDALONE_PLAN_CODE }]
+    ? [{ addOnCode: AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE }]
     : subscription.addOns?.filter(addOn => addOn.addOnCode !== LICENSE_ADD_ON)
 
+  const hasAddons =
+    (addOnsToDisplay && addOnsToDisplay.length > 0) || hasAiAssistViaWritefull
   return (
     <>
       <h2 className="h3 fw-bold">{t('add_ons')}</h2>
-      {addOnsToDisplay && addOnsToDisplay.length > 0 ? (
-        addOnsToDisplay.map(addOn => (
-          <AddOn
-            addOnCode={addOn.addOnCode}
-            key={addOn.addOnCode}
-            isAnnual={Boolean(subscription.plan.annual)}
-            handleCancelClick={handleCancelClick}
-            pendingCancellation={
-              subscription.pendingPlan !== undefined &&
-              (subscription.pendingPlan.addOns ?? []).every(
-                pendingAddOn => pendingAddOn.addOnCode !== addOn.addOnCode
-              )
-            }
-            displayPrice={addOnsDisplayPrices[addOn.addOnCode]}
-            nextBillingDate={subscription.recurly.nextPaymentDueDate}
-          />
-        ))
+      {hasAddons ? (
+        <>
+          {addOnsToDisplay?.map(addOn => (
+            <AddOn
+              addOnCode={addOn.addOnCode}
+              key={addOn.addOnCode}
+              isAnnual={Boolean(subscription.plan.annual)}
+              handleCancelClick={handleCancelClick}
+              pendingCancellation={
+                subscription.pendingPlan !== undefined &&
+                (subscription.pendingPlan.addOns ?? []).every(
+                  pendingAddOn => pendingAddOn.code !== addOn.addOnCode
+                )
+              }
+              displayPrice={addOnsDisplayPrices[addOn.addOnCode]}
+              nextBillingDate={subscription.payment.nextPaymentDueDate}
+            />
+          ))}
+          {hasAiAssistViaWritefull && <WritefullManagedBundleAddOn />}
+        </>
       ) : (
         <p>{t('you_dont_have_any_add_ons_on_your_account')}</p>
       )}
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/cancel-subscription.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/cancel-subscription.tsx
index eddb4baafc..1b04e6385f 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/cancel-subscription.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/cancel-subscription.tsx
@@ -8,7 +8,6 @@ import {
   cancelSubscriptionUrl,
   redirectAfterCancelSubscriptionUrl,
 } from '../../../../../data/subscription-url'
-import showDowngradeOption from '../../../../../util/show-downgrade-option'
 import GenericErrorAlert from '../../../generic-error-alert'
 import DowngradePlanButton from './downgrade-plan-button'
 import ExtendTrialButton from './extend-trial-button'
@@ -155,15 +154,10 @@ export function CancelSubscription() {
     isSuccessSecondaryAction ||
     isSuccessCancel
 
-  if (!personalSubscription || !('recurly' in personalSubscription)) return null
+  if (!personalSubscription || !('payment' in personalSubscription)) return null
 
-  const showDowngrade = showDowngradeOption(
-    personalSubscription.plan.planCode,
-    personalSubscription.plan.groupPlan,
-    personalSubscription.recurly.trial_ends_at,
-    personalSubscription.recurly.pausedAt,
-    personalSubscription.recurly.remainingPauseCycles
-  )
+  const showDowngrade =
+    personalSubscription.payment.isEligibleForDowngradeUpsell
   const planToDowngradeTo = plans.find(
     plan => plan.planCode === planCodeToDowngradeTo
   )
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/downgrade-plan-button.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/downgrade-plan-button.tsx
index e0bc66ac63..c34e304e8b 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/downgrade-plan-button.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/downgrade-plan-button.tsx
@@ -41,9 +41,6 @@ export default function DowngradePlanButton({
       disabled={isButtonDisabled}
       isLoading={isLoading}
       loadingLabel={t('processing_uppercase') + '…'}
-      bs3Props={{
-        loading: isLoading ? t('processing_uppercase') + '…' : buttonText,
-      }}
     >
       {buttonText}
     </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/extend-trial-button.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/extend-trial-button.tsx
index d5b2e4d95c..e108e934a0 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/extend-trial-button.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-plan/extend-trial-button.tsx
@@ -34,9 +34,6 @@ export default function ExtendTrialButton({
       disabled={isButtonDisabled}
       isLoading={isLoading}
       loadingLabel={t('processing_uppercase') + '…'}
-      bs3Props={{
-        loading: isLoading ? t('processing_uppercase') + '…' : buttonText,
-      }}
     >
       {buttonText}
     </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-subscription-button.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-subscription-button.tsx
index a99f6e5762..f99b145b9b 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-subscription-button.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/cancel-subscription-button.tsx
@@ -2,8 +2,9 @@ import { useTranslation } from 'react-i18next'
 import * as eventTracking from '../../../../../../infrastructure/event-tracking'
 import { useSubscriptionDashboardContext } from '../../../../context/subscription-dashboard-context'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { useFeatureFlag } from '@/shared/context/split-test-context'
+import { useLocation } from '@/shared/hooks/use-location'
 
 export function CancelSubscriptionButton() {
   const { t } = useTranslation()
@@ -13,35 +14,39 @@ export function CancelSubscriptionButton() {
     setModalIdShown,
     setShowCancellation,
   } = useSubscriptionDashboardContext()
+  const location = useLocation()
 
-  const subscription = personalSubscription as RecurlySubscription
+  const subscription = personalSubscription as PaidSubscription
   const isInTrial =
-    subscription?.recurly.trialEndsAtFormatted &&
-    subscription?.recurly.trial_ends_at &&
-    new Date(subscription.recurly.trial_ends_at).getTime() > Date.now()
+    subscription?.payment.trialEndsAtFormatted &&
+    subscription?.payment.trialEndsAt &&
+    new Date(subscription.payment.trialEndsAt).getTime() > Date.now()
   const hasPendingOrActivePause =
-    subscription.recurly.state === 'paused' ||
-    (subscription.recurly.state === 'active' &&
-      subscription.recurly.remainingPauseCycles &&
-      subscription.recurly.remainingPauseCycles > 0)
-  const planIsEligibleForPause =
-    !subscription.pendingPlan &&
-    !subscription.groupPlan &&
-    !isInTrial &&
-    !subscription.planCode.includes('ann') &&
-    !subscription.addOns?.length
+    subscription.payment.state === 'paused' ||
+    (subscription.payment.state === 'active' &&
+      subscription.payment.remainingPauseCycles &&
+      subscription.payment.remainingPauseCycles > 0)
+  const planIsEligibleForPause = subscription.payment.isEligibleForPause
   const enablePause =
     useFeatureFlag('pause-subscription') &&
     !hasPendingOrActivePause &&
     planIsEligibleForPause
+  const shouldContactSupport =
+    subscription.payment.state === 'paused' &&
+    subscription.payment.remainingPauseCycles === 0
 
   function handleCancelSubscriptionClick() {
     eventTracking.sendMB('subscription-page-cancel-button-click', {
       plan_code: subscription?.planCode,
       is_trial: isInTrial,
     })
-    if (enablePause) setModalIdShown('pause-subscription')
-    else setShowCancellation(true)
+    if (shouldContactSupport) {
+      location.assign('/contact')
+    } else if (enablePause) {
+      setModalIdShown('pause-subscription')
+    } else {
+      setShowCancellation(true)
+    }
   }
 
   if (recurlyLoadError) return null
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/change-to-group-plan.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/change-to-group-plan.tsx
index 2b0b153cae..bd602ccd75 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/change-to-group-plan.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/change-to-group-plan.tsx
@@ -3,18 +3,19 @@ import { useSubscriptionDashboardContext } from '../../../../../context/subscrip
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import isInFreeTrial from '../../../../../util/is-in-free-trial'
-import { RecurlySubscription } from '../../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../../types/subscription/dashboard/subscription'
 
 export function ChangeToGroupPlan() {
   const { t } = useTranslation()
   const { handleOpenModal, personalSubscription } =
     useSubscriptionDashboardContext()
 
-  // TODO: Better way to get RecurlySubscription/trial_ends_at
+  // TODO: Better way to get PaidSubscription/trialEndsAt
   const subscription =
-    personalSubscription && 'recurly' in personalSubscription
-      ? (personalSubscription as RecurlySubscription)
+    personalSubscription && 'payment' in personalSubscription
+      ? (personalSubscription as PaidSubscription)
       : null
+  const isInTrial = isInFreeTrial(subscription?.payment?.trialEndsAt)
 
   const handleClick = () => {
     handleOpenModal('change-to-group')
@@ -25,13 +26,15 @@ export function ChangeToGroupPlan() {
       <h2 style={{ marginTop: 0 }}>{t('looking_multiple_licenses')}</h2>
       <p style={{ margin: 0 }}>{t('reduce_costs_group_licenses')}</p>
       <br />
-      {isInFreeTrial(subscription?.recurly?.trial_ends_at) ? (
+      {!subscription?.payment?.isEligibleForGroupPlan ? (
         <>
           <OLTooltip
             id="disabled-change-to-group-plan"
-            description={t(
-              'sorry_you_can_only_change_to_group_from_trial_via_support'
-            )}
+            description={
+              isInTrial
+                ? t('sorry_you_can_only_change_to_group_from_trial_via_support')
+                : t('sorry_you_can_only_change_to_group_via_support')
+            }
             overlayProps={{ placement: 'top' }}
           >
             <div>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/individual-plans-table.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/individual-plans-table.tsx
index a6ede01715..95282cdbe4 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/individual-plans-table.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/individual-plans-table.tsx
@@ -1,7 +1,7 @@
 import { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Plan } from '../../../../../../../../../types/subscription/plan'
-import Icon from '../../../../../../../shared/components/icon'
+import MaterialIcon from '@/shared/components/material-icon'
 import { useSubscriptionDashboardContext } from '../../../../../context/subscription-dashboard-context'
 import OLButton from '@/features/ui/components/ol/ol-button'
 
@@ -20,7 +20,7 @@ function ChangeToPlanButton({ planCode }: { planCode: string }) {
   )
 }
 
-function KeepCurrentPlanButton({ plan }: { plan: Plan }) {
+function KeepCurrentPlanButton() {
   const { t } = useTranslation()
   const { handleOpenModal } = useSubscriptionDashboardContext()
 
@@ -43,19 +43,21 @@ function ChangePlanButton({ plan }: { plan: Plan }) {
     plan.planCode === personalSubscription.planCode.split('_')[0]
 
   if (isCurrentPlanForUser && personalSubscription.pendingPlan) {
-    return <KeepCurrentPlanButton plan={plan} />
+    return <KeepCurrentPlanButton />
   } else if (isCurrentPlanForUser && !personalSubscription.pendingPlan) {
     return (
-      <b>
-        <Icon type="check" /> {t('your_plan')}
+      <b className="d-inline-flex align-items-center">
+        <MaterialIcon type="check" />
+        &nbsp;{t('your_plan')}
       </b>
     )
   } else if (
     personalSubscription?.pendingPlan?.planCode?.split('_')[0] === plan.planCode
   ) {
     return (
-      <b>
-        <Icon type="check" /> {t('your_new_plan')}
+      <b className="d-inline-flex align-items-center">
+        <MaterialIcon type="check" />
+        &nbsp;{t('your_new_plan')}
       </b>
     )
   } else {
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/cancel-ai-add-on-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/cancel-ai-add-on-modal.tsx
index 87d63bc44e..41c006507a 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/cancel-ai-add-on-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/cancel-ai-add-on-modal.tsx
@@ -107,11 +107,6 @@ export function CancelAiAddOnModal() {
           isLoading={inflight}
           loadingLabel={t('processing_uppercase') + '…'}
           onClick={handleConfirmChange}
-          bs3Props={{
-            loading: inflight
-              ? t('processing_uppercase') + '…'
-              : t('cancel_add_on'),
-          }}
         >
           {t('cancel_add_on')}
         </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/change-to-group-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/change-to-group-modal.tsx
index 010522a357..6f09f0c88c 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/change-to-group-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/change-to-group-modal.tsx
@@ -1,8 +1,11 @@
 import { useEffect, useState } from 'react'
 import { useTranslation, Trans } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../../../types/subscription/dashboard/subscription'
 import { PriceForDisplayData } from '../../../../../../../../../../types/subscription/plan'
-import { postJSON } from '../../../../../../../../infrastructure/fetch-json'
+import {
+  postJSON,
+  FetchError,
+} from '../../../../../../../../infrastructure/fetch-json'
 import getMeta from '../../../../../../../../utils/meta'
 import { useSubscriptionDashboardContext } from '../../../../../../context/subscription-dashboard-context'
 import GenericErrorAlert from '../../../../generic-error-alert'
@@ -22,9 +25,8 @@ import OLFormCheckbox from '@/features/ui/components/ol/ol-form-checkbox'
 import { useContactUsModal } from '@/shared/hooks/use-contact-us-modal'
 import { UserProvider } from '@/shared/context/user-context'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
-import { bsVersion } from '@/features/utils/bootstrap-5'
+import handleStripePaymentAction from '@/features/subscription/util/handle-stripe-payment-action'
 
 const educationalPercentDiscount = 40
 
@@ -71,7 +73,7 @@ function GroupPrice({
       <span aria-hidden>
         {totalPrice} <span className="small">/ {t('year')}</span>
       </span>
-      <span className="sr-only">
+      <span className="visually-hidden">
         {queryingGroupPlanToChangeToPrice
           ? t('loading_prices')
           : t('x_price_per_year', {
@@ -79,15 +81,13 @@ function GroupPrice({
             })}
       </span>
 
-      <BootstrapVersionSwitcher bs3={<br />} />
-
       <span className="circle-subtext">
         <span aria-hidden>
           {t('x_price_per_user', {
             price: perUserPrice,
           })}
         </span>
-        <span className="sr-only">
+        <span className="visually-hidden">
           {queryingGroupPlanToChangeToPrice
             ? t('loading_prices')
             : t('x_price_per_user', {
@@ -119,7 +119,7 @@ export function ChangeToGroupModal() {
     useContactUsModal({ autofillProjectUrl: false })
   const groupPlans = getMeta('ol-groupPlans')
   const showGroupDiscount = getMeta('ol-showGroupDiscount')
-  const personalSubscription = getMeta('ol-subscription') as RecurlySubscription
+  const personalSubscription = getMeta('ol-subscription') as PaidSubscription
   const [error, setError] = useState(false)
   const [inflight, setInflight] = useState(false)
   const location = useLocation()
@@ -140,6 +140,11 @@ export function ChangeToGroupModal() {
       })
       location.reload()
     } catch (e) {
+      const { handled } = await handleStripePaymentAction(e as FetchError)
+      if (handled) {
+        location.reload()
+        return
+      }
       setError(true)
       setInflight(false)
     }
@@ -211,7 +216,7 @@ export function ChangeToGroupModal() {
                   <li>{t('track_changes')}</li>
                   <li>
                     <span aria-hidden>+ {t('more').toLowerCase()}</span>
-                    <span className="sr-only">{t('plus_more')}</span>
+                    <span className="visually-hidden">{t('plus_more')}</span>
                   </li>
                 </ul>
               </div>
@@ -221,10 +226,7 @@ export function ChangeToGroupModal() {
                   <fieldset className="form-group">
                     <legend className="legend-as-label">{t('plan')}</legend>
                     {groupPlans.plans.map(option => (
-                      <div
-                        className={bsVersion({ bs3: 'radio' })}
-                        key={option.code}
-                      >
+                      <div key={option.code}>
                         <OLFormCheckbox
                           type="radio"
                           name="plan-code"
@@ -333,11 +335,6 @@ export function ChangeToGroupModal() {
               onClick={upgrade}
               isLoading={inflight}
               loadingLabel={t('processing_uppercase') + '…'}
-              bs3Props={{
-                loading: inflight
-                  ? t('processing_uppercase') + '…'
-                  : t('upgrade_now'),
-              }}
             >
               {t('upgrade_now')}
             </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/confirm-change-plan-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/confirm-change-plan-modal.tsx
index 0a9a5841eb..9693ad3e23 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/confirm-change-plan-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/confirm-change-plan-modal.tsx
@@ -1,7 +1,10 @@
 import { useState } from 'react'
 import { useTranslation, Trans } from 'react-i18next'
 import { SubscriptionDashModalIds } from '../../../../../../../../../../types/subscription/dashboard/modal-ids'
-import { postJSON } from '../../../../../../../../infrastructure/fetch-json'
+import {
+  postJSON,
+  FetchError,
+} from '../../../../../../../../infrastructure/fetch-json'
 import getMeta from '../../../../../../../../utils/meta'
 import { useSubscriptionDashboardContext } from '../../../../../../context/subscription-dashboard-context'
 import { subscriptionUpdateUrl } from '../../../../../../data/subscription-url'
@@ -13,11 +16,12 @@ import OLModal, {
   OLModalTitle,
 } from '@/features/ui/components/ol/ol-modal'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import OLNotification from '@/features/ui/components/ol/ol-notification'
+import PaymentErrorNotification from '@/features/subscription/components/shared/payment-error-notification'
+import handleStripePaymentAction from '@/features/subscription/util/handle-stripe-payment-action'
 
 export function ConfirmChangePlanModal() {
   const modalId: SubscriptionDashModalIds = 'change-to-plan'
-  const [error, setError] = useState(false)
+  const [error, setError] = useState<FetchError | null>(null)
   const [inflight, setInflight] = useState(false)
   const { t } = useTranslation()
   const { handleCloseModal, modalIdShown, plans, planCodeToChangeTo } =
@@ -26,7 +30,7 @@ export function ConfirmChangePlanModal() {
   const location = useLocation()
 
   async function handleConfirmChange() {
-    setError(false)
+    setError(null)
     setInflight(true)
 
     try {
@@ -37,8 +41,14 @@ export function ConfirmChangePlanModal() {
       })
       location.reload()
     } catch (e) {
-      setError(true)
-      setInflight(false)
+      const fetchError = e as FetchError
+      const { handled } = await handleStripePaymentAction(fetchError)
+      if (handled) {
+        location.reload()
+      } else {
+        setError(fetchError)
+        setInflight(false)
+      }
     }
   }
 
@@ -64,18 +74,7 @@ export function ConfirmChangePlanModal() {
       </OLModalHeader>
 
       <OLModalBody>
-        {error && (
-          <OLNotification
-            type="error"
-            aria-live="polite"
-            content={
-              <>
-                {t('generic_something_went_wrong')}. {t('try_again')}.{' '}
-                {t('generic_if_problem_continues_contact_us')}.
-              </>
-            }
-          />
-        )}
+        {error !== null && <PaymentErrorNotification error={error} />}
         <p>
           <Trans
             i18nKey="sure_you_want_to_change_plan"
@@ -112,11 +111,6 @@ export function ConfirmChangePlanModal() {
           isLoading={inflight}
           loadingLabel={t('processing_uppercase') + '…'}
           onClick={handleConfirmChange}
-          bs3Props={{
-            loading: inflight
-              ? t('processing_uppercase') + '…'
-              : t('change_plan'),
-          }}
         >
           {t('change_plan')}
         </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/keep-current-plan-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/keep-current-plan-modal.tsx
index e6bbe4942f..793c570e25 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/keep-current-plan-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/keep-current-plan-modal.tsx
@@ -93,11 +93,6 @@ export function KeepCurrentPlanModal() {
           isLoading={inflight}
           loadingLabel={t('processing_uppercase') + '…'}
           onClick={confirmCancelPendingPlanChange}
-          bs3Props={{
-            loading: inflight
-              ? t('processing_uppercase') + '…'
-              : t('revert_pending_plan_change'),
-          }}
         >
           {t('revert_pending_plan_change')}
         </OLButton>
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/writefull-bundle-management-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/writefull-bundle-management-modal.tsx
new file mode 100644
index 0000000000..d5a615821b
--- /dev/null
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/change-plan/modals/writefull-bundle-management-modal.tsx
@@ -0,0 +1,127 @@
+import { useTranslation } from 'react-i18next'
+import { SubscriptionDashModalIds } from '../../../../../../../../../../types/subscription/dashboard/modal-ids'
+import { useSubscriptionDashboardContext } from '../../../../../../context/subscription-dashboard-context'
+import OLModal, {
+  OLModalBody,
+  OLModalFooter,
+  OLModalHeader,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import sparkle from '@/shared/svgs/sparkle.svg'
+import { Dropdown, DropdownMenu, DropdownToggle } from 'react-bootstrap'
+import OLDropdownMenuItem from '@/features/ui/components/ol/ol-dropdown-menu-item'
+import MaterialIcon from '@/shared/components/material-icon'
+import { ADD_ON_NAME } from '@/features/subscription/data/add-on-codes'
+import getMeta from '@/utils/meta'
+
+function WritefullBundleManagementModal() {
+  const modalId: SubscriptionDashModalIds = 'manage-on-writefull'
+  const { t } = useTranslation()
+  const { handleCloseModal, modalIdShown } = useSubscriptionDashboardContext()
+  const aiAssistViaWritefullSource = getMeta('ol-aiAssistViaWritefullSource')
+
+  if (modalIdShown !== modalId) return null
+
+  const individualWFSubscription = aiAssistViaWritefullSource === 'individual'
+
+  return (
+    <OLModal
+      id={modalId}
+      show
+      animation
+      onHide={handleCloseModal}
+      backdrop="static"
+    >
+      <OLModalHeader>
+        <OLModalTitle>{t('manage_your_ai_assist_add_on')}</OLModalTitle>
+      </OLModalHeader>
+
+      <OLModalBody>
+        <p>
+          {individualWFSubscription
+            ? t('ai_assist_in_overleaf_is_included_via_writefull_individual')
+            : t('ai_assist_in_overleaf_is_included_via_writefull_groups')}
+        </p>
+      </OLModalBody>
+
+      <OLModalFooter>
+        <OLButton variant="secondary" onClick={handleCloseModal}>
+          {t('back')}
+        </OLButton>
+        {individualWFSubscription && (
+          <OLButton
+            variant="primary"
+            onClick={handleCloseModal}
+            href="https://my.writefull.com/account"
+            target="_blank"
+            rel="noreferrer"
+          >
+            {t('go_to_writefull')}
+          </OLButton>
+        )}
+      </OLModalFooter>
+    </OLModal>
+  )
+}
+
+function WritefullGrantedAddOn({
+  handleManageOnWritefull,
+}: {
+  handleManageOnWritefull: () => void
+}) {
+  const { t } = useTranslation()
+  return (
+    <div className="add-on-card">
+      <div>
+        <img
+          alt="sparkle"
+          className="add-on-card-icon"
+          src={sparkle}
+          aria-hidden="true"
+        />
+      </div>
+      <div className="add-on-card-content">
+        <div className="heading">{ADD_ON_NAME}</div>
+        <div className="description small mt-1">
+          {t('included_as_part_of_your_writefull_subscription')}
+        </div>
+      </div>
+
+      <div className="ms-auto">
+        <Dropdown align="end">
+          <DropdownToggle
+            id="add-on-dropdown-toggle"
+            className="add-on-options-toggle"
+            variant="secondary"
+          >
+            <MaterialIcon
+              type="more_vert"
+              accessibilityLabel={t('more_options')}
+            />
+          </DropdownToggle>
+          <DropdownMenu flip={false}>
+            <OLDropdownMenuItem tabIndex={-1} onClick={handleManageOnWritefull}>
+              {t('manage_subscription')}
+            </OLDropdownMenuItem>
+          </DropdownMenu>
+        </Dropdown>
+      </div>
+    </div>
+  )
+}
+
+export function WritefullManagedBundleAddOn() {
+  const { setModalIdShown } = useSubscriptionDashboardContext()
+  const handleManageOnWritefull = () => setModalIdShown('manage-on-writefull')
+  return (
+    <>
+      <WritefullGrantedAddOn
+        handleManageOnWritefull={handleManageOnWritefull}
+      />
+      <WritefullBundleManagementModal />
+    </>
+  )
+}
+
+export default WritefullManagedBundleAddOn
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/confirm-unpause-modal.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/confirm-unpause-modal.tsx
index 08dc85a469..df6364fcf1 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/confirm-unpause-modal.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/confirm-unpause-modal.tsx
@@ -12,7 +12,7 @@ import OLButton from '@/features/ui/components/ol/ol-button'
 import { postJSON } from '@/infrastructure/fetch-json'
 import { useLocation } from '@/shared/hooks/use-location'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 
 export function ConfirmUnpauseSubscriptionModal() {
   const modalId: SubscriptionDashModalIds = 'unpause-subscription'
@@ -22,7 +22,7 @@ export function ConfirmUnpauseSubscriptionModal() {
   const { handleCloseModal, modalIdShown, personalSubscription } =
     useSubscriptionDashboardContext()
   const location = useLocation()
-  const subscription = personalSubscription as RecurlySubscription
+  const subscription = personalSubscription as PaidSubscription
 
   async function handleConfirmUnpause() {
     setError(false)
@@ -70,7 +70,7 @@ export function ConfirmUnpauseSubscriptionModal() {
           <Trans
             i18nKey="lets_get_those_premium_features"
             values={{
-              paymentAmount: subscription.recurly.displayPrice,
+              paymentAmount: subscription.payment.displayPrice,
             }}
             shouldUnescape
             tOptions={{ interpolation: { escapeValue: true } }}
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/flash-message.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/flash-message.tsx
index 3259471785..4c489f824e 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/flash-message.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/flash-message.tsx
@@ -1,7 +1,7 @@
 import { useSubscriptionDashboardContext } from '@/features/subscription/context/subscription-dashboard-context'
 import Notification from '@/shared/components/notification'
 import { Trans, useTranslation } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { useEffect, useState } from 'react'
 import { useLocation } from '@/shared/hooks/use-location'
 
@@ -17,7 +17,7 @@ export function FlashMessage() {
       'flash'
     ) as FlashMessageName
   )
-  const subscription = personalSubscription as RecurlySubscription
+  const subscription = personalSubscription as PaidSubscription
   useEffect(() => {
     // clear any flash message IDs so they only show once
     if (location.toString()) {
@@ -36,7 +36,7 @@ export function FlashMessage() {
             <Trans
               i18nKey="your_subscription_will_pause_on_short"
               values={{
-                pauseDate: subscription.recurly.nextPaymentDueAt,
+                pauseDate: subscription.payment.nextPaymentDueAt,
               }}
               shouldUnescape
               tOptions={{ interpolation: { escapeValue: true } }}
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/paused.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/paused.tsx
index 68d9d64cd6..651a8b1827 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/paused.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/paused.tsx
@@ -1,6 +1,6 @@
 import { useTranslation, Trans } from 'react-i18next'
 import { useSubscriptionDashboardContext } from '../../../../context/subscription-dashboard-context'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import { CancelSubscriptionButton } from './cancel-subscription-button'
 import { CancelSubscription } from './cancel-plan/cancel-subscription'
 import { ChangePlanModal } from './change-plan/modals/change-plan-modal'
@@ -14,7 +14,7 @@ import { ConfirmUnpauseSubscriptionModal } from './confirm-unpause-modal'
 export function PausedSubscription({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
   const {
@@ -66,22 +66,34 @@ export function PausedSubscription({
       </p>
 
       <p className="d-inline-flex flex-wrap gap-1">
-        <a
-          href={subscription.recurly.billingDetailsLink}
-          target="_blank"
-          rel="noreferrer noopener"
-          className="btn btn-secondary-info btn-secondary"
-        >
-          {t('update_your_billing_details')}
-        </a>{' '}
-        <a
-          href={subscription.recurly.accountManagementLink}
-          target="_blank"
-          rel="noreferrer noopener"
-          className="btn btn-secondary-info btn-secondary"
-        >
-          {t('view_your_invoices')}
-        </a>
+        {subscription.payment.billingDetailsLink ? (
+          <>
+            <a
+              href={subscription.payment.billingDetailsLink}
+              target="_blank"
+              rel="noreferrer noopener"
+              className="btn btn-secondary-info btn-secondary"
+            >
+              {t('update_your_billing_details')}
+            </a>{' '}
+            <a
+              href={subscription.payment.accountManagementLink}
+              target="_blank"
+              rel="noreferrer noopener"
+              className="btn btn-secondary-info btn-secondary"
+            >
+              {t('view_your_invoices')}
+            </a>
+          </>
+        ) : (
+          <a
+            href={subscription.payment.accountManagementLink}
+            rel="noreferrer noopener"
+            className="btn btn-secondary-info btn-secondary"
+          >
+            {t('view_payment_portal')}
+          </a>
+        )}
       </p>
 
       <ChangePlanModal />
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/pending-plan-change.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/pending-plan-change.tsx
index 94bbd3e241..cf7452941d 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/pending-plan-change.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/pending-plan-change.tsx
@@ -1,29 +1,23 @@
 import { Trans } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
-import { PendingRecurlyPlan } from '../../../../../../../../types/subscription/plan'
-import { AI_ADD_ON_CODE, ADD_ON_NAME } from '../../../../data/add-on-codes'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import {
+  hasPendingAiAddonCancellation,
+  ADD_ON_NAME,
+} from '../../../../data/add-on-codes'
 
 export function PendingPlanChange({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   if (!subscription.pendingPlan) return null
 
-  const pendingPlan = subscription.pendingPlan as PendingRecurlyPlan
-
-  const hasAiAddon = subscription.addOns?.some(
-    addOn => addOn.addOnCode === AI_ADD_ON_CODE
-  )
-
-  const pendingAiAddonCancellation =
-    hasAiAddon &&
-    !pendingPlan.addOns?.some(addOn => addOn.add_on_code === AI_ADD_ON_CODE)
+  const pendingAiAddonCancellation = hasPendingAiAddonCancellation(subscription)
 
   const pendingAdditionalLicenses =
-    (subscription.recurly.pendingAdditionalLicenses &&
-      subscription.recurly.pendingAdditionalLicenses > 0) ||
-    subscription.recurly.additionalLicenses > 0
+    (subscription.payment.pendingAdditionalLicenses &&
+      subscription.payment.pendingAdditionalLicenses > 0) ||
+    subscription.payment.additionalLicenses > 0
 
   return (
     <>
@@ -49,8 +43,8 @@ export function PendingPlanChange({
             i18nKey="pending_additional_licenses"
             values={{
               pendingAdditionalLicenses:
-                subscription.recurly.pendingAdditionalLicenses,
-              pendingTotalLicenses: subscription.recurly.pendingTotalLicenses,
+                subscription.payment.pendingAdditionalLicenses,
+              pendingTotalLicenses: subscription.payment.pendingTotalLicenses,
             }}
             shouldUnescape
             tOptions={{ interpolation: { escapeValue: true } }}
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/active/subscription-remainder.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/active/subscription-remainder.tsx
index 16544e1507..3a7b3aa2e3 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/active/subscription-remainder.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/active/subscription-remainder.tsx
@@ -1,8 +1,8 @@
 import { Trans } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 
 type SubscriptionRemainderProps = {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
   hideTime?: boolean
 }
 
@@ -11,13 +11,13 @@ function SubscriptionRemainder({
   hideTime,
 }: SubscriptionRemainderProps) {
   const stillInATrial =
-    subscription.recurly.trialEndsAtFormatted &&
-    subscription.recurly.trial_ends_at &&
-    new Date(subscription.recurly.trial_ends_at).getTime() > Date.now()
+    subscription.payment.trialEndsAtFormatted &&
+    subscription.payment.trialEndsAt &&
+    new Date(subscription.payment.trialEndsAt).getTime() > Date.now()
 
   const terminationDate = hideTime
-    ? subscription.recurly.nextPaymentDueDate
-    : subscription.recurly.nextPaymentDueAt
+    ? subscription.payment.nextPaymentDueDate
+    : subscription.payment.nextPaymentDueAt
   return stillInATrial ? (
     <Trans
       i18nKey="subscription_will_remain_active_until_end_of_trial_period_x"
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/canceled.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/canceled.tsx
index 0904140434..12838970d2 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/canceled.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/canceled.tsx
@@ -1,14 +1,19 @@
 import { useTranslation, Trans } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../types/subscription/dashboard/subscription'
+import {
+  hasPendingAiAddonCancellation,
+  ADD_ON_NAME,
+} from '../../../data/add-on-codes'
 import ReactivateSubscription from '../reactivate-subscription'
 import OLButton from '@/features/ui/components/ol/ol-button'
 
 export function CanceledSubscription({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
+  const pendingAiAddonCancellation = hasPendingAiAddonCancellation(subscription)
 
   return (
     <>
@@ -26,11 +31,24 @@ export function CanceledSubscription({
           ]}
         />
       </p>
+      {pendingAiAddonCancellation && (
+        <p>
+          <Trans
+            i18nKey="pending_addon_cancellation"
+            values={{
+              addOnName: ADD_ON_NAME,
+            }}
+            shouldUnescape
+            tOptions={{ interpolation: { escapeValue: true } }}
+            components={{ strong: <strong /> }}
+          />
+        </p>
+      )}
       <p>
         <Trans
           i18nKey="subscription_canceled_and_terminate_on_x"
           values={{
-            terminateDate: subscription.recurly.nextPaymentDueAt,
+            terminateDate: subscription.payment.nextPaymentDueAt,
           }}
           shouldUnescape
           tOptions={{ interpolation: { escapeValue: true } }}
@@ -42,7 +60,7 @@ export function CanceledSubscription({
       </p>
       <p>
         <OLButton
-          href={subscription.recurly.accountManagementLink}
+          href={subscription.payment.accountManagementLink}
           target="_blank"
           variant="secondary"
           rel="noopener noreferrer"
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/states/expired.tsx b/services/web/frontend/js/features/subscription/components/dashboard/states/expired.tsx
index c72306324e..40b5e68e38 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/states/expired.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/states/expired.tsx
@@ -1,11 +1,11 @@
 import { useTranslation } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../types/subscription/dashboard/subscription'
 import OLButton from '@/features/ui/components/ol/ol-button'
 
 export function ExpiredSubscription({
   subscription,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }) {
   const { t } = useTranslation()
 
@@ -14,7 +14,7 @@ export function ExpiredSubscription({
       <p>{t('your_subscription_has_expired')}</p>
       <p>
         <OLButton
-          href={subscription.recurly.accountManagementLink}
+          href={subscription.payment.accountManagementLink}
           target="_blank"
           rel="noreferrer noopener"
           variant="secondary"
diff --git a/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx b/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx
index 6bb25065ea..b0f1b4122c 100644
--- a/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx
+++ b/services/web/frontend/js/features/subscription/components/dashboard/subscription-dashboard.tsx
@@ -14,6 +14,8 @@ import OLPageContentCard from '@/features/ui/components/ol/ol-page-content-card'
 import OLRow from '@/features/ui/components/ol/ol-row'
 import OLCol from '@/features/ui/components/ol/ol-col'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
+import WritefullManagedBundleAddOn from './states/active/change-plan/modals/writefull-bundle-management-modal'
+import RedirectAlerts from './redirect-alerts'
 
 function SubscriptionDashboard() {
   const { t } = useTranslation()
@@ -21,8 +23,10 @@ function SubscriptionDashboard() {
     hasDisplayedSubscription,
     hasSubscription,
     hasValidActiveSubscription,
+    personalSubscription,
   } = useSubscriptionDashboardContext()
 
+  const hasAiAssistViaWritefull = getMeta('ol-hasAiAssistViaWritefull')
   const fromPlansPage = getMeta('ol-fromPlansPage')
 
   return (
@@ -37,6 +41,7 @@ function SubscriptionDashboard() {
               type="warning"
             />
           )}
+          <RedirectAlerts />
           <OLPageContentCard>
             <div className="page-header">
               <h1>{t('your_subscription')}</h1>
@@ -49,7 +54,15 @@ function SubscriptionDashboard() {
               <ManagedPublishers />
               <GroupSubscriptionMemberships />
               <InstitutionMemberships />
-              {hasValidActiveSubscription && <PremiumFeaturesLink />}
+              {!personalSubscription && hasAiAssistViaWritefull && (
+                <div className="mb-4">
+                  <h2 className="h3 fw-bold">{t('add_ons')}</h2>
+                  <WritefullManagedBundleAddOn />
+                </div>
+              )}
+              {hasValidActiveSubscription && (
+                <PremiumFeaturesLink subscription={personalSubscription} />
+              )}
               {!hasDisplayedSubscription &&
                 (hasSubscription ? <ContactSupport /> : <FreePlan />)}
             </div>
diff --git a/services/web/frontend/js/features/subscription/components/group-invite/group-invite.tsx b/services/web/frontend/js/features/subscription/components/group-invite/group-invite.tsx
index a4e8fb2da8..66b6288388 100644
--- a/services/web/frontend/js/features/subscription/components/group-invite/group-invite.tsx
+++ b/services/web/frontend/js/features/subscription/components/group-invite/group-invite.tsx
@@ -19,20 +19,20 @@ export type InviteViewTypes =
   | undefined
 
 function GroupInviteViews() {
-  const hasIndividualRecurlySubscription = getMeta(
-    'ol-hasIndividualRecurlySubscription'
+  const hasIndividualPaidSubscription = getMeta(
+    'ol-hasIndividualPaidSubscription'
   )
   const cannotJoinSubscription = getMeta('ol-cannot-join-subscription')
 
   useEffect(() => {
     if (cannotJoinSubscription) {
       setView('managed-user-cannot-join')
-    } else if (hasIndividualRecurlySubscription) {
+    } else if (hasIndividualPaidSubscription) {
       setView('cancel-personal-subscription')
     } else {
       setView('invite')
     }
-  }, [cannotJoinSubscription, hasIndividualRecurlySubscription])
+  }, [cannotJoinSubscription, hasIndividualPaidSubscription])
   const [view, setView] = useState<InviteViewTypes>(undefined)
 
   if (!view) {
diff --git a/services/web/frontend/js/features/subscription/components/preview-subscription-change/root.tsx b/services/web/frontend/js/features/subscription/components/preview-subscription-change/root.tsx
index 4d5746a411..a7cd0aeb5c 100644
--- a/services/web/frontend/js/features/subscription/components/preview-subscription-change/root.tsx
+++ b/services/web/frontend/js/features/subscription/components/preview-subscription-change/root.tsx
@@ -1,4 +1,4 @@
-import { useCallback } from 'react'
+import { useCallback, useEffect } from 'react'
 import moment from 'moment'
 import { useTranslation, Trans } from 'react-i18next'
 import {
@@ -11,8 +11,7 @@ import { formatCurrency } from '@/shared/utils/currency'
 import useAsync from '@/shared/hooks/use-async'
 import { useLocation } from '@/shared/hooks/use-location'
 import { debugConsole } from '@/utils/debugging'
-import { postJSON } from '@/infrastructure/fetch-json'
-import Notification from '@/shared/components/notification'
+import { FetchError, postJSON } from '@/infrastructure/fetch-json'
 import OLCard from '@/features/ui/components/ol/ol-card'
 import OLRow from '@/features/ui/components/ol/ol-row'
 import OLCol from '@/features/ui/components/ol/ol-col'
@@ -20,24 +19,54 @@ import OLButton from '@/features/ui/components/ol/ol-button'
 import { subscriptionUpdateUrl } from '@/features/subscription/data/subscription-url'
 import * as eventTracking from '@/infrastructure/event-tracking'
 import sparkleText from '@/shared/svgs/ai-sparkle-text.svg'
+import { useFeatureFlag } from '@/shared/context/split-test-context'
+import PaymentErrorNotification from '@/features/subscription/components/shared/payment-error-notification'
+import handleStripePaymentAction from '../../util/handle-stripe-payment-action'
 
 function PreviewSubscriptionChange() {
   const preview = getMeta(
     'ol-subscriptionChangePreview'
   ) as SubscriptionChangePreview
+  const purchaseReferrer = getMeta('ol-purchaseReferrer')
   const { t } = useTranslation()
   const payNowTask = useAsync()
   const location = useLocation()
+  const aiAssistEnabled = useFeatureFlag('overleaf-assist-bundle')
+
+  useEffect(() => {
+    if (preview.change.type === 'add-on-purchase') {
+      eventTracking.sendMB('preview-subscription-change-view', {
+        plan: preview.change.addOn.code,
+        upgradeType: 'add-on',
+        referrer: purchaseReferrer,
+      })
+    }
+  }, [preview.change, purchaseReferrer])
 
   const handlePayNowClick = useCallback(() => {
+    if (preview.change.type === 'add-on-purchase') {
+      eventTracking.sendMB('subscription-change-form-submit', {
+        plan: preview.change.addOn.code,
+        upgradeType: 'add-on',
+        referrer: purchaseReferrer,
+      })
+    }
+
     eventTracking.sendMB('assistant-add-on-purchase')
     payNowTask
       .runAsync(payNow(preview))
       .then(() => {
+        if (preview.change.type === 'add-on-purchase') {
+          eventTracking.sendMB('subscription-change-form-success', {
+            plan: preview.change.addOn.code,
+            upgradeType: 'add-on',
+            referrer: purchaseReferrer,
+          })
+        }
         location.replace('/user/subscription/thank-you')
       })
       .catch(debugConsole.error)
-  }, [location, payNowTask, preview])
+  }, [purchaseReferrer, location, payNowTask, preview])
 
   const aiAddOnChange =
     preview.change.type === 'add-on-purchase' &&
@@ -67,34 +96,44 @@ function PreviewSubscriptionChange() {
             ) : null}
 
             {payNowTask.isError && (
-              <Notification
-                type="error"
-                aria-live="polite"
-                content={
-                  <>
-                    {t('generic_something_went_wrong')}. {t('try_again')}.{' '}
-                    {t('generic_if_problem_continues_contact_us')}.
-                  </>
-                }
+              <PaymentErrorNotification
+                error={payNowTask.error as FetchError}
               />
             )}
 
             {aiAddOnChange && (
               <div>
-                <Trans
-                  i18nKey="add_error_assist_to_your_projects"
-                  components={{
-                    sparkle: (
-                      <img
-                        alt="sparkle"
-                        className="ai-error-assistant-sparkle"
-                        src={sparkleText}
-                        aria-hidden="true"
-                        key="sparkle"
-                      />
-                    ),
-                  }}
-                />
+                {aiAssistEnabled ? (
+                  <Trans
+                    i18nKey="add_ai_assist_to_your_plan"
+                    components={{
+                      sparkle: (
+                        <img
+                          alt="sparkle"
+                          className="ai-error-assistant-sparkle"
+                          src={sparkleText}
+                          aria-hidden="true"
+                          key="sparkle"
+                        />
+                      ),
+                    }}
+                  />
+                ) : (
+                  <Trans
+                    i18nKey="add_error_assist_to_your_projects"
+                    components={{
+                      sparkle: (
+                        <img
+                          alt="sparkle"
+                          className="ai-error-assistant-sparkle"
+                          src={sparkleText}
+                          aria-hidden="true"
+                          key="sparkle"
+                        />
+                      ),
+                    }}
+                  />
+                )}
               </div>
             )}
 
@@ -234,16 +273,25 @@ function PreviewSubscriptionChange() {
 }
 
 async function payNow(preview: SubscriptionChangePreview) {
-  if (preview.change.type === 'add-on-purchase') {
-    await postJSON(`/user/subscription/addon/${preview.change.addOn.code}/add`)
-  } else if (preview.change.type === 'premium-subscription') {
-    await postJSON(subscriptionUpdateUrl, {
-      body: { plan_code: preview.change.plan.code },
-    })
-  } else {
-    throw new Error(
-      `Unknown subscription change preview type: ${preview.change}`
-    )
+  try {
+    if (preview.change.type === 'add-on-purchase') {
+      await postJSON(
+        `/user/subscription/addon/${preview.change.addOn.code}/add`
+      )
+    } else if (preview.change.type === 'premium-subscription') {
+      await postJSON(subscriptionUpdateUrl, {
+        body: { plan_code: preview.change.plan.code },
+      })
+    } else {
+      throw new Error(
+        `Unknown subscription change preview type: ${preview.change}`
+      )
+    }
+  } catch (e) {
+    const { handled } = await handleStripePaymentAction(e as FetchError)
+    if (!handled) {
+      throw e
+    }
   }
 }
 
diff --git a/services/web/frontend/js/features/subscription/components/shared/payment-error-notification.tsx b/services/web/frontend/js/features/subscription/components/shared/payment-error-notification.tsx
new file mode 100644
index 0000000000..a727be6e51
--- /dev/null
+++ b/services/web/frontend/js/features/subscription/components/shared/payment-error-notification.tsx
@@ -0,0 +1,66 @@
+import { FetchError } from '@/infrastructure/fetch-json'
+import { Trans } from 'react-i18next'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+import { billingPortalUrl } from '../../data/subscription-url'
+
+type Props = {
+  error: FetchError | null
+}
+
+export default function PaymentErrorNotification({ error }: Props) {
+  if (!error) {
+    return
+  }
+
+  let message
+  switch (error.data?.adviceCode) {
+    case 'try_again_later':
+      message = (
+        <Trans
+          i18nKey="payment_error_intermittent_error"
+          components={[
+            /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
+            <a href="/contact" target="_blank" />,
+          ]}
+        />
+      )
+      break
+    case 'do_not_try_again':
+    case 'confirm_card_data':
+      message = (
+        <Trans
+          i18nKey="payment_error_update_payment_method"
+          components={[
+            /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
+            <a href={billingPortalUrl} />,
+          ]}
+        />
+      )
+      break
+    default:
+      // clientSecret indicates they needed to pass a 3DS challenge
+      if (error.data?.clientSecret) {
+        message = (
+          <Trans
+            i18nKey="payment_error_3ds_failed"
+            components={[
+              /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
+              <a href="/contact" target="_blank" />,
+            ]}
+          />
+        )
+      } else {
+        message = (
+          <Trans
+            i18nKey="payment_error_generic"
+            components={[
+              /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */
+              <a href="/contact" target="_blank" />,
+            ]}
+          />
+        )
+      }
+  }
+
+  return <OLNotification type="error" aria-live="polite" content={message} />
+}
diff --git a/services/web/frontend/js/features/subscription/components/shared/price-exceptions.tsx b/services/web/frontend/js/features/subscription/components/shared/price-exceptions.tsx
index b8cec5b8d1..8c08f6bbb7 100644
--- a/services/web/frontend/js/features/subscription/components/shared/price-exceptions.tsx
+++ b/services/web/frontend/js/features/subscription/components/shared/price-exceptions.tsx
@@ -1,13 +1,13 @@
 import { useTranslation } from 'react-i18next'
-import { RecurlySubscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../types/subscription/dashboard/subscription'
 
 type PriceExceptionsProps = {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
 }
 
 export function PriceExceptions({ subscription }: PriceExceptionsProps) {
   const { t } = useTranslation()
-  const { activeCoupons } = subscription.recurly
+  const { activeCoupons } = subscription.payment
 
   return (
     <>
@@ -19,7 +19,7 @@ export function PriceExceptions({ subscription }: PriceExceptionsProps) {
           <i>* {t('coupons_not_included')}:</i>
           <ul>
             {activeCoupons.map(coupon => (
-              <li key={coupon.id}>
+              <li key={coupon.code}>
                 <i>{coupon.description || coupon.name}</i>
               </li>
             ))}
diff --git a/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx b/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx
index f7ef400ded..437ac2928e 100644
--- a/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx
+++ b/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx
@@ -1,3 +1,4 @@
+import { UserProvider } from '@/shared/context/user-context'
 import useWaitForI18n from '../../../../shared/hooks/use-wait-for-i18n'
 import { SubscriptionDashboardProvider } from '../../context/subscription-dashboard-context'
 import SuccessfulSubscription from './successful-subscription'
@@ -13,7 +14,9 @@ function Root() {
   return (
     <SplitTestProvider>
       <SubscriptionDashboardProvider>
-        <SuccessfulSubscription />
+        <UserProvider>
+          <SuccessfulSubscription />
+        </UserProvider>
       </SubscriptionDashboardProvider>
     </SplitTestProvider>
   )
diff --git a/services/web/frontend/js/features/subscription/components/successful-subscription/successful-subscription.tsx b/services/web/frontend/js/features/subscription/components/successful-subscription/successful-subscription.tsx
index 3c64846db0..68d57f57fb 100644
--- a/services/web/frontend/js/features/subscription/components/successful-subscription/successful-subscription.tsx
+++ b/services/web/frontend/js/features/subscription/components/successful-subscription/successful-subscription.tsx
@@ -12,7 +12,8 @@ import {
   ADD_ON_NAME,
   isStandaloneAiPlanCode,
 } from '../../data/add-on-codes'
-import { RecurlySubscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../types/subscription/dashboard/subscription'
+import { useBroadcastUser } from '@/shared/hooks/user-channel/use-broadcast-user'
 
 function SuccessfulSubscription() {
   const { t } = useTranslation()
@@ -20,8 +21,9 @@ function SuccessfulSubscription() {
     useSubscriptionDashboardContext()
   const postCheckoutRedirect = getMeta('ol-postCheckoutRedirect')
   const { appName, adminEmail } = getMeta('ol-ExposedSettings')
+  useBroadcastUser()
 
-  if (!subscription || !('recurly' in subscription)) return null
+  if (!subscription || !('payment' in subscription)) return null
 
   const onAiStandalonePlan = isStandaloneAiPlanCode(subscription.planCode)
 
@@ -37,15 +39,15 @@ function SuccessfulSubscription() {
               type="success"
               content={
                 <>
-                  {subscription.recurly.trial_ends_at && (
+                  {subscription.payment.trialEndsAt && (
                     <>
                       <p>
                         <Trans
                           i18nKey="next_payment_of_x_collectected_on_y"
                           values={{
-                            paymentAmmount: subscription.recurly.displayPrice,
+                            paymentAmmount: subscription.payment.displayPrice,
                             collectionDate:
-                              subscription.recurly.nextPaymentDueAt,
+                              subscription.payment.nextPaymentDueAt,
                           }}
                           shouldUnescape
                           tOptions={{ interpolation: { escapeValue: true } }}
@@ -78,7 +80,7 @@ function SuccessfulSubscription() {
               subscription={subscription}
               onAiStandalonePlan={onAiStandalonePlan}
             />
-            {!onAiStandalonePlan && <PremiumFeaturesLink />}
+            <PremiumFeaturesLink subscription={subscription} />
             <p>
               {t('need_anything_contact_us_at')}&nbsp;
               <a href={`mailto:${adminEmail}`} rel="noopener noreferrer">
@@ -112,7 +114,7 @@ function SuccessfulSubscription() {
                 href={postCheckoutRedirect || '/project'}
                 rel="noopener noreferrer"
               >
-                &lt; {t('back_to_your_projects')}
+                {t('back_to_your_projects')}
               </a>
             </p>
           </OLPageContentCard>
@@ -126,7 +128,7 @@ function ThankYouSection({
   subscription,
   onAiStandalonePlan,
 }: {
-  subscription: RecurlySubscription
+  subscription: PaidSubscription
   onAiStandalonePlan: boolean
 }) {
   const { t } = useTranslation()
diff --git a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx
index 47d8762955..0dda7dce89 100644
--- a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx
+++ b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx
@@ -12,7 +12,7 @@ import {
   CustomSubscription,
   ManagedGroupSubscription,
   MemberGroupSubscription,
-  RecurlySubscription,
+  PaidSubscription,
 } from '../../../../../types/subscription/dashboard/subscription'
 import {
   Plan,
@@ -22,7 +22,8 @@ import { Institution } from '../../../../../types/institution'
 import getMeta from '../../../utils/meta'
 import {
   loadDisplayPriceWithTaxPromise,
-  loadGroupDisplayPriceWithTaxPromise,
+  loadGroupDisplayPriceWithTaxForRecurlyPromise,
+  loadGroupDisplayPriceWithTaxForStripePromise,
 } from '../util/recurly-pricing'
 import { isRecurlyLoaded } from '../util/is-recurly-loaded'
 import { SubscriptionDashModalIds } from '../../../../../types/subscription/dashboard/modal-ids'
@@ -52,7 +53,7 @@ type SubscriptionDashboardContextValue = {
   managedPublishers: Publisher[]
   updateManagedInstitution: (institution: ManagedInstitution) => void
   modalIdShown?: SubscriptionDashModalIds
-  personalSubscription?: RecurlySubscription | CustomSubscription
+  personalSubscription?: PaidSubscription | CustomSubscription
   hasSubscription: boolean
   plans: Plan[]
   planCodeToChangeTo?: string
@@ -136,21 +137,21 @@ export function SubscriptionDashboardProvider({
   )
 
   const hasValidActiveSubscription = Boolean(
-    ['active', 'canceled'].includes(personalSubscription?.recurly?.state) ||
+    ['active', 'canceled'].includes(personalSubscription?.payment?.state) ||
       institutionMemberships?.length > 0 ||
       memberGroupSubscriptions?.length > 0
   )
 
   const getFormattedRenewalDate = useCallback(() => {
     if (
-      !personalSubscription.recurly.pausedAt ||
-      !personalSubscription.recurly.remainingPauseCycles
+      !personalSubscription.payment.pausedAt ||
+      !personalSubscription.payment.remainingPauseCycles
     ) {
-      return personalSubscription.recurly.nextPaymentDueAt
+      return personalSubscription.payment.nextPaymentDueAt
     }
-    const pausedDate = new Date(personalSubscription.recurly.pausedAt)
+    const pausedDate = new Date(personalSubscription.payment.pausedAt)
     pausedDate.setMonth(
-      pausedDate.getMonth() + personalSubscription.recurly.remainingPauseCycles
+      pausedDate.getMonth() + personalSubscription.payment.remainingPauseCycles
     )
     return formatTime(pausedDate, 'MMMM Do, YYYY')
   }, [personalSubscription])
@@ -167,9 +168,9 @@ export function SubscriptionDashboardProvider({
     if (
       isRecurlyLoaded() &&
       plansWithoutDisplayPrice &&
-      personalSubscription?.recurly
+      personalSubscription?.payment
     ) {
-      const { currency, taxRate } = personalSubscription.recurly
+      const { currency, taxRate } = personalSubscription.payment
       const fetchPlansDisplayPrices = async () => {
         for (const plan of plansWithoutDisplayPrice) {
           try {
@@ -199,36 +200,46 @@ export function SubscriptionDashboardProvider({
 
   useEffect(() => {
     if (
-      isRecurlyLoaded() &&
-      groupPlanToChangeToCode &&
-      groupPlanToChangeToSize &&
-      groupPlanToChangeToUsage &&
-      personalSubscription?.recurly
+      !groupPlanToChangeToCode ||
+      !groupPlanToChangeToSize ||
+      !groupPlanToChangeToUsage ||
+      !personalSubscription?.payment
     ) {
-      setQueryingGroupPlanToChangeToPrice(true)
-
-      const { currency, taxRate } = personalSubscription.recurly
-      const fetchGroupDisplayPrice = async () => {
-        setGroupPlanToChangeToPriceError(false)
-        let priceData
-        try {
-          priceData = await loadGroupDisplayPriceWithTaxPromise(
-            groupPlanToChangeToCode,
-            currency,
-            taxRate,
-            groupPlanToChangeToSize,
-            groupPlanToChangeToUsage,
-            i18n.language
-          )
-        } catch (e) {
-          debugConsole.error(e)
-          setGroupPlanToChangeToPriceError(true)
-        }
-        setQueryingGroupPlanToChangeToPrice(false)
-        setGroupPlanToChangeToPrice(priceData)
-      }
-      fetchGroupDisplayPrice()
+      return
     }
+
+    let loadGroupDisplayPrice
+    if (personalSubscription.service?.includes('stripe')) {
+      loadGroupDisplayPrice = loadGroupDisplayPriceWithTaxForStripePromise
+    } else if (isRecurlyLoaded()) {
+      loadGroupDisplayPrice = loadGroupDisplayPriceWithTaxForRecurlyPromise
+    } else {
+      return
+    }
+
+    setQueryingGroupPlanToChangeToPrice(true)
+
+    const { currency, taxRate } = personalSubscription.payment
+    const fetchGroupDisplayPrice = async () => {
+      setGroupPlanToChangeToPriceError(false)
+      let priceData
+      try {
+        priceData = await loadGroupDisplayPrice(
+          groupPlanToChangeToCode,
+          currency,
+          taxRate,
+          groupPlanToChangeToSize,
+          groupPlanToChangeToUsage,
+          i18n.language
+        )
+      } catch (e) {
+        debugConsole.error(e)
+        setGroupPlanToChangeToPriceError(true)
+      }
+      setQueryingGroupPlanToChangeToPrice(false)
+      setGroupPlanToChangeToPrice(priceData)
+    }
+    fetchGroupDisplayPrice()
   }, [
     groupPlanToChangeToUsage,
     groupPlanToChangeToSize,
@@ -256,7 +267,7 @@ export function SubscriptionDashboardProvider({
   }, [setModalIdShown, setPlanCodeToChangeTo])
 
   const handleOpenModal = useCallback(
-    (id, planCode) => {
+    (id: SubscriptionDashModalIds, planCode?: string) => {
       setModalIdShown(id)
       setPlanCodeToChangeTo(planCode)
     },
diff --git a/services/web/frontend/js/features/subscription/data/add-on-codes.ts b/services/web/frontend/js/features/subscription/data/add-on-codes.ts
index 52d47f98b9..4ee7a65b22 100644
--- a/services/web/frontend/js/features/subscription/data/add-on-codes.ts
+++ b/services/web/frontend/js/features/subscription/data/add-on-codes.ts
@@ -1,9 +1,32 @@
-export const AI_STANDALONE_PLAN_CODE = 'assistant'
+import { PaidSubscription } from "../../../../../types/subscription/dashboard/subscription"
+import { PendingPaymentProviderPlan } from "../../../../../types/subscription/plan"
+
+export const AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE = 'assistant'
 export const AI_ADD_ON_CODE = 'assistant'
 // we dont want translations on plan or add-on names
-export const ADD_ON_NAME = "Error Assist"
-export const AI_STANDALONE_ANNUAL_PLAN_CODE = 'assistant-annual'
+export const ADD_ON_NAME = "AI Assist"
+export const AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE = 'assistant-annual'
 
-export function isStandaloneAiPlanCode(planCode: string) {
-  return planCode === AI_STANDALONE_PLAN_CODE || planCode === AI_STANDALONE_ANNUAL_PLAN_CODE
+export function isStandaloneAiPlanCode(planCode?: string) {
+  return planCode === AI_ASSIST_STANDALONE_MONTHLY_PLAN_CODE || planCode === AI_ASSIST_STANDALONE_ANNUAL_PLAN_CODE
 }
+
+
+
+export function hasPendingAiAddonCancellation(subscription: PaidSubscription){
+
+  const pendingPlan = subscription.pendingPlan as PendingPaymentProviderPlan
+
+  const hasAiAddon = subscription.addOns?.some(
+    addOn => addOn.addOnCode === AI_ADD_ON_CODE
+  )
+
+  // cancellation of entire plan counts as removing the add-on
+  if(hasAiAddon && !pendingPlan){
+    return true
+  }
+
+  return hasAiAddon &&
+    !pendingPlan.addOns?.some(addOn => addOn.code === AI_ADD_ON_CODE)
+    
+}
\ No newline at end of file
diff --git a/services/web/frontend/js/features/subscription/data/subscription-url.ts b/services/web/frontend/js/features/subscription/data/subscription-url.ts
index 9dc294b4f6..b26c635a05 100644
--- a/services/web/frontend/js/features/subscription/data/subscription-url.ts
+++ b/services/web/frontend/js/features/subscription/data/subscription-url.ts
@@ -4,4 +4,5 @@ export const cancelPendingSubscriptionChangeUrl =
 export const cancelSubscriptionUrl = '/user/subscription/cancel'
 export const redirectAfterCancelSubscriptionUrl = '/user/subscription/canceled'
 export const extendTrialUrl = '/user/subscription/extend'
-export const reactivateSubscriptionUrl = '/user/subscription/reactivate'
\ No newline at end of file
+export const reactivateSubscriptionUrl = '/user/subscription/reactivate'
+export const billingPortalUrl = '/user/subscription/payment/account-management'
diff --git a/services/web/frontend/js/features/subscription/util/handle-stripe-payment-action.ts b/services/web/frontend/js/features/subscription/util/handle-stripe-payment-action.ts
new file mode 100644
index 0000000000..9912c39f89
--- /dev/null
+++ b/services/web/frontend/js/features/subscription/util/handle-stripe-payment-action.ts
@@ -0,0 +1,27 @@
+import { FetchError, postJSON } from '@/infrastructure/fetch-json'
+import { loadStripe } from '@stripe/stripe-js/pure'
+
+export default async function handleStripePaymentAction(
+  error: FetchError
+): Promise<{ handled: boolean }> {
+  const clientSecret = error?.data?.clientSecret
+  const publicKey = error?.data?.publicKey
+
+  if (clientSecret && publicKey) {
+    const stripe = await loadStripe(publicKey)
+    if (stripe) {
+      const manualConfirmationFlow =
+        await stripe.confirmCardPayment(clientSecret)
+      if (!manualConfirmationFlow.error) {
+        try {
+          await postJSON(`/user/subscription/sync`)
+        } catch (error) {
+          // if the sync fails, there may be stale data until the webhook is
+          // processed but we can't do any special handling for that in here
+        }
+        return { handled: true }
+      }
+    }
+  }
+  return { handled: false }
+}
diff --git a/services/web/frontend/js/features/subscription/util/is-monthly-collaborator-plan.ts b/services/web/frontend/js/features/subscription/util/is-monthly-collaborator-plan.ts
deleted file mode 100644
index 550c5ec2a5..0000000000
--- a/services/web/frontend/js/features/subscription/util/is-monthly-collaborator-plan.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export default function isMonthlyCollaboratorPlan(
-  planCode: string,
-  isGroupPlan?: boolean
-) {
-  return (
-    planCode.indexOf('collaborator') !== -1 &&
-    planCode.indexOf('ann') === -1 &&
-    !isGroupPlan
-  )
-}
diff --git a/services/web/frontend/js/features/subscription/util/recurly-group-plan-code.ts b/services/web/frontend/js/features/subscription/util/recurly-group-plan-code.ts
index 3d52d5bcdb..a43a4b3901 100644
--- a/services/web/frontend/js/features/subscription/util/recurly-group-plan-code.ts
+++ b/services/web/frontend/js/features/subscription/util/recurly-group-plan-code.ts
@@ -5,3 +5,11 @@ export function getRecurlyGroupPlanCode(
 ) {
   return `group_${planCode}_${size}_${usage}`
 }
+
+export function getConsolidatedGroupPlanCode(planCode: string, usage: string) {
+  if (usage === 'enterprise') {
+    return `group_${planCode}`
+  }
+
+  return `group_${planCode}_${usage}`
+}
diff --git a/services/web/frontend/js/features/subscription/util/recurly-pricing.ts b/services/web/frontend/js/features/subscription/util/recurly-pricing.ts
index 584174da1a..5a1911169a 100644
--- a/services/web/frontend/js/features/subscription/util/recurly-pricing.ts
+++ b/services/web/frontend/js/features/subscription/util/recurly-pricing.ts
@@ -1,9 +1,15 @@
 import { SubscriptionPricingState } from '@recurly/recurly-js'
 import { PriceForDisplayData } from '../../../../../types/subscription/plan'
 import { CurrencyCode } from '../../../../../types/subscription/currency'
-import { getRecurlyGroupPlanCode } from './recurly-group-plan-code'
+import {
+  getRecurlyGroupPlanCode,
+  getConsolidatedGroupPlanCode,
+} from './recurly-group-plan-code'
 import { debugConsole } from '@/utils/debugging'
 import { formatCurrency } from '@/shared/utils/currency'
+import { getJSON } from '../../../infrastructure/fetch-json'
+
+let groupPlanPerUserPrices: Record<string, number> | undefined
 
 function queryRecurlyPlanPrice(planCode: string, currency: CurrencyCode) {
   return new Promise(resolve => {
@@ -73,7 +79,7 @@ export async function loadDisplayPriceWithTaxPromise(
     )
 }
 
-export async function loadGroupDisplayPriceWithTaxPromise(
+export async function loadGroupDisplayPriceWithTaxForRecurlyPromise(
   groupPlanCode: string,
   currencyCode: CurrencyCode,
   taxRate: number,
@@ -102,3 +108,44 @@ export async function loadGroupDisplayPriceWithTaxPromise(
 
   return price
 }
+
+export async function loadGroupDisplayPriceWithTaxForStripePromise(
+  groupPlanCode: string,
+  currencyCode: CurrencyCode,
+  taxRate: number,
+  size: string,
+  usage: string,
+  locale: string
+) {
+  if (!groupPlanPerUserPrices) {
+    groupPlanPerUserPrices = await getJSON<Record<string, number>>(
+      `/user/subscription/group/group-plan-per-user-prices?currency=${currencyCode}`
+    )
+  }
+
+  const planCode = getConsolidatedGroupPlanCode(groupPlanCode, usage)
+
+  if (!(planCode in groupPlanPerUserPrices)) {
+    throw new Error(
+      `Group plan code ${planCode} not found in groupPlanPerUserPrices`
+    )
+  }
+
+  const subtotalPrice = groupPlanPerUserPrices[planCode] * parseInt(size)
+
+  const result = formatPriceForDisplayData(
+    subtotalPrice.toString(),
+    taxRate,
+    currencyCode,
+    locale
+  )
+
+  result.perUserDisplayPrice = formatCurrency(
+    groupPlanPerUserPrices[planCode],
+    currencyCode,
+    locale,
+    true
+  )
+
+  return result
+}
diff --git a/services/web/frontend/js/features/subscription/util/show-downgrade-option.ts b/services/web/frontend/js/features/subscription/util/show-downgrade-option.ts
deleted file mode 100644
index 283823f481..0000000000
--- a/services/web/frontend/js/features/subscription/util/show-downgrade-option.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import { Nullable } from '../../../../../types/utils'
-import isInFreeTrial from './is-in-free-trial'
-import isMonthlyCollaboratorPlan from './is-monthly-collaborator-plan'
-
-export default function showDowngradeOption(
-  planCode: string,
-  isGroupPlan?: boolean,
-  trialEndsAt?: string | null,
-  pausedAt?: Nullable<string>,
-  remainingPauseCycles?: Nullable<number>
-) {
-  return (
-    !pausedAt &&
-    !remainingPauseCycles &&
-    isMonthlyCollaboratorPlan(planCode, isGroupPlan) &&
-    !isInFreeTrial(trialEndsAt)
-  )
-}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-body.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-body.js
new file mode 100644
index 0000000000..3f9eb7fc5f
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-body.js
@@ -0,0 +1,76 @@
+import { useTranslation } from 'react-i18next'
+import PropTypes from 'prop-types'
+import SymbolPaletteItems from './symbol-palette-items'
+
+export default function SymbolPaletteBody({
+  categories,
+  categorisedSymbols,
+  filteredSymbols,
+  handleSelect,
+  focusInput,
+  activeCategoryId,
+}) {
+  const { t } = useTranslation()
+
+  // searching with matches: show the matched symbols
+  // searching with no matches: show a message
+  // note: include empty tab panels so that aria-controls on tabs can still reference the panel ids
+  if (filteredSymbols) {
+    return (
+      <div className="symbol-palette-panels">
+        {filteredSymbols.length ? (
+          <SymbolPaletteItems
+            items={filteredSymbols}
+            handleSelect={handleSelect}
+            focusInput={focusInput}
+          />
+        ) : (
+          <div className="symbol-palette-empty">{t('no_symbols_found')}</div>
+        )}
+
+        {categories.map(category => (
+          <div
+            key={category.id}
+            role="tabpanel"
+            className="symbol-palette-panel"
+            id={`symbol-palette-panel-${category.id}`}
+            aria-labelledby={`symbol-palette-tab-${category.id}`}
+            hidden
+          />
+        ))}
+      </div>
+    )
+  }
+
+  // not searching: show the symbols grouped by category
+  return (
+    <div className="symbol-palette-panels">
+      {categories.map((category) => (
+        <div
+          key={category.id}
+          id={`symbol-palette-panel-${category.id}`}
+          className="symbol-palette-panel"
+          role="tabpanel"
+          aria-labelledby={`symbol-palette-tab-${category.id}`}
+          hidden={category.id !== activeCategoryId}
+        >
+          <SymbolPaletteItems
+            items={categorisedSymbols[category.id]}
+            handleSelect={handleSelect}
+            focusInput={focusInput}
+          />
+        </div>
+      ))}
+    </div>
+  )
+
+
+}
+SymbolPaletteBody.propTypes = {
+  categories: PropTypes.arrayOf(PropTypes.object).isRequired,
+  categorisedSymbols: PropTypes.object,
+  filteredSymbols: PropTypes.arrayOf(PropTypes.object),
+  handleSelect: PropTypes.func.isRequired,
+  focusInput: PropTypes.func.isRequired,
+  activeCategoryId: PropTypes.string.isRequired,
+}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-close-button.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-close-button.js
new file mode 100644
index 0000000000..98b4a447fb
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-close-button.js
@@ -0,0 +1,29 @@
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
+import { useTranslation } from 'react-i18next'
+import PropTypes from 'prop-types'
+
+export default function SymbolPaletteCloseButton() {
+  const { toggleSymbolPalette } = useEditorPropertiesContext()
+  const { t } = useTranslation()
+
+  const handleClick = () => {
+    toggleSymbolPalette()
+    window.dispatchEvent(new CustomEvent('editor:focus'))
+  }
+
+  return (
+    <div className="symbol-palette-close-button-outer">
+      <button
+        type="button"
+        className="btn-close symbol-palette-close-button"
+        onClick={handleClick}
+        aria-label={t('close')}
+      >
+      </button>
+    </div>
+  )
+}
+
+SymbolPaletteCloseButton.propTypes = {
+  focusInput: PropTypes.func,
+}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-content.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-content.js
new file mode 100644
index 0000000000..b395cac53d
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-content.js
@@ -0,0 +1,94 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import PropTypes from 'prop-types'
+import { matchSorter } from 'match-sorter'
+import symbols from '../data/symbols.json'
+import { buildCategorisedSymbols, createCategories } from '../utils/categories'
+import SymbolPaletteSearch from './symbol-palette-search'
+import SymbolPaletteBody from './symbol-palette-body'
+import SymbolPaletteTabs from './symbol-palette-tabs'
+import SymbolPaletteCloseButton from './symbol-palette-close-button'
+
+export default function SymbolPaletteContent({ handleSelect }) {
+  const [input, setInput] = useState('')
+
+  const { t } = useTranslation()
+
+  // build the list of categories with translated labels
+  const categories = useMemo(() => createCategories(t), [t])
+  const [activeCategoryId, setActiveCategoryId] = useState(categories[0]?.id)
+
+  // group the symbols by category
+  const categorisedSymbols = useMemo(
+    () => buildCategorisedSymbols(categories),
+    [categories]
+  )
+
+  // select symbols which match the input
+  const filteredSymbols = useMemo(() => {
+    if (input === '') {
+      return null
+    }
+
+    const words = input.trim().split(/\s+/)
+
+    return words.reduceRight(
+      (symbols, word) =>
+        matchSorter(symbols, word, {
+          keys: ['command', 'description', 'character', 'aliases'],
+          threshold: matchSorter.rankings.CONTAINS,
+        }),
+      symbols
+    )
+  }, [input])
+
+  const inputRef = useRef(null)
+
+  // allow the input to be focused
+  const focusInput = useCallback(() => {
+    if (inputRef.current) {
+      inputRef.current.focus()
+    }
+  }, [])
+
+  // focus the input when the symbol palette is opened
+  useEffect(() => {
+    if (inputRef.current) {
+      inputRef.current.focus()
+    }
+  }, [])
+  return (
+    <div className="symbol-palette-container">
+      <div className="symbol-palette">
+        <div className="symbol-palette-header-outer">
+          <div className="symbol-palette-header">
+            <SymbolPaletteTabs 
+              categories={categories} 
+              activeCategoryId={activeCategoryId}
+              setActiveCategoryId={setActiveCategoryId}
+            />
+            <div className="symbol-palette-header-group">
+              <SymbolPaletteSearch setInput={setInput} inputRef={inputRef} />
+            </div>
+          </div>
+          <div className="symbol-palette-header-group">
+            <SymbolPaletteCloseButton />
+          </div>
+        </div>
+        <div className="symbol-palette-body">
+          <SymbolPaletteBody
+            categories={categories}
+            categorisedSymbols={categorisedSymbols}
+            filteredSymbols={filteredSymbols}
+            handleSelect={handleSelect}
+            focusInput={focusInput}
+            activeCategoryId={activeCategoryId}
+          />
+        </div>
+      </div>
+    </div>
+  )
+}
+SymbolPaletteContent.propTypes = {
+  handleSelect: PropTypes.func.isRequired,
+}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-item.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-item.js
new file mode 100644
index 0000000000..400da81b1e
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-item.js
@@ -0,0 +1,84 @@
+import { useEffect, useRef, forwardRef } from 'react'
+import PropTypes from 'prop-types'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+
+const SymbolPaletteItem = forwardRef(function ({ 
+  focused,
+  handleSelect,
+  handleKeyDown,
+  symbol,
+}, ref) {
+  const buttonRef = useRef(null)
+
+  // Forward internal ref to parent
+  useEffect(() => {
+    if (ref) {
+      if (typeof ref === 'function') {
+        ref(buttonRef.current)
+      } else {
+        ref.current = buttonRef.current
+      }
+    }
+  }, [ref])
+
+  // Focus the item when it becomes focused
+  useEffect(() => {
+    if (
+      focused &&
+      buttonRef.current &&
+      document.activeElement?.closest('.symbol-palette-items')
+    ) {
+      buttonRef.current.focus()
+    }
+  }, [focused])
+
+  return (
+    <OLTooltip
+      id={`symbol-${symbol.codepoint}`}
+      description={
+        <div>
+          <div className="symbol-palette-item-description">
+            {symbol.description}
+          </div>
+          <div className="symbol-palette-item-command">
+            {symbol.command}
+          </div>
+          {symbol.notes && (
+            <div className="symbol-palette-item-notes">
+              {symbol.notes}
+            </div>
+          )}
+        </div>
+      }
+      overlayProps={{ placement: 'top', trigger: ['hover', 'focus'] }}
+    >
+      <button
+        key={symbol.codepoint}
+        className="symbol-palette-item"
+        onClick={() => handleSelect(symbol)}
+        onKeyDown={handleKeyDown}
+        tabIndex={focused ? 0 : -1}
+        ref={buttonRef}
+        role="option"
+        aria-label={symbol.description}
+        aria-selected={focused ? 'true' : 'false'}
+      >
+        {symbol.character}
+      </button>
+    </OLTooltip>
+  )
+})
+
+SymbolPaletteItem.propTypes = {
+  symbol: PropTypes.shape({
+    codepoint: PropTypes.string.isRequired,
+    description: PropTypes.string.isRequired,
+    command: PropTypes.string.isRequired,
+    character: PropTypes.string.isRequired,
+    notes: PropTypes.string,
+  }),
+  handleKeyDown: PropTypes.func.isRequired,
+  handleSelect: PropTypes.func.isRequired,
+  focused: PropTypes.bool,
+}
+export default SymbolPaletteItem
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-items.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-items.js
new file mode 100644
index 0000000000..ad8d004a09
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-items.js
@@ -0,0 +1,118 @@
+import { useCallback, useEffect, useRef, useState } from 'react'
+import PropTypes from 'prop-types'
+import { useEditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
+import SymbolPaletteItem from './symbol-palette-item'
+
+export default function SymbolPaletteItems({
+  items,
+  handleSelect,
+  focusInput,
+}) {
+  const [focusedIndex, setFocusedIndex] = useState(0)
+  const itemRefs = useRef([])
+
+  useEffect(() => {
+    itemRefs.current = items.map((_, i) => itemRefs.current[i] || null)
+    setFocusedIndex(0)
+  }, [items])
+
+  const getItemRects = () => {
+    return itemRefs.current.map(ref => ref?.getBoundingClientRect?.() ?? null)
+  }
+  const { toggleSymbolPalette } = useEditorPropertiesContext()
+
+  const handleKeyDown = useCallback(
+    event => {
+      if (event.metaKey || event.altKey || event.ctrlKey || event.shiftKey) return
+
+      const rects = getItemRects()
+      const currentRect = rects[focusedIndex]
+      if (!currentRect) return
+
+      let newIndex = focusedIndex
+
+      switch (event.key) {
+        case 'ArrowLeft':
+          newIndex = focusedIndex > 0 ? focusedIndex - 1 : items.length - 1
+          break
+        case 'ArrowRight':
+          newIndex = focusedIndex < items.length - 1 ? focusedIndex + 1 : 0
+          break
+        case 'ArrowUp':
+        case 'ArrowDown': {
+          const direction = event.key === 'ArrowUp' ? -1 : 1
+          const candidates = rects
+            .map((rect, i) => ({ rect, i }))
+            .filter(({ rect }, i) =>
+              i !== focusedIndex &&
+              rect &&
+              Math.abs(rect.x - currentRect.x) < currentRect.width * 0.8 &&
+              (direction === -1 ? rect.y < currentRect.y : rect.y > currentRect.y)
+            )
+
+          if (candidates.length > 0) {
+            const closest = candidates.reduce((a, b) =>
+              Math.abs(b.rect.y - currentRect.y) < Math.abs(a.rect.y - currentRect.y) ? b : a
+            )
+            newIndex = closest.i
+          }
+          break
+        }
+        case 'Home':
+          newIndex = 0
+          break
+        case 'End':
+          newIndex = items.length - 1
+          break
+        case 'Enter':
+        case ' ':
+          handleSelect(items[focusedIndex])
+          toggleSymbolPalette()
+          break
+        case 'Escape':
+          toggleSymbolPalette()
+          window.dispatchEvent(new CustomEvent('editor:focus'))
+          break
+
+        default:
+          focusInput()
+          return
+      }
+
+      event.preventDefault()
+      setFocusedIndex(newIndex)
+    },
+    [focusedIndex, items, focusInput, handleSelect]
+  )
+
+  return (
+    <div className="symbol-palette-items" role="listbox" aria-label="Symbols">
+      {items.map((symbol, index) => (
+        <SymbolPaletteItem
+          key={symbol.codepoint}
+          symbol={symbol}
+          handleSelect={symbol => {
+            handleSelect(symbol)
+            setFocusedIndex(index)
+          }}
+          handleKeyDown={handleKeyDown}
+          focused={index === focusedIndex}
+          ref={el => {
+            itemRefs.current[index] = el
+          }}
+        />
+      ))}
+    </div>
+  )
+}
+
+SymbolPaletteItems.propTypes = {
+  items: PropTypes.arrayOf(
+    PropTypes.shape({
+      codepoint: PropTypes.string.isRequired,
+    })
+  ).isRequired,
+  handleSelect: PropTypes.func.isRequired,
+  focusInput: PropTypes.func.isRequired,
+}
+
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-search.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-search.js
new file mode 100644
index 0000000000..75d01f0119
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-search.js
@@ -0,0 +1,45 @@
+import { useCallback, useEffect, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import PropTypes from 'prop-types'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
+import useDebounce from '../../../shared/hooks/use-debounce'
+
+export default function SymbolPaletteSearch({ setInput, inputRef }) {
+  const [localInput, setLocalInput] = useState('')
+
+  // debounce the search input until a typing delay
+  const debouncedLocalInput = useDebounce(localInput, 250)
+
+  useEffect(() => {
+    setInput(debouncedLocalInput)
+  }, [debouncedLocalInput, setInput])
+
+  const { t } = useTranslation()
+
+  const inputRefCallback = useCallback(
+    element => {
+      inputRef.current = element
+    },
+    [inputRef]
+  )
+
+  return (
+    <OLFormControl
+      className="symbol-palette-search"
+      type="search"
+      ref={inputRefCallback}
+      id="symbol-palette-input"
+      aria-label="Search"
+      value={localInput}
+      placeholder={t('search') + '…'}
+      onChange={event => {
+        setLocalInput(event.target.value)
+      }}
+    />
+  )
+}
+
+SymbolPaletteSearch.propTypes = {
+  setInput: PropTypes.func.isRequired,
+  inputRef: PropTypes.object.isRequired,
+}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette-tabs.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-tabs.js
new file mode 100644
index 0000000000..80f0421f27
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette-tabs.js
@@ -0,0 +1,76 @@
+import PropTypes from 'prop-types'
+import { useState, useRef } from 'react'
+
+
+export default function SymbolPaletteTabs({
+  categories,
+  activeCategoryId,
+  setActiveCategoryId,
+}) {
+
+  const buttonRefs = useRef([])
+  const focusTab = (index) => {
+    setActiveCategoryId(categories[index].id)
+    buttonRefs.current[index]?.focus()
+  }
+
+  const handleKeyDown = (e, index) => {
+    switch (e.key) {
+      case 'ArrowRight':
+        focusTab((index + 1) % categories.length)
+        break
+      case 'ArrowLeft':
+        focusTab((index - 1 + categories.length) % categories.length)
+        break
+      case 'Home':
+      case 'PageUp':
+        focusTab(0)
+        break
+      case 'End':
+      case 'PageDown':
+        focusTab(categories.length - 1)
+        break
+      default:
+        break
+    }
+  }
+
+  return (
+    <div
+      role="tablist"
+      aria-label="Symbol Categories"
+      className="symbol-palette-tab-list"
+            tabIndex={0}
+    >
+      {categories.map((category, index) => {
+        const selected = activeCategoryId === category.id
+        return (
+          <button
+            key={category.id}
+            role="tab"
+            type="button"
+            className="symbol-palette-tab"
+            id={`symbol-palette-tab-${category.id}`}
+            aria-controls={`symbol-palette-panel-${category.id}`}
+            aria-selected={selected}
+            tabIndex={selected ? 0 : -1}
+            ref={(el) => (buttonRefs.current[index] = el)}
+            onClick={() => setActiveCategoryId(category.id)}
+            onKeyDown={(e) => handleKeyDown(e, index)}
+          >
+            {category.label}
+          </button>
+        )
+      })}
+    </div>
+  )
+}
+
+SymbolPaletteTabs.propTypes = {
+  categories: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string.isRequired,
+    label: PropTypes.string.isRequired,
+  })).isRequired,
+  activeCategoryId: PropTypes.string.isRequired,
+  setActiveCategoryId: PropTypes.func.isRequired,
+}
diff --git a/services/web/frontend/js/features/symbol-palette/components/symbol-palette.js b/services/web/frontend/js/features/symbol-palette/components/symbol-palette.js
new file mode 100644
index 0000000000..2f1cc5e8c8
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/components/symbol-palette.js
@@ -0,0 +1,8 @@
+import SymbolPaletteContent from './symbol-palette-content'
+
+export default function SymbolPalette() {
+  const handleSelect = (symbol) => {
+    window.dispatchEvent(new CustomEvent('editor:insert-symbol', { detail: symbol }))
+  }
+  return <SymbolPaletteContent handleSelect={handleSelect} />
+}
diff --git a/services/web/frontend/js/features/symbol-palette/data/symbols.json b/services/web/frontend/js/features/symbol-palette/data/symbols.json
new file mode 100644
index 0000000000..af160b3eed
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/data/symbols.json
@@ -0,0 +1,872 @@
+[
+  {
+    "category": "Greek",
+    "command": "\\alpha",
+    "codepoint": "U+1D6FC",
+    "description": "Lowercase Greek letter alpha",
+    "aliases": ["a", "α"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\beta",
+    "codepoint": "U+1D6FD",
+    "description": "Lowercase Greek letter beta",
+    "aliases": ["b", "β"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\gamma",
+    "codepoint": "U+1D6FE",
+    "description": "Lowercase Greek letter gamma",
+    "aliases": ["γ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\delta",
+    "codepoint": "U+1D6FF",
+    "description": "Lowercase Greek letter delta",
+    "aliases": ["δ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\varepsilon",
+    "codepoint": "U+1D700",
+    "description": "Lowercase Greek letter epsilon, varepsilon",
+    "aliases": ["ε"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\epsilon",
+    "codepoint": "U+1D716",
+    "description": "Lowercase Greek letter epsilon lunate",
+    "aliases": ["ε"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\zeta",
+    "codepoint": "U+1D701",
+    "description": "Lowercase Greek letter zeta",
+    "aliases": ["ζ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\eta",
+    "codepoint": "U+1D702",
+    "description": "Lowercase Greek letter eta",
+    "aliases": ["η"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\vartheta",
+    "codepoint": "U+1D717",
+    "description": "Lowercase Greek letter curly theta, vartheta",
+    "aliases": ["θ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\theta",
+    "codepoint": "U+1D703",
+    "description": "Lowercase Greek letter theta",
+    "aliases": ["θ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\iota",
+    "codepoint": "U+1D704",
+    "description": "Lowercase Greek letter iota",
+    "aliases": ["ι"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\kappa",
+    "codepoint": "U+1D705",
+    "description": "Lowercase Greek letter kappa",
+    "aliases": ["κ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\lambda",
+    "codepoint": "U+1D706",
+    "description": "Lowercase Greek letter lambda",
+    "aliases": ["λ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\mu",
+    "codepoint": "U+1D707",
+    "description": "Lowercase Greek letter mu",
+    "aliases": ["μ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\nu",
+    "codepoint": "U+1D708",
+    "description": "Lowercase Greek letter nu",
+    "aliases": ["ν"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\xi",
+    "codepoint": "U+1D709",
+    "description": "Lowercase Greek letter xi",
+    "aliases": ["ξ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\pi",
+    "codepoint": "U+1D70B",
+    "description": "Lowercase Greek letter pi",
+    "aliases": ["π"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\varrho",
+    "codepoint": "U+1D71A",
+    "description": "Lowercase Greek letter rho, varrho",
+    "aliases": ["ρ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\rho",
+    "codepoint": "U+1D70C",
+    "description": "Lowercase Greek letter rho",
+    "aliases": ["ρ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\sigma",
+    "codepoint": "U+1D70E",
+    "description": "Lowercase Greek letter sigma",
+    "aliases": ["σ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\varsigma",
+    "codepoint": "U+1D70D",
+    "description": "Lowercase Greek letter final sigma, varsigma",
+    "aliases": ["ς"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\tau",
+    "codepoint": "U+1D70F",
+    "description": "Lowercase Greek letter tau",
+    "aliases": ["τ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\upsilon",
+    "codepoint": "U+1D710",
+    "description": "Lowercase Greek letter upsilon",
+    "aliases": ["υ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\phi",
+    "codepoint": "U+1D719",
+    "description": "Lowercase Greek letter phi",
+    "aliases": ["φ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\varphi",
+    "codepoint": "U+1D711",
+    "description": "Lowercase Greek letter phi, varphi",
+    "aliases": ["φ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\chi",
+    "codepoint": "U+1D712",
+    "description": "Lowercase Greek letter chi",
+    "aliases": ["χ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\psi",
+    "codepoint": "U+1D713",
+    "description": "Lowercase Greek letter psi",
+    "aliases": ["ψ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\omega",
+    "codepoint": "U+1D714",
+    "description": "Lowercase Greek letter omega",
+    "aliases": ["ω"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Gamma",
+    "codepoint": "U+00393",
+    "description": "Uppercase Greek letter Gamma",
+    "aliases": ["Γ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Delta",
+    "codepoint": "U+00394",
+    "description": "Uppercase Greek letter Delta",
+    "aliases": ["Δ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Theta",
+    "codepoint": "U+00398",
+    "description": "Uppercase Greek letter Theta",
+    "aliases": ["Θ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Lambda",
+    "codepoint": "U+0039B",
+    "description": "Uppercase Greek letter Lambda",
+    "aliases": ["Λ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Xi",
+    "codepoint": "U+0039E",
+    "description": "Uppercase Greek letter Xi",
+    "aliases": ["Ξ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Pi",
+    "codepoint": "U+003A0",
+    "description": "Uppercase Greek letter Pi",
+    "aliases": ["Π"],
+    "notes": "Use \\prod for the product."
+  },
+  {
+    "category": "Greek",
+    "command": "\\Sigma",
+    "codepoint": "U+003A3",
+    "description": "Uppercase Greek letter Sigma",
+    "aliases": ["Σ"],
+    "notes": "Use \\sum for the sum."
+  },
+  {
+    "category": "Greek",
+    "command": "\\Upsilon",
+    "codepoint": "U+003A5",
+    "description": "Uppercase Greek letter Upsilon",
+    "aliases": ["Υ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Phi",
+    "codepoint": "U+003A6",
+    "description": "Uppercase Greek letter Phi",
+    "aliases": ["Φ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Psi",
+    "codepoint": "U+003A8",
+    "description": "Uppercase Greek letter Psi",
+    "aliases": ["Ψ"],
+    "notes": ""
+  },
+  {
+    "category": "Greek",
+    "command": "\\Omega",
+    "codepoint": "U+003A9",
+    "description": "Uppercase Greek letter Omega",
+    "aliases": ["Ω"],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\neq",
+    "codepoint": "U+02260",
+    "description": "Not equal",
+    "aliases": ["!="],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\leq",
+    "codepoint": "U+02264",
+    "description": "Less than or equal",
+    "aliases": ["<="],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\geq",
+    "codepoint": "U+02265",
+    "description": "Greater than or equal",
+    "aliases": [">="],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\ll",
+    "codepoint": "U+0226A",
+    "description": "Much less than",
+    "aliases": ["<<"],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\gg",
+    "codepoint": "U+0226B",
+    "description": "Much greater than",
+    "aliases": [">>"],
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\prec",
+    "codepoint": "U+0227A",
+    "description": "Precedes",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\succ",
+    "codepoint": "U+0227B",
+    "description": "Succeeds",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\in",
+    "codepoint": "U+02208",
+    "description": "Set membership",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\notin",
+    "codepoint": "U+02209",
+    "description": "Negated set membership",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\ni",
+    "codepoint": "U+0220B",
+    "description": "Contains",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\subset",
+    "codepoint": "U+02282",
+    "description": "Subset",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\subseteq",
+    "codepoint": "U+02286",
+    "description": "Subset or equals",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\supset",
+    "codepoint": "U+02283",
+    "description": "Superset",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\simeq",
+    "codepoint": "U+02243",
+    "description": "Similar",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\approx",
+    "codepoint": "U+02248",
+    "description": "Approximate",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\equiv",
+    "codepoint": "U+02261",
+    "description": "Identical with",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\cong",
+    "codepoint": "U+02245",
+    "description": "Congruent with",
+    "notes": ""
+  },
+  {
+    "category": "Relations",
+    "command": "\\mid",
+    "codepoint": "U+02223",
+    "description": "Mid, divides, vertical bar, modulus, absolute value",
+    "notes": "Use \\lvert...\\rvert for the absolute value."
+  },
+  {
+    "category": "Relations",
+    "command": "\\nmid",
+    "codepoint": "U+02224",
+    "description": "Negated mid, not divides",
+    "notes": "Requires \\usepackage{amssymb}."
+  },
+  {
+    "category": "Relations",
+    "command": "\\parallel",
+    "codepoint": "U+02225",
+    "description": "Parallel, double vertical bar, norm",
+    "notes": "Use \\lVert...\\rVert for the norm."
+  },
+  {
+    "category": "Relations",
+    "command": "\\perp",
+    "codepoint": "U+027C2",
+    "description": "Perpendicular",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\times",
+    "codepoint": "U+000D7",
+    "description": "Cross product, multiplication",
+    "aliases": ["x"],
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\div",
+    "codepoint": "U+000F7",
+    "description": "Division",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\cap",
+    "codepoint": "U+02229",
+    "description": "Intersection",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\cup",
+    "codepoint": "U+0222A",
+    "description": "Union",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\cdot",
+    "codepoint": "U+022C5",
+    "description": "Dot product, multiplication",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\cdots",
+    "codepoint": "U+022EF",
+    "description": "Centered dots",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\bullet",
+    "codepoint": "U+02219",
+    "description": "Bullet",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\circ",
+    "codepoint": "U+025E6",
+    "description": "Circle",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\wedge",
+    "codepoint": "U+02227",
+    "description": "Wedge, logical and",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\vee",
+    "codepoint": "U+02228",
+    "description": "Vee, logical or",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\setminus",
+    "codepoint": "U+0005C",
+    "description": "Set minus, backslash",
+    "notes": "Use \\backslash for a backslash."
+  },
+  {
+    "category": "Operators",
+    "command": "\\oplus",
+    "codepoint": "U+02295",
+    "description": "Plus sign in circle",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\otimes",
+    "codepoint": "U+02297",
+    "description": "Multiply sign in circle",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\sum",
+    "codepoint": "U+02211",
+    "description": "Summation operator",
+    "notes": "Use \\Sigma for the letter Sigma."
+  },
+  {
+    "category": "Operators",
+    "command": "\\prod",
+    "codepoint": "U+0220F",
+    "description": "Product operator",
+    "notes": "Use \\Pi for the letter Pi."
+  },
+  {
+    "category": "Operators",
+    "command": "\\bigcap",
+    "codepoint": "U+022C2",
+    "description": "Intersection operator",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\bigcup",
+    "codepoint": "U+022C3",
+    "description": "Union operator",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\int",
+    "codepoint": "U+0222B",
+    "description": "Integral operator",
+    "notes": ""
+  },
+  {
+    "category": "Operators",
+    "command": "\\iint",
+    "codepoint": "U+0222C",
+    "description": "Double integral operator",
+    "notes": "Requires \\usepackage{amsmath}."
+  },
+  {
+    "category": "Operators",
+    "command": "\\iiint",
+    "codepoint": "U+0222D",
+    "description": "Triple integral operator",
+    "notes": "Requires \\usepackage{amsmath}."
+  },
+  {
+    "category": "Arrows",
+    "command": "\\leftarrow",
+    "codepoint": "U+02190",
+    "description": "Leftward arrow",
+    "aliases": ["<-"],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\rightarrow",
+    "codepoint": "U+02192",
+    "description": "Rightward arrow",
+    "aliases": ["->"],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\leftrightarrow",
+    "codepoint": "U+02194",
+    "description": "Left and right arrow",
+    "aliases": ["<->"],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\uparrow",
+    "codepoint": "U+02191",
+    "description": "Upward arrow",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\downarrow",
+    "codepoint": "U+02193",
+    "description": "Downward arrow",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\Leftarrow",
+    "codepoint": "U+021D0",
+    "description": "Is implied by",
+    "aliases": ["<="],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\Rightarrow",
+    "codepoint": "U+021D2",
+    "description": "Implies",
+    "aliases": ["=>"],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\Leftrightarrow",
+    "codepoint": "U+021D4",
+    "description": "Left and right double arrow",
+    "aliases": ["<=>"],
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\mapsto",
+    "codepoint": "U+021A6",
+    "description": "Maps to, rightward",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\nearrow",
+    "codepoint": "U+02197",
+    "description": "NE pointing arrow",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\searrow",
+    "codepoint": "U+02198",
+    "description": "SE pointing arrow",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\rightleftharpoons",
+    "codepoint": "U+021CC",
+    "description": "Right harpoon over left",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\leftharpoonup",
+    "codepoint": "U+021BC",
+    "description": "Left harpoon up",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\rightharpoonup",
+    "codepoint": "U+021C0",
+    "description": "Right harpoon up",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\leftharpoondown",
+    "codepoint": "U+021BD",
+    "description": "Left harpoon down",
+    "notes": ""
+  },
+  {
+    "category": "Arrows",
+    "command": "\\rightharpoondown",
+    "codepoint": "U+021C1",
+    "description": "Right harpoon down",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\infty",
+    "codepoint": "U+0221E",
+    "description": "Infinity",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\partial",
+    "codepoint": "U+1D715",
+    "description": "Partial differential",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\nabla",
+    "codepoint": "U+02207",
+    "description": "Nabla, del, hamilton operator",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\varnothing",
+    "codepoint": "U+02300",
+    "description": "Empty set",
+    "notes": "Requires \\usepackage{amssymb}."
+  },
+  {
+    "category": "Misc",
+    "command": "\\forall",
+    "codepoint": "U+02200",
+    "description": "For all",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\exists",
+    "codepoint": "U+02203",
+    "description": "There exists",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\neg",
+    "codepoint": "U+000AC",
+    "description": "Not sign",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\Re",
+    "codepoint": "U+0211C",
+    "description": "Real part",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\Im",
+    "codepoint": "U+02111",
+    "description": "Imaginary part",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\Box",
+    "codepoint": "U+025A1",
+    "description": "Square",
+    "notes": "Requires \\usepackage{amssymb}."
+  },
+  {
+    "category": "Misc",
+    "command": "\\triangle",
+    "codepoint": "U+025B3",
+    "description": "Triangle",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\aleph",
+    "codepoint": "U+02135",
+    "description": "Hebrew letter aleph",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\wp",
+    "codepoint": "U+02118",
+    "description": "Weierstrass letter p",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\#",
+    "codepoint": "U+00023",
+    "description": "Number sign, hashtag",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\$",
+    "codepoint": "U+00024",
+    "description": "Dollar sign",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\%",
+    "codepoint": "U+00025",
+    "description": "Percent sign",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\&",
+    "codepoint": "U+00026",
+    "description": "Et sign, and, ampersand",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\{",
+    "codepoint": "U+0007B",
+    "description": "Left curly brace",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\}",
+    "codepoint": "U+0007D",
+    "description": "Right curly brace",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\langle",
+    "codepoint": "U+027E8",
+    "description": "Left angle bracket, bra",
+    "notes": ""
+  },
+  {
+    "category": "Misc",
+    "command": "\\rangle",
+    "codepoint": "U+027E9",
+    "description": "Right angle bracket, ket",
+    "notes": ""
+  }
+]
diff --git a/services/web/frontend/js/features/symbol-palette/utils/categories.js b/services/web/frontend/js/features/symbol-palette/utils/categories.js
new file mode 100644
index 0000000000..872534771f
--- /dev/null
+++ b/services/web/frontend/js/features/symbol-palette/utils/categories.js
@@ -0,0 +1,44 @@
+import symbols from '../data/symbols.json'
+export function createCategories(t) {
+  return [
+    {
+      id: 'Greek',
+      label: t('category_greek'),
+    },
+    {
+      id: 'Arrows',
+      label: t('category_arrows'),
+    },
+    {
+      id: 'Operators',
+      label: t('category_operators'),
+    },
+    {
+      id: 'Relations',
+      label: t('category_relations'),
+    },
+    {
+      id: 'Misc',
+      label: t('category_misc'),
+    },
+  ]
+}
+
+export function buildCategorisedSymbols(categories) {
+  const output = {}
+
+  for (const category of categories) {
+    output[category.id] = []
+  }
+
+  for (const item of symbols) {
+    if (item.category in output) {
+      item.character = String.fromCodePoint(
+        parseInt(item.codepoint.replace(/^U\+0*/, ''), 16)
+      )
+      output[item.category].push(item)
+    }
+  }
+
+  return output
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/gallery-header-all.tsx b/services/web/frontend/js/features/template-gallery/components/gallery-header-all.tsx
new file mode 100644
index 0000000000..aed7c311f9
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/gallery-header-all.tsx
@@ -0,0 +1,29 @@
+import { useTranslation } from 'react-i18next'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+
+export default function GalleryHeaderAll() {
+  const { t } = useTranslation()
+  return (
+    <div className="gallery-header">
+      <OLRow>
+        <OLCol md={12}>
+          <h1 className="gallery-title">
+            <span className="eyebrow-text">
+              <span aria-hidden="true">&#123;</span>
+              <span>{t('overleaf_template_gallery')}</span>
+              <span aria-hidden="true">&#125;</span>
+            </span>
+            {t('latex_templates')}
+          </h1>
+        </OLCol>
+      </OLRow>
+      <div className="row">
+        <div className="col-md-12">
+          <p className="gallery-summary">{t('latex_templates_for_journal_articles')}
+          </p>
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/gallery-header-tagged.tsx b/services/web/frontend/js/features/template-gallery/components/gallery-header-tagged.tsx
new file mode 100644
index 0000000000..ca2f37dbb5
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/gallery-header-tagged.tsx
@@ -0,0 +1,33 @@
+import getMeta from '@/utils/meta'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import GallerySearchSortHeader from './gallery-search-sort-header'
+
+export default function GalleryHeaderTagged({ category }) {
+  const title = getMeta('og:title')
+  const { templateLinks } = getMeta('ol-ExposedSettings') || []
+
+  const description = templateLinks?.find(link => link.url.split("/").pop() === category)?.description
+  const gotoAllLink = (category !== 'all')
+  return (
+    <div className="tagged-header-container">
+      <GallerySearchSortHeader
+        gotoAllLink={gotoAllLink}
+      />
+      { category && (
+        <>
+          <OLRow>
+            <OLCol xs={12}>
+              <h1 className="gallery-title">{title}</h1>
+            </OLCol>
+          </OLRow>
+          <OLRow>
+            <OLCol lg={8}>
+              <p className="gallery-summary">{description}</p>
+            </OLCol>
+          </OLRow>
+        </>
+      )}
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/gallery-popular-tags.tsx b/services/web/frontend/js/features/template-gallery/components/gallery-popular-tags.tsx
new file mode 100644
index 0000000000..2e5d847d23
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/gallery-popular-tags.tsx
@@ -0,0 +1,31 @@
+import { useTranslation } from 'react-i18next'
+import getMeta from '@/utils/meta'
+
+export default function GalleryPopularTags() {
+  const { t } = useTranslation()
+  const { templateLinks } = getMeta('ol-ExposedSettings') || []
+
+  if(!templateLinks || templateLinks.length < 2) return null
+
+  return (
+    <div className="popular-tags">
+      <h1>{t('categories')}</h1>
+      <div className="row popular-tags-list">
+        {templateLinks?.filter(link => link.url.split("/").pop() !== "all").map((link, index) => (
+          <div key={index} className="gallery-thumbnail col-12 col-md-6 col-lg-4">
+            <a href={link.url}>
+              <div className="thumbnail-tag">
+                <img
+                  src={`/img/website-redesign/gallery/${link.url.split("/").pop()}.svg`}
+                  alt={link.name}
+                />
+              </div>
+              <span className="caption-title">{link.name}</span>
+            </a>
+            <p>{link.description}</p>
+          </div>
+        ))}
+      </div>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/gallery-search-sort-header.tsx b/services/web/frontend/js/features/template-gallery/components/gallery-search-sort-header.tsx
new file mode 100644
index 0000000000..128d379684
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/gallery-search-sort-header.tsx
@@ -0,0 +1,78 @@
+import { useTemplateGalleryContext } from '../context/template-gallery-context'
+import { useTranslation } from 'react-i18next'
+import SearchForm from './search-form'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import useSort from '../hooks/use-sort'
+import withContent, { SortBtnProps } from './sort/with-content'
+import MaterialIcon from '@/shared/components/material-icon'
+
+function SortBtn({ onClick, text, iconType, screenReaderText }: SortBtnProps) {
+  return (
+    <button
+      className="gallery-header-sort-btn inline-block"
+      onClick={onClick}
+      aria-label={screenReaderText}
+    >
+      <span>{text}</span>
+        {iconType ? (
+          <MaterialIcon type={iconType} />
+        ) : (
+          <MaterialIcon type="arrow_upward" style={{ visibility: 'hidden' }} />
+        )}
+    </button>
+  )
+}
+
+const SortByButton = withContent(SortBtn)
+
+export default function GallerySearchSortHeader( { gotoAllLink }: { boolean } ) {
+  const { t } = useTranslation()
+  const {
+    searchText,
+    setSearchText,
+    sort,
+  } = useTemplateGalleryContext()
+
+  const { handleSort } = useSort()
+  return (
+    <OLRow className="align-items-center">
+      {gotoAllLink ? (
+      <OLCol className="col-auto">
+          <a className="previous-page-link" href="/templates/all">
+            <i className="material-symbols material-symbols-rounded" aria-hidden="true">arrow_left_alt</i>
+            {t('all_templates')}
+          </a>
+        </OLCol>
+      ) : (
+      <OLCol className="col-auto">
+          <a className="previous-page-link" href="/templates">
+            <i className="material-symbols material-symbols-rounded" aria-hidden="true">arrow_left_alt</i>
+            {t('template_gallery')}
+          </a>
+        </OLCol>
+      )}
+      <OLCol className="d-flex justify-content-center gap-2">
+        <SortByButton
+          column="lastUpdated"
+          text={t('last_updated')}
+          sort={sort}
+          onClick={() => handleSort('lastUpdated')}
+        />
+
+        <SortByButton
+          column="name"
+          text={t('title')}
+          sort={sort}
+          onClick={() => handleSort('name')}
+        />
+      </OLCol>
+      <OLCol xs={3} className="ms-auto" >
+        <SearchForm
+          inputValue={searchText}
+          setInputValue={setSearchText}
+        />
+      </OLCol>
+    </OLRow>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/pagination.tsx b/services/web/frontend/js/features/template-gallery/components/pagination.tsx
new file mode 100644
index 0000000000..a55f96a6a4
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/pagination.tsx
@@ -0,0 +1,80 @@
+import { useTranslation } from 'react-i18next'
+
+export default function Pagination({ currentPage, totalPages, onPageChange }) {
+  const { t } = useTranslation()
+  if (totalPages <= 1) return null
+
+  const pageNumbers = []
+  let startPage = Math.max(1, currentPage - 4)
+  let endPage = Math.min(totalPages, currentPage + 4)
+
+  if (startPage > 1) {
+    pageNumbers.push(1)
+    if (startPage > 2) {
+      pageNumbers.push("...")
+    }
+  }
+
+  for (let i = startPage; i <= endPage; i++) {
+    pageNumbers.push(i)
+  }
+
+  if (endPage < totalPages) {
+    if (endPage < totalPages - 1) {
+      pageNumbers.push("...")
+    }
+    pageNumbers.push(totalPages)
+  }
+
+  return (
+    <nav role="navigation" aria-label={t('pagination_navigation')}>
+      <ul className="pagination">
+{/*
+        {currentPage > 1 && (
+          <li>
+            <button aria-label={t('go_to_first_page')} onClick={() => onPageChange(1)}>
+              &lt;&lt; {t('first')}
+            </button>
+          </li>
+        )}
+*/}
+        {currentPage > 1 && (
+          <li>
+            <button aria-label={t('go_prev_page')} onClick={() => onPageChange(currentPage - 1)}>
+              &lt; {t('prev')}
+            </button>
+          </li>
+        )}
+        {pageNumbers.map((page, index) => (
+          <li key={index} className={page === currentPage ? "active" : ""}>
+            {page === "..." ? (
+              <span aria-hidden="true">{page}</span>
+            ) : page === currentPage ? (
+              <span aria-label={t('page_current', { page })} aria-current="true">{page}</span>
+            ) : (
+              <button aria-label={t('go_page', { page })} onClick={() => onPageChange(page)}>
+                {page}
+              </button>
+            )}
+          </li>
+        ))}
+        {currentPage < totalPages && (
+          <li>
+            <button aria-label={t('go_next_page')} onClick={() => onPageChange(currentPage + 1)}>
+              {t('next')} &gt;
+            </button>
+          </li>
+        )}
+{/*
+        {currentPage < totalPages && (
+          <li>
+            <button aria-label={t('go_to_last_page')} onClick={() => onPageChange(totalPages)}>
+              {t('last')} &gt;&gt;
+            </button>
+          </li>
+        )}
+*/}
+      </ul>
+    </nav>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/search-form.tsx b/services/web/frontend/js/features/template-gallery/components/search-form.tsx
new file mode 100644
index 0000000000..75c9a8a313
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/search-form.tsx
@@ -0,0 +1,61 @@
+import { useTranslation } from 'react-i18next'
+import { MergeAndOverride } from '../../../../../types/utils'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
+import MaterialIcon from '@/shared/components/material-icon'
+
+type SearchFormOwnProps = {
+  inputValue: string
+  setInputValue: (input: string) => void
+}
+
+type SearchFormProps = MergeAndOverride<
+  React.ComponentProps<typeof OLForm>,
+  SearchFormOwnProps
+>
+
+export default function SearchForm({
+  inputValue,
+  setInputValue,
+}: SearchFormProps) {
+  const { t } = useTranslation()
+  let placeholderMessage = t('search')
+  const placeholder = `${placeholderMessage}…`
+
+  const handleChange: React.ComponentProps<typeof OLFormControl
+  >['onChange'] = e => {
+    setInputValue(e.target.value)
+  }
+
+  const handleClear = () => setInputValue('')
+
+  return (
+    <OLForm
+      role="search"
+      onSubmit={e => e.preventDefault()}
+    >
+      <OLFormControl
+        className="gallery-search-form-control"
+        id="gallery-search-form-control"
+        type="text"
+        value={inputValue}
+        onChange={handleChange}
+        placeholder={placeholder}
+        aria-label={placeholder}
+        prepend={<MaterialIcon type="search" />}
+        append={
+          inputValue.length > 0 && (
+            <button
+              type="button"
+              className="form-control-search-clear-btn"
+              aria-label={t('clear_search')}
+              onClick={handleClear}
+            >
+              <MaterialIcon type="clear" />
+            </button>
+          )
+        }
+      />
+    </OLForm>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/components/sort/with-content.tsx b/services/web/frontend/js/features/template-gallery/components/sort/with-content.tsx
new file mode 100644
index 0000000000..8c77484fdf
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/sort/with-content.tsx
@@ -0,0 +1,46 @@
+import { useTranslation } from 'react-i18next'
+import { Sort } from '../../types/api'
+
+type SortBtnOwnProps = {
+  column: string
+  sort: Sort
+  text: string
+  onClick: () => void
+}
+
+type WithContentProps = {
+  iconType?: string
+  screenReaderText: string
+}
+
+export type SortBtnProps = SortBtnOwnProps & WithContentProps
+
+function withContent<T extends SortBtnOwnProps>(
+  WrappedComponent: React.ComponentType<T & WithContentProps>
+) {
+  function WithContent(hocProps: T) {
+    const { t } = useTranslation()
+    const { column, text, sort } = hocProps
+    let iconType
+
+    let screenReaderText = t('sort_by_x', { x: text })
+
+    if (column === sort.by) {
+      iconType =
+        sort.order === 'asc' ? 'arrow_upward_alt' : 'arrow_downward_alt'
+      screenReaderText = t('reverse_x_sort_order', { x: text })
+    }
+
+    return (
+      <WrappedComponent
+        {...hocProps}
+        iconType={iconType}
+        screenReaderText={screenReaderText}
+      />
+    )
+  }
+
+  return WithContent
+}
+
+export default withContent
diff --git a/services/web/frontend/js/features/template-gallery/components/template-gallery-entry.tsx b/services/web/frontend/js/features/template-gallery/components/template-gallery-entry.tsx
new file mode 100644
index 0000000000..479b306b51
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/template-gallery-entry.tsx
@@ -0,0 +1,29 @@
+import { memo } from 'react'
+import { cleanHtml } from '../../../../../modules/template-gallery/app/src/CleanHtml.mjs'
+
+function TemplateGalleryEntry({ template }) {
+  return (
+    <div className={"gallery-thumbnail col-12 col-md-6 col-lg-4"}>
+      <a href={`/template/${template.id}`} className="thumbnail-link">
+        <div className="thumbnail">
+          <img
+            src={`/template/${template.id}/preview?version=${template.version}&style=thumbnail`}
+            alt={template.name}
+          />
+        </div>
+        <span className="gallery-list-item-title">
+          <span className="caption-title">{template.name}</span>
+          <span className="badge-container"></span>
+        </span>
+      </a>
+      <div className="caption">
+        <p className="caption-description" dangerouslySetInnerHTML={{ __html: cleanHtml(template.description, 'plainText') }} />
+      </div>
+      <div className="author-name">
+        <div dangerouslySetInnerHTML={{ __html: cleanHtml(template.author, 'plainText') }} />
+      </div>
+    </div>
+  )
+}
+
+export default memo(TemplateGalleryEntry)
diff --git a/services/web/frontend/js/features/template-gallery/components/template-gallery-root.tsx b/services/web/frontend/js/features/template-gallery/components/template-gallery-root.tsx
new file mode 100644
index 0000000000..d17250f33a
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/template-gallery-root.tsx
@@ -0,0 +1,64 @@
+import { TemplateGalleryProvider } from '../context/template-gallery-context'
+import { useTranslation } from 'react-i18next'
+import useWaitForI18n from '../../../shared/hooks/use-wait-for-i18n'
+import withErrorBoundary from '../../../infrastructure/error-boundary'
+import { GenericErrorBoundaryFallback } from '@/shared/components/generic-error-boundary-fallback'
+import getMeta from '@/utils/meta'
+import DefaultNavbar from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
+import Footer from '@/features/ui/components/bootstrap-5/footer/footer'
+import GalleryHeaderTagged from './gallery-header-tagged'
+import GalleryHeaderAll from './gallery-header-all'
+import TemplateGallery from './template-gallery'
+import GallerySearchSortHeader from './gallery-search-sort-header'
+import GalleryPopularTags from './gallery-popular-tags'
+
+function TemplateGalleryRoot() {
+  const { isReady } = useWaitForI18n()
+  if (!isReady) {
+    return null
+  }
+  return (
+    <TemplateGalleryProvider>
+      <TemplateGalleryPageContent />
+    </TemplateGalleryProvider>
+  )
+}
+
+function TemplateGalleryPageContent() {
+  const { t } = useTranslation()
+  const navbarProps = getMeta('ol-navbar')
+  const footerProps = getMeta('ol-footer')
+  const category = getMeta('ol-templateCategory')
+
+  return (
+    <>
+      <DefaultNavbar {...navbarProps} />
+      <main id="main-content"
+        className={`content content-page gallery ${category ? 'gallery-tagged' : ''}`}
+      >
+        <div className="container">
+          {category ? (
+            <>
+              <GalleryHeaderTagged category={category} />
+              <TemplateGallery />
+            </>
+          ) : (
+            <>
+              <GalleryHeaderAll />
+              <GalleryPopularTags />
+              <hr className="w-full border-muted mb-5" />
+              <div className="recent-docs">
+                <GallerySearchSortHeader />
+                <h2>{t('all_templates')}</h2>
+                <TemplateGallery />
+              </div>
+            </>
+          )}
+        </div>
+      </main>
+      <Footer {...footerProps} />
+    </>
+  )
+}
+
+export default withErrorBoundary(TemplateGalleryRoot, GenericErrorBoundaryFallback)
diff --git a/services/web/frontend/js/features/template-gallery/components/template-gallery.tsx b/services/web/frontend/js/features/template-gallery/components/template-gallery.tsx
new file mode 100644
index 0000000000..174fa2900e
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/components/template-gallery.tsx
@@ -0,0 +1,65 @@
+import { useEffect, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import { useTemplateGalleryContext } from '../context/template-gallery-context'
+import TemplateGalleryEntry from './template-gallery-entry'
+import Pagination from './pagination'
+
+export default function TemplateGallery() {
+  const { t } = useTranslation()
+  const {
+    searchText,
+    sort,
+    visibleTemplates,
+  } = useTemplateGalleryContext()
+
+  const templatesPerPage = 6
+  const totalPages = Math.ceil(visibleTemplates.length / templatesPerPage)
+
+  const [currentPage, setCurrentPage] = useState(1)
+
+  useEffect(() => {
+    setCurrentPage(1)
+  }, [sort])
+
+  const [lastNonSearchPage, setLastNonSearchPage] = useState(1)
+  const [isSearching, setIsSearching] = useState(false)
+  useEffect(() => {
+    if (searchText.length > 0) {
+      if (!isSearching) {
+        setLastNonSearchPage(currentPage)
+        setIsSearching(true)
+      }
+      setCurrentPage(1)
+    } else {
+      if (isSearching) {
+        setCurrentPage(lastNonSearchPage)
+        setIsSearching(false)
+      }
+    }
+  }, [searchText])
+
+  const startIndex = (currentPage - 1) * templatesPerPage
+  const currentTemplates = visibleTemplates.slice(startIndex, startIndex + templatesPerPage)
+
+  return (
+    <>
+      <OLRow className="gallery-container">
+        {currentTemplates.length > 0 ? (
+          currentTemplates.map(p => (
+            <TemplateGalleryEntry
+              className="gallery-thumbnail col-12 col-md-6 col-lg-4"
+              key={p.id}
+              template={p}
+            />
+          ))
+        ) : (
+          <OLRow>
+            <p className="text-center">{t('no_templates_found')}</p>
+          </OLRow>
+        )}
+      </OLRow>
+      <Pagination currentPage={currentPage} totalPages={totalPages} onPageChange={setCurrentPage} />
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/template-gallery/context/template-gallery-context.tsx b/services/web/frontend/js/features/template-gallery/context/template-gallery-context.tsx
new file mode 100644
index 0000000000..af67af534f
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/context/template-gallery-context.tsx
@@ -0,0 +1,129 @@
+import {
+  createContext,
+  ReactNode,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react'
+import { Template } from '../../../../../types/template'
+import { GetTemplatesResponseBody, Sort } from '../types/api'
+import getMeta from '../../../utils/meta'
+import useAsync from '../../../shared/hooks/use-async'
+import { getTemplates } from '../util/api'
+import sortTemplates from '../util/sort-templates'
+import { debugConsole } from '@/utils/debugging'
+
+export type TemplateGalleryContextValue = {
+  visibleTemplates: Template[]
+  totalTemplatesCount: number
+  error: Error | null
+  sort: Sort
+  setSort: React.Dispatch<React.SetStateAction<Sort>>
+  searchText: string
+  setSearchText: React.Dispatch<React.SetStateAction<string>>
+}
+
+export const TemplateGalleryContext = createContext<
+  TemplateGalleryContextValue | undefined
+>(undefined)
+
+type TemplateGalleryProviderProps = {
+  children: ReactNode
+}
+
+export function TemplateGalleryProvider({ children }: TemplateGalleryProviderProps) {
+  const [loadedTemplates, setLoadedTemplates] = useState<Template[]>([])
+  const [visibleTemplates, setVisibleTemplates] = useState<Template[]>([])
+  const [totalTemplatesCount, setTotalTemplatesCount] = useState<number>(0)
+  const [sort, setSort] = useState<Sort>({
+    by: 'lastUpdated',
+    order: 'desc',
+  })
+  const prevSortRef = useRef<Sort>(sort)
+
+  const [searchText, setSearchText] = useState('')
+
+  const {
+    error,
+    runAsync,
+  } = useAsync<GetTemplatesResponseBody>()
+
+  const category = getMeta('ol-templateCategory') || 'all'
+
+  useEffect(() => {
+    runAsync(getTemplates(sort, category))
+      .then(data => {
+        setLoadedTemplates(data.templates)
+        setTotalTemplatesCount(data.totalSize)
+      })
+      .catch(debugConsole.error)
+      .finally(() => {
+      })
+  }, [runAsync])
+
+  useEffect(() => {
+    let filteredTemplates = [...loadedTemplates]
+
+    if (searchText.length) {
+      filteredTemplates = filteredTemplates.filter(template =>
+        template.name.toLowerCase().includes(searchText.toLowerCase()) ||
+        template.description.toLowerCase().includes(searchText.toLowerCase())
+      )
+    }
+
+    if (prevSortRef.current !== sort) {
+      filteredTemplates = sortTemplates(filteredTemplates, sort)
+      const loadedTemplatesSorted = sortTemplates(loadedTemplates, sort)
+      setLoadedTemplates(loadedTemplatesSorted)
+    }
+      setVisibleTemplates(filteredTemplates)
+  }, [
+    loadedTemplates,
+    searchText,
+    sort,
+  ])
+
+  useEffect(() => {
+    prevSortRef.current = sort
+  }, [sort])
+
+
+  const value = useMemo<TemplateGalleryContextValue>(
+    () => ({
+      error,
+      searchText,
+      setSearchText,
+      setSort,
+      sort,
+      totalTemplatesCount,
+      visibleTemplates,
+    }),
+    [
+      error,
+      searchText,
+      setSearchText,
+      setSort,
+      sort,
+      totalTemplatesCount,
+      visibleTemplates,
+    ]
+  )
+
+  return (
+    <TemplateGalleryContext.Provider value={value}>
+      {children}
+    </TemplateGalleryContext.Provider>
+  )
+}
+
+export function useTemplateGalleryContext() {
+  const context = useContext(TemplateGalleryContext)
+  if (!context) {
+    throw new Error(
+      'TemplateGalleryContext is only available inside TemplateGalleryProvider'
+    )
+  }
+  return context
+}
diff --git a/services/web/frontend/js/features/template-gallery/hooks/use-sort.ts b/services/web/frontend/js/features/template-gallery/hooks/use-sort.ts
new file mode 100644
index 0000000000..675f052425
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/hooks/use-sort.ts
@@ -0,0 +1,20 @@
+import { useTemplateGalleryContext } from '../context/template-gallery-context'
+import { Sort } from '../types/api'
+import { SortingOrder } from '../../../../../types/sorting-order'
+
+const toggleSort = (order: SortingOrder): SortingOrder => {
+  return order === 'asc' ? 'desc' : 'asc'
+}
+
+function useSort() {
+  const { sort, setSort } = useTemplateGalleryContext()
+  const handleSort = (by: Sort['by']) => {
+    setSort(prev => ({
+      by,
+      order: prev.by === by ? toggleSort(sort.order) : by === 'lastUpdated' ? 'desc' : 'asc',
+    }))
+  }
+  return { handleSort }
+}
+
+export default useSort
diff --git a/services/web/frontend/js/features/template-gallery/types/api.ts b/services/web/frontend/js/features/template-gallery/types/api.ts
new file mode 100644
index 0000000000..d2b19807a9
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/types/api.ts
@@ -0,0 +1,12 @@
+import { SortingOrder } from '../../../../../types/sorting-order'
+import { Template } from '../../../../../types/template'
+
+export type Sort = {
+  by: 'lastUpdated' | 'name'
+  order: SortingOrder
+}
+
+export type GetTemplatesResponseBody = {
+  totalSize: number
+  templates: Template[]
+}
diff --git a/services/web/frontend/js/features/template-gallery/util/api.ts b/services/web/frontend/js/features/template-gallery/util/api.ts
new file mode 100644
index 0000000000..54704f187d
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/util/api.ts
@@ -0,0 +1,12 @@
+import { GetTemplatesResponseBody, Sort } from '../types/api'
+import { getJSON } from '../../../infrastructure/fetch-json'
+
+export function getTemplates(sortBy: Sort, category: string): Promise<GetTemplatesResponseBody> {
+  const queryParams = new URLSearchParams({
+    by: sortBy.by,
+    order: sortBy.order,
+    category,
+  }).toString()
+
+  return getJSON(`/api/templates?${queryParams}`)
+}
diff --git a/services/web/frontend/js/features/template-gallery/util/sort-templates.ts b/services/web/frontend/js/features/template-gallery/util/sort-templates.ts
new file mode 100644
index 0000000000..2315606514
--- /dev/null
+++ b/services/web/frontend/js/features/template-gallery/util/sort-templates.ts
@@ -0,0 +1,40 @@
+import { Sort } from '../types/api'
+import { Template } from '../../../../../types/template'
+import { SortingOrder } from '../../../../../types/sorting-order'
+import { Compare } from '../../../../../types/helpers/array/sort'
+
+const order = (order: SortingOrder, templates: Template[]) => {
+  return order === 'asc' ? [...templates] : templates.reverse()
+}
+
+export const defaultComparator = (
+  v1: Template,
+  v2: Template,
+  key: 'name' | 'lastUpdated'
+) => {
+  const value1 = v1[key].toLowerCase()
+  const value2 = v2[key].toLowerCase()
+
+  if (value1 !== value2) {
+    return value1 < value2 ? Compare.SORT_A_BEFORE_B : Compare.SORT_A_AFTER_B
+  }
+
+  return Compare.SORT_KEEP_ORDER
+}
+
+export default function sortTemplates(templates: Template[], sort: Sort) {
+  let sorted = [...templates]
+  if (sort.by === 'name') {
+    sorted = sorted.sort((...args) => {
+      return defaultComparator(...args, 'name')
+    })
+  }
+
+  if (sort.by === 'lastUpdated') {
+    sorted = sorted.sort((...args) => {
+      return defaultComparator(...args, 'lastUpdated')
+    })
+  }
+
+  return order(sort.order, sorted)
+}
diff --git a/services/web/frontend/js/features/template/components/delete-template-button.tsx b/services/web/frontend/js/features/template/components/delete-template-button.tsx
new file mode 100644
index 0000000000..f4a17043d8
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/delete-template-button.tsx
@@ -0,0 +1,48 @@
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import useIsMounted from '@/shared/hooks/use-is-mounted'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import DeleteTemplateModal from './modals/delete-template-modal'
+import { useTemplateContext } from '../context/template-context'
+import { deleteTemplate } from '../util/api'
+import type { Template } from '../../../../../types/template'
+
+function DeleteTemplateButton() {
+  const { t } = useTranslation()
+  const [showModal, setShowModal] = useState(false)
+  const isMounted = useIsMounted()
+  const { template, setTemplate } = useTemplateContext()
+
+  const handleOpenModal = () => {
+    setShowModal(true)
+  }
+
+  const handleCloseModal = () => {
+    if (isMounted.current) {
+      setShowModal(false)
+    }
+  }
+
+  const handleDeleteTemplate = async (template: Template) => {
+    await deleteTemplate(template)
+    handleCloseModal()
+    const previousPage = document.referrer || '/templates'
+    window.location.href = previousPage
+  }
+
+  return (
+    <>
+      <OLButton variant="danger" onClick={handleOpenModal}>
+        {t('delete')}
+      </OLButton>
+      <DeleteTemplateModal
+        template={template}
+        actionHandler={handleDeleteTemplate}
+        showModal={showModal}
+        handleCloseModal={handleCloseModal}
+      />
+    </>
+  )
+}
+
+export default DeleteTemplateButton
diff --git a/services/web/frontend/js/features/template/components/edit-template-button.tsx b/services/web/frontend/js/features/template/components/edit-template-button.tsx
new file mode 100644
index 0000000000..ee1bd92df9
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/edit-template-button.tsx
@@ -0,0 +1,46 @@
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import useIsMounted from '@/shared/hooks/use-is-mounted'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import EditTemplateModal from './modals/edit-template-modal'
+import { useTemplateContext } from '../context/template-context'
+import { updateTemplate } from '../util/api'
+import type { Template } from '../../../../../types/template'
+
+export default function EditTemplateButton() {
+  const { t } = useTranslation()
+  const [showModal, setShowModal] = useState(false)
+  const isMounted = useIsMounted()
+  const { template, setTemplate } = useTemplateContext()
+
+  const handleOpenModal = () => {
+    setShowModal(true)
+  }
+
+  const handleCloseModal = () => {
+    if (isMounted.current) {
+      setShowModal(false)
+    }
+  }
+
+  const handleEditTemplate = async (editedTemplate: Template) => {
+    const updated = await updateTemplate({ editedTemplate, template })
+    if (updated) {
+      setTemplate(prev => ({ ...prev, ...updated }))
+    }
+  }
+
+  return (
+    <>
+      <OLButton variant="secondary" onClick={handleOpenModal}>
+        {t('edit')}
+      </OLButton>
+
+      <EditTemplateModal
+        showModal={showModal}
+        handleCloseModal={handleCloseModal}
+        actionHandler={handleEditTemplate}
+      />
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/template/components/form/form-field-input.tsx b/services/web/frontend/js/features/template/components/form/form-field-input.tsx
new file mode 100644
index 0000000000..d99a19ff8c
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/form/form-field-input.tsx
@@ -0,0 +1,17 @@
+import React from 'react'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
+
+interface FormFieldInputProps extends React.ComponentProps<typeof OLFormControl> {
+  value: string
+  placeholder?: string
+  onChange: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>
+}
+
+const FormFieldInput: React.FC<FormFieldInputProps> = ({
+  type = 'text',
+  ...props
+}) => (
+  <OLFormControl type={type} {...props} />
+)
+
+export default FormFieldInput
diff --git a/services/web/frontend/js/features/template/components/form/labeled-row-form-group.tsx b/services/web/frontend/js/features/template/components/form/labeled-row-form-group.tsx
new file mode 100644
index 0000000000..49eea6eeab
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/form/labeled-row-form-group.tsx
@@ -0,0 +1,26 @@
+import React from 'react'
+import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
+import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
+
+interface LabeledRowFormGroupProps {
+  controlId: string
+  label: string
+  children: React.ReactNode
+}
+
+const LabeledRowFormGroup: React.FC<LabeledRowFormGroupProps> = ({
+  controlId,
+  label,
+  children,
+}) => (
+  <OLFormGroup controlId={controlId} className="row">
+    <div className="col-2">
+      <OLFormLabel className="col-form-label col">{label}</OLFormLabel>
+    </div>
+    <div className="col-10">
+      {children}
+    </div>
+  </OLFormGroup>
+)
+
+export default React.memo(LabeledRowFormGroup)
diff --git a/services/web/frontend/js/features/template/components/form/template-form-fields.tsx b/services/web/frontend/js/features/template/components/form/template-form-fields.tsx
new file mode 100644
index 0000000000..f7d110e53f
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/form/template-form-fields.tsx
@@ -0,0 +1,96 @@
+import React, { useCallback } from 'react'
+import LabeledRowFormGroup from '../form/labeled-row-form-group'
+import FormFieldInput from '../form/form-field-input'
+import SettingsTemplateCategory from '../settings/settings-template-category'
+import SettingsLicense from '../settings/settings-license'
+import SettingsLanguage from '../settings/settings-language'
+import { useTranslation } from 'react-i18next'
+import type { Template } from '../../../../../../types/template'
+
+interface TemplateFormFieldsProps {
+  template: Partial<Template>
+  includeLanguage?: boolean
+  onChange: (changes: Partial<Template>) => void
+  onEnterKey?: () => void
+}
+
+function TemplateFormFields({
+  template,
+  includeLanguage = false,
+  onChange,
+  onEnterKey,
+}: TemplateFormFieldsProps) {
+  const { t } = useTranslation()
+
+  const handleKeyDown = useCallback(
+    (e: React.KeyboardEvent<HTMLInputElement>) => {
+      if (e.key === 'Enter') {
+        e.preventDefault()
+        onEnterKey?.()
+      }
+    },
+    [onEnterKey]
+  )
+
+  return (
+    <>
+      <LabeledRowFormGroup controlId="form-title" label={t('title') + ':'}>
+        <FormFieldInput
+          required
+          maxLength="255"
+          value={template.name ?? ''}
+          placeholder={t('title')}
+          onChange={e => onChange({ name: e.target.value })}
+          onKeyDown={handleKeyDown}
+        />
+      </LabeledRowFormGroup>
+
+      <LabeledRowFormGroup controlId="form-author" label={t('author') + ':'}>
+        <FormFieldInput
+          maxLength="255"
+          value={template.authorMD ?? ''}
+          placeholder={t('author')}
+          onChange={e => onChange({ authorMD: e.target.value })}
+          onKeyDown={handleKeyDown}
+        />
+      </LabeledRowFormGroup>
+
+      <LabeledRowFormGroup controlId="form-category" label={t('category') + ':'}>
+        <SettingsTemplateCategory
+          value={template.category}
+          onChange={val => onChange({ category: val })}
+        />
+      </LabeledRowFormGroup>
+
+      <LabeledRowFormGroup controlId="form-description" label={t('description') + ':'}>
+        <FormFieldInput
+          as="textarea"
+          rows={8}
+          maxLength="5000"
+          value={template.descriptionMD ?? ''}
+          placeholder={t('description')}
+          onChange={e => onChange({ descriptionMD: e.target.value })}
+          autoFocus
+        />
+      </LabeledRowFormGroup>
+
+      <LabeledRowFormGroup controlId="form-license" label={t('license') + ':'}>
+        <SettingsLicense
+          value={template.license}
+          onChange={val => onChange({ license: val })}
+        />
+      </LabeledRowFormGroup>
+
+      {includeLanguage && (
+        <LabeledRowFormGroup controlId="form-language" label={t('language') + ':'}>
+          <SettingsLanguage
+            value={template.language}
+            onChange={val => onChange({ language: val })}
+          />
+        </LabeledRowFormGroup>
+      )}
+    </>
+  )
+}
+
+export default React.memo(TemplateFormFields)
diff --git a/services/web/frontend/js/features/template/components/manage-template-modal/editor-manage-template-modal-wrapper.tsx b/services/web/frontend/js/features/template/components/manage-template-modal/editor-manage-template-modal-wrapper.tsx
new file mode 100644
index 0000000000..ab37c40d47
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/manage-template-modal/editor-manage-template-modal-wrapper.tsx
@@ -0,0 +1,37 @@
+import React from 'react'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+import { useProjectContext } from '@/shared/context/project-context'
+import ManageTemplateModal from './manage-template-modal'
+import type { Template } from '../../../../../../types/template'
+
+interface EditorManageTemplateModalWrapperProps {
+  show: boolean
+  handleHide: () => void
+  openTemplate: (data: Template) => void
+}
+
+const EditorManageTemplateModalWrapper = React.memo(
+  function EditorManageTemplateModalWrapper({ 
+    show,
+    handleHide,
+    openTemplate,
+  }: EditorManageTemplateModalWrapperProps) {
+    const { project } = useProjectContext()
+
+    if (!project) {
+      // wait for useProjectContext
+      return null
+    }
+    return (
+      <ManageTemplateModal
+        handleHide={handleHide}
+        show={show}
+        handleAfterPublished={openTemplate}
+        projectId={project._id}
+        projectName={project.name}
+      />
+    )
+  }
+)
+
+export default withErrorBoundary(EditorManageTemplateModalWrapper)
diff --git a/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal-content.tsx b/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal-content.tsx
new file mode 100644
index 0000000000..46bc7fcf46
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal-content.tsx
@@ -0,0 +1,169 @@
+import React, { useEffect, useState, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
+import { debugConsole } from '@/utils/debugging'
+import { getJSON, postJSON } from '@/infrastructure/fetch-json'
+import Notification from '@/shared/components/notification'
+import {
+  OLModalBody,
+  OLModalFooter,
+  OLModalHeader,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import { useDetachCompileContext } from '@/shared/context/detach-compile-context'
+import { useUserContext } from '@/shared/context/user-context'
+import { useFocusTrap } from '../../hooks/use-focus-trap'
+import TemplateFormFields from '../form/template-form-fields'
+import type { Template } from '../../../../../../types/template'
+
+
+interface ManageTemplateModalContentProps {
+  handleHide: () => void
+  inFlight: boolean
+  setInFlight: (inFlight: boolean) => void
+  handleAfterPublished: (data: Template) => void
+  projectId: string
+  projectName: string
+}
+
+export default function ManageTemplateModalContent({
+  handleHide,
+  inFlight,
+  setInFlight,
+  handleAfterPublished,
+  projectId,
+  projectName,
+}: ManageTemplateModalContentProps) {
+  const { t } = useTranslation()
+  const { pdfFile } = useDetachCompileContext()
+  const user = useUserContext()
+
+  const [template, setTemplate] = useState<Partial<Template>>({
+    name: projectName,
+    authorMD: `${user.first_name} ${user.last_name}`.trim(),
+  })
+  const [override, setOverride] = useState(false)
+  const [titleConflict, setTitleConflict] = useState(false)
+  const [error, setError] = useState<string | false>(false)
+  const [notificationType, setNotificationType] = useState<'error' | 'warning'>('error')
+  const [disablePublish, setDisablePublish] = useState(false)
+
+  // Only the trimmed name gates submission
+  const valid = (template.name ?? '').trim()
+
+  useEffect(() => {
+    const queryParams = new URLSearchParams({ key: 'name', val: projectName })
+    getJSON(`/api/template?${queryParams}`)
+      .then((data) => {
+        if (!data) return
+        setTemplate(prev => ({
+          ...prev,
+          descriptionMD: data.descriptionMD,
+          authorMD: data.authorMD,
+          license: data.license,
+          category: data.category,
+        }))
+      })
+      .catch(debugConsole.error)
+  }, [])
+
+  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+    event.preventDefault()
+
+    if (!valid) return
+
+    setError(false)
+    setInFlight(true)
+
+    postJSON(`/template/new/${projectId}`, {
+      body: {
+        category: template.category,
+        name: valid,
+        authorMD: (template.authorMD ?? '').trim(),
+        license: template.license,
+        descriptionMD: (template.descriptionMD ?? '').trim(),
+        build: pdfFile.build,
+        override,
+      },
+    })
+      .then(data => {
+        handleHide()
+        handleAfterPublished(data)
+      })
+      .catch(({ response, data }) => {
+        if (response?.status === 409 && data.canOverride) {
+          setNotificationType('warning')
+          setOverride(true)
+        } else {
+          setNotificationType('error')
+          setDisablePublish(true)
+        }
+        setError(data.message)
+        if (response?.status === 409) setTitleConflict(true)
+      })
+      .finally(() => {
+        setInFlight(false)
+      })
+  }
+
+  const handleChange = (changes: Partial<Template>) => {
+    if ('name' in changes && titleConflict) {
+      setError(false)
+      setOverride(false)
+      if (disablePublish) setDisablePublish(false)
+    }
+    setTemplate(prev => ({ ...prev, ...changes }))
+  }
+
+  const handleEnterKey = () => {
+    document.getElementById('submit-publish-template')?.click()
+  }
+
+  const modalRef = useRef<HTMLDivElement>(null)
+  useFocusTrap(modalRef)
+
+  return (
+    <div ref={modalRef}>
+      <OLModalHeader closeButton>
+        <OLModalTitle>{t('publish_as_template')}</OLModalTitle>
+      </OLModalHeader>
+
+      <OLModalBody>
+        <div className="modal-body-publish">
+          <div className="content-as-table">
+            <OLForm id="publish-template-form" onSubmit={handleSubmit}>
+              <TemplateFormFields
+                template={template}
+                includeLanguage={false}
+                onChange={handleChange}
+                onEnterKey={handleEnterKey}
+              />
+            </OLForm>
+          </div>
+        </div>
+        {error && (
+          <Notification
+            content={error.length ? error : t('generic_something_went_wrong')}
+            type={notificationType}
+          />
+        )}
+      </OLModalBody>
+
+      <OLModalFooter>
+        <OLButton variant="secondary" disabled={inFlight} onClick={handleHide}>
+          {t('cancel')}
+        </OLButton>
+        <OLButton
+          id="submit-publish-template"
+          variant={override ? 'danger' : 'primary'}
+          disabled={inFlight || !valid || disablePublish}
+          form="publish-template-form"
+          type="submit"
+        >
+          {inFlight ? <>{t('publishing')}…</> : override ? t('overwrite') : t('publish')}
+        </OLButton>
+      </OLModalFooter>
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal.tsx b/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal.tsx
new file mode 100644
index 0000000000..c48980c598
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/manage-template-modal/manage-template-modal.tsx
@@ -0,0 +1,52 @@
+import React, { memo, useCallback, useState } from 'react'
+import OLModal from '@/features/ui/components/ol/ol-modal'
+import ManageTemplateModalContent from './manage-template-modal-content'
+import type { Template } from '../../../../../../types/template'
+
+interface ManageTemplateModalProps {
+  show: boolean
+  handleHide: () => void
+  handleAfterPublished: (data: Template) => void
+  projectId: string
+  projectName: string
+}
+
+function ManageTemplateModal({
+  show,
+  handleHide,
+  handleAfterPublished,
+  projectId,
+  projectName,
+}: ManageTemplateModalProps) {
+  const [inFlight, setInFlight] = useState(false)
+
+  const onHide = useCallback(() => {
+    if (!inFlight) {
+      handleHide()
+    }
+  }, [handleHide, inFlight])
+
+  return (
+    <OLModal
+      size="lg"
+      animation
+      show={show}
+      onHide={onHide}
+      id="publish-template-modal"
+      // backdrop="static" will disable closing the modal by clicking
+      // outside of the modal element
+      backdrop='static'
+    >
+      <ManageTemplateModalContent
+        handleHide={onHide}
+        inFlight={inFlight}
+        setInFlight={setInFlight}
+        handleAfterPublished={handleAfterPublished}
+        projectId={projectId}
+        projectName={projectName}
+      />
+    </OLModal>
+  )
+}
+
+export default memo(ManageTemplateModal)
diff --git a/services/web/frontend/js/features/template/components/modals/delete-template-modal.tsx b/services/web/frontend/js/features/template/components/modals/delete-template-modal.tsx
new file mode 100644
index 0000000000..8588703c30
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/modals/delete-template-modal.tsx
@@ -0,0 +1,43 @@
+import { useTranslation } from 'react-i18next'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+import Notification from '@/shared/components/notification'
+import TemplateActionModal from './template-action-modal'
+
+type DeleteTemplateModalProps = Pick<
+  React.ComponentProps<typeof TemplateActionModal>,
+  'template' | 'actionHandler' | 'showModal' | 'handleCloseModal'
+>
+
+function DeleteTemplateModal({
+  template,
+  actionHandler,
+  showModal,
+  handleCloseModal,
+}: DeleteTemplateModalProps) {
+  const { t } = useTranslation()
+
+  return (
+    <TemplateActionModal
+      action="delete"
+      actionHandler={actionHandler}
+      title={t('delete_template')}
+      showModal={showModal}
+      handleCloseModal={handleCloseModal}
+      template={template}
+    >
+      <p>{t('about_to_delete_template')}</p>
+      <ul>
+        <li key={`template-action-list-${template.id}`}>
+          <b>{template.name}</b>
+        </li>
+      </ul>
+
+      <Notification
+        content={t('this_action_cannot_be_undone')}
+        type="warning"
+      />
+    </TemplateActionModal>
+  )
+}
+
+export default withErrorBoundary(DeleteTemplateModal)
diff --git a/services/web/frontend/js/features/template/components/modals/edit-template-modal.tsx b/services/web/frontend/js/features/template/components/modals/edit-template-modal.tsx
new file mode 100644
index 0000000000..3c7e8d274a
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/modals/edit-template-modal.tsx
@@ -0,0 +1,139 @@
+import React, { useReducer, useState, useEffect, useRef, useCallback, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+//import { useFocusTrap } from '../../hooks/use-focus-trap'
+import TemplateActionModal from './template-action-modal'
+import { useTemplateContext } from '../../context/template-context'
+import TemplateFormFields from '../form/template-form-fields'
+import type { Template } from '../../../../../../types/template'
+
+type EditTemplateModalProps = {
+  showModal: boolean
+  handleCloseModal: () => void
+  actionHandler: (editedTemplate: Template) => void | Promise<void>
+}
+
+type ActionError = {
+  info?: {
+    statusCode?: number
+  }
+}
+
+type TemplateFormAction =
+  | { type: 'UPDATE'; payload: Partial<Template> }
+  | { type: 'RESET'; payload: Template }
+  | { type: 'CLEAR_FIELD'; field: keyof Template }
+
+function templateFormReducer(state: Template, action: TemplateFormAction): Template {
+  switch (action.type) {
+    case 'UPDATE':
+      return { ...state, ...action.payload }
+    case 'RESET':
+      return { ...action.payload }
+    case 'CLEAR_FIELD':
+      return { ...state, [action.field]: '' }
+    default:
+      return state
+  }
+}
+
+function EditTemplateModal({
+  showModal,
+  handleCloseModal,
+  actionHandler,
+}: EditTemplateModalProps) {
+  const { t } = useTranslation()
+  const { template } = useTemplateContext()
+
+  const [editedTemplate, dispatch] = useReducer(templateFormReducer, template)
+  const [actionError, setActionError] = useState<ActionError | null>(null)
+  const clearModalErrorRef = useRef<() => void>(() => {})
+
+  useEffect(() => {
+    if (showModal) {
+      dispatch({ type: 'RESET', payload: template })
+      setActionError(null)
+    }
+  }, [showModal, template])
+
+  const isConflictError = useMemo(
+    () => actionError?.info?.statusCode === 409,
+    [actionError]
+  )
+
+  const valid = useMemo(
+    () => editedTemplate.name.trim().length > 0,
+    [editedTemplate.name]
+  )
+
+  const handleChange = useCallback(
+    (changes: Partial<Template>) => {
+      dispatch({ type: 'UPDATE', payload: changes })
+      if ('name' in changes && isConflictError) {
+        setActionError(null)
+        clearModalErrorRef.current?.()
+      }
+    },
+    [isConflictError]
+  )
+
+  const handleEnterKey = useCallback(() => {
+    document.getElementById('submit-edit-template')?.click()
+  }, [])
+
+  const handleAction = useCallback(() => {
+    return Promise.resolve(actionHandler(editedTemplate)).catch(err => {
+      setActionError(err)
+      throw err
+    })
+  }, [actionHandler, editedTemplate])
+
+  const submitButtonDisabled = !valid || isConflictError
+
+  return (
+    <TemplateActionModal
+      action="edit"
+      title={t('edit_template')}
+      template={editedTemplate}
+      showModal={showModal}
+      handleCloseModal={handleCloseModal}
+      size="lg"
+      actionHandler={handleAction}
+      renderFooterButtons={({ onConfirm, onCancel, isProcessing }) => (
+        <>
+          <OLButton variant="secondary" onClick={onCancel}>
+            {t('cancel')}
+          </OLButton>
+          <OLButton
+            id="submit-edit-template"
+            onClick={onConfirm}
+            variant="primary"
+            disabled={submitButtonDisabled || isProcessing}
+          >
+            {t('save')}
+          </OLButton>
+        </>
+      )}
+      onClearError={fn => {
+        clearModalErrorRef.current = fn
+      }}
+    >
+      <div className="modal-body-publish">
+        <div className="content-as-table">
+          <OLForm onSubmit={e => e.preventDefault()}>
+            <TemplateFormFields
+              template={editedTemplate}
+              includeLanguage
+              onChange={handleChange}
+              onEnterKey={handleEnterKey}
+            />
+          </OLForm>
+        </div>
+      </div>
+    </TemplateActionModal>
+  )
+}
+
+export default withErrorBoundary(React.memo(EditTemplateModal))
diff --git a/services/web/frontend/js/features/template/components/modals/template-action-modal.tsx b/services/web/frontend/js/features/template/components/modals/template-action-modal.tsx
new file mode 100644
index 0000000000..24c78a0e29
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/modals/template-action-modal.tsx
@@ -0,0 +1,145 @@
+import { memo, useEffect, useState, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
+import { getUserFacingMessage } from '@/infrastructure/fetch-json'
+import * as eventTracking from '@/infrastructure/event-tracking'
+import { isSmallDevice } from '@/infrastructure/event-tracking'
+import useIsMounted from '@/shared/hooks/use-is-mounted'
+import Notification from '@/shared/components/notification'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLModal, {
+  OLModalBody,
+  OLModalFooter,
+  OLModalHeader,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+import type { Template } from '../../../../../../types/template'
+import { useFocusTrap } from '../../hooks/use-focus-trap'
+
+type TemplateActionModalProps = {
+  title: string
+  size?: string
+  action: 'delete' | 'edit'
+  actionHandler: (template: Template) => Promise<void>
+  handleCloseModal: () => void
+  template: Template
+  showModal: boolean
+  children?: React.ReactNode
+  renderFooterButtons?: (props: {
+    onConfirm: () => void
+    onCancel: () => void
+    isProcessing: boolean
+  }) => React.ReactNode
+  onClearError?: (clear: () => void) => void
+}
+
+function TemplateActionModal({
+  title,
+  size,
+  action,
+  actionHandler,
+  handleCloseModal,
+  showModal,
+  template,
+  children,
+  renderFooterButtons,
+  onClearError,
+}: TemplateActionModalProps) {
+  const { t } = useTranslation()
+  const [error, setError] = useState<false | { name: string; error: unknown }>(false)
+  const [isProcessing, setIsProcessing] = useState(false)
+  const isMounted = useIsMounted()
+  const modalRef = useRef<HTMLDivElement>(null)
+
+  useFocusTrap(modalRef, showModal)
+
+  useEffect(() => {
+    if (onClearError) {
+      onClearError(() => setError(false))
+    }
+  }, [onClearError])
+
+  async function handleActionForTemplate(template: Template) {
+    let errored
+    setIsProcessing(true)
+    setError(false)
+
+    try {
+      await actionHandler(template)
+    } catch (e) {
+      errored = { name: template.name, error: e }
+    }
+
+    if (isMounted.current) {
+      setIsProcessing(false)
+    }
+
+    if (!errored) {
+      handleCloseModal()
+    } else {
+      setError(errored)
+    }
+  }
+
+  useEffect(() => {
+    if (showModal) {
+      eventTracking.sendMB('template-info-page-interaction', {
+        action,
+        isSmallDevice,
+      })
+    } else {
+      setError(false)
+    }
+  }, [action, showModal])
+
+  return (
+    <OLModal
+      size={size}
+      show={showModal}
+      onHide={handleCloseModal}
+      id="action-tempate-modal"
+      backdrop="static"
+    >
+      <div ref={modalRef}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>{title}</OLModalTitle>
+        </OLModalHeader>
+
+        <OLModalBody>
+          {children}
+          {!isProcessing && error && (
+            <Notification
+              type="error"
+              title={error.name}
+              content={getUserFacingMessage(error.error) as string}
+            />
+          )}
+        </OLModalBody>
+
+        <OLModalFooter>
+          {renderFooterButtons ? (
+            renderFooterButtons({
+              onConfirm: () => handleActionForTemplate(template),
+              onCancel: handleCloseModal,
+              isProcessing,
+            })
+          ) : (
+            <>
+              <OLButton variant="secondary" onClick={handleCloseModal}>
+                {t('cancel')}
+              </OLButton>
+              <OLButton
+                variant="danger"
+                onClick={() => handleActionForTemplate(template)}
+                disabled={isProcessing}
+              >
+                {t('confirm')}
+              </OLButton>
+            </>
+          )}
+        </OLModalFooter>
+      </div>
+    </OLModal>
+  )
+}
+
+export default memo(TemplateActionModal)
diff --git a/services/web/frontend/js/features/template/components/settings/settings-language.tsx b/services/web/frontend/js/features/template/components/settings/settings-language.tsx
new file mode 100644
index 0000000000..e9b7929617
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/settings/settings-language.tsx
@@ -0,0 +1,42 @@
+import { useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import getMeta from '../../../../utils/meta'
+import SettingsMenuSelect from './settings-menu-select'
+import type { Optgroup } from './settings-menu-select'
+
+interface SettingsLanguageProps {
+  value: string
+  onChange: (value: string) => void
+}
+
+export default function SettingsLanguage({
+  value,
+  onChange,
+}: SettingsLanguageProps) {
+  const { t } = useTranslation()
+
+  const optgroup: Optgroup = useMemo(() => {
+    const options = (getMeta('ol-languages') ?? [])
+      // only include spell-check languages that are available in the client
+      .filter(language => language.dic !== undefined)
+
+    return {
+      label: 'Language',
+      options: options.map(language => ({
+        value: language.code,
+        label: language.name,
+      })),
+    }
+  }, [])
+
+  return (
+    <SettingsMenuSelect
+      onChange={onChange}
+      value={value}
+      options={[{ value: '', label: t('off') }]}
+      optgroup={optgroup}
+      label={t('spell_check')}
+      name="spellCheckLanguage"
+    />
+  )
+}
diff --git a/services/web/frontend/js/features/template/components/settings/settings-license.tsx b/services/web/frontend/js/features/template/components/settings/settings-license.tsx
new file mode 100644
index 0000000000..5b72d81b93
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/settings/settings-license.tsx
@@ -0,0 +1,33 @@
+import { useTranslation } from 'react-i18next'
+import SettingsMenuSelect from './settings-menu-select'
+import type { Option } from './settings-menu-select'
+
+export const licensesMap = {
+  'cc_by_4.0': 'Creative Commons CC BY 4.0',
+  'lppl_1.3c': 'LaTeX Project Public License 1.3c',
+  'other': 'Other (as stated in the work)',
+}
+
+interface SettingsLicenseProps {
+  value: string
+  onChange: (value: string) => void
+}
+
+export default function SettingsLicense({
+  value,
+  onChange,
+}: SettingsLicenseProps) {
+  const { t } = useTranslation()
+
+  const options = Object.entries(licensesMap).map(([value, label]) => ({ value, label }))
+
+  return (
+    <SettingsMenuSelect
+      name="license"
+      label={t('license')}
+      value={value}
+      onChange={onChange}
+      options={options}
+    />
+  )
+}
diff --git a/services/web/frontend/js/features/template/components/settings/settings-menu-select.tsx b/services/web/frontend/js/features/template/components/settings/settings-menu-select.tsx
new file mode 100644
index 0000000000..b1fa62226c
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/settings/settings-menu-select.tsx
@@ -0,0 +1,91 @@
+import { ChangeEventHandler, useCallback, useRef, useEffect } from 'react'
+import OLFormGroup from '@/features/ui/components/ol/ol-form-group'
+import OLFormLabel from '@/features/ui/components/ol/ol-form-label'
+import OLFormSelect from '@/features/ui/components/ol/ol-form-select'
+
+type PossibleValue = string | number | boolean
+
+export type Option<T extends PossibleValue = string> = {
+  value: T
+  label: string
+  ariaHidden?: 'true' | 'false'
+  disabled?: boolean
+}
+
+export type Optgroup<T extends PossibleValue = string> = {
+  label: string
+  options: Array<Option<T>>
+}
+
+type SettingsMenuSelectProps<T extends PossibleValue = string> = {
+  name: string
+  options: Array<Option<T>>
+  optgroup?: Optgroup<T>
+  onChange: (val: T) => void
+  value?: T
+  disabled?: boolean
+}
+
+export default function SettingsMenuSelect<T extends PossibleValue = string>(
+  props: SettingsMenuSelectProps<T>
+) {
+
+ const { name, options, optgroup, onChange, value, disabled = false } = props
+ const defaultApplied = useRef(false)
+
+  useEffect(() => {
+    if (value === undefined || value === null) {
+      onChange(options?.[0]?.value || optgroup?.options?.[0]?.value)
+    }
+  }, [value, options, onChange])
+
+  const handleChange: ChangeEventHandler<HTMLSelectElement> = useCallback(
+    event => {
+      const selectedValue = event.target.value
+      let onChangeValue: PossibleValue = selectedValue
+      if (typeof value === 'boolean') {
+        onChangeValue = selectedValue === 'true'
+      } else if (typeof value === 'number') {
+        onChangeValue = parseInt(selectedValue, 10)
+      }
+      onChange(onChangeValue as T)
+    },
+    [onChange, value]
+  )
+  const selectRef = useRef<HTMLSelectElement | null>(null)
+
+  return (
+    <>
+
+        <OLFormSelect
+          onChange={handleChange}
+          value={value?.toString()}
+          disabled={disabled}
+          ref={selectRef}
+        >
+          {options.map(option => (
+            <option
+              key={`${name}-${option.value}`}
+              value={option.value.toString()}
+              aria-hidden={option.ariaHidden}
+              disabled={option.disabled}
+            >
+              {option.label}
+            </option>
+          ))}
+          {optgroup ? (
+            <optgroup label={optgroup.label}>
+              {optgroup.options.map(option => (
+                <option
+                  value={option.value.toString()}
+                  key={option.value.toString()}
+                >
+                  {option.label}
+                </option>
+              ))}
+            </optgroup>
+          ) : null}
+        </OLFormSelect>
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/template/components/settings/settings-template-category.tsx b/services/web/frontend/js/features/template/components/settings/settings-template-category.tsx
new file mode 100644
index 0000000000..d886ce61e3
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/settings/settings-template-category.tsx
@@ -0,0 +1,44 @@
+import React, { useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import getMeta from '@/utils/meta'
+import SettingsMenuSelect from './settings-menu-select'
+import type { Option } from './settings-menu-select'
+
+interface SettingsTemplateCategoryProps {
+  value: string
+  onChange: (value: string) => void
+}
+
+const SettingsTemplateCategory: React.FC<SettingsTemplateCategoryProps> = ({
+  value,
+  onChange,
+}) => {
+  const { t } = useTranslation()
+
+  const options: Option[] = useMemo(() => {
+    const { templateLinks = [] } = getMeta('ol-ExposedSettings') as {
+      templateLinks?: Array<{ name: string; url: string; description: string }>
+    }
+
+    return templateLinks.map(({ name, url }) => ({
+      value: url,
+      label: name,
+    }))
+  }, [])
+
+  if (options.length === 0) {
+    return null
+  }
+
+  return (
+    <SettingsMenuSelect
+      name="category"
+      label={`${t('category')}:`}
+      value={value}
+      onChange={onChange}
+      options={options}
+    />
+  )
+}
+
+export default React.memo(SettingsTemplateCategory)
diff --git a/services/web/frontend/js/features/template/components/template-details.tsx b/services/web/frontend/js/features/template/components/template-details.tsx
new file mode 100644
index 0000000000..6c1a9b1059
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/template-details.tsx
@@ -0,0 +1,104 @@
+import { useTranslation } from 'react-i18next'
+import getMeta from '@/utils/meta'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { formatDate, fromNowDate } from '../../../utils/dates'
+import { cleanHtml } from '../../../../../modules/template-gallery/app/src/CleanHtml.mjs'
+import { useTemplateContext } from '../context/template-context'
+import DeleteTemplateButton from './delete-template-button'
+import EditTemplateButton from './edit-template-button'
+import { licensesMap } from './settings/settings-license'
+
+function TemplateDetails() {
+  const { t } = useTranslation()
+  const {template, setTemplate} = useTemplateContext()
+  const lastUpdatedDate = fromNowDate(template.lastUpdated)
+  const tooltipText = formatDate(template.lastUpdated)
+  const loggedInUserId = getMeta('ol-user_id')
+  const loggedInUserIsAdmin = getMeta('ol-userIsAdmin')
+
+  const openAsTemplateParams = new URLSearchParams({
+    version: template.version,
+    ...(template.brandVariationId && { brandVariationId: template.brandVariationId }),
+    name: template.name,
+    compiler: template.compiler,
+    mainFile: template.mainFile,
+    language: template.language,
+    ...(template.imageName && { imageName: template.imageName })
+  }).toString()
+
+  const sanitizedAuthor = cleanHtml(template.author, 'linksOnly') || t('anonymous')
+  const sanitizedDescription = cleanHtml(template.description, 'reachText')
+
+  return (
+    <>
+    <OLRow>
+      <OLCol md={12}>
+        <div className={"gallery-item-title"}>
+          <h1 className="h2">{template.name}</h1>
+        </div>
+      </OLCol>
+    </OLRow>
+    <OLRow className="cta-links-container">
+      <OLCol md={12} className="cta-links">
+        <a className="btn btn-primary cta-link" href={`/project/new/template/${template.id}?${openAsTemplateParams}`}>{t('open_as_template')}</a>
+        <a className="btn btn-secondary cta-link" href={`/template/${template.id}/preview?version=${template.version}`}>{t('view_pdf')}</a>
+      </OLCol>
+    </OLRow>
+    <div className="template-details-container">
+      <div className="template-detail">
+        <div>
+          <b>{t('author')}:</b>
+        </div>
+        <div dangerouslySetInnerHTML={{ __html: sanitizedAuthor }} />
+      </div>
+      <div className="template-detail">
+        <div>
+          <b>{t('last_updated')}:</b>
+        </div>
+        <div>
+          <OLTooltip
+            id={`${template.id}`}
+            description={tooltipText}
+            overlayProps={{ placement: 'bottom', trigger: ['hover', 'focus'] }}
+          >
+            <span>
+              {lastUpdatedDate.trim()}
+            </span>
+          </OLTooltip>
+        </div>
+      </div>
+      <div className="template-detail">
+        <div>
+          <b>{t('license')}:</b>
+        </div>
+        <div>
+          {licensesMap[template.license]}
+        </div>
+      </div>
+        {sanitizedDescription && (
+          <div className="template-detail">
+            <div>
+              <b>{t('abstract')}:</b>
+            </div>
+            <div
+              className="gallery-abstract"
+              data-ol-mathjax=""
+              dangerouslySetInnerHTML={{ __html: sanitizedDescription }}>
+            </div>
+          </div>
+        )}
+    </div>
+    {loggedInUserId && (loggedInUserId === template.owner || loggedInUserIsAdmin) && (
+      <OLRow className="cta-links-container">
+        <OLCol md={12} className="text-end">
+          <EditTemplateButton />
+          <DeleteTemplateButton />
+        </OLCol>
+      </OLRow>
+    )}
+    </>
+  )
+}
+export default TemplateDetails
diff --git a/services/web/frontend/js/features/template/components/template-preview.tsx b/services/web/frontend/js/features/template/components/template-preview.tsx
new file mode 100644
index 0000000000..547c86159d
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/template-preview.tsx
@@ -0,0 +1,23 @@
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import { useTemplateContext } from '../context/template-context'
+
+
+function TemplatePreview() {
+  const { template, setTemplate } = useTemplateContext()
+  return (
+    <div className="entry">
+      <OLRow>
+        <OLCol md={12}>
+          <div className="gallery-large-pdf-preview">
+            <img
+              src={`/template/${template.id}/preview?version=${template.version}&style=preview`}
+              alt={template.name}
+            />
+          </div>
+        </OLCol>
+      </OLRow>
+    </div>
+  )
+}
+export default TemplatePreview
diff --git a/services/web/frontend/js/features/template/components/template-root.tsx b/services/web/frontend/js/features/template/components/template-root.tsx
new file mode 100644
index 0000000000..ff15511202
--- /dev/null
+++ b/services/web/frontend/js/features/template/components/template-root.tsx
@@ -0,0 +1,70 @@
+import { useTranslation } from 'react-i18next'
+import useWaitForI18n from '../../../shared/hooks/use-wait-for-i18n'
+import withErrorBoundary from '../../../infrastructure/error-boundary'
+import { GenericErrorBoundaryFallback } from '@/shared/components/generic-error-boundary-fallback'
+import DefaultNavbar from '@/features/ui/components/bootstrap-5/navbar/default-navbar'
+import Footer from '@/features/ui/components/bootstrap-5/footer/footer'
+import getMeta from '@/utils/meta'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import TemplateDetails from './template-details'
+import TemplatePreview from './template-preview'
+import { useTemplateContext, TemplateProvider } from '../context/template-context'
+
+function TemplateRoot() {
+  const { isReady } = useWaitForI18n()
+  if (!isReady) {
+    return null
+  }
+  return (
+    <TemplateProvider>
+      <TemplatePageContent />
+    </TemplateProvider>
+  )
+}
+
+function TemplatePageContent() {
+  const { t } = useTranslation()
+  const navbarProps = getMeta('ol-navbar')
+  const footerProps = getMeta('ol-footer')
+  const { template } = useTemplateContext()
+  const { templateLinks } = getMeta('ol-ExposedSettings') || []
+  const categoryName = templateLinks?.find(link => link.url === template.category)?.name
+
+  return (
+    <>
+      <DefaultNavbar {...navbarProps} />
+      <main id="main-content" className="gallery content content-page">
+        <div className="container">
+          <OLRow className="previous-page-link-container">
+            <OLCol lg={6}>
+              <a className="previous-page-link" href={'/templates/all'}>
+                <i className="material-symbols material-symbols-rounded" aria-hidden="true">arrow_left_alt</i>
+                {t('all_templates')}
+              </a>
+              {categoryName && template.category !== '/templates/all' && (
+                <>
+                  <span className="mx-2">/</span>
+                  <a className="previous-page-link" href={template.category}>
+                    {categoryName}
+                  </a>
+                </>
+              )}
+            </OLCol>
+          </OLRow>
+          <OLRow>
+            <OLCol className="template-item-left-section" md={6}>
+              <TemplateDetails />
+            </OLCol>
+            <OLCol className="template-item-right-section" md={6}>
+              <TemplatePreview />
+            </OLCol>
+          </OLRow>
+        </div>
+      </main>
+      <Footer {...footerProps} />
+    </>
+  )
+}
+
+export default withErrorBoundary(TemplateRoot, GenericErrorBoundaryFallback)
diff --git a/services/web/frontend/js/features/template/context/template-context.tsx b/services/web/frontend/js/features/template/context/template-context.tsx
new file mode 100644
index 0000000000..06c28604a8
--- /dev/null
+++ b/services/web/frontend/js/features/template/context/template-context.tsx
@@ -0,0 +1,53 @@
+import {
+  createContext,
+  FC,
+  useCallback,
+  useContext,
+  useState,
+  useMemo,
+} from 'react'
+import useEventListener from '@/shared/hooks/use-event-listener'
+import getMeta from '@/utils/meta'
+import { Template } from '../../../../../types/template'
+
+type TemplateContextType = {
+  template: Template
+  setTemplate: (template: Template) => void
+}
+
+export const TemplateContext = createContext<TemplateContextType | undefined>(
+  undefined
+)
+
+type TemplateProviderProps = {
+  loadedTemplate: Template
+}
+
+export const TemplateProvider: FC<TemplateProviderProps> = ({ children }) => {
+  const loadedTemplate = useMemo(() => getMeta('ol-template'), [])
+  const [template, setTemplate] = useState(loadedTemplate)
+
+  const value = useMemo(
+    () => ({
+      template,
+      setTemplate,
+    }),
+    [template, setTemplate]
+  )
+
+  return (
+    <TemplateContext.Provider value={value}>
+      {children}
+    </TemplateContext.Provider>
+  )
+}
+
+export const useTemplateContext = () => {
+  const context = useContext(TemplateContext)
+  if (!context) {
+    throw new Error(
+      `useTemplateContext must be used within a TemplateProvider`
+    )
+  }
+  return context
+}
diff --git a/services/web/frontend/js/features/template/hooks/use-focus-trap.ts b/services/web/frontend/js/features/template/hooks/use-focus-trap.ts
new file mode 100644
index 0000000000..fa4e78570e
--- /dev/null
+++ b/services/web/frontend/js/features/template/hooks/use-focus-trap.ts
@@ -0,0 +1,46 @@
+import { useEffect } from 'react'
+
+export function useFocusTrap(ref: React.RefObject<HTMLElement>, enabled = true) {
+  useEffect(() => {
+    if (!enabled || !ref.current) return
+
+    const element = ref.current
+    const previouslyFocusedElement = document.activeElement as HTMLElement
+    const focusableElements = element.querySelectorAll<HTMLElement>(
+      'a[href], button, textarea, input, select, [tabindex]:not([tabindex="-1"])'
+    )
+
+    const firstElement = focusableElements[0]
+    const lastElement = focusableElements[focusableElements.length - 1]
+
+    // Don't override if something inside already received focus
+    const isAlreadyFocusedInside = element.contains(document.activeElement)
+
+    function handleKeyDown(e: KeyboardEvent) {
+      if (e.key !== 'Tab') return
+
+      if (e.shiftKey) {
+        if (document.activeElement === firstElement) {
+          e.preventDefault()
+          lastElement?.focus()
+        }
+      } else {
+        if (document.activeElement === lastElement) {
+          e.preventDefault()
+          firstElement?.focus()
+        }
+      }
+    }
+
+    element.addEventListener('keydown', handleKeyDown)
+
+    if (!isAlreadyFocusedInside) {
+      firstElement?.focus()
+    }
+
+    return () => {
+      element.removeEventListener('keydown', handleKeyDown)
+      previouslyFocusedElement?.focus()
+    }
+  }, [ref, enabled])
+}
diff --git a/services/web/frontend/js/features/template/util/api.ts b/services/web/frontend/js/features/template/util/api.ts
new file mode 100644
index 0000000000..bdf4f57174
--- /dev/null
+++ b/services/web/frontend/js/features/template/util/api.ts
@@ -0,0 +1,47 @@
+import { deleteJSON, postJSON } from '@/infrastructure/fetch-json'
+import { Template } from '../../../../../types/template'
+
+export function deleteTemplate(template: Template) {
+  return deleteJSON(`/template/${template.id}/delete`, {
+    body: {
+      version: template.version,
+    },
+  })
+}
+
+type UpdateTemplateOptions = {
+  template: Template
+  initialTemplate: Template
+  descriptionEdited: boolean
+}
+
+export function updateTemplate({
+  editedTemplate,
+  template
+}: UpdateTemplateOptions): Promise<Template | null> {
+  const updatedFields: Partial<Template> = {
+    name: editedTemplate.name.trim(),
+    license: editedTemplate.license.trim(),
+    category: editedTemplate.category,
+    language: editedTemplate.language,
+    authorMD: editedTemplate.authorMD.trim(),
+    descriptionMD: editedTemplate.descriptionMD.trim(),
+  }
+
+  const changedFields = Object.entries(updatedFields).reduce((diff, [key, value]) => {
+    if (value !== undefined && template[key as keyof Template] !== value) {
+      diff[key] = value
+    }
+    return diff
+  }, {} as Partial<Template>)
+
+  if (Object.keys(changedFields).length === 0) {
+    return null
+  }
+
+  const updated = postJSON(`/template/${editedTemplate.id}/edit`, {
+    body: changedFields
+  })
+
+  return updated
+}
diff --git a/services/web/frontend/js/features/token-access/components/sharing-updates-root.tsx b/services/web/frontend/js/features/token-access/components/sharing-updates-root.tsx
index 476bc83881..ade94ba304 100644
--- a/services/web/frontend/js/features/token-access/components/sharing-updates-root.tsx
+++ b/services/web/frontend/js/features/token-access/components/sharing-updates-root.tsx
@@ -12,6 +12,7 @@ import { sendMB } from '@/infrastructure/event-tracking'
 
 import LeaveProjectModal from './leave-project-modal'
 import OLButton from '@/features/ui/components/ol/ol-button'
+import { useLocation } from '@/shared/hooks/use-location'
 
 function SharingUpdatesRoot() {
   const [showModal, setShowModal] = useState(false)
@@ -20,6 +21,7 @@ function SharingUpdatesRoot() {
   const { isLoading, isSuccess, isError, runAsync } = useAsync()
   const projectId = getMeta('ol-project_id')
 
+  const location = useLocation()
   const joinProject = useCallback(() => {
     sendMB('notification-click', {
       name: 'link-sharing-collaborator',
@@ -30,7 +32,7 @@ function SharingUpdatesRoot() {
         location.assign(`/project/${projectId}`)
       })
       .catch(debugConsole.error)
-  }, [runAsync, projectId])
+  }, [runAsync, projectId, location])
 
   const viewProject = useCallback(() => {
     sendMB('notification-click', {
@@ -42,7 +44,7 @@ function SharingUpdatesRoot() {
         location.assign(`/project/${projectId}`)
       })
       .catch(debugConsole.error)
-  }, [runAsync, projectId])
+  }, [runAsync, projectId, location])
 
   const leaveProject = useCallback(() => {
     sendMB('notification-click', {
@@ -54,7 +56,7 @@ function SharingUpdatesRoot() {
         location.assign('/project')
       })
       .catch(debugConsole.error)
-  }, [runAsync, projectId])
+  }, [runAsync, projectId, location])
 
   if (!isReady) {
     return null
@@ -159,7 +161,6 @@ function SharingUpdatesRoot() {
   )
 }
 
-export default withErrorBoundary(
-  SharingUpdatesRoot,
-  GenericErrorBoundaryFallback
-)
+export default withErrorBoundary(SharingUpdatesRoot, () => (
+  <GenericErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/token-access/components/token-access-root.tsx b/services/web/frontend/js/features/token-access/components/token-access-root.tsx
index b38b3fdab4..6d0faa91a6 100644
--- a/services/web/frontend/js/features/token-access/components/token-access-root.tsx
+++ b/services/web/frontend/js/features/token-access/components/token-access-root.tsx
@@ -11,8 +11,8 @@ import {
   RequireAcceptData,
   RequireAcceptScreen,
 } from '@/features/token-access/components/require-accept-screen'
-import Icon from '@/shared/components/icon'
 import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
+import MaterialIcon from '@/shared/components/material-icon'
 
 type Mode = 'access-attempt' | 'v1Import' | 'requireAccept'
 
@@ -111,14 +111,14 @@ function TokenAccessRoot() {
   }
 
   return (
-    <div className="full-size">
+    <div>
       <div>
         <a
           href="/project"
           // TODO: class name
           style={{ fontSize: '2rem', marginLeft: '1rem', color: '#ddd' }}
         >
-          <Icon type="arrow-left" />
+          <MaterialIcon type="arrow_left_alt" style={{ fontSize: 'inherit' }} />
         </a>
       </div>
 
@@ -137,4 +137,6 @@ function TokenAccessRoot() {
   )
 }
 
-export default withErrorBoundary(TokenAccessRoot, GenericErrorBoundaryFallback)
+export default withErrorBoundary(TokenAccessRoot, () => (
+  <GenericErrorBoundaryFallback />
+))
diff --git a/services/web/frontend/js/features/tooltip/index-bs5.ts b/services/web/frontend/js/features/tooltip/index-bs5.ts
index 62c199e2e6..43d6bc015f 100644
--- a/services/web/frontend/js/features/tooltip/index-bs5.ts
+++ b/services/web/frontend/js/features/tooltip/index-bs5.ts
@@ -21,8 +21,8 @@ if (footerLanguageElement) {
 
 const allTooltips = document.querySelectorAll('[data-bs-toggle="tooltip"]')
 allTooltips.forEach(element => {
-  // eslint-disable-next-line no-unused-vars
-  const tooltip = new Tooltip(element)
+  // eslint-disable-next-line no-new
+  new Tooltip(element)
 })
 
 const possibleBadgeTooltips = document.querySelectorAll('[data-badge-tooltip]')
@@ -36,8 +36,8 @@ possibleBadgeTooltips.forEach(element => {
   if (element.parentElement) {
     const parentWidth = getElementWidth(element.parentElement)
     if (element.scrollWidth > parentWidth) {
-      // eslint-disable-next-line no-unused-vars
-      const tooltip = new Tooltip(element)
+      // eslint-disable-next-line no-new
+      new Tooltip(element)
     } else {
       element.parentElement.style.maxWidth = 'none'
     }
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-menu-with-ref.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-menu-with-ref.tsx
deleted file mode 100644
index 04807ad825..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-menu-with-ref.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import { forwardRef, SyntheticEvent } from 'react'
-import classnames from 'classnames'
-import RootCloseWrapper from 'react-overlays/lib/RootCloseWrapper'
-import { DropdownProps } from 'react-bootstrap'
-import { MergeAndOverride } from '../../../../../../types/utils'
-
-type DropdownMenuWithRefProps = MergeAndOverride<
-  Pick<DropdownProps, 'bsClass' | 'open' | 'pullRight' | 'onClose'>,
-  {
-    children: React.ReactNode
-    bsRole: 'menu'
-    menuRef: React.MutableRefObject<HTMLElement | undefined>
-    className?: string
-    // The props below are passed by react-bootstrap
-    labelledBy?: string | undefined
-    rootCloseEvent?: 'click' | 'mousedown' | undefined
-    onClose?: (e: SyntheticEvent<any>) => void
-  }
->
-
-const DropdownMenuWithRef = forwardRef<
-  HTMLUListElement,
-  DropdownMenuWithRefProps
->(function (props, ref) {
-  const {
-    children,
-    bsRole,
-    bsClass,
-    className,
-    open,
-    pullRight,
-    labelledBy,
-    menuRef,
-    onClose,
-    rootCloseEvent,
-    ...rest
-  } = props
-
-  // expose the menu reference to both the `menuRef` and `ref callback` from react-bootstrap
-  const handleRefs = (node: HTMLUListElement) => {
-    if (typeof ref === 'function') {
-      ref(node)
-    }
-    menuRef.current = node
-  }
-
-  // Implementation as suggested in
-  // https://react-bootstrap-v3.netlify.app/components/dropdowns/#btn-dropdowns-props-dropdown
-  return (
-    <RootCloseWrapper
-      disabled={!open}
-      onRootClose={onClose}
-      event={rootCloseEvent}
-    >
-      <ul
-        role={bsRole}
-        className={classnames(className, bsClass, {
-          'dropdown-menu-right': pullRight,
-        })}
-        aria-labelledby={labelledBy}
-        ref={handleRefs}
-        {...rest}
-      >
-        {children}
-      </ul>
-    </RootCloseWrapper>
-  )
-})
-DropdownMenuWithRef.displayName = 'DropdownMenuWithRef'
-
-export default DropdownMenuWithRef
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-toggle-with-tooltip.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-toggle-with-tooltip.tsx
deleted file mode 100644
index 9f0dedf622..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/dropdown-toggle-with-tooltip.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import { forwardRef } from 'react'
-import Tooltip from '../../../../shared/components/tooltip'
-import classnames from 'classnames'
-import { DropdownProps } from 'react-bootstrap'
-import { MergeAndOverride } from '../../../../../../types/utils'
-
-type CustomToggleProps = MergeAndOverride<
-  Pick<DropdownProps, 'bsClass' | 'open'>,
-  {
-    children: React.ReactNode
-    isOpened: boolean
-    bsRole: 'toggle'
-    className?: string
-    tooltipProps: Omit<React.ComponentProps<typeof Tooltip>, 'children'>
-  }
->
-
-const DropdownToggleWithTooltip = forwardRef<
-  HTMLButtonElement,
-  CustomToggleProps
->(function (props, ref) {
-  const {
-    tooltipProps,
-    isOpened,
-    children,
-    bsClass,
-    className,
-    open,
-    bsRole: _bsRole,
-    ...rest
-  } = props
-
-  const button = (
-    <button
-      type="button"
-      ref={ref}
-      className={classnames(bsClass, 'btn', className)}
-      aria-expanded={open}
-      aria-haspopup="true"
-      {...rest}
-    >
-      {children}
-    </button>
-  )
-
-  return (
-    <>{isOpened ? button : <Tooltip {...tooltipProps}>{button}</Tooltip>}</>
-  )
-})
-
-DropdownToggleWithTooltip.displayName = 'DropdownToggleWithTooltip'
-
-export default DropdownToggleWithTooltip
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/form/form-control.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/form/form-control.tsx
deleted file mode 100644
index 1cd6c617e0..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/form/form-control.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import {
-  FormControl as BS3FormControl,
-  FormControlProps as BS3FormControlProps,
-} from 'react-bootstrap'
-
-type FormControlProps = BS3FormControlProps & {
-  prepend?: React.ReactNode
-  append?: React.ReactNode
-}
-
-function FormControl({ prepend, append, ...props }: FormControlProps) {
-  return (
-    <>
-      {prepend && <div className="form-control-feedback-left">{prepend}</div>}
-      <BS3FormControl {...props} />
-      {append && <div className="form-control-feedback">{append}</div>}
-    </>
-  )
-}
-
-export default FormControl
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/toast-container.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/toast-container.tsx
deleted file mode 100644
index 314de8ba77..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/toast-container.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import classNames from 'classnames'
-import { FC, HTMLProps } from 'react'
-
-export const ToastContainer: FC<HTMLProps<HTMLDivElement>> = ({
-  children,
-  className,
-  ...props
-}) => {
-  return (
-    <div className={classNames('toast-container', className)} {...props}>
-      {children}
-    </div>
-  )
-}
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/toast.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/toast.tsx
deleted file mode 100644
index 4c35ddf4b5..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/toast.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import classNames from 'classnames'
-import { FC, useCallback, useEffect, useRef } from 'react'
-
-type ToastProps = {
-  onClose?: () => void
-  onExited?: () => void
-  autohide?: boolean
-  delay?: number
-  show: boolean
-  className?: string
-}
-export const Toast: FC<ToastProps> = ({
-  children,
-  delay = 5000,
-  onClose,
-  onExited,
-  autohide,
-  show,
-  className,
-}) => {
-  const delayRef = useRef(delay)
-  const onCloseRef = useRef(onClose)
-  const onExitedRef = useRef(onExited)
-  const shouldAutoHide = Boolean(autohide && show)
-
-  const handleTimeout = useCallback(() => {
-    if (shouldAutoHide) {
-      onCloseRef.current?.()
-      onExitedRef.current?.()
-    }
-  }, [shouldAutoHide])
-
-  useEffect(() => {
-    const timeout = window.setTimeout(handleTimeout, delayRef.current)
-    return () => window.clearTimeout(timeout)
-  }, [handleTimeout])
-
-  if (!show) {
-    return null
-  }
-
-  return (
-    <div
-      className={classNames('toast', show ? 'show' : 'hide', className)}
-      aria-live="assertive"
-      role="alert"
-    >
-      {children}
-    </div>
-  )
-}
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-3/toggle-button-group.tsx b/services/web/frontend/js/features/ui/components/bootstrap-3/toggle-button-group.tsx
deleted file mode 100644
index 2224e6160b..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-3/toggle-button-group.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import {
-  Children,
-  cloneElement,
-  isValidElement,
-  useState,
-  useEffect,
-} from 'react'
-import {
-  ToggleButtonGroup as BS3ToggleButtonGroup,
-  ToggleButtonGroupProps as BS3ToggleButtonGroupProps,
-  ToggleButtonProps as BS3ToggleButtonProps,
-} from 'react-bootstrap'
-
-function ToggleButtonGroup<T extends string | number>({
-  children,
-  value,
-  defaultValue,
-  onChange,
-  ...props
-}: BS3ToggleButtonGroupProps) {
-  const [selectedValue, setSelectedValue] = useState<T | T[] | null>(
-    defaultValue || (props.type === 'checkbox' ? [] : null)
-  )
-  const isControlled = value !== undefined
-
-  useEffect(() => {
-    if (isControlled) {
-      if (props.type === 'radio') {
-        setSelectedValue(value)
-      } else {
-        if (Array.isArray(value)) {
-          setSelectedValue(Array.from(value))
-        } else {
-          setSelectedValue([value])
-        }
-      }
-    }
-  }, [isControlled, value, props.type])
-
-  const handleButtonClick = (buttonValue: T) => {
-    if (props.type === 'radio') {
-      if (!isControlled) {
-        setSelectedValue(buttonValue)
-      }
-
-      onChange?.(buttonValue as any)
-    } else if (props.type === 'checkbox') {
-      const newValue = Array.isArray(selectedValue)
-        ? selectedValue.includes(buttonValue)
-          ? selectedValue.filter(val => val !== buttonValue) // Deselect
-          : [...selectedValue, buttonValue] // Select
-        : [buttonValue] // Initial selection if value is not array yet
-
-      if (!isControlled) {
-        setSelectedValue(newValue)
-      }
-
-      onChange?.(newValue)
-    }
-  }
-
-  // Clone children and add custom onClick handlers
-  const modifiedChildren = Children.map(children, child => {
-    if (isValidElement(child)) {
-      const childElement = child as React.ReactElement<
-        BS3ToggleButtonProps & { active?: boolean }
-      >
-
-      const isActive =
-        props.type === 'radio'
-          ? selectedValue === childElement.props.value
-          : Array.isArray(selectedValue) &&
-            selectedValue.includes(childElement.props.value as T)
-
-      return cloneElement(childElement, {
-        onClick: () => {
-          handleButtonClick(childElement.props.value as T)
-        },
-        active: isActive,
-      })
-    }
-
-    return child
-  })
-
-  return (
-    <BS3ToggleButtonGroup
-      {...props}
-      value={isControlled ? value : undefined}
-      defaultValue={defaultValue}
-      // Ignore the broken onChange handler
-      onChange={() => {}}
-    >
-      {modifiedChildren}
-    </BS3ToggleButtonGroup>
-  )
-}
-
-export default ToggleButtonGroup
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/badge-link-with-tooltip.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/badge-link-with-tooltip.tsx
index aea97ad6f2..43910f1a4c 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/badge-link-with-tooltip.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/badge-link-with-tooltip.tsx
@@ -1,4 +1,4 @@
-import { OverlayTrigger, Tooltip } from 'react-bootstrap-5'
+import { OverlayTrigger, Tooltip } from 'react-bootstrap'
 import type { MergeAndOverride } from '../../../../../../types/utils'
 import BadgeLink, { type BadgeLinkProps } from './badge-link'
 import { useEffect, useRef, useState } from 'react'
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/badge.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/badge.tsx
index 0e66500bc0..642be2e6b2 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/badge.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/badge.tsx
@@ -1,4 +1,4 @@
-import { Badge as BSBadge, BadgeProps as BSBadgeProps } from 'react-bootstrap-5'
+import { Badge as BSBadge, BadgeProps as BSBadgeProps } from 'react-bootstrap'
 import { MergeAndOverride } from '../../../../../../types/utils'
 
 export type BadgeProps = MergeAndOverride<
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/bootstrap-version-switcher.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/bootstrap-version-switcher.tsx
deleted file mode 100644
index 0bdfcca31f..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/bootstrap-version-switcher.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { isBootstrap5 } from '@/features/utils/bootstrap-5'
-
-type BootstrapVersionSwitcherProps = {
-  bs3?: React.ReactNode
-  bs5?: React.ReactNode
-}
-
-function BootstrapVersionSwitcher({
-  bs3,
-  bs5,
-}: BootstrapVersionSwitcherProps): React.ReactElement {
-  return <>{isBootstrap5() ? bs5 : bs3}</>
-}
-
-export default BootstrapVersionSwitcher
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
index 4eec23475a..cede608249 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/button.tsx
@@ -1,5 +1,5 @@
 import { forwardRef } from 'react'
-import { Button as BS5Button, Spinner } from 'react-bootstrap-5'
+import { Button as BS5Button, Spinner } from 'react-bootstrap'
 import type { ButtonProps } from '@/features/ui/components/types/button-props'
 import classNames from 'classnames'
 import { useTranslation } from 'react-i18next'
@@ -52,6 +52,7 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
         ref={ref}
         disabled={isLoading || props.disabled}
         data-ol-loading={isLoading}
+        role={undefined}
       >
         {isLoading && (
           <span className="spinner-container">
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-menu.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-menu.tsx
index aa35c158d9..402d465923 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-menu.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-menu.tsx
@@ -7,8 +7,7 @@ import {
   DropdownDivider as BS5DropdownDivider,
   DropdownHeader as BS5DropdownHeader,
   Button as BS5Button,
-  type ButtonProps,
-} from 'react-bootstrap-5'
+} from 'react-bootstrap'
 import type {
   DropdownProps,
   DropdownItemProps,
@@ -109,19 +108,20 @@ const ForwardReferredDropdownItem = fixedForwardRef(DropdownItem, {
 
 export { ForwardReferredDropdownItem as DropdownItem }
 
-export const DropdownToggleCustom = forwardRef<HTMLButtonElement, ButtonProps>(
-  ({ children, className, ...props }, ref) => (
-    <BS5Button
-      ref={ref}
-      className={classnames('custom-toggle', className)}
-      {...props}
-    >
-      {children}
-      <MaterialIcon type="expand_more" />
-    </BS5Button>
-  )
-)
-DropdownToggleCustom.displayName = 'CustomCaret'
+export const DropdownToggleCustom = forwardRef<
+  HTMLButtonElement,
+  React.ComponentProps<typeof BS5Button>
+>(({ children, className, ...props }, ref) => (
+  <BS5Button
+    ref={ref}
+    className={classnames('custom-toggle', className)}
+    {...props}
+  >
+    {children}
+    <MaterialIcon type="expand_more" />
+  </BS5Button>
+))
+DropdownToggleCustom.displayName = 'DropdownToggleCustom'
 
 export const DropdownToggle = forwardRef<
   typeof BS5DropdownToggle,
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-toggle-with-tooltip.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-toggle-with-tooltip.tsx
deleted file mode 100644
index f2ba81fbad..0000000000
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/dropdown-toggle-with-tooltip.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import { ReactNode, forwardRef } from 'react'
-import { BsPrefixRefForwardingComponent } from 'react-bootstrap-5/helpers'
-import type { DropdownToggleProps } from '@/features/ui/components/types/dropdown-menu-props'
-import {
-  DropdownToggle as BS5DropdownToggle,
-  OverlayTrigger,
-  OverlayTriggerProps,
-  Tooltip,
-} from 'react-bootstrap-5'
-import type { MergeAndOverride } from '../../../../../../types/utils'
-
-type DropdownToggleWithTooltipProps = MergeAndOverride<
-  DropdownToggleProps,
-  {
-    children: ReactNode
-    overlayTriggerProps?: Omit<OverlayTriggerProps, 'overlay' | 'children'>
-    toolTipDescription: string
-    tooltipProps?: Omit<React.ComponentProps<typeof Tooltip>, 'children'>
-    'aria-label'?: string
-  }
->
-const DropdownToggleWithTooltip = forwardRef<
-  BsPrefixRefForwardingComponent<'button', DropdownToggleProps>,
-  DropdownToggleWithTooltipProps
->(
-  (
-    {
-      children,
-      toolTipDescription,
-      overlayTriggerProps,
-      tooltipProps,
-      id,
-      ...toggleProps
-    },
-    ref
-  ) => {
-    return (
-      <OverlayTrigger
-        overlay={<Tooltip {...tooltipProps}>{toolTipDescription}</Tooltip>}
-        {...overlayTriggerProps}
-      >
-        <BS5DropdownToggle {...toggleProps} ref={ref}>
-          {children}
-        </BS5DropdownToggle>
-      </OverlayTrigger>
-    )
-  }
-)
-
-DropdownToggleWithTooltip.displayName = 'DropdownToggleWithTooltip'
-
-export default DropdownToggleWithTooltip
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer-base.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer-base.tsx
index dd85660ffd..f2fd7e3a82 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer-base.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer-base.tsx
@@ -26,7 +26,7 @@ function FatFooterBase() {
     <footer className="fat-footer-base">
       <div className="fat-footer-base-section fat-footer-base-meta">
         <div className="fat-footer-base-item">
-          <div className="fat-footer-base-copyright">
+          <div className="fat-footer-base-copyright" translate="no">
             © {currentYear} Overleaf
           </div>
           <FooterBaseLink href="/legal">
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer.tsx
index 361a3afbdb..8592997f9a 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/fat-footer.tsx
@@ -21,12 +21,20 @@ function FatFooter() {
       title: t('About'),
       links: [
         { href: '/about', label: t('footer_about_us') },
-        { href: '/about/values', label: t('our_values') },
-        { href: '/about/careers', label: t('careers') },
-        { href: '/for/press', label: t('press_and_awards') },
+        { href: 'https://digitalscience.pinpointhq.com/', label: t('careers') },
         { href: '/blog', label: t('blog') },
       ],
     },
+    {
+      title: t('Solutions'),
+      links: [
+        { href: '/for/enterprises', label: t('for_business') },
+        { href: '/for/universities', label: t('for_universities') },
+        { href: '/for/government', label: t('for_government') },
+        { href: '/for/publishers', label: t('for_publishers') },
+        { href: '/about/customer-stories', label: t('customer_stories') },
+      ],
+    },
     {
       title: t('Learn'),
       links: [
@@ -45,29 +53,25 @@ function FatFooter() {
       ],
     },
     {
-      title: t('Plans and Pricing'),
+      title: t('Pricing'),
       links: [
         {
-          href: '/learn/how-to/Overleaf_premium_features',
-          label: t('premium_features'),
+          href: '/user/subscription/plans?itm_referrer=footer-for-indv',
+          label: t('for_individuals'),
         },
         {
-          href: '/user/subscription/plans?itm_referrer=footer-for-indv-groups',
-          label: t('for_individuals_and_groups'),
+          href: '/user/subscription/plans?plan=group&itm_referrer=footer-for-groups',
+          label: t('for_groups_and_organizations'),
         },
-        { href: '/for/enterprises', label: t('for_enterprise') },
-        { href: '/for/universities', label: t('for_universities') },
         {
           href: '/user/subscription/plans?itm_referrer=footer-for-students#student-annual',
           label: t('for_students'),
         },
-        { href: '/for/government', label: t('for_government') },
       ],
     },
     {
       title: t('Get Involved'),
       links: [
-        { href: '/for/community/advisors', label: t('become_an_advisor') },
         {
           href: 'https://forms.gle/67PSpN1bLnjGCmPQ9',
           label: t('let_us_know_what_you_think'),
@@ -78,7 +82,6 @@ function FatFooter() {
     {
       title: t('Help'),
       links: [
-        { href: '/about/why-latex', label: t('why_latex') },
         { href: '/learn', label: t('Documentation') },
         { href: '/contact', label: t('footer_contact_us') },
         { href: 'https://status.overleaf.com/', label: t('website_status') },
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/thin-footer.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/thin-footer.tsx
index ae95136547..f632bfbb5e 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/footer/thin-footer.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/footer/thin-footer.tsx
@@ -76,7 +76,9 @@ function ThinFooter({
                 {hasCustomLeftNav ? <Separator /> : null}
               </>
             ) : null}
-            {leftItems?.map(item => <FooterItemLi key={item.text} {...item} />)}
+            {leftItems?.map(item => (
+              <FooterItemLi key={item.text} {...item} />
+            ))}
           </ul>
           <ul className="site-footer-items col-lg-3 text-end">
             {rightItems?.map(item => (
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-control.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-control.tsx
index 63618c3fad..5a4ab4f00f 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-control.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-control.tsx
@@ -1,20 +1,14 @@
 import React, { forwardRef } from 'react'
-import {
-  Form,
-  FormControlProps as BS5FormControlProps,
-} from 'react-bootstrap-5'
+import { Form, FormControlProps as BS5FormControlProps } from 'react-bootstrap'
 import classnames from 'classnames'
-import type { BsPrefixRefForwardingComponent } from 'react-bootstrap-5/helpers'
 
 export type OLBS5FormControlProps = BS5FormControlProps & {
   prepend?: React.ReactNode
   append?: React.ReactNode
+  rows?: number
 }
 
-const FormControl: BsPrefixRefForwardingComponent<
-  'input',
-  OLBS5FormControlProps
-> = forwardRef<HTMLInputElement, OLBS5FormControlProps>(
+const FormControl = forwardRef<HTMLInputElement, OLBS5FormControlProps>(
   ({ prepend, append, className, ...props }, ref) => {
     if (prepend || append) {
       const wrapperClassNames = classnames('form-control-wrapper', {
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-feedback.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-feedback.tsx
index 85c91031ba..67c31aa96c 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-feedback.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-feedback.tsx
@@ -1,4 +1,4 @@
-import { Form } from 'react-bootstrap-5'
+import { Form } from 'react-bootstrap'
 import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
 import { ComponentProps } from 'react'
 
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-group.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-group.tsx
index 19b88cdc65..5807ef9839 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-group.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-group.tsx
@@ -1,5 +1,5 @@
 import { forwardRef } from 'react'
-import { FormGroup as BS5FormGroup, FormGroupProps } from 'react-bootstrap-5'
+import { FormGroup as BS5FormGroup, FormGroupProps } from 'react-bootstrap'
 import classnames from 'classnames'
 
 const FormGroup = forwardRef<typeof BS5FormGroup, FormGroupProps>(
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-text.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-text.tsx
index fe9b939680..78a962ad49 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-text.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/form/form-text.tsx
@@ -1,4 +1,4 @@
-import { Form, FormTextProps as BS5FormTextProps } from 'react-bootstrap-5'
+import { Form, FormTextProps as BS5FormTextProps } from 'react-bootstrap'
 import MaterialIcon from '@/shared/components/material-icon'
 import classnames from 'classnames'
 import { MergeAndOverride } from '../../../../../../../types/utils'
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/icon-button.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/icon-button.tsx
index 29d6aa52ef..d738bd2cd5 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/icon-button.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/icon-button.tsx
@@ -6,7 +6,15 @@ import type { IconButtonProps } from '@/features/ui/components/types/icon-button
 
 const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(
   (
-    { accessibilityLabel, icon, isLoading = false, size, className, ...props },
+    {
+      accessibilityLabel,
+      icon,
+      isLoading = false,
+      size,
+      className,
+      unfilled,
+      ...props
+    },
     ref
   ) => {
     const iconButtonClassName = classNames(className, {
@@ -17,6 +25,7 @@ const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(
     const iconSizeClassName = size === 'lg' ? 'icon-large' : 'icon-small'
     const materialIconClassName = classNames(iconSizeClassName, {
       'button-content-hidden': isLoading,
+      unfilled,
     })
 
     return (
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/language-picker.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/language-picker.tsx
index 0ae53c807c..ccda7abc6f 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/language-picker.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/language-picker.tsx
@@ -49,7 +49,7 @@ function LanguagePicker({ showHeader } = { showHeader: false }) {
               return null
             const isActive = subdomainDetails.lngCode === currentLangCode
             return (
-              <li role="none" key={subdomain}>
+              <li role="none" key={subdomain} translate="no">
                 <DropdownItem
                   href={`${subdomainDetails.url}${currentUrlWithQueryParams}`}
                   active={isActive}
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/account-menu-items.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/account-menu-items.tsx
index 825d56c100..d00e2f964b 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/account-menu-items.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/account-menu-items.tsx
@@ -1,4 +1,4 @@
-import { Dropdown } from 'react-bootstrap-5'
+import { Dropdown } from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
 import getMeta from '@/utils/meta'
 import type { NavbarSessionUser } from '@/features/ui/components/types/navbar'
@@ -25,7 +25,7 @@ export function AccountMenuItems({
       </Dropdown.Item>
       <NavDropdownDivider />
       <NavDropdownLinkItem href="/user/settings">
-        {t('Account Settings')}
+        {t('account_settings')}
       </NavDropdownLinkItem>
       {showSubscriptionLink ? (
         <NavDropdownLinkItem href="/user/subscription">
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/admin-menu.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/admin-menu.tsx
index c50fa00911..fdc670423a 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/admin-menu.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/admin-menu.tsx
@@ -8,6 +8,7 @@ export default function AdminMenu({
   canDisplayAdminRedirect,
   canDisplaySplitTestMenu,
   canDisplaySurveyMenu,
+  canDisplayScriptLogMenu,
   adminUrl,
 }: Pick<
   DefaultNavbarMetadata,
@@ -15,6 +16,7 @@ export default function AdminMenu({
   | 'canDisplayAdminRedirect'
   | 'canDisplaySplitTestMenu'
   | 'canDisplaySurveyMenu'
+  | 'canDisplayScriptLogMenu'
   | 'adminUrl'
 >) {
   const sendProjectListMB = useSendProjectListMB()
@@ -57,6 +59,11 @@ export default function AdminMenu({
           Manage Surveys
         </NavDropdownLinkItem>
       ) : null}
+      {canDisplayScriptLogMenu ? (
+        <NavDropdownLinkItem href="/admin/script-logs">
+          View Script Logs
+        </NavDropdownLinkItem>
+      ) : null}
     </NavDropdownMenu>
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/contact-us-item.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/contact-us-item.tsx
index 80d731cc46..d14be5ab55 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/contact-us-item.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/contact-us-item.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { DropdownItem } from 'react-bootstrap-5'
+import { DropdownItem } from 'react-bootstrap'
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
 import {
   type ExtraSegmentations,
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
index b7a843d99f..8e5429dbde 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/default-navbar.tsx
@@ -1,7 +1,7 @@
-import { useState } from 'react'
+import React, { useState } from 'react'
 import { sendMB } from '@/infrastructure/event-tracking'
 import { useTranslation } from 'react-i18next'
-import { Button, Container, Nav, Navbar } from 'react-bootstrap-5'
+import { Button, Container, Nav, Navbar } from 'react-bootstrap'
 import useWaitForI18n from '@/shared/hooks/use-wait-for-i18n'
 import AdminMenu from '@/features/ui/components/bootstrap-5/navbar/admin-menu'
 import type { DefaultNavbarMetadata } from '@/features/ui/components/types/default-navbar-metadata'
@@ -13,15 +13,22 @@ import MaterialIcon from '@/shared/components/material-icon'
 import { useContactUsModal } from '@/shared/hooks/use-contact-us-modal'
 import { UserProvider } from '@/shared/context/user-context'
 import { X } from '@phosphor-icons/react'
+import overleafWhiteLogo from '@/shared/svgs/overleaf-white.svg'
+import overleafBlackLogo from '@/shared/svgs/overleaf-black.svg'
+import type { CSSPropertiesWithVariables } from '../../../../../../../types/css-properties-with-variables'
 
-function DefaultNavbar(props: DefaultNavbarMetadata) {
+function DefaultNavbar(
+  props: DefaultNavbarMetadata & { overleafLogo?: string }
+) {
   const {
+    overleafLogo,
     customLogo,
     title,
     canDisplayAdminMenu,
     canDisplayAdminRedirect,
     canDisplaySplitTestMenu,
     canDisplaySurveyMenu,
+    canDisplayScriptLogMenu,
     enableUpgradeButton,
     suppressNavbarRight,
     suppressNavContentLinks,
@@ -33,30 +40,35 @@ function DefaultNavbar(props: DefaultNavbarMetadata) {
     items,
   } = props
   const { t } = useTranslation()
-  const { isReady } = useWaitForI18n()
   const [expanded, setExpanded] = useState(false)
 
-  // The Contact Us modal is rendered at this level rather than inside the nav
+  // The Contact us modal is rendered at this level rather than inside the nav
   // bar because otherwise the help wiki search results dropdown doesn't show up
   const { modal: contactUsModal, showModal: showContactUsModal } =
     useContactUsModal({
       autofillProjectUrl: false,
     })
 
-  if (!isReady) {
-    return null
-  }
-
   return (
     <>
       <Navbar
         className="navbar-default navbar-main"
         expand="lg"
         onToggle={expanded => setExpanded(expanded)}
+        style={
+          {
+            '--navbar-brand-image-default-url': `url("${overleafWhiteLogo}")`,
+            '--navbar-brand-image-redesign-url': `url("${overleafBlackLogo}")`,
+          } as CSSPropertiesWithVariables
+        }
       >
         <Container className="navbar-container" fluid>
           <div className="navbar-header">
-            <HeaderLogoOrTitle title={title} customLogo={customLogo} />
+            <HeaderLogoOrTitle
+              title={title}
+              overleafLogo={overleafLogo}
+              customLogo={customLogo}
+            />
             {enableUpgradeButton ? (
               <Button
                 as="a"
@@ -101,6 +113,7 @@ function DefaultNavbar(props: DefaultNavbarMetadata) {
                       canDisplayAdminRedirect={canDisplayAdminRedirect}
                       canDisplaySplitTestMenu={canDisplaySplitTestMenu}
                       canDisplaySurveyMenu={canDisplaySurveyMenu}
+                      canDisplayScriptLogMenu={canDisplayScriptLogMenu}
                       adminUrl={adminUrl}
                     />
                   ) : null}
@@ -140,4 +153,14 @@ function DefaultNavbar(props: DefaultNavbarMetadata) {
   )
 }
 
+export const DefaultNavbarRoot = (props: DefaultNavbarMetadata) => {
+  const { isReady } = useWaitForI18n()
+
+  if (!isReady) {
+    return null
+  }
+
+  return <DefaultNavbar {...props} />
+}
+
 export default DefaultNavbar
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
index 44500f1b82..3eefc8e2d1 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/header-logo-or-title.tsx
@@ -2,11 +2,13 @@ import type { DefaultNavbarMetadata } from '@/features/ui/components/types/defau
 import getMeta from '@/utils/meta'
 
 export default function HeaderLogoOrTitle({
+  overleafLogo,
   customLogo,
   title,
-}: Pick<DefaultNavbarMetadata, 'customLogo' | 'title'>) {
+}: Pick<DefaultNavbarMetadata, 'customLogo' | 'title'> & {
+  overleafLogo?: string
+}) {
   const { appName } = getMeta('ol-ExposedSettings')
-
   if (customLogo) {
     return (
       // eslint-disable-next-line jsx-a11y/anchor-has-content
@@ -24,9 +26,16 @@ export default function HeaderLogoOrTitle({
       </a>
     )
   } else {
+    const style = overleafLogo
+      ? {
+          style: {
+            backgroundImage: `url("${overleafLogo}")`,
+          },
+        }
+      : null
     return (
       // eslint-disable-next-line jsx-a11y/anchor-has-content
-      <a href="/" aria-label={appName} className="navbar-brand" />
+      <a href="/" aria-label={appName} className="navbar-brand" {...style} />
     )
   }
 }
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-in-items.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-in-items.tsx
index 5273eb8e98..7df9da710e 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-in-items.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-in-items.tsx
@@ -4,6 +4,7 @@ import type { NavbarSessionUser } from '@/features/ui/components/types/navbar'
 import NavLinkItem from '@/features/ui/components/bootstrap-5/navbar/nav-link-item'
 import { AccountMenuItems } from './account-menu-items'
 import { useSendProjectListMB } from '@/features/project-list/components/project-list-events'
+import getMeta from '@/utils/meta'
 
 export default function LoggedInItems({
   sessionUser,
@@ -14,11 +15,18 @@ export default function LoggedInItems({
 }) {
   const { t } = useTranslation()
   const sendProjectListMB = useSendProjectListMB()
+  const { templatesEnabled } = getMeta('ol-ExposedSettings')
+
   return (
     <>
       <NavLinkItem href="/project" className="nav-item-projects">
         {t('projects')}
       </NavLinkItem>
+      {templatesEnabled && (
+        <NavLinkItem href="/templates" className="nav-item-templates">
+          {t('templates')}
+        </NavLinkItem>
+      )}
       <NavDropdownMenu
         title={t('Account')}
         className="nav-item-account"
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-out-items.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-out-items.tsx
index 13a0875c92..e59aeec2bd 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-out-items.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/logged-out-items.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from 'react-i18next'
 import NavLinkItem from '@/features/ui/components/bootstrap-5/navbar/nav-link-item'
 import { useSendProjectListMB } from '@/features/project-list/components/project-list-events'
+import getMeta from '@/utils/meta'
 
 export default function LoggedOutItems({
   showSignUpLink,
@@ -9,9 +10,15 @@ export default function LoggedOutItems({
 }) {
   const { t } = useTranslation()
   const sendMB = useSendProjectListMB()
+  const { templatesEnabled } = getMeta('ol-ExposedSettings')
 
   return (
     <>
+      {templatesEnabled && (
+        <NavLinkItem href="/templates" className="nav-item-templates">
+          {t('templates')}
+        </NavLinkItem>
+      )}
       {showSignUpLink ? (
         <NavLinkItem
           href="/register"
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-link-item.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-link-item.tsx
index 5acc808c21..1d418a344b 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-link-item.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-link-item.tsx
@@ -1,7 +1,7 @@
 import { ReactNode } from 'react'
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
-import { DropdownItem } from 'react-bootstrap-5'
-import { DropdownItemProps } from 'react-bootstrap-5/DropdownItem'
+import { DropdownItem } from 'react-bootstrap'
+import { DropdownItemProps } from 'react-bootstrap/DropdownItem'
 
 export default function NavDropdownLinkItem({
   href,
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-menu.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-menu.tsx
index 6c588eef46..9b962238c1 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-menu.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-dropdown-menu.tsx
@@ -1,5 +1,5 @@
 import { type ReactNode, useState } from 'react'
-import { Dropdown } from 'react-bootstrap-5'
+import { Dropdown } from 'react-bootstrap'
 import { CaretUp, CaretDown } from '@phosphor-icons/react'
 import { useDsNavStyle } from '@/features/project-list/components/use-is-ds-nav'
 
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-item.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-item.tsx
index 58295a47eb..3a55f2791b 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-item.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-item.tsx
@@ -1,4 +1,4 @@
-import { Nav, NavItemProps } from 'react-bootstrap-5'
+import { Nav, NavItemProps } from 'react-bootstrap'
 
 export default function NavItem(props: Omit<NavItemProps, 'as'>) {
   const { children, ...rest } = props
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-link-item.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-link-item.tsx
index 4e3875f5bb..519b84762e 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-link-item.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/navbar/nav-link-item.tsx
@@ -1,5 +1,5 @@
 import { ReactNode } from 'react'
-import { Nav } from 'react-bootstrap-5'
+import { Nav } from 'react-bootstrap'
 import NavItem from '@/features/ui/components/bootstrap-5/navbar/nav-item'
 
 export default function NavLinkItem({
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/table.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/table.tsx
index 8f6fe3ee60..176d6f737c 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/table.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/table.tsx
@@ -1,4 +1,4 @@
-import { Table as BS5Table } from 'react-bootstrap-5'
+import { Table as BS5Table } from 'react-bootstrap'
 import classnames from 'classnames'
 
 export function TableContainer({
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/tag.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/tag.tsx
index dda1c9861e..3a3fec7879 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/tag.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/tag.tsx
@@ -1,5 +1,5 @@
 import { useTranslation } from 'react-i18next'
-import { Badge, BadgeProps } from 'react-bootstrap-5'
+import { Badge, BadgeProps } from 'react-bootstrap'
 import MaterialIcon from '@/shared/components/material-icon'
 import { MergeAndOverride } from '../../../../../../types/utils'
 import classnames from 'classnames'
diff --git a/services/web/frontend/js/features/ui/components/bootstrap-5/tooltip.tsx b/services/web/frontend/js/features/ui/components/bootstrap-5/tooltip.tsx
index 3e71208d20..5582a00ca7 100644
--- a/services/web/frontend/js/features/ui/components/bootstrap-5/tooltip.tsx
+++ b/services/web/frontend/js/features/ui/components/bootstrap-5/tooltip.tsx
@@ -1,26 +1,28 @@
-import { cloneElement, useEffect, forwardRef } from 'react'
+import {
+  cloneElement,
+  useEffect,
+  forwardRef,
+  useState,
+  useCallback,
+} from 'react'
 import {
   OverlayTrigger,
   OverlayTriggerProps,
   Tooltip as BSTooltip,
   TooltipProps as BSTooltipProps,
-} from 'react-bootstrap-5'
+} from 'react-bootstrap'
 import { callFnsInSequence } from '@/utils/functions'
 
+const DEFAULT_DELAY_SHOW = 300
+// Slightly lower value avoids flickering when an adjacent tooltip is shown before the previous one hides
+const DEFAULT_DELAY_HIDE = 290
+
 type OverlayProps = Omit<OverlayTriggerProps, 'overlay' | 'children'>
 
-type UpdatingTooltipProps = {
-  popper: {
-    scheduleUpdate: () => void
-  }
-  show: boolean
-  [x: string]: unknown
-}
-
-const UpdatingTooltip = forwardRef<HTMLDivElement, UpdatingTooltipProps>(
+const UpdatingTooltip = forwardRef<HTMLDivElement, BSTooltipProps>(
   ({ popper, children, show: _, ...props }, ref) => {
     useEffect(() => {
-      popper.scheduleUpdate()
+      popper?.scheduleUpdate?.()
     }, [children, popper])
 
     return (
@@ -49,18 +51,36 @@ function Tooltip({
   overlayProps,
   hidden,
 }: TooltipProps) {
-  const delay = overlayProps?.delay
-  let delayShow = 300
-  let delayHide = 300
-  if (delay) {
-    delayShow = typeof delay === 'number' ? delay : delay.show
-    delayHide = typeof delay === 'number' ? delay : delay.hide
-  }
+  const [show, setShow] = useState(false)
+
+  const handleKeyDown = useCallback(
+    (e: KeyboardEvent) => {
+      if (show && e.key === 'Escape') {
+        setShow(false)
+        e.stopPropagation()
+      }
+    },
+    [show, setShow]
+  )
+
+  useEffect(() => {
+    document.addEventListener('keydown', handleKeyDown, true)
+    return () => document.removeEventListener('keydown', handleKeyDown, true)
+  }, [handleKeyDown])
 
   const hideTooltip = (e: React.MouseEvent) => {
     if (e.currentTarget instanceof HTMLElement) {
       e.currentTarget.blur()
     }
+    setShow(false)
+  }
+
+  const delay = overlayProps?.delay
+  let delayShow = DEFAULT_DELAY_SHOW
+  let delayHide = DEFAULT_DELAY_HIDE
+  if (delay) {
+    delayShow = typeof delay === 'number' ? delay : delay.show
+    delayHide = typeof delay === 'number' ? Math.max(delay - 10, 0) : delay.hide
   }
 
   return (
@@ -77,10 +97,14 @@ function Tooltip({
       {...overlayProps}
       delay={{ show: delayShow, hide: delayHide }}
       placement={overlayProps?.placement || 'top'}
+      show={show}
+      onToggle={setShow}
     >
-      {cloneElement(children, {
-        onClick: callFnsInSequence(children.props.onClick, hideTooltip),
-      })}
+      {overlayProps?.trigger === 'click'
+        ? children
+        : cloneElement(children, {
+            onClick: callFnsInSequence(children.props.onClick, hideTooltip),
+          })}
     </OverlayTrigger>
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/icons/ol-tag-icon.tsx b/services/web/frontend/js/features/ui/components/ol/icons/ol-tag-icon.tsx
index 8e81387bbe..4a2fbadec9 100644
--- a/services/web/frontend/js/features/ui/components/ol/icons/ol-tag-icon.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/icons/ol-tag-icon.tsx
@@ -1,12 +1,5 @@
-import Icon from '@/shared/components/icon'
 import MaterialIcon from '@/shared/components/material-icon'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 
 export default function OLTagIcon() {
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<Icon type="tag" fw />}
-      bs5={<MaterialIcon type="sell" />}
-    />
-  )
+  return <MaterialIcon type="sell" />
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-badge.tsx b/services/web/frontend/js/features/ui/components/ol/ol-badge.tsx
index 0e88529a86..7344ddb6f8 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-badge.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-badge.tsx
@@ -1,40 +1,17 @@
-import { Label } from 'react-bootstrap'
 import Badge from '@/features/ui/components/bootstrap-5/badge'
-import BS3Badge from '@/shared/components/badge'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 
-type OLBadgeProps = React.ComponentProps<typeof Badge> & {
-  bs3Props?: {
-    bsStyle?: React.ComponentProps<typeof Label>['bsStyle'] | null
-  }
-}
+function OLBadge(props: React.ComponentProps<typeof Badge>) {
+  let { bg, text, ...rest } = props
 
-function OLBadge(props: OLBadgeProps) {
-  const { bs3Props, ...rest } = props
-
-  let bs3BadgeProps: React.ComponentProps<typeof BS3Badge> = {
-    prepend: rest.prepend,
-    children: rest.children,
-    className: rest.className,
-    bsStyle: rest.bg,
+  // For warning badges, use a light background by default. We still want the
+  // Bootstrap warning colour to be dark for text though, so make an
+  // adjustment here
+  if (bg === 'warning') {
+    bg = 'warning-light-bg'
+    text = 'warning'
   }
 
-  if (bs3Props) {
-    const { bsStyle, ...restBs3Props } = bs3Props
-
-    bs3BadgeProps = {
-      ...bs3BadgeProps,
-      ...restBs3Props,
-      bsStyle: 'bsStyle' in bs3Props ? bsStyle : rest.bg,
-    }
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Badge {...bs3BadgeProps} />}
-      bs5={<Badge {...rest} />}
-    />
-  )
+  return <Badge bg={bg} text={text} {...rest} />
 }
 
 export default OLBadge
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-button-group.tsx b/services/web/frontend/js/features/ui/components/ol/ol-button-group.tsx
index c9a9d1188b..4b6c4dece0 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-button-group.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-button-group.tsx
@@ -1,30 +1,7 @@
-import { ButtonGroup, ButtonGroupProps } from 'react-bootstrap-5'
-import {
-  ButtonGroup as BS3ButtonGroup,
-  ButtonGroupProps as BS3ButtonGroupProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { ButtonGroup, ButtonGroupProps } from 'react-bootstrap'
 
-type OLButtonGroupProps = ButtonGroupProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLButtonGroup({ bs3Props, as, ...rest }: OLButtonGroupProps) {
-  const bs3ButtonGroupProps: BS3ButtonGroupProps = {
-    children: rest.children,
-    className: rest.className,
-    vertical: rest.vertical,
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3ButtonGroup {...bs3ButtonGroupProps} />}
-      bs5={<ButtonGroup {...rest} as={as} />}
-    />
-  )
+function OLButtonGroup({ as, ...rest }: ButtonGroupProps) {
+  return <ButtonGroup {...rest} as={as} />
 }
 
 export default OLButtonGroup
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-button-toolbar.tsx b/services/web/frontend/js/features/ui/components/ol/ol-button-toolbar.tsx
index 16d85c29eb..a60b854732 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-button-toolbar.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-button-toolbar.tsx
@@ -1,31 +1,7 @@
-import { ButtonToolbar, ButtonToolbarProps } from 'react-bootstrap-5'
-import {
-  ButtonToolbar as BS3ButtonToolbar,
-  ButtonToolbarProps as BS3ButtonToolbarProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { ButtonToolbar, ButtonToolbarProps } from 'react-bootstrap'
 
-type OLButtonToolbarProps = ButtonToolbarProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLButtonToolbar(props: OLButtonToolbarProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3ButtonToolbarProps: BS3ButtonToolbarProps = {
-    children: rest.children,
-    className: rest.className,
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3ButtonToolbar {...bs3ButtonToolbarProps} />}
-      bs5={<ButtonToolbar {...rest} />}
-    />
-  )
+function OLButtonToolbar(props: ButtonToolbarProps) {
+  return <ButtonToolbar {...props} />
 }
 
 export default OLButtonToolbar
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-button.tsx b/services/web/frontend/js/features/ui/components/ol/ol-button.tsx
index 6df9266744..3f5e06e8c4 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-button.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-button.tsx
@@ -1,132 +1,13 @@
 import { forwardRef } from 'react'
-import BootstrapVersionSwitcher from '../bootstrap-5/bootstrap-version-switcher'
-import { Button as BS3Button } from 'react-bootstrap'
 import type { ButtonProps } from '@/features/ui/components/types/button-props'
-import type { ButtonProps as BS3ButtonPropsBase } from 'react-bootstrap'
 import Button from '../bootstrap-5/button'
-import classnames from 'classnames'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
-import { callFnsInSequence } from '@/utils/functions'
-import Icon from '@/shared/components/icon'
 
-export type BS3ButtonSize = 'xsmall' | 'sm' | 'medium' | 'lg'
+export type OLButtonProps = ButtonProps
 
-export type OLButtonProps = ButtonProps & {
-  bs3Props?: {
-    loading?: React.ReactNode
-    bsSize?: BS3ButtonSize
-    block?: boolean
-    className?: string
-    onMouseOver?: React.MouseEventHandler<HTMLButtonElement>
-    onMouseOut?: React.MouseEventHandler<HTMLButtonElement>
-    onFocus?: React.FocusEventHandler<HTMLButtonElement>
-    onBlur?: React.FocusEventHandler<HTMLButtonElement>
-  }
-}
+const OLButton = forwardRef<HTMLButtonElement, OLButtonProps>((props, ref) => {
+  return <Button {...props} ref={ref} />
+})
 
-// Resolve type mismatch of the onClick event handler
-export type BS3ButtonProps = Omit<BS3ButtonPropsBase, 'onClick'> & {
-  onClick?: React.MouseEventHandler<any>
-}
-
-export function bs3ButtonProps(props: ButtonProps) {
-  const bs3ButtonProps: BS3ButtonProps = {
-    bsStyle: null,
-    bsSize: props.size,
-    className: classnames(`btn-${props.variant || 'primary'}`, props.className),
-    disabled: props.isLoading || props.disabled,
-    form: props.form,
-    href: props.href,
-    id: props.id,
-    target: props.target,
-    rel: props.rel,
-    onClick: props.onClick,
-    onMouseDown: props.onMouseDown as BS3ButtonProps['onMouseDown'],
-    type: props.type,
-    draggable: props.draggable,
-    download: props.download,
-    style: props.style,
-    active: props.active,
-  }
-  return bs3ButtonProps
-}
-
-function BS3ButtonContent({
-  children,
-  leadingIcon,
-  trailingIcon,
-}: {
-  children: React.ReactNode
-  leadingIcon: OLButtonProps['leadingIcon']
-  trailingIcon: OLButtonProps['trailingIcon']
-}) {
-  const leadingIconComponent =
-    leadingIcon && typeof leadingIcon === 'string' ? (
-      <Icon type={leadingIcon} />
-    ) : (
-      leadingIcon
-    )
-
-  const trailingIconComponent =
-    trailingIcon && typeof trailingIcon === 'string' ? (
-      <Icon type={trailingIcon} />
-    ) : (
-      trailingIcon
-    )
-
-  return (
-    <>
-      {leadingIconComponent ? <>{leadingIconComponent}&nbsp;</> : null}
-      {children}
-      {trailingIconComponent ? <>&nbsp;{trailingIconComponent}</> : null}
-    </>
-  )
-}
-
-const OLButton = forwardRef<HTMLButtonElement, OLButtonProps>(
-  ({ bs3Props = {}, ...rest }, ref) => {
-    const { className: _, ...restBs3Props } = bs3Props
-
-    // BS3 OverlayTrigger automatically provides 'onMouseOver', 'onMouseOut', 'onFocus', 'onBlur' event handlers
-    const bs3FinalProps = {
-      ...restBs3Props,
-      onMouseOver: callFnsInSequence(bs3Props?.onMouseOver, rest.onMouseOver),
-      onMouseOut: callFnsInSequence(bs3Props?.onMouseOut, rest.onMouseOut),
-      onFocus: callFnsInSequence(bs3Props?.onFocus, rest.onFocus),
-      onBlur: callFnsInSequence(bs3Props?.onBlur, rest.onBlur),
-    }
-
-    // Get all `aria-*` and `data-*` attributes
-    const extraProps = getAriaAndDataProps(rest)
-
-    return (
-      <BootstrapVersionSwitcher
-        bs3={
-          <BS3Button
-            {...bs3ButtonProps({
-              ...rest,
-              // Override the `className` with bs3 specific className (if provided)
-              className: bs3Props?.className ?? rest.className,
-            })}
-            {...extraProps}
-            {...bs3FinalProps}
-            ref={ref as React.LegacyRef<any> | undefined}
-          >
-            {bs3Props?.loading || (
-              <BS3ButtonContent
-                leadingIcon={rest.leadingIcon}
-                trailingIcon={rest.trailingIcon}
-              >
-                {rest.children}
-              </BS3ButtonContent>
-            )}
-          </BS3Button>
-        }
-        bs5={<Button {...rest} ref={ref} />}
-      />
-    )
-  }
-)
 OLButton.displayName = 'OLButton'
 
 export default OLButton
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-card.tsx b/services/web/frontend/js/features/ui/components/ol/ol-card.tsx
index 36dfd4ecfa..f5ff025d10 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-card.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-card.tsx
@@ -1,18 +1,14 @@
-import { Card } from 'react-bootstrap-5'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Card } from 'react-bootstrap'
 import { FC } from 'react'
-import classNames from 'classnames'
 
-const OLCard: FC<{ className?: string }> = ({ children, className }) => {
+const OLCard: FC<React.PropsWithChildren<{ className?: string }>> = ({
+  children,
+  className,
+}) => {
   return (
-    <BootstrapVersionSwitcher
-      bs3={<div className={classNames('card', className)}>{children}</div>}
-      bs5={
-        <Card className={className}>
-          <Card.Body>{children}</Card.Body>
-        </Card>
-      }
-    />
+    <Card className={className}>
+      <Card.Body>{children}</Card.Body>
+    </Card>
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-close-button.tsx b/services/web/frontend/js/features/ui/components/ol/ol-close-button.tsx
index 7034392949..c07d1cc390 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-close-button.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-close-button.tsx
@@ -1,6 +1,4 @@
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { CloseButton, CloseButtonProps } from 'react-bootstrap-5'
-import classNames from 'classnames'
+import { CloseButton, CloseButtonProps } from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
 import { forwardRef } from 'react'
 
@@ -8,25 +6,7 @@ const OLCloseButton = forwardRef<HTMLButtonElement, CloseButtonProps>(
   (props, ref) => {
     const { t } = useTranslation()
 
-    const bs3CloseButtonProps: React.ButtonHTMLAttributes<HTMLButtonElement> = {
-      className: classNames('close', props.className),
-      onClick: props.onClick,
-      onMouseOver: props.onMouseOver,
-      onMouseOut: props.onMouseOut,
-
-      'aria-label': t('close'),
-    }
-
-    return (
-      <BootstrapVersionSwitcher
-        bs3={
-          <button {...bs3CloseButtonProps}>
-            <span aria-hidden="true">&times;</span>
-          </button>
-        }
-        bs5={<CloseButton ref={ref} {...props} />}
-      />
-    )
+    return <CloseButton ref={ref} aria-label={t('close')} {...props} />
   }
 )
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-col.tsx b/services/web/frontend/js/features/ui/components/ol/ol-col.tsx
index e2c7c1ce7b..a482ccf97d 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-col.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-col.tsx
@@ -1,73 +1,7 @@
-import { Col } from 'react-bootstrap-5'
-import { Col as BS3Col } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Col } from 'react-bootstrap'
 
-type OLColProps = React.ComponentProps<typeof Col> & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLCol(props: OLColProps) {
-  const { bs3Props, ...rest } = props
-
-  const getBs3Sizes = (obj: typeof rest) => {
-    const bs5ToBs3SizeMap = {
-      xs: 'xs',
-      sm: 'xs',
-      md: 'sm',
-      lg: 'md',
-      xl: 'lg',
-      xxl: undefined,
-    } as const
-
-    const isBs5ToBs3SizeMapKey = (
-      key: string
-    ): key is keyof typeof bs5ToBs3SizeMap => {
-      return key in bs5ToBs3SizeMap
-    }
-
-    const sizes = Object.entries(obj).reduce(
-      (prev, [key, value]) => {
-        if (isBs5ToBs3SizeMapKey(key)) {
-          const bs3Size = bs5ToBs3SizeMap[key]
-
-          if (bs3Size) {
-            if (typeof value === 'object') {
-              prev[bs3Size] = value.span
-              prev[`${bs3Size}Offset`] = value.offset
-            } else {
-              prev[bs3Size] = value
-            }
-          }
-        }
-
-        return prev
-      },
-      {} as Record<string, (typeof rest)['xs']>
-    )
-
-    // Add a default sizing for `col-xs-12` if no sizing is available
-    if (
-      !Object.keys(sizes).some(key => ['xs', 'sm', 'md', 'lg'].includes(key))
-    ) {
-      sizes.xs = 12
-    }
-
-    return sizes
-  }
-
-  const bs3ColProps: React.ComponentProps<typeof BS3Col> = {
-    children: rest.children,
-    className: rest.className,
-    ...getBs3Sizes(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Col {...bs3ColProps} />}
-      bs5={<Col {...rest} />}
-    />
-  )
+function OLCol(props: React.ComponentProps<typeof Col>) {
+  return <Col {...props} />
 }
 
 export default OLCol
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-dropdown-menu-item.tsx b/services/web/frontend/js/features/ui/components/ol/ol-dropdown-menu-item.tsx
index 59567ecce9..20d05d5346 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-dropdown-menu-item.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-dropdown-menu-item.tsx
@@ -1,43 +1,13 @@
-import { MenuItem, MenuItemProps } from 'react-bootstrap'
 import { DropdownItem } from '@/features/ui/components/bootstrap-5/dropdown-menu'
 import { DropdownItemProps } from '@/features/ui/components/types/dropdown-menu-props'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
 
-type OLDropdownMenuItemProps = DropdownItemProps & {
-  bs3Props?: MenuItemProps
-}
-
 // This represents a menu item. It wraps the item within an <li> element.
-function OLDropdownMenuItem(props: OLDropdownMenuItemProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3MenuItemProps: MenuItemProps = {
-    children: rest.leadingIcon ? (
-      <>
-        {rest.leadingIcon}
-        &nbsp;
-        {rest.children}
-      </>
-    ) : (
-      rest.children
-    ),
-    onClick: rest.onClick,
-    href: rest.href,
-    download: rest.download,
-    eventKey: rest.eventKey,
-    ...bs3Props,
-  }
-
+function OLDropdownMenuItem(props: DropdownItemProps) {
   return (
-    <BootstrapVersionSwitcher
-      bs3={<MenuItem {...bs3MenuItemProps} />}
-      bs5={
-        <DropdownListItem>
-          <DropdownItem {...rest} />
-        </DropdownListItem>
-      }
-    />
+    <DropdownListItem>
+      <DropdownItem {...props} />
+    </DropdownListItem>
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-checkbox.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-checkbox.tsx
index 27de2f4ed3..191f850159 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-checkbox.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-checkbox.tsx
@@ -1,7 +1,4 @@
-import { Form, FormCheckProps } from 'react-bootstrap-5'
-import { Checkbox as BS3Checkbox } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { Form, FormCheckProps } from 'react-bootstrap'
 import { MergeAndOverride } from '../../../../../../types/utils'
 import FormText from '../bootstrap-5/form/form-text'
 
@@ -9,128 +6,36 @@ type OLFormCheckboxProps = MergeAndOverride<
   FormCheckProps,
   {
     inputRef?: React.MutableRefObject<HTMLInputElement | null>
-    bs3Props?: Record<PropertyKey, unknown>
   } & (
     | { description: string; id: string }
     | { description?: undefined; id?: string }
   )
 >
 
-type RadioButtonProps = {
-  checked?: boolean
-  className?: string
-  description?: string
-  disabled?: boolean
-  id: string
-  name?: string
-  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
-  required?: boolean
-  label: React.ReactElement | string
-  value: string
-}
-
 function OLFormCheckbox(props: OLFormCheckboxProps) {
-  const { bs3Props, inputRef, ...rest } = props
+  const { inputRef, ...rest } = props
 
-  const bs3FormCheckboxProps: React.ComponentProps<typeof BS3Checkbox> = {
-    children: rest.label,
-    checked: rest.checked,
-    value: rest.value,
-    id: rest.id,
-    name: rest.name,
-    required: rest.required,
-    readOnly: rest.readOnly,
-    disabled: rest.disabled,
-    inline: rest.inline,
-    title: rest.title,
-    autoComplete: rest.autoComplete,
-    defaultChecked: rest.defaultChecked,
-    className: rest.className,
-    onChange: rest.onChange as (e: React.ChangeEvent<unknown>) => void,
-    inputRef: node => {
-      if (inputRef) {
-        inputRef.current = node
-      }
-    },
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        rest.type === 'radio' ? (
-          <BS3Radio {...(rest as RadioButtonProps)} />
-        ) : (
-          <BS3Checkbox {...bs3FormCheckboxProps} />
-        )
-      }
-      bs5={
-        rest.type === 'radio' ? (
-          <Form.Check
-            ref={inputRef}
-            aria-describedby={
-              rest.description ? `${rest.id}-description` : undefined
-            }
-            {...rest}
-            label={
-              <>
-                {rest.label}
-                {rest.description && (
-                  <FormText
-                    id={`${rest.id}-description`}
-                    className="form-check-label-description"
-                  >
-                    {rest.description}
-                  </FormText>
-                )}
-              </>
-            }
-          />
-        ) : (
-          <Form.Check ref={inputRef} {...rest} />
-        )
+  return rest.type === 'radio' ? (
+    <Form.Check
+      ref={inputRef}
+      aria-describedby={rest.description ? `${rest.id}-description` : undefined}
+      {...rest}
+      label={
+        <>
+          {rest.label}
+          {rest.description && (
+            <FormText
+              id={`${rest.id}-description`}
+              className="form-check-label-description"
+            >
+              {rest.description}
+            </FormText>
+          )}
+        </>
       }
     />
-  )
-}
-
-function BS3Radio(props: RadioButtonProps) {
-  const {
-    label,
-    checked,
-    className,
-    description,
-    disabled,
-    id,
-    name,
-    onChange,
-    required,
-    value,
-  } = props
-  return (
-    <div className={className}>
-      <input
-        checked={checked}
-        className="me-1"
-        disabled={disabled}
-        id={id}
-        name={name}
-        onChange={onChange}
-        type="radio"
-        required={required}
-        value={value}
-        aria-describedby={description ? `${id}-description` : undefined}
-      />
-      <label htmlFor={id} data-disabled={disabled ? 'true' : undefined}>
-        {label}
-      </label>{' '}
-      {description && (
-        <small id={`${id}-description`} aria-hidden="true">
-          {description}
-        </small>
-      )}
-    </div>
+  ) : (
+    <Form.Check ref={inputRef} {...rest} />
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-control.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-control.tsx
index 398d2556b3..c9caf656ad 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-control.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-control.tsx
@@ -1,99 +1,28 @@
-import { forwardRef, ComponentProps, useCallback } from 'react'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { forwardRef } from 'react'
 import FormControl, {
   type OLBS5FormControlProps,
 } from '@/features/ui/components/bootstrap-5/form/form-control'
-import BS3FormControl from '@/features/ui/components/bootstrap-3/form/form-control'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import OLSpinner from '@/features/ui/components/ol/ol-spinner'
-import Icon from '@/shared/components/icon'
-import type { BsPrefixRefForwardingComponent } from 'react-bootstrap-5/helpers'
 
 type OLFormControlProps = OLBS5FormControlProps & {
-  bs3Props?: Record<string, unknown>
   'data-ol-dirty'?: unknown
   'main-field'?: any // For the CM6's benefit in the editor search panel
   loading?: boolean
 }
 
-type BS3FormControlProps = ComponentProps<typeof BS3FormControl> & {
-  'main-field'?: any
-}
+const OLFormControl = forwardRef<HTMLInputElement, OLFormControlProps>(
+  (props, ref) => {
+    const { append, ...rest } = props
 
-const OLFormControl: BsPrefixRefForwardingComponent<
-  'input',
-  OLFormControlProps
-> = forwardRef<HTMLInputElement, OLFormControlProps>((props, ref) => {
-  const { bs3Props, append, ...rest } = props
-
-  // Use a callback so that the ref passed to the BS3 FormControl is stable
-  const bs3InputRef = useCallback(
-    (inputElement: HTMLInputElement) => {
-      if (typeof ref === 'function') {
-        ref(inputElement)
-      } else if (ref) {
-        ref.current = inputElement
-      }
-    },
-    [ref]
-  )
-
-  let bs3FormControlProps: BS3FormControlProps = {
-    inputRef: bs3InputRef,
-    componentClass: rest.as,
-    bsSize: rest.size,
-    id: rest.id,
-    name: rest.name,
-    className: rest.className,
-    style: rest.style,
-    type: rest.type,
-    value: rest.value,
-    defaultValue: rest.defaultValue,
-    required: rest.required,
-    disabled: rest.disabled,
-    placeholder: rest.placeholder,
-    readOnly: rest.readOnly,
-    autoComplete: rest.autoComplete,
-    autoFocus: rest.autoFocus,
-    minLength: rest.minLength,
-    maxLength: rest.maxLength,
-    onChange: rest.onChange as BS3FormControlProps['onChange'],
-    onKeyDown: rest.onKeyDown as BS3FormControlProps['onKeyDown'],
-    onFocus: rest.onFocus as BS3FormControlProps['onFocus'],
-    onBlur: rest.onBlur as BS3FormControlProps['onBlur'],
-    onInvalid: rest.onInvalid as BS3FormControlProps['onInvalid'],
-    onPaste: rest.onPaste as BS3FormControlProps['onPaste'],
-    prepend: rest.prepend,
-    size: rest.htmlSize,
-    'main-field': rest['main-field'],
-    children: rest.children,
-    ...bs3Props,
+    return (
+      <FormControl
+        ref={ref}
+        {...rest}
+        append={rest.loading ? <OLSpinner size="sm" /> : append}
+      />
+    )
   }
-
-  bs3FormControlProps = {
-    ...bs3FormControlProps,
-    ...getAriaAndDataProps(rest),
-    'data-ol-dirty': rest['data-ol-dirty'],
-  } as typeof bs3FormControlProps & Record<string, unknown>
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3FormControl
-          {...bs3FormControlProps}
-          append={rest.loading ? <Icon type="spinner" spin /> : append}
-        />
-      }
-      bs5={
-        <FormControl
-          ref={ref}
-          {...rest}
-          append={rest.loading ? <OLSpinner size="sm" /> : append}
-        />
-      }
-    />
-  )
-})
+)
 OLFormControl.displayName = 'OLFormControl'
 
 export default OLFormControl
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-feedback.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-feedback.tsx
index 2ff193e0d8..59b81bb6a4 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-feedback.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-feedback.tsx
@@ -1,38 +1,14 @@
-import { Form } from 'react-bootstrap-5'
-import {
-  HelpBlock as BS3HelpBlock,
-  HelpBlockProps as BS3HelpBlockProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Form } from 'react-bootstrap'
 import { ComponentProps } from 'react'
-import classnames from 'classnames'
 import FormFeedback from '@/features/ui/components/bootstrap-5/form/form-feedback'
 
 type OLFormFeedbackProps = Pick<
   ComponentProps<typeof Form.Control.Feedback>,
   'type' | 'className' | 'children'
-> & {
-  bs3Props?: Record<string, unknown>
-}
+>
 
 function OLFormFeedback(props: OLFormFeedbackProps) {
-  const { bs3Props, children, ...bs5Props } = props
-
-  const bs3HelpBlockProps: BS3HelpBlockProps = {
-    className: classnames(
-      bs5Props.className,
-      bs5Props.type === 'invalid' ? 'invalid-only' : null
-    ),
-    children,
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3HelpBlock {...bs3HelpBlockProps} />}
-      bs5={<FormFeedback {...bs5Props}>{children}</FormFeedback>}
-    />
-  )
+  return <FormFeedback {...props} />
 }
 
 export default OLFormFeedback
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-group.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-group.tsx
index 1da249865b..9c6db07e93 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-group.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-group.tsx
@@ -1,42 +1,8 @@
-import { FormGroupProps } from 'react-bootstrap-5'
-import {
-  FormGroup as BS3FormGroup,
-  FormGroupProps as BS3FormGroupProps,
-  FormControl,
-} from 'react-bootstrap'
+import { FormGroupProps } from 'react-bootstrap'
 import FormGroup from '@/features/ui/components/bootstrap-5/form/form-group'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import classNames from 'classnames'
 
-type OLFormGroupProps = FormGroupProps & {
-  bs3Props?: {
-    withFeedback?: boolean
-    hiddenLabel?: boolean
-    validationState?: BS3FormGroupProps['validationState']
-  }
-}
-
-function OLFormGroup(props: OLFormGroupProps) {
-  const { bs3Props, className, ...rest } = props
-  const { withFeedback, hiddenLabel, ...bs3PropsRest } = bs3Props || {}
-
-  const bs3FormGroupProps: BS3FormGroupProps = {
-    controlId: rest.controlId,
-    className: classNames(className, { 'hidden-label': hiddenLabel }),
-    ...bs3PropsRest,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3FormGroup {...bs3FormGroupProps}>
-          {rest.children}
-          {withFeedback ? <FormControl.Feedback /> : null}
-        </BS3FormGroup>
-      }
-      bs5={<FormGroup className={className} {...rest} />}
-    />
-  )
+function OLFormGroup(props: FormGroupProps) {
+  return <FormGroup {...props} />
 }
 
 export default OLFormGroup
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-label.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-label.tsx
index 5ce2f7e556..ed46dd8117 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-label.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-label.tsx
@@ -1,28 +1,7 @@
-import { Form } from 'react-bootstrap-5'
-import { ControlLabel as BS3FormLabel } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Form } from 'react-bootstrap'
 
-type OLFormLabelProps = React.ComponentProps<(typeof Form)['Label']> & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLFormLabel(props: OLFormLabelProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3FormLabelProps: React.ComponentProps<typeof BS3FormLabel> = {
-    children: rest.children,
-    htmlFor: rest.htmlFor,
-    srOnly: rest.visuallyHidden,
-    className: rest.className,
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3FormLabel {...bs3FormLabelProps} />}
-      bs5={<Form.Label {...rest} />}
-    />
-  )
+function OLFormLabel(props: React.ComponentProps<(typeof Form)['Label']>) {
+  return <Form.Label {...props} />
 }
 
 export default OLFormLabel
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-select.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-select.tsx
index f9f757abcb..8c111932ce 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-select.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-select.tsx
@@ -1,56 +1,9 @@
 import { forwardRef } from 'react'
-import { Form, FormSelectProps } from 'react-bootstrap-5'
-import {
-  FormControl as BS3FormControl,
-  FormControlProps as BS3FormControlProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { Form, FormSelectProps } from 'react-bootstrap'
 
-type OLFormSelectProps = FormSelectProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-const OLFormSelect = forwardRef<HTMLSelectElement, OLFormSelectProps>(
+const OLFormSelect = forwardRef<HTMLSelectElement, FormSelectProps>(
   (props, ref) => {
-    const { bs3Props, ...bs5Props } = props
-
-    const bs3FormSelectProps: BS3FormControlProps = {
-      children: bs5Props.children,
-      bsSize: bs5Props.size,
-      name: bs5Props.name,
-      value: bs5Props.value,
-      defaultValue: bs5Props.defaultValue,
-      disabled: bs5Props.disabled,
-      onChange: bs5Props.onChange as BS3FormControlProps['onChange'],
-      required: bs5Props.required,
-      placeholder: bs5Props.placeholder,
-      className: bs5Props.className,
-      inputRef: (inputElement: HTMLInputElement) => {
-        if (typeof ref === 'function') {
-          ref(inputElement as unknown as HTMLSelectElement)
-        } else if (ref) {
-          ref.current = inputElement as unknown as HTMLSelectElement
-        }
-      },
-      ...bs3Props,
-    }
-
-    // Get all `aria-*` and `data-*` attributes
-    const extraProps = getAriaAndDataProps(bs5Props)
-
-    return (
-      <BootstrapVersionSwitcher
-        bs3={
-          <BS3FormControl
-            componentClass="select"
-            {...bs3FormSelectProps}
-            {...extraProps}
-          />
-        }
-        bs5={<Form.Select ref={ref} {...bs5Props} />}
-      />
-    )
+    return <Form.Select ref={ref} {...props} />
   }
 )
 OLFormSelect.displayName = 'OLFormSelect'
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-switch.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-switch.tsx
index b751642d8b..3e349a6f76 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-switch.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-switch.tsx
@@ -1,53 +1,19 @@
-import { FormCheck, FormCheckProps, FormLabel } from 'react-bootstrap-5'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { FormCheck, FormCheckProps, FormLabel } from 'react-bootstrap'
 
 type OLFormSwitchProps = FormCheckProps & {
   inputRef?: React.MutableRefObject<HTMLInputElement | null>
-  bs3Props?: React.InputHTMLAttributes<HTMLInputElement>
 }
 
 function OLFormSwitch(props: OLFormSwitchProps) {
-  const { bs3Props, inputRef, label, id, ...rest } = props
-
-  const bs3FormSwitchProps: React.InputHTMLAttributes<HTMLInputElement> = {
-    id,
-    checked: rest.checked,
-    required: rest.required,
-    readOnly: rest.readOnly,
-    disabled: rest.disabled,
-    autoComplete: rest.autoComplete,
-    defaultChecked: rest.defaultChecked,
-    onChange: rest.onChange as (e: React.ChangeEvent<unknown>) => void,
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
+  const { inputRef, label, id, ...rest } = props
 
   return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <div className="input-switch">
-          <input
-            id={id}
-            type="checkbox"
-            className="input-switch-hidden-input"
-            ref={inputRef}
-            {...bs3FormSwitchProps}
-          />
-          <label htmlFor={id} className="input-switch-btn">
-            <span className="sr-only">{label}</span>
-          </label>
-        </div>
-      }
-      bs5={
-        <>
-          <FormCheck type="switch" ref={inputRef} id={id} {...rest} />
-          <FormLabel htmlFor={id} visuallyHidden>
-            {label}
-          </FormLabel>
-        </>
-      }
-    />
+    <>
+      <FormCheck type="switch" ref={inputRef} id={id} {...rest} />
+      <FormLabel htmlFor={id} visuallyHidden>
+        {label}
+      </FormLabel>
+    </>
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form-text.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form-text.tsx
index d465eb4050..d35654fa79 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form-text.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form-text.tsx
@@ -1,36 +1,9 @@
 import FormText, {
   FormTextProps,
-  getFormTextClass,
 } from '@/features/ui/components/bootstrap-5/form/form-text'
-import PolymorphicComponent from '@/shared/components/polymorphic-component'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import classnames from 'classnames'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
 
-type OLFormTextProps = FormTextProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLFormText({ as = 'div', ...props }: OLFormTextProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3HelpBlockProps = {
-    children: rest.children,
-    className: classnames('small', rest.className, getFormTextClass(rest.type)),
-    ...bs3Props,
-  } as const satisfies React.ComponentProps<typeof PolymorphicComponent>
-
-  // Get all `aria-*` and `data-*` attributes
-  const extraProps = getAriaAndDataProps(rest)
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <PolymorphicComponent {...bs3HelpBlockProps} {...extraProps} as={as} />
-      }
-      bs5={<FormText {...rest} as={as} />}
-    />
-  )
+function OLFormText({ as = 'div', ...rest }: FormTextProps) {
+  return <FormText {...rest} as={as} />
 }
 
 export default OLFormText
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-form.tsx b/services/web/frontend/js/features/ui/components/ol/ol-form.tsx
index 32fd5073ea..d53dec0ad3 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-form.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-form.tsx
@@ -1,45 +1,8 @@
-import { Form } from 'react-bootstrap-5'
-import { Form as BS3Form, FormProps as BS3FormProps } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Form } from 'react-bootstrap'
 import { ComponentProps } from 'react'
-import classnames from 'classnames'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
 
-type OLFormProps = ComponentProps<typeof Form> & {
-  bs3Props?: ComponentProps<typeof BS3Form>
-}
-
-function OLForm(props: OLFormProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3FormProps: BS3FormProps = {
-    componentClass: rest.as,
-    children: rest.children,
-    id: rest.id,
-    onSubmit: rest.onSubmit as BS3FormProps['onSubmit'],
-    onClick: rest.onClick as BS3FormProps['onClick'],
-    name: rest.name,
-    noValidate: rest.noValidate,
-    role: rest.role,
-    ...bs3Props,
-  }
-
-  const bs3ClassName = classnames(
-    rest.className,
-    rest.validated ? 'was-validated' : null
-  )
-
-  // Get all `aria-*` and `data-*` attributes
-  const extraProps = getAriaAndDataProps(rest)
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3Form className={bs3ClassName} {...bs3FormProps} {...extraProps} />
-      }
-      bs5={<Form {...rest} />}
-    />
-  )
+function OLForm(props: ComponentProps<typeof Form>) {
+  return <Form {...props} />
 }
 
 export default OLForm
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-icon-button.tsx b/services/web/frontend/js/features/ui/components/ol/ol-icon-button.tsx
index 5d34b1c2ff..27e5960133 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-icon-button.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-icon-button.tsx
@@ -1,54 +1,13 @@
 import { forwardRef } from 'react'
-import { bs3ButtonProps, BS3ButtonSize } from './ol-button'
-import { Button as BS3Button } from 'react-bootstrap'
 import type { IconButtonProps } from '@/features/ui/components/types/icon-button-props'
-import BootstrapVersionSwitcher from '../bootstrap-5/bootstrap-version-switcher'
-import Icon, { IconProps } from '@/shared/components/icon'
 import IconButton from '../bootstrap-5/icon-button'
-import { callFnsInSequence } from '@/utils/functions'
 
-export type OLIconButtonProps = IconButtonProps & {
-  bs3Props?: {
-    loading?: React.ReactNode
-    fw?: IconProps['fw']
-    className?: string
-    bsSize?: BS3ButtonSize
-    onMouseOver?: React.MouseEventHandler<HTMLButtonElement>
-    onMouseOut?: React.MouseEventHandler<HTMLButtonElement>
-    onFocus?: React.FocusEventHandler<HTMLButtonElement>
-    onBlur?: React.FocusEventHandler<HTMLButtonElement>
-  }
-}
+export type OLIconButtonProps = IconButtonProps
 
 const OLIconButton = forwardRef<HTMLButtonElement, OLIconButtonProps>(
   (props, ref) => {
-    const { bs3Props, ...rest } = props
-
-    const { fw, loading, ...bs3Rest } = bs3Props || {}
-
-    // BS3 OverlayTrigger automatically provides 'onMouseOver', 'onMouseOut', 'onFocus', 'onBlur' event handlers
-    const bs3FinalProps = {
-      'aria-label': rest.accessibilityLabel,
-      ...bs3ButtonProps(rest),
-      ...bs3Rest,
-      onMouseOver: callFnsInSequence(bs3Props?.onMouseOver, rest.onMouseOver),
-      onMouseOut: callFnsInSequence(bs3Props?.onMouseOut, rest.onMouseOut),
-      onFocus: callFnsInSequence(bs3Props?.onFocus, rest.onFocus),
-      onBlur: callFnsInSequence(bs3Props?.onBlur, rest.onBlur),
-    }
-
-    // BS3 tooltip relies on the 'onMouseOver', 'onMouseOut', 'onFocus', 'onBlur' props
     // BS5 tooltip relies on the ref
-    return (
-      <BootstrapVersionSwitcher
-        bs3={
-          <BS3Button {...bs3FinalProps}>
-            {loading || <Icon type={rest.icon} fw={fw} />}
-          </BS3Button>
-        }
-        bs5={<IconButton {...rest} ref={ref} />}
-      />
-    )
+    return <IconButton {...props} ref={ref} />
   }
 )
 OLIconButton.displayName = 'OLIconButton'
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-list-group-item.tsx b/services/web/frontend/js/features/ui/components/ol/ol-list-group-item.tsx
index c177ee3a1c..c99b8c1cb4 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-list-group-item.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-list-group-item.tsx
@@ -1,40 +1,13 @@
-import { ListGroupItem, ListGroupItemProps } from 'react-bootstrap-5'
-import {
-  ListGroupItem as BS3ListGroupItem,
-  ListGroupItemProps as BS3ListGroupItemProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { ListGroupItem, ListGroupItemProps } from 'react-bootstrap'
 
-type OLListGroupItemProps = ListGroupItemProps & {
-  bs3Props?: BS3ListGroupItemProps
-}
-
-function OLListGroupItem(props: OLListGroupItemProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3ListGroupItemProps: BS3ListGroupItemProps = {
-    children: rest.children,
-    active: rest.active,
-    disabled: rest.disabled,
-    href: rest.href,
-    onClick: rest.onClick as BS3ListGroupItemProps['onClick'],
-    ...bs3Props,
-  }
-
-  const extraProps = getAriaAndDataProps(rest)
-  const as = rest.as ?? 'button'
+function OLListGroupItem(props: ListGroupItemProps) {
+  const as = props.as ?? 'button'
 
   return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3ListGroupItem {...bs3ListGroupItemProps} {...extraProps} />}
-      bs5={
-        <ListGroupItem
-          {...rest}
-          as={as}
-          type={as === 'button' ? 'button' : undefined}
-        />
-      }
+    <ListGroupItem
+      {...props}
+      as={as}
+      type={as === 'button' ? 'button' : undefined}
     />
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-list-group.tsx b/services/web/frontend/js/features/ui/components/ol/ol-list-group.tsx
index 65af7b3ec3..4eb473217a 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-list-group.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-list-group.tsx
@@ -1,34 +1,9 @@
-import { ListGroup, ListGroupProps } from 'react-bootstrap-5'
-import {
-  ListGroup as BS3ListGroup,
-  ListGroupProps as BS3ListGroupProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { ListGroup, ListGroupProps } from 'react-bootstrap'
 
-type OLListGroupProps = ListGroupProps & {
-  bs3Props?: BS3ListGroupProps
-}
+function OLListGroup(props: ListGroupProps) {
+  const as = props.as ?? 'div'
 
-function OLListGroup(props: OLListGroupProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3ListGroupProps: BS3ListGroupProps = {
-    children: rest.children,
-    role: rest.role,
-    componentClass: rest.as,
-    ...bs3Props,
-  }
-
-  const extraProps = getAriaAndDataProps(rest)
-  const as = rest.as ?? 'div'
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3ListGroup {...bs3ListGroupProps} {...extraProps} />}
-      bs5={<ListGroup {...rest} as={as} />}
-    />
-  )
+  return <ListGroup {...props} as={as} />
 }
 
 export default OLListGroup
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-modal.tsx b/services/web/frontend/js/features/ui/components/ol/ol-modal.tsx
index 43dcddcf87..057d8dc3ce 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-modal.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-modal.tsx
@@ -1,133 +1,37 @@
 import {
-  Modal as BS5Modal,
+  Modal,
   ModalProps,
   ModalHeaderProps,
   ModalTitleProps,
-  ModalBody,
   ModalFooterProps,
-} from 'react-bootstrap-5'
-import {
-  Modal as BS3Modal,
-  ModalProps as BS3ModalProps,
-  ModalHeaderProps as BS3ModalHeaderProps,
-  ModalTitleProps as BS3ModalTitleProps,
-  ModalBodyProps as BS3ModalBodyProps,
-  ModalFooterProps as BS3ModalFooterProps,
 } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import AccessibleModal from '@/shared/components/accessible-modal'
+import { ModalBodyProps } from 'react-bootstrap/ModalBody'
 
 type OLModalProps = ModalProps & {
-  bs3Props?: Record<string, unknown>
   size?: 'sm' | 'lg'
   onHide: () => void
 }
 
-type OLModalHeaderProps = ModalHeaderProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-type OLModalTitleProps = ModalTitleProps & {
-  bs3Props?: Record<string, unknown>
-}
-
-type OLModalBodyProps = React.ComponentProps<typeof ModalBody> & {
-  bs3Props?: Record<string, unknown>
-}
-
-type OLModalFooterProps = ModalFooterProps & {
-  bs3Props?: Record<string, unknown>
-}
-
 export default function OLModal({ children, ...props }: OLModalProps) {
-  const { bs3Props, ...bs5Props } = props
+  return <Modal {...props}>{children}</Modal>
+}
 
-  const bs3ModalProps: BS3ModalProps = {
-    bsClass: bs5Props.bsPrefix,
-    bsSize: bs5Props.size,
-    show: bs5Props.show,
-    onHide: bs5Props.onHide,
-    onExited: bs5Props.onExited,
-    backdrop: bs5Props.backdrop,
-    animation: bs5Props.animation,
-    id: bs5Props.id,
-    className: bs5Props.className,
-    backdropClassName: bs5Props.backdropClassName,
-    ...bs3Props,
-  }
+export function OLModalHeader({ children, ...props }: ModalHeaderProps) {
+  return <Modal.Header {...props}>{children}</Modal.Header>
+}
 
+export function OLModalTitle({ children, ...props }: ModalTitleProps) {
   return (
-    <BootstrapVersionSwitcher
-      bs3={<AccessibleModal {...bs3ModalProps}>{children}</AccessibleModal>}
-      bs5={<BS5Modal {...bs5Props}>{children}</BS5Modal>}
-    />
+    <Modal.Title as="h2" {...props}>
+      {children}
+    </Modal.Title>
   )
 }
 
-export function OLModalHeader({ children, ...props }: OLModalHeaderProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  const bs3ModalProps: BS3ModalHeaderProps = {
-    bsClass: bs5Props.bsPrefix,
-    onHide: bs5Props.onHide,
-    closeButton: bs5Props.closeButton,
-    closeLabel: bs5Props.closeLabel,
-  }
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Modal.Header {...bs3ModalProps}>{children}</BS3Modal.Header>}
-      bs5={<BS5Modal.Header {...bs5Props}>{children}</BS5Modal.Header>}
-    />
-  )
+export function OLModalBody({ children, ...props }: ModalBodyProps) {
+  return <Modal.Body {...props}>{children}</Modal.Body>
 }
 
-export function OLModalTitle({ children, ...props }: OLModalTitleProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  const bs3ModalProps: BS3ModalTitleProps = {
-    componentClass: bs5Props.as,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Modal.Title {...bs3ModalProps}>{children}</BS3Modal.Title>}
-      bs5={
-        <BS5Modal.Title as="h2" {...bs5Props}>
-          {children}
-        </BS5Modal.Title>
-      }
-    />
-  )
-}
-
-export function OLModalBody({ children, ...props }: OLModalBodyProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  const bs3ModalProps: BS3ModalBodyProps = {
-    componentClass: bs5Props.as,
-    className: bs5Props.className,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Modal.Body {...bs3ModalProps}>{children}</BS3Modal.Body>}
-      bs5={<BS5Modal.Body {...bs5Props}>{children}</BS5Modal.Body>}
-    />
-  )
-}
-
-export function OLModalFooter({ children, ...props }: OLModalFooterProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  const bs3ModalProps: BS3ModalFooterProps = {
-    componentClass: bs5Props.as,
-    className: bs5Props.className,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Modal.Footer {...bs3ModalProps}>{children}</BS3Modal.Footer>}
-      bs5={<BS5Modal.Footer {...bs5Props}>{children}</BS5Modal.Footer>}
-    />
-  )
+export function OLModalFooter({ children, ...props }: ModalFooterProps) {
+  return <Modal.Footer {...props}>{children}</Modal.Footer>
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-notification.tsx b/services/web/frontend/js/features/ui/components/ol/ol-notification.tsx
index e312d48c91..7ca811a796 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-notification.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-notification.tsx
@@ -1,42 +1,10 @@
 import Notification from '@/shared/components/notification'
-import { Alert, AlertProps } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import classnames from 'classnames'
-
-type OLNotificationProps = React.ComponentProps<typeof Notification> & {
-  bs3Props?: {
-    icon?: React.ReactElement
-    className?: string
-  }
-}
-
-function OLNotification(props: OLNotificationProps) {
-  const { bs3Props, ...notificationProps } = props
-
-  const alertProps = {
-    // Map `error` to `danger`
-    bsStyle:
-      notificationProps.type === 'error' ? 'danger' : notificationProps.type,
-    className: classnames(notificationProps.className, bs3Props?.className),
-    onDismiss: notificationProps.onDismiss,
-  } as const satisfies AlertProps
 
+function OLNotification(props: React.ComponentProps<typeof Notification>) {
   return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <Alert {...alertProps}>
-          {bs3Props?.icon}
-          {bs3Props?.icon && ' '}
-          {notificationProps.content}
-          {notificationProps.action}
-        </Alert>
-      }
-      bs5={
-        <div className="notification-list">
-          <Notification {...notificationProps} />
-        </div>
-      }
-    />
+    <div className="notification-list">
+      <Notification {...props} />
+    </div>
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-overlay.tsx b/services/web/frontend/js/features/ui/components/ol/ol-overlay.tsx
index 40b7872bc8..eb68066dd9 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-overlay.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-overlay.tsx
@@ -1,61 +1,7 @@
-import { Overlay, OverlayProps } from 'react-bootstrap-5'
-import {
-  Overlay as BS3Overlay,
-  OverlayProps as BS3OverlayProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Overlay, OverlayProps } from 'react-bootstrap'
 
-type OLOverlayProps = OverlayProps & {
-  bs3Props?: BS3OverlayProps
-}
-
-function OLOverlay(props: OLOverlayProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  let bs3OverlayProps: BS3OverlayProps = {
-    children: bs5Props.children,
-    target: bs5Props.target as BS3OverlayProps['target'],
-    container: bs5Props.container,
-    containerPadding: bs5Props.containerPadding,
-    show: bs5Props.show,
-    rootClose: bs5Props.rootClose,
-    animation: bs5Props.transition,
-    onHide: bs5Props.onHide as BS3OverlayProps['onHide'],
-    onEnter: bs5Props.onEnter as BS3OverlayProps['onEnter'],
-    onEntering: bs5Props.onEntering as BS3OverlayProps['onEntering'],
-    onEntered: bs5Props.onEntered as BS3OverlayProps['onEntered'],
-    onExit: bs5Props.onExit as BS3OverlayProps['onExit'],
-    onExiting: bs5Props.onExiting as BS3OverlayProps['onExiting'],
-    onExited: bs5Props.onExited as BS3OverlayProps['onExited'],
-  }
-
-  if (bs5Props.placement) {
-    const bs3PlacementOptions = [
-      'top',
-      'right',
-      'bottom',
-      'left',
-    ] satisfies Array<
-      Extract<OverlayProps['placement'], BS3OverlayProps['placement']>
-    >
-
-    for (const placement of bs3PlacementOptions) {
-      // BS5 has more placement options than BS3, such as "left-start", so these are mapped to "left" etc.
-      if (bs5Props.placement.startsWith(placement)) {
-        bs3OverlayProps.placement = placement
-        break
-      }
-    }
-  }
-
-  bs3OverlayProps = { ...bs3OverlayProps, ...bs3Props }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Overlay {...bs3OverlayProps} />}
-      bs5={<Overlay {...bs5Props} />}
-    />
-  )
+function OLOverlay(props: OverlayProps) {
+  return <Overlay {...props} />
 }
 
 export default OLOverlay
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-page-content-card.tsx b/services/web/frontend/js/features/ui/components/ol/ol-page-content-card.tsx
index ba6fc75ff9..c47be6d9de 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-page-content-card.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-page-content-card.tsx
@@ -1,24 +1,17 @@
-import { Card, CardBody } from 'react-bootstrap-5'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Card, CardBody } from 'react-bootstrap'
 import { FC } from 'react'
 import classNames from 'classnames'
 
 // This wraps the Bootstrap 5 Card component but is restricted to the very
 // basic way we're using it, which is as a container for page content. The
-// Bootstrap 3 equivalent in our codebase is a div with class "card"
-const OLPageContentCard: FC<{ className?: string }> = ({
-  children,
-  className,
-}) => {
+// Bootstrap 3 equivalent previously in our codebase is a div with class "card"
+const OLPageContentCard: FC<
+  React.PropsWithChildren<{ className?: string }>
+> = ({ children, className }) => {
   return (
-    <BootstrapVersionSwitcher
-      bs3={<div className={classNames('card', className)}>{children}</div>}
-      bs5={
-        <Card className={classNames('page-content-card', className)}>
-          <CardBody>{children}</CardBody>
-        </Card>
-      }
-    />
+    <Card className={classNames('page-content-card', className)}>
+      <CardBody>{children}</CardBody>
+    </Card>
   )
 }
 
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-popover.tsx b/services/web/frontend/js/features/ui/components/ol/ol-popover.tsx
index fbf74d3225..a20a2af13f 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-popover.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-popover.tsx
@@ -1,83 +1,18 @@
 import { forwardRef } from 'react'
-import { Popover, PopoverProps } from 'react-bootstrap-5'
-import {
-  Popover as BS3Popover,
-  PopoverProps as BS3PopoverProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Popover, PopoverProps } from 'react-bootstrap'
 
 type OLPopoverProps = Omit<PopoverProps, 'title'> & {
   title?: React.ReactNode
-  bs3Props?: BS3PopoverProps
 }
 
 const OLPopover = forwardRef<HTMLDivElement, OLPopoverProps>((props, ref) => {
-  // BS3 passes in some props automatically so the `props`
-  // type should be adjusted to reflect the actual received object
-  const propsCombinedWithAutoInjectedBs3Props = props as OLPopoverProps &
-    Pick<
-      BS3PopoverProps,
-      'arrowOffsetLeft' | 'arrowOffsetTop' | 'positionLeft' | 'positionTop'
-    >
-
-  const {
-    bs3Props,
-    title,
-    children,
-    arrowOffsetLeft,
-    arrowOffsetTop,
-    positionLeft,
-    positionTop,
-    ...bs5Props
-  } = propsCombinedWithAutoInjectedBs3Props
-
-  let bs3PopoverProps: BS3PopoverProps = {
-    children,
-    arrowOffsetLeft,
-    arrowOffsetTop,
-    positionLeft,
-    positionTop,
-    title,
-    id: bs5Props.id,
-    className: bs5Props.className,
-    style: bs5Props.style,
-  }
-
-  if (bs5Props.placement) {
-    const bs3PlacementOptions = [
-      'top',
-      'right',
-      'bottom',
-      'left',
-    ] satisfies Array<
-      Extract<PopoverProps['placement'], BS3PopoverProps['placement']>
-    >
-
-    for (const placement of bs3PlacementOptions) {
-      if (placement === bs5Props.placement) {
-        bs3PopoverProps.placement = bs5Props.placement
-        break
-      }
-    }
-  }
-
-  bs3PopoverProps = { ...bs3PopoverProps, ...bs3Props }
+  const { title, children, ...bs5Props } = props
 
   return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3Popover
-          {...bs3PopoverProps}
-          ref={ref as React.LegacyRef<BS3Popover>}
-        />
-      }
-      bs5={
-        <Popover {...bs5Props} ref={ref}>
-          {title && <Popover.Header>{title}</Popover.Header>}
-          <Popover.Body>{children}</Popover.Body>
-        </Popover>
-      }
-    />
+    <Popover {...bs5Props} ref={ref}>
+      {title && <Popover.Header>{title}</Popover.Header>}
+      <Popover.Body>{children}</Popover.Body>
+    </Popover>
   )
 })
 OLPopover.displayName = 'OLPopover'
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-row.tsx b/services/web/frontend/js/features/ui/components/ol/ol-row.tsx
index ef68a6887f..88f2bc82d6 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-row.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-row.tsx
@@ -1,16 +1,7 @@
-import { Row } from 'react-bootstrap-5'
-import { Row as BS3Row } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
+import { Row } from 'react-bootstrap'
 
-type OLRowProps = React.ComponentProps<typeof Row>
-
-function OLRow(props: OLRowProps) {
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Row className={props.className}>{props.children}</BS3Row>}
-      bs5={<Row {...props} />}
-    />
-  )
+function OLRow(props: React.ComponentProps<typeof Row>) {
+  return <Row {...props} />
 }
 
 export default OLRow
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-spinner.tsx b/services/web/frontend/js/features/ui/components/ol/ol-spinner.tsx
index 615f5acd47..ebd73ffab1 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-spinner.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-spinner.tsx
@@ -1,29 +1,14 @@
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import Icon from '@/shared/components/icon'
-import { Spinner } from 'react-bootstrap-5'
-import classNames from 'classnames'
+import { Spinner } from 'react-bootstrap'
 
 export type OLSpinnerSize = 'sm' | 'lg'
 
 function OLSpinner({ size = 'sm' }: { size: OLSpinnerSize }) {
   return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <Icon
-          type="refresh"
-          fw
-          spin
-          className={classNames({ 'fa-2x': size === 'lg' })}
-        />
-      }
-      bs5={
-        <Spinner
-          size={size === 'sm' ? 'sm' : undefined}
-          animation="border"
-          aria-hidden="true"
-          role="status"
-        />
-      }
+    <Spinner
+      size={size === 'sm' ? 'sm' : undefined}
+      animation="border"
+      aria-hidden="true"
+      role="status"
     />
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-table.tsx b/services/web/frontend/js/features/ui/components/ol/ol-table.tsx
index 3406c69624..82d2b69857 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-table.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-table.tsx
@@ -1,32 +1,7 @@
 import Table from '@/features/ui/components/bootstrap-5/table'
-import { Table as BS3Table } from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
 
-type OLFormProps = React.ComponentProps<typeof Table> & {
-  bs3Props?: React.ComponentProps<typeof BS3Table>
-}
-
-function OLTable(props: OLFormProps) {
-  const { bs3Props, container, ...rest } = props
-
-  const bs3FormProps: React.ComponentProps<typeof BS3Table> = {
-    bsClass: rest.className,
-    id: rest.id,
-    condensed: rest.size === 'sm',
-    children: rest.children,
-    responsive:
-      typeof rest.responsive !== 'string' ? rest.responsive : undefined,
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Table {...bs3FormProps} />}
-      bs5={<Table container={container} {...rest} />}
-    />
-  )
+function OLTable(props: React.ComponentProps<typeof Table>) {
+  return <Table {...props} />
 }
 
 export default OLTable
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-tag.tsx b/services/web/frontend/js/features/ui/components/ol/ol-tag.tsx
index 15774b9e41..bff3fdf1b9 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-tag.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-tag.tsx
@@ -1,37 +1,10 @@
 import Tag from '@/features/ui/components/bootstrap-5/tag'
-import BS3Tag from '@/shared/components/tag'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import { forwardRef } from 'react'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
 
-type OLTagProps = React.ComponentProps<typeof Tag> & {
-  bs3Props?: React.ComponentProps<typeof BS3Tag>
-}
+type OLTagProps = React.ComponentProps<typeof Tag>
 
 const OLTag = forwardRef<HTMLElement, OLTagProps>((props: OLTagProps, ref) => {
-  const { bs3Props, ...rest } = props
-
-  const bs3TagProps: React.ComponentProps<typeof BS3Tag> = {
-    children: rest.children,
-    prepend: rest.prepend,
-    closeBtnProps: rest.closeBtnProps,
-    className: rest.className,
-    onClick: rest.onClick,
-    onFocus: rest.onFocus,
-    onBlur: rest.onBlur,
-    onMouseOver: rest.onMouseOver,
-    onMouseOut: rest.onMouseOut,
-    contentProps: rest.contentProps,
-    ...getAriaAndDataProps(rest),
-    ...bs3Props,
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Tag {...bs3TagProps} />}
-      bs5={<Tag ref={ref} {...rest} />}
-    />
-  )
+  return <Tag ref={ref} {...props} />
 })
 
 OLTag.displayName = 'OLTag'
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-toast-container.tsx b/services/web/frontend/js/features/ui/components/ol/ol-toast-container.tsx
index 2934ce6b3b..26c0ff3545 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-toast-container.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-toast-container.tsx
@@ -1,31 +1,17 @@
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-
 import { CSSProperties, FC } from 'react'
-import { ToastContainer as BS5ToastContainer } from 'react-bootstrap-5'
-import { ToastContainer as BS3ToastContainer } from '../bootstrap-3/toast-container'
+import { ToastContainer as BS5ToastContainer } from 'react-bootstrap'
 
 type OLToastContainerProps = {
   style?: CSSProperties
   className?: string
 }
 
-export const OLToastContainer: FC<OLToastContainerProps> = ({
-  children,
-  className,
-  style,
-}) => {
+export const OLToastContainer: FC<
+  React.PropsWithChildren<OLToastContainerProps>
+> = ({ children, className, style }) => {
   return (
-    <BootstrapVersionSwitcher
-      bs5={
-        <BS5ToastContainer className={className} style={style}>
-          {children}
-        </BS5ToastContainer>
-      }
-      bs3={
-        <BS3ToastContainer className={className} style={style}>
-          {children}
-        </BS3ToastContainer>
-      }
-    />
+    <BS5ToastContainer className={className} style={style}>
+      {children}
+    </BS5ToastContainer>
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-toast.tsx b/services/web/frontend/js/features/ui/components/ol/ol-toast.tsx
index 893d959707..e4256f4fca 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-toast.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-toast.tsx
@@ -1,5 +1,5 @@
 import classNames from 'classnames'
-import { Toast as BS5Toast } from 'react-bootstrap-5'
+import { Toast as BS5Toast } from 'react-bootstrap'
 import {
   NotificationIcon,
   NotificationType,
@@ -7,8 +7,6 @@ import {
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '../../../../shared/components/material-icon'
 import { ReactNode, useCallback, useState } from 'react'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { Toast as BS3Toast } from '../bootstrap-3/toast'
 
 export type OLToastProps = {
   type: NotificationType
@@ -78,29 +76,14 @@ export const OLToast = ({
     </div>
   )
   return (
-    <BootstrapVersionSwitcher
-      bs5={
-        <BS5Toast
-          onClose={handleClose}
-          autohide={autoHide}
-          onExited={handleOnHidden}
-          delay={delay}
-          show={show}
-        >
-          {toastElement}
-        </BS5Toast>
-      }
-      bs3={
-        <BS3Toast
-          onClose={handleClose}
-          autohide={autoHide}
-          delay={delay}
-          onExited={handleOnHidden}
-          show={show}
-        >
-          {toastElement}
-        </BS3Toast>
-      }
-    />
+    <BS5Toast
+      onClose={handleClose}
+      autohide={autoHide}
+      onExited={handleOnHidden}
+      delay={delay}
+      show={show}
+    >
+      {toastElement}
+    </BS5Toast>
   )
 }
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-toggle-button-group.tsx b/services/web/frontend/js/features/ui/components/ol/ol-toggle-button-group.tsx
index ea874c48a7..3344fdade1 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-toggle-button-group.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-toggle-button-group.tsx
@@ -1,42 +1,7 @@
-import { ToggleButtonGroup, ToggleButtonGroupProps } from 'react-bootstrap-5'
-import BS3ToggleButtonGroup from '@/features/ui/components/bootstrap-3/toggle-button-group'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
+import { ToggleButtonGroup, ToggleButtonGroupProps } from 'react-bootstrap'
 
-type BS3ToggleButtonGroupProps = React.ComponentProps<
-  typeof BS3ToggleButtonGroup
->
-
-type OLToggleButtonGroupProps<T> = ToggleButtonGroupProps<T> & {
-  bs3Props?: BS3ToggleButtonGroupProps
-}
-
-function OLToggleButtonGroup<T>(props: OLToggleButtonGroupProps<T>) {
-  const { bs3Props, ...rest } = props
-
-  const bs3ToggleButtonGroupProps = {
-    name: rest.name,
-    type: rest.type,
-    value: rest.value,
-    onChange: rest.onChange,
-    children: rest.children,
-    className: rest.className,
-    defaultValue: rest.defaultValue,
-    defaultChecked: rest.defaultChecked,
-    ...bs3Props,
-  } as BS3ToggleButtonGroupProps
-
-  // Get all `aria-*` and `data-*` attributes
-  const extraProps = getAriaAndDataProps(rest)
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3ToggleButtonGroup {...extraProps} {...bs3ToggleButtonGroupProps} />
-      }
-      bs5={<ToggleButtonGroup {...rest} />}
-    />
-  )
+function OLToggleButtonGroup<T>(props: ToggleButtonGroupProps<T>) {
+  return <ToggleButtonGroup {...props} />
 }
 
 export default OLToggleButtonGroup
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-toggle-button.tsx b/services/web/frontend/js/features/ui/components/ol/ol-toggle-button.tsx
index 4415e71bbe..a58772b78a 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-toggle-button.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-toggle-button.tsx
@@ -1,48 +1,7 @@
-import { ToggleButton, ToggleButtonProps } from 'react-bootstrap-5'
-import {
-  ToggleButton as BS3ToggleButton,
-  ToggleButtonProps as BS3ToggleButtonProps,
-} from 'react-bootstrap'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
-import classnames from 'classnames'
+import { ToggleButton, ToggleButtonProps } from 'react-bootstrap'
 
-type OLToggleButtonProps = ToggleButtonProps & {
-  bs3Props?: BS3ToggleButtonProps
-}
-
-function OLToggleButton(props: OLToggleButtonProps) {
-  const { bs3Props, ...rest } = props
-
-  const bs3ToggleButtonProps: BS3ToggleButtonProps & { active?: boolean } = {
-    type: rest.type,
-    name: rest.name,
-    active: rest.active,
-    checked: rest.checked,
-    disabled: rest.disabled,
-    onChange: rest.onChange as BS3ToggleButtonProps['onChange'],
-    onClick: rest.onClick as BS3ToggleButtonProps['onClick'],
-    value: rest.value as BS3ToggleButtonProps['value'],
-    children: rest.children,
-    className: classnames(`btn-${props.variant || 'primary'}`, rest.className),
-    ...bs3Props,
-  }
-
-  // Get all `aria-*` and `data-*` attributes
-  const extraProps = getAriaAndDataProps(rest)
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <BS3ToggleButton
-          {...extraProps}
-          {...bs3ToggleButtonProps}
-          bsStyle={null}
-        />
-      }
-      bs5={<ToggleButton {...rest} />}
-    />
-  )
+function OLToggleButton(props: ToggleButtonProps) {
+  return <ToggleButton {...props} />
 }
 
 export default OLToggleButton
diff --git a/services/web/frontend/js/features/ui/components/ol/ol-tooltip.tsx b/services/web/frontend/js/features/ui/components/ol/ol-tooltip.tsx
index c3f152e44e..eca0a7d5b9 100644
--- a/services/web/frontend/js/features/ui/components/ol/ol-tooltip.tsx
+++ b/services/web/frontend/js/features/ui/components/ol/ol-tooltip.tsx
@@ -1,48 +1,7 @@
 import Tooltip from '@/features/ui/components/bootstrap-5/tooltip'
-import BS3Tooltip from '@/shared/components/tooltip'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 
-type OLTooltipProps = React.ComponentProps<typeof Tooltip> & {
-  bs3Props?: Record<string, unknown>
-}
-
-function OLTooltip(props: OLTooltipProps) {
-  const { bs3Props, ...bs5Props } = props
-
-  type BS3TooltipProps = React.ComponentProps<typeof BS3Tooltip>
-
-  const bs3TooltipProps: BS3TooltipProps = {
-    children: bs5Props.children,
-    id: bs5Props.id,
-    description: bs5Props.description,
-    tooltipProps: bs5Props.tooltipProps as BS3TooltipProps,
-    overlayProps: {
-      placement: bs5Props.overlayProps?.placement,
-      rootClose: bs5Props.overlayProps?.rootClose,
-      trigger: bs5Props.overlayProps?.trigger,
-    },
-    ...bs3Props,
-  }
-
-  if ('hidden' in bs5Props) {
-    bs3TooltipProps.hidden = bs5Props.hidden
-  }
-
-  const delay = bs5Props.overlayProps?.delay
-  if (delay && typeof delay !== 'number') {
-    bs3TooltipProps.overlayProps = {
-      ...bs3TooltipProps.overlayProps,
-      delayShow: delay.show,
-      delayHide: delay.hide,
-    }
-  }
-
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<BS3Tooltip {...bs3TooltipProps} />}
-      bs5={<Tooltip {...bs5Props} />}
-    />
-  )
+function OLTooltip(props: React.ComponentProps<typeof Tooltip>) {
+  return <Tooltip {...props} />
 }
 
 export default OLTooltip
diff --git a/services/web/frontend/js/features/ui/components/types/button-props.ts b/services/web/frontend/js/features/ui/components/types/button-props.ts
index fad0c49c6a..e98538e168 100644
--- a/services/web/frontend/js/features/ui/components/types/button-props.ts
+++ b/services/web/frontend/js/features/ui/components/types/button-props.ts
@@ -34,5 +34,4 @@ export type ButtonProps = {
     | 'premium'
     | 'premium-secondary'
     | 'link'
-    | 'info'
 }
diff --git a/services/web/frontend/js/features/ui/components/types/default-navbar-metadata.ts b/services/web/frontend/js/features/ui/components/types/default-navbar-metadata.ts
index e2970d85ec..b9d6b0c506 100644
--- a/services/web/frontend/js/features/ui/components/types/default-navbar-metadata.ts
+++ b/services/web/frontend/js/features/ui/components/types/default-navbar-metadata.ts
@@ -10,6 +10,7 @@ export type DefaultNavbarMetadata = {
   canDisplayAdminRedirect: boolean
   canDisplaySplitTestMenu: boolean
   canDisplaySurveyMenu: boolean
+  canDisplayScriptLogMenu: boolean
   enableUpgradeButton: boolean
   suppressNavbarRight: boolean
   suppressNavContentLinks: boolean
diff --git a/services/web/frontend/js/features/ui/components/types/dropdown-menu-props.ts b/services/web/frontend/js/features/ui/components/types/dropdown-menu-props.ts
index 95cc60e393..0cdbe4fba6 100644
--- a/services/web/frontend/js/features/ui/components/types/dropdown-menu-props.ts
+++ b/services/web/frontend/js/features/ui/components/types/dropdown-menu-props.ts
@@ -30,6 +30,7 @@ export type DropdownProps = {
 export type DropdownItemProps = PropsWithChildren<{
   active?: boolean
   as?: ElementType
+  type?: string
   description?: ReactNode
   disabled?: boolean
   eventKey?: string | number
@@ -45,6 +46,7 @@ export type DropdownItemProps = PropsWithChildren<{
   target?: string
   download?: boolean | string
   rel?: string
+  translate?: React.HTMLAttributes<HTMLElement>['translate']
 }>
 
 export type DropdownToggleProps = PropsWithChildren<{
diff --git a/services/web/frontend/js/features/ui/components/types/icon-button-props.ts b/services/web/frontend/js/features/ui/components/types/icon-button-props.ts
index ec75bb6115..9cee07ebd9 100644
--- a/services/web/frontend/js/features/ui/components/types/icon-button-props.ts
+++ b/services/web/frontend/js/features/ui/components/types/icon-button-props.ts
@@ -1,7 +1,19 @@
+import { AvailableUnfilledIcon } from '@/shared/components/material-icon'
 import { ButtonProps } from './button-props'
 
-export type IconButtonProps = ButtonProps & {
+type BaseIconButtonProps = ButtonProps & {
   accessibilityLabel?: string
-  icon: string
   type?: 'button' | 'submit'
 }
+
+type FilledIconButtonProps = BaseIconButtonProps & {
+  icon: string
+  unfilled?: false
+}
+
+type UnfilledIconButtonProps = BaseIconButtonProps & {
+  icon: AvailableUnfilledIcon
+  unfilled: true
+}
+
+export type IconButtonProps = FilledIconButtonProps | UnfilledIconButtonProps
diff --git a/services/web/frontend/js/features/utils/bootstrap-5.ts b/services/web/frontend/js/features/utils/bootstrap-5.ts
index 7b55c89a6a..6e8dd26076 100644
--- a/services/web/frontend/js/features/utils/bootstrap-5.ts
+++ b/services/web/frontend/js/features/utils/bootstrap-5.ts
@@ -3,24 +3,3 @@ import getMeta from '@/utils/meta'
 // The reason this is a function is to ensure that the meta tag is read before
 // any isBootstrap5 check is performed
 export const isBootstrap5 = () => getMeta('ol-bootstrapVersion') === 5
-
-/* eslint-disable no-redeclare */
-export function bsVersion<A>({ bs5 }: { bs5: A }): A | undefined
-export function bsVersion<B>({ bs3 }: { bs3: B }): B | undefined
-export function bsVersion<A, B>({ bs5, bs3 }: { bs5: A; bs3: B }): A | B
-export function bsVersion({ bs5, bs3 }: { bs5?: unknown; bs3?: unknown }) {
-  return isBootstrap5() ? bs5 : bs3
-}
-
-// get all `aria-*` and `data-*` attributes
-export const getAriaAndDataProps = (obj: Record<string, unknown>) => {
-  return Object.entries(obj).reduce(
-    (acc, [key, value]) => {
-      if (key.startsWith('aria-') || key.startsWith('data-')) {
-        acc[key] = value
-      }
-      return acc
-    },
-    {} as Record<string, unknown>
-  )
-}
diff --git a/services/web/frontend/js/features/utils/disableElement.js b/services/web/frontend/js/features/utils/disableElement.js
index a60f1e9b98..7d423a26a3 100644
--- a/services/web/frontend/js/features/utils/disableElement.js
+++ b/services/web/frontend/js/features/utils/disableElement.js
@@ -1,9 +1,19 @@
+import { isBootstrap5 } from './bootstrap-5'
+
 export function disableElement(el) {
-  el.setAttribute('disabled', '')
+  if (isBootstrap5() && el.tagName.toLowerCase() === 'a') {
+    el.classList.add('disabled')
+  } else {
+    el.disabled = true
+  }
   el.setAttribute('aria-disabled', 'true')
 }
 
 export function enableElement(el) {
-  el.removeAttribute('disabled')
+  if (isBootstrap5() && el.tagName.toLowerCase() === 'a') {
+    el.classList.remove('disabled')
+  } else {
+    el.disabled = false
+  }
   el.removeAttribute('aria-disabled')
 }
diff --git a/services/web/frontend/js/features/utils/format-date.ts b/services/web/frontend/js/features/utils/format-date.ts
index 5210bf6962..d347c832b0 100644
--- a/services/web/frontend/js/features/utils/format-date.ts
+++ b/services/web/frontend/js/features/utils/format-date.ts
@@ -11,8 +11,13 @@ moment.updateLocale('en', {
   },
 })
 
-export function formatTime(date: moment.MomentInput, format = 'h:mm a') {
-  return moment(date).format(format)
+export function formatTime(
+  date: moment.MomentInput,
+  format = 'h:mm a',
+  utc = false
+) {
+  const momentDate = utc ? moment.utc(date) : moment(date)
+  return momentDate.format(format)
 }
 
 export function relativeDate(date: moment.MomentInput) {
diff --git a/services/web/frontend/js/features/utils/material-icon.ts b/services/web/frontend/js/features/utils/material-icon.ts
new file mode 100644
index 0000000000..e643f31fa0
--- /dev/null
+++ b/services/web/frontend/js/features/utils/material-icon.ts
@@ -0,0 +1,9 @@
+export function materialIcon(type: string) {
+  const icon = document.createElement('span')
+  icon.className = 'material-symbols'
+  icon.textContent = type
+  icon.ariaHidden = 'true'
+  icon.translate = false
+
+  return icon
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-button.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-button.tsx
new file mode 100644
index 0000000000..1c5f1e9072
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-button.tsx
@@ -0,0 +1,44 @@
+import { useDetachCompileContext as useCompileContext } from '@/shared/context/detach-compile-context'
+import { useTranslation } from 'react-i18next'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import LeftMenuButton from '@/features/editor-left-menu/components/left-menu-button'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { memo } from 'react'
+
+export const WordCountButton = memo<{
+  handleShowModal: () => void
+}>(function WordCountButton({ handleShowModal }) {
+  const { pdfUrl } = useCompileContext()
+  const { t } = useTranslation()
+
+  const enabled = pdfUrl || isSplitTestEnabled('word-count-client')
+
+  if (!enabled) {
+    return (
+      <OLTooltip
+        id="disabled-word-count"
+        description={t('please_compile_pdf_before_word_count')}
+        overlayProps={{
+          placement: 'top',
+        }}
+      >
+        {/* OverlayTrigger won't fire unless the child is a non-react html element (e.g div, span) */}
+        <div>
+          <LeftMenuButton
+            icon="match_case"
+            disabled
+            disabledAccesibilityText={t('please_compile_pdf_before_word_count')}
+          >
+            {t('word_count')}
+          </LeftMenuButton>
+        </div>
+      </OLTooltip>
+    )
+  }
+
+  return (
+    <LeftMenuButton onClick={handleShowModal} icon="match_case">
+      {t('word_count')}
+    </LeftMenuButton>
+  )
+})
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-client.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-client.tsx
new file mode 100644
index 0000000000..f5208166c4
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-client.tsx
@@ -0,0 +1,109 @@
+import { FC, useEffect, useMemo, useState } from 'react'
+import { WordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { WordCountLoading } from '@/features/word-count-modal/components/word-count-loading'
+import { WordCountError } from '@/features/word-count-modal/components/word-count-error'
+import { useProjectContext } from '@/shared/context/project-context'
+import useAbortController from '@/shared/hooks/use-abort-controller'
+import { useProjectSettingsContext } from '@/features/editor-left-menu/context/project-settings-context'
+import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
+import { debugConsole } from '@/utils/debugging'
+import { signalWithTimeout } from '@/utils/abort-signal'
+import { isMainFile } from '@/features/pdf-preview/util/editor-files'
+import { countWordsInFile } from '@/features/word-count-modal/utils/count-words-in-file'
+import { createSegmenters } from '@/features/word-count-modal/utils/segmenters'
+import { WordCountsClient } from './word-counts-client'
+
+export const WordCountClient: FC = () => {
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState(false)
+  const [data, setData] = useState<WordCountData | null>(null)
+  const { projectSnapshot, project } = useProjectContext()
+  const rootDocId = project?.rootDocId
+  const { spellCheckLanguage } = useProjectSettingsContext()
+  const { openDocs } = useEditorManagerContext()
+  const { currentDocument } = useEditorOpenDocContext()
+  const { pathInFolder } = useFileTreePathContext()
+
+  const { signal } = useAbortController()
+
+  const segmenters = useMemo(() => {
+    return createSegmenters(spellCheckLanguage?.replace(/_/, '-'))
+  }, [spellCheckLanguage])
+
+  useEffect(() => {
+    if (currentDocument && segmenters) {
+      const countWords = async () => {
+        await openDocs.awaitBufferedOps(signalWithTimeout(signal, 5000))
+        await projectSnapshot.refresh()
+
+        if (signal.aborted) return null
+
+        const currentDocSnapshot = currentDocument.getSnapshot()
+        const currentRootDocId = isMainFile(currentDocSnapshot)
+          ? currentDocument.doc_id
+          : rootDocId
+        if (!currentRootDocId) return null
+
+        const currentRootDocPath = pathInFolder(currentRootDocId)
+        if (!currentRootDocPath) return null
+
+        const data: WordCountData = {
+          encode: 'ascii',
+          textWords: 0,
+          textCharacters: 0,
+          headWords: 0,
+          headCharacters: 0,
+          abstractWords: 0,
+          abstractCharacters: 0,
+          captionWords: 0,
+          captionCharacters: 0,
+          footnoteWords: 0,
+          footnoteCharacters: 0,
+          outside: 0,
+          otherWords: 0,
+          otherCharacters: 0,
+          headers: 0,
+          elements: 0,
+          mathInline: 0,
+          mathDisplay: 0,
+          errors: 0,
+          messages: '',
+        }
+
+        countWordsInFile(data, projectSnapshot, currentRootDocPath, segmenters)
+
+        return data
+      }
+
+      countWords()
+        .then(data => {
+          setData(data)
+        })
+        .catch(error => {
+          debugConsole.error(error)
+          setError(true)
+        })
+        .finally(() => {
+          setLoading(false)
+        })
+    }
+  }, [
+    signal,
+    openDocs,
+    projectSnapshot,
+    segmenters,
+    currentDocument,
+    rootDocId,
+    pathInFolder,
+  ])
+
+  return (
+    <>
+      {loading && !error && <WordCountLoading />}
+      {error && <WordCountError />}
+      {data && <WordCountsClient data={data} />}
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-data.ts b/services/web/frontend/js/features/word-count-modal/components/word-count-data.ts
new file mode 100644
index 0000000000..e322ac9636
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-data.ts
@@ -0,0 +1,25 @@
+export type ServerWordCountData = {
+  encode: string
+  textWords: number
+  headWords: number
+  outside: number
+  headers: number
+  elements: number
+  mathInline: number
+  mathDisplay: number
+  errors: number
+  messages: string
+}
+
+export type WordCountData = ServerWordCountData & {
+  textCharacters: number
+  headCharacters: number
+  captionWords: number
+  captionCharacters: number
+  footnoteWords: number
+  footnoteCharacters: number
+  abstractWords: number
+  abstractCharacters: number
+  otherWords: number
+  otherCharacters: number
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-error.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-error.tsx
new file mode 100644
index 0000000000..18c10ff7d3
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-error.tsx
@@ -0,0 +1,10 @@
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+import { useTranslation } from 'react-i18next'
+
+export const WordCountError = () => {
+  const { t } = useTranslation()
+
+  return (
+    <OLNotification type="error" content={t('generic_something_went_wrong')} />
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-loading.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-loading.tsx
new file mode 100644
index 0000000000..e1f277d714
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-loading.tsx
@@ -0,0 +1,14 @@
+import { Spinner } from 'react-bootstrap'
+import { useTranslation } from 'react-i18next'
+
+export const WordCountLoading = () => {
+  const { t } = useTranslation()
+
+  return (
+    <div className="loading">
+      <Spinner animation="border" aria-hidden="true" size="sm" role="status" />
+      &nbsp;
+      {t('loading')}…
+    </div>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.jsx b/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.jsx
deleted file mode 100644
index 520b00de6e..0000000000
--- a/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.jsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import PropTypes from 'prop-types'
-import { useTranslation } from 'react-i18next'
-import { useProjectContext } from '@/shared/context/project-context'
-import { useLocalCompileContext } from '@/shared/context/local-compile-context'
-import { useWordCount } from '../hooks/use-word-count'
-import {
-  OLModalBody,
-  OLModalFooter,
-  OLModalHeader,
-  OLModalTitle,
-} from '@/features/ui/components/ol/ol-modal'
-import OLNotification from '@/features/ui/components/ol/ol-notification'
-import OLRow from '@/features/ui/components/ol/ol-row'
-import OLCol from '@/features/ui/components/ol/ol-col'
-import OLButton from '@/features/ui/components/ol/ol-button'
-import { Spinner } from 'react-bootstrap-5'
-
-// NOTE: this component is only mounted when the modal is open
-export default function WordCountModalContent({ handleHide }) {
-  const { _id: projectId } = useProjectContext()
-  const { clsiServerId } = useLocalCompileContext()
-  const { t } = useTranslation()
-  const { data, error, loading } = useWordCount(projectId, clsiServerId)
-
-  return (
-    <>
-      <OLModalHeader closeButton>
-        <OLModalTitle>{t('word_count')}</OLModalTitle>
-      </OLModalHeader>
-
-      <OLModalBody>
-        {loading && !error && (
-          <div className="loading">
-            <Spinner
-              animation="border"
-              aria-hidden="true"
-              size="sm"
-              role="status"
-            />
-            &nbsp;
-            {t('loading')}…
-          </div>
-        )}
-
-        {error && (
-          <OLNotification
-            type="error"
-            content={t('generic_something_went_wrong')}
-          />
-        )}
-
-        {data && (
-          <div className="container-fluid">
-            {data.messages && (
-              <OLRow>
-                <OLCol xs={12}>
-                  <OLNotification
-                    type="error"
-                    content={
-                      <p style={{ whiteSpace: 'pre-wrap' }}>{data.messages}</p>
-                    }
-                  />
-                </OLCol>
-              </OLRow>
-            )}
-
-            <OLRow>
-              <OLCol xs={4}>
-                <div className="pull-right">{t('total_words')}:</div>
-              </OLCol>
-              <OLCol xs={6}>{data.textWords}</OLCol>
-            </OLRow>
-
-            <OLRow>
-              <OLCol xs={4}>
-                <div className="pull-right">{t('headers')}:</div>
-              </OLCol>
-              <OLCol xs={6}>{data.headers}</OLCol>
-            </OLRow>
-
-            <OLRow>
-              <OLCol xs={4}>
-                <div className="pull-right">{t('math_inline')}:</div>
-              </OLCol>
-              <OLCol xs={6}>{data.mathInline}</OLCol>
-            </OLRow>
-
-            <OLRow>
-              <OLCol xs={4}>
-                <div className="pull-right">{t('math_display')}:</div>
-              </OLCol>
-              <OLCol xs={6}>{data.mathDisplay}</OLCol>
-            </OLRow>
-          </div>
-        )}
-      </OLModalBody>
-
-      <OLModalFooter>
-        <OLButton variant="secondary" onClick={handleHide}>
-          {t('close')}
-        </OLButton>
-      </OLModalFooter>
-    </>
-  )
-}
-
-WordCountModalContent.propTypes = {
-  handleHide: PropTypes.func.isRequired,
-}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.tsx
new file mode 100644
index 0000000000..75b53eeeba
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-modal-content.tsx
@@ -0,0 +1,42 @@
+import { useTranslation } from 'react-i18next'
+import {
+  OLModalBody,
+  OLModalFooter,
+  OLModalHeader,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import { WordCountServer } from './word-count-server'
+import { WordCountClient } from './word-count-client'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+
+// NOTE: this component is only mounted when the modal is open
+export default function WordCountModalContent({
+  handleHide,
+}: {
+  handleHide: () => void
+}) {
+  const { t } = useTranslation()
+
+  return (
+    <>
+      <OLModalHeader closeButton>
+        <OLModalTitle>{t('word_count')}</OLModalTitle>
+      </OLModalHeader>
+
+      <OLModalBody>
+        {isSplitTestEnabled('word-count-client') ? (
+          <WordCountClient />
+        ) : (
+          <WordCountServer />
+        )}
+      </OLModalBody>
+
+      <OLModalFooter>
+        <OLButton variant="secondary" onClick={handleHide}>
+          {t('close')}
+        </OLButton>
+      </OLModalFooter>
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-modal.jsx b/services/web/frontend/js/features/word-count-modal/components/word-count-modal.tsx
similarity index 54%
rename from services/web/frontend/js/features/word-count-modal/components/word-count-modal.jsx
rename to services/web/frontend/js/features/word-count-modal/components/word-count-modal.tsx
index 81f9685fe0..b3dd52f8db 100644
--- a/services/web/frontend/js/features/word-count-modal/components/word-count-modal.jsx
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-modal.tsx
@@ -1,23 +1,26 @@
-import React from 'react'
-import PropTypes from 'prop-types'
+import { memo } from 'react'
 import WordCountModalContent from './word-count-modal-content'
 import withErrorBoundary from '../../../infrastructure/error-boundary'
 import OLModal from '@/features/ui/components/ol/ol-modal'
 
-const WordCountModal = React.memo(function WordCountModal({
+const WordCountModal = memo(function WordCountModal({
   show,
   handleHide,
+}: {
+  show: boolean
+  handleHide: () => void
 }) {
   return (
-    <OLModal animation show={show} onHide={handleHide} id="word-count-modal">
+    <OLModal
+      animation
+      show={show}
+      onHide={handleHide}
+      id="word-count-modal"
+      data-testid="word-count-modal"
+    >
       <WordCountModalContent handleHide={handleHide} />
     </OLModal>
   )
 })
 
-WordCountModal.propTypes = {
-  show: PropTypes.bool,
-  handleHide: PropTypes.func.isRequired,
-}
-
 export default withErrorBoundary(WordCountModal)
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-count-server.tsx b/services/web/frontend/js/features/word-count-modal/components/word-count-server.tsx
new file mode 100644
index 0000000000..4435b48500
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-count-server.tsx
@@ -0,0 +1,48 @@
+import { FC, useEffect, useState } from 'react'
+import { ServerWordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { WordCountLoading } from '@/features/word-count-modal/components/word-count-loading'
+import { WordCountError } from '@/features/word-count-modal/components/word-count-error'
+import { useProjectContext } from '@/shared/context/project-context'
+import { useLocalCompileContext } from '@/shared/context/local-compile-context'
+import useAbortController from '@/shared/hooks/use-abort-controller'
+import { getJSON } from '@/infrastructure/fetch-json'
+import { debugConsole } from '@/utils/debugging'
+import { WordCounts } from '@/features/word-count-modal/components/word-counts'
+
+export const WordCountServer: FC = () => {
+  const { projectId } = useProjectContext()
+  const { clsiServerId } = useLocalCompileContext()
+
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState(false)
+  const [data, setData] = useState<ServerWordCountData | null>(null)
+
+  const { signal } = useAbortController()
+
+  useEffect(() => {
+    const url = new URL(`/project/${projectId}/wordcount`, window.location.href)
+    if (clsiServerId) {
+      url.searchParams.set('clsiserverid', clsiServerId)
+    }
+
+    getJSON(url.toString(), { signal })
+      .then(data => {
+        setData(data.texcount)
+      })
+      .catch(error => {
+        debugConsole.error(error)
+        setError(true)
+      })
+      .finally(() => {
+        setLoading(false)
+      })
+  }, [projectId, clsiServerId, signal])
+
+  return (
+    <>
+      {loading && !error && <WordCountLoading />}
+      {error && <WordCountError />}
+      {data && <WordCounts data={data} />}
+    </>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-counts-client.tsx b/services/web/frontend/js/features/word-count-modal/components/word-counts-client.tsx
new file mode 100644
index 0000000000..dac4934a50
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-counts-client.tsx
@@ -0,0 +1,138 @@
+import { FC, useMemo } from 'react'
+import { WordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { useTranslation } from 'react-i18next'
+import { Container, Row, Col, Form } from 'react-bootstrap'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+import usePersistedState from '@/shared/hooks/use-persisted-state'
+
+export const WordCountsClient: FC<{ data: WordCountData }> = ({ data }) => {
+  const { t } = useTranslation()
+
+  const [included, setIncluded] = usePersistedState<string[]>(
+    'word-count-total',
+    ['text']
+  )
+
+  const items = useMemo(() => {
+    return [
+      {
+        key: 'text',
+        label: t('text'),
+        words: data.textWords,
+        chars: data.textCharacters,
+      },
+      {
+        key: 'headers',
+        label: t('headers'),
+        words: data.headWords,
+        chars: data.headCharacters,
+      },
+      {
+        key: 'abstract',
+        label: t('abstract'),
+        words: data.abstractWords,
+        chars: data.abstractCharacters,
+      },
+      {
+        key: 'captions',
+        label: t('captions'),
+        words: data.captionWords,
+        chars: data.captionCharacters,
+      },
+      {
+        key: 'footnotes',
+        label: t('footnotes'),
+        words: data.footnoteWords,
+        chars: data.footnoteCharacters,
+      },
+      {
+        key: 'other',
+        label: t('other'),
+        words: data.otherWords,
+        chars: data.otherCharacters,
+      },
+    ]
+  }, [data, t])
+
+  const totals = useMemo(() => {
+    const totals = {
+      words: 0,
+      chars: 0,
+    }
+
+    for (const item of items) {
+      if (included.includes(item.key)) {
+        totals.words += item.words
+        totals.chars += item.chars
+      }
+    }
+
+    return totals
+  }, [included, items])
+
+  return (
+    <Container fluid>
+      {data.messages && (
+        <Row>
+          <Col xs={12}>
+            <OLNotification
+              type="error"
+              content={
+                <p style={{ whiteSpace: 'pre-wrap' }}>{data.messages}</p>
+              }
+            />
+          </Col>
+        </Row>
+      )}
+
+      {items.map(item => (
+        <Row
+          key={item.key}
+          style={{
+            borderBottom: '1px solid #eee',
+            padding: 5,
+            marginBottom: 5,
+          }}
+        >
+          <Col
+            style={{
+              display: 'flex',
+              alignItems: 'top',
+              justifyContent: 'space-between',
+            }}
+          >
+            <Form.Check
+              type="checkbox"
+              id={`word-count-${item.key}`}
+              label={item.label}
+              checked={included.includes(item.key)}
+              onChange={event =>
+                setIncluded(prevValue => {
+                  return event.target.checked
+                    ? prevValue.concat(item.key)
+                    : prevValue.filter(key => key !== item.key)
+                })
+              }
+              aria-label={`Include ${item.label} in total`}
+            />
+          </Col>
+          <Col>
+            {item.words} words
+            <br />
+            {item.chars} chars
+          </Col>
+        </Row>
+      ))}
+
+      <Row>
+        <Col style={{ textAlign: 'right' }}>
+          <span style={{ fontWeight: 'bold' }}>
+            {t('total')}: {totals.words} words
+            <br />
+            {totals.chars} chars
+          </span>
+        </Col>
+      </Row>
+    </Container>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/components/word-counts.tsx b/services/web/frontend/js/features/word-count-modal/components/word-counts.tsx
new file mode 100644
index 0000000000..79777a0cab
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/components/word-counts.tsx
@@ -0,0 +1,55 @@
+import { FC } from 'react'
+import { ServerWordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { useTranslation } from 'react-i18next'
+import { Container, Row, Col } from 'react-bootstrap'
+import OLNotification from '@/features/ui/components/ol/ol-notification'
+
+export const WordCounts: FC<{
+  data: ServerWordCountData
+}> = ({ data }) => {
+  const { t } = useTranslation()
+
+  return (
+    <Container fluid>
+      {data.messages && (
+        <Row>
+          <Col xs={12}>
+            <OLNotification
+              type="error"
+              content={
+                <p style={{ whiteSpace: 'pre-wrap' }}>{data.messages}</p>
+              }
+            />
+          </Col>
+        </Row>
+      )}
+
+      <Row>
+        <Col xs={4}>
+          <div className="float-end">{t('total_words')}:</div>
+        </Col>
+        <Col xs={6}>{data.textWords}</Col>
+      </Row>
+      <Row>
+        <Col xs={4}>
+          <div className="float-end">{t('headers')}:</div>
+        </Col>
+        <Col xs={6}>{data.headers}</Col>
+      </Row>
+
+      <Row>
+        <Col xs={4}>
+          <div className="float-end">{t('math_inline')}:</div>
+        </Col>
+        <Col xs={6}>{data.mathInline}</Col>
+      </Row>
+
+      <Row>
+        <Col xs={4}>
+          <div className="float-end">{t('math_display')}:</div>
+        </Col>
+        <Col xs={6}>{data.mathDisplay}</Col>
+      </Row>
+    </Container>
+  )
+}
diff --git a/services/web/frontend/js/features/word-count-modal/hooks/use-word-count.js b/services/web/frontend/js/features/word-count-modal/hooks/use-word-count.js
deleted file mode 100644
index 51d6cba8f4..0000000000
--- a/services/web/frontend/js/features/word-count-modal/hooks/use-word-count.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import useAbortController from '../../../shared/hooks/use-abort-controller'
-import { fetchWordCount } from '../utils/api'
-import { useEffect, useState } from 'react'
-
-export function useWordCount(projectId, clsiServerId) {
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState(false)
-  const [data, setData] = useState()
-
-  const { signal } = useAbortController()
-
-  useEffect(() => {
-    fetchWordCount(projectId, clsiServerId, { signal })
-      .then(data => {
-        setData(data.texcount)
-      })
-      .catch(() => {
-        setError(true)
-      })
-      .finally(() => {
-        setLoading(false)
-      })
-  }, [signal, clsiServerId, projectId])
-
-  return { data, error, loading }
-}
diff --git a/services/web/frontend/js/features/word-count-modal/utils/api.js b/services/web/frontend/js/features/word-count-modal/utils/api.js
deleted file mode 100644
index 54818f0338..0000000000
--- a/services/web/frontend/js/features/word-count-modal/utils/api.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import { getJSON } from '../../../infrastructure/fetch-json'
-
-export function fetchWordCount(projectId, clsiServerId, options) {
-  let query = ''
-  if (clsiServerId) {
-    query = `?clsiserverid=${clsiServerId}`
-  }
-
-  return getJSON(`/project/${projectId}/wordcount${query}`, options)
-}
diff --git a/services/web/frontend/js/features/word-count-modal/utils/count-words-in-file.ts b/services/web/frontend/js/features/word-count-modal/utils/count-words-in-file.ts
new file mode 100644
index 0000000000..a14120d8d5
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/utils/count-words-in-file.ts
@@ -0,0 +1,323 @@
+import { LaTeXLanguage } from '@/features/source-editor/languages/latex/latex-language'
+import { WordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { NodeType, SyntaxNodeRef } from '@lezer/common'
+import { debugConsole } from '@/utils/debugging'
+import { findPreambleExtent } from '@/features/word-count-modal/utils/find-preamble-extent'
+import { Segmenters } from './segmenters'
+
+const whiteSpaceRe = /^\s$/
+
+type Context = 'text' | 'header' | 'abstract' | 'caption' | 'footnote' | 'other'
+
+const counters: Record<
+  Context,
+  {
+    word: keyof WordCountData
+    character: keyof WordCountData
+  }
+> = {
+  text: {
+    word: 'textWords',
+    character: 'textCharacters',
+  },
+  header: {
+    word: 'headWords',
+    character: 'headCharacters',
+  },
+  abstract: {
+    word: 'abstractWords',
+    character: 'abstractCharacters',
+  },
+  caption: {
+    word: 'captionWords',
+    character: 'captionCharacters',
+  },
+  footnote: {
+    word: 'footnoteWords',
+    character: 'footnoteCharacters',
+  },
+  other: {
+    word: 'otherWords',
+    character: 'otherCharacters',
+  },
+}
+
+// https://en.wikibooks.org/wiki/LaTeX/Special_Characters#Escaped_codes
+const replacementsMap: Map<string, string> = new Map([
+  // LaTeX commands that create characters
+  ['aa', 'å'],
+  ['AA', 'Å'],
+  ['ae', 'æ'],
+  ['AE', 'Æ'],
+  ['oe', 'œ'],
+  ['OE', 'Œ'],
+  ['o', 'ø'],
+  ['O', 'Ø'],
+  ['ss', 'ß'],
+  ['SS', 'SS'],
+  ['l', 'ł'],
+  ['L', 'Ł'],
+  ['dh', 'ð'],
+  ['DH', 'Ð'],
+  ['dj', 'đ'],
+  ['DJ', 'Ð'],
+  ['th', 'þ'],
+  ['TH', 'Þ'],
+  ['ng', 'ŋ'],
+  ['NG', 'Ŋ'],
+  ['i', 'ı'],
+  ['j', 'ȷ'],
+  // reserved characters
+  ['&', '&'],
+  ['$', '$'],
+  ['%', '%'],
+  ['#', '#'],
+  ['_', '_'],
+  ['{', '{'],
+  ['}', '}'],
+  // modifier commands for the subsequent character(s) (in braces)
+  ['H', 'ő'], // long Hungarian umlaut (double acute)
+  ['b', 'o'], // bar under the letter
+  ['c', 'ç'], // cedilla
+  ['d', 'o'], // dot under the letter
+  ['k', 'ą'], // ogonek
+  ['r', 'å'], // ring over the letter
+  ['t', 'o͡o'], // "tie" over the two letters
+  ['u', 'ŏ'], // breve over the letter
+  ['v', 'š'], // caron/háček over the letter
+  // modifier symbols for the subsequent character
+  ["'", ''], // acute
+  ['^', ''], // circumflex
+  ['"', ''], // umlaut, trema or dieresis
+  ['=', ''], // macron accent (a bar over the letter)
+  ['.', ''], // dot over the letter
+  ['`', ''], // grave
+  ['~', ''], // tilde
+  // commands that create text
+  ['TeX', 'TeX'],
+  ['LaTeX', 'LaTeX'],
+  ['textbackslash', '\\'],
+])
+
+type TextNode = {
+  from: number
+  to: number
+  text: string
+  context: Context
+}
+
+export const countWordsInFile = (
+  data: WordCountData,
+  projectSnapshot: { getDocContents(path: string): string | null },
+  docPath: string,
+  segmenters: Segmenters
+) => {
+  debugConsole.log(`Counting words in ${docPath}`)
+
+  const content = projectSnapshot.getDocContents(docPath) // TODO: try with extensions
+  if (!content) return
+
+  // TODO: language from file extension
+  const tree = LaTeXLanguage.parser.parse(content)
+
+  let currentContext: Context = 'text'
+
+  const textNodes: TextNode[] = []
+
+  const iterateNode = (nodeRef: SyntaxNodeRef, context: Context = 'text') => {
+    const previousContext = currentContext
+    currentContext = context
+    nodeRef.node.cursor().iterate(childNodeRef => {
+      // TODO: a better way to iterate only descendants?
+      if (childNodeRef.node !== nodeRef.node) {
+        return bodyMatcher(childNodeRef.type)?.(childNodeRef)
+      }
+    })
+    currentContext = previousContext
+  }
+
+  const headMatcher = NodeType.match<
+    (nodeRef: SyntaxNodeRef) => boolean | void
+  >({
+    Title(nodeRef) {
+      data.headers++
+      iterateNode(nodeRef, 'header')
+      return false
+    },
+  })
+
+  const bodyMatcher = NodeType.match<
+    (nodeRef: SyntaxNodeRef) => boolean | void
+  >({
+    Normal(nodeRef) {
+      textNodes.push({
+        from: nodeRef.from,
+        to: nodeRef.to,
+        text: content.substring(nodeRef.from, nodeRef.to),
+        context: currentContext,
+      })
+    },
+    Command(nodeRef) {
+      const child = nodeRef.node.getChild('UnknownCommand')
+      if (!child) return
+
+      const grandchild =
+        child.getChild('$CtrlSeq') ?? child.getChild('$CtrlSym')
+      if (!grandchild) return
+
+      const commandName = content.substring(grandchild.from + 1, grandchild.to)
+      if (!commandName) return
+
+      switch (commandName) {
+        case 'thanks':
+          iterateNode(nodeRef, 'other')
+          return false
+      }
+
+      if (!replacementsMap.has(commandName)) return
+
+      // TODO: handle accented character in braces after a CtrlSym, e.g. \'{a}
+      // TODO: handle markup within words, e.g. inter\textbf{nal}formatting
+      // TODO: handle commands like \egrave and \eacute
+
+      const text = replacementsMap.get(commandName)!
+
+      textNodes.push({
+        from: nodeRef.from,
+        to: nodeRef.to,
+        text,
+        context: currentContext,
+      })
+
+      return false
+    },
+    $Environment(nodeRef) {
+      const envNameNode = nodeRef.node
+        .getChild('BeginEnv')
+        ?.getChild('EnvNameGroup')
+        ?.getChild('EnvName')
+
+      if (envNameNode) {
+        const envName = content
+          ?.substring(envNameNode.from, envNameNode.to)
+          .replace(/\*$/, '')
+
+        if (envName === 'abstract') {
+          data.headers++
+
+          const contentNode = nodeRef.node.getChild('Content')
+          if (contentNode) {
+            iterateNode(contentNode, 'abstract')
+          }
+
+          return false
+        }
+      }
+    },
+    BeginEnv() {
+      return false // ignore text in \begin arguments
+    },
+    Math(nodeRef) {
+      const parent = nodeRef.node.parent
+      if (parent?.type.is('InlineMath') || parent?.type.is('ParenMath')) {
+        data.mathInline++
+      } else {
+        data.mathDisplay++
+      }
+
+      return false // TODO: count \text in math nodes?
+    },
+    'ShortTextArgument ShortOptionalArg'() {
+      return false
+    },
+    SectioningArgument(nodeRef) {
+      data.headers++
+      iterateNode(nodeRef, 'header')
+      return false
+    },
+    Caption(nodeRef) {
+      iterateNode(nodeRef, 'caption')
+      return false
+    },
+    'FootnoteCommand EndnoteCommand'(nodeRef) {
+      iterateNode(nodeRef, 'footnote')
+      return false
+    },
+    'IncludeArgument InputArgument'(nodeRef) {
+      let path = content.substring(nodeRef.from + 1, nodeRef.to - 1)
+      if (!/\.\w+$/.test(path)) {
+        path += '.tex'
+      }
+      debugConsole.log(path)
+      if (path) {
+        countWordsInFile(data, projectSnapshot, path, segmenters)
+      }
+    },
+    'BlankLine LineBreak'(nodeRef) {
+      textNodes.push({
+        from: nodeRef.from,
+        to: nodeRef.to,
+        text: '\n',
+        context: currentContext,
+      })
+    },
+  })
+
+  const preambleExtent = findPreambleExtent(tree)
+
+  tree.iterate({
+    from: 0,
+    to: preambleExtent.to,
+    enter(nodeRef) {
+      return headMatcher(nodeRef.type)?.(nodeRef)
+    },
+  })
+
+  tree.iterate({
+    from: preambleExtent.to,
+    enter(nodeRef) {
+      return bodyMatcher(nodeRef.type)?.(nodeRef)
+    },
+  })
+
+  const texts: Record<Context, string> = {
+    abstract: '',
+    header: '',
+    caption: '',
+    text: '',
+    footnote: '',
+    other: '',
+  }
+
+  let pos = 0
+  for (const textNode of textNodes) {
+    if (textNode.from !== pos) {
+      texts[textNode.context] += ' '
+    }
+    texts[textNode.context] += textNode.text
+    pos = textNode.to
+  }
+
+  for (const [context, text] of Object.entries(texts)) {
+    const counter = counters[context as Context]
+
+    // TODO: replace - and _ with a word character if hyphenated words should be counted as one word?
+
+    for (const value of segmenters.word.segment(
+      text.replace(/\w[-_]\w/g, 'aaa')
+    )) {
+      if (value.isWordLike) {
+        data[counter.word]++
+      }
+    }
+
+    // TODO: count hyphens as characters?
+
+    for (const value of segmenters.character.segment(text)) {
+      // TODO: option for whether to include whitespace?
+      if (!whiteSpaceRe.test(value.segment)) {
+        data[counter.character]++
+      }
+    }
+  }
+}
diff --git a/services/web/frontend/js/features/word-count-modal/utils/find-preamble-extent.ts b/services/web/frontend/js/features/word-count-modal/utils/find-preamble-extent.ts
new file mode 100644
index 0000000000..21aafe4b96
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/utils/find-preamble-extent.ts
@@ -0,0 +1,40 @@
+import { NodeType, SyntaxNodeRef, Tree } from '@lezer/common'
+import { ancestorOfNodeWithType } from '@/features/source-editor/utils/tree-operations/ancestors'
+
+export const findPreambleExtent = (tree: Tree) => {
+  const preamble = { to: 0 }
+
+  let seenDocumentEnvironment = false
+
+  const preambleMatcher = NodeType.match<(nodeRef: SyntaxNodeRef) => void>({
+    'Title Author Affil Affiliation'(nodeRef) {
+      preamble.to = nodeRef.node.to
+    },
+    DocumentEnvironment(nodeRef) {
+      // only count the first instance of DocumentEnvironment
+      if (!seenDocumentEnvironment) {
+        preamble.to =
+          nodeRef.node.getChild('Content')?.from ?? nodeRef.node.from
+        seenDocumentEnvironment = true
+      }
+    },
+    Maketitle(nodeRef) {
+      // count \maketitle inside DocumentEnvironment
+      if (
+        ancestorOfNodeWithType(nodeRef.node, '$Environment')?.type.is(
+          'DocumentEnvironment'
+        )
+      ) {
+        preamble.to = nodeRef.node.from
+      }
+    },
+  })
+
+  tree.iterate({
+    enter(nodeRef) {
+      return preambleMatcher(nodeRef.type)?.(nodeRef)
+    },
+  })
+
+  return preamble
+}
diff --git a/services/web/frontend/js/features/word-count-modal/utils/segmenters.ts b/services/web/frontend/js/features/word-count-modal/utils/segmenters.ts
new file mode 100644
index 0000000000..7e52e1e6fa
--- /dev/null
+++ b/services/web/frontend/js/features/word-count-modal/utils/segmenters.ts
@@ -0,0 +1,64 @@
+const wordRe = /['\-.\p{L}]+/gu
+const wordLikeRe = /\p{L}/u // must contain at least one "letter" to be a word
+const characterRe = /\S/gu
+
+type SegmentDataLike = {
+  segment: string
+  isWordLike?: boolean
+}
+
+type SegmenterLike = {
+  segment(input: string): {
+    [Symbol.iterator](): IterableIterator<SegmentDataLike>
+  }
+}
+
+export type Segmenters = {
+  word: SegmenterLike
+  character: SegmenterLike
+}
+
+export const createSegmenters = (locale?: string): Segmenters => {
+  if (!Intl.Segmenter) {
+    return genericSegmenters
+  }
+
+  try {
+    return {
+      word: new Intl.Segmenter(locale, {
+        granularity: 'word', // TODO: count hyphenated words as a single word
+      }),
+      character: new Intl.Segmenter(locale, {
+        granularity: 'grapheme',
+      }),
+    }
+  } catch {
+    return genericSegmenters
+  }
+}
+
+const genericSegmenters = {
+  word: {
+    segment(input: string) {
+      const segments: SegmentDataLike[] = []
+      for (const match of input.matchAll(wordRe)) {
+        segments.push({
+          segment: match[0],
+          isWordLike: wordLikeRe.test(match[0]),
+        })
+      }
+      return segments
+    },
+  },
+  character: {
+    segment(input: string) {
+      const segments: SegmentDataLike[] = []
+      for (const match of input.matchAll(characterRe)) {
+        segments.push({
+          segment: match[0],
+        })
+      }
+      return segments
+    },
+  },
+}
diff --git a/services/web/frontend/js/ide/connection/SocketIoShim.js b/services/web/frontend/js/ide/connection/SocketIoShim.js
index 40ada0485a..6d9effd442 100644
--- a/services/web/frontend/js/ide/connection/SocketIoShim.js
+++ b/services/web/frontend/js/ide/connection/SocketIoShim.js
@@ -4,6 +4,8 @@ import { debugConsole } from '@/utils/debugging'
 import EventEmitter from '@/utils/EventEmitter'
 
 class SocketShimBase {
+  // unused vars kept to document the interface
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   static connect(url, options) {
     return new SocketShimBase()
   }
@@ -46,11 +48,15 @@ class SocketShimNoop extends SocketShimBase {
       },
 
       connect() {},
+      // unused vars kept to document the interface
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       disconnect(reason) {},
     }
   }
 
   connect() {}
+  // unused vars kept to document the interface
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   disconnect(reason) {}
   emit() {}
   on() {}
@@ -277,13 +283,36 @@ if (typeof io === 'undefined' || !io) {
   current = SocketShimV2
 }
 
-export class SocketIOMock extends EventEmitter {
+export class SocketIOMock extends SocketShimBase {
+  constructor() {
+    super(new EventEmitter())
+    this.socket = {
+      get connected() {
+        return false
+      },
+      get sessionid() {
+        return undefined
+      },
+      get transport() {
+        return {}
+      },
+      get transports() {
+        return []
+      },
+
+      connect() {},
+      // unused vars kept to document the interface
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      disconnect(reason) {},
+    }
+  }
+
   addListener(event, listener) {
-    this.on(event, listener)
+    this._socket.on(event, listener)
   }
 
   removeListener(event, listener) {
-    this.off(event, listener)
+    this._socket.off(event, listener)
   }
 
   disconnect() {
@@ -294,6 +323,10 @@ export class SocketIOMock extends EventEmitter {
     // Round-trip through JSON.parse/stringify to simulate (de-)serializing on network layer.
     this.emit(...JSON.parse(JSON.stringify(args)))
   }
+
+  countEventListeners(event) {
+    return this._socket.events[event].length
+  }
 }
 
 export default {
diff --git a/services/web/frontend/js/infrastructure/error-boundary.jsx b/services/web/frontend/js/infrastructure/error-boundary.jsx
deleted file mode 100644
index 51f3ca7c4a..0000000000
--- a/services/web/frontend/js/infrastructure/error-boundary.jsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { captureException } from './error-reporter'
-import { ErrorBoundary } from 'react-error-boundary'
-
-function errorHandler(error, componentStack) {
-  captureException(error, {
-    extra: {
-      componentStack,
-    },
-    tags: {
-      handler: 'react-error-boundary',
-    },
-  })
-}
-
-function DefaultFallbackComponent() {
-  return <></>
-}
-
-function withErrorBoundary(WrappedComponent, FallbackComponent) {
-  function ErrorBoundaryWrapper(props) {
-    return (
-      <ErrorBoundary
-        FallbackComponent={FallbackComponent || DefaultFallbackComponent}
-        onError={errorHandler}
-      >
-        <WrappedComponent {...props} />
-      </ErrorBoundary>
-    )
-  }
-  ErrorBoundaryWrapper.propTypes = WrappedComponent.propTypes
-  ErrorBoundaryWrapper.displayName = `WithErrorBoundaryWrapper${
-    WrappedComponent.displayName || WrappedComponent.name || 'Component'
-  }`
-  return ErrorBoundaryWrapper
-}
-
-export default withErrorBoundary
diff --git a/services/web/frontend/js/infrastructure/error-boundary.tsx b/services/web/frontend/js/infrastructure/error-boundary.tsx
new file mode 100644
index 0000000000..c975a99849
--- /dev/null
+++ b/services/web/frontend/js/infrastructure/error-boundary.tsx
@@ -0,0 +1,31 @@
+import { captureException } from './error-reporter'
+import { withErrorBoundary as rebWithErrorBoundary } from 'react-error-boundary'
+import { ComponentType, ErrorInfo } from 'react'
+import { FallbackProps } from 'react-error-boundary/dist/declarations/src/types'
+
+function errorHandler(error: Error, errorInfo: ErrorInfo) {
+  captureException(error, {
+    extra: {
+      componentStack: errorInfo.componentStack,
+    },
+    tags: {
+      handler: 'react-error-boundary',
+    },
+  })
+}
+
+function DefaultFallbackComponent() {
+  return <></>
+}
+
+function withErrorBoundary(
+  WrappedComponent: ComponentType<any>,
+  FallbackComponent?: ComponentType<FallbackProps>
+) {
+  return rebWithErrorBoundary(WrappedComponent, {
+    onError: errorHandler,
+    FallbackComponent: FallbackComponent || DefaultFallbackComponent,
+  })
+}
+
+export default withErrorBoundary
diff --git a/services/web/frontend/js/infrastructure/error-reporter.ts b/services/web/frontend/js/infrastructure/error-reporter.ts
index a21a376594..8a07e4c85b 100644
--- a/services/web/frontend/js/infrastructure/error-reporter.ts
+++ b/services/web/frontend/js/infrastructure/error-reporter.ts
@@ -2,6 +2,7 @@
 import getMeta from '../utils/meta'
 import OError from '@overleaf/o-error'
 import { debugConsole } from '@/utils/debugging'
+import type { ErrorEvent } from '@sentry/types/types/event'
 
 const {
   sentryAllowedOriginRegex,
@@ -12,6 +13,21 @@ const {
 
 const reporterPromise = sentryDsn ? sentryReporter() : nullReporter()
 
+const isPropensityNetworkError = (err: ErrorEvent) => {
+  const errorBreadcrumbs = err.breadcrumbs?.filter(b => b.level === 'error')
+
+  if (!errorBreadcrumbs || errorBreadcrumbs.length !== 1) {
+    // don't ignore Propensity if there are more errors to report
+    return false
+  }
+
+  return Boolean(
+    errorBreadcrumbs[0]?.data?.url?.startsWith(
+      'https://analytics.propensity.com/'
+    )
+  )
+}
+
 function sentryReporter() {
   return (
     import(/* webpackMode: "eager" */ '@sentry/browser')
@@ -73,6 +89,23 @@ function sentryReporter() {
               return null // Block the event from sending
             }
 
+            // Do not send link-sharing token to Sentry
+            if (event.request?.headers?.Referer) {
+              const refererUrl = new URL(event.request.headers.Referer)
+
+              if (
+                refererUrl.hostname === window.location.hostname &&
+                refererUrl.pathname.startsWith('/read/')
+              ) {
+                refererUrl.pathname = '/read/'
+                event.request.headers.Referer = refererUrl.toString()
+              }
+            }
+
+            if (isPropensityNetworkError(event)) {
+              return null
+            }
+
             return event
           },
         })
diff --git a/services/web/frontend/js/infrastructure/event-tracking.ts b/services/web/frontend/js/infrastructure/event-tracking.ts
index a2b65a1ce4..6fbe93a53a 100644
--- a/services/web/frontend/js/infrastructure/event-tracking.ts
+++ b/services/web/frontend/js/infrastructure/event-tracking.ts
@@ -1,7 +1,7 @@
 import sessionStorage from './session-storage'
 import getMeta from '@/utils/meta'
 
-type Segmentation = Record<
+export type Segmentation = Record<
   string,
   string | number | boolean | undefined | unknown | any // TODO: RecurlyError
 >
diff --git a/services/web/frontend/js/infrastructure/hotjar.ts b/services/web/frontend/js/infrastructure/hotjar.ts
index 67051d088f..ea660e7faf 100644
--- a/services/web/frontend/js/infrastructure/hotjar.ts
+++ b/services/web/frontend/js/infrastructure/hotjar.ts
@@ -1,43 +1,18 @@
 import getMeta from '@/utils/meta'
 import { debugConsole } from '@/utils/debugging'
 import { initializeHotjar } from '@/infrastructure/hotjar-snippet'
+import { createTrackingLoader } from '@/infrastructure/tracking-loader'
 
 const { hotjarId, hotjarVersion } = getMeta('ol-ExposedSettings')
 const shouldLoadHotjar = getMeta('ol-shouldLoadHotjar')
 
-let hotjarInitialized = false
-
 if (hotjarId && hotjarVersion && shouldLoadHotjar) {
-  const loadHotjar = () => {
-    // consent needed
-    if (!document.cookie.split('; ').some(item => item === 'oa=1')) {
-      return
-    }
-
-    if (!/^\d+$/.test(hotjarId) || !/^\d+$/.test(hotjarVersion)) {
-      debugConsole.error('Invalid Hotjar id or version')
-      return
-    }
-
-    // avoid inserting twice
-    if (!hotjarInitialized) {
-      debugConsole.log('Loading Hotjar')
-      hotjarInitialized = true
-      initializeHotjar(hotjarId, hotjarVersion)
-    }
-  }
-
-  // load when idle, if supported
-  if (typeof window.requestIdleCallback === 'function') {
-    window.requestIdleCallback(loadHotjar)
+  if (!/^\d+$/.test(hotjarId) || !/^\d+$/.test(hotjarVersion)) {
+    debugConsole.error('Invalid Hotjar id or version')
   } else {
-    loadHotjar()
+    createTrackingLoader(
+      () => initializeHotjar(hotjarId, hotjarVersion),
+      'Hotjar'
+    )
   }
-
-  // listen for consent
-  window.addEventListener('cookie-consent', event => {
-    if ((event as CustomEvent<boolean>).detail) {
-      loadHotjar()
-    }
-  })
 }
diff --git a/services/web/frontend/js/infrastructure/project-snapshot.ts b/services/web/frontend/js/infrastructure/project-snapshot.ts
index eb7c768adf..976eb9d63f 100644
--- a/services/web/frontend/js/infrastructure/project-snapshot.ts
+++ b/services/web/frontend/js/infrastructure/project-snapshot.ts
@@ -124,9 +124,15 @@ export class ProjectSnapshot {
    */
   private async loadChanges() {
     await flushHistory(this.projectId)
-    const changes = await fetchLatestChanges(this.projectId, this.version)
-    this.snapshot.applyAll(changes)
-    this.version += changes.length
+    let hasMore = true
+    while (hasMore) {
+      const response = await fetchLatestChanges(this.projectId, this.version)
+      const changes = response.changes
+      this.snapshot.applyAll(changes)
+      this.version += changes.length
+      hasMore = response.hasMore
+    }
+
     await this.loadDocs()
   }
 
@@ -181,14 +187,43 @@ async function fetchLatestChunk(projectId: string): Promise<Chunk> {
   return Chunk.fromRaw(response.chunk)
 }
 
+type FetchLatestChangesResponse = {
+  changes: Change[]
+  hasMore: boolean
+}
+
+type FetchLatestChangesApiResponse =
+  | RawChange[]
+  | {
+      changes: RawChange[]
+      hasMore: boolean
+    }
+
 async function fetchLatestChanges(
   projectId: string,
   version: number
-): Promise<Change[]> {
-  const response = await getJSON<RawChange[]>(
-    `/project/${projectId}/changes?since=${version}`
+): Promise<FetchLatestChangesResponse> {
+  // TODO: The paginated flag is a transition flag. It can be removed after this
+  // code has been deployed for a few weeks.
+  const response = await getJSON<FetchLatestChangesApiResponse>(
+    `/project/${projectId}/changes?since=${version}&paginated=true`
   )
-  return response.map(Change.fromRaw).filter(change => change != null)
+
+  let changes, hasMore
+  if (Array.isArray(response)) {
+    // deprecated response format is a simple array of changes
+    // TODO: Remove this branch after the transition
+    changes = response
+    hasMore = false
+  } else {
+    changes = response.changes
+    hasMore = response.hasMore
+  }
+
+  return {
+    changes: changes.map(Change.fromRaw).filter(change => change != null),
+    hasMore,
+  }
 }
 
 async function fetchBlob(projectId: string, hash: string): Promise<string> {
diff --git a/services/web/frontend/js/infrastructure/tracking-loader.ts b/services/web/frontend/js/infrastructure/tracking-loader.ts
new file mode 100644
index 0000000000..c179fc2f86
--- /dev/null
+++ b/services/web/frontend/js/infrastructure/tracking-loader.ts
@@ -0,0 +1,55 @@
+import { debugConsole } from '@/utils/debugging'
+
+export const createTrackingLoader = (cb: () => void, name: string) => {
+  // avoid inserting twice
+  let initialized = false
+
+  const loadTracking = () => {
+    // consent needed
+    const consent = document.cookie.split('; ').some(item => item === 'oa=1')
+    if (initialized || !consent) {
+      return
+    }
+    debugConsole.log('Loading Analytics', name)
+    initialized = true
+    cb()
+  }
+
+  // load when idle, if supported
+  if (typeof window.requestIdleCallback === 'function') {
+    window.requestIdleCallback(loadTracking)
+  } else {
+    loadTracking()
+  }
+
+  // listen for consent
+  window.addEventListener('cookie-consent', event => {
+    if ((event as CustomEvent<boolean>).detail) {
+      loadTracking()
+    }
+  })
+}
+
+export const insertScript = (attr: {
+  src: string
+  crossorigin?: string
+  async?: boolean
+  onload?: () => void
+}) => {
+  const script = document.createElement('script')
+  script.setAttribute('src', attr.src)
+
+  if (attr.crossorigin) {
+    script.setAttribute('crossorigin', attr.crossorigin)
+  }
+
+  if (attr.async) {
+    script.setAttribute('async', 'async')
+  }
+
+  if (attr.onload) {
+    script.onload = attr.onload
+  }
+
+  document.querySelector('head')?.append(script)
+}
diff --git a/services/web/frontend/js/infrastructure/tracking-propensity.ts b/services/web/frontend/js/infrastructure/tracking-propensity.ts
new file mode 100644
index 0000000000..586f00b1bd
--- /dev/null
+++ b/services/web/frontend/js/infrastructure/tracking-propensity.ts
@@ -0,0 +1,23 @@
+import getMeta from '@/utils/meta'
+import {
+  createTrackingLoader,
+  insertScript,
+} from '@/infrastructure/tracking-loader'
+
+const { propensityId } = getMeta('ol-ExposedSettings')
+
+const loadPropensityScript = (id: string) => {
+  insertScript({
+    src: 'https://cdn.propensity.com/propensity/propensity_analytics.js',
+    crossorigin: 'anonymous',
+    onload: () => {
+      if (typeof window.propensity !== 'undefined') {
+        window.propensity(id)
+      }
+    },
+  })
+}
+
+if (propensityId) {
+  createTrackingLoader(() => loadPropensityScript(propensityId), 'Propensity')
+}
diff --git a/services/web/frontend/js/infrastructure/tracking.ts b/services/web/frontend/js/infrastructure/tracking.ts
new file mode 100644
index 0000000000..ce26bd51a1
--- /dev/null
+++ b/services/web/frontend/js/infrastructure/tracking.ts
@@ -0,0 +1 @@
+import './tracking-propensity'
diff --git a/services/web/frontend/js/main/account-upgrade.ts b/services/web/frontend/js/main/account-upgrade.ts
index 9aa2490768..79155e5c0d 100644
--- a/services/web/frontend/js/main/account-upgrade.ts
+++ b/services/web/frontend/js/main/account-upgrade.ts
@@ -1,7 +1,14 @@
 import * as eventTracking from '../infrastructure/event-tracking'
 
-export function startFreeTrial(source: string, variant?: string) {
-  const eventSegmentation: Record<string, string> = { 'paywall-type': source }
+export function startFreeTrial(
+  source: string,
+  variant?: string,
+  segmentation?: eventTracking.Segmentation
+) {
+  const eventSegmentation: Record<string, string> = {
+    'paywall-type': source,
+    ...segmentation,
+  }
   if (variant) {
     eventSegmentation.variant = variant
   }
diff --git a/services/web/frontend/js/marketing.ts b/services/web/frontend/js/marketing.ts
index ad32a0d29b..df9fd27d83 100644
--- a/services/web/frontend/js/marketing.ts
+++ b/services/web/frontend/js/marketing.ts
@@ -1,5 +1,6 @@
 import './utils/webpack-public-path'
 import './infrastructure/error-reporter'
+import './infrastructure/hotjar'
 import './features/form-helpers/hydrate-form'
 import './features/form-helpers/password-visibility'
 import './features/link-helpers/slow-link'
@@ -9,4 +10,3 @@ import './features/multi-submit'
 import './features/cookie-banner'
 import './features/autoplay-video'
 import './features/mathjax'
-import './features/header-footer-react'
diff --git a/services/web/frontend/js/pages/compromised-password.tsx b/services/web/frontend/js/pages/compromised-password.tsx
index b18502780c..b163cfeb9e 100644
--- a/services/web/frontend/js/pages/compromised-password.tsx
+++ b/services/web/frontend/js/pages/compromised-password.tsx
@@ -1,12 +1,5 @@
-import '../marketing'
+import { renderInReactLayout } from '@/react'
 
-import ReactDOM from 'react-dom'
-import { CompromisedPasswordCard } from '../features/compromised-password/components/compromised-password-root'
+import { CompromisedPasswordCard } from '@/features/compromised-password/components/compromised-password-root'
 
-const compromisedPasswordContainer = document.getElementById(
-  'compromised-password'
-)
-
-if (compromisedPasswordContainer) {
-  ReactDOM.render(<CompromisedPasswordCard />, compromisedPasswordContainer)
-}
+renderInReactLayout('compromised-password', () => <CompromisedPasswordCard />)
diff --git a/services/web/frontend/js/pages/ide.tsx b/services/web/frontend/js/pages/ide.tsx
index a939504790..467a4625b8 100644
--- a/services/web/frontend/js/pages/ide.tsx
+++ b/services/web/frontend/js/pages/ide.tsx
@@ -1,10 +1,14 @@
 import '../utils/webpack-public-path' // configure dynamically loaded assets (via webpack) to be downloaded from CDN
 import '../infrastructure/error-reporter' // set up error reporting, including Sentry
 import '../infrastructure/hotjar' // set up Hotjar
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import IdeRoot from '@/features/ide-react/components/ide-root'
 
-ReactDOM.render(<IdeRoot />, document.getElementById('ide-root'))
+const container = document.getElementById('ide-root')
+if (container) {
+  const root = createRoot(container)
+  root.render(<IdeRoot />)
+}
 
 // work around Safari 15's incomplete support for dvh units
 // https://github.com/overleaf/internal/issues/18109
diff --git a/services/web/frontend/js/pages/marketing/homepage.js b/services/web/frontend/js/pages/marketing/homepage.js
index 47b0e7e55e..99059756fd 100644
--- a/services/web/frontend/js/pages/marketing/homepage.js
+++ b/services/web/frontend/js/pages/marketing/homepage.js
@@ -1,4 +1,5 @@
 import '../../marketing'
+import '@/infrastructure/hotjar'
 
 function homepageAnimation(homepageAnimationEl) {
   function createFrames(word, { buildTime, holdTime, breakTime }) {
diff --git a/services/web/frontend/js/pages/project-list.tsx b/services/web/frontend/js/pages/project-list.tsx
index dd24bb00f9..b5e2e2fd46 100644
--- a/services/web/frontend/js/pages/project-list.tsx
+++ b/services/web/frontend/js/pages/project-list.tsx
@@ -5,10 +5,11 @@ import '@/i18n'
 import '../features/event-tracking'
 import '../features/cookie-banner'
 import '../features/link-helpers/slow-link'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import ProjectListRoot from '../features/project-list/components/project-list-root'
 
 const element = document.getElementById('project-list-root')
 if (element) {
-  ReactDOM.render(<ProjectListRoot />, element)
+  const root = createRoot(element)
+  root.render(<ProjectListRoot />)
 }
diff --git a/services/web/frontend/js/pages/sharing-updates.tsx b/services/web/frontend/js/pages/sharing-updates.tsx
index 63219542ef..7f1a097e8c 100644
--- a/services/web/frontend/js/pages/sharing-updates.tsx
+++ b/services/web/frontend/js/pages/sharing-updates.tsx
@@ -1,11 +1,13 @@
 import './../utils/meta'
 import '../utils/webpack-public-path'
 import './../infrastructure/error-reporter'
+import './../features/header-footer-react'
 import '@/i18n'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import SharingUpdatesRoot from '../features/token-access/components/sharing-updates-root'
 
 const element = document.getElementById('sharing-updates-page')
 if (element) {
-  ReactDOM.render(<SharingUpdatesRoot />, element)
+  const root = createRoot(element)
+  root.render(<SharingUpdatesRoot />)
 }
diff --git a/services/web/frontend/js/pages/socket-diagnostics.tsx b/services/web/frontend/js/pages/socket-diagnostics.tsx
index 982209b378..5219e82a23 100644
--- a/services/web/frontend/js/pages/socket-diagnostics.tsx
+++ b/services/web/frontend/js/pages/socket-diagnostics.tsx
@@ -1,10 +1,5 @@
-import '../marketing'
+import { renderInReactLayout } from '@/react'
 
-import ReactDOM from 'react-dom'
 import { SocketDiagnostics } from '@/features/socket-diagnostics/components/socket-diagnostics'
 
-const socketDiagnosticsContainer = document.getElementById('socket-diagnostics')
-
-if (socketDiagnosticsContainer) {
-  ReactDOM.render(<SocketDiagnostics />, socketDiagnosticsContainer)
-}
+renderInReactLayout('socket-diagnostics', () => <SocketDiagnostics />)
diff --git a/services/web/frontend/js/pages/template-gallery.tsx b/services/web/frontend/js/pages/template-gallery.tsx
new file mode 100644
index 0000000000..58a63be1ad
--- /dev/null
+++ b/services/web/frontend/js/pages/template-gallery.tsx
@@ -0,0 +1,15 @@
+import './../utils/meta'
+import '../utils/webpack-public-path'
+import './../infrastructure/error-reporter'
+import '@/i18n'
+import '../features/event-tracking'
+import '../features/cookie-banner'
+import '../features/link-helpers/slow-link'
+import ReactDOM from 'react-dom/client'
+import TemplateGalleryRoot from '../features/template-gallery/components/template-gallery-root'
+
+const element = document.getElementById('template-gallery-root')
+if (element) {
+  const root = ReactDOM.createRoot(element)
+  root.render(<TemplateGalleryRoot />)
+}
diff --git a/services/web/frontend/js/pages/template.tsx b/services/web/frontend/js/pages/template.tsx
new file mode 100644
index 0000000000..02d29d04da
--- /dev/null
+++ b/services/web/frontend/js/pages/template.tsx
@@ -0,0 +1,15 @@
+import './../utils/meta'
+import '../utils/webpack-public-path'
+import './../infrastructure/error-reporter'
+import '@/i18n'
+import '../features/event-tracking'
+import '../features/cookie-banner'
+import '../features/link-helpers/slow-link'
+import ReactDOM from 'react-dom/client'
+import TemplateRoot from '../features/template/components/template-root'
+
+const element = document.getElementById('template-root')
+if (element) {
+  const root = ReactDOM.createRoot(element)
+  root.render(<TemplateRoot />)
+}
diff --git a/services/web/frontend/js/pages/token-access.tsx b/services/web/frontend/js/pages/token-access.tsx
index 97026d93f4..72a208a0fe 100644
--- a/services/web/frontend/js/pages/token-access.tsx
+++ b/services/web/frontend/js/pages/token-access.tsx
@@ -2,10 +2,11 @@ import './../utils/meta'
 import '../utils/webpack-public-path'
 import './../infrastructure/error-reporter'
 import '@/i18n'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import TokenAccessRoot from '../features/token-access/components/token-access-root'
 
 const element = document.getElementById('token-access-page')
 if (element) {
-  ReactDOM.render(<TokenAccessRoot />, element)
+  const root = createRoot(element)
+  root.render(<TokenAccessRoot />)
 }
diff --git a/services/web/frontend/js/pages/user/add-secondary-email.tsx b/services/web/frontend/js/pages/user/add-secondary-email.tsx
index 8297d319af..987031dd61 100644
--- a/services/web/frontend/js/pages/user/add-secondary-email.tsx
+++ b/services/web/frontend/js/pages/user/add-secondary-email.tsx
@@ -1,12 +1,5 @@
-import '../../marketing'
+import { renderInReactLayout } from '@/react'
 
-import ReactDOM from 'react-dom'
-import { AddSecondaryEmailPrompt } from '../../features/settings/components/emails/add-secondary-email-prompt'
+import { AddSecondaryEmailPrompt } from '@/features/settings/components/emails/add-secondary-email-prompt'
 
-const addSecondaryEmailContainer = document.getElementById(
-  'add-secondary-email'
-)
-
-if (addSecondaryEmailContainer) {
-  ReactDOM.render(<AddSecondaryEmailPrompt />, addSecondaryEmailContainer)
-}
+renderInReactLayout('add-secondary-email', () => <AddSecondaryEmailPrompt />)
diff --git a/services/web/frontend/js/pages/user/confirm-secondary-email.tsx b/services/web/frontend/js/pages/user/confirm-secondary-email.tsx
index 405aaf0d30..d4be9364b5 100644
--- a/services/web/frontend/js/pages/user/confirm-secondary-email.tsx
+++ b/services/web/frontend/js/pages/user/confirm-secondary-email.tsx
@@ -1,10 +1,7 @@
-import '../../marketing'
+import { renderInReactLayout } from '@/react'
 
-import ReactDOM from 'react-dom'
-import ConfirmSecondaryEmailForm from '../../features/settings/components/emails/confirm-secondary-email-form'
+import ConfirmSecondaryEmailForm from '@/features/settings/components/emails/confirm-secondary-email-form'
 
-const confirmEmailContainer = document.getElementById('confirm-secondary-email')
-
-if (confirmEmailContainer) {
-  ReactDOM.render(<ConfirmSecondaryEmailForm />, confirmEmailContainer)
-}
+renderInReactLayout('confirm-secondary-email', () => (
+  <ConfirmSecondaryEmailForm />
+))
diff --git a/services/web/frontend/js/pages/user/settings.jsx b/services/web/frontend/js/pages/user/settings.jsx
deleted file mode 100644
index bd55a175d9..0000000000
--- a/services/web/frontend/js/pages/user/settings.jsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import '../../marketing'
-import './../../utils/meta'
-import '../../utils/webpack-public-path'
-import './../../infrastructure/error-reporter'
-import '@/i18n'
-import '../../features/settings/components/root'
-import ReactDOM from 'react-dom'
-import SettingsPageRoot from '../../features/settings/components/root.tsx'
-
-const element = document.getElementById('settings-page-root')
-// For react-google-recaptcha
-window.recaptchaOptions = {
-  enterprise: true,
-  useRecaptchaNet: true,
-}
-if (element) {
-  ReactDOM.render(<SettingsPageRoot />, element)
-}
diff --git a/services/web/frontend/js/pages/user/settings.tsx b/services/web/frontend/js/pages/user/settings.tsx
new file mode 100644
index 0000000000..a425877180
--- /dev/null
+++ b/services/web/frontend/js/pages/user/settings.tsx
@@ -0,0 +1,13 @@
+import { renderInReactLayout } from '@/react'
+import '@/utils/meta'
+import '@/utils/webpack-public-path'
+import '@/infrastructure/error-reporter'
+import '@/i18n'
+import SettingsPageRoot from '@/features/settings/components/root'
+
+// For react-google-recaptcha
+window.recaptchaOptions = {
+  enterprise: true,
+  useRecaptchaNet: true,
+}
+renderInReactLayout('settings-page-root', () => <SettingsPageRoot />)
diff --git a/services/web/frontend/js/pages/user/subscription/canceled-subscription.jsx b/services/web/frontend/js/pages/user/subscription/canceled-subscription.jsx
index 98fe7d178e..fb95674195 100644
--- a/services/web/frontend/js/pages/user/subscription/canceled-subscription.jsx
+++ b/services/web/frontend/js/pages/user/subscription/canceled-subscription.jsx
@@ -1,8 +1,9 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../features/subscription/components/canceled-subscription/root'
 
 const element = document.getElementById('subscription-canceled-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/dashboard.jsx b/services/web/frontend/js/pages/user/subscription/dashboard.jsx
index 96ea6d75a1..66ffcfe604 100644
--- a/services/web/frontend/js/pages/user/subscription/dashboard.jsx
+++ b/services/web/frontend/js/pages/user/subscription/dashboard.jsx
@@ -1,8 +1,9 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../features/subscription/components/dashboard/root'
 
 const element = document.getElementById('subscription-dashboard-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-invites.tsx b/services/web/frontend/js/pages/user/subscription/group-invites.tsx
index 35e559c110..fd0c803531 100644
--- a/services/web/frontend/js/pages/user/subscription/group-invites.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-invites.tsx
@@ -1,8 +1,9 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import GroupInvitesRoot from '@/features/subscription/components/group-invites/group-invites-root'
 
 const element = document.getElementById('group-invites-root')
 if (element) {
-  ReactDOM.render(<GroupInvitesRoot />, element)
+  const root = createRoot(element)
+  root.render(<GroupInvitesRoot />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/add-seats.tsx b/services/web/frontend/js/pages/user/subscription/group-management/add-seats.tsx
index b62b93e5e2..7c7374dfa4 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/add-seats.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/add-seats.tsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '@/features/group-management/components/add-seats/root'
 
 const element = document.getElementById('add-seats-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/group-managers.jsx b/services/web/frontend/js/pages/user/subscription/group-management/group-managers.jsx
index 70533ccc44..1d538320ca 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/group-managers.jsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/group-managers.jsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../../features/group-management/components/group-managers'
 
 const element = document.getElementById('subscription-manage-group-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/group-members.jsx b/services/web/frontend/js/pages/user/subscription/group-management/group-members.jsx
index 446220c702..b9a412e5ef 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/group-members.jsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/group-members.jsx
@@ -1,17 +1,17 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import GroupMembers from '../../../../features/group-management/components/group-members'
 import { GroupMembersProvider } from '../../../../features/group-management/context/group-members-context'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 const element = document.getElementById('subscription-manage-group-root')
 if (element) {
-  ReactDOM.render(
+  const root = createRoot(element)
+  root.render(
     <SplitTestProvider>
       <GroupMembersProvider>
         <GroupMembers />
       </GroupMembersProvider>
-    </SplitTestProvider>,
-    element
+    </SplitTestProvider>
   )
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/institution-managers.jsx b/services/web/frontend/js/pages/user/subscription/group-management/institution-managers.jsx
index 2ea1d2d7cf..d8fa8f24db 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/institution-managers.jsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/institution-managers.jsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../../features/group-management/components/institution-managers'
 
 const element = document.getElementById('subscription-manage-group-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/manually-collected-subscription.tsx b/services/web/frontend/js/pages/user/subscription/group-management/manually-collected-subscription.tsx
index ce7f0a9a4a..dedeffe15d 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/manually-collected-subscription.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/manually-collected-subscription.tsx
@@ -1,8 +1,14 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import ManuallyCollectedSubscription from '@/features/group-management/components/manually-collected-subscription'
+import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 const element = document.getElementById('manually-collected-subscription-root')
 if (element) {
-  ReactDOM.render(<ManuallyCollectedSubscription />, element)
+  const root = createRoot(element)
+  root.render(
+    <SplitTestProvider>
+      <ManuallyCollectedSubscription />
+    </SplitTestProvider>
+  )
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/missing-billing-information.tsx b/services/web/frontend/js/pages/user/subscription/group-management/missing-billing-information.tsx
index 449e77f9b6..48b145dc7b 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/missing-billing-information.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/missing-billing-information.tsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import MissingBillingInformation from '@/features/group-management/components/missing-billing-information'
 
 const element = document.getElementById('missing-billing-information-root')
 if (element) {
-  ReactDOM.render(<MissingBillingInformation />, element)
+  const root = createRoot(element)
+  root.render(<MissingBillingInformation />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/publisher-managers.jsx b/services/web/frontend/js/pages/user/subscription/group-management/publisher-managers.jsx
index f323afa459..9a4be834c5 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/publisher-managers.jsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/publisher-managers.jsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../../features/group-management/components/publisher-managers'
 
 const element = document.getElementById('subscription-manage-group-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/subtotal-limit-exceeded.tsx b/services/web/frontend/js/pages/user/subscription/group-management/subtotal-limit-exceeded.tsx
index 242c04f5cf..ecc38222c2 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/subtotal-limit-exceeded.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/subtotal-limit-exceeded.tsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import SubtotalLimitExceeded from '@/features/group-management/components/subtotal-limit-exceeded'
 
 const element = document.getElementById('subtotal-limit-exceeded-root')
 if (element) {
-  ReactDOM.render(<SubtotalLimitExceeded />, element)
+  const root = createRoot(element)
+  root.render(<SubtotalLimitExceeded />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/group-management/upgrade-group-subscription.tsx b/services/web/frontend/js/pages/user/subscription/group-management/upgrade-group-subscription.tsx
index 18abd65543..d8d1cc3e28 100644
--- a/services/web/frontend/js/pages/user/subscription/group-management/upgrade-group-subscription.tsx
+++ b/services/web/frontend/js/pages/user/subscription/group-management/upgrade-group-subscription.tsx
@@ -1,8 +1,9 @@
 import '../base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '@/features/group-management/components/upgrade-subscription/root'
 
 const element = document.getElementById('upgrade-group-subscription-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/invite-managed.jsx b/services/web/frontend/js/pages/user/subscription/invite-managed.jsx
index 4a593aea17..ecb1d4d3b0 100644
--- a/services/web/frontend/js/pages/user/subscription/invite-managed.jsx
+++ b/services/web/frontend/js/pages/user/subscription/invite-managed.jsx
@@ -1,8 +1,9 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import InvitedManagedRoot from '../../../features/subscription/components/invite-managed-root'
 
 const element = document.getElementById('invite-managed-root')
 if (element) {
-  ReactDOM.render(<InvitedManagedRoot />, element)
+  const root = createRoot(element)
+  root.render(<InvitedManagedRoot />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/invite.tsx b/services/web/frontend/js/pages/user/subscription/invite.tsx
index 119f9e867f..151619a643 100644
--- a/services/web/frontend/js/pages/user/subscription/invite.tsx
+++ b/services/web/frontend/js/pages/user/subscription/invite.tsx
@@ -1,9 +1,10 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import InviteRoot from '@/features/subscription/components/invite-root'
 
 const element = document.getElementById('invite-root')
 
 if (element) {
-  ReactDOM.render(<InviteRoot />, element)
+  const root = createRoot(element)
+  root.render(<InviteRoot />)
 }
diff --git a/services/web/frontend/js/pages/user/subscription/preview-change.tsx b/services/web/frontend/js/pages/user/subscription/preview-change.tsx
index 0f3804ecdc..6d7d0b175f 100644
--- a/services/web/frontend/js/pages/user/subscription/preview-change.tsx
+++ b/services/web/frontend/js/pages/user/subscription/preview-change.tsx
@@ -1,8 +1,9 @@
-import '@/marketing'
-import ReactDOM from 'react-dom'
+import { renderInReactLayout } from '@/react'
 import PreviewSubscriptionChange from '@/features/subscription/components/preview-subscription-change/root'
+import { SplitTestProvider } from '@/shared/context/split-test-context'
 
-const element = document.getElementById('subscription-preview-change')
-if (element) {
-  ReactDOM.render(<PreviewSubscriptionChange />, element)
-}
+renderInReactLayout('subscription-preview-change', () => (
+  <SplitTestProvider>
+    <PreviewSubscriptionChange />
+  </SplitTestProvider>
+))
diff --git a/services/web/frontend/js/pages/user/subscription/successful-subscription.jsx b/services/web/frontend/js/pages/user/subscription/successful-subscription.jsx
index fde2a1aefc..bd75c3799c 100644
--- a/services/web/frontend/js/pages/user/subscription/successful-subscription.jsx
+++ b/services/web/frontend/js/pages/user/subscription/successful-subscription.jsx
@@ -1,8 +1,9 @@
 import './base'
-import ReactDOM from 'react-dom'
+import { createRoot } from 'react-dom/client'
 import Root from '../../../features/subscription/components/successful-subscription/root'
 
 const element = document.getElementById('subscription-success-root')
 if (element) {
-  ReactDOM.render(<Root />, element)
+  const root = createRoot(element)
+  root.render(<Root />)
 }
diff --git a/services/web/frontend/js/react.ts b/services/web/frontend/js/react.ts
new file mode 100644
index 0000000000..fa940e0bf4
--- /dev/null
+++ b/services/web/frontend/js/react.ts
@@ -0,0 +1,15 @@
+import './marketing'
+import './features/header-footer-react'
+import { createRoot } from 'react-dom/client'
+import { ReactNode } from 'react'
+
+export function renderInReactLayout(
+  parentId: string,
+  createChildren: () => ReactNode
+) {
+  const parentElement = document.getElementById(parentId)
+  if (parentElement) {
+    const root = createRoot(parentElement)
+    root.render(createChildren())
+  }
+}
diff --git a/services/web/frontend/js/shared/components/accessible-modal.tsx b/services/web/frontend/js/shared/components/accessible-modal.tsx
deleted file mode 100644
index dbd8269f9e..0000000000
--- a/services/web/frontend/js/shared/components/accessible-modal.tsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import { useCallback } from 'react'
-import { Modal, ModalProps } from 'react-bootstrap'
-
-// A wrapper for the v0.33 React Bootstrap Modal component,
-// which ensures that the `aria-hidden` attribute is not set on the modal when it's visible,
-// and that role="dialog" is not duplicated.
-// https://github.com/react-bootstrap/react-bootstrap/issues/4790
-// There are other ARIA attributes on these modals which could be improved,
-// but this at least makes them accessible for tests.
-function AccessibleModal(props: ModalProps) {
-  const modalRef = useCallback(
-    element => {
-      const modalNode = element?._modal?.modalNode
-      if (modalNode) {
-        if (props.show) {
-          modalNode.removeAttribute('role')
-          modalNode.removeAttribute('aria-hidden')
-        } else {
-          // NOTE: possibly not ever used, as the modal is only rendered when shown
-          modalNode.setAttribute('aria-hidden', 'true')
-        }
-      }
-    },
-    [props.show]
-  )
-
-  return <Modal {...props} ref={modalRef} />
-}
-
-export default AccessibleModal
diff --git a/services/web/frontend/js/shared/components/badge.tsx b/services/web/frontend/js/shared/components/badge.tsx
deleted file mode 100644
index 4970d9d2ad..0000000000
--- a/services/web/frontend/js/shared/components/badge.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Label } from 'react-bootstrap'
-import classnames from 'classnames'
-import { MergeAndOverride } from '../../../../types/utils'
-
-type BadgeProps = MergeAndOverride<
-  React.ComponentProps<'span'>,
-  {
-    prepend?: React.ReactNode
-    children: React.ReactNode
-    className?: string
-    bsStyle?: React.ComponentProps<typeof Label>['bsStyle'] | null
-  }
->
-
-function Badge({ prepend, children, bsStyle, className, ...rest }: BadgeProps) {
-  const classNames =
-    bsStyle === null
-      ? className
-      : classnames('label', `label-${bsStyle}`, className)
-
-  return (
-    <span className={classNames} {...rest}>
-      {prepend && <span className="badge-tag-bs3-prepend">{prepend}</span>}
-      <span className="badge-tag-bs3-content">{children}</span>
-    </span>
-  )
-}
-
-export default Badge
diff --git a/services/web/frontend/js/shared/components/beta-badge-icon.tsx b/services/web/frontend/js/shared/components/beta-badge-icon.tsx
index 7e60253d5b..b331c90175 100644
--- a/services/web/frontend/js/shared/components/beta-badge-icon.tsx
+++ b/services/web/frontend/js/shared/components/beta-badge-icon.tsx
@@ -1,14 +1,11 @@
 import type { FC } from 'react'
-import classnames from 'classnames'
 import MaterialIcon from '@/shared/components/material-icon'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import OLBadge from '@/features/ui/components/ol/ol-badge'
 
-function BS5BetaBadgeIcon({
-  badgeClass,
-}: {
-  badgeClass: ReturnType<typeof chooseBadgeClass>
-}) {
+const BetaBadgeIcon: FC<{
+  phase?: string
+}> = ({ phase = 'beta' }) => {
+  const badgeClass = chooseBadgeClass(phase)
   if (badgeClass === 'info-badge') {
     return <MaterialIcon type="info" className="align-middle info-badge" />
   } else if (badgeClass === 'alpha-badge') {
@@ -18,26 +15,10 @@ function BS5BetaBadgeIcon({
       </OLBadge>
     )
   } else {
-    return (
-      <OLBadge bg="warning" className="beta-badge">
-        β
-      </OLBadge>
-    )
+    return <OLBadge bg="warning">β</OLBadge>
   }
 }
 
-const BetaBadgeIcon: FC<{
-  phase?: string
-}> = ({ phase = 'beta' }) => {
-  const badgeClass = chooseBadgeClass(phase)
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<span className={classnames('badge', badgeClass)} />}
-      bs5={<BS5BetaBadgeIcon badgeClass={badgeClass} />}
-    />
-  )
-}
-
 function chooseBadgeClass(phase?: string) {
   switch (phase) {
     case 'release':
diff --git a/services/web/frontend/js/shared/components/beta-badge.tsx b/services/web/frontend/js/shared/components/beta-badge.tsx
index 63a31be402..514ff10041 100644
--- a/services/web/frontend/js/shared/components/beta-badge.tsx
+++ b/services/web/frontend/js/shared/components/beta-badge.tsx
@@ -1,6 +1,5 @@
 import type { FC, MouseEventHandler, ReactNode } from 'react'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
-import { bsVersion } from '@/features/utils/bootstrap-5'
 import BetaBadgeIcon from '@/shared/components/beta-badge-icon'
 
 type TooltipProps = {
@@ -40,9 +39,7 @@ const BetaBadge: FC<{
       href={href || defaultHref}
       {...linkProps}
     >
-      <span className={bsVersion({ bs5: 'visually-hidden', bs3: 'sr-only' })}>
-        {description || tooltip?.text}
-      </span>
+      <span className="visually-hidden">{description || tooltip?.text}</span>
       <BetaBadgeIcon phase={phase} />
     </a>
   )
diff --git a/services/web/frontend/js/shared/components/close.tsx b/services/web/frontend/js/shared/components/close.tsx
index ecf2bf6e63..1cff45e930 100644
--- a/services/web/frontend/js/shared/components/close.tsx
+++ b/services/web/frontend/js/shared/components/close.tsx
@@ -1,6 +1,5 @@
 import { useTranslation } from 'react-i18next'
 import MaterialIcon from '@/shared/components/material-icon'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 
 type CloseProps = {
   onDismiss: React.MouseEventHandler<HTMLButtonElement>
@@ -13,20 +12,14 @@ function Close({ onDismiss, variant = 'light' }: CloseProps) {
   return (
     <button
       type="button"
-      className={`close pull-right ${variant}`}
+      className={`close float-end ${variant}`}
       onClick={onDismiss}
     >
-      <BootstrapVersionSwitcher
-        bs3={<span aria-hidden="true">&times;</span>}
-        bs5={
-          <MaterialIcon
-            type="close"
-            className="align-text-bottom"
-            accessibilityLabel={t('close')}
-          />
-        }
+      <MaterialIcon
+        type="close"
+        className="align-text-bottom"
+        accessibilityLabel={t('close')}
       />
-      <span className="sr-only">{t('close')}</span>
     </button>
   )
 }
diff --git a/services/web/frontend/js/shared/components/collapsible-file-header.tsx b/services/web/frontend/js/shared/components/collapsible-file-header.tsx
index efcd51a74f..b12239fd85 100644
--- a/services/web/frontend/js/shared/components/collapsible-file-header.tsx
+++ b/services/web/frontend/js/shared/components/collapsible-file-header.tsx
@@ -11,6 +11,7 @@ export const CollapsibleFileHeader: FC<{
     type="button"
     className="collapsible-file-header"
     onClick={toggleCollapsed}
+    translate="no"
   >
     <MaterialIcon
       type={collapsed ? 'keyboard_arrow_right' : 'keyboard_arrow_down'}
diff --git a/services/web/frontend/js/shared/components/controlled-dropdown.tsx b/services/web/frontend/js/shared/components/controlled-dropdown.tsx
deleted file mode 100644
index 04685124a9..0000000000
--- a/services/web/frontend/js/shared/components/controlled-dropdown.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import React, {
-  Children,
-  cloneElement,
-  type FC,
-  isValidElement,
-  useCallback,
-} from 'react'
-import { Dropdown, DropdownProps } from 'react-bootstrap'
-import useDropdown from '../hooks/use-dropdown'
-
-type ControlledDropdownProps = DropdownProps & {
-  defaultOpen?: boolean
-  onMainButtonClick?: (dropdownOpen: boolean) => void
-}
-
-const ControlledDropdown: FC<ControlledDropdownProps> = ({
-  defaultOpen,
-  onMainButtonClick,
-  ...props
-}) => {
-  const { onClick, ...dropdownProps } = useDropdown(Boolean(defaultOpen))
-
-  const handleClick = useCallback(
-    (e: React.MouseEvent<Dropdown, MouseEvent>) => {
-      onClick(e)
-
-      if (onMainButtonClick) {
-        onMainButtonClick(dropdownProps.open)
-      }
-    },
-    [onClick, onMainButtonClick, dropdownProps.open]
-  )
-
-  return (
-    <Dropdown {...props} {...dropdownProps} onClick={handleClick}>
-      {Children.map(props.children, child => {
-        if (!isValidElement(child)) {
-          return child
-        }
-
-        // Dropdown.Menu
-        if ('open' in child.props) {
-          return cloneElement<any>(child, { open: dropdownProps.open })
-        }
-
-        // Overlay
-        if ('show' in child.props) {
-          return cloneElement<any>(child, { show: dropdownProps.open })
-        }
-
-        // anything else
-        return cloneElement(child)
-      })}
-    </Dropdown>
-  )
-}
-
-export default ControlledDropdown
diff --git a/services/web/frontend/js/shared/components/cookie-banner.tsx b/services/web/frontend/js/shared/components/cookie-banner.tsx
new file mode 100644
index 0000000000..d057c7230f
--- /dev/null
+++ b/services/web/frontend/js/shared/components/cookie-banner.tsx
@@ -0,0 +1,58 @@
+import OLButton from '@/features/ui/components/ol/ol-button'
+import { Trans, useTranslation } from 'react-i18next'
+import React, { useState } from 'react'
+import {
+  CookieConsentValue,
+  cookieBannerRequired,
+  hasMadeCookieChoice,
+  setConsent,
+} from '@/features/cookie-banner/utils'
+
+function CookieBanner() {
+  const { t } = useTranslation()
+  const [hidden, setHidden] = useState(
+    () => !cookieBannerRequired() || hasMadeCookieChoice()
+  )
+
+  function makeCookieChoice(value: CookieConsentValue) {
+    setConsent(value)
+    setHidden(true)
+  }
+
+  if (hidden) {
+    return null
+  }
+
+  return (
+    <section
+      className="cookie-banner hidden-print"
+      aria-label={t('cookie_banner')}
+    >
+      <div className="cookie-banner-content">
+        <Trans
+          i18nKey="cookie_banner_info"
+          // eslint-disable-next-line react/jsx-key, jsx-a11y/anchor-has-content
+          components={[<a href="/legal#Cookies" />]}
+        />
+      </div>
+      <div className="cookie-banner-actions">
+        <OLButton
+          variant="link"
+          size="sm"
+          onClick={() => makeCookieChoice('essential')}
+        >
+          {t('essential_cookies_only')}
+        </OLButton>
+        <OLButton
+          variant="primary"
+          size="sm"
+          onClick={() => makeCookieChoice('all')}
+        >
+          {t('accept_all_cookies')}
+        </OLButton>
+      </div>
+    </section>
+  )
+}
+
+export default CookieBanner
diff --git a/services/web/frontend/js/shared/components/copy-to-clipboard.tsx b/services/web/frontend/js/shared/components/copy-to-clipboard.tsx
index 517d8ba9ff..e119e3b146 100644
--- a/services/web/frontend/js/shared/components/copy-to-clipboard.tsx
+++ b/services/web/frontend/js/shared/components/copy-to-clipboard.tsx
@@ -3,7 +3,6 @@ import { useTranslation } from 'react-i18next'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import OLIconButton from '@/features/ui/components/ol/ol-icon-button'
-import { bsVersion } from '@/features/utils/bootstrap-5'
 
 export const CopyToClipboard = memo<{
   content: string
@@ -39,7 +38,6 @@ export const CopyToClipboard = memo<{
           size="sm"
           variant="secondary"
           className="copy-button"
-          bs3Props={{ bsSize: 'xsmall' }}
         >
           {t('copy')}
         </OLButton>
@@ -50,11 +48,7 @@ export const CopyToClipboard = memo<{
           size="sm"
           accessibilityLabel={t('copy')}
           className="copy-button"
-          bs3Props={{ bsSize: 'xsmall' }}
-          icon={bsVersion({
-            bs5: copied ? 'check' : 'content_copy',
-            bs3: copied ? 'check' : 'clipboard',
-          })}
+          icon={copied ? 'check' : 'content_copy'}
         />
       )}
     </OLTooltip>
diff --git a/services/web/frontend/js/shared/components/error-boundary-fallback.tsx b/services/web/frontend/js/shared/components/error-boundary-fallback.tsx
index d3e73b2da7..58d90a1aaf 100644
--- a/services/web/frontend/js/shared/components/error-boundary-fallback.tsx
+++ b/services/web/frontend/js/shared/components/error-boundary-fallback.tsx
@@ -2,10 +2,9 @@ import { FC, ReactNode } from 'react'
 import { DefaultMessage } from './default-message'
 import OLNotification from '@/features/ui/components/ol/ol-notification'
 
-export const ErrorBoundaryFallback: FC<{ modal?: ReactNode }> = ({
-  children,
-  modal,
-}) => {
+export const ErrorBoundaryFallback: FC<
+  React.PropsWithChildren<{ modal?: ReactNode }>
+> = ({ children, modal }) => {
   return (
     <div className="error-boundary-alert">
       <OLNotification type="error" content={children || <DefaultMessage />} />
diff --git a/services/web/frontend/js/shared/components/generic-error-boundary-fallback.tsx b/services/web/frontend/js/shared/components/generic-error-boundary-fallback.tsx
index ecac2fad06..fe3d87a464 100644
--- a/services/web/frontend/js/shared/components/generic-error-boundary-fallback.tsx
+++ b/services/web/frontend/js/shared/components/generic-error-boundary-fallback.tsx
@@ -1,37 +1,24 @@
 import { FC } from 'react'
 import { useTranslation } from 'react-i18next'
-import Icon from './icon'
 import { useLocation } from '../hooks/use-location'
 import { DefaultMessage } from './default-message'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import MaterialIcon from './material-icon'
 import OLButton from '@/features/ui/components/ol/ol-button'
 
-export const GenericErrorBoundaryFallback: FC = ({ children }) => {
+export const GenericErrorBoundaryFallback: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { t } = useTranslation()
   const { reload: handleClick } = useLocation()
 
   return (
     <div className="error-boundary-container">
-      <BootstrapVersionSwitcher
-        bs3={
-          <Icon
-            accessibilityLabel={`${t('generic_something_went_wrong')} ${t(
-              'please_refresh'
-            )}`}
-            type="exclamation-triangle fa-2x"
-            fw
-          />
-        }
-        bs5={
-          <MaterialIcon
-            accessibilityLabel={`${t('generic_something_went_wrong')} ${t(
-              'please_refresh'
-            )}`}
-            type="warning"
-            size="2x"
-          />
-        }
+      <MaterialIcon
+        accessibilityLabel={`${t('generic_something_went_wrong')} ${t(
+          'please_refresh'
+        )}`}
+        type="warning"
+        size="2x"
       />
       {children || (
         <div className="error-message">
diff --git a/services/web/frontend/js/shared/components/icon-checked.jsx b/services/web/frontend/js/shared/components/icon-checked.jsx
deleted file mode 100644
index 0409327910..0000000000
--- a/services/web/frontend/js/shared/components/icon-checked.jsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { useTranslation } from 'react-i18next'
-
-import Icon from './icon'
-
-function IconChecked() {
-  const { t } = useTranslation()
-  return <Icon type="check" fw accessibilityLabel={t('selected')} />
-}
-
-export default IconChecked
diff --git a/services/web/frontend/js/shared/components/icon.tsx b/services/web/frontend/js/shared/components/icon.tsx
deleted file mode 100644
index 49679efcfe..0000000000
--- a/services/web/frontend/js/shared/components/icon.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import classNames from 'classnames'
-import { bsVersion } from '@/features/utils/bootstrap-5'
-
-type IconOwnProps = {
-  type: string
-  spin?: boolean
-  fw?: boolean
-  modifier?: string
-  accessibilityLabel?: string
-}
-
-export type IconProps = IconOwnProps &
-  Omit<React.ComponentProps<'i'>, keyof IconOwnProps>
-
-function Icon({
-  type,
-  spin,
-  fw,
-  modifier,
-  className = '',
-  accessibilityLabel,
-  ...rest
-}: IconProps) {
-  const iconClassName = classNames(
-    'fa',
-    `fa-${type}`,
-    {
-      'fa-spin': spin,
-      'fa-fw': fw,
-      [`fa-${modifier}`]: modifier,
-    },
-    className
-  )
-
-  return (
-    <>
-      <i className={iconClassName} aria-hidden="true" {...rest} />
-      {accessibilityLabel && (
-        <span className={bsVersion({ bs5: 'visually-hidden', bs3: 'sr-only' })}>
-          {accessibilityLabel}
-        </span>
-      )}
-    </>
-  )
-}
-
-export default Icon
diff --git a/services/web/frontend/js/shared/components/interstitial.tsx b/services/web/frontend/js/shared/components/interstitial.tsx
index da3386ba2e..523bcf4609 100644
--- a/services/web/frontend/js/shared/components/interstitial.tsx
+++ b/services/web/frontend/js/shared/components/interstitial.tsx
@@ -1,5 +1,5 @@
 import classNames from 'classnames'
-import overleafLogo from '@/shared/svgs/overleaf.svg'
+import overleafLogo from '@/shared/svgs/overleaf-green.svg'
 
 type InterstitialProps = {
   className?: string
diff --git a/services/web/frontend/js/shared/components/labs/labs-experiments-widget.tsx b/services/web/frontend/js/shared/components/labs/labs-experiments-widget.tsx
index cb53bdc984..596749770e 100644
--- a/services/web/frontend/js/shared/components/labs/labs-experiments-widget.tsx
+++ b/services/web/frontend/js/shared/components/labs/labs-experiments-widget.tsx
@@ -5,7 +5,6 @@ import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { postJSON } from '@/infrastructure/fetch-json'
 import OLButton from '@/features/ui/components/ol/ol-button'
 import getMeta from '@/utils/meta'
-import { isBootstrap5 } from '@/features/utils/bootstrap-5'
 
 type IntegrationLinkingWidgetProps = {
   logo: ReactNode
@@ -117,17 +116,14 @@ function ActionButton({
       </OLButton>
     )
   } else if (disabled) {
-    const tooltipableButton = isBootstrap5() ? (
+    const tooltipableButton = (
       <div className="d-inline-block">
         <OLButton variant="primary" disabled>
           {t('turn_on')}
         </OLButton>
       </div>
-    ) : (
-      <OLButton variant="primary" disabled>
-        {t('turn_on')}
-      </OLButton>
     )
+
     return (
       <OLTooltip
         id="experiment-disabled"
diff --git a/services/web/frontend/js/shared/components/loading-spinner.tsx b/services/web/frontend/js/shared/components/loading-spinner.tsx
index 5a0a81a8c9..7d94f41567 100644
--- a/services/web/frontend/js/shared/components/loading-spinner.tsx
+++ b/services/web/frontend/js/shared/components/loading-spinner.tsx
@@ -3,7 +3,6 @@ import { useEffect, useState } from 'react'
 import OLSpinner, {
   OLSpinnerSize,
 } from '@/features/ui/components/ol/ol-spinner'
-import { isBootstrap5 } from '@/features/utils/bootstrap-5'
 import classNames from 'classnames'
 
 function LoadingSpinner({
@@ -43,12 +42,14 @@ function LoadingSpinner({
     return null
   }
 
-  const extraClasses = isBootstrap5()
-    ? [align === 'left' ? 'align-items-start' : 'align-items-center']
-    : null
-
   return (
-    <div className={classNames('loading', className, extraClasses)}>
+    <div
+      className={classNames(
+        'loading',
+        className,
+        align === 'left' ? 'align-items-start' : 'align-items-center'
+      )}
+    >
       <OLSpinner size={size} />
       &nbsp;
       {loadingText || `${t('loading')}…`}
diff --git a/services/web/frontend/js/shared/components/material-icon.tsx b/services/web/frontend/js/shared/components/material-icon.tsx
index 3f5a499853..be351d16bb 100644
--- a/services/web/frontend/js/shared/components/material-icon.tsx
+++ b/services/web/frontend/js/shared/components/material-icon.tsx
@@ -1,6 +1,5 @@
 import classNames from 'classnames'
 import React from 'react'
-import { bsVersion } from '@/features/utils/bootstrap-5'
 import unfilledIconTypes from '../../../fonts/material-symbols/unfilled-symbols.mjs'
 
 export type AvailableUnfilledIcon = (typeof unfilledIconTypes)[number]
@@ -39,13 +38,16 @@ function MaterialIcon({
 
   return (
     <>
-      <span className={iconClassName} aria-hidden="true" {...rest}>
+      <span
+        className={iconClassName}
+        aria-hidden="true"
+        translate="no"
+        {...rest}
+      >
         {type}
       </span>
       {accessibilityLabel && (
-        <span className={bsVersion({ bs5: 'visually-hidden', bs3: 'sr-only' })}>
-          {accessibilityLabel}
-        </span>
+        <span className="visually-hidden">{accessibilityLabel}</span>
       )}
     </>
   )
diff --git a/services/web/frontend/js/shared/components/menu-bar/menu-bar-dropdown.tsx b/services/web/frontend/js/shared/components/menu-bar/menu-bar-dropdown.tsx
index b69c838f83..bbdd117b23 100644
--- a/services/web/frontend/js/shared/components/menu-bar/menu-bar-dropdown.tsx
+++ b/services/web/frontend/js/shared/components/menu-bar/menu-bar-dropdown.tsx
@@ -7,7 +7,7 @@ import { FC, forwardRef, useCallback } from 'react'
 import classNames from 'classnames'
 import { useNestableDropdown } from '@/shared/hooks/use-nestable-dropdown'
 import { NestableDropdownContextProvider } from '@/shared/context/nestable-dropdown-context'
-import { AnchorProps } from 'react-bootstrap-5'
+import { AnchorProps } from 'react-bootstrap'
 import MaterialIcon from '../material-icon'
 import { DropdownMenuProps } from '@/features/ui/components/types/dropdown-menu-props'
 
@@ -18,17 +18,13 @@ type MenuBarDropdownProps = {
   align?: 'start' | 'end'
 }
 
-export const MenuBarDropdown: FC<MenuBarDropdownProps> = ({
-  title,
-  children,
-  id,
-  className,
-  align = 'start',
-}) => {
+export const MenuBarDropdown: FC<
+  React.PropsWithChildren<MenuBarDropdownProps>
+> = ({ title, children, id, className, align = 'start' }) => {
   const { menuId, selected, setSelected } = useNestableDropdown()
 
   const onToggle = useCallback(
-    show => {
+    (show: boolean) => {
       setSelected(show ? id : null)
     },
     [id, setSelected]
@@ -65,11 +61,9 @@ export const MenuBarDropdown: FC<MenuBarDropdownProps> = ({
   )
 }
 
-const NestableDropdownMenu: FC<DropdownMenuProps & { id: string }> = ({
-  children,
-  id,
-  ...props
-}) => {
+const NestableDropdownMenu: FC<
+  React.PropsWithChildren<DropdownMenuProps & { id: string }>
+> = ({ children, id, ...props }) => {
   return (
     <DropdownMenu {...props}>
       <NestableDropdownContextProvider id={id}>
@@ -79,43 +73,42 @@ const NestableDropdownMenu: FC<DropdownMenuProps & { id: string }> = ({
   )
 }
 
-const NestedDropdownToggle: FC = forwardRef<HTMLAnchorElement, AnchorProps>(
-  function NestedDropdownToggle(
-    { children, className, onMouseEnter, id },
-    ref
-  ) {
-    return (
-      // eslint-disable-next-line jsx-a11y/anchor-is-valid
-      <a
-        id={id}
-        href="#"
-        ref={ref}
-        onMouseEnter={onMouseEnter}
-        onClick={onMouseEnter}
-        className={classNames(
-          className,
-          'nested-dropdown-toggle',
-          'dropdown-item'
-        )}
-      >
-        {children}
-        <MaterialIcon type="chevron_right" />
-      </a>
-    )
-  }
-)
+const NestedDropdownToggle: FC<React.PropsWithChildren> = forwardRef<
+  HTMLAnchorElement,
+  AnchorProps
+>(function NestedDropdownToggle(
+  { children, className, onMouseEnter, id },
+  ref
+) {
+  return (
+    // eslint-disable-next-line jsx-a11y/anchor-is-valid
+    <a
+      id={id}
+      href="#"
+      ref={ref}
+      onMouseEnter={onMouseEnter}
+      onClick={onMouseEnter}
+      className={classNames(
+        className,
+        'nested-dropdown-toggle',
+        'dropdown-item'
+      )}
+    >
+      {children}
+      <MaterialIcon type="chevron_right" />
+    </a>
+  )
+})
 
-export const NestedMenuBarDropdown: FC<{ id: string; title: string }> = ({
-  children,
-  id,
-  title,
-}) => {
+export const NestedMenuBarDropdown: FC<
+  React.PropsWithChildren<{ id: string; title: string }>
+> = ({ children, id, title }) => {
   const { menuId, selected, setSelected } = useNestableDropdown()
   const select = useCallback(() => {
     setSelected(id)
   }, [id, setSelected])
   const onToggle = useCallback(
-    show => {
+    (show: boolean) => {
       setSelected(show ? id : null)
     },
     [setSelected, id]
diff --git a/services/web/frontend/js/shared/components/menu-bar/menu-bar-option.tsx b/services/web/frontend/js/shared/components/menu-bar/menu-bar-option.tsx
index 20cca2135b..eccb812563 100644
--- a/services/web/frontend/js/shared/components/menu-bar/menu-bar-option.tsx
+++ b/services/web/frontend/js/shared/components/menu-bar/menu-bar-option.tsx
@@ -1,29 +1,54 @@
 import DropdownListItem from '@/features/ui/components/bootstrap-5/dropdown-list-item'
 import { DropdownItem } from '@/features/ui/components/bootstrap-5/dropdown-menu'
+import { useEditorAnalytics } from '@/shared/hooks/use-editor-analytics'
 import { useNestableDropdown } from '@/shared/hooks/use-nestable-dropdown'
-import { MouseEventHandler, ReactNode } from 'react'
+import { MouseEventHandler, ReactNode, useCallback } from 'react'
 
 type MenuBarOptionProps = {
   title: string
   onClick?: MouseEventHandler
   disabled?: boolean
+  leadingIcon?: ReactNode
   trailingIcon?: ReactNode
+  href?: string
+  target?: string
+  rel?: string
+  eventKey?: string
 }
 
 export const MenuBarOption = ({
   title,
-  onClick,
+  onClick: clickHandler,
+  href,
   disabled,
+  leadingIcon,
   trailingIcon,
+  target,
+  rel,
+  eventKey,
 }: MenuBarOptionProps) => {
   const { setSelected } = useNestableDropdown()
+  const { sendEvent } = useEditorAnalytics()
+  const onClick: MouseEventHandler = useCallback(
+    e => {
+      if (eventKey) {
+        sendEvent('menu-bar-option-click', { key: eventKey })
+      }
+      return clickHandler?.(e)
+    },
+    [clickHandler, eventKey, sendEvent]
+  )
   return (
     <DropdownListItem>
       <DropdownItem
         onMouseEnter={() => setSelected(null)}
         onClick={onClick}
         disabled={disabled}
+        leadingIcon={leadingIcon}
         trailingIcon={trailingIcon}
+        href={href}
+        rel={rel}
+        target={target}
       >
         {title}
       </DropdownItem>
diff --git a/services/web/frontend/js/shared/components/menu-bar/menu-bar.tsx b/services/web/frontend/js/shared/components/menu-bar/menu-bar.tsx
index 4236bfa5e8..a05fb4eff8 100644
--- a/services/web/frontend/js/shared/components/menu-bar/menu-bar.tsx
+++ b/services/web/frontend/js/shared/components/menu-bar/menu-bar.tsx
@@ -1,11 +1,9 @@
 import { NestableDropdownContextProvider } from '@/shared/context/nestable-dropdown-context'
 import { FC, HTMLProps } from 'react'
 
-export const MenuBar: FC<HTMLProps<HTMLDivElement> & { id: string }> = ({
-  children,
-  id,
-  ...props
-}) => {
+export const MenuBar: FC<
+  React.PropsWithChildren<HTMLProps<HTMLDivElement> & { id: string }>
+> = ({ children, id, ...props }) => {
   return (
     <div {...props}>
       <NestableDropdownContextProvider id={id}>
diff --git a/services/web/frontend/js/shared/components/notification.tsx b/services/web/frontend/js/shared/components/notification.tsx
index e4be7d5cab..2ebda05298 100644
--- a/services/web/frontend/js/shared/components/notification.tsx
+++ b/services/web/frontend/js/shared/components/notification.tsx
@@ -18,6 +18,7 @@ export type NotificationProps = {
   className?: string
   content: React.ReactNode
   customIcon?: React.ReactElement | null
+  iconPlacement?: 'top' | 'center'
   disclaimer?: React.ReactElement | string
   isDismissible?: boolean
   isActionBelowContent?: boolean
@@ -30,9 +31,11 @@ export type NotificationProps = {
 export function NotificationIcon({
   notificationType,
   customIcon,
+  iconPlacement,
 }: {
   notificationType: NotificationType
   customIcon?: ReactElement
+  iconPlacement?: 'top' | 'center'
 }) {
   let icon = <MaterialIcon type="info" />
 
@@ -47,7 +50,16 @@ export function NotificationIcon({
   } else if (notificationType === 'offer') {
     icon = <MaterialIcon type="campaign" />
   }
-  return <div className="notification-icon">{icon}</div>
+  return (
+    <div
+      className={classNames(
+        'notification-icon',
+        iconPlacement ? `notification-icon-${iconPlacement}` : ''
+      )}
+    >
+      {icon}
+    </div>
+  )
 }
 
 function Notification({
@@ -56,6 +68,7 @@ function Notification({
   className = '',
   content,
   customIcon,
+  iconPlacement = 'top',
   disclaimer,
   isActionBelowContent,
   isDismissible,
@@ -94,7 +107,11 @@ function Notification({
       id={id}
     >
       {customIcon !== null && (
-        <NotificationIcon notificationType={type} customIcon={customIcon} />
+        <NotificationIcon
+          notificationType={type}
+          customIcon={customIcon}
+          iconPlacement={iconPlacement}
+        />
       )}
 
       <div className="notification-content-and-cta">
diff --git a/services/web/frontend/js/shared/components/panel-heading.tsx b/services/web/frontend/js/shared/components/panel-heading.tsx
index bdec33779a..08952a5fd1 100644
--- a/services/web/frontend/js/shared/components/panel-heading.tsx
+++ b/services/web/frontend/js/shared/components/panel-heading.tsx
@@ -2,13 +2,16 @@ import { FC } from 'react'
 import SplitTestBadge from '@/shared/components/split-test-badge'
 import MaterialIcon from '@/shared/components/material-icon'
 import { useTranslation } from 'react-i18next'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 
-export const PanelHeading: FC<{
-  title: string
-  splitTestName?: string
-  children?: React.ReactNode
-  handleClose(): void
-}> = ({ title, splitTestName, children, handleClose }) => {
+export const PanelHeading: FC<
+  React.PropsWithChildren<{
+    title: string
+    splitTestName?: string
+    children?: React.ReactNode
+    handleClose(): void
+  }>
+> = ({ title, splitTestName, children, handleClose }) => {
   const { t } = useTranslation()
 
   return (
@@ -24,15 +27,20 @@ export const PanelHeading: FC<{
       </div>
 
       {children}
-
-      <button
-        type="button"
-        className="btn panel-heading-close-button"
-        aria-label={t('close')}
-        onClick={handleClose}
+      <OLTooltip
+        id="close-panel"
+        description={t('close')}
+        overlayProps={{ placement: 'bottom' }}
       >
-        <MaterialIcon type="close" />
-      </button>
+        <button
+          type="button"
+          className="btn panel-heading-close-button"
+          aria-label={t('close')}
+          onClick={handleClose}
+        >
+          <MaterialIcon type="close" />
+        </button>
+      </OLTooltip>
     </div>
   )
 }
diff --git a/services/web/frontend/js/shared/components/processing.jsx b/services/web/frontend/js/shared/components/processing.jsx
deleted file mode 100644
index 6580ff2d5d..0000000000
--- a/services/web/frontend/js/shared/components/processing.jsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import PropTypes from 'prop-types'
-import { useTranslation } from 'react-i18next'
-import Icon from './icon'
-
-function Processing({ isProcessing }) {
-  const { t } = useTranslation()
-  if (isProcessing) {
-    return (
-      <div aria-live="polite">
-        {t('processing')}…&nbsp;
-        <Icon type="refresh" fw spin />
-      </div>
-    )
-  } else {
-    return <></>
-  }
-}
-
-Processing.propTypes = {
-  isProcessing: PropTypes.bool.isRequired,
-}
-
-export default Processing
diff --git a/services/web/frontend/js/shared/components/select.tsx b/services/web/frontend/js/shared/components/select.tsx
index 66b360480f..667983c4bd 100644
--- a/services/web/frontend/js/shared/components/select.tsx
+++ b/services/web/frontend/js/shared/components/select.tsx
@@ -1,5 +1,3 @@
-/* eslint-disable jsx-a11y/label-has-for */
-/* eslint-disable jsx-a11y/label-has-associated-control */
 import {
   useRef,
   useEffect,
@@ -10,10 +8,8 @@ import {
 } from 'react'
 import classNames from 'classnames'
 import { useSelect } from 'downshift'
-import Icon from './icon'
 import { useTranslation } from 'react-i18next'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
-import { Form, Spinner } from 'react-bootstrap-5'
+import { Form, Spinner } from 'react-bootstrap'
 import FormControl from '@/features/ui/components/bootstrap-5/form/form-control'
 import MaterialIcon from '@/shared/components/material-icon'
 import { DropdownItem } from '@/features/ui/components/bootstrap-5/dropdown-menu'
@@ -91,6 +87,7 @@ export const Select = <T,>({
   } = useSelect({
     items: items ?? [],
     itemToString,
+    isItemDisabled: item => itemToDisabled?.(item) || false,
     selectedItem: selected || defaultItem,
     onSelectedItemChange: changes => {
       if (onSelectedItemChanged) {
@@ -126,22 +123,18 @@ export const Select = <T,>({
     }
   }, [name, itemToString, selectedItem, defaultItem])
 
-  const handleMenuKeyDown = (event: React.KeyboardEvent<HTMLUListElement>) => {
-    if (event.key === 'Escape' && isOpen) {
-      event.stopPropagation()
-      closeMenu()
-    }
-  }
-
-  const onKeyDown: KeyboardEventHandler<HTMLButtonElement> = useCallback(
+  const onKeyDown: KeyboardEventHandler<HTMLInputElement> = useCallback(
     event => {
       if ((event.key === 'Enter' || event.key === ' ') && !isOpen) {
         event.preventDefault()
         ;(event.nativeEvent as any).preventDownshiftDefault = true
         openMenu()
+      } else if (event.key === 'Escape' && isOpen) {
+        event.stopPropagation()
+        closeMenu()
       }
     },
-    [isOpen, openMenu]
+    [closeMenu, isOpen, openMenu]
   )
 
   let value: string | undefined
@@ -150,150 +143,80 @@ export const Select = <T,>({
   } else {
     value = defaultText
   }
-  return (
-    <BootstrapVersionSwitcher
-      bs3={
-        <div className="select-wrapper" ref={rootRef}>
-          <div>
-            {label ? (
-              <label {...getLabelProps()}>
-                {label}{' '}
-                {optionalLabel && (
-                  <span className="select-optional-label text-muted">
-                    ({t('optional')})
-                  </span>
-                )}{' '}
-                {loading && (
-                  <Icon data-testid="spinner" fw type="spinner" spin />
-                )}
-              </label>
-            ) : null}
-            <div
-              className={classNames({ disabled }, 'select-trigger')}
-              // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-              tabIndex={0}
-              {...getToggleButtonProps({
-                disabled,
-                onKeyDown,
-              })}
-            >
-              <div>{value}</div>
-              <div>
-                {isOpen ? (
-                  <Icon type="chevron-up" fw />
-                ) : (
-                  <Icon type="chevron-down" fw />
-                )}
-              </div>
-            </div>
-          </div>
-          <ul
-            className={classNames({ hidden: !isOpen }, 'select-items')}
-            {...getMenuProps({ disabled, onKeyDown: handleMenuKeyDown })}
-          >
-            {isOpen &&
-              items?.map((item, index) => {
-                const isDisabled = itemToDisabled && itemToDisabled(item)
-                return (
-                  <li
-                    className={classNames({
-                      'select-highlighted': highlightedIndex === index,
-                      'selected-active': selectedItem === item,
-                      'select-icon': selectedIcon,
-                      'select-disabled': isDisabled,
-                    })}
-                    key={itemToKey(item)}
-                    {...getItemProps({ item, index, disabled: isDisabled })}
-                  >
-                    <span className="select-item-title">
-                      {selectedIcon && (
-                        <div className="select-item-icon">
-                          {(selectedItem === item ||
-                            (!selectedItem && defaultItem === item)) && (
-                            <Icon type="check" fw />
-                          )}
-                        </div>
-                      )}
-                      {itemToString(item)}
-                    </span>
 
-                    {itemToSubtitle ? (
-                      <span className="text-muted select-item-subtitle">
-                        {itemToSubtitle(item)}
-                      </span>
-                    ) : null}
-                  </li>
-                )
-              })}
-          </ul>
-        </div>
-      }
-      bs5={
-        <div className="select-wrapper" ref={rootRef}>
-          {label ? (
-            <Form.Label {...getLabelProps()}>
-              {label}{' '}
-              {optionalLabel && (
-                <span className="fw-normal">({t('optional')})</span>
-              )}{' '}
-              {loading && (
-                <span data-testid="spinner">
-                  <Spinner
-                    animation="border"
-                    aria-hidden="true"
-                    as="span"
-                    role="status"
-                    size="sm"
-                  />
-                </span>
-              )}
-            </Form.Label>
-          ) : null}
-          <FormControl
-            data-testid={dataTestId}
-            {...getToggleButtonProps({
-              disabled,
-              onKeyDown,
-              className: 'select-trigger',
-            })}
-            value={value}
-            readOnly
-            append={
-              <MaterialIcon
-                type={isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}
-                className="align-text-bottom"
+  return (
+    <div className="select-wrapper" ref={rootRef}>
+      {label ? (
+        <Form.Label {...getLabelProps()}>
+          {label}{' '}
+          {optionalLabel && (
+            <span className="fw-normal">({t('optional')})</span>
+          )}{' '}
+          {loading && (
+            <span data-testid="spinner">
+              <Spinner
+                animation="border"
+                aria-hidden="true"
+                as="span"
+                role="status"
+                size="sm"
               />
-            }
+            </span>
+          )}
+        </Form.Label>
+      ) : null}
+      <FormControl
+        data-testid={dataTestId}
+        {...getToggleButtonProps({
+          disabled,
+          onKeyDown,
+          className: 'select-trigger',
+        })}
+        value={value}
+        readOnly
+        append={
+          <MaterialIcon
+            type={isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}
+            className="align-text-bottom"
           />
-          <ul
-            {...getMenuProps({ disabled, onKeyDown: handleMenuKeyDown })}
-            className={classNames('dropdown-menu w-100', { show: isOpen })}
-          >
-            {isOpen &&
-              items?.map((item, index) => {
-                const isDisabled = itemToDisabled && itemToDisabled(item)
-                return (
-                  <li role="none" key={itemToKey(item)}>
-                    <DropdownItem
-                      as="button"
-                      className={classNames({
-                        'select-highlighted': highlightedIndex === index,
-                      })}
-                      active={selectedItem === item}
-                      trailingIcon={selectedItem === item ? 'check' : undefined}
-                      description={
-                        itemToSubtitle ? itemToSubtitle(item) : undefined
-                      }
-                      {...getItemProps({ item, index, disabled: isDisabled })}
-                    >
-                      {itemToString(item)}
-                    </DropdownItem>
-                  </li>
-                )
-              })}
-          </ul>
-        </div>
-      }
-    />
+        }
+      />
+      <ul
+        {...getMenuProps({ disabled })}
+        className={classNames('dropdown-menu w-100', { show: isOpen })}
+      >
+        {isOpen &&
+          items?.map((item, index) => {
+            // We're using an actual disabled button so we don't need the
+            // aria-disabled prop
+            const { 'aria-disabled': disabled, ...itemProps } = getItemProps({
+              item,
+              index,
+            })
+            return (
+              <li role="none" key={itemToKey(item)}>
+                <DropdownItem
+                  as="button"
+                  type="button"
+                  className={classNames({
+                    'select-highlighted': highlightedIndex === index,
+                  })}
+                  active={selectedItem === item}
+                  trailingIcon={
+                    selectedIcon && selectedItem === item ? 'check' : undefined
+                  }
+                  description={
+                    itemToSubtitle ? itemToSubtitle(item) : undefined
+                  }
+                  {...itemProps}
+                  disabled={disabled}
+                >
+                  {itemToString(item)}
+                </DropdownItem>
+              </li>
+            )
+          })}
+      </ul>
+    </div>
   )
 }
diff --git a/services/web/frontend/js/shared/components/start-free-trial-button.tsx b/services/web/frontend/js/shared/components/start-free-trial-button.tsx
index 3389ebd2af..3a5d7bf467 100644
--- a/services/web/frontend/js/shared/components/start-free-trial-button.tsx
+++ b/services/web/frontend/js/shared/components/start-free-trial-button.tsx
@@ -1,4 +1,4 @@
-import { MouseEventHandler, useCallback, useEffect } from 'react'
+import { useCallback, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import { startFreeTrial } from '@/main/account-upgrade'
 import * as eventTracking from '../../infrastructure/event-tracking'
@@ -9,7 +9,8 @@ type StartFreeTrialButtonProps = {
   variant?: string
   buttonProps?: React.ComponentProps<typeof OLButton>
   children?: React.ReactNode
-  handleClick?: MouseEventHandler<typeof OLButton>
+  handleClick?: React.ComponentProps<typeof OLButton>['onClick']
+  segmentation?: eventTracking.Segmentation
 }
 
 export default function StartFreeTrialButton({
@@ -20,30 +21,32 @@ export default function StartFreeTrialButton({
   handleClick,
   source,
   variant,
+  segmentation,
 }: StartFreeTrialButtonProps) {
   const { t } = useTranslation()
 
   useEffect(() => {
     const eventSegmentation: { [key: string]: unknown } = {
       'paywall-type': source,
+      ...segmentation,
     }
     if (variant) {
       eventSegmentation.variant = variant
     }
     eventTracking.sendMB('paywall-prompt', eventSegmentation)
-  }, [source, variant])
+  }, [source, variant, segmentation])
 
   const onClick = useCallback(
-    event => {
+    (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
       event.preventDefault()
 
       if (handleClick) {
         handleClick(event)
       }
 
-      startFreeTrial(source, variant)
+      startFreeTrial(source, variant, segmentation)
     },
-    [handleClick, source, variant]
+    [handleClick, source, variant, segmentation]
   )
 
   return (
diff --git a/services/web/frontend/js/shared/components/switch.tsx b/services/web/frontend/js/shared/components/switch.tsx
index 1b21600dc8..44157b8143 100644
--- a/services/web/frontend/js/shared/components/switch.tsx
+++ b/services/web/frontend/js/shared/components/switch.tsx
@@ -8,6 +8,7 @@ type SwitchProps = {
 
 function Switch({ onChange, checked, disabled = false }: SwitchProps) {
   return (
+    // eslint-disable-next-line jsx-a11y/label-has-associated-control
     <label className={classNames('switch-input', { disabled })}>
       <input
         className="invisible-input"
diff --git a/services/web/frontend/js/shared/components/tag.tsx b/services/web/frontend/js/shared/components/tag.tsx
deleted file mode 100644
index e704936d0e..0000000000
--- a/services/web/frontend/js/shared/components/tag.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import { useTranslation } from 'react-i18next'
-import { Label } from 'react-bootstrap'
-import { MergeAndOverride } from '../../../../types/utils'
-import classnames from 'classnames'
-
-type TagProps = MergeAndOverride<
-  React.ComponentProps<'span'>,
-  {
-    prepend?: React.ReactNode
-    children: React.ReactNode
-    contentProps?: React.ComponentProps<'button'>
-    closeBtnProps?: React.ComponentProps<'button'>
-    className?: string
-    bsStyle?: React.ComponentProps<typeof Label>['bsStyle'] | null
-  }
->
-
-function Tag({
-  prepend,
-  children,
-  contentProps,
-  closeBtnProps,
-  bsStyle,
-  className,
-  ...rest
-}: TagProps) {
-  const { t } = useTranslation()
-
-  return (
-    <span className={classnames('badge-tag-bs3', className)} {...rest}>
-      <span
-        {...contentProps}
-        className={classnames(
-          'badge-tag-bs3-content-wrapper',
-          { clickable: Boolean(contentProps?.onClick) },
-          contentProps?.className
-        )}
-      >
-        {prepend && <span className="badge-tag-bs3-prepend">{prepend}</span>}
-        <span className="badge-tag-bs3-content">{children}</span>
-      </span>
-      {closeBtnProps && (
-        <button
-          type="button"
-          className="badge-tag-bs3-close"
-          aria-label={t('remove_tag', { tagName: children })}
-          {...closeBtnProps}
-        >
-          <span aria-hidden="true">&times;</span>
-        </button>
-      )}
-    </span>
-  )
-}
-
-export default Tag
diff --git a/services/web/frontend/js/shared/components/tooltip.tsx b/services/web/frontend/js/shared/components/tooltip.tsx
deleted file mode 100644
index b86e963c8b..0000000000
--- a/services/web/frontend/js/shared/components/tooltip.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { cloneElement } from 'react'
-import {
-  OverlayTrigger,
-  OverlayTriggerProps,
-  Tooltip as BSTooltip,
-} from 'react-bootstrap'
-import { callFnsInSequence } from '../../utils/functions'
-
-type OverlayProps = Omit<OverlayTriggerProps, 'overlay'> & {
-  shouldUpdatePosition?: boolean // Not officially documented https://stackoverflow.com/a/43138470
-}
-
-export type TooltipProps = {
-  description: React.ReactNode
-  id: string
-  overlayProps?: OverlayProps
-  tooltipProps?: BSTooltip.TooltipProps
-  hidden?: boolean
-  children: React.ReactElement
-}
-
-function Tooltip({
-  id,
-  description,
-  children,
-  tooltipProps,
-  overlayProps,
-  hidden,
-}: TooltipProps) {
-  const hideTooltip = (e: React.MouseEvent) => {
-    if (e.currentTarget instanceof HTMLElement) {
-      e.currentTarget.blur()
-    }
-  }
-
-  return (
-    <OverlayTrigger
-      overlay={
-        <BSTooltip
-          id={`${id}-tooltip`}
-          {...tooltipProps}
-          style={{ display: hidden ? 'none' : 'block' }}
-        >
-          {description}
-        </BSTooltip>
-      }
-      {...overlayProps}
-      placement={overlayProps?.placement || 'top'}
-    >
-      {cloneElement(children, {
-        onClick: callFnsInSequence(children.props.onClick, hideTooltip),
-      })}
-    </OverlayTrigger>
-  )
-}
-
-export default Tooltip
diff --git a/services/web/frontend/js/shared/components/upgrade-benefits.jsx b/services/web/frontend/js/shared/components/upgrade-benefits.tsx
similarity index 65%
rename from services/web/frontend/js/shared/components/upgrade-benefits.jsx
rename to services/web/frontend/js/shared/components/upgrade-benefits.tsx
index 4f8001f7c8..9ab3d01e86 100644
--- a/services/web/frontend/js/shared/components/upgrade-benefits.jsx
+++ b/services/web/frontend/js/shared/components/upgrade-benefits.tsx
@@ -1,23 +1,17 @@
-import Icon from './icon'
 import MaterialIcon from '@/shared/components/material-icon'
-import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
 import { useTranslation } from 'react-i18next'
 import { memo } from 'react'
+import classNames from 'classnames'
 
 function Check() {
-  return (
-    <BootstrapVersionSwitcher
-      bs3={<Icon type="check" />}
-      bs5={<MaterialIcon type="check" />}
-    />
-  )
+  return <MaterialIcon type="check" />
 }
 
-function UpgradeBenefits() {
+function UpgradeBenefits({ className }: { className?: string }) {
   const { t } = useTranslation()
 
   return (
-    <ul className="list-unstyled upgrade-benefits">
+    <ul className={classNames('list-unstyled upgrade-benefits', className)}>
       <li>
         <Check />
         &nbsp;
@@ -26,7 +20,7 @@ function UpgradeBenefits() {
       <li>
         <Check />
         &nbsp;
-        {t('collabs_per_proj', { collabcount: 'Multiple' })}
+        {t('collabs_per_proj_multiple')}
       </li>
       <li>
         <Check />
diff --git a/services/web/frontend/js/shared/components/upgrade-prompt.tsx b/services/web/frontend/js/shared/components/upgrade-prompt.tsx
index 336d9c4344..8f556a182c 100644
--- a/services/web/frontend/js/shared/components/upgrade-prompt.tsx
+++ b/services/web/frontend/js/shared/components/upgrade-prompt.tsx
@@ -5,7 +5,7 @@ import OLCol from '@/features/ui/components/ol/ol-col'
 import OLRow from '@/features/ui/components/ol/ol-row'
 import MaterialIcon from '@/shared/components/material-icon'
 import { PropsWithChildren } from 'react'
-import { Container } from 'react-bootstrap-5'
+import { Container } from 'react-bootstrap'
 import { Trans, useTranslation } from 'react-i18next'
 
 type IconListItemProps = PropsWithChildren<{
@@ -104,7 +104,7 @@ export function UpgradePrompt({
             <OLRow>
               <ul className="upgrade-prompt-list">
                 <IconListItem icon="hourglass_top">
-                  {t('12x_more_compile_time')}
+                  {t('24x_more_compile_time')}
                 </IconListItem>
                 <IconListItem icon="group_add">
                   {t('collabs_per_proj', { collabcount: isStudent ? 6 : 10 })}
diff --git a/services/web/frontend/js/shared/context/detach-compile-context.tsx b/services/web/frontend/js/shared/context/detach-compile-context.tsx
index 56f5130955..6cb0ca3170 100644
--- a/services/web/frontend/js/shared/context/detach-compile-context.tsx
+++ b/services/web/frontend/js/shared/context/detach-compile-context.tsx
@@ -9,7 +9,9 @@ export const DetachCompileContext = createContext<CompileContext | undefined>(
   undefined
 )
 
-export const DetachCompileProvider: FC = ({ children }) => {
+export const DetachCompileProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const localCompileContext = useLocalCompileContext()
   if (!localCompileContext) {
     throw new Error(
diff --git a/services/web/frontend/js/shared/context/detach-context.tsx b/services/web/frontend/js/shared/context/detach-context.tsx
index dd0f6acc91..2a45b198af 100644
--- a/services/web/frontend/js/shared/context/detach-context.tsx
+++ b/services/web/frontend/js/shared/context/detach-context.tsx
@@ -40,7 +40,7 @@ export const detachChannel =
     ? new BroadcastChannel(detachChannelId)
     : undefined
 
-export const DetachProvider: FC = ({ children }) => {
+export const DetachProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const [lastDetachedConnectedAt, setLastDetachedConnectedAt] = useState<Date>()
   const [role, setRole] = useState(() => getMeta('ol-detachRole') || null)
   const {
diff --git a/services/web/frontend/js/shared/context/editor-context.tsx b/services/web/frontend/js/shared/context/editor-context.tsx
index f059f14319..d3d56fe64a 100644
--- a/services/web/frontend/js/shared/context/editor-context.tsx
+++ b/services/web/frontend/js/shared/context/editor-context.tsx
@@ -9,48 +9,30 @@ import {
   useMemo,
   useState,
 } from 'react'
-import useScopeValue from '../hooks/use-scope-value'
 import useBrowserWindow from '../hooks/use-browser-window'
-import { useIdeContext } from './ide-context'
 import { useProjectContext } from './project-context'
 import { useDetachContext } from './detach-context'
 import getMeta from '../../utils/meta'
 import { useUserContext } from './user-context'
 import { saveProjectSettings } from '@/features/editor-left-menu/utils/api'
-import { PermissionsLevel } from '@/features/ide-react/types/permissions'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
 import { WritefullAPI } from './types/writefull-instance'
+import { Cobranding } from '../../../../types/cobranding'
+import { SymbolWithCharacter } from '../../../../modules/symbol-palette/frontend/js/data/symbols'
 
 export const EditorContext = createContext<
   | {
-      cobranding?: {
-        logoImgUrl: string
-        brandVariationName: string
-        brandVariationId: number
-        brandId: number
-        brandVariationHomeUrl: string
-        publishGuideHtml?: string
-        partner?: string
-        brandedMenu?: boolean
-        submitBtnHtml?: string
-      }
+      cobranding?: Cobranding
       hasPremiumCompile?: boolean
       renameProject: (newName: string) => void
-      setPermissionsLevel: (permissionsLevel: PermissionsLevel) => void
-      showSymbolPalette?: boolean
-      toggleSymbolPalette?: () => void
-      insertSymbol?: (symbol: string) => void
+      insertSymbol?: (symbol: SymbolWithCharacter) => void
       isProjectOwner: boolean
       isRestrictedTokenMember?: boolean
       isPendingEditor: boolean
-      permissionsLevel: PermissionsLevel
       deactivateTutorial: (tutorial: string) => void
       inactiveTutorials: string[]
       currentPopup: string | null
       setCurrentPopup: Dispatch<SetStateAction<string | null>>
-      setOutOfSync: (value: boolean) => void
-      assistantUpgraded: boolean
-      setAssistantUpgraded: (value: boolean) => void
       hasPremiumSuggestion: boolean
       setHasPremiumSuggestion: (value: boolean) => void
       setPremiumSuggestionResetDate: (date: Date) => void
@@ -61,13 +43,19 @@ export const EditorContext = createContext<
   | undefined
 >(undefined)
 
-export const EditorProvider: FC = ({ children }) => {
-  const { socket } = useIdeContext()
+export const EditorProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const { id: userId, featureUsage } = useUserContext()
   const { role } = useDetachContext()
   const { showGenericMessageModal } = useModalsContext()
 
-  const { owner, features, _id: projectId, members } = useProjectContext()
+  const {
+    features,
+    projectId,
+    project,
+    name: projectName,
+    updateProject,
+  } = useProjectContext()
+  const { owner, members } = project || {}
 
   const cobranding = useMemo(() => {
     const brandVariation = getMeta('ol-brandVariation')
@@ -82,23 +70,16 @@ export const EditorProvider: FC = ({ children }) => {
         partner: brandVariation.partner,
         brandedMenu: brandVariation.branded_menu,
         submitBtnHtml: brandVariation.submit_button_html,
+        submitBtnHtmlNoBreaks: brandVariation.submit_button_html_no_br,
       }
     )
   }, [])
 
-  const [projectName, setProjectName] = useScopeValue('project.name')
-  const [permissionsLevel, setPermissionsLevel] =
-    useScopeValue('permissionsLevel')
-  const [outOfSync, setOutOfSync] = useState(false)
-  const [showSymbolPalette] = useScopeValue('editor.showSymbolPalette')
-  const [toggleSymbolPalette] = useScopeValue('editor.toggleSymbolPalette')
-
   const [inactiveTutorials, setInactiveTutorials] = useState(
     () => getMeta('ol-inactiveTutorials') || []
   )
 
   const [currentPopup, setCurrentPopup] = useState<string | null>(null)
-  const [assistantUpgraded, setAssistantUpgraded] = useState(false)
   const [hasPremiumSuggestion, setHasPremiumSuggestion] = useState<boolean>(
     () => {
       return Boolean(
@@ -116,48 +97,42 @@ export const EditorProvider: FC = ({ children }) => {
 
   const isPendingEditor = useMemo(
     () =>
-      members?.some(
-        member =>
-          member._id === userId &&
-          (member.pendingEditor || member.pendingReviewer)
+      Boolean(
+        members?.some(
+          member =>
+            member._id === userId &&
+            (member.pendingEditor || member.pendingReviewer)
+        )
       ),
     [members, userId]
   )
 
   const deactivateTutorial = useCallback(
-    tutorialKey => {
+    (tutorialKey: string) => {
       setInactiveTutorials([...inactiveTutorials, tutorialKey])
     },
     [inactiveTutorials]
   )
 
-  useEffect(() => {
-    if (socket) {
-      socket.on('projectNameUpdated', setProjectName)
-      return () => socket.removeListener('projectNameUpdated', setProjectName)
-    }
-  }, [socket, setProjectName])
-
   const renameProject = useCallback(
     (newName: string) => {
-      setProjectName((oldName: string) => {
-        if (oldName !== newName) {
-          saveProjectSettings(projectId, { name: newName }).catch(
-            (response: any) => {
-              setProjectName(oldName)
-              const { data, status } = response
+      const oldName = projectName
+      if (newName !== oldName) {
+        updateProject({ name: newName })
+        saveProjectSettings(projectId, { name: newName }).catch(
+          (response: any) => {
+            updateProject({ name: oldName })
+            const { data, status } = response
 
-              showGenericMessageModal(
-                'Error renaming project',
-                status === 400 ? data : 'Please try again in a moment'
-              )
-            }
-          )
-        }
-        return newName
-      })
+            showGenericMessageModal(
+              'Error renaming project',
+              status === 400 ? data : 'Please try again in a moment'
+            )
+          }
+        )
+      }
     },
-    [setProjectName, projectId, showGenericMessageModal]
+    [projectName, updateProject, projectId, showGenericMessageModal]
   )
 
   const { setTitle } = useBrowserWindow()
@@ -181,7 +156,7 @@ export const EditorProvider: FC = ({ children }) => {
     setTitle(title)
   }, [projectName, setTitle, role])
 
-  const insertSymbol = useCallback((symbol: string) => {
+  const insertSymbol = useCallback((symbol: SymbolWithCharacter) => {
     window.dispatchEvent(
       new CustomEvent('editor:insert-symbol', {
         detail: symbol,
@@ -197,25 +172,18 @@ export const EditorProvider: FC = ({ children }) => {
       cobranding,
       hasPremiumCompile: features?.compileGroup === 'priority',
       renameProject,
-      permissionsLevel: outOfSync ? 'readOnly' : permissionsLevel,
-      setPermissionsLevel,
       isProjectOwner: owner?._id === userId,
       isRestrictedTokenMember: getMeta('ol-isRestrictedTokenMember'),
       isPendingEditor,
-      showSymbolPalette,
-      toggleSymbolPalette,
       insertSymbol,
       inactiveTutorials,
       deactivateTutorial,
       currentPopup,
       setCurrentPopup,
-      setOutOfSync,
       hasPremiumSuggestion,
       setHasPremiumSuggestion,
       premiumSuggestionResetDate,
       setPremiumSuggestionResetDate,
-      assistantUpgraded,
-      setAssistantUpgraded,
       writefullInstance,
       setWritefullInstance,
     }),
@@ -225,24 +193,16 @@ export const EditorProvider: FC = ({ children }) => {
       owner,
       userId,
       renameProject,
-      permissionsLevel,
-      setPermissionsLevel,
       isPendingEditor,
-      showSymbolPalette,
-      toggleSymbolPalette,
       insertSymbol,
       inactiveTutorials,
       deactivateTutorial,
       currentPopup,
       setCurrentPopup,
-      outOfSync,
-      setOutOfSync,
       hasPremiumSuggestion,
       setHasPremiumSuggestion,
       premiumSuggestionResetDate,
       setPremiumSuggestionResetDate,
-      assistantUpgraded,
-      setAssistantUpgraded,
       writefullInstance,
       setWritefullInstance,
     ]
@@ -252,6 +212,7 @@ export const EditorProvider: FC = ({ children }) => {
     <EditorContext.Provider value={value}>{children}</EditorContext.Provider>
   )
 }
+
 export function useEditorContext() {
   const context = useContext(EditorContext)
 
diff --git a/services/web/frontend/js/shared/context/file-tree-data-context.tsx b/services/web/frontend/js/shared/context/file-tree-data-context.tsx
index 13c3e18e23..be48f52776 100644
--- a/services/web/frontend/js/shared/context/file-tree-data-context.tsx
+++ b/services/web/frontend/js/shared/context/file-tree-data-context.tsx
@@ -8,7 +8,6 @@ import {
   FC,
   useEffect,
 } from 'react'
-import useScopeValue from '../hooks/use-scope-value'
 import {
   renameInTree,
   deleteInTree,
@@ -18,9 +17,8 @@ import {
 import { countFiles } from '../../features/file-tree/util/count-in-tree'
 import useDeepCompareEffect from '../../shared/hooks/use-deep-compare-effect'
 import { docsInFolder } from '@/features/file-tree/util/docs-in-folder'
-import useScopeValueSetterOnly from '@/shared/hooks/use-scope-value-setter-only'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
 import { Folder } from '../../../../types/folder'
-import { Project } from '../../../../types/project'
 import { MainDocument } from '../../../../types/project-settings'
 import { FindResult } from '@/features/file-tree/util/path'
 import {
@@ -28,6 +26,9 @@ import {
   useSnapshotContext,
 } from '@/features/ide-react/context/snapshot-context'
 import importOverleafModules from '../../../macros/import-overleaf-module.macro'
+import { useProjectContext } from '@/shared/context/project-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
+
 const { buildFileTree, createFolder } =
   (importOverleafModules('snapshotUtils')[0]
     ?.import as typeof StubSnapshotUtils) || StubSnapshotUtils
@@ -61,6 +62,7 @@ enum ACTION_TYPES {
   MOVE = 'MOVE',
   CREATE = 'CREATE',
 }
+
 /* eslint-enable no-unused-vars */
 
 type Action =
@@ -176,11 +178,12 @@ export function useFileTreeData() {
   return context
 }
 
-export const FileTreeDataProvider: FC = ({ children }) => {
-  const [project] = useScopeValue<Project>('project')
-  const [currentDocumentId] = useScopeValue('editor.open_doc_id')
-  const [, setOpenDocName] = useScopeValueSetterOnly('editor.open_doc_name')
-  const [permissionsLevel] = useScopeValue('permissionsLevel')
+export const FileTreeDataProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const { project } = useProjectContext()
+  const { currentDocumentId, setOpenDocName } = useEditorOpenDocContext()
+  const { permissionsLevel } = useIdeReactContext()
   const { fileTreeFromHistory, snapshot, snapshotVersion } =
     useSnapshotContext()
   const fileTreeReadOnly =
@@ -191,7 +194,7 @@ export const FileTreeDataProvider: FC = ({ children }) => {
   useEffect(() => {
     if (fileTreeFromHistory) return
     setRootFolder(project?.rootFolder)
-  }, [project, fileTreeFromHistory])
+  }, [project?.rootFolder, fileTreeFromHistory])
 
   useEffect(() => {
     if (!fileTreeFromHistory) return
@@ -227,14 +230,17 @@ export const FileTreeDataProvider: FC = ({ children }) => {
     })
   }, [rootFolder])
 
-  const dispatchCreateFolder = useCallback((parentFolderId, entity) => {
-    entity.type = 'folder'
-    dispatch({
-      type: ACTION_TYPES.CREATE,
-      parentFolderId,
-      entity,
-    })
-  }, [])
+  const dispatchCreateFolder = useCallback(
+    (parentFolderId: string, entity: any) => {
+      entity.type = 'folder'
+      dispatch({
+        type: ACTION_TYPES.CREATE,
+        parentFolderId,
+        entity,
+      })
+    },
+    []
+  )
 
   const dispatchCreateDoc = useCallback(
     (parentFolderId: string, entity: any) => {
diff --git a/services/web/frontend/js/shared/context/ide-context.tsx b/services/web/frontend/js/shared/context/ide-context.tsx
index f83686df9d..f882680583 100644
--- a/services/web/frontend/js/shared/context/ide-context.tsx
+++ b/services/web/frontend/js/shared/context/ide-context.tsx
@@ -4,28 +4,28 @@ import { ScopeEventEmitter } from '../../../../types/ide/scope-event-emitter'
 import { Socket } from '@/features/ide-react/connection/types/socket'
 
 export type Ide = {
-  $scope: Record<string, any>
   socket: Socket
 }
 
 type IdeContextValue = Ide & {
-  scopeStore: ScopeValueStore
   scopeEventEmitter: ScopeEventEmitter
+  unstableStore: ScopeValueStore
 }
 
 export const IdeContext = createContext<IdeContextValue | undefined>(undefined)
 
-export const IdeProvider: FC<{
-  ide: Ide
-  scopeStore: ScopeValueStore
-  scopeEventEmitter: ScopeEventEmitter
-}> = ({ ide, scopeStore, scopeEventEmitter, children }) => {
+export const IdeProvider: FC<
+  React.PropsWithChildren<{
+    ide: Ide
+    scopeEventEmitter: ScopeEventEmitter
+    unstableStore: ScopeValueStore
+  }>
+> = ({ ide, scopeEventEmitter, unstableStore, children }) => {
   /**
-   * Expose scopeStore via `window.overleaf.unstable.store`, so it can be accessed by external extensions.
+   * Expose unstableStore via `window.overleaf.unstable.store`, so it can be accessed by external extensions.
    *
    * These properties are expected to be available:
    *   - `editor.view`
-   *   - `project.spellcheckLanguage`
    *   - `editor.open_doc_name`,
    *   - `editor.open_doc_id`,
    *   - `settings.theme`
@@ -39,18 +39,18 @@ export const IdeProvider: FC<{
       ...window.overleaf,
       unstable: {
         ...window.overleaf?.unstable,
-        store: scopeStore,
+        store: unstableStore,
       },
     }
-  }, [scopeStore])
+  }, [unstableStore])
 
   const value = useMemo<IdeContextValue>(() => {
     return {
       ...ide,
-      scopeStore,
       scopeEventEmitter,
+      unstableStore,
     }
-  }, [ide, scopeStore, scopeEventEmitter])
+  }, [ide, scopeEventEmitter, unstableStore])
 
   return <IdeContext.Provider value={value}>{children}</IdeContext.Provider>
 }
diff --git a/services/web/frontend/js/shared/context/layout-context.tsx b/services/web/frontend/js/shared/context/layout-context.tsx
index 145d840540..c3647d3926 100644
--- a/services/web/frontend/js/shared/context/layout-context.tsx
+++ b/services/web/frontend/js/shared/context/layout-context.tsx
@@ -8,8 +8,8 @@ import {
   SetStateAction,
   FC,
   useState,
+  useRef,
 } from 'react'
-import useScopeValue from '../hooks/use-scope-value'
 import useDetachLayout from '../hooks/use-detach-layout'
 import localStorage from '../../infrastructure/local-storage'
 import getMeta from '../../utils/meta'
@@ -18,43 +18,51 @@ import { debugConsole } from '@/utils/debugging'
 import { BinaryFile } from '@/features/file-view/types/binary-file'
 import useScopeEventEmitter from '@/shared/hooks/use-scope-event-emitter'
 import useEventListener from '@/shared/hooks/use-event-listener'
-import { isSplitTestEnabled } from '@/utils/splitTestUtils'
 import { isMac } from '@/shared/utils/os'
 import { sendSearchEvent } from '@/features/event-tracking/search-events'
+import { useRailContext } from '@/features/ide-redesign/contexts/rail-context'
+import usePersistedState from '@/shared/hooks/use-persisted-state'
+import { repositionAllTooltips } from '@/features/source-editor/extensions/tooltips-reposition'
 
 export type IdeLayout = 'sideBySide' | 'flat'
 export type IdeView = 'editor' | 'file' | 'pdf' | 'history'
 
-export type LayoutContextValue = {
+export type LayoutContextOwnStates = {
+  view: IdeView | null
+  chatIsOpen: boolean
+  reviewPanelOpen: boolean
+  miniReviewPanelVisible: boolean
+  leftMenuShown: boolean
+  loadingStyleSheet: boolean
+  pdfLayout: IdeLayout
+  projectSearchIsOpen: boolean
+  openFile: BinaryFile | null
+}
+
+export type LayoutContextValue = LayoutContextOwnStates & {
   reattach: () => void
   detach: () => void
   detachIsLinked: boolean
   detachRole: DetachRole
   changeLayout: (newLayout: IdeLayout, newView?: IdeView) => void
-  view: IdeView | null
   setView: (view: IdeView | null) => void
-  chatIsOpen: boolean
   setChatIsOpen: Dispatch<SetStateAction<LayoutContextValue['chatIsOpen']>>
-  reviewPanelOpen: boolean
   setReviewPanelOpen: Dispatch<
     SetStateAction<LayoutContextValue['reviewPanelOpen']>
   >
-  miniReviewPanelVisible: boolean
   setMiniReviewPanelVisible: Dispatch<
     SetStateAction<LayoutContextValue['miniReviewPanelVisible']>
   >
-  leftMenuShown: boolean
   setLeftMenuShown: Dispatch<
     SetStateAction<LayoutContextValue['leftMenuShown']>
   >
-  loadingStyleSheet: boolean
   setLoadingStyleSheet: Dispatch<
     SetStateAction<LayoutContextValue['loadingStyleSheet']>
   >
-  pdfLayout: IdeLayout
   pdfPreviewOpen: boolean
-  projectSearchIsOpen: boolean
   setProjectSearchIsOpen: Dispatch<SetStateAction<boolean>>
+  setOpenFile: Dispatch<SetStateAction<BinaryFile | null>>
+  restoreView: () => void
 }
 
 const debugPdfDetach = getMeta('ol-debugPdfDetach')
@@ -70,11 +78,17 @@ function setLayoutInLocalStorage(pdfLayout: IdeLayout) {
   )
 }
 
-export const LayoutProvider: FC = ({ children }) => {
+const reviewPanelStorageKey = `ui.reviewPanelOpen.${getMeta('ol-project_id')}`
+
+export const LayoutProvider: FC<React.PropsWithChildren> = ({ children }) => {
   // what to show in the "flat" view (editor or pdf)
-  const [view, _setView] = useScopeValue<IdeView | null>('ui.view')
-  const [openFile] = useScopeValue<BinaryFile | null>('openFile')
+  const [view, _setView] = useState<IdeView | null>('editor')
+  const [openFile, setOpenFile] = useState<BinaryFile | null>(null)
   const historyToggleEmitter = useScopeEventEmitter('history:toggle', true)
+  const { isOpen: railIsOpen, setIsOpen: setRailIsOpen } = useRailContext()
+  const [prevRailIsOpen, setPrevRailIsOpen] = useState(railIsOpen)
+  // Whether we came from a file or a document when we left the ide
+  const lastIdeView = useRef<IdeView>('editor')
 
   const setView = useCallback(
     (value: IdeView | null) => {
@@ -84,34 +98,54 @@ export const LayoutProvider: FC = ({ children }) => {
           historyToggleEmitter()
         }
 
-        if (value === 'editor' && openFile) {
-          // if a file is currently opened, ensure the view is 'file' instead of
-          // 'editor' when the 'editor' view is requested. This is to ensure
-          // that the entity selected in the file tree is the one visible and
-          // that docs don't take precedence over files.
-          return 'file'
+        if (value === 'history') {
+          setPrevRailIsOpen(railIsOpen)
+          setRailIsOpen(true)
+        }
+
+        if (oldValue === 'history') {
+          setRailIsOpen(prevRailIsOpen)
+        }
+
+        if (value === 'editor' || value === 'file') {
+          lastIdeView.current = value
         }
 
         return value
       })
     },
-    [_setView, openFile, historyToggleEmitter]
+    [
+      _setView,
+      setRailIsOpen,
+      historyToggleEmitter,
+      prevRailIsOpen,
+      setPrevRailIsOpen,
+      railIsOpen,
+    ]
   )
 
+  const restoreView = useCallback(() => {
+    setView(lastIdeView.current ?? 'editor')
+  }, [setView])
+
   // whether the chat pane is open
-  const [chatIsOpen, setChatIsOpen] = useScopeValue<boolean>('ui.chatOpen')
+  const [chatIsOpen, setChatIsOpen] = usePersistedState<boolean>(
+    'ui.chatOpen',
+    false
+  )
 
   // whether the review pane is open
-  const [reviewPanelOpen, setReviewPanelOpen] =
-    useScopeValue<boolean>('ui.reviewPanelOpen')
+  const [reviewPanelOpen, setReviewPanelOpen] = usePersistedState<boolean>(
+    reviewPanelStorageKey,
+    false
+  )
 
   // whether the review pane is collapsed
   const [miniReviewPanelVisible, setMiniReviewPanelVisible] =
-    useScopeValue<boolean>('ui.miniReviewPanelVisible')
+    useState<boolean>(false)
 
   // whether the menu pane is open
-  const [leftMenuShown, setLeftMenuShown] =
-    useScopeValue<boolean>('ui.leftMenuShown')
+  const [leftMenuShown, setLeftMenuShown] = useState<boolean>(false)
 
   // whether the project search is open
   const [projectSearchIsOpen, setProjectSearchIsOpen] = useState(false)
@@ -119,13 +153,14 @@ export const LayoutProvider: FC = ({ children }) => {
   useEventListener(
     'ui.toggle-left-menu',
     useCallback(
-      event => {
-        setLeftMenuShown((event as CustomEvent<boolean>).detail)
+      (event: CustomEvent<boolean>) => {
+        setLeftMenuShown(event.detail)
       },
       [setLeftMenuShown]
     )
   )
 
+  // TODO ide-redesign-cleanup: remove this listener as we have an equivalent in rail-context
   useEventListener(
     'ui.toggle-review-panel',
     useCallback(() => {
@@ -133,6 +168,7 @@ export const LayoutProvider: FC = ({ children }) => {
     }, [setReviewPanelOpen])
   )
 
+  // TODO ide-redesign-cleanup: remove this listener as we have an equivalent in rail-context
   useEventListener(
     'keydown',
     useCallback((event: KeyboardEvent) => {
@@ -141,33 +177,45 @@ export const LayoutProvider: FC = ({ children }) => {
         event.shiftKey &&
         event.code === 'KeyF'
       ) {
-        if (isSplitTestEnabled('full-project-search')) {
-          event.preventDefault()
-          sendSearchEvent('search-open', {
-            searchType: 'full-project',
-            method: 'keyboard',
-          })
-          setProjectSearchIsOpen(true)
-        }
+        event.preventDefault()
+        sendSearchEvent('search-open', {
+          searchType: 'full-project',
+          method: 'keyboard',
+        })
+        setProjectSearchIsOpen(true)
       }
     }, [])
   )
 
   // whether to display the editor and preview side-by-side or full-width ("flat")
-  const [pdfLayout, setPdfLayout] = useScopeValue<IdeLayout>('ui.pdfLayout')
+  const [pdfLayout, setPdfLayout] = useState<IdeLayout>('sideBySide')
 
   // whether stylesheet on theme is loading
   const [loadingStyleSheet, setLoadingStyleSheet] = useState(false)
 
   const changeLayout = useCallback(
     (newLayout: IdeLayout, newView: IdeView = 'editor') => {
+      const targetView = newLayout === 'sideBySide' ? 'editor' : newView
       setPdfLayout(newLayout)
-      setView(newLayout === 'sideBySide' ? 'editor' : newView)
+      if (targetView === 'editor') {
+        restoreView()
+      } else {
+        setView(targetView)
+      }
       setLayoutInLocalStorage(newLayout)
     },
-    [setPdfLayout, setView]
+    [setPdfLayout, setView, restoreView]
   )
 
+  // Force codemirror to reposition all tooltips to prevent an issue
+  // where tooltips would sometimes show on top of the pdf preview
+  // https://github.com/overleaf/internal/issues/23840
+  useEffect(() => {
+    if (view === 'pdf' && pdfLayout === 'flat') {
+      repositionAllTooltips()
+    }
+  }, [view, pdfLayout])
+
   const {
     reattach,
     detach,
@@ -219,6 +267,7 @@ export const LayoutProvider: FC = ({ children }) => {
       changeLayout,
       chatIsOpen,
       leftMenuShown,
+      openFile,
       pdfLayout,
       pdfPreviewOpen,
       projectSearchIsOpen,
@@ -228,12 +277,14 @@ export const LayoutProvider: FC = ({ children }) => {
       loadingStyleSheet,
       setChatIsOpen,
       setLeftMenuShown,
+      setOpenFile,
       setPdfLayout,
       setReviewPanelOpen,
       setMiniReviewPanelVisible,
       setLoadingStyleSheet,
       setView,
       view,
+      restoreView,
     }),
     [
       reattach,
@@ -243,6 +294,7 @@ export const LayoutProvider: FC = ({ children }) => {
       changeLayout,
       chatIsOpen,
       leftMenuShown,
+      openFile,
       pdfLayout,
       pdfPreviewOpen,
       projectSearchIsOpen,
@@ -252,12 +304,14 @@ export const LayoutProvider: FC = ({ children }) => {
       loadingStyleSheet,
       setChatIsOpen,
       setLeftMenuShown,
+      setOpenFile,
       setPdfLayout,
       setReviewPanelOpen,
       setMiniReviewPanelVisible,
       setLoadingStyleSheet,
       setView,
       view,
+      restoreView,
     ]
   )
 
diff --git a/services/web/frontend/js/shared/context/local-compile-context.tsx b/services/web/frontend/js/shared/context/local-compile-context.tsx
index e673ba237d..0e938aa881 100644
--- a/services/web/frontend/js/shared/context/local-compile-context.tsx
+++ b/services/web/frontend/js/shared/context/local-compile-context.tsx
@@ -10,8 +10,6 @@ import {
   Dispatch,
   SetStateAction,
 } from 'react'
-import useScopeValue from '../hooks/use-scope-value'
-import useScopeValueSetterOnly from '../hooks/use-scope-value-setter-only'
 import usePersistedState from '../hooks/use-persisted-state'
 import useAbortController from '../hooks/use-abort-controller'
 import DocumentCompiler from '../../features/pdf-preview/util/compiler'
@@ -34,16 +32,24 @@ import { buildFileList } from '../../features/pdf-preview/util/file-list'
 import { useLayoutContext } from './layout-context'
 import { useUserContext } from './user-context'
 import { useFileTreeData } from '@/shared/context/file-tree-data-context'
+import { useDetachContext } from '@/shared/context/detach-context'
 import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import { useUserSettingsContext } from '@/shared/context/user-settings-context'
 import { useFeatureFlag } from '@/shared/context/split-test-context'
 import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { getJSON } from '@/infrastructure/fetch-json'
 import { CompileResponseData } from '../../../../types/compile'
 import {
   PdfScrollPosition,
   usePdfScrollPosition,
 } from '@/shared/hooks/use-pdf-scroll-position'
-import { PdfFileDataList } from '@/features/pdf-preview/util/types'
+import { LogEntry, PdfFileDataList } from '@/features/pdf-preview/util/types'
+import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import { captureException } from '@/infrastructure/error-reporter'
+import OError from '@overleaf/o-error'
+import getMeta from '@/utils/meta'
+import type { Annotation } from '../../../../types/annotation'
 
 type PdfFile = Record<string, any>
 
@@ -61,8 +67,13 @@ export type CompileContext = {
   hasShortCompileTimeout: boolean
   highlights?: Record<string, any>[]
   isProjectOwner: boolean
-  logEntries?: Record<string, any>
-  logEntryAnnotations?: Record<string, any>
+  logEntries?: {
+    all: LogEntry[]
+    errors: LogEntry[]
+    warnings: LogEntry[]
+    typesetting: LogEntry[]
+  }
+  logEntryAnnotations?: Record<string, Annotation[]>
   outputFilesArchive?: string
   pdfDownloadUrl?: string
   pdfFile?: PdfFile
@@ -73,7 +84,7 @@ export type CompileContext = {
   setAutoCompile: (value: boolean) => void
   setDraft: (value: any) => void
   setError: (value: any) => void
-  setHasLintingError: (value: any) => void // only for storybook
+  setHasLintingError: (value: boolean) => void // only for storybook
   setHighlights: (value: any) => void
   setPosition: Dispatch<SetStateAction<PdfScrollPosition>>
   setShowCompileTimeWarning: (value: any) => void
@@ -86,7 +97,7 @@ export type CompileContext = {
   stopOnFirstError: boolean
   stopOnValidationError: boolean
   stoppedOnFirstError: boolean
-  uncompiled?: boolean
+  uncompiled: boolean
   validationIssues?: Record<string, any>
   firstRenderDone: (metrics: {
     latencyFetch: number
@@ -112,11 +123,16 @@ export const LocalCompileContext = createContext<CompileContext | undefined>(
   undefined
 )
 
-export const LocalCompileProvider: FC = ({ children }) => {
+export const LocalCompileProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const { hasPremiumCompile, isProjectOwner } = useEditorContext()
-  const { openDocWithId, openDocs, currentDocument } = useEditorManagerContext()
+  const { openDocWithId, openDocs } = useEditorManagerContext()
+  const { currentDocument } = useEditorOpenDocContext()
+  const { role } = useDetachContext()
 
-  const { _id: projectId, rootDocId } = useProjectContext()
+  const { projectId, joinedOnce, project } = useProjectContext()
+  const { rootDocId, imageName, compiler: compilerName } = project || {}
 
   const { pdfPreviewOpen } = useLayoutContext()
 
@@ -134,34 +150,22 @@ export const LocalCompileProvider: FC = ({ children }) => {
   const [hasShortCompileTimeout, setHasShortCompileTimeout] = useState(false)
 
   // the log entries parsed from the compile output log
-  const [logEntries, setLogEntries] = useScopeValueSetterOnly('pdf.logEntries')
+  const [logEntries, setLogEntries] = useState<CompileContext['logEntries']>()
 
   // annotations for display in the editor, built from the log entries
-  const [logEntryAnnotations, setLogEntryAnnotations] = useScopeValue(
-    'pdf.logEntryAnnotations'
-  )
+  const [logEntryAnnotations, setLogEntryAnnotations] = useState<
+    undefined | Record<string, Annotation[]>
+  >()
 
   // the PDF viewer and whether syntax validation is enabled globally
   const { userSettings } = useUserSettingsContext()
   const { pdfViewer, syntaxValidation } = userSettings
 
-  // the URL for downloading the PDF
-  const [, setPdfDownloadUrl] =
-    useScopeValueSetterOnly<string>('pdf.downloadUrl')
-
-  // the URL for loading the PDF in the preview pane
-  const [, setPdfUrl] = useScopeValueSetterOnly<string>('pdf.url')
-
   // low level details for metrics
   const [pdfFile, setPdfFile] = useState<PdfFile | undefined>()
 
-  useEffect(() => {
-    setPdfDownloadUrl(pdfFile?.pdfDownloadUrl)
-    setPdfUrl(pdfFile?.pdfUrl)
-  }, [pdfFile, setPdfDownloadUrl, setPdfUrl])
-
   // the project is considered to be "uncompiled" if a doc has changed, or finished saving, since the last compile started.
-  const [uncompiled, setUncompiled] = useScopeValue('pdf.uncompiled')
+  const [uncompiled, setUncompiled] = useState(false)
 
   // whether a doc has been edited since the last compile started
   const [editedSinceCompileStarted, setEditedSinceCompileStarted] =
@@ -186,6 +190,18 @@ export const LocalCompileProvider: FC = ({ children }) => {
 
   // whether the project has been compiled yet
   const [compiledOnce, setCompiledOnce] = useState(false)
+  // fetch initial compile response from cache
+  const [initialCompileFromCache, setInitialCompileFromCache] = useState(
+    getMeta('ol-projectOwnerHasPremiumOnPageLoad') &&
+      isSplitTestEnabled('populate-clsi-cache') &&
+      // Avoid fetching the initial compile from cache in PDF detach tab
+      role !== 'detached'
+  )
+  // fetch of initial compile from cache is pending
+  const [pendingInitialCompileFromCache, setPendingInitialCompileFromCache] =
+    useState(false)
+  // Raw data from clsi-cache, will need post-processing and check settings
+  const [dataFromCache, setDataFromCache] = useState<CompileResponseData>()
 
   // whether the cache is being cleared
   const [clearingCache, setClearingCache] = useState(false)
@@ -227,17 +243,19 @@ export const LocalCompileProvider: FC = ({ children }) => {
   const [autoCompile, setAutoCompile] = usePersistedState(
     `autocompile_enabled:${projectId}`,
     false,
-    true
+    { listen: true }
   )
 
   // whether the compile should run in draft mode
-  const [draft, setDraft] = usePersistedState(`draft:${projectId}`, false, true)
+  const [draft, setDraft] = usePersistedState(`draft:${projectId}`, false, {
+    listen: true,
+  })
 
   // whether compiling should stop on first error
   const [stopOnFirstError, setStopOnFirstError] = usePersistedState(
     `stop_on_first_error:${projectId}`,
     false,
-    true
+    { listen: true }
   )
 
   // whether the last compiles stopped on first error
@@ -247,11 +265,11 @@ export const LocalCompileProvider: FC = ({ children }) => {
   const [stopOnValidationError, setStopOnValidationError] = usePersistedState(
     `stop_on_validation_error:${projectId}`,
     true,
-    true
+    { listen: true }
   )
 
   // whether the editor linter found errors
-  const [hasLintingError, setHasLintingError] = useScopeValue('hasLintingError')
+  const [hasLintingError, setHasLintingError] = useState(false)
 
   // the timestamp that a doc was last changed
   const [changedAt, setChangedAt] = useState(0)
@@ -260,7 +278,7 @@ export const LocalCompileProvider: FC = ({ children }) => {
 
   const cleanupCompileResult = useCallback(() => {
     setPdfFile(undefined)
-    setLogEntries(null)
+    setLogEntries(undefined)
     setLogEntryAnnotations({})
   }, [setPdfFile, setLogEntries, setLogEntryAnnotations])
 
@@ -271,7 +289,7 @@ export const LocalCompileProvider: FC = ({ children }) => {
   }, [compiling])
 
   const _buildLogEntryAnnotations = useCallback(
-    entries =>
+    (entries: any) =>
       buildLogEntryAnnotations(entries, fileTreeData, lastCompileRootDocId),
     [fileTreeData, lastCompileRootDocId]
   )
@@ -327,13 +345,94 @@ export const LocalCompileProvider: FC = ({ children }) => {
     setEditedSinceCompileStarted(changedAt > 0)
   }, [setEditedSinceCompileStarted, changedAt])
 
+  // try to fetch the last compile result after opening the project, potentially before joining the project.
+  useEffect(() => {
+    if (initialCompileFromCache && !pendingInitialCompileFromCache) {
+      setPendingInitialCompileFromCache(true)
+      getJSON(`/project/${projectId}/output/cached/output.overleaf.json`)
+        .then((data: any) => {
+          // Hand data over to next effect, it will wait for project/doc loading.
+          setDataFromCache(data)
+        })
+        .catch(() => {
+          // Let the isAutoCompileOnLoad effect take over
+          setInitialCompileFromCache(false)
+          setPendingInitialCompileFromCache(false)
+        })
+    }
+  }, [projectId, initialCompileFromCache, pendingInitialCompileFromCache])
+
+  // Maybe adopt the compile from cache
+  useEffect(() => {
+    if (!dataFromCache) return // no compile from cache available
+    if (!joinedOnce) return // wait for joinProject, it populates the file-tree.
+    if (!currentDocument) return // wait for current doc to load, it affects the rootDoc override
+    if (compiledOnce) return // regular compile triggered
+
+    // Gracefully access file-tree and getRootDocOverride
+    let settingsUpToDate = false
+    try {
+      dataFromCache.rootDocId = findEntityByPath(
+        dataFromCache.options?.rootResourcePath || ''
+      )?.entity?._id
+      const rootDocOverride = compiler.getRootDocOverrideId() || rootDocId
+      settingsUpToDate =
+        rootDocOverride === dataFromCache.rootDocId &&
+        dataFromCache.options.imageName === imageName &&
+        dataFromCache.options.compiler === compilerName &&
+        dataFromCache.options.draft === draft &&
+        // Allow stopOnFirstError to be enabled in the compile from cache and disabled locally.
+        // Compiles that passed with stopOnFirstError=true will also pass with stopOnFirstError=false. The inverse does not hold, and we need to recompile.
+        !!dataFromCache.options.stopOnFirstError >= stopOnFirstError
+    } catch (err) {
+      captureException(
+        OError.tag(err as unknown as Error, 'validate compile options', {
+          options: dataFromCache.options,
+        })
+      )
+    }
+
+    if (settingsUpToDate) {
+      sendMB('compile-from-cache', { projectId })
+      setData(dataFromCache)
+      setCompiledOnce(true)
+    }
+    setDataFromCache(undefined)
+    setInitialCompileFromCache(false)
+    setPendingInitialCompileFromCache(false)
+  }, [
+    projectId,
+    dataFromCache,
+    joinedOnce,
+    currentDocument,
+    compiledOnce,
+    rootDocId,
+    findEntityByPath,
+    compiler,
+    compilerName,
+    imageName,
+    stopOnFirstError,
+    draft,
+  ])
+
   // always compile the PDF once after opening the project, after the doc has loaded
   useEffect(() => {
-    if (!compiledOnce && currentDocument) {
+    if (
+      !compiledOnce &&
+      currentDocument &&
+      !initialCompileFromCache &&
+      !pendingInitialCompileFromCache
+    ) {
       setCompiledOnce(true)
       compiler.compile({ isAutoCompileOnLoad: true })
     }
-  }, [compiledOnce, currentDocument, compiler])
+  }, [
+    compiledOnce,
+    currentDocument,
+    initialCompileFromCache,
+    pendingInitialCompileFromCache,
+    compiler,
+  ])
 
   useEffect(() => {
     setHasShortCompileTimeout(
@@ -370,6 +469,7 @@ export const LocalCompileProvider: FC = ({ children }) => {
   // note: this should _only_ run when `data` changes,
   // the other dependencies must all be static
   useEffect(() => {
+    if (!joinedOnce) return // wait for joinProject, it populates the premium flags.
     const abortController = new AbortController()
 
     const recordedActions = recordedActionsRef.current
@@ -397,8 +497,8 @@ export const LocalCompileProvider: FC = ({ children }) => {
 
         // handle log files
         // asynchronous (TODO: cancel on new compile?)
-        setLogEntryAnnotations(null)
-        setLogEntries(null)
+        setLogEntryAnnotations(undefined)
+        setLogEntries(undefined)
         setRawLog(undefined)
 
         handleLogFiles(outputFiles, data, abortController.signal).then(
@@ -519,6 +619,7 @@ export const LocalCompileProvider: FC = ({ children }) => {
       abortController.abort()
     }
   }, [
+    joinedOnce,
     data,
     alphaProgram,
     labsProgram,
@@ -578,10 +679,11 @@ export const LocalCompileProvider: FC = ({ children }) => {
 
   // start a compile manually
   const startCompile = useCallback(
-    options => {
+    (options: any) => {
+      setCompiledOnce(true)
       compiler.compile(options)
     },
-    [compiler]
+    [compiler, setCompiledOnce]
   )
 
   // stop a compile manually
@@ -605,7 +707,7 @@ export const LocalCompileProvider: FC = ({ children }) => {
   }, [compiler])
 
   const syncToEntry = useCallback(
-    (entry, keepCurrentView = false) => {
+    (entry: any, keepCurrentView = false) => {
       const result = findEntityByPath(entry.file)
 
       if (result && result.type === 'doc') {
@@ -630,18 +732,6 @@ export const LocalCompileProvider: FC = ({ children }) => {
   // used for that compile.
   const lastCompileOptions = useMemo(() => data?.options || {}, [data])
 
-  useEffect(() => {
-    const listener = (event: Event) => {
-      setShowLogs((event as CustomEvent<boolean>).detail as boolean)
-    }
-
-    window.addEventListener('editor:show-logs', listener)
-
-    return () => {
-      window.removeEventListener('editor:show-logs', listener)
-    }
-  }, [])
-
   const value = useMemo(
     () => ({
       animateCompileDropdownArrow,
diff --git a/services/web/frontend/js/shared/context/mock/mock-ide.js b/services/web/frontend/js/shared/context/mock/mock-ide.js
deleted file mode 100644
index 822d3b165c..0000000000
--- a/services/web/frontend/js/shared/context/mock/mock-ide.js
+++ /dev/null
@@ -1,56 +0,0 @@
-import getMeta from '../../../utils/meta'
-
-// When rendered without Angular, ide isn't defined. In that case we use
-// a mock object that only has the required properties to pass proptypes
-// checks and the values needed for the app. In the longer term, the mock
-// object will replace ide completely.
-export const getMockIde = () => {
-  return {
-    _id: getMeta('ol-project_id'),
-    $scope: {
-      $on: () => {},
-      $watch: () => {},
-      $applyAsync: () => {},
-      user: {},
-      project: {
-        _id: getMeta('ol-project_id'),
-        name: getMeta('ol-projectName'),
-        rootDocId: '',
-        members: [],
-        invites: [],
-        features: {
-          collaborators: 0,
-          compileGroup: 'standard',
-          trackChangesVisible: false,
-          references: false,
-          mendeley: false,
-          zotero: false,
-        },
-        publicAccessLevel: '',
-        owner: {
-          _id: '',
-          email: '',
-        },
-      },
-      permissionsLevel: 'readOnly',
-      editor: {
-        sharejs_doc: null,
-        showSymbolPalette: false,
-        toggleSymbolPalette: () => {},
-      },
-      ui: {
-        view: 'pdf',
-        chatOpen: false,
-        reviewPanelOpen: false,
-        leftMenuShown: false,
-        pdfLayout: 'flat',
-      },
-      pdf: {
-        uncompiled: true,
-        logEntryAnnotations: {},
-      },
-      settings: { syntaxValidation: false, pdfViewer: 'pdfjs' },
-      hasLintingError: false,
-    },
-  }
-}
diff --git a/services/web/frontend/js/shared/context/nestable-dropdown-context.tsx b/services/web/frontend/js/shared/context/nestable-dropdown-context.tsx
index 3f1b7f9c0f..7f949f4ebe 100644
--- a/services/web/frontend/js/shared/context/nestable-dropdown-context.tsx
+++ b/services/web/frontend/js/shared/context/nestable-dropdown-context.tsx
@@ -10,10 +10,9 @@ export const NestableDropdownContext = createContext<
   NestableDropdownContextType | undefined
 >(undefined)
 
-export const NestableDropdownContextProvider: FC<{ id: string }> = ({
-  id,
-  children,
-}) => {
+export const NestableDropdownContextProvider: FC<
+  React.PropsWithChildren<{ id: string }>
+> = ({ id, children }) => {
   const [selected, setSelected] = useState<string | null>(null)
   return (
     <NestableDropdownContext.Provider
diff --git a/services/web/frontend/js/shared/context/project-context.tsx b/services/web/frontend/js/shared/context/project-context.tsx
index 4e54acaeed..8861aba1a5 100644
--- a/services/web/frontend/js/shared/context/project-context.tsx
+++ b/services/web/frontend/js/shared/context/project-context.tsx
@@ -1,10 +1,31 @@
-import { FC, createContext, useContext, useMemo, useState } from 'react'
-import useScopeValue from '../hooks/use-scope-value'
+import {
+  FC,
+  createContext,
+  useContext,
+  useMemo,
+  useState,
+  useCallback,
+} from 'react'
 import getMeta from '@/utils/meta'
-import { ProjectContextValue } from './types/project-context'
+import { ProjectUpdate, ProjectMetadata } from './types/project-metadata'
 import { ProjectSnapshot } from '@/infrastructure/project-snapshot'
+import { Tag } from '../../../../app/src/Features/Tags/types'
 
-const ProjectContext = createContext<ProjectContextValue | undefined>(undefined)
+type ProjectContextValue = {
+  projectId: ProjectMetadata['_id']
+  project: ProjectMetadata | null
+  joinProject: (project: ProjectMetadata) => void
+  updateProject: (projectUpdate: ProjectUpdate) => void
+  joinedOnce: boolean
+  projectSnapshot: ProjectSnapshot
+  tags: Tag[]
+  features: ProjectMetadata['features']
+  name: ProjectMetadata['name']
+}
+
+export const ProjectContext = createContext<ProjectContextValue | undefined>(
+  undefined
+)
 
 export function useProjectContext() {
   const context = useContext(ProjectContext)
@@ -18,33 +39,33 @@ export function useProjectContext() {
   return context
 }
 
-// when the provider is created the project is still not added to the Angular
-// scope. A few props are populated to prevent errors in existing React
-// components
-const projectFallback = {
-  _id: getMeta('ol-project_id'),
-  name: '',
-  features: {},
-}
+export const ProjectProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const [joinedOnce, setJoinedOnce] = useState(false)
+  const [project, setProject] = useState<ProjectMetadata | null>(null)
 
-export const ProjectProvider: FC = ({ children }) => {
-  const [project] = useScopeValue('project')
+  // Expose some project properties with fallbacks for convenience
+  const projectId = project ? project._id : getMeta('ol-project_id')
+  const name = project ? project.name : ''
+  const features = project ? project.features : {}
 
-  const {
-    _id,
-    compiler,
-    name,
-    rootDoc_id: rootDocId,
-    members,
-    invites,
-    features,
-    publicAccesLevel: publicAccessLevel,
-    owner,
-    trackChangesState,
-    mainBibliographyDoc_id: mainBibliographyDocId,
-  } = project || projectFallback
+  const joinProject = useCallback((projectData: ProjectMetadata) => {
+    setProject(projectData)
+    setJoinedOnce(true)
+  }, [])
 
-  const [projectSnapshot] = useState(() => new ProjectSnapshot(_id))
+  const updateProject = useCallback((projectUpdateData: ProjectUpdate) => {
+    setProject(projectData => {
+      // Only perform the update if `project` is already set, otherwise we could
+      // end up with an incomplete project object
+      if (!projectData) {
+        throw new Error('Project not initialized. Use joinProject first.')
+      }
+
+      return Object.assign({}, projectData, projectUpdateData)
+    })
+  }, [])
+
+  const [projectSnapshot] = useState(() => new ProjectSnapshot(projectId))
 
   const tags = useMemo(
     () =>
@@ -54,37 +75,17 @@ export const ProjectProvider: FC = ({ children }) => {
     []
   )
 
-  const value = useMemo(() => {
-    return {
-      _id,
-      compiler,
-      name,
-      rootDocId,
-      members,
-      invites,
-      features,
-      publicAccessLevel,
-      owner,
-      tags,
-      trackChangesState,
-      mainBibliographyDocId,
-      projectSnapshot,
-    }
-  }, [
-    _id,
-    compiler,
-    name,
-    rootDocId,
-    members,
-    invites,
-    features,
-    publicAccessLevel,
-    owner,
-    tags,
-    trackChangesState,
-    mainBibliographyDocId,
+  const value = {
+    projectId,
+    project,
+    joinProject,
+    updateProject,
+    joinedOnce,
     projectSnapshot,
-  ])
+    tags,
+    features,
+    name,
+  }
 
   return (
     <ProjectContext.Provider value={value}>{children}</ProjectContext.Provider>
diff --git a/services/web/frontend/js/shared/context/split-test-context.tsx b/services/web/frontend/js/shared/context/split-test-context.tsx
index 4902dadcde..446b8a3b42 100644
--- a/services/web/frontend/js/shared/context/split-test-context.tsx
+++ b/services/web/frontend/js/shared/context/split-test-context.tsx
@@ -10,7 +10,9 @@ export const SplitTestContext = createContext<
   | undefined
 >(undefined)
 
-export const SplitTestProvider: FC = ({ children }) => {
+export const SplitTestProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const value = useMemo(
     () => ({
       splitTestVariants: getMeta('ol-splitTestVariants') || {},
diff --git a/services/web/frontend/js/shared/context/types/project-context.tsx b/services/web/frontend/js/shared/context/types/project-metadata.tsx
similarity index 68%
rename from services/web/frontend/js/shared/context/types/project-context.tsx
rename to services/web/frontend/js/shared/context/types/project-metadata.tsx
index 91419ed06f..b0847dfda7 100644
--- a/services/web/frontend/js/shared/context/types/project-context.tsx
+++ b/services/web/frontend/js/shared/context/types/project-metadata.tsx
@@ -1,8 +1,9 @@
 import { UserId } from '../../../../../types/user'
 import { PublicAccessLevel } from '../../../../../types/public-access-level'
-import { ProjectSnapshot } from '@/infrastructure/project-snapshot'
+import { ProjectSettings } from '@/features/editor-left-menu/utils/api'
+import { Folder } from '../../../../../types/folder'
 
-export type ProjectContextMember = {
+export type ProjectMember = {
   _id: UserId
   privileges: 'readOnly' | 'readAndWrite' | 'review'
   email: string
@@ -12,14 +13,11 @@ export type ProjectContextMember = {
   pendingReviewer?: boolean
 }
 
-export type ProjectContextValue = {
+export interface ProjectMetadata extends ProjectSettings {
   _id: string
-  name: string
-  rootDocId?: string
   mainBibliographyDocId?: string
-  compiler: string
-  members: ProjectContextMember[]
-  invites: ProjectContextMember[]
+  members: ProjectMember[]
+  invites: ProjectMember[]
   features: {
     collaborators?: number
     compileGroup?: 'alpha' | 'standard' | 'priority'
@@ -42,13 +40,8 @@ export type ProjectContextValue = {
     privileges: string
     signUpDate: string
   }
-  tags: {
-    _id: string
-    name: string
-    color?: string
-  }[]
+  rootFolder?: Folder[]
   trackChangesState: boolean | Record<UserId | '__guests__', boolean>
-  projectSnapshot: ProjectSnapshot
 }
 
-export type ProjectContextUpdateValue = Partial<ProjectContextValue>
+export type ProjectUpdate = Partial<ProjectMetadata>
diff --git a/services/web/frontend/js/shared/context/types/writefull-instance.ts b/services/web/frontend/js/shared/context/types/writefull-instance.ts
index 0040422548..120590e668 100644
--- a/services/web/frontend/js/shared/context/types/writefull-instance.ts
+++ b/services/web/frontend/js/shared/context/types/writefull-instance.ts
@@ -1,9 +1,12 @@
 export interface WritefullEvents {
   'writefull-login-complete': {
     method: 'email-password' | 'login-with-overleaf'
+    isPremium: boolean
   }
   'writefull-received-suggestions': { numberOfSuggestions: number }
   'writefull-register-as-auto-account': { email: string }
+  'writefull-shared-analytics': { eventName: string; segmentation: object }
+  'writefull-ai-assist-show-paywall': { origin?: string }
 }
 
 type InsertPosition = {
@@ -17,14 +20,26 @@ export interface WritefullAPI {
     iconPosition,
     hasAgreedToTOS,
     overleafUserId,
+    overleafLabels,
   }: {
     toolbarPosition: InsertPosition
     iconPosition: InsertPosition
     hasAgreedToTOS: boolean
     overleafUserId: string
+    overleafLabels: {
+      autoImport: boolean
+      autoCreatedAccount: boolean
+      splitTests: Record<string, boolean>
+    }
   }): Promise<void>
   addEventListener<eventName extends keyof WritefullEvents>(
     name: eventName,
     callback: (detail: WritefullEvents[eventName]) => void
   ): void
+  removeEventListener<eventName extends keyof WritefullEvents>(
+    name: eventName,
+    callback: (detail: WritefullEvents[eventName]) => void
+  ): void
+  openTableGenerator(): void
+  openEquationGenerator(): void
 }
diff --git a/services/web/frontend/js/shared/context/user-context.tsx b/services/web/frontend/js/shared/context/user-context.tsx
index 598455a5a9..97518a66cf 100644
--- a/services/web/frontend/js/shared/context/user-context.tsx
+++ b/services/web/frontend/js/shared/context/user-context.tsx
@@ -6,7 +6,7 @@ export const UserContext = createContext<User | LoggedOutUser | undefined>(
   undefined
 )
 
-export const UserProvider: FC = ({ children }) => {
+export const UserProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const user = useMemo(() => getMeta('ol-user'), [])
 
   return <UserContext.Provider value={user}>{children}</UserContext.Provider>
diff --git a/services/web/frontend/js/shared/context/user-features-context.tsx b/services/web/frontend/js/shared/context/user-features-context.tsx
new file mode 100644
index 0000000000..a162ae0540
--- /dev/null
+++ b/services/web/frontend/js/shared/context/user-features-context.tsx
@@ -0,0 +1,69 @@
+import {
+  createContext,
+  FC,
+  useCallback,
+  useContext,
+  useEffect,
+  useState,
+} from 'react'
+import { User } from '../../../../types/user'
+import { useUserContext } from './user-context'
+import { useReceiveUser } from '../hooks/user-channel/use-receive-user'
+import { getJSON } from '@/infrastructure/fetch-json'
+import { useEditorContext } from './editor-context'
+
+export const UserFeaturesContext = createContext<User['features']>(undefined)
+
+export const UserFeaturesProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const user = useUserContext()
+  const { writefullInstance } = useEditorContext()
+  const [features, setFeatures] = useState(user.features || {})
+
+  useReceiveUser(
+    useCallback(data => {
+      if (data?.features) {
+        setFeatures(data.features)
+      }
+    }, [])
+  )
+
+  useEffect(() => {
+    const listener = async ({ isPremium }: { isPremium: boolean }) => {
+      if (features?.aiErrorAssistant === isPremium) {
+        // the user is premium on writefull and has the AI assist, no need to refresh the features
+        return
+      }
+      const newFeatures = await getJSON('/user/features')
+      setFeatures(newFeatures)
+    }
+
+    writefullInstance?.addEventListener('writefull-login-complete', listener)
+
+    return () => {
+      writefullInstance?.removeEventListener(
+        'writefull-login-complete',
+        listener
+      )
+    }
+  }, [features?.aiErrorAssistant, writefullInstance])
+
+  return (
+    <UserFeaturesContext.Provider value={features}>
+      {children}
+    </UserFeaturesContext.Provider>
+  )
+}
+
+export function useUserFeaturesContext() {
+  const context = useContext(UserFeaturesContext)
+
+  if (!context) {
+    throw new Error(
+      'useUserFeaturesContext is only available inside UserFeaturesContext'
+    )
+  }
+
+  return context
+}
diff --git a/services/web/frontend/js/shared/context/user-settings-context.tsx b/services/web/frontend/js/shared/context/user-settings-context.tsx
index b9b6f22ad1..cc18c896fa 100644
--- a/services/web/frontend/js/shared/context/user-settings-context.tsx
+++ b/services/web/frontend/js/shared/context/user-settings-context.tsx
@@ -9,10 +9,11 @@ import {
   useEffect,
 } from 'react'
 
-import { UserSettings, Keybindings } from '../../../../types/user-settings'
+import { UserSettings } from '../../../../types/user-settings'
 import getMeta from '@/utils/meta'
-import useScopeValue from '@/shared/hooks/use-scope-value'
 import { userStyles } from '../utils/styles'
+import { canUseNewEditor } from '@/features/ide-redesign/utils/new-editor-utils'
+import { useIdeContext } from '@/shared/context/ide-context'
 
 const defaultSettings: UserSettings = {
   pdfViewer: 'pdfjs',
@@ -28,6 +29,7 @@ const defaultSettings: UserSettings = {
   mathPreview: true,
   referencesSearchMode: 'advanced',
   enableNewEditor: true,
+  breadcrumbs: true,
 }
 
 type UserSettingsContextValue = {
@@ -37,35 +39,30 @@ type UserSettingsContextValue = {
   >
 }
 
-type ScopeSettings = {
-  overallTheme: 'light' | 'dark'
-  keybindings: Keybindings
-  fontSize: number
-  fontFamily: string
-  lineHeight: number
-}
-
 export const UserSettingsContext = createContext<
   UserSettingsContextValue | undefined
 >(undefined)
 
-export const UserSettingsProvider: FC = ({ children }) => {
+export const UserSettingsProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
   const [userSettings, setUserSettings] = useState<UserSettings>(
     () => getMeta('ol-userSettings') || defaultSettings
   )
 
   // update the global scope 'settings' value, for extensions
-  const [, setScopeSettings] = useScopeValue<ScopeSettings>('settings')
+  const { unstableStore } = useIdeContext()
   useEffect(() => {
     const { fontFamily, lineHeight } = userStyles(userSettings)
-    setScopeSettings({
+    unstableStore.set('settings', {
       overallTheme: userSettings.overallTheme === 'light-' ? 'light' : 'dark',
       keybindings: userSettings.mode === 'none' ? 'default' : userSettings.mode,
       fontFamily,
       lineHeight,
       fontSize: userSettings.fontSize,
+      isNewEditor: canUseNewEditor() && userSettings.enableNewEditor,
     })
-  }, [setScopeSettings, userSettings])
+  }, [unstableStore, userSettings])
 
   const value = useMemo<UserSettingsContextValue>(
     () => ({
diff --git a/services/web/frontend/js/shared/hooks/use-active-overall-theme.tsx b/services/web/frontend/js/shared/hooks/use-active-overall-theme.tsx
new file mode 100644
index 0000000000..388c78cf38
--- /dev/null
+++ b/services/web/frontend/js/shared/hooks/use-active-overall-theme.tsx
@@ -0,0 +1,54 @@
+import { useUserSettingsContext } from '@/shared/context/user-settings-context'
+import { OverallTheme } from '@/shared/utils/styles'
+import { isIEEEBranded } from '@/utils/is-ieee-branded'
+import { useEffect, useMemo, useState } from 'react'
+
+export type ActiveOverallTheme = 'dark' | 'light'
+
+const mediaWatcher = window.matchMedia?.('(prefers-color-scheme: dark)') ?? {
+  // If matchMedia is not supported, use the default (dark) theme
+  matches: true,
+  addEventListener: () => {},
+  removeEventListener: () => {},
+}
+
+function getTheme(
+  overallTheme: OverallTheme,
+  prefersDark: boolean
+): ActiveOverallTheme {
+  if (isIEEEBranded()) {
+    return 'dark'
+  }
+  if (overallTheme === 'light-') {
+    return 'light'
+  }
+  if (overallTheme === 'system') {
+    return prefersDark ? 'dark' : 'light'
+  }
+  return 'dark'
+}
+
+export const useActiveOverallTheme = (): ActiveOverallTheme => {
+  const [browserPrefersDarkMode, setBrowserPrefersDarkMode] = useState(
+    mediaWatcher.matches
+  )
+  const {
+    userSettings: { overallTheme },
+  } = useUserSettingsContext()
+
+  const activeOverallTheme = useMemo<ActiveOverallTheme>(() => {
+    return getTheme(overallTheme, browserPrefersDarkMode)
+  }, [overallTheme, browserPrefersDarkMode])
+
+  useEffect(() => {
+    const listener = (e: MediaQueryListEvent) => {
+      setBrowserPrefersDarkMode(e.matches)
+    }
+    mediaWatcher.addEventListener('change', listener)
+    return () => {
+      mediaWatcher.removeEventListener('change', listener)
+    }
+  }, [])
+
+  return activeOverallTheme
+}
diff --git a/services/web/frontend/js/shared/hooks/use-debounce.ts b/services/web/frontend/js/shared/hooks/use-debounce.ts
index 5fee07b0c1..926a08af64 100644
--- a/services/web/frontend/js/shared/hooks/use-debounce.ts
+++ b/services/web/frontend/js/shared/hooks/use-debounce.ts
@@ -1,12 +1,6 @@
 import { useEffect, useState } from 'react'
 
-/**
- * @template T
- * @param {T} value
- * @param {number} delay
- * @returns {T}
- */
-export default function useDebounce<T>(value: T, delay = 0) {
+export default function useDebounce<T>(value: T, delay = 0): T {
   const [debouncedValue, setDebouncedValue] = useState(value)
 
   useEffect(() => {
diff --git a/services/web/frontend/js/shared/hooks/use-detach-layout.ts b/services/web/frontend/js/shared/hooks/use-detach-layout.ts
index 3b9bad8b7d..dbb19e0a90 100644
--- a/services/web/frontend/js/shared/hooks/use-detach-layout.ts
+++ b/services/web/frontend/js/shared/hooks/use-detach-layout.ts
@@ -100,7 +100,7 @@ export default function useDetachLayout() {
   }, [setRole, setIsLinked])
 
   const handleEventForDetacherFromDetached = useCallback(
-    message => {
+    (message: any) => {
       switch (message.event) {
         case 'connected':
           broadcastEvent('up')
@@ -118,7 +118,7 @@ export default function useDetachLayout() {
   )
 
   const handleEventForDetachedFromDetacher = useCallback(
-    message => {
+    (message: any) => {
       switch (message.event) {
         case 'connected':
           broadcastEvent('up')
@@ -140,7 +140,7 @@ export default function useDetachLayout() {
   )
 
   const handleEventForDetachedFromDetached = useCallback(
-    message => {
+    (message: any) => {
       switch (message.event) {
         case 'closed':
           broadcastEvent('up')
@@ -151,7 +151,7 @@ export default function useDetachLayout() {
   )
 
   const handleEvent = useCallback(
-    message => {
+    (message: any) => {
       if (role === 'detacher') {
         if (message.role === 'detacher') {
           handleEventForDetacherFromDetacher()
diff --git a/services/web/frontend/js/shared/hooks/use-dropdown.ts b/services/web/frontend/js/shared/hooks/use-dropdown.ts
index d5f7366dfb..2acea3085f 100644
--- a/services/web/frontend/js/shared/hooks/use-dropdown.ts
+++ b/services/web/frontend/js/shared/hooks/use-dropdown.ts
@@ -9,7 +9,7 @@ export default function useDropdown(defaultOpen = false) {
 
   // react-bootstrap v0.x passes `component` instead of `node` to the ref callback
   const handleRef = useCallback(
-    component => {
+    (component: any) => {
       if (component) {
         // eslint-disable-next-line react/no-find-dom-node
         ref.current = findDOMNode(component)
@@ -19,18 +19,18 @@ export default function useDropdown(defaultOpen = false) {
   )
 
   // prevent a click on the dropdown toggle propagating to the original handler
-  const handleClick = useCallback(event => {
+  const handleClick = useCallback((event: any) => {
     event.stopPropagation()
   }, [])
 
   // handle dropdown toggle
-  const handleToggle = useCallback(value => {
+  const handleToggle = useCallback((value: any) => {
     setOpen(Boolean(value))
   }, [])
 
   // close the dropdown on click outside the dropdown
   const handleDocumentClick = useCallback(
-    event => {
+    (event: any) => {
       if (ref.current && !ref.current.contains(event.target)) {
         setOpen(false)
       }
diff --git a/services/web/frontend/js/shared/hooks/use-editor-analytics.ts b/services/web/frontend/js/shared/hooks/use-editor-analytics.ts
new file mode 100644
index 0000000000..55a0235f76
--- /dev/null
+++ b/services/web/frontend/js/shared/hooks/use-editor-analytics.ts
@@ -0,0 +1,44 @@
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import {
+  Segmentation,
+  sendMB,
+  sendMBOnce,
+  sendMBSampled,
+} from '@/infrastructure/event-tracking'
+import { useCallback } from 'react'
+
+export const useEditorAnalytics = () => {
+  const editorRedesign = useIsNewEditorEnabled()
+
+  const populateSegmentation = useCallback(
+    (segmentation: Segmentation | undefined = {}): Segmentation => {
+      return editorRedesign
+        ? { ...segmentation, 'editor-redesign': 'enabled' }
+        : segmentation
+    },
+    [editorRedesign]
+  )
+
+  const sendEvent: typeof sendMB = useCallback(
+    (key, segmentation) => {
+      sendMB(key, populateSegmentation(segmentation))
+    },
+    [populateSegmentation]
+  )
+
+  const sendEventOnce: typeof sendMBOnce = useCallback(
+    (key, segmentation) => {
+      sendMBOnce(key, populateSegmentation(segmentation))
+    },
+    [populateSegmentation]
+  )
+
+  const sendEventSampled: typeof sendMBSampled = useCallback(
+    (key, segmentation, rate) => {
+      sendMBSampled(key, populateSegmentation(segmentation), rate)
+    },
+    [populateSegmentation]
+  )
+
+  return { sendEvent, sendEventOnce, sendEventSampled }
+}
diff --git a/services/web/frontend/js/shared/hooks/use-exposed-state.ts b/services/web/frontend/js/shared/hooks/use-exposed-state.ts
new file mode 100644
index 0000000000..781d23698a
--- /dev/null
+++ b/services/web/frontend/js/shared/hooks/use-exposed-state.ts
@@ -0,0 +1,19 @@
+import { type Dispatch, type SetStateAction, useState } from 'react'
+import { useUnstableStoreSync } from '@/shared/hooks/use-unstable-store-sync'
+
+/**
+ * Creates a state variable that is exposed via window.overleaf.unstable.store,
+ * which is used by Writefull (and only Writefull). Once Writefull is integrated
+ * into our codebase, it should be able to hook directly into our React
+ * contexts and we would then be able to remove this hook, replacing it with
+ * useState.
+ */
+export default function useExposedState<T = any>(
+  initialState: T | (() => T),
+  path: string
+): [T, Dispatch<SetStateAction<T>>] {
+  const [value, setValue] = useState<T>(initialState)
+  useUnstableStoreSync(path, value)
+
+  return [value, setValue]
+}
diff --git a/services/web/frontend/js/shared/hooks/use-location.ts b/services/web/frontend/js/shared/hooks/use-location.ts
index 9f4b3b470f..10df73455d 100644
--- a/services/web/frontend/js/shared/hooks/use-location.ts
+++ b/services/web/frontend/js/shared/hooks/use-location.ts
@@ -6,7 +6,7 @@ export const useLocation = () => {
   const isMounted = useIsMounted()
 
   const assign = useCallback(
-    url => {
+    (url: string) => {
       if (isMounted.current) {
         location.assign(url)
       }
@@ -15,7 +15,7 @@ export const useLocation = () => {
   )
 
   const replace = useCallback(
-    url => {
+    (url: string) => {
       if (isMounted.current) {
         location.replace(url)
       }
diff --git a/services/web/frontend/js/shared/hooks/use-persisted-state.ts b/services/web/frontend/js/shared/hooks/use-persisted-state.ts
index 1ff452ce4a..cfd2546ada 100644
--- a/services/web/frontend/js/shared/hooks/use-persisted-state.ts
+++ b/services/web/frontend/js/shared/hooks/use-persisted-state.ts
@@ -7,61 +7,59 @@ import {
 } from 'react'
 import _ from 'lodash'
 import localStorage from '../../infrastructure/local-storage'
-import { debugConsole } from '@/utils/debugging'
 
-const safeStringify = (value: unknown) => {
-  try {
-    return JSON.stringify(value)
-  } catch (e) {
-    debugConsole.error('double stringify exception', e)
-    return null
+type UsePersistedStateOptions<Value, PersistedValue> = {
+  listen?: boolean
+  converter?: {
+    toPersisted: (value: Value) => PersistedValue
+    fromPersisted: (persisted: PersistedValue) => Value
   }
 }
 
-const safeParse = (value: string) => {
-  try {
-    return JSON.parse(value)
-  } catch (e) {
-    debugConsole.error('double parse exception', e)
-    return null
-  }
-}
-
-function usePersistedState<T = any>(
+function usePersistedState<Value, PersistedValue = Value>(
   key: string,
-  defaultValue?: T,
-  listen = false,
-  // The option below is for backward compatibility with Angular
-  // which sometimes stringifies the values twice
-  doubleStringifyAndParse = false
-): [T, Dispatch<SetStateAction<T>>] {
+  defaultValue?: Value,
+  options?: UsePersistedStateOptions<Value, PersistedValue>
+): [Value, Dispatch<SetStateAction<Value>>] {
+  // Store the default value and options on first render so that they're stable
+  // and use them on subsequent renders. This is important for, for example, a
+  // non-primitive default value that should not change on every render.
+  const [allOptions] = useState<{
+    defaultValue?: Value
+    options?: UsePersistedStateOptions<Value, PersistedValue>
+  }>(() => ({ defaultValue, options }))
+  const listen = allOptions.options?.listen || false
+  const { toPersisted, fromPersisted } = allOptions.options?.converter || {}
+  const storedDefaultValue = allOptions.defaultValue
+
   const getItem = useCallback(
     (key: string) => {
       const item = localStorage.getItem(key)
-      return doubleStringifyAndParse ? safeParse(item) : item
+      return fromPersisted ? fromPersisted(item) : item
     },
-    [doubleStringifyAndParse]
+    [fromPersisted]
   )
   const setItem = useCallback(
-    (key: string, value: unknown) => {
-      const val = doubleStringifyAndParse ? safeStringify(value) : value
+    (key: string, value: Value) => {
+      // Nested ternary is convenient for type inference
+      const val = toPersisted ? toPersisted(value) : value
       localStorage.setItem(key, val)
     },
-    [doubleStringifyAndParse]
+    [toPersisted]
   )
 
-  const [value, setValue] = useState<T>(() => {
-    return getItem(key) ?? defaultValue
+  const [value, setValue] = useState<Value>(() => {
+    return getItem(key) ?? storedDefaultValue
   })
 
   const updateFunction = useCallback(
-    (newValue: SetStateAction<T>) => {
+    (newValue: SetStateAction<Value>) => {
       setValue(value => {
         const actualNewValue = _.isFunction(newValue)
           ? newValue(value)
           : newValue
 
-        if (actualNewValue === defaultValue) {
+        if (actualNewValue === storedDefaultValue) {
           localStorage.removeItem(key)
         } else {
           setItem(key, actualNewValue)
@@ -70,7 +68,7 @@ function usePersistedState<T = any>(
         return actualNewValue
       })
     },
-    [key, defaultValue, setItem]
+    [key, storedDefaultValue, setItem]
   )
 
   useEffect(() => {
@@ -79,7 +77,7 @@ function usePersistedState<T = any>(
         if (event.key === key) {
           // note: this value is read via getItem rather than from event.newValue
           // because getItem handles deserializing the JSON that's stored in localStorage.
-          setValue(getItem(key) ?? defaultValue)
+          setValue(getItem(key) ?? storedDefaultValue)
         }
       }
 
@@ -89,7 +87,7 @@ function usePersistedState<T = any>(
         window.removeEventListener('storage', listener)
       }
     }
-  }, [defaultValue, key, listen, getItem])
+  }, [storedDefaultValue, key, listen, getItem])
 
   return [value, updateFunction]
 }
diff --git a/services/web/frontend/js/shared/hooks/use-scope-value-setter-only.ts b/services/web/frontend/js/shared/hooks/use-scope-value-setter-only.ts
deleted file mode 100644
index 27564a1d6a..0000000000
--- a/services/web/frontend/js/shared/hooks/use-scope-value-setter-only.ts
+++ /dev/null
@@ -1,38 +0,0 @@
-import {
-  type Dispatch,
-  type SetStateAction,
-  useCallback,
-  useState,
-} from 'react'
-import { useIdeContext } from '../context/ide-context'
-import _ from 'lodash'
-
-/**
- * Similar to `useScopeValue`, but instead of creating a two-way binding, only
- * changes in react-> angular direction are propagated, with `value` remaining
- * local and independent of its value in the Angular scope.
- *
- * The interface is compatible with React.useState(), including
- * the option of passing a function to the setter.
- */
-export default function useScopeValueSetterOnly<T = any>(
-  path: string, // dot '.' path of a property in the Angular scope.
-  defaultValue?: T
-): [T | undefined, Dispatch<SetStateAction<T | undefined>>] {
-  const { scopeStore } = useIdeContext()
-
-  const [value, setValue] = useState<T | undefined>(defaultValue)
-
-  const scopeSetter = useCallback(
-    (newValue: SetStateAction<T | undefined>) => {
-      setValue(val => {
-        const actualNewValue = _.isFunction(newValue) ? newValue(val) : newValue
-        scopeStore.set(path, actualNewValue)
-        return actualNewValue
-      })
-    },
-    [path, scopeStore]
-  )
-
-  return [value, scopeSetter]
-}
diff --git a/services/web/frontend/js/shared/hooks/use-scope-value.ts b/services/web/frontend/js/shared/hooks/use-scope-value.ts
deleted file mode 100644
index 594a71f92a..0000000000
--- a/services/web/frontend/js/shared/hooks/use-scope-value.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import {
-  type Dispatch,
-  type SetStateAction,
-  useCallback,
-  useEffect,
-  useState,
-} from 'react'
-import _ from 'lodash'
-import { useIdeContext } from '../context/ide-context'
-
-/**
- * Binds a property in an Angular scope making it accessible in a React
- * component. The interface is compatible with React.useState(), including
- * the option of passing a function to the setter.
- *
- * The generic type is not an actual guarantee because the value for a path is
- * returned as undefined when there is nothing in the scope store for that path.
- */
-export default function useScopeValue<T = any>(
-  path: string // dot '.' path of a property in the Angular scope
-): [T, Dispatch<SetStateAction<T>>] {
-  const { scopeStore } = useIdeContext()
-
-  const [value, setValue] = useState<T>(() => scopeStore.get(path))
-
-  useEffect(() => {
-    return scopeStore.watch<T>(path, (newValue: T) => {
-      // NOTE: this is deliberately wrapped in a function,
-      // to avoid calling setValue directly with a value that's a function
-      setValue(() => newValue)
-    })
-  }, [path, scopeStore])
-
-  const scopeSetter = useCallback(
-    (newValue: SetStateAction<T>) => {
-      setValue(val => {
-        const actualNewValue = _.isFunction(newValue) ? newValue(val) : newValue
-        scopeStore.set(path, actualNewValue)
-        return actualNewValue
-      })
-    },
-    [path, scopeStore]
-  )
-
-  return [value, scopeSetter]
-}
diff --git a/services/web/frontend/js/shared/hooks/use-stop-on-first-error.ts b/services/web/frontend/js/shared/hooks/use-stop-on-first-error.ts
index 05dc7e36e6..b85c7a0e7d 100644
--- a/services/web/frontend/js/shared/hooks/use-stop-on-first-error.ts
+++ b/services/web/frontend/js/shared/hooks/use-stop-on-first-error.ts
@@ -10,7 +10,7 @@ type UseStopOnFirstErrorProps = {
 export function useStopOnFirstError(opts: UseStopOnFirstErrorProps = {}) {
   const { eventSource } = opts
   const { stopOnFirstError, setStopOnFirstError } = useCompileContext()
-  const { _id: projectId } = useProjectContext()
+  const { projectId } = useProjectContext()
 
   type Opts = {
     projectId: string
diff --git a/services/web/frontend/js/shared/hooks/use-unstable-store-sync.ts b/services/web/frontend/js/shared/hooks/use-unstable-store-sync.ts
new file mode 100644
index 0000000000..6285159c02
--- /dev/null
+++ b/services/web/frontend/js/shared/hooks/use-unstable-store-sync.ts
@@ -0,0 +1,11 @@
+import { useIdeContext } from '@/shared/context/ide-context'
+import { useEffect } from 'react'
+
+export function useUnstableStoreSync<T = any>(path: string, value: T) {
+  const { unstableStore } = useIdeContext()
+
+  // Update the unstable store whenever the value changes
+  useEffect(() => {
+    unstableStore.set(path, value)
+  }, [unstableStore, path, value])
+}
diff --git a/services/web/frontend/js/shared/hooks/use-viewer-permissions.ts b/services/web/frontend/js/shared/hooks/use-viewer-permissions.ts
index 5f6e7f1f72..269d094b27 100644
--- a/services/web/frontend/js/shared/hooks/use-viewer-permissions.ts
+++ b/services/web/frontend/js/shared/hooks/use-viewer-permissions.ts
@@ -1,7 +1,7 @@
-import { useEditorContext } from '../context/editor-context'
+import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
 
 function useViewerPermissions() {
-  const { permissionsLevel } = useEditorContext()
+  const { permissionsLevel } = useIdeReactContext()
   return permissionsLevel === 'readOnly'
 }
 
diff --git a/services/web/frontend/js/shared/hooks/user-channel/use-user-channel.ts b/services/web/frontend/js/shared/hooks/user-channel/use-user-channel.ts
index 29ae421a12..b00041c539 100644
--- a/services/web/frontend/js/shared/hooks/user-channel/use-user-channel.ts
+++ b/services/web/frontend/js/shared/hooks/user-channel/use-user-channel.ts
@@ -8,7 +8,7 @@ export const useUserChannel = (): BroadcastChannel | null => {
   }
 
   useEffect(() => {
-    return () => channelRef.current?.close()
+    return () => channelRef.current?.close?.()
   }, [])
 
   return channelRef.current
diff --git a/services/web/frontend/js/shared/svgs/dropbox-logo-black.tsx b/services/web/frontend/js/shared/svgs/dropbox-logo-black.tsx
index 8c75e7cfd7..b93e22c112 100644
--- a/services/web/frontend/js/shared/svgs/dropbox-logo-black.tsx
+++ b/services/web/frontend/js/shared/svgs/dropbox-logo-black.tsx
@@ -1,8 +1,8 @@
-function DropboxlLogoBlack() {
+function DropboxLogoBlack({ size = 20 }: { size?: number }) {
   return (
     <svg
-      width="20"
-      height="20"
+      width={size}
+      height={size}
       viewBox="0 0 20 20"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
@@ -43,4 +43,4 @@ function DropboxlLogoBlack() {
   )
 }
 
-export default DropboxlLogoBlack
+export default DropboxLogoBlack
diff --git a/services/web/frontend/js/shared/svgs/dropbox-logo.tsx b/services/web/frontend/js/shared/svgs/dropbox-logo.tsx
index 2142ebe73d..e95a443d26 100644
--- a/services/web/frontend/js/shared/svgs/dropbox-logo.tsx
+++ b/services/web/frontend/js/shared/svgs/dropbox-logo.tsx
@@ -7,7 +7,7 @@ function DropboxLogo({ size = 40 }: { size?: number }) {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
     >
-      <rect width="40" height="40" fill="white" />
+      <rect width="40" height="40" fill="none" />
       <g clipPath="url(#clip0_10_138)">
         <path
           d="M10.8328 4.33334L1.6665 10.1732L10.8328 16.0131L20.0006 10.1732L10.8328 4.33334Z"
diff --git a/services/web/frontend/js/shared/svgs/facebook-logo.tsx b/services/web/frontend/js/shared/svgs/facebook-logo.tsx
index 700665f138..ec0a791e7e 100644
--- a/services/web/frontend/js/shared/svgs/facebook-logo.tsx
+++ b/services/web/frontend/js/shared/svgs/facebook-logo.tsx
@@ -5,15 +5,7 @@ function FacebookLogo() {
       height="25"
       viewBox="0 0 666.66668 666.66717"
     >
-      <defs>
-        <clipPath id="a" clipPathUnits="userSpaceOnUse">
-          <path d="M0 700h700V0H0Z" />
-        </clipPath>
-      </defs>
-      <g
-        clipPath="url(#a)"
-        transform="matrix(1.33333 0 0 -1.33333 -133.333 800)"
-      >
+      <g transform="matrix(1.33333 0 0 -1.33333 -133.333 800)">
         <path
           d="M0 0c0 138.071-111.929 250-250 250S-500 138.071-500 0c0-117.245 80.715-215.622 189.606-242.638v166.242h-51.552V0h51.552v32.919c0 85.092 38.508 124.532 122.048 124.532 15.838 0 43.167-3.105 54.347-6.211V81.986c-5.901.621-16.149.932-28.882.932-40.993 0-56.832-15.528-56.832-55.9V0h81.659l-14.028-76.396h-67.631v-171.773C-95.927-233.218 0-127.818 0 0"
           fill="#0866ff"
diff --git a/services/web/frontend/js/shared/svgs/git-bridge-logo.tsx b/services/web/frontend/js/shared/svgs/git-bridge-logo.tsx
deleted file mode 100644
index d5c92aa075..0000000000
--- a/services/web/frontend/js/shared/svgs/git-bridge-logo.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-function GitBridgeLogo({ size = 40 }: { size?: number }) {
-  return (
-    <svg
-      width={size}
-      height={size}
-      viewBox="0 0 40 40"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      xmlnsXlink="http://www.w3.org/1999/xlink"
-    >
-      <rect width="40" height="40" fill="url(#pattern0)" />
-      <defs>
-        <pattern
-          id="pattern0"
-          patternContentUnits="objectBoundingBox"
-          width="1"
-          height="1"
-        >
-          <use xlinkHref="#image0_200_2157" transform="scale(0.00261097)" />
-        </pattern>
-        <image
-          id="image0_200_2157"
-          width="383"
-          height="383"
-          xlinkHref="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAX8AAAF/CAYAAAChRMlnAAAMbWlDQ1BJQ0MgUHJvZmlsZQAASImVVwdYU8kWnluSkJDQAghICb0JIjWAlBBaAOlFEJWQBBJKjAlBxV4WFVy7iGJFV0UU2wqIKIhdWRR7XyyoKOuiLjZU3oQEdN1Xvne+b+79c+bMf8qdyb0HAM0PXIkkD9UCIF9cII0PC2KMTU1jkJ4BBGCADFBgy+XJJKzY2CgAZfD+d3l3A1pDueqk4Prn/H8VHb5AxgMASYc4ky/j5UPcDAC+gSeRFgBAVOgtpxRIFHgOxLpSGCDEqxU4W4l3KXCmEjcO2CTGsyG+DIAalcuVZgOgcQ/qGYW8bMij8RliFzFfJAZAcwTE/jwhlw+xIvYR+fmTFLgcYjtoL4EYxgOYmd9xZv+NP3OIn8vNHsLKvAZELVgkk+Rxp/2fpfnfkp8nH/RhAwdVKA2PV+QPa3grd1KkAlMh7hZnRscoag3xBxFfWXcAUIpQHp6ktEeNeTI2rB/Qh9iFzw2OhNgY4lBxXnSUSp+ZJQrlQAx3CzpVVMBJhNgA4kUCWUiCymaLdFK8yhdamyVls1T6c1zpgF+Frwfy3CSWiv+NUMBR8WMaRcLEFIgpEFsVipKjIdaA2FmWmxCpshldJGRHD9pI5fGK+K0gjheIw4KU/FhhljQ0XmVfki8bzBfbIhRxolX4YIEwMVxZH+wUjzsQP8wFuywQs5IGeQSysVGDufAFwSHK3LHnAnFSgorng6QgKF65FqdI8mJV9riFIC9MobeA2F1WmKBaiycXwM2p5MezJAWxico48aIcbkSsMh58OYgCbBAMGEAORyaYBHKAqK27rhv+Us6EAi6QgmwgAE4qzeCKlIEZMbwmgCLwB0QCIBtaFzQwKwCFUP9lSKu8OoGsgdnCgRW54CnE+SAS5MHf8oFV4iFvyeAJ1Ij+4Z0LBw/GmweHYv7f6we13zQsqIlSaeSDHhmag5bEEGIwMZwYSrTHjXB/3BePgtdAOFxxJu49mMc3e8JTQjvhEeE6oYNwe6JonvSHKMeADsgfqqpF5ve1wG0gpwcehPtBdsiM6+NGwAl3h35YeAD07AG1bFXciqowfuD+WwbfPQ2VHdmFjJKHkQPJdj+u1HDQ8BhiUdT6+/ooY80cqjd7aOZH/+zvqs+H98gfLbFF2CHsLHYCO481YnWAgTVh9VgrdkyBh3bXk4HdNegtfiCeXMgj+oe/wSerqKTMpdqly+Wzcq5AMLVAcfDYkyTTpKJsYQGDBd8OAgZHzHMewXB1cXUDQPGuUf59vY0beIcg+q3fdPN/B8Cvqb+//+g3XUQTAAe84PE/8k1nxwRAWx2Ac0d4cmmhUocrLgT4L6EJT5ohMAWWwA7m4wo8gS8IBCEgAsSARJAKJsDohXCfS8EUMAPMBcWgFCwHa8B6sBlsA7vAXnAQ1IFGcAKcARfBZXAd3IW7pxO8BD3gHehDEISE0BA6YoiYIdaII+KKMBF/JASJQuKRVCQDyUbEiByZgcxHSpGVyHpkK1KFHECOICeQ80g7cht5iHQhb5BPKIZSUV3UBLVBR6JMlIVGoonoeDQbnYwWoQvQpWg5WonuQWvRE+hF9Dragb5EezGAqWP6mDnmhDExNhaDpWFZmBSbhZVgZVglVoM1wOd8FevAurGPOBGn4wzcCe7gcDwJ5+GT8Vn4Enw9vguvxU/hV/GHeA/+lUAjGBMcCT4EDmEsIZswhVBMKCPsIBwmnIZnqZPwjkgk6hNtiV7wLKYSc4jTiUuIG4n7iM3EduJjYi+JRDIkOZL8SDEkLqmAVExaR9pDaiJdIXWSPqipq5mpuaqFqqWpidXmqZWp7VY7rnZF7ZlaH1mLbE32IceQ+eRp5GXk7eQG8iVyJ7mPok2xpfhREik5lLmUckoN5TTlHuWturq6hbq3epy6SH2Oern6fvVz6g/VP1J1qA5UNjWdKqcupe6kNlNvU9/SaDQbWiAtjVZAW0qrop2kPaB90KBrOGtwNPgaszUqNGo1rmi80iRrWmuyNCdoFmmWaR7SvKTZrUXWstFia3G1ZmlVaB3RuqnVq03XHqUdo52vvUR7t/Z57ec6JB0bnRAdvs4CnW06J3Ue0zG6JZ1N59Hn07fTT9M7dYm6troc3RzdUt29um26PXo6eu56yXpT9Sr0jul16GP6Nvoc/Tz9ZfoH9W/ofxpmMow1TDBs8bCaYVeGvTcYbhBoIDAoMdhncN3gkyHDMMQw13CFYZ3hfSPcyMEozmiK0Saj00bdw3WH+w7nDS8ZfnD4HWPU2ME43ni68TbjVuNeE1OTMBOJyTqTkybdpvqmgaY5pqtNj5t2mdHN/M1EZqvNmsxeMPQYLEYeo5xxitFjbmwebi4332reZt5nYWuRZDHPYp/FfUuKJdMyy3K1ZYtlj5WZ1RirGVbVVnesydZMa6H1Wuuz1u9tbG1SbBba1Nk8tzWw5dgW2Vbb3rOj2QXYTbartLtmT7Rn2ufab7S/7IA6eDgIHSocLjmijp6OIseNju0jCCO8R4hHVI646UR1YjkVOlU7PXTWd45ynudc5/xqpNXItJErRp4d+dXFwyXPZbvL3VE6oyJGzRvVMOqNq4Mrz7XC9ZobzS3UbbZbvdtrd0d3gfsm91sedI8xHgs9Wjy+eHp5Sj1rPLu8rLwyvDZ43WTqMmOZS5jnvAneQd6zvRu9P/p4+hT4HPT509fJN9d3t+/z0bajBaO3j37sZ+HH9dvq1+HP8M/w3+LfEWAewA2oDHgUaBnID9wR+Ixlz8ph7WG9CnIJkgYdDnrP9mHPZDcHY8FhwSXBbSE6IUkh60MehFqEZodWh/aEeYRND2sOJ4RHhq8Iv8kx4fA4VZyeCK+ImRGnIqmRCZHrIx9FOURJoxrGoGMixqwacy/aOlocXRcDYjgxq2Lux9rGTo49GkeMi42riHsaPyp+RvzZBHrCxITdCe8SgxKXJd5NskuSJ7UkayanJ1clv08JTlmZ0jF25NiZYy+mGqWKUuvTSGnJaTvSeseFjFszrjPdI704/cZ42/FTx5+fYDQhb8KxiZoTuRMPZRAyUjJ2Z3zmxnArub2ZnMwNmT08Nm8t7yU/kL+a3yXwE6wUPMvyy1qZ9TzbL3tVdpcwQFgm7BaxRetFr3PCczbnvM+Nyd2Z25+XkrcvXy0/I/+IWEecKz41yXTS1EntEkdJsaRjss/kNZN7pJHSHTJENl5WX6ALP+pb5Xbyn+QPC/0LKwo/TEmecmiq9lTx1NZpDtMWT3tWFFr0y3R8Om96ywzzGXNnPJzJmrl1FjIrc1bLbMvZC2Z3zgmbs2suZW7u3N/mucxbOe+v+SnzGxaYLJiz4PFPYT9VF2sUS4tvLvRduHkRvki0qG2x2+J1i7+W8EsulLqUlpV+XsJbcuHnUT+X/9y/NGtp2zLPZZuWE5eLl99YEbBi10rtlUUrH68as6p2NWN1yeq/1kxcc77MvWzzWspa+dqO8qjy+nVW65av+7xeuP56RVDFvg3GGxZveL+Rv/HKpsBNNZtNNpdu/rRFtOXW1rCttZU2lWXbiNsKtz3dnrz97C/MX6p2GO0o3fFlp3hnx674XaeqvKqqdhvvXlaNVsuru/ak77m8N3hvfY1TzdZ9+vtK94P98v0vDmQcuHEw8mDLIeahml+tf91wmH64pBapnVbbUyes66hPrW8/EnGkpcG34fBR56M7G80bK47pHVt2nHJ8wfH+pqKm3mZJc/eJ7BOPWya23D059uS1U3Gn2k5Hnj53JvTMybOss03n/M41nvc5f+QC80LdRc+Lta0erYd/8/jtcJtnW+0lr0v1l70vN7SPbj9+JeDKiavBV89c41y7eD36evuNpBu3bqbf7LjFv/X8dt7t13cK7/TdnXOPcK/kvtb9sgfGDyp/t/99X4dnx7GHwQ9bHyU8uvuY9/jlE9mTz50LntKelj0ze1b13PV5Y1do1+UX4150vpS87Osu/kP7jw2v7F79+mfgn609Y3s6X0tf979Z8tbw7c6/3P9q6Y3tffAu/13f+5IPhh92fWR+PPsp5dOzvimfSZ/Lv9h/afga+fVef35/v4Qr5Q58CmBwoFlZALzZCQAtFQA67Nso45S94IAgyv51AIH/hJX94oB4AlADv9/juuHXzU0A9m+H7Rfk14S9aiwNgERvgLq5DQ2VyLLcXJVcVNinEB7097+FPRtpFQBflvf391X293/ZBoOFvWOzWNmDKoQIe4YtnC+Z+Zng34iyP/0uxx/vQBGBO/jx/i981JDB0jbYuwAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAABf6ADAAQAAAABAAABfwAAAACdlrLLAAAiJUlEQVR4Ae2d65UbOZKF1XPmf9OD4VogetC5FkyZwPWg1oKp9UBjwaA90FiwORYM24Jle0BZoL0hVbZYLD7yASQCwIdzIBYzkUDgi8C9rNLrpw80CNRN4Enb26l36lv1v6hfa1908fDae71aP6nTIAABCECgEAKd4gzqJt5fF/TPevZJnQYBCEAAAo4J7BXbUX2J4F971ubcq9MgAAEIQMARgZ1i6dWvCXfMawet0anTIAABCEAgM4EXrR9T4MfM9SnznlkeAhCAQLMENtr5Z/UxYp1ijH0XYDHQIAABCEBgJQImuia+KUR9ypwWw1adBgEIQAACiQl4Ef7BJE7a7y7xnpkeAhCAQNMEvAk/BtB0ObJ5CEBgDQJehR8DWCP7rAEBCDRJwLvwYwBNliWbhgAEUhIoRfgxgJRVwNwQgEBTBEoTfgygqfJksxCAQAoCpQo/BpCiGpgTAhBogkDpwo8BNFGmbBICEIhJoBbhxwBiVgVzQQACVROoTfgxgKrLlc1BAAIxCNQq/BhAjOpgDghAoEoCtQs/BlBl2bIpCEBgCYFWhB8DWFIlPAsBCFRFoDXhxwCqKl82AwEIzCHQqvBjAHOqhWcgAIEqCLQu/BhAFWXMJiAAgSkEEP63/wnNSfB2UwAyFgIQgEBpBBD+t8LPdwClVTDxQgACkwkg/NeFHwOYXEo8AAEIlEIA4b8v/BhAKZVMnBCAwGgCCP844ccARpcUAyEAAe8EEP5pwo8BeK9o4oMABB4SQPjnCT8G8LC0GAABCHglgPAvE34MwGtlExcEIHCTAMIfR/gxgJslxg0IQMAbAYQ/rvBjAN4qnHggAIF3BBD+NMKPAbwrNS5AAAJeCCD8aYUfA/BS6cQBAQj8QQDhX0f4MYA/So4vIACB3AQQ/nWFHwPIXfGsDwEIfED48wg/BsDhgwAEshFA+PMKPwaQrfRZGALtEkD4fQg/BtDuGWTnEFidAMLvS/gxgNWPAAtCoD0CCL9P4ccA2juLUXb8pyizMAkEIJCbwM8KoFff5Q6E9SEAgfoI8Onf96d/+y7gpI4B1Hf22BEEshPAADCA7EVIABCAQB4CGAAGkKfyWBUCEMhOAAPAALIXIQFAAAJ5CGAAGECeymNVCEAgOwEMAAPIXoQEAAEI5CGAAWAAeSqPVSEAgewEMAAMIHsREgAEIJCHAAaAAeSpPFaFAASyE8AAMIDsRUgAEIBAHgIYAAaQp/JYFQIQyE4AA8AAshchAUAAAnkIYAAYQJ7KY1UIQCA7AQwAA8hehAQAAQjkIYABYAB5Ko9VIdA4ARPf3A0DwABy1yDrQ6ApAoPoBge7HmIZ/vcpXv0Zwkl1snNQK4QAAQgsIHAptmHBXLEevYwJA8AAYtUW80AAAiJwS2SDAzq3YsMI/BjBSXWyc1ArhAABCEwg8Ehcw4S5Ug19FCNGkN8IMIBU1c+8EEhAYKyohgRrT51ybKwYQT4jwACmVjXjIZCBwFQxDRlivFxyaswYwfpGgAFcVi3vIeCIwFwRDQ72MDd2jGA9I8AAHBwUQoDAJYGl4hkuJ8zwfukeMIL0RoABZDgYLAmBWwRiiWa4tcCK12PtBSNIZwQYwIoHgqUgcItAbLEMtxZa8XrsPWEE8Y0AA1jxQLAUBC4JpBLJcLlQhvep9oYRxDMCDCDDwWBJCKQWx+AAceo9YgTLjQADcHBQCKEdAmuJYnCAdK29YgTzjQADcHBQCKF+AmuLYXCAdO09YwTTjQADcHBQCKFeArlEMDhAmmvvGMF4I8AAHBwUQqiPQG7xCw6Q5maAETw2AgzAwUEhhHoIeBG94ACpFxYYwW0jwAAcHBRCKJ+AN7ELDpB6Y4IRvDcCDMDBQSGEcgl4FbngAKlXNhjBDyPAABwcFEIoj4B3cQsOkHpnhBF8+IABODgohFAOgVJELThAWgqrlo0AA3BwUAjBP4HSxCw4QFoasxaNAANwcFAIwS+BUkUsOEBaKruWjAADcHBQCMEfgdLFKzhAWjrDFowAA3BwUAjBD4FaRCs4QFoLy5qNAANwcFAshJ+cxNFqGCZWvfrHSgD8qn3sM+/lEdN/vcZ30KsJ0dC2+sK6PV9LPrQVl+2LourULQc0CDRHwETGir+2T3nBQSYHtifFYvHs1XfqU1qnwc/qn9Vry5GH/VhupuZEj9AgUDaBjcI/qHs4hCliCGWn5130lq+9es05S1EHj+Y8ielOnQaBJgiYkLQgIqHSbHbaV6/+SNi4P44RBqBiotVPoBXhH4QvVJzSTntrwcSHXKZ8xQAqPihs7ftvJLYoFqHy5L9ofymFsZW5MYDKD0qr29to4y0K/yBcofLE77S/o/qwX17nscAAKj8orW2vdeEfhDBUnnjyPE/wh/oYXjGAyg9KK9tDEN4KQu0GYHVtexyEjNd5LDAAqyRasQQQ/usHPxSb0fGB2x4R/mUMMIDx9cZIRwQQ/vsHPzjKVapQDpoYA1jGAANIVZ3Mm4QAwj/uwIck9P1ManVwVMcAljHAAPzUNJHcIYDwTzvo4Q7LGm7ttAnEfzkDDKCG01DxHhD+eYc8VFwTtrVndQxgOQMMoPKDUur2EP5lhzuUmviRcR80DgNYzgADGFlwDFuHAMK//FCbMIZ10pVllU6rIv5xGGAAWUqYRS8JIPxxDvQgjOEScEXve+1l2Cevy1hgABUdjBK3gvAvO8C3BDCUWAwjYu405taeuT6dDQYwougYEp8Awj/9sE4RuKf4KXMxY68opnBg7H1eGICLsm4nCIT//oFcKlh2oI1xjW2vTS3lw/NvGWIANZ4Uh3tC+N8evBRCFBzmPVZIVj8pmLU+JwYwo0L/NOOZVh+xg9ur8597p62Az2mnzzq7idQ/s0ZQ5+I/a1u9+q7O7aXZFeI/jivCP45TjFF9jEkcz1H7/nKhxwAmkkf8HwND+B8zijXiN01kn45rbn3Nm8u8NwxgQgIQ//uwEP77fGLf7WNP6HC+g8OYagoJAxiZTcT/NiiE/zabVHdq/9Q/cLPvcGjpCGAAI9gi/tchIfzXuaS+2qdewMn8rZhcTtwYwAP6iP97QAj/eyZciUvgEHc6ZrtBAAO4AcYuI/5v4SD8b3ms/a6VT8St7HPt+rm2HgZwjYquIf4/wCD8P1jk+uqQa2HWrZoABnAlvYj/dygI/5XiyHDJ8kCDQAoCGMAFVcT/+78j04vLxws2vF2fwG79JVmxIQIYwFmyWxd/PvGfFQNfrkYAk1sN9buFMIBXJC2LP8L/7lxkv7DNHsE6AVjt0fIRwADEvlXxR/jzHbx7K2/v3azoHp/88yezeQNoUfwR/vwH71YELYjiVps34aHlJ9C0AbQm/gh//gN3L4Lu3s1K7rVgcCWlqlkDaEn8EX7/R9IOYu3i+OQ/Dc1F2KQBtCL+CH8557krJ9RZkda+v1lQHDzUnAG0IP4Iv4OTNSGE/YSxJQ61eqT5JNCUAdQu/gi/z0N2L6qPurm7N6Dwe53i/1L4HmoOvxkDqFn8Ef5yj+hzuaE/jPygEZ06BvAQVbYBzRhANsIJFzbht0P2lV4sg61yV3PbaXMndWrULwPLj+WJVgiBjeI8qHOoymYQCqm3JWGasJzUqVW/DCw/lieacwIbxXdQ5zDVwaCFQ2d7PFGzrs+s5aeFWtQ2y2wbhX1QR/jrYdCXWYqTozZhOalTu34ZWH4sTzRnBDaK56DO4amPwbOzWksVjgnLiRp2fYYtP5YnmhMCG8VxUEf462XQyoGzfZ6oZddn2fJTRT3+pI2U3DYKvle3PxtOq5eA/bHIrbodvNqbCUuvbn/ckOaTgNVjp37wGd64qEr+c/4I/7gc1zBq+HPXlvPamwlKp87fA/Cb6aEed35DrDcyEwE7JPyopy0GlnPLfQttp02e1KlxvwwsP5Yn2koENlrnoM6haJOB5d5qoIW20yZP6tS6XwaWH8sTLTGBjeY/qHMY2mZwVA20cuBsnydq3vWZt/y0Uo/a6vptoyUP6gg/DIYaeF6/DLOsaMJyovZdn33Lj+WJFpnARvMd1IdDzysshhroVRdb9dqbCctJfdg3r/5YWH4sT7RIBDaa56BOscPgXg18Uo1YrdTcdtrcSf0eB+7l5WP5sTzRFhLY6PmDOgUNgzE1YAcvqFvd1Np22pjtcwwPxuThZPmxPNFmEtjouYM6BQyDqTXQzay5Uh4zYTmpT+XC+PWYWX4sT26b17/ktRGxXp2/ueu2dJoOLPehPoh+p85fBPNbhu7/IphH8Uf4/RY0kX0n8Ekv+8wwMIDMCRixvGsD8Cb+CP+IimKICwL/UBT7zJFgAJkTMGJ5twbgSfwR/hGVxBBXBDAAV+lwG4xLA/Ai/gi/27olsAcEMIAHgLj9jYA7A/Ag/gg/p6N0AhhA6RlcJ35XBpBb/BH+dYqOVdITwADSM65hBTcGkFP8Ef4aSpk9nBPAAM5p8PUtAi4MIJf4I/y3yoLrpRPAAErP4DrxZzeAHOKP8K9TXKySjwAGkI99SStnNYC1xR/hL6k0iXUJAQxgCb12ns1mAGuKP8LfTkGz0+8EMAAqYQyBLAawlvgj/GNKgDE1EsAAasxq/D2tbgBriD/CH79QmLEsAhhAWfnKFe2qBpBa/BH+XGXEut4IYADeMuIzntUMIKX4I/w+i4uo8hHAAPKxL2nlVQwglfgj/CWVGrGuSQADWJN2uWslN4AU4o/wl1twRL4OAQxgHc6lr5LUAGKLP8JferkR/1oEMIC1SJe9TjIDiCn+CH/ZRUb06xPAANZnXuKKSQwglvgj/CWWFDF7IIABeMiC/xiiG0AM8Uf4/RcOEfomgAH4zo+X6KIawJ8X7grhXwiQxyHwSsAMwFr49mueXw5atlPv1U1ozttvemP3j2ddX/7RTAt26sPrL3/c4YuYBAYD6DSp5SNLsyTb4l/pMHBWA53iSdl6TZ6q7vcpAx85907jevVP6p363NbpQZvjqJ6KV6vznsTU8rR622jFg3qr4Nm379x3iU9En7j294njzzG9CVVQ5+zEY3AST+M6q835mf9GK/XqH2etyEMQgMAjAv/QgP2jQYXdP7zu6T/0+vfCYvca7vAjoFkGMFX8EX6vZUBctRGo0QAsR0f1Z3UzgX+p05YRmG0AU8Qf4V+WJJ6GwFQCtRqAcTiqd+r/pf5FnTafwCwDGCv+CP/8xPAkBJYQqNkAjEtQ79TtTxPR5hOYbABjxB/hn58QnoRADAK1G8BBkDp1fgy0rFomGcAj8Uf4lyWDpyEQi0DtBnASqE7911jAGp1ntAHcE3+Ev9HqYdtuCdRuAAZ+r44BGIn5bZQB3BJ/hH8+eJ6EQEoCLRjAswDyewDLqmgwgO2taW6Jf9ADH289xHUIQCArgdoNYPgREH8KaFmZmQF8VrcP8+/aNfF/0ai/vhvJBQhAwBOBFgzgyRPwQmOxD/FmAO/apfjvNOJv70ZxAQIQ8EigdgPoBf3vHsEXFtMvivflMuZL8f90OYD3EICAawK1G8CL6P/uOgNlBGcf6u3D/R/tXPz3umoOQYMABMoiULMBnJSKl7LS4TbaNx/uz8UfwG5zRmAQeEigZgMI2j2f/h+WwMMB9uH+aRg1iH+nC38ZLvIKAQgUSaBmA3gpMiP+gn4eQhrEfz9c4BUCECiawJtv7Yveydvgg97y6f8tkznv7NP/zh4cxP+PbwXmzMYzEICAGwKf3UQSP5Ca9xaf1u0Zn+2Wib8Jv/1lABoEIFA+gU/lb+HmDsLNO9yYQsA0/5v476Y8xVgIQMAtAfsbsQe30S0PzPbGj36Wc7QP+zv75N8tn4sZIAABBwR6BzGkDqGFPaZmaPN3Jv5b+4oGAQgUT6AvfgePN9DCHh9TWD7i2yd//ojncpDMAAEPBGr+kc/A9zh8wesiAlv75E+DAATqINCC+Pd1pCr7Lr598s8eBQFAAAJRCJyizMIkLRD4mU/+LaSZPbZAoKU/BfOvFhKaeo+If2rCzA+BdQgc11mGVWohgPjXkkn2AQEIQGACARN//qu0CcAYCgEIQKACAr+Z+LfwJwQqyBVbgMBdAtu7d+u6ualrO1l2c0L8s3BnUQhEJ9DS39ex/5eWtozAwcS/XzYHT0MAAk4I8InYSSIKCAPxLyBJhAiBsQR2YwcWPK4rOHZPoff2yf+k/k9PURELBCAwi0A366myHmrB4FJn5DctcDTxtxa+/covEIBAyQRaEMYW9pi6BoMtMIj/Z33d0t8QtL3TIFAbga62DV3Zz9OVa1yaRiDY8EH87esX+4UGAQgUS8D+k46axdE+9fO/Di4rz1/1+MmmOBf/oPf2syAaBCBQLoGaxf+53LS4ifxliORc/O0acAcyvEKgTAIm/psyQ78bte3J9kabT+DvevQ4PH4p/r1u2AAaBCBQJgH7sci+zNDvRm3Cz4987iK6e9N+T/flfMSl+Nu9Z3V+/HNOia8hUBYBO8O1tZfaNrTyfvZa73S+5jXxt/udOgZgJGgQKI+A/VMPL+WFfTNiM7OW/vmKmyBm3vhvPddfPntL/M0h9upfLh/gPQQgUAQBE8xNEZHeD9L28HJ/CHfvELA/3fPp2v1b4m9jD+qdOgYgCDQIFEbAfj4eCov5Wri2B37Wf43M42sm/Ptbw+6Jvz2DAdwix3UI+CfwV4W49x/mzQifdMf2QJtO4K7w23SPxN/GYABGgQaBMgl8Uti7AkO3mEOBcXsI+aHwW5BjxN/GYQBGgQaB8ggMP/7ZFBS6xRrU+XHP9KSNEn6bdqz421gMwCjQIFAegY8KuVcvwQAsRovVYqZNIzBa+G3aKeJv4zEAo0CDQHkESjAAhH9+XU0SfltmqvjbMxiAUaBBoDwCng0A4Z9fT5OF35aaI/72HAZgFGgQKI+AGcBRvVP30nYK5KjOj3qmZ2SW8Nsyc8XfnsUAjAINAuUR+Fkh/6/6i4PQLYZ/q1tMtGkEZgu/LbNE/O15DMAo0CBQJoG/KezhDK+9g+51bYuBNp3AIuG35ZaKv80xFA9/E9ho0CBQFgH7UYt9F9Crd+qp21YLfFa3NW1t2nQCi4Xflowh/jYPBmAUaBAol8AvCn0wgX2CbTxpzl79/9T/qk6bRyCK8M9b+v5TO90+qX+lwyBjDXRaO2XrNXntNW7nOKjv1bfqU9tGDzypB3U0IU69GMto7adoM/2YaKcve3V+A+cHE75al8B/ark+4ZI29y8J5/c49e8K6qjeq1szQT98++r7Px+xef260+tW/S/qtHgEftVU+3jTffjw55iTvc5lBdGp9+oYgCDQIFABARNz662ZnofURRd+21Ssn/lfAhoMgN8EviTDewhAAALjCSQRfls+lfjb3BiAUaBBAAIQmEcgmfBbOCnF3+bHAIwCDQIQgMA0AkmF30JJLf62BgZgFGgQgAAExhFILvwWxhrib+tgAEaBBgEIQOA+gVWE30JYS/xtLQzAKNAgAAEIXCewmvDb8muKv62HARgFGgQgAIG3BFYVflt6bfG3NTEAo0CDAAQg8J3A6sJvy+YQf1sXAzAKNAhAoHUCWYTfoOcSf1sbAzAKNAhAoFUC2YTfgOcUf1sfAzAKNAhAoDUCWYXfYOcWf4sBAzAKNAhAoBUC2YXfQHsQf4sDAzAKNAhAoHYCLoTfIHsRf4sFAzAKNAhAoFYCboTfAHsSf4sHAzAKNAhAoDYCroTf4HoTf4sJAzAKNAhAoBYC7oTfwHoUf4sLAzAKNAhAoHQCLoXfoHoVf4sNAzAKNAhAoFQCboXfgHoWf4sPAzAKNAhAoDQCroXfYHoXf4sRAzAKNAhAoBQC7oXfQJYg/hYnBmAUaBCAgHcCRQi/QSxF/C1WDMAo0CAAAa8EihF+A1iS+Fu8GIBRoN0i8Ltu/I+61QkNAmsSKEr41wQTe62dJjypf6XD4LUWXvS6Vttqoc/q1B8MrAaCOm1FAhgAB88OnonwZsW6O1+q05ujOibQLoOg/NMyEMAA2j10J9XbU4aau1zSjOeTOgbQHoNwWQy8X5fATsud1Dl87TA4KN9bdU9tr2Cow3ZqMHgqvpZjwQDaOXS9Cn3jtNipwzbqMDitv2bD4uDVf/BKOHTUYd11WEINNmkCHLx6D15fUEVTh3XWIcLv/BBy8Oo7eAfV3MZ53V2G1+kCvw9VD4NwmWDe+ySAAdRz6E4qMctnie1ZQWMA5TMIJRZfyzFjAOUfOhPOp8KLuFf8GEC5DELh9dds+BhAuYfOBPNzBZW71R5O6hhAeQyC8kYrmAAGUN6hM6E0wdwWXHfnob/oDeJfFoNwnkC+LpcABlDWwTOhfCm33K5GftRVDKAMBuFqBrlYLAEMoIyDN3zq3xRbadcD3+sy4u+fQbiePq6WTgAD8H/4TCA/lV5oN+I/6ToG4JdBuJE3LldCAAPwe/gGYdxWUmuX23jRhWGPvPpiES6Txfs6CWAAvg7euRAe6iy5b7va6tfzvfK1Dx7hW3Ya+6W0/8krVnpMYDr1L7EmZJ5oBEK0mfxNdFRIv/kLq+mImv0fuFoVf6t2DMDnmf/sM6xoUfXRZmKipQSaFf6l4Gp5fqeNnNT5Fjw/g2MtRXVnH53uUWv5GYQ7OWriVsuf/IcE8x3AQCL/q+Wi9tbXvsEC9scnfiUJ8f9eqRiAjxPbgvgb6d994G4yCoT/Ne2I/4/6xwB+sMj1VSvif8wFuPF1Ef6zAkD8z2DoSwzgLY+1353WXjDTeq2YXCa8V5dF+C+wIP4XQPQWA3jPhCtxCbRicnGpzZ8N4b/CDvG/AkWXMIDrXFJf7VMvwPzNEUD4b6Qc8b8BRpcxgNtsuAOBEggg/HeyhPjfgaNbGMB9PrHv7mJPyHzNEkD4H6Qe8X8ASLcxgMeMYo3YxJqIeZomgPCPSD/iPwKShmAA4zgxahyBbtwwRs0ggPCPhIb4jwSlYRjAeFZzR3ZzHyzsOb7DSZMwhH8CV8R/AiwNxQCm8Zo6ejv1gULHfyw0bs9hI/wTs4P4TwSm4RjAdGZjn9iNHVjwuBb2uHZ6EP4ZxBH/GdD0CAYwj9ujp+wT8ebRoMLvd4XH7y18hH9mRhD/meD0GAYwn929J5/u3azgXlfBHrxsAeH3kolG49hp3yd1/o32OAxCxXW0oU6inZOa66TiI1Df1jCAOMI/GKiJZI1tr00Ne+R1PotQY3Gwp3IJYADzD/OlEO7LLYO7kR9093KvvJ/GJNwlzE0IZCKAAUw7yLeE75gpfymX7TT5rf1yfRybkDJBzA2BpQQwgHEH+ZHg7ZcmwtnzveJ5tGfu32YUnOWTcCBwlQAGcPsQjxW4o8hurtIt72KnkMfum3HvWYXyUk7ELRPAAN4f4qnC9lJJAR21j6l7Z/x3ZqGSGmAbjRHAAJaLnjEsub0oeIR8HoNQcuKJHQIYwLyDPwjmQSW0KbSMOsU97IPXaSxCoTknbAi8IYABTDv4l0IZ3tAs481WYZ7UL/fC+8dMgrjRIFANAQzg8aG/J4wvBVWCfadyUL+3H+5d5xMKyjOhQmA0AQzg+oEfK4T70aTzDUT45+c45EsbK0MgPQEMYL44mEns06do9goI//zchtnUeRACBRHAAOaLhBlAcJjrrWI6qI/9LoZxP1gFcaNBoBkCGMCPwz9HCHtVin3S9tCeFMRJfc4+Wn8meEggMUBgbQIYwDLBNME14c3VNlr4k3rrAj53/yFX4lgXAh4I7BTESX3uAeK5Dx968duqr9n2WuyoDv95DILY0SDQPAEMYJ6AXApvUCVtE1fTXvMf1S/X5v14JkH8aBCAwCsBDGC8eDwS2l5M9+ob9Rhtq0le1I/qj9bm/n1GQQxpDgj85CAGQvhBwAygV//5xyW+Wkjgn3r+oN6/dr08bFuNsFx0r93+Y3nacgL8n7vLGUabAfGPhjLaRBhANJRXJ/qiq2YGt9ovt25wfREBhH8RvvgPI/7xmcaYEQOIQZE5vBBA+L1k4iwOxP8MhrMvMQBnCSGcWQQQ/lnY0j+E+KdnvGQFDGAJPZ7NTQDhz52BO+sj/nfgOLmFAThJBGFMIoDwT8K1/mDEf33mc1bEAOZQ45lcBBD+XOQnrIv4T4CVeSgGkDkBLD+KAMI/ClP+QYh//hxMiQADmEKLsWsTQPjXJr5gPcR/AbxMj2IAmcCz7F0CCP9dPP5uIv7+cjImIgxgDCXGrEUA4V+LdMR1EP+IMFeeCgNYGTjLXSWA8F/FwkUIpCVgBnBS5x8Tg0GOGghpy5vZIQCBewQwAIQf4b93QrgHgYoJYAAYwJoGECo+S2wNAsURwAAwgDUMIBR3MggYAg0QwAAwgJQGEBo4Q2wRAsUSwAAwgBQGEIo9EQQOgYYIYAAYQEwDCA2dHbYKgeIJYAAYQAwDCMWfBDYAgQYJYAAYwBIDCA2eGbYMgWoIYAAYwBwDCNWcADYCgYYJYAAYwBQDCA2fFbYOgeoIYAAYwBgDCNVVPhuCAAQ+YAAYwD0DCJwRCECgXgIYAAZwzQBCvSXPziAAgYEABoABnBtAGAqDVwhAoH4CGAAGYAYQ6i91dggBCFwSwADaNoBwWRC8hwAE2iGAAbRpAKGdEmenEIDALQIYQFsGEG4VAtchAIH2CGAAbRhAaK+02TEEIPCIAAZQtwGERwXAfQhAoF0CGECdBhDaLWl2DgEIjCWAAdRlAGFs4hkHAQhAAAOowwACpQwBCEBgKgEMoGwDCFMTzngIQAACAwEMoEwDCEMCeYUABCAwlwAGUJYBhLmJ5jkIQAAClwQwgDIMIFwmjvcQgAAElhLAAHwbQFiaYJ6HAAQgcIsABuDTAMKthHEdAhCAQCwCGIAvAwixEss8EIAABB4RwAB8GEB4lCjuQwACEIhNAAPIawAhdkKZDwIQgMBYAhhAHgMIYxPEOAhAAAKpCGAA6xpASJVI5oUABCAwlQAGsI4BhKmJYTwEIACB1AQwgLQGEFInkPkhAAEIzCWAAaQxgDA3ITwHAQhAYC0CGEBcAwhrJY51IAABCCwlgAHEMYCwNBE8DwEIQGBtAhjAMgMIayeM9SAAAQjEIoABzDOAECsBzAMBCEAgF4GtFj6of6WPYhDEiQYBCECgCgIb7QIDeGyAoYpsswkIQAACZwQwgPviH85Y8SUEIACBqghgANcNIFSVZTYDAQhA4AoBDOCtAYQrjLgEAQhAoEoCGMB3AwhVZpdNQQACELhDoHUDCHfYcAsCEIBA1QRaNYBQdVbZHAQgAIERBFozgDCCCUMgAAEINEGgFQMITWSTTUIAAhCYQKB2AwgTWDAUAhCAQFMEajWA0FQW2SwEIACBGQRqM4AwgwGPQAACEGiSQC0GEJrMHpuGAAQgsIBA6QYQFuydRyEAAQg0TaBUAwhNZ43NQwACEIhAoDQDCBH2zBQQgAAEICACpRhAIFsQgAAEIBCXgHcDCHG3y2wQgAAEIDAQ8GoAYQiQVwhAAAIQSEPAmwGENNtkVghAAAIQuCTgxQDCZWC8hwAEIACBtATMAHr1r5n6s9alQQACEIBAJgIvWndNAzhqvU6dBgEIQAACmQnstH6vntoEPmkN+46DBgEIQAACjgh0iqVXj20CQXNu1WkQgAAEIOCYgH0nENRP6nON4KBnn9U36jQIVEXgp6p2w2YgcJ3ATpc7dXvdvr7+rNfz9pvenNQPr73X61GdBoEqCfw/ve9MGM39OucAAAAASUVORK5CYII="
-        />
-      </defs>
-    </svg>
-  )
-}
-
-export default GitBridgeLogo
diff --git a/services/web/frontend/js/shared/svgs/git-logo-orange.tsx b/services/web/frontend/js/shared/svgs/git-logo-orange.tsx
new file mode 100644
index 0000000000..2d242141e7
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/git-logo-orange.tsx
@@ -0,0 +1,29 @@
+function GitLogoOrange({ size = 40 }: { size?: number }) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 92 92"
+    >
+      <defs>
+        <clipPath id="a">
+          <path d="M0 .113h91.887V92H0Zm0 0" />
+        </clipPath>
+      </defs>
+      <g clipPath="url(#a)">
+        <path
+          style={{
+            stroke: 'none',
+            fillRule: 'nonzero',
+            fill: '#f03c2e',
+            fillOpacity: 1,
+          }}
+          d="M90.156 41.965 50.036 1.848a5.918 5.918 0 0 0-8.372 0l-8.328 8.332 10.566 10.566a7.03 7.03 0 0 1 7.23 1.684 7.034 7.034 0 0 1 1.669 7.277l10.187 10.184a7.028 7.028 0 0 1 7.278 1.672 7.04 7.04 0 0 1 0 9.957 7.05 7.05 0 0 1-9.965 0 7.044 7.044 0 0 1-1.528-7.66l-9.5-9.497V59.36a7.04 7.04 0 0 1 1.86 11.29 7.04 7.04 0 0 1-9.957 0 7.04 7.04 0 0 1 0-9.958 7.06 7.06 0 0 1 2.304-1.539V33.926a7.049 7.049 0 0 1-3.82-9.234L29.242 14.272 1.73 41.777a5.925 5.925 0 0 0 0 8.371L41.852 90.27a5.925 5.925 0 0 0 8.37 0l39.934-39.934a5.925 5.925 0 0 0 0-8.371"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default GitLogoOrange
diff --git a/services/web/frontend/js/shared/svgs/git-logo-white.tsx b/services/web/frontend/js/shared/svgs/git-logo-white.tsx
new file mode 100644
index 0000000000..8119be30dc
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/git-logo-white.tsx
@@ -0,0 +1,29 @@
+function GitLogoWhite({ size = 40 }: { size?: number }) {
+  return (
+    <svg
+      width={size}
+      height={size}
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 92 92"
+    >
+      <defs>
+        <clipPath id="a">
+          <path d="M0 .113h91.887V92H0Zm0 0" />
+        </clipPath>
+      </defs>
+      <g clipPath="url(#a)">
+        <path
+          style={{
+            stroke: 'none',
+            fillRule: 'nonzero',
+            fill: '#fff',
+            fillOpacity: 1,
+          }}
+          d="M90.156 41.965 50.036 1.848a5.918 5.918 0 0 0-8.372 0l-8.328 8.332 10.566 10.566a7.03 7.03 0 0 1 7.23 1.684 7.034 7.034 0 0 1 1.669 7.277l10.187 10.184a7.028 7.028 0 0 1 7.278 1.672 7.04 7.04 0 0 1 0 9.957 7.05 7.05 0 0 1-9.965 0 7.044 7.044 0 0 1-1.528-7.66l-9.5-9.497V59.36a7.04 7.04 0 0 1 1.86 11.29 7.04 7.04 0 0 1-9.957 0 7.04 7.04 0 0 1 0-9.958 7.06 7.06 0 0 1 2.304-1.539V33.926a7.049 7.049 0 0 1-3.82-9.234L29.242 14.272 1.73 41.777a5.925 5.925 0 0 0 0 8.371L41.852 90.27a5.925 5.925 0 0 0 8.37 0l39.934-39.934a5.925 5.925 0 0 0 0-8.371"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default GitLogoWhite
diff --git a/services/web/frontend/js/shared/svgs/github-logo-black.tsx b/services/web/frontend/js/shared/svgs/github-logo-black.tsx
index f28ac61e0d..9d782aef4c 100644
--- a/services/web/frontend/js/shared/svgs/github-logo-black.tsx
+++ b/services/web/frontend/js/shared/svgs/github-logo-black.tsx
@@ -1,8 +1,8 @@
-function GithubLogoBlack() {
+function GithubLogoBlack({ size = 20 }: { size?: number }) {
   return (
     <svg
-      width="20"
-      height="20"
+      width={size}
+      height={size}
       viewBox="0 0 20 20"
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
diff --git a/services/web/frontend/js/shared/svgs/openid-logo.jsx b/services/web/frontend/js/shared/svgs/openid-logo.jsx
new file mode 100644
index 0000000000..3de933820b
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/openid-logo.jsx
@@ -0,0 +1,27 @@
+function OpenIDLogo() {
+  return (
+    <svg
+      width="40"
+      height="40"
+      viewBox="0 0 40 40"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <rect width="40" height="40" fill="white" />
+      <path
+        d="M18.185415 36.042565 23.298193 32.35627 23.060446 3.090316 18.185415 6.8918455Z"
+        fill="#ff8e00"
+      />
+      <path
+        d="M18.246064 36.042565C-0.37463741 32.997945 -1.0248032 15.054095 18.13083 11.143396l0.05944 3.322396 c -13.3672163 2.225847 -11.6629563 14.187201 0 15.92785l0.05944 3.127104Z"
+        fill="#626262"
+      />
+      <path
+        d="M23.219348 14.720521c2.279219 0.01577 4.262468 1.057732 6.237225 2.117891l-2.917255 2.176115h9.317022l0.05701 -6.371868 -2.917255 2.176115C30.03396 13.32315 27.308358 11.530342 23.169615 11.496378Z"
+        fill="#626262"
+      />
+    </svg>
+  )
+}
+
+export default OpenIDLogo
+
diff --git a/services/web/frontend/js/shared/svgs/overleaf-black.svg b/services/web/frontend/js/shared/svgs/overleaf-black.svg
new file mode 100644
index 0000000000..ea0678438b
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/overleaf-black.svg
@@ -0,0 +1,9 @@
+<svg width="129" height="38" viewBox="0 0 129 38" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_2579_355" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="72" height="38">
+<path d="M71.7643 37.6327H0.0244141V0.0717773H71.7643V37.6327Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_2579_355)">
+<path d="M47.2509 26.4555C47.3948 27.7507 47.8985 28.7821 48.81 29.5257C49.6974 30.2692 50.8487 30.653 52.2638 30.653C53.1993 30.653 54.0387 30.4611 54.7823 30.0773C55.5258 29.6696 56.1255 29.1419 56.5572 28.4223H61.0664C60.2989 30.3891 59.1716 31.9002 57.6365 33.0035C56.1255 34.0829 54.3506 34.6345 52.3598 34.6345C51.0166 34.6345 49.7934 34.3947 48.666 33.915C47.5387 33.4352 46.5314 32.7397 45.6199 31.8043C44.7804 30.9168 44.1089 29.9094 43.6531 28.7341C43.1974 27.5589 42.9576 26.3836 42.9576 25.1603C42.9576 23.9131 43.1734 22.7138 43.6052 21.6105C44.0369 20.5072 44.6605 19.4998 45.5 18.6124C46.4114 17.629 47.4668 16.8854 48.6181 16.3817C49.7694 15.8541 50.9686 15.5902 52.1919 15.5902C53.7509 15.5902 55.214 15.95 56.5572 16.6456C57.9004 17.3651 59.0517 18.3485 60.0111 19.6437C60.5867 20.4113 61.0185 21.2747 61.3063 22.2581C61.5941 23.2175 61.714 24.3209 61.714 25.5681C61.714 25.664 61.714 25.8079 61.69 26.0238C61.69 26.2397 61.6661 26.3836 61.6661 26.4795H47.2509V26.4555ZM57.2048 23.1216C56.845 21.9223 56.2454 21.0109 55.4059 20.3873C54.5664 19.7637 53.4871 19.4519 52.2159 19.4519C51.0886 19.4519 50.1052 19.7876 49.2177 20.4592C48.3303 21.1308 47.7306 22.0183 47.4188 23.1216H57.2048ZM71.7638 19.7637C70.1328 19.8836 69.0055 20.3153 68.3579 21.0349C67.7103 21.7544 67.3985 23.0496 67.3985 24.9205V34.1068H63.2011V16.1179H67.1347V18.2046C67.7583 17.3891 68.4539 16.8135 69.2214 16.4297C69.9649 16.0459 70.8284 15.8541 71.7638 15.8541V19.7637ZM32.428 1.24705C27.3432 -0.743722 8.9465 -1.46328 8.92251 9.52196C3.54982 12.9519 0 18.5404 0 24.5367C0 31.7803 5.87638 37.6567 13.1199 37.6567C20.3635 37.6567 26.2399 31.7803 26.2399 24.5367C26.2399 18.9482 22.738 14.1511 17.797 12.2803C16.8376 11.9205 14.7749 11.2729 13.1439 11.4168C10.7934 12.9039 7.91513 15.974 6.57196 19.0441C8.58672 16.6216 11.7288 15.5662 14.5351 16.022C18.6365 16.6936 21.7786 20.2434 21.7786 24.5607C21.7786 29.3338 17.917 33.1954 13.1439 33.1954C10.5055 33.1954 8.15498 32.0201 6.57196 30.1733C4.19742 27.415 3.59779 24.4408 4.07749 21.5386C5.73247 11.3688 17.797 5.58838 26.7675 3.35775C23.8413 4.9168 18.5646 7.45923 14.8708 10.2175C25.6402 14.391 27.3911 5.30056 32.428 1.24705ZM36.7934 34.1308H33.5074L26.6716 16.1179H31.1328L35.3303 28.0865L39.6476 16.1179H43.9889L36.7934 34.1308Z" fill="#1B222C"/>
+</g>
+<path d="M83.6127 26.4556C83.7567 27.7508 84.2843 28.7822 85.1718 29.5257C86.0592 30.2692 87.2105 30.653 88.6257 30.653C89.5611 30.653 90.4006 30.4611 91.1441 30.0774C91.8877 29.6696 92.4873 29.1419 92.919 28.4224H97.4282C96.6607 30.3892 95.5334 31.9002 93.9984 33.0036C92.4873 34.0829 90.7124 34.6346 88.7216 34.6346C87.3784 34.6346 86.1552 34.3947 85.0279 33.915C83.9006 33.4353 82.8932 32.7397 81.9817 31.8043C81.1423 30.9168 80.4707 29.9095 80.015 28.7342C79.5353 27.5829 79.3194 26.3836 79.3194 25.1604C79.3194 23.9131 79.5353 22.7139 79.967 21.6106C80.3987 20.5072 81.0223 19.4999 81.8618 18.6124C82.7733 17.629 83.8286 16.8855 84.9799 16.3818C86.1312 15.8541 87.3305 15.5903 88.5537 15.5903C90.1128 15.5903 91.5758 15.95 92.919 16.6456C94.2622 17.3652 95.4135 18.3486 96.3729 19.6438C96.9485 20.4113 97.3803 21.2748 97.6681 22.2582C97.9559 23.2176 98.0758 24.3209 98.0758 25.5681C98.0758 25.6641 98.0758 25.808 98.0519 26.0238C98.0519 26.2397 98.0279 26.3836 98.0279 26.4796H83.6127V26.4556ZM93.5426 23.1216C93.1829 21.9224 92.5832 21.0109 91.7437 20.3873C90.9043 19.7637 89.8249 19.4519 88.5537 19.4519C87.4264 19.4519 86.443 19.7877 85.5556 20.4593C84.6681 21.1309 84.0685 22.0183 83.7567 23.1216H93.5426ZM114.698 34.1309V31.9242C114.194 32.8117 113.498 33.4833 112.587 33.915C111.675 34.3467 110.5 34.5626 109.085 34.5626C106.423 34.5626 104.192 33.6512 102.417 31.8283C100.642 30.0054 99.7308 27.7508 99.7308 25.0644C99.7308 23.7932 99.9467 22.594 100.402 21.4667C100.858 20.3393 101.482 19.332 102.321 18.4685C103.209 17.5091 104.216 16.8135 105.295 16.3578C106.375 15.9021 107.622 15.6862 108.989 15.6862C110.308 15.6862 111.436 15.9021 112.371 16.3338C113.306 16.7655 114.074 17.4371 114.65 18.3246V16.1419H118.727V34.1548H114.698V34.1309ZM104.024 24.9685C104.024 26.4796 104.528 27.7508 105.535 28.7822C106.543 29.8135 107.766 30.3172 109.229 30.3172C110.548 30.3172 111.699 29.8135 112.707 28.7822C113.714 27.7508 114.218 26.5515 114.218 25.1844C114.218 23.7213 113.714 22.474 112.707 21.4187C111.699 20.3633 110.524 19.8357 109.157 19.8357C107.742 19.8357 106.543 20.3393 105.535 21.3227C104.528 22.3301 104.024 23.5294 104.024 24.9685ZM129.904 16.1179V19.8596H126.882V34.1309H122.829V19.8596H120.694V16.1179H122.709V15.6382C122.709 13.7434 123.236 12.3283 124.268 11.3929C125.323 10.4574 126.906 10.0017 129.041 10.0017C129.113 10.0017 129.257 10.0017 129.449 10.0257C129.64 10.0257 129.784 10.0497 129.904 10.0497V13.8154H129.616C128.657 13.8154 127.985 13.9833 127.578 14.2711C127.17 14.5829 126.954 15.0866 126.954 15.8301V16.1659H129.904V16.1179ZM73.5869 34.1309H77.6884V10.2895H73.5869V34.1309Z" fill="#1B222C"/>
+</svg>
diff --git a/services/web/frontend/js/shared/svgs/overleaf-green.svg b/services/web/frontend/js/shared/svgs/overleaf-green.svg
new file mode 100644
index 0000000000..18bc792234
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/overleaf-green.svg
@@ -0,0 +1,9 @@
+<svg width="104" height="30" viewBox="0 0 104 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_2946_8679" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="58" height="30">
+<path d="M57.4311 30H0.132324V0H57.4311V30Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_2946_8679)">
+<path d="M37.8711 21.0606C37.9861 22.0943 38.3884 22.9174 39.1163 23.5108C39.8251 24.1042 40.7446 24.4105 41.8749 24.4105C42.622 24.4105 43.2925 24.2574 43.8863 23.9511C44.4802 23.6257 44.9591 23.2045 45.304 22.6303H48.9054C48.2924 24.1999 47.392 25.4059 46.166 26.2864C44.9591 27.1478 43.5415 27.5881 41.9515 27.5881C40.8787 27.5881 39.9017 27.3967 39.0014 27.0138C38.101 26.631 37.2964 26.0759 36.5685 25.3293C35.898 24.6211 35.3616 23.8171 34.9976 22.8791C34.6336 21.9412 34.4421 21.0032 34.4421 20.027C34.4421 19.0316 34.6145 18.0745 34.9593 17.1939C35.3041 16.3134 35.8022 15.5094 36.4727 14.8011C37.2006 14.0163 38.0435 13.4229 38.9631 13.0209C39.8826 12.5998 40.8404 12.3892 41.8174 12.3892C43.0626 12.3892 44.2312 12.6764 45.304 13.2315C46.3767 13.8058 47.2963 14.5906 48.0625 15.6243C48.5223 16.2368 48.8671 16.9259 49.097 17.7108C49.3269 18.4764 49.4226 19.357 49.4226 20.3524C49.4226 20.4289 49.4227 20.5438 49.4035 20.7161C49.4035 20.8883 49.3843 21.0032 49.3843 21.0798H37.8711V21.0606ZM45.8212 18.3999C45.5338 17.4428 45.0549 16.7154 44.3844 16.2177C43.7139 15.72 42.8519 15.4711 41.8366 15.4711C40.9362 15.4711 40.1508 15.7391 39.442 16.2751C38.7332 16.8111 38.2543 17.5193 38.0052 18.3999H45.8212ZM57.4493 15.72C56.1467 15.8157 55.2463 16.1602 54.7291 16.7345C54.2118 17.3088 53.9628 18.3424 53.9628 19.8355V27.167H50.6104V12.8104H53.7521V14.4757C54.2502 13.8249 54.8057 13.3655 55.4187 13.0592C56.0126 12.7529 56.7022 12.5998 57.4493 12.5998V15.72ZM26.0323 0.94225C21.971 -0.646546 7.27779 -1.22081 7.25864 7.54628C2.96752 10.2836 0.132324 14.7437 0.132324 19.5293C0.132324 25.3102 4.82573 30 10.6111 30C16.3964 30 21.0898 25.3102 21.0898 19.5293C21.0898 15.0691 18.2929 11.2407 14.3466 9.74763C13.5804 9.4605 11.9329 8.94366 10.6302 9.05851C8.75286 10.2453 6.45405 12.6955 5.38127 15.1457C6.99044 13.2124 9.49998 12.3701 11.7413 12.7338C15.0171 13.2698 17.5267 16.1028 17.5267 19.5484C17.5267 23.3577 14.4424 26.4396 10.6302 26.4396C8.52298 26.4396 6.64562 25.5016 5.38127 24.0277C3.48476 21.8263 3.00584 19.4527 3.38897 17.1365C4.71079 9.02023 14.3466 4.40698 21.5113 2.62676C19.1741 3.871 14.9597 5.90006 12.0095 8.10141C20.6109 11.4321 22.0093 4.17727 26.0323 0.94225ZM29.5188 27.1861H26.8943L21.4346 12.8104H24.9978L28.3502 22.3623L31.7984 12.8104H35.2658L29.5188 27.1861Z" fill="#046530"/>
+</g>
+<path d="M66.8949 21.0719C67.0098 22.1064 67.4313 22.9301 68.1401 23.524C68.8489 24.1179 69.7684 24.4244 70.8987 24.4244C71.6458 24.4244 72.3163 24.2711 72.9102 23.9646C73.5041 23.6389 73.983 23.2175 74.3278 22.6428H77.9293C77.3163 24.2137 76.4159 25.4206 75.1899 26.3018C73.983 27.1639 72.5654 27.6045 70.9753 27.6045C69.9025 27.6045 68.9255 27.4129 68.0251 27.0298C67.1248 26.6466 66.3202 26.0911 65.5922 25.3439C64.9217 24.6351 64.3853 23.8305 64.0213 22.8918C63.6382 21.9723 63.4658 21.0144 63.4658 20.0374C63.4658 19.0412 63.6382 18.0834 63.983 17.2022C64.3278 16.3209 64.8259 15.5163 65.4964 14.8075C66.2244 14.0221 67.0673 13.4282 67.9868 13.0259C68.9064 12.6045 69.8642 12.3937 70.8412 12.3937C72.0864 12.3937 73.255 12.6811 74.3278 13.2366C75.4006 13.8114 76.3201 14.5968 77.0864 15.6313C77.5462 16.2443 77.891 16.934 78.1209 17.7194C78.3508 18.4857 78.4466 19.3669 78.4466 20.3631C78.4466 20.4397 78.4466 20.5547 78.4274 20.7271C78.4274 20.8995 78.4083 21.0144 78.4083 21.0911H66.8949V21.0719ZM74.8259 18.4091C74.5385 17.4512 74.0596 16.7232 73.3891 16.2252C72.7186 15.7271 71.8566 15.478 70.8412 15.478C69.9408 15.478 69.1554 15.7462 68.4466 16.2826C67.7378 16.819 67.2589 17.5278 67.0098 18.4091H74.8259ZM91.7224 27.2022V25.4397C91.3201 26.1485 90.7646 26.6849 90.0366 27.0298C89.3086 27.3746 88.3699 27.547 87.2397 27.547C85.1132 27.547 83.3316 26.819 81.914 25.3631C80.4964 23.9071 79.7684 22.1064 79.7684 19.9608C79.7684 18.9455 79.9408 17.9876 80.3048 17.0872C80.6688 16.1868 81.1669 15.3822 81.8374 14.6926C82.5462 13.9263 83.3508 13.3707 84.2129 13.0068C85.0749 12.6428 86.0711 12.4704 87.1631 12.4704C88.2167 12.4704 89.1171 12.6428 89.8642 12.9876C90.6113 13.3324 91.2244 13.8688 91.6841 14.5776V12.8343H94.9408V27.2213H91.7224V27.2022ZM83.1975 19.8842C83.1975 21.0911 83.5998 22.1064 84.4044 22.9301C85.209 23.7539 86.186 24.1562 87.3546 24.1562C88.4083 24.1562 89.3278 23.7539 90.1324 22.9301C90.937 22.1064 91.3393 21.1485 91.3393 20.0566C91.3393 18.888 90.937 17.8918 90.1324 17.0489C89.3278 16.206 88.3891 15.7845 87.2972 15.7845C86.1669 15.7845 85.209 16.1868 84.4044 16.9723C83.5998 17.7769 83.1975 18.7347 83.1975 19.8842ZM103.868 12.8152V15.8037H101.454V27.2022H98.2167V15.8037H96.5117V12.8152H98.1209V12.432C98.1209 10.9186 98.5424 9.78837 99.3661 9.04124C100.209 8.29411 101.473 7.93013 103.178 7.93013C103.236 7.93013 103.351 7.93013 103.504 7.94929C103.657 7.94929 103.772 7.96844 103.868 7.96844V10.9761H103.638C102.872 10.9761 102.335 11.1102 102.01 11.3401C101.684 11.5891 101.512 11.9914 101.512 12.5853V12.8535H103.868V12.8152ZM58.8872 27.2022H62.1631V8.16002H58.8872V27.2022Z" fill="#046530"/>
+</svg>
diff --git a/services/web/frontend/js/shared/svgs/overleaf-white.svg b/services/web/frontend/js/shared/svgs/overleaf-white.svg
new file mode 100644
index 0000000000..2ced81aa46
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/overleaf-white.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 542 157" enable-background="new 0 0 542 157"><style>.st0{filter:url(#Adobe_OpacityMaskFilter);} .st1{fill:#FFFFFF;} .st2{mask:url(#mask-2);fill:#FFFFFF;}</style><g id="Page-1"><g id="Overleaf"><g id="Group-3"><defs><filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="0" y=".3" width="299.2" height="156.7"><feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/></filter></defs><mask maskUnits="userSpaceOnUse" x="0" y=".3" width="299.2" height="156.7" id="mask-2"><g class="st0"><path id="path-1" class="st1" d="M299.2 156.9H.1V.3h299.1z"/></g></mask><path id="Fill-1" class="st2" d="M197 110.3c.6 5.4 2.7 9.7 6.5 12.8 3.7 3.1 8.5 4.7 14.4 4.7 3.9 0 7.4-.8 10.5-2.4 3.1-1.7 5.6-3.9 7.4-6.9h18.8c-3.2 8.2-7.9 14.5-14.3 19.1-6.3 4.5-13.7 6.8-22 6.8-5.6 0-10.7-1-15.4-3-4.7-2-8.9-4.9-12.7-8.8-3.5-3.7-6.3-7.9-8.2-12.8s-2.9-9.8-2.9-14.9c0-5.2.9-10.2 2.7-14.8 1.8-4.6 4.4-8.8 7.9-12.5 3.8-4.1 8.2-7.2 13-9.3 4.8-2.2 9.8-3.3 14.9-3.3 6.5 0 12.6 1.5 18.2 4.4 5.6 3 10.4 7.1 14.4 12.5 2.4 3.2 4.2 6.8 5.4 10.9 1.2 4 1.7 8.6 1.7 13.8 0 .4 0 1-.1 1.9 0 .9-.1 1.5-.1 1.9H197v-.1zm41.5-13.9c-1.5-5-4-8.8-7.5-11.4-3.5-2.6-8-3.9-13.3-3.9-4.7 0-8.8 1.4-12.5 4.2-3.7 2.8-6.2 6.5-7.5 11.1h40.8zm60.7-14c-6.8.5-11.5 2.3-14.2 5.3-2.7 3-4 8.4-4 16.2v38.3h-17.5v-75h16.4v8.7c2.6-3.4 5.5-5.8 8.7-7.4 3.1-1.6 6.7-2.4 10.6-2.4v16.3zm-164-77.2C114-3.1 37.3-6.1 37.2 39.7 14.8 54 0 77.3 0 102.3 0 132.5 24.5 157 54.7 157c30.2 0 54.7-24.5 54.7-54.7 0-23.3-14.6-43.3-35.2-51.1-4-1.5-12.6-4.2-19.4-3.6-9.8 6.2-21.8 19-27.4 31.8 8.4-10.1 21.5-14.5 33.2-12.6 17.1 2.8 30.2 17.6 30.2 35.6 0 19.9-16.1 36-36 36-11 0-20.8-4.9-27.4-12.6-9.9-11.5-12.4-23.9-10.4-36 6.9-42.4 57.2-66.5 94.6-75.8C99.4 20.5 77.4 31.1 62 42.6c44.9 17.4 52.2-20.5 73.2-37.4zm18.2 137.1h-13.7l-28.5-75.1h18.6l17.5 49.9 18-49.9h18.1l-30 75.1z"/></g><path id="Fill-4" class="st1" d="M348.6 110.3c.6 5.4 2.8 9.7 6.5 12.8 3.7 3.1 8.5 4.7 14.4 4.7 3.9 0 7.4-.8 10.5-2.4 3.1-1.7 5.6-3.9 7.4-6.9h18.8c-3.2 8.2-7.9 14.5-14.3 19.1-6.3 4.5-13.7 6.8-22 6.8-5.6 0-10.7-1-15.4-3-4.7-2-8.9-4.9-12.7-8.8-3.5-3.7-6.3-7.9-8.2-12.8-2-4.8-2.9-9.8-2.9-14.9 0-5.2.9-10.2 2.7-14.8 1.8-4.6 4.4-8.8 7.9-12.5 3.8-4.1 8.2-7.2 13-9.3 4.8-2.2 9.8-3.3 14.9-3.3 6.5 0 12.6 1.5 18.2 4.4 5.6 3 10.4 7.1 14.4 12.5 2.4 3.2 4.2 6.8 5.4 10.9 1.2 4 1.7 8.6 1.7 13.8 0 .4 0 1-.1 1.9 0 .9-.1 1.5-.1 1.9h-60.1v-.1zM390 96.4c-1.5-5-4-8.8-7.5-11.4-3.5-2.6-8-3.9-13.3-3.9-4.7 0-8.8 1.4-12.5 4.2-3.7 2.8-6.2 6.5-7.5 11.1H390zm88.2 45.9v-9.2c-2.1 3.7-5 6.5-8.8 8.3-3.8 1.8-8.7 2.7-14.6 2.7-11.1 0-20.4-3.8-27.8-11.4-7.4-7.6-11.2-17-11.2-28.2 0-5.3.9-10.3 2.8-15 1.9-4.7 4.5-8.9 8-12.5 3.7-4 7.9-6.9 12.4-8.8s9.7-2.8 15.4-2.8c5.5 0 10.2.9 14.1 2.7 3.9 1.8 7.1 4.6 9.5 8.3v-9.1h17v75.1h-16.8v-.1zm-44.5-38.2c0 6.3 2.1 11.6 6.3 15.9 4.2 4.3 9.3 6.4 15.4 6.4 5.5 0 10.3-2.1 14.5-6.4 4.2-4.3 6.3-9.3 6.3-15 0-6.1-2.1-11.3-6.3-15.7-4.2-4.4-9.1-6.6-14.8-6.6-5.9 0-10.9 2.1-15.1 6.2-4.2 4.2-6.3 9.2-6.3 15.2zm107.9-36.9v15.6H529v59.5h-16.9V82.8h-8.9V67.2h8.4v-2c0-7.9 2.2-13.8 6.5-17.7 4.4-3.9 11-5.8 19.9-5.8.3 0 .9 0 1.7.1.8 0 1.4.1 1.9.1v15.7h-1.2c-4 0-6.8.7-8.5 1.9-1.7 1.3-2.6 3.4-2.6 6.5v1.4h12.3v-.2zm-234.8 75.1h17.1V42.9h-17.1v99.4z"/></g></g></svg>
\ No newline at end of file
diff --git a/services/web/frontend/js/shared/svgs/sparkle-2-stars.svg b/services/web/frontend/js/shared/svgs/sparkle-2-stars.svg
new file mode 100644
index 0000000000..5e4fc5e657
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/sparkle-2-stars.svg
@@ -0,0 +1,16 @@
+<svg width="41" height="40" viewBox="0 0 41 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M30.2344 23.5171C20.275 21.2682 18.7323 19.7255 16.4837 9.76641C16.3807 9.31122 15.9756 8.987 15.5074 8.987C15.0392 8.987 14.6341 9.3112 14.531 9.76641C12.281 19.7259 10.7394 21.2686 0.780336 23.5171C0.324219 23.6212 0 24.0253 0 24.4935C0 24.9616 0.324203 25.3659 0.780336 25.4698C10.7398 27.7199 12.2813 29.2624 14.531 39.2205C14.6341 39.6757 15.0392 39.9999 15.5074 39.9999C15.9756 39.9999 16.3807 39.6757 16.4837 39.2205C18.7338 29.2622 20.2754 27.7196 30.2344 25.4698C30.6906 25.3657 31.0139 24.9616 31.0139 24.4935C31.0139 24.0253 30.6897 23.6211 30.2344 23.5171Z" fill="url(#paint0_linear_4820_1102)"/>
+<path d="M39.2371 8.01179C33.9428 6.81627 33.1993 6.07299 32.004 0.779476C31.8998 0.32336 31.4958 6.10352e-05 31.0276 6.10352e-05C30.5595 6.10352e-05 30.1552 0.323168 30.0513 0.779476C28.8558 6.07255 28.1125 6.81607 22.819 8.01179C22.3628 8.11589 22.0396 8.51996 22.0396 8.98812C22.0396 9.45629 22.3627 9.86054 22.819 9.96447C28.112 11.16 28.8556 11.9033 30.0513 17.1976C30.1554 17.6528 30.5595 17.977 31.0276 17.977C31.4958 17.977 31.9 17.6528 32.004 17.1976C33.1995 11.9033 33.9427 11.1598 39.2371 9.96447C39.6923 9.86036 40.0165 9.45629 40.0165 8.98812C40.0165 8.51996 39.6923 8.11571 39.2371 8.01179Z" fill="url(#paint1_linear_4820_1102)"/>
+<defs>
+<linearGradient id="paint0_linear_4820_1102" x1="31.0139" y1="8.987" x2="-5.13702" y2="25.3634" gradientUnits="userSpaceOnUse">
+<stop stop-color="#214475"/>
+<stop offset="0.295154" stop-color="#254C84"/>
+<stop offset="1" stop-color="#6597E0"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4820_1102" x1="40.0165" y1="6.2448e-05" x2="19.0617" y2="9.49231" gradientUnits="userSpaceOnUse">
+<stop stop-color="#214475"/>
+<stop offset="0.295154" stop-color="#254C84"/>
+<stop offset="1" stop-color="#6597E0"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/services/web/frontend/js/shared/svgs/sparkle-small-white.svg b/services/web/frontend/js/shared/svgs/sparkle-small-white.svg
new file mode 100644
index 0000000000..343a85d778
--- /dev/null
+++ b/services/web/frontend/js/shared/svgs/sparkle-small-white.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="21" fill="none"><g fill="#fff" clip-path="url(#a)"><path d="M14.87 12.18c-4.74-1.07-5.48-1.8-6.55-6.54a.48.48 0 0 0-.93 0c-1.07 4.74-1.8 5.47-6.54 6.54a.48.48 0 0 0 0 .93c4.74 1.08 5.47 1.8 6.54 6.55a.48.48 0 0 0 .93 0c1.07-4.74 1.8-5.47 6.55-6.55a.48.48 0 0 0 0-.93Zm4.28-7.38c-2.52-.56-2.87-.92-3.44-3.44a.48.48 0 0 0-.93 0c-.57 2.52-.92 2.88-3.44 3.44a.48.48 0 0 0 0 .93c2.52.57 2.87.93 3.44 3.45a.48.48 0 0 0 .93 0c.57-2.52.92-2.88 3.44-3.45a.48.48 0 0 0 0-.93Z"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 .5h20v20H0z"/></clipPath></defs></svg>
diff --git a/services/web/frontend/js/shared/utils/colors.ts b/services/web/frontend/js/shared/utils/colors.ts
index 346a52d03a..3c43de4119 100644
--- a/services/web/frontend/js/shared/utils/colors.ts
+++ b/services/web/frontend/js/shared/utils/colors.ts
@@ -34,6 +34,51 @@ export function getBackgroundColorForUserId(userId?: string) {
   return `hsl(${getHueForUserId(userId)}, 70%, 50%)`
 }
 
+export function hslStringToLuminance(hslString: string): number {
+  // First extract the individual components from the HSL string
+  const hslSplit = hslString.slice(4).split(')')[0].split(',')
+
+  const h = Number(hslSplit[0])
+  const s = Number(hslSplit[1].slice(0, -1)) / 100
+  const l = Number(hslSplit[2].slice(0, -1)) / 100
+
+  // Then we need to convert HSL to RGB
+  const c = (1 - Math.abs(2 * l - 1)) * s
+  const x = c * (1 - Math.abs(((h / 60) % 2) - 1))
+  const m = l - c / 2
+  let r = 0
+  let g = 0
+  let b = 0
+  if (h >= 0 && h < 60) {
+    r = c + m
+    g = x + m
+    b = m
+  } else if (h >= 60 && h < 120) {
+    r = x + m
+    g = c + m
+    b = m
+  } else if (h >= 120 && h < 180) {
+    r = m
+    g = c + m
+    b = x + m
+  } else if (h >= 180 && h < 240) {
+    r = m
+    g = x + m
+    b = c + m
+  } else if (h >= 240 && h < 300) {
+    r = x + m
+    g = m
+    b = c + m
+  } else if (h >= 300 && h < 360) {
+    r = c + m
+    g = m
+    b = x + m
+  }
+
+  // Finally we calculate the luminance
+  return 0.2126 * r + 0.7152 * g + 0.0722 * b
+}
+
 const cachedHues = new Map()
 
 export function getHueForId(id: string) {
diff --git a/services/web/frontend/js/shared/utils/styles.ts b/services/web/frontend/js/shared/utils/styles.ts
index 2b30b3ed7c..c03f3052f7 100644
--- a/services/web/frontend/js/shared/utils/styles.ts
+++ b/services/web/frontend/js/shared/utils/styles.ts
@@ -1,4 +1,4 @@
-export type OverallTheme = '' | 'light-'
+export type OverallTheme = '' | 'light-' | 'system'
 
 export const fontFamilies = {
   monaco: ['Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'monospace'],
diff --git a/services/web/frontend/js/utils/abort-signal.ts b/services/web/frontend/js/utils/abort-signal.ts
index 98e9ce49ab..c6c9cb9883 100644
--- a/services/web/frontend/js/utils/abort-signal.ts
+++ b/services/web/frontend/js/utils/abort-signal.ts
@@ -1,25 +1,5 @@
-export const supportsModernAbortSignal =
-  typeof AbortSignal.any === 'function' &&
-  typeof AbortSignal.timeout === 'function'
+import './abortsignal-polyfill'
 
 export const signalWithTimeout = (signal: AbortSignal, timeout: number) => {
-  if (supportsModernAbortSignal) {
-    return AbortSignal.any([signal, AbortSignal.timeout(timeout)])
-  }
-
-  const abortController = new AbortController()
-
-  const abort = () => {
-    window.clearTimeout(timer)
-    signal.removeEventListener('abort', abort)
-    abortController.abort()
-  }
-
-  // abort after timeout has expired
-  const timer = window.setTimeout(abort, timeout)
-
-  // abort when the original signal is aborted
-  signal.addEventListener('abort', abort)
-
-  return abortController.signal
+  return AbortSignal.any([signal, AbortSignal.timeout(timeout)])
 }
diff --git a/services/web/frontend/js/utils/abortsignal-polyfill.ts b/services/web/frontend/js/utils/abortsignal-polyfill.ts
new file mode 100644
index 0000000000..00b214a560
--- /dev/null
+++ b/services/web/frontend/js/utils/abortsignal-polyfill.ts
@@ -0,0 +1,54 @@
+if (typeof AbortSignal.timeout !== 'function') {
+  AbortSignal.timeout = (time: number) => {
+    const controller = new AbortController()
+
+    function abort() {
+      controller.abort(new DOMException('Timed out', 'TimeoutError'))
+    }
+
+    function clean() {
+      window.clearTimeout(timer)
+      controller.signal.removeEventListener('abort', clean)
+    }
+
+    controller.signal.addEventListener('abort', clean)
+
+    const timer = window.setTimeout(abort, time)
+
+    return controller.signal
+  }
+}
+
+if (typeof AbortSignal.any !== 'function') {
+  AbortSignal.any = (signals: AbortSignal[]) => {
+    const controller = new AbortController()
+
+    // return immediately if any of the signals are already aborted.
+    for (const signal of signals) {
+      if (signal.aborted) {
+        controller.abort(signal.reason)
+        return controller.signal
+      }
+    }
+
+    function abort() {
+      controller.abort()
+      clean()
+    }
+
+    function clean() {
+      for (const signal of signals) {
+        signal.removeEventListener('abort', abort)
+      }
+    }
+
+    // abort the controller (and clean up) when any of the signals aborts
+    for (const signal of signals) {
+      signal.addEventListener('abort', abort)
+    }
+
+    return controller.signal
+  }
+}
+
+export default null // show that this is a module
diff --git a/services/web/frontend/js/utils/labs-utils.ts b/services/web/frontend/js/utils/labs-utils.ts
new file mode 100644
index 0000000000..1cfabafd87
--- /dev/null
+++ b/services/web/frontend/js/utils/labs-utils.ts
@@ -0,0 +1,10 @@
+import getMeta from './meta'
+
+// Should be `never` when no experiments are active. Otherwise it should be a
+// union of active experiment names e.g. `'experiment1' | 'experiment2'`
+export type ActiveExperiment = 'editor-redesign'
+
+export const isInExperiment = (experiment: ActiveExperiment): boolean => {
+  const experiments = getMeta('ol-labsExperiments')
+  return Boolean(experiments?.includes(experiment))
+}
diff --git a/services/web/frontend/js/utils/meta.ts b/services/web/frontend/js/utils/meta.ts
index 0f188c0976..59b5a82722 100644
--- a/services/web/frontend/js/utils/meta.ts
+++ b/services/web/frontend/js/utils/meta.ts
@@ -24,6 +24,7 @@ import {
 } from '../../../types/project/dashboard/notification'
 import { Survey } from '../../../types/project/dashboard/survey'
 import { GetProjectsResponseBody } from '../../../types/project/dashboard/api'
+import { GetTemplatesResponseBody } from '../../../types/template/dashboard/api'
 import { Tag } from '../../../app/src/Features/Tags/types'
 import { Institution } from '../../../types/institution'
 import {
@@ -34,6 +35,7 @@ import {
 import { SplitTestInfo } from '../../../types/split-test'
 import { ValidationStatus } from '../../../types/group-management/validation'
 import { ManagedInstitution } from '../../../types/subscription/dashboard/managed-institution'
+import { OnboardingFormData } from '../../../types/onboarding'
 import { GroupSSOTestResult } from '../../../modules/group-settings/frontend/js/utils/types'
 import {
   AccessToken,
@@ -43,7 +45,10 @@ import {
 import { SuggestedLanguage } from '../../../types/system-message'
 import type { TeamInvite } from '../../../types/team-invite'
 import { GroupPlans } from '../../../types/subscription/dashboard/group-plans'
-import { GroupSSOLinkingStatus } from '../../../types/subscription/sso'
+import {
+  GroupSSOLinkingStatus,
+  SSOConfig,
+} from '../../../types/subscription/sso'
 import { PasswordStrengthOptions } from '../../../types/password-strength-options'
 import { Subscription as ProjectDashboardSubscription } from '../../../types/project/dashboard/subscription'
 import { ThirdPartyIds } from '../../../types/third-party-ids'
@@ -51,9 +56,20 @@ import { Publisher } from '../../../types/subscription/dashboard/publisher'
 import { SubscriptionChangePreview } from '../../../types/subscription/subscription-change-preview'
 import { DefaultNavbarMetadata } from '@/features/ui/components/types/default-navbar-metadata'
 import { FooterMetadata } from '@/features/ui/components/types/footer-metadata'
+import type { ScriptLogType } from '../../../modules/admin-panel/frontend/js/features/script-logs/script-log'
+import { ActiveExperiment } from './labs-utils'
+import { Subscription as AdminSubscription } from '../../../types/admin/subscription'
+import { AdminCapability } from '../../../types/admin-capabilities'
+
 export interface Meta {
   'ol-ExposedSettings': ExposedSettings
-  'ol-addonPrices': Record<string, { annual: string; monthly: string }>
+  'ol-addonPrices': Record<
+    string,
+    { annual: string; monthly: string; annualDividedByTwelve: string }
+  >
+  'ol-adminCapabilities': AdminCapability[]
+  'ol-adminSubscription': AdminSubscription
+  'ol-aiAssistViaWritefullSource': string
   'ol-allInReconfirmNotificationPeriods': UserEmailData[]
   'ol-allowedExperiments': string[]
   'ol-allowedImageNames': AllowedImageName[]
@@ -65,7 +81,6 @@ export interface Meta {
   // dynamic keys based on permissions
   'ol-canUseAddSeatsFeature': boolean
   'ol-canUseFlexibleLicensing': boolean
-  'ol-canUseFlexibleLicensingForConsolidatedPlans': boolean
   'ol-cannot-add-secondary-email': boolean
   'ol-cannot-change-password': boolean
   'ol-cannot-delete-own-account': boolean
@@ -75,7 +90,11 @@ export interface Meta {
   'ol-cannot-link-other-third-party-sso': boolean
   'ol-cannot-reactivate-subscription': boolean
   'ol-cannot-use-ai': boolean
-  'ol-chatEnabled': boolean
+  'ol-capabilities': Array<'dropbox' | 'chat' | 'use-ai'>
+  'ol-compileSettings': {
+    reducedTimeoutWarning: string
+    compileTimeout: number
+  }
   'ol-compilesUserContentDomain': string
   'ol-countryCode': PricingFormState['country']
   'ol-couponCode': PricingFormState['coupon']
@@ -101,11 +120,13 @@ export interface Meta {
   'ol-gitBridgeEnabled': boolean
   'ol-gitBridgePublicBaseUrl': string
   'ol-github': { enabled: boolean; error: boolean }
+  'ol-groupAuditLogs': []
   'ol-groupId': string
   'ol-groupName': string
   'ol-groupPlans': GroupPlans
   'ol-groupPolicy': GroupPolicy
   'ol-groupSSOActive': boolean
+  'ol-groupSSOConfig'?: SSOConfig
   'ol-groupSSOTestResult': GroupSSOTestResult
   'ol-groupSettingsAdvertisedFor': string[]
   'ol-groupSettingsEnabledFor': string[]
@@ -113,10 +134,12 @@ export interface Meta {
   'ol-groupSsoSetupSuccess': boolean
   'ol-groupSubscriptionsPendingEnrollment': PendingGroupSubscriptionEnrollment[]
   'ol-groupsAndEnterpriseBannerVariant': GroupsAndEnterpriseBannerVariant
+  'ol-hasAiAssistViaWritefull': boolean
   'ol-hasGroupSSOFeature': boolean
-  'ol-hasIndividualRecurlySubscription': boolean
+  'ol-hasIndividualPaidSubscription': boolean
   'ol-hasManagedUsersFeature': boolean
   'ol-hasPassword': boolean
+  'ol-hasSplitTestWriteAccess': boolean
   'ol-hasSubscription': boolean
   'ol-hasTrackChangesFeature': boolean
   'ol-hideLinkingWidgets': boolean // CI only
@@ -126,22 +149,23 @@ export interface Meta {
   'ol-institutionLinked': InstitutionLink | undefined
   'ol-inviteToken': string
   'ol-inviterName': string
+  'ol-isCollectionMethodManual': boolean
   'ol-isExternalAuthenticationSystemUsed': boolean
   'ol-isManagedAccount': boolean
-  'ol-isPaywallChangeCompileTimeoutEnabled': boolean
   'ol-isProfessional': boolean
   'ol-isRegisteredViaGoogle': boolean
   'ol-isRestrictedTokenMember': boolean
-  'ol-isReviewerRoleEnabled': boolean
   'ol-isSaas': boolean
+  'ol-isUserGroupManager': boolean
   'ol-itm_campaign': string
   'ol-itm_content': string
   'ol-itm_referrer': string
   'ol-labs': boolean
+  'ol-labsExperiments': ActiveExperiment[] | undefined
   'ol-languages': SpellCheckLanguage[]
   'ol-learnedWords': string[]
   'ol-legacyEditorThemes': string[]
-  'ol-licenseQuantity': number | undefined
+  'ol-licenseQuantity'?: number
   'ol-loadingText': string
   'ol-managedGroupSubscriptions': ManagedGroupSubscription[]
   'ol-managedInstitutions': ManagedInstitution[]
@@ -160,8 +184,9 @@ export interface Meta {
   'ol-notifications': NotificationType[]
   'ol-notificationsInstitution': InstitutionType[]
   'ol-oauthProviders': OAuthProviders
-  'ol-odcRole': string
+  'ol-odcData': OnboardingFormData
   'ol-overallThemes': OverallThemeMeta[]
+  'ol-pages': number
   'ol-passwordStrengthOptions': PasswordStrengthOptions
   'ol-paywallPlans': { [key: string]: string }
   'ol-personalAccessTokens': AccessToken[] | undefined
@@ -173,25 +198,42 @@ export interface Meta {
   'ol-postCheckoutRedirect': string
   'ol-postUrl': string
   'ol-prefetchedProjectsBlob': GetProjectsResponseBody | undefined
+  'ol-prefetchedTemplatesBlob': GetTemplatesResponseBody | undefined
   'ol-preventCompileOnLoad'?: boolean
   'ol-primaryEmail': { email: string; confirmed: boolean }
   'ol-project': any // TODO
+  'ol-projectEntityCounts': { files: number; docs: number }
   'ol-projectHistoryBlobsEnabled': boolean
   'ol-projectName': string
+  'ol-projectOwnerHasPremiumOnPageLoad': boolean
   'ol-projectSyncSuccessMessage': string
   'ol-projectTags': Tag[]
   'ol-project_id': string
+  'ol-purchaseReferrer': string
   'ol-recommendedCurrency': CurrencyCode
   'ol-reconfirmationRemoveEmail': string
   'ol-reconfirmedViaSAML': string
+  'ol-recurlyAccount':
+    | {
+        code: string
+        error?: undefined
+      }
+    | {
+        error: boolean
+        code?: undefined
+      }
+    | undefined
   'ol-recurlyApiKey': string
   'ol-recurlySubdomain': string
   'ol-ro-mirror-on-client-no-local-storage': boolean
   'ol-samlError': SAMLError | undefined
+  'ol-script-log': ScriptLogType
+  'ol-script-logs': ScriptLogType[]
   'ol-settingsGroupSSO': { enabled: boolean } | undefined
   'ol-settingsPlans': Plan[]
   'ol-shouldAllowEditingDetails': boolean
   'ol-shouldLoadHotjar': boolean
+  'ol-showAiAssistNotification': boolean
   'ol-showAiErrorAssistant': boolean
   'ol-showBrlGeoBanner': boolean
   'ol-showCouponField': boolean
@@ -206,9 +248,12 @@ export interface Meta {
   'ol-showUpgradePrompt': boolean
   'ol-skipUrl': string
   'ol-splitTestInfo': { [name: string]: SplitTestInfo }
+  'ol-splitTestName': string
   'ol-splitTestVariants': { [name: string]: string }
   'ol-ssoDisabled': boolean
   'ol-ssoErrorMessage': string
+  'ol-stripeAccountId': string
+  'ol-stripeCustomerId': string
   'ol-subscription': any // TODO: mixed types, split into two fields
   'ol-subscriptionChangePreview': SubscriptionChangePreview
   'ol-subscriptionId': string
@@ -225,7 +270,6 @@ export interface Meta {
   'ol-translationUnableToJoin': string
   'ol-usGovBannerVariant': USGovBannerVariant
   'ol-useShareJsHash': boolean
-  'ol-usedLatex': 'never' | 'occasionally' | 'often' | undefined
   'ol-user': User
   'ol-userAffiliations': Affiliation[]
   'ol-userCanExtendTrial': boolean
@@ -236,6 +280,7 @@ export interface Meta {
   'ol-users': ManagedUser[]
   'ol-usersBestSubscription': ProjectDashboardSubscription | undefined
   'ol-usersEmail': string | undefined
+  'ol-usersSubscription': { personal: boolean; group: boolean }
   'ol-validationStatus': ValidationStatus
   'ol-wikiEnabled': boolean
   'ol-writefullCssUrl': string
@@ -282,6 +327,7 @@ export default function getMeta<T extends keyof Meta>(name: T): Meta[T] {
       value = element.hasAttribute('content')
       break
     case 'json':
+    case 'number':
       if (!plainTextValue) {
         // JSON.parse('') throws
         value = undefined
diff --git a/services/web/frontend/js/utils/react.ts b/services/web/frontend/js/utils/react.ts
index c399409d0c..3f837c520e 100644
--- a/services/web/frontend/js/utils/react.ts
+++ b/services/web/frontend/js/utils/react.ts
@@ -1,16 +1,23 @@
-import { forwardRef } from 'react'
+import {
+  forwardRef,
+  PropsWithoutRef,
+  ReactElement,
+  Ref,
+  RefAttributes,
+  FunctionComponent,
+} from 'react'
 
 export const fixedForwardRef = <
   T,
   P = object,
-  A extends Record<string, React.FunctionComponent> = Record<
+  A extends Record<string, FunctionComponent> = Record<
     string,
-    React.FunctionComponent
+    FunctionComponent
   >,
 >(
-  render: (props: P, ref: React.Ref<T>) => React.ReactElement | null,
+  render: (props: PropsWithoutRef<P>, ref: Ref<T>) => ReactElement | null,
   propsToAttach: A = {} as A
-): ((props: P & React.RefAttributes<T>) => React.ReactElement | null) & A => {
+): ((props: P & RefAttributes<T>) => ReactElement | null) & A => {
   const ForwardReferredComponent = forwardRef(render) as any
 
   for (const i in propsToAttach) {
diff --git a/services/web/frontend/js/vendor/libs/sharejs.js b/services/web/frontend/js/vendor/libs/sharejs.js
index a8bbdfaa78..e3bec4804e 100644
--- a/services/web/frontend/js/vendor/libs/sharejs.js
+++ b/services/web/frontend/js/vendor/libs/sharejs.js
@@ -680,6 +680,7 @@ export const { Doc } = (() => {
   // Text document API for text
 
   text.api = {
+    otType: "sharejs-text-ot",
     provides: { text: true },
 
     // The number of characters in the string
@@ -1095,14 +1096,7 @@ export const { Doc } = (() => {
           if (!msg.error) {
             if (msg.op === undefined && msg.v !== undefined) {
               if (msg.v < this.version) {
-                postJSON('/error/client', {
-                  body: {
-                    error: {
-                      message: 'out-of-order-ack-ignored'
-                    },
-                    meta: { msg, version: this.version }
-                  }
-                })
+                debugConsole.warn('Received an ack for an op with an outdated version.')
                 return
               }
             } else {
@@ -1322,7 +1316,8 @@ export const { Doc } = (() => {
           var needToRecomputeHash = !this.__lastSubmitTimestamp || (age > RECOMPUTE_HASH_INTERVAL) || (age < 0)
           if (needToRecomputeHash || debugging) {
             // send git hash of current snapshot
-            var sha1 = generateSHA1Hash("blob " + this.snapshot.length + "\x00" + this.snapshot)
+            const str = this.getText()
+            var sha1 = generateSHA1Hash("blob " + str.length + "\x00" + str)
             this.__lastSubmitTimestamp = now;
           }
         }
diff --git a/services/web/frontend/stories/contact-us-modal.stories.tsx b/services/web/frontend/stories/contact-us-modal.stories.tsx
index 94f67874ea..24c671ce10 100644
--- a/services/web/frontend/stories/contact-us-modal.stories.tsx
+++ b/services/web/frontend/stories/contact-us-modal.stories.tsx
@@ -3,40 +3,10 @@ import useFetchMock from './hooks/use-fetch-mock'
 import ContactUsModal from '../../modules/support/frontend/js/components/contact-us-modal'
 import fixedHelpSuggestionSearch from '../../modules/support/test/frontend/util/fixed-help-suggestion-search'
 import { ScopeDecorator } from './decorators/scope'
-import { StoryObj } from '@storybook/react'
 import OLButton from '@/features/ui/components/ol/ol-button'
-import { bsVersionDecorator } from '../../.storybook/utils/with-bootstrap-switcher'
 
-type Story = StoryObj<typeof ContactUsModal>
 type ContactUsModalProps = ComponentProps<typeof ContactUsModal>
 
-function bootstrap3Story(render: Story['render']): Story {
-  return {
-    render,
-    decorators: [
-      story => {
-        return ScopeDecorator(story)
-      },
-    ],
-  }
-}
-
-function bootstrap5Story(render: Story['render']): Story {
-  return {
-    render,
-    decorators: [
-      story => {
-        return ScopeDecorator(story, undefined, {
-          'ol-bootstrapVersion': 5,
-        })
-      },
-    ],
-    parameters: {
-      bootstrap5: true,
-    },
-  }
-}
-
 function GenericContactUsModal(args: ContactUsModalProps) {
   useFetchMock(fetchMock => {
     fetchMock.post('/support', { status: 200 }, { delay: 1000 })
@@ -50,13 +20,9 @@ function GenericContactUsModal(args: ContactUsModalProps) {
   )
 }
 
-export const Generic: Story = bootstrap3Story(args => (
+export const Generic = (args: ContactUsModalProps) => (
   <GenericContactUsModal {...args} />
-))
-
-export const GenericBootstrap5: Story = bootstrap5Story(args => (
-  <GenericContactUsModal {...args} />
-))
+)
 
 const ContactUsModalWithRequestError = (args: ContactUsModalProps) => {
   useFetchMock(fetchMock => {
@@ -71,18 +37,10 @@ const ContactUsModalWithRequestError = (args: ContactUsModalProps) => {
   )
 }
 
-const renderContactUsModalWithRequestError = (args: ContactUsModalProps) => (
+export const RequestError = (args: ContactUsModalProps) => (
   <ContactUsModalWithRequestError {...args} />
 )
 
-export const RequestError: Story = bootstrap3Story(
-  renderContactUsModalWithRequestError
-)
-
-export const RequestErrorBootstrap5: Story = bootstrap5Story(
-  renderContactUsModalWithRequestError
-)
-
 const ContactUsModalWithAcknowledgement = (
   args: Omit<ContactUsModalProps, 'show' | 'handleHide'>
 ) => {
@@ -110,19 +68,11 @@ const ContactUsModalWithAcknowledgement = (
   )
 }
 
-const renderContactUsModalWithAcknowledgement = (args: ContactUsModalProps) => {
-  const { show, handleHide, ...rest } = args
+export const WithAcknowledgement = (args: ContactUsModalProps) => {
+  const { show: _show, handleHide: _handleHide, ...rest } = args
   return <ContactUsModalWithAcknowledgement {...rest} />
 }
 
-export const WithAcknowledgement: Story = bootstrap3Story(
-  renderContactUsModalWithAcknowledgement
-)
-
-export const WithAcknowledgementBootstrap5: Story = bootstrap5Story(
-  renderContactUsModalWithAcknowledgement
-)
-
 export default {
   title: 'Shared / Modals / Contact Us',
   component: ContactUsModal,
@@ -133,6 +83,6 @@ export default {
   },
   argTypes: {
     handleHide: { action: 'close modal' },
-    ...bsVersionDecorator.argTypes,
   },
+  decorators: [ScopeDecorator],
 }
diff --git a/services/web/frontend/stories/decorators/scope.tsx b/services/web/frontend/stories/decorators/scope.tsx
index 473aa037de..9bde1eebfa 100644
--- a/services/web/frontend/stories/decorators/scope.tsx
+++ b/services/web/frontend/stories/decorators/scope.tsx
@@ -1,5 +1,4 @@
 import React, { FC, useEffect, useState } from 'react'
-import { get } from 'lodash'
 import { User, UserId } from '../../../types/user'
 import { Project } from '../../../types/project'
 import {
@@ -11,11 +10,9 @@ import useFetchMock from '../hooks/use-fetch-mock'
 import { useMeta } from '../hooks/use-meta'
 import SocketIOShim, { SocketIOMock } from '@/ide/connection/SocketIoShim'
 import { IdeContext } from '@/shared/context/ide-context'
-import {
-  IdeReactContext,
-  createReactScopeValueStore,
-} from '@/features/ide-react/context/ide-react-context'
+import { IdeReactContext } from '@/features/ide-react/context/ide-react-context'
 import { IdeEventEmitter } from '@/features/ide-react/create-ide-event-emitter'
+import { ReactScopeValueStore } from '@/features/ide-react/scope-value-store/react-scope-value-store'
 import { ReactScopeEventEmitter } from '@/features/ide-react/scope-event-emitter/react-scope-event-emitter'
 import { ConnectionContext } from '@/features/ide-react/context/connection-context'
 import { Socket } from '@/features/ide-react/connection/types/socket'
@@ -24,85 +21,44 @@ import { ReactContextRoot } from '@/features/ide-react/context/react-context-roo
 
 const scopeWatchers: [string, (value: any) => void][] = []
 
-const initialize = () => {
-  const user: User = {
-    id: 'story-user' as UserId,
-    email: 'story-user@example.com',
-    allowedFreeTrial: true,
-    features: { dropbox: true, symbolPalette: true },
-  }
+const user: User = {
+  id: 'story-user' as UserId,
+  email: 'story-user@example.com',
+  allowedFreeTrial: true,
+  features: { dropbox: true, symbolPalette: true },
+}
 
-  const project: Project = {
-    _id: '63e21c07946dd8c76505f85a',
-    name: 'A Project',
-    features: { mendeley: true, zotero: true, referencesSearch: true },
-    tokens: {},
-    owner: {
-      _id: 'a-user',
-      email: 'stories@overleaf.com',
+const project: Project = {
+  _id: '63e21c07946dd8c76505f85a',
+  name: 'A Project',
+  features: { mendeley: true, zotero: true, referencesSearch: true },
+  tokens: {},
+  owner: {
+    _id: 'a-user',
+    email: 'stories@overleaf.com',
+  },
+  members: [],
+  invites: [],
+  rootDocId: '5e74f1a7ce17ae0041dfd056',
+  rootFolder: [
+    {
+      _id: 'root-folder-id',
+      name: 'rootFolder',
+      docs: [
+        { _id: 'test-file-id', name: 'testfile.tex' },
+        { _id: 'test-bib-file-id', name: 'testsources.bib' },
+      ],
+      fileRefs: [{ _id: 'test-image-id', name: 'frog.jpg', hash: '42' }],
+      folders: [],
     },
-    members: [],
-    invites: [],
-    rootDoc_id: '5e74f1a7ce17ae0041dfd056',
-    rootFolder: [
-      {
-        _id: 'root-folder-id',
-        name: 'rootFolder',
-        docs: [
-          { _id: 'test-file-id', name: 'testfile.tex' },
-          { _id: 'test-bib-file-id', name: 'testsources.bib' },
-        ],
-        fileRefs: [{ _id: 'test-image-id', name: 'frog.jpg', hash: '42' }],
-        folders: [],
-      },
-    ],
-  }
+  ],
+}
 
-  const scope = {
-    user,
-    project,
-    $watch: (key: string, callback: () => void) => {
-      scopeWatchers.push([key, callback])
-    },
-    $applyAsync: (callback: () => void) => {
-      window.setTimeout(() => {
-        callback()
-        for (const [key, watcher] of scopeWatchers) {
-          watcher(get(ide.$scope, key))
-        }
-      }, 0)
-    },
-    $on: (eventName: string, callback: () => void) => {
-      //
-    },
-    $broadcast: () => {},
-    ui: {
-      chatOpen: true,
-      pdfLayout: 'flat',
-    },
-    settings: {
-      pdfViewer: 'js',
-      syntaxValidation: true,
-    },
-    editor: {
-      richText: false,
-      sharejs_doc: {
-        doc_id: 'test-doc',
-        getSnapshot: () => 'some doc content',
-      },
-      open_doc_name: 'testfile.tex',
-    },
-    hasLintingError: false,
-    permissionsLevel: 'owner',
-  }
-
-  const ide = {
-    $scope: scope,
-    socket: new SocketIOShim.SocketShimNoop(
-      new SocketIOMock()
-    ) as unknown as Socket,
-  }
+const socket = new SocketIOShim.SocketShimNoop(
+  new SocketIOMock()
+) as unknown as Socket
 
+const initializeMetaTags = () => {
   // window.metaAttributesCache is reset in preview.tsx
   window.metaAttributesCache.set('ol-user', user)
   window.metaAttributesCache.set('ol-project_id', project._id)
@@ -110,8 +66,6 @@ const initialize = () => {
     'ol-gitBridgePublicBaseUrl',
     'https://git.stories.com'
   )
-
-  window._ide = ide
 }
 
 type ScopeDecoratorOptions = {
@@ -124,7 +78,7 @@ export const ScopeDecorator = (
   opts: ScopeDecoratorOptions = { mockCompileOnLoad: true },
   meta: Record<string, any> = {}
 ) => {
-  initialize()
+  initializeMetaTags()
 
   // mock compile on load
   useFetchMock(fetchMock => {
@@ -158,7 +112,7 @@ export const ScopeDecorator = (
   )
 }
 
-const ConnectionProvider: FC = ({ children }) => {
+const ConnectionProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const [value] = useState(() => {
     const connectionState: ConnectionState = {
       readyState: WebSocket.OPEN,
@@ -170,7 +124,7 @@ const ConnectionProvider: FC = ({ children }) => {
       error: '',
     }
     return {
-      socket: window._ide.socket as Socket,
+      socket,
       connectionState,
       isConnected: true,
       isStillReconnecting: false,
@@ -200,7 +154,7 @@ const ConnectionProvider: FC = ({ children }) => {
   )
 }
 
-const IdeReactProvider: FC = ({ children }) => {
+const IdeReactProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const projectId = 'project-123'
   const [startedFreeTrial, setStartedFreeTrial] = useState(false)
 
@@ -211,28 +165,27 @@ const IdeReactProvider: FC = ({ children }) => {
     setStartedFreeTrial,
     reportError: () => {},
     projectJoined: true,
+    permissionsLevel: 'owner' as const,
+    setPermissionsLevel: () => {},
+    setOutOfSync: () => {},
   }))
 
   const [ideContextValue] = useState(() => {
-    const ide = window._ide
-    const scopeStore = createReactScopeValueStore(projectId)
-    for (const [key, value] of Object.entries(ide.$scope)) {
-      scopeStore.set(key, value)
-    }
     const scopeEventEmitter = new ReactScopeEventEmitter(new IdeEventEmitter())
+    const unstableStore = new ReactScopeValueStore()
 
     window.overleaf = {
       ...window.overleaf,
       unstable: {
         ...window.overleaf?.unstable,
-        store: scopeStore,
+        store: unstableStore,
       },
     }
 
     return {
-      ...ide,
-      scopeStore,
+      socket,
       scopeEventEmitter,
+      unstableStore,
     }
   })
 
diff --git a/services/web/frontend/stories/dropdown.stories.jsx b/services/web/frontend/stories/dropdown.stories.jsx
deleted file mode 100644
index 57a3996983..0000000000
--- a/services/web/frontend/stories/dropdown.stories.jsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { Dropdown, MenuItem } from 'react-bootstrap'
-import ControlledDropdown from '../js/shared/components/controlled-dropdown'
-
-export const Customized = args => {
-  return (
-    <ControlledDropdown
-      pullRight={args.pullRight}
-      defaultOpen={args.defaultOpen}
-      id="dropdown-story"
-    >
-      <Dropdown.Toggle
-        noCaret={args.noCaret}
-        className={args.className}
-        bsStyle={args.bsStyle}
-      >
-        {args.title}
-      </Dropdown.Toggle>
-      <Dropdown.Menu>
-        <MenuItem eventKey="1">Action</MenuItem>
-        <MenuItem eventKey="2">Another action</MenuItem>
-        <MenuItem eventKey="3" active>
-          Active Item
-        </MenuItem>
-        <MenuItem divider />
-        <MenuItem eventKey="4">Separated link</MenuItem>
-      </Dropdown.Menu>
-    </ControlledDropdown>
-  )
-}
-Customized.args = {
-  title: 'Toggle & Menu used separately',
-}
-
-export default {
-  title: 'Shared / Components / Dropdown',
-  component: ControlledDropdown,
-  args: {
-    bsStyle: 'default',
-    title: 'Dropdown',
-    pullRight: false,
-    noCaret: false,
-    className: '',
-    defaultOpen: true,
-  },
-}
diff --git a/services/web/frontend/stories/editor/synctex-toasts.stories.tsx b/services/web/frontend/stories/editor/synctex-toasts.stories.tsx
new file mode 100644
index 0000000000..0e4a55c5f6
--- /dev/null
+++ b/services/web/frontend/stories/editor/synctex-toasts.stories.tsx
@@ -0,0 +1,26 @@
+import { Meta, StoryObj } from '@storybook/react'
+import { OLToast } from '@/features/ui/components/ol/ol-toast'
+import { SynctexFileErrorToast } from '@/features/pdf-preview/components/synctex-toasts'
+
+const meta = {
+  title: 'Editor/ Synctex File Error Toast',
+  component: SynctexFileErrorToast,
+  decorators: [
+    Story => (
+      <div style={{ width: 'fit-content' }}>
+        <OLToast type="warning" isDismissible content={<Story />} />
+      </div>
+    ),
+  ],
+} satisfies Meta<typeof SynctexFileErrorToast>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const WithoutFile = {
+  args: { data: {} },
+} satisfies Story
+
+export const WithFile = {
+  args: { data: { filePath: 'references.bbl' } },
+} satisfies Story
diff --git a/services/web/frontend/stories/feedback-badge.stories.tsx b/services/web/frontend/stories/feedback-badge.stories.tsx
index db48e0d097..560adaf1a8 100644
--- a/services/web/frontend/stories/feedback-badge.stories.tsx
+++ b/services/web/frontend/stories/feedback-badge.stories.tsx
@@ -1,6 +1,5 @@
 import { ScopeDecorator } from './decorators/scope'
 import { FeedbackBadge } from '@/shared/components/feedback-badge'
-import { bsVersionDecorator } from '../../.storybook/utils/with-bootstrap-switcher'
 
 export const WithDefaultText = () => {
   return (
@@ -33,7 +32,4 @@ export default {
   title: 'Shared / Components / Feedback Badge',
   component: FeedbackBadge,
   decorators: [ScopeDecorator],
-  argTypes: {
-    ...bsVersionDecorator.argTypes,
-  },
 }
diff --git a/services/web/frontend/stories/file-view/file-view.stories.jsx b/services/web/frontend/stories/file-view/file-view.stories.jsx
index bad7002755..80c4363c9d 100644
--- a/services/web/frontend/stories/file-view/file-view.stories.jsx
+++ b/services/web/frontend/stories/file-view/file-view.stories.jsx
@@ -35,6 +35,7 @@ const setupFetchMock = fetchMock => {
 const fileData = {
   id: 'file-id',
   name: 'file.tex',
+  hash: 'c0ffee',
   created: new Date().toISOString(),
 }
 
@@ -158,11 +159,9 @@ ImageFile.args = {
 
 export const TextFile = args => {
   useFetchMock(fetchMock =>
-    setupFetchMock(fetchMock).get(
-      'express:/project/:project_id/blob/:hash',
-      { body: bodies.text },
-      { overwriteRoutes: true }
-    )
+    setupFetchMock(fetchMock).get('express:/project/:project_id/blob/:hash', {
+      body: bodies.text,
+    })
   )
   return <FileView {...args} />
 }
@@ -180,11 +179,9 @@ TextFile.args = {
 
 export const UploadedFile = args => {
   useFetchMock(fetchMock =>
-    setupFetchMock(fetchMock).head(
-      'express:/project/:project_id/blob/:hash',
-      { status: 500 },
-      { overwriteRoutes: true }
-    )
+    setupFetchMock(fetchMock).head('express:/project/:project_id/blob/:hash', {
+      status: 500,
+    })
   )
   return <FileView {...args} />
 }
diff --git a/services/web/frontend/stories/fixtures/compile.js b/services/web/frontend/stories/fixtures/compile.js
index 595998d3da..e31a4488e4 100644
--- a/services/web/frontend/stories/fixtures/compile.js
+++ b/services/web/frontend/stories/fixtures/compile.js
@@ -58,7 +58,7 @@ export const mockCompile = (fetchMock, delay = 1000) =>
         outputFiles: cloneDeep(outputFiles),
       },
     },
-    { delay, overwriteRoutes: true }
+    { delay }
   )
 
 export const mockCompileError = (fetchMock, status = 'success', delay = 1000) =>
@@ -91,27 +91,24 @@ export const mockCompileValidationIssues = (
         },
       }
     },
-    { delay, overwriteRoutes: true }
+    { delay }
   )
 
 export const mockClearCache = fetchMock =>
   fetchMock.delete('express:/project/:projectId/output', 204, {
     delay: 1000,
-    overwriteRoutes: true,
   })
 
 export const mockBuildFile = fetchMock =>
-  fetchMock.get(
-    'express:/build/:file',
-    (url, options, request) => {
-      const { pathname } = new URL(url, 'https://example.com')
+  fetchMock.get('express:/build/:file', ({ url }) => {
+    const { pathname } = new URL(url, 'https://example.com')
 
-      switch (pathname) {
-        case '/build/output.blg':
-          return 'This is BibTeX, Version 4.0' // FIXME
+    switch (pathname) {
+      case '/build/output.blg':
+        return 'This is BibTeX, Version 4.0' // FIXME
 
-        case '/build/output.log':
-          return `
+      case '/build/output.log':
+        return `
 The LaTeX compiler output
   * With a lot of details
 
@@ -134,31 +131,29 @@ LaTeX Font Info:    External font \`cmex10' loaded for size
 
 `
 
-        case '/build/output.pdf':
-          return new Promise(resolve => {
-            const xhr = new XMLHttpRequest()
-            xhr.addEventListener('load', () => {
-              resolve({
-                status: 200,
-                headers: {
-                  'Content-Length': xhr.getResponseHeader('Content-Length'),
-                  'Content-Type': xhr.getResponseHeader('Content-Type'),
-                },
-                body: xhr.response,
-              })
+      case '/build/output.pdf':
+        return new Promise(resolve => {
+          const xhr = new XMLHttpRequest()
+          xhr.addEventListener('load', () => {
+            resolve({
+              status: 200,
+              headers: {
+                'Content-Length': xhr.getResponseHeader('Content-Length'),
+                'Content-Type': xhr.getResponseHeader('Content-Type'),
+              },
+              body: xhr.response,
             })
-            xhr.open('GET', examplePdf)
-            xhr.responseType = 'arraybuffer'
-            xhr.send()
           })
+          xhr.open('GET', examplePdf)
+          xhr.responseType = 'arraybuffer'
+          xhr.send()
+        })
 
-        default:
-          console.log(pathname)
-          return 404
-      }
-    },
-    { sendAsJson: false, overwriteRoutes: true }
-  )
+      default:
+        console.log(pathname)
+        return 404
+    }
+  })
 
 const mockHighlights = [
   {
@@ -195,29 +190,25 @@ export const mockEventTracking = fetchMock =>
   fetchMock.get('express:/event/:event', 204)
 
 export const mockValidPdf = fetchMock =>
-  fetchMock.get(
-    'express:/build/output.pdf',
-    (url, options, request) => {
-      return new Promise(resolve => {
-        const xhr = new XMLHttpRequest()
-        xhr.addEventListener('load', () => {
-          resolve({
-            status: 200,
-            headers: {
-              'Content-Length': xhr.getResponseHeader('Content-Length'),
-              'Content-Type': xhr.getResponseHeader('Content-Type'),
-              'Accept-Ranges': 'bytes',
-            },
-            body: xhr.response,
-          })
+  fetchMock.get('express:/build/output.pdf', () => {
+    return new Promise(resolve => {
+      const xhr = new XMLHttpRequest()
+      xhr.addEventListener('load', () => {
+        resolve({
+          status: 200,
+          headers: {
+            'Content-Length': xhr.getResponseHeader('Content-Length'),
+            'Content-Type': xhr.getResponseHeader('Content-Type'),
+            'Accept-Ranges': 'bytes',
+          },
+          body: xhr.response,
         })
-        xhr.open('GET', examplePdf)
-        xhr.responseType = 'arraybuffer'
-        xhr.send()
       })
-    },
-    { sendAsJson: false, overwriteRoutes: true }
-  )
+      xhr.open('GET', examplePdf)
+      xhr.responseType = 'arraybuffer'
+      xhr.send()
+    })
+  })
 
 export const mockSynctex = fetchMock =>
   fetchMock
diff --git a/services/web/frontend/stories/fixtures/document.ts b/services/web/frontend/stories/fixtures/document.ts
index 2ff0466a72..ad2995a4dc 100644
--- a/services/web/frontend/stories/fixtures/document.ts
+++ b/services/web/frontend/stories/fixtures/document.ts
@@ -2,6 +2,7 @@ export function mockDocument(text: string) {
   return {
     doc_id: 'story-doc',
     getSnapshot: () => text,
+    hasBufferedOps: () => false,
   }
 }
 
diff --git a/services/web/frontend/stories/hooks/use-fetch-mock.tsx b/services/web/frontend/stories/hooks/use-fetch-mock.tsx
index c5a527c81d..304d9e0273 100644
--- a/services/web/frontend/stories/hooks/use-fetch-mock.tsx
+++ b/services/web/frontend/stories/hooks/use-fetch-mock.tsx
@@ -1,18 +1,20 @@
 import { useLayoutEffect } from 'react'
 import fetchMock from 'fetch-mock'
-fetchMock.config.fallbackToNetwork = true
 
 /**
- * Run callback to mock fetch routes, call restore() when unmounted
+ * Run callback to mock fetch routes, call removeRoutes() and unmockGlobal() when unmounted
  */
 export default function useFetchMock(
   callback: (value: typeof fetchMock) => void
 ) {
-  useLayoutEffect(() => {
-    callback(fetchMock)
+  fetchMock.mockGlobal()
 
+  useLayoutEffect(() => {
+    fetchMock.mockGlobal()
+    callback(fetchMock)
     return () => {
-      fetchMock.restore()
+      fetchMock.removeRoutes()
+      fetchMock.unmockGlobal()
     }
   }, [callback])
 }
diff --git a/services/web/frontend/stories/icon.stories.jsx b/services/web/frontend/stories/icon.stories.jsx
deleted file mode 100644
index d0f0d2d885..0000000000
--- a/services/web/frontend/stories/icon.stories.jsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import Icon from '../js/shared/components/icon'
-
-export const Type = args => {
-  return (
-    <>
-      <Icon {...args} />
-      <div>
-        <a
-          href="https://fontawesome.com/v4.7.0/icons/"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Font Awesome icons
-        </a>
-      </div>
-    </>
-  )
-}
-Type.args = {
-  type: 'tasks',
-}
-
-export const Spinner = args => {
-  return <Icon {...args} />
-}
-Spinner.args = {
-  type: 'spinner',
-  spin: true,
-}
-
-export const FixedWidth = args => {
-  return <Icon {...args} />
-}
-FixedWidth.args = {
-  type: 'tasks',
-  fw: true,
-}
-
-export const AccessibilityLabel = args => {
-  return <Icon {...args} />
-}
-AccessibilityLabel.args = {
-  type: 'check',
-  accessibilityLabel: 'Check',
-}
-
-export default {
-  title: 'Shared / Components / Icon',
-  component: Icon,
-}
diff --git a/services/web/frontend/stories/input-switch.stories.tsx b/services/web/frontend/stories/input-switch.stories.tsx
index 7d7707716c..8c3b97354d 100644
--- a/services/web/frontend/stories/input-switch.stories.tsx
+++ b/services/web/frontend/stories/input-switch.stories.tsx
@@ -1,5 +1,4 @@
 import OLFormSwitch from '@/features/ui/components/ol/ol-form-switch'
-import { bsVersionDecorator } from '../../.storybook/utils/with-bootstrap-switcher'
 import { disableControlsOf } from './utils/arg-types'
 
 export const Unchecked = () => {
@@ -22,10 +21,6 @@ export default {
   title: 'Shared / Components / Input Switch',
   component: OLFormSwitch,
   argTypes: {
-    ...bsVersionDecorator.argTypes,
-    ...disableControlsOf('inputRef', 'bs3Props'),
-  },
-  args: {
-    ...bsVersionDecorator.args,
+    ...disableControlsOf('inputRef'),
   },
 }
diff --git a/services/web/frontend/stories/loading/loading.stories.tsx b/services/web/frontend/stories/loading/loading.stories.tsx
index b4c9068737..2fed18a368 100644
--- a/services/web/frontend/stories/loading/loading.stories.tsx
+++ b/services/web/frontend/stories/loading/loading.stories.tsx
@@ -1,7 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react'
 import { LoadingUI } from '@/features/ide-react/components/loading'
 import { EditorProviders } from '../../../test/frontend/helpers/editor-providers'
-import { bsVersionDecorator } from '../../../.storybook/utils/with-bootstrap-switcher'
 import { PartialMeta } from '@/utils/meta'
 
 const meta: Meta<typeof LoadingUI> = {
@@ -19,7 +18,6 @@ const meta: Meta<typeof LoadingUI> = {
       ],
     },
     progress: { control: { type: 'range', min: 0, max: 100 } },
-    ...bsVersionDecorator.argTypes,
   },
 }
 
diff --git a/services/web/frontend/stories/menu-bar.stories.tsx b/services/web/frontend/stories/menu-bar.stories.tsx
index b7126ce374..fe8a7dc926 100644
--- a/services/web/frontend/stories/menu-bar.stories.tsx
+++ b/services/web/frontend/stories/menu-bar.stories.tsx
@@ -9,7 +9,7 @@ export const Default = () => {
     <MenuBar id="toolbar-menu-bar-item">
       <MenuBarDropdown title="File" id="file">
         <MenuBarOption title="New File" />
-        <MenuBarOption title="New Project" />
+        <MenuBarOption title="New project" />
       </MenuBarDropdown>
       <MenuBarDropdown title="Edit" id="edit">
         <MenuBarOption title="Undo" />
@@ -30,9 +30,6 @@ const meta: Meta<typeof MenuBar> = {
   title: 'Shared / Components / MenuBar',
   component: MenuBar,
   argTypes: {},
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/modals/create-file/create-file-modal.stories.jsx b/services/web/frontend/stories/modals/create-file/create-file-modal.stories.jsx
index 1ff2b46c79..ba5ad45d22 100644
--- a/services/web/frontend/stories/modals/create-file/create-file-modal.stories.jsx
+++ b/services/web/frontend/stories/modals/create-file/create-file-modal.stories.jsx
@@ -37,9 +37,7 @@ export const ErrorImportingFileFromExternalURL = args => {
   useFetchMock(fetchMock => {
     mockCreateFileModalFetch(fetchMock)
 
-    fetchMock.post('express:/project/:projectId/linked_file', 500, {
-      overwriteRoutes: true,
-    })
+    fetchMock.post('express:/project/:projectId/linked_file', 500)
   })
 
   getMeta('ol-ExposedSettings').hasLinkUrlFeature = true
@@ -52,9 +50,7 @@ export const ErrorImportingFileFromReferenceProvider = args => {
   useFetchMock(fetchMock => {
     mockCreateFileModalFetch(fetchMock)
 
-    fetchMock.post('express:/project/:projectId/linked_file', 500, {
-      overwriteRoutes: true,
-    })
+    fetchMock.post('express:/project/:projectId/linked_file', 500)
   })
 
   return <FileTreeModalCreateFile {...args} />
diff --git a/services/web/frontend/stories/modals/modal.stories.tsx b/services/web/frontend/stories/modals/modal.stories.tsx
new file mode 100644
index 0000000000..2bdd9bdad8
--- /dev/null
+++ b/services/web/frontend/stories/modals/modal.stories.tsx
@@ -0,0 +1,152 @@
+import Button from '@/features/ui/components/bootstrap-5/button'
+import type { Meta, StoryObj } from '@storybook/react'
+import OLModal, {
+  OLModalHeader,
+  OLModalBody,
+  OLModalFooter,
+  OLModalTitle,
+} from '@/features/ui/components/ol/ol-modal'
+
+type Story = StoryObj<typeof OLModal>
+
+export const Default: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Heading</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            Lorem ipsum dolor sit lorem a amet, consectetur adipiscing elit, sed
+            do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+            enim ad minim veniam.
+          </p>
+        </OLModalBody>
+        <OLModalFooter>
+          <Button variant="secondary">Cancel</Button>
+          <Button variant="primary">Primary</Button>
+        </OLModalFooter>
+      </OLModal>
+    )
+  },
+}
+
+export const ModalWithAcknowledgment: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Acknowledgment</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            System requires an acknowledgment from the user. Usually contains
+            only one primary button.
+          </p>
+        </OLModalBody>
+        <OLModalFooter>
+          <Button variant="primary">Accept</Button>
+        </OLModalFooter>
+      </OLModal>
+    )
+  },
+}
+
+export const ModalWithSecondary: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Heading</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            Lorem ipsum dolor sit lorem a amet, consectetur adipiscing elit, sed
+            do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+            enim ad minim veniam.
+          </p>
+        </OLModalBody>
+        <OLModalFooter>
+          <Button variant="secondary">Cancel</Button>
+        </OLModalFooter>
+      </OLModal>
+    )
+  },
+}
+
+export const ModalWithTertiary: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Heading</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>Used for destructive or irreversible actions.</p>
+        </OLModalBody>
+        <OLModalFooter>
+          <Button variant="secondary">Third</Button>
+          <Button variant="secondary" className="ms-auto">
+            Cancel
+          </Button>
+          <Button variant="primary">Primary</Button>
+        </OLModalFooter>
+      </OLModal>
+    )
+  },
+}
+
+export const ModalInformative: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Informative</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            Presents information for the user to be aware of and doesn’t require
+            any action.
+          </p>
+        </OLModalBody>
+      </OLModal>
+    )
+  },
+}
+
+export const ModalDanger: Story = {
+  render: args => {
+    return (
+      <OLModal show {...args}>
+        <OLModalHeader closeButton>
+          <OLModalTitle>Danger</OLModalTitle>
+        </OLModalHeader>
+        <OLModalBody>
+          <p>
+            Lorem ipsum dolor sit lorem a amet, consectetur adipiscing elit, sed
+            do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
+            enim ad minim veniam.
+          </p>
+        </OLModalBody>
+        <OLModalFooter>
+          <Button variant="secondary">Cancel</Button>
+          <Button variant="danger">Delete</Button>
+        </OLModalFooter>
+      </OLModal>
+    )
+  },
+}
+
+const meta: Meta<typeof OLModal> = {
+  title: 'Shared / Components / Modal',
+  component: OLModal,
+  argTypes: {
+    size: {
+      control: 'radio',
+      options: ['lg', 'md', 'sm'],
+    },
+  },
+}
+
+export default meta
diff --git a/services/web/frontend/stories/modals/unsaved-docs-locked-modal.stories.tsx b/services/web/frontend/stories/modals/unsaved-docs-locked-modal.stories.tsx
index 44092f2218..324721e94d 100644
--- a/services/web/frontend/stories/modals/unsaved-docs-locked-modal.stories.tsx
+++ b/services/web/frontend/stories/modals/unsaved-docs-locked-modal.stories.tsx
@@ -1,18 +1,11 @@
 import { Meta, StoryObj } from '@storybook/react'
 import { UnsavedDocsLockedAlert } from '@/features/ide-react/components/unsaved-docs/unsaved-docs-locked-alert'
 import { ScopeDecorator } from '../decorators/scope'
-import { bsVersionDecorator } from '../../../.storybook/utils/with-bootstrap-switcher'
 
 export default {
   title: 'Editor / Modals / Unsaved Docs Locked',
   component: UnsavedDocsLockedAlert,
   decorators: [Story => ScopeDecorator(Story)],
-  argTypes: {
-    ...bsVersionDecorator.argTypes,
-  },
-  parameters: {
-    bootstrap5: true,
-  },
 } satisfies Meta
 
 type Story = StoryObj<typeof UnsavedDocsLockedAlert>
diff --git a/services/web/frontend/stories/notification.stories.tsx b/services/web/frontend/stories/notification.stories.tsx
index 321e7e3e33..0c55606278 100644
--- a/services/web/frontend/stories/notification.stories.tsx
+++ b/services/web/frontend/stories/notification.stories.tsx
@@ -315,11 +315,7 @@ export const OverlayedWithCustomClass = (args: Args) => {
 
 export const SuccessFlow = (args: Args) => {
   console.log('.....render')
-  fetchMock.post(
-    'express:/test-success',
-    { status: 200 },
-    { delay: 250, overwriteRoutes: true }
-  )
+  fetchMock.post('express:/test-success', { status: 200 }, { delay: 250 })
 
   const { isLoading, isSuccess, runAsync } = useAsync()
   function handleClick() {
diff --git a/services/web/frontend/stories/online-users.stories.tsx b/services/web/frontend/stories/online-users.stories.tsx
new file mode 100644
index 0000000000..7d2796cb2e
--- /dev/null
+++ b/services/web/frontend/stories/online-users.stories.tsx
@@ -0,0 +1,69 @@
+import { Meta } from '@storybook/react'
+import { OnlineUser } from '@/features/ide-react/context/online-users-context'
+import OnlineUsersWidgetOld from '@/features/editor-navigation-toolbar/components/online-users-widget'
+import { OnlineUsersWidget } from '@/features/ide-redesign/components/online-users/online-users-widget'
+
+const NAMES = [
+  'Alice',
+  'Bob',
+  'Charlie',
+  'Dave',
+  'Erin',
+  'Frank',
+  'Grace',
+  'Heidi',
+  'Ivan',
+  'Judy',
+  'Mallory',
+  'Niaj',
+  'Olivia',
+  'Peggy',
+  'Rupert',
+]
+
+const generateUser = (_: any, index: number): OnlineUser => {
+  const name = NAMES[index % NAMES.length]
+  return {
+    user_id: `user_${'b'.repeat(index)}`,
+    name,
+    id: `user-${index}`,
+    email: `${name.toLowerCase()}@example.com`,
+  }
+}
+
+export const OnlineUsersRedesign = ({ users }: { users: number }) => {
+  const generatedUsers = Array.from({ length: users }, generateUser)
+  return (
+    <div
+      style={{
+        backgroundColor: 'var(--online-users-border-color)',
+        padding: '20px',
+      }}
+    >
+      <OnlineUsersWidget onlineUsers={generatedUsers} goToUser={() => {}} />
+    </div>
+  )
+}
+
+export const OnlineUsersOld = ({ users }: { users: number }) => {
+  const generatedUsers = Array.from({ length: users }, generateUser)
+  return (
+    <div
+      style={{
+        backgroundColor: 'var(--online-users-border-color)',
+        padding: '20px',
+      }}
+    >
+      <OnlineUsersWidgetOld onlineUsers={generatedUsers} goToUser={() => {}} />
+    </div>
+  )
+}
+
+const meta: Meta<typeof OnlineUsersRedesign> = {
+  title: 'Editor / Online Users Widget',
+  args: {
+    users: 6,
+  },
+}
+
+export default meta
diff --git a/services/web/frontend/stories/pdf-log-entry.stories.tsx b/services/web/frontend/stories/pdf-log-entry.stories.tsx
index 561402dcb8..12f7594621 100644
--- a/services/web/frontend/stories/pdf-log-entry.stories.tsx
+++ b/services/web/frontend/stories/pdf-log-entry.stories.tsx
@@ -4,7 +4,7 @@ import { ruleIds } from '@/ide/human-readable-logs/HumanReadableLogsHints'
 import { ScopeDecorator } from './decorators/scope'
 import { useMeta } from './hooks/use-meta'
 import { FC, ReactNode } from 'react'
-import { useScope } from './hooks/use-scope'
+import { EditorViewContext } from '@/features/ide-react/context/editor-view-context'
 import { EditorView } from '@codemirror/view'
 import { LogEntry } from '@/features/pdf-preview/util/types'
 
@@ -34,7 +34,6 @@ const fakeArgs = {
   formattedContent: 'This is a log entry',
   level: 'error' as const,
   extraInfoURL: 'https://example.com',
-  showCloseButton: true,
   showSourceLocationLink: true,
   rawContent: 'This is a raw log entry',
   contentDetails: ['detail 1', 'detail 2'],
@@ -59,10 +58,30 @@ export default meta
 
 type Story = StoryObj<typeof PdfLogEntry>
 
-const Provider: FC<{ children: ReactNode }> = ({ children }) => {
+const MockEditorViewProvider: FC<React.PropsWithChildren> = ({ children }) => {
+  const value = {
+    view: new EditorView({
+      doc: '\\begin{document',
+    }),
+    setView: () => {},
+  }
+
+  return (
+    <EditorViewContext.Provider value={value}>
+      {children}
+    </EditorViewContext.Provider>
+  )
+}
+
+const Provider: FC<React.PropsWithChildren<{ children: ReactNode }>> = ({
+  children,
+}) => {
   useMeta({ 'ol-showAiErrorAssistant': true })
-  useScope({ 'editor.view': new EditorView({ doc: '\\begin{document' }) })
-  return <div className="logs-pane p-2">{children}</div>
+  return (
+    <MockEditorViewProvider>
+      <div className="logs-pane p-2">{children}</div>
+    </MockEditorViewProvider>
+  )
 }
 
 export const PdfLogEntryWithControls: Story = {
diff --git a/services/web/frontend/stories/pdf-preview.stories.jsx b/services/web/frontend/stories/pdf-preview.stories.jsx
index ec66594f69..df0429734e 100644
--- a/services/web/frontend/stories/pdf-preview.stories.jsx
+++ b/services/web/frontend/stories/pdf-preview.stories.jsx
@@ -1,6 +1,6 @@
 import { useCallback, useMemo, useState } from 'react'
 import useFetchMock from './hooks/use-fetch-mock'
-import { Button } from 'react-bootstrap'
+import OLButton from '@/features/ui/components/ol/ol-button'
 import PdfPreviewPane from '../js/features/pdf-preview/components/pdf-preview-pane'
 import PdfPreview from '../js/features/pdf-preview/components/pdf-preview'
 import PdfFileList from '../js/features/pdf-preview/components/pdf-file-list'
@@ -123,10 +123,12 @@ export const Interactive = () => {
                   margin: '10px 0',
                 }}
               >
-                <Button onClick={dispatchDocChanged}>trigger doc change</Button>
-                <Button onClick={toggleLintingError}>
+                <OLButton onClick={dispatchDocChanged}>
+                  trigger doc change
+                </OLButton>
+                <OLButton onClick={toggleLintingError}>
                   toggle linting error
-                </Button>
+                </OLButton>
               </div>
             </div>
           </div>
@@ -317,7 +319,7 @@ export const HybridToolbar = () => {
 
 export const FileList = () => {
   const fileList = useMemo(() => {
-    return buildFileList(cloneDeep(outputFiles))
+    return buildFileList(cloneDeep(outputFiles), {})
   }, [])
 
   return (
diff --git a/services/web/frontend/stories/project-list/add-affiliation.stories.tsx b/services/web/frontend/stories/project-list/add-affiliation.stories.tsx
index d1732bc5d9..75adc967e1 100644
--- a/services/web/frontend/stories/project-list/add-affiliation.stories.tsx
+++ b/services/web/frontend/stories/project-list/add-affiliation.stories.tsx
@@ -26,7 +26,4 @@ export const Add = (args: any) => {
 export default {
   title: 'Project List / Affiliation',
   component: AddAffiliation,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/color-picker.stories.tsx b/services/web/frontend/stories/project-list/color-picker.stories.tsx
index ade57f772a..b7141c2098 100644
--- a/services/web/frontend/stories/project-list/color-picker.stories.tsx
+++ b/services/web/frontend/stories/project-list/color-picker.stories.tsx
@@ -12,7 +12,4 @@ export const Select = (args: any) => {
 export default {
   title: 'Project List / Color Picker',
   component: ColorPicker,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/compile-and-download-project-pdf.stories.tsx b/services/web/frontend/stories/project-list/compile-and-download-project-pdf.stories.tsx
index 422a494649..53fa31cdb0 100644
--- a/services/web/frontend/stories/project-list/compile-and-download-project-pdf.stories.tsx
+++ b/services/web/frontend/stories/project-list/compile-and-download-project-pdf.stories.tsx
@@ -62,7 +62,4 @@ export default {
       </div>
     ),
   ],
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/current-plan-widget.stories.tsx b/services/web/frontend/stories/project-list/current-plan-widget.stories.tsx
index 3827853a67..be9a3b1cb1 100644
--- a/services/web/frontend/stories/project-list/current-plan-widget.stories.tsx
+++ b/services/web/frontend/stories/project-list/current-plan-widget.stories.tsx
@@ -72,7 +72,4 @@ export const PausedPlan = (args: any) => {
 export default {
   title: 'Project List / Current Plan Widget',
   component: CurrentPlanWidget,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/helpers/emails.ts b/services/web/frontend/stories/project-list/helpers/emails.ts
index 06c12eb577..83c09fd527 100644
--- a/services/web/frontend/stories/project-list/helpers/emails.ts
+++ b/services/web/frontend/stories/project-list/helpers/emails.ts
@@ -1,5 +1,5 @@
 import { merge, cloneDeep } from 'lodash'
-import { FetchMockStatic } from 'fetch-mock'
+import { type FetchMock } from 'fetch-mock'
 import { UserEmailData } from '../../../../types/user-email'
 import {
   Institution,
@@ -32,7 +32,7 @@ export const fakeReconfirmationUsersData = {
   default: false,
 } as DeepReadonly<UserEmailData>
 
-export function defaultSetupMocks(fetchMock: FetchMockStatic) {
+export function defaultSetupMocks(fetchMock: FetchMock) {
   // at least one project is required to show some notifications
   const projects = [{}] as Project[]
   fetchMock.post(/\/api\/project/, {
@@ -54,7 +54,7 @@ export function setDefaultMeta() {
   window.metaAttributesCache.set('ol-userEmails', [])
 }
 
-export function errorsMocks(fetchMock: FetchMockStatic) {
+export function errorsMocks(fetchMock: FetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.post(/\/user\/emails\/*/, 500, { delay: MOCK_DELAY })
   fetchMock.post(
@@ -74,7 +74,7 @@ export function setInstitutionMeta(institutionData: Partial<Institution>) {
   ])
 }
 
-export function institutionSetupMocks(fetchMock: FetchMockStatic) {
+export function institutionSetupMocks(fetchMock: FetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.delete(/\/notifications\/*/, 200, { delay: MOCK_DELAY })
 }
@@ -84,7 +84,7 @@ export function setCommonMeta(notificationData: DeepPartial<Notification>) {
   window.metaAttributesCache.set('ol-notifications', [notificationData])
 }
 
-export function commonSetupMocks(fetchMock: FetchMockStatic) {
+export function commonSetupMocks(fetchMock: FetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.post(
     /\/project\/[A-Za-z0-9]+\/invite\/token\/[A-Za-z0-9]+\/accept/,
@@ -98,7 +98,7 @@ export function setReconfirmationMeta() {
   window.metaAttributesCache.set('ol-userEmails', [fakeReconfirmationUsersData])
 }
 
-export function reconfirmationSetupMocks(fetchMock: FetchMockStatic) {
+export function reconfirmationSetupMocks(fetchMock: FetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.post(/\/user\/emails\/resend_confirmation/, 200, {
     delay: MOCK_DELAY,
@@ -113,19 +113,15 @@ export function setReconfirmAffiliationMeta() {
   )
 }
 
-export function reconfirmAffiliationSetupMocks(fetchMock: FetchMockStatic) {
+export function reconfirmAffiliationSetupMocks(fetchMock: FetchMock) {
   defaultSetupMocks(fetchMock)
-  fetchMock.post(
-    /\/api\/project/,
-    {
-      status: 200,
-      body: {
-        projects: [{}],
-        totalSize: 0,
-      },
+  fetchMock.post(/\/api\/project/, {
+    status: 200,
+    body: {
+      projects: [{}],
+      totalSize: 0,
     },
-    { overwriteRoutes: true }
-  )
+  })
   fetchMock.post(/\/user\/emails\/send-reconfirmation/, 200, {
     delay: MOCK_DELAY,
   })
diff --git a/services/web/frontend/stories/project-list/inr-banner.stories.tsx b/services/web/frontend/stories/project-list/inr-banner.stories.tsx
index 4e970afae4..a59cf12492 100644
--- a/services/web/frontend/stories/project-list/inr-banner.stories.tsx
+++ b/services/web/frontend/stories/project-list/inr-banner.stories.tsx
@@ -7,7 +7,4 @@ export const Default = () => {
 export default {
   title: 'Project List / INR Banner',
   component: INRBanner,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/new-project-button.stories.tsx b/services/web/frontend/stories/project-list/new-project-button.stories.tsx
index 6338f5d969..fcb19deb4c 100644
--- a/services/web/frontend/stories/project-list/new-project-button.stories.tsx
+++ b/services/web/frontend/stories/project-list/new-project-button.stories.tsx
@@ -102,9 +102,6 @@ export const Error = () => {
 }
 
 export default {
-  title: 'Project List / New Project Button',
+  title: 'Project List / New project Button',
   component: NewProjectButton,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/notifications.stories.tsx b/services/web/frontend/stories/project-list/notifications.stories.tsx
index 773dcebe5d..ea00f84681 100644
--- a/services/web/frontend/stories/project-list/notifications.stories.tsx
+++ b/services/web/frontend/stories/project-list/notifications.stories.tsx
@@ -14,6 +14,8 @@ import {
   setReconfirmationMeta,
 } from './helpers/emails'
 import { useMeta } from '../hooks/use-meta'
+import { SplitTestProvider } from '@/shared/context/split-test-context'
+import React, { ComponentType } from 'react'
 
 export const ProjectInvite = (args: any) => {
   useFetchMock(commonSetupMocks)
@@ -184,7 +186,7 @@ export const NotificationGroupInvitationCancelSubscription = (args: any) => {
     },
   })
 
-  window.metaAttributesCache.set('ol-hasIndividualRecurlySubscription', true)
+  window.metaAttributesCache.set('ol-hasIndividualPaidSubscription', true)
 
   return (
     <ProjectListProvider>
@@ -343,7 +345,11 @@ export const ReconfirmedAffiliationSuccess = (args: any) => {
 export default {
   title: 'Project List / Notifications',
   component: UserNotifications,
-  parameters: {
-    bootstrap5: true,
-  },
+  decorators: [
+    (Story: ComponentType) => (
+      <SplitTestProvider>
+        <Story />
+      </SplitTestProvider>
+    ),
+  ],
 }
diff --git a/services/web/frontend/stories/project-list/notifications/confirm-email.stories.tsx b/services/web/frontend/stories/project-list/notifications/confirm-email.stories.tsx
new file mode 100644
index 0000000000..5bbcbcf8fb
--- /dev/null
+++ b/services/web/frontend/stories/project-list/notifications/confirm-email.stories.tsx
@@ -0,0 +1,66 @@
+import { SplitTestProvider } from '@/shared/context/split-test-context'
+import UserNotifications from '../../../js/features/project-list/components/notifications/user-notifications'
+import { ProjectListProvider } from '../../../js/features/project-list/context/project-list-context'
+import { useMeta } from '../../hooks/use-meta'
+import useFetchMock from '../../hooks/use-fetch-mock'
+import ConfirmEmailNotification from '@/features/project-list/components/notifications/groups/confirm-email'
+
+export const ConfirmEmail = (args: any) => {
+  useMeta({
+    'ol-userEmails': [
+      {
+        email: 'erika.mustermann+unconfirmed-primary@example.com',
+        default: true,
+      },
+      { email: 'erika.mustermann+unconfirmed@example.com' },
+      {
+        email: 'erika.mustermann+untrusted@example.com',
+        lastConfirmedAt: '2019-01-01',
+        confirmedAt: '2019-01-01',
+      },
+      {
+        email: 'erika.mustermann+mit@example.com',
+        affiliation: {
+          institution: {
+            id: 123,
+            name: 'Massachusetts Institute of Technology',
+            confirmed: true,
+            commonsAccount: true,
+          },
+        },
+      },
+    ],
+    'ol-user': { signUpDate: '2021-01-01' },
+    'ol-usersBestSubscription': { type: 'free' },
+    'ol-prefetchedProjectsBlob': { totalSize: 20 },
+  })
+  useFetchMock(fetchMock => {
+    fetchMock.post('/user/emails/send-confirmation-code', args.statusCode, {
+      delay: 500,
+    })
+    fetchMock.post('/user/emails/confirm-code', args.statusCode, {
+      delay: 500,
+    })
+    fetchMock.post('/user/emails/resend-confirmation-code', args.statusCode, {
+      delay: 500,
+    })
+  })
+  return (
+    <SplitTestProvider>
+      <ProjectListProvider>
+        <UserNotifications {...args} />
+      </ProjectListProvider>
+    </SplitTestProvider>
+  )
+}
+
+export default {
+  title: 'Project List / Notifications',
+  component: ConfirmEmailNotification,
+  args: {
+    statusCode: 200,
+  },
+  argTypes: {
+    statusCode: { type: 'select', options: [200, 400, 429] },
+  },
+}
diff --git a/services/web/frontend/stories/project-list/project-list.stories.tsx b/services/web/frontend/stories/project-list/project-list.stories.tsx
index 066092c835..af058548cb 100644
--- a/services/web/frontend/stories/project-list/project-list.stories.tsx
+++ b/services/web/frontend/stories/project-list/project-list.stories.tsx
@@ -57,7 +57,4 @@ export default {
       </div>
     ),
   ],
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/project-search.stories.tsx b/services/web/frontend/stories/project-list/project-search.stories.tsx
index bb727cfb13..cf39be2285 100644
--- a/services/web/frontend/stories/project-list/project-search.stories.tsx
+++ b/services/web/frontend/stories/project-list/project-search.stories.tsx
@@ -24,7 +24,4 @@ export default {
   args: {
     inputValue: '',
   },
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/project-list/survey-widget.stories.tsx b/services/web/frontend/stories/project-list/survey-widget-ds-nav.stories.tsx
similarity index 55%
rename from services/web/frontend/stories/project-list/survey-widget.stories.tsx
rename to services/web/frontend/stories/project-list/survey-widget-ds-nav.stories.tsx
index e386bd1121..8e9e0d1a40 100644
--- a/services/web/frontend/stories/project-list/survey-widget.stories.tsx
+++ b/services/web/frontend/stories/project-list/survey-widget-ds-nav.stories.tsx
@@ -1,34 +1,32 @@
-import SurveyWidget from '../../js/features/project-list/components/survey-widget'
+import { SurveyWidgetDsNav } from '@/features/project-list/components/survey-widget-ds-nav'
 
 export const Survey = (args: any) => {
   localStorage.clear()
   window.metaAttributesCache.set('ol-survey', {
     name: 'my-survey',
-    preText: 'To help shape the future of Overleaf',
-    linkText: 'Click here!',
+    title: 'To help shape the future of Overleaf',
+    text: 'Click here!',
+    cta: 'Let’s go!',
     url: 'https://example.com/my-survey',
   })
 
-  return <SurveyWidget {...args} />
+  return <SurveyWidgetDsNav {...args} />
 }
 
 export const UndefinedSurvey = (args: any) => {
   localStorage.clear()
 
-  return <SurveyWidget {...args} />
+  return <SurveyWidgetDsNav {...args} />
 }
 
 export const EmptySurvey = (args: any) => {
   localStorage.clear()
   window.metaAttributesCache.set('ol-survey', {})
 
-  return <SurveyWidget {...args} />
+  return <SurveyWidgetDsNav {...args} />
 }
 
 export default {
   title: 'Project List / Survey Widget',
-  component: SurveyWidget,
-  parameters: {
-    bootstrap5: true,
-  },
+  component: SurveyWidgetDsNav,
 }
diff --git a/services/web/frontend/stories/project-list/system-messages.stories.tsx b/services/web/frontend/stories/project-list/system-messages.stories.tsx
index e76330788f..d97ca4537c 100644
--- a/services/web/frontend/stories/project-list/system-messages.stories.tsx
+++ b/services/web/frontend/stories/project-list/system-messages.stories.tsx
@@ -1,9 +1,9 @@
 import SystemMessages from '@/shared/components/system-messages'
 import useFetchMock from '../hooks/use-fetch-mock'
-import { FetchMockStatic } from 'fetch-mock'
+import { type FetchMock } from 'fetch-mock'
 
 export const SystemMessage = (args: any) => {
-  useFetchMock((fetchMock: FetchMockStatic) => {
+  useFetchMock((fetchMock: FetchMock) => {
     fetchMock.get(/\/system\/messages/, [
       {
         _id: 1,
@@ -23,7 +23,7 @@ export const SystemMessage = (args: any) => {
 }
 
 export const TranslationMessage = (args: any) => {
-  useFetchMock((fetchMock: FetchMockStatic) => {
+  useFetchMock((fetchMock: FetchMock) => {
     fetchMock.get(/\/system\/messages/, [])
   })
 
@@ -39,7 +39,4 @@ export const TranslationMessage = (args: any) => {
 export default {
   title: 'Project List / System Messages',
   component: SystemMessages,
-  parameters: {
-    bootstrap5: true,
-  },
 }
diff --git a/services/web/frontend/stories/settings/helpers/emails.js b/services/web/frontend/stories/settings/helpers/emails.js
index 2afe6a3014..546ccb2d96 100644
--- a/services/web/frontend/stories/settings/helpers/emails.js
+++ b/services/web/frontend/stories/settings/helpers/emails.js
@@ -174,7 +174,6 @@ export function reconfirmationSetupMocks(fetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.get(/\/user\/emails/, fakeReconfirmationUsersData, {
     delay: MOCK_DELAY,
-    overwriteRoutes: true,
   })
 }
 
@@ -186,7 +185,6 @@ export function emailLimitSetupMocks(fetchMock) {
   defaultSetupMocks(fetchMock)
   fetchMock.get(/\/user\/emails/, userData, {
     delay: MOCK_DELAY,
-    overwriteRoutes: true,
   })
 }
 
diff --git a/services/web/frontend/stories/source-editor/source-editor.stories.tsx b/services/web/frontend/stories/source-editor/source-editor.stories.tsx
index 53cf2b7eea..3f475944e4 100644
--- a/services/web/frontend/stories/source-editor/source-editor.stories.tsx
+++ b/services/web/frontend/stories/source-editor/source-editor.stories.tsx
@@ -2,11 +2,117 @@ import SourceEditor from '../../js/features/source-editor/components/source-edit
 import { ScopeDecorator } from '../decorators/scope'
 import { useScope } from '../hooks/use-scope'
 import { useMeta } from '../hooks/use-meta'
-import { FC } from 'react'
+import React, { FC, useState } from 'react'
 import { FileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import RangesTracker from '@overleaf/ranges-tracker'
+import useExposedState from '@/shared/hooks/use-exposed-state'
+import { EditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { DocId } from '../../../types/project-settings'
+import { StoryObj } from '@storybook/react'
+import { DocumentContainer } from '@/features/ide-react/editor/document-container'
+import { EditorPropertiesContext } from '@/features/ide-react/context/editor-properties-context'
 
-const FileTreePathProvider: FC = ({ children }) => (
+type Story = StoryObj<typeof SourceEditor>
+
+const EditorOpenDocProvider: FC<
+  React.PropsWithChildren<{
+    initialOpenDocName: string | null
+    initialDocument: DocumentContainer
+  }>
+> = ({ children, initialOpenDocName, initialDocument }) => {
+  const [currentDocumentId, setCurrentDocumentId] =
+    useExposedState<DocId | null>(null, 'editor.open_doc_id')
+  const [openDocName, setOpenDocName] = useExposedState<string | null>(
+    initialOpenDocName,
+    'editor.open_doc_name'
+  )
+  const [currentDocument, setCurrentDocument] =
+    useState<DocumentContainer | null>(initialDocument)
+
+  const value = {
+    currentDocumentId,
+    setCurrentDocumentId,
+    openDocName,
+    setOpenDocName,
+    currentDocument,
+    setCurrentDocument,
+  }
+
+  return (
+    <EditorOpenDocContext.Provider value={value}>
+      {children}
+    </EditorOpenDocContext.Provider>
+  )
+}
+
+const LatexEditorOpenDocProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => (
+  <EditorOpenDocProvider
+    initialOpenDocName="example.tex"
+    initialDocument={
+      mockDoc(content.tex, changes.tex) as unknown as DocumentContainer
+    }
+  >
+    {children}
+  </EditorOpenDocProvider>
+)
+
+const MarkdownEditorOpenDocProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => (
+  <EditorOpenDocProvider
+    initialOpenDocName="example.md"
+    initialDocument={
+      mockDoc(content.md, changes.md) as unknown as DocumentContainer
+    }
+  >
+    {children}
+  </EditorOpenDocProvider>
+)
+
+const BibtexEditorOpenDocProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => (
+  <EditorOpenDocProvider
+    initialOpenDocName="example.bib"
+    initialDocument={
+      mockDoc(content.bib, changes.bib) as unknown as DocumentContainer
+    }
+  >
+    {children}
+  </EditorOpenDocProvider>
+)
+
+const VisualEditorPropertiesProvider: FC<React.PropsWithChildren> = ({
+  children,
+}) => {
+  const [showVisual, setShowVisual] = useState(true)
+
+  const value = {
+    showVisual,
+    setShowVisual,
+    showSymbolPalette: true,
+    setShowSymbolPalette: () => undefined,
+    toggleSymbolPalette: () => undefined,
+    opening: true,
+    setOpening: () => undefined,
+    trackChanges: false,
+    setTrackChanges: () => undefined,
+    wantTrackChanges: false,
+    setWantTrackChanges: () => undefined,
+    errorState: false,
+    setErrorState: () => undefined,
+  }
+
+  return (
+    <EditorPropertiesContext.Provider value={value}>
+      {children}
+    </EditorPropertiesContext.Provider>
+  )
+}
+
+const FileTreePathProvider: FC<React.PropsWithChildren> = ({ children }) => (
   <FileTreePathContext.Provider
     value={{
       dirname: () => null,
@@ -29,11 +135,6 @@ export default {
   title: 'Editor / Source Editor',
   component: SourceEditor,
   decorators: [
-    (Story: any) =>
-      ScopeDecorator(Story, {
-        mockCompileOnLoad: true,
-        providers: { FileTreePathProvider },
-      }),
     (Story: any) => (
       <div style={{ height: '90vh' }}>
         <Story />
@@ -59,102 +160,141 @@ const permissions = {
   write: true,
 }
 
-export const Latex = (args: any, { globals: { theme } }: any) => {
-  // FIXME: useScope has no effect
-  useScope({
-    editor: {
-      sharejs_doc: mockDoc(content.tex, changes.tex),
-      open_doc_name: 'example.tex',
-    },
-    rootFolder: {
-      name: 'rootFolder',
-      id: 'root-folder-id',
-      type: 'folder',
-      children: [
-        {
-          name: 'example.tex.tex',
-          id: 'example-doc-id',
-          type: 'doc',
+export const Latex: Story = {
+  decorators: [
+    Story =>
+      ScopeDecorator(Story, {
+        mockCompileOnLoad: true,
+        providers: {
+          FileTreePathProvider,
+          EditorOpenDocProvider: LatexEditorOpenDocProvider,
+        },
+      }),
+
+    (Story, { globals }) => {
+      // FIXME: useScope has no effect
+      useScope({
+        rootFolder: {
+          name: 'rootFolder',
+          id: 'root-folder-id',
+          type: 'folder',
+          children: [
+            {
+              name: 'example.tex.tex',
+              id: 'example-doc-id',
+              type: 'doc',
+              selected: false,
+              $$hashKey: 'object:89',
+            },
+            {
+              name: 'frog.jpg',
+              id: 'frog-image-id',
+              type: 'file',
+              linkedFileData: null,
+              created: '2023-05-04T16:11:04.352Z',
+              $$hashKey: 'object:108',
+            },
+          ],
           selected: false,
-          $$hashKey: 'object:89',
         },
-        {
-          name: 'frog.jpg',
-          id: 'frog-image-id',
-          type: 'file',
-          linkedFileData: null,
-          created: '2023-05-04T16:11:04.352Z',
-          $$hashKey: 'object:108',
+        settings: {
+          ...settings,
+          overallTheme: globals.theme === 'default-' ? '' : globals.theme,
         },
-      ],
-      selected: false,
-    },
-    settings: {
-      ...settings,
-      overallTheme: theme === 'default-' ? '' : theme,
-    },
-    permissions,
-  })
+        permissions,
+      })
 
-  useMeta({
-    'ol-showSymbolPalette': true,
-  })
+      useMeta({
+        'ol-showSymbolPalette': true,
+      })
 
-  return <SourceEditor />
+      return <Story />
+    },
+  ],
 }
 
-export const Markdown = (args: any, { globals: { theme } }: any) => {
-  useScope({
-    editor: {
-      sharejs_doc: mockDoc(content.md, changes.md),
-      open_doc_name: 'example.md',
-    },
-    settings: {
-      ...settings,
-      overallTheme: theme === 'default-' ? '' : theme,
-    },
-    permissions,
-  })
+export const Markdown: Story = {
+  decorators: [
+    Story =>
+      ScopeDecorator(Story, {
+        mockCompileOnLoad: true,
+        providers: {
+          FileTreePathProvider,
+          EditorOpenDocProvider: MarkdownEditorOpenDocProvider,
+        },
+      }),
 
-  return <SourceEditor />
+    (Story, { globals }) => {
+      // FIXME: useScope has no effect
+      useScope({
+        settings: {
+          ...settings,
+          overallTheme: globals.theme === 'default-' ? '' : globals.theme,
+        },
+        permissions,
+      })
+
+      return <Story />
+    },
+  ],
 }
 
-export const Visual = (args: any, { globals: { theme } }: any) => {
-  useScope({
-    editor: {
-      sharejs_doc: mockDoc(content.tex, changes.tex),
-      open_doc_name: 'example.tex',
-      showVisual: true,
-    },
-    settings: {
-      ...settings,
-      overallTheme: theme === 'default-' ? '' : theme,
-    },
-    permissions,
-  })
-  useMeta({
-    'ol-showSymbolPalette': true,
-    'ol-mathJaxPath': 'https://unpkg.com/mathjax@3.2.2/es5/tex-svg-full.js',
-    'ol-project_id': '63e21c07946dd8c76505f85a',
-  })
+export const Visual: Story = {
+  decorators: [
+    Story =>
+      ScopeDecorator(Story, {
+        mockCompileOnLoad: true,
+        providers: {
+          FileTreePathProvider,
+          EditorOpenDocProvider: LatexEditorOpenDocProvider,
+          EditorPropertiesProvider: VisualEditorPropertiesProvider,
+        },
+      }),
 
-  return <SourceEditor />
+    (Story, { globals }) => {
+      // FIXME: useScope has no effect, so this does nothing
+      useScope({
+        settings: {
+          ...settings,
+          overallTheme: globals.theme === 'default-' ? '' : globals.theme,
+        },
+        permissions,
+      })
+
+      useMeta({
+        'ol-mathJaxPath': 'https://unpkg.com/mathjax@3.2.2/es5/tex-svg-full.js',
+        'ol-project_id': '63e21c07946dd8c76505f85a',
+      })
+
+      return <Story />
+    },
+  ],
 }
 
-export const Bibtex = (args: any, { globals: { theme } }: any) => {
-  useScope({
-    editor: {
-      sharejs_doc: mockDoc(content.bib, changes.bib),
-      open_doc_name: 'example.bib',
-    },
-    settings: {
-      ...settings,
-      overallTheme: theme === 'default-' ? '' : theme,
-    },
-    permissions,
-  })
+export const Bibtex: Story = {
+  decorators: [
+    Story =>
+      ScopeDecorator(Story, {
+        mockCompileOnLoad: true,
+        providers: {
+          FileTreePathProvider,
+          EditorOpenDocProvider: BibtexEditorOpenDocProvider,
+        },
+      }),
 
-  return <SourceEditor />
+    (Story, { globals }) => {
+      // FIXME: useScope has no effect
+      useScope({
+        settings: {
+          ...settings,
+          overallTheme: globals.theme === 'default-' ? '' : globals.theme,
+        },
+        permissions,
+      })
+
+      return <Story />
+    },
+  ],
 }
 
 const MAX_DOC_LENGTH = 2 * 1024 * 1024 // ol-maxDocLength
@@ -189,6 +329,9 @@ const mockDoc = (content: string, changes: Array<Record<string, any>> = []) => {
     detachFromCM6: () => {
       // Do nothing
     },
+    getType: () => {
+      return 'history-ot'
+    },
     on: () => {
       // Do nothing
     },
@@ -198,7 +341,7 @@ const mockDoc = (content: string, changes: Array<Record<string, any>> = []) => {
     setTrackChangesIdSeeds: () => {
       // Do nothing
     },
-    setTrackingChanges: () => {
+    setTrackChangesUserId: () => {
       // Do nothing
     },
     getTrackingChanges: () => {
@@ -211,6 +354,7 @@ const mockDoc = (content: string, changes: Array<Record<string, any>> = []) => {
       return null
     },
     ranges: new RangesTracker(changes, []),
+    hasBufferedOps: () => false,
   }
 }
 
diff --git a/services/web/frontend/stories/split-test-badge.stories.jsx b/services/web/frontend/stories/split-test-badge.stories.jsx
index ecb74b71d1..331263e0cb 100644
--- a/services/web/frontend/stories/split-test-badge.stories.jsx
+++ b/services/web/frontend/stories/split-test-badge.stories.jsx
@@ -127,7 +127,7 @@ export default {
     displayOnVariants: ['active'],
   },
   decorators: [
-    (Story, context) => (
+    Story => (
       <SplitTestContext.Provider value={splitTestContextValue}>
         <Story />
       </SplitTestContext.Provider>
diff --git a/services/web/frontend/stories/start-free-trial-button.stories.jsx b/services/web/frontend/stories/start-free-trial-button.stories.jsx
index d21c143fdc..6da53dc4cd 100644
--- a/services/web/frontend/stories/start-free-trial-button.stories.jsx
+++ b/services/web/frontend/stories/start-free-trial-button.stories.jsx
@@ -1,6 +1,5 @@
 import StartFreeTrialButton from '../js/shared/components/start-free-trial-button'
 import { ScopeDecorator } from './decorators/scope'
-import { bsVersionDecorator } from '../../.storybook/utils/with-bootstrap-switcher'
 
 export const Default = args => {
   return <StartFreeTrialButton {...args} />
@@ -31,7 +30,4 @@ export default {
     source: 'storybook',
   },
   decorators: [ScopeDecorator],
-  argTypes: {
-    ...bsVersionDecorator.argTypes,
-  },
 }
diff --git a/services/web/frontend/stories/style-guide.stories.jsx b/services/web/frontend/stories/style-guide.stories.jsx
deleted file mode 100644
index bb8755cf9a..0000000000
--- a/services/web/frontend/stories/style-guide.stories.jsx
+++ /dev/null
@@ -1,962 +0,0 @@
-/* eslint-disable jsx-a11y/anchor-is-valid */
-
-import { Grid, Row, Col, Button, Alert, ProgressBar } from 'react-bootstrap'
-import Notification from '../js/shared/components/notification'
-
-export const Colors = () => {
-  return (
-    <div className="content content-alt">
-      <Grid>
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <h2>Colours</h2>
-            <div className="color-row">
-              <div className="color-box ol-blue-gray-1">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue-gray-2">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue-gray-3">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue-gray-4">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue-gray-5">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue-gray-6">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-            </div>
-            <div className="color-row">
-              <div className="color-box ol-green">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-dark-green">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-blue">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-dark-blue">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-red">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-              <div className="color-box ol-dark-red">
-                <div className="color-swatch" />
-                <div className="color-label">
-                  <pre className="color-less-var" />
-                  <pre className="color-hex-val" />
-                  <pre className="color-rgb-val" />
-                </div>
-              </div>
-            </div>
-          </Col>
-        </Row>
-      </Grid>
-    </div>
-  )
-}
-
-export const Headings = () => {
-  return (
-    <div className="content content-alt">
-      <Grid>
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <h2>Headings</h2>
-            <p>Here are our heading styles:</p>
-            <h1>Heading level 1</h1>
-            <p>
-              Lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem
-              ipsum
-            </p>
-            <h2>Heading level 2</h2>
-            <p>
-              Lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem
-              ipsum lorem ipsum
-            </p>
-            <h3>Heading level 3</h3>
-            <p>
-              Lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem
-              ipsum lorem ipsum
-            </p>
-            <h4>Heading level 4</h4>
-            <p>
-              Lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem
-              ipsum lorem ipsum
-            </p>
-          </Col>
-        </Row>
-      </Grid>
-    </div>
-  )
-}
-
-const ButtonsTemplate = (args, { globals: { theme } }) => {
-  return (
-    <div className="content content-alt">
-      <fieldset disabled={args.disabled}>
-        <Grid>
-          <Row>
-            <Col md={8} mdOffset={2}>
-              <h2>Buttons</h2>
-
-              <h3>Primary Button</h3>
-              <p>
-                <Button bsStyle="primary">Primary Button</Button>
-              </p>
-
-              <h3>Secondary Button</h3>
-              {theme.includes('main') ? (
-                <>
-                  <p>
-                    <button className="btn btn-secondary">
-                      Secondary Button
-                    </button>
-                  </p>
-                  <h3>Deprecated Styles</h3>
-                  <p>
-                    These are being transitioned to the new secondary style
-                    above
-                  </p>
-                </>
-              ) : (
-                ''
-              )}
-              <p>Our secondary button is blue or dark gray:</p>
-              <div className="btn-toolbar">
-                <Button bsStyle="info">Info Button</Button>
-                <Button bsStyle="default">Default Button</Button>
-              </div>
-
-              <h3>All button styles</h3>
-              {theme.includes('main') ? (
-                <p>Includes styles being deprecated</p>
-              ) : (
-                ''
-              )}
-              <div className="btn-toolbar">
-                <Button bsStyle="primary">Primary</Button>
-                {theme.includes('main') ? (
-                  <button className="btn btn-secondary">Secondary</button>
-                ) : (
-                  ''
-                )}
-                <Button bsStyle="info">Info</Button>
-                <Button bsStyle="default">Default</Button>
-                <Button bsStyle="primary">Success</Button>
-                <Button bsStyle="warning">Warning</Button>
-                <Button bsStyle="danger">Danger</Button>
-                <Button className="btn-danger-ghost" bsStyle={null}>
-                  Danger Ghost
-                </Button>
-                <Button className="btn-info-ghost" bsStyle={null}>
-                  Info Ghost
-                </Button>
-                <Button className="btn-bg-ghost" bsStyle={null}>
-                  Background (bg) Ghost
-                </Button>
-                <Button className="btn-premium" bsStyle={null}>
-                  Premium
-                </Button>
-              </div>
-
-              <h3>Sizes</h3>
-              <div className="btn-toolbar">
-                <button className="btn btn-primary btn-xs">Extra Small</button>
-                <button className="btn btn-primary btn-sm">Small</button>
-                <button className="btn btn-primary">Default</button>
-                <button className="btn btn-primary btn-lg">Large</button>
-                <button className="btn btn-primary btn-xl">Extra Large</button>
-              </div>
-
-              <h2>Hyperlinks</h2>
-              <p>
-                Hyperlinks are highlighted <a href="#">as shown</a>.
-              </p>
-            </Col>
-          </Row>
-        </Grid>
-      </fieldset>
-    </div>
-  )
-}
-
-export const Buttons = ButtonsTemplate.bind({})
-Buttons.args = {
-  disabled: false,
-}
-
-export const Alerts = () => {
-  return (
-    <div className="content content-alt">
-      <Grid>
-        <Row>
-          <Col md={8} mdOffset={2} className="notification-list">
-            <h2>Alerts / Notifications</h2>
-            <p>See Notification in shared components for options</p>
-            <Notification
-              type="info"
-              body={
-                <div>
-                  <b>
-                    <code>.notitifcation .notification-type-info</code>
-                  </b>
-                </div>
-              }
-            />
-            <Notification
-              type="success"
-              body={
-                <div>
-                  <b>
-                    <code>.notitifcation .notification-type-success</code>
-                  </b>
-                </div>
-              }
-            />
-            <Notification
-              type="warning"
-              body={
-                <div>
-                  <b>
-                    <code>.notitifcation .notification-type-warning</code>
-                  </b>
-                </div>
-              }
-            />
-
-            <Notification
-              type="error"
-              body={
-                <div>
-                  <b>
-                    <code>.notitifcation .notification-type-error</code>
-                  </b>
-                </div>
-              }
-            />
-
-            <Notification
-              type="offer"
-              body={
-                <div>
-                  <b>
-                    <code>.notitifcation .notification-type-offer</code>
-                  </b>
-                </div>
-              }
-            />
-
-            <b>
-              Note: these styles below will be deprecated since there are new
-              alert styles rolling out as part of the new design system
-            </b>
-
-            <Alert bsStyle="danger">
-              An <code>.alert-danger</code> alert
-            </Alert>
-            <Alert bsStyle="success">
-              An <code>.alert-success</code> alert
-            </Alert>
-            <Alert bsStyle="info">
-              An <code>.alert-info</code> alert
-            </Alert>
-            <Alert bsStyle="warning">
-              An <code>.alert-warning</code> alert
-            </Alert>
-          </Col>
-        </Row>
-      </Grid>
-    </div>
-  )
-}
-
-export const ProgressBars = () => {
-  return (
-    <div className="content content-alt">
-      <Grid>
-        {' '}
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <h2>Progress bars</h2>
-            <ProgressBar bsStyle="danger" now={20} />
-            <ProgressBar bsStyle="success" now={40} />
-            <ProgressBar bsStyle="info" now={60} />
-            <ProgressBar bsStyle="warning" now={80} />
-          </Col>
-        </Row>
-      </Grid>
-    </div>
-  )
-}
-
-export const Cards = () => {
-  return (
-    <>
-      <div className="content content-alt">
-        <Grid>
-          <Row>
-            <Col md={8} mdOffset={2}>
-              <div className="card">
-                <p>
-                  Cards look best on a <code>.content.content-alt</code>{' '}
-                  background
-                </p>
-              </div>
-            </Col>
-          </Row>
-        </Grid>
-      </div>
-      <div className="content website-redesign">
-        <Grid>
-          <Row>
-            <Col md={8} mdOffset={2}>
-              <h2>New card styles</h2>
-              <div className="card card-premium-border">
-                <h2>Header 2</h2>
-                <h3>Header 3</h3>
-                <h3>Header 4</h3>
-                <p>Dolor sit amet, consectetur adipiscing elit.</p>
-              </div>
-            </Col>
-          </Row>
-        </Grid>
-      </div>
-    </>
-  )
-}
-
-export const Forms = () => {
-  return (
-    <div className="content content-alt">
-      <Grid>
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Form elements—basic example</h2>
-              <form className="ng-pristine ng-valid">
-                <div className="form-group">
-                  <label htmlFor="exampleInputEmail1">Email address</label>
-                  <input
-                    className="form-control"
-                    id="exampleInputEmail1"
-                    type="email"
-                    placeholder="Email"
-                  />
-                </div>
-                <div className="form-group">
-                  <label htmlFor="exampleInputPassword1">Password</label>
-                  <input
-                    className="form-control"
-                    id="exampleInputPassword1"
-                    type="password"
-                    placeholder="Password"
-                  />
-                </div>
-                <div className="form-group">
-                  <label htmlFor="exampleInputFile">File input</label>
-                  <input id="exampleInputFile" type="file" />
-                  <p className="help-block">
-                    Example block-level help text here.
-                  </p>
-                </div>
-                <div className="checkbox">
-                  <label>
-                    <input type="checkbox" /> Check me out
-                  </label>
-                  <button className="btn btn-default" type="submit">
-                    Submit
-                  </button>
-                </div>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Inline form</h2>
-              <form className="form-inline ng-pristine ng-valid">
-                <div className="form-group">
-                  <label htmlFor="exampleInputName2">Name</label>
-                  <input
-                    className="form-control"
-                    id="exampleInputName2"
-                    type="text"
-                    placeholder="Jane Doe"
-                  />
-                </div>
-                <div className="form-group">
-                  <label htmlFor="exampleInputEmail2">Email</label>
-                  <input
-                    className="form-control"
-                    id="exampleInputEmail2"
-                    type="email"
-                    placeholder="jane.doe@example.com"
-                  />
-                </div>
-                <button className="btn btn-default" type="submit">
-                  Send invitation
-                </button>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="form-inline ng-pristine ng-valid">
-                <div className="form-group">
-                  <label className="sr-only" htmlFor="exampleInputEmail3">
-                    Email address
-                  </label>
-                  <input
-                    className="form-control"
-                    id="exampleInputEmail3"
-                    type="email"
-                    placeholder="Email"
-                  />
-                </div>
-                <div className="form-group">
-                  <label className="sr-only" htmlFor="exampleInputPassword3">
-                    Password
-                  </label>
-                  <input
-                    className="form-control"
-                    id="exampleInputPassword3"
-                    type="password"
-                    placeholder="Password"
-                  />
-                </div>
-                <div className="checkbox">
-                  <label>
-                    <input type="checkbox" /> Remember me
-                  </label>
-                </div>
-                <button className="btn btn-default" type="submit">
-                  Sign in
-                </button>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="form-inline ng-pristine ng-valid">
-                <div className="form-group">
-                  <label className="sr-only" htmlFor="exampleInputAmount">
-                    Amount (in dollars)
-                  </label>
-                  <div className="input-group">
-                    <div className="input-group-addon">$</div>
-                    <input
-                      className="form-control"
-                      id="exampleInputAmount"
-                      type="text"
-                      placeholder="Amount"
-                    />
-                    <div className="input-group-addon">.00</div>
-                  </div>
-                </div>
-                <button className="btn btn-primary" type="submit">
-                  Transfer cash
-                </button>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Horizontal form</h2>
-              <form className="form-horizontal ng-pristine ng-valid">
-                <div className="form-group">
-                  <label
-                    className="col-sm-2 control-label"
-                    htmlFor="inputEmail3"
-                  >
-                    Email
-                  </label>
-                  <div className="col-sm-10">
-                    <input
-                      className="form-control"
-                      id="inputEmail3"
-                      type="email"
-                      placeholder="Email"
-                    />
-                  </div>
-                </div>
-                <div className="form-group">
-                  <label
-                    className="col-sm-2 control-label"
-                    htmlFor="inputPassword3"
-                  >
-                    Password
-                  </label>
-                  <div className="col-sm-10">
-                    <input
-                      className="form-control"
-                      id="inputPassword3"
-                      type="password"
-                      placeholder="Password"
-                    />
-                  </div>
-                </div>
-                <div className="form-group">
-                  <div className="col-sm-offset-2 col-sm-10">
-                    <div className="checkbox">
-                      <label>
-                        <input type="checkbox" /> Remember me
-                      </label>
-                    </div>
-                  </div>
-                </div>
-                <div className="form-group">
-                  <div className="col-sm-offset-2 col-sm-10">
-                    <button className="btn btn-default" type="submit">
-                      Sign in
-                    </button>
-                  </div>
-                </div>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Supported controls</h2>
-              <form className="ng-pristine ng-valid">
-                <input
-                  className="form-control"
-                  type="text"
-                  placeholder="Text input"
-                />
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <textarea
-                  className="form-control"
-                  rows="3"
-                  placeholder="Textarea"
-                />
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <div className="checkbox">
-                  <label>
-                    <input type="checkbox" defaultValue="" />
-                    Option one is this and that—be sure to include why it's
-                    great
-                  </label>
-                </div>
-                <div className="checkbox disabled">
-                  <label>
-                    <input type="checkbox" defaultValue="" disabled="" />
-                    Option two is disabled
-                  </label>
-                </div>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <div className="radio">
-                  <label>
-                    <input
-                      id="optionsRadios1"
-                      type="radio"
-                      name="optionsRadios"
-                      defaultValue="option1"
-                      defaultChecked="checked"
-                    />
-                    Option one is this and that—be sure to include why it's
-                    great
-                  </label>
-                </div>
-                <div className="radio">
-                  <label>
-                    <input
-                      id="optionsRadios2"
-                      type="radio"
-                      name="optionsRadios"
-                      defaultValue="option2"
-                    />
-                    Option two can be something else and selecting it will
-                    deselect option one
-                  </label>
-                </div>
-                <div className="radio disabled">
-                  <label>
-                    <input
-                      id="optionsRadios3"
-                      type="radio"
-                      name="optionsRadios"
-                      defaultValue="option3"
-                      disabled=""
-                    />
-                    Option three is disabled
-                  </label>
-                </div>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <label className="checkbox-inline">
-                  <input id="inlineCheckbox1" type="checkbox" value="option1" />
-                  1
-                </label>
-                <label className="checkbox-inline">
-                  <input id="inlineCheckbox2" type="checkbox" value="option2" />
-                  2
-                </label>
-                <label className="checkbox-inline">
-                  <input id="inlineCheckbox3" type="checkbox" value="option3" />
-                  3
-                </label>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <label className="radio-inline">
-                  <input
-                    id="inlineRadio1"
-                    type="radio"
-                    name="inlineRadioOptions"
-                    defaultValue="option1"
-                  />
-                  1
-                </label>
-                <label className="radio-inline">
-                  <input
-                    id="inlineRadio2"
-                    type="radio"
-                    name="inlineRadioOptions"
-                    defaultValue="option2"
-                  />
-                  2
-                </label>
-                <label className="radio-inline">
-                  <input
-                    id="inlineRadio3"
-                    type="radio"
-                    name="inlineRadioOptions"
-                    defaultValue="option3"
-                  />
-                  3
-                </label>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <select className="form-control">
-                  <option value="1">1</option>
-                  <option value="2">2</option>
-                  <option value="3">3</option>
-                  <option value="4">4</option>
-                  <option value="5">5</option>
-                </select>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <select className="form-control" multiple="">
-                  <option value="1">1</option>
-                  <option value="2">2</option>
-                  <option value="3">3</option>
-                  <option value="4">4</option>
-                  <option value="5">5</option>
-                </select>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Form states</h2>
-              <form className="form-inline ng-pristine ng-valid">
-                <div className="form-group">
-                  {/* eslint-disable-next-line */}
-                  <label className="sr-only">Emails</label>
-                  <p className="form-control-static">email@example.com</p>
-                </div>
-                <div className="form-group">
-                  <label className="sr-only" htmlFor="inputPassword2">
-                    Password
-                  </label>
-                  <input
-                    className="form-control"
-                    id="inputPassword2"
-                    type="password"
-                    placeholder="Password"
-                  />
-                </div>
-                <button className="btn btn-default" type="submit">
-                  Confirm identity
-                </button>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <input
-                  className="form-control"
-                  id="focusedInput"
-                  type="text"
-                  defaultValue="Demonstrative focus state"
-                />
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <input
-                  className="form-control"
-                  id="disabledInput"
-                  type="text"
-                  placeholder="Disabled input here…"
-                  disabled=""
-                />
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <input
-                  className="form-control"
-                  type="text"
-                  placeholder="Readonly input here…"
-                  readOnly=""
-                />
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <form className="ng-pristine ng-valid">
-                <div className="form-group">
-                  <label htmlFor="inputHelpBlock">Input with help text</label>
-                  <input
-                    className="form-control"
-                    id="inputHelpBlock"
-                    type="text"
-                    aria-describedby="helpBlock"
-                  />
-                </div>
-                <span className="help-block" id="helpBlock">
-                  A block of help text that breaks onto a new line and may
-                  extend beyond one line.
-                </span>
-              </form>
-            </div>
-          </Col>
-        </Row>
-
-        <Row className="row-spaced">
-          <Col md={8} mdOffset={2}>
-            <div className="card">
-              <h2>Validation states</h2>
-              <form className="ng-pristine ng-valid">
-                <div className="form-group has-success">
-                  <label className="control-label" htmlFor="inputSuccess1">
-                    Input with success
-                  </label>
-                  <input
-                    className="form-control"
-                    id="inputSuccess1"
-                    type="text"
-                    aria-describedby="helpBlock2"
-                  />
-                  <span className="help-block" id="helpBlock2">
-                    A block of help text that breaks onto a new line and may
-                    extend beyond one line.
-                  </span>
-                </div>
-                <div className="form-group has-warning">
-                  <label className="control-label" htmlFor="inputWarning1">
-                    Input with warning
-                  </label>
-                  <input
-                    className="form-control"
-                    id="inputWarning1"
-                    type="text"
-                  />
-                </div>
-                <div className="form-group has-error">
-                  <label className="control-label" htmlFor="inputError1">
-                    Input with error
-                  </label>
-                  <input
-                    className="form-control"
-                    id="inputError1"
-                    type="text"
-                  />
-                </div>
-                <div className="has-success">
-                  <div className="checkbox">
-                    <label>
-                      <input
-                        id="checkboxSuccess"
-                        type="checkbox"
-                        defaultValue="option1"
-                      />
-                      Checkbox with success
-                    </label>
-                  </div>
-                </div>
-                <div className="has-warning">
-                  <div className="checkbox">
-                    <label>
-                      <input
-                        id="checkboxWarning"
-                        type="checkbox"
-                        defaultValue="option1"
-                      />
-                      Checkbox with warning
-                    </label>
-                  </div>
-                </div>
-                <div className="has-error">
-                  <div className="checkbox">
-                    <label>
-                      <input
-                        id="checkboxError"
-                        type="checkbox"
-                        defaultValue="option1"
-                      />
-                      Checkbox with error
-                    </label>
-                  </div>
-                </div>
-              </form>
-            </div>
-          </Col>
-        </Row>
-      </Grid>
-    </div>
-  )
-}
-
-export default {
-  title: 'Style Guide',
-}
diff --git a/services/web/frontend/stories/subscription/group-invites/group-invites.stories.tsx b/services/web/frontend/stories/subscription/group-invites/group-invites.stories.tsx
index bfbf54362e..1021f770e9 100644
--- a/services/web/frontend/stories/subscription/group-invites/group-invites.stories.tsx
+++ b/services/web/frontend/stories/subscription/group-invites/group-invites.stories.tsx
@@ -2,7 +2,6 @@ import GroupInvites from '@/features/subscription/components/group-invites/group
 import type { TeamInvite } from '../../../../types/team-invite'
 import { useMeta } from '../../hooks/use-meta'
 import { ScopeDecorator } from '../../decorators/scope'
-import { bsVersionDecorator } from '../../../../.storybook/utils/with-bootstrap-switcher'
 
 export const GroupInvitesDefault = () => {
   const teamInvites: TeamInvite[] = [
@@ -40,7 +39,6 @@ export default {
   argTypes: {
     handleHide: { action: 'close modal' },
     onDisableSSO: { action: 'callback' },
-    ...bsVersionDecorator.argTypes,
   },
   decorators: [ScopeDecorator],
 }
diff --git a/services/web/frontend/stories/ui/badge-bs3.stories.tsx b/services/web/frontend/stories/ui/badge-bs3.stories.tsx
deleted file mode 100644
index 050a90ecda..0000000000
--- a/services/web/frontend/stories/ui/badge-bs3.stories.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import BS3Badge from '@/shared/components/badge'
-import Icon from '@/shared/components/icon'
-import type { Meta, StoryObj } from '@storybook/react'
-
-const meta: Meta<typeof BS3Badge> = {
-  title: 'Shared / Components / Badge / Bootstrap 3',
-  component: BS3Badge,
-  parameters: {
-    bootstrap5: false,
-  },
-  args: {
-    children: 'Badge',
-  },
-  argTypes: {
-    prepend: {
-      table: {
-        disable: true,
-      },
-    },
-    bsStyle: {
-      options: ['info', 'primary', 'warning', 'danger'],
-      control: { type: 'radio' },
-    },
-    className: {
-      table: {
-        disable: true,
-      },
-    },
-  },
-}
-export default meta
-
-type Story = StoryObj<typeof BS3Badge>
-
-export const BadgeDefault: Story = {
-  render: args => {
-    return (
-      <div className="small">
-        <BS3Badge {...args} />
-      </div>
-    )
-  },
-}
-BadgeDefault.args = {
-  bsStyle: meta.argTypes!.bsStyle!.options![0],
-}
-
-export const BadgePrepend: Story = {
-  render: args => {
-    return (
-      <div className="small">
-        <BS3Badge prepend={<Icon type="star" fw />} {...args} />
-      </div>
-    )
-  },
-}
-BadgePrepend.args = {
-  bsStyle: meta.argTypes!.bsStyle!.options![0],
-}
diff --git a/services/web/frontend/stories/ui/badge-bs5.stories.tsx b/services/web/frontend/stories/ui/badge.stories.tsx
similarity index 85%
rename from services/web/frontend/stories/ui/badge-bs5.stories.tsx
rename to services/web/frontend/stories/ui/badge.stories.tsx
index 7eeca79921..1b551d3254 100644
--- a/services/web/frontend/stories/ui/badge-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/badge.stories.tsx
@@ -1,14 +1,11 @@
 import Badge from '@/features/ui/components/bootstrap-5/badge'
-import Icon from '@/shared/components/icon'
+import MaterialIcon from '@/shared/components/material-icon'
 import type { Meta, StoryObj } from '@storybook/react'
 import classnames from 'classnames'
 
 const meta: Meta<typeof Badge> = {
-  title: 'Shared / Components / Badge / Bootstrap 5',
+  title: 'Shared / Components / Badge',
   component: Badge,
-  parameters: {
-    bootstrap5: true,
-  },
   args: {
     children: 'Badge',
   },
@@ -52,7 +49,7 @@ export const BadgePrepend: Story = {
     return (
       <Badge
         className={classnames({ 'text-dark': args.bg === 'light' })}
-        prepend={<Icon type="star" fw />}
+        prepend={<MaterialIcon type="star" />}
         {...args}
       />
     )
diff --git a/services/web/frontend/stories/ui/button.stories.tsx b/services/web/frontend/stories/ui/button.stories.tsx
index 27f113dcdb..a5dbbeb7e0 100644
--- a/services/web/frontend/stories/ui/button.stories.tsx
+++ b/services/web/frontend/stories/ui/button.stories.tsx
@@ -20,10 +20,10 @@ export const ButtonWithIcons = (args: Args) => {
 }
 
 const meta: Meta<typeof Button> = {
-  title: 'Shared / Components / Bootstrap 5 / Button',
+  title: 'Shared / Components / Button',
   component: Button,
   args: {
-    children: 'A Bootstrap 5 Button',
+    children: 'A Button',
     disabled: false,
     isLoading: false,
   },
@@ -45,9 +45,6 @@ const meta: Meta<typeof Button> = {
       ],
     },
   },
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/ui/dropdown-menu.stories.tsx b/services/web/frontend/stories/ui/dropdown-menu.stories.tsx
index fcd0cf9855..5758640ebc 100644
--- a/services/web/frontend/stories/ui/dropdown-menu.stories.tsx
+++ b/services/web/frontend/stories/ui/dropdown-menu.stories.tsx
@@ -60,7 +60,7 @@ export const Active = (args: Args) => {
   )
 }
 
-export const MultipleSelection = (args: Args) => {
+export const MultipleSelection = () => {
   return (
     <DropdownMenu show>
       <DropdownHeader>Header</DropdownHeader>
@@ -191,7 +191,7 @@ export const LeadingIcon = (args: Args) => {
   )
 }
 
-export const TrailingIcon = (args: Args) => {
+export const TrailingIcon = () => {
   return (
     <DropdownMenu show>
       <OLDropdownMenuItem eventKey="1" href="#/action-1" trailingIcon="check">
@@ -219,7 +219,7 @@ export const TrailingIcon = (args: Args) => {
 }
 
 const meta: Meta<typeof DropdownMenu> = {
-  title: 'Shared / Components / Bootstrap 5 / DropdownMenu',
+  title: 'Shared / Components / DropdownMenu',
   component: DropdownMenu,
   argTypes: {
     disabled: {
@@ -231,9 +231,6 @@ const meta: Meta<typeof DropdownMenu> = {
       },
     },
   },
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/ui/form/form-check-bs5.stories.tsx b/services/web/frontend/stories/ui/form/form-check-bs5.stories.tsx
index 0596aea5cd..cfe1de227c 100644
--- a/services/web/frontend/stories/ui/form/form-check-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/form/form-check-bs5.stories.tsx
@@ -1,13 +1,10 @@
 import { useRef, useLayoutEffect } from 'react'
-import { Form } from 'react-bootstrap-5'
+import { Form } from 'react-bootstrap'
 import type { Meta, StoryObj } from '@storybook/react'
 
 const meta: Meta<(typeof Form)['Check']> = {
-  title: 'Shared / Components / Bootstrap 5 / Form',
+  title: 'Shared / Components / Form',
   component: Form.Check,
-  parameters: {
-    bootstrap5: true,
-  },
   argTypes: {
     id: {
       table: {
diff --git a/services/web/frontend/stories/ui/form/form-input-bs5.stories.tsx b/services/web/frontend/stories/ui/form/form-input-bs5.stories.tsx
index 82b9125fcd..6d24f21901 100644
--- a/services/web/frontend/stories/ui/form/form-input-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/form/form-input-bs5.stories.tsx
@@ -1,4 +1,4 @@
-import { Form } from 'react-bootstrap-5'
+import { Form } from 'react-bootstrap'
 import type { Meta, StoryObj } from '@storybook/react'
 import FormGroup from '@/features/ui/components/bootstrap-5/form/form-group'
 import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
@@ -7,11 +7,8 @@ import MaterialIcon from '@/shared/components/material-icon'
 import FormFeedback from '@/features/ui/components/bootstrap-5/form/form-feedback'
 
 const meta: Meta<React.ComponentProps<typeof FormControl>> = {
-  title: 'Shared / Components / Bootstrap 5 / Form / Input',
+  title: 'Shared / Components / Form / Input',
   component: FormControl,
-  parameters: {
-    bootstrap5: true,
-  },
 }
 export default meta
 
diff --git a/services/web/frontend/stories/ui/form/form-radio-bs5.stories.tsx b/services/web/frontend/stories/ui/form/form-radio-bs5.stories.tsx
index 73e10b0bab..99ce0cb40d 100644
--- a/services/web/frontend/stories/ui/form/form-radio-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/form/form-radio-bs5.stories.tsx
@@ -1,12 +1,9 @@
-import { Form } from 'react-bootstrap-5'
+import { Form } from 'react-bootstrap'
 import type { Meta, StoryObj } from '@storybook/react'
 
 const meta: Meta<(typeof Form)['Check']> = {
-  title: 'Shared / Components / Bootstrap 5 / Form',
+  title: 'Shared / Components / Form',
   component: Form.Check,
-  parameters: {
-    bootstrap5: true,
-  },
   argTypes: {
     id: {
       table: {
diff --git a/services/web/frontend/stories/ui/form/form-select-bs5.stories.tsx b/services/web/frontend/stories/ui/form/form-select-bs5.stories.tsx
index 9f9985a4b6..a8cd9cec82 100644
--- a/services/web/frontend/stories/ui/form/form-select-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/form/form-select-bs5.stories.tsx
@@ -1,14 +1,11 @@
-import { Form, FormSelectProps } from 'react-bootstrap-5'
+import { Form, FormSelectProps } from 'react-bootstrap'
 import type { Meta, StoryObj } from '@storybook/react'
 import FormGroup from '@/features/ui/components/bootstrap-5/form/form-group'
 import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
 
 const meta: Meta<FormSelectProps> = {
-  title: 'Shared / Components / Bootstrap 5 / Form / Select',
+  title: 'Shared / Components / Form / Select',
   component: Form.Select,
-  parameters: {
-    bootstrap5: true,
-  },
 }
 export default meta
 
diff --git a/services/web/frontend/stories/ui/form/form-textarea-bs5.stories.tsx b/services/web/frontend/stories/ui/form/form-textarea-bs5.stories.tsx
index cd95984175..6bca986d0d 100644
--- a/services/web/frontend/stories/ui/form/form-textarea-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/form/form-textarea-bs5.stories.tsx
@@ -1,15 +1,12 @@
-import { Form } from 'react-bootstrap-5'
+import { Form } from 'react-bootstrap'
 import type { Meta, StoryObj } from '@storybook/react'
 import FormGroup from '@/features/ui/components/bootstrap-5/form/form-group'
 import FormText from '@/features/ui/components/bootstrap-5/form/form-text'
 import FormControl from '@/features/ui/components/bootstrap-5/form/form-control'
 
 const meta: Meta<React.ComponentProps<typeof FormControl>> = {
-  title: 'Shared / Components / Bootstrap 5 / Form / Textarea',
+  title: 'Shared / Components / Form / Textarea',
   component: FormControl,
-  parameters: {
-    bootstrap5: true,
-  },
 }
 export default meta
 
diff --git a/services/web/frontend/stories/ui/icon-button.stories.tsx b/services/web/frontend/stories/ui/icon-button.stories.tsx
index 4f99324d9d..51554ecd24 100644
--- a/services/web/frontend/stories/ui/icon-button.stories.tsx
+++ b/services/web/frontend/stories/ui/icon-button.stories.tsx
@@ -11,7 +11,7 @@ export const Icon = (args: Args) => {
 }
 
 const meta: Meta<typeof IconButton> = {
-  title: 'Shared / Components / Bootstrap 5 / IconButton',
+  title: 'Shared / Components / IconButton',
   component: IconButton,
   args: {
     disabled: false,
@@ -35,9 +35,6 @@ const meta: Meta<typeof IconButton> = {
       ],
     },
   },
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/ui/row.stories.tsx b/services/web/frontend/stories/ui/row.stories.tsx
index 7dd24c4d9a..a5a7409bb6 100644
--- a/services/web/frontend/stories/ui/row.stories.tsx
+++ b/services/web/frontend/stories/ui/row.stories.tsx
@@ -1,4 +1,4 @@
-import { Container, Row, Col } from 'react-bootstrap-5'
+import { Container, Row, Col } from 'react-bootstrap'
 import { Meta } from '@storybook/react'
 
 type Args = React.ComponentProps<typeof Row>
@@ -22,11 +22,8 @@ export const ColumnRowCell = (args: Args) => {
 }
 
 const meta: Meta<typeof Row> = {
-  title: 'Shared / Components / Bootstrap 5 / Column-Row-Cell',
+  title: 'Shared / Components / Column-Row-Cell',
   component: Row,
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/ui/split-button.stories.tsx b/services/web/frontend/stories/ui/split-button.stories.tsx
index c1423bbb80..01cbab9ea4 100644
--- a/services/web/frontend/stories/ui/split-button.stories.tsx
+++ b/services/web/frontend/stories/ui/split-button.stories.tsx
@@ -9,11 +9,9 @@ import {
   DropdownToggle,
 } from '@/features/ui/components/bootstrap-5/dropdown-menu'
 import Button from '@/features/ui/components/bootstrap-5/button'
-import { ButtonGroup } from 'react-bootstrap-5'
+import { ButtonGroup } from 'react-bootstrap'
 
-type Args = React.ComponentProps<typeof Dropdown>
-
-export const Sizes = (args: Args) => {
+export const Sizes = () => {
   const { t } = useTranslation()
   const sizes = {
     Large: 'lg',
@@ -51,14 +49,11 @@ export const Sizes = (args: Args) => {
   ))
 }
 const meta: Meta<typeof Dropdown> = {
-  title: 'Shared/Components/Bootstrap 5/SplitButton',
+  title: 'Shared/Components/SplitButton',
   component: Dropdown,
   args: {
     align: { sm: 'start' },
   },
-  parameters: {
-    bootstrap5: true,
-  },
 }
 
 export default meta
diff --git a/services/web/frontend/stories/ui/tag-bs3.stories.tsx b/services/web/frontend/stories/ui/tag-bs3.stories.tsx
deleted file mode 100644
index 8281f05650..0000000000
--- a/services/web/frontend/stories/ui/tag-bs3.stories.tsx
+++ /dev/null
@@ -1,70 +0,0 @@
-import OLTagIcon from '@/features/ui/components/ol/icons/ol-tag-icon'
-import BS3Tag from '@/shared/components/tag'
-import type { Meta, StoryObj } from '@storybook/react'
-
-const meta: Meta<typeof BS3Tag> = {
-  title: 'Shared / Components / Tag / Bootstrap 3',
-  component: BS3Tag,
-  parameters: {
-    bootstrap5: false,
-  },
-  args: {
-    children: 'Tag',
-  },
-  argTypes: {
-    prepend: {
-      table: {
-        disable: true,
-      },
-    },
-    className: {
-      table: {
-        disable: true,
-      },
-    },
-    closeBtnProps: {
-      table: {
-        disable: true,
-      },
-    },
-  },
-}
-export default meta
-
-type Story = StoryObj<typeof BS3Tag>
-
-export const TagDefault: Story = {
-  render: args => {
-    return (
-      <div className="small">
-        <BS3Tag {...args} />
-      </div>
-    )
-  },
-}
-
-export const TagPrepend: Story = {
-  render: args => {
-    return (
-      <div className="small">
-        <BS3Tag prepend={<OLTagIcon />} {...args} />
-      </div>
-    )
-  },
-}
-
-export const TagWithCloseButton: Story = {
-  render: args => {
-    return (
-      <div className="small">
-        <BS3Tag
-          prepend={<OLTagIcon />}
-          closeBtnProps={{
-            onClick: () => alert('Close triggered!'),
-          }}
-          {...args}
-        />
-      </div>
-    )
-  },
-}
diff --git a/services/web/frontend/stories/ui/tag-bs5.stories.tsx b/services/web/frontend/stories/ui/tag.stories.tsx
similarity index 93%
rename from services/web/frontend/stories/ui/tag-bs5.stories.tsx
rename to services/web/frontend/stories/ui/tag.stories.tsx
index e4f09c033d..37bbd39022 100644
--- a/services/web/frontend/stories/ui/tag-bs5.stories.tsx
+++ b/services/web/frontend/stories/ui/tag.stories.tsx
@@ -3,11 +3,8 @@ import Tag from '@/features/ui/components/bootstrap-5/tag'
 import type { Meta, StoryObj } from '@storybook/react'
 
 const meta: Meta<typeof Tag> = {
-  title: 'Shared / Components / Tag / Bootstrap 5',
+  title: 'Shared / Components / Tag',
   component: Tag,
-  parameters: {
-    bootstrap5: true,
-  },
   args: {
     children: 'Tag',
   },
diff --git a/services/web/frontend/stories/ui/tooltip.stories.tsx b/services/web/frontend/stories/ui/tooltip.stories.tsx
index 916ca6397c..2a2b07df71 100644
--- a/services/web/frontend/stories/ui/tooltip.stories.tsx
+++ b/services/web/frontend/stories/ui/tooltip.stories.tsx
@@ -1,5 +1,5 @@
-import { Button } from 'react-bootstrap-5'
-import Tooltip from '@/features/ui/components/bootstrap-5/tooltip'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 import { Meta } from '@storybook/react'
 
 export const Tooltips = () => {
@@ -17,25 +17,22 @@ export const Tooltips = () => {
       }}
     >
       {placements.map(placement => (
-        <Tooltip
+        <OLTooltip
           key={placement}
           id={`tooltip-${placement}`}
           description={`Tooltip on ${placement}`}
           overlayProps={{ placement }}
         >
-          <Button variant="secondary">Tooltip on {placement}</Button>
-        </Tooltip>
+          <OLButton variant="secondary">Tooltip on {placement}</OLButton>
+        </OLTooltip>
       ))}
     </div>
   )
 }
 
-const meta: Meta<typeof Tooltip> = {
-  title: 'Shared / Components / Bootstrap 5 / Tooltip',
-  component: Tooltip,
-  parameters: {
-    bootstrap5: true,
-  },
+const meta: Meta<typeof OLTooltip> = {
+  title: 'Shared / Components / Tooltip',
+  component: OLTooltip,
 }
 
 export default meta
diff --git a/services/web/frontend/stories/upgrade-prompt.stories.tsx b/services/web/frontend/stories/upgrade-prompt.stories.tsx
index 1d7d6cfe60..0e7de8de76 100644
--- a/services/web/frontend/stories/upgrade-prompt.stories.tsx
+++ b/services/web/frontend/stories/upgrade-prompt.stories.tsx
@@ -1,6 +1,5 @@
 import { UpgradePrompt } from '@/shared/components/upgrade-prompt'
 import { StoryObj } from '@storybook/react/*'
-import { bsVersionDecorator } from '../../.storybook/utils/with-bootstrap-switcher'
 
 type Story = StoryObj<typeof UpgradePrompt>
 
@@ -17,8 +16,4 @@ export const Generic: Story = {
 export default {
   title: 'Shared / Components / Upgrade Prompt',
   component: UpgradePrompt,
-  ...bsVersionDecorator,
-  args: {
-    bootstrapVersion: 5,
-  },
 }
diff --git a/services/web/frontend/stories/word-count-modal.stories.jsx b/services/web/frontend/stories/word-count-modal.stories.jsx
deleted file mode 100644
index 7742815ea6..0000000000
--- a/services/web/frontend/stories/word-count-modal.stories.jsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import useFetchMock from './hooks/use-fetch-mock'
-import WordCountModal from '../js/features/word-count-modal/components/word-count-modal'
-import { ScopeDecorator } from './decorators/scope'
-
-const counts = {
-  headers: 4,
-  mathDisplay: 40,
-  mathInline: 400,
-  textWords: 4000,
-}
-
-const messages = [
-  'Lorem ipsum dolor sit amet.',
-  'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
-].join('\n')
-
-export const WordCount = args => {
-  useFetchMock(fetchMock => {
-    fetchMock.get(
-      'express:/project/:projectId/wordcount',
-      { status: 200, body: { texcount: counts } },
-      { delay: 500 }
-    )
-  })
-
-  return <WordCountModal {...args} />
-}
-
-export const WordCountWithMessages = args => {
-  useFetchMock(fetchMock => {
-    fetchMock.get(
-      'express:/project/:projectId/wordcount',
-      { status: 200, body: { texcount: { ...counts, messages } } },
-      { delay: 500 }
-    )
-  })
-
-  return <WordCountModal {...args} />
-}
-
-export const ErrorResponse = args => {
-  useFetchMock(fetchMock => {
-    fetchMock.get(
-      'express:/project/:projectId/wordcount',
-      { status: 500 },
-      { delay: 500 }
-    )
-  })
-
-  return <WordCountModal {...args} />
-}
-
-export default {
-  title: 'Editor / Modals / Word Count',
-  component: WordCountModal,
-  args: {
-    show: true,
-  },
-  argTypes: {
-    handleHide: { action: 'close modal' },
-  },
-  decorators: [ScopeDecorator],
-}
diff --git a/services/web/frontend/stories/word-count-modal.stories.tsx b/services/web/frontend/stories/word-count-modal.stories.tsx
new file mode 100644
index 0000000000..17b548791b
--- /dev/null
+++ b/services/web/frontend/stories/word-count-modal.stories.tsx
@@ -0,0 +1,80 @@
+import { Meta, StoryObj } from '@storybook/react'
+import WordCountModal from '@/features/word-count-modal/components/word-count-modal'
+import { ScopeDecorator } from './decorators/scope'
+import useFetchMock from './hooks/use-fetch-mock'
+
+export default {
+  title: 'Editor / Modals / Word Count',
+  component: WordCountModal,
+  args: {
+    show: true,
+  },
+  argTypes: {
+    handleHide: {
+      action: 'close modal',
+    },
+  },
+  decorators: [Story => ScopeDecorator(Story)],
+} satisfies Meta
+
+type Story = StoryObj<typeof WordCountModal>
+
+const counts = {
+  headers: 4,
+  mathDisplay: 40,
+  mathInline: 400,
+  textWords: 4000,
+}
+
+const messages = [
+  'Lorem ipsum dolor sit amet.',
+  'Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.',
+].join('\n')
+
+export const WordCount: Story = {
+  decorators: [
+    Story => {
+      useFetchMock(fetchMock => {
+        fetchMock.get(
+          'express:/project/:projectId/wordcount',
+          { status: 200, body: { texcount: counts } },
+          { delay: 500 }
+        )
+      })
+
+      return <Story />
+    },
+  ],
+}
+
+export const WordCountWithMessages: Story = {
+  decorators: [
+    Story => {
+      useFetchMock(fetchMock => {
+        fetchMock.get(
+          'express:/project/:projectId/wordcount',
+          { status: 200, body: { texcount: { ...counts, messages } } },
+          { delay: 500 }
+        )
+      })
+
+      return <Story />
+    },
+  ],
+}
+
+export const ErrorResponse: Story = {
+  decorators: [
+    Story => {
+      useFetchMock(fetchMock => {
+        fetchMock.get(
+          'express:/project/:projectId/wordcount',
+          { status: 500 },
+          { delay: 500 }
+        )
+      })
+
+      return <Story />
+    },
+  ],
+}
diff --git a/services/web/frontend/stylesheets/app/admin-hub.less b/services/web/frontend/stylesheets/app/admin-hub.less
deleted file mode 100644
index bae3312447..0000000000
--- a/services/web/frontend/stylesheets/app/admin-hub.less
+++ /dev/null
@@ -1,156 +0,0 @@
-.hub-header {
-  h2 {
-    display: inline-block;
-  }
-  a {
-    color: @ol-dark-green;
-  }
-  i {
-    font-size: 30px;
-  }
-  .dropdown {
-    margin-right: 10px;
-  }
-}
-.admin-item {
-  position: relative;
-  margin-bottom: 60px;
-  .section-title {
-    text-transform: capitalize;
-  }
-  .alert-danger {
-    color: @ol-red;
-  }
-}
-.hidden-chart-section {
-  display: none;
-}
-.hub-circle {
-  display: inline-block;
-  background-color: @accent-color-secondary;
-  border-radius: 50%;
-  width: 160px;
-  height: 160px;
-  text-align: center;
-  //padding-top: 160px / 6.4;
-  img {
-    height: 160px - 160px / 3.2;
-  }
-  padding-top: 50px;
-  color: white;
-}
-.hub-circle-number {
-  display: block;
-  font-size: 36px;
-  font-weight: 900;
-  line-height: 1;
-}
-.hub-big-number {
-  float: left;
-  font-size: 32px;
-  font-weight: 900;
-  line-height: 40px;
-  color: @accent-color-secondary;
-}
-.hub-big-number,
-.hub-number-label {
-  display: block;
-}
-.hub-metric-link {
-  position: absolute;
-  top: 9px;
-  right: 0;
-  a {
-    color: @accent-color-secondary;
-  }
-  i {
-    margin-right: 5px;
-  }
-}
-.custom-donut-container {
-  svg {
-    max-width: 700px;
-    margin: auto;
-  }
-  .chart-center-text {
-    font-family: @font-family-sans-serif;
-    font-size: 40px;
-    font-weight: bold;
-    fill: @accent-color-secondary;
-    text-anchor: middle;
-  }
-
-  .nv-legend-text {
-    font-family: @font-family-sans-serif;
-    font-size: 14px;
-  }
-}
-.chart-no-center-text {
-  .chart-center-text {
-    display: none;
-  }
-}
-
-.superscript {
-  font-size: @font-size-large;
-}
-
-.admin-page {
-  summary {
-    // firefox does not show markers for block items
-    display: list-item;
-  }
-}
-
-.material-switch {
-  input[type='checkbox'] {
-    display: none;
-
-    &:checked + label::before {
-      background: inherit;
-      opacity: 0.5;
-    }
-    &:checked + label::after {
-      background: inherit;
-      left: 20px;
-    }
-    &:disabled + label {
-      opacity: 0.5;
-      cursor: not-allowed;
-    }
-  }
-
-  label {
-    cursor: pointer;
-    height: 0;
-    position: relative;
-    width: 40px;
-
-    &:before {
-      background: rgb(0, 0, 0);
-      box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5);
-      border-radius: 8px;
-      content: '';
-      height: 16px;
-      margin-top: -2px;
-      position: absolute;
-      opacity: 0.3;
-      transition: all 0.2s ease-in-out;
-      width: 40px;
-    }
-
-    &:after {
-      background: rgb(255, 255, 255);
-      border-radius: 16px;
-      box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
-      content: '';
-      height: 24px;
-      left: -4px;
-      margin-top: -2px;
-      position: absolute;
-      top: -4px;
-      transition: all 0.2s ease-in-out;
-      width: 24px;
-    }
-  }
-}
diff --git a/services/web/frontend/stylesheets/app/contact-us.less b/services/web/frontend/stylesheets/app/contact-us.less
index 48400dee10..e72c620676 100644
--- a/services/web/frontend/stylesheets/app/contact-us.less
+++ b/services/web/frontend/stylesheets/app/contact-us.less
@@ -59,7 +59,8 @@
     }
   }
 
-  .fa {
+  .fa,
+  .material-symbols {
     display: table-cell;
     text-align: right;
     color: @gray-lighter;
diff --git a/services/web/frontend/stylesheets/app/editor.less b/services/web/frontend/stylesheets/app/editor.less
index 544fbb7b38..3139c98678 100644
--- a/services/web/frontend/stylesheets/app/editor.less
+++ b/services/web/frontend/stylesheets/app/editor.less
@@ -83,10 +83,6 @@
   margin-left: 20px;
 }
 
-#synctex-more-info-button {
-  margin-left: 20px;
-}
-
 #ide-body {
   background-color: @pdf-bg;
   .full-size;
diff --git a/services/web/frontend/stylesheets/app/editor/history-react.less b/services/web/frontend/stylesheets/app/editor/history-react.less
index c9a8ef9bb9..9ceb5ae3fc 100644
--- a/services/web/frontend/stylesheets/app/editor/history-react.less
+++ b/services/web/frontend/stylesheets/app/editor/history-react.less
@@ -390,7 +390,7 @@ history-root {
       background-color: @neutral-10;
     }
 
-    span.material-symbols {
+    .material-symbols {
       vertical-align: middle;
       font-size: inherit;
     }
diff --git a/services/web/frontend/stylesheets/app/editor/pdf.less b/services/web/frontend/stylesheets/app/editor/pdf.less
index 545cac0e9d..3531a8289e 100644
--- a/services/web/frontend/stylesheets/app/editor/pdf.less
+++ b/services/web/frontend/stylesheets/app/editor/pdf.less
@@ -539,8 +539,8 @@
 }
 
 @editor-and-logs-pane-toolbars-height: @toolbar-small-height + @toolbar-height;
-@btn-small-height: (@padding-small-vertical * 2)+ (@font-size-small *
-      @line-height-small); // 5px * 2 + 14px * 1.5 = 31px
+@btn-small-height: (@padding-small-vertical * 2)+
+  (@font-size-small * @line-height-small); // 5px * 2 + 14px * 1.5 = 31px
 
 #dropdown-files-logs-pane-list {
   overflow-y: auto;
@@ -548,7 +548,7 @@
     white-space: nowrap;
   }
   max-height: calc(
-    ~'100vh - ' @editor-and-logs-pane-toolbars-height ~' - ' @btn-small-height ~' - '
-      @margin-md
+    ~'100vh - ' @editor-and-logs-pane-toolbars-height ~' - ' @btn-small-height
+      ~' - ' @margin-md
   );
 }
diff --git a/services/web/frontend/stylesheets/app/editor/toolbar.less b/services/web/frontend/stylesheets/app/editor/toolbar.less
index 4fd7c1b954..dd38ef99a0 100644
--- a/services/web/frontend/stylesheets/app/editor/toolbar.less
+++ b/services/web/frontend/stylesheets/app/editor/toolbar.less
@@ -333,16 +333,6 @@
   }
 }
 
-.editor-switch-tooltip .tooltip-inner {
-  text-align: left;
-  max-width: 325px;
-  padding: 10px;
-
-  .tooltip-title {
-    font-weight: bold;
-    line-height: 22px;
-  }
-}
 /**************************************
 	Formatting buttons
 ***************************************/
diff --git a/services/web/frontend/stylesheets/app/login-register.less b/services/web/frontend/stylesheets/app/login-register.less
index 5e58c46f2e..97790b9a5d 100644
--- a/services/web/frontend/stylesheets/app/login-register.less
+++ b/services/web/frontend/stylesheets/app/login-register.less
@@ -3,12 +3,6 @@
 @brand-twitter-color: #1da1f2;
 @brand-orcid-color: #a6ce39;
 
-.login-register-alternatives {
-  .form-group:last-child {
-    margin-bottom: 0;
-  }
-}
-
 .login-register-container {
   max-width: 400px;
   margin: 0 auto;
@@ -86,22 +80,6 @@
   }
 }
 
-.login-btn-icon-twitter {
-  background-image: url(../../../public/img/other-brands/logo_twitter.svg);
-}
-
-.registration-message-heading {
-  color: @text-color;
-}
-
-.registration-message-details {
-  font-size: 90%;
-}
-
-.registration-block-separator {
-  margin-bottom: 0px;
-}
-
 .website-redesign {
   .login-register-container {
     max-width: 320px;
diff --git a/services/web/frontend/stylesheets/app/portals.less b/services/web/frontend/stylesheets/app/portals.less
index 9dfd4a57b7..b69176b05f 100644
--- a/services/web/frontend/stylesheets/app/portals.less
+++ b/services/web/frontend/stylesheets/app/portals.less
@@ -141,4 +141,38 @@
       }
     }
   }
+  .hub-circle {
+    display: inline-block;
+    background-color: @green-70;
+    border-radius: 50%;
+    width: 160px;
+    height: 160px;
+    text-align: center;
+    padding-top: 50px;
+    color: white;
+  }
+  .hub-circle-number {
+    display: block;
+    font-size: 36px;
+    font-weight: 900;
+    line-height: 1;
+  }
+  .custom-donut-container {
+    svg {
+      max-width: 700px;
+      margin: auto;
+    }
+    .chart-center-text {
+      font-family: @font-family-sans-serif;
+      font-size: 40px;
+      font-weight: bold;
+      fill: @green-70;
+      text-anchor: middle;
+    }
+
+    .nv-legend-text {
+      font-family: @font-family-sans-serif;
+      font-size: 14px;
+    }
+  }
 }
diff --git a/services/web/frontend/stylesheets/app/primary-email-check.less b/services/web/frontend/stylesheets/app/primary-email-check.less
deleted file mode 100644
index 2a1a766fd4..0000000000
--- a/services/web/frontend/stylesheets/app/primary-email-check.less
+++ /dev/null
@@ -1,39 +0,0 @@
-.primary-email-check-container {
-  max-width: 400px !important;
-}
-
-.primary-email-check-card {
-  padding: 24px;
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-
-  .primary-email-confirm-button {
-    margin-top: 12px;
-  }
-
-  .primary-email-change-button {
-    margin-bottom: 12px;
-  }
-
-  p {
-    margin-bottom: 0;
-  }
-}
-
-.primary-email-check-header {
-  margin-top: 12px;
-  margin-bottom: 0;
-}
-
-.primary-email-check-form {
-  padding: 0 !important;
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-
-.primary-email-check-logo {
-  width: 130px;
-  margin: 0 auto;
-}
diff --git a/services/web/frontend/stylesheets/app/register.less b/services/web/frontend/stylesheets/app/register.less
deleted file mode 100644
index 61c7b79102..0000000000
--- a/services/web/frontend/stylesheets/app/register.less
+++ /dev/null
@@ -1,31 +0,0 @@
-.registration_message {
-  text-align: center;
-  padding-bottom: 20px;
-}
-// for focus-registration and focus-login split test variant
-.registration_logo {
-  width: 130px;
-  padding: 8px 0;
-}
-
-.website-redesign {
-  .login-register-header-focus {
-    padding-top: unset;
-  }
-}
-
-.login-register-header-heading-focus {
-  color: @neutral-90;
-  margin-bottom: 0;
-}
-
-.website-redesign {
-  .login-register-form-focus {
-    padding: @line-height-computed 0 0 0;
-    border-bottom: unset;
-    border-bottom: solid 1px @hr-border;
-    &:last-child {
-      border-bottom-width: 0;
-    }
-  }
-}
diff --git a/services/web/frontend/stylesheets/app/review-features-page.less b/services/web/frontend/stylesheets/app/review-features-page.less
deleted file mode 100644
index b03256af50..0000000000
--- a/services/web/frontend/stylesheets/app/review-features-page.less
+++ /dev/null
@@ -1,481 +0,0 @@
-@rfp-h1-size: 2.442em;
-@rfp-h2-size: 1.953em;
-@rfp-h3-size: 1.563em;
-@rfp-lead-size: 1.25em;
-
-@rfp-sl-red: @red;
-@rfp-rp-blue: @rp-type-blue;
-
-@rfp-rp-blue-light: #f8f9fd;
-@rfp-rp-blue-dark: shade(@rfp-rp-blue, 50%);
-@rfp-rp-blue-darker: shade(@rfp-rp-blue, 65%);
-@rfp-rp-blue-darkest: shade(@rfp-rp-blue, 75%);
-
-@rfp-card-shadow: 0 0 30px 5px rgba(0, 0, 0, 0.3);
-@rfp-border-radius: 5px;
-
-@rfp-header-height: 80px;
-@rfp-header-height-collapsed: 50px;
-
-.rfp-main {
-  background-color: @content-alt-bg-color;
-  font-size: 18px;
-  min-width: 240px;
-}
-
-// Typographical scale and basics.
-.rfp-h1 {
-  font-size: @rfp-h2-size;
-  margin-bottom: 1.6em;
-  color: inherit;
-  @media (min-width: @screen-xs-min) {
-    font-size: @rfp-h1-size;
-  }
-}
-.rfp-h1-masthead {
-  color: #fff;
-  margin-bottom: 1em;
-}
-.rfp-h2 {
-  font-size: @rfp-h2-size;
-  margin-bottom: 1.6em;
-  color: inherit;
-}
-.rfp-h3 {
-  font-size: @rfp-h3-size;
-  margin-bottom: 1.6em;
-  color: inherit;
-}
-.rfp-h3-cta {
-  margin-top: 0;
-  margin-bottom: 40px;
-}
-.rfp-lead {
-  margin-bottom: 1.6em;
-  max-width: 30em;
-  margin-left: auto;
-  margin-right: auto;
-  @media (min-width: @screen-xs-min) {
-    font-size: @rfp-lead-size;
-  }
-}
-.rfp-lead-cta {
-  margin-top: 0;
-  margin-bottom: 40px;
-}
-.rfp-lead-strong {
-  font-weight: 700;
-  .rfp-section-masthead & {
-    margin-bottom: 0;
-  }
-}
-.rfp-p {
-  margin-bottom: 1.6em;
-  max-width: 30em;
-  margin-left: auto;
-  margin-right: auto;
-  .rfp-section-feature & {
-    margin-left: initial;
-  }
-  .rfp-section-feature-alt & {
-    margin-left: auto;
-    margin-right: initial;
-  }
-}
-.rfp-highlight {
-  font-weight: 700;
-}
-// Sections
-.rfp-header {
-  position: fixed;
-  top: 0;
-  width: 100%;
-  z-index: 2;
-  height: @rfp-header-height;
-  transition: height 0.2s;
-  background-color: fade(@rfp-rp-blue-darkest, 90%);
-  padding: 15px 20px;
-  min-width: 320px;
-  @media (min-width: @screen-xs-min) {
-    padding-left: 30px;
-    padding-right: 30px;
-  }
-  @media (min-width: @screen-sm-min) {
-    padding-left: 60px;
-    padding-right: 60px;
-  }
-  .rfp-main-header-collapsed & {
-    height: @rfp-header-height-collapsed;
-    padding-top: 10px;
-    padding-bottom: 10px;
-  }
-}
-.rfp-header-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  max-width: @container-large-desktop;
-  height: 100%;
-  margin: auto;
-}
-.rfp-header-logo-container,
-.rfp-header-logo {
-  height: 100%;
-}
-.rfp-section {
-  padding: 30px;
-  text-align: center;
-  overflow: hidden;
-  @media (min-width: @screen-xs-min) {
-    padding: 30px;
-  }
-  @media (min-width: @screen-sm-min) {
-    padding: 60px;
-  }
-}
-.rfp-section-masthead {
-  color: #fff;
-  background-size: cover;
-  background-position: center;
-  background-color: @rfp-rp-blue-darker;
-  padding-top: @rfp-header-height;
-  .rfp-lead {
-    opacity: 0;
-    transition: opacity 0.8s ease;
-  }
-  &.rfp-section-masthead-in {
-    .rfp-lead {
-      opacity: 1;
-    }
-  }
-}
-.rfp-section-blockquote {
-  position: relative;
-  padding-top: 30px;
-  padding-bottom: 30px;
-  background-color: @brand-secondary;
-  box-shadow: @rfp-card-shadow;
-}
-.rfp-section-feature {
-  display: block;
-  text-align: left;
-  @media (min-width: @screen-sm-min) {
-    .rfp-section-wrapper {
-      display: flex;
-      align-items: center;
-    }
-  }
-}
-.rfp-feature-description-container,
-.rfp-feature-video-container {
-  flex: 0 0 50%;
-}
-.rfp-feature-description-container {
-  @media (min-width: @screen-sm-min) {
-    padding-right: 1em;
-    .rfp-section-feature-alt & {
-      padding-right: 0;
-      padding-left: 1em;
-    }
-  }
-}
-.rfp-feature-video-container {
-  @media (min-width: @screen-sm-min) {
-    padding-left: 1em;
-    .rfp-section-feature-alt & {
-      padding-left: 0;
-      padding-right: 1em;
-      order: -1;
-    }
-  }
-}
-.rfp-section-feature-alt {
-  color: #fff;
-  background-color: @ol-blue-gray-5;
-  @media (min-width: @screen-sm-min) {
-    text-align: right;
-  }
-}
-.rfp-section-feature-white {
-  background: #ffffff;
-}
-.rfp-section-testimonials {
-  background-color: @rfp-rp-blue-darkest;
-}
-.rfp-section-final {
-  background-color: @rfp-rp-blue-darker;
-}
-.rfp-section-wrapper {
-  max-width: @container-large-desktop;
-  margin: 0 auto;
-}
-// Elements
-.rfp-h1-masthead-portion {
-  display: inline-block;
-  transform: translate(150px, 0);
-  opacity: 0;
-  transition:
-    transform 0.8s ease 0s,
-    opacity 0.8s ease 0s;
-  &:nth-child(2) {
-    transition-delay: 0.5s, 0.5s;
-  }
-  &:nth-child(3) {
-    transition-delay: 0.5s, 0.5s;
-  }
-  &:nth-child(4) {
-    transition-delay: 1s, 1s;
-  }
-  &:nth-child(5) {
-    transition-delay: 1s, 1s;
-  }
-
-  .rfp-section-masthead-in & {
-    transform: translate(0, 0);
-    opacity: 1;
-  }
-}
-.rfp-video {
-  max-width: 100%;
-  box-shadow: @rfp-card-shadow;
-  border-radius: @rfp-border-radius;
-}
-.rfp-video-masthead {
-  width: 270px;
-  height: 163px;
-  margin-bottom: 2em;
-  transform: translate(0, 100px);
-  opacity: 0;
-  transition:
-    transform 0.8s ease 1s,
-    opacity 0.8s ease 1s;
-  box-shadow: none;
-  max-width: none;
-
-  @media (min-width: @screen-xs-min) {
-    width: 400px;
-    height: 241px;
-  }
-  @media (min-width: 600px) {
-    width: 525px;
-    height: 316px;
-  }
-  @media (min-width: @screen-sm-min) {
-    width: 633px;
-    height: 381px;
-  }
-  @media (min-width: @screen-sm-min) {
-    width: 697px;
-    height: 420px;
-  }
-  .rfp-section-masthead-in & {
-    transform: translate(0, 0);
-    opacity: 1;
-    box-shadow: @rfp-card-shadow;
-  }
-}
-.rfp-video-anim {
-  transition:
-    transform 0.8s ease,
-    opacity 0.8s ease;
-  transform: translate(100%, 0);
-  opacity: 0;
-}
-.rfp-video-anim-alt {
-  transform: translate(-100%, 0);
-}
-.rfp-video-anim-in {
-  transform: translate(0, 0);
-  opacity: 1;
-}
-.rfp-quote-section {
-  @media (min-width: @screen-md-min) {
-    display: flex;
-  }
-}
-.rfp-quote {
-  display: block;
-  width: 100%;
-  padding: 20px 40px;
-  border-left: 0;
-  max-width: 30em;
-  font-size: @rfp-lead-size;
-  quotes: '\201C' '\201D';
-  box-shadow: @rfp-card-shadow;
-  border-radius: @rfp-border-radius;
-  background-color: #fff;
-  color: @rfp-rp-blue-dark;
-  font-size: 1em;
-  margin: 0 auto 20px;
-
-  @media (min-width: @screen-xs-min) {
-    font-size: @rfp-lead-size;
-  }
-
-  @media (min-width: @screen-md-min) {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    flex: 0 1 50%;
-    margin-right: 20px;
-  }
-  // Override weird Boostrap default.
-  p {
-    display: block;
-  }
-  &:last-of-type {
-    @media (min-width: @screen-md-min) {
-      margin-right: 0;
-    }
-  }
-  &::before {
-    content: none;
-  }
-}
-.rfp-quote-main {
-  color: #ffffff;
-  display: block;
-  max-width: none;
-  border-left: 0;
-  margin: 0 auto;
-  padding: 0;
-  quotes: '\201C' '\201D';
-  font-size: @rfp-lead-size;
-  @media (min-width: @screen-md-min) {
-    display: flex;
-  }
-  // Override weird Boostrap default.
-  p {
-    display: block;
-  }
-  &::before {
-    content: none;
-  }
-}
-.rfp-quoted-text {
-  position: relative;
-  display: inline-block;
-  font-family: @font-family-serif;
-  font-style: italic;
-  text-align: left;
-  margin: 0 0 40px 0;
-  &::before {
-    content: open-quote;
-    display: block;
-    position: absolute;
-    font-family: @font-family-serif;
-    font-size: @rfp-lead-size;
-    line-height: inherit;
-    color: inherit;
-    left: -0.75em;
-  }
-  .rfp-quote-main & {
-    @media (min-width: @screen-md-min) {
-      flex: 1 1 70%;
-      margin: auto 40px auto auto;
-    }
-  }
-}
-.rfp-quoted-person {
-  display: inline-block;
-  font-size: 0.8em;
-  .rfp-quote-main & {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 0 0 30%;
-  }
-}
-.rfp-quoted-person-name {
-  margin: 0;
-}
-.rfp-quoted-person-affil {
-  margin: 0;
-  font-size: 0.8em;
-  &:hover,
-  &:focus {
-    text-decoration: none;
-    cursor: pointer;
-  }
-  .rfp-quote-main & {
-    color: #fff;
-    &:hover,
-    &:focus {
-      color: #fff;
-    }
-  }
-}
-.rfp-quoted-person-photo {
-  border-radius: 3em;
-  width: 6em;
-  margin-bottom: 20px;
-  .rfp-quote-main & {
-    margin-bottom: 0;
-    margin-right: 20px;
-  }
-}
-.rfp-users {
-  display: flex;
-  flex-wrap: wrap;
-  margin: 0 1em 2em;
-  @media (min-width: @screen-md-min) {
-    flex-wrap: nowrap;
-    align-items: center;
-  }
-}
-.rfp-user-container {
-  flex: 0 0 100%;
-  padding: 10px;
-  @media (min-width: @screen-xs-min) {
-    flex-basis: 50%;
-  }
-  @media (min-width: @screen-md-min) {
-    flex-basis: 25%;
-    padding: 20px;
-  }
-}
-.rfp-user-logo {
-  max-width: 100%;
-}
-.rfp-cta-container {
-  max-width: 40em;
-  margin: 0 auto;
-  padding: 40px;
-  background-color: #fff;
-  color: @rfp-rp-blue-dark;
-  box-shadow: @rfp-card-shadow;
-  border-radius: @rfp-border-radius;
-}
-.rfp-cta-header {
-  font-size: 1em;
-  padding: 0.2em 1em;
-}
-.rfp-cta-main {
-  display: block;
-  transition: transform 0.25s;
-  transform: translate(0, 0);
-}
-.rfp-cta-extra {
-  display: block;
-  position: absolute;
-  left: 50%;
-  text-transform: uppercase;
-  transition:
-    opacity 0.25s,
-    transform 0.25s;
-  transform: translate(-50%, 100%);
-  opacity: 0;
-  font-size: 0.5em;
-}
-.rfp-universities {
-  text-align: center;
-  img {
-    display: inline-block;
-    padding: 0 @padding-md;
-    width: 20%;
-    @media only screen and (max-width: @screen-sm-max) {
-      padding: @padding-md;
-      width: 50%;
-    }
-  }
-}
diff --git a/services/web/frontend/stylesheets/app/subscription.less b/services/web/frontend/stylesheets/app/subscription.less
index 8b1cc3530c..7ec9f8db8e 100644
--- a/services/web/frontend/stylesheets/app/subscription.less
+++ b/services/web/frontend/stylesheets/app/subscription.less
@@ -16,63 +16,6 @@
   }
 }
 
-.price-breakdown {
-  text-align: center;
-  margin-bottom: -10px;
-}
-
-.input-feedback-message {
-  display: none;
-  font-size: 0.8em;
-
-  .has-error & {
-    display: inline-block;
-  }
-}
-
-.payment-submit {
-  padding-top: (@line-height-computed / 2);
-}
-
-.payment-method-toggle {
-  margin-bottom: (@line-height-computed / 2);
-
-  &-switch {
-    display: inline-block;
-    width: 50%;
-    text-align: center;
-    border: solid 1px @gray-lighter;
-    border-radius: @border-radius-large 0 0 @border-radius-large;
-    padding: (@line-height-computed / 2);
-    color: @btn-switch-color;
-
-    &:hover,
-    &:focus {
-      color: @btn-switch-color;
-      text-decoration: none;
-    }
-
-    &:hover {
-      color: @btn-switch-hover-color;
-    }
-
-    & + & {
-      border-left-width: 0;
-      border-radius: 0 @border-radius-large @border-radius-large 0;
-    }
-
-    &-selected {
-      color: @link-active-color;
-      box-shadow: inset 0 -2px 0 0;
-
-      &:hover,
-      &:focus {
-        color: @link-active-color;
-      }
-    }
-  }
-}
-
 .team-invite .message {
   margin: 3em 0;
 }
@@ -85,136 +28,6 @@
   text-transform: capitalize;
 }
 
-.three-d-secure-container {
-  > .three-d-secure-recurly-container {
-    height: 400px;
-
-    > div[data-recurly='three-d-secure-container'] {
-      height: 100%;
-    }
-  }
-}
-
-.price-switch-header {
-  margin-bottom: @line-height-computed;
-  h2 {
-    margin: 0;
-  }
-
-  .student-disclaimer {
-    font-size: 14px;
-    color: @gray;
-    margin: 12.5px 0 0 0;
-  }
-}
-
-.price-feature-description {
-  h3 {
-    margin-top: 0;
-  }
-  h4 {
-    margin-top: 5px;
-    margin-bottom: 15px;
-  }
-  ul {
-    padding-left: 10px;
-  }
-  li {
-    list-style-position: inside;
-  }
-  .number-of-collaborators {
-    margin-bottom: 5px;
-  }
-}
-
-.price-summary {
-  padding-bottom: 7.5px;
-
-  .price-summary-line {
-    display: flex;
-    justify-content: space-between;
-
-    .price-summary-line-width {
-      width: 70%;
-    }
-  }
-  .price-summary-total-line {
-    margin-top: 5px;
-    font-size: 16px;
-
-    .price-summary-due {
-      color: @green-50;
-    }
-  }
-  hr {
-    margin-top: 20px;
-    margin-bottom: 20px;
-  }
-}
-
-.price-nowrap {
-  white-space: nowrap;
-}
-
-.price-details-spacing {
-  height: @line-height-computed / 2;
-}
-
-.price-cancel-anytime {
-  font-size: 12px;
-}
-
-.trial-coupon-summary {
-  font-size: 12px;
-  padding-top: 7.5px;
-  padding-bottom: 7.5px;
-
-  .trial-coupon-summary-list-container {
-    padding-left: 0;
-
-    li {
-      display: flex;
-      align-items: center;
-      font-size: 14px;
-      justify-content: flex-start;
-      margin-bottom: 8px;
-      gap: 12px;
-    }
-  }
-}
-
-.toggle-address-second-line {
-  margin-bottom: @line-height-computed / 2;
-}
-
-.payment-method-toggle {
-  border-bottom: 1px solid @hr-border;
-}
-
-.change-currency {
-  margin-top: 5px;
-}
-
-.change-currency-toggle {
-  padding-left: 0px;
-  font-size: 12px;
-  text-decoration: underline;
-  color: @text-small-color;
-  &:hover,
-  &:focus {
-    color: @text-small-color;
-  }
-}
-
-.change-currency-dropdown-selected-icon {
-  position: absolute;
-  left: 10px;
-}
-
-.recurly-hosted-field-input {
-  &:extend(.form-control);
-}
-
 .back-btn {
   padding: 0 10px 2px 12px;
   border-radius: 50%;
diff --git a/services/web/frontend/stylesheets/app/templates-v2.less b/services/web/frontend/stylesheets/app/templates-v2.less
index 9fb6f56276..67edecb323 100644
--- a/services/web/frontend/stylesheets/app/templates-v2.less
+++ b/services/web/frontend/stylesheets/app/templates-v2.less
@@ -1,3 +1,5 @@
+// some still used by portals
+
 .gallery-item-title {
   * {
     vertical-align: middle;
diff --git a/services/web/frontend/stylesheets/app/website-redesign.less b/services/web/frontend/stylesheets/app/website-redesign.less
deleted file mode 100644
index f66bd83d13..0000000000
--- a/services/web/frontend/stylesheets/app/website-redesign.less
+++ /dev/null
@@ -1,1186 +0,0 @@
-@cta-card-bg-color: var(--dark-jungle-green);
-
-.website-redesign-overflow-unset {
-  overflow: unset !important;
-}
-
-.website-redesign {
-  // hero section of features, enterprises, and universities will have an image that will overflow the page
-  overflow-x: hidden;
-
-  p,
-  div,
-  h1,
-  h2,
-  h3,
-  h4,
-  a,
-  strong {
-    font-family: 'Noto Sans', sans-serif;
-  }
-
-  h1 {
-    font-weight: 600;
-    .heading-2xl();
-
-    @media (max-width: @screen-sm-max) {
-      .heading-xl();
-    }
-  }
-
-  h2 {
-    font-weight: 600;
-    margin-top: 0;
-    .heading-xl();
-
-    @media (max-width: @screen-sm-max) {
-      .heading-lg();
-    }
-  }
-
-  h3 {
-    font-weight: 600;
-  }
-
-  h1,
-  h2,
-  h3 {
-    > span.eyebrow-text {
-      display: block;
-      margin-bottom: @margin-xs;
-    }
-  }
-
-  .eyebrow-text {
-    .mono-text;
-  }
-
-  // override .btn default style
-  .btn {
-    font-weight: 600;
-  }
-
-  .img-rounded {
-    // TODO: design specifies 'border-radius-large' which is 5px, but uses 16px
-    border-radius: 16px;
-  }
-
-  .plans-cards {
-    @media (min-width: @screen-md-min) {
-      display: flex; /* equal heights */
-      flex-wrap: wrap;
-    }
-
-    .plans-card-container {
-      min-height: 348px;
-
-      @media (max-width: @screen-sm-max) {
-        margin-bottom: 16px;
-        min-height: unset;
-      }
-    }
-
-    .plans-card {
-      border-radius: 8px;
-      padding: 0;
-      height: 100%;
-
-      .plans-card-inner {
-        padding: 36px;
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        font-size: 16px;
-
-        .plans-card-inner-title {
-          font-size: 20px;
-          font-weight: 600;
-          margin-top: 0;
-        }
-
-        ul {
-          list-style-type: none;
-          padding: 0;
-          margin: 0;
-
-          li {
-            margin-bottom: 8px;
-          }
-        }
-
-        .plans-card-inner-footer {
-          margin-top: auto;
-          display: flex;
-          flex-direction: column;
-          gap: 12px;
-
-          @media (max-width: @screen-sm-max) {
-            margin-top: 16px;
-          }
-        }
-      }
-
-      &.grey-border {
-        border: 2px solid var(--neutral-20);
-      }
-
-      &.blue-border {
-        border: solid 2px var(--sapphire-blue);
-        border-radius: 8px;
-
-        .plans-card-inner-title {
-          color: var(--sapphire-blue);
-        }
-      }
-    }
-  }
-
-  .plans-bottom-text {
-    font-size: 1.125rem;
-  }
-
-  .info-cards {
-    @media (min-width: @screen-md-min) {
-      display: flex; /* equal heights */
-      flex-wrap: wrap;
-    }
-
-    .info-card-container {
-      margin-bottom: 16px;
-
-      .info-card {
-        border-radius: 8px;
-        height: 100%;
-        box-shadow:
-          0px 2px 4px 0px #1e253014,
-          0px 4px 12px 0px #1e25301f;
-        border-top: 8px solid var(--sapphire-blue);
-        padding: 32px 40px 32px 40px;
-
-        &.info-card-big-text {
-          h3 {
-            font-size: 1.5rem;
-            line-height: 1.333;
-          }
-
-          p {
-            font-size: 1.125rem;
-            line-height: 1.333;
-          }
-        }
-
-        i.material-symbols {
-          color: var(--sapphire-blue);
-        }
-      }
-    }
-  }
-
-  .security-heading-section {
-    @media (max-width: @screen-sm-max) {
-      p {
-        text-align: left;
-      }
-
-      h2 {
-        width: 100%;
-        text-align: left;
-      }
-    }
-
-    .heading-and-stickers-container {
-      display: flex;
-      justify-content: center;
-
-      .lock-sticker {
-        width: 70px;
-        position: absolute;
-        top: -95px;
-        right: -50px;
-
-        @media (max-width: @screen-lg) {
-          right: -105px;
-        }
-
-        @media (max-width: @screen-sm-max) {
-          display: none;
-        }
-      }
-
-      .arrow-sticker {
-        width: 140px;
-        position: absolute;
-        top: -50px;
-        right: -15px;
-
-        @media (max-width: @screen-lg) {
-          right: -70px;
-        }
-        @media (max-width: @screen-sm-max) {
-          display: none;
-        }
-      }
-    }
-  }
-
-  .customer-story-card-title {
-    margin-top: 25px;
-    margin-bottom: 12.5px;
-    font-size: 1.5rem;
-    font-weight: 600;
-
-    a {
-      display: flex;
-      justify-content: space-between;
-      color: var(--neutral-90);
-      i {
-        font-size: 1.5rem;
-      }
-    }
-  }
-
-  .customer-story-content {
-    .table-of-contents-section {
-      padding-right: 64px;
-      @media (max-width: @screen-sm-max) {
-        display: none;
-      }
-
-      .table-of-contents {
-        border-top: 1px solid var(--neutral-30);
-        border-bottom: 1px solid var(--neutral-30);
-        padding: 32px 0;
-
-        .heading {
-          font-size: 1.125rem;
-          font-weight: 600;
-          line-height: 1.333;
-          color: var(--green-60);
-        }
-        li {
-          list-style: none;
-          padding-top: 16px;
-          font-weight: 500;
-          a {
-            text-decoration: none;
-            color: var(--neutral-70);
-          }
-        }
-      }
-    }
-
-    .story-details-section {
-      h3 {
-        font-size: 1.875rem;
-        line-height: 1.333;
-        margin-top: 0;
-      }
-
-      .at-glance-section {
-        padding-top: 24px;
-        p {
-          margin-top: 16px;
-        }
-      }
-
-      p {
-        font-size: 1.125rem;
-      }
-
-      .border-r-16 {
-        border-radius: 16px;
-      }
-
-      .introduction-image-caption {
-        padding-top: 16px;
-      }
-
-      .stats-card {
-        display: flex;
-        flex-direction: row;
-        padding: 32px;
-        border-radius: 16px;
-        background: var(--dark-jungle-green);
-        color: var(--white);
-        @media (max-width: @screen-sm-max) {
-          flex-direction: column;
-        }
-
-        .stats {
-          h3 {
-            font-size: 2rem;
-            font-weight: 600;
-          }
-
-          p {
-            font-weight: 600;
-            height: 50px;
-          }
-        }
-      }
-    }
-
-    .customer-quote {
-      border-left: 2px solid var(--green-60);
-      padding-left: 16px;
-
-      blockquote {
-        color: var(--neutral-90);
-        font-size: 1.6rem;
-        line-height: 1.333;
-      }
-
-      p {
-        margin-top: 1rem;
-        font-size: 1.125rem;
-      }
-    }
-  }
-
-  .features-card {
-    display: flex; /* equal heights */
-    flex-wrap: wrap;
-    align-items: center;
-
-    .features-card-media,
-    .features-card-media-right {
-      padding-top: 24px;
-
-      img.img-responsive {
-        width: 100%;
-      }
-
-      video {
-        box-shadow:
-          0px 4px 6px 0px rgba(30, 37, 48, 0.12),
-          0px 8px 16px 0px rgba(30, 37, 48, 0.12);
-        max-height: 100%;
-        width: auto;
-        width: 100%;
-      }
-
-      @media (max-width: @screen-sm-max) {
-        margin-bottom: 50px;
-      }
-    }
-
-    @media (min-width: @screen-md-min) {
-      .features-card-media-right {
-        padding-left: 64px;
-      }
-
-      .features-card-media {
-        padding-right: 64px;
-      }
-    }
-
-    .features-card-description,
-    .features-card-description-list {
-      padding-top: 16px;
-
-      p {
-        margin-bottom: 16px;
-        font-size: 1.125rem;
-        line-height: 1.333;
-
-        @media (max-width: @screen-sm-max) {
-          font-size: 1rem;
-          line-height: 1.375;
-        }
-      }
-
-      a.green-link {
-        margin-top: 4px;
-        display: block;
-      }
-    }
-
-    .features-card-description {
-      h3 {
-        font-size: 1.5rem;
-        line-height: 1.4;
-        margin-bottom: 8px;
-      }
-    }
-
-    .features-card-description-list {
-      h3 {
-        font-size: 1.875rem;
-        line-height: 1.5;
-      }
-
-      ul.list-simple-text,
-      ul.list-heading-text {
-        list-style-type: none;
-        padding: 0;
-        margin: 0;
-
-        li {
-          margin-bottom: 12px;
-          font-size: 1.125rem;
-          line-height: 1.333;
-          display: flex;
-
-          .label-premium {
-            margin-left: 0;
-            font-family: 'Noto Sans', sans-serif;
-          }
-
-          @media (max-width: @screen-sm-max) {
-            font-size: 1rem;
-            line-height: 1.375;
-          }
-        }
-      }
-
-      ul.list-heading-text {
-        li {
-          h4 {
-            margin-top: 0;
-            margin-bottom: 8px;
-            font-size: 20px;
-            font-weight: 600;
-          }
-        }
-      }
-    }
-  }
-
-  .features-card-hero {
-    display: flex; /* equal heights */
-    flex-wrap: wrap;
-    align-items: center;
-    position: relative;
-    height: 655px;
-    padding-top: @line-height-computed * 2;
-
-    @media (max-width: @screen-sm-max) {
-      height: unset;
-      padding-top: 0;
-    }
-
-    .features-card-description {
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-
-      h1 {
-        &.features-card-hero-smaller-title {
-          @media (min-width: @screen-lg-min) {
-            // 3rem is the default, this is a workaround for big screen
-            // since 6-width column on md screen size will wrap the text in three lines
-            font-size: 2.8rem;
-          }
-        }
-      }
-
-      p {
-        font-size: 1.25rem;
-        width: 90%;
-
-        @media (max-width: @screen-sm-max) {
-          font-size: 1.125rem;
-          line-height: 1.33;
-          width: unset;
-        }
-      }
-    }
-
-    .features-card-image {
-      position: absolute;
-      // on wide screen, image will be fixed without any variable width translation
-      transform: translateX(600px);
-      top: 100px;
-      width: 720px;
-      height: auto;
-      padding: 0px 15px;
-
-      // starting from 1500px, image will have a variable translation that depends on screen width
-      // this will make image "fixed" on a specific point on the screen
-      @media (max-width: 1500px) {
-        transform: translateX(calc(50vw - 121px));
-      }
-
-      @media (max-width: 1400px) {
-        width: 650px;
-        transform: translateX(calc(50vw - 52px));
-      }
-
-      // bootstrap layout changes on 1200px (@screen-lg), add a specific
-      // case for this exact width
-      @media (min-width: 1200px) and (max-width: 1200px) {
-        width: 600px;
-        transform: translateX(calc(50vw));
-      }
-
-      @media (max-width: 1199px) {
-        width: 600px;
-        transform: translateX(calc(50vw - 106px));
-      }
-
-      @media (max-width: 1100px) {
-        width: 550px;
-        transform: translateX(calc(50vw - 55px));
-      }
-
-      // 991px
-      @media (max-width: @screen-sm-max) {
-        position: relative;
-        transform: none;
-        top: 0;
-        width: 100%;
-        margin-bottom: 50px;
-      }
-
-      img.img-responsive {
-        width: 100%;
-      }
-    }
-
-    .sticky-tags {
-      position: absolute;
-      z-index: 2;
-      height: 160px;
-      bottom: -105px;
-      right: 55px;
-
-      @media (max-width: 1400px) {
-        height: 150px;
-        bottom: -103px;
-        right: 47px;
-      }
-
-      @media (max-width: 1200px) {
-        height: 130px;
-        bottom: -87px;
-      }
-
-      @media (max-width: 1100px) {
-        height: 120px;
-        bottom: -81px;
-      }
-
-      // 991px
-      @media (max-width: @screen-sm-max) {
-        height: 130px;
-        bottom: -75px;
-        right: 70px;
-      }
-
-      // 767px
-      @media (max-width: @screen-xs-max) {
-        height: 24%;
-        bottom: -10vw; // scale with width
-        right: 9.5vw; // scale with width
-      }
-    }
-  }
-
-  .organization-logos-container {
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-
-    @media (max-width: @screen-md-max) {
-      flex-wrap: wrap;
-      gap: 30px;
-    }
-
-    .organization-logo {
-      object-fit: contain;
-      max-height: 62px;
-
-      &.samsung-logo {
-        max-height: 110px;
-        height: 110px;
-      }
-
-      @media (max-width: @screen-md-max) {
-        max-height: 40px;
-        flex-basis: 34%;
-      }
-    }
-  }
-
-  .template-cards {
-    .template-card {
-      > img.img-responsive {
-        width: 100%;
-        border-radius: 8px;
-      }
-
-      .template-card-title {
-        font-size: 24px;
-        margin-top: 16px;
-        margin-bottom: 8px;
-
-        a {
-          width: 100%;
-          font-weight: 600;
-          color: var(--neutral-90);
-          display: inline-flex;
-          justify-content: space-between;
-          text-decoration: none;
-
-          &:hover {
-            text-decoration: underline;
-          }
-        }
-
-        i.material-symbols {
-          vertical-align: middle;
-          text-decoration: none;
-        }
-      }
-
-      .template-card-text {
-        font-size: 16px;
-      }
-
-      &:not(:last-of-type) {
-        @media (max-width: @screen-sm-max) {
-          margin-bottom: 40px;
-        }
-      }
-    }
-  }
-
-  .lime-color-text {
-    color: var(--malachite);
-  }
-
-  .cta-card-individual-customer {
-    display: flex;
-    justify-content: space-between;
-    padding: 64px;
-    background-image: linear-gradient(
-        to right,
-        rgba(0, 0, 0, 0.4) 0%,
-        @cta-card-bg-color 20%,
-        @cta-card-bg-color 100%
-      ),
-      url('../../../public/img/website-redesign/overleaf-pattern-purple.png');
-    background-size: cover;
-    color: var(--white);
-    border-radius: 8px;
-
-    @media (max-width: @screen-sm-max) {
-      padding: 48px 24px;
-    }
-
-    h2 {
-      font-size: 1.875rem;
-      color: var(--white);
-    }
-    p {
-      font-size: 1.125rem;
-    }
-
-    .btn-container {
-      padding-top: 10px;
-      display: flex;
-      justify-content: center;
-      align-items: flex-start;
-    }
-  }
-
-  .paragraph-line-height {
-    line-height: 1.333; // 24px
-  }
-
-  .cta-card {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding: 64px;
-    color: var(--white);
-    background-image: linear-gradient(
-        to right,
-        rgba(0, 0, 0, 0.4) 0%,
-        @cta-card-bg-color 25%,
-        @cta-card-bg-color 75%,
-        rgba(0, 0, 0, 0.4) 100%
-      ),
-      url('../../../public/img/website-redesign/overleaf-pattern-purple.png');
-    background-size: cover;
-    border-radius: 8px;
-
-    @media (max-width: @screen-sm-max) {
-      padding: 48px 24px;
-    }
-
-    .cta-card-title {
-      font-size: 3.25rem; // 52px
-      margin-bottom: 8px;
-      line-height: 1.3;
-
-      &.title-mono {
-        > span {
-          // override Noto Sans
-          .dm-mono;
-        }
-      }
-
-      span.purple-color {
-        color: #939aff;
-        font-weight: 400;
-      }
-
-      span.lime-color {
-        font-weight: 500;
-        color: var(--malachite);
-      }
-
-      @media (max-width: @screen-sm-max) {
-        font-size: 2.25rem; // 36px
-      }
-    }
-
-    .cta-card-text {
-      font-size: 1.125rem;
-      line-height: 1.333;
-      margin: 8px 0;
-      text-align: center;
-    }
-
-    .cta-card-quote {
-      font-size: 1.875rem; // 30px
-      font-weight: 600;
-      line-height: 2.5rem; // 40px
-      letter-spacing: 0em;
-      text-align: center;
-    }
-  }
-
-  .quote-card {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    padding: 32px;
-    background: var(--dark-jungle-green);
-    color: white;
-    border-radius: 16px;
-    text-align: center;
-
-    blockquote {
-      font-size: 1.875rem; // 30px
-      font-weight: 600;
-      line-height: 1.26;
-
-      @media (max-width: @screen-sm-max) {
-        font-size: 1.5rem; // 24px
-        line-height: 1.333;
-      }
-    }
-
-    .quote-card-img {
-      margin-top: 32px;
-      margin-bottom: 16px;
-    }
-
-    .quote-card-link {
-      color: var(--green-30);
-    }
-
-    @media (max-width: @screen-sm-max) {
-      padding: 56px 24px 56px 24px;
-    }
-  }
-
-  .integrations-card {
-    display: flex; /* for center align */
-    flex-wrap: wrap;
-    align-items: center;
-
-    .integrations-icons {
-      img {
-        width: 6rem; // 96px
-        height: 6rem; // 96px
-      }
-
-      .first-row,
-      .second-row {
-        display: flex;
-      }
-
-      .first-row {
-        justify-content: space-between;
-      }
-
-      .second-row {
-        margin-top: 40px;
-        justify-content: space-evenly;
-      }
-    }
-  }
-
-  .text-with-bg {
-    .dm-mono;
-    padding: 0 @padding-sm;
-    border-radius: 10px;
-    margin-top: 5px;
-
-    // will make all spans content inline while avoiding overflowing the viewport in mobile
-    // https://developer.mozilla.org/en-US/docs/Web/CSS/display#flow-root
-    // https://css-tricks.com/display-flow-root/
-    display: inline flow-root;
-
-    &.tangerine-bg {
-      background-color: var(--vivid-tangerine);
-    }
-
-    &.purple-bg {
-      background-color: var(--ceil);
-    }
-
-    &.yellow-bg {
-      background-color: var(--caramel);
-    }
-
-    &.green-bg {
-      background-color: var(--green-30);
-    }
-  }
-
-  .security-info {
-    .security-info-first-row {
-      margin-bottom: 32px;
-      @media (max-width: @screen-sm-max) {
-        margin-bottom: 0;
-      }
-    }
-
-    .security-info-item {
-      @media (max-width: @screen-sm-max) {
-        margin-bottom: 16px;
-      }
-    }
-  }
-
-  .resources {
-    @media (min-width: @screen-md-min) {
-      display: flex; /* equal heights */
-      flex-wrap: wrap;
-    }
-    .resources-card {
-      display: flex;
-      flex-wrap: wrap;
-      flex-direction: column;
-      margin-bottom: 48px;
-      align-content: flex-start;
-
-      @media (max-width: @screen-sm-max) {
-        margin-bottom: 16px;
-      }
-
-      img {
-        width: 56px;
-      }
-
-      h3 {
-        width: 100%;
-      }
-
-      a {
-        margin-top: auto;
-      }
-    }
-  }
-
-  .centered-block {
-    @media (min-width: @screen-md-min) {
-      text-align: center;
-    }
-  }
-
-  .heading-section-md-align-left {
-    @media (max-width: @screen-md-min) {
-      display: flex;
-      flex-direction: column;
-      align-items: baseline;
-
-      h2 {
-        text-align: left;
-      }
-      p {
-        text-align: left;
-      }
-    }
-  }
-
-  .dm-mono {
-    font-family: 'DM Mono', monospace;
-    // We're using the "ss05" (stylistic set 5) version of the DM Mono, by setting the `font-feature-settings` rule
-    // https://developer.mozilla.org/en-US/docs/Web/CSS/font-feature-settings
-    // We use the ss05 specifically to remove the "squiggle" below the f letter.
-    // You can try removing the `font-feature-settings` rule and check what happens to the letter "f",
-    // as it's quite hard to describe it with sentences alone
-    font-feature-settings: 'ss05';
-  }
-
-  .mono-text {
-    .dm-mono;
-    color: var(--green-60);
-    font-size: 1.125rem;
-    font-weight: 500;
-    line-height: 1.5rem;
-    margin: 0;
-  }
-
-  .customer-stories-hero-heading {
-    @media (max-width: @screen-sm-max) {
-      font-size: 2.25rem;
-      line-height: 1.333;
-    }
-  }
-
-  .customer-stories-hero-text {
-    font-size: 1.25rem;
-  }
-
-  .customer-stories-logos-text {
-    font-size: 1.125rem;
-  }
-
-  .link-with-arrow {
-    .dm-mono;
-    font-size: var(--font-size-04);
-    line-height: var(--line-height-03);
-    font-weight: 500;
-    color: var(--green-50);
-
-    i.material-symbols {
-      vertical-align: middle;
-      padding-bottom: 3px;
-      font-size: 24px;
-      line-height: inherit;
-      margin-left: var(--spacing-02);
-    }
-
-    &:hover {
-      color: var(--green-60);
-    }
-  }
-
-  .link-monospace {
-    .dm-mono;
-    font-weight: 500;
-    color: var(--green-50);
-    &:hover {
-      color: var(--green-60);
-    }
-  }
-
-  .green-link {
-    .link-with-arrow;
-    // TODO: replace .green-link uses with .link-with-arrow
-  }
-
-  .inline-green-link {
-    color: var(--green-50);
-    padding: 0;
-    text-decoration: underline;
-    // text-decoration-;skip-ink is for letter with descender (like 'g' and 'y')
-    // this will force underline to not skip the descender
-    text-decoration-skip-ink: none;
-
-    &:hover {
-      color: var(--green-60);
-    }
-
-    &:focus {
-      &:extend(.input-focus-style);
-    }
-  }
-
-  .btn-blue {
-    background: var(--sapphire-blue);
-    color: var(--white);
-
-    &:hover {
-      background: var(--sapphire-blue-dark);
-    }
-  }
-
-  .btn-primary {
-    &:not([disabled]) {
-      background: var(--green-50);
-      color: var(--white);
-
-      &:hover {
-        background: var(--green-60);
-      }
-    }
-  }
-
-  a {
-    &:focus,
-    &:focus-visible {
-      outline: 0;
-    }
-
-    &:focus-visible {
-      .box-shadow-button-input();
-    }
-
-    i {
-      vertical-align: middle;
-      margin-left: var(--spacing-02);
-      padding-bottom: 3px;
-    }
-
-    &.link-lg {
-      font-size: var(--font-size-04);
-      line-height: var(--line-height-03);
-
-      i {
-        font-size: 24px;
-        line-height: inherit;
-      }
-    }
-  }
-
-  .round-background {
-    border-radius: 50%;
-    font-size: 1.5rem;
-    top: 4px;
-    vertical-align: middle;
-    margin-right: 8px;
-    width: 24px;
-    height: 24px;
-  }
-
-  .green-round-background {
-    .round-background;
-    background: var(--green-30);
-  }
-
-  .blue-round-background {
-    .round-background;
-    background: var(--blue-10);
-    color: var(--blue-40);
-  }
-
-  // most of these are here to replace rules from core/type.less
-  blockquote {
-    border-left: none;
-    font-size: 1.875rem;
-    line-height: 1.333;
-    font-weight: 600;
-    quotes: '\201C' '\201D'; // override default quotes
-    padding: unset;
-    margin: unset;
-    font-family: 'Noto Sans', sans-serif;
-
-    &::after {
-      visibility: visible;
-      display: inline;
-      margin-left: 1px; // it's too tight to the text otherwise
-    }
-
-    &::before {
-      color: inherit;
-      margin-right: 0;
-      vertical-align: 0;
-    }
-
-    &::after,
-    &::before {
-      font-size: 1.875rem;
-      line-height: 1.333;
-    }
-
-    @media (max-width: @screen-sm-max) {
-      font-size: 1.5rem;
-      line-height: 1.333;
-
-      &::after,
-      &::before {
-        visibility: visible;
-        font-size: 1.5rem;
-        line-height: 1.333;
-      }
-    }
-  }
-
-  .circle-img {
-    height: 64px;
-    max-width: 64px;
-  }
-
-  .responsive-button-container {
-    display: flex;
-    margin-top: 24px;
-    gap: 16px;
-
-    &.centered-buttons {
-      justify-content: center;
-    }
-
-    &.align-left-button-sm {
-      @media (max-width: @screen-sm-max) {
-        justify-content: start;
-      }
-    }
-
-    @media (max-width: @screen-xs-max) {
-      width: 100%;
-      flex-direction: column;
-    }
-  }
-
-  .label-premium {
-    height: 20px; // override default height
-  }
-
-  .label-premium-block-md {
-    @media (max-width: @screen-md-max) {
-      display: block;
-      width: fit-content;
-      margin: 10px 0px 0px 0px;
-    }
-  }
-
-  .header-description {
-    p {
-      font-size: 1.25rem;
-      line-height: 1.4;
-      margin-bottom: 0;
-
-      @media (max-width: @screen-sm-max) {
-        font-size: 1.125rem;
-        line-height: 1.33;
-      }
-    }
-  }
-
-  .editor-pdf-video {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 585px;
-    padding: 0px 15px;
-
-    @media (max-width: @screen-sm-max) {
-      height: auto;
-    }
-
-    video {
-      box-shadow: 0px 60px 25px -15px rgba(16, 24, 40, 0.2);
-      max-height: 100%;
-      width: auto;
-
-      @media (max-width: @screen-sm-max) {
-        width: 100%;
-      }
-    }
-  }
-
-  .overleaf-sticker {
-    float: right;
-
-    @media (max-width: @screen-sm-max) {
-      width: 74px; // 70% of 106px
-    }
-  }
-}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss b/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
index ce53fcfa23..1a79a1221c 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/abstracts/mixins.scss
@@ -60,6 +60,17 @@
   }
 }
 
+@mixin labs-button {
+  @include ol-button-variant(
+    $color: var(--green-60),
+    $background: var(--bg-accent-03),
+    $border: var(--green-50),
+    $hover-background: var(--bg-accent-03),
+    $hover-border: var(--green-40),
+    $borderless: false
+  );
+}
+
 @mixin reset-button() {
   padding: 0;
   cursor: pointer;
diff --git a/services/web/frontend/stylesheets/bootstrap-5/abstracts/themes-common-variables.scss b/services/web/frontend/stylesheets/bootstrap-5/abstracts/themes-common-variables.scss
index e113f63829..ce99b88f33 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/abstracts/themes-common-variables.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/abstracts/themes-common-variables.scss
@@ -1,7 +1,59 @@
+/* ====== Semantic CSS color variables that adjust depending on the current theme ====== */
 :root {
   --editor-border-color: var(--neutral-80);
+  --bg-primary-themed: var(--bg-dark-primary);
+  --bg-secondary-themed: var(--bg-dark-secondary);
+  --bg-tertiary-themed: var(--bg-dark-tertiary);
+  --bg-disabled-themed: var(--bg-dark-disabled);
+  --content-primary-themed: var(--content-primary-dark);
+  --content-secondary-themed: var(--content-secondary-dark);
+  --content-disabled-themed: var(--content-disabled-dark);
+  --content-placeholder-themed: var(--content-placeholder-dark);
+  --content-danger-themed: var(--content-danger-dark);
+  --content-warning-themed: var(--content-warning-dark);
+  --content-positive-themed: var(--content-positive-dark);
+  --content-info-themed: var(--content-info-dark);
+  --border-primary-themed: var(--border-primary-dark);
+  --border-hover-themed: var(--border-hover-dark);
+  --border-disabled-themed: var(--border-disabled-dark);
+  --border-active-themed: var(--border-active-dark);
+  --border-danger-themed: var(--border-danger-dark);
+  --border-divider-themed: var(--border-divider-dark);
+  --link-web-themed: var(--link-web-dark);
+  --link-web-hover-themed: var(--link-web-hover-dark);
+  --link-web-visited-themed: var(--link-web-visited-dark);
+  --link-ui-themed: var(--link-ui-dark);
+  --link-ui-hover-themed: var(--link-ui-hover-dark);
+  --link-ui-visited-themed: var(--link-ui-visited-dark);
+  --premium-gradient-themed: var(--premium-gradient-dark);
 }
 
 @include theme('light') {
   --editor-border-color: var(--neutral-20);
+  --bg-primary-themed: var(--bg-light-primary);
+  --bg-secondary-themed: var(--bg-light-secondary);
+  --bg-tertiary-themed: var(--bg-light-tertiary);
+  --bg-disabled-themed: var(--bg-light-disabled);
+  --content-primary-themed: var(--content-primary);
+  --content-secondary-themed: var(--content-secondary);
+  --content-disabled-themed: var(--content-disabled);
+  --content-placeholder-themed: var(--content-placeholder);
+  --content-danger-themed: var(--content-danger);
+  --content-warning-themed: var(--content-warning);
+  --content-positive-themed: var(--content-positive);
+  --content-info-themed: var(--content-info);
+  --border-primary-themed: var(--border-primary);
+  --border-hover-themed: var(--border-hover);
+  --border-disabled-themed: var(--border-disabled);
+  --border-active-themed: var(--border-active);
+  --border-danger-themed: var(--border-danger);
+  --border-divider-themed: var(--border-divider);
+  --border-dark-divider-themed: var(--border-dark-divider);
+  --link-web-themed: var(--link-web);
+  --link-web-hover-themed: var(--link-web-hover);
+  --link-web-visited-themed: var(--link-web-visited);
+  --link-ui-themed: var(--link-ui);
+  --link-ui-hover-themed: var(--link-ui-hover);
+  --link-ui-visited-themed: var(--link-ui-visited);
+  --premium-gradient-themed: var(--premium-gradient);
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/abstracts/variable-overrides.scss b/services/web/frontend/stylesheets/bootstrap-5/abstracts/variable-overrides.scss
index c2a56d053e..353a8fdc2e 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/abstracts/variable-overrides.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/abstracts/variable-overrides.scss
@@ -162,10 +162,24 @@ $primary: $bg-accent-01;
 $secondary: $bg-light-primary;
 $success: $bg-accent-01;
 $info: $bg-info-01;
-$warning: $bg-warning-03;
+$warning: $content-warning;
 $danger: $bg-danger-01;
 $light: $bg-light-tertiary;
 $dark: $neutral-90;
+$warning-light-gb: $bg-warning-03;
+
+// Theme colors
+$theme-colors: (
+  'primary': $primary,
+  'secondary': $secondary,
+  'success': $success,
+  'info': $info,
+  'warning': $warning,
+  'warning-light-bg': $warning-light-gb,
+  'danger': $danger,
+  'light': $light,
+  'dark': $dark,
+);
 
 // Body colors
 $body-color: $content-primary;
diff --git a/services/web/frontend/stylesheets/bootstrap-5/base/layout.scss b/services/web/frontend/stylesheets/bootstrap-5/base/layout.scss
index a4bf73f87c..89feb11880 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/base/layout.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/base/layout.scss
@@ -78,3 +78,20 @@ hr {
 .row-spaced-extra-large {
   margin-top: calc(var(--line-height-03) * 4);
 }
+
+.inline-material-symbols .material-symbols {
+  vertical-align: middle;
+}
+
+.container-custom-sm {
+  max-width: 400px;
+}
+
+.full-height {
+  height: 100%;
+}
+
+.table-fixed {
+  table-layout: fixed;
+  word-wrap: break-word;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/base/links.scss b/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
index dc20dea1d3..f4bcbc6408 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
@@ -30,10 +30,10 @@ a {
   @include font-mono;
 
   font-weight: 500;
-  color: var(--green-50);
+  color: var(--link-web);
 
   &:hover {
-    color: var(--green-60);
+    color: var(--link-web-hover);
   }
 }
 
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/accordion.scss b/services/web/frontend/stylesheets/bootstrap-5/components/accordion.scss
new file mode 100644
index 0000000000..47d6d610c1
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/accordion.scss
@@ -0,0 +1,50 @@
+.ol-accordions-container :last-child {
+  border: 0 !important;
+}
+
+.ol-accordions-container {
+  .custom-accordion-item {
+    width: 100%;
+    padding-top: var(--spacing-08);
+    padding-bottom: var(--spacing-09);
+    border-bottom: 1px solid var(--border-divider);
+
+    .custom-accordion-header {
+      text-align: left;
+      width: 100%;
+      font-size: var(--font-size-04);
+      font-weight: 600;
+      line-height: var(--line-height-03);
+      color: var(--content-primary);
+      background-color: unset;
+      border: unset;
+      display: flex;
+      justify-content: space-between;
+      padding: unset;
+
+      .custom-accordion-icon {
+        display: flex;
+        align-items: center;
+        transition: transform 0.35s ease;
+        margin-left: var(--spacing-08);
+      }
+
+      &:not(.collapsed) {
+        .custom-accordion-icon {
+          transform: rotate(180deg);
+          transition: transform 0.35s ease;
+        }
+      }
+    }
+
+    .custom-accordion-body {
+      @include body-base;
+
+      background-color: unset;
+      text-align: left;
+      padding: unset;
+      padding-right: 2rem;
+      margin-top: var(--spacing-04);
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/all.scss b/services/web/frontend/stylesheets/bootstrap-5/components/all.scss
index 57c823fd52..a0237b47f0 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/all.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/all.scss
@@ -1,5 +1,7 @@
+@import 'accordion';
 @import 'button';
 @import 'button-group';
+@import 'caret';
 @import 'dropdown-menu';
 @import 'image';
 @import 'notifications';
@@ -44,3 +46,4 @@
 @import 'upgrade-prompt';
 @import 'integrations-panel';
 @import 'group-members';
+@import 'upgrade-benefits';
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/badge.scss b/services/web/frontend/stylesheets/bootstrap-5/components/badge.scss
index c6f09687f0..a3b2f13d0f 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/badge.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/badge.scss
@@ -10,10 +10,6 @@ $max-width: 160px;
   &:not(.badge-tag) {
     max-width: $max-width;
   }
-
-  &.bg-warning {
-    --bs-badge-color: var(--content-warning);
-  }
 }
 
 .badge-prepend {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/button.scss b/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
index 2cab3ac231..80220a6911 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/button.scss
@@ -78,14 +78,6 @@
     );
   }
 
-  &.btn-info-ghost {
-    @include ol-button-variant(
-      $color: var(--blue-50),
-      $background: transparent,
-      $hover-background: var(--neutral-10)
-    );
-  }
-
   &.btn-premium {
     @include ol-button-variant(
       $color: var(--content-primary-dark),
@@ -260,7 +252,6 @@
 
 // Set the visited colour for a link that is styled as a button. This is necessary because we have a generic rule that
 // sets the colour of visited links
-a[role='button']:visited,
 a.btn:visited {
   color: var(--bs-btn-color);
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/card.scss b/services/web/frontend/stylesheets/bootstrap-5/components/card.scss
index b99c107083..777ec46c79 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/card.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/card.scss
@@ -107,7 +107,8 @@
     color: var(--white);
     text-align: center;
     background-size: cover;
-    background-image: linear-gradient(
+    background-image:
+      linear-gradient(
         to right,
         rgba(0 0 0 / 40%) 0%,
         var(--dark-jungle-green) 25%,
@@ -142,7 +143,8 @@
     border-radius: var(--border-radius-medium);
     color: var(--white);
     background-size: cover;
-    background-image: linear-gradient(
+    background-image:
+      linear-gradient(
         to right,
         rgba(0 0 0 / 40%) 0%,
         var(--dark-jungle-green) 20%,
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/caret.scss b/services/web/frontend/stylesheets/bootstrap-5/components/caret.scss
new file mode 100644
index 0000000000..5f4deb3296
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/caret.scss
@@ -0,0 +1,15 @@
+:root {
+  --caret-width-base: 4px;
+}
+
+.caret {
+  display: inline-block;
+  width: 0;
+  height: 0;
+  margin-left: 2px;
+  vertical-align: middle;
+  border-top: var(--caret-width-base) solid;
+  border-right: var(--caret-width-base) solid transparent;
+  border-left: var(--caret-width-base) solid transparent;
+  margin-top: calc(-1 * var(--caret-width-base) / 2);
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/collapsible-file-header.scss b/services/web/frontend/stylesheets/bootstrap-5/components/collapsible-file-header.scss
index 4a510ae798..1474e54bb1 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/collapsible-file-header.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/collapsible-file-header.scss
@@ -1,3 +1,13 @@
+:root {
+  --collapsible-file-header-bg-color: var(--bg-light-tertiary);
+
+  @include theme('default') {
+    .ide-redesign-main {
+      --collapsible-file-header-bg-color: var(--bg-dark-tertiary);
+    }
+  }
+}
+
 .collapsible-file-header {
   all: unset;
   padding: var(--spacing-03) var(--spacing-04);
@@ -11,7 +21,7 @@
 }
 
 .collapsible-file-header-count {
-  background-color: var(--neutral-20);
+  background-color: var(--collapsible-file-header-bg-color);
   padding: var(--spacing-01) var(--spacing-02);
   margin-left: auto;
   border-radius: var(--border-radius-base);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/footer.scss b/services/web/frontend/stylesheets/bootstrap-5/components/footer.scss
index 139994ab08..48e4a25261 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/footer.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/footer.scss
@@ -354,12 +354,12 @@ footer.site-footer {
     }
 
     .fat-footer-sections {
-      grid-template-columns: repeat(6, 1fr);
+      grid-template-columns: repeat(7, 1fr);
       grid-template-rows: auto;
     }
 
     .footer-section:last-of-type {
-      grid-column: 6;
+      grid-column: 7;
     }
   }
 }
@@ -395,6 +395,11 @@ footer.site-footer {
       white-space: nowrap;
       padding-top: var(--spacing-00);
     }
+
+    .cookie-banner-content a,
+    .cookie-banner-actions .btn-link {
+      color: var(--link-ui);
+    }
   }
 }
 
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/form.scss b/services/web/frontend/stylesheets/bootstrap-5/components/form.scss
index 31b685de8a..3b86f5e51d 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/form.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/form.scss
@@ -151,6 +151,11 @@
     height: 100%;
     display: flex;
     align-items: center;
+
+    &:has(> i),
+    &:has(> .material-symbols) {
+      pointer-events: none;
+    }
   }
 
   .form-control-start-icon {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/link.scss b/services/web/frontend/stylesheets/bootstrap-5/components/link.scss
index 7a6b96b597..66174eedc5 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/link.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/link.scss
@@ -9,5 +9,6 @@
   i {
     margin-right: var(--spacing-02);
     padding-bottom: 3px;
+    vertical-align: middle;
   }
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/modal.scss b/services/web/frontend/stylesheets/bootstrap-5/components/modal.scss
index 6689bdd0bb..e19e9c249e 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/modal.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/modal.scss
@@ -85,3 +85,26 @@
 .git-bridge-optional-tokens-actions {
   margin-top: var(--spacing-05);
 }
+
+.upgrade-track-changes-modal {
+  .teaser-title {
+    font-family: var(--font-sans);
+    font-size: var(--font-size-05);
+    margin-bottom: var(--spacing-05);
+    margin-top: var(--spacing-05);
+    color: var(--content-secondary);
+  }
+
+  ul.list-unstyled li {
+    font-family: var(--font-sans);
+    padding: var(--spacing-02) 0;
+    color: var(--content-secondary);
+    display: flex;
+    align-items: flex-start;
+    gap: var(--spacing-04);
+  }
+
+  ul.list-unstyled li .check-icon {
+    padding-top: 2px;
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss b/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
index 5d28341cf5..dd0600ed15 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/nav.scss
@@ -8,7 +8,10 @@
   --navbar-padding-h: var(--spacing-05);
   --navbar-padding: 0 var(--navbar-padding-h);
   --navbar-brand-width: 130px;
-  --navbar-brand-image-url: url('../../../../public/img/ol-brand/overleaf-white.svg');
+  --navbar-brand-image-url: var(
+    --navbar-brand-image-default-url,
+    url('../../../../public/img/ol-brand/overleaf-white.svg')
+  );
 
   // Title, when used instead of a logo
   --navbar-title-font-size: var(--font-size-05);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss b/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
index 3b984bb6f3..3ec45aef2f 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/navbar.scss
@@ -1,3 +1,8 @@
+.no-scroll {
+  height: 100vh;
+  overflow: hidden;
+}
+
 // Default navbar
 .navbar-default {
   background-color: var(--navbar-bg);
@@ -216,7 +221,10 @@
 .website-redesign .navbar-default {
   --navbar-title-color: var(--content-primary);
   --navbar-title-color-hover: var(--content-secondary);
-  --navbar-brand-image-url: url('../../../../public/img/ol-brand/overleaf-black.svg');
+  --navbar-brand-image-url: var(
+    --navbar-brand-image-redesign-url,
+    url('../../../../public/img/ol-brand/overleaf-black.svg')
+  );
   --navbar-subdued-color: var(--content-primary);
   --navbar-subdued-hover-bg: var(--bg-dark-primary);
   --navbar-subdued-hover-color: var(--content-primary-dark);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/notifications.scss b/services/web/frontend/stylesheets/bootstrap-5/components/notifications.scss
index 2dc789ad44..e9f35c940d 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/notifications.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/notifications.scss
@@ -70,6 +70,12 @@
     padding: 18px $spacing-06 0 0;
   }
 
+  .notification-icon.notification-icon-center {
+    padding-top: 0;
+    display: flex;
+    align-items: center;
+  }
+
   .notification-content-and-cta {
     // shared container to align cta with text on smaller screens
     display: flex;
@@ -121,6 +127,7 @@
       cursor: pointer;
       background: transparent;
       border: 0;
+      color: var(--content-primary);
 
       &:hover,
       &:focus {
@@ -257,3 +264,8 @@
     }
   }
 }
+
+// Only apply bottom margin to form messages when it is non-empty
+.form-messages-bottom-margin > :last-child {
+  margin-bottom: var(--spacing-06);
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/panel-heading.scss b/services/web/frontend/stylesheets/bootstrap-5/components/panel-heading.scss
index 0792665cc5..71df17e601 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/panel-heading.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/panel-heading.scss
@@ -1,4 +1,17 @@
+:root {
+  --panel-heading-color: var(--content-primary);
+  --panel-heading-button-hover-color: var(--bg-light-tertiary);
+
+  @include theme('default') {
+    .ide-redesign-main {
+      --panel-heading-color: var(--content-primary-dark);
+      --panel-heading-button-hover-color: var(--bg-dark-tertiary);
+    }
+  }
+}
+
 .panel-heading {
+  color: var(--panel-heading-color);
   display: flex;
   align-items: center;
   padding: var(--spacing-03) var(--spacing-02);
@@ -21,11 +34,11 @@
   align-items: center;
   border: none;
   background-color: transparent;
-  color: var(--content-primary);
+  color: var(--panel-heading-color);
   padding: var(--spacing-01);
 
   &:hover,
   &:focus {
-    background-color: var(--neutral-20);
+    background-color: var(--panel-heading-button-hover-color);
   }
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/tabs.scss b/services/web/frontend/stylesheets/bootstrap-5/components/tabs.scss
index ac39f28c81..a307d2bc39 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/components/tabs.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/tabs.scss
@@ -15,7 +15,7 @@
       gap: var(--spacing-04);
       margin: 0 auto;
       padding: 0;
-      border-bottom: var(--border-width-base) solid var(--neutral-20);
+      border-bottom: var(--border-width-base) solid var(--border-divider);
       text-align: center;
       border-top: 2px solid transparent; // so that top focus border is visible
       min-width: max-content; // This is for horizontal scrolling
@@ -33,7 +33,7 @@
         button {
           border: 0;
           border-radius: 0;
-          color: var(--neutral-70);
+          color: var(--content-secondary);
           margin-right: unset;
           padding: var(--spacing-04);
           line-height: var(--line-height-03);
@@ -51,7 +51,7 @@
           }
 
           &:hover {
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
             text-decoration: none;
           }
 
@@ -63,10 +63,10 @@
 
       li > a.active,
       li > button.active {
-        background-color: transparent !important;
-        border: 0 !important;
-        border-bottom: 3px solid var(--green-50) !important;
-        color: var(--neutral-90) !important;
+        background-color: transparent;
+        border: 0;
+        border-bottom: 3px solid var(--green-50);
+        color: var(--content-primary);
       }
 
       &.align-left {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/components/upgrade-benefits.scss b/services/web/frontend/stylesheets/bootstrap-5/components/upgrade-benefits.scss
new file mode 100644
index 0000000000..d9702c3f64
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/components/upgrade-benefits.scss
@@ -0,0 +1,3 @@
+.upgrade-benefits li {
+  display: flex;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss b/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
index 84a169b0eb..8e5e9e8a78 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/foundations/colors.scss
@@ -83,14 +83,15 @@ $content-placeholder: $neutral-60;
 $content-danger: $red-50;
 $content-warning: $yellow-50;
 $content-positive: $green-50;
+$content-info: $blue-50;
 $border-primary: $neutral-60;
 $border-hover: $neutral-70;
 $border-disabled: $neutral-20;
 $border-active: $blue-50;
 $border-danger: $red-50;
 $border-divider: $neutral-20;
-$link-web: $green-50;
-$link-web-hover: $green-60;
+$link-web: $green-60;
+$link-web-hover: $green-70;
 $link-web-visited: $green-60;
 $link-ui: $blue-50;
 $link-ui-hover: $blue-60;
@@ -102,6 +103,7 @@ $content-placeholder-dark: $neutral-50;
 $content-danger-dark: $red-40;
 $content-warning-dark: $yellow-40;
 $content-positive-dark: $green-40;
+$content-info-dark: $blue-30;
 $border-primary-dark: $neutral-30;
 $border-hover-dark: $neutral-20;
 $border-disabled-dark: $neutral-80;
@@ -193,15 +195,17 @@ $link-ui-visited-dark: $blue-40;
   --content-danger: var(--red-50);
   --content-warning: var(--yellow-50);
   --content-positive: var(--green-50);
+  --content-info: var(--blue-50);
   --border-primary: var(--neutral-60);
   --border-hover: var(--neutral-70);
   --border-disabled: var(--neutral-20);
   --border-active: var(--blue-50);
   --border-danger: var(--red-50);
   --border-divider: var(--neutral-20);
-  --link-web: var(--green-50);
-  --link-web-hover: var(--green-60);
-  --link-web-visited: var(--green-50);
+  --border-dark-divider: var(--neutral-70);
+  --link-web: var(--green-60);
+  --link-web-hover: var(--green-70);
+  --link-web-visited: var(--green-60);
   --link-ui: var(--blue-50);
   --link-ui-hover: var(--blue-60);
   --link-ui-visited: var(--blue-60);
@@ -212,6 +216,7 @@ $link-ui-visited-dark: $blue-40;
   --content-danger-dark: var(--red-40);
   --content-warning-dark: var(--yellow-40);
   --content-positive-dark: var(--green-40);
+  --content-info-dark: var(--blue-30);
   --border-primary-dark: var(--neutral-30);
   --border-hover-dark: var(--neutral-20);
   --border-disabled-dark: var(--neutral-80);
@@ -232,4 +237,10 @@ $link-ui-visited-dark: $blue-40;
     #254c84 29%,
     var(--blue-40) 97%
   );
+  --premium-gradient-dark: linear-gradient(
+    246deg,
+    #6f8bcd 0%,
+    #8ea3d7 29%,
+    #ccdcff 97%
+  );
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/foundations/spacing.scss b/services/web/frontend/stylesheets/bootstrap-5/foundations/spacing.scss
index 2609c99b6d..6170be4cc9 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/foundations/spacing.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/foundations/spacing.scss
@@ -16,9 +16,10 @@ $spacing-13: 64px;
 $spacing-14: 72px;
 $spacing-15: 80px;
 $spacing-16: 96px;
-$all-spacings: spacing-00, spacing-01, spacing-02, spacing-03, spacing-04,
-  spacing-05, spacing-06, spacing-07, spacing-08, spacing-09, spacing-10,
-  spacing-11, spacing-12, spacing-13, spacing-14, spacing-15, spacing-16;
+$all-spacings:
+  spacing-00, spacing-01, spacing-02, spacing-03, spacing-04, spacing-05,
+  spacing-06, spacing-07, spacing-08, spacing-09, spacing-10, spacing-11,
+  spacing-12, spacing-13, spacing-14, spacing-15, spacing-16;
 
 :root {
   --spacing-00: #{$spacing-00};
diff --git a/services/web/frontend/stylesheets/bootstrap-5/main-style.scss b/services/web/frontend/stylesheets/bootstrap-5/main-style.scss
index eb705b461d..73294452ef 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/main-style.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/main-style.scss
@@ -7,7 +7,6 @@
 @import '../../fonts/noto-serif/noto-serif.css';
 @import '../../fonts/open-dyslexic-mono/open-dyslexic-mono.css';
 @import '../../fonts/material-symbols/material-symbols.css';
-@import '../../fonts/font-awesome/font-awesome.css';
 
 // Vendor CSS
 // TODO Bootstrap 5: Check whether this works with Bootstrap 5, and whether we can replace it
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modals/contact-us-modal.scss b/services/web/frontend/stylesheets/bootstrap-5/modals/contact-us-modal.scss
index 7ac5e62cbc..a0a373c94b 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/modals/contact-us-modal.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/modals/contact-us-modal.scss
@@ -60,15 +60,6 @@
     span {
       text-decoration: underline;
     }
-
-    .fa {
-      color: inherit;
-      text-decoration: none;
-    }
-  }
-
-  .fa {
-    color: var(--neutral-30);
   }
 }
 
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/all.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/all.scss
index b92eb80551..01d58c8c20 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/modules/all.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/all.scss
@@ -1,3 +1,10 @@
+@import 'metrics/admin-hub';
+@import 'metrics/daterange-picker';
+@import 'metrics/institution-hub';
+@import 'metrics/metrics';
+@import 'metrics/nvd3';
+@import 'metrics/nvd3_override';
+@import 'metrics/publisher-hub';
 @import 'third-party-references';
 @import 'symbol-palette';
 @import 'writefull';
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/admin-hub.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/admin-hub.scss
new file mode 100644
index 0000000000..3e6576cf92
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/admin-hub.scss
@@ -0,0 +1,93 @@
+.hub-header {
+  h2 {
+    display: inline-block;
+  }
+
+  .dropdown {
+    margin-right: var(--spacing-04);
+  }
+}
+
+.admin-item {
+  position: relative;
+  margin-bottom: var(--spacing-12);
+
+  .section-title {
+    text-transform: capitalize;
+  }
+
+  .alert-danger {
+    color: var(--content-danger);
+  }
+}
+
+.hidden-chart-section {
+  display: none;
+}
+
+.hub-circle {
+  display: inline-block;
+  background-color: var(--green-70);
+  border-radius: 50%;
+  width: 160px;
+  height: 160px;
+  text-align: center;
+  padding-top: 50px;
+  color: white;
+}
+
+.hub-circle-number {
+  display: block;
+  font-size: 36px;
+  font-weight: 900;
+  line-height: 1;
+}
+
+.hub-big-number {
+  float: left;
+  font-size: 32px;
+  font-weight: 900;
+  line-height: 40px;
+  color: var(--green-70);
+}
+
+.hub-big-number,
+.hub-number-label {
+  display: block;
+}
+
+.hub-metric-link {
+  position: absolute;
+  top: 9px;
+  right: 0;
+
+  i {
+    margin-right: 5px;
+  }
+}
+
+.custom-donut-container {
+  svg {
+    max-width: 700px;
+    margin: auto;
+  }
+
+  .chart-center-text {
+    font-family: $font-family-sans-serif;
+    font-size: 40px;
+    font-weight: bold;
+    fill: var(--green-70);
+    text-anchor: middle;
+  }
+
+  .nv-legend-text {
+    font-family: $font-family-sans-serif;
+    font-size: 14px;
+  }
+}
+
+.chart-no-center-text {
+  .chart-center-text {
+    display: none;
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/daterange-picker.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/daterange-picker.scss
new file mode 100644
index 0000000000..33e466bd91
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/daterange-picker.scss
@@ -0,0 +1,617 @@
+// A stylesheet for use with Bootstrap 3.x
+// @author: Dan Grossman http://www.dangrossman.info/
+// @copyright: Copyright (c) 2012-2015 Dan Grossman. All rights reserved.
+// @license: Licensed under the MIT license. See http://www.opensource.org/licenses/mit-license.php
+// @website: https://www.improvely.com/
+
+/* stylelint-disable selector-class-pattern */
+
+// VARIABLES
+
+// Settings
+
+// The class name to contain everything within.
+$arrow-size: 7px;
+
+// Colors
+$daterangepicker-color: $green-50;
+$daterangepicker-bg-color: #fff;
+$daterangepicker-cell-color: $daterangepicker-color;
+$daterangepicker-cell-border-color: transparent;
+$daterangepicker-cell-bg-color: $daterangepicker-bg-color;
+$daterangepicker-cell-hover-color: $daterangepicker-color;
+$daterangepicker-cell-hover-border-color: $daterangepicker-cell-border-color;
+$daterangepicker-cell-hover-bg-color: #eee;
+$daterangepicker-in-range-color: #000;
+$daterangepicker-in-range-border-color: transparent;
+$daterangepicker-in-range-bg-color: #ebf4f8;
+$daterangepicker-active-color: #fff;
+$daterangepicker-active-bg-color: #138a07;
+$daterangepicker-active-border-color: transparent;
+$daterangepicker-unselected-color: #999;
+$daterangepicker-unselected-border-color: transparent;
+$daterangepicker-unselected-bg-color: #fff;
+
+// daterangepicker
+$daterangepicker-width: 278px;
+$daterangepicker-padding: 4px;
+$daterangepicker-z-index: 3000;
+$daterangepicker-border-size: 1px;
+$daterangepicker-border-color: #ccc;
+$daterangepicker-border-radius: 4px;
+
+// Calendar
+$daterangepicker-calendar-margin: $daterangepicker-padding;
+$daterangepicker-calendar-bg-color: $daterangepicker-bg-color;
+$daterangepicker-calendar-border-size: 1px;
+$daterangepicker-calendar-border-color: $daterangepicker-bg-color;
+$daterangepicker-calendar-border-radius: $daterangepicker-border-radius;
+
+// Calendar Cells
+$daterangepicker-cell-size: 20px;
+$daterangepicker-cell-width: $daterangepicker-cell-size;
+$daterangepicker-cell-height: $daterangepicker-cell-size;
+$daterangepicker-cell-border-radius: $daterangepicker-calendar-border-radius;
+$daterangepicker-cell-border-size: 1px;
+
+// Dropdowns
+$daterangepicker-dropdown-z-index: $daterangepicker-z-index + 1;
+
+// Controls
+$daterangepicker-control-height: 30px;
+$daterangepicker-control-line-height: $daterangepicker-control-height;
+$daterangepicker-control-color: #555;
+$daterangepicker-control-border-size: 1px;
+$daterangepicker-control-border-color: #ccc;
+$daterangepicker-control-border-radius: 4px;
+$daterangepicker-control-active-border-size: 1px;
+$daterangepicker-control-active-border-color: $green-50;
+$daterangepicker-control-active-border-radius: $daterangepicker-control-border-radius;
+$daterangepicker-control-disabled-color: #ccc;
+
+// Ranges
+$daterangepicker-ranges-color: $green-50;
+$daterangepicker-ranges-bg-color: daterangepicker-ranges-color;
+$daterangepicker-ranges-border-size: 1px;
+$daterangepicker-ranges-border-color: $daterangepicker-ranges-bg-color;
+$daterangepicker-ranges-border-radius: $daterangepicker-border-radius;
+$daterangepicker-ranges-hover-color: #fff;
+$daterangepicker-ranges-hover-bg-color: $daterangepicker-ranges-color;
+$daterangepicker-ranges-hover-border-size: $daterangepicker-ranges-border-size;
+$daterangepicker-ranges-hover-border-color: $daterangepicker-ranges-hover-bg-color;
+$daterangepicker-ranges-hover-border-radius: $daterangepicker-border-radius;
+$daterangepicker-ranges-active-border-size: $daterangepicker-ranges-border-size;
+$daterangepicker-ranges-active-border-color: $daterangepicker-ranges-bg-color;
+$daterangepicker-ranges-active-border-radius: $daterangepicker-border-radius;
+
+// STYLESHEETS
+.daterangepicker {
+  position: absolute;
+  color: $daterangepicker-color;
+  background-color: $daterangepicker-bg-color;
+  border-radius: $daterangepicker-border-radius;
+  width: $daterangepicker-width;
+  padding: $daterangepicker-padding;
+  margin-top: $daterangepicker-border-size;
+
+  // TODO: Should these be parameterized??
+  // top: 100px;
+  // left: 20px;
+
+  $arrow-prefix-size: $arrow-size;
+  $arrow-suffix-size: ($arrow-size - $daterangepicker-border-size);
+
+  &::before,
+  &::after {
+    position: absolute;
+    display: inline-block;
+    border-bottom-color: rgb(0 0 0 / 20%);
+    content: '';
+  }
+
+  &::before {
+    top: -$arrow-prefix-size;
+    border-right: $arrow-prefix-size solid transparent;
+    border-left: $arrow-prefix-size solid transparent;
+    border-bottom: $arrow-prefix-size solid $daterangepicker-border-color;
+  }
+
+  &::after {
+    top: -$arrow-suffix-size;
+    border-right: $arrow-suffix-size solid transparent;
+    border-bottom: $arrow-suffix-size solid $daterangepicker-bg-color;
+    border-left: $arrow-suffix-size solid transparent;
+  }
+
+  &.opensleft {
+    &::before {
+      // TODO: Make this relative to prefix size.
+      right: $arrow-prefix-size + 2px;
+    }
+
+    &::after {
+      // TODO: Make this relative to suffix size.
+      right: $arrow-suffix-size + 4px;
+    }
+  }
+
+  &.openscenter {
+    &::before {
+      left: 0;
+      right: 0;
+      width: 0;
+      margin-left: auto;
+      margin-right: auto;
+    }
+
+    &::after {
+      left: 0;
+      right: 0;
+      width: 0;
+      margin-left: auto;
+      margin-right: auto;
+    }
+  }
+
+  &.opensright {
+    &::before {
+      // TODO: Make this relative to prefix size.
+      left: $arrow-prefix-size + 2px;
+    }
+
+    &::after {
+      // TODO: Make this relative to suffix size.
+      left: $arrow-suffix-size + 4px;
+    }
+  }
+
+  &.dropup {
+    margin-top: -5px;
+
+    // NOTE: Note sure why these are special-cased.
+    &::before {
+      top: initial;
+      bottom: -$arrow-prefix-size;
+      border-bottom: initial;
+      border-top: $arrow-prefix-size solid $daterangepicker-border-color;
+    }
+
+    &::after {
+      top: initial;
+      bottom: -$arrow-suffix-size;
+      border-bottom: initial;
+      border-top: $arrow-suffix-size solid $daterangepicker-bg-color;
+    }
+  }
+
+  &.dropdown-menu {
+    max-width: none;
+    z-index: $daterangepicker-dropdown-z-index;
+  }
+
+  &.single {
+    .ranges,
+    .calendar {
+      float: none;
+    }
+  }
+
+  /* Calendars */
+  &.show-calendar {
+    .calendar {
+      display: block;
+    }
+  }
+
+  .calendar {
+    display: none;
+    max-width: $daterangepicker-width - ($daterangepicker-calendar-margin * 2);
+    margin: $daterangepicker-calendar-margin;
+
+    &.single {
+      .calendar-table {
+        border: none;
+      }
+    }
+
+    th,
+    td {
+      white-space: nowrap;
+      text-align: center;
+
+      // TODO: Should this actually be hard-coded?
+      min-width: 32px;
+    }
+  }
+
+  .calendar-table {
+    border: $daterangepicker-calendar-border-size solid
+      $daterangepicker-calendar-border-color;
+    padding: $daterangepicker-calendar-margin;
+    border-radius: $daterangepicker-calendar-border-radius;
+    background-color: $daterangepicker-calendar-bg-color;
+  }
+
+  table {
+    width: 100%;
+    margin: 0;
+  }
+
+  td,
+  th {
+    text-align: center;
+    width: $daterangepicker-cell-width;
+    height: $daterangepicker-cell-height;
+    border-radius: $daterangepicker-cell-border-radius;
+    border: $daterangepicker-cell-border-size solid
+      $daterangepicker-cell-border-color;
+    white-space: nowrap;
+    cursor: pointer;
+
+    &.available {
+      &:hover {
+        background-color: $daterangepicker-cell-hover-bg-color;
+        border-color: $daterangepicker-cell-hover-border-color;
+        color: $daterangepicker-cell-hover-color;
+      }
+    }
+
+    &.week {
+      font-size: 80%;
+      color: #ccc;
+    }
+  }
+
+  td {
+    &.off {
+      &,
+      &.in-range,
+      &.start-date,
+      &.end-date {
+        background-color: $daterangepicker-unselected-bg-color;
+        border-color: $daterangepicker-unselected-border-color;
+        color: $daterangepicker-unselected-color;
+      }
+    }
+
+    // Date Range
+    &.in-range {
+      background-color: $daterangepicker-in-range-bg-color;
+      border-color: $daterangepicker-in-range-border-color;
+      color: $daterangepicker-in-range-color;
+
+      // TODO: Should this be static or should it be parameterized?
+      border-radius: 0;
+    }
+
+    &.start-date {
+      border-radius: $daterangepicker-cell-border-radius 0 0
+        $daterangepicker-cell-border-radius;
+    }
+
+    &.end-date {
+      border-radius: 0 $daterangepicker-cell-border-radius
+        $daterangepicker-cell-border-radius 0;
+    }
+
+    &.start-date.end-date {
+      border-radius: $daterangepicker-cell-border-radius;
+    }
+
+    &.active {
+      &,
+      &:hover {
+        background-color: $daterangepicker-active-bg-color;
+        border-color: $daterangepicker-active-border-color;
+        color: $daterangepicker-active-color;
+      }
+    }
+  }
+
+  th {
+    &.month {
+      width: auto;
+    }
+  }
+
+  // Disabled Controls
+  td,
+  option {
+    &.disabled {
+      color: #999;
+      cursor: not-allowed;
+      text-decoration: line-through;
+    }
+  }
+
+  select {
+    &.monthselect,
+    &.yearselect {
+      font-size: 12px;
+      padding: 1px;
+      height: auto;
+      margin: 0;
+      cursor: default;
+    }
+
+    &.monthselect {
+      margin-right: 2%;
+      width: 56%;
+    }
+
+    &.yearselect {
+      width: 40%;
+    }
+
+    &.hourselect,
+    &.minuteselect,
+    &.secondselect,
+    &.ampmselect {
+      width: 50px;
+      margin-bottom: 0;
+    }
+  }
+
+  // Text Input Controls (above calendar)
+  .input-mini {
+    border: $daterangepicker-control-border-size solid
+      $daterangepicker-control-border-color;
+    border-radius: $daterangepicker-control-border-radius;
+    color: $daterangepicker-control-color;
+    height: $daterangepicker-control-line-height;
+    line-height: $daterangepicker-control-height;
+    display: block;
+    vertical-align: middle;
+
+    // TODO: Should these all be static, too??
+    margin: 0 0 5px;
+    padding: 0 6px 0 28px;
+    width: 100%;
+
+    &.active {
+      border: $daterangepicker-control-active-border-size solid
+        $daterangepicker-control-active-border-color;
+      border-radius: $daterangepicker-control-active-border-radius;
+    }
+  }
+
+  .daterangepicker_input {
+    position: relative;
+    padding-left: 0;
+
+    i {
+      position: absolute;
+
+      // NOTE: These appear to be eyeballed to me...
+      left: 8px;
+      top: var(--spacing-04);
+    }
+  }
+
+  &.rtl {
+    .input-mini {
+      padding-right: 28px;
+      padding-left: 6px;
+    }
+
+    .daterangepicker_input i {
+      left: auto;
+      right: 8px;
+    }
+  }
+
+  // Time Picker
+  .calendar-time {
+    text-align: center;
+    margin: 5px auto;
+    line-height: $daterangepicker-control-line-height;
+    position: relative;
+    padding-left: 28px;
+
+    select {
+      &.disabled {
+        color: $daterangepicker-control-disabled-color;
+        cursor: not-allowed;
+      }
+    }
+  }
+}
+
+// Predefined Ranges
+.ranges {
+  font-size: 11px;
+  float: none;
+  margin: 4px;
+  text-align: left;
+
+  ul {
+    list-style: none;
+    margin: 0 auto;
+    padding: 0;
+    width: 100%;
+  }
+
+  li {
+    font-size: 13px;
+    background-color: $daterangepicker-ranges-bg-color;
+    border: $daterangepicker-ranges-border-size solid
+      $daterangepicker-ranges-border-color;
+    border-radius: $daterangepicker-ranges-border-radius;
+    color: $daterangepicker-ranges-color;
+    padding: 3px 12px;
+    margin-bottom: 8px;
+    cursor: pointer;
+
+    &:hover {
+      background-color: $daterangepicker-ranges-hover-bg-color;
+      color: $daterangepicker-ranges-hover-color;
+    }
+
+    &.active {
+      background-color: $daterangepicker-ranges-hover-bg-color;
+      border: $daterangepicker-ranges-hover-border-size solid
+        $daterangepicker-ranges-hover-border-color;
+      color: $daterangepicker-ranges-hover-color;
+    }
+  }
+}
+
+/*  Larger Screen Styling */
+@include media-breakpoint-up(sm) {
+  .daterangepicker {
+    .glyphicon {
+      /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword */
+      font-family: FontAwesome;
+    }
+
+    .glyphicon-chevron-left::before {
+      content: '\f053';
+    }
+
+    .glyphicon-chevron-right::before {
+      content: '\f054';
+    }
+
+    .glyphicon-calendar::before {
+      content: '\f073';
+    }
+
+    width: auto;
+
+    .ranges {
+      ul {
+        width: 160px;
+      }
+    }
+
+    &.single {
+      .ranges {
+        ul {
+          width: 100%;
+        }
+      }
+
+      .calendar.left {
+        clear: none;
+      }
+
+      &.ltr {
+        .ranges,
+        .calendar {
+          float: left;
+        }
+      }
+
+      &.rtl {
+        .ranges,
+        .calendar {
+          float: right;
+        }
+      }
+    }
+
+    &.ltr {
+      direction: ltr;
+      text-align: left;
+
+      .calendar {
+        &.left {
+          clear: left;
+          margin-right: 0;
+
+          .calendar-table {
+            border-right: none;
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+            padding-right: 12px;
+          }
+        }
+
+        &.right {
+          margin-left: 0;
+
+          .calendar-table {
+            border-left: none;
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+          }
+        }
+      }
+
+      .left .daterangepicker_input {
+        padding-right: 12px;
+      }
+
+      .ranges,
+      .calendar {
+        float: left;
+      }
+    }
+
+    &.rtl {
+      direction: rtl;
+      text-align: right;
+
+      .calendar {
+        &.left {
+          clear: right;
+          margin-left: 0;
+
+          .calendar-table {
+            border-left: none;
+            border-top-left-radius: 0;
+            border-bottom-left-radius: 0;
+            padding-left: 12px;
+          }
+        }
+
+        &.right {
+          margin-right: 0;
+
+          .calendar-table {
+            border-right: none;
+            border-top-right-radius: 0;
+            border-bottom-right-radius: 0;
+          }
+        }
+      }
+
+      .ranges,
+      .calendar {
+        text-align: right;
+        float: right;
+      }
+    }
+  }
+}
+
+@include media-breakpoint-up(md) {
+  /* force the calendar to display on one row */
+  .show-calendar {
+    min-width: 658px; /* width of all contained elements, IE/Edge fallback */
+    width: max-content;
+  }
+
+  .daterangepicker {
+    .ranges {
+      width: auto;
+    }
+
+    &.ltr {
+      .ranges {
+        float: left;
+        clear: none !important;
+      }
+    }
+
+    &.rtl {
+      .ranges {
+        float: right;
+      }
+    }
+
+    .calendar {
+      clear: none !important;
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/app/institution-hub.less b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/institution-hub.scss
similarity index 52%
rename from services/web/frontend/stylesheets/app/institution-hub.less
rename to services/web/frontend/stylesheets/bootstrap-5/modules/metrics/institution-hub.scss
index cb705e4b99..67cbe580e4 100644
--- a/services/web/frontend/stylesheets/app/institution-hub.less
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/institution-hub.scss
@@ -1,38 +1,54 @@
 #institution-hub {
-  .section_header {
+  .section-header {
     .dropdown {
-      margin-right: 10px;
+      margin-right: var(--spacing-04);
     }
   }
 
   #usage {
     .recent-activity {
       .overbox {
-        font-size: 16px;
+        @include body-base;
       }
+
       .hub-big-number,
       .hub-number-label,
       .worked-on {
         display: block;
         width: 50%;
       }
+
       .hub-big-number {
-        padding-right: 10px;
+        padding-right: var(--spacing-04);
         text-align: right;
       }
+
       .hub-number-label,
       .worked-on {
         float: right;
       }
+
       .hub-number-label {
         &:nth-child(odd) {
-          margin-top: 16px;
+          margin-top: var(--spacing-06);
         }
       }
+
       .worked-on {
-        color: @text-small-color;
+        color: var(--content-secondary);
         font-style: italic;
       }
     }
   }
+
+  .overbox {
+    margin: 0;
+    padding: var(--spacing-10) var(--spacing-07);
+    background: var(--white);
+    border: 1px solid var(--content-disabled);
+
+    &.overbox-small {
+      padding: var(--spacing-04);
+    }
+  }
 }
diff --git a/services/web/frontend/stylesheets/app/metrics.less b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/metrics.scss
similarity index 78%
rename from services/web/frontend/stylesheets/app/metrics.less
rename to services/web/frontend/stylesheets/bootstrap-5/modules/metrics/metrics.scss
index 5256b8a8bd..f6e6a3fd3e 100644
--- a/services/web/frontend/stylesheets/app/metrics.less
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/metrics.scss
@@ -1,6 +1,6 @@
 #metrics {
   max-width: none;
-  padding: 0 30px;
+  padding: 0 var(--spacing-09);
   width: auto;
 
   svg.nvd3-svg {
@@ -9,17 +9,18 @@
 
   .overbox {
     margin: 0;
-    padding: 40px 20px;
+    padding: var(--spacing-10) var(--spacing-07);
     background: #fff;
     border: 1px solid #dfdfdf;
+
     .box {
-      padding-bottom: 30px;
+      padding-bottom: var(--spacing-09);
       overflow: hidden;
-      margin-bottom: 40px;
-      border-bottom: 1px solid rgb(216, 216, 216);
+      margin-bottom: var(--spacing-10);
+      border-bottom: 1px solid rgb(216 216 216);
 
       .header {
-        margin-bottom: 20px;
+        margin-bottom: var(--spacing-07);
 
         h4 {
           font-size: 19px;
@@ -27,10 +28,14 @@
         }
       }
     }
+
+    &.overbox-small {
+      padding: var(--spacing-04);
+    }
   }
 
   .print-button {
-    margin-right: 10px;
+    margin-right: var(--spacing-04);
     font-size: 20px;
   }
 
@@ -40,21 +45,18 @@
   }
 
   .metric-col {
-    padding: 15px;
-  }
-
-  .metric-header-container {
-    h4 {
-      margin-bottom: 0;
-    }
+    position: relative;
+    padding: var(--spacing-06);
   }
 
   svg {
     display: block;
     height: 250px;
+
     text {
       font-family: 'Open Sans', sans-serif;
     }
+
     &:not(:root) {
       overflow: visible;
     }
@@ -79,6 +81,10 @@
 
   // BEGIN: Metrics header
   .metric-header-container {
+    h4 {
+      margin-bottom: 0;
+    }
+
     > h4 {
       margin-top: 0;
       margin-bottom: 0;
@@ -89,12 +95,14 @@
       font-size: 0.5em;
     }
   }
+
   // END: Metrics header
 
   // BEGIN: Metrics footer
   .metric-footer-container {
     text-align: center;
   }
+
   // END: Metrics footer
 
   // BEGIN: Metrics overlays
@@ -107,7 +115,7 @@
     height: 100%;
     width: 100%;
     padding: 16px; /* 15px of .metric-col padding + 1px border */
-    padding-top: 56px; /* Same as above + 30px for title + 10px overbox padding*/
+    padding-top: 56px; /* Same as above + 30px for title + 10px overbox padding */
   }
 
   .metric-overlay-loading {
@@ -129,19 +137,20 @@
     width: 100%;
     height: 100%;
   }
+
   // END: Metrics overlays
 }
 
 #metrics-header {
-  @media (min-width: 1200px) {
-    margin-bottom: 30px;
+  @include media-breakpoint-up(lg) {
+    margin-bottom: var(--spacing-09);
   }
 
   h3 {
     display: inline-block;
   }
 
-  .section_header {
+  .section-header {
     margin-bottom: 0;
   }
 
@@ -162,9 +171,11 @@
 
   #dates-container {
     display: inline-block;
+
     .daterangepicker {
-      margin-right: 15px;
+      margin-right: var(--spacing-06);
     }
+
     #metrics-dates {
       padding: 0;
     }
@@ -172,14 +183,10 @@
 }
 
 #metrics-footer {
-  margin-top: 30px;
+  margin-top: var(--spacing-09);
   text-align: center;
 }
 
-body.print-loading {
-  #metrics {
-    .metric-col {
-      opacity: 0.5;
-    }
-  }
+body.print-loading #metrics .metric-col {
+  opacity: 0.5;
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3.scss
new file mode 100755
index 0000000000..4983129a80
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3.scss
@@ -0,0 +1,677 @@
+/* stylelint-disable */
+
+/* nvd3 version 1.8.4 (https://github.com/novus/nvd3) 2016-07-03 */
+.nvd3 .nv-axis {
+  pointer-events: none;
+  opacity: 1;
+}
+
+.nvd3 .nv-axis path {
+  fill: none;
+  stroke: #000;
+  stroke-opacity: 0.75;
+  shape-rendering: crispedges;
+}
+
+.nvd3 .nv-axis path.domain {
+  stroke-opacity: 0.75;
+}
+
+.nvd3 .nv-axis.nv-x path.domain {
+  stroke-opacity: 0;
+}
+
+.nvd3 .nv-axis line {
+  fill: none;
+  stroke: #e5e5e5;
+  shape-rendering: crispedges;
+}
+
+.nvd3 .nv-axis .zero line,
+    /*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
+  stroke-opacity: 0.75;
+}
+
+.nvd3 .nv-axis .nv-axisMaxMin text {
+  font-weight: bold;
+}
+
+.nvd3 .x .nv-axis .nv-axisMaxMin text,
+.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
+.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
+  text-anchor: middle;
+}
+
+.nvd3 .nv-axis.nv-disabled {
+  opacity: 0;
+}
+
+.nvd3 .nv-bars rect {
+  fill-opacity: 0.75;
+  transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-bars rect.hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-bars .hover rect {
+  fill: lightblue;
+}
+
+.nvd3 .nv-bars text {
+  fill: rgb(0 0 0 / 0%);
+}
+
+.nvd3 .nv-bars .hover text {
+  fill: rgb(0 0 0 / 100%);
+}
+
+.nvd3 .nv-multibar .nv-groups rect,
+.nvd3 .nv-multibarHorizontal .nv-groups rect,
+.nvd3 .nv-discretebar .nv-groups rect {
+  stroke-opacity: 0;
+  transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-multibar .nv-groups rect:hover,
+.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
+.nvd3 .nv-candlestickBar .nv-ticks rect:hover,
+.nvd3 .nv-discretebar .nv-groups rect:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-discretebar .nv-groups text,
+.nvd3 .nv-multibarHorizontal .nv-groups text {
+  font-weight: bold;
+  fill: rgb(0 0 0 / 100%);
+  stroke: rgb(0 0 0 / 0%);
+}
+
+/* boxplot CSS */
+.nvd3 .nv-boxplot circle {
+  fill-opacity: 0.5;
+}
+
+.nvd3 .nv-boxplot circle:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-boxplot rect:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 line.nv-boxplot-median {
+  stroke: black;
+}
+
+.nv-boxplot-tick:hover {
+  stroke-width: 2.5px;
+}
+
+/* bullet */
+.nvd3.nv-bullet {
+  font: 10px sans-serif;
+}
+
+.nvd3.nv-bullet .nv-measure {
+  fill-opacity: 0.8;
+}
+
+.nvd3.nv-bullet .nv-measure:hover {
+  fill-opacity: 1;
+}
+
+.nvd3.nv-bullet .nv-marker {
+  stroke: #000;
+  stroke-width: 2px;
+}
+
+.nvd3.nv-bullet .nv-markerTriangle {
+  stroke: #000;
+  fill: #fff;
+  stroke-width: 1.5px;
+}
+
+.nvd3.nv-bullet .nv-markerLine {
+  stroke: #000;
+  stroke-width: 1.5px;
+}
+
+.nvd3.nv-bullet .nv-tick line {
+  stroke: #666;
+  stroke-width: 0.5px;
+}
+
+.nvd3.nv-bullet .nv-range.nv-s0 {
+  fill: #eee;
+}
+
+.nvd3.nv-bullet .nv-range.nv-s1 {
+  fill: #ddd;
+}
+
+.nvd3.nv-bullet .nv-range.nv-s2 {
+  fill: #ccc;
+}
+
+.nvd3.nv-bullet .nv-title {
+  font-size: 14px;
+  font-weight: bold;
+}
+
+.nvd3.nv-bullet .nv-subtitle {
+  fill: #999;
+}
+
+.nvd3.nv-bullet .nv-range {
+  fill: #bababa;
+  fill-opacity: 0.4;
+}
+
+.nvd3.nv-bullet .nv-range:hover {
+  fill-opacity: 0.7;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick {
+  stroke-width: 1px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.hover {
+  stroke-width: 2px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.positive rect {
+  stroke: #2ca02c;
+  fill: #2ca02c;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.negative rect {
+  stroke: #d62728;
+  fill: #d62728;
+}
+
+.with-transitions .nv-candlestickBar .nv-ticks .nv-tick {
+  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks line {
+  stroke: #333;
+}
+
+.nv-force-node {
+  stroke: #fff;
+  stroke-width: 1.5px;
+}
+
+.nv-force-link {
+  stroke: #999;
+  stroke-opacity: 0.6;
+}
+
+.nv-force-node text {
+  stroke-width: 0;
+}
+
+.nvd3 .nv-legend .nv-disabled rect {
+  /* fill-opacity: 0; */
+}
+
+.nvd3 .nv-check-box .nv-box {
+  fill-opacity: 0;
+  stroke-width: 2;
+}
+
+.nvd3 .nv-check-box .nv-check {
+  fill-opacity: 0;
+  stroke-width: 4;
+}
+
+.nvd3 .nv-series.nv-disabled .nv-check-box .nv-check {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3 .nv-controlsWrap .nv-legend .nv-check-box .nv-check {
+  opacity: 0;
+}
+
+/* line plus bar */
+.nvd3.nv-linePlusBar .nv-bar rect {
+  fill-opacity: 0.75;
+}
+
+.nvd3.nv-linePlusBar .nv-bar rect:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-groups path.nv-line {
+  fill: none;
+}
+
+.nvd3 .nv-groups path.nv-area {
+  stroke: none;
+}
+
+.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
+  fill-opacity: 0.5 !important;
+  stroke-opacity: 0.5 !important;
+}
+
+.with-transitions .nvd3 .nv-groups .nv-point {
+  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-scatter .nv-groups .nv-point.hover,
+.nvd3 .nv-groups .nv-point.hover {
+  stroke-width: 7px;
+  fill-opacity: 0.95 !important;
+  stroke-opacity: 0.95 !important;
+}
+
+.nvd3 .nv-point-paths path {
+  stroke: #aaa;
+  stroke-opacity: 0;
+  fill: #eee;
+  fill-opacity: 0;
+}
+
+.nvd3 .nv-indexLine {
+  cursor: ew-resize;
+}
+
+/********************
+ * SVG CSS
+ */
+
+/********************
+  Default CSS for an svg element nvd3 used
+*/
+svg.nvd3-svg, svg.nvd3-iddle {
+  -webkit-touch-callout: none;
+  user-select: none;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+/********************
+  Box shadow and border radius styling
+*/
+.nvtooltip.with-3d-shadow,
+.with-3d-shadow .nvtooltip {
+  box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
+  border-radius: 5px;
+}
+
+.nvd3 text {
+  font: normal 12px Arial;
+}
+
+.nvd3 .title {
+  font: bold 14px Arial;
+}
+
+.nvd3 .nv-background {
+  fill: white;
+  fill-opacity: 0;
+}
+
+.nvd3.nv-noData {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+/**********
+*  Brush
+*/
+
+.nv-brush .extent {
+  fill-opacity: 0.125;
+  shape-rendering: crispedges;
+}
+
+.nv-brush .resize path {
+  fill: #eee;
+  stroke: #666;
+}
+
+/**********
+*  Legend
+*/
+
+.nvd3 .nv-legend .nv-series {
+  cursor: pointer;
+}
+
+.nvd3 .nv-legend .nv-disabled circle {
+  fill-opacity: 0;
+}
+
+/* focus */
+.nvd3 .nv-brush .extent {
+  fill-opacity: 0 !important;
+}
+
+.nvd3 .nv-brushBackground rect {
+  stroke: #000;
+  stroke-width: 0.4;
+  fill: #fff;
+  fill-opacity: 0.7;
+}
+
+/**********
+*  Print
+*/
+
+@media print {
+  .nvd3 text {
+    stroke-width: 0;
+    fill-opacity: 1;
+  }
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
+  stroke-width: 1px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
+  stroke-width: 2px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
+  stroke: #2ca02c;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
+  stroke: #d62728;
+}
+
+.nvd3 .background path {
+  fill: none;
+  stroke: #eee;
+  stroke-opacity: 0.4;
+  shape-rendering: crispedges;
+}
+
+.nvd3 .foreground path {
+  fill: none;
+  stroke-opacity: 0.7;
+}
+
+.nvd3 .nv-parallelCoordinates-brush .extent {
+  fill: #fff;
+  fill-opacity: 0.6;
+  stroke: gray;
+  shape-rendering: crispedges;
+}
+
+.nvd3 .nv-parallelCoordinates .hover {
+  fill-opacity: 1;
+  stroke-width: 3px;
+}
+
+.nvd3 .missingValuesline line {
+  fill: none;
+  stroke: black;
+  stroke-width: 1;
+  stroke-opacity: 1;
+  stroke-dasharray: 5, 5;
+}
+
+.nvd3.nv-pie path {
+  stroke-opacity: 0;
+  transition: fill-opacity 250ms linear, stroke-width 250ms linear,
+    stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-pie .nv-pie-title {
+  font-size: 24px;
+  fill: rgb(19 196 249 / 59%);
+}
+
+.nvd3.nv-pie .nv-slice text {
+  stroke: #000;
+  stroke-width: 0;
+}
+
+.nvd3.nv-pie path {
+  stroke: #fff;
+  stroke-width: 1px;
+  stroke-opacity: 1;
+}
+
+.nvd3.nv-pie path {
+  fill-opacity: 0.7;
+}
+
+.nvd3.nv-pie .hover path {
+  fill-opacity: 1;
+}
+
+.nvd3.nv-pie .nv-label {
+  pointer-events: none;
+}
+
+.nvd3.nv-pie .nv-label rect {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+/* scatter */
+.nvd3 .nv-groups .nv-point.hover {
+  stroke-width: 20px;
+  stroke-opacity: 0.5;
+}
+
+.nvd3 .nv-scatter .nv-point.hover {
+  fill-opacity: 1;
+}
+
+.nv-noninteractive {
+  pointer-events: none;
+}
+
+.nv-distx,
+.nv-disty {
+  pointer-events: none;
+}
+
+/* sparkline */
+.nvd3.nv-sparkline path {
+  fill: none;
+}
+
+.nvd3.nv-sparklineplus g.nv-hoverValue {
+  pointer-events: none;
+}
+
+.nvd3.nv-sparklineplus .nv-hoverValue line {
+  stroke: #333;
+  stroke-width: 1.5px;
+}
+
+.nvd3.nv-sparklineplus,
+.nvd3.nv-sparklineplus g {
+  pointer-events: all;
+}
+
+.nvd3 .nv-hoverArea {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3.nv-sparklineplus .nv-xValue,
+.nvd3.nv-sparklineplus .nv-yValue {
+  stroke-width: 0;
+  font-size: 0.9em;
+  font-weight: normal;
+}
+
+.nvd3.nv-sparklineplus .nv-yValue {
+  stroke: #f66;
+}
+
+.nvd3.nv-sparklineplus .nv-maxValue {
+  stroke: #2ca02c;
+  fill: #2ca02c;
+}
+
+.nvd3.nv-sparklineplus .nv-minValue {
+  stroke: #d62728;
+  fill: #d62728;
+}
+
+.nvd3.nv-sparklineplus .nv-currentValue {
+  font-weight: bold;
+  font-size: 1.1em;
+}
+
+/* stacked area */
+.nvd3.nv-stackedarea path.nv-area {
+  fill-opacity: 0.7;
+  stroke-opacity: 0;
+  transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-stackedarea path.nv-area.hover {
+  fill-opacity: 0.9;
+}
+
+.nvd3.nv-stackedarea .nv-groups .nv-point {
+  stroke-opacity: 0;
+  fill-opacity: 0;
+}
+
+.nvtooltip {
+  position: absolute;
+  background-color: rgb(255 255 255 / 100%);
+  color: rgb(0 0 0 / 100%);
+  padding: 1px;
+  border: 1px solid rgb(0 0 0 / 20%);
+  z-index: 10000;
+  display: block;
+  font-family: Arial;
+  font-size: 13px;
+  text-align: left;
+  pointer-events: none;
+  white-space: nowrap;
+  -webkit-touch-callout: none;
+  user-select: none;
+}
+
+.nvtooltip {
+  background: rgb(255 255 255 / 80%);
+  border: 1px solid rgb(0 0 0 / 50%);
+  border-radius: 4px;
+}
+
+/* Give tooltips that old fade in transition by
+    putting a "with-transitions" class on the container div.
+*/
+.nvtooltip.with-transitions,
+.with-transitions .nvtooltip {
+  transition: opacity 50ms linear;
+  transition-delay: 200ms;
+}
+
+.nvtooltip.x-nvtooltip,
+.nvtooltip.y-nvtooltip {
+  padding: 8px;
+}
+
+.nvtooltip h3 {
+  margin: 0;
+  padding: 4px 14px;
+  line-height: 18px;
+  font-weight: normal;
+  background-color: rgb(247 247 247 / 75%);
+  color: rgb(0 0 0 / 100%);
+  text-align: center;
+  border-bottom: 1px solid #ebebeb;
+  border-radius: 5px 5px 0 0;
+}
+
+.nvtooltip p {
+  margin: 0;
+  padding: 5px 14px;
+  text-align: center;
+}
+
+.nvtooltip span {
+  display: inline-block;
+  margin: 2px 0;
+}
+
+.nvtooltip table {
+  margin: 6px;
+  border-spacing: 0;
+}
+
+.nvtooltip table td {
+  padding: 2px 9px 2px 0;
+  vertical-align: middle;
+}
+
+.nvtooltip table td.key {
+  font-weight: normal;
+}
+
+.nvtooltip table td.key.total {
+  font-weight: bold;
+}
+
+.nvtooltip table td.value {
+  text-align: right;
+  font-weight: bold;
+}
+
+.nvtooltip table td.percent {
+  color: darkgray;
+}
+
+.nvtooltip table tr.highlight td {
+  padding: 1px 9px 1px 0;
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+  border-top-style: solid;
+  border-top-width: 1px;
+}
+
+.nvtooltip table td.legend-color-guide div {
+  width: 8px;
+  height: 8px;
+  vertical-align: middle;
+}
+
+.nvtooltip table td.legend-color-guide div {
+  width: 12px;
+  height: 12px;
+  border: 1px solid #999;
+}
+
+.nvtooltip .footer {
+  padding: 3px;
+  text-align: center;
+}
+
+.nvtooltip-pending-removal {
+  pointer-events: none;
+  display: none;
+}
+
+/****
+Interactive Layer
+*/
+.nvd3 .nv-interactiveGuideLine {
+  pointer-events: none;
+}
+
+.nvd3 line.nv-guideline {
+  stroke: #ccc;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3_override.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3_override.scss
new file mode 100644
index 0000000000..72c3e2f99a
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/nvd3_override.scss
@@ -0,0 +1,13 @@
+.nvd3 {
+  .nv-axis {
+    .tick {
+      line {
+        opacity: 0;
+      }
+    }
+
+    path.domain {
+      opacity: 0;
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/app/publisher-hub.less b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/publisher-hub.scss
similarity index 52%
rename from services/web/frontend/stylesheets/app/publisher-hub.less
rename to services/web/frontend/stylesheets/bootstrap-5/modules/metrics/publisher-hub.scss
index 8d7e5ea7eb..f59b33e6ef 100644
--- a/services/web/frontend/stylesheets/app/publisher-hub.less
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/metrics/publisher-hub.scss
@@ -2,48 +2,66 @@
   .recent-activity {
     .hub-big-number {
       text-align: right;
-      padding-right: 15px;
+      padding-right: var(--spacing-06);
     }
   }
 
   #templates-container {
     width: 100%;
+
     tr {
-      border: 1px solid @ol-blue-gray-0;
+      border: 1px solid var(--bg-light-secondary);
     }
+
     td {
-      padding: 15px;
+      padding: var(--spacing-06);
     }
+
     td:last-child {
       text-align: right;
     }
+
     .title-cell {
       max-width: 300px;
     }
+
     .title-text {
       font-weight: bold;
     }
+
     .hub-big-number {
       width: 60%;
-      padding-right: 10px;
-      padding-top: 10px;
+      padding-right: var(--spacing-04);
+      padding-top: var(--spacing-04);
       text-align: right;
     }
+
     .hub-number-label,
     .since {
       width: 35%;
       float: right;
-      @media screen and (max-width: 940px) {
+
+      @include media-breakpoint-down(md) {
         float: none;
       }
     }
+
     .hub-long-big-number {
-      padding-right: 40px;
+      padding-right: var(--spacing-10);
     }
+
     .created-on {
-      color: @gray-light;
+      @include body-sm;
+
+      color: var(--content-disabled);
       font-style: italic;
-      font-size: 14px;
     }
   }
+
+  .overbox {
+    margin: 0;
+    padding: var(--spacing-10) var(--spacing-07);
+    background: var(--white);
+    border: 1px solid var(--content-disabled);
+  }
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/symbol-palette.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/symbol-palette.scss
index dd6d5f64f8..83a84769db 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/modules/symbol-palette.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/symbol-palette.scss
@@ -154,19 +154,18 @@
 
 .symbol-palette-close-button-outer {
   display: flex;
+  align-items: center;
+  margin-right: var(--spacing-05);
 }
 
 .symbol-palette-close-button {
   --bs-btn-close-color: var(--symbol-palette-color);
 
   [data-theme='default'] & {
+    --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
     filter: var(--bs-btn-close-white-filter);
   }
 
-  margin-top: var(--spacing-04);
-  margin-left: var(--spacing-05);
-  margin-right: var(--spacing-03);
-
   .symbol-palette-unavailable & {
     visibility: hidden;
   }
@@ -199,9 +198,5 @@
 
   .upgrade-benefits {
     column-count: 2;
-
-    li {
-      display: flex;
-    }
   }
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/modules/writefull.scss b/services/web/frontend/stylesheets/bootstrap-5/modules/writefull.scss
index bc4107e3ae..9d5afb20e6 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/modules/writefull.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/modules/writefull.scss
@@ -10,3 +10,27 @@
   max-width: 520px;
   text-align: left;
 }
+
+.feature-rebrand-promo-container {
+  z-index: 12;
+  position: absolute;
+  bottom: 15px;
+  right: 15px;
+  background: $bg-dark-primary;
+  color: $content-primary-dark;
+  max-width: 450px;
+}
+
+.feature-rebrand-promo-title-container {
+  display: flex;
+  justify-content: space-between;
+}
+
+.feature-rebrand-promo-title-text {
+  color: white;
+  font-size: 14px;
+}
+
+.feature-rebrand-promo-body {
+  color: white;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/admin/admin.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/admin/admin.scss
index e2c807e928..9e5b330d3e 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/admin/admin.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/admin/admin.scss
@@ -91,3 +91,12 @@
     color: var(--yellow-50);
   }
 }
+
+.admin-page summary {
+  // firefox does not show markers for block items
+  display: list-item;
+}
+
+.expiration-label {
+  vertical-align: super;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/all.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/all.scss
index fe2fbc7962..1efb360402 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/all.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/all.scss
@@ -36,6 +36,8 @@
 @import 'editor/table-generator-column-width-modal';
 @import 'editor/math-preview';
 @import 'editor/references-search';
+@import 'editor/editor-survey';
+@import 'error-pages';
 @import 'website-redesign';
 @import 'group-settings';
 @import 'templates-v2';
@@ -44,9 +46,12 @@
 @import 'login-register';
 @import 'login';
 @import 'register';
+@import 'plans';
 @import 'onboarding-confirm-email';
 @import 'secondary-confirm-email';
 @import 'onboarding';
 @import 'admin/admin';
 @import 'admin/project-url-lookup';
 @import 'add-secondary-email-prompt';
+@import 'try-premium';
+@import 'bonus';
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/auth.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/auth.scss
index d408ba28a9..9432892c1b 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/auth.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/auth.scss
@@ -23,6 +23,10 @@
   }
 }
 
+.auth-aux-new-password ~ .notification {
+  margin-top: var(--spacing-04);
+}
+
 .login-overleaf-logo-container {
   display: block;
   padding: var(--spacing-06);
@@ -31,6 +35,33 @@
   padding-bottom: var(--spacing-09);
 }
 
+.login-register-container {
+  max-width: 400px;
+  margin: 0 auto;
+  padding-bottom: 125px;
+}
+
+.login-register-error-container {
+  padding-bottom: var(--spacing-05);
+  text-align: left;
+}
+
+.login-register-card {
+  padding-top: 0;
+  padding-bottom: 0;
+  text-align: center;
+}
+
+.login-register-header {
+  padding-bottom: var(--spacing-07);
+  border-bottom: solid 1px var(--border-divider);
+}
+
+.login-register-header-heading {
+  margin: 0;
+  color: var(--content-secondary);
+}
+
 .login-register-hr-text-container {
   line-height: 1;
   position: relative;
@@ -54,6 +85,19 @@
   padding: 0 var(--spacing-05);
 }
 
+.login-register-text,
+.login-register-hr-text-container {
+  margin: 0;
+}
+
+.login-register-text {
+  padding-bottom: var(--spacing-08);
+
+  &:last-child {
+    padding-bottom: 0;
+  }
+}
+
 .sso-auth-login-container {
   max-width: 400px;
   margin: 0 auto;
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/bonus.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/bonus.scss
new file mode 100644
index 0000000000..2e6830bc8b
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/bonus.scss
@@ -0,0 +1,62 @@
+#bonus {
+  margin-top: var(--spacing-06);
+
+  p.thanks {
+    margin-top: var(--spacing-04);
+    text-align: center;
+  }
+
+  .number {
+    position: absolute;
+    margin-left: -13px;
+    width: 26px;
+    padding: var(--spacing-01) 0;
+    text-align: center;
+    background-color: #ddd;
+
+    &.active {
+      background-color: var(--bg-info-01);
+      color: var(--content-primary-dark);
+    }
+
+    border-radius: 3px;
+  }
+
+  .progress {
+    margin-top: var(--spacing-05);
+    margin-left: calc(var(--spacing-06) * -1);
+    margin-right: calc(var(--spacing-06) * -1);
+    height: 30px;
+  }
+
+  .perk {
+    position: absolute;
+    background-color: var(--bg-light-tertiary);
+    border-radius: var(--border-radius-base);
+    text-align: center;
+    padding: var(--spacing-02);
+    min-width: min-content;
+    width: 110px;
+    margin-left: calc(var(--spacing-11) * -1);
+    font-size: 14px;
+
+    &::before {
+      border-bottom: var(--spacing-04) solid var(--bg-light-tertiary);
+      border-left: var(--spacing-04) solid transparent;
+      border-right: var(--spacing-04) solid transparent;
+      content: '';
+      position: absolute;
+      left: var(--spacing-10);
+      top: calc(var(--spacing-04) * -1);
+    }
+
+    &.active {
+      color: white;
+      background-color: var(--bg-info-01);
+
+      &::before {
+        border-bottom: var(--spacing-04) solid var(--border-active);
+      }
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/chat.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/chat.scss
index faaab50b43..5d39e6b414 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/chat.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/chat.scss
@@ -37,7 +37,7 @@
 
   .ide-redesign-main {
     --chat-bg: var(--white);
-    --chat-color: var(--neutral-70);
+    --chat-color: var(--content-primary);
     --chat-instructions-color: var(--neutral-70);
     --chat-new-message-bg: var(--neutral-10);
     --chat-new-message-textarea-color: var(--neutral-90);
@@ -211,7 +211,8 @@
     border-radius: 50%;
     display: inline-block;
     line-height: 32px;
-    background-color: var(--bg-light-secondary);
+    background-color: var(--bg-secondary-themed);
+    color: var(--content-primary-themed);
 
     .material-symbols {
       font-size: 32px;
@@ -219,6 +220,7 @@
   }
 
   .chat-empty-state-title {
+    color: var(--content-primary-themed);
     font-size: var(--font-size-02);
     line-height: var(--line-height-02);
     font-weight: bold;
@@ -227,7 +229,7 @@
   .chat-empty-state-body {
     font-size: var(--font-size-02);
     line-height: var(--line-height-02);
-    color: var(--content-secondary);
+    color: var(--content-secondary-themed);
   }
 }
 
@@ -257,6 +259,11 @@
     text-transform: uppercase;
   }
 
+  .message-avatar .message-avatar-deleted-user-icon {
+    line-height: 24px;
+    font-size: 16px;
+  }
+
   .message-author,
   .message-container {
     flex: 1 1 auto;
@@ -269,6 +276,7 @@
   }
 
   .message-author {
+    color: var(--chat-message-name-color);
     font-size: var(--font-size-01);
     line-height: var(--line-height-01);
   }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/editor-survey.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/editor-survey.scss
new file mode 100644
index 0000000000..5041becc5a
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/editor-survey.scss
@@ -0,0 +1,73 @@
+.editor-survey-toast {
+  position: fixed;
+  bottom: 12px;
+  right: 12px;
+  z-index: 1000;
+}
+
+.editor-survey-question-toast {
+  .notification-icon {
+    display: none;
+  }
+}
+
+.editor-survey-question {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  font-size: var(--font-size-02);
+
+  .btn {
+    align-self: flex-end;
+  }
+
+  .form-group {
+    margin-bottom: 0;
+  }
+
+  .form-check {
+    display: flex;
+    flex-direction: column-reverse;
+    align-items: center;
+    padding-left: 0;
+    gap: 2px;
+  }
+
+  .form-check-input {
+    margin: 4px;
+  }
+}
+
+.editor-survey-question-top-line {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .btn-ghost {
+    --bs-btn-bg: transparent;
+
+    margin-left: 8px;
+  }
+}
+
+.editor-survey-question-label {
+  font-weight: 600;
+  margin-bottom: 8px;
+}
+
+.editor-survey-question-form {
+  display: flex;
+}
+
+.editor-survey-question-options {
+  display: flex;
+  gap: 32px;
+  margin: auto;
+}
+
+.editor-survey-option-labels {
+  display: flex;
+  justify-content: space-between;
+  color: var(--content-secondary);
+  margin-top: 4px;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/file-tree.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/file-tree.scss
index 39eb3f2d34..5caabc5889 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/file-tree.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/file-tree.scss
@@ -107,10 +107,6 @@
     &:active {
       color: var(--file-tree-expand-button-color);
     }
-
-    .material-symbols {
-      font-size: 16px;
-    }
   }
 
   .file-tree {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/history.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/history.scss
index b8e206b6ae..db59639cd1 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/history.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/history.scss
@@ -1,13 +1,104 @@
 :root {
+  --history-react-icon-color: var(--content-disabled);
   --history-react-header-bg: var(--bg-dark-secondary);
   --history-react-header-color: var(--content-primary-dark);
   --history-react-separator-color: var(--border-divider-dark);
+  --history-change-list-bg: var(--bg-light-primary);
+  --history-change-entry-color: var(--content-primary);
+  --history-change-entry-metadata-color: var(--content-secondary);
+  --history-change-list-divider: var(--border-divider);
+  --history-change-entry-hover-bg: var(--bg-light-secondary);
+  --history-loading-bg: var(--bg-light-secondary);
+  --history-change-entry-dropdown-button-bg: rgb(var(--bg-dark-primary) 0.08);
+  --history-change-entry-border-color: var(--green-50);
+  --history-change-entry-within-selected-bg: var(--bg-light-secondary);
+  --history-change-entry-within-selected-hover-bg: rgb($neutral-90, 8%);
+  --history-change-list-gradient: linear-gradient(black 35%, transparent);
+  --history-change-entry-selected-bg: var(--bg-accent-03);
+  --history-change-entry-selected-hover-bg: rgb($green-70, 16%);
 }
 
 @include theme('light') {
   --history-react-header-bg: var(--bg-light-primary);
   --history-react-header-color: var(--content-primary);
   --history-react-separator-color: var(--border-divider);
+
+  .ide-redesign-main {
+    --history-change-entry-within-selected-bg: var(--bg-light-secondary);
+    --history-change-entry-within-selected-hover-bg: rgb(var(--neutral-90) 8%);
+    --history-change-entry-selected-bg: var(--bg-accent-03);
+    --history-change-entry-selected-hover-bg: rgb(var(--green-70 0.16));
+  }
+}
+
+.ide-redesign-main {
+  --history-react-header-bg: var(--bg-primary-themed);
+  --history-react-header-color: var(--content-primary-themed);
+  --history-react-icon-color: var(--file-tree-item-color);
+  --history-loading-bg: var(--bg-secondary-themed);
+  --history-change-list-gradient: linear-gradient(black 35%, transparent);
+  --history-change-list-bg: var(--bg-primary-themed);
+  --history-change-list-divider: var(--border-divider-themed);
+  --history-change-entry-metadata-color: var(--content-secondary-themed);
+  --history-change-entry-color: var(--content-primary-themed);
+  --history-change-entry-hover-bg: var(--bg-secondary-themed);
+  --history-change-entry-border-color: var(--green-50);
+  --history-change-entry-dropdown-button-bg: rgb(var(--bg-dark-primary) 0.08);
+
+  // Dark mode specific variables
+  --history-change-entry-within-selected-bg: var(--neutral-80);
+  --history-change-entry-within-selected-hover-bg: rgb(var(--white) 0.08);
+  --history-change-entry-selected-bg: var(--green-70);
+  --history-change-entry-selected-hover-bg: rgb(var(--green-60) 0.08);
+
+  .history-file-tree {
+    ul.history-file-tree-list {
+      padding: var(--spacing-02);
+
+      .history-file-tree-item > ul,
+      ul[role='tree'] {
+        border-left: 1px solid
+          color-mix(in srgb, var(--border-primary-themed) 24%, transparent);
+        margin-left: 14px !important;
+        margin-top: 0;
+      }
+
+      li {
+        padding: var(--spacing-02);
+        padding-right: 0;
+        margin-left: 0;
+      }
+
+      .history-file-tree-item {
+        border-radius: var(--border-radius-base);
+
+        .history-file-tree-item-name-wrapper {
+          .history-file-tree-item-badge {
+            margin-right: var(--spacing-02);
+          }
+        }
+
+        &::before {
+          display: none;
+        }
+
+        .material-symbols {
+          &.file-tree-expand-icon {
+            margin-left: 0;
+            vertical-align: middle;
+          }
+
+          &.file-tree-icon {
+            margin-left: 0;
+          }
+        }
+      }
+    }
+  }
+
+  ul[role='tree'].history-file-tree-list-inner {
+    padding-left: 10px;
+  }
 }
 
 history-root {
@@ -27,7 +118,7 @@ history-root {
   display: flex;
   justify-content: center;
   height: 100%;
-  background-color: var(--bg-light-primary);
+  background-color: var(--history-change-list-bg);
 
   .history-header {
     @include body-sm;
@@ -107,7 +198,7 @@ history-root {
   }
 
   .history-version-day {
-    background-color: white;
+    background-color: var(--history-change-list-bg);
     position: sticky;
     z-index: 1;
     top: 0;
@@ -127,47 +218,56 @@ history-root {
       cursor: pointer;
 
       &:hover {
-        background-color: var(--bg-light-secondary);
+        background-color: var(--history-change-entry-hover-bg);
       }
     }
 
     &.history-version-selected {
-      background-color: var(--bg-accent-03);
-      border-left: var(--spacing-02) solid var(--green-50);
+      background-color: var(--history-change-entry-selected-bg);
+      border-left: var(--spacing-02) solid
+        var(--history-change-entry-border-color);
       padding-left: calc(
         var(--history-change-list-padding) - var(--spacing-02)
       );
     }
 
     &.history-version-selected.history-version-selectable:hover {
-      background-color: rgb($green-70, 16%);
-      border-left: var(--spacing-02) solid var(--green-50);
+      background-color: var(--history-change-entry-selected-hover-bg);
+      border-left: var(--spacing-02) solid
+        var(--history-change-entry-border-color);
     }
 
     &.history-version-within-selected {
-      background-color: var(--bg-light-secondary);
-      border-left: var(--spacing-02) solid var(--green-50);
+      background-color: var(--history-change-entry-within-selected-bg);
+      border-left: var(--spacing-02) solid
+        var(--history-change-entry-border-color);
     }
 
     &.history-version-within-selected:hover {
-      background-color: rgb($neutral-90, 8%);
+      background-color: var(--history-change-entry-within-selected-hover-bg);
     }
   }
 
+  .history-version-main-details {
+    color: var(--history-change-entry-color);
+  }
+
   .version-element-within-selected {
-    background-color: var(--bg-light-secondary);
-    border-left: var(--spacing-02) solid var(--green-50);
+    background-color: var(--history-change-entry-within-selected-bg);
+    border-left: var(--spacing-02) solid
+      var(--history-change-entry-border-color);
   }
 
   .version-element-selected {
-    background-color: var(--bg-accent-03);
-    border-left: var(--spacing-02) solid var(--green-50);
+    background-color: var(--history-change-entry-selected-bg);
+    border-left: var(--spacing-02) solid
+      var(--history-change-entry-border-color);
   }
 
   .history-version-metadata-time {
     display: block;
     margin-bottom: var(--spacing-02);
-    color: var(--content-primary);
+    color: var(--history-change-entry-color);
 
     &:last-child {
       margin-bottom: initial;
@@ -222,7 +322,7 @@ history-root {
   .history-version-metadata-users,
   .history-version-origin,
   .history-version-saved-by {
-    color: var(--content-secondary);
+    color: var(--history-change-entry-metadata-color);
   }
 
   .history-version-change-action {
@@ -230,7 +330,7 @@ history-root {
   }
 
   .history-version-change-doc {
-    color: var(--content-primary);
+    color: var(--history-change-entry-color);
     overflow-wrap: anywhere;
     white-space: pre-wrap;
   }
@@ -241,7 +341,7 @@ history-root {
 
   .history-version-divider {
     margin: 0;
-    border-color: var(--border-divider);
+    border-color: var(--history-change-list-divider);
   }
 
   .history-version-badge {
@@ -272,7 +372,7 @@ history-root {
     position: sticky;
     bottom: 0;
     padding: var(--spacing-05) 0;
-    background-color: var(--bg-light-secondary);
+    background-color: var(--history-loading-bg);
     text-align: center;
   }
 
@@ -284,7 +384,7 @@ history-root {
 
   .dropdown.open {
     .history-version-dropdown-menu-btn {
-      background-color: rgb(var(--bg-dark-primary) 0.08);
+      background-color: var(--history-change-entry-dropdown-button-bg);
       box-shadow: initial;
     }
   }
@@ -294,6 +394,7 @@ history-root {
     @include reset-button;
     @include action-button;
 
+    color: var(--history-change-entry-color);
     padding: 0;
     width: 30px;
     height: 30px;
@@ -340,7 +441,7 @@ history-root {
   .history-version-faded .history-version-details {
     max-height: 6em;
 
-    @include mask-image(linear-gradient(black 35%, transparent));
+    @include mask-image(var(--history-change-list-gradient));
 
     overflow: hidden;
   }
@@ -410,7 +511,7 @@ history-root {
 }
 
 .history-dropdown-icon {
-  color: var(--content-primary);
+  color: var(--history-change-entry-color);
 }
 
 .history-dropdown-icon-inverted {
@@ -506,7 +607,7 @@ history-root {
       }
 
       .material-symbols {
-        color: var(--content-disabled);
+        color: var(--history-react-icon-color);
 
         &.file-tree-icon {
           margin-right: var(--spacing-02);
@@ -545,3 +646,7 @@ history-root {
 .history-error {
   padding: var(--spacing-06);
 }
+
+.doc-container {
+  background: var(--bg-light-primary);
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide-redesign-switcher-modal.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide-redesign-switcher-modal.scss
index ba2f2aa49d..bb9c930848 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide-redesign-switcher-modal.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide-redesign-switcher-modal.scss
@@ -12,6 +12,22 @@
     border: 1px solid var(--border-divider);
     padding: var(--spacing-05);
     margin: var(--spacing-05) 0;
+
+    hr {
+      margin: var(--spacing-04) 0;
+    }
+
+    h4 {
+      margin-top: 0;
+    }
+
+    ul {
+      margin-bottom: 0;
+
+      li:not(:last-child) {
+        margin-bottom: var(--spacing-04);
+      }
+    }
   }
 
   .ide-redesign-switcher-modal-leave-text {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide.scss
index 7512424a4a..a60298a53f 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/ide.scss
@@ -61,6 +61,25 @@ $editor-toggler-bg-dark-color: color.adjust(
       display: none !important;
     }
   }
+
+  .synctex-controls {
+    background-color: var(--bg-primary-themed);
+    border-radius: var(--border-radius-full);
+    border: 1px solid var(--border-divider-themed);
+    top: 96px;
+  }
+
+  .synctex-control:not(.detach-synctex-control) {
+    margin-bottom: 0;
+    background-color: transparent;
+    color: var(--content-primary-themed);
+
+    &:hover,
+    &:active,
+    &:focus {
+      background-color: var(--bg-tertiary-themed);
+    }
+  }
 }
 
 .global-alerts {
@@ -229,6 +248,15 @@ $editor-toggler-bg-dark-color: color.adjust(
   top: 50%;
   background-color: var(--editor-toggler-bg-color);
 
+  .material-symbols {
+    font-size: var(--font-size-02);
+    -moz-osx-font-smoothing: grayscale;
+    font-weight: bold;
+    color: var(--white);
+    user-select: none;
+    pointer-events: none;
+  }
+
   &:hover,
   &:focus {
     outline: none;
@@ -243,37 +271,11 @@ $editor-toggler-bg-dark-color: color.adjust(
     inset: 0 -3px;
   }
 
-  &::after {
-    font-family: FontAwesome; /* stylelint-disable-line font-family-no-missing-generic-family-keyword */
-    -moz-osx-font-smoothing: grayscale;
-    font-size: 65%;
-    font-weight: bold;
-    color: var(--white);
-    user-select: none;
-    pointer-events: none;
-  }
-
   &:hover {
     background-color: var(--bg-accent-01);
   }
 }
 
-.custom-toggler-east::after {
-  content: '\f105';
-}
-
-.custom-toggler-west::after {
-  content: '\f104';
-}
-
-.custom-toggler-closed.custom-toggler-east::after {
-  content: '\f104';
-}
-
-.custom-toggler-closed.custom-toggler-west::after {
-  content: '\f105';
-}
-
 .vertical-resize-handle {
   height: 6px;
   background-color: var(--editor-resizer-bg-color);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss
index e40c6159f6..044a4ecefd 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/left-menu.scss
@@ -129,20 +129,6 @@
     }
   }
 
-  .left-menu-setting-position {
-    position: relative;
-
-    .left-menu-setting {
-      margin-top: 0 !important;
-    }
-
-    .left-menu-setting-icon {
-      position: absolute;
-      right: 65%;
-      top: 25%;
-    }
-  }
-
   .left-menu-setting {
     padding: 0 var(--spacing-02);
     display: flex;
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/logs.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/logs.scss
index 4e517f9818..4f2d4146bf 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/logs.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/logs.scss
@@ -2,15 +2,194 @@
   --logs-pane-bg: var(--bg-dark-secondary);
 }
 
-.ide-redesign-main {
-  --logs-pane-bg: var(--bg-dark-primary);
-}
-
 @include theme('light') {
   --logs-pane-bg: var(--bg-light-secondary);
+}
 
-  .ide-redesign-main {
-    --logs-pane-bg: #fff;
+.ide-redesign-main {
+  --logs-pane-bg: var(--bg-primary-themed);
+
+  .error-logs-panel {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+  }
+
+  // TODO $ide-redesign-cleanup: Unnest everything from inside .error-logs
+  //  when we remove the styles for the old pane
+  .error-logs {
+    --logs-pane-bg: var(--bg-secondary-themed);
+
+    overflow-y: auto;
+    background-color: var(--logs-pane-bg);
+    flex: 1;
+
+    .logs-pane-content {
+      display: flex;
+      flex-direction: column;
+      padding: var(--spacing-02);
+      gap: var(--spacing-02);
+    }
+
+    .icon-button,
+    .icon-button-small {
+      @include ol-button-variant(
+        var(--content-secondary-themed),
+        transparent,
+        transparent,
+        var(--bg-secondary-themed),
+        transparent,
+        true
+      );
+    }
+
+    .log-entry-content {
+      --bs-code-color: var(--content-secondary-themed);
+
+      color: var(--content-primary-themed);
+      background-color: var(--bg-primary-themed);
+      padding: 0;
+    }
+
+    .log-entry-content-raw {
+      color: var(--content-primary-themed);
+      background-color: var(--bg-secondary-themed);
+    }
+
+    .log-entry-content-raw-container {
+      background-color: var(--bg-secondary-themed);
+    }
+
+    .log-entry {
+      background-color: var(--bg-primary-themed);
+      width: 100%;
+      border-radius: var(--border-radius-base);
+      padding: var(--spacing-04);
+
+      .horizontal-divider {
+        margin: var(--spacing-04) 0;
+        border-top: 1px solid var(--border-divider-themed);
+      }
+    }
+
+    .log-entry-header-card {
+      background-color: var(--bg-primary-themed);
+      width: 100%;
+      display: flex;
+      align-items: center;
+      border: none;
+      gap: var(--spacing-03);
+    }
+
+    .log-entry-header-button {
+      all: unset;
+      display: flex;
+      gap: var(--spacing-03);
+      align-items: center;
+      flex: 1;
+      border-radius: var(--border-radius-base);
+      padding: var(--spacing-02) var(--spacing-03) var(--spacing-02) 0;
+      overflow: hidden;
+      user-select: text;
+
+      &:hover {
+        cursor: pointer;
+      }
+
+      &:hover,
+      :focus,
+      :active {
+        background-color: var(--bg-secondary-themed);
+      }
+    }
+
+    .log-entry-header-content {
+      display: flex;
+      flex-direction: column;
+      text-align: left;
+      gap: var(--spacing-02);
+      flex: 1;
+      overflow: hidden;
+      font-weight: normal;
+    }
+
+    .log-entry-header-text {
+      font-weight: 600;
+      font-size: var(--font-size-02);
+      line-height: var(--line-height-02);
+      margin-bottom: 0;
+    }
+
+    .log-entry-header-text-error {
+      color: var(--content-danger-themed);
+    }
+
+    .log-entry-header-text-warning {
+      color: var(--content-warning-themed);
+    }
+
+    .log-entry-header-text-info {
+      color: var(--content-info-themed);
+    }
+
+    .log-entry-header-text-success {
+      color: var(--content-positive-themed);
+    }
+
+    .log-entry-header-text-raw {
+      color: var(--content-primary-themed);
+    }
+
+    .log-entry-location {
+      white-space: nowrap;
+      direction: rtl;
+      text-overflow: ellipsis;
+      overflow: hidden;
+      font-size: var(--font-size-01);
+      line-height: var(--line-height-01);
+      color: var(--content-secondary-themed);
+    }
+
+    .log-entry-header-actions {
+      display: flex;
+      gap: var(--spacing-03);
+    }
+
+    .log-entry-content-button-container {
+      background-image: linear-gradient(
+        0deg,
+        var(--bg-secondary-themed) 0%,
+        transparent 100%
+      );
+    }
+  }
+
+  .error-logs-tabs {
+    display: flex;
+  }
+
+  .error-logs-tab-header {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-04);
+    color: var(--content-secondary-themed);
+    padding: var(--spacing-03) var(--spacing-04);
+    font-size: var(--font-size-02);
+    border-bottom: 3px solid transparent;
+
+    &[aria-selected='true'] {
+      color: var(--content-primary-themed);
+      border-bottom: 3px solid var(--bg-accent-01);
+    }
+  }
+
+  .error-logs-tab-count {
+    background-color: var(--bg-secondary-themed);
+    border-radius: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 var(--spacing-02);
   }
 }
 
@@ -148,53 +327,53 @@
     text-overflow: ellipsis;
     overflow: hidden;
   }
+}
 
-  .log-entry-content {
-    &:empty {
-      display: none;
-    }
-
-    background-color: var(--bg-light-primary);
-    color: var(--content-primary);
-    padding: var(--spacing-04);
+.log-entry-content {
+  &:empty {
+    display: none;
   }
 
-  .log-entry-content-raw {
-    @include body-xs;
+  background-color: var(--bg-light-primary);
+  color: var(--content-primary);
+  padding: var(--spacing-04);
+}
 
-    color: var(--content-secondary);
-    padding: var(--spacing-03);
-    margin: 0;
-    white-space: pre-wrap;
-  }
+.log-entry-content-raw {
+  @include body-xs;
 
-  .log-entry-content-button-container {
-    position: relative;
-    height: 40px;
-    margin-top: 0;
-    transition:
-      margin 0.15s ease-in-out,
-      opacity 0.15s ease-in-out;
-    padding-bottom: var(--spacing-04);
-    text-align: center;
-    background-image: linear-gradient(
-      0deg,
-      var(--bg-light-tertiary) 0%,
-      transparent 100%
-    );
-    border-radius: 0 0 var(--border-radius-base) var(--border-radius-base);
-  }
+  color: var(--content-secondary);
+  padding: var(--spacing-03);
+  margin: 0;
+  white-space: pre-wrap;
+}
 
-  .log-entry-content-button-container-collapsed {
-    margin-top: -40px;
-  }
+.log-entry-content-button-container {
+  position: relative;
+  height: 40px;
+  margin-top: 0;
+  transition:
+    margin 0.15s ease-in-out,
+    opacity 0.15s ease-in-out;
+  padding-bottom: var(--spacing-04);
+  text-align: center;
+  background-image: linear-gradient(
+    0deg,
+    var(--bg-light-tertiary) 0%,
+    transparent 100%
+  );
+  border-radius: 0 0 var(--border-radius-base) var(--border-radius-base);
+}
 
-  .log-entry-content-raw-container {
-    background-color: var(--bg-light-tertiary);
-    border-radius: var(--border-radius-base);
-    overflow: hidden;
-    margin-top: var(--spacing-03);
-  }
+.log-entry-content-button-container-collapsed {
+  margin-top: -40px;
+}
+
+.log-entry-content-raw-container {
+  background-color: var(--bg-light-tertiary);
+  border-radius: var(--border-radius-base);
+  overflow: hidden;
+  margin-top: var(--spacing-03);
 }
 
 .log-entry-formatted-content,
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/online-users.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/online-users.scss
index 52265c6e97..0ae3eff278 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/online-users.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/online-users.scss
@@ -1,9 +1,15 @@
 :root {
   --toolbar-btn-color: var(--white);
+  --online-users-border-color: var(--bg-dark-primary);
+  --online-users-text-color: var(--content-primary);
+  --online-users-overflow-button-background-color: var(--bg-light-secondary);
 }
 
 @include theme('light') {
   --toolbar-btn-color: var(--neutral-70);
+  --online-users-border-color: var(--bg-light-primary);
+  --online-users-text-color: var(--content-primary);
+  --online-users-overflow-button-background-color: var(--bg-light-secondary);
 }
 
 .online-users {
@@ -35,3 +41,95 @@
     align-items: center;
   }
 }
+
+.online-users-row {
+  // Keep in sync with the MAX_USER_CIRCLES_DISPLAYED js constant
+  $max-user-circles-displayed: 5;
+
+  --online-users-circle-size: 24px;
+  --online-users-border-size: 1px;
+  --online-users-overlap: 8px;
+  --online-users-circle-padding: var(--spacing-01);
+
+  .online-user-overflow-dropdown {
+    --online-users-border-color: transparent;
+  }
+
+  display: flex;
+  align-items: center;
+  color: var(--online-users-text-color);
+
+  .online-users-row-button {
+    padding: 0;
+    margin: 0;
+    background: none;
+    border: none;
+    color: var(--online-users-text-color);
+    min-width: var(--online-users-circle-size);
+    height: var(--online-users-circle-size);
+    display: block;
+    font-weight: var(--font-weight-regular);
+
+    &.dropdown-toggle::after {
+      display: none;
+    }
+
+    &:not(:last-child, .online-user-overflow-toggle) {
+      margin-right: calc(
+        var(--online-users-overlap) * -1 + var(--online-users-border-size)
+      );
+    }
+
+    @for $i from 1 through $max-user-circles-displayed {
+      &:nth-child(#{$i}):not(:hover):not(.online-user-overflow-toggle) {
+        z-index: $i;
+      }
+    }
+
+    &:hover {
+      z-index: $max-user-circles-displayed + 2;
+    }
+  }
+
+  .online-user-overflow-toggle {
+    &:not(:hover) {
+      z-index: $max-user-circles-displayed + 1;
+    }
+
+    &:hover,
+    &:active,
+    & {
+      background: none;
+    }
+
+    .online-user-circle {
+      background-color: var(--online-users-overflow-button-background-color);
+      color: var(--online-users-text-color);
+    }
+  }
+
+  .online-user-circle {
+    padding: var(--online-users-circle-padding);
+    border-radius: 50%;
+    min-width: var(--online-users-circle-size);
+    height: var(--online-users-circle-size);
+    line-height: calc(
+      var(--online-users-circle-size) - 2 * var(--online-users-border-size) -
+        2 * var(--online-users-circle-padding)
+    );
+    font-size: var(--font-size-01);
+    text-align: center;
+    border: var(--online-users-border-size) solid
+      var(--online-users-border-color);
+    box-sizing: border-box;
+    display: inline-block;
+  }
+
+  .online-user-circle-light-font {
+    color: var(--content-primary-dark);
+  }
+
+  .online-user-circle-dark-font {
+    color: var(--content-primary);
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/outline.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/outline.scss
index dc83a234bc..f915f16994 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/outline.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/outline.scss
@@ -111,12 +111,14 @@
   }
 
   .outline-item-no-children {
-    padding-left: 0;
+    padding-left: 26px;
   }
 
   .outline-item-link {
     flex-grow: 1;
     padding: var(--spacing-02);
+    font-size: var(--font-size-02);
+    line-height: var(--line-height-02);
   }
 }
 
@@ -281,7 +283,6 @@
   font-size: inherit;
   vertical-align: inherit;
   position: relative;
-  z-index: 1;
   color: var(--outline-item-carat-color);
   margin-right: calc(var(--spacing-03) * -1);
   border-radius: var(--border-radius-base);
@@ -304,7 +305,6 @@
   background-color: transparent;
   border: 0;
   position: relative;
-  z-index: 1;
   padding: 0 var(--spacing-03);
   line-height: var(--spacing-08);
   border-radius: var(--border-radius-base);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf-error-state.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf-error-state.scss
index c1da6ab431..aee036f775 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf-error-state.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf-error-state.scss
@@ -33,9 +33,7 @@
   padding: 0 var(--spacing-09) var(--spacing-09) var(--spacing-09);
 }
 
-.pdf-error-state-warning-icon {
-  background-color: var(--bg-danger-03);
-  color: var(--content-danger);
+.pdf-error-state-icon {
   width: 80px;
   height: 80px;
   display: flex;
@@ -43,6 +41,15 @@
   justify-content: center;
   border-radius: 100%;
 
+  .material-symbols {
+    font-size: 80px;
+  }
+}
+
+.pdf-error-state-warning-icon {
+  background-color: var(--bg-danger-03);
+  color: var(--content-danger);
+
   .material-symbols {
     font-size: 32px;
   }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf.scss
index 8a8fa49f97..57d467eccc 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/pdf.scss
@@ -12,6 +12,70 @@
   }
 }
 
+.ide-redesign-main {
+  --pdf-bg: var(--bg-dark-secondary);
+
+  .pdf-viewer {
+    .pdfjs-viewer {
+      .page {
+        box-shadow:
+          0 5px 5px 0 #23282f0d,
+          0 3px 14px 0 #23282f08,
+          0 8px 10px 0 #23282f14;
+      }
+    }
+  }
+
+  .toolbar-pdf-left {
+    .compile-button-group {
+      height: 24px;
+      border-radius: 12px;
+      margin-left: var(--spacing-02);
+    }
+
+    .dropdown > .compile-button {
+      border-top-left-radius: 12px;
+      border-bottom-left-radius: 12px;
+      font-size: var(--font-size-02);
+    }
+
+    .dropdown > .compile-dropdown-toggle {
+      width: 26px;
+      padding: var(--spacing-01);
+    }
+  }
+
+  .pdf-code-check-failed-banner-container {
+    position: absolute;
+    top: calc(var(--toolbar-small-height) + var(--spacing-04));
+    left: 0;
+    right: 0;
+    z-index: 1;
+    display: flex;
+    justify-content: center;
+    padding: 0 var(--spacing-06);
+  }
+
+  .pdf-code-check-failed-banner {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-02);
+    background-color: var(--bg-light-primary);
+    color: var(--content-primary);
+    border: 1px solid var(--border-divider);
+    padding: var(--spacing-02) var(--spacing-03) var(--spacing-02)
+      var(--spacing-02);
+    border-radius: var(--border-radius-full);
+    box-shadow: 0 2px 4px 0 #1e253029;
+  }
+
+  .synctex-control {
+    .synctex-control-icon {
+      font-weight: normal;
+    }
+  }
+}
+
 .pdf .toolbar.toolbar-pdf {
   @include toolbar-sm-height;
   @include toolbar-alt-bg;
@@ -158,21 +222,6 @@
   top: var(--toolbar-small-height);
 }
 
-.ide-redesign-main {
-  --pdf-bg: var(--bg-dark-secondary);
-
-  .pdf-viewer {
-    .pdfjs-viewer {
-      .page {
-        box-shadow:
-          0 5px 5px 0 #23282f0d,
-          0 3px 14px 0 #23282f08,
-          0 8px 10px 0 #23282f14;
-      }
-    }
-  }
-}
-
 .pdf-viewer {
   isolation: isolate;
 
@@ -236,6 +285,18 @@
       outline: none;
     }
 
+    /* Avoid slowdown in Safari when text layers are reset on selection change */
+    /* stylelint-disable-next-line selector-class-pattern */
+    .textLayer {
+      will-change: transform;
+    }
+
+    /* Avoid multiple small layers within annotation layer */
+    /* stylelint-disable-next-line selector-class-pattern */
+    .annotationLayer {
+      will-change: transform;
+    }
+
     /* Avoids https://github.com/mozilla/pdf.js/issues/13840 in Chrome */
     /* stylelint-disable-next-line selector-class-pattern */
     .textLayer br::selection {
@@ -318,7 +379,6 @@
   gap: var(--spacing-02);
 
   input {
-    color: initial;
     border: 1px solid var(--neutral-60);
     width: 32px;
     height: 24px;
@@ -443,3 +503,8 @@
   top: var(--spacing-10);
   z-index: 1;
 }
+
+.synctex-error-toast-content {
+  display: flex;
+  gap: 20px;
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/rail.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/rail.scss
index 6118473ef5..46f30a3028 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/rail.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/rail.scss
@@ -1,23 +1,19 @@
-:root {
-  --ide-rail-background: var(--bg-dark-primary);
-  --ide-rail-color: var(--content-primary-dark);
-  --ide-rail-link-background: var(--bg-dark-primary);
+body {
+  --ide-rail-background: var(--bg-primary-themed);
+  --ide-rail-color: var(--content-primary-themed);
+  --ide-rail-link-hover-color: var(--content-primary-themed);
+  --ide-rail-link-background: var(--bg-primary-themed);
+  --ide-rail-link-hover-background: var(--bg-secondary-themed);
+  --ide-rail-border-colour: var(--border-divider-themed);
+  --ide-rail-header-subdued-button-color: var(--content-primary-themed);
+  --ide-rail-header-subdued-button-hover-background: var(--bg-tertiary-themed);
   --ide-rail-link-active-color: var(--green-10);
   --ide-rail-link-active-background: var(--green-70);
-  --ide-rail-border-colour: var(--border-divider-dark);
-  --ide-rail-header-subdued-button-color: var(--content-primary-dark);
-  --ide-rail-header-subdued-button-hover-background: var(--bg-dark-tertiary);
 }
 
 @include theme('light') {
-  --ide-rail-background: #fff;
-  --ide-rail-color: var(--content-primary);
-  --ide-rail-link-background: #fff;
   --ide-rail-link-active-color: var(--green-70);
   --ide-rail-link-active-background: var(--bg-accent-03);
-  --ide-rail-border-colour: var(--border-divider);
-  --ide-rail-header-subdued-button-color: var(--content-primary);
-  --ide-rail-header-subdued-button-hover-background: var(--bg-light-tertiary);
 }
 
 .rail-panel-header {
@@ -39,6 +35,12 @@
   }
 }
 
+.rail-panel-header-actions {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-01);
+}
+
 .rail-panel-title {
   font-size: var(--font-size-02);
   color: var(--ide-rail-color);
@@ -61,14 +63,26 @@
   color: var(--ide-rail-color);
   background-color: var(--ide-rail-link-background);
   position: relative;
-  overflow-y: hidden;
+  overflow: visible;
+
+  &.disabled {
+    color: var(--content-disabled-themed);
+  }
 
-  &:hover,
   &:visited,
   &:focus {
     color: var(--ide-rail-color);
   }
 
+  &:focus-visible {
+    background-color: transparent;
+  }
+
+  &:hover {
+    color: var(--ide-rail-link-hover-color);
+    background-color: var(--ide-rail-link-hover-background);
+  }
+
   .ide-rail-tab-link-icon {
     line-height: 32px;
     font-size: 20px;
@@ -81,23 +95,27 @@
     &::after {
       $indicator-height: 3px;
 
-      border-radius: 12px;
+      border-top-left-radius: 12px;
+      border-top-right-radius: 12px;
       content: '';
       position: absolute;
-      bottom: -$indicator-height;
+      bottom: 0;
       left: 4px;
       box-sizing: border-box;
       width: 24px;
-      height: $indicator-height * 2;
-      border: $indicator-height solid var(--ide-rail-link-active-color);
+      height: $indicator-height;
       background-color: var(--ide-rail-link-active-color);
     }
   }
 
   .badge {
     position: absolute;
-    top: 0;
-    right: 0;
+    top: -4px;
+    right: -4px;
+    pointer-events: none;
+    z-index: 10;
+    padding: var(--spacing-00) var(--spacing-02);
+    border-radius: var(--border-radius-full);
   }
 }
 
@@ -106,6 +124,7 @@
   padding: var(--spacing-02);
   background: var(--ide-rail-background);
   border-right: 1px solid var(--ide-rail-border-colour);
+  width: 40px;
 }
 
 .ide-rail-content {
@@ -118,12 +137,12 @@
   .tab-pane {
     height: 100%;
   }
+}
 
-  .tab-content {
-    height: 100%;
-    width: 100%;
-    position: relative;
-  }
+.ide-rail-tab-content {
+  height: 100%;
+  width: 100%;
+  position: relative;
 }
 
 .ide-rail-tabs-nav {
@@ -131,7 +150,7 @@
   display: flex;
   flex-direction: column;
   gap: var(--spacing-02);
-  width: 40px;
+  padding-bottom: var(--spacing-04);
 }
 
 .ide-rail-tab-dropdown {
@@ -141,3 +160,13 @@
     display: none;
   }
 }
+
+.new-error-logs-promo {
+  display: flex;
+  gap: var(--spacing-04);
+  font-weight: bold;
+  font-size: var(--font-size-02);
+  line-height: var(--line-height-02);
+  background-color: black;
+  border-radius: var(--border-radius-base);
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/review-panel-new.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/review-panel-new.scss
index ec766bd8d6..1b950400a5 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/review-panel-new.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/review-panel-new.scss
@@ -2,13 +2,76 @@
 
 $rp-border-grey: #d9d9d9;
 $rp-type-blue: #6b7797;
-$rp-type-darkgrey: #3f3f3f;
 
 :root {
   --rp-base-font-size: var(--font-size-01);
   --rp-border-grey: #{$rp-border-grey};
   --rp-type-blue: #{$rp-type-blue};
-  --rp-type-darkgrey: #{$rp-type-darkgrey};
+  --review-panel-bg-color: var(--bg-light-secondary);
+  --review-panel-color: var(--content-primary);
+  --review-panel-color-secondary: var(--content-secondary);
+  --review-panel-header-bg-color: var(--bg-light-primary);
+  --review-panel-footer-bg-color: var(--bg-light-primary);
+  --review-panel-entry-bg-color: var(--bg-light-primary);
+  --review-panel-empty-state-bg-color: var(--bg-light-primary);
+  --review-panel-button-hover-bg-color: var(--bg-light-tertiary);
+  --review-panel-border-color: var(--border-divider);
+  --review-panel-width: 230px;
+  --review-panel-width-mini: 24px;
+
+  @include theme('default') {
+    .ide-redesign-main {
+      --review-panel-bg-color: var(--bg-dark-secondary);
+      --review-panel-color: var(--content-primary-dark);
+      --review-panel-color-secondary: var(--content-secondary-dark);
+      --review-panel-header-bg-color: var(--bg-dark-primary);
+      --review-panel-footer-bg-color: var(--bg-dark-primary);
+      --review-panel-entry-bg-color: var(--bg-dark-primary);
+      --review-panel-empty-state-bg-color: var(--bg-dark-primary);
+      --review-panel-button-hover-bg-color: var(--bg-dark-tertiary);
+      --review-panel-border-color: var(--border-divider-dark);
+    }
+  }
+}
+
+.ide-redesign-main {
+  .review-panel-container {
+    order: -1;
+  }
+
+  .review-panel-inner {
+    border-left: none;
+    border-right: 1px solid var(--border-divider-themed);
+  }
+
+  .review-panel-header {
+    border-bottom: none;
+    flex: 0 0 var(--review-panel-width);
+  }
+
+  .review-panel-more-comments-button-container {
+    &.upwards {
+      top: calc(var(--review-panel-top) + 16px);
+    }
+  }
+
+  .review-panel-mini {
+    // This needs to have a higher z-index than the gutter
+    // so that the comment/change hover previews appear in
+    // front of the gutter
+    z-index: 201;
+
+    .review-panel-entry-hover {
+      .review-panel-entry-content {
+        left: auto;
+        right: -200px;
+      }
+    }
+  }
+
+  .review-panel-overview {
+    top: 0;
+  }
 }
 
 .review-panel-container {
@@ -20,9 +83,9 @@ $rp-type-darkgrey: #3f3f3f;
 .review-panel-inner {
   z-index: 6;
   flex-shrink: 0;
-  background-color: var(--neutral-10);
-  border-left: 1px solid var(--border-divider);
-  color: var(--content-primary);
+  background-color: var(--review-panel-bg-color);
+  border-left: 1px solid var(--review-panel-border-color);
+  color: var(--review-panel-color);
   font-family: $font-family-base;
   line-height: $line-height-base;
   font-size: var(--font-size-01);
@@ -37,9 +100,9 @@ $rp-type-darkgrey: #3f3f3f;
 }
 
 .review-panel-entry {
-  background-color: var(--white);
+  background-color: var(--review-panel-entry-bg-color);
   border-radius: var(--border-radius-base);
-  border: 1px solid var(--neutral-20);
+  border: 1px solid var(--review-panel-border-color);
   padding: var(--spacing-04);
   width: calc(100% - var(--spacing-04));
   margin-left: var(--spacing-02);
@@ -85,7 +148,7 @@ $rp-type-darkgrey: #3f3f3f;
   margin-bottom: var(--spacing-01);
 
   .review-panel-entry-user {
-    color: $content-primary;
+    color: var(--review-panel-color);
     font-size: 110%;
     max-width: 150px;
     white-space: nowrap;
@@ -93,7 +156,7 @@ $rp-type-darkgrey: #3f3f3f;
   }
 
   .review-panel-entry-time {
-    color: var(--content-secondary);
+    color: var(--review-panel-color-secondary);
   }
 
   .review-panel-entry-actions {
@@ -103,6 +166,7 @@ $rp-type-darkgrey: #3f3f3f;
 
     .btn {
       background-color: transparent;
+      color: var(--review-panel-color);
       border-width: 0;
       padding: 0;
       height: 24px;
@@ -110,8 +174,8 @@ $rp-type-darkgrey: #3f3f3f;
 
       &:hover,
       &:focus {
-        background-color: var(--neutral-20);
-        color: var(--content-primary);
+        background-color: var(--review-panel-button-hover-bg-color);
+        color: var(--review-panel-color);
       }
     }
 
@@ -137,13 +201,13 @@ $rp-type-darkgrey: #3f3f3f;
 .review-panel-change-body {
   display: flex;
   align-items: flex-start;
-  color: var(--content-secondary);
+  color: var(--review-panel-color-secondary);
   gap: var(--spacing-02);
   overflow-wrap: anywhere;
 }
 
 .review-panel-content-highlight {
-  color: var(--content-primary);
+  color: var(--review-panel-color);
   text-decoration: none;
 }
 
@@ -184,113 +248,24 @@ del.review-panel-content-highlight {
   display: flex;
   flex-direction: column;
   justify-content: center;
-  border-bottom: 1px solid var(--rp-border-grey);
-  background-color: white;
+  border-bottom: 1px solid var(--review-panel-border-color);
+  background-color: var(--review-panel-header-bg-color);
   text-align: center;
   z-index: 4;
 }
 
-// TODO: Update this when we move the track changes menu to the new design
-.rp-tc-state {
-  position: absolute;
-  top: 100%;
-  left: 0;
-  right: 0;
-  overflow: hidden;
-  list-style: none;
-  padding: 0 var(--spacing-03);
-  margin: 0;
-  border-bottom: 1px solid var(--rp-border-grey);
-  text-align: left;
-  background-color: var(--white);
-  max-height: calc(
-    100vh - var(--review-panel-top) - var(--review-panel-header-height)
-  );
-  overflow-y: auto;
-
-  .rp-tc-state-item {
-    display: flex;
-    align-items: center;
-    padding: var(--spacing-02) 0;
-
-    &:last-of-type {
-      padding-bottom: var(--spacing-03);
-    }
-  }
-
-  .rp-tc-state-item-name {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    flex-grow: 1;
-    font-weight: 600;
-  }
-}
-
-.review-panel-tools {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding-left: var(--spacing-02);
-  padding-right: var(--spacing-05);
-  flex-shrink: 0;
-  flex-basis: 32px;
-}
-
 .review-panel-resolved-comments-toggle {
-  background-color: var(--bg-light-secondary);
-  font-size: var(--font-size-02);
-  color: color.adjust($rp-type-blue, $lightness: 25%);
-  border: solid 1px var(--rp-border-grey);
-  border-radius: var(--border-radius-base);
-  padding: 0;
-  height: 22px;
-  width: 22px;
-  line-height: 1.4;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  &:hover,
-  &:focus {
-    text-decoration: none;
-    color: var(--rp-type-blue);
-  }
-}
-
-.review-panel-resolved-comments-toggle-reviewer-role {
   display: flex;
   align-items: center;
   border: none;
   background-color: transparent;
-  color: var(--content-primary);
+  color: var(--review-panel-color);
   padding: var(--spacing-01);
   border-radius: 100%;
 
   &:hover,
   &:focus {
-    background-color: var(--neutral-20);
-  }
-}
-
-.track-changes-indicator-circle {
-  width: 8px;
-  height: 8px;
-  border-radius: 100%;
-  background-color: var(--bg-accent-01);
-}
-
-.track-changes-menu-button {
-  border: none;
-  background: none;
-  padding: 0;
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-02);
-  font-size: var(--font-size-02);
-
-  i {
-    width: 8px;
+    background-color: var(--review-panel-button-hover-bg-color);
   }
 }
 
@@ -413,7 +388,7 @@ del.review-panel-content-highlight {
 
 .review-panel-comment-body {
   font-size: var(--font-size-02);
-  color: var(--content-primary);
+  color: var(--review-panel-color);
   overflow-wrap: anywhere;
   white-space: pre-wrap;
 }
@@ -446,8 +421,8 @@ del.review-panel-content-highlight {
   border-radius: var(--border-radius-base);
   border: solid 1px var(--neutral-60);
   resize: vertical;
-  color: var(--rp-type-darkgrey);
-  background-color: var(--white);
+  color: var(--review-panel-color-secondary);
+  background-color: var(--review-panel-entry-bg-color);
   height: 25px;
   min-height: 25px;
   overflow-x: hidden;
@@ -487,7 +462,7 @@ del.review-panel-content-highlight {
 .review-panel-empty-state-comment-icon {
   width: 80px;
   height: 80px;
-  background-color: white;
+  background-color: var(--review-panel-empty-state-bg-color);
   border-radius: 100%;
   display: flex;
   align-items: center;
@@ -515,7 +490,7 @@ del.review-panel-content-highlight {
 }
 
 .review-panel-overfile-divider {
-  border-bottom: 1px solid var(--border-divider);
+  border-bottom: 1px solid var(--review-panel-border-color);
   margin: var(--spacing-01) 0;
 }
 
@@ -534,8 +509,8 @@ del.review-panel-content-highlight {
   bottom: 0;
   width: var(--review-panel-width);
   z-index: 2;
-  background-color: white;
-  border-top: 1px solid var(--rp-border-grey);
+  background-color: var(--review-panel-footer-bg-color);
+  border-top: 1px solid var(--review-panel-border-color);
   display: flex;
 
   .review-panel-tab {
@@ -548,17 +523,17 @@ del.review-panel-content-highlight {
     border: 0;
     border-top: solid 3px transparent;
     background: none;
-    color: var(--content-secondary);
+    color: var(--review-panel-color-secondary);
     font-size: var(--font-size-02);
 
     &:hover,
     &:focus {
       text-decoration: none;
-      color: var(--content-primary);
+      color: var(--review-panel-color);
     }
 
     &-active {
-      color: var(--content-primary);
+      color: var(--review-panel-color);
       border-top: solid 3px var(--bg-accent-01);
     }
   }
@@ -578,11 +553,12 @@ del.review-panel-content-highlight {
 
 .review-panel-add-comment-cancel-button {
   background-color: transparent;
+  color: var(--review-panel-color);
 
   &:hover,
   &:focus {
-    background-color: var(--neutral-20);
-    color: var(--content-primary);
+    background-color: var(--review-panel-button-hover-bg-color);
+    color: var(--review-panel-color);
   }
 }
 
@@ -622,8 +598,12 @@ del.review-panel-content-highlight {
 .review-panel-mini {
   overflow: visible !important;
 
+  .review-panel-entry-header .review-panel-entry-user {
+    width: 130px;
+  }
+
   .review-panel-inner {
-    width: 24px;
+    width: var(--review-panel-width-mini);
   }
 
   .review-panel-entry {
@@ -638,14 +618,14 @@ del.review-panel-content-highlight {
     left: 0;
     top: 0;
     display: flex;
-    color: var(--content-secondary);
+    color: var(--review-panel-color-secondary);
     cursor: pointer;
   }
 
   .review-panel-entry-content {
     display: none;
-    background: var(--white);
-    border: 1px solid var(--rp-border-grey);
+    background: var(--review-panel-entry-bg-color);
+    border: 1px solid var(--review-panel-border-color);
     border-radius: var(--border-radius-base);
     width: 200px;
     padding: var(--spacing-02);
@@ -715,56 +695,6 @@ del.review-panel-content-highlight {
   pointer-events: none; // this is to prevent mouseLeave event from firing when hovering over the tooltip
 }
 
-.review-panel-in-editor-widgets {
-  position: sticky;
-  top: 0;
-  right: 0;
-  font-size: 11px;
-  z-index: 2;
-  font-family: $font-family-base;
-
-  .review-panel-in-editor-widgets-inner {
-    position: absolute;
-    top: 0;
-    right: 0;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .review-panel-track-changes-indicator {
-    border: 0;
-  }
-}
-
-.review-panel-track-changes-indicator {
-  display: block;
-  padding: 5px 10px;
-  background-color: rgb(240 240 240 / 90%);
-  color: var(--rp-type-blue);
-  text-align: center;
-  border-bottom-left-radius: 3px;
-  white-space: nowrap;
-
-  &.review-panel-track-changes-indicator-on-dark {
-    background-color: rgb(88 88 88 / 80%);
-    color: #fff;
-
-    &:hover,
-    &:focus {
-      background-color: rgb(88 88 88 / 100%);
-      color: #fff;
-    }
-  }
-
-  &:hover,
-  &:focus {
-    outline: 0;
-    text-decoration: none;
-    background-color: rgb(240 240 240 / 100%);
-    color: var(--rp-type-blue);
-  }
-}
-
 .review-mode-switcher-container {
   position: sticky;
   top: 0;
@@ -795,6 +725,11 @@ del.review-panel-content-highlight {
       display: block;
     }
   }
+
+  // prevent gap between button and menu
+  > .dropdown-menu {
+    margin-top: -2px;
+  }
 }
 
 .review-mode-switcher-toggle-button {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/settings.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/settings.scss
index 02ce2cca30..e443b6e8ec 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/settings.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/settings.scss
@@ -47,6 +47,10 @@
   padding: 0;
 }
 
+.modal-backdrop.show.ide-settings-modal-transparent-backdrop {
+  opacity: 0;
+}
+
 .ide-settings-section {
   padding-top: var(--spacing-06);
   padding-bottom: var(--spacing-05);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar-redesign.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar-redesign.scss
index 87185ab3ed..10ef617386 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar-redesign.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar-redesign.scss
@@ -35,16 +35,23 @@
   justify-content: space-between;
   box-sizing: border-box;
   height: $toolbar-height;
+  padding: 0 var(--spacing-02);
+  gap: var(--spacing-05);
 
   .ide-redesign-toolbar-menu {
     display: flex;
     gap: var(--spacing-05);
   }
 
+  .ide-redesign-toolbar-menu,
+  .ide-redesign-toolbar-actions {
+    flex: 0 0 auto;
+  }
+
   .ide-redesign-toolbar-home-button {
     width: $home-button-size;
     height: $home-button-size;
-    margin: math.div($toolbar-height - $home-button-size, 2);
+    margin: math.div($toolbar-height - $home-button-size, 2) 0;
   }
 
   .ide-redesign-toolbar-button-subdued {
@@ -58,6 +65,27 @@
     );
 
     text-decoration: none;
+
+    &.ide-redesign-toolbar-button-icon {
+      @include ol-button-variant(
+        var(--redesign-subdued-button-color),
+        var(--redesign-toolbar-background),
+        transparent,
+        var(--redesign-subdued-button-hover-background),
+        transparent,
+        true
+      );
+
+      border-radius: var(--border-radius-full);
+      display: flex;
+      justify-content: center;
+      padding: var(--spacing-02);
+
+      &:visited,
+      &:focus {
+        color: var(--redesign-subdued-button-color);
+      }
+    }
   }
 
   .ide-redesign-toolbar-home-link {
@@ -120,6 +148,36 @@
       vertical-align: middle;
     }
   }
+
+  .ide-redesign-toolbar-logos {
+    display: flex;
+  }
+
+  .ide-redesign-toolbar-cobranding-separator {
+    $separator-height: 16px;
+
+    border-radius: var(--border-radius-base);
+    width: 1px;
+    height: $separator-height;
+    margin-top: math.div($toolbar-height - $separator-height, 2);
+
+    // To account for the 1px border of the rail so that they're aligned.
+    margin-left: calc(var(--spacing-02) - 1px);
+    margin-right: var(--spacing-01);
+    background: var(--redesign-toolbar-border-divider);
+  }
+
+  .ide-redesign-toolbar-cobranding-link {
+    display: inline-flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 0 var(--spacing-02);
+  }
+
+  .ide-redesign-toolbar-cobranding-logo {
+    max-height: calc($toolbar-height - var(--spacing-04) * 2);
+    max-width: 150px;
+  }
 }
 
 .ide-redesign-toolbar-menu-bar {
@@ -132,7 +190,7 @@
 .ide-redesign-toolbar-actions {
   display: flex;
   gap: var(--spacing-04);
-  padding: 0 var(--spacing-05);
+  padding-left: var(--spacing-05);
 }
 
 .ide-redesign-toolbar-button-container {
@@ -160,13 +218,22 @@
   }
 }
 
-.ide-redesign-labs-button.btn.btn-info {
-  @include ol-button-variant(
-    var(--content-positive),
-    var(--bg-accent-03),
-    var(--green-40),
-    var(--bg-accent-03),
-    var(--green-40),
-    false
-  );
+.ide-redesign-toolbar-project-dropdown {
+  flex: 0 1 auto;
+  min-width: 0;
+}
+
+.ide-redesign-toolbar-project-dropdown-toggle {
+  display: flex;
+  max-width: 100%;
+}
+
+.ide-redesign-toolbar-project-name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ide-redesign-labs-button.btn.btn-secondary {
+  @include labs-button;
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar.scss
index 70b5dac91c..367d1b443c 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/editor/toolbar.scss
@@ -22,6 +22,7 @@
   --editor-header-logo-background: url(../../../../../public/img/ol-brand/overleaf-o-white.svg)
     center / contain no-repeat;
   --editor-toolbar-bg: var(--neutral-80);
+  --toolbar-dropdown-divider-color: var(--border-dark-divider);
 }
 
 .ide-redesign-main {
@@ -32,8 +33,23 @@
   --editor-toolbar-bg: var(--bg-dark-primary);
   --toolbar-filetree-bg-color: var(--neutral-80);
 
-  .cm-panels-top {
-    border-bottom: none;
+  .ol-cm-toolbar-portal {
+    display: flex;
+    align-items: center;
+    background-color: var(--editor-toolbar-bg);
+
+    .review-panel-header {
+      align-self: flex-start;
+    }
+  }
+
+  .ol-cm-toolbar-wrapper {
+    flex: 1;
+    width: 100%;
+  }
+
+  .ol-cm-toolbar-wrapper-indented {
+    width: calc(100% - var(--review-panel-width));
   }
 }
 
@@ -56,6 +72,7 @@
   --editor-header-logo-background: url(../../../../../public/img/ol-brand/overleaf-o.svg)
     center / contain no-repeat;
   --editor-toolbar-bg: var(--white);
+  --toolbar-dropdown-divider-color: var(--border-divider);
 
   .ide-redesign-main {
     --toolbar-alt-bg-color: var(--bg-light-secondary);
@@ -64,10 +81,6 @@
     --toolbar-btn-hover-color: var(--white);
     --editor-toolbar-bg: var(--white);
     --toolbar-filetree-bg-color: var(--white);
-
-    .ol-cm-toolbar-portal {
-      border-bottom: 1px solid #ddd;
-    }
   }
 }
 
@@ -248,6 +261,23 @@
 
   .toolbar-item {
     display: flex;
+    justify-content: center;
+  }
+
+  .toolbar-cio-tooltip {
+    position: absolute;
+    top: var(--toolbar-height);
+    width: 391px;
+  }
+
+  #toolbar-cio-history {
+    @include media-breakpoint-down(lg) {
+      right: 10px;
+
+      /* The iframe a message renders in isn't aware of the page width, so we
+         make it 1px narrower to enable max-width media queries */
+      width: 390px;
+    }
   }
 }
 
@@ -405,9 +435,7 @@
 }
 
 .toggle-switch-input {
-  position: absolute;
-  opacity: 0;
-  pointer-events: none;
+  @include visually-hidden;
 }
 
 .toggle-switch-input:disabled + .toggle-switch-label {
@@ -503,15 +531,10 @@
   border-right: 1px solid var(--formatting-btn-border);
 }
 
-.toolbar-experiment-button.btn.btn-info {
-  @include ol-button-variant(
-    var(--content-positive),
-    var(--bg-accent-03),
-    var(--green-40),
-    var(--bg-accent-03),
-    var(--green-40),
-    false
-  );
+// Override a secondary button to ensure that the border is visible because
+// overriding a borderless button will not add a border.
+.toolbar-experiment-button.btn-secondary {
+  @include labs-button;
 
   max-height: 39px;
   font-size: var(--font-size-01);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/error-pages.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/error-pages.scss
new file mode 100644
index 0000000000..ac21364f9d
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/error-pages.scss
@@ -0,0 +1,56 @@
+.error-container {
+  display: flex;
+  align-items: center;
+
+  &.full-height {
+    margin-top: calc(-1 * ($header-height + var(--spacing-08)) / 2);
+  }
+
+  .error-details {
+    flex: 1 1 50%;
+    padding: var(--spacing-08);
+    max-width: 90%;
+
+    @include media-breakpoint-up(sm) {
+      padding: var(--spacing-11);
+    }
+  }
+
+  .error-status {
+    @include heading-lg;
+
+    margin-bottom: var(--spacing-08);
+    color: var(--content-secondary);
+  }
+
+  .error-description {
+    @include heading-sm;
+
+    color: var(--content-disabled-dark);
+    margin-bottom: var(--spacing-08);
+  }
+
+  .error-box {
+    background-color: var(--bg-light-tertiary);
+    padding: var(--spacing-04);
+    font-family: $font-family-monospace;
+    margin-bottom: var(--spacing-08);
+  }
+
+  .error-actions {
+    margin-top: var(--spacing-11);
+    display: flex;
+    gap: var(--spacing-06);
+  }
+
+  .error-btn {
+    @extend .btn;
+    @extend .btn-primary;
+
+    display: block;
+
+    @include media-breakpoint-up(sm) {
+      display: inline-block;
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/group-settings.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/group-settings.scss
index fb9c7de0fa..ea0d060667 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/group-settings.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/group-settings.scss
@@ -91,6 +91,10 @@ h4.group-settings-title {
     border-bottom: 1px solid var(--border-disabled);
     margin-bottom: var(--spacing-06);
     flex-wrap: wrap;
+
+    .badge {
+      max-width: none;
+    }
   }
 
   .sso-config-options-buttons {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/homepage.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/homepage.scss
index f6b30f143f..3f3ec3d900 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/homepage.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/homepage.scss
@@ -284,7 +284,7 @@
       margin-top: var(--spacing-06);
       margin-bottom: var(--spacing-04);
 
-      i.material-symbols {
+      .material-symbols {
         vertical-align: middle;
         text-decoration: none;
       }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/login-register.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/login-register.scss
index 25d3a42c4f..77771806a3 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/login-register.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/login-register.scss
@@ -22,9 +22,13 @@
   }
 }
 
-.login-register-error-container {
-  padding-bottom: var(--spacing-05);
-  text-align: left;
+.login-register-form {
+  padding: var(--spacing-08) var(--spacing-08) 0 var(--spacing-08);
+  border-bottom: solid 1px var(--border-divider);
+
+  &:last-child {
+    border-bottom-width: 0;
+  }
 }
 
 .form-group-password {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/onboarding.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/onboarding.scss
index 1244850279..da59fafdca 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/onboarding.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/onboarding.scss
@@ -59,10 +59,6 @@
         display: flex;
         align-items: center;
         gap: var(--spacing-04);
-
-        button.btn-info-ghost {
-          color: var(--neutral-90);
-        }
       }
     }
   }
@@ -110,7 +106,6 @@
   user-select: none;
 }
 
-.onboarding-collapse-button,
 .onboarding-privacy-extended {
   @include media-breakpoint-down(md) {
     padding: 0 var(--spacing-08);
diff --git a/services/web/frontend/stylesheets/app/plans.less b/services/web/frontend/stylesheets/bootstrap-5/pages/plans.scss
similarity index 68%
rename from services/web/frontend/stylesheets/app/plans.less
rename to services/web/frontend/stylesheets/bootstrap-5/pages/plans.scss
index 8811c59f6e..46ea5ef131 100644
--- a/services/web/frontend/stylesheets/app/plans.less
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/plans.scss
@@ -1,42 +1,39 @@
-@z-index-plans-new-tabs: 1;
-@z-index-group-member-picker-list: 1;
-@z-index-plans-new-tabs-content: 0;
+@use 'sass:math';
 
-@highlighted-heading-line-height: (@line-height-03 / 1rem) * 16px; // convert to px
-@highlighted-heading-padding-vertical: @spacing-02;
-@highlighted-heading-height: (
-  @highlighted-heading-line-height + (2 * @highlighted-heading-padding-vertical)
+$container-plans-responsive-width: 95%;
+$container-xl: 1280px;
+$z-index-plans-new-tabs-content: 0;
+$z-index-plans-new-tabs: 1;
+$border-radius-full-new: 9999px;
+$highlighted-heading-line-height: 24px; // this is ported directly from the .less file as value
+$highlighted-heading-padding-vertical: $spacing-02;
+$highlighted-heading-height: (
+  $highlighted-heading-line-height + (2 * $highlighted-heading-padding-vertical)
 );
-
-@switcher-container-margin-bottom: @highlighted-heading-height + @spacing-10;
-
-@nondiscounted-price-element-height: var(--line-height-02);
-
-@group-member-picker-height: 24px;
-@group-member-picker-top-height: 36px;
-@group-member-picker-sm-width: 50%;
-@group-member-picker-md-width: 25%;
-@group-member-picker-min-width: 234px;
-
-@container-plans-responsive-width: 95%;
-@table-4-column-width: 25%;
-@table-5-column-width: 20%;
-
-@plans-m-a-new-switch-height: 20px;
-
-@plans-m-a-switch-padding: 2px;
+$switcher-container-margin-bottom: $highlighted-heading-height + $spacing-10;
+$table-4-column-width: 25%;
+$table-5-column-width: 20%;
+$nondiscounted-price-element-height: var(--line-height-02);
+$group-member-picker-height: 24px;
+$group-member-picker-top-height: 36px;
+$z-index-group-member-picker-list: 1;
 
 .plans-new-design {
-  padding-top: var(--header-height);
+  --border-width-base: 3px; // TODO: put this variable in a decent location
+  --border-radius-large-new: 16px; // TODO: put this variable in a decent location
+
+  padding-top: $header-height;
+  overflow: unset;
 
   .container {
     padding: 0 var(--spacing-06);
 
-    @media (min-width: @screen-sm-min) {
-      width: @container-plans-responsive-width;
+    @include media-breakpoint-up(md) {
+      width: $container-plans-responsive-width;
     }
-    @media (min-width: @screen-xl-min) {
-      width: @container-xl;
+
+    @include media-breakpoint-up(xxl) {
+      width: $container-xl;
     }
 
     .geo-banner-container {
@@ -51,13 +48,14 @@
       margin-top: var(--spacing-13);
     }
   }
+
   .main-heading-section {
     text-align: center;
     max-width: 885px;
     margin-left: auto;
     margin-right: auto;
 
-    @media (max-width: @screen-xs-max) {
+    @include media-breakpoint-down(md) {
       text-align: left;
       padding: 0 16px;
     }
@@ -68,7 +66,8 @@
       font-size: 3rem;
       font-weight: 600;
       line-height: 64px;
-      @media (max-width: @screen-xs-max) {
+
+      @include media-breakpoint-down(md) {
         font-size: 2.25rem;
         line-height: 48px;
         padding-right: 5rem;
@@ -87,11 +86,12 @@
     display: flex;
     flex-direction: column;
     align-items: center;
+    position: relative;
 
-    @media (min-width: @screen-sm-min) {
-      border-left: 1px solid var(--neutral-20);
-      border-right: 1px solid var(--neutral-20);
-      border-bottom: 1px solid var(--neutral-20);
+    @include media-breakpoint-up(md) {
+      border-left: 1px solid var(--border-divider);
+      border-right: 1px solid var(--border-divider);
+      border-bottom: 1px solid var(--border-divider);
       border-radius: 8px;
     }
 
@@ -100,15 +100,15 @@
     &::before {
       content: '';
       display: block;
-      z-index: @z-index-plans-new-tabs-content;
+      z-index: $z-index-plans-new-tabs-content;
       position: absolute;
       top: -1px; // make border overlap with the border on .plans-new-tabs
       width: 100%;
       height: 20px; // arbitrary height since it's transparent, make sure that it's bigger than border radius
       background: transparent;
-      border-top: 1px solid var(--neutral-20);
+      border-top: 1px solid var(--border-divider);
 
-      @media (min-width: @screen-sm-min) {
+      @include media-breakpoint-up(md) {
         border-top-left-radius: 8px;
         border-top-right-radius: 8px;
       }
@@ -116,7 +116,7 @@
   }
 
   .plans-new-tabs-container {
-    z-index: @z-index-plans-new-tabs;
+    z-index: $z-index-plans-new-tabs;
     margin-top: var(--spacing-16);
 
     // explicit padding to tell that the bottom left and bottom right
@@ -129,7 +129,7 @@
     display: flex;
     justify-content: center;
     gap: 8px;
-    border-bottom: 1px solid var(--neutral-20);
+    border-bottom: 1px solid var(--border-divider);
 
     .plans-new-tab {
       cursor: pointer;
@@ -137,18 +137,20 @@
       font-weight: 600;
       border-top-right-radius: 8px;
       border-top-left-radius: 8px;
+      margin-bottom: -1px; // to overlap with the border on .plans-new-tabs to avoid double border
 
       .plans-new-tab-link {
-        border: unset;
         display: flex;
         align-items: center;
-        color: var(--neutral-70);
+        color: var(--content-secondary);
         margin: 0;
         border-top-right-radius: 8px;
         border-top-left-radius: 8px;
-        border: 1px solid var(--neutral-20);
+        /* stylelint-disable-next-line declaration-block-no-duplicate-properties */
+        border: 1px solid var(--border-divider);
         padding: var(--spacing-05) var(--spacing-08);
         gap: var(--spacing-04);
+        text-decoration: unset;
 
         &:focus {
           background-color: unset;
@@ -159,29 +161,30 @@
           background-color: var(--neutral-20);
         }
 
+        // TODO: this is copied directly from the `.less` file, migrate this to scss
         // tab navigation focus style
-        &:focus-visible {
-          .box-shadow-button-input();
-          outline: 0;
-        }
+        // &:focus-visible {
+        //   .box-shadow-button-input();
+        //   outline: 0;
+        // }
 
         .group-discount-bubble {
           padding: var(--spacing-01) var(--spacing-04);
           background-color: var(--green-10);
           color: var(--green-50);
-          border-radius: var(--border-radius-full-new);
+          border-radius: $border-radius-full-new; // TODO: this is ported direction as a scss variable, change this to a css variable
           font-family: 'DM Mono', monospace;
           font-feature-settings: 'ss05';
           font-size: var(--font-size-01);
           line-height: var(--line-height-01);
           font-weight: 500;
 
-          @media (max-width: @screen-xs-max) {
+          @include media-breakpoint-down(md) {
             display: none;
           }
         }
 
-        @media (max-width: @screen-xs-max) {
+        @include media-breakpoint-down(md) {
           font-size: var(--font-size-02);
           line-height: var(--line-height-02);
           padding: var(--spacing-05);
@@ -189,7 +192,7 @@
         }
       }
 
-      &.active {
+      &:has(.active) {
         .plans-new-tab-link {
           border: 1px solid white;
           position: relative;
@@ -208,16 +211,18 @@
             background: border-box
               linear-gradient(
                 to bottom,
-                @green-50 0%,
-                @neutral-20 85%,
-                @neutral-20 100%
+                $green-50 0%,
+                $neutral-20 85%,
+                $neutral-20 100%
               );
+            /* stylelint-disable-next-line property-no-vendor-prefix */
             -webkit-mask:
               linear-gradient(white 0 0) padding-box,
               linear-gradient(white 0 0);
             mask:
               linear-gradient(white 0 0) padding-box,
               linear-gradient(white 0 0);
+            /* stylelint-disable-next-line property-no-vendor-prefix */
             -webkit-mask-composite: xor;
             mask-composite: exclude;
             border-top-right-radius: 8px;
@@ -229,6 +234,7 @@
             top: 0;
             bottom: -2px;
             left: -1px;
+            /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
             right: -1px;
           }
 
@@ -248,14 +254,14 @@
   .plans-new-period-switcher-container {
     position: relative;
     display: inline-flex;
-    background-color: var(--neutral-10);
-    border-radius: var(--border-radius-full-new);
+    background-color: var(--bg-light-secondary);
+    border-radius: $border-radius-full-new; // TODO: this is ported direction as a scss variable, change this to a css variable
     padding: var(--spacing-03);
     margin-top: var(--spacing-09);
-    margin-bottom: @switcher-container-margin-bottom;
+    margin-bottom: $switcher-container-margin-bottom;
     gap: var(--spacing-04);
 
-    @media (max-width: @screen-xs-max) {
+    @include media-breakpoint-down(md) {
       margin-bottom: var(--spacing-09);
     }
 
@@ -268,7 +274,7 @@
       line-height: var(--line-height-04);
       text-align: center;
       padding: var(--spacing-01) var(--spacing-04);
-      border-radius: var(--border-radius-full-new);
+      border-radius: $border-radius-full-new; // TODO: this is ported direction as a scss variable, change this to a css variable
 
       &:hover {
         background-color: var(--neutral-20);
@@ -279,21 +285,25 @@
     input[type='radio'] {
       position: absolute;
       left: -9999px;
+
       &:focus,
       &:focus-visible {
         outline: 0;
       }
     }
 
-    input[type='radio']:focus-visible + label,
-    input[type='radio']:checked:focus-visible + label {
-      .box-shadow-button-input();
-    }
+    // TODO: this is copied directly from the `.less` file, migrate this to scss
+    // input[type='radio']:focus-visible + label,
+    // input[type='radio']:checked:focus-visible + label {
+    //   .box-shadow-button-input();
+    // }
 
     input[type='radio']:checked + label {
       background-color: var(--green-50);
       color: white;
+      /* stylelint-disable-next-line length-zero-no-unit, color-function-notation, alpha-value-notation */
       box-shadow: 0px 2px 4px 0px rgba(30, 37, 48, 0.16);
+
       .plans-new-discount-badge {
         background-color: var(--green-10);
         color: var(--green-60);
@@ -324,7 +334,7 @@
     border: none;
     padding-top: 0;
 
-    @media (max-width: @screen-xs-min) {
+    @include media-breakpoint-down(md) {
       padding: 0;
     }
   }
@@ -332,7 +342,7 @@
   .plans-new-mobile {
     display: none;
 
-    @media (max-width: @screen-xs-max) {
+    @include media-breakpoint-down(md) {
       display: block;
     }
   }
@@ -340,7 +350,7 @@
   .plans-new-desktop {
     display: block;
 
-    @media (max-width: @screen-xs-max) {
+    @include media-breakpoint-down(md) {
       display: none;
     }
   }
@@ -354,12 +364,12 @@
 
     th,
     td {
-      width: @table-4-column-width;
+      width: $table-4-column-width;
     }
   }
 
   .plans-new-table-student {
-    margin-left: @table-4-column-width / 2;
+    margin-left: math.div($table-4-column-width, 2);
   }
 
   .plans-new-table-student-verification {
@@ -369,7 +379,7 @@
   }
 
   .plans-new-table-group {
-    margin-top: @spacing-11 + @highlighted-heading-height;
+    margin-top: $spacing-11 + $highlighted-heading-height;
   }
 
   thead th {
@@ -379,10 +389,10 @@
     font-size: var(--font-size-05);
     font-weight: 600;
     line-height: var(--line-height-04);
-    color: var(--neutral-90);
+    color: var(--content-primary);
     text-align: center;
 
-    @media (max-width: @screen-md-max) {
+    @include media-breakpoint-down(md) {
       padding: var(--spacing-05) var(--spacing-05) 0 var(--spacing-05);
     }
   }
@@ -390,12 +400,13 @@
   .plans-new-table-subheader {
     vertical-align: top;
     padding: 0 var(--spacing-08);
-    @media (max-width: @screen-md-max) {
+
+    @include media-breakpoint-down(xl) {
       padding: 0 var(--spacing-05);
     }
 
     &.plans-new-table-icon-cta-cell,
-    &.plans-subheader-monthly-cta-swapped {
+    &.plans-subheader-monthly-cta {
       vertical-align: bottom;
     }
   }
@@ -403,7 +414,8 @@
   .plans-new-table-cta-row {
     td {
       padding-bottom: var(--spacing-06);
-      @media (max-width: @screen-md-max) {
+
+      @include media-breakpoint-down(xl) {
         padding-bottom: var(--spacing-05);
       }
 
@@ -414,7 +426,7 @@
       }
     }
 
-    .btn-block + .btn-block {
+    .plans-cta + .plans-cta {
       margin-top: var(--spacing-04);
     }
   }
@@ -427,7 +439,7 @@
     s,
     .match-original-price-height {
       font-size: var(--font-size-02);
-      line-height: @nondiscounted-price-element-height;
+      line-height: $nondiscounted-price-element-height;
       color: var(--neutral-60);
       font-weight: 600;
     }
@@ -436,7 +448,7 @@
       font-size: var(--font-size-08);
       font-weight: 600;
       line-height: var(--line-height-07);
-      color: var(--neutral-90);
+      color: var(--content-primary);
     }
 
     .plans-new-table-header-price-unit {
@@ -447,6 +459,7 @@
 
     .plans-new-table-cta {
       margin-top: auto;
+
       a:nth-child(2) {
         margin-top: var(--spacing-04);
       }
@@ -454,7 +467,7 @@
 
     .plans-new-table-header-icon {
       font-size: 56px;
-      color: var(--neutral-90);
+      color: var(--content-primary);
     }
   }
 
@@ -470,18 +483,6 @@
     line-height: var(--line-height-02);
   }
 
-  .plans-new-root-group-member-picker {
-    margin: var(--spacing-10) auto 0 auto;
-
-    @media (min-width: @screen-sm-min) {
-      width: @group-member-picker-sm-width;
-    }
-    @media (min-width: @screen-md-min) {
-      width: @group-member-picker-md-width;
-      min-width: @group-member-picker-min-width; // ensure checkbox title doesn't wrap in English
-    }
-  }
-
   .plans-new-group-member-picker {
     .plans-new-group-member-picker-text {
       font-size: var(--font-size-02);
@@ -503,7 +504,7 @@
         justify-content: space-between;
         padding: var(--spacing-01) var(--spacing-03);
         margin-bottom: var(--spacing-04);
-        height: @group-member-picker-height;
+        height: $group-member-picker-height;
         font-size: var(--font-size-02);
         line-height: var(--line-height-02);
 
@@ -521,7 +522,11 @@
         }
 
         &[data-ol-plans-new-group-member-picker-button='group-all'] {
-          height: @group-member-picker-top-height;
+          height: $group-member-picker-top-height;
+        }
+
+        .material-symbols {
+          pointer-events: none;
         }
       }
 
@@ -529,17 +534,18 @@
         list-style-type: none;
         margin-bottom: 0;
         overflow: auto; // to enable box-shadow
+        /* stylelint-disable-next-line length-zero-no-unit, color-function-notation, alpha-value-notation */
         box-shadow: 0px 2px 4px 0px rgba(30, 37, 48, 0.16);
         padding: var(--spacing-02);
         position: absolute;
-        top: @group-member-picker-height;
+        top: $group-member-picker-height;
         background-color: white;
         width: 100%;
         margin-top: var(--spacing-01);
-        z-index: @z-index-group-member-picker-list;
+        z-index: $z-index-group-member-picker-list;
 
         &[data-ol-plans-new-group-member-picker-dropdown='group-all'] {
-          top: @group-member-picker-top-height;
+          top: $group-member-picker-top-height;
         }
       }
 
@@ -569,7 +575,7 @@
 
         &:not(.plans-new-group-member-picker-footer):hover {
           input[type='radio']:not(:checked) + p {
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
           }
         }
 
@@ -578,9 +584,10 @@
           opacity: 0;
           cursor: pointer;
 
-          &:focus + p {
-            &:extend(.input-focus-style);
-          }
+          // TODO: this is copied directly from the `.less` file, migrate this to scss
+          // &:focus + p {
+          //   &:extend(.input-focus-style);
+          // }
 
           + p {
             padding: var(--spacing-05) var(--spacing-08) var(--spacing-05)
@@ -597,13 +604,13 @@
           word-wrap: break-word;
 
           &::after {
-            content: url(../../../public/img/material-icons/check-green-20.svg);
+            content: url(../../../../public/img/material-icons/check-green-20.svg);
             position: absolute;
             right: 12px;
             top: 50%;
             transform: translateY(-50%);
 
-            @media (max-width: @screen-sm-max) {
+            @include media-breakpoint-down(md) {
               right: var(--spacing-04);
             }
           }
@@ -636,9 +643,10 @@
           margin: var(--spacing-02);
           accent-color: var(--green-50);
 
-          &:focus-visible {
-            .box-shadow-button-input();
-          }
+          // TODO: this is copied directly from the `.less` file, migrate this to scss
+          // &:focus-visible {
+          //   .box-shadow-button-input();
+          // }
         }
 
         .plans-new-edu-discount-content {
@@ -647,11 +655,11 @@
 
           span {
             line-height: var(--line-height-03);
-            color: var(--neutral-90);
+            color: var(--content-primary);
           }
 
           small {
-            color: var(--neutral-70);
+            color: var(--content-secondary);
             font-size: var(--font-size-01);
             line-height: var(--line-height-01);
           }
@@ -685,14 +693,15 @@
 
   .plans-new-table-feature-row {
     &:nth-child(even) {
-      background-color: var(--neutral-10);
+      background-color: var(--bg-light-secondary);
     }
   }
 
   .plans-new-table-section-without-header-row {
     &:nth-child(odd):not(.plans-new-table-heading-row) {
-      background-color: var(--neutral-10);
+      background-color: var(--bg-light-secondary);
     }
+
     &:nth-child(even):not(.plans-new-table-heading-row) {
       background-color: var(--white);
     }
@@ -725,7 +734,7 @@
         font-family: Lato, sans-serif;
         font-size: var(--font-size-02);
         text-align: left;
-        background-color: var(--neutral-90);
+        background-color: var(--content-primary);
         border-radius: var(--border-radius-base-new);
       }
     }
@@ -744,15 +753,15 @@
   .plans-new-table-highlighted-heading {
     position: absolute;
     left: calc(-1 * var(--border-width-base));
-    top: -1 * @highlighted-heading-height;
-    height: @highlighted-heading-height;
+    top: -1 * $highlighted-heading-height;
+    height: $highlighted-heading-height;
     width: calc(100% + (2 * var(--border-width-base)));
     border-top-left-radius: var(--border-radius-large-new);
     border-top-right-radius: var(--border-radius-large-new);
-    padding: @highlighted-heading-padding-vertical var(--spacing-04);
+    padding: $highlighted-heading-padding-vertical var(--spacing-04);
     font-weight: 600;
     text-align: center;
-    line-height: @highlighted-heading-line-height;
+    line-height: $highlighted-heading-line-height;
     background-color: var(--green-50);
     color: var(--white);
     font-size: var(--font-size-03);
@@ -763,6 +772,247 @@
     border-left: var(--border-width-base) solid var(--green-50);
   }
 
+  .ai-assist {
+    color: var(--neutral-90);
+
+    @include media-breakpoint-up(lg) {
+      padding-left: 0 !important;
+      padding-right: 0 !important;
+    }
+
+    .ai-assist-heading {
+      margin-top: var(--spacing-12);
+      margin-bottom: var(--spacing-12);
+      text-align: center;
+    }
+
+    .ai-assist-container {
+      padding: var(--spacing-10);
+      border: var(--spacing-02) solid var(--neutral-10);
+      border-radius: var(--border-radius-large-new);
+      background:
+        linear-gradient(270deg, var(--blue-10), #fff) 0.13%,
+        #fff 63.21%;
+
+      @include media-breakpoint-down(lg) {
+        background: var(--bg-light-primary);
+        border-width: 2px;
+        border-radius: var(--border-radius-medium);
+        border-color: var(--premium-gradient);
+        padding: var(--spacing-09);
+      }
+
+      .ai-assist-content {
+        display: flex;
+        justify-content: space-between;
+        gap: var(--spacing-07);
+
+        @include media-breakpoint-down(lg) {
+          flex-direction: column;
+        }
+
+        .ai-assist-left {
+          display: flex;
+          gap: var(--spacing-07);
+          flex-direction: column;
+          max-width: 480px;
+
+          @include media-breakpoint-down(lg) {
+            max-width: 100%;
+          }
+
+          .ai-assist-price {
+            font-weight: 600;
+            font-size: var(--font-size-03);
+
+            @include media-breakpoint-down(lg) {
+              font-weight: normal;
+              font-size: var(--font-size-02);
+
+              .price {
+                font-size: var(--font-size-08);
+                font-weight: 600;
+              }
+            }
+          }
+
+          .ai-assist-annually-price {
+            display: block;
+          }
+
+          .ai-assist-monthly-price {
+            display: none;
+          }
+
+          .ai-assist-header-switch {
+            display: none;
+          }
+
+          .ai-assist-header {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+
+            .ai-assist-header-content {
+              display: flex;
+              gap: var(--spacing-06);
+              align-items: center;
+
+              h3 {
+                font-size: var(--font-size-07);
+                margin: 0;
+                padding: 0;
+
+                @include media-breakpoint-down(lg) {
+                  font-size: var(--font-size-05);
+                }
+              }
+
+              img {
+                @include media-breakpoint-down(lg) {
+                  width: 24px;
+                }
+              }
+            }
+
+            .ai-assist-header-switch {
+              align-items: center;
+              gap: var(--spacing-03);
+              user-select: none;
+
+              input {
+                margin: 0;
+              }
+
+              label {
+                margin: 0;
+                font-weight: normal;
+                font-size: var(--font-size-03);
+              }
+            }
+          }
+        }
+
+        .ai-assist-right {
+          display: flex;
+          align-items: center;
+          gap: var(--spacing-06);
+
+          .ai-assist-features {
+            list-style: none;
+            display: flex;
+            flex-direction: column;
+            gap: var(--spacing-04);
+            min-width: 210px;
+            margin-bottom: 0;
+
+            .feature-item {
+              display: flex;
+              align-items: center;
+              font-size: var(--font-size-03);
+              cursor: default;
+
+              .feature-icon {
+                margin-right: var(--spacing-05);
+                color: var(--neutral-70);
+                width: 16px;
+                height: 16px;
+              }
+
+              .feature-text {
+                color: var(--neutral-90);
+              }
+            }
+
+            @include media-breakpoint-up(lg) {
+              .feature-item-selected {
+                .feature-text {
+                  color: var(--blue-50);
+                  font-weight: 600;
+                }
+
+                .feature-icon {
+                  content: url(../../../../public/img/check-circle-blue-filled.svg);
+                }
+              }
+            }
+          }
+
+          .ai-assist-images {
+            display: flex;
+            align-items: flex-start;
+            width: 280px;
+            justify-content: center;
+
+            @include media-breakpoint-down(lg) {
+              display: none;
+            }
+          }
+        }
+      }
+    }
+
+    .ai-assist-header-switch {
+      display: flex !important;
+    }
+
+    .ai-assist-button-container {
+      display: flex;
+      gap: var(--spacing-05);
+
+      &.mobile {
+        display: none;
+        margin-top: var(--spacing-06);
+        flex-direction: column;
+      }
+
+      @include media-breakpoint-down(lg) {
+        &.mobile {
+          display: flex;
+        }
+
+        &.desktop {
+          display: none;
+        }
+      }
+
+      .btn.monthly {
+        display: none;
+      }
+    }
+
+    .overleaf-assist-screenshot {
+      height: auto;
+      max-width: 280px;
+      max-height: 200px;
+      border-radius: var(--border-radius-base-new);
+      display: none;
+
+      &.selected {
+        display: block;
+        animation: fade-in 1s;
+      }
+    }
+  }
+
+  .ai-assist.monthly-period {
+    .ai-assist-annually-price {
+      display: none !important;
+    }
+
+    .ai-assist-monthly-price {
+      display: block !important;
+    }
+
+    .ai-assist-button-container .btn.annual {
+      display: none !important;
+    }
+
+    .ai-assist-button-container .btn.monthly {
+      display: block !important;
+    }
+  }
+
   .plans-new-organizations {
     padding: var(--spacing-13) var(--spacing-08);
 
@@ -779,7 +1029,7 @@
       justify-content: space-around;
       align-items: center;
 
-      @media (max-width: @screen-md-max) {
+      @include media-breakpoint-down(xl) {
         flex-wrap: wrap;
         gap: 30px;
       }
@@ -802,14 +1052,14 @@
 
     .plans-card-mobile {
       padding: var(--spacing-09);
-      border: 2px solid var(--neutral-20);
+      border: 2px solid var(--border-divider);
       width: 100%; // might need max-width
       border-radius: 8px;
       display: flex;
       flex-direction: column;
 
       .plans-card-title-mobile {
-        color: var(--neutral-90);
+        color: var(--content-primary);
         font-size: var(--font-size-05); // 20px
         font-weight: 600;
         line-height: var(--line-height-04);
@@ -817,9 +1067,10 @@
 
       .plans-card-icon-container-mobile {
         margin-top: var(--spacing-04);
+
         .plans-card-icon {
           font-size: var(--font-size-09);
-          color: var(--neutral-90);
+          color: var(--content-primary);
         }
       }
 
@@ -835,10 +1086,6 @@
       .plans-card-price-container-mobile {
         display: flex;
         align-items: baseline;
-
-        .light-gray-text:has(.billed-annually-disclaimer) {
-          align-self: center;
-        }
       }
 
       .group-plans-card-price-container-mobile {
@@ -847,7 +1094,7 @@
       }
 
       .plans-card-price-mobile {
-        color: var(--neutral-90);
+        color: var(--content-primary);
         font-size: var(--font-size-08); // 36px
         font-weight: 600;
         line-height: var(--line-height-07);
@@ -855,7 +1102,7 @@
       }
 
       .light-gray-text {
-        color: var(--neutral-70);
+        color: var(--content-secondary);
         font-size: var(--font-size-02); // 14px
         line-height: var(--line-height-02);
       }
@@ -870,6 +1117,7 @@
           list-style-type: none;
           padding-left: 0;
           margin-bottom: unset;
+
           li {
             display: flex;
             margin-top: var(--spacing-05);
@@ -880,7 +1128,7 @@
           margin-top: var(--spacing-08);
           width: 100%;
 
-          .btn-block + .btn-block {
+          .plans-cta + .plans-cta {
             margin-top: var(--spacing-04);
           }
         }
@@ -894,11 +1142,12 @@
 
   .plans-features-table-section-container-mobile {
     margin-top: var(--spacing-13);
+
     .plans-features-section-heading-mobile {
       font-size: var(--font-size-06);
       font-weight: 600;
       line-height: var(--line-height-05);
-      color: var(--neutral-90);
+      color: var(--content-primary);
       text-align: center;
       margin-bottom: var(--spacing-08);
     }
@@ -929,13 +1178,13 @@
           .plans-features-table-header-item-content-mobile {
             padding: var(--spacing-04);
             text-align: center;
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
           }
 
           .plans-group-features-table-header-item-content-mobile {
             padding: var(--spacing-04);
             text-align: center;
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
             height: 64px;
             display: flex;
             justify-content: center;
@@ -943,7 +1192,7 @@
           }
 
           .plans-features-table-header-item-title-mobile {
-            color: var(--neutral-90);
+            color: var(--content-primary);
             line-height: var(--line-height-03);
             font-weight: 600;
             font-size: var(--font-size-03);
@@ -951,7 +1200,7 @@
 
           .plans-features-table-header-item-price-mobile {
             font-weight: 400;
-            color: var(--neutral-70);
+            color: var(--content-secondary);
             line-height: var(--line-height-01);
             font-size: var(--spacing-05);
           }
@@ -968,7 +1217,12 @@
 
         .plans-features-table-header-item-content-mobile.highlighted,
         .plans-group-features-table-header-item-content-mobile.highlighted {
-          .highlighted-styles;
+          background-color: var(--neutral-80);
+
+          .plans-features-table-header-item-title-mobile,
+          .plans-features-table-header-item-price-mobile {
+            color: var(--white);
+          }
         }
       }
 
@@ -981,11 +1235,12 @@
           font-weight: 600;
           text-align: center;
           line-height: var(--line-height-03);
+
           .plans-features-table-row-section-heading-content-mobile {
             padding-top: var(--spacing-08);
             padding-bottom: var(--spacing-05);
             font-size: var(--font-size-04);
-            color: var(--neutral-90);
+            color: var(--content-primary);
           }
         }
 
@@ -993,7 +1248,7 @@
         .plans-features-table-row-title-mobile {
           &.plans-features-table-row-title-mobile-without-heading {
             &:nth-child(4n - 3) {
-              background-color: var(--neutral-10);
+              background-color: var(--bg-light-secondary);
             }
 
             &:nth-child(4n - 1) {
@@ -1002,7 +1257,7 @@
           }
 
           &:nth-child(4n - 2) {
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
           }
 
           &:nth-child(4n) {
@@ -1016,6 +1271,7 @@
             padding-top: var(--spacing-06);
             font-weight: 600;
             line-height: var(--line-height-03);
+
             .plans-features-table-row-title-accordion {
               display: flex;
               justify-content: center;
@@ -1023,6 +1279,7 @@
               align-items: center;
               text-align: center;
               padding: 0 var(--spacing-04);
+
               .plans-features-table-row-title-accordion-header {
                 font-size: var(--font-size-03);
                 font-weight: 600;
@@ -1031,6 +1288,7 @@
                 justify-content: center;
                 background-color: unset;
                 border: unset;
+
                 .plans-features-table-row-title-accordion-icon {
                   display: flex;
                   align-items: center;
@@ -1045,6 +1303,7 @@
                   }
                 }
               }
+
               .plans-features-table-row-title-accordion-body {
                 font-size: var(--font-size-01);
                 line-height: var(--line-height-01);
@@ -1057,7 +1316,7 @@
         .plans-features-table-row-mobile {
           &.plans-features-table-row-mobile-without-heading {
             &:nth-child(4n - 2) {
-              background-color: var(--neutral-10);
+              background-color: var(--bg-light-secondary);
             }
 
             &:nth-child(4n) {
@@ -1070,7 +1329,7 @@
           }
 
           &:nth-child(4n - 1) {
-            background-color: var(--neutral-10);
+            background-color: var(--bg-light-secondary);
           }
 
           .plans-features-table-cell-content-mobile {
@@ -1107,16 +1366,19 @@
   .only-show-for-specific-plan-type {
     display: none;
   }
+
   &[data-ol-current-plan-type='group'] {
     .show-for-plan-type-group {
       display: block;
     }
   }
+
   &[data-ol-current-plan-type='individual'] {
     .show-for-plan-type-individual {
       display: block;
     }
   }
+
   &[data-ol-current-plan-type='student'] {
     .show-for-plan-type-student {
       display: block;
@@ -1126,11 +1388,13 @@
   .only-show-for-specific-plan-period {
     display: none;
   }
+
   &[data-ol-current-plan-period='annual'] {
     .show-for-plan-period-annual {
       display: block;
     }
   }
+
   &[data-ol-current-plan-period='monthly'] {
     .show-for-plan-period-monthly {
       display: block;
@@ -1139,7 +1403,7 @@
 }
 
 .plans-overleaf-common-request {
-  color: var(--neutral-90);
+  color: var(--content-primary);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1147,7 +1411,7 @@
   text-align: center;
   gap: var(--spacing-06);
 
-  @media (max-width: @screen-xs-max) {
+  @include media-breakpoint-down(md) {
     flex-direction: column;
     margin: 0;
   }
@@ -1163,13 +1427,14 @@
     text-align: center;
     margin-bottom: var(--spacing-10);
 
-    @media (max-width: @screen-xs-max) {
+    @include media-breakpoint-down(md) {
       text-align: unset;
     }
   }
 
   .plans-faq-support {
     margin-top: var(--spacing-06);
+    margin-bottom: var(--spacing-06);
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -1196,7 +1461,7 @@
 }
 
 .plans-new-design.plans-interstitial-new-design {
-  padding-top: var(--header-height);
+  padding-top: $header-height;
   padding-bottom: var(--spacing-09);
 
   .plans-interstitial-new-content {
@@ -1208,81 +1473,28 @@
   .plans-new-table {
     th,
     td {
-      width: @table-5-column-width;
+      width: $table-5-column-width;
     }
   }
 }
 
-/// Toggle for monthly/annual toggle for period-toggle-improvements test
-/// Based on toggle in light-touch-redesign
-.monthly-annual-switch {
-  color: var(--neutral-90);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  margin-top: var(--spacing-09);
-  margin-bottom: var(--spacing-13);
+.plans-cta {
+  display: block;
 
-  .plans-new-discount-label {
-    margin-left: var(--spacing-04);
-    color: var(--green-50);
+  a {
+    display: block;
   }
+}
 
-  @media (max-width: @screen-xs-max) {
-    margin-top: var(--spacing-08);
+.plans-faq-tabs {
+  max-width: 800px;
+  margin: 0 auto;
+
+  .nav-tabs-container {
     margin-bottom: var(--spacing-08);
   }
 
-  label {
-    position: relative;
-    display: inline-block;
-    width: 34px;
-    height: @plans-m-a-new-switch-height;
-    margin-right: var(--spacing-05);
-    margin-bottom: 0;
-
-    input {
-      opacity: 0;
-      width: 0;
-      height: 0;
-    }
-
-    input + span {
-      background-color: var(--neutral-70);
-    }
-
-    input:checked + span {
-      background-color: var(--green-50);
-    }
-
-    input:checked + span::before {
-      transform: translateX(14px);
-    }
-
-    span {
-      position: absolute;
-      cursor: pointer;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      transition: 0.4s;
-      border-radius: @plans-m-a-new-switch-height;
-
-      &::before {
-        position: absolute;
-        content: '';
-        height: @plans-m-a-new-switch-height - @plans-m-a-switch-padding -
-          @plans-m-a-switch-padding;
-        width: @plans-m-a-new-switch-height - @plans-m-a-switch-padding -
-          @plans-m-a-switch-padding;
-        left: @plans-m-a-switch-padding;
-        bottom: @plans-m-a-switch-padding;
-        background-color: @white;
-        transition: 0.4s;
-        border-radius: 50%;
-      }
-    }
+  .tab-content {
+    margin-top: 0;
   }
 }
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/project-list-ds-nav.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/project-list-ds-nav.scss
index e87c41f22f..93ab22866f 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/project-list-ds-nav.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/project-list-ds-nav.scss
@@ -105,9 +105,8 @@
         > .dropdown-menu {
           // navbar + new-project spacing + new-project button height (36px) + extra padding
           max-height: calc(
-            100vh - #{$header-height} - var(--spacing-03) - var(--spacing-08) - 36px - var(
-                --spacing-05
-              )
+            100vh - #{$header-height} - var(--spacing-03) - var(--spacing-08) -
+              36px - var(--spacing-05)
           );
           overflow: auto;
         }
@@ -256,6 +255,12 @@
       display: flex;
       flex-direction: column;
 
+      > * {
+        @include media-breakpoint-up(md) {
+          border-left: 1px solid var(--border-divider);
+        }
+      }
+
       .project-ds-nav-content {
         flex-grow: 1;
         overflow-y: auto;
@@ -264,10 +269,20 @@
 
         @include media-breakpoint-up(md) {
           border-top-left-radius: var(--border-radius-large);
-          border-left: 1px solid var(--border-divider);
           border-top: 1px solid var(--border-divider);
         }
       }
+
+      .cookie-banner {
+        position: static;
+        background-color: var(--bg-light-primary);
+
+        // Remove the parts of the shadow that stick out of the sides
+        clip-path: inset(-13px 0 0 0);
+
+        // Prevent the cookie banner being overlaid on top of the navigation
+        z-index: auto;
+      }
     }
   }
 
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/project-list.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/project-list.scss
index 6f93dbf454..1bf487eeca 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/project-list.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/project-list.scss
@@ -85,7 +85,7 @@
       }
 
       &:hover {
-        background-color: $bg-light-secondary;
+        background-color: var(--bg-light-secondary);
       }
 
       .welcome-message-card-img {
@@ -384,6 +384,8 @@ ul.project-list-filters {
 
   .dash-cell-owner {
     width: 20%;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 
   .dash-cell-date {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/register.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/register.scss
index 85711e1609..90a90f32ce 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/register.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/register.scss
@@ -1,3 +1,8 @@
+.registration-message {
+  text-align: center;
+  padding-bottom: var(--spacing-07);
+}
+
 .register-container {
   h1 {
     @include heading-sm;
@@ -33,9 +38,6 @@
       }
 
       .registration-message {
-        text-align: center;
-        padding-bottom: var(--spacing-07);
-
         .registration-message-heading {
           color: var(--neutral-70);
           font-size: var(--font-size-05);
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss
index ed2acdf5b5..cc01e1abd2 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss
@@ -182,10 +182,6 @@
 
       h4 {
         margin-bottom: var(--spacing-06);
-
-        &:has(+ .payment-nudge-annual-button) {
-          margin-bottom: 0;
-        }
       }
 
       .features-list {
@@ -452,16 +448,6 @@
   }
 }
 
-.payment-nudge-annual-button {
-  margin: var(--spacing-02) 0 var(--spacing-06) 0;
-
-  @include body-sm;
-
-  button {
-    padding: 0;
-  }
-}
-
 .add-on-card {
   display: flex;
   align-items: center;
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/templates-v2.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/templates-v2.scss
index a829bb80d5..18c31acdd6 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/templates-v2.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/templates-v2.scss
@@ -23,6 +23,37 @@
 .gallery {
   padding-top: calc($header-height + var(--spacing-10)) !important;
 
+  .gallery-search-form-control {
+    padding-top: 0px;
+    padding-bottom: 0px;
+  }
+   
+
+  .gallery-header-sort-btn {
+    font-size: var(--font-size-02);
+    border: 0;
+    text-align: left;
+    color: var(--neutral-90);
+    background-color: transparent;
+    padding: 0;
+    font-weight: bold;
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-decoration: none;
+
+    &:hover {
+      color: var(--neutral-90);
+      text-decoration: underline;
+    }
+
+    .material-symbols {
+      vertical-align: top;
+      font-size: var(--font-size-05);
+    }
+  }
+
+
   .gallery-tagged-tags-container-spacing {
     padding: 0 var(--spacing-09);
     margin-bottom: var(--spacing-16);
@@ -47,11 +78,11 @@
       text-decoration: none;
 
       &:visited {
-        color: var(--green-50);
+        color: var(--link-web-visited);
       }
 
       &:hover {
-        color: var(--green-60);
+        color: var(--link-web-hover);
       }
 
       &.active {
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/try-premium.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/try-premium.scss
new file mode 100644
index 0000000000..339fb364bd
--- /dev/null
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/try-premium.scss
@@ -0,0 +1,42 @@
+.try-premium-page {
+  .try-premium-logo-container {
+    padding: 0 var(--spacing-08);
+    display: flex;
+    justify-content: space-evenly;
+  }
+
+  .try-premium-third-party-logo {
+    width: 36px;
+    height: 36px;
+  }
+
+  .try-premium-page-list-wrapper {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding-bottom: var(--spacing-06);
+  }
+
+  .try-premium-page-list {
+    padding-inline-start: 0;
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+
+    @include media-breakpoint-up(sm) {
+      flex-direction: row;
+      justify-content: space-between;
+      width: 100%;
+      max-width: 500px;
+    }
+
+    ul {
+      margin-bottom: 0;
+      width: 300px;
+
+      @include media-breakpoint-up(sm) {
+        width: unset;
+      }
+    }
+  }
+}
diff --git a/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss b/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
index bdd168a519..2aecaa8390 100644
--- a/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
+++ b/services/web/frontend/stylesheets/bootstrap-5/pages/website-redesign.scss
@@ -58,7 +58,7 @@
       @include box-shadow-button-input;
     }
 
-    i {
+    .material-symbols {
       vertical-align: middle;
       margin-left: var(--spacing-02);
       padding-bottom: 3px;
@@ -258,16 +258,637 @@
   .round-background {
     border-radius: 50%;
     vertical-align: middle;
+    margin-right: var(--spacing-04);
     width: 20px;
     height: 20px;
   }
 
+  .centered-block {
+    @include media-breakpoint-up(lg) {
+      text-align: center;
+    }
+  }
+
+  .header-description {
+    p {
+      font-size: var(--font-size-05);
+      line-height: var(--line-height-03);
+      margin-bottom: 0;
+
+      @include media-breakpoint-down(lg) {
+        font-size: var(--font-size-04);
+        line-height: var(--line-height-02);
+      }
+    }
+  }
+
+  .resources {
+    @include media-breakpoint-up(lg) {
+      display: flex;
+
+      /* equal heights */
+      flex-wrap: wrap;
+    }
+
+    .resources-card {
+      display: flex;
+      flex-flow: column wrap;
+      margin-bottom: var(--spacing-11);
+      align-content: flex-start;
+
+      @include media-breakpoint-down(lg) {
+        margin-bottom: var(--spacing-06);
+      }
+
+      img {
+        width: 56px;
+      }
+
+      h3 {
+        width: 100%;
+        font-size: var(--font-size-05);
+      }
+
+      a {
+        margin-top: auto;
+
+        @include heading-xs;
+      }
+
+      p {
+        margin-bottom: var(--spacing-05);
+      }
+    }
+  }
+
   .green-round-background {
     @extend .round-background;
 
     background: var(--green-30);
   }
 
+  .why-latex {
+    h1 {
+      margin-top: var(--spacing-08);
+    }
+
+    .sub-heading {
+      font-size: var(--font-size-04);
+    }
+  }
+
+  .info-cards {
+    padding: 0;
+
+    @include media-breakpoint-up(lg) {
+      display: flex;
+
+      /* equal heights */
+      flex-wrap: wrap;
+    }
+
+    .info-card-container {
+      margin-bottom: var(--spacing-06);
+      padding-left: var(--spacing-06);
+      padding-right: var(--spacing-06);
+
+      h3 {
+        font-size: var(--font-size-05);
+        line-height: var(--line-height-04);
+      }
+
+      .info-card {
+        border-radius: 8px;
+        height: 100%;
+        box-shadow:
+          0 2px 4px 0 #1e253014,
+          0 4px 12px 0 #1e25301f;
+        border-top: 8px solid var(--sapphire-blue);
+        padding: var(--spacing-09) var(--spacing-10);
+
+        &.info-card-big-text {
+          h3 {
+            font-size: var(--font-size-06);
+            line-height: var(--line-height-02);
+          }
+
+          p {
+            font-size: var(--font-size-04);
+            line-height: var(--line-height-02);
+          }
+        }
+
+        .material-symbols {
+          color: var(--sapphire-blue);
+        }
+      }
+    }
+  }
+
+  .inline-green-link {
+    color: var(--link-web);
+    padding: 0;
+    text-decoration: underline;
+
+    // text-decoration-skip-ink is for letters with descenders (like 'g' and 'y')
+    // this will force underline to not skip the descender
+    text-decoration-skip-ink: none;
+
+    &:hover {
+      color: var(--link-web-hover);
+    }
+
+    // TODO: this is copied directly from the `.less` file, migrate this to scss
+    // &:focus {
+    //   @extend .input-focus-style;
+    // }
+  }
+
+  .customer-story-card-title {
+    @include heading-md;
+
+    margin-top: var(--spacing-08);
+    margin-bottom: var(--spacing-05);
+  }
+
+  .plans-bottom-text {
+    font-size: var(--font-size-04);
+  }
+
+  .plans-cards {
+    @include media-breakpoint-up(lg) {
+      display: flex;
+    }
+
+    .plans-card-container {
+      min-height: 348px;
+      padding-left: var(--spacing-05);
+      padding-right: var(--spacing-05);
+
+      @include media-breakpoint-down(lg) {
+        margin-bottom: var(--spacing-06);
+        min-height: unset;
+      }
+    }
+
+    .plans-card {
+      border-radius: 8px;
+      padding: 0;
+      height: 100%;
+
+      .plans-card-inner {
+        padding: var(--spacing-09);
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        font-size: var(--font-size-03);
+
+        .plans-card-inner-title {
+          font-size: var(--font-size-05);
+          line-height: var(--line-height-04);
+          font-weight: 600;
+          margin-top: 0;
+        }
+
+        ul {
+          list-style-type: none;
+          padding: 0;
+          margin: 0;
+
+          li {
+            margin-bottom: var(--spacing-04);
+          }
+        }
+
+        .plans-card-inner-footer {
+          margin-top: auto;
+          display: flex;
+          flex-direction: column;
+          gap: var(--spacing-05);
+
+          @include media-breakpoint-down(lg) {
+            margin-top: var(--spacing-06);
+          }
+        }
+      }
+
+      &.grey-border {
+        border: 2px solid var(--neutral-20);
+      }
+
+      &.blue-border {
+        border: solid 2px var(--sapphire-blue);
+        border-radius: 8px;
+
+        .plans-card-inner-title {
+          color: var(--sapphire-blue);
+        }
+      }
+    }
+  }
+
+  .heading-section-md-align-left {
+    h2,
+    p {
+      text-align: center;
+    }
+
+    @include media-breakpoint-down(lg) {
+      display: flex;
+      flex-direction: column;
+      align-items: baseline;
+
+      h2 {
+        text-align: left;
+      }
+
+      p {
+        text-align: left;
+      }
+    }
+  }
+
+  .responsive-button-container {
+    display: flex;
+    margin-top: var(--spacing-08);
+    gap: var(--spacing-06);
+
+    &.centered-buttons {
+      justify-content: center;
+    }
+
+    &.align-left-button-sm {
+      @include media-breakpoint-down(lg) {
+        justify-content: start;
+      }
+    }
+
+    @include media-breakpoint-down(md) {
+      width: 100%;
+      flex-direction: column;
+    }
+  }
+
+  .editor-pdf-video {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 585px;
+    padding: 0 var(--spacing-06);
+
+    @include media-breakpoint-down(lg) {
+      height: auto;
+    }
+
+    video {
+      box-shadow: 0 60px 25px -15px rgb(16 24 40 / 20%);
+      max-height: 100%;
+      width: auto;
+
+      @include media-breakpoint-down(lg) {
+        width: 100%;
+      }
+    }
+  }
+
+  .lime-color-text {
+    color: var(--green-bright);
+  }
+
+  .customer-story-content {
+    .table-of-contents-section {
+      padding-right: var(--spacing-13);
+
+      @include media-breakpoint-down(lg) {
+        display: none;
+      }
+
+      .table-of-contents {
+        border-top: 1px solid var(--neutral-30);
+        border-bottom: 1px solid var(--neutral-30);
+        padding: var(--spacing-09) 0;
+
+        .heading {
+          @include heading-xs;
+
+          font-weight: 600;
+          color: var(--green-60);
+        }
+
+        li {
+          list-style: none;
+          padding-top: var(--spacing-06);
+          font-weight: 500;
+
+          a {
+            text-decoration: none;
+            color: var(--neutral-70);
+          }
+        }
+      }
+    }
+
+    .customer-story-layout-card {
+      p {
+        @include heading-xs;
+      }
+    }
+
+    .story-details-section {
+      h3 {
+        @include heading-lg;
+
+        margin-top: 0;
+      }
+
+      .customer-story-list-padding {
+        padding-left: var(--spacing-10);
+      }
+
+      .card-gray {
+        padding: var(--spacing-08);
+      }
+
+      .at-glance-section {
+        padding-top: var(--spacing-08);
+
+        p {
+          margin-top: var(--spacing-06);
+        }
+      }
+
+      p {
+        font-size: var(--font-size-04);
+      }
+
+      .border-r-16 {
+        border-radius: 16px;
+      }
+
+      .introduction-image-caption {
+        padding-top: var(--spacing-06);
+      }
+
+      .stats-card {
+        display: flex;
+        flex-direction: row;
+        padding: var(--spacing-09);
+        border-radius: 16px;
+        background: var(--dark-jungle-green);
+        color: var(--white);
+
+        @include media-breakpoint-down(lg) {
+          flex-direction: column;
+        }
+
+        .stats {
+          h3 {
+            font-size: 2rem;
+            font-weight: 600;
+          }
+
+          p {
+            font-weight: 600;
+            height: 50px;
+          }
+        }
+      }
+    }
+
+    .customer-quote {
+      border-left: 2px solid var(--green-60);
+      padding-left: var(--spacing-06);
+
+      blockquote {
+        color: var(--neutral-90);
+
+        @include heading-md;
+      }
+
+      p {
+        margin-top: var(--spacing-06);
+        font-size: var(--font-size-04);
+      }
+    }
+  }
+
+  // most of these are here to replace rules from core/type.less
+  blockquote.cms-quote {
+    @include heading-lg;
+
+    border-left: none;
+    font-weight: 600;
+    quotes: '\201C' '\201D'; // override default quotes
+    padding: unset;
+    margin: unset;
+    font-family: 'Noto Sans', sans-serif;
+
+    &::after {
+      visibility: visible;
+      display: inline;
+      margin-left: 1px; // it's too tight to the text otherwise
+      content: close-quote;
+    }
+
+    &::before {
+      color: inherit;
+      margin-right: 0;
+      vertical-align: 0;
+      content: open-quote;
+    }
+
+    &::after,
+    &::before {
+      @include heading-lg;
+    }
+
+    @include media-breakpoint-down(lg) {
+      @include heading-md;
+
+      &::after,
+      &::before {
+        visibility: visible;
+
+        @include heading-md;
+      }
+    }
+  }
+
+  .cta-card-individual-customer {
+    display: flex;
+    justify-content: space-between;
+    padding: var(--spacing-13);
+    background-size: cover;
+    color: var(--white);
+    border-radius: 8px;
+
+    @include media-breakpoint-down(lg) {
+      padding: var(--spacing-11) var(--spacing-08);
+    }
+
+    h2 {
+      font-size: var(--font-size-07);
+      color: var(--white);
+    }
+
+    p {
+      font-size: 1.125rem;
+    }
+
+    .btn-container {
+      padding-top: 10px;
+      display: flex;
+      justify-content: center;
+      align-items: flex-start;
+    }
+  }
+
+  .customer-stories-hero-heading {
+    @include media-breakpoint-down(lg) {
+      @include heading-xl;
+    }
+  }
+
+  .customer-stories-logos-text {
+    font-size: var(--font-size-05);
+  }
+
+  .customer-stories-hero-text {
+    font-size: var(--font-size-05);
+  }
+
+  .overleaf-sticker {
+    width: unset;
+
+    @include media-breakpoint-down(lg) {
+      width: 106px;
+    }
+  }
+
+  .organization-logos-container {
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+
+    @include media-breakpoint-down(xl) {
+      flex-wrap: wrap;
+      gap: 30px;
+    }
+
+    .organization-logo {
+      object-fit: contain;
+      max-height: 62px;
+
+      &.samsung-logo {
+        max-height: 110px;
+        height: 110px;
+      }
+
+      @include media-breakpoint-down(xl) {
+        max-height: 40px;
+        flex-basis: 34%;
+      }
+    }
+  }
+
+  .integrations-card {
+    display: flex;
+
+    /* for center align */
+    flex-wrap: wrap;
+    align-items: center;
+
+    .integrations-icons {
+      img {
+        width: 6rem; // 96px
+        height: 6rem; // 96px
+      }
+
+      .first-row,
+      .second-row {
+        display: flex;
+      }
+
+      .first-row {
+        justify-content: space-between;
+      }
+
+      .second-row {
+        margin-top: var(--spacing-10);
+        justify-content: space-evenly;
+      }
+    }
+  }
+
+  .security-info {
+    .security-info-first-row {
+      margin-bottom: var(--spacing-09);
+
+      @include media-breakpoint-down(lg) {
+        margin-bottom: 0;
+      }
+    }
+
+    .security-info-item {
+      @include media-breakpoint-down(lg) {
+        margin-bottom: var(--spacing-06);
+      }
+    }
+
+    h3 {
+      @include heading-sm;
+    }
+  }
+
+  .security-heading-section {
+    @include media-breakpoint-down(lg) {
+      p {
+        text-align: left;
+      }
+
+      h2 {
+        width: 100%;
+        text-align: left;
+      }
+    }
+
+    .heading-and-stickers-container {
+      display: flex;
+      justify-content: center;
+      position: relative;
+
+      .lock-sticker {
+        width: 70px;
+        position: absolute;
+        top: -95px;
+        right: -50px;
+
+        @include media-breakpoint-down(xl) {
+          right: -105px;
+        }
+
+        @include media-breakpoint-down(lg) {
+          display: none;
+        }
+      }
+
+      .arrow-sticker {
+        width: 140px;
+        position: absolute;
+        top: -50px;
+        right: -15px;
+
+        @include media-breakpoint-down(xl) {
+          right: -70px;
+        }
+
+        @include media-breakpoint-down(lg) {
+          display: none;
+        }
+      }
+    }
+  }
+
   .features-card {
     display: flex; /* equal heights */
     flex-wrap: wrap;
@@ -367,4 +988,139 @@
       }
     }
   }
+
+  .features-card-hero {
+    display: flex;
+
+    /* equal heights */
+    flex-wrap: wrap;
+    align-items: center;
+    position: relative;
+    height: 655px;
+
+    // padding-top: @line-height-computed * 2;
+
+    @include media-breakpoint-down(lg) {
+      height: unset;
+      padding-top: 0;
+    }
+
+    .features-card-description {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+
+      h1 {
+        &.features-card-hero-smaller-title {
+          @include media-breakpoint-up(xl) {
+            // 3rem is the default, this is a workaround for big screen
+            // since 6-width column on md screen size will wrap the text in three lines
+            font-size: var(--font-size-09);
+          }
+        }
+      }
+
+      p {
+        font-size: var(--font-size-05);
+        width: 90%;
+
+        @include media-breakpoint-down(lg) {
+          font-size: var(--font-size-04);
+          line-height: var(--line-height-03);
+          width: unset;
+        }
+      }
+    }
+
+    .features-card-image {
+      position: absolute;
+
+      // on wide screen, image will be fixed without any variable width translation
+      transform: translateX(600px);
+      top: 100px;
+      width: 720px;
+      height: auto;
+      padding: 0 15px;
+
+      // starting from 1500px, image will have a variable translation that depends on screen width
+      // this will make image "fixed" on a specific point on the screen
+      @media (width <= 1500px) {
+        transform: translateX(calc(50vw - 121px));
+      }
+
+      @media (width <= 1400px) {
+        width: 650px;
+        transform: translateX(calc(50vw - 52px));
+      }
+
+      // bootstrap layout changes on 1200px (@screen-lg), add a specific
+      // case for this exact width
+      @media (width >= 1200px) and (width <= 1200px) {
+        width: 600px;
+        transform: translateX(calc(50vw));
+      }
+
+      @media (width <= 1199px) {
+        width: 600px;
+        transform: translateX(calc(50vw - 106px));
+      }
+
+      @media (width <= 1100px) {
+        width: 550px;
+        transform: translateX(calc(50vw - 55px));
+      }
+
+      // 991px
+      @include media-breakpoint-down(lg) {
+        position: relative;
+        transform: none;
+        top: 0;
+        width: 100%;
+        margin-bottom: var(--spacing-11);
+        padding: var(--spacing-09) 0 0 0;
+      }
+
+      img.img-responsive {
+        width: 100%;
+      }
+    }
+
+    .sticky-tags {
+      position: absolute;
+      z-index: 2;
+      height: 160px;
+      bottom: -105px;
+      right: 55px;
+
+      @media (width <= 1400px) {
+        height: 150px;
+        bottom: -103px;
+        right: 47px;
+      }
+
+      @media (width <= 1200px) {
+        height: 130px;
+        bottom: -87px;
+      }
+
+      @media (width <= 1100px) {
+        height: 120px;
+        bottom: -81px;
+      }
+
+      // 991px
+      @include media-breakpoint-down(lg) {
+        height: 130px;
+        bottom: -75px;
+        right: 70px;
+      }
+
+      // 767px
+      @include media-breakpoint-down(md) {
+        height: 24%;
+        bottom: -10vw; // scale with width
+        right: 9.5vw; // scale with width
+      }
+    }
+  }
 }
diff --git a/services/web/frontend/stylesheets/components/card.less b/services/web/frontend/stylesheets/components/card.less
index 67e7bfc512..78031e2c30 100644
--- a/services/web/frontend/stylesheets/components/card.less
+++ b/services/web/frontend/stylesheets/components/card.less
@@ -146,7 +146,8 @@
     padding: var(--spacing-13);
     text-align: center;
     background-size: cover;
-    background-image: linear-gradient(
+    background-image:
+      linear-gradient(
         to right,
         rgba(0, 0, 0, 0.4) 0%,
         var(--dark-jungle-green) 25%,
@@ -176,7 +177,8 @@
     color: var(--white);
     padding: var(--spacing-13);
     background-size: cover;
-    background-image: linear-gradient(
+    background-image:
+      linear-gradient(
         to right,
         rgba(0, 0, 0, 0.4) 0%,
         var(--dark-jungle-green) 20%,
diff --git a/services/web/frontend/stylesheets/components/daterange-picker.less b/services/web/frontend/stylesheets/components/daterange-picker.less
deleted file mode 100644
index 43e0e3ba55..0000000000
--- a/services/web/frontend/stylesheets/components/daterange-picker.less
+++ /dev/null
@@ -1,656 +0,0 @@
-//
-// A stylesheet for use with Bootstrap 3.x
-// @author: Dan Grossman http://www.dangrossman.info/
-// @copyright: Copyright (c) 2012-2015 Dan Grossman. All rights reserved.
-// @license: Licensed under the MIT license. See http://www.opensource.org/licenses/mit-license.php
-// @website: https://www.improvely.com/
-//
-
-//
-// VARIABLES
-//
-
-//
-// Settings
-
-// The class name to contain everything within.
-@arrow-size: 7px;
-
-//
-// Colors
-@daterangepicker-color: @brand-primary;
-@daterangepicker-bg-color: #fff;
-
-@daterangepicker-cell-color: @daterangepicker-color;
-@daterangepicker-cell-border-color: transparent;
-@daterangepicker-cell-bg-color: @daterangepicker-bg-color;
-
-@daterangepicker-cell-hover-color: @daterangepicker-color;
-@daterangepicker-cell-hover-border-color: @daterangepicker-cell-border-color;
-@daterangepicker-cell-hover-bg-color: #eee;
-
-@daterangepicker-in-range-color: #000;
-@daterangepicker-in-range-border-color: transparent;
-@daterangepicker-in-range-bg-color: #ebf4f8;
-
-@daterangepicker-active-color: #fff;
-@daterangepicker-active-bg-color: #138a07;
-@daterangepicker-active-border-color: transparent;
-
-@daterangepicker-unselected-color: #999;
-@daterangepicker-unselected-border-color: transparent;
-@daterangepicker-unselected-bg-color: #fff;
-
-//
-// daterangepicker
-@daterangepicker-width: 278px;
-@daterangepicker-padding: 4px;
-@daterangepicker-z-index: 3000;
-
-@daterangepicker-border-size: 1px;
-@daterangepicker-border-color: #ccc;
-@daterangepicker-border-radius: 4px;
-
-//
-// Calendar
-@daterangepicker-calendar-margin: @daterangepicker-padding;
-@daterangepicker-calendar-bg-color: @daterangepicker-bg-color;
-
-@daterangepicker-calendar-border-size: 1px;
-@daterangepicker-calendar-border-color: @daterangepicker-bg-color;
-@daterangepicker-calendar-border-radius: @daterangepicker-border-radius;
-
-//
-// Calendar Cells
-@daterangepicker-cell-size: 20px;
-@daterangepicker-cell-width: @daterangepicker-cell-size;
-@daterangepicker-cell-height: @daterangepicker-cell-size;
-
-@daterangepicker-cell-border-radius: @daterangepicker-calendar-border-radius;
-@daterangepicker-cell-border-size: 1px;
-
-//
-// Dropdowns
-@daterangepicker-dropdown-z-index: @daterangepicker-z-index + 1;
-
-//
-// Controls
-@daterangepicker-control-height: 30px;
-@daterangepicker-control-line-height: @daterangepicker-control-height;
-@daterangepicker-control-color: #555;
-
-@daterangepicker-control-border-size: 1px;
-@daterangepicker-control-border-color: #ccc;
-@daterangepicker-control-border-radius: 4px;
-
-@daterangepicker-control-active-border-size: 1px;
-@daterangepicker-control-active-border-color: @brand-primary;
-@daterangepicker-control-active-border-radius: @daterangepicker-control-border-radius;
-
-@daterangepicker-control-disabled-color: #ccc;
-
-//
-// Ranges
-@daterangepicker-ranges-color: @brand-primary;
-@daterangepicker-ranges-bg-color: daterangepicker-ranges-color;
-
-@daterangepicker-ranges-border-size: 1px;
-@daterangepicker-ranges-border-color: @daterangepicker-ranges-bg-color;
-@daterangepicker-ranges-border-radius: @daterangepicker-border-radius;
-
-@daterangepicker-ranges-hover-color: #fff;
-@daterangepicker-ranges-hover-bg-color: @daterangepicker-ranges-color;
-@daterangepicker-ranges-hover-border-size: @daterangepicker-ranges-border-size;
-@daterangepicker-ranges-hover-border-color: @daterangepicker-ranges-hover-bg-color;
-@daterangepicker-ranges-hover-border-radius: @daterangepicker-border-radius;
-
-@daterangepicker-ranges-active-border-size: @daterangepicker-ranges-border-size;
-@daterangepicker-ranges-active-border-color: @daterangepicker-ranges-bg-color;
-@daterangepicker-ranges-active-border-radius: @daterangepicker-border-radius;
-
-//
-// STYLESHEETS
-//
-.daterangepicker {
-  position: absolute;
-  color: @daterangepicker-color;
-  background-color: @daterangepicker-bg-color;
-  border-radius: @daterangepicker-border-radius;
-  width: @daterangepicker-width;
-  padding: @daterangepicker-padding;
-  margin-top: @daterangepicker-border-size;
-
-  // TODO: Should these be parameterized??
-  // top: 100px;
-  // left: 20px;
-
-  @arrow-prefix-size: @arrow-size;
-  @arrow-suffix-size: (@arrow-size - @daterangepicker-border-size);
-
-  &:before,
-  &:after {
-    position: absolute;
-    display: inline-block;
-
-    border-bottom-color: rgba(0, 0, 0, 0.2);
-    content: '';
-  }
-
-  &:before {
-    top: -@arrow-prefix-size;
-
-    border-right: @arrow-prefix-size solid transparent;
-    border-left: @arrow-prefix-size solid transparent;
-    border-bottom: @arrow-prefix-size solid @daterangepicker-border-color;
-  }
-
-  &:after {
-    top: -@arrow-suffix-size;
-
-    border-right: @arrow-suffix-size solid transparent;
-    border-bottom: @arrow-suffix-size solid @daterangepicker-bg-color;
-    border-left: @arrow-suffix-size solid transparent;
-  }
-
-  &.opensleft {
-    &:before {
-      // TODO: Make this relative to prefix size.
-      right: @arrow-prefix-size + 2px;
-    }
-
-    &:after {
-      // TODO: Make this relative to suffix size.
-      right: @arrow-suffix-size + 4px;
-    }
-  }
-
-  &.openscenter {
-    &:before {
-      left: 0;
-      right: 0;
-      width: 0;
-      margin-left: auto;
-      margin-right: auto;
-    }
-
-    &:after {
-      left: 0;
-      right: 0;
-      width: 0;
-      margin-left: auto;
-      margin-right: auto;
-    }
-  }
-
-  &.opensright {
-    &:before {
-      // TODO: Make this relative to prefix size.
-      left: @arrow-prefix-size + 2px;
-    }
-
-    &:after {
-      // TODO: Make this relative to suffix size.
-      left: @arrow-suffix-size + 4px;
-    }
-  }
-
-  &.dropup {
-    margin-top: -5px;
-
-    // NOTE: Note sure why these are special-cased.
-    &:before {
-      top: initial;
-      bottom: -@arrow-prefix-size;
-      border-bottom: initial;
-      border-top: @arrow-prefix-size solid @daterangepicker-border-color;
-    }
-
-    &:after {
-      top: initial;
-      bottom: -@arrow-suffix-size;
-      border-bottom: initial;
-      border-top: @arrow-suffix-size solid @daterangepicker-bg-color;
-    }
-  }
-
-  &.dropdown-menu {
-    max-width: none;
-    z-index: @daterangepicker-dropdown-z-index;
-  }
-
-  &.single {
-    .ranges,
-    .calendar {
-      float: none;
-    }
-  }
-
-  /* Calendars */
-  &.show-calendar {
-    .calendar {
-      display: block;
-    }
-  }
-
-  .calendar {
-    display: none;
-    max-width: @daterangepicker-width - (@daterangepicker-calendar-margin * 2);
-    margin: @daterangepicker-calendar-margin;
-
-    &.single {
-      .calendar-table {
-        border: none;
-      }
-    }
-
-    th,
-    td {
-      white-space: nowrap;
-      text-align: center;
-
-      // TODO: Should this actually be hard-coded?
-      min-width: 32px;
-    }
-  }
-
-  .calendar-table {
-    border: @daterangepicker-calendar-border-size solid
-      @daterangepicker-calendar-border-color;
-    padding: @daterangepicker-calendar-margin;
-    border-radius: @daterangepicker-calendar-border-radius;
-    background-color: @daterangepicker-calendar-bg-color;
-  }
-
-  table {
-    width: 100%;
-    margin: 0;
-  }
-
-  td,
-  th {
-    text-align: center;
-    width: @daterangepicker-cell-width;
-    height: @daterangepicker-cell-height;
-    border-radius: @daterangepicker-cell-border-radius;
-    border: @daterangepicker-cell-border-size solid
-      @daterangepicker-cell-border-color;
-    white-space: nowrap;
-    cursor: pointer;
-
-    &.available {
-      &:hover {
-        background-color: @daterangepicker-cell-hover-bg-color;
-        border-color: @daterangepicker-cell-hover-border-color;
-        color: @daterangepicker-cell-hover-color;
-      }
-    }
-
-    &.week {
-      font-size: 80%;
-      color: #ccc;
-    }
-  }
-
-  td {
-    &.off {
-      &,
-      &.in-range,
-      &.start-date,
-      &.end-date {
-        background-color: @daterangepicker-unselected-bg-color;
-        border-color: @daterangepicker-unselected-border-color;
-        color: @daterangepicker-unselected-color;
-      }
-    }
-
-    //
-    // Date Range
-    &.in-range {
-      background-color: @daterangepicker-in-range-bg-color;
-      border-color: @daterangepicker-in-range-border-color;
-      color: @daterangepicker-in-range-color;
-
-      // TODO: Should this be static or should it be parameterized?
-      border-radius: 0;
-    }
-
-    &.start-date {
-      border-radius: @daterangepicker-cell-border-radius 0 0
-        @daterangepicker-cell-border-radius;
-    }
-
-    &.end-date {
-      border-radius: 0 @daterangepicker-cell-border-radius
-        @daterangepicker-cell-border-radius 0;
-    }
-
-    &.start-date.end-date {
-      border-radius: @daterangepicker-cell-border-radius;
-    }
-
-    &.active {
-      &,
-      &:hover {
-        background-color: @daterangepicker-active-bg-color;
-        border-color: @daterangepicker-active-border-color;
-        color: @daterangepicker-active-color;
-      }
-    }
-  }
-
-  th {
-    &.month {
-      width: auto;
-    }
-  }
-
-  //
-  // Disabled Controls
-  //
-  td,
-  option {
-    &.disabled {
-      color: #999;
-      cursor: not-allowed;
-      text-decoration: line-through;
-    }
-  }
-
-  select {
-    &.monthselect,
-    &.yearselect {
-      font-size: 12px;
-      padding: 1px;
-      height: auto;
-      margin: 0;
-      cursor: default;
-    }
-
-    &.monthselect {
-      margin-right: 2%;
-      width: 56%;
-    }
-
-    &.yearselect {
-      width: 40%;
-    }
-
-    &.hourselect,
-    &.minuteselect,
-    &.secondselect,
-    &.ampmselect {
-      width: 50px;
-      margin-bottom: 0;
-    }
-  }
-
-  //
-  // Text Input Controls (above calendar)
-  //
-  .input-mini {
-    border: @daterangepicker-control-border-size solid
-      @daterangepicker-control-border-color;
-    border-radius: @daterangepicker-control-border-radius;
-    color: @daterangepicker-control-color;
-    height: @daterangepicker-control-line-height;
-    line-height: @daterangepicker-control-height;
-    display: block;
-    vertical-align: middle;
-
-    // TODO: Should these all be static, too??
-    margin: 0 0 5px 0;
-    padding: 0 6px 0 28px;
-    width: 100%;
-
-    &.active {
-      border: @daterangepicker-control-active-border-size solid
-        @daterangepicker-control-active-border-color;
-      border-radius: @daterangepicker-control-active-border-radius;
-    }
-  }
-
-  .daterangepicker_input {
-    position: relative;
-    padding-left: 0;
-
-    i {
-      position: absolute;
-
-      // NOTE: These appear to be eyeballed to me...
-      left: 8px;
-      top: 10px;
-    }
-  }
-  &.rtl {
-    .input-mini {
-      padding-right: 28px;
-      padding-left: 6px;
-    }
-    .daterangepicker_input i {
-      left: auto;
-      right: 8px;
-    }
-  }
-
-  //
-  // Time Picker
-  //
-  .calendar-time {
-    text-align: center;
-    margin: 5px auto;
-    line-height: @daterangepicker-control-line-height;
-    position: relative;
-    padding-left: 28px;
-
-    select {
-      &.disabled {
-        color: @daterangepicker-control-disabled-color;
-        cursor: not-allowed;
-      }
-    }
-  }
-}
-
-//
-// Predefined Ranges
-//
-
-.ranges {
-  font-size: 11px;
-  float: none;
-  margin: 4px;
-  text-align: left;
-
-  ul {
-    list-style: none;
-    margin: 0 auto;
-    padding: 0;
-    width: 100%;
-  }
-
-  li {
-    font-size: 13px;
-    background-color: @daterangepicker-ranges-bg-color;
-    border: @daterangepicker-ranges-border-size solid
-      @daterangepicker-ranges-border-color;
-    border-radius: @daterangepicker-ranges-border-radius;
-    color: @daterangepicker-ranges-color;
-    padding: 3px 12px;
-    margin-bottom: 8px;
-    cursor: pointer;
-
-    &:hover {
-      background-color: @daterangepicker-ranges-hover-bg-color;
-      color: @daterangepicker-ranges-hover-color;
-    }
-
-    &.active {
-      background-color: @daterangepicker-ranges-hover-bg-color;
-      border: @daterangepicker-ranges-hover-border-size solid
-        @daterangepicker-ranges-hover-border-color;
-      color: @daterangepicker-ranges-hover-color;
-    }
-  }
-}
-
-/*  Larger Screen Styling */
-@media (min-width: 564px) {
-  .daterangepicker {
-    .glyphicon {
-      font-family: FontAwesome;
-    }
-    .glyphicon-chevron-left:before {
-      content: '\f053';
-    }
-    .glyphicon-chevron-right:before {
-      content: '\f054';
-    }
-    .glyphicon-calendar:before {
-      content: '\f073';
-    }
-
-    width: auto;
-
-    .ranges {
-      ul {
-        width: 160px;
-      }
-    }
-
-    &.single {
-      .ranges {
-        ul {
-          width: 100%;
-        }
-      }
-
-      .calendar.left {
-        clear: none;
-      }
-
-      &.ltr {
-        .ranges,
-        .calendar {
-          float: left;
-        }
-      }
-      &.rtl {
-        .ranges,
-        .calendar {
-          float: right;
-        }
-      }
-    }
-
-    &.ltr {
-      direction: ltr;
-      text-align: left;
-      .calendar {
-        &.left {
-          clear: left;
-          margin-right: 0;
-
-          .calendar-table {
-            border-right: none;
-            border-top-right-radius: 0;
-            border-bottom-right-radius: 0;
-          }
-        }
-
-        &.right {
-          margin-left: 0;
-
-          .calendar-table {
-            border-left: none;
-            border-top-left-radius: 0;
-            border-bottom-left-radius: 0;
-          }
-        }
-      }
-
-      .left .daterangepicker_input {
-        padding-right: 12px;
-      }
-
-      .calendar.left .calendar-table {
-        padding-right: 12px;
-      }
-
-      .ranges,
-      .calendar {
-        float: left;
-      }
-    }
-    &.rtl {
-      direction: rtl;
-      text-align: right;
-      .calendar {
-        &.left {
-          clear: right;
-          margin-left: 0;
-
-          .calendar-table {
-            border-left: none;
-            border-top-left-radius: 0;
-            border-bottom-left-radius: 0;
-          }
-        }
-
-        &.right {
-          margin-right: 0;
-
-          .calendar-table {
-            border-right: none;
-            border-top-right-radius: 0;
-            border-bottom-right-radius: 0;
-          }
-        }
-      }
-
-      .left .daterangepicker_input {
-        padding-left: 12px;
-      }
-
-      .calendar.left .calendar-table {
-        padding-left: 12px;
-      }
-
-      .ranges,
-      .calendar {
-        text-align: right;
-        float: right;
-      }
-    }
-  }
-}
-
-@media (min-width: 730px) {
-  /* force the calendar to display on one row */
-  &.show-calendar {
-    min-width: 658px; /* width of all contained elements, IE/Edge fallback */
-    width: -moz-max-content;
-    width: -webkit-max-content;
-    width: max-content;
-  }
-
-  .daterangepicker {
-    .ranges {
-      width: auto;
-    }
-    &.ltr {
-      .ranges {
-        float: left;
-        clear: none !important;
-      }
-    }
-    &.rtl {
-      .ranges {
-        float: right;
-      }
-    }
-
-    .calendar {
-      clear: none !important;
-    }
-  }
-}
diff --git a/services/web/frontend/stylesheets/components/footer.less b/services/web/frontend/stylesheets/components/footer.less
index b36f51ab11..e966d3a9dc 100644
--- a/services/web/frontend/stylesheets/components/footer.less
+++ b/services/web/frontend/stylesheets/components/footer.less
@@ -279,12 +279,12 @@ footer.site-footer {
     }
 
     .fat-footer-sections {
-      grid-template-columns: repeat(6, 1fr);
+      grid-template-columns: repeat(7, 1fr);
       grid-template-rows: auto;
     }
 
     .footer-section:last-of-type {
-      grid-column: 6;
+      grid-column: 7;
     }
   }
 }
diff --git a/services/web/frontend/stylesheets/components/navbar.less b/services/web/frontend/stylesheets/components/navbar.less
index 06c3346a35..1a329e3ce1 100755
--- a/services/web/frontend/stylesheets/components/navbar.less
+++ b/services/web/frontend/stylesheets/components/navbar.less
@@ -7,6 +7,11 @@
 // Provide a static navbar from which we expand to create full-width, fixed, and
 // other navbar variations.
 
+.no-scroll {
+  height: 100vh;
+  overflow: hidden;
+}
+
 .navbar {
   position: relative;
   min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
diff --git a/services/web/frontend/stylesheets/components/nvd3.less b/services/web/frontend/stylesheets/components/nvd3.less
index f1fea65901..542231cfdc 100755
--- a/services/web/frontend/stylesheets/components/nvd3.less
+++ b/services/web/frontend/stylesheets/components/nvd3.less
@@ -1,691 +1,691 @@
-/* nvd3 version 1.8.4 (https://github.com/novus/nvd3) 2016-07-03 */
-.nvd3 .nv-axis {
-  pointer-events: none;
-  opacity: 1;
-}
-
-.nvd3 .nv-axis path {
-  fill: none;
-  stroke: #000;
-  stroke-opacity: 0.75;
-  shape-rendering: crispEdges;
-}
-
-.nvd3 .nv-axis path.domain {
-  stroke-opacity: 0.75;
-}
-
-.nvd3 .nv-axis.nv-x path.domain {
-  stroke-opacity: 0;
-}
-
-.nvd3 .nv-axis line {
-  fill: none;
-  stroke: #e5e5e5;
-  shape-rendering: crispEdges;
-}
-
-.nvd3 .nv-axis .zero line,
-    /*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
-  stroke-opacity: 0.75;
-}
-
-.nvd3 .nv-axis .nv-axisMaxMin text {
-  font-weight: bold;
-}
-
-.nvd3 .x .nv-axis .nv-axisMaxMin text,
-.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
-.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
-  text-anchor: middle;
-}
-
-.nvd3 .nv-axis.nv-disabled {
-  opacity: 0;
-}
-
-.nvd3 .nv-bars rect {
-  fill-opacity: 0.75;
-
-  transition: fill-opacity 250ms linear;
-  -moz-transition: fill-opacity 250ms linear;
-  -webkit-transition: fill-opacity 250ms linear;
-}
-
-.nvd3 .nv-bars rect.hover {
-  fill-opacity: 1;
-}
-
-.nvd3 .nv-bars .hover rect {
-  fill: lightblue;
-}
-
-.nvd3 .nv-bars text {
-  fill: rgba(0, 0, 0, 0);
-}
-
-.nvd3 .nv-bars .hover text {
-  fill: rgba(0, 0, 0, 1);
-}
-
-.nvd3 .nv-multibar .nv-groups rect,
-.nvd3 .nv-multibarHorizontal .nv-groups rect,
-.nvd3 .nv-discretebar .nv-groups rect {
-  stroke-opacity: 0;
-
-  transition: fill-opacity 250ms linear;
-  -moz-transition: fill-opacity 250ms linear;
-  -webkit-transition: fill-opacity 250ms linear;
-}
-
-.nvd3 .nv-multibar .nv-groups rect:hover,
-.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
-.nvd3 .nv-candlestickBar .nv-ticks rect:hover,
-.nvd3 .nv-discretebar .nv-groups rect:hover {
-  fill-opacity: 1;
-}
-
-.nvd3 .nv-discretebar .nv-groups text,
-.nvd3 .nv-multibarHorizontal .nv-groups text {
-  font-weight: bold;
-  fill: rgba(0, 0, 0, 1);
-  stroke: rgba(0, 0, 0, 0);
-}
-
-/* boxplot CSS */
-.nvd3 .nv-boxplot circle {
-  fill-opacity: 0.5;
-}
-
-.nvd3 .nv-boxplot circle:hover {
-  fill-opacity: 1;
-}
-
-.nvd3 .nv-boxplot rect:hover {
-  fill-opacity: 1;
-}
-
-.nvd3 line.nv-boxplot-median {
-  stroke: black;
-}
-
-.nv-boxplot-tick:hover {
-  stroke-width: 2.5px;
-}
-/* bullet */
-.nvd3.nv-bullet {
-  font: 10px sans-serif;
-}
-.nvd3.nv-bullet .nv-measure {
-  fill-opacity: 0.8;
-}
-.nvd3.nv-bullet .nv-measure:hover {
-  fill-opacity: 1;
-}
-.nvd3.nv-bullet .nv-marker {
-  stroke: #000;
-  stroke-width: 2px;
-}
-.nvd3.nv-bullet .nv-markerTriangle {
-  stroke: #000;
-  fill: #fff;
-  stroke-width: 1.5px;
-}
-.nvd3.nv-bullet .nv-markerLine {
-  stroke: #000;
-  stroke-width: 1.5px;
-}
-.nvd3.nv-bullet .nv-tick line {
-  stroke: #666;
-  stroke-width: 0.5px;
-}
-.nvd3.nv-bullet .nv-range.nv-s0 {
-  fill: #eee;
-}
-.nvd3.nv-bullet .nv-range.nv-s1 {
-  fill: #ddd;
-}
-.nvd3.nv-bullet .nv-range.nv-s2 {
-  fill: #ccc;
-}
-.nvd3.nv-bullet .nv-title {
-  font-size: 14px;
-  font-weight: bold;
-}
-.nvd3.nv-bullet .nv-subtitle {
-  fill: #999;
-}
-
-.nvd3.nv-bullet .nv-range {
-  fill: #bababa;
-  fill-opacity: 0.4;
-}
-.nvd3.nv-bullet .nv-range:hover {
-  fill-opacity: 0.7;
-}
-
-.nvd3.nv-candlestickBar .nv-ticks .nv-tick {
-  stroke-width: 1px;
-}
-
-.nvd3.nv-candlestickBar .nv-ticks .nv-tick.hover {
-  stroke-width: 2px;
-}
-
-.nvd3.nv-candlestickBar .nv-ticks .nv-tick.positive rect {
-  stroke: #2ca02c;
-  fill: #2ca02c;
-}
-
-.nvd3.nv-candlestickBar .nv-ticks .nv-tick.negative rect {
-  stroke: #d62728;
-  fill: #d62728;
-}
-
-.with-transitions .nv-candlestickBar .nv-ticks .nv-tick {
-  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-  -moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-  -webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-}
-
-.nvd3.nv-candlestickBar .nv-ticks line {
-  stroke: #333;
-}
-
-.nv-force-node {
-  stroke: #fff;
-  stroke-width: 1.5px;
-}
-.nv-force-link {
-  stroke: #999;
-  stroke-opacity: 0.6;
-}
-.nv-force-node text {
-  stroke-width: 0px;
-}
-
-.nvd3 .nv-legend .nv-disabled rect {
-  /*fill-opacity: 0;*/
-}
-
-.nvd3 .nv-check-box .nv-box {
-  fill-opacity: 0;
-  stroke-width: 2;
-}
-
-.nvd3 .nv-check-box .nv-check {
-  fill-opacity: 0;
-  stroke-width: 4;
-}
-
-.nvd3 .nv-series.nv-disabled .nv-check-box .nv-check {
-  fill-opacity: 0;
-  stroke-opacity: 0;
-}
-
-.nvd3 .nv-controlsWrap .nv-legend .nv-check-box .nv-check {
-  opacity: 0;
-}
-
-/* line plus bar */
-.nvd3.nv-linePlusBar .nv-bar rect {
-  fill-opacity: 0.75;
-}
-
-.nvd3.nv-linePlusBar .nv-bar rect:hover {
-  fill-opacity: 1;
-}
-.nvd3 .nv-groups path.nv-line {
-  fill: none;
-}
-
-.nvd3 .nv-groups path.nv-area {
-  stroke: none;
-}
-
-.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
-  fill-opacity: 0;
-  stroke-opacity: 0;
-}
-
-.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
-  fill-opacity: 0.5 !important;
-  stroke-opacity: 0.5 !important;
-}
-
-.with-transitions .nvd3 .nv-groups .nv-point {
-  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-  -moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-  -webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-}
-
-.nvd3.nv-scatter .nv-groups .nv-point.hover,
-.nvd3 .nv-groups .nv-point.hover {
-  stroke-width: 7px;
-  fill-opacity: 0.95 !important;
-  stroke-opacity: 0.95 !important;
-}
-
-.nvd3 .nv-point-paths path {
-  stroke: #aaa;
-  stroke-opacity: 0;
-  fill: #eee;
-  fill-opacity: 0;
-}
-
-.nvd3 .nv-indexLine {
-  cursor: ew-resize;
-}
-
-/********************
- * SVG CSS
- */
-
-/********************
-  Default CSS for an svg element nvd3 used
-*/
-svg.nvd3-svg {
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -ms-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-  display: block;
-  width: 100%;
-  height: 100%;
-}
-
-/********************
-  Box shadow and border radius styling
-*/
-.nvtooltip.with-3d-shadow,
-.with-3d-shadow .nvtooltip {
-  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  border-radius: 5px;
-}
-
-.nvd3 text {
-  font: normal 12px Arial;
-}
-
-.nvd3 .title {
-  font: bold 14px Arial;
-}
-
-.nvd3 .nv-background {
-  fill: white;
-  fill-opacity: 0;
-}
-
-.nvd3.nv-noData {
-  font-size: 18px;
-  font-weight: bold;
-}
-
-/**********
-*  Brush
-*/
-
-.nv-brush .extent {
-  fill-opacity: 0.125;
-  shape-rendering: crispEdges;
-}
-
-.nv-brush .resize path {
-  fill: #eee;
-  stroke: #666;
-}
-
-/**********
-*  Legend
-*/
-
-.nvd3 .nv-legend .nv-series {
-  cursor: pointer;
-}
-
-.nvd3 .nv-legend .nv-disabled circle {
-  fill-opacity: 0;
-}
-
-/* focus */
-.nvd3 .nv-brush .extent {
-  fill-opacity: 0 !important;
-}
-
-.nvd3 .nv-brushBackground rect {
-  stroke: #000;
-  stroke-width: 0.4;
-  fill: #fff;
-  fill-opacity: 0.7;
-}
-
-/**********
-*  Print
-*/
-
-@media print {
-  .nvd3 text {
-    stroke-width: 0;
-    fill-opacity: 1;
-  }
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
-  stroke-width: 1px;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
-  stroke-width: 2px;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
-  stroke: #2ca02c;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
-  stroke: #d62728;
-}
-
-.nvd3 .background path {
-  fill: none;
-  stroke: #eee;
-  stroke-opacity: 0.4;
-  shape-rendering: crispEdges;
-}
-
-.nvd3 .foreground path {
-  fill: none;
-  stroke-opacity: 0.7;
-}
-
-.nvd3 .nv-parallelCoordinates-brush .extent {
-  fill: #fff;
-  fill-opacity: 0.6;
-  stroke: gray;
-  shape-rendering: crispEdges;
-}
-
-.nvd3 .nv-parallelCoordinates .hover {
-  fill-opacity: 1;
-  stroke-width: 3px;
-}
-
-.nvd3 .missingValuesline line {
-  fill: none;
-  stroke: black;
-  stroke-width: 1;
-  stroke-opacity: 1;
-  stroke-dasharray: 5, 5;
-}
-.nvd3.nv-pie path {
-  stroke-opacity: 0;
-  transition: fill-opacity 250ms linear, stroke-width 250ms linear,
-    stroke-opacity 250ms linear;
-  -moz-transition: fill-opacity 250ms linear, stroke-width 250ms linear,
-    stroke-opacity 250ms linear;
-  -webkit-transition: fill-opacity 250ms linear, stroke-width 250ms linear,
-    stroke-opacity 250ms linear;
-}
-
-.nvd3.nv-pie .nv-pie-title {
-  font-size: 24px;
-  fill: rgba(19, 196, 249, 0.59);
-}
-
-.nvd3.nv-pie .nv-slice text {
-  stroke: #000;
-  stroke-width: 0;
-}
-
-.nvd3.nv-pie path {
-  stroke: #fff;
-  stroke-width: 1px;
-  stroke-opacity: 1;
-}
-
-.nvd3.nv-pie path {
-  fill-opacity: 0.7;
-}
-.nvd3.nv-pie .hover path {
-  fill-opacity: 1;
-}
-.nvd3.nv-pie .nv-label {
-  pointer-events: none;
-}
-.nvd3.nv-pie .nv-label rect {
-  fill-opacity: 0;
-  stroke-opacity: 0;
-}
-
-/* scatter */
-.nvd3 .nv-groups .nv-point.hover {
-  stroke-width: 20px;
-  stroke-opacity: 0.5;
-}
-
-.nvd3 .nv-scatter .nv-point.hover {
-  fill-opacity: 1;
-}
-.nv-noninteractive {
-  pointer-events: none;
-}
-
-.nv-distx,
-.nv-disty {
-  pointer-events: none;
-}
-
-/* sparkline */
-.nvd3.nv-sparkline path {
-  fill: none;
-}
-
-.nvd3.nv-sparklineplus g.nv-hoverValue {
-  pointer-events: none;
-}
-
-.nvd3.nv-sparklineplus .nv-hoverValue line {
-  stroke: #333;
-  stroke-width: 1.5px;
-}
-
-.nvd3.nv-sparklineplus,
-.nvd3.nv-sparklineplus g {
-  pointer-events: all;
-}
-
-.nvd3 .nv-hoverArea {
-  fill-opacity: 0;
-  stroke-opacity: 0;
-}
-
-.nvd3.nv-sparklineplus .nv-xValue,
-.nvd3.nv-sparklineplus .nv-yValue {
-  stroke-width: 0;
-  font-size: 0.9em;
-  font-weight: normal;
-}
-
-.nvd3.nv-sparklineplus .nv-yValue {
-  stroke: #f66;
-}
-
-.nvd3.nv-sparklineplus .nv-maxValue {
-  stroke: #2ca02c;
-  fill: #2ca02c;
-}
-
-.nvd3.nv-sparklineplus .nv-minValue {
-  stroke: #d62728;
-  fill: #d62728;
-}
-
-.nvd3.nv-sparklineplus .nv-currentValue {
-  font-weight: bold;
-  font-size: 1.1em;
-}
-/* stacked area */
-.nvd3.nv-stackedarea path.nv-area {
-  fill-opacity: 0.7;
-  stroke-opacity: 0;
-  transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
-  -moz-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
-  -webkit-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
-}
-
-.nvd3.nv-stackedarea path.nv-area.hover {
-  fill-opacity: 0.9;
-}
-
-.nvd3.nv-stackedarea .nv-groups .nv-point {
-  stroke-opacity: 0;
-  fill-opacity: 0;
-}
-
-.nvtooltip {
-  position: absolute;
-  background-color: rgba(255, 255, 255, 1);
-  color: rgba(0, 0, 0, 1);
-  padding: 1px;
-  border: 1px solid rgba(0, 0, 0, 0.2);
-  z-index: 10000;
-  display: block;
-
-  font-family: Arial;
-  font-size: 13px;
-  text-align: left;
-  pointer-events: none;
-
-  white-space: nowrap;
-
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-}
-
-.nvtooltip {
-  background: rgba(255, 255, 255, 0.8);
-  border: 1px solid rgba(0, 0, 0, 0.5);
-  border-radius: 4px;
-}
-
-/*Give tooltips that old fade in transition by
-    putting a "with-transitions" class on the container div.
-*/
-.nvtooltip.with-transitions,
-.with-transitions .nvtooltip {
-  transition: opacity 50ms linear;
-  -moz-transition: opacity 50ms linear;
-  -webkit-transition: opacity 50ms linear;
-
-  transition-delay: 200ms;
-  -moz-transition-delay: 200ms;
-  -webkit-transition-delay: 200ms;
-}
-
-.nvtooltip.x-nvtooltip,
-.nvtooltip.y-nvtooltip {
-  padding: 8px;
-}
-
-.nvtooltip h3 {
-  margin: 0;
-  padding: 4px 14px;
-  line-height: 18px;
-  font-weight: normal;
-  background-color: rgba(247, 247, 247, 0.75);
-  color: rgba(0, 0, 0, 1);
-  text-align: center;
-
-  border-bottom: 1px solid #ebebeb;
-
-  -webkit-border-radius: 5px 5px 0 0;
-  -moz-border-radius: 5px 5px 0 0;
-  border-radius: 5px 5px 0 0;
-}
-
-.nvtooltip p {
-  margin: 0;
-  padding: 5px 14px;
-  text-align: center;
-}
-
-.nvtooltip span {
-  display: inline-block;
-  margin: 2px 0;
-}
-
-.nvtooltip table {
-  margin: 6px;
-  border-spacing: 0;
-}
-
-.nvtooltip table td {
-  padding: 2px 9px 2px 0;
-  vertical-align: middle;
-}
-
-.nvtooltip table td.key {
-  font-weight: normal;
-}
-.nvtooltip table td.key.total {
-  font-weight: bold;
-}
-.nvtooltip table td.value {
-  text-align: right;
-  font-weight: bold;
-}
-
-.nvtooltip table td.percent {
-  color: darkgray;
-}
-
-.nvtooltip table tr.highlight td {
-  padding: 1px 9px 1px 0;
-  border-bottom-style: solid;
-  border-bottom-width: 1px;
-  border-top-style: solid;
-  border-top-width: 1px;
-}
-
-.nvtooltip table td.legend-color-guide div {
-  width: 8px;
-  height: 8px;
-  vertical-align: middle;
-}
-
-.nvtooltip table td.legend-color-guide div {
-  width: 12px;
-  height: 12px;
-  border: 1px solid #999;
-}
-
-.nvtooltip .footer {
-  padding: 3px;
-  text-align: center;
-}
-
-.nvtooltip-pending-removal {
-  pointer-events: none;
-  display: none;
-}
-
-/****
-Interactive Layer
-*/
-.nvd3 .nv-interactiveGuideLine {
-  pointer-events: none;
-}
-.nvd3 line.nv-guideline {
-  stroke: #ccc;
-}
+/* nvd3 version 1.8.4 (https://github.com/novus/nvd3) 2016-07-03 */
+.nvd3 .nv-axis {
+  pointer-events: none;
+  opacity: 1;
+}
+
+.nvd3 .nv-axis path {
+  fill: none;
+  stroke: #000;
+  stroke-opacity: 0.75;
+  shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-axis path.domain {
+  stroke-opacity: 0.75;
+}
+
+.nvd3 .nv-axis.nv-x path.domain {
+  stroke-opacity: 0;
+}
+
+.nvd3 .nv-axis line {
+  fill: none;
+  stroke: #e5e5e5;
+  shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-axis .zero line,
+    /*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
+  stroke-opacity: 0.75;
+}
+
+.nvd3 .nv-axis .nv-axisMaxMin text {
+  font-weight: bold;
+}
+
+.nvd3 .x .nv-axis .nv-axisMaxMin text,
+.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
+.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
+  text-anchor: middle;
+}
+
+.nvd3 .nv-axis.nv-disabled {
+  opacity: 0;
+}
+
+.nvd3 .nv-bars rect {
+  fill-opacity: 0.75;
+
+  transition: fill-opacity 250ms linear;
+  -moz-transition: fill-opacity 250ms linear;
+  -webkit-transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-bars rect.hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-bars .hover rect {
+  fill: lightblue;
+}
+
+.nvd3 .nv-bars text {
+  fill: rgba(0, 0, 0, 0);
+}
+
+.nvd3 .nv-bars .hover text {
+  fill: rgba(0, 0, 0, 1);
+}
+
+.nvd3 .nv-multibar .nv-groups rect,
+.nvd3 .nv-multibarHorizontal .nv-groups rect,
+.nvd3 .nv-discretebar .nv-groups rect {
+  stroke-opacity: 0;
+
+  transition: fill-opacity 250ms linear;
+  -moz-transition: fill-opacity 250ms linear;
+  -webkit-transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-multibar .nv-groups rect:hover,
+.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
+.nvd3 .nv-candlestickBar .nv-ticks rect:hover,
+.nvd3 .nv-discretebar .nv-groups rect:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-discretebar .nv-groups text,
+.nvd3 .nv-multibarHorizontal .nv-groups text {
+  font-weight: bold;
+  fill: rgba(0, 0, 0, 1);
+  stroke: rgba(0, 0, 0, 0);
+}
+
+/* boxplot CSS */
+.nvd3 .nv-boxplot circle {
+  fill-opacity: 0.5;
+}
+
+.nvd3 .nv-boxplot circle:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 .nv-boxplot rect:hover {
+  fill-opacity: 1;
+}
+
+.nvd3 line.nv-boxplot-median {
+  stroke: black;
+}
+
+.nv-boxplot-tick:hover {
+  stroke-width: 2.5px;
+}
+/* bullet */
+.nvd3.nv-bullet {
+  font: 10px sans-serif;
+}
+.nvd3.nv-bullet .nv-measure {
+  fill-opacity: 0.8;
+}
+.nvd3.nv-bullet .nv-measure:hover {
+  fill-opacity: 1;
+}
+.nvd3.nv-bullet .nv-marker {
+  stroke: #000;
+  stroke-width: 2px;
+}
+.nvd3.nv-bullet .nv-markerTriangle {
+  stroke: #000;
+  fill: #fff;
+  stroke-width: 1.5px;
+}
+.nvd3.nv-bullet .nv-markerLine {
+  stroke: #000;
+  stroke-width: 1.5px;
+}
+.nvd3.nv-bullet .nv-tick line {
+  stroke: #666;
+  stroke-width: 0.5px;
+}
+.nvd3.nv-bullet .nv-range.nv-s0 {
+  fill: #eee;
+}
+.nvd3.nv-bullet .nv-range.nv-s1 {
+  fill: #ddd;
+}
+.nvd3.nv-bullet .nv-range.nv-s2 {
+  fill: #ccc;
+}
+.nvd3.nv-bullet .nv-title {
+  font-size: 14px;
+  font-weight: bold;
+}
+.nvd3.nv-bullet .nv-subtitle {
+  fill: #999;
+}
+
+.nvd3.nv-bullet .nv-range {
+  fill: #bababa;
+  fill-opacity: 0.4;
+}
+.nvd3.nv-bullet .nv-range:hover {
+  fill-opacity: 0.7;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick {
+  stroke-width: 1px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.hover {
+  stroke-width: 2px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.positive rect {
+  stroke: #2ca02c;
+  fill: #2ca02c;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.negative rect {
+  stroke: #d62728;
+  fill: #d62728;
+}
+
+.with-transitions .nv-candlestickBar .nv-ticks .nv-tick {
+  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+  -moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+  -webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks line {
+  stroke: #333;
+}
+
+.nv-force-node {
+  stroke: #fff;
+  stroke-width: 1.5px;
+}
+.nv-force-link {
+  stroke: #999;
+  stroke-opacity: 0.6;
+}
+.nv-force-node text {
+  stroke-width: 0px;
+}
+
+.nvd3 .nv-legend .nv-disabled rect {
+  /*fill-opacity: 0;*/
+}
+
+.nvd3 .nv-check-box .nv-box {
+  fill-opacity: 0;
+  stroke-width: 2;
+}
+
+.nvd3 .nv-check-box .nv-check {
+  fill-opacity: 0;
+  stroke-width: 4;
+}
+
+.nvd3 .nv-series.nv-disabled .nv-check-box .nv-check {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3 .nv-controlsWrap .nv-legend .nv-check-box .nv-check {
+  opacity: 0;
+}
+
+/* line plus bar */
+.nvd3.nv-linePlusBar .nv-bar rect {
+  fill-opacity: 0.75;
+}
+
+.nvd3.nv-linePlusBar .nv-bar rect:hover {
+  fill-opacity: 1;
+}
+.nvd3 .nv-groups path.nv-line {
+  fill: none;
+}
+
+.nvd3 .nv-groups path.nv-area {
+  stroke: none;
+}
+
+.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
+  fill-opacity: 0.5 !important;
+  stroke-opacity: 0.5 !important;
+}
+
+.with-transitions .nvd3 .nv-groups .nv-point {
+  transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+  -moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+  -webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-scatter .nv-groups .nv-point.hover,
+.nvd3 .nv-groups .nv-point.hover {
+  stroke-width: 7px;
+  fill-opacity: 0.95 !important;
+  stroke-opacity: 0.95 !important;
+}
+
+.nvd3 .nv-point-paths path {
+  stroke: #aaa;
+  stroke-opacity: 0;
+  fill: #eee;
+  fill-opacity: 0;
+}
+
+.nvd3 .nv-indexLine {
+  cursor: ew-resize;
+}
+
+/********************
+ * SVG CSS
+ */
+
+/********************
+  Default CSS for an svg element nvd3 used
+*/
+svg.nvd3-svg {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -ms-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+/********************
+  Box shadow and border radius styling
+*/
+.nvtooltip.with-3d-shadow,
+.with-3d-shadow .nvtooltip {
+  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
+
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
+}
+
+.nvd3 text {
+  font: normal 12px Arial;
+}
+
+.nvd3 .title {
+  font: bold 14px Arial;
+}
+
+.nvd3 .nv-background {
+  fill: white;
+  fill-opacity: 0;
+}
+
+.nvd3.nv-noData {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+/**********
+*  Brush
+*/
+
+.nv-brush .extent {
+  fill-opacity: 0.125;
+  shape-rendering: crispEdges;
+}
+
+.nv-brush .resize path {
+  fill: #eee;
+  stroke: #666;
+}
+
+/**********
+*  Legend
+*/
+
+.nvd3 .nv-legend .nv-series {
+  cursor: pointer;
+}
+
+.nvd3 .nv-legend .nv-disabled circle {
+  fill-opacity: 0;
+}
+
+/* focus */
+.nvd3 .nv-brush .extent {
+  fill-opacity: 0 !important;
+}
+
+.nvd3 .nv-brushBackground rect {
+  stroke: #000;
+  stroke-width: 0.4;
+  fill: #fff;
+  fill-opacity: 0.7;
+}
+
+/**********
+*  Print
+*/
+
+@media print {
+  .nvd3 text {
+    stroke-width: 0;
+    fill-opacity: 1;
+  }
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
+  stroke-width: 1px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
+  stroke-width: 2px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
+  stroke: #2ca02c;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
+  stroke: #d62728;
+}
+
+.nvd3 .background path {
+  fill: none;
+  stroke: #eee;
+  stroke-opacity: 0.4;
+  shape-rendering: crispEdges;
+}
+
+.nvd3 .foreground path {
+  fill: none;
+  stroke-opacity: 0.7;
+}
+
+.nvd3 .nv-parallelCoordinates-brush .extent {
+  fill: #fff;
+  fill-opacity: 0.6;
+  stroke: gray;
+  shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-parallelCoordinates .hover {
+  fill-opacity: 1;
+  stroke-width: 3px;
+}
+
+.nvd3 .missingValuesline line {
+  fill: none;
+  stroke: black;
+  stroke-width: 1;
+  stroke-opacity: 1;
+  stroke-dasharray: 5, 5;
+}
+.nvd3.nv-pie path {
+  stroke-opacity: 0;
+  transition: fill-opacity 250ms linear, stroke-width 250ms linear,
+    stroke-opacity 250ms linear;
+  -moz-transition: fill-opacity 250ms linear, stroke-width 250ms linear,
+    stroke-opacity 250ms linear;
+  -webkit-transition: fill-opacity 250ms linear, stroke-width 250ms linear,
+    stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-pie .nv-pie-title {
+  font-size: 24px;
+  fill: rgba(19, 196, 249, 0.59);
+}
+
+.nvd3.nv-pie .nv-slice text {
+  stroke: #000;
+  stroke-width: 0;
+}
+
+.nvd3.nv-pie path {
+  stroke: #fff;
+  stroke-width: 1px;
+  stroke-opacity: 1;
+}
+
+.nvd3.nv-pie path {
+  fill-opacity: 0.7;
+}
+.nvd3.nv-pie .hover path {
+  fill-opacity: 1;
+}
+.nvd3.nv-pie .nv-label {
+  pointer-events: none;
+}
+.nvd3.nv-pie .nv-label rect {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+/* scatter */
+.nvd3 .nv-groups .nv-point.hover {
+  stroke-width: 20px;
+  stroke-opacity: 0.5;
+}
+
+.nvd3 .nv-scatter .nv-point.hover {
+  fill-opacity: 1;
+}
+.nv-noninteractive {
+  pointer-events: none;
+}
+
+.nv-distx,
+.nv-disty {
+  pointer-events: none;
+}
+
+/* sparkline */
+.nvd3.nv-sparkline path {
+  fill: none;
+}
+
+.nvd3.nv-sparklineplus g.nv-hoverValue {
+  pointer-events: none;
+}
+
+.nvd3.nv-sparklineplus .nv-hoverValue line {
+  stroke: #333;
+  stroke-width: 1.5px;
+}
+
+.nvd3.nv-sparklineplus,
+.nvd3.nv-sparklineplus g {
+  pointer-events: all;
+}
+
+.nvd3 .nv-hoverArea {
+  fill-opacity: 0;
+  stroke-opacity: 0;
+}
+
+.nvd3.nv-sparklineplus .nv-xValue,
+.nvd3.nv-sparklineplus .nv-yValue {
+  stroke-width: 0;
+  font-size: 0.9em;
+  font-weight: normal;
+}
+
+.nvd3.nv-sparklineplus .nv-yValue {
+  stroke: #f66;
+}
+
+.nvd3.nv-sparklineplus .nv-maxValue {
+  stroke: #2ca02c;
+  fill: #2ca02c;
+}
+
+.nvd3.nv-sparklineplus .nv-minValue {
+  stroke: #d62728;
+  fill: #d62728;
+}
+
+.nvd3.nv-sparklineplus .nv-currentValue {
+  font-weight: bold;
+  font-size: 1.1em;
+}
+/* stacked area */
+.nvd3.nv-stackedarea path.nv-area {
+  fill-opacity: 0.7;
+  stroke-opacity: 0;
+  transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+  -moz-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+  -webkit-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-stackedarea path.nv-area.hover {
+  fill-opacity: 0.9;
+}
+
+.nvd3.nv-stackedarea .nv-groups .nv-point {
+  stroke-opacity: 0;
+  fill-opacity: 0;
+}
+
+.nvtooltip {
+  position: absolute;
+  background-color: rgba(255, 255, 255, 1);
+  color: rgba(0, 0, 0, 1);
+  padding: 1px;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  z-index: 10000;
+  display: block;
+
+  font-family: Arial;
+  font-size: 13px;
+  text-align: left;
+  pointer-events: none;
+
+  white-space: nowrap;
+
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.nvtooltip {
+  background: rgba(255, 255, 255, 0.8);
+  border: 1px solid rgba(0, 0, 0, 0.5);
+  border-radius: 4px;
+}
+
+/*Give tooltips that old fade in transition by
+    putting a "with-transitions" class on the container div.
+*/
+.nvtooltip.with-transitions,
+.with-transitions .nvtooltip {
+  transition: opacity 50ms linear;
+  -moz-transition: opacity 50ms linear;
+  -webkit-transition: opacity 50ms linear;
+
+  transition-delay: 200ms;
+  -moz-transition-delay: 200ms;
+  -webkit-transition-delay: 200ms;
+}
+
+.nvtooltip.x-nvtooltip,
+.nvtooltip.y-nvtooltip {
+  padding: 8px;
+}
+
+.nvtooltip h3 {
+  margin: 0;
+  padding: 4px 14px;
+  line-height: 18px;
+  font-weight: normal;
+  background-color: rgba(247, 247, 247, 0.75);
+  color: rgba(0, 0, 0, 1);
+  text-align: center;
+
+  border-bottom: 1px solid #ebebeb;
+
+  -webkit-border-radius: 5px 5px 0 0;
+  -moz-border-radius: 5px 5px 0 0;
+  border-radius: 5px 5px 0 0;
+}
+
+.nvtooltip p {
+  margin: 0;
+  padding: 5px 14px;
+  text-align: center;
+}
+
+.nvtooltip span {
+  display: inline-block;
+  margin: 2px 0;
+}
+
+.nvtooltip table {
+  margin: 6px;
+  border-spacing: 0;
+}
+
+.nvtooltip table td {
+  padding: 2px 9px 2px 0;
+  vertical-align: middle;
+}
+
+.nvtooltip table td.key {
+  font-weight: normal;
+}
+.nvtooltip table td.key.total {
+  font-weight: bold;
+}
+.nvtooltip table td.value {
+  text-align: right;
+  font-weight: bold;
+}
+
+.nvtooltip table td.percent {
+  color: darkgray;
+}
+
+.nvtooltip table tr.highlight td {
+  padding: 1px 9px 1px 0;
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+  border-top-style: solid;
+  border-top-width: 1px;
+}
+
+.nvtooltip table td.legend-color-guide div {
+  width: 8px;
+  height: 8px;
+  vertical-align: middle;
+}
+
+.nvtooltip table td.legend-color-guide div {
+  width: 12px;
+  height: 12px;
+  border: 1px solid #999;
+}
+
+.nvtooltip .footer {
+  padding: 3px;
+  text-align: center;
+}
+
+.nvtooltip-pending-removal {
+  pointer-events: none;
+  display: none;
+}
+
+/****
+Interactive Layer
+*/
+.nvd3 .nv-interactiveGuideLine {
+  pointer-events: none;
+}
+.nvd3 line.nv-guideline {
+  stroke: #ccc;
+}
diff --git a/services/web/frontend/stylesheets/core/grid.less b/services/web/frontend/stylesheets/core/grid.less
index 7f4d3264c9..a45ef73f4f 100755
--- a/services/web/frontend/stylesheets/core/grid.less
+++ b/services/web/frontend/stylesheets/core/grid.less
@@ -74,45 +74,3 @@
 @media (min-width: @screen-lg-min) {
   .make-grid(lg);
 }
-
-.website-redesign {
-  // whitelist for the pages to use the new grid
-  // TODO: remove this whitelist once all pages are using the new grid
-  .plans-new-design,
-  .plans-page {
-    // Container widths
-    //
-    // Set the container width, and override it for fixed navbars in media queries.
-
-    .container {
-      .container-fixed(@grid-gutter-width-new);
-
-      @media (min-width: @screen-sm-min) {
-        width: @container-sm;
-      }
-      @media (min-width: @screen-md-min) {
-        width: @container-md;
-      }
-      @media (min-width: @screen-lg-min) {
-        width: @container-lg;
-      }
-      @media (min-width: @screen-xl-min) {
-        width: @container-xl;
-      }
-    }
-
-    // Row
-    //
-    // Rows contain and clear the floats of your columns.
-
-    .row {
-      .make-row(@grid-gutter-width-new);
-    }
-
-    // Columns
-    //
-    // Common styles for small and large grid columns
-
-    .make-grid-columns(@grid-gutter-width-new);
-  }
-}
diff --git a/services/web/frontend/stylesheets/core/type.less b/services/web/frontend/stylesheets/core/type.less
index 3d51fac4eb..d19bfb48ae 100755
--- a/services/web/frontend/stylesheets/core/type.less
+++ b/services/web/frontend/stylesheets/core/type.less
@@ -185,14 +185,8 @@ cite {
 .text-sans-serif {
   font-family: @font-family-sans-serif;
 }
-.text-centered {
-  text-align: center;
-}
 
 // Transformations
-.text-capitalize {
-  text-transform: capitalize;
-}
 .text-lowercase {
   text-transform: lowercase;
 }
diff --git a/services/web/frontend/stylesheets/core/utilities.less b/services/web/frontend/stylesheets/core/utilities.less
index 227ebad4b1..3e9e2dbc33 100755
--- a/services/web/frontend/stylesheets/core/utilities.less
+++ b/services/web/frontend/stylesheets/core/utilities.less
@@ -11,10 +11,12 @@
 .center-block {
   .center-block();
 }
-.pull-right {
+.pull-right,
+.float-end {
   float: right !important;
 }
-.pull-left {
+.pull-left,
+.float-start {
   float: left !important;
 }
 
diff --git a/services/web/frontend/stylesheets/main-style.less b/services/web/frontend/stylesheets/main-style.less
index 696da82176..1898c6be66 100644
--- a/services/web/frontend/stylesheets/main-style.less
+++ b/services/web/frontend/stylesheets/main-style.less
@@ -82,7 +82,6 @@
 @import 'components/modals.less';
 @import 'components/tooltip.less';
 @import 'components/popovers.less';
-@import 'components/daterange-picker';
 @import 'components/lists.less';
 @import 'components/overbox.less';
 @import 'components/embed-responsive.less';
@@ -102,10 +101,8 @@
 @import 'app/project-list.less';
 @import 'app/project-list-react.less';
 @import 'app/editor.less';
-@import 'app/plans.less';
 @import 'app/recurly.less';
 @import 'app/bonus.less';
-@import 'app/register.less';
 @import 'app/blog.less';
 @import 'app/features.less';
 @import 'app/templates.less';
@@ -118,20 +115,13 @@
 @import 'app/invite.less';
 @import 'app/error-pages.less';
 @import 'app/editor/history-v2.less';
-@import 'app/metrics.less';
 @import 'app/open-in-overleaf.less';
-@import 'app/primary-email-check';
 @import 'app/grammarly';
 @import 'app/front-chat-widget.less';
 @import 'app/ol-chat.less';
 @import 'app/templates-v2.less';
 @import 'app/login-register.less';
-@import 'app/review-features-page.less';
-@import 'app/institution-hub.less';
-@import 'app/publisher-hub.less';
-@import 'app/admin-hub.less';
 @import 'app/import.less';
-@import 'app/website-redesign.less';
 @import 'app/add-secondary-email-prompt.less';
 @import 'app/confirm-email.less';
 
@@ -145,7 +135,6 @@
 // module styles
 // TODO: find a way for modules to add styles dynamically
 @import 'modules/symbol-palette.less';
-@import 'modules/admin-panel.less';
 @import 'modules/git-bridge-modal.less';
 @import 'modules/group-settings.less';
 @import 'modules/onboarding.less';
diff --git a/services/web/frontend/stylesheets/modules/admin-panel.less b/services/web/frontend/stylesheets/modules/admin-panel.less
deleted file mode 100644
index e1f57a4738..0000000000
--- a/services/web/frontend/stylesheets/modules/admin-panel.less
+++ /dev/null
@@ -1,37 +0,0 @@
-.admin-panel-pagination {
-  display: flex;
-  justify-content: center;
-}
-
-.phase-badge {
-  display: inline-block;
-  font-size: @font-size-small;
-  white-space: nowrap;
-  text-align: center;
-  padding: 3px 7px;
-  &:extend(.label);
-  &:extend(.label-info);
-}
-
-.scrollable {
-  max-height: calc(100vh - 40vh);
-  overflow-y: auto;
-}
-
-.hr-sect {
-  display: flex;
-  flex-basis: 100%;
-  align-items: center;
-  color: rgba(0, 0, 0, 0.35);
-  margin: 8px 0;
-}
-.hr-sect:before,
-.hr-sect:after {
-  content: '';
-  flex-grow: 1;
-  background: rgba(0, 0, 0, 0.35);
-  height: 1px;
-  font-size: 0;
-  line-height: 0;
-  margin: 0 8px;
-}
diff --git a/services/web/locales/cs.json b/services/web/locales/cs.json
index c15ed1b021..1b82889697 100644
--- a/services/web/locales/cs.json
+++ b/services/web/locales/cs.json
@@ -24,7 +24,6 @@
   "blank_project": "Prázdný projekt",
   "blog": "Blog",
   "built_in": "Vestavěný",
-  "can_edit": "Může upravovat",
   "cancel": "Zrušit",
   "cant_find_email": "Je nám líto, ale tato emailová adresa není registrována.",
   "cant_find_page": "Je nám líto, ale nemůžeme najít stránku, kterou hledáte.",
@@ -224,7 +223,6 @@
   "publishing": "Publikuji",
   "pull_github_changes_into_sharelatex": "Vložit změny z GitHubu do __appName__u.",
   "push_sharelatex_changes_to_github": "Vložit změny z __appName__u do GitHubu",
-  "read_only": "Jen pro čtení",
   "recent_commits_in_github": "Poslední commity do GitHubu",
   "recompile": "Překompilovat",
   "reconnecting": "Obnovuji připojení",
@@ -326,6 +324,7 @@
   "updating_site": "Upravuji stránku",
   "upgrade": "Upgrade",
   "upload": "Nahrát",
+  "upload_file": "Nahrát soubor",
   "upload_project": "Nahrát projekt",
   "upload_zipped_project": "Nahrát zazipovaný projekt",
   "user_wants_you_to_see_project": "Uživatel __username__ by se rád přidal k projektu __projectname__",
diff --git a/services/web/locales/da.json b/services/web/locales/da.json
index 43e2d4d672..9e90a5bce2 100644
--- a/services/web/locales/da.json
+++ b/services/web/locales/da.json
@@ -2,10 +2,10 @@
   "12x_basic": "12x basis",
   "1_2_width": "½ bredde",
   "1_4_width": "¼ bredde",
+  "24x_basic": "24x basis",
   "3_4_width": "¾ bredde",
   "About": "Om",
   "Account": "Konto",
-  "Account Settings": "Kontoindstillinger",
   "Documentation": "Dokumentation",
   "Projects": "Projekter",
   "Security": "Sikkerhed",
@@ -35,7 +35,6 @@
   "accept_change_error_description": "Der opstod en fejl under accepten af en ændring. Prøv venligst igen om lidt.",
   "accept_change_error_title": "Fejl i accept af ændring",
   "accept_invitation": "Accepter invitation",
-  "accept_or_reject_each_changes_individually": "Accepter eller afvis hver rettelse individuelt",
   "accept_terms_and_conditions": "Accepter vilkår og betingelser",
   "accepted_invite": "Accepteret invitation",
   "accepting_invite_as": "Du accepterer denne invitation som",
@@ -72,7 +71,7 @@
   "add_email_address": "Tilføj e-mailaddresse",
   "add_email_to_claim_features": "Tilføj en institutionel e-mailadresse for at gøre krav på dine funktioner.",
   "add_files": "Tilføj filer",
-  "add_more_editors": "Tilføj flere redaktører",
+  "add_more_collaborators": "Tilføj flere samarbejdspartnere",
   "add_more_managers": "Tilføj flere gruppeadministratorer",
   "add_new_email": "Tilføj ny e-mailaddresse",
   "add_or_remove_project_from_tag": "Tilføj projekt til, eller fjern projekt fra, tagget __tagName__",
@@ -121,7 +120,6 @@
   "allows_to_search_by_author_title_etc_possible_to_pull_results_directly_from_your_reference_manager_if_connected": "Tillader søgning på forfatter, title, m.fl. Muligt at hente resultater fra din henvisningsmanager (hvis tilkoblet).",
   "already_have_an_account": "Har du allerede en konto?",
   "already_have_sl_account": "Har du allerede en __appName__-konto?",
-  "already_subscribed_try_refreshing_the_page": "Har du allerede abonneret? Prøv at genindlæse siden.",
   "also": "Derudover",
   "alternatively_create_new_institution_account": "Alternativt kan du oprette en <b>ny konto</b> med din institutionelle e-mailaddresse (<b>__email__</b>), ved at klikke <b>__clickText__</b>.",
   "an_email_has_already_been_sent_to": "En e-mail er allerede blevet sendt til <0>__email__</0>. Vent lidt og prøv igen senere.",
@@ -196,13 +194,11 @@
   "by_joining_labs": "Ved at tilmelde dig Labs accepterer du at modtage emails og opdateringer fra Overleaf — for eksempel for at bede om din feedback. Du accepterer også vores <0>servicevilkår</0> og <1>privatlivspolitik</1>.",
   "by_registering_you_agree_to_our_terms_of_service": "Ved at registrere dig accepterer du vores <0>servicevilkår</0> og <1>privatlivspolitik</1>.",
   "by_subscribing_you_agree_to_our_terms_of_service": "Ved at abonnere accepterer du vores <0>servicevilkår</0>.",
-  "can_edit": "Kan redigere",
   "can_link_institution_email_acct_to_institution_acct": "Du kan nu kæde din <b>__appName__</b>-konto <b>__email__</b> sammen med din institutionelle konto fra <b>__institutionName__</b>.",
   "can_link_institution_email_by_clicking": "Du kan kæde din <b>__appName__</b>-konto <b>__email__</b> sammen med din <b>__institutionName__</b>-konto ved at klikke <b>__clickText__</b>.",
   "can_link_institution_email_to_login": "Du kan kæde din <b>__appName__</b>-konto <b>__email__</b> sammen med din <b>__institutionName__</b>-konto, hvilket vil gøre det muligt for dig at logge ind i <b>__appName__</b> igennem din institution, og vil genbekræfte din institutionelle e-mailadresse.",
   "can_link_your_institution_acct_2": "Du kan nu kæde din <0>__appName__</0>-konto sammen med din institutionelle konto fra <0>__institutionName__</0>.",
   "can_now_relink_dropbox": "Du kan nu <0>genoprette forbindelsen med din Dropbox-konto</0>",
-  "can_view": "Kan læse",
   "cancel": "Annuller",
   "cancel_anytime": "Vi er sikre på at du vil elske __appName__, men hvis ikke kan du altid annulere. Vi giver dig pengene tilbage uden spørgsmål, hvis bare du fortæller os det inden for 30 dage.",
   "cancel_my_account": "Ophæv dit abonnement",
@@ -275,8 +271,6 @@
   "code_check_failed": "Kodetjek fejlede",
   "code_check_failed_explanation": "Din kode har fejl, der skal rettes før auto-kompileren kan køre",
   "code_editor": "Kodeeditor",
-  "code_editor_tooltip_message": "Du kan se koden bag dit projekt (og redigere den) i kodeeditoren.",
-  "code_editor_tooltip_title": "Vil du gerne se og redigere LaTeX koden?",
   "collaborate_easily_on_your_projects": "Samarbejd nemt på dine projekter. Arbejd på længere eller mere komplekse dokumenter.",
   "collaborate_online_and_offline": "Samarbejd online og offline, med dit eget workflow",
   "collaboration": "Samarbejde",
@@ -439,7 +433,6 @@
   "disconnected": "Forbindelsen blev afbrudt",
   "discount_of": "Rabat på __amount__",
   "discover_latex_templates_and_examples": "Opdag LaTeX skabeloner og eksempler til at hjælpe med alt fra at skrive en artikel til at bruge en specifik LaTeX pakke.",
-  "dismiss_error_popup": "Afvis første fejlmeddelelse",
   "display_deleted_user": "Vis slettede brugere",
   "do_not_have_acct_or_do_not_want_to_link": "Hvis du ikke har en <b>__appName__</b>-konto, eller hvis du ikke vil kæde den sammen med din <b>__institutionName__</b>-konto, klik venligst <b>__clickText__</b>.",
   "do_not_link_accounts": "Kæd ikke kontoer sammen",
@@ -548,7 +541,6 @@
   "enabled": "Aktiveret",
   "enabling": "Aktiverer",
   "end_of_document": "Slutningen af dokumentet",
-  "enter_6_digit_code": "Indtast 6-cifret kode",
   "enter_any_size_including_units_or_valid_latex_command": "Indtast en størrelse (inklusiv enhed) eller en gyldig LaTeX kommando",
   "enter_image_url": "Indtast billedets URL",
   "enter_the_confirmation_code": "Indtast den 6-cifrede bekræftelseskode sendt til __email__.",
@@ -987,10 +979,6 @@
   "let_us_know_what_you_think": "Fortæl os hvad du synes",
   "library": "Bibliotek",
   "license": "Licens",
-  "limited_to_n_editors": "Begrænset til __count__ redaktører",
-  "limited_to_n_editors_per_project": "Begrænset til __count__ redaktører per projekt",
-  "limited_to_n_editors_per_project_plural": "Begrænset til __count__ redaktører per projekt",
-  "limited_to_n_editors_plural": "Begrænset til __count__ redaktører",
   "line_height": "Linjehøjde",
   "line_width_is_the_width_of_the_line_in_the_current_environment": "Linjebredde er bredden af linjen i det nuværende miljø, f.eks. hele siden i et enkelt-kolonne layout, eller halvdelen af siden i et to-kolonne layout.",
   "link": "Forbind",
@@ -1124,7 +1112,6 @@
   "more_comments": "Flere kommentarer",
   "more_info": "Mere info",
   "more_options": "Flere muligheder",
-  "more_options_for_border_settings_coming_soon": "Flere muligheder for kantindstillinger kommer snart.",
   "more_project_collaborators": "<0>Flere</0> <0>samarbejdspartnere</0> i projekter",
   "more_than_one_kind_of_snippet_was_requested": "Linket til at åbne dette indhold i Overleaf havde nogle ugyldige parametre. Hvis du bliver ved med at opleve det her med links fra en bestemt side, bliver du næsten nødt til at fortælle dem om det.",
   "most_popular_uppercase": "Mest populære",
@@ -1247,7 +1234,6 @@
   "open_link": "Gå til side",
   "open_path": "Åbn __path__",
   "open_project": "Åben projekt",
-  "open_survey": "Åbn spørgeskema",
   "open_target": "Følg henvisning",
   "opted_out_linking": "Du har fravalgt at forbinde din <b>__appName__</b>-konto for <b>__email__</b> til din institutionelle konto.",
   "optional": "Valgfrit",
@@ -1256,7 +1242,6 @@
   "organization_name": "Organisationsnavn",
   "organization_or_company_name": "Organisations- eller virksomhedsnavn",
   "organization_or_company_type": "Organisations- eller virksomhedstype",
-  "organize_projects": "Organisationsprojekter",
   "original_price": "Original pris",
   "other": "Andet",
   "other_actions": "Andre handlinger",
@@ -1335,7 +1320,6 @@
   "plans_amper_pricing": "Abonnementer & priser",
   "plans_and_pricing": "Abonnementer og priser",
   "plans_and_pricing_lowercase": "abonnementer og priser",
-  "please_ask_the_project_owner_to_upgrade_more_editors": "Venligst foreslå projektets ejer at opgradere deres abonnement for at tillade flere redaktører.",
   "please_ask_the_project_owner_to_upgrade_to_track_changes": "Du må bede projektets ejer om at opgradere, for at kunne bruge “Følg ændringer”",
   "please_change_primary_to_remove": "Skift din primære e-mailadresse for at kunne fjerne denne",
   "please_check_your_inbox_to_confirm": "Kig i din indbakke for at bekræfte din tilslutning til <0>__institutionName__</0>.",
@@ -1444,7 +1428,6 @@
   "read_lines_from_path": "Læste linjer fra __path__",
   "read_more": "Læs mere",
   "read_more_about_free_compile_timeouts_servers": "Læs mere om ændringer i kompileringstidsgrænser og servere",
-  "read_only": "Skrivebeskyttet",
   "read_only_token": "Skrivebeskyttet nøgle",
   "read_write_token": "Læse- og skrivenøgle",
   "ready_to_join_x": "Du er klar til at slutte dig til __inviterName__",
@@ -1540,12 +1523,10 @@
   "resend": "Gensend",
   "resend_confirmation_code": "Gensend bekræftelseskode",
   "resend_confirmation_email": "Gensend bekræftelsesmail",
-  "resend_email": "Gensend e-mail",
   "resend_group_invite": "Gensend gruppeinvitation",
   "resend_link_sso": "Gensend SSO invitation",
   "resend_managed_user_invite": "Gensend invitation til styrede brugere",
   "resending_confirmation_code": "Gensender bekræftelseskode",
-  "resending_confirmation_email": "Gensender bekræftelsesmail",
   "reset_password": "Nulstil dit kodeord",
   "reset_password_link": "Klik på dette link for at nulstille dit kodeord",
   "reset_your_password": "Nulstil dit kodeord",
@@ -1573,7 +1554,6 @@
   "reverse_x_sort_order": "Omvendt __x__ sortering",
   "revert_pending_plan_change": "Fortryd planlagte abonnementsændring",
   "review": "Review",
-  "review_your_peers_work": "Gennemgå dine samarbejdspartneres arbejde",
   "revoke": "Tilbagekald",
   "revoke_invite": "Tilbagekald invitation",
   "right": "Højrejusteret",
@@ -1628,7 +1608,6 @@
   "searched_path_for_lines_containing": "Ledte i __path__ efter linjer som indeholdte \"__query__\"",
   "secondary_email_password_reset": "Den e-mailaddresse er registreret som en sekundær e-mailaddresse. Du kan kun logges ind, hvis du skriver din kontos primære e-mailaddresse.",
   "security": "Sikkerhed",
-  "see_changes_in_your_documents_live": "Se ændringer i dokumentet live",
   "select_a_column_or_a_merged_cell_to_align": "Marker en kolonne eller flettet celle for at justere",
   "select_a_column_to_adjust_column_width": "Marker en kolonne for at justere kolonnebredde",
   "select_a_file": "Vælg en fil",
@@ -1850,8 +1829,6 @@
   "tags": "Tags",
   "take_me_home": "Tag mig hjem!",
   "take_short_survey": "Besvar et kort spørgeskema",
-  "tc_everyone": "Alle",
-  "tc_guests": "Gæster",
   "template": "Skabelon",
   "template_approved_by_publisher": "Denne skabelon er blevet godkendt af forlaget",
   "template_description": "Skabelonsbeskrivelse",
@@ -1967,12 +1944,7 @@
   "total_with_subtotal_and_tax": "Total: <0>__total__</0> (__subtotal__ + __tax__ moms) per år",
   "total_words": "Totalt antal ord",
   "tr": "Tyrkisk",
-  "track_any_change_in_real_time": "Følg alle ændringer i realtid",
   "track_changes": "Følg ændringer",
-  "track_changes_for_everyone": "Følg ændringer for alle",
-  "track_changes_for_x": "Følg ændringer for __name__",
-  "track_changes_is_off": "“Følg ændringer” er slået <strong>fra</strong>",
-  "track_changes_is_on": "“Følg ændringer” er slået <strong>til</strong>",
   "tracked_change_added": "Tilføjet",
   "tracked_change_deleted": "Slettet",
   "transfer_management_of_your_account": "Overdrag styring af din Overleaf konto",
@@ -2056,11 +2028,10 @@
   "upgrade_cc_btn": "Opgrader nu, betal efter 7 dage",
   "upgrade_for_12x_more_compile_time": "Opgrader for at få 12x mere kompileringstid",
   "upgrade_now": "Opgrader nu",
-  "upgrade_to_add_more_editors_and_access_collaboration_features": "Opgrader for at tilføje flere redaktører og få samarbejdsfunktioner som fulgte ændringer og fuld projekthistorik.",
   "upgrade_to_get_feature": "Opgrader for at få __feature__, plus:",
-  "upgrade_to_track_changes": "Opgrader til “Følg ændringer”",
   "upload": "Upload",
   "upload_failed": "Overførsel mislykkedes",
+  "upload_file": "Overfør Fil",
   "upload_from_computer": "Upload fra computer",
   "upload_project": "Overfør projekt",
   "upload_zipped_project": "Upload komprimeret projekt",
@@ -2121,7 +2092,6 @@
   "visual_editor_is_only_available_for_tex_files": "Den visuelle editor er kun tilgængelig for TeX filer",
   "want_access_to_overleaf_premium_features_through_your_university": "Vil du have adgang til __appName__ Premium-funktioner gennem dit universitet?",
   "want_change_to_apply_before_plan_end": "Hvis du ønsker at denne ændring skal tage effekt før slutningen på din nuværende faktureringsperiode, kontakt os venligst.",
-  "we_are_testing_a_new_reference_search": "Vi tester en ny henvisningssøgning.",
   "we_are_unable_to_opt_you_into_this_experiment": "Vi kan ikke melde dig til dette eksperiment lige nu. Tjek venligst at din organisation tillader denne funktion, eller prøv igen senere.",
   "we_cant_confirm_this_email": "Vi kan ikke bekræfte denne e-mailadresse",
   "we_cant_find_any_sections_or_subsections_in_this_file": "Vi kan ikke finde nogen sektioner eller undersektioner i denne fil",
@@ -2187,8 +2157,6 @@
   "you_can_now_log_in_sso": "Du kan nu logge ind gennem din institution of hvis du er kvalificeret får du <0>__appName__ Professionel-funktioner</0>.",
   "you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page": "Du kan på denne side til enhver tid <0>til- og framelde dig</0> programmet",
   "you_can_request_a_maximum_of_limit_fixes_per_day": "Du kan anmode om maksimalt __limit__ rettelser om dagen. Prøv venligst igen i morgen.",
-  "you_can_select_or_invite": "Du kan vælge eller invitere __count__ redaktør på dit nuværende abonnement, eller opgradere for at få flere.",
-  "you_can_select_or_invite_plural": "Du kan vælge eller invitere __count__ redaktører på dit nuværende abonnement, eller opgradere for at få flere.",
   "you_cant_add_or_change_password_due_to_sso": "Du kan ikke tilføje eller ændre dit kodeord fordi din gruppe eller organisation bruger <0>single sign-on (SSO)</0>.",
   "you_cant_join_this_group_subscription": "Du kan ikke tilslutte dig dette gruppeabonnement",
   "you_cant_reset_password_due_to_sso": "Du kan ikke nulstille dit kodeord, da din gruppe eller organisation bruger SSO. <0>Log ind med SSO</0>.",
@@ -2227,7 +2195,6 @@
   "your_plan_is_limited_to_n_editors": "Dit abonnement tillader __count__ samarbejdspartner med skriveadgang samt et ubegrænset antal læsere.",
   "your_plan_is_limited_to_n_editors_plural": "Dit abonnement tillader __count__ samarbejdspartnere med skriveadgang samt et ubegrænset antal læsere.",
   "your_project_exceeded_compile_timeout_limit_on_free_plan": "Dit projekt overskred kompileringstidsgrænsen for vores gratis abonnement.",
-  "your_project_exceeded_editor_limit": "Dit projekt overskred grænsen for antal redaktører, og adgangsniveauer er blevet ændret. Vælg et nyt adgangsniveau for dine samarbejdspartnere, eller opgrader for at tilføje flere redaktører.",
   "your_project_near_compile_timeout_limit": "Dit projekt er tæt på kompileringstidsgrænsen for vores gratis abonnement.",
   "your_projects": "Dine projekter",
   "your_questions_answered": "Svar til dine spørgsmål",
@@ -2244,7 +2211,6 @@
   "youre_on_free_trial_which_ends_on": "Du er på en gratis prøveperiode som slutter d. <0>__date__</0>.",
   "youre_signed_in_as_logout": "Du er logget ind som <0>__email__</0>. <1>Log ud.</1>",
   "youre_signed_up": "Du er oprettet",
-  "youve_lost_edit_access": "Du har mistet skriveadgang",
   "youve_unlinked_all_users": "Du har afkoblet alle brugere",
   "zh-CN": "Kinesisk",
   "zip_contents_too_large": "For stort indhold i zip-fil",
diff --git a/services/web/locales/de.json b/services/web/locales/de.json
index 41347d966e..ba9828e6da 100644
--- a/services/web/locales/de.json
+++ b/services/web/locales/de.json
@@ -4,7 +4,6 @@
   "3_4_width": "¾ Breite",
   "About": "Über uns",
   "Account": "Konto",
-  "Account Settings": "Kontoeinstellungen",
   "Documentation": "Dokumentation",
   "Projects": "Projekte",
   "Security": "Sicherheit",
@@ -20,6 +19,7 @@
   "about_to_delete_cert": "Du bist dabei, das folgende Zertifikat zu löschen:",
   "about_to_delete_projects": "Du bist kurz davor folgende Projekte zu löschen:",
   "about_to_delete_tag": "Du bist dabei, das folgende Stichwort zu löschen (darin enthaltene Projekte werden nicht gelöscht):",
+  "about_to_delete_template": "Du bist dabei, die folgende Vorlage zu löschen:",
   "about_to_delete_the_following_project": "Du bist dabei, das folgende Projekt zu löschen",
   "about_to_delete_the_following_projects": "Du bist dabei, die folgenden Projekte zu löschen",
   "about_to_delete_user_preamble": "Du bist dabei, __userName__ (__userEmail__) zu löschen. Das bedeutet:",
@@ -29,7 +29,6 @@
   "abstract": "Abstrakt",
   "accept": "Akzeptieren",
   "accept_invitation": "Einladung annehmen",
-  "accept_or_reject_each_changes_individually": "Akzeptiere oder Verwerfe jede Änderung individuell",
   "accepted_invite": "Einladung angenommen",
   "accepting_invite_as": "Du akzeptierst die Einladung als",
   "access_denied": "Zugriff verweigert",
@@ -142,7 +141,6 @@
   "buy_now_no_exclamation_mark": "Jetzt kaufen",
   "by": "von",
   "by_subscribing_you_agree_to_our_terms_of_service": "Mit der Anmeldung stimmst du unseren <0>Nutzungsbedingungen</0> zu.",
-  "can_edit": "Darf bearbeiten",
   "can_link_institution_email_acct_to_institution_acct": "Du kannst jetzt dein <b>__email__</b> <b>__appName__</b>-Konto mit deinem institutionellen <b>__institutionName__</b>-Konto verknüpfen.",
   "can_link_institution_email_by_clicking": "Du kannst dein <b>__email__</b> <b>__appName__</b>-Konto mit deinem <b>__institutionName__</b>-Konto verknüpfen, indem du auf <b>„__clickText__“</b> klickst.",
   "can_link_institution_email_to_login": "Du kannst dein <b>__email__</b> <b>__appName__</b>-Konto mit deinem <b>__institutionName__</b>-Konto verknüpfen, wodurch du dich bei <b>__appName__</b> über dein institutionelles Portal anmelden und deine institutionelle E-Mail-Adresse erneut bestätigen kannst.",
@@ -164,6 +162,7 @@
   "card_must_be_authenticated_by_3dsecure": "Deine Karte muss mit 3D Secure authentifiziert werden, bevor du fortfahren kannst",
   "card_payment": "Kartenzahlung",
   "careers": "Karriere",
+  "category": "Kategorie",
   "category_arrows": "Pfeile",
   "category_greek": "Griechisch",
   "category_misc": "Sonstiges",
@@ -300,6 +299,7 @@
   "delete_figure": "Abbildung löschen",
   "delete_projects": "Projekte archivieren",
   "delete_tag": "Stichwort löschen",
+  "delete_template": "Vorlage löschen",
   "delete_token": "Token löschen",
   "delete_user": "Nutzer löschen",
   "delete_your_account": "Lösche dein Konto",
@@ -315,10 +315,10 @@
   "disable_stop_on_first_error": "„Anhalten beim ersten Fehler“ deaktivieren",
   "disconnected": "Nicht verbunden",
   "discount_of": "__amount__ Rabatt",
-  "dismiss_error_popup": "Erste Fehlermeldung schließen",
   "do_not_have_acct_or_do_not_want_to_link": "Wenn du kein <b>__appName__</b>-Konto hast oder nicht mit deinem <b>__institutionName__</b>-Konto verknüpfen möchtest, klicke auf <b>„__clickText__“</b>.",
   "do_not_link_accounts": "Konten nicht verknüpfen",
   "do_you_want_to_change_your_primary_email_address_to": "Willst Du deine primäre E-Mail-Adresse in <b>__email__</b> ändern?",
+  "do_you_want_to_overwrite_it": "Möchtest du es überschreiben?",
   "do_you_want_to_overwrite_them": "Willst Du sie überschreiben?",
   "documentation": "Dokumentation",
   "does_not_contain_or_significantly_match_your_email": "nicht mit Teilen deiner E-Mail-Adresse übereinstimmt",
@@ -367,6 +367,7 @@
   "edit_dictionary_remove": "Aus Wörterbuch entfernen",
   "edit_figure": "Abbildung bearbeiten",
   "edit_tag": "Schlagwort bearbeiten",
+  "edit_template": "Vorlage bearbeiten",
   "editing": "Bearbeitung",
   "editing_captions": "Beschriftungen bearbeiten",
   "editor_and_pdf": "Editor & PDF",
@@ -411,6 +412,7 @@
   "expiry": "Ablaufdatum",
   "export_csv": "CSV-Datei exportieren",
   "export_project_to_github": "Projekt nach GitHub exportieren",
+  "failed_to_publish_as_a_template": "Veröffentlichung als Vorlage fehlgeschlagen.",
   "failed_to_send_managed_user_invite_to_email": "Der Versand der Einladung für Verwaltete Benutzer an <0>__email__</0> hat nicht funktioniert. Bitte versuche es später noch einmal.",
   "faq_how_does_free_trial_works_answer": "Während deines __len__-tägigen Probe-Abonnements erhältst du vollen Zugriff auf die Funktionen des von dir gewählten __appName__-Abonnements. Es besteht keine Verpflichtung, über die Testperiode hinaus fortzufahren. Deine Karte wird am Ende des __len__-tägigen Testzeitraums belastet, sofern du nicht vorher gekündigt hast. Um zu kündigen, gehe zu deinen Abonnementeinstellungen in deinem Konto.",
   "fast": "Schnell",
@@ -859,6 +861,7 @@
   "no_search_results": "Keine Suchergebnisse",
   "no_selection_select_file": "Derzeit ist keine Datei ausgewählt. Bitte wähle eine Datei aus dem Dateibaum aus.",
   "no_symbols_found": "Keine Symbole gefunden",
+  "no_templates_found": "Keine Vorlagen gefunden.",
   "no_thanks_cancel_now": "Nein, danke - Ich möchte nach wie vor jetzt stornieren",
   "no_update_email": "Nein, E-Mail-Adresse aktualisieren",
   "normal": "Normal",
@@ -943,6 +946,7 @@
   "please_change_primary_to_remove": "Bitte ändere deine primäre E-Mail-Adresse, um sie zu entfernen",
   "please_check_your_inbox_to_confirm": "Bitte überprüfe deinen E-Mail-Postfach, um deine Zugehörigkeit zu <0>__institutionName__</0> zu bestätigen.",
   "please_compile_pdf_before_download": "Bitte kompiliere dein Projekt, bevor du das PDF herunterlädst",
+  "please_compile_pdf_before_publish_as_template": "Bitte kompiliere dein Projekt, bevor du es als Vorlage veröffentlichst.",
   "please_compile_pdf_before_word_count": "Bitte kompiliere dein Projekt, bevor du eine Wortzählung durchführst.",
   "please_confirm_email": "Bitte bestätige deine E-Mail-Adresse __emailAddress__, indem du auf den Link in der Bestätigungs-E-Mail klickst",
   "please_confirm_your_email_before_making_it_default": "Bitte bestätige deine E-Mail-Adresse, bevor du sie zur primären machst.",
@@ -1001,7 +1005,6 @@
   "push_sharelatex_changes_to_github": "__appName__-Änderungen an GitHub senden",
   "raw_logs": "Raw Logs",
   "raw_logs_description": "Raw Logs vom LaTeX-Compiler",
-  "read_only": "Nur Lesen",
   "realtime_track_changes": "Änderungen in Echtzeit nachverfolgen",
   "reauthorize_github_account": "Autorisiere dein GitHub-Konto erneut",
   "recaptcha_conditions": "Diese Website ist durch reCAPTCHA geschützt und es gelten die <1>Datenschutzerklärung</1> und die <2>Nutzungsbedingungen</2> von Google.",
@@ -1064,7 +1067,6 @@
   "resend": "Sende erneut",
   "resend_confirmation_email": "Bestätigungs-E-Mail erneut senden",
   "resend_managed_user_invite": "Einladung zu Verwaltete Benutzer erneut senden",
-  "resending_confirmation_email": "Bestätigungs-E-Mail wird erneut gesendet",
   "reset_password": "Passwort zurücksetzen",
   "reset_your_password": "Dein Passwort zurücksetzen",
   "resolve": "Lösen",
@@ -1076,7 +1078,6 @@
   "return_to_login_page": "Zurück zur Login-Seite",
   "revert_pending_plan_change": "Abonnement-Änderung rückgängig machen",
   "review": "Überprüfen",
-  "review_your_peers_work": "Überprüfe die Arbeit deiner Kollegen",
   "revoke": "Zurückziehen",
   "revoke_invite": "Einladung zurückziehen",
   "ro": "Rumänisch",
@@ -1103,7 +1104,6 @@
   "search_replace_all": "Alles Ersetzen",
   "secondary_email_password_reset": "Diese E-Mail-Adresse ist als sekundäre E-Mail-Adresse hinterlegt. Bitte gib die primäre E-Mail-Adresse für dein Konto an.",
   "security": "Sicherheit",
-  "see_changes_in_your_documents_live": "Verfolge Änderungen in deinen Dokumenten, live",
   "select_a_file": "Datei auswählen",
   "select_a_project": "Projekt auswählen",
   "select_all_projects": "Alle Projekte auswählen",
@@ -1198,8 +1198,6 @@
   "tags": "Stichworte",
   "take_me_home": "Bring mich nach Hause!",
   "take_short_survey": "Nimm an einer kurzen Umfrage teil",
-  "tc_everyone": "Jeder",
-  "tc_guests": "Gäste",
   "template": "Vorlage",
   "template_approved_by_publisher": "Diese Vorlage wurde vom Verlag genehmigt",
   "template_description": "Vorlagenbeschreibung",
@@ -1207,6 +1205,7 @@
   "template_not_found_description": "Diese Methode zum Erstellen von Projekten aus Vorlagen wurde entfernt. Besuche unsere Vorlagengalerie, um weitere Vorlagen zu finden.",
   "template_title_taken_from_project_title": "Der Vorlagentitel wird automatisch aus dem Projekttitel übernommen",
   "template_top_pick_by_overleaf": "Diese Vorlage wurde von Overleaf-Mitarbeitern aufgrund ihrer hohen Qualität ausgewählt",
+  "template_with_this_title_exists_and_owned_by_x": "Eine Vorlage mit diesem Namen existiert bereits, und der Besitzer ist: __x__.",
   "templates": "Vorlagen",
   "templates_admin_source_project": "Administration: Quellprojekt",
   "templates_page_title": "Vorlagen - Zeitschriften, Lebensläufe, Präsentationen, Berichte und mehr",
@@ -1262,10 +1261,7 @@
   "total_per_year": "Insgesamt pro Jahr",
   "total_words": "Gesamtwortanzahl",
   "tr": "Türkisch",
-  "track_any_change_in_real_time": "Verfolge jegliche Änderung, in Echtzeit",
   "track_changes": "Änderungen verfolgen",
-  "track_changes_is_off": "Änderungen verfolgen ist <strong>aus</strong>",
-  "track_changes_is_on": "Änderungen verfolgen ist <strong>an</strong>",
   "tracked_change_added": "Hinzugefügt",
   "tracked_change_deleted": "Gelöscht",
   "trash": "Löschen",
@@ -1279,6 +1275,7 @@
   "try_it_for_free": "Probiere es kostenlos aus",
   "try_now": "Jetzt versuchen",
   "try_premium_for_free": "Teste Premium kostenlos",
+  "try_recompile_project": "Versuche bitte, das Projekt von Grund auf neu zu kompilieren.",
   "try_recompile_project_or_troubleshoot": "Versuche bitte, das Projekt von Grund auf neu zu kompilieren. Wenn das Problem weiterhin besteht, findest Du im <0>Troubleshooting Guide</0> weitere Hilfe",
   "try_to_compile_despite_errors": "Versuche, trotz Fehler zu kompilieren",
   "turn_off_link_sharing": "Deaktiviere die Linkfreigabe",
@@ -1291,6 +1288,7 @@
   "unconfirmed": "Unbestätigt",
   "unfold_line": "Zeile ausklappen",
   "university": "Universität",
+  "unknown": "Unbekannt",
   "unlimited": "Unbegrenzt",
   "unlimited_collabs": "Unbeschränkt viele Mitarbeiter",
   "unlimited_projects": "Unbegrenzte Projekte",
@@ -1319,9 +1317,9 @@
   "upgrade_cc_btn": "Upgrade jetzt, zahle nach sieben Tagen",
   "upgrade_now": "Jetzt aktualisieren",
   "upgrade_to_get_feature": "Upgrade nötig, um __feature__ zu bekommen, sowie zusätzlich:",
-  "upgrade_to_track_changes": "Upgrade, um Änderungen verfolgen zu können",
   "upload": "Hochladen",
   "upload_failed": "Hochladen fehlgeschlagen",
+  "upload_file": "Datei hochladen",
   "upload_project": "Projekt hochladen",
   "upload_zipped_project": "Projekt als ZIP hochladen",
   "url_to_fetch_the_file_from": "URL, von der die Datei abgerufen werden soll",
@@ -1364,8 +1362,10 @@
   "x_price_per_year": "__price__ pro Jahr",
   "year": "Jahr",
   "yes_that_is_correct": "Ja, das ist richtig",
+  "you": "Du",
   "you_can_now_log_in_sso": "Du kannst dich jetzt über deine Institution anmelden und möglicherweise <0>kostenlose __appName__ „Professionell“-Funktionen</0> erhalten!",
   "you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page": "Du kannst dich jederzeit auf dieser Seite für das Beta-Programm an- und abmelden",
+  "you_cant_overwrite_it": "Überschreiben ist nicht möglich.",
   "you_have_added_x_of_group_size_y": "Du hast <0>__addedUsersSize__</0> von <1>__groupSize__</1> verfügbaren Mitgliedern hinzugefügt",
   "you_will_be_able_to_contact_us_any_time_to_share_your_feedback": "Du kannst uns jederzeit kontaktieren, um uns dein Feedback mitzuteilen",
   "your_affiliation_is_confirmed": "Deine Zugehörigkeit zu <0>__institutionName__</0> ist bestätigt.",
diff --git a/services/web/locales/en.json b/services/web/locales/en.json
index 5083303331..66b0fceee3 100644
--- a/services/web/locales/en.json
+++ b/services/web/locales/en.json
@@ -1,12 +1,13 @@
 {
-  "12x_basic": "12x Basic",
-  "12x_more_compile_time": "12x more compile time on our fastest servers",
+  "0_free_suggestions": "0 free suggestions",
   "1_2_width": "½ width",
   "1_4_width": "¼ width",
+  "1_free_suggestion": "1 free suggestion",
+  "24x_basic": "24x Basic",
+  "24x_more_compile_time": "24x more compile time on our fastest servers",
   "3_4_width": "¾ width",
   "About": "About",
   "Account": "Account",
-  "Account Settings": "Account Settings",
   "Documentation": "Documentation",
   "Projects": "Projects",
   "Security": "Security",
@@ -27,38 +28,42 @@
   "about_to_delete_cert": "You are about to delete the following certificate:",
   "about_to_delete_projects": "You are about to delete the following projects:",
   "about_to_delete_tag": "You are about to delete the following tag (any projects in them will not be deleted):",
+  "about_to_delete_template": "You are about to delete the following template:",
   "about_to_delete_the_following_project": "You are about to delete the following project",
   "about_to_delete_the_following_projects": "You are about to delete the following projects",
   "about_to_delete_user_preamble": "You’re about to delete __userName__ (__userEmail__). Doing this will mean:",
   "about_to_enable_managed_users": "By enabling the Managed Users feature, all existing members of your group subscription will be invited to become managed. This will give you admin rights over their account. You will also have the option to invite new members to join the subscription and become managed.",
   "about_to_leave_project": "You are about to leave this project.",
   "about_to_leave_projects": "You are about to leave the following projects:",
+  "about_to_remove_user_preamble": "You’re about to remove __userName__ (__userEmail__). Doing this will mean:",
   "about_to_trash_projects": "You are about to trash the following projects:",
-  "about_writefull": "About Writefull",
   "abstract": "Abstract",
   "accept": "Accept",
+  "accept_all_cookies": "Accept all cookies",
   "accept_and_continue": "Accept and continue",
   "accept_change": "Accept change",
   "accept_change_error_description": "There was an error accepting a track change. Please try again in a few moments.",
   "accept_change_error_title": "Accept Change Error",
   "accept_invitation": "Accept invitation",
-  "accept_or_reject_each_changes_individually": "Accept or reject each change individually",
+  "accept_or_reject_individual_edits": "Accept or reject individual edits",
   "accept_selected_changes": "Accept selected changes",
   "accept_terms_and_conditions": "Accept terms and conditions",
   "accepted_invite": "Accepted invite",
   "accepting_invite_as": "You are accepting this invite as",
+  "access_all_premium_features": "Access all premium features, including more collaborators, full project history, and a longer compile time.",
   "access_denied": "Access Denied",
   "access_edit_your_projects": "Access and edit your projects",
   "access_levels_changed": "Access levels changed",
+  "access_your_favourite_features_faster_with_our_new_streamlined_editor": "Access your favourite features faster with our new, streamlined editor.",
   "account": "Account",
   "account_already_managed": "Your account is already managed.",
   "account_billed_manually": "Account billed manually",
   "account_has_been_link_to_institution_account": "Your __appName__ account on <b>__email__</b> has been linked to your <b>__institutionName__</b> institutional account.",
   "account_has_past_due_invoice_change_plan_warning": "Your account currently has a past due invoice. You will not be able to change your plan until this is resolved.",
-  "account_linking": "Account Linking",
+  "account_linking": "Account linking",
   "account_managed_by_group_administrator": "Your account is managed by your group administrator (__admin__)",
   "account_not_linked_to_dropbox": "Your account is not linked to Dropbox",
-  "account_settings": "Account Settings",
+  "account_settings": "Account settings",
   "account_with_email_exists": "It looks like an <b>__appName__</b> account with the email <b>__email__</b> already exists.",
   "acct_linked_to_institution_acct_2": "You can <0>log in</0> to Overleaf through your <0>__institutionName__</0> institutional login.",
   "actions": "Actions",
@@ -71,7 +76,11 @@
   "add_a_recovery_email_address": "Add a recovery email address",
   "add_add_on_to_your_plan": "Add __addOnName__ to your plan",
   "add_additional_certificate": "Add another certificate",
-  "add_affiliation": "Add Affiliation",
+  "add_affiliation": "Add affiliation",
+  "add_ai_assist": "Add AI Assist",
+  "add_ai_assist_annual_and_get_unlimited_access": "Add <sparkle/> AI Assist Annual and get unlimited* access to Overleaf and Writefull AI features.",
+  "add_ai_assist_monthly_and_get_unlimited_access": "Add <sparkle/> AI Assist Monthly and get unlimited* access to Overleaf and Writefull AI features.",
+  "add_ai_assist_to_your_plan": "Add <sparkle/> AI Assist to your plan and get unlimited* access to Overleaf and Writefull AI features.",
   "add_another_address_line": "Add another address line",
   "add_another_email": "Add another email",
   "add_another_token": "Add another token",
@@ -79,29 +88,28 @@
   "add_comment": "Add comment",
   "add_comment_error_message": "There was an error adding your comment. Please try again in a few moments.",
   "add_comment_error_title": "Add Comment Error",
-  "add_company_details": "Add Company Details",
-  "add_company_details_lowercase": "Add company details",
-  "add_email": "Add Email",
+  "add_company_details": "Add company details",
+  "add_email": "Add email",
   "add_email_address": "Add email address",
   "add_email_to_claim_features": "Add an institutional email address to claim your features.",
   "add_error_assist_annual_to_your_projects": "Add Error Assist Annual <sparkle/> to your projects and get unlimited AI help to fix LaTeX errors faster.",
   "add_error_assist_to_your_projects": "Add Error Assist <sparkle/> to your projects and get unlimited AI help to fix LaTeX errors faster.",
-  "add_files": "Add Files",
-  "add_more_editors": "Add more editors",
+  "add_files": "Add files",
+  "add_more_collaborators": "Add more collaborators",
   "add_more_licenses_to_my_plan": "Add more licenses to my plan",
   "add_more_managers": "Add more managers",
   "add_new_email": "Add new email",
   "add_on": "Add-on",
   "add_ons": "Add-ons",
+  "add_ons_for_any_plan": "Add-ons for any plan",
+  "add_ons_for_any_plan_subheading": "Buy add-ons for any Overleaf plan (including the free plan) to unlock additional features.",
   "add_or_remove_project_from_tag": "Add or remove project from tag __tagName__",
-  "add_overleaf_assist": "Add Overleaf Assist",
-  "add_overleaf_assist_to_your_group_subscription": "Add Overleaf Assist to your group subscription",
-  "add_overleaf_assist_to_your_institution": "Add Overleaf Assist to your institution",
-  "add_overleaf_assist_to_your_plan": "Add Overelaf assist to your __planName__ plan",
   "add_people": "Add people",
   "add_role_and_department": "Add role and department",
-  "add_to_dictionary": "Add to Dictionary",
+  "add_to_dictionary": "Add to dictionary",
   "add_to_tag": "Add to tag",
+  "add_unlimited_ai_to_overleaf": "Add unlimited AI* to Overleaf",
+  "add_unlimited_ai_to_your_overleaf_plan": "Add unlimited AI* to your Overleaf __planName__ plan",
   "add_your_comment_here": "Add your comment here",
   "add_your_first_group_member_now": "Add your first group members now",
   "added": "added",
@@ -122,7 +130,13 @@
   "after_that_well_bill_you_x_total_y_subtotal_z_tax_annually_on_date_unless_you_cancel": "After that, we’ll bill you __totalAmount__ (__subtotalAmount__ + __taxAmount__ tax) annually on __date__, unless you cancel.",
   "aggregate_changed": "Changed",
   "aggregate_to": "to",
+  "agree": "Agree",
   "agree_with_the_terms": "I agree with the Overleaf terms",
+  "ai_assist": "AI Assist",
+  "ai_assist_description": "AI Assist combines AI tools from Overleaf and Writefull to help you write faster, smarter and with confidence.",
+  "ai_assist_in_overleaf_is_included_via_writefull_groups": "AI Assist in Overleaf is included as part of your group or organization’s Writefull subscription. To make changes you’ll need to speak to your subscription admin",
+  "ai_assist_in_overleaf_is_included_via_writefull_individual": "AI Assist in Overleaf is included as part of your Writefull subscription. You can cancel or manage your access to AI Assist in your Writefull subscription settings.",
+  "ai_assist_unavailable_due_to_subscription_type": "We’re sorry—it looks like AI Assist isn’t available to you just yet due to your current subscription type.",
   "ai_assistance_to_help_you": "AI assistance to help you fix LaTeX errors",
   "ai_based_language_tools": "AI-based language tools tailored to research writing",
   "ai_can_make_mistakes": "AI can make mistakes. Review fixes before you apply them.",
@@ -141,21 +155,22 @@
   "all_premium_features": "All premium features",
   "all_premium_features_including": "All premium features, including:",
   "all_prices_displayed_are_in_currency": "All prices displayed are in __recommendedCurrency__.",
-  "all_projects": "All Projects",
+  "all_projects": "All projects",
   "all_projects_will_be_transferred_immediately": "All projects will be transferred to the new owner immediately.",
-  "all_templates": "All Templates",
+  "all_templates": "All templates",
   "all_the_pros_of_our_standard_plan_plus_unlimited_collab": "All the pros of our standard plan, plus unlimited collaborators per project.",
   "all_these_experiments_are_available_exclusively": "All these experiments are available exclusively to members of the Labs program. If you sign up, you can choose which experiments you want to try.",
   "allows_to_search_by_author_title_etc_possible_to_pull_results_directly_from_your_reference_manager_if_connected": "Allows to search by author, title, etc. Possible to pull results directly from your reference manager (if connected).",
   "already_have_an_account": "Already have an account?",
   "already_have_sl_account": "Already have an __appName__ account?",
-  "already_subscribed_try_refreshing_the_page": "Already subscribed? Try refreshing the page.",
   "also": "Also",
   "alternatively_create_new_institution_account": "Alternatively, you can create a <b>new account</b> with your institution email (<b>__email__</b>) by clicking <b>__clickText__</b>.",
+  "alternatively_create_local_admin_account": "Alternatively, you can create __appName__ local admin account.",
   "an_email_has_already_been_sent_to": "An email has already been sent to <0>__email__</0>. Please wait and try again later.",
   "an_error_occured_while_restoring_project": "An error occured while restoring the project",
   "an_error_occurred_when_verifying_the_coupon_code": "An error occurred when verifying the coupon code",
   "and": "and",
+  "and_upgrade_for_compile_time": "And you can <strong>upgrade to get more compile time</strong>.",
   "annual": "Annual",
   "annual_discount": "Annual discount",
   "anonymous": "Anonymous",
@@ -169,9 +184,9 @@
   "apply_suggestion": "Apply suggestion",
   "april": "April",
   "archive": "Archive",
-  "archive_projects": "Archive Projects",
+  "archive_projects": "Archive projects",
   "archived": "Archived",
-  "archived_projects": "Archived Projects",
+  "archived_projects": "Archived projects",
   "archiving_projects_wont_affect_collaborators": "Archiving projects won’t affect your collaborators.",
   "are_you_affiliated_with_an_institution": "Are you affiliated with an institution?",
   "are_you_getting_an_undefined_control_sequence_error": "Are you getting an Undefined Control Sequence error? If you are, make sure you’ve loaded the graphicx package—<0>\\usepackage{graphicx}</0>—in the preamble (first section of code) in your document. <1>Learn more</1>",
@@ -191,7 +206,7 @@
   "august": "August",
   "author": "Author",
   "auto_close_brackets": "Auto-close brackets",
-  "auto_compile": "Auto Compile",
+  "auto_compile": "Auto compile",
   "auto_complete": "Auto-complete",
   "autocompile": "Autocompile",
   "autocompile_disabled": "Autocompile disabled",
@@ -208,12 +223,11 @@
   "back_to_configuration": "Back to configuration",
   "back_to_editor": "Back to editor",
   "back_to_log_in": "Back to log in",
-  "back_to_subscription": "Back to Subscription",
+  "back_to_subscription": "Back to subscription",
   "back_to_your_projects": "Back to your projects",
   "basic": "Basic",
   "basic_compile_time": "Basic compile time",
   "basic_compile_timeout_on_fast_servers": "Basic compile timeout on fast servers",
-  "become_an_advisor": "Become an __appName__ advisor",
   "before_you_use_error_assistant": "Before you use Error Assist",
   "beta": "Beta",
   "beta_feature_badge": "Beta feature badge",
@@ -224,19 +238,23 @@
   "beta_program_opt_in_action": "Opt-In to Beta Program",
   "beta_program_opt_out_action": "Opt-Out of Beta Program",
   "bibliographies": "Bibliographies",
-  "billed_annually": "billed annually",
   "billed_annually_at": "Billed annually at <0>__price__</0> <1>(includes plan and any add-ons)</1>",
   "billed_monthly_at": "Billed monthly at <0>__price__</0> <1>(includes plan and any add-ons)</1>",
   "billed_yearly": "billed yearly",
   "billing": "Billing",
   "billing_period_sentence_case": "Billing period",
   "binary_history_error": "Preview not available for this file type",
-  "blank_project": "Blank Project",
+  "blank_project": "Blank project",
   "blocked_filename": "This file name is blocked.",
   "blog": "Blog",
+  "bold": "Bold",
+  "booktabs": "Booktabs",
+  "breadcrumbs": "Breadcrumbs",
   "brl_discount_offer_plans_page_banner": "__flag__ <b>Great news!</b> We’ve applied a 50% discount to premium plans on this page for our users in Brazil. Check out the new lower prices.",
   "browser": "Browser",
   "built_in": "Built-In",
+  "bullet_list": "Bullet list",
+  "buy_add_on": "Buy add-on",
   "buy_licenses": "Buy licenses",
   "buy_more_licenses": "Buy more licenses",
   "buy_now_no_exclamation_mark": "Buy now",
@@ -244,7 +262,6 @@
   "by_joining_labs": "By joining Labs, you agree to receive occasional emails and updates from Overleaf—for example, to request your feedback. You also agree to our <0>terms of service</0> and <1>privacy notice</1>.",
   "by_registering_you_agree_to_our_terms_of_service": "By registering, you agree to our <0>terms of service</0> and <1>privacy notice</1>.",
   "by_subscribing_you_agree_to_our_terms_of_service": "By subscribing, you agree to our <0>terms of service</0>.",
-  "can_edit_content": "Can edit content",
   "can_link_institution_email_acct_to_institution_acct": "You can now link your <b>__email__</b> <b>__appName__</b> account to your <b>__institutionName__</b> institutional account.",
   "can_link_institution_email_by_clicking": "You can link your <b>__email__</b> <b>__appName__</b> account to your  <b>__institutionName__</b> account by clicking <b>__clickText__</b>.",
   "can_link_institution_email_to_login": "You can link your <b>__email__</b> <b>__appName__</b> account to your <b>__institutionName__</b> account, which will allow you to log in to <b>__appName__</b> through your institution and will reconfirm your institutional email address.",
@@ -253,7 +270,9 @@
   "can_view_content": "Can view content",
   "cancel": "Cancel",
   "cancel_add_on": "Cancel add-on",
-  "cancel_anytime": "We’re confident that you’ll love __appName__, but if not you can cancel anytime. We’ll give you your money back, no questions asked, if you let us know within 30 days.",
+  "cancel_any_existing_subscriptions": "Cancel any existing subscriptions. <0>This can be managed from the Subscription page.</0>",
+  "cancel_any_existing_subscriptions_and_leave_any_group_subscriptions": "Cancel any existing subscriptions, and leave any group subscriptions other than the one managing your account. <0>This can be managed from the Subscription page.</0>",
+  "cancel_anytime": "We’re confident that you’ll love __appName__, but if not, you can cancel anytime and request your money back, hassle free, within 30 days.",
   "cancel_my_account": "Cancel my subscription",
   "cancel_my_subscription": "Cancel my subscription",
   "cancel_personal_subscription_first": "You already have an individual subscription, would you like us to cancel this first before joining the group licence?",
@@ -267,12 +286,14 @@
   "cant_see_what_youre_looking_for_question": "Can’t see what you’re looking for?",
   "caption_above": "Caption above",
   "caption_below": "Caption below",
+  "captions": "Captions",
   "card_details": "Card details",
   "card_details_are_not_valid": "Card details are not valid",
   "card_must_be_authenticated_by_3dsecure": "Your card must be authenticated with 3D Secure before continuing",
   "card_payment": "Card payment",
   "careers": "Careers",
   "categories": "Categories",
+  "category": "Category",
   "category_arrows": "Arrows",
   "category_greek": "Greek",
   "category_misc": "Misc",
@@ -282,17 +303,18 @@
   "certificate": "Certificate",
   "change": "Change",
   "change_currency": "Change currency",
+  "change_email": "Change email",
   "change_language": "Change language",
   "change_or_cancel-cancel": "cancel",
   "change_or_cancel-change": "Change",
   "change_or_cancel-or": "or",
   "change_owner": "Change owner",
-  "change_password": "Change Password",
-  "change_password_in_account_settings": "Change password in Account Settings",
+  "change_password": "Change password",
+  "change_password_in_account_settings": "Change password in Account settings",
   "change_plan": "Change plan",
   "change_primary_email": "Change primary email",
-  "change_primary_email_address_instructions": "To change your primary email, please add your new primary email address first (by clicking <0>Add another email</0>) and confirm it. Then click the <0>Make Primary</0> button. <1>Learn more</1> about managing your __appName__ emails.",
-  "change_project_owner": "Change Project Owner",
+  "change_primary_email_address_instructions": "To change your primary email, please add your new primary email address first (by clicking <0>Add another email</0>) and confirm it. Then click the <0>Make primary</0> button. <1>Learn more about managing your __appName__ emails</1>.",
+  "change_project_owner": "Change project owner",
   "change_the_ownership_of_your_personal_projects": "Change the ownership of your personal projects to the new account. <0>Find out how to change project owner.</0>",
   "change_to_group_plan": "Change to a group plan",
   "change_to_this_plan": "Change to this plan",
@@ -310,18 +332,18 @@
   "choose_how_you_search_your_references": "Choose how you search your references",
   "choose_which_experiments": "Choose which experiments you’d like to try.",
   "choose_your_plan": "Choose your plan",
+  "citation": "Citation",
   "city": "City",
   "clear_cached_files": "Clear cached files",
   "clear_search": "clear search",
-  "clear_sessions": "Clear Sessions",
-  "clear_sessions_description": "This is a list of other sessions (logins) which are active on your account, not including your current session. Click the \"Clear Sessions\" button below to log them out.",
-  "clear_sessions_success": "Sessions Cleared",
+  "clear_sessions": "Clear sessions",
+  "clear_sessions_description": "This is a list of other sessions (logins) which are active on your account, not including your current session. Click the \"Clear sessions\" button below to log them out.",
+  "clear_sessions_success": "Sessions cleared",
   "clearing": "Clearing",
   "click_here_to_view_sl_in_lng": "Click here to use __appName__ in <0>__lngName__</0>",
   "click_link_to_proceed": "Click <b>__clickText__</b> below to proceed.",
-  "click_to_give_feedback": "Click to give feedback.",
   "click_to_unpause": "Click to unpause and reactivate your Overleaf premium features.",
-  "clicking_delete_will_remove_sso_config_and_clear_saml_data": "Clicking <0>Delete</0> will remove your SSO configuration and unlink all users. You can only do this when SSO is disabled in your Group settings.",
+  "clicking_delete_will_remove_sso_config_and_clear_saml_data": "Clicking <0>Delete</0> will remove your SSO configuration and unlink all users. You can only do this when SSO is disabled in your group settings.",
   "clone_with_git": "Clone with Git",
   "close": "Close",
   "clsi_maintenance": "The compile servers are down for maintenance, and will be back shortly.",
@@ -330,8 +352,6 @@
   "code_check_failed": "Code check failed",
   "code_check_failed_explanation": "Your code has errors that need to be fixed before the auto-compile can run",
   "code_editor": "Code Editor",
-  "code_editor_tooltip_message": "You can see the code behind your project (and make edits to it) in the Code Editor",
-  "code_editor_tooltip_title": "Want to view and edit the LaTeX code?",
   "collaborate_easily_on_your_projects": "Collaborate easily on your projects. Work on longer or more complex docs.",
   "collaborate_online_and_offline": "Collaborate online and offline, using your own workflow",
   "collaboration": "Collaboration",
@@ -339,6 +359,7 @@
   "collaborator_chat": "Collaborator chat",
   "collabratec_account_not_registered": "IEEE Collabratec™ account not registered. Please connect to Overleaf from IEEE Collabratec™ or log in with a different account.",
   "collabs_per_proj": "__collabcount__ collaborators per project",
+  "collabs_per_proj_multiple": "Multiple collaborators per project",
   "collabs_per_proj_single": "__collabcount__ collaborator per project",
   "collapse": "Collapse",
   "column_width": "Column width",
@@ -347,45 +368,49 @@
   "comment": "Comment",
   "comment_only": "Comment only",
   "comment_only_upgrade_for_track_changes": "Comment only. Upgrade for track changes.",
+  "comment_only_upgrade_to_enable_track_changes": "Comment only. <0>Upgrade</0> to enable track changes.",
   "common": "Common",
   "common_causes_of_compile_timeouts_include": "Common causes of compile timeouts include",
   "commons_plan_tooltip": "You’re on the __plan__ plan because of your affiliation with __institution__. Click to find out how to make the most of your Overleaf premium features.",
   "community_articles": "Community articles",
   "community_articles_lowercase": "community articles",
   "compact": "Compact",
-  "company_name": "Company Name",
+  "company_name": "Company name",
   "compare": "Compare",
   "compare_all_plans": "Compare all plans on our <0>pricing page</0>",
   "compare_features": "Compare features",
   "comparing_from_x_to_y": "Comparing from <0>__startTime__</0> to <0>__endTime__</0>",
   "compile_error_entry_description": "An error which prevented this project from compiling",
-  "compile_error_handling": "Compile Error Handling",
+  "compile_error_handling": "Compile error handling",
   "compile_larger_projects": "Compile larger projects",
-  "compile_mode": "Compile Mode",
+  "compile_limit_reached": "Compile limit reached",
+  "compile_limit_upgrade_prompt": "Your document took longer than the free plan’s compile window. Upgrade to Overleaf Premium for extended compile durations, priority build servers, and uninterrupted LaTeX processing—so you can focus on writing, not waiting.",
+  "compile_mode": "Compile mode",
   "compile_servers": "Compile servers",
   "compile_servers_info_new": "The servers used to compile your project. Compiles for users on paid plans always run on the fastest available servers.",
-  "compile_terminated_by_user": "The compile was cancelled using the ‘Stop Compilation’ button. You can download the raw logs to see where the compile stopped.",
+  "compile_terminated_by_user": "The compile was cancelled using the ‘Stop compilation’ button. You can download the raw logs to see where the compile stopped.",
   "compile_timeout_short": "Compile timeout",
   "compile_timeout_short_info_new": "This is how much time you get to compile your project on Overleaf. You may need additional time for longer or more complex projects.",
   "compiler": "Compiler",
   "compiling": "Compiling",
   "complete": "Complete",
   "compliance": "Compliance",
-  "compromised_password": "Compromised Password",
+  "compromised_password": "Compromised password",
   "configure_sso": "Configure SSO",
   "configured": "Configured",
   "confirm": "Confirm",
   "confirm_accept_selected_changes": "Are you sure you want to accept the selected change?",
   "confirm_accept_selected_changes_plural": "Are you sure you want to accept the selected __count__ changes?",
-  "confirm_affiliation": "Confirm Affiliation",
+  "confirm_affiliation": "Confirm affiliation",
   "confirm_affiliation_to_relink_dropbox": "Please confirm you are still at the institution and on their license, or upgrade your account in order to relink your Dropbox account.",
   "confirm_delete_user_type_email_address": "To confirm you want to delete __userName__ please type the email address associated with their account",
-  "confirm_email": "Confirm Email",
+  "confirm_email": "Confirm email",
   "confirm_new_password": "Confirm new password",
   "confirm_primary_email_change": "Confirm primary email change",
   "confirm_reject_selected_changes": "Are you sure you want to reject the selected change?",
   "confirm_reject_selected_changes_plural": "Are you sure you want to reject the selected __count__ changes?",
   "confirm_remove_sso_config_enter_email": "To confirm you want to remove your SSO configuration, enter your email address:",
+  "confirm_remove_user_type_email_address": "To confirm you want to remove __userName__ please type the email address associated with their account.",
   "confirm_secondary_email": "Confirm secondary email",
   "confirm_your_email": "Confirm your email address",
   "confirmation_link_broken": "Sorry, something is wrong with your confirmation link. Please try copy and pasting the link from the bottom of your confirmation email.",
@@ -393,17 +418,17 @@
   "confirming": "Confirming",
   "conflicting_paths_found": "Conflicting Paths Found",
   "congratulations_youve_successfully_join_group": "Congratulations! You‘ve successfully joined the group subscription.",
-  "connect_overleaf_with_github": "Connect __appName__ with Github for easy project syncing and real-time version control.",
-  "connected_users": "Connected Users",
+  "connect_overleaf_with_github": "Connect __appName__ with GitHub for easy project syncing and real-time version control.",
+  "connected_users": "Connected users",
   "connecting": "Connecting",
   "connection_lost_with_unsaved_changes": "Connection lost with unsaved changes.",
   "contact": "Contact",
   "contact_group_admin": "Please contact your group administrator.",
   "contact_message_label": "Message",
-  "contact_sales": "Contact Sales",
+  "contact_sales": "Contact sales",
   "contact_support": "Contact Support",
-  "contact_support_to_change_group_subscription": "Please <0>contact support</0> if you wish to change your group subscription.",
-  "contact_us": "Contact Us",
+  "contact_support_to_change_group_subscription": "Please <0>contact Support</0> if you wish to change your group subscription.",
+  "contact_us": "Contact us",
   "contact_us_lowercase": "Contact us",
   "contacting_the_sales_team": "Contacting the Sales team",
   "continue": "Continue",
@@ -412,10 +437,12 @@
   "continue_using_free_features": "Continue using our free features",
   "continue_with_free_plan": "Continue with free plan",
   "continue_with_service": "Continue with __service__",
+  "cookie_banner": "Cookie banner",
+  "cookie_banner_info": "We only use cookies for essential purposes and to improve your experience on our site. You can find out more in our <0>cookie policy</0>.",
   "copied": "Copied",
   "copy": "Copy",
   "copy_code": "Copy code",
-  "copy_project": "Copy Project",
+  "copy_project": "Copy project",
   "copy_response": "Copy response",
   "copying": "Copying",
   "cost_summary": "Cost summary",
@@ -437,9 +464,11 @@
   "create_new_subscription": "Create new subscription",
   "create_new_tag": "Create new tag",
   "create_project_in_github": "Create a GitHub repository",
+  "created": "Created",
   "created_at": "Created at",
   "creating": "Creating",
   "credit_card": "Credit Card",
+  "cross_reference": "Cross reference",
   "cs": "Czech",
   "currency": "Currency",
   "current_file": "Current file",
@@ -453,6 +482,7 @@
   "custom": "Custom",
   "custom_borders": "Custom borders",
   "customer_resource_portal": "Customer resource portal",
+  "customer_stories": "Customer stories",
   "customize": "Customize",
   "customize_your_group_subscription": "Customize your group subscription",
   "customizing_figures": "Customizing figures",
@@ -464,10 +494,11 @@
   "de": "German",
   "dealing_with_errors": "Dealing with errors",
   "december": "December",
+  "decrease_indent": "Decrease indentation",
   "dedicated_account_manager": "Dedicated account manager",
   "default": "Default",
   "delete": "Delete",
-  "delete_account": "Delete Account",
+  "delete_account": "Delete account",
   "delete_account_confirmation_label": "I understand this will delete all projects in my __appName__ account with email address <0>__userDefaultEmail__</0>",
   "delete_account_warning_message_3": "You are about to permanently <strong>delete all of your account data</strong>, including your projects and settings. Please type your account email address and password in the boxes below to proceed.",
   "delete_acct_no_existing_pw": "Please use the password reset form to set a password before deleting your account",
@@ -488,6 +519,7 @@
   "delete_sso_config": "Delete SSO configuration",
   "delete_table": "Delete table",
   "delete_tag": "Delete Tag",
+  "delete_template": "Delete template",
   "delete_token": "Delete token",
   "delete_user": "Delete user",
   "delete_your_account": "Delete your account",
@@ -496,6 +528,7 @@
   "deleted_by_id": "Deleted By ID",
   "deleted_by_ip": "Deleted By IP",
   "deleted_by_on": "Deleted by __name__ on __date__",
+  "deleted_user": "Deleted user",
   "deleting": "Deleting",
   "demonstrating_git_integration": "Demonstrating Git integration",
   "demonstrating_track_changes_feature": "Demonstrating Track Changes feature",
@@ -510,17 +543,24 @@
   "disable_equation_preview": "Disable equation preview",
   "disable_equation_preview_confirm": "This will disable equation preview for you in all projects.",
   "disable_equation_preview_enable": "You can enable it again from the <b>Menu</b>.",
+  "disable_equation_preview_enable_in_settings": "You can enable it again in <b>Settings</b>.",
   "disable_single_sign_on": "Disable single sign-on",
   "disable_sso": "Disable SSO",
   "disable_stop_on_first_error": "Disable “Stop on first error”",
+  "disabled": "Disabled",
+  "disabling": "Disabling",
+  "disagree": "Disagree",
   "disconnected": "Disconnected",
   "discount": "Discount",
   "discount_of": "Discount of __amount__",
   "discover_latex_templates_and_examples": "Discover LaTeX templates and examples to help with everything from writing a journal article to using a specific LaTeX package.",
+  "discover_research_writing_toolkit": "NEW: Discover the ultimate research writing toolkit",
+  "discover_research_writing_toolkit_description": "Add AI Assist to get unlimited access to LaTeX-tailored AI tools from Overleaf and Writefull.",
   "discover_the_fastest_way_to_search_and_cite": "Discover the fastest way to search and cite",
   "discover_why_over_people_worldwide_trust_overleaf": "Discover why over __count__ million people worldwide trust Overleaf with their work.",
-  "dismiss_error_popup": "Dismiss first error alert",
+  "display": "Display",
   "display_deleted_user": "Display deleted users",
+  "display_math": "Display math",
   "do_not_have_acct_or_do_not_want_to_link": "If you don’t have an <b>__appName__</b> account, or if you don’t want to link to your <b>__institutionName__</b> account, please click <b>__clickText__</b>.",
   "do_not_link_accounts": "Don’t link accounts",
   "do_you_need_edit_access": "Do you need edit access?",
@@ -534,6 +574,7 @@
   "document_updated_externally": "Document Updated Externally",
   "document_updated_externally_detail": "This document was just updated externally. Any recent changes you have made may have been overwritten. To see previous versions, please look in the history.",
   "documentation": "Documentation",
+  "documentation_articles": "Documentation and articles",
   "does_not_contain_or_significantly_match_your_email": "does not contain or significantly match your email",
   "doesnt_match": "Doesn’t match",
   "doing_this_allow_log_in_through_institution": "Doing this will allow you to log in to <b>__appName__</b> through your institution and will reconfirm your institutional email address.",
@@ -543,6 +584,7 @@
   "dont_forget_you_currently_have": "Don’t forget, you currently have:",
   "dont_have_account": "Don’t have an account?",
   "dont_reload_or_close_this_tab": "Don’t reload or close this tab.",
+  "double_clicking_on_the_pdf_shows": "Double clicking on the PDF shows the corresponding location in code. Added word count (7 May 2025)",
   "download": "Download",
   "download_all": "Download all",
   "download_as_pdf": "Download as PDF",
@@ -577,6 +619,7 @@
   "dropbox_synced": "Overleaf and Dropbox have processed all updates. Note that your local Dropbox might still be synchronizing",
   "dropbox_unlinked_because_access_denied": "Your Dropbox account has been unlinked because the Dropbox service rejected your stored credentials. Please relink your Dropbox account to continue using it with Overleaf.",
   "dropbox_unlinked_because_full": "Your Dropbox account has been unlinked because it is full, and we can no longer send updates to it. Please free up some space and relink your Dropbox account to continue using it with Overleaf.",
+  "dropbox_unlinked_because_suspended": "We’ve unlinked your Dropbox account because it’s been suspended by Dropbox. You’ll be able to relink once you’ve resolved the issue with Dropbox.",
   "dropbox_unlinked_premium_feature": "<0>Your Dropbox account has been unlinked</0> because Dropbox Sync is a premium feature that you had through an institutional license.",
   "due_date": "Due __date__",
   "due_today": "Due today",
@@ -589,17 +632,19 @@
   "edit": "Edit",
   "edit_comment_error_message": "There was an error editing the comment. Please try again in a few moments.",
   "edit_comment_error_title": "Edit Comment Error",
+  "edit_content_directly": "Edit content directly",
   "edit_dictionary": "Edit Dictionary",
   "edit_dictionary_empty": "Your custom dictionary is empty.",
   "edit_dictionary_remove": "Remove from dictionary",
   "edit_figure": "Edit figure",
   "edit_sso_configuration": "Edit SSO Configuration",
   "edit_tag": "Edit Tag",
+  "edit_template": "Edit template",
   "edit_your_custom_dictionary": "Edit your custom dictionary",
   "editing": "Editing",
   "editing_and_collaboration": "Editing and collaboration",
   "editing_captions": "Editing captions",
-  "editing_tools_to_paraphrase_change_style_and_more": "<0>Editing tools</0> to paraphrase, change style and more",
+  "editing_tools": "Editing tools",
   "editor": "Editor",
   "editor_and_pdf": "Editor & PDF",
   "editor_disconected_click_to_reconnect": "Editor disconnected, click anywhere to reconnect.",
@@ -618,7 +663,7 @@
   "email_address": "Email address",
   "email_address_is_invalid": "Email address is invalid",
   "email_already_associated_with": "The <b>__email1__</b> email is already associated with the <b>__email2__</b> <b>__appName__</b> account.",
-  "email_already_registered": "This email is already registered",
+  "email_already_registered": "This email address is already associated with a different Overleaf account.",
   "email_already_registered_secondary": "This email is already registered as a secondary email",
   "email_already_registered_sso": "This email is already registered. Please log in to your account another way and link your account to the new provider via your account settings.",
   "email_confirmed_onboarding": "Great! Let’s get you set up",
@@ -634,7 +679,7 @@
   "email_sent": "Email Sent",
   "emails": "Emails",
   "emails_and_affiliations_explanation": "Add additional email addresses to your account to access any upgrades your university or institution has, to make it easier for collaborators to find you, and to make sure you can recover your account.",
-  "emails_and_affiliations_title": "Emails and Affiliations",
+  "emails_and_affiliations_title": "Emails and affiliations",
   "empty": "Empty",
   "empty_zip_file": "Zip doesn’t contain any file",
   "en": "English",
@@ -643,30 +688,28 @@
   "enable_single_sign_on": "Enable single sign-on",
   "enable_sso": "Enable SSO",
   "enable_stop_on_first_error_under_recompile_dropdown_menu": "Enable <0>“Stop on first error”</0> under the <1>Recompile</1> drop-down menu to help you find and fix errors right away.",
-  "enable_stop_on_first_error_under_recompile_dropdown_menu_v2": "Enable <0>Stop on first error</0> under the <1>Recompile</1> drop-down menu to help you find and fix errors right away.",
   "enabled": "Enabled",
   "enables_real_time_syntax_checking_in_the_editor": "Enables real-time syntax checking in the editor",
+  "enabling": "Enabling",
   "end_of_document": "End of document",
   "ensure_recover_account": "This will ensure that it can be used to recover your __appName__ account in case you lose access to your primary email address.",
-  "enter_6_digit_code": "Enter 6-digit code",
   "enter_any_size_including_units_or_valid_latex_command": "Enter any size (including units) or valid LaTeX command",
   "enter_image_url": "Enter image URL",
   "enter_the_code": "Enter the 6-digit code sent to __email__.",
   "enter_the_confirmation_code": "Enter the 6-digit confirmation code sent to __email__.",
   "enter_the_number_of_licenses_youd_like_to_add_to_see_the_cost_breakdown": "Enter the number of licenses you’d like to add to see the cost breakdown.",
-  "enter_your_email_address": "Enter your email address",
   "enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password": "Enter your email address below, and we will send you a link to reset your password",
-  "enter_your_new_password": "Enter your new password",
   "equation_generator": "Equation Generator",
   "equation_preview": "Equation preview",
   "error": "Error",
   "error_assist": "Error Assist",
-  "error_assist_to_help_fixing_latex_errors": "<0>Error Assist</0> for help fixing LaTeX errors",
+  "error_log": "Error log",
   "error_opening_document": "Error opening document",
   "error_opening_document_detail": "Sorry, something went wrong opening this document. Please try again.",
   "error_performing_request": "An error has occurred while performing your request.",
   "error_processing_file": "Sorry, something went wrong processing this file. Please try again.",
   "es": "Spanish",
+  "essential_cookies_only": "Essential cookies only",
   "estimated_number_of_overleaf_users": "Estimated number of __appName__ users",
   "every": "per",
   "everything_in_free_plus": "Everything in Free, plus…",
@@ -674,7 +717,7 @@
   "everything_in_group_standard_plus": "Everything in Group Standard, plus…",
   "everything_in_standard_plus": "Everything in Standard, plus…",
   "example": "Example",
-  "example_project": "Example Project",
+  "example_project": "Example project",
   "examples": "Examples",
   "examples_lowercase": "examples",
   "examples_to_help_you_learn": "Examples to help you learn how to use powerful LaTeX packages and techniques.",
@@ -691,6 +734,7 @@
   "explore_all_plans": "Explore all plans",
   "export_csv": "Export CSV",
   "export_project_to_github": "Export Project to GitHub",
+  "failed_to_publish_as_a_template": "Failed to publish as a template.",
   "failed_to_send_group_invite_to_email": "Failed to send Group invite to <0>__email__</0>. Please try again later.",
   "failed_to_send_managed_user_invite_to_email": "Failed to send Managed User invite to <0>__email__</0>. Please try again later.",
   "failed_to_send_sso_link_invite_to_email": "Failed to send SSO invite reminder to <0>__email__</0>. Please try again later.",
@@ -704,9 +748,9 @@
   "featured": "Featured",
   "featured_latex_templates": "Featured LaTeX Templates",
   "features": "Features",
-  "features_and_benefits": "Features & Benefits",
   "features_like_track_changes": "Features like real-time track changes",
   "february": "February",
+  "figure": "Figure",
   "file": "File",
   "file_action_created": "Created",
   "file_action_deleted": "Deleted",
@@ -729,6 +773,7 @@
   "files_selected": "files selected.",
   "filter_projects": "Filter projects",
   "filters": "Filters",
+  "find": "Find",
   "find_out_more": "Find out More",
   "find_out_more_about_institution_login": "Find out more about institutional login",
   "find_out_more_about_the_file_outline": "Find out more about the file outline",
@@ -749,17 +794,16 @@
   "footer_about_us": "About us",
   "footer_contact_us": "Contact us",
   "footer_navigation": "Footer navigation",
-  "footer_plans_and_pricing": "Plans & pricing",
+  "footnotes": "Footnotes",
   "for_business": "For business",
-  "for_enterprise": "For enterprise",
   "for_government": "For government",
-  "for_individuals_and_groups": "For individuals & groups",
+  "for_groups_and_organizations": "For groups and organizations",
+  "for_individuals": "For individuals",
   "for_large_institutions_and_organizations_need_sitewide_on_premise": "For large institutions and organizations that need site-wide access or an on-premises solution.",
   "for_more_information_see_managed_accounts_section": "For more information, see the \"Managed Accounts\" section in <0>our terms of use</0>, which you agree to by clicking Accept invitation.",
   "for_publishers": "For publishers",
   "for_small_teams_and_departments_who_want_to_write_collaborate": "For small teams and departments who want to write and collaborate easily in LaTeX.",
   "for_students": "For students",
-  "for_teaching": "For teaching",
   "for_teams_and_organizations_who_want_a_streamlined_sso_and_security": "For teams and organizations who want a streamlined sign-on process and our strongest cloud security.",
   "for_universities": "For universities",
   "forever": "forever",
@@ -793,10 +837,13 @@
   "gallery_page_title": "Gallery - Templates, Examples and Articles written in LaTeX",
   "gallery_show_more_tags": "Show more",
   "general": "General",
+  "generate_from_text_or_image": "From text or image",
+  "generate_tables_and_equations": "Generate tables and equations from text and images. Try it for free in the Overleaf toolbar!",
   "generate_token": "Generate token",
   "generic_if_problem_continues_contact_us": "If the problem continues please contact us",
   "generic_linked_file_compile_error": "This project’s output files are not available because it failed to compile. Please open the project to see the compilation error details.",
   "generic_something_went_wrong": "Sorry, something went wrong",
+  "get_ai_assist": "Get AI Assist",
   "get_collaborative_benefits": "Get the collaborative benefits from __appName__, even if you prefer to work offline",
   "get_discounted_plan": "Get discounted plan",
   "get_error_assist": "Get Error Assist",
@@ -804,23 +851,28 @@
   "get_in_touch": "Get in touch",
   "get_in_touch_having_problems": "<a href=\"__link__\">Get in touch with support</a> if you’re having problems",
   "get_involved": "Get involved",
-  "get_most_subscription_discover_premium_features": "Get the most from your __appName__ subscription. <0>Discover premium features</0>.",
+  "get_most_subscription_by_checking_ai_writefull": "Get the most out of your subscription by checking out <0>Overleaf’s AI features</0> and <1>Writefull’s features</1>.",
+  "get_most_subscription_by_checking_overleaf": "Get the most out of your subscription by checking out <0>Overleaf’s features</0>.",
+  "get_most_subscription_by_checking_overleaf_ai_writefull": "Get the most out of your subscription by checking out <0>Overleaf’s features</0>, <1>Overleaf’s AI features</1> and <2>Writefull’s features</2>.",
+  "get_real_time_track_changes": "Get real-time track changes",
   "get_the_best_overleaf_experience": "Get the best Overleaf experience",
   "get_the_most_out_headline": "Get the most out of __appName__ with features such as:",
   "git": "Git",
   "git_authentication_token": "Git authentication token",
   "git_authentication_token_create_modal_info_1": "This is your Git authentication token. You should enter this when prompted for a password.",
   "git_authentication_token_create_modal_info_2": "<0>You will only see this authentication token once so please copy it and keep it safe</0>. For full instructions on using authentication tokens, visit our <1>help page</1>.",
-  "git_bridge_modal_click_generate": "Click <strong>Generate token</strong> to generate your authentication token now. Or do this later in your Account Settings.",
+  "git_bridge_modal_click_generate": "Click <strong>Generate token</strong> to generate your authentication token now. Or do this later in your Account settings.",
   "git_bridge_modal_enter_authentication_token": "When prompted for a password, enter your new authentication token:",
   "git_bridge_modal_git_clone_your_project": "Git clone your project by using the link below and a Git authentication token",
   "git_bridge_modal_learn_more_about_authentication_tokens": "Learn more about Git integration authentication tokens.",
   "git_bridge_modal_read_only": "<strong>You have read-only access to this project.</strong> This means you can pull from __appName__ but you can’t push any changes you make back to this project.",
-  "git_bridge_modal_see_once": "You’ll only see this token once. To delete it or generate a new one, visit Account Settings. For detailed instructions and troubleshooting, read our <0>help page</0>.",
-  "git_bridge_modal_use_previous_token": "If you’re prompted for a password, you can use a previously generated Git authentication token. Or you can generate a new one in Account Settings. For more support, read our <0>help page</0>.",
-  "git_gitHub_dropbox_mendeley_papers_and_zotero_integrations": "Git, GitHub, Dropbox, Mendeley, Papers, and Zotero integrations",
-  "git_integration": "Git Integration",
-  "git_integration_info": "With Git integration, you can clone your Overleaf projects with Git. For full instructions on how to do this, read <0>our help page</0>.",
+  "git_bridge_modal_review_access": "<0>You have review access to this project.</0> This means you can pull from __appName__ but you can’t push any changes you make back to this project.",
+  "git_bridge_modal_see_once": "You’ll only see this token once. To delete it or generate a new one, visit Account settings. For detailed instructions and troubleshooting, read our <0>help page</0>.",
+  "git_bridge_modal_use_previous_token": "If you’re prompted for a password, you can use a previously generated Git authentication token. Or you can generate a new one in Account settings. For more support, read our <0>help page</0>.",
+  "git_clone_project": "Git clone project",
+  "git_gitHub_dropbox_mendeley_papers_and_zotero_integrations": "Git, GitHub, Dropbox, Papers, Zotero, and Mendeley integrations",
+  "git_integration": "Git integration",
+  "git_integration_info": "With Git integration, you can clone your Overleaf projects with Git. For full instructions on how to do this, <0>read our Git Integration help page</0>.",
   "github": "GitHub",
   "github_commit_message_placeholder": "Commit message for changes made in __appName__...",
   "github_credentials_expired": "Your GitHub authorization credentials have expired",
@@ -851,13 +903,15 @@
   "github_workflow_files_delete_github_repo": "The repository has been created on GitHub but linking was unsuccessful. You will have to delete GitHub repository or choose a new name.",
   "github_workflow_files_error": "The __appName__ GitHub sync service couldn’t sync GitHub Workflow files (in .github/workflows/). Please authorize __appName__ to edit your GitHub workflow files and try again.",
   "give_feedback": "Give feedback",
+  "give_feedback_about": "Give feedback about __appName__",
   "give_your_feedback": "give your feedback",
   "global": "global",
   "go_back_and_link_accts": "<a href=\"__link__\">Go back</a> and link your accounts",
   "go_next_page": "Go to Next Page",
   "go_page": "Go to page __page__",
   "go_prev_page": "Go to Previous Page",
-  "go_to_account_settings": "Go to Account Settings",
+  "go_to_account_settings": "Go to account settings",
+  "go_to_code_location": "Go to code location",
   "go_to_code_location_in_pdf": "Go to code location in PDF",
   "go_to_first_page": "Go to first page",
   "go_to_last_page": "Go to last page",
@@ -868,6 +922,9 @@
   "go_to_previous_page": "Go to previous page",
   "go_to_settings": "Go to settings",
   "go_to_subscriptions": "Go to Subscriptions",
+  "go_to_writefull": "Go to Writefull",
+  "good_news_you_already_purchased_this_add_on": "Good news! You already have this add-on, so no need to pay again.",
+  "good_news_you_are_already_receiving_this_add_on_via_writefull": "Good news! You already have this add-on via your Writefull subscription. No need to pay again.",
   "great_for_getting_started": "Great for getting started",
   "great_for_small_teams_and_departments": "Great for small teams and departments",
   "group": "Group",
@@ -896,7 +953,9 @@
   "have_more_days_to_try": "Have another <strong>__days__ days</strong> on your trial!",
   "headers": "Headers",
   "help": "Help",
+  "help_and_resources": "Help & resources",
   "help_articles_matching": "Help articles matching your subject",
+  "help_guides": "Help guides",
   "help_improve_overleaf_fill_out_this_survey": "If you would like to help us improve Overleaf, please take a moment to fill out <0>this survey</0>.",
   "help_improve_screen_reader_fill_out_this_survey": "Help us improve your experience using a screen reader with __appName__ by filling out this quick survey.",
   "help_shape_the_future_of_overleaf": "Help shape the future of Overleaf",
@@ -961,12 +1020,14 @@
   "how_we_use_your_data_explanation": "<0>Please help us continue to improve Overleaf by answering a few quick questions. Your answers will help us and our corporate group understand more about our user base. We may use this information to improve your Overleaf experience, for example by providing personalized onboarding, upgrade prompts, help suggestions, and tailored marketing communications (if you’ve opted-in to receive them).</0><1>For more details on how we use your personal data, please see our <0>Privacy Notice</0>.</1>",
   "hundreds_templates_info": "Produce beautiful documents starting from our gallery of LaTeX templates for journals, conferences, theses, reports, CVs and much more.",
   "i_confirm_am_student": "I confirm that I am currently a student.",
+  "i_want_to_add_a_po_number": "I want to add a PO number",
   "i_want_to_stay": "I want to stay",
   "id": "ID",
   "identify_errors_with_your_compile": "Identify errors with your compile",
   "if_have_existing_can_link": "If you have an existing <b>__appName__</b> account on another email, you can link it to your <b>__institutionName__</b> account by clicking <b>__clickText__</b>.",
   "if_owner_can_link": "If you own the <b>__appName__</b> account with <b>__email__</b>, you will be allowed to link it to your <b>__institutionName__</b> institutional account.",
   "if_you_need_to_customize_your_table_further_you_can": "If you need to customize your table further, you can. Using LaTeX code, you can change anything from table styles and border styles to colors and column widths. <0>Read our guide</0> to using tables in LaTeX to help you get started.",
+  "if_you_need_to_delete_your_writefull_account": "If you need to delete your Writefull account, go to your <a>Writefull account settings.</a>",
   "if_you_want_more_than_x_licenses_on_your_plan_we_need_to_add_them_for_you": "If you want more than __count__ licenses on your plan, we need to add them for you. Just click <0>Send request</0> below and we’ll be happy to help.",
   "if_you_want_to_reduce_the_number_of_licenses_please_contact_support": "If you want to reduce the number of licenses on your plan, please <0>contact customer support</0>.",
   "if_your_occupation_not_listed_type_full_name": "If your __occupation__ isn’t listed, you can type the full name.",
@@ -989,6 +1050,7 @@
   "imported_from_zotero_at_date": "Imported from Zotero  at __formattedDate__ __relativeDate__",
   "importing": "Importing",
   "importing_and_merging_changes_in_github": "Importing and merging changes in GitHub",
+  "improved_dark_mode": "Improved dark mode",
   "in_order_to_have_a_secure_account_make_sure_your_password": "To help keep your account secure, make sure your new password:",
   "in_order_to_match_institutional_metadata_2": "In order to match your institutional metadata, we’ve linked your account using <0>__email__</0>.",
   "in_order_to_match_institutional_metadata_associated": "In order to match your institutional metadata, your account is associated with the email <b>__email__</b>.",
@@ -997,9 +1059,13 @@
   "include_results_from_your_reference_manager": "Include results from your reference manager",
   "include_results_from_your_x_account": "Include results from your __provider__ account",
   "include_the_error_message_and_ai_response": "Include the error message and AI response",
+  "included_as_part_of_your_writefull_subscription": "Included as part of your Writefull subscription",
+  "increase_indent": "Increase indentation",
   "increased_compile_timeout": "Increased compile timeout",
   "individuals": "Individuals",
   "info": "Info",
+  "inline": "Inline",
+  "inline_math": "Inline math",
   "inr_discount_modal_info": "Get document history, track changes, additional collaborators, and more at Purchasing Power Parity prices.",
   "inr_discount_modal_title": "70% off all Overleaf premium plans for users in India",
   "inr_discount_offer_plans_page_banner": "__flag__ <b>Great news!</b> We’ve applied a <b>70% discount</b> to premium plans for our users in India. Check out the new lower prices below.",
@@ -1036,6 +1102,7 @@
   "integrations": "Integrations",
   "integrations_like_github": "Integrations like GitHub Sync",
   "interested_in_cheaper_personal_plan": "Would you be interested in the cheaper <0>__price__</0> Personal plan?",
+  "introducing_shorter_compile_timeout": "We’re <0>introducing a shorter compile timeout limit</0>. This project currently exceeds the new limit, so it might not compile from 25th August 2025.",
   "invalid_certificate": "Invalid certificate. Please check the certificate and try again.",
   "invalid_confirmation_code": "That didn’t work. Please check the code and try again.",
   "invalid_email": "An email address is invalid",
@@ -1051,6 +1118,7 @@
   "invalid_password_too_similar": "Password is too similar to parts of email address",
   "invalid_regular_expression": "Invalid regular expression",
   "invalid_request": "Invalid Request. Please correct the data and try again.",
+  "invalid_upload_request": "The upload failed. If the problem persists, <0>let us know</0>.",
   "invalid_zip_file": "Invalid zip file",
   "invite": "Invite",
   "invite_expired": "The invite may have expired",
@@ -1066,6 +1134,7 @@
   "invited_to_group_login_benefits": "As part of this group, you’ll have access to __appName__ premium features such as additional collaborators, greater maximum compile time, and real-time track changes.",
   "invited_to_group_register": "To accept __inviterName__’s invitation you’ll need to create an account.",
   "invited_to_group_register_benefits": "__appName__ is a collaborative online LaTeX editor, with thousands of ready-to-use templates and an array of LaTeX learning resources to help you get started.",
+  "inviting": "Inviting",
   "ip_address": "IP Address",
   "is_email_affiliated": "Is your email affiliated with an institution? ",
   "is_longer_than_n_characters": "is at least __n__ characters long",
@@ -1073,11 +1142,12 @@
   "issued_on": "Issued: __date__",
   "it": "Italian",
   "it_looks_like_that_didnt_work_you_can_try_again_or_get_in_touch": "It looks like that didn’t work. You can try again or <0>get in touch</0> with our Support team for more help.",
-  "it_looks_like_your_account_is_billed_manually": "It looks like your account is being billed manually - adding seats or upgrading your subscription can only be done by the Support team. Please <0>get in touch</0> for help.",
+  "it_looks_like_your_account_is_billed_manually_purchasing_additional_license_or_upgrading_subscription": "It looks like your account is being billed manually - purchasing additional licenses or upgrading your subscription can only be done by the Support team. Please <0>get in touch</0> for help.",
   "it_looks_like_your_payment_details_are_missing_please_update_your_billing_information": "It looks like your payment details are missing. Please <0>update your billing information</0>, or <1>get in touch</1> with our Support team for more help.",
+  "italics": "Italics",
   "ja": "Japanese",
   "january": "January",
-  "join_beta_program": "Join beta program",
+  "join_beta_program": "Join the beta program",
   "join_labs": "Join Labs",
   "join_now": "Join now",
   "join_overleaf_labs": "Join Overleaf Labs",
@@ -1104,27 +1174,27 @@
   "labs": "Labs",
   "labs_program_benefits": "By signing up for Overleaf Labs you can get your hands on in-development features and try them out as much as you like. All we ask in return is your honest feedback to help us develop and improve. It’s important to note that features available in this program are still being tested and actively developed. This means they could change, be removed, or become part of a premium plan.",
   "language": "Language",
-  "language_suggestions_for_texts_in_any_language": "</>Language suggestions<//> for texts in any language",
+  "language_suggestions": "Language suggestions",
   "large_or_high-resolution_images_taking_too_long": "Large or high-resolution images taking too long to process. You may be able to <0>optimize them</0>.",
-  "large_or_high_resolution_images_taking_too_long_to_process": "Large or high-resolution images taking too long to process.",
   "last_active": "Last Active",
   "last_active_description": "Last time a project was opened.",
   "last_edit": "Last edit",
   "last_logged_in": "Last logged in",
-  "last_modified": "Last Modified",
+  "last_modified": "Last modified",
   "last_name": "Last name",
   "last_resort_trouble_shooting_guide": "If that doesn’t help, follow our <0>troubleshooting guide</0>.",
   "last_suggested_fix": "Last suggested fix",
   "last_updated": "Last Updated",
   "last_updated_date_by_x": "__lastUpdatedDate__ by __person__",
-  "last_used": "last used",
+  "last_used": "Last used",
   "latam_discount_modal_info": "Unlock the full potential of Overleaf with a __discount__% discount on premium subscriptions paid in __currencyName__. Get a longer compile timeout, full document history, track changes, additional collaborators, and more.",
   "latam_discount_modal_title": "Premium subscription discount",
   "latam_discount_offer_plans_page_banner": "__flag__ We’ve applied a __discount__ discount to premium plans on this page for our users in __country__. Check out the new lower prices (in __currency__).",
+  "latest_updates": "Latest updates",
   "latex_articles_page_title": "Articles - Papers, Presentations, Reports and more",
   "latex_examples": "LaTeX examples",
   "latex_examples_page_title": "Examples - Equations, Formatting, TikZ, Packages and More",
-  "latex_in_thirty_minutes": "LaTeX in 30 minutes",
+  "latex_in_thirty_minutes": "Learn LaTeX in 30 minutes",
   "latex_places_figures_according_to_a_special_algorithm": "LaTeX places figures according to a special algorithm. You can use something called ‘placement parameters’ to influence the positioning of the figure. <0>Find out how</>",
   "latex_places_tables_according_to_a_special_algorithm": "LaTeX places tables according to a special algorithm. You can use “placement parameters” to influence the position of the table. <0>This article</0> explains how to do this.",
   "latex_templates": "LaTeX Templates",
@@ -1138,8 +1208,8 @@
   "ldap_create_admin_instructions": "Choose an email address for the first __appName__ admin account. This should correspond to an account in the LDAP system. You will then be asked to log in with this account.",
   "learn": "Learn",
   "learn_more": "Learn more",
+  "learn_more_about": "Learn more about __appName__",
   "learn_more_about_account": "<0>Learn more</0> about managing your __appName__ account.",
-  "learn_more_about_compile_timeouts": "<0>Learn more</0> about compile timeouts.",
   "learn_more_about_emails": "<0>Learn more</0> about managing your __appName__ emails.",
   "learn_more_about_link_sharing": "Learn more about Link Sharing",
   "learn_more_about_managed_users": "Learn more about Managed Users.",
@@ -1162,20 +1232,14 @@
   "license": "License",
   "licenses": "Licenses",
   "limited_document_history": "Limited document history",
-  "limited_to_n_editors": "Limited to __count__ editor",
-  "limited_to_n_editors_or_reviewers": "Limited to __count__ editor or reviewer",
-  "limited_to_n_editors_or_reviewers_per_project": "Limited to __count__ editor or reviewer per project",
-  "limited_to_n_editors_or_reviewers_per_project_plural": "Limited to __count__ editors or reviewers per project",
-  "limited_to_n_editors_or_reviewers_plural": "Limited to __count__ editors or reviewers",
-  "limited_to_n_editors_per_project": "Limited to __count__ editor per project",
-  "limited_to_n_editors_per_project_plural": "Limited to __count__ editors per project",
-  "limited_to_n_editors_plural": "Limited to __count__ editors",
+  "limited_to_n_collaborators_per_project": "Limited to __count__ collaborator per project",
+  "limited_to_n_collaborators_per_project_plural": "Limited to __count__ collaborators per project",
   "line_height": "Line Height",
   "line_width_is_the_width_of_the_line_in_the_current_environment": "Line width is the width of the line in the current environment. e.g. a full page width in single-column layout or half a page width in a two-column layout.",
   "link": "Link",
   "link_account": "Link Account",
-  "link_accounts": "Link Accounts",
-  "link_accounts_and_add_email": "Link Accounts and Add Email",
+  "link_accounts": "Link accounts",
+  "link_accounts_and_add_email": "Link accounts and add email",
   "link_institutional_email_get_started": "Link an institutional email address to your account to get started.",
   "link_overleaf_with_git": "Link __appName__ with Git for seamless project syncing and version control across your repositories.",
   "link_sharing": "Link sharing",
@@ -1187,7 +1251,7 @@
   "link_to_papers": "Link to Papers",
   "link_to_zotero": "Link to Zotero",
   "link_your_accounts": "Link your accounts",
-  "linked_accounts": "linked accounts",
+  "linked_accounts": "Linked accounts",
   "linked_accounts_explained": "You can link your __appName__ account with other services to enable the features described below.",
   "linked_collabratec_description": "Use Collabratec to manage your __appName__ projects.",
   "linked_file": "Imported file",
@@ -1198,6 +1262,7 @@
   "loading_prices": "loading prices",
   "loading_recent_github_commits": "Loading recent commits",
   "loading_writefull": "Loading Writefull",
+  "local_account": "Local account",
   "log_entry_description": "Log entry with level: __level__",
   "log_entry_maximum_entries": "Maximum log entries limit hit",
   "log_entry_maximum_entries_enable_stop_on_first_error": "Try to fix the first error and recompile. Often one error causes many later error messages. You can <0>Enable “Stop on first error”</0> to focus on fixing errors. We recommend fixing errors as soon as possible; letting them accumulate may lead to hard-to-debug and fatal errors. <1>Learn more</1>",
@@ -1234,6 +1299,7 @@
   "login_to_overleaf": "Log in to Overleaf",
   "login_with_service": "Log in with __service__",
   "login_with_sso": "Log in to Overleaf with SSO",
+  "logs": "Logs",
   "logs_and_output_files": "Logs and output files",
   "longer_compile_timeout": "Longer <0>compile timeout</0>",
   "longer_compile_timeout_on_faster_servers": "Longer compile timeout on faster servers",
@@ -1249,8 +1315,8 @@
   "make_a_copy": "Make a copy",
   "make_email_primary_description": "Make this the primary email, used to log in",
   "make_owner": "Make owner",
-  "make_primary": "Make Primary",
-  "make_private": "Make Private",
+  "make_primary": "Make primary",
+  "make_private": "Make private",
   "manage_beta_program_membership": "Manage Beta Program Membership",
   "manage_files_from_your_dropbox_folder": "Manage files from your Dropbox folder",
   "manage_group_members_subtext": "Add or remove members from your group subscription",
@@ -1264,6 +1330,7 @@
   "manage_publisher_managers": "Manage publisher managers",
   "manage_sessions": "Manage Your Sessions",
   "manage_subscription": "Manage subscription",
+  "manage_your_ai_assist_add_on": "Manage your AI Assist add-on",
   "managed": "Managed",
   "managed_user_accounts": "Managed user accounts",
   "managed_user_invite_has_been_sent_to_email": "Managed User invite has been sent to <0>__email__</0>",
@@ -1278,18 +1345,20 @@
   "managing_your_subscription": "Managing your subscription",
   "march": "March",
   "marked_as_resolved": "Marked as resolved",
+  "math": "Math",
   "math_display": "Math Display",
   "math_inline": "Math Inline",
   "maximum_files_uploaded_together": "Maximum __max__ files uploaded together",
   "may": "May",
   "maybe_later": "Maybe later",
   "member_picker": "Select number of users for group plan",
+  "members_added": "Member(s) added.",
   "members_management": "Members management",
   "mendeley": "Mendeley",
   "mendeley_dynamic_sync_description": "With the Mendeley integration, you can import your references into __appName__. You can either import all your references at once or dynamically search your Mendeley library directly from __appName__.",
   "mendeley_groups_loading_error": "There was an error loading groups from Mendeley",
   "mendeley_groups_relink": "There was an error accessing your Mendeley data. This was likely caused by lack of permissions. Please re-link your account and try again.",
-  "mendeley_integration": "Mendeley Integration",
+  "mendeley_integration": "Mendeley integration",
   "mendeley_is_premium": "Mendeley integration is a premium feature",
   "mendeley_reference_loading_error": "Error, could not load references from Mendeley",
   "mendeley_reference_loading_error_expired": "Mendeley token expired, please re-link your account",
@@ -1305,7 +1374,7 @@
   "missing_field_for_entry": "Missing field for",
   "missing_fields_for_entry": "Missing fields for",
   "missing_payment_details": "Missing payment details",
-  "money_back_guarantee": "30-day money back guarantee, no questions asked",
+  "money_back_guarantee": "30-day money back guarantee, hassle free",
   "month": "month",
   "month_plural": "months",
   "monthly": "Monthly",
@@ -1314,9 +1383,10 @@
   "more_collabs_per_project": "More collaborators per project",
   "more_comments": "More comments",
   "more_compile_time": "More compile time",
+  "more_editor_toolbar_item": "More editor toolbar items",
   "more_info": "More Info",
+  "more_logs_and_files": "More logs and files",
   "more_options": "More options",
-  "more_options_for_border_settings_coming_soon": "More options for border settings coming soon.",
   "more_project_collaborators": "<0>More</0> project <0>collaborators</0>",
   "more_than_one_kind_of_snippet_was_requested": "The link to open this content on Overleaf included some invalid parameters. If this keeps happening for links on a particular site, please report this to them.",
   "most_popular_uppercase": "Most popular",
@@ -1325,6 +1395,8 @@
   "my_library": "My Library",
   "n_items": "__count__ item",
   "n_items_plural": "__count__ items",
+  "n_more_collaborators": "__count__ more collaborator",
+  "n_more_collaborators_plural": "__count__ more collaborators",
   "n_more_updates_above": "__count__ more update above",
   "n_more_updates_above_plural": "__count__ more updates above",
   "n_more_updates_below": "__count__ more update below",
@@ -1336,23 +1408,30 @@
   "navigate_log_source": "Navigate to log position in source code: __location__",
   "navigation": "Navigation",
   "nearly_activated": "You’re one step away from activating your __appName__ account!",
-  "need_20_plus_users_discount": "20+ users? <0>Contact Sales</0> to get the best discounts.",
+  "need_20_plus_users_discount": "20+ users? <0>Contact sales</0> to get the best discounts.",
   "need_anything_contact_us_at": "If there is anything you ever need please feel free to contact us directly at",
   "need_contact_group_admin_to_make_changes": "You’ll need to contact your group admin if you want to make certain changes to your account. <0>Read more about managed users.</0>",
   "need_make_changes": "You need to make some changes",
   "need_more_than_x_licenses": "Need more than __x__ licenses?",
   "need_to_add_new_primary_before_remove": "You’ll need to add a new primary email address before you can remove this one.",
   "need_to_leave": "Need to leave?",
+  "neither_agree_nor_disagree": "Neither agree nor disagree",
   "new_compile_domain_notice": "We’ve recently migrated PDF downloads to a new domain. Something might be blocking your browser from accessing that new domain, <0>__compilesUserContentDomain__</0>. This could be caused by network blocking or a strict browser plugin rule. Please follow our <1>troubleshooting guide</1>.",
+  "new_create_tables_and_equations": "NEW! <sparkle/> Create tables and equations in seconds",
+  "new_error_logs_panel": "New error logs panel. Added ‘Go to location in code’ and ‘Go to location in PDF’ buttons (17 June 2025)",
   "new_file": "New file",
   "new_folder": "New folder",
-  "new_font_open_dyslexic": "New font: OpenDyslexic Mono is designed to improve readability for those with dyslexia.",
+  "new_look_and_feel": "New look and feel",
+  "new_look_and_placement_of_the_settings": "New look and placement of the settings",
   "new_name": "New Name",
+  "new_navigation_introducing_left_hand_side_rail_and_top_menus": "New navigation - introducing left-hand side rail and top menus",
+  "new_overleaf_editor": "New Overleaf editor",
   "new_password": "New password",
-  "new_project": "New Project",
+  "new_project": "New project",
+  "new_project_name": "New project name",
   "new_snippet_project": "Untitled",
   "new_subscription_will_be_billed_immediately": "Your new subscription will be billed immediately to your current payment method.",
-  "new_tag": "New Tag",
+  "new_tag": "New tag",
   "new_tag_name": "New tag name",
   "newsletter": "Newsletter",
   "newsletter_info_note": "Please note: you will still receive important emails, such as project invites and security notifications (password resets, account linking, etc).",
@@ -1395,6 +1474,7 @@
   "no_search_results": "No Search Results",
   "no_selection_select_file": "Currently, no file is selected. Please select a file from the file tree.",
   "no_symbols_found": "No symbols found",
+  "no_templates_found": "No templates found.",
   "no_thanks_cancel_now": "No thanks, I still want to cancel",
   "no_update_email": "No, update email",
   "non_deletable_entity": "The specified entity may not be deleted",
@@ -1410,14 +1490,15 @@
   "notification_features_upgraded_by_affiliation": "Good news! Your affiliated organization __institutionName__ has an Overleaf subscription, and you now have access to all of Overleaf’s Professional features.",
   "notification_personal_and_group_subscriptions": "We’ve spotted that you’ve got <0>more than one active __appName__ subscription</0>. To avoid paying more than you need to, <1>review your subscriptions</1>.",
   "notification_personal_subscription_not_required_due_to_affiliation": " Good news! Your affiliated organization __institutionName__ has an Overleaf subscription, and you now have access to Overleaf’s Professional features through your affiliation. You can cancel your individual subscription without losing access to any features.",
-  "notification_project_invite": "<b>__userName__</b> would like you to join <b>__projectName__</b> <a class=\"btn btn-sm btn-info pull-right\" href=\"/project/__projectId__/invite/token/__token__\">Join Project</a>",
   "notification_project_invite_accepted_message": "You’ve joined <b>__projectName__</b>",
   "notification_project_invite_message": "<b>__userName__</b> would like you to join <b>__projectName__</b>",
   "november": "November",
+  "now_you_can_search_your_whole_project_not_just_this_file": "Now you can search your whole project (not just this file!)",
   "number_collab": "Number of collaborators",
   "number_collab_info": "The number of people you can invite to work on a project with you. The limit is per project, so you can invite different people to each project.",
   "number_of_projects": "Number of projects",
   "number_of_users": "Number of users",
+  "numbered_list": "Numbered list",
   "oauth_orcid_description": " <a href=\"__link__\">Securely establish your identity by linking your ORCID iD to your __appName__ account</a>. Submissions to participating publishers will automatically include your ORCID iD for improved workflow and visibility. ",
   "october": "October",
   "off": "Off",
@@ -1434,10 +1515,11 @@
   "ongoing_experiments": "Ongoing experiments",
   "online_latex_editor": "Online LaTeX Editor",
   "only_group_admin_or_managers_can_delete_your_account_1": "By becoming a managed user, your organization will have admin rights over your account and control over your stuff, including the right to close your account and access, delete and share your stuff. As a result:",
-  "only_group_admin_or_managers_can_delete_your_account_2": "Only your group admin or group managers will be able to delete your account.",
+  "only_group_admin_or_managers_can_delete_your_account_10": "If you have an individual subscription, we’ll automatically terminate it and cancel its renewal when your account becomes managed. To request a pro-rata refund for the remainder, please contact Support.",
   "only_group_admin_or_managers_can_delete_your_account_3": "Your group admin and group managers will be able to reassign ownership of your projects to another group member.",
-  "only_group_admin_or_managers_can_delete_your_account_4": "Once you have become a managed user, you cannot change back. <0>Learn more about managed Overleaf accounts.</0>",
-  "only_group_admin_or_managers_can_delete_your_account_5": "For more information, see the \"Managed Accounts\" section in our terms of use, which you agree to by clicking Accept invitation",
+  "only_group_admin_or_managers_can_delete_your_account_6": "Only your group admin or group managers will be able to delete your account or change your account back into an unmanaged account.",
+  "only_group_admin_or_managers_can_delete_your_account_7": "Only your group admin or group managers will be able to delete your account or change your account into an unmanaged account.",
+  "only_group_admin_or_managers_can_delete_your_account_9": "Once you have become a managed user, <0>you yourself cannot change it back to an unmanaged account</0>. <1>Learn more about managed Overleaf accounts.</1>",
   "only_importer_can_refresh": "Only the person who originally imported this __provider__ file can refresh it.",
   "open_action_menu": "Open __name__ action menu",
   "open_advanced_reference_search": "Open advanced reference search",
@@ -1447,7 +1529,6 @@
   "open_path": "Open __path__",
   "open_pdf_in_separate_tab": "Open PDF in separate tab",
   "open_project": "Open Project",
-  "open_survey": "Open survey",
   "open_target": "Go to target",
   "opted_out_linking": "You’ve opted out from linking your <b>__email__</b> <b>__appName__</b> account to your institutional account.",
   "optional": "Optional",
@@ -1457,18 +1538,15 @@
   "organization_name": "Organization name",
   "organization_or_company_name": "Organization or company name",
   "organization_or_company_type": "Organization or company type",
-  "organize_projects": "Organize Projects",
   "organize_tags": "Organize Tags",
   "original_price": "Original price",
   "other": "Other",
   "other_actions": "Other Actions",
-  "other_causes_of_compile_timeouts": "Other causes of compile timeouts",
   "other_logs_and_files": "Other logs and files",
   "other_output_files": "Download other output files",
   "other_sessions": "Other Sessions",
   "other_ways_to_log_in": "Other ways to log in",
   "our_team_will_get_back_to_you_shortly": "Our team will get back to you shortly.",
-  "our_values": "Our values",
   "out_of_sync": "Out of sync",
   "out_of_sync_detail": "Sorry, this file has gone out of sync and we need to do a full refresh.<0 /><1>Please see this help guide for more information</1>",
   "output_file": "Output file",
@@ -1476,14 +1554,15 @@
   "over_n_users_at_research_institutions_and_business": "Over __userCountMillion__ million users at research institutions and businesses worldwide love __appName__",
   "overall_theme": "Overall theme",
   "overleaf": "Overleaf",
-  "overleaf_assist_streamline_your_workflow": "Streamline your workflow with unlimited access to Overleaf and Writefull AI features.",
   "overleaf_group_plans": "Overleaf group plans",
   "overleaf_history_system": "Overleaf History System",
   "overleaf_individual_plans": "Overleaf individual plans",
+  "overleaf_is_easy_to_use": "Overleaf is easy to use.",
   "overleaf_labs": "Overleaf Labs",
   "overleaf_logo": "Overleaf logo",
   "overleaf_plans_and_pricing": "overleaf plans and pricing",
-  "overleaf_template_gallery": "overleaf template gallery",
+  "overleaf_template_gallery": "overleaf ce template gallery",
+  "overleafs_functionality_meets_my_needs": "Overleaf’s functionality meets my needs.",
   "overview": "Overview",
   "overwrite": "Overwrite",
   "overwriting_the_original_folder": "Overwriting the original folder will delete it and all the files it contains.",
@@ -1496,7 +1575,7 @@
   "papers_dynamic_sync_description": "With the Papers integration, you can import your references into __appName__. You can either import all your references at once or dynamically search your Papers library directly from __appName__.",
   "papers_groups_loading_error": "There was an error loading libraries from Papers",
   "papers_groups_relink": "There was an error accessing your Papers data. This was likely caused by lack of permissions. Please re-link your account and try again.",
-  "papers_integration": "Papers Integration",
+  "papers_integration": "Papers integration",
   "papers_is_premium": "Papers integration is a premium feature",
   "papers_presentations_reports_and_more": "Papers, presentations, reports and more, written in LaTeX and published by our community.",
   "papers_reference_loading_error": "Error, could not load references from Papers",
@@ -1505,6 +1584,7 @@
   "papers_sync_description": "With the Papers integration you can import your references from Papers into your __appName__ projects.",
   "papers_upgrade_prompt_content": "Link your Papers account to search and add your references from Papers directly in your project—they’ll automatically be added to your .bib file. Or import them as a file into your __appName__ projects.",
   "papers_upgrade_prompt_title": "Cite from Papers",
+  "paragraph_styles": "Paragraph styles",
   "partial_outline_warning": "The File outline is out of date. It will update itself as you edit the document",
   "password": "Password",
   "password_cant_be_the_same_as_current_one": "Password can’t be the same as current one",
@@ -1514,9 +1594,8 @@
   "password_change_successful": "Password changed",
   "password_compromised_try_again_or_use_known_device_or_reset": "The password you’ve entered is on a <0>public list of compromised passwords</0>. Please try logging in from a device you’ve previously used or <1>reset your password</1>",
   "password_managed_externally": "Password settings are managed externally",
-  "password_reset": "Password Reset",
+  "password_reset": "Password reset",
   "password_reset_email_sent": "You have been sent an email to complete your password reset.",
-  "password_reset_sentence_case": "Password reset",
   "password_reset_token_expired": "Your password reset token has expired. Please request a new password reset email and follow the link there.",
   "password_too_long_please_reset": "Maximum password length exceeded. Please reset your password.",
   "password_updated": "Password updated",
@@ -1527,6 +1606,10 @@
   "pause_subscription": "Pause subscription",
   "pause_subscription_for": "Pause subscription for",
   "pay_now": "Pay now",
+  "payment_error_3ds_failed": "We couldn’t complete your payment because authentication wasn’t successful. Please try again or choose a different payment method. If the problem continues please <0>contact us</0>.",
+  "payment_error_generic": "Sorry, something went wrong. Please try again. If the problem continues please <0>contact us</0>.",
+  "payment_error_intermittent_error": "We were unable to process your payment. Please try again later or <0>contact us</0> for assistance.",
+  "payment_error_update_payment_method": "Your payment was declined. Please <0>update your billing information</0> and try again.",
   "payment_method_accepted": "__paymentMethod__ accepted",
   "payment_provider_unreachable_error": "Sorry, there was an error talking to our payment provider. Please try again in a few moments.\nIf you are using any ad or script blocking extensions in your browser, you may need to temporarily disable them.",
   "payment_summary": "Payment summary",
@@ -1538,6 +1621,7 @@
   "pdf_in_separate_tab": "PDF in separate tab",
   "pdf_only": "PDF only",
   "pdf_only_hide_editor": "PDF only <0>(hide editor)</0>",
+  "pdf_preview": "PDF preview",
   "pdf_preview_error": "There was a problem displaying the compilation results for this project.",
   "pdf_rendering_error": "PDF Rendering Error",
   "pdf_unavailable_for_download": "PDF unavailable for download",
@@ -1550,7 +1634,7 @@
   "per_license": "per license",
   "per_month": "per month",
   "per_month_billed_annually": "per month, billed annually",
-  "per_user_month": "per user / month",
+  "per_month_x_annually": "per month, __price__ annually",
   "per_user_year": "per user / year",
   "per_year": "per year",
   "percent_is_the_percentage_of_the_line_width": "% is the percentage of the line width",
@@ -1563,20 +1647,20 @@
   "plan": "Plan",
   "plan_tooltip": "You’re on the __plan__ plan. Click to find out how to make the most of your Overleaf premium features.",
   "planned_maintenance": "Planned Maintenance",
-  "plans_amper_pricing": "Plans & Pricing",
   "plans_and_pricing": "Plans and Pricing",
   "plans_and_pricing_lowercase": "plans and pricing",
-  "please_ask_the_project_owner_to_upgrade_more_editors": "Please ask the project owner to upgrade their plan to allow more editors.",
+  "please_ask_the_project_owner_to_upgrade_more_collaborators": "Please ask the project owner to upgrade their plan to allow more collaborators.",
   "please_ask_the_project_owner_to_upgrade_to_track_changes": "Please ask the project owner to upgrade to use track changes",
   "please_change_primary_to_remove": "Please change your primary email in order to remove",
   "please_check_your_inbox_to_confirm": "Please check your email inbox to confirm your <0>__institutionName__</0> affiliation.",
   "please_compile_pdf_before_download": "Please compile your project before downloading the PDF",
+  "please_compile_pdf_before_publish_as_template": "Please compile your project before publishing it as a template",
   "please_compile_pdf_before_word_count": "Please compile your project before performing a word count",
   "please_confirm_email": "Please confirm your email __emailAddress__ by clicking on the link in the confirmation email ",
-  "please_confirm_primary_email": "Please confirm your primary email address __emailAddress__ by clicking on the link in the confirmation email.",
-  "please_confirm_secondary_email": "Please confirm your secondary email address __emailAddress__ by clicking on the link in the confirmation email.",
+  "please_confirm_primary_email_or_edit": "Please confirm your primary email address __emailAddress__. To edit it, go to <0>Account settings</0>.",
+  "please_confirm_secondary_email_or_edit": "Please confirm your secondary email address __emailAddress__. To edit it, go to <0>Account settings</0>.",
   "please_confirm_your_email_before_making_it_default": "Please confirm your email before making it the primary.",
-  "please_contact_support_to_makes_change_to_your_plan": "Please <0>contact support</0> to make changes to your plan",
+  "please_contact_support_to_makes_change_to_your_plan": "Please <0>contact Support</0> to make changes to your plan",
   "please_contact_us_if_you_think_this_is_in_error": "Please <0>contact us</0> if you think this is in error.",
   "please_enter_confirmation_code": "Please enter your confirmation code",
   "please_enter_email": "Please enter your email address",
@@ -1584,6 +1668,7 @@
   "please_link_before_making_primary": "Please confirm your email by linking to your institutional account before making it the primary email.",
   "please_provide_a_message": "Please provide a message",
   "please_provide_a_subject": "Please provide a subject",
+  "please_provide_a_valid_email_address": "Please provide a valid email address",
   "please_reconfirm_institutional_email": "Please take a moment to confirm your institutional email address or <0>remove it</0> from your account.",
   "please_reconfirm_your_affiliation_before_making_this_primary": "Please confirm your affiliation before making this the primary.",
   "please_refresh": "Please refresh the page to continue.",
@@ -1598,20 +1683,22 @@
   "plus_additional_collaborators_document_history_track_changes_and_more": "(plus additional collaborators, document history, track changes, and more).",
   "plus_more": "plus more",
   "plus_x_additional_licenses_for_a_total_of_y_licenses": "Plus <0>__additionalLicenses__</0> additional license(s) for a total of <1>__count__ licenses</1>",
+  "po_number": "PO Number",
+  "po_number_can_include_digits_and_letters_only": "PO number can include digits and letters only",
+  "po_number_must_not_exceed_x_characters": "PO number must not exceed __count__ characters",
   "popular_tags": "Popular Tags",
   "portal_add_affiliation_to_join": "It looks like you are already logged in to __appName__. If you have a __portalTitle__ email you can add it now.",
   "position": "Position",
-  "postal_code": "Postal Code",
-  "postal_code_sentence_case": "Postal code",
+  "postal_code": "Postal code",
   "premium": "Premium",
   "premium_feature": "Premium feature",
-  "premium_features": "Premium features",
   "premium_plan_label": "You’re using <b>Overleaf Premium</b>",
   "presentation": "Presentation",
   "presentation_mode": "Presentation mode",
-  "press_and_awards": "Press & awards",
+  "prev": "Prev",
   "previous_page": "Previous page",
   "price": "Price",
+  "pricing": "Pricing",
   "primarily_work_study_question": "Where do you primarily work or study?",
   "primarily_work_study_question_company": "Company",
   "primarily_work_study_question_government": "Government",
@@ -1633,15 +1720,16 @@
   "processing": "processing",
   "processing_uppercase": "Processing",
   "processing_your_request": "Please wait while we process your request.",
+  "product": "Product",
   "professional": "Professional",
   "progress_bar_percentage": "Progress bar from 0 to 100%",
   "project": "project",
   "project_approaching_file_limit": "This project is approaching the file limit",
-  "project_failed_to_compile": "Your project failed to compile",
   "project_figure_modal": "Project",
   "project_files": "Project files",
   "project_flagged_too_many_compiles": "This project has been flagged for compiling too often. The limit will be lifted shortly.",
   "project_has_too_many_files": "This project has reached the 2000 file limit",
+  "project_history_list": "Project history list",
   "project_last_published_at": "Your project was last published at",
   "project_layout_sharing_submission": "Project Layout, Sharing, and Submission",
   "project_linked_to": "This project is linked to",
@@ -1651,11 +1739,12 @@
   "project_ownership_transfer_confirmation_2": "This action cannot be undone. The new owner will be notified and will be able to change project access settings (including removing your own access).",
   "project_renamed_or_deleted": "Project Renamed or Deleted",
   "project_renamed_or_deleted_detail": "This project has either been renamed or deleted by an external data source such as Dropbox. We don’t want to delete your data on Overleaf, so this project still contains your history and collaborators. If the project has been renamed please look in your project list for a new project under the new name.",
+  "project_search": "Project search",
   "project_search_file_count": "in __count__ file",
   "project_search_file_count_plural": "in __count__ files",
   "project_search_result_count": "__count__ result",
   "project_search_result_count_plural": "__count__ results",
-  "project_synchronisation": "Project Synchronisation",
+  "project_synchronisation": "Project synchronisation",
   "project_timed_out_enable_stop_on_first_error": "<0>Enable “Stop on first error”</0> to help you find and fix errors right away.",
   "project_timed_out_fatal_error": "A <0>fatal compile error</0> may be completely blocking compilation.",
   "project_timed_out_intro": "Sorry, your compile took too long to run and timed out. The most common causes of timeouts are:",
@@ -1672,7 +1761,7 @@
   "pt": "Portuguese",
   "public": "Public",
   "publish": "Publish",
-  "publish_as_template": "Manage Template",
+  "publish_as_template": "Publish as a Template",
   "publisher_account": "Publisher Account",
   "publishing": "Publishing",
   "pull_github_changes_into_sharelatex": "Pull GitHub changes into __appName__",
@@ -1686,7 +1775,10 @@
   "reactivate_subscription": "Reactivate your subscription",
   "read_lines_from_path": "Read lines from __path__",
   "read_more": "Read more",
+  "read_more_about_compile_timeout_changes": "Read more about changes to compile timeout limits",
+  "read_more_about_fix_prevent_timeout": "Read more about how to fix and prevent timeouts",
   "read_more_about_free_compile_timeouts_servers": "Read more about changes to free compile timeouts and servers",
+  "read_only_dropbox_sync_message": "As a read-only viewer you can sync the current project version to Dropbox, but changes made in Dropbox will <0>not</0> sync back to Overleaf.",
   "read_only_token": "Read-Only Token",
   "read_write_token": "Read-Write Token",
   "ready_to_join_x": "You’re ready to join __inviterName__",
@@ -1716,8 +1808,10 @@
   "redirect_to_editor": "Redirect to editor",
   "redirect_url": "Redirect URL",
   "redirecting": "Redirecting",
+  "redo": "Redo",
   "reduce_costs_group_licenses": "You can cut down on paperwork and reduce costs with our discounted group licenses.",
   "reference_error_relink_hint": "If this error persists, try re-linking your account here:",
+  "reference_manager_lowercase": "reference manager",
   "reference_manager_searched_groups": "__provider__ search groups",
   "reference_managers": "Reference managers",
   "reference_search": "Advanced reference search",
@@ -1734,7 +1828,7 @@
   "regards": "Regards",
   "register": "Register",
   "register_error": "Registration error",
-  "register_intercept_sso": "You can link your __authProviderName__ account from the Account Settings page after logging in.",
+  "register_intercept_sso": "You can link your __authProviderName__ account from the Account settings page after logging in.",
   "register_to_accept_invitation": "Register to accept invitation",
   "register_to_edit_template": "Please register to edit the __templateName__ template",
   "register_with_another_email": "<a href=\"__link__\">Register with __appName__</a> using another email.",
@@ -1751,7 +1845,6 @@
   "remote_service_error": "The remote service produced an error",
   "remove": "Remove",
   "remove_access": "Remove access",
-  "remove_email_address": "Remove email address",
   "remove_from_group": "Remove from group",
   "remove_link": "Remove link",
   "remove_manager": "Remove manager",
@@ -1759,6 +1852,7 @@
   "remove_secondary_email_addresses": "Remove any secondary email addresses associated with your account. <0>Remove them in account settings.</0>",
   "remove_sso_login_option": "Remove the SSO login option for your users.",
   "remove_tag": "Remove tag __tagName__",
+  "remove_user": "Remove user",
   "removed": "removed",
   "removed_from_project": "Removed from project",
   "removing": "Removing",
@@ -1780,7 +1874,6 @@
   "republish": "Republish",
   "request_new_password_reset_email": "Request a new password reset email",
   "request_overleaf_common": "Request Overleaf Commons",
-  "request_password_reset": "Request password reset",
   "request_password_reset_to_reconfirm": "Request password reset email to reconfirm",
   "request_reconfirmation_email": "Request reconfirmation email",
   "request_sent_thank_you": "Message sent! Our team will review it and reply by email.",
@@ -1789,12 +1882,10 @@
   "resend": "Resend",
   "resend_confirmation_code": "Resend confirmation code",
   "resend_confirmation_email": "Resend confirmation email",
-  "resend_email": "Resend email",
   "resend_group_invite": "Resend group invite",
   "resend_link_sso": "Resend SSO invite",
   "resend_managed_user_invite": "Resend managed user invite",
   "resending_confirmation_code": "Resending confirmation code",
-  "resending_confirmation_email": "Resending confirmation email",
   "reset_password": "Reset Password",
   "reset_password_link": "Click this link to reset your password",
   "reset_password_sentence_case": "Reset password",
@@ -1826,9 +1917,10 @@
   "reverse_x_sort_order": "Reverse __x__ sort order",
   "revert_pending_plan_change": "Revert scheduled plan change",
   "review": "Review",
-  "review_panel_comments_and_track_changes": "Review panel – Comments & track changes",
-  "review_your_peers_work": "Review your peers’ work",
+  "review_panel": "Review panel",
+  "review_panel_and_error_logs_moved_to_the_left": "Review panel and error logs moved to the left",
   "reviewer": "Reviewer",
+  "reviewer_dropbox_sync_message": "As a reviewer you can sync the current project version to Dropbox, but changes made in Dropbox will <0>not</0> sync back to Overleaf.",
   "reviewing": "Reviewing",
   "revoke": "Revoke",
   "revoke_invite": "Revoke Invite",
@@ -1854,7 +1946,6 @@
   "saml_response": "SAML Response",
   "save": "Save",
   "save_20_percent": "save 20%",
-  "save_20_percent_when_you_switch_to_annual": "Save 20% when you switch to annual",
   "save_or_cancel-cancel": "Cancel",
   "save_or_cancel-or": "or",
   "save_or_cancel-save": "Save",
@@ -1864,7 +1955,6 @@
   "search": "Search",
   "search_all_project_files": "Search all project files",
   "search_bib_files": "Search by author, title, year",
-  "search_by_author_journal_title_and_more_link_to_zotero_mendeley": "Search by author, journal, title, and more. Link to Zotero or Mendeley to search and add references from your libraries directly in your project.",
   "search_by_author_journal_title_and_more_link_to_zotero_mendeley_papers": "Search by author, journal, title, and more. Link to Zotero, Mendeley, or Papers to search and add references from your libraries directly in your project.",
   "search_by_citekey_author_year_title": "Search by citation key, author, title, year",
   "search_command_find": "Find",
@@ -1890,9 +1980,10 @@
   "search_whole_word": "Whole word",
   "search_within_selection": "Within selection",
   "searched_path_for_lines_containing": "Searched __path__ for lines containing \"__query__\"",
+  "searching_all_project_files_is_now_available": "Searching all project files is now available (2 June 2025)",
   "secondary_email_password_reset": "That email is registered as a secondary email. Please enter the primary email for your account.",
   "security": "Security",
-  "see_changes_in_your_documents_live": "See changes in your documents, live",
+  "see_suggestions_from_collaborators": "See suggestions from collaborators",
   "select_a_column_or_a_merged_cell_to_align": "Select a column or a merged cell to align",
   "select_a_column_to_adjust_column_width": "Select a column to adjust column width",
   "select_a_file": "Select a File",
@@ -1920,15 +2011,16 @@
   "select_from_your_computer": "select from your computer",
   "select_github_repository": "Select a GitHub repository to import into __appName__.",
   "select_image_from_project_files": "Select image from project files",
-  "select_monthly_plans": "Select for monthly plans",
   "select_project": "Select __project__",
   "select_projects": "Select Projects",
+  "select_size": "Select size",
   "select_tag": "Select tag __tagName__",
   "select_user": "Select user",
   "selected": "Selected",
   "selected_by_overleaf_staff": "Selected by Overleaf staff",
   "selection_deleted": "Selection deleted",
   "send": "Send",
+  "send_confirmation_code": "Send confirmation code",
   "send_first_message": "Send your first message to your collaborators",
   "send_message": "Send message",
   "send_request": "Send request",
@@ -1952,7 +2044,6 @@
   "set_up_single_sign_on": "Set up single sign-on (SSO)",
   "set_up_sso": "Set up SSO",
   "settings": "Settings",
-  "settings_for_git_github_and_dropbox_integrations": "Settings for Git, Github & Dropbox integrations",
   "setup_another_account_under_a_personal_email_address": "Set up another Overleaf account under a personal email address.",
   "share": "Share",
   "share_project": "Share Project",
@@ -1960,7 +2051,10 @@
   "sharelatex_beta_program": "__appName__ Beta Program",
   "shortcut_to_open_advanced_reference_search": "(<strong>__ctrlSpace__</strong> or <strong>__altSpace__</strong>)",
   "show_all_projects": "Show all projects",
+  "show_breadcrumbs": "Show breadcrumbs",
+  "show_breadcrumbs_in_toolbar": "Show breadcrumbs in toolbar",
   "show_document_preamble": "Show document preamble",
+  "show_equation_preview": "Show equation preview",
   "show_file_tree": "Show file tree",
   "show_hotkeys": "Show Hotkeys",
   "show_in_code": "Show in code",
@@ -1970,6 +2064,7 @@
   "show_local_file_contents": "Show Local File Contents",
   "show_more": "show more",
   "show_outline": "Show File outline",
+  "show_version_history": "Show version history",
   "show_x_more_projects": "Show __x__ more projects",
   "showing_1_result": "Showing 1 result",
   "showing_1_result_of_total": "Showing 1 result of __total__",
@@ -1987,9 +2082,10 @@
   "six_per_project": "6 per project",
   "skip": "Skip",
   "skip_to_content": "Skip to content",
+  "solutions": "Solutions",
   "something_not_right": "Something’s not right",
   "something_went_wrong": "Something went wrong",
-  "something_went_wrong_canceling_your_subscription": "Something went wrong canceling your subscription. Please contact support.",
+  "something_went_wrong_canceling_your_subscription": "Something went wrong canceling your subscription. Please contact Support.",
   "something_went_wrong_loading_pdf_viewer": "Something went wrong loading the PDF viewer. This might be caused by issues like <0>temporary network problems</0> or an <0>outdated web browser</0>. Please follow the <1>troubleshooting steps for access, loading and display problems</1>. If the issue persists, please <2>let us know</2>.",
   "something_went_wrong_processing_the_request": "Something went wrong processing the request",
   "something_went_wrong_rendering_pdf": "Something went wrong while rendering this PDF.",
@@ -2004,6 +2100,7 @@
   "sorry_there_was_an_issue_upgrading_your_subscription": "Sorry, there was an issue upgrading your subscription. Please <0>contact our Support team</0> for help.",
   "sorry_this_account_has_been_suspended": "Sorry, this account has been suspended.",
   "sorry_you_can_only_change_to_group_from_trial_via_support": "Sorry, you can only change to a group plan during a free trial by contacting support.",
+  "sorry_you_can_only_change_to_group_via_support": "Sorry, you can only change to a group plan by contacting support.",
   "sorry_your_table_cant_be_displayed_at_the_moment": "Sorry, your table can’t be displayed at the moment.",
   "sorry_your_token_expired": "Sorry, your token expired",
   "sort_by": "Sort by",
@@ -2069,6 +2166,7 @@
   "start_a_free_trial": "Start a free trial",
   "start_by_adding_your_email": "Start by adding your email address.",
   "start_by_fixing_the_first_error_in_your_doc": "Start by fixing the first error in your doc to avoid problems later on.",
+  "start_by_fixing_the_first_error_in_your_document": "Start by fixing the first error in the document to avoid cascading problems later on.",
   "start_free_trial": "Start Free Trial!",
   "start_free_trial_without_exclamation": "Start Free Trial",
   "start_the_conversation_by_saying_hello_or_sharing_an_update": "Start the conversation by saying hello or sharing an update",
@@ -2085,6 +2183,10 @@
   "stop_on_validation_error": "Check syntax before compile",
   "store_your_work": "Store your work on your own infrastructure",
   "stretch_width_to_text": "Stretch width to text",
+  "stripe_error_please_wait_and_try_again": "There is an error with our payment processor, please wait a few minutes and try again.",
+  "stripe_key_error_please_contact_support": "There is an error with our payment processor, please <0>contact support.</0>",
+  "strongly_agree": "Strongly agree",
+  "strongly_disagree": "Strongly disagree",
   "student": "Student",
   "student_disclaimer": "The educational discount applies to all students at secondary and postsecondary institutions (schools and universities). We may contact you to confirm that you’re eligible for the discount.",
   "student_verification_required": "Student verification required",
@@ -2107,6 +2209,7 @@
   "suggest_a_different_fix": "Suggest a different fix",
   "suggest_fix": "Suggest fix",
   "suggested": "Suggested",
+  "suggested_code": "Suggested code",
   "suggested_fix_for_error_in_path": "Suggested fix for error in __path__",
   "suggestion": "Suggestion",
   "suggestion_applied": "Suggestion applied",
@@ -2119,13 +2222,13 @@
   "sure_you_want_to_delete": "Are you sure you want to permanently delete the following files?",
   "sure_you_want_to_leave_group": "Are you sure you want to leave this group?",
   "sv": "Swedish",
-  "switch_back_to_monthly_pay_20_more": "Switch back to monthly (20% more)",
   "switch_compile_mode_for_faster_draft_compilation": "Switch compile mode for faster draft compilation",
   "switch_to_editor": "Switch to editor",
   "switch_to_new_editor": "Switch to new editor",
   "switch_to_old_editor": "Switch to old editor",
   "switch_to_pdf": "Switch to PDF",
   "switch_to_standard_plan": "Switch to Standard plan",
+  "symbol": "Symbol",
   "symbol_palette": "Symbol palette",
   "symbol_palette_highlighted": "<0>Symbol</0> palette",
   "symbol_palette_info_new": "Insert math symbols into your document with the click of a button.",
@@ -2138,6 +2241,7 @@
   "syntax_validation": "Code check",
   "tab_connecting": "Connecting with the editor",
   "tab_no_longer_connected": "This tab is no longer connected with the editor",
+  "table": "Table",
   "table_generator": "Table Generator",
   "tag_color": "Tag color",
   "tag_name_cannot_exceed_characters": "Tag name cannot exceed __maxLength__ characters",
@@ -2146,8 +2250,6 @@
   "take_me_home": "Take me home!",
   "take_short_survey": "Take a short survey",
   "take_survey": "Take survey",
-  "tc_everyone": "Everyone",
-  "tc_guests": "Guests",
   "tell_the_project_owner_and_ask_them_to_upgrade": "<0>Tell the project owner</0> and ask them to upgrade their Overleaf plan if you need more compile time.",
   "template": "Template",
   "template_approved_by_publisher": "This template has been approved by the publisher",
@@ -2156,6 +2258,7 @@
   "template_not_found_description": "This way of creating projects from templates has been removed. Please visit our template gallery to find more templates.",
   "template_title_taken_from_project_title": "The template title will be taken automatically from the project title",
   "template_top_pick_by_overleaf": "This template was hand-picked by Overleaf staff for its high quality",
+  "template_with_this_title_exists_and_owned_by_x": "A template with this title already exists and is owned by __x__.",
   "templates": "Templates",
   "templates_admin_source_project": "Admin: Source Project",
   "templates_lowercase": "templates",
@@ -2169,7 +2272,8 @@
   "test_configuration": "Test configuration",
   "test_configuration_successful": "Test configuration successful",
   "tex_live_version": "TeX Live version",
-  "texgpt_for_help_writing_latex": "<0>TeXGPT</0> for help writing LaTeX",
+  "texgpt": "TeXGPT",
+  "text": "Text",
   "thank_you": "Thank you!",
   "thank_you_email_confirmed": "Thank you, your email is now confirmed",
   "thank_you_exclamation": "Thank you!",
@@ -2213,10 +2317,16 @@
   "then_x_price_per_year": "Then __price__ per year",
   "there_are_lots_of_options_to_edit_and_customize_your_figures": "There are lots of options to edit and customize your figures, such as wrapping text around the figure, rotating the image, or including multiple images in a single figure. You’ll need to edit the LaTeX code to do this. <0>Find out how</0>",
   "there_is_an_unrecoverable_latex_error": "There is an unrecoverable LaTeX error. If there are LaTeX errors shown below or in the raw logs, please try to fix them and compile again.",
-  "there_was_a_problem_restoring_the_project_please_try_again_in_a_few_moments_or_contact_us": "There was a problem restoring the project. Please try again in a few moments. Contact us of the problem persists.",
+  "there_was_a_problem_restoring_the_project_please_try_again_in_a_few_moments_or_contact_us": "There was a problem restoring the project. Please try again in a few moments. Contact us if the problem persists.",
   "there_was_an_error_opening_your_content": "There was an error creating your project",
   "thesis": "Thesis",
   "they_lose_access_to_account": "They lose all access to this Overleaf account immediately",
+  "they_will_be_removed_from_the_group": "They will be removed from the group.",
+  "they_will_continue_to_have_access_to_any_projects_shared_with_them": "They will continue to have access to any projects shared with them.",
+  "they_will_no_longer_be_a_managed_user": "They will no longer be a managed user.",
+  "they_will_retain_ownership_of_projects_currently_owned_by_them_and_collaborators_will_become_read_only": "They will retain ownership of projects currently owned by them and any collaborators on those projects will become read-only.",
+  "they_will_retain_their_existing_account_on_the_free_plan": "They will retain their existing account on the __appName__ free plan.",
+  "they_wont_be_able_to_log_in_with_sso_they_will_need_to_set_password": "They won’t be able to log in with SSO (if you have this enabled). They will need to set an __appName__ password.",
   "this_action_cannot_be_reversed": "This action cannot be reversed.",
   "this_action_cannot_be_undone": "This action cannot be undone.",
   "this_address_will_be_shown_on_the_invoice": "This address will be shown on the invoice",
@@ -2228,14 +2338,14 @@
   "this_is_a_new_feature": "This is a new feature",
   "this_is_the_file_that_references_pulled_from_your_reference_manager_will_be_added_to": "This is the file that references pulled from your reference manager will be added to.",
   "this_is_your_template": "This is your template from your project",
-  "this_project_already_has_maximum_editors": "This project already has the maximum number of editors permitted on the owner’s plan. This means you can view but not edit the project.",
+  "this_project_already_has_maximum_collaborators": "This project already has the maximum number of collaborators permitted on the owner’s plan. This means you can view but not edit or review the project.",
+  "this_project_compiled_but_soon_might_not": "This project compiled, but soon it might not",
   "this_project_contains_a_file_called_output": "This project contains a file called output.pdf. If that file exists, please rename it and compile again.",
+  "this_project_exceeded_collaborator_limit": "This project exceeded the collaborator limit for your plan. All other users now have view-only access.",
   "this_project_exceeded_compile_timeout_limit_on_free_plan": "This project exceeded the compile timeout limit on our free plan.",
-  "this_project_exceeded_editor_limit": "This project exceeded the editor limit for your plan. All collaborators now have view-only access.",
   "this_project_has_more_than_max_collabs": "This project has more than the maximum number of collaborators allowed on the project owner’s Overleaf plan. This means you could lose edit access from __linkSharingDate__.",
   "this_project_is_public": "This project is public and can be edited by anyone with the URL.",
   "this_project_is_public_read_only": "This project is public and can be viewed but not edited by anyone with the URL",
-  "this_project_need_more_time_to_compile": "It looks like this project may need more time to compile than our free plan allows.",
   "this_project_will_appear_in_your_dropbox_folder_at": "This project will appear in your Dropbox folder at ",
   "this_tool_helps_you_insert_figures": "This tool helps you insert figures into your project without needing to write the LaTeX code. The following information explains more about the options in the tool and how to further customize your figures.",
   "this_tool_helps_you_insert_simple_tables_into_your_project_without_writing_latex_code_give_feedback": "This tool helps you insert simple tables into your project without writing LaTeX code. This tool is new, so please <0>give us feedback</0> and look out for additional functionality coming soon.",
@@ -2254,7 +2364,6 @@
   "to_confirm_transfer_enter_email_address": "To accept the invitation, enter the email address linked to your account.",
   "to_confirm_unlink_all_users_enter_email": "To confirm you want to unlink all users, enter your email address:",
   "to_continue_using_upgrade_or_change_your_browser": "To continue using __appName__ without problems you need to upgrade or change to a <0>supported browser</0>.",
-  "to_delete_your_writefull_account": "To delete your Writefull account, or to check if you have one, please contact <a>__email__</a>.",
   "to_fix_this_you_can": "To fix this, you can:",
   "to_fix_this_you_can_ask_the_github_repository_owner": "To fix this, you can ask the GitHub repository owner (<0>__repoOwnerEmail__</0>) to renew their __appName__ subscription and reconnect the project.",
   "to_insert_or_move_a_caption_make_sure_tabular_is_directly_within_table": "To insert or move a caption, make sure \\begin{tabular} is directly within a table environment",
@@ -2265,7 +2374,7 @@
   "to_use_text_wrapping_in_your_table_make_sure_you_include_the_array_package": "<0>Please note:</0> To use text wrapping in your table, make sure you include the <1>array</1> package in your document preamble:",
   "toggle_compile_options_menu": "Toggle compile options menu",
   "toggle_unknown_group": "Toggle unknown group",
-  "token": "token",
+  "token": "Token",
   "token_access_failure": "Cannot grant access; contact the project owner for help",
   "token_limit_reached": "You’ve reached the 10 token limit. To generate a new authentication token, please delete an existing one.",
   "token_read_only": "token read-only",
@@ -2287,6 +2396,8 @@
   "toolbar_editor": "Editor tools",
   "toolbar_format_bold": "Format Bold",
   "toolbar_format_italic": "Format Italic",
+  "toolbar_generate_math": "Generate Math",
+  "toolbar_generate_table": "Generate Table",
   "toolbar_increase_indent": "Increase Indent",
   "toolbar_insert_citation": "Insert Citation",
   "toolbar_insert_cross_reference": "Insert Cross-reference",
@@ -2296,6 +2407,7 @@
   "toolbar_insert_link": "Insert Link",
   "toolbar_insert_math": "Insert Math",
   "toolbar_insert_math_and_symbols": "Insert Math and Symbols",
+  "toolbar_insert_math_lowercase": "Insert math",
   "toolbar_insert_misc": "Insert Misc (links, citations, cross-references, figures, tables)",
   "toolbar_insert_table": "Insert Table",
   "toolbar_list_indentation": "List and Indentation",
@@ -2321,6 +2433,7 @@
   "tooltip_show_pdf": "Click to show the PDF",
   "top_pick": "Top pick",
   "total": "Total",
+  "total_due_in_x_days": "Total due in __days__ days",
   "total_due_today": "Total due today",
   "total_per_month": "Total per month",
   "total_per_year": "Total per year",
@@ -2329,12 +2442,7 @@
   "total_with_subtotal_and_tax": "Total: <0>__total__</0> (__subtotal__ + __tax__ tax) per year",
   "total_words": "Total Words",
   "tr": "Turkish",
-  "track_any_change_in_real_time": "Track any change, in real-time",
   "track_changes": "Track changes",
-  "track_changes_for_everyone": "Track changes for everyone",
-  "track_changes_for_x": "Track changes for __name__",
-  "track_changes_is_off": "Track changes is <strong>off</strong>",
-  "track_changes_is_on": "Track changes is <strong>on</strong>",
   "tracked_change_added": "Added",
   "tracked_change_deleted": "Deleted",
   "transfer_management_of_your_account": "Transfer management of your Overleaf account",
@@ -2342,10 +2450,11 @@
   "transfer_management_resolve_following_issues": "To transfer the management of your account, you need to resolve the following issues:",
   "transfer_this_users_projects": "Transfer this user’s projects",
   "transfer_this_users_projects_description": "This user’s projects will be transferred to a new owner.",
+  "transferring": "Transferring",
   "trash": "Trash",
   "trash_projects": "Trash Projects",
   "trashed": "Trashed",
-  "trashed_projects": "Trashed Projects",
+  "trashed_projects": "Trashed projects",
   "trashing_projects_wont_affect_collaborators": "Trashing projects won’t affect your collaborators.",
   "trial_last_day": "This is the last day of your <b>Overleaf Premium</b> trial",
   "trial_remaining_days": "__days__ more days on your <b>Overleaf Premium</b> trial",
@@ -2357,6 +2466,7 @@
   "try_it_for_free": "Try it for free",
   "try_now": "Try Now",
   "try_premium_for_free": "Try Premium for free",
+  "try_recompile_project": "Please try recompiling the project from scratch.",
   "try_recompile_project_or_troubleshoot": "Please try recompiling the project from scratch, and if that doesn’t help, follow our <0>troubleshooting guide</0>.",
   "try_relinking_provider": "It looks like you need to re-link your __provider__ account.",
   "try_the_new_editor": "Try the new editor",
@@ -2375,6 +2485,7 @@
   "undelete": "Undelete",
   "undeleting": "Undeleting",
   "understanding_labels": "Understanding labels",
+  "undo": "Undo",
   "unfold_line": "Unfold line",
   "unique_identifier_attribute": "Unique identifier attribute",
   "university": "University",
@@ -2393,8 +2504,8 @@
   "unlink_dropbox_warning": "Any projects that you have synced with Dropbox will be disconnected and no longer kept in sync with Dropbox. Are you sure you want to unlink your Dropbox account?",
   "unlink_github_repository": "Unlink GitHub repository",
   "unlink_github_warning": "Any projects that you have synced with GitHub will be disconnected and no longer kept in sync with GitHub. Are you sure you want to unlink your GitHub account?",
-  "unlink_linked_accounts": "Unlink any linked accounts (such as ORCID ID, IEEE). <0>Remove them in Account Settings (under Linked Accounts).</0>",
-  "unlink_linked_google_account": "Unlink your Google account. <0>Remove it in Account Settings (under Linked Accounts).</0>",
+  "unlink_linked_accounts": "Unlink any linked accounts (such as ORCID ID, IEEE). <0>Remove them in Account settings (under Linked Accounts).</0>",
+  "unlink_linked_google_account": "Unlink your Google account. <0>Remove it in Account settings (under Linked Accounts).</0>",
   "unlink_provider_account_title": "Unlink __provider__ Account",
   "unlink_provider_account_warning": "Warning: When you unlink your account from __provider__ you will not be able to sign in using __provider__ anymore.",
   "unlink_reference": "Unlink References Provider",
@@ -2414,7 +2525,7 @@
   "until_then_you_can_still": "Until then you can still:",
   "untrash": "Restore",
   "update": "Update",
-  "update_account_info": "Update Account Info",
+  "update_account_info": "Update account info",
   "update_dropbox_settings": "Update Dropbox Settings",
   "update_your_billing_details": "Update your billing details",
   "updates_to_project_sharing": "Updates to project sharing",
@@ -2422,20 +2533,20 @@
   "updating_site": "Updating Site",
   "upgrade": "Upgrade",
   "upgrade_cc_btn": "Upgrade now, pay after 7 days",
-  "upgrade_for_12x_more_compile_time": "Upgrade to get 12x more compile time",
+  "upgrade_for_more_compile_time": "Upgrade to get more compile time",
   "upgrade_my_plan": "Upgrade my plan",
   "upgrade_now": "Upgrade now",
   "upgrade_plan": "Upgrade plan",
   "upgrade_summary": "Upgrade summary",
-  "upgrade_to_add_more_editors_and_access_collaboration_features": "Upgrade to add more editors and access collaboration features like track changes and full project history.",
+  "upgrade_to_add_more_collaborators_and_access_collaboration_features": "Upgrade to add more collaborators and access collaboration features like track changes and full project history.",
   "upgrade_to_get_feature": "Upgrade to get __feature__, plus:",
-  "upgrade_to_track_changes": "Upgrade to track changes",
-  "upgrade_to_unlock_more_time": "Upgrade now to unlock 12x more compile time on our fastest servers.",
+  "upgrade_to_review": "Upgrade to Review",
   "upgrade_your_subscription": "Upgrade your subscription",
   "upload": "Upload",
   "upload_failed": "Upload failed",
+  "upload_file": "Upload file",
   "upload_from_computer": "Upload from computer",
-  "upload_project": "Upload Project",
+  "upload_project": "Upload project",
   "upload_zipped_project": "Upload Zipped Project",
   "url_to_fetch_the_file_from": "URL to fetch the file from",
   "us_gov_banner_fedramp": "<0>Now FedRAMP® authorized for LI-SaaS: </0>Overleaf’s Group Professional subscription. Need an air-gapped deployment? We offer an on-premises solution too. Talk to our US federal government team.",
@@ -2455,6 +2566,7 @@
   "user_deletion_error": "Sorry, something went wrong deleting your account. Please try again in a minute.",
   "user_deletion_password_reset_tip": "If you cannot remember your password, or if you are using Single-Sign-On with another provider to sign in (such as ORCID or Google), please <0>reset your password</0> and try again.",
   "user_first_name_attribute": "User first name attribute",
+  "user_has_left_organization_and_need_to_transfer_their_projects": "In cases where a user has left your organization and you need to transfer their projects, the <0>Delete user</0> option should be used.",
   "user_is_not_part_of_group": "User is not part of group",
   "user_last_name_attribute": "User last name attribute",
   "user_management": "User management",
@@ -2476,7 +2588,7 @@
   "vat_number": "VAT Number",
   "verify_email_address_before_enabling_managed_users": "You need to verify your email address before enabling managed users.",
   "view": "View",
-  "view_all": "View All",
+  "view_all": "View all",
   "view_billing_details": "View billing details",
   "view_code": "View code",
   "view_configuration": "View configuration",
@@ -2497,6 +2609,7 @@
   "view_only_downgraded": "View only. Upgrade to restore edit access.",
   "view_only_reviewer_downgraded": "View only. Upgrade to restore review access.",
   "view_options": "View options",
+  "view_payment_portal": "View invoices and billing details",
   "view_pdf": "View PDF",
   "view_source": "View Source",
   "view_your_invoices": "View your invoices",
@@ -2507,8 +2620,7 @@
   "visual_editor_is_only_available_for_tex_files": "Visual Editor is only available for TeX files",
   "want_access_to_overleaf_premium_features_through_your_university": "Want access to __appName__ premium features through your university?",
   "want_change_to_apply_before_plan_end": "If you wish this change to apply before the end of your current billing period, please contact us.",
-  "we_are_testing_a_new_reference_search": "We are testing a new reference search.",
-  "we_are_unable_to_generate_the_pdf_at_this_time": "We are unable to generate the pdf at this time.",
+  "we_are_unable_to_generate_the_pdf_at_this_time": "We are unable to generate the PDF at this time.",
   "we_are_unable_to_opt_you_into_this_experiment": "We are unable to opt you into this experiment at this time, please ensure your organization has allowed this feature, or try again later.",
   "we_cant_confirm_this_email": "We can’t confirm this email",
   "we_cant_find_any_sections_or_subsections_in_this_file": "We can’t find any sections or subsections in this file",
@@ -2520,6 +2632,7 @@
   "we_sent_new_code": "We’ve sent a new code. If it doesn’t arrive, make sure to check your spam and any promotions folders.",
   "we_will_charge_you_now_for_the_cost_of_your_additional_licenses_based_on_remaining_months": "We’ll charge you now for the cost of your additional licenses based on the remaining months of your current subscription.",
   "we_will_charge_you_now_for_your_new_plan_based_on_the_remaining_months_of_your_current_subscription": "We’ll charge you now for your new plan based on the remaining months of your current subscription.",
+  "we_will_invoice_you_now_for_the_additional_licenses_based_on_remaining_months": "We’ll invoice you now for the additional licences based on the remaining months of your current subscription, and payment will be due in __days__ days.",
   "we_will_use_your_existing_payment_method": "We’ll use your existing payment method <strong>__paymentMethod__</strong>.",
   "webinars": "Webinars",
   "website_status": "Website status",
@@ -2529,16 +2642,15 @@
   "were_making_some_changes_to_project_sharing_this_means_you_will_be_visible": "We’re making some <0>changes to project sharing</0>. This means, as someone with edit access, your name and email address will be visible to the project owner and other editors.",
   "were_performing_maintenance": "We’re performing maintenance on Overleaf and you need to wait a moment. Sorry for any inconvenience. The editor will refresh automatically in __seconds__ seconds.",
   "were_redesigning_our_editor_to_make_it_easier_to_use": "We’re redesigning our editor to make it easier to use and ensure it’s future ready. Try it out and give us your feedback to help us get this right. (Some features are still in the works, so you can switch back at any time.)",
-  "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_this_project": "We’ve recently <0>reduced the compile timeout limit</0> on our free plan, which may have affected this project.",
-  "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_your_project": "We’ve recently <0>reduced the compile timeout limit</0> on our free plan, which may have affected your project.",
+  "were_reducing_compile_timeout": "We’re in the process of <0>reducing the compile timeout limit</0> on our free plan, which may affect your project in future.",
+  "what_did_you_find_most_helpful": "What did you find most helpful?",
   "what_do_you_need": "What do you need?",
   "what_do_you_need_help_with": "What do you need help with?",
   "what_does_this_mean": "What does this mean?",
   "what_does_this_mean_for_you": "This means:",
   "what_happens_when_sso_is_enabled": "What happens when SSO is enabled?",
   "what_should_we_call_you": "What should we call you?",
-  "whats_new": "What’s new?",
-  "whats_next": "What’s next?",
+  "whats_different_in_the_new_editor": "What’s different in the new editor?",
   "when_you_join_labs": "When you join Labs, you can choose which experiments you want to be part of. Once you’ve done that, you can use Overleaf as normal, but you’ll see any labs features marked with this badge:",
   "when_you_tick_the_include_caption_box": "When you tick the box “Include caption” the image will be inserted into your document with a placeholder caption. To edit it, you simply select the placeholder text and type to replace it with your own.",
   "why_latex": "Why LaTeX?",
@@ -2549,12 +2661,18 @@
   "will_need_to_log_out_from_and_in_with": "You will need to <b>log out</b> from your <b>__email1__</b> account and then log in with <b>__email2__</b>.",
   "with_premium_subscription_you_also_get": "With an Overleaf Premium subscription you also get",
   "word_count": "Word Count",
+  "word_count_lower": "Word count",
   "work_in_vim_or_emacs_emulation_mode": "Work in Vim or Emacs emulation mode",
   "work_offline": "Work offline",
   "work_offline_pull_to_overleaf": "Work offline, then pull to __appName__",
   "work_or_university_sso": "Work/university single sign-on",
+  "work_smarter_with_ai_assist": "Work smarter with AI Assist: AI tools built by TeXperts, for LaTeX",
+  "work_smarter_with_ai_assist_description": "Get help with everything from language suggestions and writing support to generating LaTeX tables and fixing errors.",
   "work_with_non_overleaf_users": "Work with non Overleaf users",
   "work_with_other_github_users": "Work with other GitHub users",
+  "write_faster_smarter_with_overleaf_and_writefull_ai_tools": "Write faster, smarter, and with confidence with Overleaf and Writefull AI tools",
+  "write_smarter_right_now": "Write smarter, right now",
+  "write_smarter_right_now_description": "Write faster and with confidence with AI Assist—LaTeX-tailored AI tools from Overleaf and Writefull.",
   "writefull": "Writefull",
   "writefull_loading_error_body": "Try refreshing the page. If this doesn’t work, try disabling any active browser extensions to check they aren’t blocking Writefull from loading.",
   "writefull_loading_error_title": "Writefull didn’t load correctly",
@@ -2580,23 +2698,26 @@
   "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z": "You are a <1>manager</1> of the <0>__planName__</0> group subscription <1>__groupName__</1> administered by <1>__adminEmail__</1>.",
   "you_are_a_manager_of_x_plan_as_member_of_group_subscription_y_administered_by_z_you": "You are a <1>manager</1> of the <0>__planName__</0> group subscription <1>__groupName__</1> administered by <1>you (__adminEmail__</1>).",
   "you_are_currently_logged_in_as": "You are currently logged in as <b>__email__</b>.",
-  "you_are_now_saving_20_percent": "You are now saving 20%",
-  "you_are_on_a_paid_plan_contact_support_to_find_out_more": "You’re on an __appName__ Paid plan. <0>Contact support</0> to find out more.",
+  "you_are_on_a_paid_plan_contact_support_to_find_out_more": "You’re on an __appName__ Paid plan. <0>Contact Support</0> to find out more.",
   "you_are_on_x_plan_as_a_confirmed_member_of_institution_y": "You are on our <0>__planName__</0> plan as a <1>confirmed member</1> of <1>__institutionName__</1>",
   "you_are_on_x_plan_as_member_of_group_subscription_y_administered_by_z": "You are on our <0>__planName__</0> plan as a <1>member</1> of the group subscription <1>__groupName__</1> administered by <1>__adminEmail__</1>",
   "you_can_also_choose_to_view_anonymously_or_leave_the_project": "You can also choose to <0>view anonymously</0> (you will lose edit access) or <1>leave the project</1>.",
   "you_can_buy_this_plan_but_not_as_a_trial": "You can buy this plan but not as a trial, as you’ve completed a trial recently.",
   "you_can_leave_the_experiment_from_your_account_settings_at_any_time": "You can leave the experiment from your <0>account settings</0> at any time.",
   "you_can_manage_your_reference_manager_integrations_from_your_account_settings_page": "You can manage your reference manager integrations from your <0>account settings page</0>.",
-  "you_can_now_enable_sso": "You can now enable SSO on your Group settings page.",
+  "you_can_now_enable_sso": "You can now enable SSO on your group settings page.",
   "you_can_now_log_in_sso": "You can now log in through your institution and if eligible you will receive <0>__appName__ Professional features</0>.",
+  "you_can_now_search_and_add_references_from_your_rm_library_without_needing_to_import_files": "You can now search and add references from your __referenceManager__ library without needing to import files—just type <code>\\cite{}</code> in your .tex file. <a>Learn more</a>",
   "you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page": "You can <0>opt in and out</0> of the program at any time on this page",
   "you_can_request_a_maximum_of_limit_fixes_per_day": "You can request a maximum of __limit__ fixes per day. Please try again tomorrow.",
-  "you_can_select_or_invite": "You can select or invite __count__ editor on your current plan, or upgrade to get more.",
-  "you_can_select_or_invite_plural": "You can select or invite __count__ editors on your current plan, or upgrade to get more.",
+  "you_can_select_or_invite_collaborator": "You can select or invite __count__ collaborator on your current plan. Upgrade to add more editors or reviewers.",
+  "you_can_select_or_invite_collaborator_plural": "You can select or invite __count__ collaborators on your current plan. Upgrade to add more editors or reviewers.",
   "you_can_still_use_your_premium_features": "You can still use your premium features until the pause becomes active.",
+  "you_cant_add_or_change_password_due_to_ldap_or_sso": "You can’t add or change your password because your group or organization uses LDAP or SSO.",
   "you_cant_add_or_change_password_due_to_sso": "You can’t add or change your password because your group or organization uses <0>single sign-on (SSO)</0>.",
   "you_cant_join_this_group_subscription": "You can’t join this group subscription",
+  "you_cant_overwrite_it": "You can’t overwrite it.",
+  "you_cant_reset_password_due_to_ldap_or_sso": "You can’t reset your password because your group or organization uses LDAP or SSO. Contact your system administrator.",
   "you_cant_reset_password_due_to_sso": "You can’t reset your password because your group or organization uses SSO. <0>Log in with SSO</0>.",
   "you_dont_have_any_add_ons_on_your_account": "You don’t have any add-ons on your account.",
   "you_dont_have_any_repositories": "You don’t have any repositories",
@@ -2609,6 +2730,7 @@
   "you_have_been_removed_from_this_project_and_will_be_redirected_to_project_dashboard": "You have been removed from this project, and will no longer have access to it. You will be redirected to your project dashboard momentarily.",
   "you_have_x_licenses_and_your_plan_supports_up_to_y": "You have __addedUsersSize__ licenses and your plan supports up to __groupSize__.",
   "you_have_x_licenses_on_your_subscription": "You have __groupSize__ licenses on your subscription.",
+  "you_may_be_able_to_fix_issues_to_speed_up_the_compile": "You may be able to fix issues to <0>speed up the compile</0>.",
   "you_need_to_configure_your_sso_settings": "You need to configure and test your SSO settings before enabling SSO",
   "you_unpaused_your_subscription": "You unpaused your subscription.",
   "you_will_be_able_to_contact_us_any_time_to_share_your_feedback": "<0>You will be able to contact us</0> any time to share your feedback",
@@ -2628,6 +2750,7 @@
   "your_current_plan_gives_you": "By pausing your subscription, you’ll be able to access your premium features faster when you need them again.",
   "your_current_plan_supports_up_to_x_licenses": "Your current plan supports up to __users__ licenses.",
   "your_current_project_will_revert_to_the_version_from_time": "Your current project will revert to the version from __timestamp__",
+  "your_feedback_matters_answer_two_quick_questions": "Your feedback matters! Answer two quick questions.",
   "your_git_access_info": "Your Git authentication tokens should be entered whenever you’re prompted for a password.",
   "your_git_access_info_bullet_1": "You can have up to 10 tokens.",
   "your_git_access_info_bullet_2": "If you reach the maximum limit, you’ll need to delete a token before you can generate a new one.",
@@ -2645,11 +2768,11 @@
   "your_plan_is_limited_to_n_editors": "Your plan allows __count__ collaborator with edit access and unlimited viewers.",
   "your_plan_is_limited_to_n_editors_plural": "Your plan allows __count__ collaborators with edit access and unlimited viewers.",
   "your_premium_plan_is_paused": "Your Premium plan is <0>paused</0>.",
+  "your_project_compiled_but_soon_might_not": "Your project compiled, but soon it might not",
+  "your_project_exceeded_collaborator_limit": "Your project exceeded the collaborator limit and access levels were changed. Select a new access level for your collaborators, or upgrade to add more editors or reviewers.",
   "your_project_exceeded_compile_timeout_limit_on_free_plan": "Your project exceeded the compile timeout limit on our free plan.",
-  "your_project_exceeded_editor_limit": "Your project exceeded the editor limit and access levels were changed. Select a new access level for your collaborators, or upgrade to add more editors.",
   "your_project_near_compile_timeout_limit": "Your project is near the compile timeout limit for our free plan.",
-  "your_project_need_more_time_to_compile": "It looks like your project may need more time to compile than our free plan allows.",
-  "your_projects": "Your Projects",
+  "your_projects": "Your projects",
   "your_questions_answered": "Your questions answered",
   "your_role": "Your role",
   "your_sessions": "Your Sessions",
@@ -2670,7 +2793,8 @@
   "youre_signed_up": "You’re signed up",
   "youve_added_more_licenses": "You’ve added more license(s)!",
   "youve_added_x_more_licenses_to_your_subscription_invite_people": "You’ve added __users__ more license(s) to your subscription. <0>Invite people</0>.",
-  "youve_lost_edit_access": "You’ve lost edit access",
+  "youve_already_used_your_free_tial": "You’ve already used your free trial. Upgrade to continue using premium features.",
+  "youve_lost_collaboration_access": "You’ve lost collaboration access",
   "youve_paused_your_subscription": "Your <0>__planName__</0> subscription is paused until <0>__reactivationDate__</0>, then it’ll automatically unpause. You can unpause early at any time.",
   "youve_unlinked_all_users": "You’ve unlinked all users",
   "youve_upgraded_your_plan": "You’ve upgraded your plan!",
@@ -2684,7 +2808,7 @@
   "zotero_dynamic_sync_description": "With the Zotero integration, you can import your references into __appName__. You can either import all your references at once or dynamically search your Zotero library directly from __appName__.",
   "zotero_groups_loading_error": "There was an error loading groups from Zotero",
   "zotero_groups_relink": "There was an error accessing your Zotero data. This was likely caused by lack of permissions. Please re-link your account and try again.",
-  "zotero_integration": "Zotero Integration",
+  "zotero_integration": "Zotero integration",
   "zotero_is_premium": "Zotero integration is a premium feature",
   "zotero_reference_loading_error": "Error, could not load references from Zotero",
   "zotero_reference_loading_error_expired": "Zotero token expired, please re-link your account",
diff --git a/services/web/locales/es.json b/services/web/locales/es.json
index 181baa5eec..2c9f5b1fbe 100644
--- a/services/web/locales/es.json
+++ b/services/web/locales/es.json
@@ -4,7 +4,6 @@
   "3_4_width": "¾ ancho",
   "About": "Quiénes somos",
   "Account": "Cuenta",
-  "Account Settings": "Opciones de la cuenta",
   "Documentation": "Documentación",
   "Projects": "Proyectos",
   "Security": "Seguridad",
@@ -32,7 +31,6 @@
   "accept_and_continue": "Aceptar y continuar",
   "accept_change": "Aceptar cambio",
   "accept_invitation": "Aceptar invitación",
-  "accept_or_reject_each_changes_individually": "Aceptar o rechazar cada cambio individualmente",
   "accept_terms_and_conditions": "Aceptar términos y condiciones",
   "accepted_invite": "Invitación aceptada",
   "accepting_invite_as": "Estás aceptando esta invitación como ",
@@ -67,7 +65,7 @@
   "add_email_address": "Añadir dirección de correo",
   "add_email_to_claim_features": "Añade tu correo institucional para reclamar funcionalidades.",
   "add_files": "Añadir archivos",
-  "add_more_editors": "Añadir más editores",
+  "add_more_collaborators": "Añadir más colaboradores",
   "add_more_managers": "Añadir más administradores",
   "add_new_email": "Añadir nuevo correo",
   "add_or_remove_project_from_tag": "Añadir o eliminar proyecto de la etiqueta __tagName__",
@@ -112,7 +110,6 @@
   "all_these_experiments_are_available_exclusively": "Todos estos experimentos están disponibles exclusivamente para los miembros del programa Labs. Si te inscribes, puedes elegir qué experimentos quieres probar.",
   "already_have_an_account": "¿Ya tiene una cuenta?",
   "already_have_sl_account": "¿Ya tienes una cuenta de __appName__?",
-  "already_subscribed_try_refreshing_the_page": "¿Ya estás suscrito? Prueba a actualizar la página.",
   "also": "También",
   "alternatively_create_new_institution_account": "Alternativamente, puede crear una  <b>nueva cuenta</b> con su correo institucional (<b>__email__</b>) haciendo click en <b>__clickText__</b>.",
   "an_email_has_already_been_sent_to": "Ya se ha enviado un correo electrónico a <0>__email__</0>. Espere e inténtelo de nuevo más tarde.",
@@ -181,12 +178,10 @@
   "by_joining_labs": "Al unirte a Labs, aceptas recibir ocasionalmente correos electrónicos y actualizaciones de Overleaf, por ejemplo, para solicitar tu opinión. También acepta nuestras <0>condiciones del servicio</0> y nuestro <1>aviso de privacidad</1>.",
   "by_registering_you_agree_to_our_terms_of_service": "Al registrarse, acepta nuestras <0>condiciones del servicio</0> y <1>notificación de privacidad</1>.",
   "by_subscribing_you_agree_to_our_terms_of_service": "Al suscribirse, acepta nuestras <0>condiciones del servicio</0>.",
-  "can_edit": "Puede editar",
   "can_link_institution_email_acct_to_institution_acct": "Ahora puedes vincular tu cuenta  <b>__appName__</b> <b>__email__</b> a tu cuenta institucional <b>__institutionName__</b>.",
   "can_link_institution_email_by_clicking": "Puedes vincular tu cuenta  <b>__appName__</b> <b>__email__</b> a tu cuenta institucional <b>__institutionName__</b> haciendo click en <b>__clickText__</b>.",
   "can_link_institution_email_to_login": "Puedes vincular tu cuenta  <b>__appName__</b> <b>__email__</b> a tu cuenta institucional <b>__institutionName__</b>, lo cual te permitirá entrar en <b>__appName__</b> a través de tu institución y confirmará de nuevo tu cuenta de correo institucional.",
   "can_now_relink_dropbox": "Ya puedes <0>vincular de nuevo tu cuenta de Dropbox</0>.",
-  "can_view": "Se puede ver",
   "cancel": "Cancelar",
   "cancel_my_account": "Cancelar mi suscripción",
   "cancel_my_subscription": "Cancelar mi suscripción",
@@ -492,7 +487,6 @@
   "publishing": "Publicando",
   "pull_github_changes_into_sharelatex": "Actualiza cambios de GitHub en __appName__",
   "push_sharelatex_changes_to_github": "Envía cambios de __appName__ a GitHub",
-  "read_only": "Solo leer",
   "recent_commits_in_github": "Commits recientes en GitHub",
   "recompile": "Recompilar",
   "reconnecting": "Volviendo a conectar",
@@ -642,6 +636,7 @@
   "upgrade_now": "Sube de categoría ahora",
   "upgrade_to_get_feature": "Sube de categoría para conseguir __feature__, además de:",
   "upload": "Subir",
+  "upload_file": "Subir archivo",
   "upload_project": "Subir proyecto",
   "upload_zipped_project": "Subir proyecto en Zip",
   "user_wants_you_to_see_project": "__username__ quiere que veas __projectname__",
@@ -682,7 +677,6 @@
   "youre_already_setup_for_sso": "Ya está configurado para SSO",
   "youre_on_free_trial_which_ends_on": "Estás en una prueba gratuita que termina en <0>__date__</0>.",
   "youre_signed_up": "Estás inscrito",
-  "youve_lost_edit_access": "Has perdido el acceso de edición",
   "youve_unlinked_all_users": "Has desvinculado a todos los usuarios",
   "zh-CN": "Chino",
   "zoom_in": "Ampliar",
diff --git a/services/web/locales/fi.json b/services/web/locales/fi.json
index ac43ea11c7..15c0c344b0 100644
--- a/services/web/locales/fi.json
+++ b/services/web/locales/fi.json
@@ -26,7 +26,6 @@
   "blank_project": "Tyhjä projekti",
   "blog": "Blogi",
   "built_in": "Sisäänrakennettu",
-  "can_edit": "Voi muokata",
   "cancel": "Peru",
   "cant_find_email": "Tämä sähköposti ei ole rekisteröity, pahoittelut.",
   "cant_find_page": "Anteeksi, emme löydä hakemaasi sivua.",
@@ -234,7 +233,6 @@
   "publishing": "Julkaistaan",
   "pull_github_changes_into_sharelatex": "Tuo __appName__-muutokset GitHubista",
   "push_sharelatex_changes_to_github": "Vie __appName__-muutokset GitHubiin",
-  "read_only": "Read Only",
   "recent_commits_in_github": "Viimeiset muutokset GitHubissa",
   "recompile": "Käännä uudestaan",
   "reconnecting": "Yhdistetään uudelleen",
@@ -331,6 +329,7 @@
   "upgrade": "Päivitä",
   "upgrade_now": "Päivitä Nyt",
   "upload": "Siirrä",
+  "upload_file": "Vie tiedosto",
   "upload_project": "Siirrä projekti palvelimelle",
   "upload_zipped_project": "Vie pakattu projekti",
   "user_wants_you_to_see_project": "__username__ haluaisi katsoa projektiasi __projectname__",
diff --git a/services/web/locales/fr.json b/services/web/locales/fr.json
index 1a1f3787d1..2e80ea2132 100644
--- a/services/web/locales/fr.json
+++ b/services/web/locales/fr.json
@@ -4,7 +4,6 @@
   "3_4_width": "¾ largeur",
   "About": "À propos",
   "Account": "Compte",
-  "Account Settings": "Paramètres du compte",
   "Documentation": "Documentation",
   "Projects": "Projets",
   "Security": "Sécurité",
@@ -33,7 +32,6 @@
   "accept_change": "Accepter les changements",
   "accept_change_error_description": "Une erreur s’est produite lors de l’acceptation d’un suivi de modification. Veuillez réessayer dans quelques instants.",
   "accept_invitation": "Accepter l’invitation",
-  "accept_or_reject_each_changes_individually": "Acceptez ou rejetez chaque modification individuellement",
   "accept_terms_and_conditions": "Accepter les termes et conditions",
   "accepted_invite": "Invitation acceptée",
   "accepting_invite_as": "Vous allez accepter cette invitation en tant que",
@@ -68,7 +66,7 @@
   "add_email_address": "Ajouter une adresse e-mail",
   "add_email_to_claim_features": "Ajouter votre adresse courriel institutionnelle pour obtenir ces fonctionnalités.",
   "add_files": "Ajouter des fichiers",
-  "add_more_editors": "Ajouter plus de collaborateurs",
+  "add_more_collaborators": "Ajouter plus de collaborateur·rice·s",
   "add_more_managers": "Ajouter plus de gestionnaires",
   "add_new_email": "Ajouter l’adresse",
   "add_or_remove_project_from_tag": "Ajouter ou supprimer un projet du l’étiquette __tagName__",
@@ -164,7 +162,6 @@
   "buy_now_no_exclamation_mark": "Acheter maintenant",
   "by": "par",
   "by_subscribing_you_agree_to_our_terms_of_service": "En vous inscrivant, vous acceptez nos <0>conditions d’utilisation</0>.",
-  "can_edit": "Édition autorisée",
   "can_link_institution_email_acct_to_institution_acct": "Vous pouvez maintenant lier votre compte <b>__appName__</b> en <b>__email__</b> à votre compte institutionnel <b>__institutionName__</b>.",
   "can_link_institution_email_by_clicking": "Vous pouvez lier votre compte <b>__appName__</b> <b>__email__</b> à votre compte <b>__institutionName__</b> en cliquant <b>__clickText__</b>.",
   "can_link_institution_email_to_login": "Vous pouvez lier votre compte <b>__appName__</b> <b>__email__</b> à votre compte <b>__institutionName__</b>, ce qui vous permettra de vous connecter à <b>__appName__</b> via le portail de votre établissement.",
@@ -347,7 +344,6 @@
   "disable_stop_on_first_error": "Désactiver “Arrêter à la première erreur”",
   "disconnected": "Déconnecté",
   "discount_of": "Remise de __amount__",
-  "dismiss_error_popup": "Ignorer l’alerte de première erreur",
   "do_not_have_acct_or_do_not_want_to_link": "Si vous n’avez pas de compte <b>__appName__</b> ou si vous ne souhaitez pas le lier à votre compte <b>__institutionName__</b>, veuillez cliquer <b>__clickText__</b>.",
   "do_not_link_accounts": "Ne pas lier les comptes",
   "do_you_want_to_change_your_primary_email_address_to": "Voulez-vous définir <b>__email__</b> comme votre adresse email principale ?",
@@ -426,7 +422,6 @@
   "empty_zip_file": "L’archive ne contient aucun fichier",
   "en": "Anglais",
   "end_of_document": "Fin du document",
-  "enter_6_digit_code": "Saisissez le code à 6 chiffres",
   "enter_image_url": "Entrez l’URL de l’image",
   "enter_your_email_address": "Entrez votre adresse email",
   "enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password": "Entrez votre adresse email ci-dessous, et nous vous enverrons un lien pour réinitialiser votre mot de passe",
@@ -813,7 +808,6 @@
   "opted_out_linking": "Vous avez choisi de ne pas lier votre compte <b>__appName__</b> <b>__email__</b> à votre compte institutionnel.",
   "optional": "Optionnel",
   "or": "ou",
-  "organize_projects": "Organiser les projets",
   "organize_tags": "Organiser les étiquettes",
   "other_actions": "Autres actions",
   "other_logs_and_files": "Autres journaux et fichiers",
@@ -906,7 +900,6 @@
   "push_sharelatex_changes_to_github": "Pousser les modifications __appName__ vers GitHub",
   "raw_logs": "Journaux bruts",
   "raw_logs_description": "Journaux bruts issus du compilateur LaTeX",
-  "read_only": "Lecture seule",
   "realtime_track_changes": "Suivi des modifications en temps réel",
   "reauthorize_github_account": "Autorisez votre compte GitHub à nouveau",
   "recent_commits_in_github": "Commits récents dans GitHub",
@@ -962,7 +955,6 @@
   "required": "requis",
   "resend": "Envoyer de nouveau",
   "resend_confirmation_email": "Réexpédier le courriel de confirmation",
-  "resending_confirmation_email": "Réexpédition du courriel de confirmation",
   "reset_password": "Réinitialiser le mot de passe",
   "reset_your_password": "Réinitialiser votre mot de passe",
   "resolve": "Résoudre",
@@ -974,7 +966,6 @@
   "return_to_login_page": "Retourner à la page de connexion",
   "revert_pending_plan_change": "Annuler la modification prévue d’offre",
   "review": "Relire",
-  "review_your_peers_work": "Relisez le travail de vos pairs",
   "revoke": "Révoquer",
   "revoke_invite": "Retirer l’invitation",
   "ro": "Roumain",
@@ -999,7 +990,6 @@
   "search_references": "Rechercher les fichiers .bib dans ce projet",
   "secondary_email_password_reset": "Cette adresse courriel est une adresse secondaire. Veuillez saisir l’adresse principale associée à votre compte.",
   "security": "Sécurité",
-  "see_changes_in_your_documents_live": "Observez les modifications dans vos documents, en direct",
   "select_a_file": "Choisir un fichier",
   "select_a_project": "Choisir un projet",
   "select_all_projects": "Tout sélectionner",
@@ -1085,8 +1075,6 @@
   "tag_name_is_already_used": "L’étiquette \"__tagName__\" existe déjà",
   "tags": "Étiquettes",
   "take_me_home": "Retour à la maison !",
-  "tc_everyone": "Tout le monde",
-  "tc_guests": "Invités",
   "template_description": "Description des modèles",
   "template_gallery": "Galerie de modèles",
   "template_not_found_description": "Cette méthode de création de projets à partir de modèles n’est plus disponible. Merci de vous rendre sur notre galerie des modèles pour trouver d’autres modèles.",
@@ -1143,10 +1131,7 @@
   "tooltip_show_pdf": "Cliquez pour afficher le PDF",
   "total_words": "Total des mots",
   "tr": "Turque",
-  "track_any_change_in_real_time": "Suivez toute modification, en temps réel",
   "track_changes": "Suivre les modifications",
-  "track_changes_is_off": "Le suivi des modifs. est <strong>off</strong>",
-  "track_changes_is_on": "Le suivi des modifs. est <strong>on</strong>",
   "tracked_change_added": "Ajout de",
   "tracked_change_deleted": "Suppression de",
   "trash": "Corbeille",
@@ -1191,9 +1176,9 @@
   "upgrade_cc_btn": "Mettez à niveau maintenant, payez dans 7 jours",
   "upgrade_now": "Mettre à niveau maintenant",
   "upgrade_to_get_feature": "Mettre à niveau pour profiter de  __feature__, plus :",
-  "upgrade_to_track_changes": "Mettez à niveau pour suivre les modifications",
   "upload": "Importer",
   "upload_failed": "Échec du téléversement",
+  "upload_file": "Importer un fichier",
   "upload_project": "Importer un projet",
   "upload_zipped_project": "Importer un projet zippé",
   "url_to_fetch_the_file_from": "Récupérer le fichier depuis l’URL",
@@ -1259,7 +1244,6 @@
   "youre_on_free_trial_which_ends_on": "Vous bénéficiez d’un essai gratuit qui se termine le <0>__date__</0>.",
   "youre_signed_in_as_logout": "Vous êtes connecté·e avec <0>__email__</0>. <1>Déconnectez-vous.</1>",
   "youre_signed_up": "Vous êtes inscrit·e",
-  "youve_lost_edit_access": "Vous avez perdu l’accès à la modification",
   "zh-CN": "Chinois",
   "zip_contents_too_large": "Contenu de l’archive trop volumineux",
   "zoom_in": "Zoomer",
diff --git a/services/web/locales/it.json b/services/web/locales/it.json
index ae10109eab..d8e0a1fa62 100644
--- a/services/web/locales/it.json
+++ b/services/web/locales/it.json
@@ -1,7 +1,6 @@
 {
   "About": "About",
   "Account": "Account",
-  "Account Settings": "Impostazioni Account",
   "Documentation": "Documentazione",
   "Projects": "Progetti",
   "Security": "Sicurezza",
@@ -36,7 +35,6 @@
   "blank_project": "Progetto Vuoto",
   "blog": "Blog",
   "built_in": "Built-In",
-  "can_edit": "Può Modificare",
   "cancel": "Annulla",
   "cancel_my_account": "Interrrompi il mio abbonamento",
   "cancel_your_subscription": "Interrrompi il tuo abbonamento",
@@ -262,7 +260,6 @@
   "publishing": "Pubblicazione",
   "pull_github_changes_into_sharelatex": "Aggiorna da modifiche in GitHub verso __appName__",
   "push_sharelatex_changes_to_github": "Invia le modifiche __appName__ a GitHub",
-  "read_only": "Sola Lettura",
   "recent_commits_in_github": "Commit recenti in GitHub",
   "recompile": "Ricompila",
   "reconnecting": "Riconnessione",
@@ -368,6 +365,7 @@
   "upgrade_now": "Effettua l’Upgrade",
   "upgrade_to_get_feature": "Esegui l’upgrade per avere __feature__, oltre a:",
   "upload": "Carica",
+  "upload_file": "Carica File",
   "upload_project": "Carica Progetto",
   "upload_zipped_project": "Carica Progetto Zip",
   "user_wants_you_to_see_project": "__username__ vorrebbe che tu vedessi __projectname__",
diff --git a/services/web/locales/ja.json b/services/web/locales/ja.json
index d8282b9087..b96b4f5b75 100644
--- a/services/web/locales/ja.json
+++ b/services/web/locales/ja.json
@@ -1,7 +1,6 @@
 {
   "About": "概要",
   "Account": "アカウント",
-  "Account Settings": "アカウントの設定",
   "Documentation": "ドキュメンテーション",
   "Projects": "プロジェクト",
   "Security": "セキュリティ",
@@ -49,7 +48,6 @@
   "blank_project": "空のプロジェクト",
   "blog": "ブログ",
   "built_in": "組み込み",
-  "can_edit": "編集可能",
   "cancel": "取消",
   "cancel_my_account": "購読をキャンセル",
   "cancel_personal_subscription_first": "個人購読をすでに申し込んでいます。これをキャンセルしてグループライセンスに参加しますか？",
@@ -339,7 +337,6 @@
   "publishing": "公開中",
   "pull_github_changes_into_sharelatex": "GitHubの変更を __appName__ に引き込む",
   "push_sharelatex_changes_to_github": "__appName__ の変更をGitHubに押し込む",
-  "read_only": "読み込み専用",
   "recent_commits_in_github": "GitHubの最新コミット",
   "recompile": "リコンパイル",
   "recompile_pdf": "PDFを再コンパイル",
@@ -471,6 +468,7 @@
   "upgrade_now": "今すぐアップグレード",
   "upgrade_to_get_feature": "__feature__のアップグレードを取得、プラス：",
   "upload": "アップロード",
+  "upload_file": "ファイルのアップロード",
   "upload_project": "プロジェクトのアップロード",
   "upload_zipped_project": "ZIPプロジェクトのアップロード",
   "user_wants_you_to_see_project": "__username__ が __projectname__ への参加を求めています。",
diff --git a/services/web/locales/ko.json b/services/web/locales/ko.json
index db9b4718ac..d3fdd36242 100644
--- a/services/web/locales/ko.json
+++ b/services/web/locales/ko.json
@@ -1,7 +1,6 @@
 {
   "About": "소개",
   "Account": "계정",
-  "Account Settings": "계정 설정",
   "Documentation": "참고 문서",
   "Projects": "프로젝트",
   "Security": "보안",
@@ -12,7 +11,6 @@
   "about_to_delete_projects": "다음과 같은 프로젝트를 삭제하려 합니다:",
   "about_to_leave_projects": "다음과 같은 프로젝트를 나가려고합니다:",
   "accept": "승락",
-  "accept_or_reject_each_changes_individually": "각각의 변경 사항 승락 또는 거절",
   "accepting_invite_as": "다음 이메일로 온 초대를 승락합니다.",
   "account": "계정",
   "account_not_linked_to_dropbox": "계정이 Dropbox에 연결되지 않았습니다",
@@ -63,7 +61,6 @@
   "blank_project": "빈 프로젝트",
   "blog": "블로그",
   "built_in": "빌트인",
-  "can_edit": "편집가능",
   "cancel": "취소",
   "cancel_my_account": "구독 취소하기",
   "cancel_personal_subscription_first": "이미 개인 구독을 하고 있습니다. 그룹 라이센스를 사용하기 전에 개인 구독을 취소하시겠습니까?",
@@ -381,7 +378,6 @@
   "publishing": "공개중",
   "pull_github_changes_into_sharelatex": "GitHub 변경사항들을 __appName__로 당겨주세요",
   "push_sharelatex_changes_to_github": "__appName__ 변경사항을 GitHub으로 밀어주세요",
-  "read_only": "읽기만 허용",
   "realtime_track_changes": "실시간 변경 내용 추적",
   "reauthorize_github_account": "GitHub 계정 재확인",
   "recent_commits_in_github": "GitHub의 최근 커밋",
@@ -423,7 +419,6 @@
   "restricted_no_permission": "이 페이지를 불러올 권한이 없습니다.",
   "return_to_login_page": "로그인 페이지로 이동",
   "review": "검토",
-  "review_your_peers_work": "동료의 작업 검토",
   "revoke_invite": "초대 취소",
   "ro": "로마니아어",
   "role": "역할",
@@ -436,7 +431,6 @@
   "search_projects": "프로젝트 검색",
   "search_references": "이 프로젝트에서 .bib 파일 검색",
   "security": "보안",
-  "see_changes_in_your_documents_live": "문서 변경사항 실시간으로 보기",
   "select_all_projects": "전체 선택",
   "select_github_repository": "__appName__에 불러올 GitHub 저장소를 선택합니다.",
   "send": "발신",
@@ -485,8 +479,6 @@
   "sync_to_github": "GitHub 동기화",
   "syntax_validation": "코드 확인",
   "take_me_home": "홈으로!",
-  "tc_everyone": "모든 사람",
-  "tc_guests": "게스트",
   "template_description": "템플릿 설명",
   "templates": "템플릿",
   "terminated": "컴파일 취소됨",
@@ -515,10 +507,7 @@
   "tooltip_show_pdf": "PDF를 보려면 클릭",
   "total_words": "총 단어 수",
   "tr": "Türkçe",
-  "track_any_change_in_real_time": "실시간으로 모든 변경 사항 추적",
   "track_changes": "변경 내용 추적",
-  "track_changes_is_off": "변경 내용 추적 <strong>꺼짐</strong>",
-  "track_changes_is_on": "변경 내용 추적 <strong>사용</strong>",
   "tracked_change_added": "추가됨",
   "tracked_change_deleted": "삭제됨",
   "try_it_for_free": "무료로 사용해보세요",
@@ -549,8 +538,8 @@
   "upgrade_cc_btn": "지금 업그레이드하고 7일 후 지불",
   "upgrade_now": "지금 업그레이드",
   "upgrade_to_get_feature": "__feature__와 다음 기능 사용을 위해 업그레이드:",
-  "upgrade_to_track_changes": "변경 내용 추적을 위해 업그레이드",
   "upload": "업로드",
+  "upload_file": "파일 업로드",
   "upload_project": "프로젝트 업로드",
   "upload_zipped_project": "압축된 프로젝트 업로드",
   "user_wants_you_to_see_project": "__username__ 님이  __projectname__에 참여하길 원합니다",
diff --git a/services/web/locales/nl.json b/services/web/locales/nl.json
index 67f549dfb1..f3a60aa417 100644
--- a/services/web/locales/nl.json
+++ b/services/web/locales/nl.json
@@ -1,7 +1,6 @@
 {
   "About": "Over",
   "Account": "Account",
-  "Account Settings": "Accountinstellingen",
   "Documentation": "Documentatie",
   "Projects": "Projecten",
   "Security": "Beveiliging",
@@ -14,7 +13,6 @@
   "about_to_leave_projects": "Je staat op het punt de volgende projecten te verlaten:",
   "accept": "Accepteer",
   "accept_invitation": "Accepteer de uitnodiging",
-  "accept_or_reject_each_changes_individually": "Accepteer of verwerp iedere wijziging individueel",
   "accepted_invite": "Uitnodiging geaccepteerd",
   "accepting_invite_as": "U accepteert deze uitnodiging als",
   "account": "Account",
@@ -65,7 +63,6 @@
   "blank_project": "Blanco Project",
   "blog": "Blog",
   "built_in": "Ingebouwd",
-  "can_edit": "Kan Bewerken",
   "cancel": "Annuleren",
   "cancel_my_account": "Annuleer mijn abonnement",
   "cancel_personal_subscription_first": "U heeft al een persoonlijke inschrijving, wilt u dat wij deze annuleren voordat u deel neemt aan de groepslicentie?",
@@ -389,7 +386,6 @@
   "publishing": "Aan het publiceren",
   "pull_github_changes_into_sharelatex": "Wijzigingen op GitHub naar __appName__ halen",
   "push_sharelatex_changes_to_github": "Wijzigingen op __appName__ naar GitHub verplaatsen",
-  "read_only": "Alleen Lezen",
   "recent_commits_in_github": "Recente toevoegingen in GitHub",
   "recompile": "Hercompileren",
   "recompile_pdf": "Hercompileer de PDF",
@@ -430,7 +426,6 @@
   "restricted_no_permission": "Beperkt, sorry. Je hebt geen toegang tot deze pagina.",
   "return_to_login_page": "Keer terug naar inlogpagina",
   "review": "Review",
-  "review_your_peers_work": "Review werk van uw collega’s",
   "revoke_invite": "Herroep uitnodiging",
   "ro": "Roemeens",
   "role": "Functie",
@@ -446,7 +441,6 @@
   "search_projects": "Projecten zoeken",
   "search_references": "Doorzoek het .bib bestand in dit project",
   "security": "Veiligheid",
-  "see_changes_in_your_documents_live": "Zie verandering in uw documenten, live",
   "select_github_repository": "Selecteer een GitHub repository om naar __appName__ te importeren.",
   "send": "Verstuur",
   "send_first_message": "Verzend je eerste bericht",
@@ -519,9 +513,6 @@
   "too_recently_compiled": "Dit project is recentelijk nog gecompileerd, daarom is het nu overgeslagen.",
   "total_words": "Aantal woorden",
   "tr": "Turks",
-  "track_any_change_in_real_time": "Hou alle veranderingen bij, in realtime",
-  "track_changes_is_off": "Wijzigingen bijhouden staat <strong>uit</strong>",
-  "track_changes_is_on": "Wijzigingen bijhouden staat <strong>aan</strong>",
   "tracked_change_added": "Toegevoegd",
   "tracked_change_deleted": "Verwijderd",
   "try_it_for_free": "Probeer het gratis",
@@ -549,8 +540,8 @@
   "upgrade_cc_btn": "Upgrade nu, betaal na 7 dagen",
   "upgrade_now": "Upgrade Nu",
   "upgrade_to_get_feature": "Upgrade om __feature__ te krijgen, plus:",
-  "upgrade_to_track_changes": "Upgrade naar Wijzigingen Bijhouden",
   "upload": "Uploaden",
+  "upload_file": "Bestand Uploaden",
   "upload_project": "Project Uploaden",
   "upload_zipped_project": "Gezipt Project Uploaden",
   "user_wants_you_to_see_project": "__username__ wil dat u deelneemt aan __projectname__",
diff --git a/services/web/locales/no.json b/services/web/locales/no.json
index 7b0c5b3a36..73e98199ad 100644
--- a/services/web/locales/no.json
+++ b/services/web/locales/no.json
@@ -1,7 +1,6 @@
 {
   "About": "Om",
   "Account": "Konto",
-  "Account Settings": "Kontoinnstillinger",
   "Documentation": "Dokumentasjon",
   "Projects": "Prosjekter",
   "Security": "Sikkerhet",
@@ -38,7 +37,6 @@
   "blank_project": "Tomt prosjekt",
   "blog": "Blogg",
   "built_in": "Innebygget",
-  "can_edit": "Kan redigere",
   "cancel": "Avbryt",
   "cancel_personal_subscription_first": "Du har allerede et personlig abonnement, vil du at vi skal kansellere det før du blir medlem av gruppelisensen?",
   "cant_find_email": "Epostadressen er ikke registrert, beklager.",
@@ -270,7 +268,6 @@
   "publishing": "Publiserer",
   "pull_github_changes_into_sharelatex": "Pull forandringer i GitHub til __appName__",
   "push_sharelatex_changes_to_github": "Push forandringer i __appName__ til GitHub",
-  "read_only": "Skrivebeskyttet",
   "recent_commits_in_github": "Nylige commits i GitHub",
   "recompile": "Rekompiler",
   "reconnecting": "Kobler til",
@@ -379,6 +376,7 @@
   "upgrade_now": "Oppgrader Nå",
   "upgrade_to_get_feature": "Oppgrader for å få __feature__, pluss:",
   "upload": "Last opp",
+  "upload_file": "Last opp fil",
   "upload_project": "Last opp prosjekt",
   "upload_zipped_project": "Last opp zippet prosjekt",
   "user_wants_you_to_see_project": "__username__ ønsker at du skal se __projectname__",
diff --git a/services/web/locales/pl.json b/services/web/locales/pl.json
index 3a81ec66ee..3f4b70c4ef 100644
--- a/services/web/locales/pl.json
+++ b/services/web/locales/pl.json
@@ -17,7 +17,6 @@
   "blank_project": "Pusty projekt",
   "blog": "Blog",
   "built_in": "Wbudowana",
-  "can_edit": "Może edytować",
   "cancel": "Anuluj",
   "cant_find_email": "Przykro nam, ale ten adres email nie jest zarejestrowany.",
   "cant_find_page": "Przykro nam, ale nie możemy znaleźć strony której szukasz.",
@@ -152,7 +151,6 @@
   "public": "Publiczny",
   "publish": "Publikuj",
   "publish_as_template": "Publikuj jako szablon",
-  "read_only": "tylko odczyt",
   "recompile": "Przekompiluj",
   "reconnecting": "Ponowne łączenie",
   "reconnecting_in_x_secs": "Próba połączenia za __seconds__ s",
@@ -218,6 +216,7 @@
   "update_account_info": "Zaktualizuj informacje o koncie",
   "update_dropbox_settings": "Zaktualizuj ustawienia Dropbox",
   "upload": "Wyślij plik",
+  "upload_file": "Wyślij plik",
   "upload_project": "Wyślij projekt",
   "upload_zipped_project": "Wyślij projekt w pliku ZIP",
   "user_wants_you_to_see_project": "__username__ chce, żebyś zobaczył __projectname__",
diff --git a/services/web/locales/pt.json b/services/web/locales/pt.json
index cd2a5f078a..0b31a1668f 100644
--- a/services/web/locales/pt.json
+++ b/services/web/locales/pt.json
@@ -1,7 +1,6 @@
 {
   "About": "Sobre",
   "Account": "Conta",
-  "Account Settings": "Configurações da Conta",
   "Documentation": "Documentação",
   "Projects": "Projetos",
   "Security": "Segurança",
@@ -14,7 +13,6 @@
   "about_to_leave_projects": "Você está prestes à deixar de seguir os projetos:",
   "accept": "Aceitar",
   "accept_invitation": "Aceitar convite",
-  "accept_or_reject_each_changes_individually": "Aceitar ou rejeitar cada alteração individualmente",
   "accepted_invite": "Convite aceito",
   "accepting_invite_as": "Você está aceitando esse convite como",
   "account": "Conta",
@@ -77,7 +75,6 @@
   "brl_discount_offer_plans_page_banner": "__flag__ Aplicamos um desconto de 50% aos planos premium nesta página para nossos usuários no Brasil. Confira os novos preços mais baixos.",
   "built_in": "Embutido",
   "by": "por",
-  "can_edit": "Pode Editar",
   "cancel": "Cancelar",
   "cancel_my_account": "Cancelar minha inscrição",
   "cancel_personal_subscription_first": "Você já tem uma inscrição pessoal, você gostaria que cancelássemos a primeira antes de se juntar à licença de grupo?",
@@ -464,7 +461,6 @@
   "publishing": "Publicando",
   "pull_github_changes_into_sharelatex": "Puxar mudanças do GitHub no __appName__",
   "push_sharelatex_changes_to_github": "Empurrar mudanças do __appName__ no GitHub",
-  "read_only": "Somente Ler",
   "realtime_track_changes": "Acompanhe alterações em tempo real.",
   "reauthorize_github_account": "Reautorize sua conta GitHub",
   "recent_commits_in_github": "Commits recentes no GitHub",
@@ -501,7 +497,6 @@
   "required": "Obrigatório",
   "resend": "Reenviar",
   "resend_confirmation_email": "Reenviar e-mail de confirmação",
-  "resending_confirmation_email": "Reenviando email de confirmação",
   "reset_password": "Trocar Senha",
   "reset_your_password": "Redefinir sua senha",
   "resolve": "Resolver",
@@ -512,7 +507,6 @@
   "restricted_no_permission": "Restrito, desculpe você não tem permissão para carregar essa página.",
   "return_to_login_page": "Retornar à página de Login",
   "review": "Revisar",
-  "review_your_peers_work": "Revisar o trabalho de seus colegas",
   "revoke_invite": "Revogar Convite",
   "ro": "Romeno",
   "role": "Papel",
@@ -528,7 +522,6 @@
   "search_projects": "Buscar projetos",
   "search_references": "Buscar os arquivos .bib no projeto",
   "security": "Segurança",
-  "see_changes_in_your_documents_live": "Ver alterações nos seus documentos, ao vivo",
   "select_all_projects": "Selecionar todos",
   "select_github_repository": "Selecione um repositório no GitHub para importar para o __appName__.",
   "send": "Enviar",
@@ -581,8 +574,6 @@
   "sync_to_github": "Sincronizar com GitHub",
   "syntax_validation": "Checar código",
   "take_me_home": "Ir para o início!",
-  "tc_everyone": "Todos",
-  "tc_guests": "Convidados",
   "template_description": "Descrição do Modelo",
   "templates": "Modelos",
   "terminated": "Compilação cancelada",
@@ -617,10 +608,7 @@
   "tooltip_show_pdf": "Clique para mostrar o PDF",
   "total_words": "Total de Palavras",
   "tr": "Turco",
-  "track_any_change_in_real_time": "Acompanhar qualquer alteração, em tempo real",
   "track_changes": "Acompanhe as mudanças",
-  "track_changes_is_off": "Controle de alterações está <strong>desligado</strong>",
-  "track_changes_is_on": "Controle de alterações está ligado",
   "tracked_change_added": "Adicionado",
   "tracked_change_deleted": "Deletado",
   "try_again": "Por favor, tente novamente",
@@ -654,8 +642,8 @@
   "upgrade_cc_btn": "Aprimorar agora, pague depois de 7 dias",
   "upgrade_now": "Aprimorar Agora",
   "upgrade_to_get_feature": "Aprimore para ter __feature__, mais:",
-  "upgrade_to_track_changes": "Atualizar para acompanhar alterações",
   "upload": "Carregar",
+  "upload_file": "Atualizar Arquivo",
   "upload_project": "Carregar Projeto",
   "upload_zipped_project": "Subir Projeto Zipado",
   "user_already_added": "Usuário já foi adicionado",
diff --git a/services/web/locales/ru.json b/services/web/locales/ru.json
index 10f83e52e1..a416624fbe 100644
--- a/services/web/locales/ru.json
+++ b/services/web/locales/ru.json
@@ -1,22 +1,28 @@
 {
   "12x_basic": "12х базовый",
+  "12x_more_compile_time": "В 12 раз больше времени компиляции на наших быстрейших серверах",
   "1_2_width": "½ ширины",
   "1_4_width": "¼ ширины",
+  "24x_basic": "24х базовый",
+  "24x_more_compile_time": "В 24 раз больше времени компиляции на наших быстрейших серверах",
   "3_4_width": "¾ ширины",
   "About": "О сайте",
   "Account": "Аккаунт",
-  "Account Settings": "Настройки аккаунта",
   "Documentation": "Документация",
   "Projects": "Проекты",
   "Security": "Безопасность",
   "Subscription": "Подписка",
   "Terms": "Условия",
   "Universities": "Университеты",
+  "a_custom_size_has_been_used_in_the_latex_code": "Пользовательский размер был использован в коде LaTeX.",
+  "a_fatal_compile_error_that_completely_blocks_compilation": "<0>Фатальная ошибка компиляции</0> полностью заблокировала компиляцию.",
   "a_file_with_that_name_already_exists_and_will_be_overriden": "Файл с таким именем уже существует. Этот файл будет перезаписан.",
-  "about": "О проекте",
+  "a_more_comprehensive_list_of_keyboard_shortcuts": "Более полный лист горячих клавиш находится в <0>этом шаблоне проекта __appName__</0>",
+  "about": "О",
   "about_to_archive_projects": "Вы собираетесь архивировать следующие проекты:",
   "about_to_delete_cert": "Вы собираетесь удалить следующий сертификат:",
   "about_to_delete_projects": "Следующие проекты будут удалены:",
+  "about_to_delete_template": "Следующий шаблон будет удален:",
   "about_to_delete_the_following_project": "Вы собираетесь удалить следующий проект:",
   "about_to_delete_the_following_projects": "Вы собираетесь удалить следующие проекты:",
   "about_to_leave_project": "Вы собираетесь покинуть этот проект:",
@@ -60,13 +66,13 @@
   "blank_project": "Новый проект",
   "blog": "Блог",
   "built_in": "встроенный",
-  "can_edit": "Могут править",
   "cancel": "Отмена",
   "cancel_my_account": "Отменить подписку",
   "cancel_personal_subscription_first": "У Вас уже имеется личная подписка. Хотите ли вы её отменить перед переходом на групповую лицензию?",
   "cancel_your_subscription": "Остановить подписку",
   "cant_find_email": "Извините, данный адрес не зарегистрирован.",
   "cant_find_page": "К сожалению, страница не найдена",
+  "category": "Категория",
   "change": "Изменить",
   "change_password": "Изменение пароля",
   "change_plan": "Сменить тарифный план",
@@ -125,9 +131,11 @@
   "delete_account_warning_message_3": "Вы собираетесь <strong>удалить все данные Вашего аккаунта</strong>, включая все Ваши проекты и настройки. Пожалуйста, введите адрес электронной почты и пароль Вашего аккаунта в форму внизу для продолжения.",
   "delete_and_leave_projects": "Удалить или оставить проекты",
   "delete_projects": "Удалить проекты",
+  "delete_template": "Удалить шаблон",
   "delete_your_account": "Удалить аккаунт",
   "deleting": "Удаление",
   "disconnected": "Разъединен",
+  "do_you_want_to_overwrite_it": "Перезаписать?",
   "documentation": "Документация",
   "doesnt_match": "Не совпадает",
   "done": "Готово",
@@ -136,6 +144,7 @@
   "download_zip_file": "Скачать архив (.zip)",
   "dropbox_sync": "Синхронизация с Dropbox",
   "dropbox_sync_description": "Синхронизируйте Ваши __appName__ проекты с Вашим Dropbox. Изменения в __appName__ автоматически сохраняются в Вашем Dropbox, и наоборот.",
+  "edit_template": "Редактировать шаблон",
   "editing": "Редактор",
   "email": "Адрес электронной почты",
   "email_already_registered": "Этот адрес уже зарегистрирован.",
@@ -147,6 +156,7 @@
   "example_project": "Использовать пример",
   "expiry": "Срок действия",
   "export_project_to_github": "Экспорт проекта на GitHub",
+  "failed_to_publish_as_a_template": "Не удалось создать шаблон.",
   "fast": "быстрый",
   "features": "Возможности",
   "february": "Февраль",
@@ -270,6 +280,7 @@
   "no_projects": "Нет проектов",
   "no_search_results": "Ничего не найдено",
   "no_thanks_cancel_now": "Нет, спасибо - я хочу удалить сейчас",
+  "no_templates_found": "Шаблоны не найдены.",
   "normal": "нормальный",
   "not_now": "Не сейчас",
   "notification_project_invite": "<b>__userName__</b> приглашает Вас принять участие в проекте __projectName__,<a class=\"ben btn-xs btn-info\" href=\"’/project/__projectId__/invite/token/__token__’\">Присоединиться</a>",
@@ -298,7 +309,8 @@
   "plans_amper_pricing": "Тарифы",
   "plans_and_pricing": "Тарифные планы",
   "please_compile_pdf_before_download": "Пожалуйста, скомпилируйте проект перед загрузкой PDF",
-  "please_compile_pdf_before_word_count": "Пожалуйста, скомпилируйте проект, прежде чем подсчитывать количество слов!",
+  "please_compile_pdf_before_publish_as_template": "Пожалуйста, скомпилируйте проект, прежде чем создавать из него шаблон",
+  "please_compile_pdf_before_word_count": "Пожалуйста, скомпилируйте проект, прежде чем подсчитывать количество слов.",
   "please_enter_email": "Пожалуйста, введите адрес электронной почты",
   "please_refresh": "Пожалуйста, обновите страницу для продолжения",
   "please_set_a_password": "Пожалуйста, укажите пароль",
@@ -327,7 +339,6 @@
   "publishing": "Публикация",
   "pull_github_changes_into_sharelatex": "Скачать изменения с GitHub в __appName__",
   "push_sharelatex_changes_to_github": "Загрузить изменения из __appName__ на GitHub",
-  "read_only": "Только чтение",
   "recent_commits_in_github": "Последние коммиты на GitHub",
   "recompile": "Компилировать",
   "recompile_pdf": "Перекомпилировать PDF",
@@ -408,6 +419,7 @@
   "syntax_validation": "Проверка кода",
   "take_me_home": "Вернуться в начало",
   "template_description": "Описание шаблона",
+  "template_with_this_title_exists_and_owned_by_x": "Уже есть шаблон с таким названием, его владелец __x__.",
   "templates": "Шаблоны",
   "terminated": "Компиляция отменена",
   "terms": "Условия",
@@ -432,8 +444,10 @@
   "total_words": "Количество слов",
   "tr": "Турецкий",
   "try_now": "Попробуйте",
+  "try_recompile_project": "Попробуйте скомпилировать проект заново.",
   "uk": "Украинский",
   "university": "Университет",
+  "unknown": "Неизвестный",
   "unlimited_collabs": "Неограниченно число соавторов",
   "unlimited_projects": "Неограниченное число проектов",
   "unlink": "Отсоединить",
@@ -451,6 +465,7 @@
   "upgrade": "Сменить тариф",
   "upgrade_now": "Сменить тариф",
   "upload": "Загрузить",
+  "upload_file": "Загрузить файл",
   "upload_project": "Загрузить проект",
   "upload_zipped_project": "Загрузить архив проекта (*.zip)",
   "user_wants_you_to_see_project": "__username__ приглашает вас к просмотру проекта __projectname__",
@@ -460,6 +475,8 @@
   "welcome_to_sl": "Добро пожаловать в __appName__",
   "word_count": "Количество слов",
   "year": "год",
+  "you": "Вы",
+  "you_cant_overwrite_it": "Перезаписать нельзя.",
   "you_have_added_x_of_group_size_y": "Вы добавили <0>__addedUsersSize__</0> из <1>__groupSize__</1> доступных участников",
   "your_plan": "Ваш тариф",
   "your_projects": "Созданные мной",
diff --git a/services/web/locales/sv.json b/services/web/locales/sv.json
index a3cc87f417..ab9f615050 100644
--- a/services/web/locales/sv.json
+++ b/services/web/locales/sv.json
@@ -1,7 +1,6 @@
 {
   "About": "Om",
   "Account": "Konto",
-  "Account Settings": "Kontoinställningar",
   "Documentation": "Dokumentation",
   "Projects": "Projekt",
   "Security": "Säkerhet",
@@ -16,7 +15,6 @@
   "abstract": "Sammanfattning",
   "accept": "Acceptera",
   "accept_invitation": "Acceptera inbjudan",
-  "accept_or_reject_each_changes_individually": "Acceptera eller neka varje förändring för sig",
   "accepted_invite": "Accepterat inbjudan",
   "accepting_invite_as": "Du accepterar inbjudan som",
   "account": "Konto",
@@ -96,7 +94,6 @@
   "blog": "Blogg",
   "built_in": "Inbyggd",
   "by": "av",
-  "can_edit": "Kan redigera",
   "can_link_institution_email_acct_to_institution_acct": "Du kan nu länka ditt <b>__email__</b> <b>__appName__</b>-konto till ditt <b>__institutionName__</b> institutionella konto.",
   "cancel": "Avbryt",
   "cancel_my_account": "Avsluta min prenumeration",
@@ -211,7 +208,6 @@
   "dictionary": "Ordbok",
   "disable_stop_on_first_error": "Inaktivera \"Stopp vid första fel\"",
   "disconnected": "Frånkopplad",
-  "dismiss_error_popup": "Avfärda varning om första fel",
   "do_not_have_acct_or_do_not_want_to_link": "Om du inte har ett <b>__appName__</b>-konto, eller om du inte vill länka till ditt <b>__institutionName__</b>-konto, vänligen klicka på <b>__clickText__</b>.",
   "do_not_link_accounts": "Länka ej konton",
   "documentation": "Dokumentation",
@@ -658,7 +654,6 @@
   "push_sharelatex_changes_to_github": "Tryck __appName__ ändringar till GitHub",
   "raw_logs": "Ursprungliga loggar",
   "raw_logs_description": "Ursprungliga loggar från LaTeX-kompilatorn",
-  "read_only": "Endast läs",
   "realtime_track_changes": "Realtidsspåra ändringar",
   "reauthorize_github_account": "Återauktorisera ditt GitHub konto",
   "recent_commits_in_github": "Senaste commits på GitHub",
@@ -707,7 +702,6 @@
   "required": "Obligatorisk",
   "resend": "Skicka igen",
   "resend_confirmation_email": "Skicka om e-postbekräftelse",
-  "resending_confirmation_email": "Skickar e-postmeddelande med bekräftelse igen",
   "reset_password": "Återställ lösenord",
   "reset_your_password": "Återställ ditt lösenord",
   "resolve": "Lös",
@@ -719,7 +713,6 @@
   "return_to_login_page": "Tillbaka till inloggningssidan",
   "reverse_x_sort_order": "Omvänd __x__-sortering",
   "review": "Granska",
-  "review_your_peers_work": "Granska dina medarbetares bidrag",
   "revoke": "Återkalla",
   "revoke_invite": "Återkalla inbjudan",
   "ro": "Rumänska",
@@ -738,7 +731,6 @@
   "search_references": "Sök i .bib filerna för det här projektet",
   "secondary_email_password_reset": "Denna e-postadress är registrerad som sekundär e-postadress. Vänligen ange primär e-postadress för ditt konto.",
   "security": "Säkerhet",
-  "see_changes_in_your_documents_live": "Se ändringar i dina dokument, i realtid",
   "select_a_project": "Välj ett projekt",
   "select_all_projects": "Välj alla",
   "select_an_output_file": "Välj en utdatafil",
@@ -814,8 +806,6 @@
   "tag_name_cannot_exceed_characters": "Taggnamnet får inte överstiga __maxLength__ tecken.",
   "take_me_home": "Ta mig härifrån!",
   "take_short_survey": "Gör en kort enkät",
-  "tc_everyone": "Alla",
-  "tc_guests": "Gäster",
   "template_approved_by_publisher": "Denna mall har godkänts av utgivaren",
   "template_description": "Mallbeskrivning",
   "template_gallery": "Mallgalleri",
@@ -871,10 +861,7 @@
   "total_per_year": "Totalt per år",
   "total_words": "Totalt antal ord",
   "tr": "Turkiska",
-  "track_any_change_in_real_time": "Spåra alla ändringar, i realtid",
   "track_changes": "Spåra ändringar",
-  "track_changes_is_off": "Spåra ändringar är <strong>av</strong>",
-  "track_changes_is_on": "Spåra ändringar är <strong>på</strong>",
   "tracked_change_added": "Tillagd",
   "tracked_change_deleted": "Raderad",
   "trash": "Papperskorg",
@@ -916,9 +903,9 @@
   "upgrade_cc_btn": "Uppgradera nu, betala efter 7 dagar",
   "upgrade_now": "Uppgradera Nu",
   "upgrade_to_get_feature": "Uppgradera för att få __feature__, plus:",
-  "upgrade_to_track_changes": "Uppgradera för att spåra ändringar",
   "upload": "Ladda upp",
   "upload_failed": "Uppladdning misslyckades",
+  "upload_file": "Ladda upp fil",
   "upload_project": "Ladda upp projekt",
   "upload_zipped_project": "Ladda upp zippat projekt",
   "user_already_added": "Användare redan tillagd",
diff --git a/services/web/locales/tr.json b/services/web/locales/tr.json
index a1277f1f13..322497e9ee 100644
--- a/services/web/locales/tr.json
+++ b/services/web/locales/tr.json
@@ -1,7 +1,6 @@
 {
   "About": "Hakkında",
   "Account": "Hesap",
-  "Account Settings": "Hesap Ayarları",
   "Documentation": "Dökümantasyon",
   "Projects": "Projeler",
   "Security": "Güvenlik",
@@ -40,7 +39,6 @@
   "blank_project": "Boş Proje",
   "blog": "Blog",
   "built_in": "Yerleşik",
-  "can_edit": "Değişiklik Yapabilir",
   "cancel": "İptal",
   "cancel_my_account": "Hesabımı iptal et",
   "cancel_your_subscription": "Hesabınızı iptal edin",
@@ -263,7 +261,6 @@
   "publishing": "Yayınlanıyor",
   "pull_github_changes_into_sharelatex": "GitHub’daki değişiklikleri __appName__’e aktar",
   "push_sharelatex_changes_to_github": "__appName__’deki değişiklikleri GitHub’a aktar",
-  "read_only": "Yalnızca Görüntüleyebilir",
   "recent_commits_in_github": "GitHub’da yapılan güncel işlemler",
   "recompile": "Tekrar Derle",
   "reconnecting": "Yeniden bağlanıyor",
@@ -364,6 +361,7 @@
   "upgrade": "Yükselt",
   "upgrade_now": "Şimdi Yükselt",
   "upload": "Yükle",
+  "upload_file": "Dosya Yükle",
   "upload_project": "Proje Yükleyin",
   "upload_zipped_project": "Sıkıştırılmış Proje Yükle",
   "user_wants_you_to_see_project": "__username__ adlı kullanıcı __projectname__ isimli projeyi görmenizi istiyor",
diff --git a/services/web/locales/zh-CN.json b/services/web/locales/zh-CN.json
index 7c2c885e9b..6c4249aeff 100644
--- a/services/web/locales/zh-CN.json
+++ b/services/web/locales/zh-CN.json
@@ -1,11 +1,13 @@
 {
   "12x_basic": "12倍 免费时长 (240s)",
+  "12x_more_compile_time": "在更快的服务器上获取12倍的编译时间",
   "1_2_width": "½ 宽度",
   "1_4_width": "¼ 宽度",
+  "24x_basic": "24倍 免费时长 (240s)",
+  "24x_more_compile_time": "在更快的服务器上获取24倍的编译时间",
   "3_4_width": "¾ 宽度",
   "About": "关于",
   "Account": "账户",
-  "Account Settings": "账户设置",
   "Documentation": "文档",
   "Projects": "项目",
   "Security": "安全性",
@@ -16,7 +18,12 @@
   "a_fatal_compile_error_that_completely_blocks_compilation": "一个<0>严重编译错误</0>阻止了编译。",
   "a_file_with_that_name_already_exists_and_will_be_overriden": "同名文件已存在，该文件会被覆盖。",
   "a_more_comprehensive_list_of_keyboard_shortcuts": "在<0>此__appName__项目模板</0>中可以找到更完整的键盘快捷键列表",
+  "a_new_reference_was_added": "添加了新的参考文献",
+  "a_new_reference_was_added_from_provider": "从 __provider__ 添加了新的参考文献",
+  "a_new_reference_was_added_to_file": "已向 <0>__filePath__</0> 添加了新的参考文献",
+  "a_new_reference_was_added_to_file_from_provider": "从 __provider__ 向 <0>__filePath__</0> 添加了新的参考文献",
   "about": "关于",
+  "about_error_assist": "关于错误辅助助理",
   "about_to_archive_projects": "您将要归档以下项目：",
   "about_to_delete_cert": "您将要删除以下证书：",
   "about_to_delete_projects": "您将删除下面的项目：",
@@ -28,7 +35,6 @@
   "about_to_leave_project": "您即将离开此项目",
   "about_to_leave_projects": "您将离开下面的项目",
   "about_to_trash_projects": "您将要把以下项目移至回收站：",
-  "about_writefull": "关于 Writefull",
   "abstract": "摘要",
   "accept": "采纳",
   "accept_and_continue": "接受并继续",
@@ -36,15 +42,18 @@
   "accept_change_error_description": "接受跟踪更改时出现错误，请稍后重试。",
   "accept_change_error_title": "接受错误修改",
   "accept_invitation": "接受邀请",
-  "accept_or_reject_each_changes_individually": "接受或拒绝修改意见",
+  "accept_or_reject_individual_edits": "接受或拒绝个别修改",
   "accept_selected_changes": "接受选定修改",
   "accept_terms_and_conditions": "接受条款和条件",
   "accepted_invite": "已接受的邀请",
   "accepting_invite_as": "接受邀请",
+  "access_all_premium_features": "访问所有高级功能，包括更多合作者、完整的项目历史记录和更长的编译时间。",
   "access_denied": "访问被拒绝",
   "access_edit_your_projects": "访问并编辑您的项目",
   "access_levels_changed": "访问级别已更改",
   "account": "账户",
+  "account_already_managed": "您的帐户已被管理。",
+  "account_billed_manually": "帐户手动计费",
   "account_has_been_link_to_institution_account": "您在 __appName__ 上的 <b>__email__</b> 帐户已链接到您的 <b>__institutionName__</b> 机构帐户。",
   "account_has_past_due_invoice_change_plan_warning": "您的帐户当前有逾期账单。在这个问题解决之前，你不能改变你的计划。",
   "account_linking": "帐户链接",
@@ -69,14 +78,21 @@
   "add_another_token": "添加另外一个令牌",
   "add_comma_separated_emails_help": "使用逗号（,）字符分隔多个电子邮件地址。",
   "add_comment": "添加评论",
+  "add_comment_error_message": "添加您的评论时出错。请稍后重试。",
+  "add_comment_error_title": "添加评论错误",
   "add_company_details": "添加公司详细信息",
   "add_email": "添加电子邮件",
   "add_email_address": "添加邮件地址",
   "add_email_to_claim_features": "添加一个机构电子邮件地址来声明您的功能。",
+  "add_error_assist_annual_to_your_projects": "将 Error Assist Annual  添加到您的项目中并获得无限的 AI 修复帮助，以更快地修复 LaTeX 错误。",
+  "add_error_assist_to_your_projects": "将错误辅助  添加到您的项目中并获得无限的 AI 帮助，以更快地修复 LaTeX 错误。",
   "add_files": "添加文件",
-  "add_more_editors": "添加更多编辑者",
+  "add_more_collaborators": "添加更多协作者",
+  "add_more_licenses_to_my_plan": "为我的计划添加更多许可证",
   "add_more_managers": "添加更多管理者",
   "add_new_email": "添加新电子邮件",
+  "add_on": "插件",
+  "add_ons": "插件",
   "add_or_remove_project_from_tag": "根据标记 __tagName__ 来添加或移除项目",
   "add_people": "添加人员",
   "add_role_and_department": "添加角色和部门",
@@ -99,10 +115,15 @@
   "administration_and_security": "管理和安全",
   "advanced_reference_search": "高级<0>引用搜索</0>",
   "advanced_reference_search_mode": "高级引文搜索",
+  "after_that_well_bill_you_x_total_y_subtotal_z_tax_annually_on_date_unless_you_cancel": "此后，我们将于每年 __date__ 向您收取 __totalAmount__ (__subtotalAmount__ + __taxAmount__ 税额)，除非您取消。",
   "aggregate_changed": "替换",
   "aggregate_to": "为",
   "agree_with_the_terms": "我同意Overleaf的条款",
+  "ai_assistance_to_help_you": "AI 将辅助您修复 LaTeX 错误",
+  "ai_based_language_tools": "专为研究写作而设计的基于人工智能的语言工具",
   "ai_can_make_mistakes": "AI 可能会犯错。在确定修复之前，请先检查修复内容。",
+  "ai_features": "AI 特性",
+  "ai_feedback_please_provide_more_detail": "请提供更多有关错误的详细信息（可选）",
   "ai_feedback_tell_us_what_was_wrong_so_we_can_improve": "告诉我们哪里出了问题，以便我们改进。",
   "ai_feedback_the_answer_was_too_long": "答案太长了",
   "ai_feedback_the_answer_wasnt_detailed_enough": "答案不够详细",
@@ -112,6 +133,7 @@
   "alignment": "对齐",
   "all": "全部",
   "all_borders": "全边框",
+  "all_features_in_group_standard_plus": "Group Standard 中的所有功能，以及：",
   "all_premium_features": "所有高级付费功能",
   "all_premium_features_including": "所有高级功能，包括：",
   "all_prices_displayed_are_in_currency": "所有展示的价格都以__recommendedCurrency__计。",
@@ -120,9 +142,10 @@
   "all_templates": "所有模板",
   "all_the_pros_of_our_standard_plan_plus_unlimited_collab": "包含我们标准计划的所有功能，另外每个项目还可拥有无限的合作者。",
   "all_these_experiments_are_available_exclusively": "所有这些实验仅对实验室计划的成员开放。如果您注册，您可以选择要尝试的实验。",
+  "allows_to_search_by_author_title_etc_possible_to_pull_results_directly_from_your_reference_manager_if_connected": "允许按作者、标题等进行搜索。可以直接从参考文献管理器中提取结果（如果已连接）。",
+  "already_have_a_papers_account": "现在可以更轻松的在 Overleaf 中管理你的引文和参考书目！已有 Papers 帐户了吗？<0>在此关联你的帐户</0>。",
   "already_have_an_account": "已经有一个账户啦？",
   "already_have_sl_account": "已经拥有 __appName__ 账户了吗？",
-  "already_subscribed_try_refreshing_the_page": "已经订阅啦？请刷新界面哦。",
   "also": "也",
   "alternatively_create_new_institution_account": "或者，您可以通过单击<b>__clickText__</b>来使用机构电子邮件(<b>__email__</b>)创建一个<b>新帐户</b>。",
   "an_email_has_already_been_sent_to": "一封电子邮件已经被发送给<0>__email__</0>。请稍后再尝试。",
@@ -130,11 +153,15 @@
   "an_error_occurred_when_verifying_the_coupon_code": "验证优惠券代码时出错",
   "and": "和",
   "annual": "每年",
+  "annual_discount": "年度折扣",
   "anonymous": "匿名",
   "anyone_with_link_can_edit": "任何人可以通过此链接编辑此项目。",
   "anyone_with_link_can_view": "任何人可以通过此链接浏览此项目。",
   "app_on_x": "__appName__ 在 __social__",
+  "appearance": "外观",
   "apply_educational_discount": "使用教育折扣",
+  "apply_educational_discount_description": "使用 __appName__ 进行教学的团体可享受 40% 折扣",
+  "apply_educational_discount_description_with_group_discount": "使用 __appName__ 进行教学的团体可享受总计 40% 的折扣",
   "apply_suggestion": "使用建议修改",
   "april": "四月",
   "archive": "归档",
@@ -145,6 +172,7 @@
   "are_you_affiliated_with_an_institution": "您隶属于某个机构吗？",
   "are_you_getting_an_undefined_control_sequence_error": "您是否看到未定义的控制序列错误？如果是，请确保您已在文档的序言部分（代码的第一部分）中加载 Graphicx 包：<0>\\usepackage{graphicx}</0>。 <1>了解更多</1>",
   "are_you_still_at": "你还在<0>__institutionName__</0>吗？",
+  "are_you_sure_you_want_to_cancel_add_on": "您确定要取消 <strong>__addOnName__</strong> 附加组件吗？",
   "article": "文章",
   "articles": "文章",
   "as_a_member_of_sso_required": "作为 <b>__institutionName__</b> 的成员，您必须通过您的机构门户网站登录到 <b>__appName__</b> 。",
@@ -155,24 +183,31 @@
   "ask_proj_owner_to_upgrade_for_references_search": "请要求项目所有者升级以使用参考文献搜索功能。",
   "ask_repo_owner_to_reconnect": "请求 GitHub 存储库所有者 (<0>__repoOwnerEmail__</0>) 重新连接该项目。",
   "ask_repo_owner_to_renew_overleaf_subscription": "请求 GitHub 存储库所有者 (<0>__repoOwnerEmail__</0>) 续订其 __appName__ 订阅并重新链接项目。",
+  "at_most_x_libraries_can_be_selected": "最多可以选择 __maxCount__ 个库",
   "august": "八月",
   "author": "作者",
   "auto_close_brackets": "自动补全括号",
   "auto_compile": "自动编译",
   "auto_complete": "自动补全",
+  "autocompile": "自动编译",
   "autocompile_disabled": "自动编译已关闭",
   "autocompile_disabled_reason": "由于服务器过载，暂时无法自动实时编译，请点击上方按钮进行编译",
   "autocomplete": "自动补全",
   "autocomplete_references": "参考文献自动补全（在 <code>\\cite{}</code> 中）",
   "automatic_user_registration_uppercase": "自动用户注册",
+  "automatically_insert_closing_brackets_and_parentheses": "自动插入右括号和圆括号",
+  "automatically_recompile_the_project_as_you_edit": "编辑时自动重新编译项目",
+  "available_with_group_professional": "适用于 Group Professional",
   "back": "返回",
   "back_to_account_settings": "返回帐户设置",
+  "back_to_all_posts": "回到所有帖子",
   "back_to_configuration": "返回配置",
   "back_to_editor": "回到编辑器",
   "back_to_log_in": "返回登录",
   "back_to_subscription": "返回到订阅",
   "back_to_your_projects": "返回您的项目",
   "basic": "免费时长 (20s)",
+  "basic_compile_time": "基本编译时长",
   "basic_compile_timeout_on_fast_servers": "在快速服务器上的基本编译时限",
   "become_an_advisor": "成为__appName__顾问",
   "before_you_use_error_assistant": "使用错误助手之前",
@@ -186,31 +221,40 @@
   "beta_program_opt_out_action": "退出 Beta 计划",
   "bibliographies": "参考文献",
   "billed_annually": "每年计费",
+  "billed_annually_at": "按年计费，价格为<0>__price__</0><1>（包含套餐和任何附加组件）</1>",
+  "billed_monthly_at": "按月计费，价格为<0>__price__</0><1>（包含套餐和任何附加组件）</1>",
   "billed_yearly": "按年计费",
+  "billing": "订单",
+  "billing_period_sentence_case": "订单周期",
   "binary_history_error": "预览不适用于此文件类型",
   "blank_project": "空白项目",
   "blocked_filename": "此文件名被阻止。",
   "blog": "博客",
+  "bold": "粗体",
   "brl_discount_offer_plans_page_banner": "__flag__<b>好消息</b> 我们为巴西用户在本页面上的高级计划提供了50%的折扣。看看新的低价。",
   "browser": "浏览器",
   "built_in": "内嵌",
+  "bullet_list": "项目符号列表",
+  "buy_licenses": "购买许可证",
+  "buy_more_licenses": "购买更多许可证",
   "buy_now_no_exclamation_mark": "现在购买",
   "by": "由",
   "by_joining_labs": "加入实验室即表示您同意接收 Overleaf 不定期发送的电子邮件和更新信息（例如，征求您的反馈）。您还同意我们的<0>服务条款</0>和<1>隐私声明</1>。",
   "by_registering_you_agree_to_our_terms_of_service": "注册即表示您同意我们的 <0>服务条款</0> 和 <1>隐私条款</1>。",
   "by_subscribing_you_agree_to_our_terms_of_service": "订阅即表示您同意我们的<0>服务条款</0>。",
-  "can_edit": "可以编辑",
   "can_link_institution_email_acct_to_institution_acct": "您现在可以将您的 <b>__appName__</b> 账户 <b>__email__</b> 与您的  <b>__institutionName__</b> 机构账户关联。",
   "can_link_institution_email_by_clicking": "您可以通过单击 <b>__clickText__</b> 将您的 <b>__email__</b> <b>__appName__</b> 账户链接到您的 <b>__institutionName__</b> 帐户。",
   "can_link_institution_email_to_login": "您可以将您的 <b>__email__</b> <b>__appName__</b> 账户链接到你的 <b>__institutionName__</b> 账户，这将允许您通过机构门户登录到<b>__appName__</b> 。",
   "can_link_your_institution_acct_2": "您可以现在 <0>链接</0> 您的 <0>__appName__</0> 账户到您的<0>__institutionName__</0> 机构账户。",
   "can_now_relink_dropbox": "您现在可以<0>重新关联您的 Dropbox 帐户</0>。",
-  "can_view": "可以查看",
+  "can_view_content": "允许查看",
   "cancel": "取消",
+  "cancel_add_on": "取消插件",
   "cancel_anytime": "我们相信您会喜欢 __appName__，但如果不喜欢，您可以随时取消。如果您在30天内通知我们，我们无理由退款。",
   "cancel_my_account": "取消我的订购",
   "cancel_my_subscription": "取消我的订阅",
   "cancel_personal_subscription_first": "您已经有个人订阅，您希望我们在加入团体许可之前先取消该订阅吗？",
+  "cancel_subscription": "取消订阅",
   "cancel_your_subscription": "取消您的订购",
   "cannot_invite_non_user": "无法发送邀请。 收件人必须已有 __appName__ 帐户",
   "cannot_invite_self": "不能向自己发送邀请哦",
@@ -225,6 +269,7 @@
   "card_must_be_authenticated_by_3dsecure": "在继续之前，您的卡必须通过3D安全验证",
   "card_payment": "信用卡支付",
   "careers": "工作与职业",
+  "categories": "类别",
   "category_arrows": "箭头字符",
   "category_greek": "希腊字符",
   "category_misc": "杂项",
@@ -234,6 +279,7 @@
   "certificate": "证书",
   "change": "修改",
   "change_currency": "更改货币",
+  "change_language": "更改语言",
   "change_or_cancel-cancel": "取消",
   "change_or_cancel-change": "修改",
   "change_or_cancel-or": "或者",
@@ -241,6 +287,7 @@
   "change_password": "更换密码",
   "change_password_in_account_settings": "在帐户设置中更改密码",
   "change_plan": "改变套餐",
+  "change_primary_email": "更改主电子邮件",
   "change_primary_email_address_instructions": "要更改您的主电子邮件地址，请先添加您的新主电子邮件地址（点击<0>添加其他电子邮件</0>）并确认。 然后单击<0>设为主账户</0>按钮。 <1>详细了解</1>如何管理您的 __appName__ 电子邮件。",
   "change_project_owner": "变更项目所有者",
   "change_the_ownership_of_your_personal_projects": "将您的个人项目的所有权更改为新帐户。 <0>了解如何更改项目所有者。</0>",
@@ -257,8 +304,10 @@
   "checking_project_github_status": "正在检查GitHub中的项目状态",
   "choose_a_custom_color": "选择自定义颜色",
   "choose_from_group_members": "从团队成员中选择",
+  "choose_how_you_search_your_references": "选择如何搜索参考文献",
   "choose_which_experiments": "选择您想要尝试的实验。",
   "choose_your_plan": "选择您的支付方案",
+  "citation": "引文",
   "city": "城市",
   "clear_cached_files": "清除缓存文件",
   "clear_search": "清除搜索",
@@ -268,6 +317,8 @@
   "clearing": "正在清除",
   "click_here_to_view_sl_in_lng": "点击以<0>__lngName__</0> 使用  __appName__",
   "click_link_to_proceed": "单击下面的 <b>__clickText__</b> 继续。",
+  "click_to_give_feedback": "点击即可提供反馈。",
+  "click_to_unpause": "单击即可取消暂停并重新激活您的 Overleaf 高级功能。",
   "clicking_delete_will_remove_sso_config_and_clear_saml_data": "点击<0>删除</0>将删除您的 SSO 配置并取消所有用户的链接。 仅当您的组设置中禁用 SSO 时，您才能执行此操作。",
   "clone_with_git": "用Git克隆",
   "close": "关闭",
@@ -277,12 +328,11 @@
   "code_check_failed": "代码检查失败",
   "code_check_failed_explanation": "您的代码有问题，无法自动编译",
   "code_editor": "源代码编辑器",
-  "code_editor_tooltip_message": "您可以在代码编辑器中查看项目中的代码（并对其进行编辑）",
-  "code_editor_tooltip_title": "想要查看并编辑 LaTeX 代码？",
   "collaborate_easily_on_your_projects": "轻松协作您的项目。处理更长或更复杂的文档。",
   "collaborate_online_and_offline": "使用自己的工作流进行在线和离线协作",
   "collaboration": "合作",
   "collaborator": "合作者",
+  "collaborator_chat": "协作者聊天",
   "collabratec_account_not_registered": "未注册 IEEE Collabratec™ 帐户。请从IEEE Collabratec™连接到Overleaf 或者使用其他帐户登录。",
   "collabs_per_proj": "每个项目 __collabcount__ 个合作者",
   "collabs_per_proj_single": "__collabcount__ 个合作者每个项目",
@@ -291,12 +341,18 @@
   "column_width_is_custom_click_to_resize": "列宽为默认值，单击以调整大小",
   "column_width_is_x_click_to_resize": "列宽为 __width__。 单击以调整大小",
   "comment": "评论",
+  "comment_only": "仅评论",
+  "comment_only_upgrade_for_track_changes": "仅评论。升级可跟踪更改。",
+  "comment_only_upgrade_to_enable_track_changes": "仅评论。<0>升级</0>以启用跟踪更改。",
   "common": "通用",
   "common_causes_of_compile_timeouts_include": "常见的导致编译超时的原因包括",
   "commons_plan_tooltip": "由于您与 __institution__ 的隶属关系，您加入了 __plan__ 计划。 单击以了解如何充分利用 Overleaf 高级功能。",
+  "community_articles": "社区文章",
+  "community_articles_lowercase": "社区文章",
   "compact": "紧凑的",
   "company_name": "公司名称",
   "compare": "比较",
+  "compare_all_plans": "在我们的<0>定价页面</0>上比较所有计划",
   "compare_features": "比较功能",
   "comparing_from_x_to_y": "从 <0>__startTime__</0> 到 <0>__endTime__</0> 进行比较",
   "compile_error_entry_description": "一个阻止此项目编译的错误",
@@ -316,21 +372,28 @@
   "configure_sso": "配置 SSO",
   "configured": "已配置",
   "confirm": "确认",
+  "confirm_accept_selected_changes": "您确定要接受所选的更改吗？",
+  "confirm_accept_selected_changes_plural": "您确定要接受选定的__count__个更改吗？",
   "confirm_affiliation": "确认从属关系",
   "confirm_affiliation_to_relink_dropbox": "请确认您仍在该机构并持有他们的许可证，或升级您的帐户以重新关联您的 Dropbox 帐户。",
   "confirm_delete_user_type_email_address": "确认您要删除 __userName__，请输入与其帐户关联的电子邮件地址",
   "confirm_email": "确认电子邮件",
   "confirm_new_password": "确认新密码",
   "confirm_primary_email_change": "确认主电子邮件更改",
+  "confirm_reject_selected_changes": "您确定要拒绝所选的更改吗？",
+  "confirm_reject_selected_changes_plural": "您确定要拒绝选定的__count__个更改吗？",
   "confirm_remove_sso_config_enter_email": "要确认您要删除 SSO 配置，请输入您的电子邮件地址：",
+  "confirm_secondary_email": "确认辅助电子邮件",
   "confirm_your_email": "确认您的电子邮件地址",
   "confirmation_link_broken": "抱歉，您的确认链接有问题。请尝试复制并粘贴邮件底部的链接。",
   "confirmation_token_invalid": "抱歉，您的确认令牌无效或已过期。请请求新的电子邮件确认链接。",
   "confirming": "确认",
   "conflicting_paths_found": "发现冲突路径",
   "congratulations_youve_successfully_join_group": "恭喜！您已经成功的加入到团队订阅中。",
+  "connect_overleaf_with_github": "将 __appName__ 与 GitHub 连接，以便轻松同步项目和实时版本控制。",
   "connected_users": "已连接的用户",
   "connecting": "正在连接",
+  "connection_lost_with_unsaved_changes": "连接丢失，更改未保存。",
   "contact": "联系",
   "contact_group_admin": "请联系你的群组管理员。",
   "contact_message_label": "信息",
@@ -343,6 +406,7 @@
   "continue": "继续",
   "continue_github_merge": "我已经手动合并。继续",
   "continue_to": "返回 __appName__",
+  "continue_using_free_features": "继续使用我们的免费功能",
   "continue_with_free_plan": "继续使用免费计划",
   "continue_with_service": "以  __service__ 继续",
   "copied": "已复制",
@@ -351,6 +415,7 @@
   "copy_project": "复制项目",
   "copy_response": "复制响应内容",
   "copying": "正在复制",
+  "cost_summary": "成本汇总",
   "could_not_connect_to_collaboration_server": "无法连接到协作服务器",
   "could_not_connect_to_websocket_server": "无法连接到WebSocket服务器",
   "could_not_load_translations": "无法加载翻译",
@@ -372,9 +437,11 @@
   "created_at": "创建于",
   "creating": "正在创建",
   "credit_card": "信用卡",
+  "cross_reference": "交叉引用",
   "cs": "捷克语",
   "currency": "货币",
   "current_file": "当前文件",
+  "current_page_page": "当前页，第 __page__ 页",
   "current_password": "正在使用的密码",
   "current_price": "当前价格",
   "current_session": "当前会话",
@@ -389,11 +456,13 @@
   "customizing_figures": "定制图片",
   "customizing_tables": "定制表格",
   "da": "丹麦语",
+  "dark_mode": "暗黑模式",
   "date": "日期",
   "date_and_owner": "日期和所有者",
   "de": "德语",
   "dealing_with_errors": "处理错误",
   "december": "十二月",
+  "decrease_indent": "减少缩进",
   "dedicated_account_manager": "专属客服",
   "default": "默认",
   "delete": "删除",
@@ -408,6 +477,7 @@
   "delete_certificate": "删除证书",
   "delete_comment": "删除评论",
   "delete_comment_error_message": "删除您的评论时遇到错误。请稍后重试。",
+  "delete_comment_error_title": "删除评论错误",
   "delete_comment_message": "您无法撤销此操作",
   "delete_comment_thread": "删除评论线程流",
   "delete_comment_thread_message": "这将删除整个评论线程。此操作无法撤消。",
@@ -434,14 +504,25 @@
   "details_provided_by_google_explanation": "您的详细信息是由您的 Google 帐户提供的。请检查一下哦。",
   "dictionary": "字典",
   "did_you_know_institution_providing_professional": "你知道吗__institutionName__向__institutionName__的每个人提供<0>免费的 __appName__ 专业功能</0>吗？",
+  "disable": "禁用",
+  "disable_ai_features": "禁用 AI 功能",
+  "disable_equation_preview": "禁用公式预览",
+  "disable_equation_preview_confirm": "这将在所有项目中禁用公式预览。",
+  "disable_equation_preview_enable": "您可以从<b>菜单</b>再次启用它。",
   "disable_single_sign_on": "禁用 单点登录(SSO)",
   "disable_sso": "关闭 SSO",
   "disable_stop_on_first_error": "禁用 “出现第一个错误时停止”",
+  "disabled": "已禁用",
   "disabling": "禁用",
   "disconnected": "连接已断开",
+  "discount": "折扣",
   "discount_of": "__amount__的折扣",
-  "dismiss_error_popup": "忽略第一个错误提示",
+  "discover_latex_templates_and_examples": "探索 LaTeX 模板和示例，以帮助完成从撰写期刊文章到使用特定 LaTeX 包的所有工作。",
+  "discover_the_fastest_way_to_search_and_cite": "探索搜索和引用的最快方法",
+  "discover_why_over_people_worldwide_trust_overleaf": "了解为什么全世界有超过__count__万人信任 Overleaf 并把工作交给它。",
+  "display": "显示",
   "display_deleted_user": "显示已删除的用户",
+  "display_math": "显示数学公式",
   "do_not_have_acct_or_do_not_want_to_link": "如果您没有 <b>__appName__</b> 帐户，或者您不想链接到您的 <b>__institutionName__</b> 帐户，请单击 <b>__clickText__</b>。",
   "do_not_link_accounts": "不链接帐户",
   "do_you_need_edit_access": "您需要编辑权限吗？",
@@ -461,9 +542,13 @@
   "doing_this_allow_log_in_through_institution_2": "执行此操作将允许您通过您的机构登录<0>__appName__</0>，并重新确认您的机构电子邮件地址。",
   "doing_this_will_verify_affiliation_and_allow_log_in_2": "这样做将验证您与<b>__institutionName__</b>的关系，并将允许您通过您的机构登录到 <b>__appName__</b> 。",
   "done": "完成",
+  "dont_forget_you_currently_have": "别忘了，您目前拥有：",
   "dont_have_account": "还没有账户？",
+  "dont_reload_or_close_this_tab": "请勿刷新或关闭此选项卡。",
   "download": "下载",
   "download_all": "下载全部",
+  "download_as_pdf": "下载 PDF",
+  "download_as_source_zip": "下载源代码 (.zip)",
   "download_metadata": "下载 Overleaf 元数据",
   "download_pdf": "下载PDF",
   "download_zip_file": "下载 ZIP 格式文件",
@@ -497,27 +582,38 @@
   "dropbox_unlinked_premium_feature": "<0>您的 Dropbox 帐户已取消关联</0>，因为 Dropbox Sync 是您通过机构许可获得的一项高级功能。",
   "due_date": "到期 __date__",
   "due_today": "今天截止",
+  "duplicate": "复制",
   "duplicate_file": "重复文件",
   "duplicate_projects": "该用户有名称重复的项目",
   "each_user_will_have_access_to": "每个用户都可以访问",
   "easily_manage_your_project_files_everywhere": "随时随地轻松管理您的项目文件",
   "easy_collaboration_for_students": "方便学生协作。支持更长或更复杂的项目。",
   "edit": "编辑",
+  "edit_comment_error_message": "编辑评论时出错。请稍后重试。",
+  "edit_comment_error_title": "编辑评论错误",
   "edit_dictionary": "编辑词典",
   "edit_dictionary_empty": "您的自定义词典为空。",
   "edit_dictionary_remove": "从字典中删除",
   "edit_figure": "编辑图片",
   "edit_sso_configuration": "编辑 SSO 配置",
   "edit_tag": "编辑标签",
-  "editing": "正在编辑",
+  "edit_your_custom_dictionary": "编辑您的自定义词典",
+  "editing": "编辑",
   "editing_and_collaboration": "编辑与协作",
   "editing_captions": "编辑 captions",
-  "editor": "编辑器",
+  "editor": "编辑者(可编辑)",
   "editor_and_pdf": "编辑器 & PDF",
   "editor_disconected_click_to_reconnect": "编辑器与网络的连接已经断开，重新连接请点击任何位置。",
+  "editor_font_family": "编辑器字体系列",
+  "editor_font_size": "编辑器字体大小",
   "editor_limit_exceeded_in_this_project": "此项目中的编辑者过多",
+  "editor_line_height": "编辑器行高",
+  "editor_only": "仅编辑器",
   "editor_only_hide_pdf": "仅编辑器 <0>(隐藏 PDF)</0>",
   "editor_theme": "编辑器主题",
+  "edits_become_suggestions": "编辑成建议修改",
+  "educational_disclaimer": "我确认用户是主要使用 Overleaf 进行学习和教学的学生或教师，并且可以在被要求时提供证据。",
+  "educational_disclaimer_heading": "教育折扣确认",
   "educational_percent_discount_applied": "应用 __percent__% 教育折扣！",
   "email": "电子邮件",
   "email_address": "邮件地址",
@@ -534,6 +630,7 @@
   "email_must_be_linked_to_institution": "作为 __institutionName__ 的成员，此电子邮件地址只能通过您的<0>帐户设置</0>页面上的单点登录添加。 请添加不同的辅助邮箱地址。",
   "email_or_password_wrong_try_again": "您的邮件地址或密码不正确。请重试",
   "email_or_password_wrong_try_again_or_reset": "您的电子邮件或密码不正确。请重试，或者<0>重置您的密码</0>。",
+  "email_remove_by_date": "如果在__date__之前没有完成，它将从帐户中删除。",
   "email_required": "需要电子邮件",
   "email_sent": "邮件已发送",
   "emails": "邮箱",
@@ -542,22 +639,30 @@
   "empty": "空",
   "empty_zip_file": "Zip压缩包中没有任何文件",
   "en": "英语",
+  "enable_ai_features": "启用 AI 功能",
   "enable_managed_users": "启用托管用户",
   "enable_single_sign_on": "开启单点登录",
   "enable_sso": "开启 SSO",
   "enable_stop_on_first_error_under_recompile_dropdown_menu": "在<1>重新编译</1>下拉菜单下启用<0>“第一次出现错误时停止”</0>，以帮助您立即查找并修复错误。",
+  "enable_stop_on_first_error_under_recompile_dropdown_menu_v2": "在<0>重新编译</0>下拉菜单下启用<1>在第一个错误时停止</1>，以帮助您立即查找和修复错误。",
   "enabled": "已启用",
+  "enables_real_time_syntax_checking_in_the_editor": "在编辑器中启用实时语法检查",
   "enabling": "开启",
   "end_of_document": "文档末尾",
-  "enter_6_digit_code": "输入6位数验证码",
+  "ensure_recover_account": "这将确保在您无法访问主电子邮件地址时可以使用它来恢复您的__appName__帐户。",
   "enter_any_size_including_units_or_valid_latex_command": "输入任意大小（包括单位）或有效的 LaTeX 命令",
   "enter_image_url": "输入图片 URL",
+  "enter_the_code": "输入发送至__email__的6位数代码。",
   "enter_the_confirmation_code": "输入发送到 __email__ 的六位验证码。",
+  "enter_the_number_of_licenses_youd_like_to_add_to_see_the_cost_breakdown": "输入您想要添加的许可证数量以查看成本明细。",
   "enter_your_email_address": "输入你的电子邮件",
   "enter_your_email_address_below_and_we_will_send_you_a_link_to_reset_your_password": "在下面输入您的电子邮件地址，我们将向您发送重置密码的链接",
   "enter_your_new_password": "输入你的新密码",
+  "equation_generator": "方程生成器",
   "equation_preview": "公式预览",
   "error": "错误",
+  "error_assist": "错误辅助助理",
+  "error_log": "错误日志",
   "error_opening_document": "打开文档错误",
   "error_opening_document_detail": "很抱歉，打开此文档时出现问题。请再试一次。",
   "error_performing_request": "执行请求时出错。",
@@ -572,6 +677,8 @@
   "example": "样例",
   "example_project": "样例项目",
   "examples": "样例",
+  "examples_lowercase": "案例",
+  "examples_to_help_you_learn": "示例可帮助您学习如何使用强大的 LaTeX 包和技术。",
   "exclusive_access_with_labs": "独家获取早期实验阶段功能",
   "existing_plan_active_until_term_end": "您的现有计划及其功能将保持活动状态，直到当前计费周期结束。",
   "expand": "展开",
@@ -582,13 +689,16 @@
   "expires_in_days": "在 __days__ 天后过期",
   "expires_on": "过期日期：__date__",
   "expiry": "过期日期",
+  "explore_all_plans": "探索所有订阅计划",
   "export_csv": "导出CSV",
   "export_project_to_github": "将项目导出到GitHub",
   "failed_to_send_group_invite_to_email": "未能向<0>__email__</0>发送团队邀请。请稍后再试。",
   "failed_to_send_managed_user_invite_to_email": "无法将托管用户邀请发送至 <0>__email__</0>。 请稍后再试。",
   "failed_to_send_sso_link_invite_to_email": "无法向<0>__email__</0>发送SSO邀请提醒。请稍后再试。",
+  "fair_usage_policy_applies": "适用正当使用政策。",
   "faq_how_does_free_trial_works_answer": "在为期__len__天的免费试用期间，您可以完全访问所选的__appName__计划。试用结束后不能继续免费。您的卡将在试用期结束时收费，除非您在此之前取消。您可以通过订阅设置取消。",
   "fast": "快速",
+  "fast_draft": "快速 [草稿]",
   "fastest": "最快",
   "feature_included": "包含的功能",
   "feature_not_included": "不包含的功能",
@@ -596,7 +706,10 @@
   "featured_latex_templates": "特色LaTeX模板",
   "features": "功能",
   "features_and_benefits": "功能 & 优势",
+  "features_like_track_changes": "实时跟踪更改等功能",
   "february": "二月",
+  "figure": "图片",
+  "file": "文件",
   "file_action_created": "创建",
   "file_action_deleted": "删除",
   "file_action_edited": "编辑",
@@ -613,10 +726,12 @@
   "file_outline": "文件大纲",
   "file_size": "文件大小",
   "file_too_large": "文件太大",
+  "file_tree": "文件树",
   "files_cannot_include_invalid_characters": "文件名为空或包含无效字符",
   "files_selected": "个文件被选中。",
   "filter_projects": "过滤项目",
   "filters": "筛选器",
+  "find": "查找",
   "find_out_more": "了解更多",
   "find_out_more_about_institution_login": "了解有关机构登录的更多信息",
   "find_out_more_about_the_file_outline": "了解有关文件大纲的更多信息",
@@ -673,20 +788,27 @@
   "full_doc_history": "完整的文档历史",
   "full_document_history": "完整的文档<0>历史</0>",
   "full_width": "全宽",
+  "future_payments": "未来付款",
   "gallery": "模版集",
+  "gallery_back_to_all": "返回所有 __itemPlural__",
   "gallery_find_more": "查找更多__itemPlural__",
+  "gallery_page_items_lowercase": "gallery 项目",
   "gallery_page_title": "模版集 - 用LaTeX编写的模板、示例和文章",
+  "gallery_show_more_tags": "显示更多",
   "general": "常用",
+  "generate_from_text_or_image": "来自文本或图像",
   "generate_token": "生成令牌",
   "generic_if_problem_continues_contact_us": "如果问题仍然存在，请与我们联系",
   "generic_linked_file_compile_error": "此项目的输出文件不可用，因为它未能成功编译。请打开项目以查看编译错误的详细信息。",
   "generic_something_went_wrong": "抱歉，出错了",
   "get_collaborative_benefits": "从 __appName__ 获得协作优势，即使你喜欢离线工作",
   "get_discounted_plan": "获得折扣计划",
+  "get_error_assist": "获取错误帮助",
   "get_exclusive_access_to_labs": "加入 Overleaf Labs 后，即可获得早期实验的独家访问权。我们唯一的要求就是您提供真实的反馈，以帮助我们发展和改进。",
   "get_in_touch": "联系",
   "get_in_touch_having_problems": "如果遇到问题，请<a href=\"__link__\">与支持部门联系</a>",
   "get_involved": "加入我们",
+  "get_real_time_track_changes": "获取实时跟踪更改",
   "get_the_best_overleaf_experience": "获取最佳的 Overleaf 体验",
   "get_the_most_out_headline": "通过以下功能充分利用__appName__：",
   "git": "Git",
@@ -698,8 +820,10 @@
   "git_bridge_modal_git_clone_your_project": "使用下面的链接和 Git 身份验证令牌来克隆你的项目",
   "git_bridge_modal_learn_more_about_authentication_tokens": "了解有关Git集成身份验证令牌的更多信息。",
   "git_bridge_modal_read_only": "<strong>您对此项目具有只读访问权限</strong>这意味着您可以从__appName__中提取，但不能将您所做的任何更改推送回该项目。",
+  "git_bridge_modal_review_access": "<0>您拥有此项目的审核权限。</0>这意味着您可以从 __appName__ 中提取，但不能将所做的任何更改推送回此项目。",
   "git_bridge_modal_see_once": "您只能看到此令牌一次。要删除或生成新帐户，请访问“帐户设置”。有关详细说明和故障排除，请阅读我们的<0>帮助页面</0>。",
   "git_bridge_modal_use_previous_token": "如果系统提示您输入密码，您可以使用以前生成的Git身份验证令牌。或者，您可以在“帐户设置”中生成一个新帐户。有关更多支持，请阅读我们的<0>帮助页面</0>。",
+  "git_gitHub_dropbox_mendeley_papers_and_zotero_integrations": "Git、GitHub、Dropbox、Mendeley、Papers 和 Zotero 集成",
   "git_integration": "Git 集成",
   "git_integration_info": "通过Git集成，你可以用Git克隆你的Overleaf项目。有关完整教程, 请阅读 <0>我们的帮助页面</0>。",
   "github": "GitHub",
@@ -740,9 +864,17 @@
   "go_prev_page": "转到上一页",
   "go_to_account_settings": "前往账户设置",
   "go_to_code_location_in_pdf": "转到PDF中的位置",
+  "go_to_first_page": "回到第一页",
+  "go_to_last_page": "回到最后一页",
+  "go_to_next_page": "下一页",
   "go_to_overleaf": "前往 Overleaf",
+  "go_to_page_x": "转至第 __page__ 页",
   "go_to_pdf_location_in_code": "转到代码中对应 PDF 的位置（提示：双击 PDF 以获得最佳结果）",
+  "go_to_previous_page": "回到前一页",
   "go_to_settings": "转到“设置”",
+  "go_to_subscriptions": "前往订阅",
+  "good_news_you_already_purchased_this_add_on": "好消息！您已经拥有此附加组件，因此无需再次付费。",
+  "good_news_you_are_already_receiving_this_add_on_via_writefull": "好消息！您已经通过 Writefull 订阅获得了此附加组件。无需再次付费。",
   "great_for_getting_started": "非常适合入门",
   "great_for_small_teams_and_departments": "非常适合小型团队和部门",
   "group": "团队",
@@ -752,10 +884,15 @@
   "group_invite_has_been_sent_to_email": "团队邀请已发送至<0>__email__</0>",
   "group_libraries": "团队库",
   "group_managed_by_group_administrator": "此团队中的用户帐户由团队管理员管理。",
+  "group_management": "群组管理",
+  "group_managers": "群组管理员",
+  "group_members": "团队成员",
   "group_plan_admins_can_easily_add_and_remove_users_from_a_group": "群组计划管理员可以轻松添加和删除群组中的用户。对于全站计划，用户在注册或将电子邮件地址添加到 Overleaf（基于域的注册或 SSO）时会自动升级。",
   "group_plan_tooltip": "您作为团体订阅的成员加入了 __plan__ 计划。 单击以了解如何充分利用 Overleaf 高级功能。",
+  "group_plan_upgrade_description": "您当前使用的是 <0>__currentPlan__</0> 方案，并且正在升级到 <0>__nextPlan__</0> 方案。如果您对站点级别的 Overleaf Commons 方案感兴趣，请<1>联系我们</1>。",
   "group_plan_with_name_tooltip": "您作为团体订阅 __groupName__ 的成员加入了 __plan__ 计划。 单击以了解如何充分利用 Overleaf 高级功能。",
   "group_professional": "团队专业版",
+  "group_settings": "团队设置",
   "group_sso_configuration_idp_metadata": "此处提供的信息来自您的身份提供商（IdP）。这通常被称为其SAML元数据。对于某些IdP，您必须将Overleaf配置为服务提供商，才能获得填写此表格所需的数据。有关更多指导，请参阅<0>我们的文档</0>。",
   "group_sso_configure_service_provider_in_idp": "对于某些 IdP，您必须将 Overleaf 配置为服务提供商才能获取填写此表单所需的数据。 为此，您需要下载 Overleaf 元数据。",
   "group_sso_documentation_links": "请参阅我们的<0>文档</0>和<1>问题排查指南</1>以获取更多帮助。",
@@ -769,10 +906,12 @@
   "help_articles_matching": "符合你的主题的帮助文章",
   "help_improve_overleaf_fill_out_this_survey": "如果您想帮助我们改进Overleaf，请花费一点您的宝贵时间填写<0>此调查</0>哦。",
   "help_improve_screen_reader_fill_out_this_survey": "填写此简易调查，帮助我们改善您使用 __appName__ 屏幕阅读器的体验。",
+  "help_shape_the_future_of_overleaf": "帮助塑造 Overleaf 的未来",
   "hide": "隐藏",
   "hide_configuration": "隐藏配置",
   "hide_deleted_user": "隐藏已删除的用户",
   "hide_document_preamble": "隐藏文档导言部分",
+  "hide_file_tree": "隐藏文件树",
   "hide_local_file_contents": "隐藏本地文件内容",
   "hide_outline": "隐藏文件大纲",
   "history": "历史记录",
@@ -820,18 +959,23 @@
   "hotkey_toggle_track_changes": "切换历史记录",
   "hotkey_undo": "撤销",
   "hotkeys": "快捷键",
-  "how_it_works": "工作原理",
+  "how_it_works": "原理简介",
+  "how_many_licenses_do_you_want_to_buy": "您想购买多少个许可证？",
   "how_many_users_do_you_need": "你需要多少用户",
   "how_to_create_tables": "如何创建表格",
   "how_to_insert_images": "如何插入图片",
   "how_we_use_your_data": "我们如何使用您的数据",
   "how_we_use_your_data_explanation": "<0>请回答几个简短的问题，帮助我们继续改进Overleaf。您的回答将帮助我们和我们的企业集团更多地了解我们的用户群体。我们可能会使用这些信息来改善您的 Overleaf 体验，例如提供个性化的入门、升级提示、帮助建议和量身定制的营销沟通（如果您选择接收这些信息）</0><1>有关我们如何使用您的个人数据的更多详细信息，请参阅我们的<0>隐私声明</0></1>",
   "hundreds_templates_info": "从我们的 LaTeX 模板库开始，为期刊、会议、论文、报告、简历等制作漂亮的文档。",
+  "i_confirm_am_student": "我确认我目前是一名学生。",
   "i_want_to_stay": "我要留下",
   "id": "ID",
+  "identify_errors_with_your_compile": "识别编译时的错误",
   "if_have_existing_can_link": "如果您在另一封电子邮件中有一个现有的 <b>__appName__</b> 帐户，您可以通过单击 <b>__clickText__</b> 将其链接到您的 <b>__institutionName__</b> 账户。",
   "if_owner_can_link": "如果您在<b>__appName__</b>拥有账户<b>__email__</b>，您可以将其链接到您的 <b>__institutionName__</b> 机构帐户。",
   "if_you_need_to_customize_your_table_further_you_can": "如果您需要进一步自定义表也是可以的哦。使用LaTeX代码，您可以更改从表格样式和边框样式，到颜色和列宽等任何内容<0>阅读我们的指南</0>在LaTeX中使用表格以帮助您入门。",
+  "if_you_want_more_than_x_licenses_on_your_plan_we_need_to_add_them_for_you": "如果您希望在订阅中添加超过__count__个许可证，我们需要为您添加。只需点击下方的<0>发送请求</0>，我们很乐意为您提供帮助。",
+  "if_you_want_to_reduce_the_number_of_licenses_please_contact_support": "如果您想减少计划中的许可证数量，请<0>联系客户支持</0>。",
   "if_your_occupation_not_listed_type_full_name": "如果您的__occupation__未列出，您可以键入全名。",
   "ignore_and_continue_institution_linking": "您也可以忽略此项，然后<a href=\"__link__\">继续在 __appName__ 上使用您的 <b>__email__</b> 帐户</a>。",
   "ignore_validation_errors": "忽略语法检查",
@@ -847,6 +991,7 @@
   "imported_from_another_project_at_date": "于 __formattedDate__ __relativeDate__，从<0>另一个项目</0>/__sourceEntityPathHTML__导入",
   "imported_from_external_provider_at_date": "于 __formattedDate__ __relativeDate__，从<0>__shortenedUrlHTML__</0>导入",
   "imported_from_mendeley_at_date": "于 __formattedDate__ __relativeDate__，从Mendeley导入",
+  "imported_from_papers_at_date": "从 __formattedDate__ __relativeDate__ 的论文导入",
   "imported_from_the_output_of_another_project_at_date": "于 __formattedDate__ __relativeDate__，从<0>另一个项目</0>的输出导入: __sourceOutputFilePathHTML__",
   "imported_from_zotero_at_date": "于 __formattedDate__ __relativeDate__，从Zotero导入",
   "importing": "正在倒入",
@@ -856,10 +1001,15 @@
   "in_order_to_match_institutional_metadata_associated": "为了匹配您的机构元数据，您的帐户与电子邮件 <b>__email__</b> 相关联。",
   "include_caption": "添加 caption",
   "include_label": "添加 label",
+  "include_results_from_your_reference_manager": "包括参考文献管理器的结果",
+  "include_results_from_your_x_account": "包含来自您的 __provider__ 帐户的结果",
   "include_the_error_message_and_ai_response": "包含错误信息和 AI 响应",
+  "increase_indent": "增加缩进",
   "increased_compile_timeout": "延长的编译时限",
   "individuals": "个人",
   "info": "信息",
+  "inline": "行内",
+  "inline_math": "行内数学公式",
   "inr_discount_modal_info": "以平价获取文档历史记录、跟踪更改、更多协作者等功能。",
   "inr_discount_modal_title": "面向印度用户的所有 Overleaf 高级计划七折优惠",
   "inr_discount_offer_plans_page_banner": "__flag__ <b>好消息！</b>我们已为印度用户的高级计划提供<b>70% 折扣</b>折扣。 查看下面的最新低价。",
@@ -892,7 +1042,9 @@
   "institutional": "机构",
   "institutional_leavers_survey_notification": "提供一些快速反馈，即可获得年度订阅25%的折扣！",
   "institutional_login_unknown": "抱歉，我们不知道是哪个机构发的那个电子邮件地址。您可以浏览我们的\n<a href=\"__link__\">机构列表</a> 找到您的机构，也可以在此处使用您的电子邮件地址和密码注册。",
+  "integrate_overleaf_with_dropbox": "将 __appName__ 与 Dropbox 集成以同步您的 LaTeX 项目并自动保持文件更新。",
   "integrations": "集成",
+  "integrations_like_github": "GitHub Sync 等集成",
   "interested_in_cheaper_personal_plan": "你会对更便宜的<0>__price__</0>个人计划感兴趣吗？",
   "invalid_certificate": "证书无效，请检查证书，然后重试。",
   "invalid_confirmation_code": "无效！请检查代码，然后重试。",
@@ -907,11 +1059,13 @@
   "invalid_password_too_long": "超过最大密码长度 __maxLength__",
   "invalid_password_too_short": "密码太短，最短 __minLength__ 位",
   "invalid_password_too_similar": "密码与电子邮件地址过于相似",
+  "invalid_regular_expression": "无效的正则表达式",
   "invalid_request": "无效的请求。请更正数据并重试。",
   "invalid_zip_file": "zip文件无效",
   "invite": "邀请",
   "invite_expired": "此邀请已经过期",
   "invite_more_collabs": "邀请更多的协作者",
+  "invite_more_members": "邀请更多成员",
   "invite_not_accepted": "邀请尚未接受",
   "invite_not_valid": "项目邀请无效",
   "invite_not_valid_description": "邀请已经过期。请联系项目所有者",
@@ -922,12 +1076,17 @@
   "invited_to_group_login_benefits": "作为该小组的一员，您将可以使用 __appName__ 高级功能，例如额外的协作者、更长的最大编译时间和实时跟踪更改。",
   "invited_to_group_register": "要接受 __inviterName__ 的邀请，您需要创建一个帐户。",
   "invited_to_group_register_benefits": "__appName__ 是一个协作式在线 LaTeX 编辑器，拥有数千个即用型模板和一系列 LaTeX 学习资源，可帮助您入门。",
+  "inviting": "邀请",
   "ip_address": "IP地址",
   "is_email_affiliated": "你的邮件附属于某个机构的吗？ ",
   "is_longer_than_n_characters": "至少要 __n__ 个字符长",
   "is_not_used_on_any_other_website": "未在任何其他网站上使用",
   "issued_on": "发布于：__date__",
   "it": "意大利语",
+  "it_looks_like_that_didnt_work_you_can_try_again_or_get_in_touch": "看来此方法无效。您可以重试，或<0>联系</0>我们的支持团队以获取更多帮助。",
+  "it_looks_like_your_account_is_billed_manually": "您的帐户似乎正在手动计费 - 添加席位或升级订阅只能由支持团队完成。请<0>联系我们</0>寻求帮助。",
+  "it_looks_like_your_payment_details_are_missing_please_update_your_billing_information": "您的付款详情似乎缺失。请<0>更新您的账单信息</0>，或<1>联系</1>我们的支持团队以获取更多帮助。",
+  "italics": "斜体",
   "ja": "日语",
   "january": "一月",
   "join_beta_program": "加入beta计划",
@@ -949,13 +1108,16 @@
   "keep_your_account_safe_add_another_email": "确保您的帐户安全，并确保您不会因添加其他电子邮件地址而失去对该帐户的访问权限。",
   "keep_your_email_updated": "保持您的电子邮件更新，这样您就不会失去对帐户和数据的访问权限。",
   "keybindings": "组合键",
+  "keyboard_shortcuts": "键盘快捷键",
   "knowledge_base": "知识库",
   "ko": "韩语",
   "labels_help_you_to_easily_reference_your_figures": "标签可以帮助您轻松地在整个文档中引用您的图片。要引用文档中的图片，请使用<0> ef{…} </0>命令引用标签。这使得引用图形变得容易，而无需手动记住图形编号<1> 了解更多信息</1>",
   "labels_help_you_to_reference_your_tables": "标签可以帮助您轻松地在整个文档中引用表。要引用文本中的表，请使用<0>ef{…}</0>命令引用标签。这样就可以很容易地引用表格，而无需手动记住表格编号<1> 阅读标签和交叉引用</1>。",
+  "labs": "Labs",
   "labs_program_benefits": "__appName__ 一直在寻找新的方法来帮助用户更快、更有效地工作。 通过加入 Overleaf Labs，您可以参与探索协作写作和出版领域创新想法的实验。",
   "language": "语言",
   "large_or_high-resolution_images_taking_too_long": "大型或高分辨率图像的处理时间过长。 您也许能够<0>优化一下</0>。",
+  "large_or_high_resolution_images_taking_too_long_to_process": "大型或高分辨率图像需要太长时间来处理。",
   "last_active": "最后活跃于",
   "last_active_description": "最近项目打开时间",
   "last_edit": "最近编辑",
@@ -977,13 +1139,18 @@
   "latex_places_figures_according_to_a_special_algorithm": "LaTeX 根据特殊算法放置图形。 您可以使用“放置参数”来调整图形的位置。 <0>了解具体方法</0>",
   "latex_places_tables_according_to_a_special_algorithm": "LaTeX根据一种特殊的算法放置表格。可以使用“放置参数”来调整表格的位置<0>这篇文章</0>解释了如何做到这一点。",
   "latex_templates": "LaTeX模板",
+  "latex_templates_and_examples": "LaTeX 模板和示例",
+  "latex_templates_for_journal_articles": "适用于期刊文章、学术论文、简历、演示文稿等的 LaTeX 模板。",
+  "latex_templates_sentence_case": "LaTeX 模板",
   "layout": "布局",
+  "layout_options": "布局选项",
   "layout_processing": "布局处理中",
   "ldap": "LDAP",
   "ldap_create_admin_instructions": "输入邮箱，创建您的第一个__appName__管理员账户。这个账户对应您在LDAP系统中的账户，请使用此账户登陆系统。",
   "learn": "学习",
   "learn_more": "了解更多",
   "learn_more_about_account": "<0>详细了解</0>如何管理您的 __appName__ 帐户。",
+  "learn_more_about_compile_timeouts": "<0>详细了解</0>编译超时。",
   "learn_more_about_emails": "<0>详细了解</0>如何管理您的 __appName__ 电子邮件。",
   "learn_more_about_link_sharing": "了解分享链接",
   "learn_more_about_managed_users": "学习关于管理用户",
@@ -1000,12 +1167,14 @@
   "let_us_know": "让我们知道",
   "let_us_know_how_we_can_help": "告诉我们您需要什么帮助",
   "let_us_know_what_you_think": "让我们知道您的想法",
+  "lets_get_those_premium_features": "让我们立即为您启用这些高级功能。我们将使用您掌握的付款信息向您收取 <0>__paymentAmount__</0> 的费用。",
+  "libraries": "库",
   "library": "库",
   "license": "许可",
-  "limited_to_n_editors": "仅限 __count__ 个编辑",
-  "limited_to_n_editors_per_project": "每个项目仅限 __count__ 个编辑者",
-  "limited_to_n_editors_per_project_plural": "每个项目最多可有 __count__ 名编辑者",
-  "limited_to_n_editors_plural": "仅限 __count__ 名编辑者",
+  "licenses": "许可证",
+  "limited_document_history": "有限的文档历史记录",
+  "limited_to_n_collaborators_per_project": "每个项目仅限 __count__ 位合作者",
+  "limited_to_n_collaborators_per_project_plural": "每个项目仅限 __count__ 位合作者",
   "line_height": "行高 (编辑器)",
   "line_width_is_the_width_of_the_line_in_the_current_environment": "行宽是当前环境下行的宽度。例如：单列布局中的全页宽度或两列布局中的半页宽度。",
   "link": "链接",
@@ -1013,12 +1182,14 @@
   "link_accounts": "链接帐户",
   "link_accounts_and_add_email": "链接帐户并添加电子邮件",
   "link_institutional_email_get_started": "将机构电子邮件地址链接到您的帐户以开始。",
+  "link_overleaf_with_git": "将 __appName__ 与 Git 链接，以便在您的存储库之间实现无缝的项目同步和版本控制。",
   "link_sharing": "分享链接",
   "link_sharing_is_off_short": "链接共享已关闭",
   "link_sharing_is_on": "通过链接分享功能已开启。",
   "link_to_github": "建立与您的GitHub账户的关联",
   "link_to_github_description": "您需要授权 __appName__ 访问您的GitHub账户，从而允许我们同步您的项目。",
   "link_to_mendeley": "关联至Mendeley",
+  "link_to_papers": "链接到 Papers",
   "link_to_zotero": "关联至Zotero",
   "link_your_accounts": "链接您的帐户",
   "linked_accounts": "关联账户",
@@ -1067,6 +1238,7 @@
   "login_to_accept_invitation": "登录以接受邀请",
   "login_to_overleaf": "登录到Overleaf",
   "login_with_service": "使用__service__登录",
+  "login_with_sso": "通过 SSO 登录到 Overleaf",
   "logs_and_output_files": "日志和生成的文件",
   "longer_compile_timeout": "更长的 <0>编译时间</0>",
   "longer_compile_timeout_on_faster_servers": "在更快的服务器上拥有更长编译时限",
@@ -1074,6 +1246,7 @@
   "looks_like_logged_in_with_email": "您似乎已经使用 <b>__email__</b> 登录到 <b>__appName__</b>。",
   "looks_like_youre_at": "看起来你在<0>__institutionName__</0>！",
   "lost_connection": "网络连接已断开",
+  "main_bibliography_file_for_this_project": "该项目的主bib文件",
   "main_document": "主文档 (main tex)",
   "main_file_not_found": "未知主文件",
   "main_navigation": "主导航栏",
@@ -1110,6 +1283,7 @@
   "managing_your_subscription": "管理您的订阅",
   "march": "三月",
   "marked_as_resolved": "标记为已解决",
+  "math": "数学公式",
   "math_display": "数学表达式",
   "math_inline": "行内数学符号",
   "maximum_files_uploaded_together": "最多可同时上传__max__个文件",
@@ -1118,6 +1292,7 @@
   "member_picker": "选择团体计划的用户数量",
   "members_management": "成员管理",
   "mendeley": "Mendeley",
+  "mendeley_dynamic_sync_description": "通过 Mendeley 集成，您可以将参考文献导入 __appName__。您可以一次性导入所有参考文献，也可以直接从 __appName__ 动态搜索您的 Mendeley 文献库。",
   "mendeley_groups_loading_error": "从 Mendeley 加载群组时出错",
   "mendeley_groups_relink": "访问您的 Mendeley 数据时出错。 这可能是由于缺乏权限造成的。 请重新关联您的帐户并重试。",
   "mendeley_integration": "Mendeley 集成",
@@ -1126,6 +1301,8 @@
   "mendeley_reference_loading_error_expired": "Mendeley令牌过期，请重新关联您的账户",
   "mendeley_reference_loading_error_forbidden": "无法加载Mendeley的参考文献，请重新关联您的账户后重试",
   "mendeley_sync_description": "集成 Mendeley 后，您可以将 mendeley 的参考文献导入 __appName__ 项目。",
+  "mendeley_upgrade_prompt_content": "关联您的 Mendeley 帐户，即可直接在项目中搜索并添加 Mendeley 中的参考文献——它们将自动添加到您的 .bib 文件中。或者，您也可以将它们作为文件导入到您的 __appName__ 项目中。",
+  "mendeley_upgrade_prompt_title": "引用自 Mendeley",
   "menu": "菜单",
   "merge": "合并",
   "merge_cells": "合并单元格",
@@ -1133,14 +1310,18 @@
   "message_received": "收到消息",
   "missing_field_for_entry": "缺少字段",
   "missing_fields_for_entry": "缺少字段",
+  "missing_payment_details": "缺少付款详情",
   "money_back_guarantee": "30天无理由退款",
   "month": "月",
+  "month_plural": "个月",
   "monthly": "每个月",
   "more": "更多",
   "more_actions": "更多操作",
+  "more_collabs_per_project": "每个项目有更多合作者",
+  "more_comments": "更多评论",
+  "more_compile_time": "更长的编译时间",
   "more_info": "更多信息",
   "more_options": "更多选择",
-  "more_options_for_border_settings_coming_soon": "更多的边框设置选项即将推出。",
   "more_project_collaborators": "<0>更多</0>项目<0>合作者</0>",
   "more_than_one_kind_of_snippet_was_requested": "在Overleaf打开此内容的链接包含一些无效参数。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "most_popular_uppercase": "最受欢迎的",
@@ -1160,6 +1341,7 @@
   "navigate_log_source": "导航到源代码中的日志位置：__location__",
   "navigation": "导航",
   "nearly_activated": "还有一步您的 __appName__ 账户就会被激活了！",
+  "need_20_plus_users_discount": "20 位以上用户？<0>联系销售人员</0>获取最佳折扣。",
   "need_anything_contact_us_at": "您有任何需要，请直接联系我们",
   "need_contact_group_admin_to_make_changes": "如果您想对帐户进行某些更改，则需要联系群组管理员。 <0>了解有关托管用户的更多信息。</0>",
   "need_make_changes": "你需要做一些修改",
@@ -1169,6 +1351,7 @@
   "new_compile_domain_notice": "我们最近将 PDF 下载迁移到了新域，可能会阻止您的浏览器访问新域 <0>__compilesUserContentDomain__</0>。 这可能是由网络阻止或严格的浏览器插件规则引起的。 请查阅我们的<1>问题排查指南</1>。",
   "new_file": "新建文件",
   "new_folder": "新建目录",
+  "new_font_open_dyslexic": "新字体：OpenDyslexic Mono 旨在提高阅读障碍患者的可读性。",
   "new_name": "新名字",
   "new_password": "新密码",
   "new_project": "创建新项目",
@@ -1197,8 +1380,10 @@
   "no_featured_templates": "无特色模板",
   "no_folder": "没有文件夹",
   "no_image_files_found": "没有找到图片文件",
+  "no_libraries_selected": "未选择任何库",
   "no_members": "没有成员",
   "no_messages": "无消息",
+  "no_messages_yet": "还没有任何消息",
   "no_new_commits_in_github": "自上次合并后GitHub未收到新的提交",
   "no_one_has_commented_or_left_any_suggestions_yet": "目前还没有人发表评论或留下任何建议。",
   "no_other_projects_found": "找不到其他项目，请先创建另一个项目",
@@ -1217,9 +1402,11 @@
   "no_symbols_found": "找不到符号",
   "no_thanks_cancel_now": "不，谢谢，我还是想取消",
   "no_update_email": "不，更新邮件",
+  "non_deletable_entity": "指定的条目不能被删除",
   "normal": "常规",
   "normally_x_price_per_month": "通常每月__price__",
   "normally_x_price_per_year": "通常每年__price__",
+  "not_a_student": "不是学生？",
   "not_found_error_from_the_supplied_url": "在Overleaf打开此内容的链接指向找不到的文件。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "not_managed": "未被托管",
   "not_now": "稍后",
@@ -1236,6 +1423,7 @@
   "number_collab_info": "您可以邀请与您一起处理项目的人数。每个项目都有限制，因此您可以邀请不同的人参与每个项目。",
   "number_of_projects": "项目的数量",
   "number_of_users": "用户数量",
+  "numbered_list": "有序列表",
   "oauth_orcid_description": " <a href=\"__link__\">通过将您的 ORCID iD 链接到您的__appName__帐户</a>，安全地建立您的身份。提交给参与发布者的文件将自动包含您的ORCID iD，以改进工作流和可见性。 ",
   "october": "十月",
   "off": "关闭",
@@ -1257,28 +1445,33 @@
   "only_group_admin_or_managers_can_delete_your_account_4": "一旦您成为托管用户，就无法再更改回来。 <0>了解有关托管 Overleaf 帐户的更多信息。</0>",
   "only_group_admin_or_managers_can_delete_your_account_5": "有关更多信息，请参阅我们的使用条款中的“托管帐户”部分，您可以通过单击“接受邀请”来同意该条款",
   "only_importer_can_refresh": "只有最初导入此 __provider__ 文件的人才能刷新它。",
+  "open_action_menu": "打开__name__操作菜单",
   "open_advanced_reference_search": "打开高级引用搜索",
   "open_as_template": "作为模版打开",
   "open_file": "编辑文件",
   "open_link": "前往页面",
   "open_path": "打开 __path__",
+  "open_pdf_in_separate_tab": "在单独的选项卡中打开 PDF",
   "open_project": "打开项目",
   "open_target": "前往目标",
   "opted_out_linking": "您已选择取消将您的 <b>__email__</b> <b>__appName__</b> 帐户绑定到您的机构帐户。",
   "optional": "选填",
   "or": "或者",
   "organization": "组织",
+  "organization_does_not_support_sso": "您的组织尚不支持 SSO，但您仍然可以使用您的电子邮件地址进行注册。",
   "organization_name": "组织名",
   "organization_or_company_name": "组织或公司名称",
   "organization_or_company_type": "组织或公司类型",
-  "organize_projects": "分类管理项目",
+  "organize_tags": "管理标签",
   "original_price": "原价",
   "other": "其他",
   "other_actions": "其他",
+  "other_causes_of_compile_timeouts": "编译超时的其他原因",
   "other_logs_and_files": "其他日志和文件",
   "other_output_files": "下载其他输出文件",
   "other_sessions": "其他会话",
   "other_ways_to_log_in": "其他登录方式",
+  "our_team_will_get_back_to_you_shortly": "我们的团队将尽快回复您。",
   "our_values": "我们的价值观",
   "out_of_sync": "同步失败",
   "out_of_sync_detail": "很抱歉，此文件无法同步，我们需要刷新整个页面。<0></0><1>有关详细信息，请参阅本帮助指南</1>",
@@ -1291,7 +1484,9 @@
   "overleaf_history_system": "Overleaf 历史跟踪系统",
   "overleaf_individual_plans": "Overleaf 个人计划",
   "overleaf_labs": "Overleaf Labs",
+  "overleaf_logo": "Overleaf Logo",
   "overleaf_plans_and_pricing": "overleaf 计划和价格",
+  "overleaf_template_gallery": "Overleaf 模板库",
   "overview": "概览",
   "overwrite": "覆盖",
   "overwriting_the_original_folder": "覆盖原始文件夹将删除它及其包含的所有文件。",
@@ -1300,6 +1495,20 @@
   "page_current": "页面 __page__，当前页面",
   "page_not_found": "找不到页面",
   "pagination_navigation": "分页导航",
+  "papers": "Papers",
+  "papers_dynamic_sync_description": "通过 Papers 集成，您可以将参考文献导入 __appName__。您可以一次性导入所有参考文献，也可以直接从 __appName__ 动态搜索 Papers 库。",
+  "papers_groups_loading_error": "从 Papers 加载库时出错",
+  "papers_groups_relink": "访问您的 Papers 数据时出错。这可能是由于权限不足造成的。请重新关联您的帐户并重试。",
+  "papers_integration": "Papers 基成",
+  "papers_is_premium": "Papers 集成是一项付费功能",
+  "papers_presentations_reports_and_more": "论文、演示文稿、报告等，以 LaTeX 编写并由我们的社区发布。",
+  "papers_reference_loading_error": "无法从 Papers 中加载引文",
+  "papers_reference_loading_error_expired": "Papers 令牌已过期，请重新链接您的帐户",
+  "papers_reference_loading_error_forbidden": "无法从 Papers 中加载参考文献，请重新链接您的帐户并重试",
+  "papers_sync_description": "通过 Papers 集成，您可以将 Papers 中的参考资料导入到您的 __appName__ 项目中。",
+  "papers_upgrade_prompt_content": "关联您的 Papers 帐户，即可直接在项目中搜索并添加 Papers 中的参考文献——它们将自动添加到您的 .bib 文件中。或者，您也可以将它们作为文件导入到您的 __appName__ 项目中。",
+  "papers_upgrade_prompt_title": "从 Papers 引用",
+  "paragraph_styles": "段落样式",
   "partial_outline_warning": "文件大纲已过期。它将在您编辑文档时自行更新",
   "password": "密码",
   "password_cant_be_the_same_as_current_one": "密码不能和当前的完全一样",
@@ -1311,6 +1520,7 @@
   "password_managed_externally": "密码设置由外部管理",
   "password_reset": "重置密码",
   "password_reset_email_sent": "已给您发送邮件以完成密码重置",
+  "password_reset_sentence_case": "重设密码",
   "password_reset_token_expired": "您的密码重置链接已过期。请申请新的密码重置email，并按照email中的链接操作。",
   "password_too_long_please_reset": "超过最大密码长度限制。请重新设置密码。",
   "password_updated": "密码已更新",
@@ -1318,14 +1528,21 @@
   "paste_options": "粘贴选项",
   "paste_with_formatting": "粘贴并附带格式",
   "paste_without_formatting": "粘贴纯文本",
+  "pause_subscription": "暂停订阅",
+  "pause_subscription_for": "暂停订阅",
+  "pay_now": "现在付款",
   "payment_method_accepted": "__paymentMethod__ 已接受",
   "payment_provider_unreachable_error": "抱歉，与我们的支付提供商交谈时出错。请稍后再试。\n如果您在浏览器中使用任何广告或脚本阻止扩展，则可能需要暂时禁用它们。",
   "payment_summary": "付款摘要",
+  "pdf": "PDF",
   "pdf_compile_in_progress_error": "之前的编译仍在运行。 请稍等片刻，然后再尝试编译。",
   "pdf_compile_rate_limit_hit": "编译率达到限制",
   "pdf_compile_try_again": "请等待其他项目编译完成后再试",
+  "pdf_couldnt_compile": "无法编译 PDF",
   "pdf_in_separate_tab": "PDF 为单独的选项卡",
+  "pdf_only": "仅 PDF",
   "pdf_only_hide_editor": "仅 PDF <0>(隐藏编辑器)</0>",
+  "pdf_preview": "PDF 预览",
   "pdf_preview_error": "显示此项目的编译结果时出现问题。",
   "pdf_rendering_error": "PDF渲染错误",
   "pdf_unavailable_for_download": "PDF 无法下载",
@@ -1333,13 +1550,20 @@
   "pdf_viewer_error": "显示此项目的PDF时出现问题。",
   "pending": "待定",
   "pending_additional_licenses": "您的订阅正在更改为包括<0>__pendingAdditionalLicenses__</0>个附加许可证，总共有<1>__pendingTotalLicenses__</1>个许可证。",
+  "pending_addon_cancellation": "您的订阅将会在当前结算期结束时更改为删除 <strong>__addOnName__</strong> 附加组件。",
   "pending_invite": "等待中的邀请",
+  "per_license": "每个许可证",
   "per_month": "每个月",
+  "per_month_billed_annually": "每月，每年计费",
+  "per_user_month": "每用户/月",
   "per_user_year": "每个用户 / 每年",
   "per_year": "每年",
   "percent_is_the_percentage_of_the_line_width": "% 是行宽的百分比",
+  "permanently_disables_the_preview": "永久禁用预览",
   "personal": "个人",
+  "personal_library": "个人库",
   "personalized_onboarding": "个性化入门",
+  "pick_up_where_you_left_off": "从上次中断的地方继续",
   "pl": "波兰语",
   "plan": "计划",
   "plan_tooltip": "你在__plan__计划中。点击了解如何充分利用您的 Overleaf 高级功能。",
@@ -1347,7 +1571,7 @@
   "plans_amper_pricing": "套餐 & 价格",
   "plans_and_pricing": "计划与定价",
   "plans_and_pricing_lowercase": "套餐 & 价格",
-  "please_ask_the_project_owner_to_upgrade_more_editors": "请要求项目所有者升级他们的计划，以允许更多的编辑者。",
+  "please_ask_the_project_owner_to_upgrade_more_collaborators": "请要求项目所有者升级他们的计划以允许更多的合作者。",
   "please_ask_the_project_owner_to_upgrade_to_track_changes": "请要求项目所有者升级以使用历史查询功能。",
   "please_change_primary_to_remove": "请更改您的主要电子邮件以删除它",
   "please_check_your_inbox_to_confirm": "请检查您的电子邮件收件箱以确认您属于<0>__institutionName__</0> 。",
@@ -1363,6 +1587,7 @@
   "please_link_before_making_primary": "请确认您的电子邮件链接到您的机构帐户，然后再将其作为主要电子邮件。",
   "please_provide_a_message": "请提供消息",
   "please_provide_a_subject": "请提供主题",
+  "please_provide_a_valid_email_address": "请提供有效的电子邮件地址",
   "please_reconfirm_institutional_email": "请花点时间确认您的机构电子邮件地址，或<0>将其从您的帐户中删除</0>。",
   "please_reconfirm_your_affiliation_before_making_this_primary": "请确认您的从属关系，然后再将此作为主要。",
   "please_refresh": "请刷新页面以继续",
@@ -1376,10 +1601,12 @@
   "please_wait": "请稍后",
   "plus_additional_collaborators_document_history_track_changes_and_more": "（以及更多协作者、文档历史记录、跟踪更改等付费功能）。",
   "plus_more": "加上更多",
+  "plus_x_additional_licenses_for_a_total_of_y_licenses": "另加 <0>__additionalLicenses__</0> 个附加许可证，总计 <1>__count__ 个许可证</1>",
   "popular_tags": "热门标签",
   "portal_add_affiliation_to_join": "您似乎已经登录到 __appName__！如果你有一封 __portalTitle__ 邮件，现在就可以添加了。",
   "position": "职位",
   "postal_code": "邮政编码",
+  "premium": "Premium",
   "premium_feature": "Premium 功能",
   "premium_features": "高级功能",
   "premium_plan_label": "您正在使用 <b>Overleaf Premium</b>",
@@ -1413,17 +1640,24 @@
   "progress_bar_percentage": "进度条从 0 到 100%",
   "project": "项目",
   "project_approaching_file_limit": "此项目已接近文件限制",
+  "project_failed_to_compile": "您的项目编译失败",
   "project_figure_modal": "项目",
+  "project_files": "项目文件",
   "project_flagged_too_many_compiles": "因频繁编译，项目被标旗。编译上限会稍后解除。",
   "project_has_too_many_files": "此项目已达到 2000 个文件限制",
   "project_last_published_at": "您的项目最近一次被发布在",
   "project_layout_sharing_submission": "项目布局、分享和提交",
+  "project_linked_to": "该项目链接到",
   "project_name": "项目名称",
   "project_not_linked_to_github": "该项目未与GitHub任一存储库关联。您可以在GitHub中为该项目创建一个存储库：",
   "project_ownership_transfer_confirmation_1": "是否确定要将 <0>__user__</0> 设为 <1>__project__</1> 的所有者？",
   "project_ownership_transfer_confirmation_2": "此操作无法撤消。新所有者将收到通知，并可以更改项目访问权限设置（包括删除您自己的访问权限）。",
   "project_renamed_or_deleted": "项目已重命名或删除",
   "project_renamed_or_deleted_detail": "该项目已被外部数据源（例如 Dropbox）重命名或删除。 我们不想删除您在 Overleaf 上的数据，因此该项目仍然包含您的历史记录和合作者。 如果项目已重命名，请在项目列表中查找新名称下的新项目。",
+  "project_search_file_count": "在 __count__ 个文件",
+  "project_search_file_count_plural": "在 __count__ 个文件",
+  "project_search_result_count": "__count__ 个结果",
+  "project_search_result_count_plural": "__count__ 个结果",
   "project_synchronisation": "项目同步",
   "project_timed_out_enable_stop_on_first_error": "<0>启用“出现第一个错误时停止”</0>可帮助您立即查找并修复错误。",
   "project_timed_out_fatal_error": "<0>致命编译错误</0>可能会彻底阻止编译。",
@@ -1446,6 +1680,7 @@
   "publishing": "正在发表",
   "pull_github_changes_into_sharelatex": "将GitHub中的更改调入  __appName__",
   "push_sharelatex_changes_to_github": "将 __appName__ 中的更改推送到GitHub",
+  "push_to_github_pull_to_overleaf": "推送到 GitHub，拉取到 __appName__",
   "quoted_text": "引用文本",
   "raw_logs": "原始日志",
   "raw_logs_description": "来自 LaTeX 编译器的原始日志",
@@ -1455,7 +1690,7 @@
   "read_lines_from_path": "从 __path__ 读取行",
   "read_more": "阅读更多",
   "read_more_about_free_compile_timeouts_servers": "阅读有关免费计划编译超时和服务器更改的更多信息",
-  "read_only": "只读",
+  "read_only_dropbox_sync_message": "作为只读查看者，您可以将当前项目版本同步到 Dropbox，但在 Dropbox 中所做的更改<0>不会</0>同步回 Overleaf。",
   "read_only_token": "只读令牌",
   "read_write_token": "可读写令牌",
   "ready_to_join_x": "您已加入 __inviterName__",
@@ -1469,11 +1704,14 @@
   "recaptcha_conditions": "本网站受reCAPTCHA保护，谷歌<1>隐私政策</1>和<2>服务条款</2>适用。",
   "recent": "最近的",
   "recent_commits_in_github": "GitHub中最近的提交",
+  "recommended": "推荐的",
   "recompile": "重新编译",
   "recompile_from_scratch": "从头开始重新编译",
   "recompile_pdf": "重新编译该PDF",
   "reconfirm": "再次确认",
+  "reconfirm_account": "重新确认账户",
   "reconfirm_explained": "我们需要再次确认你的帐户。请通过以下表格申请密码重置链接，以重新确认您的帐户。如果您在重新确认您的帐户时有任何问题，请联系我们",
+  "reconfirm_secondary_email": "为了增强您的__appName__账户的安全性，请重新确认您的辅助电子邮件地址__emailAddress__。",
   "reconnect": "重试",
   "reconnecting": "正在重新连接",
   "reconnecting_in_x_secs": "__seconds__ 秒后重新连接",
@@ -1482,12 +1720,18 @@
   "redirect_to_editor": "重定向到编辑器",
   "redirect_url": "重定向 URL",
   "redirecting": "重定向中",
+  "redo": "撤销",
   "reduce_costs_group_licenses": "您可以通过我们的团体优惠许可证减少工作并降低成本。",
   "reference_error_relink_hint": "如果仍出现此错误，请尝试在此重新关联您的账户：",
+  "reference_manager_searched_groups": "__provider__ 搜索组",
   "reference_managers": "引文管理",
   "reference_search": "高级搜索",
   "reference_search_info_new": "轻松查找您的参考文献——按作者、标题、年份或期刊搜索。",
+  "reference_search_setting": "引文搜索",
+  "reference_search_settings": "引文搜索设置",
+  "reference_search_style": "参考搜索样式",
   "reference_sync": "同步参考文献",
+  "references_from_these_libraries_will_be_included_in_your_reference_search_results": "这些库的参考文献将包含在您的参考文献搜索结果中。",
   "refresh": "刷新",
   "refresh_page_after_linking_dropbox": "请在将您的帐户链接到Dropbox后刷新此页。",
   "refresh_page_after_starting_free_trial": "请在您开始免费试用之后刷新此页面",
@@ -1504,6 +1748,7 @@
   "registration_error": "注册错误",
   "reject": "不要",
   "reject_change": "拒绝修改",
+  "reject_selected_changes": "拒绝选定的更改",
   "related_tags": "相关标签",
   "relink_your_account": "重新链接您的帐户",
   "reload_editor": "重新加载编辑器",
@@ -1524,7 +1769,10 @@
   "rename": "重命名",
   "rename_project": "重命名项目",
   "renaming": "重命名中",
+  "renews_on": "续订日期：<0>__date__</0>",
   "reopen": "重新打开",
+  "reopen_comment_error_message": "重新打开您的评论时出错。请稍后重试。",
+  "reopen_comment_error_title": "重新打开评论错误",
   "replace_figure": "替换图片",
   "replace_from_another_project": "从另一个项目替换",
   "replace_from_computer": "从本地计算机替换",
@@ -1532,6 +1780,7 @@
   "replace_from_url": "从 URL 替换",
   "reply": "回复",
   "repository_name": "存储库名称",
+  "repository_visibility": "仓库可见性",
   "republish": "重新发布",
   "request_new_password_reset_email": "请求发送重置密码电子邮件",
   "request_overleaf_common": "请求 Overleaf Commons",
@@ -1544,19 +1793,21 @@
   "resend": "重发",
   "resend_confirmation_code": "重新发送确认码",
   "resend_confirmation_email": "重新发送确认电子邮件",
-  "resend_email": "重新发送电子邮件",
   "resend_group_invite": "重新发送群组邀请",
   "resend_link_sso": "重新发送 SSO 邀请",
   "resend_managed_user_invite": "重新发送托管用户邀请",
   "resending_confirmation_code": "重新发送确认码",
-  "resending_confirmation_email": "重新发送确认电子邮件",
   "reset_password": "重置密码",
   "reset_password_link": "单击此链接重置您的密码",
+  "reset_password_sentence_case": "重设密码",
   "reset_your_password": "重置您的密码",
   "resize": "调整大小",
   "resolve": "解决",
   "resolve_comment": "解决评论",
+  "resolve_comment_error_message": "解析评论时出错。请稍后重试。",
+  "resolve_comment_error_title": "解决评论错误",
   "resolved_comments": "已折叠的评论",
+  "resources": "资源",
   "restore": "恢复",
   "restore_file": "恢复文件",
   "restore_file_confirmation_message": "您当前的文件将恢复到 __date__ __time__ 的版本。",
@@ -1577,7 +1828,10 @@
   "reverse_x_sort_order": "反向__x__排序顺序",
   "revert_pending_plan_change": "撤销计划的套餐更改",
   "review": "审阅",
-  "review_your_peers_work": "同行评议",
+  "review_panel": "审阅面板",
+  "reviewer": "审阅者",
+  "reviewer_dropbox_sync_message": "作为审阅者，您可以将当前项目版本同步到 Dropbox，但在 Dropbox 中所做的更改<0>不会</0>同步回 Overleaf。",
+  "reviewing": "审阅",
   "revoke": "撤回",
   "revoke_invite": "撤销邀请",
   "right": "右对齐",
@@ -1587,6 +1841,7 @@
   "saml": "SAML",
   "saml_auth_error": "很抱歉，您的身份提供程序响应时出错。有关详细信息，请与管理员联系。",
   "saml_authentication_required_error": "其他登录方法已被您的群组管理员禁用。 请使用您的群组 SSO 登录。",
+  "saml_commons_unavailable": "机构单点登录 (SSO) 目前不可用。更多详情，请参阅 <0>__linkText__</0>。",
   "saml_create_admin_instructions": "输入邮箱，创建您的第一个__appName__管理员账户。这个账户对应您在SAML系统中的账户，请使用此账户登陆系统。",
   "saml_email_not_recognized_error": "此电子邮件地址未设置为SSO。请检查并重试，或者与管理员联系。",
   "saml_identity_exists_error": "很抱歉，您的身份提供商返回的身份已链接到另一个Overleaf帐户。有关详细信息，请与您的管理员联系。",
@@ -1597,17 +1852,20 @@
   "saml_login_identity_not_found_error": "抱歉，我们无法找到为此身份提供商设置单点登录的 Overleaf 帐户。",
   "saml_metadata": "Overleaf SAML 元数据",
   "saml_missing_signature_error": "抱歉，从您的身份提供商收到的信息未签名（响应和断言签名都是必需的）。 请联系您的管理员以获取更多信息。",
+  "saml_missing_user_attribute": "您的单点登录身份验证出现问题。您的组织未提供完成身份验证所需的信息。请联系您的管理员获取更多信息。",
   "saml_response": "SAML 响应：",
   "save": "保存",
   "save_20_percent": "节省 20%",
   "save_or_cancel-cancel": "取消",
   "save_or_cancel-or": "或者",
   "save_or_cancel-save": "保存",
+  "save_x_or_more": "节省 __percentage__  或更多",
   "saving": "正在保存",
   "saving_notification_with_seconds": "保存 __docname__... (剩余 __seconds__ 秒)",
   "search": "搜索",
   "search_all_project_files": "搜索所有的项目文件",
   "search_bib_files": "按作者、标题、年份搜索",
+  "search_by_author_journal_title_and_more_link_to_zotero_mendeley_papers": "按作者、期刊、标题等进行搜索。链接到 Zotero、Mendeley 或 Papers，直接在您的项目中搜索和添加您图书馆中的参考文献。",
   "search_by_citekey_author_year_title": "通过引文的关键词、作者、标题、年份搜索",
   "search_command_find": "查找",
   "search_command_replace": "替换",
@@ -1618,7 +1876,9 @@
   "search_in_your_projects": "在您的项目中搜索",
   "search_match_case": "区分大小写",
   "search_next": "下一个",
+  "search_only_the_bib_files_in_your_project_only_by_citekeys": "仅通过 citekeys 搜索项目中的 .bib 文件。",
   "search_previous": "上一个",
+  "search_project": "搜索项目",
   "search_projects": "搜索项目",
   "search_references": "搜索此项目中的.bib文件",
   "search_regexp": "正则表达式",
@@ -1626,12 +1886,13 @@
   "search_replace_all": "全部替换",
   "search_replace_with": "以...替换",
   "search_search_for": "搜索",
+  "search_this_file": "在当前文件搜索",
   "search_whole_word": "完整词组",
   "search_within_selection": "在选择范围内",
   "searched_path_for_lines_containing": "在 __path__ 中搜索包含“__query__”的行",
   "secondary_email_password_reset": "该电子邮件已注册为辅助电子邮件。请输入您帐户的主要电子邮件。",
   "security": "安全性",
-  "see_changes_in_your_documents_live": "实时查看文档修改情况",
+  "see_suggestions_from_collaborators": "查看合作者的建议",
   "select_a_column_or_a_merged_cell_to_align": "选择要对齐的列或合并的单元格",
   "select_a_column_to_adjust_column_width": "选择一列来调整列宽",
   "select_a_file": "选择一个文件",
@@ -1649,6 +1910,7 @@
   "select_all_projects": "全选",
   "select_an_output_file": "选择输出文件",
   "select_an_output_file_figure_modal": "选择一个输出文件",
+  "select_bib_file": "选择 .bib 文件",
   "select_cells_in_a_single_row_to_merge": "在一行中选择单元格合并",
   "select_color": "选择颜色 __name__",
   "select_folder_from_project": "从项目中选择文件夹",
@@ -1658,9 +1920,9 @@
   "select_from_your_computer": "从您的电脑文件中选择",
   "select_github_repository": "选取要导入 __appName__ 的GitHub存储库",
   "select_image_from_project_files": "从项目文件中选择图片",
-  "select_monthly_plans": "选择用于月计划",
   "select_project": "选择 __project__",
   "select_projects": "选择项目",
+  "select_size": "选择大小",
   "select_tag": "选择标签__tagName__",
   "select_user": "选择用户",
   "selected": "选择的",
@@ -1669,6 +1931,7 @@
   "send": "发送",
   "send_first_message": "向你的合作者发送第一条信息",
   "send_message": "发送消息",
+  "send_request": "发送请求",
   "send_test_email": "发送测试邮件",
   "sending": "发送中",
   "sent": "发送",
@@ -1697,13 +1960,17 @@
   "shortcut_to_open_advanced_reference_search": "(<strong>__ctrlSpace__</strong> 或 <strong>__altSpace__</strong>)",
   "show_all_projects": "显示全部项目",
   "show_document_preamble": "显示文档导言部分",
+  "show_equation_preview": "显示公式预览",
+  "show_file_tree": "显示文件树",
   "show_hotkeys": "显示快捷键",
   "show_in_code": "在代码中显示",
   "show_in_pdf": "在 PDF 中显示",
   "show_less": "折叠",
+  "show_live_equation_previews_while_typing": "键入时显示实时公式预览",
   "show_local_file_contents": "显示本地文件内容",
   "show_more": "显示更多",
   "show_outline": "显示文件大纲",
+  "show_version_history": "显示版本历史记录",
   "show_x_more_projects": "再显示 __x__ 个项目",
   "showing_1_result": "显示 1 个结果",
   "showing_1_result_of_total": "显示 1 个结果（共计 __total__ ）",
@@ -1712,6 +1979,8 @@
   "showing_x_results_of_total": "显示  __x__ 个结果（共计__total__ ）",
   "sign_up": "注册",
   "sign_up_for_free": "免费注册",
+  "sign_up_for_free_account": "注册免费帐户并接收定期更新",
+  "simple_search_mode": "简易搜索",
   "single_sign_on_sso": "单点登录 (SSO)",
   "site_description": "一个简洁的在线 LaTeX 编辑器。无需安装，实时共享，版本控制，数百免费模板……",
   "site_wide_option_available": "提供站点范围的选项",
@@ -1732,7 +2001,10 @@
   "sorry_it_looks_like_that_didnt_work_this_time": "抱歉！这次似乎没有成功。请重试。",
   "sorry_something_went_wrong_opening_the_document_please_try_again": "很抱歉，尝试在Overleaf打开此内容时发生意外错误。请再试一次。",
   "sorry_there_are_no_experiments": "抱歉，Overleaf Labs 目前没有正在进行任何实验。",
+  "sorry_there_was_an_issue_adding_x_users_to_your_subscription": "抱歉，向您的订阅添加__count__个用户时出现问题。请<0>联系我们的支持团队</0>寻求帮助。",
+  "sorry_there_was_an_issue_upgrading_your_subscription": "抱歉，升级您的订阅时出现问题。请<0>联系我们的支持团队</0>寻求帮助。",
   "sorry_this_account_has_been_suspended": "抱歉，该账户已被暂停。",
+  "sorry_you_can_only_change_to_group_from_trial_via_support": "抱歉，您只能通过联系支持人员在免费试用期间更改为团体计划。",
   "sorry_your_table_cant_be_displayed_at_the_moment": "抱歉，您的表格暂时无法显示。",
   "sorry_your_token_expired": "抱歉，您的令牌已过期",
   "sort_by": "排序方式",
@@ -1740,6 +2012,9 @@
   "sort_projects": "排序项目",
   "source": "源代码",
   "spell_check": "拼写检查",
+  "spellcheck": "拼写检查",
+  "spellcheck_language": "拼写检查语言",
+  "split_view": "拆分视图",
   "sso": "单点登录(SSO)",
   "sso_account_already_linked": "帐户已链接到另一个__appName__用户",
   "sso_active": "SSO 激活",
@@ -1797,6 +2072,7 @@
   "start_by_fixing_the_first_error_in_your_doc": "首先修复文档中的第一个错误，以避免以后出现问题。",
   "start_free_trial": "开始免费试用",
   "start_free_trial_without_exclamation": "开始免费试用",
+  "start_the_conversation_by_saying_hello_or_sharing_an_update": "通过打招呼或分享最新动态来开始对话",
   "start_typing_find_your_company": " 开始键入以查找您的公司",
   "start_typing_find_your_organization": "开始键入以查找您的组织",
   "start_typing_find_your_university": "开始键入以查找您的大学",
@@ -1812,6 +2088,7 @@
   "stretch_width_to_text": "拉伸宽度适应文本",
   "student": "学生",
   "student_disclaimer": "教育折扣适用于中学和高等教育机构（学校和大学）的所有学生。 我们可能会与您联系以确认您是否有资格享受折扣。",
+  "student_verification_required": "需要学生验证",
   "students": "学生",
   "subject": "主题",
   "subject_area": "主题区",
@@ -1820,6 +2097,7 @@
   "submit_title": "提交",
   "subscribe": "提交",
   "subscribe_to_find_the_symbols_you_need_faster": "订阅以更快地找到您需要的符号",
+  "subscribe_to_plan": "订阅 __planName__",
   "subscription": "订购",
   "subscription_admins_cannot_be_deleted": "订阅时不能删除您的帐户。请取消订阅并重试。如果您一直看到此消息，请与我们联系。",
   "subscription_canceled": "订阅已取消",
@@ -1833,14 +2111,22 @@
   "suggested_fix_for_error_in_path": "针对 __path__ 中的错误建议修复",
   "suggestion": "建议",
   "suggestion_applied": "应用建议的修改",
+  "suggests_code_completions_while_typing": "键入时开启自动补全建议",
   "support": "支持",
+  "support_for_your_browser_is_ending_soon": "对您的浏览器的支持即将结束",
+  "supports_up_to_x_licenses": "最多支持 <0>__count__ 个许可证</0>",
   "sure_you_want_to_cancel_plan_change": "是否确实要撤销计划的套餐更改？您将继续订阅<0>__planName__</0>。",
   "sure_you_want_to_change_plan": "您确定想要改变套餐为 <0>__planName__</0>？",
   "sure_you_want_to_delete": "您确定要永久删除以下文件吗？",
   "sure_you_want_to_leave_group": "您确定要退出该群吗？",
   "sv": "瑞典语",
+  "switch_compile_mode_for_faster_draft_compilation": "切换编译模式以加快草稿编译速度",
   "switch_to_editor": "切换到编辑器",
+  "switch_to_new_editor": "切换到新编辑器",
+  "switch_to_old_editor": "切换到旧编辑器",
   "switch_to_pdf": "切换到 PDF",
+  "switch_to_standard_plan": "切换到标准订阅计划",
+  "symbol": "符号",
   "symbol_palette": "数学符号面板",
   "symbol_palette_highlighted": "<0>符号</0> 面板",
   "symbol_palette_info_new": "单击按钮即可将数学符号插入到您的文档中。",
@@ -1853,6 +2139,8 @@
   "syntax_validation": "代码检查",
   "tab_connecting": "与编辑器连接中",
   "tab_no_longer_connected": "该选项卡与编辑器已断开连接",
+  "table": "表格",
+  "table_generator": "表格生成器",
   "tag_color": "标签颜色",
   "tag_name_cannot_exceed_characters": "标签名称不能超过 __maxLength__ 个字符",
   "tag_name_is_already_used": "标签“__tagName__”已存在",
@@ -1860,8 +2148,6 @@
   "take_me_home": "我要返回！",
   "take_short_survey": "做一个简短的调查",
   "take_survey": "参加调查",
-  "tc_everyone": "所有人",
-  "tc_guests": "受邀用户",
   "tell_the_project_owner_and_ask_them_to_upgrade": "如果您需要更多编译时间，<0>告诉项目所有者</0>并要求他们升级其 Overleaf 计划。",
   "template": "模版",
   "template_approved_by_publisher": "该模板已获得发布者批准",
@@ -1872,7 +2158,9 @@
   "template_top_pick_by_overleaf": "该模板是由 Overleaf 工作人员精心挑选的高质量模版",
   "templates": "模板",
   "templates_admin_source_project": "管理员：源项目",
+  "templates_lowercase": "模版",
   "templates_page_title": "模板 - 期刊、简历、演示文稿、报告等",
+  "temporarily_hides_the_preview": "暂时隐藏预览",
   "ten_collaborators_per_project": "每个项目 10 位协作者",
   "ten_per_project": "每个项目 10 个",
   "terminated": "编译取消",
@@ -1887,17 +2175,28 @@
   "thank_you_for_being_part_of_our_beta_program": "感谢您参与我们的测试版计划，您可以<0>尽早使用新功能</0>并帮助我们更好地了解您的需求",
   "thank_you_for_your_feedback": "感谢您的反馈意见！",
   "thanks": "谢谢",
+  "thanks_for_being_part_of_this_labs_experiment_your_feedback_will_help_us_make_the_new_editor_the_best_yet": "感谢您参与本次实验室实验。您的反馈和支持将帮助我们打造迄今为止最出色的新编辑器！部分功能仍在开发中，如果您需要某些尚未使用的功能，可以切换回旧版编辑器。",
   "thanks_for_confirming_your_email_address": "感谢您确认邮件地址",
   "thanks_for_getting_in_touch": "感谢您联系我们。我们的团队将尽快通过电子邮件回复您。",
   "thanks_for_subscribing": "感谢订购！",
+  "thanks_for_subscribing_to_plan_with_add_on": "感谢您订阅带有 __addOnName__ 插件的 __planName__ 方案。正是像您这样的用户的支持，才使得 __appName__ 得以不断发展和完善。",
+  "thanks_for_subscribing_to_the_add_on": "感谢您订阅 __addOnName__ 插件。正是像您这样的用户的支持，才使得 __appName__ 得以不断发展和完善。",
   "thanks_for_subscribing_you_help_sl": "感谢您订阅 __planName__ 计划。 正是像您这样的人的支持才使得 __appName__ 能够继续成长和改进。",
   "thanks_settings_updated": "谢谢，您的设置已更新",
+  "the_add_on_will_remain_active_until": "该插件将一直有效，直到当前计费期结束。",
+  "the_code_editor_color_scheme": "代码编辑器配色方案",
+  "the_document_environment_contains_no_content": "文档环境未包含任何内容。如果为空，请添加一些内容并重新编译。",
   "the_file_supplied_is_of_an_unsupported_type ": "在Overleaf打开此内容的链接指向错误的文件类型。有效的文件类型是.tex文档和.zip文件。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "the_following_files_already_exist_in_this_project": "该项目中已存在以下文件：",
   "the_following_files_and_folders_already_exist_in_this_project": "此项目中已存在以下文件和文件夹：",
   "the_following_folder_already_exists_in_this_project": "该项目中已存在以下文件夹：",
   "the_following_folder_already_exists_in_this_project_plural": "该项目中已存在以下文件夹：",
+  "the_latex_engine_used_for_compiling": "用于编译的 LaTeX 引擎",
+  "the_new_overleaf_editor": "新的 Overleaf 编辑器",
+  "the_next_payment_will_be_collected_on": "下一笔付款将于<strong>__date__</strong>收取。",
   "the_original_text_has_changed": "原文本已发生改变，因此此建议无法应用",
+  "the_overleaf_color_scheme": "__appName__ 配色方案",
+  "the_primary_file_for_compiling_your_project": "编译项目的主要文件",
   "the_project_that_contains_this_file_is_not_shared_with_you": "包含此文件的项目未与您共享",
   "the_requested_conversion_job_was_not_found": "在Overleaf打开此内容的链接指定了找不到的转换作业。作业可能已过期，需要重新运行。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "the_requested_publisher_was_not_found": "在Overleaf打开此内容的链接指定了找不到的发布者。如果某个网站的链接经常出现这种情况，请向他们报告。",
@@ -1905,12 +2204,14 @@
   "the_supplied_parameters_were_invalid": "在Overleaf打开此内容的链接包含一些无效参数。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "the_supplied_uri_is_invalid": "在Overleaf打开此内容的链接包含无效的URI。如果某个网站的链接经常出现这种情况，请向他们报告。",
   "the_target_folder_could_not_be_found": "找不到目标文件夹。",
+  "the_version_of_tex_live_used_for_compiling": "用于编译的 TeX Live 版本",
   "the_width_you_choose_here_is_based_on_the_width_of_the_text_in_your_document": "您在此处选择的宽度基于文档中文本的宽度。 或者，您可以直接在 LaTeX 代码中自定义图像大小。",
   "their_projects_will_be_transferred_to_another_user": "他们的项目将全部转移给您选择的另一个用户",
   "theme": "主题",
   "then_x_price_per_month": "接着每月__price__",
   "then_x_price_per_year": "接着每年__price__",
   "there_are_lots_of_options_to_edit_and_customize_your_figures": "有很多选项可用于编辑和自定义图形，例如在图形周围环绕文本、旋转图像或在单个图形中包含多个图像。 您需要编辑 LaTeX 代码才能执行此操作。 <0>了解具体方法</0>",
+  "there_is_an_unrecoverable_latex_error": "存在无法恢复的 LaTeX 错误。如果下方或原始日志中显示 LaTeX 错误，请尝试修复它们并重新编译。",
   "there_was_a_problem_restoring_the_project_please_try_again_in_a_few_moments_or_contact_us": "恢复项目时出现问题。请稍后重试。如果问题仍然存在，请联系我们。",
   "there_was_an_error_opening_your_content": "创建项目时出错",
   "thesis": "论文",
@@ -1922,18 +2223,25 @@
   "this_experiment_isnt_accepting_new_participants": "此实验不接受新参与者。",
   "this_field_is_required": "此字段必填",
   "this_grants_access_to_features_2": "这将授予您访问 <0>__appName__</0> <0>__featureType__</0> 功能的权限。",
+  "this_is_a_labs_experiment_for_the_new_overleaf_editor_some_features_are_still_in_progress": "这是新版 Overleaf 编辑器的实验室实验。部分功能仍在开发中，如果您需要某些尚未使用的功能，可以随时切换回旧版编辑器。",
+  "this_is_a_new_feature": "这是一个新功能",
+  "this_is_the_file_that_references_pulled_from_your_reference_manager_will_be_added_to": "这是将从参考文献管理器中提取的参考文献添加到的文件。",
   "this_is_your_template": "这是从你的项目提取的模版",
-  "this_project_already_has_maximum_editors": "此项目的编辑者人数已达到所有者方案允许的最大数量。这意味着您可以查看但无法编辑该项目。",
+  "this_project_already_has_maximum_collaborators": "此项目的协作者人数已达到所有者方案允许的上限。这意味着您可以查看该项目，但无法编辑或审核。",
+  "this_project_contains_a_file_called_output": "该项目包含一个名为 output.pdf 的文件。如果该文件存在，请重命名并重新编译。",
+  "this_project_exceeded_collaborator_limit": "此项目超出了您方案的协作者限制。所有其他用户现在都只有查看权限。",
   "this_project_exceeded_compile_timeout_limit_on_free_plan": "该项目超出了我们免费计划的编译超时限制。",
-  "this_project_exceeded_editor_limit": "此项目超出了您的方案的编辑者限制。所有协作者现在都只有查看权限。",
   "this_project_has_more_than_max_collabs": "此项目的协作者数量超出了项目所有者的 Overleaf 计划允许的最大数量。这意味着您可能会失去 __linkSharingDate__ 的编辑权限。",
   "this_project_is_public": "此项目是公共的，可以被任何人通过URL编辑",
   "this_project_is_public_read_only": "该项目是公开的，任何人都可以通过该URL查看，但是不能编辑。",
+  "this_project_need_more_time_to_compile": "看起来这个项目可能需要比我们的免费计划允许的更多时间来编译。",
   "this_project_will_appear_in_your_dropbox_folder_at": "此项目将显示在您的Dropbox的目录 ",
   "this_tool_helps_you_insert_figures": "该工具可帮助您将图片插入项目中，而无需编写 LaTeX 代码。 以下信息详细介绍了该工具中的选项以及如何进一步自定义您的图片。",
   "this_tool_helps_you_insert_simple_tables_into_your_project_without_writing_latex_code_give_feedback": "该工具可帮助您将简单的表格插入项目中，而无需编写 LaTeX 代码。 该工具是新工具，因此请<0>向我们提供反馈</0>并留意即将推出的其他功能。",
+  "this_total_reflects_the_amount_due_until": "此总额反映从今天到<strong>__date__</strong>（即您现有计划的结算期结束）为止的应付金额。",
   "this_was_helpful": "很有帮助",
   "this_wasnt_helpful": "没有帮助",
+  "this_will_remove_primary_email": "请注意，此操作还会从帐户中移除电子邮件地址 <b>__email__</b>，因为它是未经确认的电子邮件地址。如果您想保留它，请先确认。",
   "three_free_collab": "3个免费的合作者",
   "timedout": "超时",
   "tip": "提示",
@@ -1944,14 +2252,18 @@
   "to_confirm_email_address_you_must_be_logged_in_with_the_requesting_account": "要确认电子邮件地址，您必须使用<b>请求新的辅助电子邮件的 Overleaf 帐户</b>来<b>登录</b>。",
   "to_confirm_transfer_enter_email_address": "要接受邀请，请输入与您的帐户关联的电子邮件地址。",
   "to_confirm_unlink_all_users_enter_email": "要确认您要取消所有用户的链接，请输入您的电子邮件地址：",
+  "to_continue_using_upgrade_or_change_your_browser": "要继续顺利使用 __appName__，您需要升级或更改为<0>受支持的浏览器</0>。",
+  "to_delete_your_writefull_account": "要删除您的 Writefull 帐户，或检查您是否有帐户，请联系 <a>__email__</a>。",
   "to_fix_this_you_can": "要解决此问题，您可以：",
   "to_fix_this_you_can_ask_the_github_repository_owner": "要解决此问题，您可以要求 GitHub 存储库所有者 (<0>__repoOwnerEmail__</0>) 续订其 __appName__ 订阅并重新连接项目。",
   "to_insert_or_move_a_caption_make_sure_tabular_is_directly_within_table": "要插入或移动标题，请确保 \\begin{tabular} 直接位于table环境中",
   "to_keep_edit_access": "要保留编辑权限，请要求项目所有者升级其计划或减少具有编辑权限的人数。",
   "to_many_login_requests_2_mins": "您的账户尝试登录次数过多。请等待2分钟后再试",
   "to_modify_your_subscription_go_to": "如需修改您的订阅，请到",
+  "to_pull_results_directly_from_your_reference_manager_enable_one_of_the_available_reference_manager_integrations": "要直接从参考文献管理器中提取结果，请<0>启用其中一个可用的参考文献管理器集成</0>。",
   "to_use_text_wrapping_in_your_table_make_sure_you_include_the_array_package": "<0>请注意：</0> 要在表格中使用文本换行，请确保在文档序言中包含 <1>array</1> 包：",
   "toggle_compile_options_menu": "切换编译选项菜单",
+  "toggle_unknown_group": "切换未知组",
   "token": "令牌",
   "token_access_failure": "无法授予访问权限；联系项目负责人寻求帮助",
   "token_limit_reached": "您已达到 10 个令牌的限制。 要生成新的身份验证令牌，请删除现有的身份验证令牌。",
@@ -1969,9 +2281,13 @@
   "took_a_while": "这会花一段时间...",
   "toolbar_bullet_list": "无序列表",
   "toolbar_choose_section_heading_level": "选择章节标题级别",
+  "toolbar_code_visual_editor_switch": "代码和可视化编辑器切换",
   "toolbar_decrease_indent": "减少缩进",
+  "toolbar_editor": "编辑器工具",
   "toolbar_format_bold": "粗体格式",
   "toolbar_format_italic": "斜体格式",
+  "toolbar_generate_math": "生成数学公式",
+  "toolbar_generate_table": "生成表格",
   "toolbar_increase_indent": "增加缩进",
   "toolbar_insert_citation": "插入引文",
   "toolbar_insert_cross_reference": "插入交叉引用",
@@ -1980,7 +2296,11 @@
   "toolbar_insert_inline_math": "插入行内数学公式",
   "toolbar_insert_link": "插入链接",
   "toolbar_insert_math": "插入数学公式",
+  "toolbar_insert_math_and_symbols": "插入数学公式或符号",
+  "toolbar_insert_math_lowercase": "插入数学公式",
+  "toolbar_insert_misc": "插入杂项（链接、引文、交叉引用、图表、表格）",
   "toolbar_insert_table": "插入表格",
+  "toolbar_list_indentation": "列表和缩进",
   "toolbar_numbered_list": "有序列表",
   "toolbar_redo": "重做",
   "toolbar_selected_projects": "选择的项目",
@@ -1989,26 +2309,29 @@
   "toolbar_selected_projects_restore": "恢复选定的项目",
   "toolbar_table_insert_size_table": "插入 __size__  表格",
   "toolbar_table_insert_table_lowercase": "插入表格",
+  "toolbar_text_formatting": "文本格式",
+  "toolbar_text_style": "文本样式",
   "toolbar_toggle_symbol_palette": "数学符号面板开关",
   "toolbar_undo": "撤销",
+  "toolbar_undo_redo_actions": "撤消/重做操作",
+  "tools": "工具",
   "tooltip_hide_filetree": "单击以隐藏文件树",
+  "tooltip_hide_panel": "单击隐藏面板",
   "tooltip_hide_pdf": "单击隐藏PDF",
   "tooltip_show_filetree": "单击以显示文件树",
+  "tooltip_show_panel": "单击显示面板",
   "tooltip_show_pdf": "单击显示PDF",
   "top_pick": "首选",
   "total": "总计",
+  "total_due_today": "今日应付总额",
   "total_per_month": "每月总计",
   "total_per_year": "每年合计",
   "total_per_year_lowercase": "每年合计",
+  "total_today": "今日总计",
   "total_with_subtotal_and_tax": "总计：每年 <0> __total__ </0>（__subtotal__ + __tax__税）",
   "total_words": "总字数",
   "tr": "土耳其语",
-  "track_any_change_in_real_time": "实时记录文档的任何修改情况",
   "track_changes": "修订",
-  "track_changes_for_everyone": "跟踪每个人的更改",
-  "track_changes_for_x": "跟踪 __name__ 的更改",
-  "track_changes_is_off": "修改追踪功能 <strong>关闭</strong>",
-  "track_changes_is_on": "修改追踪功能 <strong>开启</strong>",
   "tracked_change_added": "已添加",
   "tracked_change_deleted": "已删除",
   "transfer_management_of_your_account": "Overleaf 账户的转移管理",
@@ -2031,9 +2354,11 @@
   "try_for_free": "免费试用",
   "try_it_for_free": "免费体验",
   "try_now": "立刻尝试",
+  "try_papers_for_free": "免费尝试 Papers",
   "try_premium_for_free": "免费试用 Premium",
   "try_recompile_project_or_troubleshoot": "请尝试从头开始重新编译项目，如果仍然无效，请按照我们的<0>问题排查指南</0>进行操作。",
   "try_relinking_provider": "您似乎需要重新链接您的 __provider__ 帐户。",
+  "try_the_new_editor": "尝试新的编辑器",
   "try_to_compile_despite_errors": "忽略错误编译",
   "turn_off": "关闭",
   "turn_off_link_sharing": "关闭通过链接分享功能。",
@@ -2049,14 +2374,17 @@
   "undelete": "恢复删除",
   "undeleting": "取消删除",
   "understanding_labels": "了解标签",
+  "undo": "撤消",
   "unfold_line": "展开线",
   "unique_identifier_attribute": "唯一标识符属性",
   "university": "大学",
   "university_school": "大学或学校名称",
   "unknown": "未知",
+  "unknown_group": "未知组",
   "unlimited": "无限制",
   "unlimited_collaborators_per_project": "每个项目的合作者数量不受限制",
   "unlimited_collabs": "无限制的合作者数",
+  "unlimited_document_history": "无限文档历史记录",
   "unlimited_projects": "项目无限制",
   "unlink": "取消关联",
   "unlink_all_users": "取消所有用户的链接",
@@ -2077,11 +2405,13 @@
   "unlink_warning_reference": "警告：如果将账户与此提供者取消关联，您将无法把参考文献导入到项目中。",
   "unlinking": "取消链接",
   "unmerge_cells": "取消合并单元格",
+  "unpause_subscription": "取消暂停订阅",
   "unpublish": "未出版",
   "unpublishing": "取消发布",
   "unsubscribe": "取消订阅",
   "unsubscribed": "订阅被取消",
   "unsubscribing": "正在取消订阅",
+  "until_then_you_can_still": "在此之前，您仍然可以：",
   "untrash": "恢复",
   "update": "更新",
   "update_account_info": "更新账户信息",
@@ -2093,16 +2423,25 @@
   "upgrade": "升级",
   "upgrade_cc_btn": "现在升级，7天后付款",
   "upgrade_for_12x_more_compile_time": "升级以获得 12 倍以上的编译时间",
+  "upgrade_my_plan": "升级我的计划",
   "upgrade_now": "现在升级",
-  "upgrade_to_add_more_editors_and_access_collaboration_features": "升级以添加更多编辑器并访问协作功能，如跟踪更改和完整的项目历史记录。",
+  "upgrade_plan": "升级计划",
+  "upgrade_summary": "升级摘要",
+  "upgrade_to_add_more_collaborators_and_access_collaboration_features": "升级以添加更多合作者并访问协作功能，如跟踪更改和完整的项目历史记录。",
   "upgrade_to_get_feature": "升级以获得__feature__，以及：",
-  "upgrade_to_track_changes": "升级以记录文档修改历史",
+  "upgrade_to_review": "升级以获取评论",
+  "upgrade_to_unlock_more_time": "立即升级即可在我们最快的服务器上解锁 12 倍以上的编译时间。",
+  "upgrade_your_subscription": "升级您的订阅",
   "upload": "上传",
   "upload_failed": "上传失败",
+  "upload_file": "上传文件",
   "upload_from_computer": "从电脑本地上传",
   "upload_project": "上传项目",
   "upload_zipped_project": "上传项目的压缩包",
   "url_to_fetch_the_file_from": "获取文件的URL",
+  "us_gov_banner_fedramp": "<0>现已获得 FedRAMP® 授权，可用于 LI-SaaS：</0>Overleaf 的 Group Professional 订阅。需要隔离部署吗？我们也提供本地部署解决方案。请联系我们的美国联邦政府团队。",
+  "us_gov_banner_government_purchasing": "<0>获取适用于美国联邦政府的 __appName__。</0>使用我们量身定制的采购方案，加快采购流程。请联系我们的政府团队。",
+  "us_gov_banner_small_business_reseller": "<0>轻松为美国联邦政府采购。</0>我们与小型企业经销商合作，帮助您购买 Overleaf 组织方案。请联系我们的政府团队。",
   "usage_metrics": "使用指标",
   "use_a_different_password": "请使用不同的密码",
   "use_saml_metadata_to_configure_sso_with_idp": "使用 Overleaf SAML 元数据通过您的身份提供商配置 SSO。",
@@ -2127,13 +2466,19 @@
   "using_latex": "使用 LaTeX",
   "using_premium_features": "使用高级功能",
   "using_the_overleaf_editor": "使用 __appName__ 编辑器",
+  "using_writefull": "使用 Writefull",
   "valid": "有效的",
   "valid_sso_configuration": "有效的 SSO 配置",
   "validation_issue_entry_description": "阻止此项目编译的验证问题",
+  "value_must_be_a_number": "值必须是数字",
+  "value_must_be_a_whole_number": "值必须是整数",
+  "value_must_be_at_least_x": "值必须至少为 __value__",
   "vat": "增值税",
   "vat_number": "增值税号",
   "verify_email_address_before_enabling_managed_users": "在启用托管用户之前，您需要验证您的电子邮件地址。",
+  "view": "查看",
   "view_all": "预览所有",
+  "view_billing_details": "查看账单详情",
   "view_code": "查看代码",
   "view_configuration": "查看配置",
   "view_group_members": "查看群组成员",
@@ -2141,6 +2486,7 @@
   "view_hub_subtext": "访问和下载订阅统计数据和用户列表",
   "view_in_template_gallery": "在模板库查看",
   "view_invitation": "查看邀请",
+  "view_invoices": "查看发票",
   "view_labs_experiments": "查看实验性的内容",
   "view_less": "查看更少",
   "view_logs": "查看日志",
@@ -2150,29 +2496,39 @@
   "view_more": "查看更多",
   "view_only_access": "只读访问",
   "view_only_downgraded": "仅可查看。升级可恢复编辑权限。",
+  "view_only_reviewer_downgraded": "仅限查看。升级即可恢复查看权限。",
   "view_options": "查看选项",
   "view_pdf": "查看 PDF",
   "view_source": "查看源代码",
   "view_your_invoices": "查看您的账单",
-  "viewer": "查看者",
+  "viewer": "查看者(只读)",
+  "viewing": "视图",
   "viewing_x": "正在查看<0>__endTime__</0>",
   "visual_editor": "可视化编辑器",
   "visual_editor_is_only_available_for_tex_files": "可视化编辑器仅适用于 TeX 文件",
   "want_access_to_overleaf_premium_features_through_your_university": "想要通过您的大学访问__appName__高级功能吗？",
   "want_change_to_apply_before_plan_end": "如果您希望在当前计费周期结束前应用此更改，请与我们联系。",
+  "we_are_unable_to_generate_the_pdf_at_this_time": "我们目前无法生成 pdf。",
   "we_are_unable_to_opt_you_into_this_experiment": "目前我们无法让您加入此实验，请确保您的组织已允许此功能，或稍后重试。",
   "we_cant_confirm_this_email": "我们无法确认此电子邮件",
   "we_cant_find_any_sections_or_subsections_in_this_file": "在此文件中找不到任何 sections 或 subsections",
   "we_do_not_share_personal_information": "有关我们如何处理您的个人数据的详细信息，请参阅我们的<0>隐私声明</0>",
+  "we_got_your_request": "我们已经收到了你的请求",
   "we_logged_you_in": "我们已为您登录。",
   "we_may_also_contact_you_from_time_to_time_by_email_with_a_survey": "<0>我们也可能联系您</0> 通过电子邮件进行调查，或询问您是否愿意参与其他用户研究计划",
+  "we_sent_code": "我们已向您发送确认码",
   "we_sent_new_code": "我们发送了一个新代码。如果您没有收到，请检查您的垃圾邮件和任何促销邮件等。",
+  "we_will_charge_you_now_for_the_cost_of_your_additional_licenses_based_on_remaining_months": "我们将根据您当前订阅的剩余月份向您收取额外许可证的费用。",
+  "we_will_charge_you_now_for_your_new_plan_based_on_the_remaining_months_of_your_current_subscription": "我们将根据您当前订阅的剩余月份向您收取新订阅的费用。",
+  "we_will_use_your_existing_payment_method": "我们将使用您现有的付款方式<strong>__paymentMethod__</strong>。",
   "webinars": "在线教程",
   "website_status": "网站状态",
   "wed_love_you_to_stay": "我们希望你留下来",
   "welcome_to_sl": "欢迎使用 __appName__",
+  "well_be_here_when_youre_ready": "当您准备好回归时，我们还在这里！🦆",
   "were_making_some_changes_to_project_sharing_this_means_you_will_be_visible": "我们正在<0>对项目共享进行一些更改</0>。这意味着，作为具有编辑权限的人，项目所有者和其他编辑者将可以看到您的姓名和电子邮件地址。",
   "were_performing_maintenance": "我们正在对Overleaf进行维护，您需要等待片刻。很抱歉给您带来不便。编辑器将在 __seconds__ 秒后自动刷新。",
+  "were_redesigning_our_editor_to_make_it_easier_to_use": "我们正在重新设计我们的编辑器，使其更易于使用，并确保其面向未来。请试用并向我们提供反馈，帮助我们改进。（部分功能仍在开发中，您可以随时切换回之前的版本。）",
   "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_this_project": "我们最近<0>降低了免费计划的编译超时限制</0>，这可能会影响这个项目。",
   "weve_recently_reduced_the_compile_timeout_limit_which_may_have_affected_your_project": "我们最近<0>降低了免费计划的编译时限</0>，这可能会影响这个项目。",
   "what_do_you_need": "你需要什么？",
@@ -2184,19 +2540,25 @@
   "when_you_join_labs": "加入实验室后，您可以选择要参与的实验。完成此操作后，您可以正常使用 Overleaf，但您会看到所有实验室功能都标有此徽章：",
   "when_you_tick_the_include_caption_box": "当您勾选“包含标题”框时，图像将带有占位符标题插入到文档中。 要编辑它，您只需选择占位符文本并键入以将其替换为您自己的文本。",
   "why_latex": "为何用 LaTeX?",
+  "why_might_this_happen": "为什么会这样？",
+  "why_not_pause_instead": "暂停一下，从上次中断的地方继续",
   "wide": "宽松的",
   "will_lose_edit_access_on_date": "将于 __date__ 失去编辑权限",
   "will_need_to_log_out_from_and_in_with": "您需要从 <b>__email1__</b> 帐户<b>注销</b>，然后使用 <b>__email2__</b> 登录。",
   "with_premium_subscription_you_also_get": "通过Overleaf Premium订阅，您还可以获得",
   "word_count": "字数统计",
+  "work_in_vim_or_emacs_emulation_mode": "在 Vim 或 Emacs 模拟编辑器下工作",
   "work_offline": "离线工作",
+  "work_offline_pull_to_overleaf": "离线工作，然后拉取到__appName__",
   "work_or_university_sso": "工作/高校账户 单点登录",
   "work_with_non_overleaf_users": "和非Overleaf用户一起工作",
+  "work_with_other_github_users": "与其他 GitHub 用户合作",
   "writefull": "Writefull",
   "writefull_loading_error_body": "尝试刷新页面，如果无效，尝试禁用所有的浏览器拓展，以便检查是否他们阻止了 Writefull 的加载。",
   "writefull_loading_error_title": "Writefull 加载失败",
   "x_changes_in": "__count__ 处变化在",
   "x_changes_in_plural": "__count__ 处变化在",
+  "x_libraries_accessed_in_this_project": "本项目中访问的 __provider__ 库",
   "x_price_for_first_month": "首月 <0>__price__</0>",
   "x_price_for_first_year": "首年 <0>__price__</0>",
   "x_price_for_y_months": "您前 __discountMonths__ 个月的费用：<0>__price__</0>",
@@ -2221,21 +2583,32 @@
   "you_are_on_x_plan_as_member_of_group_subscription_y_administered_by_z": "您作为<1>__groupName__</1>群组订阅的<1>成员</1>加入了我们的<0>__planName__</0>计划，该群组订阅由<1>__adminEmail__</1>管理",
   "you_can_also_choose_to_view_anonymously_or_leave_the_project": "您还可以选择<0>匿名查看</0>（您将失去编辑权限）或<1>离开项目</1>。",
   "you_can_buy_this_plan_but_not_as_a_trial": "您可以购买此计划，但不能试用，因为您最近已经完成试用。",
+  "you_can_leave_the_experiment_from_your_account_settings_at_any_time": "您可以随时从您的<0>帐户设置</0>退出实验。",
+  "you_can_manage_your_reference_manager_integrations_from_your_account_settings_page": "您可以从<0>帐户设置页面</0>管理参考文献管理集成。",
   "you_can_now_enable_sso": "现在，您可以在“组设置”页面上启用SSO。",
   "you_can_now_log_in_sso": "您现在可以通过您的机构登录，如果符合条件，您将获得<0>__appName__ 专业功能</0>。",
+  "you_can_now_sync_your_papers_library_directly_with_your_overleaf_projects": "您现在可以将您的论文库直接与 Overleaf 项目同步",
   "you_can_opt_in_and_out_of_the_program_at_any_time_on_this_page": "您可以随时在此页面上<0>选择加入和退出</0>该计划",
   "you_can_request_a_maximum_of_limit_fixes_per_day": "您每天最多可以请求 __limit__ 个修复。请明天再试。",
-  "you_can_select_or_invite": "您可以在当前计划中选择或邀请__count__位编辑者，或者升级以获得更多编辑者。",
-  "you_can_select_or_invite_plural": "您可以在当前计划中选择或邀请__count__位编辑者，也可以升级以获得更多编辑者。",
+  "you_can_select_or_invite_collaborator": "您可以在当前套餐中选择或邀请__count__位协作者。升级即可添加更多编辑者或审阅者。",
+  "you_can_select_or_invite_collaborator_plural": "您可以在当前订阅中选择或邀请__count__位协作者。升级即可添加更多编辑者或审阅者。",
+  "you_can_still_use_your_premium_features": "在暂停生效之前，您仍然可以使用高级功能。",
   "you_cant_add_or_change_password_due_to_sso": "您无法添加或更改密码，因为您的群组或组织使用<0>单点登录 (SSO)</0>。",
   "you_cant_join_this_group_subscription": "您无法加入此团队订阅",
   "you_cant_reset_password_due_to_sso": "您无法重置密码，因为您的群组或组织使用 SSO。 <0>使用单点登录登录</0>。",
+  "you_dont_have_any_add_ons_on_your_account": "您的帐户中没有任何附加组件。",
   "you_dont_have_any_repositories": "您没有任何仓库",
+  "you_have_0_free_suggestions_left": "您还剩余 0 条建议",
+  "you_have_1_free_suggestion_left": "您还剩 1 条建议",
+  "you_have_1_license_and_your_plan_supports_up_to_y": "您有 1 个许可证并且您的计划最多支持 __groupSize__。",
   "you_have_added_x_of_group_size_y": "您已经添加 <0>__addedUsersSize__</0> / <1>__groupSize__</1> 个可用成员。",
   "you_have_been_invited_to_transfer_management_of_your_account": "您已被邀请转移您帐户的管理权。",
   "you_have_been_invited_to_transfer_management_of_your_account_to": "您已被邀请将帐户管理转移到__groupName__。",
   "you_have_been_removed_from_this_project_and_will_be_redirected_to_project_dashboard": "您已从该项目中删除，将不再有权访问该项目。您将被立即重定向到项目面板。",
+  "you_have_x_licenses_and_your_plan_supports_up_to_y": "您拥有__addedUsersSize__许可证并且您的计划最多支持__groupSize__。",
+  "you_have_x_licenses_on_your_subscription": "您的订阅中有 __groupSize__ 许可证。",
   "you_need_to_configure_your_sso_settings": "在启用SSO之前，您需要配置并测试SSO设置",
+  "you_unpaused_your_subscription": "您已取消暂停订阅。",
   "you_will_be_able_to_contact_us_any_time_to_share_your_feedback": "您可以随时联系我们分享您的反馈",
   "you_will_be_able_to_reassign_subscription": "您可以将他们的订阅成员资格重新分配给组织中的其他人",
   "youll_get_best_results_in_visual_but_can_be_used_in_source": "尽管您仍可使用此工具在<1>代码编辑器</1>中插入表格，但在<0>可视化编辑器</0>中使用此工具将获得最佳结果。 选择所需的行数和列数后，表格将出现在文档中，您可以双击单元格向其中添加内容。",
@@ -2244,9 +2617,14 @@
   "your_account_is_managed_by_admin_cant_join_additional_group": "您的__appName__帐户由您当前的组管理员（__admin__）管理。这意味着您不能加入其他组订阅<0>阅读有关托管用户的更多信息</0>",
   "your_account_is_managed_by_your_group_admin": "您的帐户由您的群组管理员管理。 您无法更改或删除您的电子邮件地址。",
   "your_account_is_suspended": "你的账户暂时无法使用",
+  "your_add_on_has_been_cancelled_and_will_remain_active_until_your_billing_cycle_ends_on": "您的附加组件已被取消，并将一直有效，直到您的结算周期于 __nextBillingDate__ 结束",
   "your_affiliation_is_confirmed": "您已确认属于<0>__institutionName__</0>。",
   "your_browser_does_not_support_this_feature": "很抱歉，您的浏览器不支持此功能。请将浏览器更新到最新版本。",
+  "your_changes_will_save": "当我们恢复连接时，您的更改将会保存。",
   "your_compile_timed_out": "您的编译超时",
+  "your_current_plan": "您当前的计划",
+  "your_current_plan_gives_you": "通过暂停订阅，您将能够在再次需要时更快地访问高级功能。",
+  "your_current_plan_supports_up_to_x_licenses": "您当前的计划最多支持__users__个许可证。",
   "your_current_project_will_revert_to_the_version_from_time": "您当前的项目将恢复到时间戳为 __timestamp__ 的版本",
   "your_git_access_info": "当进行 Git 操作时，若系统提示您输入密码，请输入您的 Git 身份验证令牌。",
   "your_git_access_info_bullet_1": "您最多可以拥有 10 个令牌。",
@@ -2264,26 +2642,36 @@
   "your_plan_is_changing_at_term_end": "在当前计费周期结束时，您的计划将更改为<0>__pendingPlanName__</0>。",
   "your_plan_is_limited_to_n_editors": "您的计划允许 __count__ 位合作者拥有编辑权限和无限位查看者。",
   "your_plan_is_limited_to_n_editors_plural": "您的计划允许 __count__ 位合作者拥有编辑权限和无限数量的查看者。",
+  "your_premium_plan_is_paused": "您的高级计划已<0>暂停</0>。",
+  "your_project_exceeded_collaborator_limit": "您的项目超出了协作者限制，访问级别已更改。请为您的协作者选择新的访问级别，或升级以添加更多编辑者或审阅者。",
   "your_project_exceeded_compile_timeout_limit_on_free_plan": "你的项目超过了我们免费计划的编译时限。",
-  "your_project_exceeded_editor_limit": "您的项目超出了编辑者限制，访问级别已更改。请为您的协作者选择新的访问级别，或升级以添加更多编辑者。",
   "your_project_near_compile_timeout_limit": "对于我们的免费计划，你的项目已经达到编译时限。",
+  "your_project_need_more_time_to_compile": "看起来您的项目可能需要比我们的免费计划允许的更多时间来编译。",
   "your_projects": "您的项目",
   "your_questions_answered": "常见问题",
   "your_role": "您的角色",
   "your_sessions": "我的会话",
   "your_subscription": "您的订阅",
   "your_subscription_has_expired": "您的订购已过期",
+  "your_subscription_will_pause_on": "您的 <0>__planName__</0> 订阅将于 <0>__pauseDate__</0> 暂停。它将于 <0>__reactivationDate__</0> 自动取消暂停。您也可以随时自行取消暂停。",
+  "your_subscription_will_pause_on_short": "您的订阅将于 <0>__pauseDate__</0> 暂停。",
   "youre_a_member_of_overleaf_labs": "您是 Overleaf Labs 的成员。别忘了定期查看您可以报名参加哪些实验。",
   "youre_about_to_disable_single_sign_on": "您将禁用所有群成员的单点登录。",
   "youre_about_to_enable_single_sign_on": "您即将启用单点登录（SSO）。在执行此操作之前，您应该确保您确信SSO配置是正确的，并且您的所有组成员都具有托管用户帐户。",
   "youre_about_to_enable_single_sign_on_sso_only": "您即将启用单点登录 (SSO)。 在执行此操作之前，您应该确保 SSO 配置正确。",
+  "youre_adding_x_licenses_to_your_plan_giving_you_a_total_of_y_licenses": "您正在向您的计划添加 <0>__adding__</0> 个许可证，使您的计划总共拥有 <1>__total__</1> 个许可证。",
   "youre_already_setup_for_sso": "您已完成 SSO 设置",
+  "youre_helping_us_shape_the_future_of_overleaf": "您正在帮助我们创造 Overleaf 的未来",
   "youre_joining": "您正在加入",
   "youre_on_free_trial_which_ends_on": "您正在享受免费试用，试用期将于<0>__date__</0>结束。",
   "youre_signed_in_as_logout": "您已使用 <0>__email__</0> 登录。 <1>退出。</1>",
   "youre_signed_up": "您已注册",
-  "youve_lost_edit_access": "您已失去编辑连接",
+  "youve_added_more_licenses": "您已添加更多许可证！",
+  "youve_added_x_more_licenses_to_your_subscription_invite_people": "您已向订阅添加了__users__个许可证。<0>邀请其他人</0>。",
+  "youve_lost_collaboration_access": "您已失去协作访问权限",
+  "youve_paused_your_subscription": "您的<0>__planName__</0>订阅已暂停，直至<0>__reactivationDate__</0>，之后将自动取消暂停。您可以随时提前取消暂停。",
   "youve_unlinked_all_users": "您已取消所有用户的关联",
+  "youve_upgraded_your_plan": "您已升级您的计划！",
   "zh-CN": "中文",
   "zip_contents_too_large": "压缩包太大",
   "zoom_in": "放大",
@@ -2291,6 +2679,7 @@
   "zoom_to": "缩放至",
   "zotero": "Zotero",
   "zotero_and_mendeley_integrations": "<0>Zotero</0> 与 <0>Mendeley</0> 集成",
+  "zotero_dynamic_sync_description": "通过 Zotero 集成，您可以将参考文献导入 __appName__。您可以一次性导入所有参考文献，也可以直接从 __appName__ 动态搜索 Zotero 库。",
   "zotero_groups_loading_error": "从 Zotero 加载群组时出错",
   "zotero_groups_relink": "访问您的Zotero数据时出错。这可能是由于缺乏权限造成的。请重新链接您的帐户，然后重试。",
   "zotero_integration": "Zotero 集成",
@@ -2298,5 +2687,7 @@
   "zotero_reference_loading_error": "错误，无法加载Zotero的参考文献",
   "zotero_reference_loading_error_expired": "Zotero令牌过期，请重新关联您的账户",
   "zotero_reference_loading_error_forbidden": "无法加载Zotero的参考文献，请重新关联您的账户后重试",
-  "zotero_sync_description": "集成 Zotero 后，您可以将 Zotero 的参考文献导入__appName__项目。"
+  "zotero_sync_description": "集成 Zotero 后，您可以将 Zotero 的参考文献导入__appName__项目。",
+  "zotero_upgrade_prompt_content": "关联您的 Zotero 帐户，即可直接在项目中搜索并添加 Zotero 中的参考文献——它们将自动添加到您的 .bib 文件中。或者，您也可以将它们作为文件导入到您的 __appName__ 项目中。",
+  "zotero_upgrade_prompt_title": "引用自 Zotero"
 }
diff --git a/services/web/migrations/20190912145020_create_projectHistoryMetaData_indexes.mjs b/services/web/migrations/20190912145020_create_projectHistoryMetaData_indexes.mjs
index ef9115a8bf..9272afc2e7 100644
--- a/services/web/migrations/20190912145020_create_projectHistoryMetaData_indexes.mjs
+++ b/services/web/migrations/20190912145020_create_projectHistoryMetaData_indexes.mjs
@@ -1,6 +1,7 @@
 /* eslint-disable no-unused-vars */
 
 import Helpers from './lib/helpers.mjs'
+import mongodb from '../app/src/infrastructure/mongodb.js'
 
 const tags = ['saas']
 
@@ -13,17 +14,19 @@ const indexes = [
   },
 ]
 
-const migrate = async client => {
-  const { db } = client
-
-  await Helpers.addIndexesToCollection(db.projectHistoryMetaData, indexes)
+const migrate = async () => {
+  await Helpers.addIndexesToCollection(
+    await mongodb.getCollectionInternal('projectHistoryMetaData'),
+    indexes
+  )
 }
 
-const rollback = async client => {
-  const { db } = client
-
+const rollback = async () => {
   try {
-    await Helpers.dropIndexesFromCollection(db.projectHistoryMetaData, indexes)
+    await Helpers.dropIndexesFromCollection(
+      await mongodb.getCollectionInternal('projectHistoryMetaData'),
+      indexes
+    )
   } catch (err) {
     console.error('Something went wrong rolling back the migrations', err)
   }
diff --git a/services/web/migrations/20210310111225_create_deletedFiles_projectId_index.mjs b/services/web/migrations/20210310111225_create_deletedFiles_projectId_index.mjs
index 543f794b09..57dcb4e21f 100644
--- a/services/web/migrations/20210310111225_create_deletedFiles_projectId_index.mjs
+++ b/services/web/migrations/20210310111225_create_deletedFiles_projectId_index.mjs
@@ -1,4 +1,5 @@
 import Helpers from './lib/helpers.mjs'
+import { getCollectionInternal } from '../app/src/infrastructure/mongodb.js'
 
 const tags = ['server-ce', 'server-pro', 'saas']
 
@@ -11,14 +12,17 @@ const indexes = [
   },
 ]
 
-const migrate = async client => {
-  const { db } = client
-  await Helpers.addIndexesToCollection(db.deletedFiles, indexes)
+async function getCollection() {
+  // NOTE: The deletedFiles collection is not available to the application as it has been retired. Fetch it here.
+  return await getCollectionInternal('deletedFiles')
 }
 
-const rollback = async client => {
-  const { db } = client
-  await Helpers.dropIndexesFromCollection(db.deletedFiles, indexes)
+const migrate = async () => {
+  await Helpers.addIndexesToCollection(await getCollection(), indexes)
+}
+
+const rollback = async () => {
+  await Helpers.dropIndexesFromCollection(await getCollection(), indexes)
 }
 
 export default {
diff --git a/services/web/migrations/20210726083523_convert_confirmedAt_strings_to_dates.mjs b/services/web/migrations/20210726083523_convert_confirmedAt_strings_to_dates.mjs
index 8dbac841c6..064e365a86 100644
--- a/services/web/migrations/20210726083523_convert_confirmedAt_strings_to_dates.mjs
+++ b/services/web/migrations/20210726083523_convert_confirmedAt_strings_to_dates.mjs
@@ -1,12 +1,35 @@
-import updateStringDates from '../scripts/confirmed_at_to_dates.mjs'
+import { db } from '../app/src/infrastructure/mongodb.js'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
 
 const tags = ['saas']
 
-const migrate = async client => {
-  await updateStringDates()
+const migrate = async () => {
+  await batchedUpdate(
+    db.users,
+    { 'emails.confirmedAt': { $type: 'string' } },
+    async function (batch) {
+      for (const user of batch) {
+        for (const email of user.emails) {
+          if (typeof email.confirmedAt === 'string') {
+            await db.users.updateOne(
+              { _id: user._id, 'emails.email': email.email },
+              {
+                $set: {
+                  'emails.$.confirmedAt': new Date(
+                    email.confirmedAt.replace(/ UTC$/, '')
+                  ),
+                },
+              }
+            )
+          }
+        }
+      }
+    },
+    { emails: 1 }
+  )
 }
 
-const rollback = async client => {
+const rollback = async () => {
   /* nothing to do */
 }
 
diff --git a/services/web/migrations/20210726083523_convert_split_tests_assigned_at_strings_to_dates.mjs b/services/web/migrations/20210726083523_convert_split_tests_assigned_at_strings_to_dates.mjs
index 8dbac841c6..b13d636d0f 100644
--- a/services/web/migrations/20210726083523_convert_split_tests_assigned_at_strings_to_dates.mjs
+++ b/services/web/migrations/20210726083523_convert_split_tests_assigned_at_strings_to_dates.mjs
@@ -1,12 +1,29 @@
-import updateStringDates from '../scripts/confirmed_at_to_dates.mjs'
+import { db } from '../app/src/infrastructure/mongodb.js'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
 
 const tags = ['saas']
 
-const migrate = async client => {
-  await updateStringDates()
+const migrate = async () => {
+  await batchedUpdate(
+    db.users,
+    { splitTests: { $exists: true } },
+    async function (batch) {
+      for (const user of batch) {
+        const splitTests = user.splitTests
+        for (const splitTest of Object.values(user.splitTests)) {
+          for (const variant of splitTest) {
+            variant.assignedAt = new Date(variant.assignedAt)
+          }
+        }
+
+        await db.users.updateOne({ _id: user._id }, { $set: { splitTests } })
+      }
+    },
+    { splitTests: 1 }
+  )
 }
 
-const rollback = async client => {
+const rollback = async () => {
   /* nothing to do */
 }
 
diff --git a/services/web/migrations/20210727123346_ce_sp_backfill_deleted_files.mjs b/services/web/migrations/20210727123346_ce_sp_backfill_deleted_files.mjs
index 105627088f..310b7c12e6 100644
--- a/services/web/migrations/20210727123346_ce_sp_backfill_deleted_files.mjs
+++ b/services/web/migrations/20210727123346_ce_sp_backfill_deleted_files.mjs
@@ -1,14 +1,8 @@
-import runScript from '../scripts/back_fill_deleted_files.mjs'
-
 const tags = ['server-ce', 'server-pro', 'saas']
 
 const migrate = async client => {
-  const options = {
-    performCleanup: true,
-    letUserDoubleCheckInputsFor: 10,
-    fixPartialInserts: true,
-  }
-  await runScript(options)
+  // Skip back-filling. The deletedFiles collection will be deleted in a following migration.
+  // The projects.deletedFiles array will be purged as part of the later migration as well.
 }
 
 const rollback = async client => {}
diff --git a/services/web/migrations/20221111111111_ce_sp_convert_archived_state.mjs b/services/web/migrations/20221111111111_ce_sp_convert_archived_state.mjs
index 6adc8adb6e..284429cd2c 100644
--- a/services/web/migrations/20221111111111_ce_sp_convert_archived_state.mjs
+++ b/services/web/migrations/20221111111111_ce_sp_convert_archived_state.mjs
@@ -1,9 +1,56 @@
-import runScript from '../scripts/convert_archived_state.mjs'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { promiseMapWithLimit } from '@overleaf/promise-utils'
+import { db } from '../app/src/infrastructure/mongodb.js'
+import _ from 'lodash'
 
 const tags = ['server-ce', 'server-pro']
 
+const WRITE_CONCURRENCY = parseInt(process.env.WRITE_CONCURRENCY, 10) || 10
+
+function getAllUserIds(project) {
+  return _.unionWith(
+    [project.owner_ref],
+    project.collaberator_refs,
+    project.readOnly_refs,
+    project.tokenAccessReadAndWrite_refs,
+    project.tokenAccessReadOnly_refs,
+    (a, b) => a.toString() === b.toString()
+  )
+}
+
+async function migrateField(field) {
+  await batchedUpdate(
+    db.projects,
+    { [field]: false },
+    { $set: { [field]: [] } }
+  )
+
+  await batchedUpdate(
+    db.projects,
+    { [field]: true },
+    async nextBatch => {
+      await promiseMapWithLimit(WRITE_CONCURRENCY, nextBatch, async project => {
+        await db.projects.updateOne(
+          { _id: project._id },
+          { $set: { [field]: getAllUserIds(project) } }
+        )
+      })
+    },
+    {
+      _id: 1,
+      owner_ref: 1,
+      collaberator_refs: 1,
+      readOnly_refs: 1,
+      tokenAccessReadAndWrite_refs: 1,
+      tokenAccessReadOnly_refs: 1,
+    }
+  )
+}
+
 const migrate = async () => {
-  await runScript('FIRST,SECOND')
+  for (const field of ['archived', 'trashed']) {
+    await migrateField(field)
+  }
 }
 
 const rollback = async () => {}
diff --git a/services/web/migrations/20230110140452_rename_recurly_cached_status.mjs b/services/web/migrations/20230110140452_rename_recurly_cached_status.mjs
index 227555b4e3..37608bc1a1 100644
--- a/services/web/migrations/20230110140452_rename_recurly_cached_status.mjs
+++ b/services/web/migrations/20230110140452_rename_recurly_cached_status.mjs
@@ -1,13 +1,12 @@
-/* eslint-disable no-unused-vars */
-
-import Helpers from './lib/helpers.mjs'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
 
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
   // 'recurly' -> 'recurlyStatus'
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     {
       $and: [
         { recurlyStatus: { $exists: false } },
@@ -17,7 +16,8 @@ const migrate = async client => {
     { $rename: { recurly: 'recurlyStatus' } }
   )
   // some records may have already recached the recurly status, discard old cache
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     {
       $and: [
         { recurlyStatus: { $exists: true } },
@@ -31,7 +31,8 @@ const migrate = async client => {
 const rollback = async client => {
   const { db } = client
   // 'recurlyStatus' -> 'recurly'
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     {
       $and: [
         { recurly: { $exists: false } },
@@ -41,7 +42,8 @@ const rollback = async client => {
     { $rename: { recurlyStatus: 'recurly' } }
   )
   // some records may have already recached the recurly status, discard old cache
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     {
       $and: [
         { recurlyStatus: { $exists: true } },
diff --git a/services/web/migrations/20230207134844_group_invite_emails_to_lowercase.mjs b/services/web/migrations/20230207134844_group_invite_emails_to_lowercase.mjs
index fdb2bc8e8d..7b8c76b9f2 100644
--- a/services/web/migrations/20230207134844_group_invite_emails_to_lowercase.mjs
+++ b/services/web/migrations/20230207134844_group_invite_emails_to_lowercase.mjs
@@ -1,12 +1,11 @@
-/* eslint-disable no-unused-vars */
-
-import Helpers from './lib/helpers.mjs'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
 
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
-  db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     {
       'teamInvites.0': {
         $exists: true,
@@ -36,7 +35,7 @@ const migrate = async client => {
   )
 }
 
-const rollback = async client => {
+const rollback = async () => {
   // There is no way back.
 }
 
diff --git a/services/web/migrations/20230928092537_backfill_subscriptions_managed_users_feature_flag.mjs b/services/web/migrations/20230928092537_backfill_subscriptions_managed_users_feature_flag.mjs
index 4d782bf0d0..285cadcd92 100644
--- a/services/web/migrations/20230928092537_backfill_subscriptions_managed_users_feature_flag.mjs
+++ b/services/web/migrations/20230928092537_backfill_subscriptions_managed_users_feature_flag.mjs
@@ -1,8 +1,11 @@
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { 'features.managedUsers': { $ne: true } },
     { $set: { 'features.managedUsers': null } }
   )
@@ -10,7 +13,8 @@ const migrate = async client => {
 
 const rollback = async client => {
   const { db } = client
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { 'features.managedUsers': { $eq: null } },
     { $set: { 'features.managedUsers': false } }
   )
diff --git a/services/web/migrations/20231025094810_sso_config_certificates_array.mjs b/services/web/migrations/20231025094810_sso_config_certificates_array.mjs
index 1ec19f481e..f14f8b9b1c 100644
--- a/services/web/migrations/20231025094810_sso_config_certificates_array.mjs
+++ b/services/web/migrations/20231025094810_sso_config_certificates_array.mjs
@@ -1,8 +1,11 @@
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
-  await db.ssoConfigs.updateMany(
+  await batchedUpdate(
+    db.ssoConfigs,
     { certificate: { $exists: true }, certificates: { $exists: false } },
     [
       { $set: { certificates: ['$certificate'] } },
@@ -11,11 +14,13 @@ const migrate = async client => {
       },
     ]
   )
-  await db.ssoConfigs.updateMany(
+  await batchedUpdate(
+    db.ssoConfigs,
     { userFirstNameAttribute: null },
     { $unset: { userFirstNameAttribute: true } }
   )
-  await db.ssoConfigs.updateMany(
+  await batchedUpdate(
+    db.ssoConfigs,
     { userLastNameAttribute: null },
     { $unset: { userLastNameAttribute: true } }
   )
@@ -23,7 +28,8 @@ const migrate = async client => {
 
 const rollback = async client => {
   const { db } = client
-  await db.ssoConfigs.updateMany(
+  await batchedUpdate(
+    db.ssoConfigs,
     { certificate: { $exists: false }, certificates: { $exists: true } },
     [
       { $set: { certificate: { $arrayElemAt: ['$certificates', 0] } } },
diff --git a/services/web/migrations/20231030160030_managed_users_enabled.mjs b/services/web/migrations/20231030160030_managed_users_enabled.mjs
index 772c9bfc44..6255102866 100644
--- a/services/web/migrations/20231030160030_managed_users_enabled.mjs
+++ b/services/web/migrations/20231030160030_managed_users_enabled.mjs
@@ -1,12 +1,11 @@
-/* eslint-disable no-unused-vars */
-
-import Helpers from './lib/helpers.mjs'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
 
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { groupPolicy: { $exists: true } },
     { $set: { managedUsersEnabled: true } }
   )
@@ -14,7 +13,8 @@ const migrate = async client => {
 
 const rollback = async client => {
   const { db } = client
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { groupPolicy: { $exists: true } },
     { $unset: { managedUsersEnabled: '' } }
   )
diff --git a/services/web/migrations/20240923131936_create_user_last_active_index.js b/services/web/migrations/20240923131936_create_user_last_active_index.mjs
similarity index 55%
rename from services/web/migrations/20240923131936_create_user_last_active_index.js
rename to services/web/migrations/20240923131936_create_user_last_active_index.mjs
index 62beada2c0..76bdb0d941 100644
--- a/services/web/migrations/20240923131936_create_user_last_active_index.js
+++ b/services/web/migrations/20240923131936_create_user_last_active_index.mjs
@@ -1,6 +1,6 @@
-const Helpers = require('./lib/helpers')
+import Helpers from './lib/helpers.mjs'
 
-exports.tags = ['server-ce', 'server-pro', 'saas']
+const tags = ['server-ce', 'server-pro', 'saas']
 
 const indexes = [
   {
@@ -9,12 +9,18 @@ const indexes = [
   },
 ]
 
-exports.migrate = async client => {
+async function migrate(client) {
   const { db } = client
   await Helpers.addIndexesToCollection(db.users, indexes)
 }
 
-exports.rollback = async client => {
+async function rollback(client) {
   const { db } = client
   await Helpers.dropIndexesFromCollection(db.users, indexes)
 }
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20241111133330_remove_null_managed_users_sso_from_subscriptions.mjs b/services/web/migrations/20241111133330_remove_null_managed_users_sso_from_subscriptions.mjs
index de6282daac..003c519abc 100644
--- a/services/web/migrations/20241111133330_remove_null_managed_users_sso_from_subscriptions.mjs
+++ b/services/web/migrations/20241111133330_remove_null_managed_users_sso_from_subscriptions.mjs
@@ -1,12 +1,16 @@
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+
 const tags = ['saas']
 
 const migrate = async client => {
   const { db } = client
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { 'features.managedUsers': { $eq: null } },
     { $set: { 'features.managedUsers': true } }
   )
-  await db.subscriptions.updateMany(
+  await batchedUpdate(
+    db.subscriptions,
     { 'features.groupSSO': { $eq: null } },
     { $set: { 'features.groupSSO': true } }
   )
diff --git a/services/web/migrations/20250321160345_add_type_to_pat_user_id_index.mjs b/services/web/migrations/20250321160345_add_type_to_pat_user_id_index.mjs
new file mode 100644
index 0000000000..6b546a430d
--- /dev/null
+++ b/services/web/migrations/20250321160345_add_type_to_pat_user_id_index.mjs
@@ -0,0 +1,31 @@
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['server-ce', 'server-pro', 'saas']
+
+const oldIndex = {
+  key: { user_id: 1 },
+  name: 'user_id_1',
+}
+
+const newIndex = {
+  key: { user_id: 1, type: 1 },
+  name: 'user_id_1_type_1',
+}
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.oauthAccessTokens, [newIndex])
+  await Helpers.dropIndexesFromCollection(db.oauthAccessTokens, [oldIndex])
+}
+
+const rollback = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.oauthAccessTokens, [oldIndex])
+  await Helpers.dropIndexesFromCollection(db.oauthAccessTokens, [newIndex])
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250331120946_add_email_to_teamInvites_index.mjs b/services/web/migrations/20250331120946_add_email_to_teamInvites_index.mjs
new file mode 100644
index 0000000000..828e3bddc8
--- /dev/null
+++ b/services/web/migrations/20250331120946_add_email_to_teamInvites_index.mjs
@@ -0,0 +1,37 @@
+import Helpers from './lib/helpers.mjs'
+
+const indexes = [
+  {
+    key: {
+      'teamInvites.email': 1,
+    },
+    name: 'teamInvites.email_1',
+    partialFilterExpression: {
+      'teamInvites.email': {
+        $exists: true,
+      },
+    },
+  },
+]
+
+const tags = ['saas']
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.subscriptions, indexes)
+}
+
+const rollback = async client => {
+  const { db } = client
+  try {
+    await Helpers.dropIndexesFromCollection(db.subscriptions, indexes)
+  } catch (err) {
+    console.error('Something went wrong rolling back the migrations', err)
+  }
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250403133427_create_index_for_script_logs.mjs b/services/web/migrations/20250403133427_create_index_for_script_logs.mjs
new file mode 100644
index 0000000000..0ca677a82a
--- /dev/null
+++ b/services/web/migrations/20250403133427_create_index_for_script_logs.mjs
@@ -0,0 +1,32 @@
+/* eslint-disable no-unused-vars */
+
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['saas']
+
+const indexes = [
+  {
+    key: { canonicalName: 1 },
+    name: 'canonicalName_1',
+  },
+  {
+    key: { username: 1 },
+    name: 'username_1',
+  },
+]
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.scriptLogs, indexes)
+}
+
+const rollback = async client => {
+  const { db } = client
+  await Helpers.dropIndexesFromCollection(db.scriptLogs, indexes)
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250409155536_group_audit_log_index.mjs b/services/web/migrations/20250409155536_group_audit_log_index.mjs
new file mode 100644
index 0000000000..282b3c6d2d
--- /dev/null
+++ b/services/web/migrations/20250409155536_group_audit_log_index.mjs
@@ -0,0 +1,35 @@
+/* eslint-disable no-unused-vars */
+
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['saas']
+
+const indexes = [
+  {
+    key: {
+      groupId: 1,
+      timestamp: 1,
+    },
+    name: 'groupId_1_timestamp_1',
+  },
+]
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.groupAuditLogEntries, indexes)
+}
+
+const rollback = async client => {
+  const { db } = client
+  try {
+    await Helpers.dropIndexesFromCollection(db.groupAuditLogEntries, indexes)
+  } catch (err) {
+    console.error('Something went wrong rolling back the migrations', err)
+  }
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250411200550_active_chunk_index_update.mjs b/services/web/migrations/20250411200550_active_chunk_index_update.mjs
new file mode 100644
index 0000000000..23893a4836
--- /dev/null
+++ b/services/web/migrations/20250411200550_active_chunk_index_update.mjs
@@ -0,0 +1,41 @@
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['server-ce', 'server-pro', 'saas']
+
+const oldIndex = {
+  name: 'projectId_1_startVersion_1',
+  key: {
+    projectId: 1,
+    startVersion: 1,
+  },
+  unique: true,
+  partialFilterExpression: { state: 'active' },
+}
+
+const newIndex = {
+  name: 'projectId_1_startVersion_1_v2',
+  key: {
+    projectId: 1,
+    startVersion: 1,
+  },
+  unique: true,
+  partialFilterExpression: { state: { $in: ['active', 'closed'] } },
+}
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.projectHistoryChunks, [newIndex])
+  await Helpers.dropIndexesFromCollection(db.projectHistoryChunks, [oldIndex])
+}
+
+const rollback = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.projectHistoryChunks, [oldIndex])
+  await Helpers.dropIndexesFromCollection(db.projectHistoryChunks, [newIndex])
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250519101127_drop_deletedFiles.mjs b/services/web/migrations/20250519101127_drop_deletedFiles.mjs
new file mode 100644
index 0000000000..87f63f4405
--- /dev/null
+++ b/services/web/migrations/20250519101127_drop_deletedFiles.mjs
@@ -0,0 +1,50 @@
+import Helpers from './lib/helpers.mjs'
+import { getCollectionInternal, db } from '../app/src/infrastructure/mongodb.js'
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+
+const tags = ['server-ce', 'server-pro', 'saas']
+
+const indexes = [
+  {
+    key: {
+      projectId: 1,
+    },
+    name: 'projectId_1',
+  },
+]
+
+async function getCollection() {
+  // NOTE: The deletedFiles collection is not available to the application as it has been retired. Fetch it here.
+  return await getCollectionInternal('deletedFiles')
+}
+
+const migrate = async () => {
+  const collection = await getCollection()
+
+  // Purge legacy deletedFiles array from project records.
+  await batchedUpdate(
+    db.projects,
+    { deletedFiles: { $exists: true } },
+    { $unset: { deletedFiles: 1 } }
+  )
+
+  // Purge legacy deletedFiles array from soft-deleted project records.
+  await batchedUpdate(
+    db.deletedProjects,
+    { 'project.deletedFiles': { $exists: true } },
+    { $unset: { 'project.deletedFiles': 1 } }
+  )
+
+  // Drop historic deletedFiles records
+  await collection.drop()
+}
+
+const rollback = async () => {
+  await Helpers.addIndexesToCollection(await getCollection(), indexes)
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250528141310_drop_projectHistoryMetaData_collection.mjs b/services/web/migrations/20250528141310_drop_projectHistoryMetaData_collection.mjs
new file mode 100644
index 0000000000..45ec81c02d
--- /dev/null
+++ b/services/web/migrations/20250528141310_drop_projectHistoryMetaData_collection.mjs
@@ -0,0 +1,17 @@
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['saas']
+
+const migrate = async () => {
+  await Helpers.dropCollection('projectHistoryMetaData')
+}
+
+const rollback = async () => {
+  // Can't really do anything here
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250604112908_add_dropbox_policy_to_group_policy.mjs b/services/web/migrations/20250604112908_add_dropbox_policy_to_group_policy.mjs
new file mode 100644
index 0000000000..47cc644554
--- /dev/null
+++ b/services/web/migrations/20250604112908_add_dropbox_policy_to_group_policy.mjs
@@ -0,0 +1,23 @@
+const tags = ['saas']
+
+const migrate = async client => {
+  const { db } = client
+  await db.grouppolicies.updateMany(
+    {},
+    { $set: { userCannotUseDropbox: false } }
+  )
+}
+
+const rollback = async client => {
+  const { db } = client
+  await db.grouppolicies.updateMany(
+    {},
+    { $unset: { userCannotUseDropbox: '' } }
+  )
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250620152657_ensure_collaborator_arrays.mjs b/services/web/migrations/20250620152657_ensure_collaborator_arrays.mjs
new file mode 100644
index 0000000000..3caa210d41
--- /dev/null
+++ b/services/web/migrations/20250620152657_ensure_collaborator_arrays.mjs
@@ -0,0 +1,29 @@
+import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { db } from '../app/src/infrastructure/mongodb.js'
+
+const tags = ['server-ce', 'server-pro', 'saas']
+
+const migrate = async () => {
+  const fields = [
+    'collaberator_refs',
+    'pendingEditor_refs',
+    'pendingReviewer_refs',
+    'readOnly_refs',
+    'reviewer_refs',
+  ]
+  for (const field of fields) {
+    await batchedUpdate(
+      db.projects,
+      { [field]: { $type: 'null' } },
+      { $set: { [field]: [] } }
+    )
+  }
+}
+
+const rollback = async () => {}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/20250702203054_recurly_subscription_id_index.mjs b/services/web/migrations/20250702203054_recurly_subscription_id_index.mjs
new file mode 100644
index 0000000000..49d7413e11
--- /dev/null
+++ b/services/web/migrations/20250702203054_recurly_subscription_id_index.mjs
@@ -0,0 +1,23 @@
+import Helpers from './lib/helpers.mjs'
+
+const tags = ['saas']
+
+const indexes = [
+  { key: { recurlySubscription_id: 1 }, name: 'recurlySubscription_id_1' },
+]
+
+const migrate = async client => {
+  const { db } = client
+  await Helpers.addIndexesToCollection(db.subscriptions, indexes)
+}
+
+const rollback = async client => {
+  const { db } = client
+  await Helpers.dropIndexesFromCollection(db.subscriptions, indexes)
+}
+
+export default {
+  tags,
+  migrate,
+  rollback,
+}
diff --git a/services/web/migrations/lib/adapter.mjs b/services/web/migrations/lib/adapter.mjs
index e1d4c072d1..0f4cecdd05 100644
--- a/services/web/migrations/lib/adapter.mjs
+++ b/services/web/migrations/lib/adapter.mjs
@@ -10,9 +10,9 @@ class Adapter {
     if (
       !process.env.SKIP_TAG_CHECK &&
       !process.argv.includes('create') &&
-      !(process.argv.includes('-t') || process.argv.includes('--tags'))
+      !(process.argv.includes('-t') || process.argv.includes('--tag'))
     ) {
-      console.error("ERROR: must pass tags using '-t' or '--tags', exiting")
+      console.error("ERROR: must pass tags using '-t' or '--tag', exiting")
       process.exit(1)
     }
     this.params = params || {}
diff --git a/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationController.mjs b/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationController.mjs
new file mode 100644
index 0000000000..1a3ed01d3c
--- /dev/null
+++ b/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationController.mjs
@@ -0,0 +1,112 @@
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import EmailHelper from '../../../../../app/src/Features/Helpers/EmailHelper.js'
+import { handleAuthenticateErrors } from '../../../../../app/src/Features/Authentication/AuthenticationErrors.js'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import LDAPAuthenticationManager from './LDAPAuthenticationManager.mjs'
+
+const LDAPAuthenticationController = {
+  passportLogin(req, res, next) {
+    // This function is middleware which wraps the passport.authenticate middleware,
+    // so we can send back our custom `{message: {text: "", type: ""}}` responses on failure,
+    // and send a `{redir: ""}` response on success
+    passport.authenticate(
+      'ldapauth',
+      { keepSessionInfo: true },
+      async function (err, user, info, status) {
+        if (err) { //we cannot be here as long as errors are treated as fails
+          return next(err)
+        }
+        if (user) {
+          // `user` is either a user object or false
+          AuthenticationController.setAuditInfo(req, {
+            method: 'LDAP password login',
+          })
+
+          try {
+            await AuthenticationController.promises.finishLogin(user, req, res)
+	    res.status(200)
+	    return
+          } catch (err) {
+            return next(err)
+          }
+        } else {
+          if (status != 401) {
+            logger.warn(status, 'LDAP: ' + info.message)
+          }
+          if (EmailHelper.parseEmail(req.body.email)) return next() //Try local authentication
+          if (info.redir != null) {
+            return res.json({ redir: info.redir })
+          } else {
+            res.status(status || info.status || 401)
+            delete info.status
+            info.type = 'error'
+            info.key = 'invalid-password-retry-or-reset'
+            const body = { message: info }
+            const { errorReason } = info
+            if (errorReason) {
+              body.errorReason = errorReason
+              delete info.errorReason
+            }
+            return res.json(body)
+          }
+        }
+      }
+    )(req, res, next)
+  },
+  async doPassportLogin(req, profile, done) {
+    let user, info
+    try {
+      ;({ user, info } = await LDAPAuthenticationController._doPassportLogin(
+        req,
+        profile
+      ))
+    } catch (error) {
+      return done(error)
+    }
+    return done(undefined, user, info)
+  },
+  async _doPassportLogin(req, profile) {
+    const { fromKnownDevice } = AuthenticationController.getAuditInfo(req)
+    const auditLog = {
+      ipAddress: req.ip,
+      info: { method: 'LDAP password login', fromKnownDevice },
+    }
+
+    let user, isPasswordReused
+    try {
+      user = await LDAPAuthenticationManager.promises.findOrCreateUser(profile, auditLog)
+    } catch (error) {
+      return {
+        user: false,
+        info: handleAuthenticateErrors(error, req),
+      }
+    }
+    if (user && AuthenticationController.captchaRequiredForLogin(req, user)) {
+      return {
+        user: false,
+        info: {
+          text: req.i18n.translate('cannot_verify_user_not_robot'),
+          type: 'error',
+          errorReason: 'cannot_verify_user_not_robot',
+          status: 400,
+        },
+      }
+    } else if (user) {
+      user.externalAuth = 'ldap'
+      return { user, info: undefined }
+    } else { //we cannot be here, something is terribly wrong
+      logger.debug({ email : profile.mail }, 'failed LDAP log in')
+      return {
+        user: false,
+        info: {
+          type: 'error',
+          text: 'Unknown error',
+          status: 500,
+        },
+      }
+    }
+  },
+}
+
+export default LDAPAuthenticationController
diff --git a/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationManager.mjs b/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationManager.mjs
new file mode 100644
index 0000000000..6a35b77566
--- /dev/null
+++ b/services/web/modules/authentication/ldap/app/src/LDAPAuthenticationManager.mjs
@@ -0,0 +1,75 @@
+import Settings from '@overleaf/settings'
+import { callbackify } from '@overleaf/promise-utils'
+import UserCreator from '../../../../../app/src/Features/User/UserCreator.js'
+import { ParallelLoginError } from '../../../../../app/src/Features/Authentication/AuthenticationErrors.js'
+import { User } from '../../../../../app/src/models/User.js'
+import { splitFullName } from '../../../utils.mjs'
+
+const LDAPAuthenticationManager = {
+  async findOrCreateUser(profile, auditLog) {
+    //user is already authenticated in LDAP
+    const {
+      attEmail,
+      attFirstName,
+      attLastName,
+      attName,
+      attAdmin,
+      valAdmin,
+      updateUserDetailsOnLogin,
+    } = Settings.ldap
+
+    const email = Array.isArray(profile[attEmail])
+                    ? profile[attEmail][0].toLowerCase()
+                    : profile[attEmail].toLowerCase()
+    let nameParts = ["",""]
+    if ((!attFirstName || !attLastName) && attName) {
+      nameParts = splitFullName(profile[attName] || "")
+    }
+    const firstName = attFirstName ? (profile[attFirstName] || "") : nameParts[0]
+    let   lastName  = attLastName  ? (profile[attLastName]  || "") : nameParts[1]
+    if (!firstName && !lastName) lastName = email
+    let isAdmin = false
+    if( attAdmin && valAdmin ) {
+      isAdmin = Array.isArray(profile[attAdmin]) ? profile[attAdmin].includes(valAdmin) :
+                                                   profile[attAdmin] === valAdmin
+    }
+    let user = await User.findOne({ 'email': email }).exec()
+
+    if( !user ) {
+      user = await UserCreator.promises.createNewUser(
+        {
+          email: email,
+          first_name: firstName,
+          last_name: lastName,
+          isAdmin: isAdmin,
+          holdingAccount: false,
+        }
+      )
+      await User.updateOne(
+        { _id: user._id },
+        { $set : { 'emails.0.confirmedAt' : Date.now() } }
+      ).exec() //email of ldap user is confirmed
+    }
+    let userDetails = updateUserDetailsOnLogin ? { first_name : firstName, last_name: lastName } : {}
+    if( attAdmin && valAdmin ) {
+      user.isAdmin = isAdmin
+      userDetails.isAdmin = isAdmin
+    }
+    const result = await User.updateOne(
+      { _id: user._id, loginEpoch: user.loginEpoch },
+      {
+        $inc: { loginEpoch: 1 },
+        $set: userDetails,
+        $unset: { hashedPassword: "" },
+      }
+    ).exec()
+    if (result.modifiedCount !== 1) {
+      throw new ParallelLoginError()
+    }
+    return user
+  },
+}
+
+export default {
+  promises: LDAPAuthenticationManager,
+}
diff --git a/services/web/modules/authentication/ldap/app/src/LDAPContacts.mjs b/services/web/modules/authentication/ldap/app/src/LDAPContacts.mjs
new file mode 100644
index 0000000000..4557b4a4e4
--- /dev/null
+++ b/services/web/modules/authentication/ldap/app/src/LDAPContacts.mjs
@@ -0,0 +1,120 @@
+import Settings from '@overleaf/settings'
+import logger from '@overleaf/logger'
+import { promisify } from 'util'
+import passport from 'passport'
+import ldapjs from 'ldapauth-fork/node_modules/ldapjs/lib/index.js'
+import UserGetter from '../../../../../app/src/Features/User/UserGetter.js'
+import { splitFullName } from '../../../utils.mjs'
+
+function _searchLDAP(client, baseDN, options) {
+  return new Promise((resolve, reject) => {
+    const searchEntries = []
+    client.search(baseDN, options, (error, res) => {
+      if (error) {
+        reject(error)
+      } else {
+        res.on('searchEntry', entry => searchEntries.push(entry.object))
+        res.on('error', reject)
+        res.on('end', () => resolve(searchEntries))
+      }
+    })
+  })
+}
+
+async function fetchLDAPContacts(userId, contacts) {
+  if (!Settings.ldap?.enable || !process.env.OVERLEAF_LDAP_CONTACTS_FILTER) {
+    return []
+  }
+
+  const ldapOptions = passport._strategy('ldapauth').options.server
+  const { attEmail, attFirstName = "", attLastName = "", attName = "" } = Settings.ldap
+  const {
+    url,
+    timeout,
+    connectTimeout,
+    tlsOptions,
+    starttls,
+    bindDN,
+    bindCredentials
+  } = ldapOptions
+  const searchBase = process.env.OVERLEAF_LDAP_CONTACTS_SEARCH_BASE || ldapOptions.searchBase
+  const searchScope = process.env.OVERLEAF_LDAP_CONTACTS_SEARCH_SCOPE || 'sub'
+  const ldapConfig = { url, timeout, connectTimeout, tlsOptions }
+
+  let ldapUsers
+  let client
+
+  try {
+    await new Promise((resolve, reject) => {
+      client = ldapjs.createClient(ldapConfig)
+      client.on('error', (error) => { reject(error) })
+      client.on('connectTimeout', (error) => { reject(error) })
+      client.on('connect', () => { resolve() })
+    })
+
+    if (starttls) {
+      const starttlsAsync = promisify(client.starttls).bind(client)
+      await starttlsAsync(tlsOptions, null)
+    }
+    const bindAsync = promisify(client.bind).bind(client)
+    await bindAsync(bindDN, bindCredentials)
+
+    async function createContactsSearchFilter(client, ldapOptions, userId, contactsFilter) {
+      const searchProperty = process.env.OVERLEAF_LDAP_CONTACTS_PROPERTY
+      if (!searchProperty) {
+        return contactsFilter
+      }
+      const email = await UserGetter.promises.getUserEmail(userId)
+      const searchOptions = {
+        scope: ldapOptions.searchScope,
+        attributes: [searchProperty],
+        filter: `(${Settings.ldap.attEmail}=${email})`
+      }
+      const searchBase = ldapOptions.searchBase
+      const ldapUser = (await _searchLDAP(client, searchBase, searchOptions))[0]
+      const searchPropertyValue = ldapUser ? ldapUser[searchProperty]
+                                           : process.env.OVERLEAF_LDAP_CONTACTS_NON_LDAP_VALUE || 'IMATCHNOTHING'
+      return contactsFilter.replace(/{{userProperty}}/g, searchPropertyValue)
+    }
+
+    const filter = await createContactsSearchFilter(client, ldapOptions, userId, process.env.OVERLEAF_LDAP_CONTACTS_FILTER)
+    const searchOptions = { scope: searchScope, attributes: [attEmail, attFirstName, attLastName, attName], filter }
+
+    ldapUsers = await _searchLDAP(client, searchBase, searchOptions)
+  } catch (error) {
+    logger.warn({ error }, 'Error in fetchLDAPContacts')
+    return []
+  } finally {
+    client?.unbind()
+  }
+
+  const newLDAPContacts = ldapUsers.reduce((acc, ldapUser) => {
+    const email = Array.isArray(ldapUser[attEmail])
+                    ? ldapUser[attEmail][0]?.toLowerCase()
+                    : ldapUser[attEmail]?.toLowerCase()
+    if (!email) return acc
+    if (!contacts.some(contact => contact.email === email)) {
+      let nameParts = ["", ""]
+      if ((!attFirstName || !attLastName) && attName) {
+        nameParts = splitFullName(ldapUser[attName] || "")
+      }
+      const firstName = attFirstName ? (ldapUser[attFirstName] || "") : nameParts[0]
+      const lastName  = attLastName  ? (ldapUser[attLastName]  || "") : nameParts[1]
+      acc.push({
+        first_name: firstName,
+        last_name: lastName,
+        email: email,
+        type: 'user'
+      })
+    }
+    return acc
+  }, [])
+
+  return newLDAPContacts.sort((a, b) =>
+    a.last_name.localeCompare(b.last_name) ||
+    a.first_name.localeCompare(b.first_name) ||
+    a.email.localeCompare(b.email)
+  )
+}
+
+export default fetchLDAPContacts
diff --git a/services/web/modules/authentication/ldap/app/src/LDAPModuleManager.mjs b/services/web/modules/authentication/ldap/app/src/LDAPModuleManager.mjs
new file mode 100644
index 0000000000..643342430a
--- /dev/null
+++ b/services/web/modules/authentication/ldap/app/src/LDAPModuleManager.mjs
@@ -0,0 +1,108 @@
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import { Strategy as LDAPStrategy } from 'passport-ldapauth'
+import Settings from '@overleaf/settings'
+import PermissionsManager from '../../../../../app/src/Features/Authorization/PermissionsManager.js'
+import { readFilesContentFromEnv, numFromEnv, boolFromEnv } from '../../../utils.mjs'
+import LDAPAuthenticationController from './LDAPAuthenticationController.mjs'
+import fetchLDAPContacts from './LDAPContacts.mjs'
+
+const LDAPModuleManager = {
+  initSettings() {
+    Settings.ldap = {
+      enable: true,
+      placeholder:  process.env.OVERLEAF_LDAP_PLACEHOLDER || 'Username',
+      attEmail:     process.env.OVERLEAF_LDAP_EMAIL_ATT || 'mail',
+      attFirstName: process.env.OVERLEAF_LDAP_FIRST_NAME_ATT,
+      attLastName:  process.env.OVERLEAF_LDAP_LAST_NAME_ATT,
+      attName:      process.env.OVERLEAF_LDAP_NAME_ATT,
+      attAdmin:     process.env.OVERLEAF_LDAP_IS_ADMIN_ATT,
+      valAdmin:     process.env.OVERLEAF_LDAP_IS_ADMIN_ATT_VALUE,
+      updateUserDetailsOnLogin: boolFromEnv(process.env.OVERLEAF_LDAP_UPDATE_USER_DETAILS_ON_LOGIN),
+    }
+  },
+  passportSetup(passport, callback) {
+    const ldapOptions = {
+      url: process.env.OVERLEAF_LDAP_URL,
+      bindDN: process.env.OVERLEAF_LDAP_BIND_DN || "",
+      bindCredentials: process.env.OVERLEAF_LDAP_BIND_CREDENTIALS || "",
+      bindProperty: process.env.OVERLEAF_LDAP_BIND_PROPERTY,
+      searchBase: process.env.OVERLEAF_LDAP_SEARCH_BASE,
+      searchFilter: process.env.OVERLEAF_LDAP_SEARCH_FILTER,
+      searchScope: process.env.OVERLEAF_LDAP_SEARCH_SCOPE || 'sub',
+      searchAttributes: JSON.parse(process.env.OVERLEAF_LDAP_SEARCH_ATTRIBUTES || '[]'),
+      cache: boolFromEnv(process.env.OVERLEAF_LDAP_CACHE),
+      timeout: numFromEnv(process.env.OVERLEAF_LDAP_TIMEOUT),
+      connectTimeout: numFromEnv(process.env.OVERLEAF_LDAP_CONNECT_TIMEOUT),
+      starttls: boolFromEnv(process.env.OVERLEAF_LDAP_STARTTLS),
+      tlsOptions: {
+        ca: readFilesContentFromEnv(process.env.OVERLEAF_LDAP_TLS_OPTS_CA_PATH),
+        rejectUnauthorized: boolFromEnv(process.env.OVERLEAF_LDAP_TLS_OPTS_REJECT_UNAUTH),
+      }
+    }
+    try {
+      passport.use(
+        new LDAPStrategy(
+          {
+            server: ldapOptions,
+            passReqToCallback: true,
+            usernameField: 'email',
+            passwordField: 'password',
+            handleErrorsAsFailures: true,
+          },
+          LDAPAuthenticationController.doPassportLogin
+        )
+      )
+      callback(null)
+    } catch (error) {
+      callback(error)
+    }
+  },
+
+  async getContacts(userId, contacts, callback) {
+    try {
+      const newContacts = await fetchLDAPContacts(userId, contacts)
+      callback(null, newContacts)
+    } catch (error) {
+      callback(error)
+    }
+  },
+
+  initPolicy() {
+    try {
+      PermissionsManager.registerCapability('change-password', { default : true })
+      PermissionsManager.registerCapability('use-ai', { default : false })
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+    const ldapPolicyValidator = async ({ user, subscription }) => {
+// If user is not logged in, user.externalAuth is undefined,
+// in this case allow to change password if the user has a hashedPassword
+      return user.externalAuth === 'ldap' || (user.externalAuth === undefined && !user.hashedPassword)
+    }
+    try {
+    PermissionsManager.registerPolicy(
+      'ldapPolicy',
+      { 'change-password' : false },
+      { validator: ldapPolicyValidator }
+    )
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+  },
+
+  getGroupPolicyForUser(user, callback) {
+    PermissionsManager.promises.getUserValidationStatus({
+      user,
+      groupPolicy : { 'ldapPolicy' : true },
+      subscription : null
+    }).then(userValidationMap => {
+      let groupPolicy = Object.fromEntries(userValidationMap)
+      callback(null, { groupPolicy })
+    }).catch(error => {
+      callback(error)
+    })
+  },
+}
+
+export default LDAPModuleManager
diff --git a/services/web/modules/authentication/ldap/app/src/LDAPRouter.mjs b/services/web/modules/authentication/ldap/app/src/LDAPRouter.mjs
new file mode 100644
index 0000000000..d2bbb35236
--- /dev/null
+++ b/services/web/modules/authentication/ldap/app/src/LDAPRouter.mjs
@@ -0,0 +1,19 @@
+import logger from '@overleaf/logger'
+import RateLimiterMiddleware from '../../../../../app/src/Features/Security/RateLimiterMiddleware.js'
+import CaptchaMiddleware from '../../../../../app/src/Features/Captcha/CaptchaMiddleware.js'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import { overleafLoginRateLimiter } from '../../../../../app/src/infrastructure/RateLimiter.js'
+import LDAPAuthenticationController from './LDAPAuthenticationController.mjs'
+
+export default {
+  apply(webRouter) {
+    logger.debug({}, 'Init LDAP router')
+    webRouter.post('/login',
+      RateLimiterMiddleware.rateLimit(overleafLoginRateLimiter), // rate limit IP (20 / 60s)
+      RateLimiterMiddleware.loginRateLimitEmail(), // rate limit email (10 / 120s)
+      CaptchaMiddleware.validateCaptcha('login'),
+      LDAPAuthenticationController.passportLogin,
+      AuthenticationController.passportLogin,
+    )
+  },
+}
diff --git a/services/web/modules/authentication/ldap/index.mjs b/services/web/modules/authentication/ldap/index.mjs
new file mode 100644
index 0000000000..94743a6611
--- /dev/null
+++ b/services/web/modules/authentication/ldap/index.mjs
@@ -0,0 +1,17 @@
+let ldapModule = {}
+if (process.env.EXTERNAL_AUTH?.includes('ldap')) {
+  const { default: LDAPModuleManager } = await import('./app/src/LDAPModuleManager.mjs')
+  const { default: router } = await import('./app/src/LDAPRouter.mjs')
+  LDAPModuleManager.initSettings()
+  LDAPModuleManager.initPolicy()
+  ldapModule = {
+    name: 'ldap-authentication',
+    hooks: {
+      passportSetup: LDAPModuleManager.passportSetup,
+      getContacts: LDAPModuleManager.getContacts,
+      getGroupPolicyForUser: LDAPModuleManager.getGroupPolicyForUser,
+    },
+    router: router,
+  }
+}
+export default ldapModule
diff --git a/services/web/modules/authentication/logout.mjs b/services/web/modules/authentication/logout.mjs
new file mode 100644
index 0000000000..4163cf536d
--- /dev/null
+++ b/services/web/modules/authentication/logout.mjs
@@ -0,0 +1,18 @@
+let SAMLAuthenticationController 
+if (process.env.EXTERNAL_AUTH.includes('saml')) {
+  SAMLAuthenticationController = await import('./saml/app/src/SAMLAuthenticationController.mjs')
+}
+let OIDCAuthenticationController 
+if (process.env.EXTERNAL_AUTH.includes('oidc')) {
+  OIDCAuthenticationController = await import('./oidc/app/src/OIDCAuthenticationController.mjs')
+}
+export default async function logout(req, res, next) {
+  switch(req.user.externalAuth) {
+    case 'saml':
+      return SAMLAuthenticationController.default.passportLogout(req, res, next)
+    case 'oidc':
+      return OIDCAuthenticationController.default.passportLogout(req, res, next)
+    default: 
+      next()
+  }
+}
diff --git a/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationController.mjs b/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationController.mjs
new file mode 100644
index 0000000000..9365c9ea73
--- /dev/null
+++ b/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationController.mjs
@@ -0,0 +1,171 @@
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import Settings from '@overleaf/settings'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import UserController from '../../../../../app/src/Features/User/UserController.js'
+import ThirdPartyIdentityManager from '../../../../../app/src/Features/User/ThirdPartyIdentityManager.js'
+import OIDCAuthenticationManager from './OIDCAuthenticationManager.mjs'
+import { acceptsJson } from '../../../../../app/src/infrastructure/RequestContentTypeDetection.js'
+
+const OIDCAuthenticationController = {
+  passportLogin(req, res, next) {
+    req.session.intent = req.query.intent
+    passport.authenticate('openidconnect')(req, res, next)
+  },
+  passportLoginCallback(req, res, next) {
+    passport.authenticate(
+      'openidconnect',
+      { keepSessionInfo: true },
+      async function (err, user, info) {
+        if (err) {
+          return next(err)
+        }
+        if(req.session.intent === 'link') {
+          delete req.session.intent
+// After linking, log out from the OIDC provider and redirect back to '/user/settings'.
+// Keycloak supports this; Authentik does not (yet).
+          const logoutUrl = process.env.OVERLEAF_OIDC_LOGOUT_URL
+          const redirectUri = `${Settings.siteUrl.replace(/\/+$/, '')}/user/settings`
+          return res.redirect(`${logoutUrl}?id_token_hint=${info.idToken}&post_logout_redirect_uri=${encodeURIComponent(redirectUri)}`)
+	}
+        if (user) {
+          req.session.idToken = info.idToken
+          user.externalAuth = 'oidc'
+          // `user` is either a user object or false
+          AuthenticationController.setAuditInfo(req, {
+            method: 'OIDC login',
+          })
+          try {
+            await AuthenticationController.promises.finishLogin(user, req, res)
+          } catch (err) {
+            return next(err)
+          }
+        } else {
+          if (info.redir != null) {
+            await UserController.doLogout(req)
+            return res.redirect(info.redir)
+          } else {
+            res.status(info.status || 401)
+            delete info.status
+            const body = { message: info }
+            return res.json(body)
+          }
+        }
+      }
+    )(req, res, next)
+  },
+  async doPassportLogin(req, issuer, profile, context, idToken, accessToken, refreshToken, done) {
+    let user, info
+    try {
+      if(req.session.intent === 'link') {
+        ;({ user, info } = await OIDCAuthenticationController._doLink(
+          req,
+          profile
+        ))
+      } else {
+        ;({ user, info } = await OIDCAuthenticationController._doLogin(
+          req,
+          profile
+        ))
+      }
+    } catch (error) {
+      return done(error)
+    }
+    if (user) {
+      info = {
+        ...(info || {}),
+        idToken: idToken
+      }
+    }
+    return done(null, user, info)
+  },
+  async _doLogin(req, profile) {
+    const { fromKnownDevice } = AuthenticationController.getAuditInfo(req)
+    const auditLog = {
+      ipAddress: req.ip,
+      info: { method: 'OIDC login', fromKnownDevice },
+    }
+
+    let user
+    try {
+      user = await OIDCAuthenticationManager.promises.findOrCreateUser(profile, auditLog)
+    } catch (error) {
+      logger.debug({ email : profile.emails[0].value }, `OIDC login failed: ${error}`)
+      return {
+        user: false,
+        info: {
+          type: 'error',
+          text: error.message,
+          status: 500,
+        },
+      }
+    }
+    if (user) {
+      return { user, info: undefined }
+    } else { // user account is not created
+      logger.debug({ email : profile.emails[0].value }, 'OIDC JIT account creation is not allowed for this email')
+      return {
+        user: false,
+        info: {
+          redir: '/register',
+          status: 401,
+        },
+      }
+    }
+  },
+  async _doLink(req, profile) {
+    const { user: { _id: userId }, ip } = req
+    try {
+      const auditLog = {
+        ipAddress: ip,
+        initiatorId: userId,
+      }
+      await OIDCAuthenticationManager.promises.linkAccount(userId, profile, auditLog)
+    } catch (error) {
+      logger.error(error.info, error.message)
+      return {
+        user: true,
+        info: {
+          type: 'error',
+          text: error.message,
+          status: 200,
+        },
+      }
+    }
+    return { user: true, info: undefined }
+  },
+  async unlinkAccount(req, res, next) {
+    try {
+      const { user: { _id: userId }, body: { providerId }, ip } = req
+      const auditLog = {
+        ipAddress: ip,
+        initiatorId: userId,
+      }
+      await ThirdPartyIdentityManager.promises.unlink(userId, providerId, auditLog)
+      return res.status(200).end()
+    } catch (error) {
+      logger.error(error.info, error.message)
+      return {
+        user: false,
+        info: {
+          type: 'error',
+          text: 'Can not unlink account',
+          status: 200,
+	}
+      }
+    }
+  },
+  async passportLogout(req, res, next) {
+// TODO: instead of storing idToken in session, use refreshToken to obtain a new idToken?
+    const idTokenHint = req.session.idToken
+    await UserController.doLogout(req)
+    const logoutUrl = process.env.OVERLEAF_OIDC_LOGOUT_URL
+    const redirectUri = Settings.siteUrl
+    res.redirect(`${logoutUrl}?id_token_hint=${idTokenHint}&post_logout_redirect_uri=${encodeURIComponent(redirectUri)}`)
+  },
+  passportLogoutCallback(req, res, next) {
+    const redirectUri = Settings.siteUrl
+    res.redirect(redirectUri)
+  },
+}
+export default OIDCAuthenticationController
diff --git a/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationManager.mjs b/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationManager.mjs
new file mode 100644
index 0000000000..9d3c1becc9
--- /dev/null
+++ b/services/web/modules/authentication/oidc/app/src/OIDCAuthenticationManager.mjs
@@ -0,0 +1,108 @@
+import Settings from '@overleaf/settings'
+import UserCreator from '../../../../../app/src/Features/User/UserCreator.js'
+import ThirdPartyIdentityManager from '../../../../../app/src/Features/User/ThirdPartyIdentityManager.js'
+import { ParallelLoginError } from '../../../../../app/src/Features/Authentication/AuthenticationErrors.js'
+import { User } from '../../../../../app/src/models/User.js'
+
+const OIDCAuthenticationManager = {
+  async findOrCreateUser(profile, auditLog) {
+    const {
+      attUserId,
+      attAdmin,
+      valAdmin,
+      updateUserDetailsOnLogin,
+      providerId,
+    } = Settings.oidc
+    const email = profile.emails[0].value
+    const oidcUserId = (attUserId === 'email') ? email : profile[attUserId]
+    const firstName = profile.name?.givenName || ""
+    const lastName  = profile.name?.familyName || ""
+    let isAdmin = false
+    if (attAdmin && valAdmin) {
+      if (attAdmin === 'email') {
+        isAdmin = (email === valAdmin)
+      } else {
+        isAdmin = (profile[attAdmin] === valAdmin)
+      }
+    }
+    const oidcUserData = null // Possibly it can be used later
+    let user
+    try {
+      user = await ThirdPartyIdentityManager.promises.login(providerId, oidcUserId, oidcUserData)
+    } catch {
+// A user with the specified OIDC ID and provider ID is not found. Search for a user with the given email.
+// If no user exists with this email, create a new user and link the OIDC account to it (provided this is allowed by allowedOIDCEmailDomains).
+// If a user exists but no account from the specified OIDC provider is linked to this user, link the OIDC account to this user.
+// If an account from the specified provider is already linked to this user, unlink it, and link the OIDC account to this user.
+// (Is it safe? Concider: If an account from the specified provider is already linked to this user, throw an error)
+      user = await User.findOne({ 'email': email }).exec()
+      if (!user) {
+        const allowedDomains = Settings.oidc.allowedOIDCEmailDomains
+        if (
+          allowedDomains &&
+          !allowedDomains.some(pattern => {
+            const domain = email.split('@')[1]
+            if (pattern.startsWith('*.')) {
+              const base = pattern.slice(2)
+              return domain.endsWith(`.${base}`)
+            }
+            return domain === pattern
+          })
+        ) {
+          return null
+        }
+        user = await UserCreator.promises.createNewUser(
+          {
+            email: email,
+            first_name: firstName,
+            last_name: lastName,
+            isAdmin: isAdmin,
+            holdingAccount: false,
+          }
+        )
+      }
+//    const alreadyLinked = user.thirdPartyIdentifiers.some(item => item.providerId === providerId)
+//    if (!alreadyLinked) {
+        auditLog.initiatorId = user._id
+        await ThirdPartyIdentityManager.promises.link(user._id, providerId, oidcUserId, oidcUserData, auditLog)
+        await User.updateOne(
+          { _id: user._id },
+          { $set : {
+             'emails.0.confirmedAt': Date.now(), //email of external user is confirmed
+            },
+          }
+        ).exec()
+//    } else {
+//      throw new Error(`Overleaf user ${user.email} is already linked to another ${providerId} user`)
+//    }
+    }
+
+    let userDetails = updateUserDetailsOnLogin ? { first_name : firstName, last_name: lastName } : {}
+    if (attAdmin && valAdmin) {
+      user.isAdmin = isAdmin
+      userDetails.isAdmin = isAdmin
+    }
+    const result = await User.updateOne(
+      { _id: user._id, loginEpoch: user.loginEpoch }, { $inc: { loginEpoch: 1 }, $set: userDetails },
+      {}
+    ).exec()
+
+    if (result.modifiedCount !== 1) {
+      throw new ParallelLoginError()
+    }
+    return user
+  },
+  async linkAccount(userId, profile, auditLog) {
+    const {
+      attUserId,
+      providerId,
+    } = Settings.oidc
+    const oidcUserId = (attUserId === 'email') ? profile.emails[0].value : profile[attUserId]
+    const oidcUserData = null // Possibly it can be used later
+    await ThirdPartyIdentityManager.promises.link(userId, providerId, oidcUserId, oidcUserData, auditLog)
+  },
+}
+
+export default {
+  promises: OIDCAuthenticationManager,
+}
diff --git a/services/web/modules/authentication/oidc/app/src/OIDCModuleManager.mjs b/services/web/modules/authentication/oidc/app/src/OIDCModuleManager.mjs
new file mode 100644
index 0000000000..7a36c0fbd0
--- /dev/null
+++ b/services/web/modules/authentication/oidc/app/src/OIDCModuleManager.mjs
@@ -0,0 +1,86 @@
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import Settings from '@overleaf/settings'
+import { readFilesContentFromEnv, numFromEnv, boolFromEnv } from '../../../utils.mjs'
+import PermissionsManager from '../../../../../app/src/Features/Authorization/PermissionsManager.js'
+import OIDCAuthenticationController from './OIDCAuthenticationController.mjs'
+import { Strategy as OIDCStrategy } from 'passport-openidconnect'
+
+const OIDCModuleManager = {
+  initSettings() {
+    let providerId = process.env.OVERLEAF_OIDC_PROVIDER_ID || 'oidc'
+    Settings.oidc = {
+      enable: true,
+      providerId:   providerId,
+      identityServiceName: process.env.OVERLEAF_OIDC_IDENTITY_SERVICE_NAME || `Log in with ${Settings.oauthProviders[providerId].name}`,
+      attUserId:    process.env.OVERLEAF_OIDC_USER_ID_FIELD || 'id',
+      attAdmin:     process.env.OVERLEAF_OIDC_IS_ADMIN_FIELD,
+      valAdmin:     process.env.OVERLEAF_OIDC_IS_ADMIN_FIELD_VALUE,
+      updateUserDetailsOnLogin: boolFromEnv(process.env.OVERLEAF_OIDC_UPDATE_USER_DETAILS_ON_LOGIN),
+      allowedOIDCEmailDomains: process.env.OVERLEAF_OIDC_ALLOWED_EMAIL_DOMAINS === undefined
+        ? null
+        : process.env.OVERLEAF_OIDC_ALLOWED_EMAIL_DOMAINS.split(',').map(s => s.trim()).filter(Boolean),
+    }
+  },
+  passportSetup(passport, callback) {
+    const oidcOptions = {
+      issuer: process.env.OVERLEAF_OIDC_ISSUER,
+      authorizationURL: process.env.OVERLEAF_OIDC_AUTHORIZATION_URL,
+      tokenURL: process.env.OVERLEAF_OIDC_TOKEN_URL,
+      userInfoURL: process.env.OVERLEAF_OIDC_USER_INFO_URL,
+      clientID: process.env.OVERLEAF_OIDC_CLIENT_ID,
+      clientSecret: process.env.OVERLEAF_OIDC_CLIENT_SECRET,
+      callbackURL: `${Settings.siteUrl.replace(/\/+$/, '')}/oidc/login/callback`,
+      scope: process.env.OVERLEAF_OIDC_SCOPE || 'openid profile email',
+      passReqToCallback: true,
+    }
+    try {
+      passport.use(
+        new OIDCStrategy(
+          oidcOptions,
+          OIDCAuthenticationController.doPassportLogin
+        )
+      )
+      callback(null)
+    } catch (error) {
+      callback(error)
+    }
+  },
+  initPolicy() {
+    try {
+      PermissionsManager.registerCapability('change-password', { default : true })
+      PermissionsManager.registerCapability('use-ai', { default : false })
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+    const oidcPolicyValidator = async ({ user, subscription }) => {
+// If user is not logged in, user.externalAuth is undefined,
+// in this case allow to change password if the user has a hashedPassword
+      return user.externalAuth === 'oidc' || (user.externalAuth === undefined && !user.hashedPassword)
+    }
+    try {
+    PermissionsManager.registerPolicy(
+      'oidcPolicy',
+      { 'change-password' : false },
+      { validator: oidcPolicyValidator }
+    )
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+  },
+
+  getGroupPolicyForUser(user, callback) {
+    PermissionsManager.promises.getUserValidationStatus({
+      user,
+      groupPolicy : { 'oidcPolicy' : true },
+      subscription : null
+    }).then(userValidationMap => {
+      let groupPolicy = Object.fromEntries(userValidationMap)
+      callback(null, { groupPolicy })
+    }).catch(error => {
+      callback(error)
+    })
+  },
+}
+
+export default OIDCModuleManager
diff --git a/services/web/modules/authentication/oidc/app/src/OIDCRouter.mjs b/services/web/modules/authentication/oidc/app/src/OIDCRouter.mjs
new file mode 100644
index 0000000000..0857e41889
--- /dev/null
+++ b/services/web/modules/authentication/oidc/app/src/OIDCRouter.mjs
@@ -0,0 +1,18 @@
+import logger from '@overleaf/logger'
+import UserController from '../../../../../app/src/Features/User/UserController.js'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import OIDCAuthenticationController from './OIDCAuthenticationController.mjs'
+import logout from '../../../logout.mjs'
+
+export default {
+  apply(webRouter) {
+    logger.debug({}, 'Init OIDC router')
+    webRouter.get('/oidc/login', OIDCAuthenticationController.passportLogin)
+    AuthenticationController.addEndpointToLoginWhitelist('/oidc/login')
+    webRouter.get('/oidc/login/callback', OIDCAuthenticationController.passportLoginCallback)
+    AuthenticationController.addEndpointToLoginWhitelist('/oidc/login/callback')
+    webRouter.get('/oidc/logout/callback', OIDCAuthenticationController.passportLogoutCallback)
+    webRouter.post('/user/oauth-unlink', OIDCAuthenticationController.unlinkAccount)
+    webRouter.post('/logout', logout, UserController.logout)
+  },
+}
diff --git a/services/web/modules/authentication/oidc/index.mjs b/services/web/modules/authentication/oidc/index.mjs
new file mode 100644
index 0000000000..f10ff64c82
--- /dev/null
+++ b/services/web/modules/authentication/oidc/index.mjs
@@ -0,0 +1,16 @@
+let oidcModule = {}
+if (process.env.EXTERNAL_AUTH?.includes('oidc')) {
+  const { default: OIDCModuleManager } = await import('./app/src/OIDCModuleManager.mjs')
+  const { default: router } = await import('./app/src/OIDCRouter.mjs')
+  OIDCModuleManager.initSettings()
+  OIDCModuleManager.initPolicy()
+  oidcModule = {
+    name: 'oidc-authentication',
+    hooks: {
+      passportSetup: OIDCModuleManager.passportSetup,
+      getGroupPolicyForUser: OIDCModuleManager.getGroupPolicyForUser,
+    },
+    router: router,
+  }
+}
+export default oidcModule
diff --git a/services/web/modules/authentication/saml/app/src/SAMLAuthenticationController.mjs b/services/web/modules/authentication/saml/app/src/SAMLAuthenticationController.mjs
new file mode 100644
index 0000000000..3ed834608f
--- /dev/null
+++ b/services/web/modules/authentication/saml/app/src/SAMLAuthenticationController.mjs
@@ -0,0 +1,150 @@
+import Settings from '@overleaf/settings'
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import SAMLAuthenticationManager from './SAMLAuthenticationManager.mjs'
+import UserController from '../../../../../app/src/Features/User/UserController.js'
+import UserSessionsManager from '../../../../../app/src/Features/User/UserSessionsManager.js'
+import { handleAuthenticateErrors } from '../../../../../app/src/Features/Authentication/AuthenticationErrors.js'
+import { xmlResponse } from '../../../../../app/src/infrastructure/Response.js'
+import { readFilesContentFromEnv } from '../../../utils.mjs'
+
+const SAMLAuthenticationController = {
+  passportLogin(req, res, next) {
+    if ( passport._strategy('saml')._saml.options.authnRequestBinding === 'HTTP-POST') {
+      const csp = res.getHeader('Content-Security-Policy')
+      if (csp) {
+        res.setHeader(
+          'Content-Security-Policy',
+          csp.replace(/(?:^|\s)(default-src|form-action)[^;]*;?/g, '')
+        )
+      }
+    }
+    passport.authenticate('saml')(req, res, next)
+  },
+  passportLoginCallback(req, res, next) {
+    // This function is middleware which wraps the passport.authenticate middleware,
+    // so we can send back our custom `{message: {text: "", type: ""}}` responses on failure,
+    // and send a `{redir: ""}` response on success
+    passport.authenticate(
+      'saml',
+      { keepSessionInfo: true },
+      async function (err, user, info) {
+        if (err) {
+          return next(err)
+        }
+        if (user) {
+          // `user` is either a user object or false
+          AuthenticationController.setAuditInfo(req, {
+            method: 'SAML login',
+          })
+          try {
+            await AuthenticationController.promises.finishLogin(user, req, res)
+          } catch (err) {
+            return next(err)
+          }
+        } else {
+          if (info.redir != null) {
+            return res.json({ redir: info.redir })
+          } else {
+            res.status(info.status || 401)
+            delete info.status
+            const body = { message: info }
+            return res.json(body)
+          }
+        }
+      }
+    )(req, res, next)
+  },
+  async doPassportLogin(req, profile, done) {
+    let user, info
+    try {
+      ;({ user, info } = await SAMLAuthenticationController._doPassportLogin(
+        req,
+        profile
+      ))
+    } catch (error) {
+      return done(error)
+    }
+    return done(undefined, user, info)
+  },
+  async _doPassportLogin(req, profile) {
+    const { fromKnownDevice } = AuthenticationController.getAuditInfo(req)
+    const auditLog = {
+      ipAddress: req.ip,
+      info: { method: 'SAML login', fromKnownDevice },
+    }
+
+    let user
+    try {
+      user = await SAMLAuthenticationManager.promises.findOrCreateUser(profile, auditLog)
+    } catch (error) {
+      return {
+        user: false,
+        info: handleAuthenticateErrors(error, req),
+      }
+    }
+    if (user) {
+      user.externalAuth = 'saml'
+      req.session.saml_extce = {nameID : profile.nameID, sessionIndex : profile.sessionIndex}
+      return { user, info: undefined }
+    } else { // we cannot be here, something is terribly wrong
+      logger.debug({ email : profile.mail }, 'failed SAML log in')
+      return {
+        user: false,
+        info: {
+          type: 'error',
+          text: 'Unknown error',
+          status: 500,
+        },
+      }
+    }
+  },
+  async passportLogout(req, res, next) {
+    passport._strategy('saml').logout(req, async (err, url) => {
+      await UserController.doLogout(req)
+      if (err) return next(err)
+      res.redirect(url)
+    })
+  },
+  passportLogoutCallback(req, res, next) {
+//TODO: is it possible to close the editor?
+    passport.authenticate('saml')(req, res, (err) => {
+      if (err) return next(err)
+      res.redirect('/login');
+    })
+  },
+  async doPassportLogout(req, profile, done) {
+    let user, info
+    try {
+      ;({ user, info } = await SAMLAuthenticationController._doPassportLogout(
+        req,
+        profile
+      ))
+    } catch (error) {
+      return done(error)
+    }
+    return done(undefined, user, info)
+  },
+  async _doPassportLogout(req, profile) {
+    if (req?.session?.saml_extce?.nameID === profile.nameID &&
+        req?.session?.saml_extce?.sessionIndex === profile.sessionIndex) {
+      profile = req.user
+    }
+    await UserSessionsManager.promises.untrackSession(req.user, req.sessionID).catch(err => {
+      logger.warn({ err, userId: req.user._id }, 'failed to untrack session')
+    })
+    return { user: profile, info: undefined }
+  },
+  getSPMetadata(req, res) {
+    const samlStratery = passport._strategy('saml')
+    res.setHeader('Content-Disposition', `attachment; filename="${samlStratery._saml.options.issuer}-meta.xml"`)
+    xmlResponse(res,
+      samlStratery.generateServiceProviderMetadata(
+        readFilesContentFromEnv(process.env.OVERLEAF_SAML_DECRYPTION_CERT),
+        readFilesContentFromEnv(process.env.OVERLEAF_SAML_PUBLIC_CERT)
+      )
+    )
+  },
+}
+export default SAMLAuthenticationController
diff --git a/services/web/modules/authentication/saml/app/src/SAMLAuthenticationManager.mjs b/services/web/modules/authentication/saml/app/src/SAMLAuthenticationManager.mjs
new file mode 100644
index 0000000000..80c4e30ea7
--- /dev/null
+++ b/services/web/modules/authentication/saml/app/src/SAMLAuthenticationManager.mjs
@@ -0,0 +1,85 @@
+import Settings from '@overleaf/settings'
+import UserCreator from '../../../../../app/src/Features/User/UserCreator.js'
+import { ParallelLoginError } from '../../../../../app/src/Features/Authentication/AuthenticationErrors.js'
+import SAMLIdentityManager from '../../../../../app/src/Features/User/SAMLIdentityManager.js'
+import { User } from '../../../../../app/src/models/User.js'
+
+const SAMLAuthenticationManager = {
+  async findOrCreateUser(profile, auditLog) {
+    const {
+      attUserId,
+      attEmail,
+      attFirstName,
+      attLastName,
+      attAdmin,
+      valAdmin,
+      updateUserDetailsOnLogin,
+    } = Settings.saml
+    const externalUserId = profile[attUserId]
+    const email = Array.isArray(profile[attEmail])
+                    ? profile[attEmail][0].toLowerCase()
+                    : profile[attEmail].toLowerCase()
+    const firstName = attFirstName ? profile[attFirstName] : ""
+    const lastName  = attLastName  ? profile[attLastName] : email
+    let isAdmin = false
+    if (attAdmin && valAdmin) {
+      isAdmin = (Array.isArray(profile[attAdmin]) ? profile[attAdmin].includes(valAdmin) :
+                                                    profile[attAdmin] === valAdmin)
+    }
+    const providerId = '1' // for now, only one fixed IdP is supported
+// We search for a SAML user, and if none is found, we search for a user with the given email. If a user is found,
+// we update the user to be a SAML user, otherwise, we create a new SAML user with the given email. In the case of
+// multiple SAML IdPs, one would have to do something similar, or possibly report an error like
+// 'the email is associated with the wrong IdP'
+    let user = await SAMLIdentityManager.getUser(providerId, externalUserId, attUserId)
+    if (!user) {
+      user = await User.findOne({ 'email': email }).exec()
+      if (!user) {
+        user = await UserCreator.promises.createNewUser(
+          {
+            email: email,
+            first_name: firstName,
+            last_name: lastName,
+            isAdmin: isAdmin,
+            holdingAccount: false,
+            samlIdentifiers: [{ providerId: providerId }],
+          }
+        )
+      }
+      // cannot use SAMLIdentityManager.linkAccounts because affilations service is not there
+      await User.updateOne(
+        { _id: user._id },
+        {
+          $set : {
+           'emails.0.confirmedAt': Date.now(), //email of saml user is confirmed
+           'emails.0.samlProviderId': providerId,
+           'samlIdentifiers.0.providerId': providerId,
+           'samlIdentifiers.0.externalUserId': externalUserId,
+           'samlIdentifiers.0.userIdAttribute': attUserId,
+          },
+        }
+      ).exec()
+    }
+    let userDetails = updateUserDetailsOnLogin ? { first_name : firstName, last_name: lastName } : {}
+    if (attAdmin && valAdmin) {
+      user.isAdmin = isAdmin
+      userDetails.isAdmin = isAdmin
+    }
+    const result = await User.updateOne(
+      { _id: user._id, loginEpoch: user.loginEpoch },
+      {
+        $inc: { loginEpoch: 1 },
+        $set: userDetails,
+        $unset: { hashedPassword: "" },
+      },
+    ).exec()
+    if (result.modifiedCount !== 1) {
+      throw new ParallelLoginError()
+    }
+    return user
+  },
+}
+
+export default {
+  promises: SAMLAuthenticationManager,
+}
diff --git a/services/web/modules/authentication/saml/app/src/SAMLModuleManager.mjs b/services/web/modules/authentication/saml/app/src/SAMLModuleManager.mjs
new file mode 100644
index 0000000000..fba235de3d
--- /dev/null
+++ b/services/web/modules/authentication/saml/app/src/SAMLModuleManager.mjs
@@ -0,0 +1,102 @@
+import logger from '@overleaf/logger'
+import passport from 'passport'
+import Settings from '@overleaf/settings'
+import { readFilesContentFromEnv, numFromEnv, boolFromEnv } from '../../../utils.mjs'
+import PermissionsManager from '../../../../../app/src/Features/Authorization/PermissionsManager.js'
+import SAMLAuthenticationController from './SAMLAuthenticationController.mjs'
+import { Strategy as SAMLStrategy } from '@node-saml/passport-saml'
+
+const SAMLModuleManager = {
+  initSettings() {
+  Settings.saml = {
+    enable: true,
+    identityServiceName: process.env.OVERLEAF_SAML_IDENTITY_SERVICE_NAME || 'Log in with SAML IdP',
+    attUserId:    process.env.OVERLEAF_SAML_USER_ID_FIELD || 'nameID',
+    attEmail:     process.env.OVERLEAF_SAML_EMAIL_FIELD || 'nameID',
+    attFirstName: process.env.OVERLEAF_SAML_FIRST_NAME_FIELD || 'givenName',
+    attLastName:  process.env.OVERLEAF_SAML_LAST_NAME_FIELD || 'lastName',
+    attAdmin:     process.env.OVERLEAF_SAML_IS_ADMIN_FIELD,
+    valAdmin:     process.env.OVERLEAF_SAML_IS_ADMIN_FIELD_VALUE,
+    updateUserDetailsOnLogin: boolFromEnv(process.env.OVERLEAF_SAML_UPDATE_USER_DETAILS_ON_LOGIN),
+  }
+},
+  passportSetup(passport, callback) {
+    const samlOptions = {
+      entryPoint: process.env.OVERLEAF_SAML_ENTRYPOINT,
+      callbackUrl: `${Settings.siteUrl.replace(/\/+$/, '')}/saml/login/callback`,
+      issuer: process.env.OVERLEAF_SAML_ISSUER,
+      audience: process.env.OVERLEAF_SAML_AUDIENCE,
+      cert: readFilesContentFromEnv(process.env.OVERLEAF_SAML_IDP_CERT),
+      privateKey:  readFilesContentFromEnv(process.env.OVERLEAF_SAML_PRIVATE_KEY),
+      decryptionPvk:  readFilesContentFromEnv(process.env.OVERLEAF_SAML_DECRYPTION_PVK),
+      signatureAlgorithm: process.env.OVERLEAF_SAML_SIGNATURE_ALGORITHM,
+      additionalParams: JSON.parse(process.env.OVERLEAF_SAML_ADDITIONAL_PARAMS || '{}'),
+      additionalAuthorizeParams: JSON.parse(process.env.OVERLEAF_SAML_ADDITIONAL_AUTHORIZE_PARAMS || '{}'),
+      identifierFormat: process.env.OVERLEAF_SAML_IDENTIFIER_FORMAT,
+      acceptedClockSkewMs: numFromEnv(process.env.OVERLEAF_SAML_ACCEPTED_CLOCK_SKEW_MS),
+      attributeConsumingServiceIndex: process.env.OVERLEAF_SAML_ATTRIBUTE_CONSUMING_SERVICE_INDEX,
+      authnContext: process.env.OVERLEAF_SAML_AUTHN_CONTEXT ? JSON.parse(process.env.OVERLEAF_SAML_AUTHN_CONTEXT) : undefined,
+      forceAuthn: boolFromEnv(process.env.OVERLEAF_SAML_FORCE_AUTHN),
+      disableRequestedAuthnContext: boolFromEnv(process.env.OVERLEAF_SAML_DISABLE_REQUESTED_AUTHN_CONTEXT),
+      skipRequestCompression: process.env.OVERLEAF_SAML_AUTHN_REQUEST_BINDING === 'HTTP-POST',  // compression should be skipped iff authnRequestBinding is POST
+      authnRequestBinding: process.env.OVERLEAF_SAML_AUTHN_REQUEST_BINDING,
+      validateInResponseTo: process.env.OVERLEAF_SAML_VALIDATE_IN_RESPONSE_TO,
+      requestIdExpirationPeriodMs: numFromEnv(process.env.OVERLEAF_SAML_REQUEST_ID_EXPIRATION_PERIOD_MS),
+      // cacheProvider: process.env.OVERLEAF_SAML_CACHE_PROVIDER,
+      logoutUrl: process.env.OVERLEAF_SAML_LOGOUT_URL,
+      logoutCallbackUrl: `${Settings.siteUrl.replace(/\/+$/, '')}/saml/logout/callback`,
+      additionalLogoutParams: JSON.parse(process.env.OVERLEAF_SAML_ADDITIONAL_LOGOUT_PARAMS || '{}'),
+      wantAssertionsSigned: boolFromEnv(process.env.OVERLEAF_SAML_WANT_ASSERTIONS_SIGNED),
+      wantAuthnResponseSigned: boolFromEnv(process.env.OVERLEAF_SAML_WANT_AUTHN_RESPONSE_SIGNED),
+      passReqToCallback: true,
+    }
+    try {
+      passport.use(
+        new SAMLStrategy(
+          samlOptions,
+          SAMLAuthenticationController.doPassportLogin,
+          SAMLAuthenticationController.doPassportLogout
+        )
+      )
+      callback(null)
+    } catch (error) {
+      callback(error)
+    }
+  },
+  initPolicy() {
+    try {
+      PermissionsManager.registerCapability('change-password', { default : true })
+      PermissionsManager.registerCapability('use-ai', { default : false })
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+    const samlPolicyValidator = async ({ user, subscription }) => {
+// If user is not logged in, user.externalAuth is undefined,
+// in this case allow to change password if the user has a hashedPassword
+      return user.externalAuth === 'saml' || (user.externalAuth === undefined && !user.hashedPassword)
+    }
+    try {
+    PermissionsManager.registerPolicy(
+      'samlPolicy',
+      { 'change-password' : false },
+      { validator: samlPolicyValidator }
+    )
+    } catch (error) {
+      logger.info({}, error.message)
+    }
+  },
+  getGroupPolicyForUser(user, callback) {
+    PermissionsManager.promises.getUserValidationStatus({
+      user,
+      groupPolicy : { 'samlPolicy' : true },
+      subscription : null
+    }).then(userValidationMap => {
+      let groupPolicy = Object.fromEntries(userValidationMap)
+      callback(null, { groupPolicy })
+    }).catch(error => {
+      callback(error)
+    })
+  },
+}
+
+export default SAMLModuleManager
diff --git a/services/web/modules/authentication/saml/app/src/SAMLNonCsrfRouter.mjs b/services/web/modules/authentication/saml/app/src/SAMLNonCsrfRouter.mjs
new file mode 100644
index 0000000000..c0d617b299
--- /dev/null
+++ b/services/web/modules/authentication/saml/app/src/SAMLNonCsrfRouter.mjs
@@ -0,0 +1,11 @@
+import logger from '@overleaf/logger'
+import SAMLAuthenticationController from './SAMLAuthenticationController.mjs'
+
+export default {
+  apply(webRouter) {
+    logger.debug({}, 'Init SAML NonCsrfRouter')
+    webRouter.post('/saml/login/callback', SAMLAuthenticationController.passportLoginCallback)
+    webRouter.get ('/saml/logout/callback', SAMLAuthenticationController.passportLogoutCallback)
+    webRouter.post('/saml/logout/callback', SAMLAuthenticationController.passportLogoutCallback)
+  },
+}
diff --git a/services/web/modules/authentication/saml/app/src/SAMLRouter.mjs b/services/web/modules/authentication/saml/app/src/SAMLRouter.mjs
new file mode 100644
index 0000000000..3cd6e56e2d
--- /dev/null
+++ b/services/web/modules/authentication/saml/app/src/SAMLRouter.mjs
@@ -0,0 +1,16 @@
+import logger from '@overleaf/logger'
+import AuthenticationController from '../../../../../app/src/Features/Authentication/AuthenticationController.js'
+import UserController from '../../../../../app/src/Features/User/UserController.js'
+import SAMLAuthenticationController from './SAMLAuthenticationController.mjs'
+import logout from '../../../logout.mjs'
+
+export default {
+  apply(webRouter) {
+    logger.debug({}, 'Init SAML router')
+    webRouter.get('/saml/login', SAMLAuthenticationController.passportLogin)
+    AuthenticationController.addEndpointToLoginWhitelist('/saml/login')
+    webRouter.get('/saml/meta', SAMLAuthenticationController.getSPMetadata)
+    AuthenticationController.addEndpointToLoginWhitelist('/saml/meta')
+    webRouter.post('/logout', logout, UserController.logout)
+  },
+}
diff --git a/services/web/modules/authentication/saml/index.mjs b/services/web/modules/authentication/saml/index.mjs
new file mode 100644
index 0000000000..36f0281637
--- /dev/null
+++ b/services/web/modules/authentication/saml/index.mjs
@@ -0,0 +1,18 @@
+let samlModule = {}
+if (process.env.EXTERNAL_AUTH?.includes('saml')) {
+  const { default: SAMLModuleManager } = await import('./app/src/SAMLModuleManager.mjs')
+  const { default: router } = await import('./app/src/SAMLRouter.mjs')
+  const { default: nonCsrfRouter } = await import('./app/src/SAMLNonCsrfRouter.mjs')
+  SAMLModuleManager.initSettings()
+  SAMLModuleManager.initPolicy()
+  samlModule = {
+    name: 'saml-authentication',
+    hooks: {
+      passportSetup: SAMLModuleManager.passportSetup,
+      getGroupPolicyForUser: SAMLModuleManager.getGroupPolicyForUser,
+    },
+    router: router,
+    nonCsrfRouter: nonCsrfRouter,
+  }
+}
+export default samlModule
diff --git a/services/web/modules/authentication/utils.mjs b/services/web/modules/authentication/utils.mjs
new file mode 100644
index 0000000000..468dae32b1
--- /dev/null
+++ b/services/web/modules/authentication/utils.mjs
@@ -0,0 +1,42 @@
+import fs from 'fs'
+function readFilesContentFromEnv(envVar) {
+// envVar is either a file name: 'file.pem', or string with array: '["file.pem", "file2.pem"]'
+  if (!envVar) return undefined
+  try {
+    const parsedFileNames = JSON.parse(envVar)
+    return parsedFileNames.map(filename => fs.readFileSync(filename, 'utf8'))
+  } catch (error) {
+    if (error instanceof SyntaxError) { // failed to parse, envVar must be a file name
+      return fs.readFileSync(envVar, 'utf8')
+    } else {
+      throw error
+    }
+  }
+}
+function numFromEnv(env) {
+  return env ? Number(env) : undefined
+}
+function boolFromEnv(env) {
+  if (env === undefined || env === null) return undefined
+  if (typeof env === "string") {
+    const envLower = env.toLowerCase()
+    if (envLower === 'true') return true
+    if (envLower === 'false') return false
+  }
+  throw new Error("Invalid value for boolean envirionment variable")
+}
+
+function splitFullName(fullName) {
+  fullName = fullName.trim();
+  let lastSpaceIndex = fullName.lastIndexOf(' ');
+  let firstNames = fullName.substring(0, lastSpaceIndex).trim();
+  let lastName = fullName.substring(lastSpaceIndex + 1).trim();
+  return [firstNames, lastName];
+}
+
+export {
+  readFilesContentFromEnv,
+  numFromEnv,
+  boolFromEnv,
+  splitFullName,
+}
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-match-counts.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-match-counts.tsx
new file mode 100644
index 0000000000..c20187ae7e
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-match-counts.tsx
@@ -0,0 +1,32 @@
+import React, { FC } from 'react'
+import LoadingSpinner from '@/shared/components/loading-spinner'
+import { MatchedFile } from '../util/search-snapshot'
+import { useTranslation } from 'react-i18next'
+
+export const FullProjectMatchCounts: FC<{
+  loading: boolean
+  matchedFiles?: MatchedFile[]
+}> = ({ loading, matchedFiles }) => {
+  const { t } = useTranslation()
+
+  if (loading) {
+    return <LoadingSpinner delay={500} />
+  }
+
+  if (matchedFiles === undefined) {
+    return null
+  }
+
+  const totalResults = matchedFiles.flatMap(file => file.hits).length
+
+  if (totalResults === 0) {
+    return <>{t('project_search_result_count', { count: totalResults })}</>
+  }
+
+  return (
+    <>
+      {t('project_search_result_count', { count: totalResults })}{' '}
+      {t('project_search_file_count', { count: matchedFiles.length })}
+    </>
+  )
+}
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-search-button.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-search-button.tsx
new file mode 100644
index 0000000000..83031ba595
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-search-button.tsx
@@ -0,0 +1,57 @@
+import React, { FC, useMemo } from 'react'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import classnames from 'classnames'
+import MaterialIcon from '@/shared/components/material-icon'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useTranslation } from 'react-i18next'
+import { TooltipProps } from '@/features/ui/components/bootstrap-5/tooltip'
+import { isMac } from '@/shared/utils/os'
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+
+const FullProjectSearchButton: FC = () => {
+  const { projectSearchIsOpen, setProjectSearchIsOpen } = useLayoutContext()
+  const { t } = useTranslation()
+
+  const tooltipProps: Pick<
+    TooltipProps,
+    'id' | 'description' | 'overlayProps'
+  > = useMemo(
+    () => ({
+      id: 'search',
+      description: (
+        <>
+          <div>{t('search_project')}</div>
+          <div>{isMac ? '⇧⌘F' : 'Ctrl+Shift+F'}</div>
+        </>
+      ),
+      overlayProps: { placement: 'bottom' },
+    }),
+    [t]
+  )
+
+  return (
+    <OLTooltip {...tooltipProps}>
+      <button
+        className={classnames('btn', {
+          active: projectSearchIsOpen,
+        })}
+        onClick={() => {
+          if (!projectSearchIsOpen) {
+            sendSearchEvent('search-open', {
+              searchType: 'full-project',
+              method: 'button',
+              location: 'toolbar',
+            })
+          }
+          setProjectSearchIsOpen(value => !value)
+        }}
+        tabIndex={-1}
+        data-active={projectSearchIsOpen}
+      >
+        <MaterialIcon type="search" accessibilityLabel={t('search')} />
+      </button>
+    </OLTooltip>
+  )
+}
+
+export default FullProjectSearchButton
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-search-modifiers.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-search-modifiers.tsx
new file mode 100644
index 0000000000..465bf1363a
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-search-modifiers.tsx
@@ -0,0 +1,78 @@
+import React, { useRef, forwardRef, useImperativeHandle } from 'react'
+import { SearchQuery } from '@codemirror/search'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
+import { Form } from 'react-bootstrap'
+import { useTranslation } from 'react-i18next'
+
+export const FullProjectSearchModifiers = forwardRef(
+  function FullProjectSearchModifiers(props, ref) {
+    const { t } = useTranslation()
+
+    const caseSensitiveRef = useRef<HTMLInputElement>(null)
+    const regexpRef = useRef<HTMLInputElement>(null)
+    const wholeWordRef = useRef<HTMLInputElement>(null)
+
+    useImperativeHandle(ref, () => {
+      return {
+        setQuery(query: SearchQuery) {
+          caseSensitiveRef.current!.checked = query.caseSensitive
+          regexpRef.current!.checked = query.regexp
+          wholeWordRef.current!.checked = query.wholeWord
+        },
+      }
+    }, [])
+
+    return (
+      <div className="full-project-search-modifiers" role="group">
+        <OLTooltip
+          id="project-search-caseSensitive"
+          description={t('search_match_case')}
+          overlayProps={{ placement: 'bottom' }}
+        >
+          <span>
+            <Form.Check
+              inline
+              label="Aa"
+              name="caseSensitive"
+              type="checkbox"
+              id="project-search-caseSensitive"
+              ref={caseSensitiveRef}
+            />
+          </span>
+        </OLTooltip>
+        <OLTooltip
+          id="project-search-regexp"
+          description={t('search_regexp')}
+          overlayProps={{ placement: 'bottom' }}
+        >
+          <span>
+            <Form.Check
+              inline
+              label="[.*]"
+              name="regexp"
+              type="checkbox"
+              id="project-search-regexp"
+              ref={regexpRef}
+            />
+          </span>
+        </OLTooltip>
+        <OLTooltip
+          id="project-search-wholeWord"
+          description={t('search_whole_word')}
+          overlayProps={{ placement: 'bottom' }}
+        >
+          <span>
+            <Form.Check
+              inline
+              label="W"
+              name="wholeWord"
+              type="checkbox"
+              id="project-search-wholeWord"
+              ref={wholeWordRef}
+            />
+          </span>
+        </OLTooltip>
+      </div>
+    )
+  }
+)
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-search-results.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-search-results.tsx
new file mode 100644
index 0000000000..33ae590254
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-search-results.tsx
@@ -0,0 +1,174 @@
+import React, { FC, useCallback, useEffect, useRef, useState } from 'react'
+import { Hit, MatchedFile } from '../util/search-snapshot'
+import classnames from 'classnames'
+import { CollapsibleFileHeader } from '@/shared/components/collapsible-file-header'
+import { MatchedHit } from './matched-hit'
+import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
+import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+
+export const FullProjectSearchResults: FC<{
+  matchedFiles: MatchedFile[]
+  currentDocPath: string | null
+}> = ({ matchedFiles, currentDocPath }) => {
+  const [collapsedFiles, setCollapsedFiles] = useState<Set<string>>(new Set())
+  const [selectedHit, setSelectedHit] = useState<Hit>()
+
+  const toggleCollapse = useCallback((path: string) => {
+    setCollapsedFiles(value => {
+      const newValue = new Set(value)
+      if (newValue.has(path)) {
+        newValue.delete(path)
+      } else {
+        newValue.add(path)
+      }
+      return newValue
+    })
+  }, [])
+
+  const resultsContainerRef = useRef<HTMLDivElement>(null)
+
+  useEffect(() => {
+    const container = resultsContainerRef.current
+    if (container) {
+      const hits = matchedFiles.flatMap(file => file.hits)
+
+      const findSelectedHitIndex = () =>
+        hits.findIndex(hit => hit === selectedHit)
+
+      const listener = (event: KeyboardEvent) => {
+        if (event.ctrlKey || event.shiftKey || event.altKey || event.metaKey) {
+          return
+        }
+
+        if (!matchedFiles) {
+          return
+        }
+
+        switch (event.key) {
+          case 'Enter':
+          case ' ': // Space
+            window.setTimeout(() => {
+              window.dispatchEvent(new Event('editor:focus'))
+            })
+            break
+
+          case 'ArrowUp':
+            {
+              event.preventDefault()
+              let index = findSelectedHitIndex()
+              if (index === 0) {
+                index = hits.length
+              }
+              index--
+              if (index < 0) {
+                index = 0
+              }
+              setSelectedHit(hits[index])
+            }
+            break
+
+          case 'ArrowDown':
+            {
+              event.preventDefault()
+              let index = findSelectedHitIndex()
+              index++
+              if (index >= hits.length) {
+                index = 0
+              }
+              setSelectedHit(hits[index])
+            }
+            break
+        }
+      }
+
+      container.addEventListener('keydown', listener)
+
+      return () => {
+        container.removeEventListener('keydown', listener)
+      }
+    }
+  }, [matchedFiles, selectedHit, setSelectedHit])
+
+  const { findEntityByPath } = useFileTreePathContext()
+  const { openDocWithId, openFileWithId } = useEditorManagerContext()
+
+  const selectedHitRef = useRef<Hit>()
+
+  useEffect(() => {
+    // only open the doc if selectedHit has actually changed
+    if (selectedHit && selectedHit !== selectedHitRef.current) {
+      selectedHitRef.current = selectedHit
+      const selectedFile = matchedFiles.find(file =>
+        file.hits.includes(selectedHit)
+      )
+      if (selectedFile) {
+        const result = findEntityByPath(selectedFile.path)
+        if (result) {
+          sendSearchEvent('search-result-click', {
+            searchType: 'full-project',
+          })
+          const line = selectedHit.lineIndex
+          const column = selectedHit.matchIndex
+          const text = selectedFile.lines[line].substring(
+            column,
+            column + selectedHit.length
+          )
+          if (result.type === 'doc') {
+            openDocWithId(result.entity._id, {
+              gotoLine: line + 1,
+              gotoColumn: column,
+              selectText: text,
+            })
+          } else if (result.type === 'fileRef') {
+            openFileWithId(result.entity._id)
+          }
+        }
+      }
+    }
+  }, [
+    findEntityByPath,
+    matchedFiles,
+    openDocWithId,
+    openFileWithId,
+    selectedHit,
+  ])
+
+  const tabbableHit = selectedHit ?? matchedFiles?.[0]?.hits[0]
+
+  return (
+    <div className="matched-files" ref={resultsContainerRef}>
+      {matchedFiles.map(matchedFile => (
+        <div
+          key={matchedFile.path}
+          className={classnames('matched-file', {
+            'matched-file-open': currentDocPath === matchedFile.path,
+          })}
+        >
+          <CollapsibleFileHeader
+            name={matchedFile.path}
+            count={matchedFile.hits.length}
+            collapsed={collapsedFiles.has(matchedFile.path)}
+            toggleCollapsed={() => toggleCollapse(matchedFile.path)}
+          />
+          {!collapsedFiles.has(matchedFile.path) && (
+            <div className="list-group matched-file-hits" role="listbox">
+              {matchedFile.hits.map(hit => {
+                return (
+                  <MatchedHit
+                    key={`${hit.lineIndex}:${hit.matchIndex}`}
+                    matchedFile={matchedFile}
+                    hit={hit}
+                    selected={hit === selectedHit}
+                    setSelectedHit={setSelectedHit}
+                    tabIndex={tabbableHit === hit ? 0 : -1}
+                  />
+                )
+              })}
+            </div>
+          )}
+        </div>
+      ))}
+    </div>
+  )
+}
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-search-ui.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-search-ui.tsx
new file mode 100644
index 0000000000..69acc9e38c
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-search-ui.tsx
@@ -0,0 +1,252 @@
+import React, {
+  FC,
+  FormEventHandler,
+  memo,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from 'react'
+import { useTranslation } from 'react-i18next'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useProjectContext } from '@/shared/context/project-context'
+import {
+  MatchedFile as MatchedFileType,
+  searchSnapshot,
+} from '../util/search-snapshot'
+import { SearchQuery } from '@codemirror/search'
+import { debugConsole } from '@/utils/debugging'
+import useEventListener from '@/shared/hooks/use-event-listener'
+import { Col, Form, Row } from 'react-bootstrap'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
+import Button from '@/features/ui/components/bootstrap-5/button'
+import Notification from '@/shared/components/notification'
+import '../../stylesheets/full-project-search.scss'
+import { userStyles } from '@/shared/utils/styles'
+import { useUserSettingsContext } from '@/shared/context/user-settings-context'
+import { FullProjectMatchCounts } from './full-project-match-counts'
+import { FullProjectSearchModifiers } from './full-project-search-modifiers'
+import { isMac } from '@/shared/utils/os'
+import { PanelHeading } from '@/shared/components/panel-heading'
+import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
+import { createRegExp } from '../util/regexp'
+import { useEditorOpenDocContext } from '@/features/ide-react/context/editor-open-doc-context'
+import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
+import { FullProjectSearchResults } from './full-project-search-results'
+import { signalWithTimeout } from '@/utils/abort-signal'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+import RailPanelHeader from '@/features/ide-redesign/components/rail-panel-header'
+import { useActiveOverallTheme } from '@/shared/hooks/use-active-overall-theme'
+
+const FullProjectSearchUI: FC = () => {
+  const { t } = useTranslation()
+  const { setProjectSearchIsOpen } = useLayoutContext()
+  const { projectSnapshot } = useProjectContext()
+  const { openDocs } = useEditorManagerContext()
+  const { pathInFolder } = useFileTreePathContext()
+  const newEditor = useIsNewEditorEnabled()
+
+  const { currentDocument: currentDoc } = useEditorOpenDocContext()
+
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState<string>()
+  const [matchedFiles, setMatchedFiles] = useState<MatchedFileType[]>()
+
+  const { userSettings } = useUserSettingsContext()
+  const { fontFamily, fontSize } = useMemo(
+    () => userStyles(userSettings),
+    [userSettings]
+  )
+  const activeOverallTheme = useActiveOverallTheme()
+
+  const abortControllerRef = useRef<AbortController | null>(null)
+
+  // start fetching the snapshot when the project search UI opens
+  useEffect(() => {
+    projectSnapshot.refresh().catch(error => {
+      debugConsole.error(error)
+    })
+  }, [projectSnapshot])
+
+  const currentDocPath = useMemo(() => {
+    return currentDoc && pathInFolder(currentDoc.doc_id)
+  }, [currentDoc, pathInFolder])
+
+  const handleSubmit: React.FormEventHandler<HTMLFormElement> = useCallback(
+    async event => {
+      event.preventDefault()
+
+      setMatchedFiles(undefined)
+
+      abortControllerRef.current?.abort()
+      abortControllerRef.current = new AbortController()
+
+      const data = new FormData(event.target as HTMLFormElement)
+
+      const searchQuery = new SearchQuery({
+        search: data.get('search') as string,
+        // replace: data.get('replace') as string,
+        caseSensitive: data.get('caseSensitive') === 'on',
+        regexp: data.get('regexp') === 'on',
+        wholeWord: data.get('wholeWord') === 'on',
+        literal: data.get('regexp') !== 'on',
+      })
+
+      if (searchQuery.regexp) {
+        try {
+          createRegExp(searchQuery)
+        } catch (error) {
+          setError(t('invalid_regular_expression'))
+          return
+        }
+      }
+
+      setLoading(true)
+      setError(undefined)
+      try {
+        await openDocs.awaitBufferedOps(
+          signalWithTimeout(abortControllerRef.current.signal, 5000)
+        )
+
+        await projectSnapshot.refresh()
+        if (!abortControllerRef.current.signal.aborted) {
+          const results = await searchSnapshot(projectSnapshot, searchQuery)
+          setMatchedFiles(results)
+        }
+      } catch (error) {
+        debugConsole.error(error)
+        setError(t('generic_something_went_wrong'))
+      } finally {
+        setLoading(false)
+      }
+    },
+    [openDocs, projectSnapshot, t]
+  )
+
+  const searchInputRef = useRef<HTMLInputElement>(null)
+
+  const handleKeyDown: React.KeyboardEventHandler<HTMLElement> = useCallback(
+    event => {
+      if (event.key === 'Escape') {
+        setProjectSearchIsOpen(false)
+      }
+    },
+    [setProjectSearchIsOpen]
+  )
+
+  useEventListener(
+    'keydown',
+    useCallback((event: KeyboardEvent) => {
+      if (
+        (isMac ? event.metaKey : event.ctrlKey) &&
+        event.shiftKey &&
+        event.code === 'KeyF'
+      ) {
+        searchInputRef.current?.focus()
+      }
+    }, [])
+  )
+
+  const modifiersRef = useRef<{ setQuery(query: SearchQuery): void }>(null)
+
+  useEventListener(
+    'editor:full-project-search',
+    useCallback((event: CustomEvent<SearchQuery>) => {
+      if (modifiersRef.current != null) {
+        modifiersRef.current.setQuery(event.detail)
+      }
+      if (searchInputRef.current != null) {
+        searchInputRef.current.value = event.detail.search
+        searchInputRef.current.form?.dispatchEvent(
+          new Event('submit', { cancelable: true, bubbles: true })
+        )
+      }
+    }, [])
+  )
+
+  // clear the results when the form is cleared
+  const handleInput: FormEventHandler<HTMLInputElement> = useCallback(event => {
+    if (
+      event instanceof InputEvent &&
+      event.inputType === undefined &&
+      (event.target as HTMLInputElement).value.length === 0
+    ) {
+      setMatchedFiles(undefined)
+    }
+  }, [])
+
+  const variableStyle = {
+    '--font-family': fontFamily,
+    '--font-size': fontSize,
+  } as React.CSSProperties
+
+  return (
+    <div
+      className="full-project-search"
+      style={variableStyle}
+      data-bs-theme={activeOverallTheme === 'light' ? 'light' : 'dark'}
+    >
+      {newEditor ? (
+        <RailPanelHeader title={t('search')} />
+      ) : (
+        <PanelHeading
+          title={t('search')}
+          handleClose={() => setProjectSearchIsOpen(false)}
+          splitTestName="full-project-search"
+        />
+      )}
+
+      <div // eslint-disable-line jsx-a11y/no-static-element-interactions
+        className="full-project-search-form"
+        onKeyDown={handleKeyDown}
+      >
+        <Form
+          onSubmit={handleSubmit}
+          role="search"
+          id="full-project-search"
+          aria-label={t('search_all_project_files')}
+        >
+          <Row className="g-1">
+            <Col>
+              <OLFormControl
+                type="search"
+                name="search"
+                size="sm"
+                aria-label={t('search')}
+                autoFocus // eslint-disable-line jsx-a11y/no-autofocus
+                spellCheck={false}
+                autoComplete="off"
+                ref={searchInputRef}
+                onInput={handleInput}
+                placeholder={`${t('search_all_project_files')}…`}
+              />
+            </Col>
+            <Col className="col-auto">
+              <Button type="submit" className="btn btn-primary" size="sm">
+                {t('search')}
+              </Button>
+            </Col>
+          </Row>
+
+          <FullProjectSearchModifiers ref={modifiersRef} />
+        </Form>
+      </div>
+
+      {error && <Notification type="error" content={error} />}
+
+      <div className="match-counts">
+        <FullProjectMatchCounts loading={loading} matchedFiles={matchedFiles} />
+      </div>
+
+      {matchedFiles && (
+        <FullProjectSearchResults
+          matchedFiles={matchedFiles}
+          currentDocPath={currentDocPath}
+        />
+      )}
+    </div>
+  )
+}
+
+export default memo(FullProjectSearchUI)
diff --git a/services/web/modules/full-project-search/frontend/js/components/full-project-search.tsx b/services/web/modules/full-project-search/frontend/js/components/full-project-search.tsx
new file mode 100644
index 0000000000..7720b21589
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/full-project-search.tsx
@@ -0,0 +1,22 @@
+import React, { FC, lazy, Suspense } from 'react'
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useIsNewEditorEnabled } from '@/features/ide-redesign/utils/new-editor-utils'
+
+const FullProjectSearchUI = lazy(() => import('./full-project-search-ui'))
+
+const FullProjectSearch: FC = () => {
+  const { projectSearchIsOpen } = useLayoutContext()
+  const newEditor = useIsNewEditorEnabled()
+
+  if (!projectSearchIsOpen && !newEditor) {
+    return null
+  }
+
+  return (
+    <Suspense fallback={null}>
+      <FullProjectSearchUI />
+    </Suspense>
+  )
+}
+
+export default FullProjectSearch
diff --git a/services/web/modules/full-project-search/frontend/js/components/matched-hit-highlight.tsx b/services/web/modules/full-project-search/frontend/js/components/matched-hit-highlight.tsx
new file mode 100644
index 0000000000..8f7122cb22
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/matched-hit-highlight.tsx
@@ -0,0 +1,49 @@
+import React, { FC, useMemo } from 'react'
+import { Hit } from '../util/search-snapshot'
+
+export const MatchedHitHighlight: FC<{ text: string; hit: Hit }> = ({
+  text,
+  hit,
+}) => {
+  const parts = useMemo(() => {
+    let before = text.substring(0, hit.matchIndex).trimStart()
+    const match = text.substring(hit.matchIndex, hit.matchIndex + hit.length)
+    let after = text.substring(hit.matchIndex + hit.length).trimEnd()
+
+    // reduce the prefix to a sensible size before trimming
+    if (before.length > 250) {
+      before = before.substring(before.length - 250)
+    }
+
+    while (before.length > 10) {
+      const replacement = before.replace(/^\S+\s+/, '')
+      if (before.length === replacement.length) {
+        break
+      }
+      before = replacement
+    }
+
+    // reduce the suffix to a sensible size before trimming
+    if (after.length > 250) {
+      after = after.substring(0, 250)
+    }
+
+    while (after.length > 100) {
+      const replacement = after.replace(/\s+\S+$/, '')
+      if (after.length === replacement.length) {
+        break
+      }
+      after = replacement
+    }
+
+    return { before, match, after }
+  }, [hit, text])
+
+  return (
+    <span className="matched-hit-snippet">
+      {parts.before}
+      <b className="matched-hit-highlight">{parts.match}</b>
+      {parts.after}
+    </span>
+  )
+}
diff --git a/services/web/modules/full-project-search/frontend/js/components/matched-hit.tsx b/services/web/modules/full-project-search/frontend/js/components/matched-hit.tsx
new file mode 100644
index 0000000000..2652e589b4
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/components/matched-hit.tsx
@@ -0,0 +1,45 @@
+import { FC, useCallback, useLayoutEffect, useRef } from 'react'
+import { Hit, MatchedFile } from '../util/search-snapshot'
+import { MatchedHitHighlight } from './matched-hit-highlight'
+import classnames from 'classnames'
+
+export const MatchedHit: FC<{
+  matchedFile: MatchedFile
+  hit: Hit
+  selected?: boolean
+  setSelectedHit(hit?: Hit): void
+  tabIndex: 0 | -1
+}> = ({ matchedFile, hit, selected = false, setSelectedHit, tabIndex }) => {
+  const containerRef = useRef<HTMLButtonElement>(null)
+
+  useLayoutEffect(() => {
+    if (selected) {
+      containerRef.current?.focus()
+    }
+  }, [selected])
+
+  const handleSelect: React.MouseEventHandler = useCallback(
+    event => {
+      event.preventDefault()
+      setSelectedHit(hit)
+    },
+    [hit, setSelectedHit]
+  )
+
+  return (
+    <button
+      className={classnames('list-group-item matched-file-hit', {
+        'matched-file-hit-selected': selected,
+      })}
+      ref={containerRef}
+      tabIndex={tabIndex}
+      onMouseDown={handleSelect}
+      aria-selected={selected}
+      role="option"
+    >
+      <span className="matched-line-number">{hit.lineIndex + 1}</span>
+
+      <MatchedHitHighlight text={matchedFile.lines[hit.lineIndex]} hit={hit} />
+    </button>
+  )
+}
diff --git a/services/web/modules/full-project-search/frontend/js/util/regexp.ts b/services/web/modules/full-project-search/frontend/js/util/regexp.ts
new file mode 100644
index 0000000000..7795d05911
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/util/regexp.ts
@@ -0,0 +1,7 @@
+import { SearchQuery } from '@codemirror/search'
+
+export const createRegExp = (searchQuery: SearchQuery) => {
+  const flags = 'gmu' + (searchQuery.caseSensitive ? '' : 'i')
+
+  return new RegExp(searchQuery.search, flags)
+}
diff --git a/services/web/modules/full-project-search/frontend/js/util/search-snapshot.ts b/services/web/modules/full-project-search/frontend/js/util/search-snapshot.ts
new file mode 100644
index 0000000000..2abb5626b9
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/util/search-snapshot.ts
@@ -0,0 +1,92 @@
+import { Text } from '@codemirror/state'
+import { RegExpCursor, SearchCursor, SearchQuery } from '@codemirror/search'
+import { ProjectSnapshot } from '@/infrastructure/project-snapshot'
+import { categorizer, regexpWordTest, stringWordTest } from './search'
+import { sendSearchEvent } from '@/features/event-tracking/search-events'
+
+export type Hit = {
+  lineIndex: number
+  matchIndex: number
+  length: number
+}
+
+export type MatchedFile = {
+  path: string
+  lines: string[]
+  hits: Hit[]
+}
+
+const toLowerCase = (string: string) => string.toLowerCase()
+
+export const searchSnapshot = async (
+  projectSnapshot: ProjectSnapshot,
+  searchQuery: SearchQuery
+) => {
+  if (!searchQuery.search.trim().length) {
+    return
+  }
+
+  const matchedFiles = new Map<string, MatchedFile>()
+
+  const createCursor = (text: Text) => {
+    if (searchQuery.regexp) {
+      return new RegExpCursor(text, searchQuery.search, {
+        ignoreCase: !searchQuery.caseSensitive,
+        test: searchQuery.wholeWord ? regexpWordTest(categorizer) : undefined,
+      })
+    }
+
+    return new SearchCursor(
+      text,
+      searchQuery.search,
+      undefined,
+      undefined,
+      searchQuery.caseSensitive ? undefined : toLowerCase,
+      searchQuery.wholeWord ? stringWordTest(text, categorizer) : undefined
+    )
+  }
+
+  const docPaths = projectSnapshot.getDocPaths()
+
+  for (const path of docPaths) {
+    const content = projectSnapshot.getDocContents(path)
+    if (content) {
+      const lines = content.split('\n')
+      const text = Text.of(lines)
+
+      const cursor = createCursor(text)
+
+      while (!cursor.next().done) {
+        const { from, to } = cursor.value
+
+        const matchedFile: MatchedFile = matchedFiles.get(path) ?? {
+          path,
+          lines,
+          hits: [],
+        }
+
+        const line = text.lineAt(from)
+
+        matchedFile.hits.push({
+          lineIndex: line.number - 1,
+          matchIndex: from - line.from,
+          length: to - from,
+        })
+
+        matchedFiles.set(path, matchedFile)
+      }
+    }
+  }
+
+  const results = [...matchedFiles.values()].sort((a, b) =>
+    a.path.localeCompare(b.path)
+  )
+
+  sendSearchEvent('search-execute', {
+    searchType: 'full-project',
+    totalDocs: docPaths.length,
+    totalResults: results.flatMap(file => file.hits).length,
+  })
+
+  return results
+}
diff --git a/services/web/modules/full-project-search/frontend/js/util/search.ts b/services/web/modules/full-project-search/frontend/js/util/search.ts
new file mode 100644
index 0000000000..69078f6323
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/js/util/search.ts
@@ -0,0 +1,50 @@
+/**
+ * The functions in this module are from @codemirror/search (MIT license)
+ * https://github.com/codemirror/search/blob/c1ee7d4b0babd0de0d1198a7c1ece2a387c97c0d/src/search.ts
+ */
+
+import { CharCategory, findClusterBreak, Text } from '@codemirror/state'
+
+const charBefore = (str: string, index: number) =>
+  str.slice(findClusterBreak(str, index, false), index)
+
+const charAfter = (str: string, index: number) =>
+  str.slice(index, findClusterBreak(str, index))
+
+export const categorizer = (char: string) => {
+  if (/\s/.test(char)) {
+    return CharCategory.Space
+  }
+
+  if (/\w/.test(char)) {
+    return CharCategory.Word
+  }
+
+  return CharCategory.Other
+}
+
+export const stringWordTest =
+  (doc: Text, categorizer: (ch: string) => CharCategory) =>
+  (from: number, to: number, buf: string, bufPos: number) => {
+    if (bufPos > from || bufPos + buf.length < to) {
+      bufPos = Math.max(0, from - 2)
+      buf = doc.sliceString(bufPos, Math.min(doc.length, to + 2))
+    }
+    return (
+      (categorizer(charBefore(buf, from - bufPos)) !== CharCategory.Word ||
+        categorizer(charAfter(buf, from - bufPos)) !== CharCategory.Word) &&
+      (categorizer(charAfter(buf, to - bufPos)) !== CharCategory.Word ||
+        categorizer(charBefore(buf, to - bufPos)) !== CharCategory.Word)
+    )
+  }
+
+export const regexpWordTest =
+  (categorizer: (ch: string) => CharCategory) =>
+  (_from: number, _to: number, match: RegExpExecArray) =>
+    !match[0].length ||
+    ((categorizer(charBefore(match.input, match.index)) !== CharCategory.Word ||
+      categorizer(charAfter(match.input, match.index)) !== CharCategory.Word) &&
+      (categorizer(charAfter(match.input, match.index + match[0].length)) !==
+        CharCategory.Word ||
+        categorizer(charBefore(match.input, match.index + match[0].length)) !==
+          CharCategory.Word))
diff --git a/services/web/modules/full-project-search/frontend/stylesheets/full-project-search.scss b/services/web/modules/full-project-search/frontend/stylesheets/full-project-search.scss
new file mode 100644
index 0000000000..b434205a63
--- /dev/null
+++ b/services/web/modules/full-project-search/frontend/stylesheets/full-project-search.scss
@@ -0,0 +1,356 @@
+@use 'sass:color';
+
+.ide-redesign-main {
+  .full-project-search {
+    --full-project-search-bg-color: var(--white);
+    --full-project-search-color: var(--content-primary);
+    --full-project-search-results-bg-color: var(--bg-light-primary);
+    --full-project-search-selected-hit-bg-color: var(--bg-accent-03);
+    --full-project-search-selected-hit-color: var(--green-70);
+    --matched-hit-highlight-color: var(--yellow-10);
+    --matched-hit-selected-highlight-color: var(--bg-accent-02);
+    --matched-hit-selected-unfocused-highlight-color: var(--bg-accent-02);
+    --collapsible-file-header-count-color: var(--content-primary);
+    --collapsible-file-header-count-bg-color: var(--bg-light-tertiary);
+    --search-modifier-checked-bg: var(--bg-accent-03);
+    --search-modifier-hover-color: var(--bg-light-secondary);
+
+    // Redesign additions
+    --full-project-search-border-color: var(--border-divider);
+    --collapsible-file-header-hover-bg: var(--bg-light-secondary);
+    --matched-hit-highlight-text-color: var(--content-primary);
+    --matched-file-hit-hover-bg: var(--bg-light-secondary);
+    --search-modifier-checked-color: var(--green-70);
+    --search-modifier-color: var(--content-primary);
+
+    &[data-bs-theme='dark'] {
+      --full-project-search-bg-color: var(--bg-dark-primary);
+      --full-project-search-color: var(--content-secondary-dark);
+      --full-project-search-results-bg-color: var(--bg-dark-primary);
+      --full-project-search-selected-hit-bg-color: var(--green-70);
+      --full-project-search-selected-hit-color: var(--green-10);
+      --matched-hit-highlight-color: var(--yellow-70);
+      --matched-hit-selected-highlight-color: var(--green-70);
+      --matched-hit-selected-unfocused-highlight-color: var(--content-primary);
+      --collapsible-file-header-count-color: var(--content-primary);
+      --collapsible-file-header-count-bg-color: var(--bg-light-tertiary);
+      --panel-heading-color: var(--content-primary-dark);
+      --search-modifier-checked-bg: var(--green-70);
+      --search-modifier-hover-color: var(--bg-dark-secondary);
+
+      // Redesign additions
+      --full-project-search-border-color: var(--border-divider-dark);
+      --collapsible-file-header-hover-bg: var(--bg-dark-secondary);
+      --matched-hit-highlight-text-color: var(--green-10);
+      --matched-file-hit-hover-bg: var(--bg-dark-secondary);
+      --search-modifier-checked-color: var(--green-10);
+      --search-modifier-color: var(--content-primary-dark);
+
+      input[type='search']::selection {
+        background-color: #b4d1ff;
+      }
+    }
+
+    .full-project-search-modifiers {
+      input:checked ~ .form-check-label {
+        color: var(--search-modifier-checked-color);
+      }
+
+      .form-check-label {
+        color: var(--search-modifier-color);
+      }
+    }
+
+    .full-project-search-form {
+      border-bottom: 1px solid var(--full-project-search-border-color);
+    }
+
+    .match-counts {
+      padding: var(--spacing-03) var(--spacing-04);
+      font-size: var(--font-size-01);
+    }
+
+    .matched-files {
+      padding: 0 var(--spacing-02);
+    }
+
+    .matched-hit-highlight {
+      color: var(--matched-hit-highlight-text-color);
+    }
+
+    .matched-file-hits {
+      width: unset;
+      overflow: unset;
+      margin-left: var(--spacing-08);
+      position: relative;
+
+      &::before {
+        content: '';
+        position: absolute;
+        left: calc(var(--spacing-04) * -1);
+        top: 0;
+        width: 1px;
+        height: 100%;
+        background-color: var(--full-project-search-border-color);
+        border-radius: 0;
+      }
+    }
+
+    .matched-file-hit {
+      border-radius: var(--border-radius-base);
+
+      &:hover {
+        background-color: var(--matched-file-hit-hover-bg);
+      }
+
+      &.matched-file-hit-selected:hover {
+        background-color: var(--full-project-search-selected-hit-bg-color);
+        color: var(--full-project-search-selected-hit-color);
+      }
+    }
+
+    .collapsible-file-header {
+      border-radius: var(--border-radius-base);
+
+      &:hover {
+        background-color: var(--collapsible-file-header-hover-bg);
+      }
+    }
+  }
+}
+
+.full-project-search {
+  --full-project-search-bg-color: var(--bg-light-secondary);
+  --full-project-search-color: var(--content-secondary);
+  --full-project-search-results-bg-color: var(--bg-light-primary);
+  --full-project-search-selected-hit-bg-color: var(--bg-light-tertiary);
+  --full-project-search-selected-hit-color: var(--content-primary-light);
+  --matched-hit-highlight-color: var(--bg-light-tertiary);
+  --matched-hit-selected-highlight-color: var(--bg-accent-02);
+  --matched-hit-selected-unfocused-highlight-color: var(--bg-accent-02);
+  --collapsible-file-header-count-color: var(--bs-body-color);
+  --collapsible-file-header-count-bg-color: var(--bg-light-secondary);
+  --search-modifier-checked-bg: var(--neutral-30);
+  --search-modifier-hover-color: var(--neutral-20);
+
+  &[data-bs-theme='dark'] {
+    --full-project-search-bg-color: var(--bg-dark-secondary);
+    --full-project-search-color: var(--content-secondary-dark);
+    --full-project-search-results-bg-color: var(--bg-dark-tertiary);
+    --full-project-search-selected-hit-bg-color: var(--bg-dark-secondary);
+    --full-project-search-selected-hit-color: var(--content-primary-dark);
+    --matched-hit-highlight-color: var(--bg-dark-secondary);
+    --matched-hit-selected-highlight-color: var(--bg-accent-02);
+    --matched-hit-selected-unfocused-highlight-color: var(--bg-dark-primary);
+    --collapsible-file-header-count-color: var(--bs-body-color);
+    --collapsible-file-header-count-bg-color: var(--bg-dark-secondary);
+    --panel-heading-color: var(--content-primary-dark);
+    --search-modifier-checked-bg: var(--neutral-90);
+    --search-modifier-hover-color: var(--neutral-70);
+
+    input[type='search']::selection {
+      background-color: #b4d1ff;
+    }
+
+    .full-project-search-modifiers {
+      .form-check-label {
+        color: inherit;
+      }
+    }
+
+    .panel-heading-close-button {
+      color: var(--content-primary-dark);
+
+      &:hover,
+      &:focus {
+        color: var(--content-primary);
+      }
+    }
+  }
+
+  position: absolute;
+  inset: 0;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  z-index: 2;
+  background-color: var(--full-project-search-bg-color);
+  color: var(--full-project-search-color);
+
+  .full-project-search-heading {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: var(--spacing-02);
+    font-weight: bold;
+  }
+
+  .panel-heading-label {
+    margin-left: var(--spacing-02);
+  }
+
+  .full-project-search-form {
+    padding: 8px;
+    flex-shrink: 0;
+  }
+
+  .form-check {
+    padding-left: 0;
+  }
+
+  .form-check-inline {
+    display: inline-flex;
+    gap: var(--spacing-02);
+    margin-right: 0;
+  }
+
+  .full-project-search-modifiers {
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-03);
+    margin-top: var(--spacing-02);
+
+    input[type='checkbox'] {
+      position: relative;
+      left: -999px;
+    }
+
+    .form-check-label {
+      border-radius: 50%;
+      cursor: pointer;
+      display: inline-flex;
+      width: 2em;
+      height: 2em;
+      align-items: center;
+      justify-content: center;
+      font-size: 90%;
+
+      &:hover,
+      &:focus {
+        background-color: var(--search-modifier-hover-color);
+      }
+    }
+
+    input:focus-visible ~ .form-check-label {
+      box-shadow: 0 0 0 2px var(--border-active-dark);
+    }
+
+    input:checked ~ .form-check-label {
+      background-color: var(--search-modifier-checked-bg);
+    }
+  }
+
+  .match-counts {
+    font-size: 80%;
+    padding: 0 var(--spacing-04) var(--spacing-04);
+  }
+
+  .matched-files {
+    flex: 1;
+    overflow: auto;
+    font-size: 14px;
+    background-color: var(--full-project-search-results-bg-color);
+  }
+
+  .matched-file {
+    margin-bottom: 8px;
+
+    .collapsible-file-header:focus-visible {
+      box-shadow: 0 0 0 2px var(--border-active-dark);
+    }
+  }
+
+  .collapsible-file-header {
+    position: sticky;
+    top: 0;
+    z-index: 1;
+    background-color: var(--full-project-search-results-bg-color);
+    color: inherit;
+  }
+
+  .collapsible-file-header-count {
+    background-color: var(--collapsible-file-header-count-bg-color);
+    color: var(--collapsible-file-header-count-color);
+  }
+
+  .matched-file-hits {
+    width: 100%;
+    overflow: hidden;
+    border-radius: 0;
+  }
+
+  .matched-line-number {
+    white-space: nowrap;
+    margin-right: 8px;
+    color: #aaa;
+  }
+
+  .matched-file-hit {
+    border: none;
+    cursor: pointer;
+    align-items: flex-start;
+    padding: var(--spacing-02) var(--spacing-05);
+    word-break: break-all;
+    white-space: nowrap;
+    text-align: left;
+    font-family: var(--font-family);
+    font-size: var(--font-size);
+    min-height: fit-content;
+    border-radius: 0;
+    background-color: var(--full-project-search-results-bg-color);
+
+    &:hover {
+      background-color: var(--full-project-search-bg-color);
+    }
+
+    &.matched-file-hit-highlighted {
+      background-color: var(--full-project-search-bg-color);
+    }
+  }
+
+  .matched-hit-snippet {
+    overflow-wrap: break-word;
+    overflow: hidden;
+  }
+
+  .notification {
+    margin: var(--spacing-02) var(--spacing-04) var(--spacing-06);
+    width: auto;
+    align-items: center;
+    padding: 0 var(--spacing-04);
+
+    .notification-content {
+      padding: var(--spacing-02) 0;
+    }
+
+    .notification-icon {
+      padding: var(--spacing-02) var(--spacing-04) 0 0;
+    }
+  }
+
+  .matched-hit-highlight {
+    background-color: var(--matched-hit-highlight-color);
+    border-radius: 4px;
+    overflow-wrap: normal;
+  }
+
+  .matched-file-hit-selected {
+    background-color: var(--full-project-search-selected-hit-bg-color);
+    color: var(--full-project-search-selected-hit-color);
+
+    .matched-hit-highlight {
+      background-color: var(--matched-hit-unfocused-highlight-color);
+    }
+  }
+
+  /* &:focus-within {
+    .matched-file-hit-selected {
+      background-color: var(--bg-accent-01);
+      color: var(--bg-light-primary);
+
+      .matched-hit-highlight {
+        background-color: var(--matched-hit-selected-highlight-color);
+      }
+    }
+  } */
+}
diff --git a/services/web/modules/full-project-search/stories/full-project-search.stories.tsx b/services/web/modules/full-project-search/stories/full-project-search.stories.tsx
new file mode 100644
index 0000000000..e599fabecd
--- /dev/null
+++ b/services/web/modules/full-project-search/stories/full-project-search.stories.tsx
@@ -0,0 +1,113 @@
+import { Meta, StoryObj } from '@storybook/react'
+import { ScopeDecorator } from '../../../frontend/stories/decorators/scope'
+import useFetchMock from '../../../frontend/stories/hooks/use-fetch-mock'
+import FullProjectSearchUI from '../frontend/js/components/full-project-search-ui'
+
+const meta = {
+  title: 'Editor / Full Project Search',
+  component: FullProjectSearchUI,
+  decorators: [
+    Story => ScopeDecorator(Story, { mockCompileOnLoad: true }),
+    Story => {
+      useFetchMock(fetchMock => {
+        fetchMock.post('express:/project/:projectId/flush', { status: 204 })
+
+        fetchMock.get('express:/project/:projectId/latest/history', {
+          status: 200,
+          body: {
+            chunk: {
+              history: {
+                snapshot: {
+                  files: {},
+                },
+                changes: [
+                  {
+                    operations: [
+                      {
+                        pathname: 'main.tex',
+                        file: {
+                          hash: '5199b66d9d1226551be436c66bad9d962cc05537',
+                          stringLength: 7066,
+                        },
+                      },
+                    ],
+                    timestamp: '2025-01-03T10:10:40.840Z',
+                    authors: [],
+                    v2Authors: ['66e040e0da7136ec75ffe8a3'],
+                    projectVersion: '1.0',
+                  },
+                  {
+                    operations: [
+                      {
+                        pathname: 'sample.bib',
+                        file: {
+                          hash: 'a0e21c740cf81e868f158e30e88985b5ea1d6c19',
+                          stringLength: 244,
+                        },
+                      },
+                    ],
+                    timestamp: '2025-01-03T10:10:40.856Z',
+                    authors: [],
+                    v2Authors: ['66e040e0da7136ec75ffe8a3'],
+                    projectVersion: '2.0',
+                  },
+                  {
+                    operations: [
+                      {
+                        pathname: 'frog.jpg',
+                        file: {
+                          hash: '5b889ef3cf71c83a4c027c4e4dc3d1a106b27809',
+                          byteLength: 97080,
+                        },
+                      },
+                    ],
+                    timestamp: '2025-01-03T10:10:40.890Z',
+                    authors: [],
+                    v2Authors: ['66e040e0da7136ec75ffe8a3'],
+                    projectVersion: '3.0',
+                  },
+                ],
+              },
+              startVersion: 0,
+            },
+          },
+        })
+
+        fetchMock.get('express:/project/:projectId/changes', {
+          status: 200,
+          body: [],
+        })
+
+        fetchMock.get(
+          'express:/project/:projectId/blob/5199b66d9d1226551be436c66bad9d962cc05537',
+          {
+            status: 200,
+            body: `Simply use the section and subsection commands, as in this example document! With Overleaf, all the formatting and numbering is handled automatically according to the template you've chosen. If you're using the Visual Editor, you can also create new section and subsections via the buttons in the editor toolbar.`,
+          }
+        )
+
+        fetchMock.get(
+          'express:/project/:projectId/blob/a0e21c740cf81e868f158e30e88985b5ea1d6c19',
+          {
+            status: 200,
+            body: `@article{greenwade93,
+    author  = "George D. Greenwade",
+    title   = "The {C}omprehensive {T}ex {A}rchive {N}etwork ({CTAN})",
+    year    = "1993",
+    journal = "TUGBoat",
+    volume  = "14",
+    number  = "3",
+    pages   = "342--351"
+}`,
+          }
+        )
+      })
+      return <Story />
+    },
+  ],
+} satisfies Meta<typeof FullProjectSearchUI>
+
+export default meta
+type Story = StoryObj<typeof FullProjectSearchUI>
+
+export const UI = {} satisfies Story
diff --git a/services/web/modules/history-v1/test/acceptance/src/ProjectStructureTests.mjs b/services/web/modules/history-v1/test/acceptance/src/ProjectStructureTests.mjs
index 6d7037ac15..9bd87674ce 100644
--- a/services/web/modules/history-v1/test/acceptance/src/ProjectStructureTests.mjs
+++ b/services/web/modules/history-v1/test/acceptance/src/ProjectStructureTests.mjs
@@ -8,7 +8,6 @@ import _ from 'lodash'
 import ProjectGetter from '../../../../../app/src/Features/Project/ProjectGetter.js'
 import User from '../../../../../test/acceptance/src/helpers/User.mjs'
 import MockDocUpdaterApiClass from '../../../../../test/acceptance/src/mocks/MockDocUpdaterApi.mjs'
-import Features from '../../../../../app/src/infrastructure/Features.js'
 
 const { ObjectId } = mongodb
 
@@ -188,32 +187,25 @@ describe('ProjectStructureChanges', function () {
   const cases = [
     {
       label: 'with filestore disabled and project-history-blobs enabled',
-      disableFilestore: true,
-      enableProjectHistoryBlobs: true,
+      filestoreMigrationLevel: 2,
     },
     {
       label: 'with filestore enabled and project-history-blobs enabled',
-      disableFilestore: false,
-      enableProjectHistoryBlobs: true,
+      filestoreMigrationLevel: 1,
     },
     {
       label: 'with filestore enabled and project-history-blobs disabled',
-      disableFilestore: false,
-      enableProjectHistoryBlobs: false,
+      filestoreMigrationLevel: 0,
     },
   ]
-  for (const { label, disableFilestore, enableProjectHistoryBlobs } of cases) {
+  for (const { label, filestoreMigrationLevel } of cases) {
     describe(label, function () {
-      const previousDisableFilestore = Settings.disableFilestore
-      const previousEnableProjectHistoryBlobs =
-        Settings.enableProjectHistoryBlobs
+      const previousFilestoreMigrationLevel = Settings.filestoreMigrationLevel
       beforeEach(function () {
-        Settings.disableFilestore = disableFilestore
-        Settings.enableProjectHistoryBlobs = enableProjectHistoryBlobs
+        Settings.filestoreMigrationLevel = filestoreMigrationLevel
       })
       afterEach(function () {
-        Settings.disableFilestore = previousDisableFilestore
-        Settings.enableProjectHistoryBlobs = previousEnableProjectHistoryBlobs
+        Settings.filestoreMigrationLevel = previousFilestoreMigrationLevel
       })
 
       describe('creating a project from the example template', function () {
@@ -244,7 +236,7 @@ describe('ProjectStructureChanges', function () {
           expect(updates[2].type).to.equal('add-file')
           expect(updates[2].userId).to.equal(owner._id)
           expect(updates[2].pathname).to.equal('/frog.jpg')
-          if (disableFilestore) {
+          if (filestoreMigrationLevel === 2) {
             expect(updates[2].url).to.not.exist
             expect(updates[2].createdBlob).to.be.true
           } else {
@@ -301,10 +293,10 @@ describe('ProjectStructureChanges', function () {
           expect(updates[2].type).to.equal('add-file')
           expect(updates[2].userId).to.equal(owner._id)
           expect(updates[2].pathname).to.equal('/frog.jpg')
-          if (disableFilestore) {
+          if (filestoreMigrationLevel === 2) {
             expect(updates[2].url).to.not.exist
             expect(updates[2].createdBlob).to.be.true
-          } else if (Features.hasFeature('project-history-blobs')) {
+          } else if (filestoreMigrationLevel === 1) {
             expect(updates[2].url).to.be.null
           } else {
             expect(updates[2].url).to.be.a('string')
@@ -378,7 +370,7 @@ describe('ProjectStructureChanges', function () {
           expect(updates[1].type).to.equal('add-file')
           expect(updates[1].userId).to.equal(owner._id)
           expect(updates[1].pathname).to.equal('/1pixel.png')
-          if (disableFilestore) {
+          if (filestoreMigrationLevel === 2) {
             expect(updates[1].url).to.not.exist
             expect(updates[1].createdBlob).to.be.true
           } else {
@@ -478,7 +470,7 @@ describe('ProjectStructureChanges', function () {
           expect(update.type).to.equal('add-file')
           expect(update.userId).to.equal(owner._id)
           expect(update.pathname).to.equal('/1pixel.png')
-          if (disableFilestore) {
+          if (filestoreMigrationLevel === 2) {
             expect(update.url).to.not.exist
             expect(update.createdBlob).to.be.true
           } else {
@@ -516,7 +508,7 @@ describe('ProjectStructureChanges', function () {
               expect(updates[1].type).to.equal('add-file')
               expect(updates[1].userId).to.equal(owner._id)
               expect(updates[1].pathname).to.equal('/1pixel.png')
-              if (disableFilestore) {
+              if (filestoreMigrationLevel === 2) {
                 expect(updates[1].url).to.not.exist
                 expect(updates[1].createdBlob).to.be.true
               } else {
@@ -1005,7 +997,7 @@ describe('ProjectStructureChanges', function () {
             expect(update.type).to.equal('add-file')
             expect(update.userId).to.equal(owner._id)
             expect(update.pathname).to.equal('/1pixel.png')
-            if (disableFilestore) {
+            if (filestoreMigrationLevel === 2) {
               expect(update.url).to.not.exist
               expect(update.createdBlob).to.be.true
             } else {
@@ -1068,7 +1060,7 @@ describe('ProjectStructureChanges', function () {
               expect(updates[1].type).to.equal('add-file')
               expect(updates[1].userId).to.equal(owner._id)
               expect(updates[1].pathname).to.equal('/1pixel.png')
-              if (disableFilestore) {
+              if (filestoreMigrationLevel === 2) {
                 expect(updates[1].url).to.not.exist
                 expect(updates[1].createdBlob).to.be.true
               } else {
diff --git a/services/web/modules/launchpad/app/src/LaunchpadController.mjs b/services/web/modules/launchpad/app/src/LaunchpadController.mjs
index b626e0176e..49dd9ea9cb 100644
--- a/services/web/modules/launchpad/app/src/LaunchpadController.mjs
+++ b/services/web/modules/launchpad/app/src/LaunchpadController.mjs
@@ -154,7 +154,8 @@ function registerExternalAuthAdmin(authMethod) {
       await User.updateOne(
         { _id: user._id },
         {
-          $set: { isAdmin: true, emails: [{ email, reversedHostname }] },
+          $set: { isAdmin: true, emails: [{ email, reversedHostname, 'confirmedAt' : Date.now() }] },
+          $unset: { 'hashedPassword': "" }, // external-auth user must not have a hashedPassword
         }
       ).exec()
     } catch (err) {
diff --git a/services/web/modules/launchpad/app/views/launchpad.pug b/services/web/modules/launchpad/app/views/launchpad.pug
index fdf0576c4a..2c0382e71e 100644
--- a/services/web/modules/launchpad/app/views/launchpad.pug
+++ b/services/web/modules/launchpad/app/views/launchpad.pug
@@ -2,39 +2,43 @@ extends ../../../../app/views/layout-marketing
 
 mixin launchpad-check(section)
 	div(data-ol-launchpad-check=section)
-		span(data-ol-inflight="pending")
+		span(data-ol-inflight='pending')
 			i.fa.fa-fw.fa-spinner.fa-spin
 			span &nbsp;#{translate('checking')}
-	
-		span(hidden data-ol-inflight="idle")
-			div(data-ol-result="success")
+
+		span(hidden data-ol-inflight='idle')
+			div(data-ol-result='success')
 				i.fa.fa-check
 				span &nbsp;#{translate('ok')}
 				button.btn.btn-inline-link
 					span.text-danger &nbsp;#{translate('retry')}
-			div(hidden data-ol-result="error")
+			div(hidden data-ol-result='error')
 				i.fa.fa-exclamation
 				span &nbsp;#{translate('error')}
 				button.btn.btn-inline-link
 					span.text-danger &nbsp;#{translate('retry')}
-				div.alert.alert-danger
+				.alert.alert-danger
 					span(data-ol-error)
 
 block entrypointVar
 	- entrypoint = 'modules/launchpad/pages/launchpad'
-					
+
 block vars
 	- metadata = metadata || {}
 	- bootstrap5PageStatus = 'disabled'
 
 block append meta
-	meta(name="ol-adminUserExists" data-type="boolean" content=adminUserExists)
-	meta(name="ol-ideJsPath" content=buildJsPath('ide.js'))
+	meta(name='ol-adminUserExists' data-type='boolean' content=adminUserExists)
+	meta(name='ol-ideJsPath' content=buildJsPath('ide-detached.js'))
 
 block content
-	script(type="text/javascript", nonce=scriptNonce, src=(wsUrl || '/socket.io') + '/socket.io.js')
+	script(
+		type='text/javascript'
+		nonce=scriptNonce
+		src=(wsUrl || '/socket.io') + '/socket.io.js'
+	)
 
-	.content.content-alt#main-content
+	#main-content.content.content-alt
 		.container
 			.row
 				.col-md-8.col-md-offset-2
@@ -49,8 +53,6 @@ block content
 						<!-- wrapper -->
 						.row
 							.col-md-8.col-md-offset-2
-
-
 								<!-- create first admin form -->
 								if !adminUserExists
 									.row(data-ol-not-sent)
@@ -62,37 +64,34 @@ block content
 												form(
 													data-ol-async-form
 													data-ol-register-admin
-													action="/launchpad/register_admin"
-													method="POST"
+													action='/launchpad/register_admin'
+													method='POST'
 												)
-													input(name='_csrf', type='hidden', value=csrfToken)
-													+formMessages()
+													input(name='_csrf' type='hidden' value=csrfToken)
+													+formMessages
 													.form-group
 														label(for='email') #{translate("email")}
 														input.form-control(
-															type='email',
-															name='email',
-															placeholder="email@example.com"
-															autocomplete="username"
-															required,
-															autofocus="true"
+															name='email'
+															type='email'
+															placeholder='email@example.com'
+															autocomplete='username'
+															required
+															autofocus='true'
 														)
 													.form-group
 														label(for='password') #{translate("password")}
-														input.form-control#passwordField(
-															type='password',
-															name='password',
-															placeholder="********",
-															autocomplete="new-password"
-															required,
+														input#passwordField.form-control(
+															name='password'
+															type='password'
+															placeholder='********'
+															autocomplete='new-password'
+															required
 														)
 													.actions
-														button.btn-primary.btn(
-															type='submit'
-															data-ol-disabled-inflight
-														)
-															span(data-ol-inflight="idle") #{translate("register")}
-															span(hidden data-ol-inflight="pending") #{translate("registering")}…
+														button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+															span(data-ol-inflight='idle') #{translate("register")}
+															span(hidden data-ol-inflight='pending') #{translate("registering")}…
 
 											// Ldap Form
 											if authMethod === 'ldap'
@@ -103,26 +102,59 @@ block content
 												form(
 													data-ol-async-form
 													data-ol-register-admin
-													action="/launchpad/register_ldap_admin"
-													method="POST"
+													action='/launchpad/register_ldap_admin'
+													method='POST'
+												)
+													input(name='_csrf' type='hidden' value=csrfToken)
+													+formMessages
+													.form-group
+														label(for='email') #{translate("email")}
+														input.form-control(
+															name='email'
+															type='email'
+															placeholder='email@example.com'
+															autocomplete='username'
+															required
+															autofocus='true'
+														)
+													.actions
+														button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+															span(data-ol-inflight='idle') #{translate("register")}
+															span(hidden data-ol-inflight='pending') #{translate("registering")}…
+
+												h3 #{translate('local_account')}
+												p
+													| #{translate('alternatively_create_local_admin_account')}
+
+												form(
+													data-ol-async-form
+													data-ol-register-admin
+													action='/launchpad/register_admin'
+													method='POST'
 												)
 													input(name='_csrf', type='hidden', value=csrfToken)
 													+formMessages()
 													.form-group
 														label(for='email') #{translate("email")}
 														input.form-control(
-															type='email',
-															name='email',
-															placeholder="email@example.com"
-															autocomplete="username"
-															required,
-															autofocus="true"
+															type='email'
+															name='email'
+															placeholder='email@example.com'
+															autocomplete='username'
+															required
+															autofocus='true'
+														)
+													.form-group
+														label(for='password') #{translate("password")}
+														input.form-control#passwordField(
+															type='password'
+															name='password'
+															placeholder='********'
+															autocomplete='new-password'
+															required
 														)
 													.actions
-														button.btn-primary.btn(
-															type='submit'
-															data-ol-disabled-inflight
-														)
+														button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
 															span(data-ol-inflight="idle") #{translate("register")}
 															span(hidden data-ol-inflight="pending") #{translate("registering")}…
 
@@ -135,28 +167,60 @@ block content
 												form(
 													data-ol-async-form
 													data-ol-register-admin
-													action="/launchpad/register_saml_admin"
-													method="POST"
+													action='/launchpad/register_saml_admin'
+													method='POST'
+												)
+													input(name='_csrf' type='hidden' value=csrfToken)
+													+formMessages
+													.form-group
+														label(for='email') #{translate("email")}
+														input.form-control(
+															name='email'
+															placeholder='email@example.com'
+															autocomplete='username'
+															required
+															autofocus='true'
+														)
+													.actions
+														button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+															span(data-ol-inflight="idle") #{translate("register")}
+															span(hidden data-ol-inflight="pending") #{translate("registering")}…
+
+												h3 #{translate('local_account')}
+												p
+													| #{translate('alternatively_create_local_admin_account')}
+
+												form(
+													data-ol-async-form
+													data-ol-register-admin
+													action='/launchpad/register_admin'
+													method='POST'
 												)
 													input(name='_csrf', type='hidden', value=csrfToken)
 													+formMessages()
 													.form-group
 														label(for='email') #{translate("email")}
 														input.form-control(
-															type='email',
-															name='email',
-															placeholder="email@example.com"
-															autocomplete="username"
-															required,
-															autofocus="true"
+															type='email'
+															name='email'
+															placeholder='email@example.com'
+															autocomplete='username'
+															required
+															autofocus='true'
+														)
+													.form-group
+														label(for='password') #{translate("password")}
+														input.form-control#passwordField(
+															type='password'
+															name='password'
+															placeholder='********'
+															autocomplete='new-password'
+															required
 														)
 													.actions
-														button.btn-primary.btn(
-															type='submit'
-															data-ol-disabled-inflight
-														)
-															span(data-ol-inflight="idle") #{translate("register")}
-															span(hidden data-ol-inflight="pending") #{translate("registering")}…
+														button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+															span(data-ol-inflight='idle') #{translate("register")}
+															span(hidden data-ol-inflight='pending') #{translate("registering")}…
 
 									br
 
@@ -164,7 +228,6 @@ block content
 								if adminUserExists
 									.row
 										.col-md-12.status-indicators
-
 											h2 #{translate('status_checks')}
 
 											<!-- websocket -->
@@ -185,42 +248,31 @@ block content
 											h3 #{translate('send_test_email')}
 											form.form(
 												data-ol-async-form
-												action="/launchpad/send_test_email"
-												method="POST"
+												action='/launchpad/send_test_email'
+												method='POST'
 											)
 												.form-group
-													label(for="email") Email
-													input.form-control(
-														type="text"
-														id="email"
-														name="email"
-														required
-													)
-												button.btn-primary.btn(
-													type='submit'
-													data-ol-disabled-inflight
-												)
-													span(data-ol-inflight="idle") #{translate("send")}
-													span(hidden data-ol-inflight="pending") #{translate("sending")}…
+													label(for='email') Email
+													input.form-control(name='email' type='text' id='email' required)
+												button.btn-primary.btn(type='submit' data-ol-disabled-inflight)
+													span(data-ol-inflight='idle') #{translate("send")}
+													span(hidden data-ol-inflight='pending') #{translate("sending")}…
 
 												p
-													+formMessages()
-
-
+													+formMessages
 
 									<!-- break -->
 									hr.thin
 
-
 									<!-- Go to app -->
 									.row
 										.col-md-12
 											.text-center
 												br
 												p
-													a(href="/admin").btn.btn-info
+													a.btn.btn-info(href='/admin')
 														| Go To Admin Panel
 													| &nbsp;
-													a(href="/project").btn.btn-primary
+													a.btn.btn-primary(href='/project')
 														| Start Using #{settings.appName}
 												br
diff --git a/services/web/modules/launchpad/test/unit/src/LaunchpadController.test.mjs b/services/web/modules/launchpad/test/unit/src/LaunchpadController.test.mjs
new file mode 100644
index 0000000000..a92fca04de
--- /dev/null
+++ b/services/web/modules/launchpad/test/unit/src/LaunchpadController.test.mjs
@@ -0,0 +1,1039 @@
+import { expect, vi } from 'vitest'
+import * as path from 'node:path'
+import sinon from 'sinon'
+import MockResponse from '../../../../../test/unit/src/helpers/MockResponse.js'
+
+const modulePath = path.join(
+  import.meta.dirname,
+  '../../../app/src/LaunchpadController.mjs'
+)
+
+describe('LaunchpadController', function () {
+  // esmock doesn't work well with CommonJS dependencies, global imports for
+  // @overleaf/settings aren't working until that module is migrated to ESM. In the
+  // meantime, the workaround is to set and restore settings values
+
+  beforeEach(async function (ctx) {
+    ctx.user = {
+      _id: '323123',
+      first_name: 'fn',
+      last_name: 'ln',
+      save: sinon.stub().callsArgWith(0),
+    }
+
+    ctx.User = {}
+
+    ctx.Settings = {
+      adminPrivilegeAvailable: true,
+    }
+
+    vi.doMock('@overleaf/settings', () => ({ default: ctx.Settings }))
+
+    vi.doMock('@overleaf/metrics', () => ({
+      default: (ctx.Metrics = {}),
+    }))
+
+    vi.doMock(
+      '../../../../../app/src/Features/User/UserRegistrationHandler.js',
+      () => ({
+        default: (ctx.UserRegistrationHandler = {
+          promises: {},
+        }),
+      })
+    )
+
+    vi.doMock('../../../../../app/src/Features/Email/EmailHandler.js', () => ({
+      default: (ctx.EmailHandler = { promises: {} }),
+    }))
+
+    vi.doMock('../../../../../app/src/Features/User/UserGetter.js', () => ({
+      default: (ctx.UserGetter = {
+        promises: {},
+      }),
+    }))
+
+    vi.doMock('../../../../../app/src/models/User.js', () => ({
+      User: ctx.User,
+    }))
+
+    vi.doMock(
+      '../../../../../app/src/Features/Authentication/AuthenticationController.js',
+      () => ({
+        default: (ctx.AuthenticationController = {}),
+      })
+    )
+
+    vi.doMock(
+      '../../../../../app/src/Features/Authentication/AuthenticationManager.js',
+      () => ({
+        default: (ctx.AuthenticationManager = {}),
+      })
+    )
+
+    vi.doMock(
+      '../../../../../app/src/Features/Authentication/SessionManager.js',
+      () => ({
+        default: (ctx.SessionManager = {
+          getSessionUser: sinon.stub(),
+        }),
+      })
+    )
+
+    ctx.LaunchpadController = (await import(modulePath)).default
+
+    ctx.email = 'bob@smith.com'
+
+    ctx.req = {
+      query: {},
+      body: {},
+      session: {},
+    }
+
+    ctx.res = new MockResponse()
+    ctx.res.locals = {
+      translate(key) {
+        return key
+      },
+    }
+
+    ctx.next = sinon.stub()
+  })
+
+  describe('launchpadPage', function () {
+    beforeEach(function (ctx) {
+      ctx.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
+      ctx._atLeastOneAdminExists =
+        ctx.LaunchpadController._mocks._atLeastOneAdminExists
+      ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+    })
+
+    describe('when the user is not logged in', function () {
+      beforeEach(function (ctx) {
+        ctx.SessionManager.getSessionUser = sinon.stub().returns(null)
+      })
+
+      describe('when there are no admins', function () {
+        beforeEach(async function (ctx) {
+          ctx._atLeastOneAdminExists.resolves(false)
+          await ctx.LaunchpadController.launchpadPage(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+
+        it('should render the launchpad page', function (ctx) {
+          const viewPath = path.join(
+            import.meta.dirname,
+            '../../../app/views/launchpad'
+          )
+          ctx.res.render.callCount.should.equal(1)
+          expect(ctx.res.render).to.have.been.calledWith(viewPath, {
+            adminUserExists: false,
+            authMethod: 'local',
+          })
+        })
+      })
+
+      describe('when there is at least one admin', function () {
+        beforeEach(async function (ctx) {
+          ctx._atLeastOneAdminExists.resolves(true)
+          await ctx.LaunchpadController.launchpadPage(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+
+        it('should redirect to login page', function (ctx) {
+          ctx.AuthenticationController.setRedirectInSession.callCount.should.equal(
+            1
+          )
+          ctx.res.redirect.calledWith('/login').should.equal(true)
+        })
+
+        it('should not render the launchpad page', function (ctx) {
+          ctx.res.render.callCount.should.equal(0)
+        })
+      })
+    })
+
+    describe('when the user is logged in', function () {
+      beforeEach(function (ctx) {
+        ctx.user = {
+          _id: 'abcd',
+          email: 'abcd@example.com',
+        }
+        ctx.SessionManager.getSessionUser.returns(ctx.user)
+        ctx._atLeastOneAdminExists.resolves(true)
+      })
+
+      describe('when the user is an admin', function () {
+        beforeEach(async function (ctx) {
+          ctx.UserGetter.promises.getUser = sinon
+            .stub()
+            .resolves({ isAdmin: true })
+          await ctx.LaunchpadController.launchpadPage(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+
+        it('should render the launchpad page', function (ctx) {
+          const viewPath = path.join(
+            import.meta.dirname,
+            '../../../app/views/launchpad'
+          )
+          ctx.res.render.callCount.should.equal(1)
+          expect(ctx.res.render).to.have.been.calledWith(viewPath, {
+            wsUrl: undefined,
+            adminUserExists: true,
+            authMethod: 'local',
+          })
+        })
+      })
+
+      describe('when the user is not an admin', function () {
+        beforeEach(async function (ctx) {
+          ctx.UserGetter.promises.getUser = sinon
+            .stub()
+            .resolves({ isAdmin: false })
+          await ctx.LaunchpadController.launchpadPage(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+
+        it('should redirect to restricted page', function (ctx) {
+          ctx.res.redirect.callCount.should.equal(1)
+          ctx.res.redirect.calledWith('/restricted').should.equal(true)
+        })
+      })
+    })
+  })
+
+  describe('_atLeastOneAdminExists', function () {
+    describe('when there are no admins', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUser = sinon.stub().resolves(null)
+      })
+
+      it('should callback with false', async function (ctx) {
+        const exists = await ctx.LaunchpadController._atLeastOneAdminExists()
+        expect(exists).to.equal(false)
+      })
+    })
+
+    describe('when there are some admins', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUser = sinon.stub().resolves({ _id: 'abcd' })
+      })
+
+      it('should callback with true', async function (ctx) {
+        const exists = await ctx.LaunchpadController._atLeastOneAdminExists()
+        expect(exists).to.equal(true)
+      })
+    })
+
+    describe('when getUser produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUser = sinon
+          .stub()
+          .rejects(new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.LaunchpadController._atLeastOneAdminExists()).rejected
+      })
+    })
+  })
+
+  describe('sendTestEmail', function () {
+    beforeEach(function (ctx) {
+      ctx.EmailHandler.promises.sendEmail = sinon.stub().resolves()
+      ctx.req.body.email = 'someone@example.com'
+    })
+
+    it('should produce a 200 response', async function (ctx) {
+      await ctx.LaunchpadController.sendTestEmail(ctx.req, ctx.res, ctx.next)
+      ctx.res.json.calledWith({ message: 'email_sent' }).should.equal(true)
+    })
+
+    it('should not call next with an error', function (ctx) {
+      ctx.LaunchpadController.sendTestEmail(ctx.req, ctx.res, ctx.next)
+      ctx.next.callCount.should.equal(0)
+    })
+
+    it('should have called sendEmail', async function (ctx) {
+      await ctx.LaunchpadController.sendTestEmail(ctx.req, ctx.res, ctx.next)
+      ctx.EmailHandler.promises.sendEmail.callCount.should.equal(1)
+      ctx.EmailHandler.promises.sendEmail
+        .calledWith('testEmail')
+        .should.equal(true)
+    })
+
+    describe('when sendEmail produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.EmailHandler.promises.sendEmail = sinon
+          .stub()
+          .rejects(new Error('woops'))
+      })
+
+      it('should call next with an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.next = sinon.stub().callsFake(err => {
+            expect(err).to.be.instanceof(Error)
+            ctx.next.callCount.should.equal(1)
+            resolve()
+          })
+          ctx.LaunchpadController.sendTestEmail(ctx.req, ctx.res, ctx.next)
+        })
+      })
+    })
+
+    describe('when no email address is supplied', function () {
+      beforeEach(function (ctx) {
+        ctx.req.body.email = undefined
+      })
+
+      it('should produce a 400 response', function (ctx) {
+        ctx.LaunchpadController.sendTestEmail(ctx.req, ctx.res, ctx.next)
+        ctx.res.status.calledWith(400).should.equal(true)
+        ctx.res.json
+          .calledWith({
+            message: 'no email address supplied',
+          })
+          .should.equal(true)
+      })
+    })
+  })
+
+  describe('registerAdmin', function () {
+    beforeEach(function (ctx) {
+      ctx.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
+      ctx._atLeastOneAdminExists =
+        ctx.LaunchpadController._mocks._atLeastOneAdminExists
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .resolves(ctx.user)
+        ctx.User.updateOne = sinon
+          .stub()
+          .returns({ exec: sinon.stub().resolves() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send back a json response', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json).to.have.been.calledWith({ redir: '/launchpad' })
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({ email: ctx.email, password: ctx.password })
+          .should.equal(true)
+      })
+
+      it('should have updated the user to make them an admin', function (ctx) {
+        ctx.User.updateOne.callCount.should.equal(1)
+        ctx.User.updateOne
+          .calledWithMatch(
+            { _id: ctx.user._id },
+            {
+              $set: {
+                isAdmin: true,
+                emails: [
+                  { email: ctx.user.email, reversedHostname: 'moc.elpmaxe' },
+                ],
+              },
+            }
+          )
+          .should.equal(true)
+      })
+    })
+
+    describe('when no email is supplied', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = undefined
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 400 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.calledWith(400).should.equal(true)
+      })
+
+      it('should not check for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(0)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when no password is supplied', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = undefined
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 400 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.calledWith(400).should.equal(true)
+      })
+
+      it('should not check for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(0)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when an invalid email is supplied', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'invalid password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon
+          .stub()
+          .returns(new Error('bad email'))
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 400 response', function (ctx) {
+        ctx.res.status.callCount.should.equal(1)
+        ctx.res.status.calledWith(400).should.equal(true)
+        ctx.res.json.calledWith({
+          message: { type: 'error', text: 'bad email' },
+        })
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when an invalid password is supplied', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'invalid password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon
+          .stub()
+          .returns(new Error('bad password'))
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 400 response', function (ctx) {
+        ctx.res.status.callCount.should.equal(1)
+        ctx.res.status.calledWith(400).should.equal(true)
+        ctx.res.json.calledWith({
+          message: { type: 'error', text: 'bad password' },
+        })
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when there are already existing admins', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(true)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 403 response', function (ctx) {
+        ctx.res.status.callCount.should.equal(1)
+        ctx.res.status.calledWith(403).should.equal(true)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when checking admins produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.rejects(new Error('woops'))
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when registerNewUser produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .rejects(new Error('woops'))
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({ email: ctx.email, password: ctx.password })
+          .should.equal(true)
+      })
+
+      it('should not call update', function (ctx) {
+        ctx.User.updateOne.callCount.should.equal(0)
+      })
+    })
+
+    describe('when user update produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .resolves(ctx.user)
+        ctx.User.updateOne = sinon.stub().returns({
+          exec: sinon.stub().rejects(new Error('woops')),
+        })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({ email: ctx.email, password: ctx.password })
+          .should.equal(true)
+      })
+    })
+
+    describe('when overleaf', function () {
+      beforeEach(async function (ctx) {
+        ctx.Settings.overleaf = { one: 1 }
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.password = 'a_really_bad_password'
+        ctx.req.body.email = ctx.email
+        ctx.req.body.password = ctx.password
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .resolves(ctx.user)
+        ctx.User.updateOne = sinon
+          .stub()
+          .returns({ exec: sinon.stub().resolves() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.AuthenticationManager.validateEmail = sinon.stub().returns(null)
+        ctx.AuthenticationManager.validatePassword = sinon.stub().returns(null)
+        ctx.UserGetter.promises.getUser = sinon.stub().resolves({ _id: '1234' })
+        await ctx.LaunchpadController.registerAdmin(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send back a json response', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json).to.have.been.calledWith({ redir: '/launchpad' })
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({ email: ctx.email, password: ctx.password })
+          .should.equal(true)
+      })
+
+      it('should have updated the user to make them an admin', function (ctx) {
+        ctx.User.updateOne
+          .calledWith(
+            { _id: ctx.user._id },
+            {
+              $set: {
+                isAdmin: true,
+                emails: [
+                  { email: ctx.user.email, reversedHostname: 'moc.elpmaxe' },
+                ],
+              },
+            }
+          )
+          .should.equal(true)
+      })
+    })
+  })
+
+  describe('registerExternalAuthAdmin', function () {
+    beforeEach(function (ctx) {
+      ctx.Settings.ldap = { one: 1 }
+      ctx.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
+      ctx._atLeastOneAdminExists =
+        ctx.LaunchpadController._mocks._atLeastOneAdminExists
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .resolves(ctx.user)
+        ctx.User.updateOne = sinon
+          .stub()
+          .returns({ exec: sinon.stub().resolves() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should send back a json response', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json.lastCall.args[0].email).to.equal(ctx.email)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({
+            email: ctx.email,
+            password: 'password_here',
+            first_name: ctx.email,
+            last_name: '',
+          })
+          .should.equal(true)
+      })
+
+      it('should have updated the user to make them an admin', function (ctx) {
+        ctx.User.updateOne.callCount.should.equal(1)
+        ctx.User.updateOne
+          .calledWith(
+            { _id: ctx.user._id },
+            {
+              $set: {
+                isAdmin: true,
+                emails: [
+                  { email: ctx.user.email, reversedHostname: 'moc.elpmaxe' },
+                ],
+              },
+            }
+          )
+          .should.equal(true)
+      })
+
+      it('should have set a redirect in session', function (ctx) {
+        ctx.AuthenticationController.setRedirectInSession.callCount.should.equal(
+          1
+        )
+        ctx.AuthenticationController.setRedirectInSession
+          .calledWith(ctx.req, '/launchpad')
+          .should.equal(true)
+      })
+    })
+
+    describe('when the authMethod is invalid', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = undefined
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin(
+          'NOTAVALIDAUTHMETHOD'
+        )(ctx.req, ctx.res, ctx.next)
+      })
+
+      it('should send a 403 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.calledWith(403).should.equal(true)
+      })
+
+      it('should not check for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(0)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when no email is supplied', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = undefined
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should send a 400 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.calledWith(400).should.equal(true)
+      })
+
+      it('should not check for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(0)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when there are already existing admins', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(true)
+        ctx.email = 'someone@example.com'
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should send a 403 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.calledWith(403).should.equal(true)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when checking admins produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.rejects(new Error('woops'))
+        ctx.email = 'someone@example.com'
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should not call registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when registerNewUser produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .rejects(new Error('woops'))
+        ctx.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({
+            email: ctx.email,
+            password: 'password_here',
+            first_name: ctx.email,
+            last_name: '',
+          })
+          .should.equal(true)
+      })
+
+      it('should not call update', function (ctx) {
+        ctx.User.updateOne.callCount.should.equal(0)
+      })
+    })
+
+    describe('when user update produces an error', function () {
+      beforeEach(async function (ctx) {
+        ctx._atLeastOneAdminExists.resolves(false)
+        ctx.email = 'someone@example.com'
+        ctx.req.body.email = ctx.email
+        ctx.user = {
+          _id: 'abcdef',
+          email: ctx.email,
+        }
+        ctx.UserRegistrationHandler.promises.registerNewUser = sinon
+          .stub()
+          .resolves(ctx.user)
+        ctx.User.updateOne = sinon.stub().returns({
+          exec: sinon.stub().rejects(new Error('woops')),
+        })
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        await ctx.LaunchpadController.registerExternalAuthAdmin('ldap')(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should have checked for existing admins', function (ctx) {
+        ctx._atLeastOneAdminExists.callCount.should.equal(1)
+      })
+
+      it('should have called registerNewUser', function (ctx) {
+        ctx.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
+          1
+        )
+        ctx.UserRegistrationHandler.promises.registerNewUser
+          .calledWith({
+            email: ctx.email,
+            password: 'password_here',
+            first_name: ctx.email,
+            last_name: '',
+          })
+          .should.equal(true)
+      })
+    })
+  })
+})
diff --git a/services/web/modules/launchpad/test/unit/src/LaunchpadControllerTests.mjs b/services/web/modules/launchpad/test/unit/src/LaunchpadControllerTests.mjs
deleted file mode 100644
index e1ca25a75a..0000000000
--- a/services/web/modules/launchpad/test/unit/src/LaunchpadControllerTests.mjs
+++ /dev/null
@@ -1,1076 +0,0 @@
-import { fileURLToPath } from 'node:url'
-import * as path from 'node:path'
-import { strict as esmock } from 'esmock'
-import { expect } from 'chai'
-import sinon from 'sinon'
-import Settings from '@overleaf/settings'
-import MockResponse from '../../../../../test/unit/src/helpers/MockResponse.js'
-
-const __dirname = fileURLToPath(new URL('.', import.meta.url))
-const modulePath = path.join(
-  __dirname,
-  '../../../app/src/LaunchpadController.mjs'
-)
-
-describe('LaunchpadController', function () {
-  // esmock doesn't work well with CommonJS dependencies, global imports for
-  // @overleaf/settings aren't working until that module is migrated to ESM. In the
-  // meantime, the workaroung is to set and restore settings values
-  let oldSettingsAdminPrivilegeAvailable
-
-  beforeEach(async function () {
-    this.user = {
-      _id: '323123',
-      first_name: 'fn',
-      last_name: 'ln',
-      save: sinon.stub().callsArgWith(0),
-    }
-
-    oldSettingsAdminPrivilegeAvailable = Settings.adminPrivilegeAvailable
-    Settings.adminPrivilegeAvailable = true
-
-    this.User = {}
-    this.LaunchpadController = await esmock(modulePath, {
-      '@overleaf/metrics': (this.Metrics = {}),
-      '../../../../../app/src/Features/User/UserRegistrationHandler.js':
-        (this.UserRegistrationHandler = {
-          promises: {},
-        }),
-      '../../../../../app/src/Features/Email/EmailHandler.js':
-        (this.EmailHandler = { promises: {} }),
-      '../../../../../app/src/Features/User/UserGetter.js': (this.UserGetter = {
-        promises: {},
-      }),
-      '../../../../../app/src/models/User.js': { User: this.User },
-      '../../../../../app/src/Features/Authentication/AuthenticationController.js':
-        (this.AuthenticationController = {}),
-      '../../../../../app/src/Features/Authentication/AuthenticationManager.js':
-        (this.AuthenticationManager = {}),
-      '../../../../../app/src/Features/Authentication/SessionManager.js':
-        (this.SessionManager = {
-          getSessionUser: sinon.stub(),
-        }),
-    })
-
-    this.email = 'bob@smith.com'
-
-    this.req = {
-      query: {},
-      body: {},
-      session: {},
-    }
-
-    this.res = new MockResponse()
-    this.res.locals = {
-      translate(key) {
-        return key
-      },
-    }
-
-    this.next = sinon.stub()
-  })
-
-  afterEach(function () {
-    Settings.adminPrivilegeAvailable = oldSettingsAdminPrivilegeAvailable
-  })
-
-  describe('launchpadPage', function () {
-    beforeEach(function () {
-      this.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
-      this._atLeastOneAdminExists =
-        this.LaunchpadController._mocks._atLeastOneAdminExists
-      this.AuthenticationController.setRedirectInSession = sinon.stub()
-    })
-
-    describe('when the user is not logged in', function () {
-      beforeEach(function () {
-        this.SessionManager.getSessionUser = sinon.stub().returns(null)
-      })
-
-      describe('when there are no admins', function () {
-        beforeEach(async function () {
-          this._atLeastOneAdminExists.resolves(false)
-          await this.LaunchpadController.launchpadPage(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should render the launchpad page', function () {
-          const viewPath = path.join(__dirname, '../../../app/views/launchpad')
-          this.res.render.callCount.should.equal(1)
-          this.res.render
-            .calledWith(viewPath, {
-              adminUserExists: false,
-              authMethod: 'local',
-            })
-            .should.equal(true)
-        })
-      })
-
-      describe('when there is at least one admin', function () {
-        beforeEach(async function () {
-          this._atLeastOneAdminExists.resolves(true)
-          await this.LaunchpadController.launchpadPage(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should redirect to login page', function () {
-          this.AuthenticationController.setRedirectInSession.callCount.should.equal(
-            1
-          )
-          this.res.redirect.calledWith('/login').should.equal(true)
-        })
-
-        it('should not render the launchpad page', function () {
-          this.res.render.callCount.should.equal(0)
-        })
-      })
-    })
-
-    describe('when the user is logged in', function () {
-      beforeEach(function () {
-        this.user = {
-          _id: 'abcd',
-          email: 'abcd@example.com',
-        }
-        this.SessionManager.getSessionUser.returns(this.user)
-        this._atLeastOneAdminExists.resolves(true)
-      })
-
-      describe('when the user is an admin', function () {
-        beforeEach(async function () {
-          this.UserGetter.promises.getUser = sinon
-            .stub()
-            .resolves({ isAdmin: true })
-          await this.LaunchpadController.launchpadPage(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should render the launchpad page', function () {
-          const viewPath = path.join(__dirname, '../../../app/views/launchpad')
-          this.res.render.callCount.should.equal(1)
-          this.res.render
-            .calledWith(viewPath, {
-              wsUrl: undefined,
-              adminUserExists: true,
-              authMethod: 'local',
-            })
-            .should.equal(true)
-        })
-      })
-
-      describe('when the user is not an admin', function () {
-        beforeEach(async function () {
-          this.UserGetter.promises.getUser = sinon
-            .stub()
-            .resolves({ isAdmin: false })
-          await this.LaunchpadController.launchpadPage(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should redirect to restricted page', function () {
-          this.res.redirect.callCount.should.equal(1)
-          this.res.redirect.calledWith('/restricted').should.equal(true)
-        })
-      })
-    })
-  })
-
-  describe('_atLeastOneAdminExists', function () {
-    describe('when there are no admins', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUser = sinon.stub().resolves(null)
-      })
-
-      it('should callback with false', async function () {
-        const exists = await this.LaunchpadController._atLeastOneAdminExists()
-        expect(exists).to.equal(false)
-      })
-    })
-
-    describe('when there are some admins', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUser = sinon
-          .stub()
-          .resolves({ _id: 'abcd' })
-      })
-
-      it('should callback with true', async function () {
-        const exists = await this.LaunchpadController._atLeastOneAdminExists()
-        expect(exists).to.equal(true)
-      })
-    })
-
-    describe('when getUser produces an error', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUser = sinon
-          .stub()
-          .rejects(new Error('woops'))
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.LaunchpadController._atLeastOneAdminExists()).rejected
-      })
-    })
-  })
-
-  describe('sendTestEmail', function () {
-    beforeEach(function () {
-      this.EmailHandler.promises.sendEmail = sinon.stub().resolves()
-      this.req.body.email = 'someone@example.com'
-    })
-
-    it('should produce a 200 response', async function () {
-      await this.LaunchpadController.sendTestEmail(
-        this.req,
-        this.res,
-        this.next
-      )
-      this.res.json.calledWith({ message: 'email_sent' }).should.equal(true)
-    })
-
-    it('should not call next with an error', function () {
-      this.LaunchpadController.sendTestEmail(this.req, this.res, this.next)
-      this.next.callCount.should.equal(0)
-    })
-
-    it('should have called sendEmail', async function () {
-      await this.LaunchpadController.sendTestEmail(
-        this.req,
-        this.res,
-        this.next
-      )
-      this.EmailHandler.promises.sendEmail.callCount.should.equal(1)
-      this.EmailHandler.promises.sendEmail
-        .calledWith('testEmail')
-        .should.equal(true)
-    })
-
-    describe('when sendEmail produces an error', function () {
-      beforeEach(function () {
-        this.EmailHandler.promises.sendEmail = sinon
-          .stub()
-          .rejects(new Error('woops'))
-      })
-
-      it('should call next with an error', function (done) {
-        this.next = sinon.stub().callsFake(err => {
-          expect(err).to.be.instanceof(Error)
-          this.next.callCount.should.equal(1)
-          done()
-        })
-        this.LaunchpadController.sendTestEmail(this.req, this.res, this.next)
-      })
-    })
-
-    describe('when no email address is supplied', function () {
-      beforeEach(function () {
-        this.req.body.email = undefined
-      })
-
-      it('should produce a 400 response', function () {
-        this.LaunchpadController.sendTestEmail(this.req, this.res, this.next)
-        this.res.status.calledWith(400).should.equal(true)
-        this.res.json
-          .calledWith({
-            message: 'no email address supplied',
-          })
-          .should.equal(true)
-      })
-    })
-  })
-
-  describe('registerAdmin', function () {
-    beforeEach(function () {
-      this.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
-      this._atLeastOneAdminExists =
-        this.LaunchpadController._mocks._atLeastOneAdminExists
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .resolves(this.user)
-        this.User.updateOne = sinon
-          .stub()
-          .returns({ exec: sinon.stub().resolves() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send back a json response', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json).to.have.been.calledWith({ redir: '/launchpad' })
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({ email: this.email, password: this.password })
-          .should.equal(true)
-      })
-
-      it('should have updated the user to make them an admin', function () {
-        this.User.updateOne.callCount.should.equal(1)
-        this.User.updateOne
-          .calledWithMatch(
-            { _id: this.user._id },
-            {
-              $set: {
-                isAdmin: true,
-                emails: [
-                  { email: this.user.email, reversedHostname: 'moc.elpmaxe' },
-                ],
-              },
-            }
-          )
-          .should.equal(true)
-      })
-    })
-
-    describe('when no email is supplied', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = undefined
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 400 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.calledWith(400).should.equal(true)
-      })
-
-      it('should not check for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(0)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when no password is supplied', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = undefined
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 400 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.calledWith(400).should.equal(true)
-      })
-
-      it('should not check for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(0)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when an invalid email is supplied', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'invalid password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon
-          .stub()
-          .returns(new Error('bad email'))
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 400 response', function () {
-        this.res.status.callCount.should.equal(1)
-        this.res.status.calledWith(400).should.equal(true)
-        this.res.json.calledWith({
-          message: { type: 'error', text: 'bad email' },
-        })
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when an invalid password is supplied', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'invalid password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon
-          .stub()
-          .returns(new Error('bad password'))
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 400 response', function () {
-        this.res.status.callCount.should.equal(1)
-        this.res.status.calledWith(400).should.equal(true)
-        this.res.json.calledWith({
-          message: { type: 'error', text: 'bad password' },
-        })
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when there are already existing admins', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(true)
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 403 response', function () {
-        this.res.status.callCount.should.equal(1)
-        this.res.status.calledWith(403).should.equal(true)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when checking admins produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.rejects(new Error('woops'))
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when registerNewUser produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .rejects(new Error('woops'))
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({ email: this.email, password: this.password })
-          .should.equal(true)
-      })
-
-      it('should not call update', function () {
-        this.User.updateOne.callCount.should.equal(0)
-      })
-    })
-
-    describe('when user update produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .resolves(this.user)
-        this.User.updateOne = sinon.stub().returns({
-          exec: sinon.stub().rejects(new Error('woops')),
-        })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({ email: this.email, password: this.password })
-          .should.equal(true)
-      })
-    })
-
-    describe('when overleaf', function () {
-      let oldSettingsOverleaf
-
-      beforeEach(async function () {
-        oldSettingsOverleaf = Settings.overleaf
-        Settings.overleaf = { one: 1 }
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.password = 'a_really_bad_password'
-        this.req.body.email = this.email
-        this.req.body.password = this.password
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .resolves(this.user)
-        this.User.updateOne = sinon
-          .stub()
-          .returns({ exec: sinon.stub().resolves() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.AuthenticationManager.validateEmail = sinon.stub().returns(null)
-        this.AuthenticationManager.validatePassword = sinon.stub().returns(null)
-        this.UserGetter.promises.getUser = sinon
-          .stub()
-          .resolves({ _id: '1234' })
-        await this.LaunchpadController.registerAdmin(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      afterEach(async function () {
-        Settings.overleaf = oldSettingsOverleaf
-      })
-
-      it('should send back a json response', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json).to.have.been.calledWith({ redir: '/launchpad' })
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({ email: this.email, password: this.password })
-          .should.equal(true)
-      })
-
-      it('should have updated the user to make them an admin', function () {
-        this.User.updateOne
-          .calledWith(
-            { _id: this.user._id },
-            {
-              $set: {
-                isAdmin: true,
-                emails: [
-                  { email: this.user.email, reversedHostname: 'moc.elpmaxe' },
-                ],
-              },
-            }
-          )
-          .should.equal(true)
-      })
-    })
-  })
-
-  describe('registerExternalAuthAdmin', function () {
-    let oldSettingsLDAP
-
-    beforeEach(function () {
-      oldSettingsLDAP = Settings.ldap
-      Settings.ldap = { one: 1 }
-      this.LaunchpadController._mocks._atLeastOneAdminExists = sinon.stub()
-      this._atLeastOneAdminExists =
-        this.LaunchpadController._mocks._atLeastOneAdminExists
-    })
-
-    afterEach(function () {
-      Settings.ldap = oldSettingsLDAP
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .resolves(this.user)
-        this.User.updateOne = sinon
-          .stub()
-          .returns({ exec: sinon.stub().resolves() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send back a json response', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json.lastCall.args[0].email).to.equal(this.email)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({
-            email: this.email,
-            password: 'password_here',
-            first_name: this.email,
-            last_name: '',
-          })
-          .should.equal(true)
-      })
-
-      it('should have updated the user to make them an admin', function () {
-        this.User.updateOne.callCount.should.equal(1)
-        this.User.updateOne
-          .calledWith(
-            { _id: this.user._id },
-            {
-              $set: {
-                isAdmin: true,
-                emails: [
-                  { email: this.user.email, reversedHostname: 'moc.elpmaxe' },
-                ],
-              },
-            }
-          )
-          .should.equal(true)
-      })
-
-      it('should have set a redirect in session', function () {
-        this.AuthenticationController.setRedirectInSession.callCount.should.equal(
-          1
-        )
-        this.AuthenticationController.setRedirectInSession
-          .calledWith(this.req, '/launchpad')
-          .should.equal(true)
-      })
-    })
-
-    describe('when the authMethod is invalid', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = undefined
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin(
-          'NOTAVALIDAUTHMETHOD'
-        )(this.req, this.res, this.next)
-      })
-
-      it('should send a 403 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.calledWith(403).should.equal(true)
-      })
-
-      it('should not check for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(0)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when no email is supplied', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = undefined
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 400 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.calledWith(400).should.equal(true)
-      })
-
-      it('should not check for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(0)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when there are already existing admins', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(true)
-        this.email = 'someone@example.com'
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 403 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.calledWith(403).should.equal(true)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when checking admins produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.rejects(new Error('woops'))
-        this.email = 'someone@example.com'
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon.stub()
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should not call registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when registerNewUser produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .rejects(new Error('woops'))
-        this.User.updateOne = sinon.stub().returns({ exec: sinon.stub() })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({
-            email: this.email,
-            password: 'password_here',
-            first_name: this.email,
-            last_name: '',
-          })
-          .should.equal(true)
-      })
-
-      it('should not call update', function () {
-        this.User.updateOne.callCount.should.equal(0)
-      })
-    })
-
-    describe('when user update produces an error', function () {
-      beforeEach(async function () {
-        this._atLeastOneAdminExists.resolves(false)
-        this.email = 'someone@example.com'
-        this.req.body.email = this.email
-        this.user = {
-          _id: 'abcdef',
-          email: this.email,
-        }
-        this.UserRegistrationHandler.promises.registerNewUser = sinon
-          .stub()
-          .resolves(this.user)
-        this.User.updateOne = sinon.stub().returns({
-          exec: sinon.stub().rejects(new Error('woops')),
-        })
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        await this.LaunchpadController.registerExternalAuthAdmin('ldap')(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should have checked for existing admins', function () {
-        this._atLeastOneAdminExists.callCount.should.equal(1)
-      })
-
-      it('should have called registerNewUser', function () {
-        this.UserRegistrationHandler.promises.registerNewUser.callCount.should.equal(
-          1
-        )
-        this.UserRegistrationHandler.promises.registerNewUser
-          .calledWith({
-            email: this.email,
-            password: 'password_here',
-            first_name: this.email,
-            last_name: '',
-          })
-          .should.equal(true)
-      })
-    })
-  })
-})
diff --git a/services/web/modules/sandboxed-compiles/index.mjs b/services/web/modules/sandboxed-compiles/index.mjs
new file mode 100644
index 0000000000..d494a3eec4
--- /dev/null
+++ b/services/web/modules/sandboxed-compiles/index.mjs
@@ -0,0 +1,22 @@
+import Settings from '@overleaf/settings'
+
+const parseTextExtensions = function (extensions) {
+  if (extensions) {
+    return extensions.split(',').map(ext => ext.trim())
+  } else {
+    return []
+  }
+}
+
+if (process.env.SANDBOXED_COMPILES === 'true') {
+  Settings.allowedImageNames = parseTextExtensions(process.env.ALL_TEX_LIVE_DOCKER_IMAGES)
+    .map((imageName, index) => ({
+      imageName,
+      imageDesc: parseTextExtensions(process.env.ALL_TEX_LIVE_DOCKER_IMAGE_NAMES)[index]
+        || imageName.split(':')[1],
+    }))
+  if(!process.env.TEX_LIVE_DOCKER_IMAGE) {
+    process.env.TEX_LIVE_DOCKER_IMAGE = Settings.allowedImageNames[0].imageName
+  }
+  Settings.currentImageName = process.env.TEX_LIVE_DOCKER_IMAGE
+}
diff --git a/services/web/modules/server-ce-scripts/index.js b/services/web/modules/server-ce-scripts/index.mjs
similarity index 75%
rename from services/web/modules/server-ce-scripts/index.js
rename to services/web/modules/server-ce-scripts/index.mjs
index 28c3d81419..e6df0f30af 100644
--- a/services/web/modules/server-ce-scripts/index.js
+++ b/services/web/modules/server-ce-scripts/index.mjs
@@ -3,4 +3,4 @@
 /** @type {WebModule} */
 const ServerCeScriptsModule = {}
 
-module.exports = ServerCeScriptsModule
+export default ServerCeScriptsModule
diff --git a/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs b/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
index be5fecf6ce..46be91a1d9 100644
--- a/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
+++ b/services/web/modules/server-ce-scripts/scripts/check-mongodb.mjs
@@ -6,7 +6,36 @@ import {
 
 const { ObjectId } = mongodb
 
-const MIN_MONGO_VERSION = [5, 0]
+const MIN_MONGO_VERSION = [6, 0]
+const MIN_MONGO_FEATURE_COMPATIBILITY_VERSION = [6, 0]
+
+// Allow ignoring admin check failures via an environment variable
+const OVERRIDE_ENV_VAR_NAME = 'ALLOW_MONGO_ADMIN_CHECK_FAILURES'
+
+function shouldSkipAdminChecks() {
+  return process.env[OVERRIDE_ENV_VAR_NAME] === 'true'
+}
+
+function handleUnauthorizedError(err, feature) {
+  if (
+    err instanceof mongodb.MongoServerError &&
+    err.codeName === 'Unauthorized'
+  ) {
+    console.warn(`Warning: failed to check ${feature} (not authorised)`)
+    if (!shouldSkipAdminChecks()) {
+      console.error(
+        `Please ensure the MongoDB user has the required admin permissions, or\n` +
+          `set the environment variable ${OVERRIDE_ENV_VAR_NAME}=true to ignore this check.`
+      )
+      process.exit(1)
+    }
+    console.warn(
+      `Ignoring ${feature} check failure (${OVERRIDE_ENV_VAR_NAME}=${process.env[OVERRIDE_ENV_VAR_NAME]})`
+    )
+  } else {
+    throw err
+  }
+}
 
 async function main() {
   let mongoClient
@@ -17,7 +46,16 @@ async function main() {
     throw err
   }
 
-  await checkMongoVersion(mongoClient)
+  try {
+    await checkMongoVersion(mongoClient)
+  } catch (err) {
+    handleUnauthorizedError(err, 'MongoDB version')
+  }
+  try {
+    await checkFeatureCompatibilityVersion(mongoClient)
+  } catch (err) {
+    handleUnauthorizedError(err, 'MongoDB feature compatibility version')
+  }
 
   try {
     await testTransactions(mongoClient)
@@ -53,6 +91,41 @@ async function checkMongoVersion(mongoClient) {
   }
 }
 
+async function checkFeatureCompatibilityVersion(mongoClient) {
+  const {
+    featureCompatibilityVersion: { version },
+  } = await mongoClient
+    .db()
+    .admin()
+    .command({ getParameter: 1, featureCompatibilityVersion: 1 })
+  const [major, minor] = version.split('.').map(v => parseInt(v))
+  const [minMajor, minMinor] = MIN_MONGO_FEATURE_COMPATIBILITY_VERSION
+
+  if (major < minMajor || (major === minMajor && minor < minMinor)) {
+    const minVersion = MIN_MONGO_FEATURE_COMPATIBILITY_VERSION.join('.')
+    console.error(`
+The MongoDB server has featureCompatibilityVersion=${version}, but Overleaf requires at least version ${minVersion}.
+
+Open a mongo shell:
+- Overleaf Toolkit deployments: $ bin/mongo
+- Legacy docker-compose.yml deployments: $ docker exec -it mongo mongosh localhost/sharelatex
+
+In the mongo shell:
+> db.adminCommand( { setFeatureCompatibilityVersion: "${minMajor}.${minMinor}" } )
+
+Verify the new value:
+> db.adminCommand( { getParameter: 1, featureCompatibilityVersion: 1 } )
+ ...
+ {
+    featureCompatibilityVersion: { version: ${minMajor}.${minMinor}' },
+...
+
+Aborting.
+`)
+    process.exit(1)
+  }
+}
+
 main()
   .then(() => {
     console.error('Mongodb is up.')
diff --git a/services/web/modules/server-ce-scripts/scripts/create-user.mjs b/services/web/modules/server-ce-scripts/scripts/create-user.mjs
index 219578b4b0..7c29ca7f5f 100644
--- a/services/web/modules/server-ce-scripts/scripts/create-user.mjs
+++ b/services/web/modules/server-ce-scripts/scripts/create-user.mjs
@@ -48,3 +48,13 @@ Please visit the following URL to set a password for ${email} and log in:
     )
   })
 }
+
+if (filename === process.argv[1]) {
+  try {
+    await main()
+    process.exit(0)
+  } catch (error) {
+    console.error({ error })
+    process.exit(1)
+  }
+}
diff --git a/services/web/modules/server-ce-scripts/scripts/delete-user.mjs b/services/web/modules/server-ce-scripts/scripts/delete-user.mjs
index 9b7b4592a3..1cb8aebdef 100644
--- a/services/web/modules/server-ce-scripts/scripts/delete-user.mjs
+++ b/services/web/modules/server-ce-scripts/scripts/delete-user.mjs
@@ -1,13 +1,28 @@
 import UserGetter from '../../../app/src/Features/User/UserGetter.js'
 import UserDeleter from '../../../app/src/Features/User/UserDeleter.js'
 import { fileURLToPath } from 'url'
+import minimist from 'minimist'
 
 const filename = fileURLToPath(import.meta.url)
 
 async function main() {
-  const email = (process.argv.slice(2).pop() || '').replace(/^--email=/, '')
+  const argv = minimist(process.argv.slice(2), {
+    string: ['email'],
+    boolean: ['skip-email'],
+  })
+
+  const { email, 'skip-email': skipEmail } = argv
   if (!email) {
-    console.error(`Usage: node ${filename} --email=joe@example.com`)
+    console.error(
+      `Usage: node ${filename} [--skip-email] --email=joe@example.com
+
+Deletes a user. All users' projects will also be deleted.
+
+Options:
+    --email          email address of the user being deleted
+    --skip-email    (optional) when present, the user is not notified of the deletion via email
+`
+    )
     process.exit(1)
   }
 
@@ -25,6 +40,7 @@ async function main() {
       const options = {
         ipAddress: '0.0.0.0',
         force: true,
+        skipEmail,
       }
       UserDeleter.deleteUser(user._id, options, function (err) {
         if (err) {
diff --git a/services/web/modules/server-ce-scripts/test/acceptance/src/ServerCEScriptsTests.mjs b/services/web/modules/server-ce-scripts/test/acceptance/src/ServerCEScriptsTests.mjs
index a02e9a0e68..f8d458ff6b 100644
--- a/services/web/modules/server-ce-scripts/test/acceptance/src/ServerCEScriptsTests.mjs
+++ b/services/web/modules/server-ce-scripts/test/acceptance/src/ServerCEScriptsTests.mjs
@@ -99,6 +99,14 @@ describe('ServerCEScripts', function () {
       expect(await getUser('foo@bar.com')).to.deep.equal({ isAdmin: false })
     })
 
+    it('should also work with mjs version', async function () {
+      const out = run(
+        'node modules/server-ce-scripts/scripts/create-user.mjs --email=foo@bar.com'
+      )
+      expect(out).to.include('/user/activate?token=')
+      expect(await getUser('foo@bar.com')).to.deep.equal({ isAdmin: false })
+    })
+
     it('should create an admin user with --admin flag', async function () {
       run(
         'node modules/server-ce-scripts/scripts/create-user.js --admin --email=foo@bar.com'
diff --git a/services/web/modules/symbol-palette/index.mjs b/services/web/modules/symbol-palette/index.mjs
new file mode 100644
index 0000000000..3a412c2eec
--- /dev/null
+++ b/services/web/modules/symbol-palette/index.mjs
@@ -0,0 +1,2 @@
+import logger from '@overleaf/logger'
+logger.debug({}, 'Enable Symbol Palette')
diff --git a/services/web/modules/template-gallery/app/src/CleanHtml.mjs b/services/web/modules/template-gallery/app/src/CleanHtml.mjs
new file mode 100644
index 0000000000..1e38437016
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/CleanHtml.mjs
@@ -0,0 +1,22 @@
+import sanitizeHtml from 'sanitize-html'
+
+const sanitizeOptions = {
+  linksOnly: {
+    allowedTags: ["a"],
+    allowedAttributes: { "a": ["href"] }
+  },
+  reachText: {
+    allowedTags: ["h1", "h2", "h3", "h4", "h5", "h6",
+                  "p", "blockquote", "ul", "ol", "li",
+                  "em", "strong", "s", "code", "pre", "hr", "a"],
+    allowedAttributes: { "a": ["href"] }
+  },
+  plainText: {
+    allowedTags: [],
+    allowedAttributes: {},
+  },
+}
+
+export function cleanHtml(text, sanitizeType) {
+  return sanitizeHtml(text, sanitizeOptions[sanitizeType])
+}
diff --git a/services/web/modules/template-gallery/app/src/TemplateErrors.mjs b/services/web/modules/template-gallery/app/src/TemplateErrors.mjs
new file mode 100644
index 0000000000..6b7ed014fe
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/TemplateErrors.mjs
@@ -0,0 +1,13 @@
+import OError from '@overleaf/o-error'
+
+export class TemplateNameConflictError extends OError {
+  constructor(ownerId, message = 'template_with_this_title_exists_and_owned_by_x') {
+    super(message, { ownerId })
+  }
+}
+
+export class RecompileRequiredError extends OError {
+  constructor(message = 'Recompile required') {
+    super(message, { status: 400 })
+  }
+}
diff --git a/services/web/modules/template-gallery/app/src/TemplateGalleryController.mjs b/services/web/modules/template-gallery/app/src/TemplateGalleryController.mjs
new file mode 100644
index 0000000000..1d88f50d1a
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/TemplateGalleryController.mjs
@@ -0,0 +1,162 @@
+import logger from '@overleaf/logger'
+import ErrorController from '../../../../app/src/Features/Errors/ErrorController.js'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import SessionManager from '../../../../app/src/Features/Authentication/SessionManager.js'
+import TemplateGalleryManager from'./TemplateGalleryManager.mjs'
+import { getUserName } from './TemplateGalleryHelper.mjs'
+import { TemplateNameConflictError, RecompileRequiredError } from './TemplateErrors.mjs'
+import Settings from '@overleaf/settings'
+
+async function createTemplateFromProject(req, res, next) {
+  const t = req.i18n.translate
+  try {
+    const userId = SessionManager.getLoggedInUserId(req.session)
+    const result = await TemplateGalleryManager.createTemplateFromProject({
+      projectId: req.params.Project_id,
+      userId,
+      templateSource: req.body,
+    })
+    if (result.conflict) {
+      const ownerName = (result.templateOwnerName === 'you') ? t('you') : result.templateOwnerName
+      const message = `${t('template_with_this_title_exists_and_owned_by_x', { x: ownerName })} `
+                    + t(result.canOverride ? 'do_you_want_to_overwrite_it' : 'you_cant_overwrite_it')
+      return res.status(409).json({ canOverride: result.canOverride, message })
+    }
+    return res.status(200).json({ template_id: result.templateId })
+  } catch (error) {
+    if (error instanceof Errors.InvalidNameError) {
+      return res.status(error.info?.status || 400).json({ message: error.message })
+    }
+
+    const mainMessage = t('failed_to_publish_as_a_template')
+    if (error instanceof RecompileRequiredError) {
+      return res.status(error.info?.status || 400).json({
+        message: `${mainMessage} ${t('try_recompile_project')}`
+      })
+    }
+    return res.status(400).json({ message: mainMessage })
+  }
+}
+
+async function editTemplate(req, res, next) {
+  const t = req.i18n.translate
+  try {
+    const result = await TemplateGalleryManager.editTemplate({
+      templateId: req.params.template_id,
+      updates: req.body
+    })
+    res.status(200).json(result)
+  } catch (error) {
+    if (error instanceof TemplateNameConflictError) {
+      const ownerId = error.info?.ownerId
+      const userId = SessionManager.getLoggedInUserId(req.session)
+      const ownerName = (ownerId === userId)
+        ? t('you')
+        : await getUserName(ownerId) || t('unknown')
+      const message = t(error.message, { x: ownerName })
+      return res.status(409).json({ message })
+    }
+    if (error instanceof Errors.InvalidNameError) {
+      return res.status(error.info?.status || 400).json({ message: error.message })
+    }
+    logger.error({ error }, 'Failure saving template')
+    return res.status(500).json({ message: t('something_went_wrong_server') })
+  }
+}
+
+async function deleteTemplate(req, res, next) {
+  const t = req.i18n.translate
+  try {
+    await TemplateGalleryManager.deleteTemplate({
+      templateId: req.params.template_id,
+      version: req.body.version
+    })
+    res.sendStatus(200)
+  } catch (error) {
+    logger.error({ error }, 'Failure deleting template')
+    return res.status(500).json({ message: t('something_went_wrong_server') })
+  }
+}
+
+async function getTemplatePreview(req, res, next) {
+  try {
+    const templateId = req.params.template_id
+    const { version, style } = req.query
+
+    const { stream, contentType } = await TemplateGalleryManager.fetchTemplatePreview({ templateId, version, style })
+
+    res.setHeader('Content-Type', contentType)
+    stream.pipe(res)
+  } catch (error) {
+    if (error.info?.status == 404) {
+      return ErrorController.notFound(req, res, next)
+    }
+    return res.status(error.info?.status || 400).json(error.info)
+  }
+}
+
+async function templatesCategoryPage(req, res, next) {
+  const t = req.i18n.translate
+  try {
+    let { category } = req.params
+    const result = await TemplateGalleryManager.getTemplatesPageData(category)
+
+    let title
+    if (result.categoryName) {
+      title = t('latex_templates') + ' — ' + result.categoryName
+    } else {
+      category = null
+      title = t('templates_page_title')
+    }
+    res.render('template_gallery/template-gallery', {
+      title,
+      category,
+    })
+  } catch (error) {
+    next(error)
+  }
+}
+
+async function templateDetailsPage(req, res, next) {
+  const t = req.i18n.translate
+  try {
+    const template = await TemplateGalleryManager.getTemplate('_id', req.params.template_id)
+    res.render('template_gallery/template', {
+      title: `${t('template')}: ${template.name}`,
+      template: JSON.stringify(template),
+      languages: Settings.languages,
+    })
+  } catch (error) {
+    return ErrorController.notFound(req, res, next)
+  }
+}
+
+async function getTemplateJSON(req, res, next) {
+  try {
+    const { key, val } = req.query
+    const template = await TemplateGalleryManager.getTemplate(key, val)
+    res.json(template)
+  } catch (error) {
+    next(error)
+  }
+}
+
+async function getCategoryTemplatesJSON(req, res, next) {
+  try {
+    const result = await TemplateGalleryManager.getCategoryTemplates(req.query)
+    res.json(result)
+  } catch (error) {
+    next(error)
+  }
+}
+
+export default {
+  createTemplateFromProject,
+  editTemplate,
+  deleteTemplate,
+  getTemplatePreview,
+  templatesCategoryPage,
+  templateDetailsPage,
+  getTemplateJSON,
+  getCategoryTemplatesJSON,
+}
diff --git a/services/web/modules/template-gallery/app/src/TemplateGalleryHelper.mjs b/services/web/modules/template-gallery/app/src/TemplateGalleryHelper.mjs
new file mode 100644
index 0000000000..97fc86d650
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/TemplateGalleryHelper.mjs
@@ -0,0 +1,238 @@
+import { marked } from 'marked'
+import request from 'request'
+import logger from '@overleaf/logger'
+import settings from '@overleaf/settings'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import ProjectGetter from '../../../../app/src/Features/Project/ProjectGetter.js'
+import ProjectLocator from '../../../../app/src/Features/Project/ProjectLocator.js'
+import ProjectZipStreamManager from '../../../../app/src/Features/Downloads/ProjectZipStreamManager.mjs'
+import DocumentUpdaterHandler from '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js'
+import ClsiManager from '../../../../app/src/Features/Compile/ClsiManager.js'
+import CompileManager from '../../../../app/src/Features/Compile/CompileManager.js'
+import UserGetter from '../../../../app/src/Features/User/UserGetter.js'
+import { fetchStreamWithResponse } from '@overleaf/fetch-utils'
+import { Template } from './models/Template.js'
+import { RecompileRequiredError } from './TemplateErrors.mjs'
+import { cleanHtml }  from './CleanHtml.mjs'
+
+const TIMEOUT = 30000
+
+const MAX_PROJECT_NAME_LENGTH = 150
+const MAX_FORM_INPUT_LENGTH = 512
+const MAX_TEMPLATE_DESCRIPTION_LENGTH = 4096
+
+// Configure marked for CommonMark-only parsing
+marked.setOptions({
+  gfm: false,
+  breaks: false,
+  headerIds: false,
+  mangle: false,
+})
+
+marked.use({
+  renderer: {
+    html: () => '' // strips any HTML tags
+  }
+})
+
+function _createZipStreamForProjectAsync(projectId) {
+  return new Promise((resolve, reject) => {
+    ProjectZipStreamManager.createZipStreamForProject(projectId, (err, archive) => {
+      if (err) {
+        return reject(err)
+      }
+      archive.on('error', (err) => reject(err))
+      resolve(archive)
+    })
+  })
+}
+
+export function validateTemplateInput({ name, descriptionMD, authorMD, license }) {
+  if (name?.length > MAX_PROJECT_NAME_LENGTH) {
+    throw new Errors.InvalidNameError(`Template title exceeds the maximum length of ${MAX_PROJECT_NAME_LENGTH} characters.`)
+  }
+  if (descriptionMD?.length > MAX_TEMPLATE_DESCRIPTION_LENGTH) {
+    throw new Errors.InvalidNameError(`Template description exceeds the maximum length of ${MAX_TEMPLATE_DESCRIPTION_LENGTH} characters.`)
+  }
+  if (authorMD?.length > MAX_FORM_INPUT_LENGTH) {
+    throw new Errors.InvalidNameError('Author name is too long.')
+  }
+  if (license?.length > MAX_FORM_INPUT_LENGTH) {
+    throw new Errors.InvalidNameError('License name is too long.')
+  }
+}
+
+export async function canUserOverrideTemplate(template, userId) {
+  let templateOwnerId = template.owner
+  let templateOwnerName = 'you'
+  let userIsOwner = true
+  let userIsAdmin
+  if (templateOwnerId != userId) {
+    userIsOwner = false
+    try {
+      userIsAdmin = (await UserGetter.promises.getUser(userId, { isAdmin: 1 })).isAdmin
+    } catch {
+      logger.error({ error, userId }, 'Logged in user does not exist, strange...')
+      userIsAdmin = false
+    }
+    templateOwnerName = await getUserName(templateOwnerId) || 'unknown'
+  }
+  const canOverride = userIsOwner || userIsAdmin
+  return { canOverride, templateOwnerName }
+}
+
+export async function getUserName(userId) {
+  try {
+    const user = await UserGetter.promises.getUser(userId, {
+      first_name: 1,
+      last_name: 1,
+    })
+    return ((user?.first_name || "") + " " + (user?.last_name || "")).trim()
+  } catch (error) {
+    return 'unknown'
+  }
+}
+
+export async function generateTemplateData(projectId, {
+  descriptionMD,
+  authorMD,
+  category,
+  license,
+  name,
+}) {
+  try {
+    await DocumentUpdaterHandler.promises.flushProjectToMongo(projectId)
+
+    const project = await ProjectGetter.promises.getProject(projectId, {
+      imageName: true,
+      compiler: true,
+      spellCheckLanguage: true,
+      rootDoc_id: true,
+      rootFolder: true,
+    })
+
+    const { path } = await ProjectLocator.promises.findRootDoc({ project })
+    const mainFile = path.fileSystem.replace(/^\/+/, '')
+    const template = {
+      name,
+      category,
+      authorMD,
+      descriptionMD,
+      license,
+      mainFile,
+      compiler: project.compiler,
+      imageName: project.imageName,
+      language: project.spellCheckLanguage,
+      lastUpdated: new Date(),
+    }
+
+    await renderTemplateHtmlFields(template)
+    return template
+  } catch (error) {
+    logger.error({ error, projectId }, 'Failed to retrieve project data')
+    throw error
+  }
+}
+
+export async function uploadTemplateAssets(projectId, userId, build, template) {
+  let zipStream, pdfStream
+  try {
+    [zipStream, pdfStream] = await Promise.all([
+      _createZipStreamForProjectAsync(projectId),
+      CompileManager.promises
+        .getProjectCompileLimits(projectId)
+        .then((limits) =>
+          ClsiManager.promises.getOutputFileStream(projectId, userId, limits, undefined, build, 'output.pdf')
+        )
+    ])
+  } catch (error) {
+    logger.error({ error, projectId }, 'No output.pdf?')
+    throw new RecompileRequiredError()
+  }
+  try {
+    const templateUrl = `${settings.apis.filestore.url}/template/${template._id}/v/${template.version}`
+    const zipUrl = `${templateUrl}/zip`
+    const pdfUrl = `${templateUrl}/pdf`
+    const [zipReq, pdfReq] = await Promise.all([
+      fetchStreamWithResponse(zipUrl, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/octet-stream',
+        },
+        body: zipStream,
+        signal: AbortSignal.timeout(TIMEOUT),
+      }),
+      fetchStreamWithResponse(pdfUrl, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/pdf',
+        },
+        body: pdfStream,
+        signal: AbortSignal.timeout(TIMEOUT),
+      }),
+    ])
+    const uploadErrors = []
+    if (zipReq?.response.status !== 200) {
+      uploadErrors.push({ file: 'zip', uri: zipUrl, statusCode: zipReq.response.status })
+    }
+    if (pdfReq?.response.status !== 200) {
+      uploadErrors.push({ file: 'pdf', uri: pdfUrl, statusCode: pdfReq.response.status })
+    }
+    if (uploadErrors.length > 0) {
+      logger.error({ uploadErrors }, 'Template upload failed')
+      throw new RecompileRequiredError()
+    }
+  } catch (error) {
+    if (error instanceof RecompileRequiredError) throw error
+    throw error
+  }
+}
+
+export async function deleteTemplateAssets(templateId, version, deleteFromDb) {
+  if (deleteFromDb) {
+    try {
+      await Template.deleteOne({ _id: templateId }).exec()
+    } catch (error) {
+      logger.error({ err, templateId }, 'Failed to delete template from MongoDB')
+      throw error
+    }
+  }
+
+  // kick off file deletions, but don't wait
+  const baseUrl = settings.apis.filestore.url
+  const urlTemplate = `${baseUrl}/template/${templateId}/v/${version}/zip`
+  const urlImages = `${baseUrl}/template/${templateId}/v/${version}/pdf`
+
+  const optsTemplate = {
+    method: 'DELETE',
+    uri: urlTemplate,
+    timeout: TIMEOUT,
+  }
+
+  const optsImages = {
+    method: 'DELETE',
+    uri: urlImages,
+    timeout: TIMEOUT,
+  }
+
+  request(optsTemplate, (err, response) => {
+    if (err)
+      logger.warn({ err, templateId }, 'Failed to delete template zip from filestore')
+  })
+
+  request(optsImages, (err, response) => {
+    if (err)
+      logger.warn({ err, templateId }, 'Failed to delete images from filestore')
+  })
+}
+
+export function renderTemplateHtmlFields(updates) {
+  if (updates.descriptionMD !== undefined) {
+    const descriptionRawHTML = marked.parse(updates.descriptionMD)
+    updates.description = cleanHtml(descriptionRawHTML, "reachText")
+  }
+  if (updates.authorMD !== undefined) {
+    const authorRawHTML = marked.parse(updates.authorMD)
+    updates.author = cleanHtml(authorRawHTML, "linksOnly")
+  }
+}
diff --git a/services/web/modules/template-gallery/app/src/TemplateGalleryManager.mjs b/services/web/modules/template-gallery/app/src/TemplateGalleryManager.mjs
new file mode 100644
index 0000000000..f3993d6854
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/TemplateGalleryManager.mjs
@@ -0,0 +1,214 @@
+import _ from 'lodash'
+import logger from '@overleaf/logger'
+import { Readable } from 'stream'
+import settings from '@overleaf/settings'
+import { OError } from '../../../../app/src/Features/Errors/Errors.js'
+import { Template } from './models/Template.js'
+import {
+  validateTemplateInput,
+  renderTemplateHtmlFields,
+  uploadTemplateAssets,
+  deleteTemplateAssets,
+  canUserOverrideTemplate,
+  generateTemplateData
+} from './TemplateGalleryHelper.mjs'
+import { cleanHtml }  from './CleanHtml.mjs'
+import { TemplateNameConflictError } from './TemplateErrors.mjs'
+import { fetchStreamWithResponse } from '@overleaf/fetch-utils'
+const TIMEOUT = 30000
+
+async function editTemplate({ templateId, updates }) {
+
+  validateTemplateInput(updates)
+
+  const template = await Template.findById(templateId)
+  if (!template) {
+    throw new OError('Current template not found, strange...', { status: 500, templateId })
+  }
+
+  if (updates.name) {
+    const conflictingTemplate = await Template.findOne(
+      { name: updates.name, _id: { $ne: templateId } },
+      { owner: true }
+    ).exec()
+    if (conflictingTemplate) {
+      throw new TemplateNameConflictError(String(conflictingTemplate.owner))
+    }
+  }
+
+  await renderTemplateHtmlFields(updates)
+  updates.lastUpdated = new Date()
+  Object.assign(template, updates)
+
+  await template.save()
+
+  return updates
+}
+
+async function deleteTemplate({ templateId, version }) {
+  await deleteTemplateAssets(templateId, version, true)
+}
+
+async function createTemplateFromProject({ projectId, userId, templateSource }) {
+  validateTemplateInput(templateSource)
+  let template = await Template.findOne({ name: templateSource.name }).exec()
+
+  if (template && !templateSource.override) {
+    const { canOverride, templateOwnerName } = await canUserOverrideTemplate(template, userId)
+
+    return {
+      conflict: true,
+      canOverride,
+      templateOwnerName
+    }
+  }
+
+  const templateData = await generateTemplateData(projectId, templateSource)
+
+  let previousVersionExists
+  if (!template) {
+    template = new Template(templateData)
+    template.owner = userId
+    previousVersionExists = false
+  } else {
+    Object.assign(template, templateData, {
+      version: template.version + 1,
+    })
+    previousVersionExists = true
+  }
+
+  await uploadTemplateAssets(projectId, userId, templateSource.build, template)
+  await template.save()
+
+  if (previousVersionExists) {
+    deleteTemplateAssets(template._id, template.version - 1, false)
+  }
+  return {
+    conflict: false,
+    templateId: template._id,
+  }
+}
+
+async function fetchTemplatePreview({ templateId, version, style }) {
+  if (!templateId || !version) {
+    throw new OError('Template ID and version are required', { status: 404 })
+  }
+  const styleParam = style ? `style=${style}` : ''
+  const isImage = (style === 'preview' || style === 'thumbnail')
+
+  if (style && !isImage) {
+    throw new OError('Wrong style', { status: 404, style })
+  }
+
+  const pdfUrl = `${settings.apis.filestore.url}/template/${templateId}/v/${version}/pdf?${styleParam}`
+  const { response } = await fetchStreamWithResponse(pdfUrl, {
+    method: 'GET',
+    signal: AbortSignal.timeout(TIMEOUT),
+  })
+
+  if (!response.ok) {
+    throw new OError(`Failed to fetch file: ${response.statusText}`, { status: 400, templateId, version, styleParam })
+  }
+
+  return {
+    stream: Readable.from(response.body),
+    contentType: isImage ? 'application/octet-stream' : 'application/pdf'
+  }
+}
+
+async function getTemplatesPageData(category) {
+  const categoryName = settings.templateLinks.find(item => item.url.endsWith(`/${category}`))?.name
+  const templateLinks = categoryName ? undefined : settings.templateLinks.filter(link => link.url !== '/templates/all')
+  return {
+    categoryName,
+    templateLinks
+  }
+}
+
+async function getTemplate(key, val) {
+  if (!key || !val) {
+    logger.warn('No key or val provided to getTemplate')
+    return null
+  }
+
+  const query = { [key]: val }
+  const template = await Template.findOne(query).exec()
+  if (!template) return null
+
+  return _formatTemplateForPage(template)
+}
+
+async function getCategoryTemplates(reqQuery) {
+  const {
+    category,
+    by = 'lastUpdated',
+    order = 'desc',
+  } = reqQuery || {}
+
+  const query = (category === 'all') ? {} : { category : '/templates/' + category }
+  const projection = { _id : 1, version : 1, name : 1, author : 1, description : 1, lastUpdated : 1 }
+  const allTemplates = await Template.find(query, projection).exec()
+  const formattedTemplates = allTemplates.map(_formatTemplateForList)
+  const sortedTemplates = _sortTemplates(formattedTemplates, { by, order })
+
+  return {
+    totalSize: sortedTemplates.length,
+    templates: sortedTemplates,
+  }
+}
+
+function _sortTemplates(templates, sort) {
+  if (
+    (sort.by && !['lastUpdated', 'name'].includes(sort.by)) ||
+    (sort.order && !['asc', 'desc'].includes(sort.order))
+  ) {
+    throw new OError('Invalid sorting criteria', { status: 400, sort })
+  }
+  const sortedTemplates = _.orderBy(
+    templates,
+    [sort.by || 'lastUpdated'],
+    [sort.order || 'desc']
+  )
+  return sortedTemplates
+}
+
+function _formatTemplateForList(template) {
+  return {
+    id: String(template._id),
+    version: String(template.version),
+    name: template.name,
+    author: cleanHtml(template.author, "plainText"),
+    description: cleanHtml(template.description, "plainText"),
+    lastUpdated: template.lastUpdated,
+  }
+}
+
+function _formatTemplateForPage(template) {
+  return {
+    id: template._id.toString(),
+    version: template.version.toString(),
+    category: template.category,
+    name: template.name,
+    author: cleanHtml(template.author, "linksOnly"),
+    authorMD: template.authorMD,
+    description: cleanHtml(template.description, "reachText"),
+    descriptionMD: template.descriptionMD,
+    license: template.license,
+    lastUpdated: template.lastUpdated,
+    owner: template.owner,
+    mainFile: template.mainFile,
+    compiler: template.compiler,
+    imageName: template.imageName,
+    language: template.language,
+  }
+}
+
+export default {
+  createTemplateFromProject,
+  editTemplate,
+  deleteTemplate,
+  getTemplate,
+  getCategoryTemplates,
+  fetchTemplatePreview,
+  getTemplatesPageData,
+}
diff --git a/services/web/modules/template-gallery/app/src/TemplateGalleryRouter.mjs b/services/web/modules/template-gallery/app/src/TemplateGalleryRouter.mjs
new file mode 100644
index 0000000000..b76f86d718
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/TemplateGalleryRouter.mjs
@@ -0,0 +1,82 @@
+import logger from '@overleaf/logger'
+
+import AuthenticationController from '../../../../app/src/Features/Authentication/AuthenticationController.js'
+import RateLimiterMiddleware from '../../../../app/src/Features/Security/RateLimiterMiddleware.js'
+import { RateLimiter } from '../../../../app/src/infrastructure/RateLimiter.js'
+import TemplateGalleryController from './TemplateGalleryController.mjs'
+
+const rateLimiterNewTemplate = new RateLimiter('create-template-from-project', {
+  points: 20,
+  duration: 60,
+})
+const rateLimiter = new RateLimiter('template-gallery', {
+  points: 60,
+  duration: 60,
+})
+const rateLimiterThumbnails = new RateLimiter('template-gallery-thumbnails', {
+  points: 240,
+  duration: 60,
+})
+
+
+export default {
+  rateLimiter,
+  apply(webRouter) {
+    logger.debug({}, 'Init templates router')
+
+    webRouter.post(
+      '/template/new/:Project_id',
+      AuthenticationController.requireLogin(),
+      RateLimiterMiddleware.rateLimit(rateLimiterNewTemplate),
+      TemplateGalleryController.createTemplateFromProject
+    )
+
+    webRouter.get(
+      '/template/:template_id',
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.templateDetailsPage
+    )
+
+    webRouter.post(
+      '/template/:template_id/edit',
+      AuthenticationController.requireLogin(),
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.editTemplate
+    )
+
+    webRouter.delete(
+      '/template/:template_id/delete',
+      AuthenticationController.requireLogin(),
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.deleteTemplate
+    )
+
+    webRouter.get(
+      '/templates/:category?',
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.templatesCategoryPage
+    )
+
+    webRouter.get(
+      '/api/template',
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.getTemplateJSON
+    )
+
+    webRouter.get(
+      '/api/templates',
+      RateLimiterMiddleware.rateLimit(rateLimiter),
+      TemplateGalleryController.getCategoryTemplatesJSON
+    )
+
+    webRouter.get(
+      '/template/:template_id/preview',
+      (req, res, next) => {
+        req.query.style === 'thumbnail'
+          ? RateLimiterMiddleware.rateLimit(rateLimiterThumbnails)(req, res, next)
+          : RateLimiterMiddleware.rateLimit(rateLimiter)(req, res, next)
+      },
+      TemplateGalleryController.getTemplatePreview
+    )
+  },
+}
diff --git a/services/web/modules/template-gallery/app/src/models/Template.js b/services/web/modules/template-gallery/app/src/models/Template.js
new file mode 100644
index 0000000000..79792f150e
--- /dev/null
+++ b/services/web/modules/template-gallery/app/src/models/Template.js
@@ -0,0 +1,33 @@
+const mongoose = require('../../../../../app/src/infrastructure/Mongoose')
+
+const { Schema } = mongoose
+const { ObjectId } = Schema
+
+const TemplateSchema = new Schema(
+  {
+    name: { type: String, required: true },
+    category: { type: String, required: true },
+    description: { type: String },
+    descriptionMD: { type: String },
+    author: { type: String },
+    authorMD: { type: String },
+    license: { type: String, required: true },
+    mainFile: { type: String, required: true },
+    compiler: { type: String, required: true },
+    imageName: { type: String },
+    language: { type: String },
+    version: { type: Number, default: 1, required: true },
+    owner: { type: ObjectId, ref: 'User' },
+    lastUpdated: {
+      type: Date,
+      default() {
+        return new Date()
+      },
+    required: true
+    },
+  },
+  { minimize: false }
+)
+
+exports.Template = mongoose.model('Template', TemplateSchema)
+exports.TemplateSchema = TemplateSchema
diff --git a/services/web/modules/template-gallery/index.mjs b/services/web/modules/template-gallery/index.mjs
new file mode 100644
index 0000000000..16e39f46e7
--- /dev/null
+++ b/services/web/modules/template-gallery/index.mjs
@@ -0,0 +1,42 @@
+import Settings from '@overleaf/settings'
+import TemplateGalleryRouter from './app/src/TemplateGalleryRouter.mjs'
+
+function boolFromEnv(env) {
+  if (env === undefined || env === null) return undefined
+  if (typeof env === "string") {
+    const envLower = env.toLowerCase()
+    if (envLower === 'true') return true
+    if (envLower === 'false') return false
+  }
+  throw new Error("Invalid value for boolean environment variable")
+}
+
+let TemplateGalleryModule = {}
+
+if (process.env.OVERLEAF_TEMPLATE_GALLERY === 'true') {
+  TemplateGalleryModule = {
+    router: TemplateGalleryRouter,
+  }
+
+  Settings.templates = {
+    nonAdminCanManage: boolFromEnv(process.env.OVERLEAF_NON_ADMIN_CAN_PUBLISH_TEMPLATES)
+  }
+
+  const templateKeys = process.env.OVERLEAF_TEMPLATE_CATEGORIES
+    ? process.env.OVERLEAF_TEMPLATE_CATEGORIES + ' all'
+    : 'all'
+
+  Settings.templateLinks = templateKeys.split(/\s+/).map(key => {
+    const envKeyBase = key.toUpperCase().replace(/-/g, "_")
+    const name = process.env[`TEMPLATE_${envKeyBase}_NAME`] || ( key === 'all' ? 'All templates' : key)
+    const description = process.env[`TEMPLATE_${envKeyBase}_DESCRIPTION`] || ''
+
+    return {
+      name,
+      url: `/templates/${key}`,
+      description
+    }
+  })
+}
+
+export default TemplateGalleryModule
diff --git a/services/web/modules/track-changes/app/src/TrackChangesController.mjs b/services/web/modules/track-changes/app/src/TrackChangesController.mjs
new file mode 100644
index 0000000000..931ce06bfa
--- /dev/null
+++ b/services/web/modules/track-changes/app/src/TrackChangesController.mjs
@@ -0,0 +1,172 @@
+import ChatApiHandler from '../../../../app/src/Features/Chat/ChatApiHandler.js'
+import ChatManager from '../../../../app/src/Features/Chat/ChatManager.js'
+import EditorRealTimeController from '../../../../app/src/Features/Editor/EditorRealTimeController.js'
+import SessionManager from '../../../../app/src/Features/Authentication/SessionManager.js'
+import UserInfoManager from '../../../../app/src/Features/User/UserInfoManager.js'
+import UserInfoController from '../../../../app/src/Features/User/UserInfoController.js'
+import DocstoreManager from '../../../../app/src/Features/Docstore/DocstoreManager.js'
+import DocumentUpdaterHandler from '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js'
+import CollaboratorsGetter from '../../../../app/src/Features/Collaborators/CollaboratorsGetter.js'
+import { Project } from '../../../../app/src/models/Project.js'
+import pLimit from 'p-limit'
+
+function _transformId(doc) {
+  if (doc._id) {
+    doc.id = doc._id
+    delete doc._id
+  }
+  return doc
+}
+
+const TrackChangesController = {
+  async trackChanges(req, res, next) {
+    try {
+      const { project_id } = req.params
+      let state = req.body.on || req.body.on_for
+      if (req.body.on_for_guests && !req.body.on) state.__guests__ = true
+      await Project.updateOne({_id: project_id}, {track_changes: state}).exec()  //do not wait?
+      EditorRealTimeController.emitToRoom(project_id, 'toggle-track-changes', state)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async acceptChanges(req, res, next) {
+    try {
+      const { project_id, doc_id } = req.params
+      const change_ids = req.body.change_ids
+      EditorRealTimeController.emitToRoom(project_id, 'accept-changes', doc_id, change_ids)
+      await DocumentUpdaterHandler.promises.acceptChanges(project_id, doc_id, change_ids)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async getAllRanges(req, res, next) {
+    try {
+      const { project_id } = req.params
+      await DocumentUpdaterHandler.promises.flushProjectToMongo(project_id)
+      const ranges = await DocstoreManager.promises.getAllRanges(project_id)
+      res.json(ranges.map(_transformId))
+    } catch (err) {
+      next(err)
+    }
+  },
+  async getChangesUsers(req, res, next) {
+// This route was previously used by the frontend to retrieve names of users who made changes or comments.
+// review-panel-new no longer needs this for comments, but still relies on it for changes -
+// although the frontend knows the names of the current owner and members, it depends on the data
+// provided here to assign names to authors who have left the project but still have unaccepted changes.
+    try {
+      const { project_id } = req.params
+      const memberIds = await DocstoreManager.promises.getTrackedChangesUserIds(project_id)
+      const limit = pLimit(3)
+      const users = await Promise.all(
+        memberIds.map(memberId =>
+          limit(async () => {
+            const user = await UserInfoManager.promises.getPersonalInfo(memberId)
+            return UserInfoController.formatPersonalInfo(user)
+          })
+        )
+      )
+      res.json(users)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async getThreads(req, res, next) {
+    try {
+      const { project_id } = req.params
+      const messages = await ChatApiHandler.promises.getThreads(project_id)
+      await ChatManager.promises.injectUserInfoIntoThreads(messages)
+      res.json(messages)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async sendComment(req, res, next) {
+    try {
+      const { project_id, thread_id } = req.params
+      const { content } = req.body
+      const user_id = SessionManager.getLoggedInUserId(req.session)
+      if (!user_id) throw new Error('no logged-in user')
+      const message = await ChatApiHandler.promises.sendComment(project_id, thread_id, user_id, content)
+      const user = await UserInfoManager.promises.getPersonalInfo(user_id)
+      message.user = UserInfoController.formatPersonalInfo(user)
+      EditorRealTimeController.emitToRoom(project_id, 'new-comment', thread_id, message)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async editMessage(req, res, next) {
+    try {
+      const { project_id, thread_id, message_id } = req.params
+      const { content } = req.body
+      const user_id = SessionManager.getLoggedInUserId(req.session)
+      if (!user_id) throw new Error('no logged-in user')
+      await ChatApiHandler.promises.editMessage(project_id, thread_id, message_id, user_id, content)
+      EditorRealTimeController.emitToRoom(project_id, 'edit-message', thread_id, message_id, content)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async deleteMessage(req, res, next) {
+    try {
+      const { project_id, thread_id, message_id } = req.params
+      await ChatApiHandler.promises.deleteMessage(project_id, thread_id, message_id)
+      EditorRealTimeController.emitToRoom(project_id, 'delete-message', thread_id, message_id)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async resolveThread(req, res, next) {
+    try {
+      const { project_id, doc_id, thread_id } = req.params
+      const user_id = SessionManager.getLoggedInUserId(req.session)
+      if (!user_id) throw new Error('no logged-in user')
+      const user = await UserInfoManager.promises.getPersonalInfo(user_id)
+      await ChatApiHandler.promises.resolveThread(project_id, thread_id, user_id)
+      EditorRealTimeController.emitToRoom(
+        project_id,
+        'resolve-thread',
+        thread_id,
+        UserInfoController.formatPersonalInfo(user)
+      )
+      await DocumentUpdaterHandler.promises.resolveThread(project_id, doc_id, thread_id, user_id)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async reopenThread(req, res, next) {
+    try {
+      const { project_id, doc_id, thread_id } = req.params
+      const user_id = SessionManager.getLoggedInUserId(req.session)
+      if (!user_id) throw new Error('no logged-in user')
+      await ChatApiHandler.promises.reopenThread(project_id, thread_id)
+      EditorRealTimeController.emitToRoom(project_id, 'reopen-thread', thread_id)
+      await DocumentUpdaterHandler.promises.reopenThread(project_id, doc_id, thread_id, user_id)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+  async deleteThread(req, res, next) {
+    try {
+      const { project_id, doc_id, thread_id } = req.params
+      const user_id = SessionManager.getLoggedInUserId(req.session)
+      if (!user_id) throw new Error('no logged-in user')
+      await ChatApiHandler.promises.deleteThread(project_id, thread_id)
+      EditorRealTimeController.emitToRoom(project_id, 'delete-thread', thread_id)
+      await DocumentUpdaterHandler.promises.deleteThread(project_id, doc_id, thread_id, user_id)
+      res.sendStatus(204)
+    } catch (err) {
+      next(err)
+    }
+  },
+}
+
+export default TrackChangesController
diff --git a/services/web/modules/track-changes/app/src/TrackChangesRouter.mjs b/services/web/modules/track-changes/app/src/TrackChangesRouter.mjs
new file mode 100644
index 0000000000..21d73f2ad4
--- /dev/null
+++ b/services/web/modules/track-changes/app/src/TrackChangesRouter.mjs
@@ -0,0 +1,76 @@
+import logger from '@overleaf/logger'
+import AuthorizationMiddleware from '../../../../app/src/Features/Authorization/AuthorizationMiddleware.js'
+import TrackChangesController from './TrackChangesController.mjs'
+
+export default {
+  apply(webRouter) {
+    logger.debug({}, 'Init track-changes router')
+
+    webRouter.post(
+      '/project/:project_id/track_changes',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.trackChanges
+    )
+    webRouter.post(
+      '/project/:project_id/doc/:doc_id/changes/accept',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.acceptChanges
+    )
+    webRouter.get(
+      '/project/:project_id/ranges',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.getAllRanges
+    )
+    webRouter.get(
+      '/project/:project_id/changes/users',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.getChangesUsers
+    )
+    webRouter.get(
+      '/project/:project_id/threads',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.getThreads
+    )
+    webRouter.post(
+      '/project/:project_id/thread/:thread_id/messages',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.sendComment
+    )
+    webRouter.post(
+      '/project/:project_id/thread/:thread_id/messages/:message_id/edit',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.editMessage
+    )
+    webRouter.delete(
+      '/project/:project_id/thread/:thread_id/messages/:message_id',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.deleteMessage
+    )
+    webRouter.post(
+      '/project/:project_id/doc/:doc_id/thread/:thread_id/resolve',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.resolveThread
+    )
+    webRouter.post(
+      '/project/:project_id/doc/:doc_id/thread/:thread_id/reopen',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.reopenThread
+    )
+    webRouter.delete(
+      '/project/:project_id/doc/:doc_id/thread/:thread_id',
+      AuthorizationMiddleware.blockRestrictedUserFromProject,
+      AuthorizationMiddleware.ensureUserCanReadProject,
+      TrackChangesController.deleteThread
+    )
+  }
+}
diff --git a/services/web/modules/track-changes/index.mjs b/services/web/modules/track-changes/index.mjs
new file mode 100644
index 0000000000..1ddf76966f
--- /dev/null
+++ b/services/web/modules/track-changes/index.mjs
@@ -0,0 +1,3 @@
+import TrackChangesRouter from './app/src/TrackChangesRouter.mjs'
+const TrackChangesModule = { router: TrackChangesRouter }
+export default TrackChangesModule
diff --git a/services/web/modules/user-activate/app/views/user/activate.pug b/services/web/modules/user-activate/app/views/user/activate.pug
index 20ccb4dd8e..82671f90a7 100644
--- a/services/web/modules/user-activate/app/views/user/activate.pug
+++ b/services/web/modules/user-activate/app/views/user/activate.pug
@@ -1,15 +1,19 @@
-extends ../../../../../app/views/layout-website-redesign-bootstrap-5
+extends ../../../../../app/views/layout-website-redesign
+
+block vars
+	- isWebsiteRedesign = true
+
+include ../../../../../app/views/_mixins/material_symbol
 
 block content
-	main.content.content-alt#main-content
+	main#main-content.content.content-alt
 		.container
-			div.col-lg-6.col-xl-4.m-auto
+			.col-lg-6.col-xl-4.m-auto
 				.notification-list
-					.notification.notification-type-success(aria-live="off" role="alert")
+					.notification.notification-type-success(aria-live='off' role='alert')
 						.notification-content-and-cta
 							.notification-icon
-								span.material-symbols(aria-hidden="true")
-									| check_circle
+								+material-symbol('check_circle')
 							.notification-content
 								p
 									| #{translate("nearly_activated")}
@@ -17,12 +21,12 @@ block content
 				h1.h3 #{translate("please_set_a_password")}
 
 				form(
+					name='activationForm'
 					data-ol-async-form
-					name="activationForm",
-					action="/user/password/set",
-					method="POST",
+					action='/user/password/set'
+					method='POST'
 				)
-					+formMessages()
+					+formMessages
 
 					+customFormMessage('token-expired', 'danger')
 						| #{translate("activation_token_expired")}
@@ -30,43 +34,39 @@ block content
 					+customFormMessage('invalid-password', 'danger')
 						| #{translate('invalid_password')}
 
-					input(name='_csrf', type='hidden', value=csrfToken)
-					input(
-						type="hidden",
-						name="passwordResetToken",
-						value=token
-					)
+					input(name='_csrf' type='hidden' value=csrfToken)
+					input(name='passwordResetToken' type='hidden' value=token)
 
 					.form-group
 						label(for='emailField') #{translate("email")}
-						input.form-control#emailField(
-							aria-label="email",
-							type='email',
-							name='email',
-							placeholder="email@example.com",
-							autocomplete="username"
+						input#emailField.form-control(
+							name='email'
+							aria-label='email'
+							type='email'
+							placeholder='email@example.com'
+							autocomplete='username'
 							value=email
-							required,
+							required
 							disabled
 						)
 					.form-group
 						label(for='passwordField') #{translate("password")}
-						input.form-control#passwordField(
-							type='password',
-							name='password',
-							placeholder="********",
-							autocomplete="new-password",
-							autofocus,
-							required,
+						input#passwordField.form-control(
+							name='password'
+							type='password'
+							placeholder='********'
+							autocomplete='new-password'
+							autofocus
+							required
 							minlength=settings.passwordStrengthOptions.length.min
 						)
 					.actions
 						button.btn.btn-primary(
-							type='submit',
+							type='submit'
 							data-ol-disabled-inflight
 							aria-label=translate('activate')
 						)
-							span(data-ol-inflight="idle")
+							span(data-ol-inflight='idle')
 								| #{translate('activate')}
-							span(hidden data-ol-inflight="pending")
+							span(hidden data-ol-inflight='pending')
 								| #{translate('activating')}…
diff --git a/services/web/modules/user-activate/app/views/user/register.pug b/services/web/modules/user-activate/app/views/user/register.pug
index d64c2c413e..27e6f8215c 100644
--- a/services/web/modules/user-activate/app/views/user/register.pug
+++ b/services/web/modules/user-activate/app/views/user/register.pug
@@ -1,13 +1,12 @@
-extends ../../../../../app/views/layout-marketing
+extends ../../../../../app/views/layout-react
 
 block entrypointVar
 	- entrypoint = 'modules/user-activate/pages/user-activate-page'
 
-
-block vars
-	- bootstrap5PageStatus = 'disabled'
+block append meta
+	meta(name='ol-user' data-type='json' content=user)
 
 block content
-	.content.content-alt#main-content
+	#main-content.content.content-alt
 		.container
 			#user-activate-register-container
diff --git a/services/web/modules/user-activate/frontend/js/components/register-form.jsx b/services/web/modules/user-activate/frontend/js/components/register-form.jsx
index 0fc8211af6..ec4a91f7e5 100644
--- a/services/web/modules/user-activate/frontend/js/components/register-form.jsx
+++ b/services/web/modules/user-activate/frontend/js/components/register-form.jsx
@@ -1,5 +1,9 @@
+import { useState } from 'react'
 import PropTypes from 'prop-types'
-import { postJSON } from '../../../../../frontend/js/infrastructure/fetch-json'
+import { postJSON } from '@/infrastructure/fetch-json'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 
 function RegisterForm({
   setRegistrationSuccess,
@@ -7,6 +11,7 @@ function RegisterForm({
   setRegisterError,
   setFailedEmails,
 }) {
+  const [isLoading, setIsLoading] = useState(false)
   function handleRegister(event) {
     event.preventDefault()
     const formData = new FormData(event.target)
@@ -22,6 +27,7 @@ function RegisterForm({
   async function registerGivenUsers(emails) {
     const registeredEmails = []
     const failingEmails = []
+    setIsLoading(true)
     for (const email of emails) {
       try {
         const result = await registerUser(email)
@@ -30,6 +36,7 @@ function RegisterForm({
         failingEmails.push(email)
       }
     }
+    setIsLoading(false)
     if (registeredEmails.length > 0) setRegistrationSuccess(true)
     if (failingEmails.length > 0) {
       setRegisterError(true)
@@ -45,10 +52,10 @@ function RegisterForm({
   }
 
   return (
-    <form onSubmit={handleRegister}>
-      <div className="row">
-        <div className="col-md-4 col-xs-8">
-          <input
+    <OLForm onSubmit={handleRegister}>
+      <div className="d-flex gap-2 flex-wrap">
+        <div className="flex-grow-1 max-width">
+          <OLFormControl
             className="form-control"
             name="email"
             type="text"
@@ -56,16 +63,16 @@ function RegisterForm({
             aria-label="emails to register"
             aria-describedby="input-details"
           />
-          <p id="input-details" className="sr-only">
+          <p id="input-details" className="visually-hidden">
             Enter the emails you would like to register and separate them using
             commas
           </p>
         </div>
-        <div className="col-md-8 col-xs-4">
-          <button className="btn btn-primary">Register</button>
-        </div>
+        <OLButton type="submit" className="ms-auto" isLoading={isLoading}>
+          Register
+        </OLButton>
       </div>
-    </form>
+    </OLForm>
   )
 }
 
diff --git a/services/web/modules/user-activate/frontend/js/components/user-activate-register.jsx b/services/web/modules/user-activate/frontend/js/components/user-activate-register.jsx
index d3c66c8f59..0b33270179 100644
--- a/services/web/modules/user-activate/frontend/js/components/user-activate-register.jsx
+++ b/services/web/modules/user-activate/frontend/js/components/user-activate-register.jsx
@@ -1,6 +1,10 @@
 import { useState } from 'react'
 import PropTypes from 'prop-types'
 import RegisterForm from './register-form'
+import OLRow from '@/features/ui/components/ol/ol-row'
+import OLCol from '@/features/ui/components/ol/ol-col'
+import OLCard from '@/features/ui/components/ol/ol-card'
+
 function UserActivateRegister() {
   const [emails, setEmails] = useState([])
   const [failedEmails, setFailedEmails] = useState([])
@@ -8,11 +12,11 @@ function UserActivateRegister() {
   const [registrationSuccess, setRegistrationSuccess] = useState(false)
 
   return (
-    <div className="row">
-      <div className="col-md-12">
-        <div className="card">
+    <OLRow>
+      <OLCol>
+        <OLCard>
           <div className="page-header">
-            <h1> Register New Users</h1>
+            <h1>Register New Users</h1>
           </div>
           <RegisterForm
             setRegistrationSuccess={setRegistrationSuccess}
@@ -30,9 +34,9 @@ function UserActivateRegister() {
               <DisplayEmailsList emails={emails} />
             </>
           ) : null}
-        </div>
-      </div>
-    </div>
+        </OLCard>
+      </OLCol>
+    </OLRow>
   )
 }
 
diff --git a/services/web/modules/user-activate/frontend/js/pages/user-activate-page.jsx b/services/web/modules/user-activate/frontend/js/pages/user-activate-page.jsx
deleted file mode 100644
index 22174de921..0000000000
--- a/services/web/modules/user-activate/frontend/js/pages/user-activate-page.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import '@/marketing'
-
-import ReactDOM from 'react-dom'
-import UserActivateRegister from '../components/user-activate-register'
-
-ReactDOM.render(
-  <UserActivateRegister />,
-  document.getElementById('user-activate-register-container')
-)
diff --git a/services/web/modules/user-activate/frontend/js/pages/user-activate-page.tsx b/services/web/modules/user-activate/frontend/js/pages/user-activate-page.tsx
new file mode 100644
index 0000000000..0172bf5573
--- /dev/null
+++ b/services/web/modules/user-activate/frontend/js/pages/user-activate-page.tsx
@@ -0,0 +1,7 @@
+import { renderInReactLayout } from '@/react'
+
+import UserActivateRegister from '../components/user-activate-register'
+
+renderInReactLayout('user-activate-register-container', () => (
+  <UserActivateRegister />
+))
diff --git a/services/web/modules/user-activate/test/frontend/js/components/register-form.test.jsx b/services/web/modules/user-activate/test/frontend/js/components/register-form.test.jsx
index 39c6e98c1b..58833f1faf 100644
--- a/services/web/modules/user-activate/test/frontend/js/components/register-form.test.jsx
+++ b/services/web/modules/user-activate/test/frontend/js/components/register-form.test.jsx
@@ -6,10 +6,10 @@ import RegisterForm from '../../../../frontend/js/components/register-form'
 
 describe('RegisterForm', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
   it('should render the register form', async function () {
     const setRegistrationSuccessStub = sinon.stub()
@@ -57,6 +57,6 @@ describe('RegisterForm', function () {
     const registerButton = screen.getByRole('button', { name: /register/i })
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
   })
 })
diff --git a/services/web/modules/user-activate/test/frontend/js/components/user-activate-register.test.jsx b/services/web/modules/user-activate/test/frontend/js/components/user-activate-register.test.jsx
index 773170feec..ed928bb7e2 100644
--- a/services/web/modules/user-activate/test/frontend/js/components/user-activate-register.test.jsx
+++ b/services/web/modules/user-activate/test/frontend/js/components/user-activate-register.test.jsx
@@ -2,13 +2,14 @@ import { expect } from 'chai'
 import { render, screen, fireEvent } from '@testing-library/react'
 import fetchMock from 'fetch-mock'
 import UserActivateRegister from '../../../../frontend/js/components/user-activate-register'
+import { TPDS_SYNCED } from '../../../../../dropbox/test/frontend/components/dropbox-sync-status.test'
 
 describe('UserActivateRegister', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
   it('should display the error message', async function () {
     const email = 'abc@gmail.com'
@@ -16,6 +17,7 @@ describe('UserActivateRegister', function () {
     const endPointResponse = {
       status: 500,
     }
+    fetchMock.get('/user/tpds/queues', TPDS_SYNCED)
     const registerMock = fetchMock.post('/admin/register', endPointResponse)
     const registerInput = screen.getByLabelText('emails to register')
     const registerButton = screen.getByRole('button', { name: /register/i })
@@ -23,7 +25,7 @@ describe('UserActivateRegister', function () {
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
 
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
     await screen.findByText('Sorry, an error occured', { exact: false })
   })
 
@@ -37,6 +39,7 @@ describe('UserActivateRegister', function () {
         setNewPasswordUrl: 'SetNewPasswordURL',
       },
     }
+    fetchMock.get('/user/tpds/queues', TPDS_SYNCED)
     const registerMock = fetchMock.post('/admin/register', endPointResponse)
     const registerInput = screen.getByLabelText('emails to register')
     const registerButton = screen.getByRole('button', { name: /register/i })
@@ -44,7 +47,7 @@ describe('UserActivateRegister', function () {
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
 
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
     await screen.findByText(
       "We've sent out welcome emails to the registered users."
     )
@@ -67,6 +70,7 @@ describe('UserActivateRegister', function () {
         setNewPasswordUrl: 'SetNewPasswordURL',
       },
     }
+    fetchMock.get('/user/tpds/queues', TPDS_SYNCED)
     const registerMock = fetchMock.post('/admin/register', (path, req) => {
       const body = JSON.parse(req.body)
       if (body.email === 'abc@gmail.com') return endPointResponse1
@@ -78,7 +82,7 @@ describe('UserActivateRegister', function () {
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
 
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
     await screen.findByText('abc@gmail.com')
     await screen.findByText('def@gmail.com')
   })
@@ -92,6 +96,7 @@ describe('UserActivateRegister', function () {
     const endPointResponse2 = {
       status: 500,
     }
+    fetchMock.get('/user/tpds/queues', TPDS_SYNCED)
     const registerMock = fetchMock.post('/admin/register', (path, req) => {
       const body = JSON.parse(req.body)
       if (body.email === 'abc@') return endPointResponse1
@@ -103,7 +108,7 @@ describe('UserActivateRegister', function () {
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
 
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
     await screen.findByText('abc@')
     await screen.findByText('def@')
   })
@@ -121,6 +126,7 @@ describe('UserActivateRegister', function () {
     const endPointResponse2 = {
       status: 500,
     }
+    fetchMock.get('/user/tpds/queues', TPDS_SYNCED)
     const registerMock = fetchMock.post('/admin/register', (path, req) => {
       const body = JSON.parse(req.body)
       if (body.email === 'abc@gmail.com') return endPointResponse1
@@ -133,7 +139,7 @@ describe('UserActivateRegister', function () {
     fireEvent.change(registerInput, { target: { value: email } })
     fireEvent.click(registerButton)
 
-    expect(registerMock.called()).to.be.true
+    expect(registerMock.callHistory.called()).to.be.true
     await screen.findByText('abc@gmail.com')
     await screen.findByText('def@')
   })
diff --git a/services/web/modules/user-activate/test/unit/src/UserActivateController.test.mjs b/services/web/modules/user-activate/test/unit/src/UserActivateController.test.mjs
new file mode 100644
index 0000000000..be59eecf97
--- /dev/null
+++ b/services/web/modules/user-activate/test/unit/src/UserActivateController.test.mjs
@@ -0,0 +1,165 @@
+import { vi } from 'vitest'
+import Path from 'node:path'
+import sinon from 'sinon'
+
+const MODULE_PATH = '../../../app/src/UserActivateController.mjs'
+
+const VIEW_PATH = Path.join(
+  import.meta.dirname,
+  '../../../app/views/user/activate'
+)
+
+describe('UserActivateController', function () {
+  beforeEach(async function (ctx) {
+    ctx.user = {
+      _id: (ctx.user_id = 'kwjewkl'),
+      features: {},
+      email: 'joe@example.com',
+    }
+
+    ctx.UserGetter = {
+      promises: {
+        getUser: sinon.stub(),
+      },
+    }
+    ctx.UserRegistrationHandler = { promises: {} }
+    ctx.ErrorController = { notFound: sinon.stub() }
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().resolves({ variant: 'default' }),
+      },
+    }
+
+    vi.doMock('../../../../../app/src/Features/User/UserGetter.js', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock(
+      '../../../../../app/src/Features/User/UserRegistrationHandler.js',
+      () => ({
+        default: ctx.UserRegistrationHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../../app/src/Features/Errors/ErrorController.js',
+      () => ({
+        default: ctx.ErrorController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    ctx.UserActivateController = (await import(MODULE_PATH)).default
+    ctx.req = {
+      body: {},
+      query: {},
+      session: {
+        user: ctx.user,
+      },
+    }
+    ctx.res = {
+      json: sinon.stub(),
+    }
+  })
+
+  describe('activateAccountPage', function () {
+    beforeEach(function (ctx) {
+      ctx.UserGetter.promises.getUser = sinon.stub().resolves(ctx.user)
+      ctx.req.query.user_id = ctx.user_id
+      ctx.req.query.token = ctx.token = 'mock-token-123'
+    })
+
+    it('should 404 without a user_id', async function (ctx) {
+      delete ctx.req.query.user_id
+
+      await new Promise(resolve => {
+        ctx.ErrorController.notFound = () => resolve()
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should 404 without a token', async function (ctx) {
+      await new Promise(resolve => {
+        delete ctx.req.query.token
+        ctx.ErrorController.notFound = resolve
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should 404 without a valid user_id', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserGetter.promises.getUser = sinon.stub().resolves(null)
+        ctx.ErrorController.notFound = resolve
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should 403 for complex user_id', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.ErrorController.forbidden = resolve
+        ctx.req.query.user_id = { first_name: 'X' }
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should redirect activated users to login', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.user.loginCount = 1
+        ctx.res.redirect = url => {
+          sinon.assert.calledWith(ctx.UserGetter.promises.getUser, ctx.user_id)
+          url.should.equal('/login')
+          resolve()
+        }
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('render the activation page if the user has not logged in before', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.user.loginCount = 0
+        ctx.res.render = (page, opts) => {
+          page.should.equal(VIEW_PATH)
+          opts.email.should.equal(ctx.user.email)
+          opts.token.should.equal(ctx.token)
+          resolve()
+        }
+        ctx.UserActivateController.activateAccountPage(ctx.req, ctx.res)
+      })
+    })
+  })
+
+  describe('register', function () {
+    beforeEach(async function (ctx) {
+      ctx.UserRegistrationHandler.promises.registerNewUserAndSendActivationEmail =
+        sinon.stub().resolves({
+          user: ctx.user,
+          setNewPasswordUrl: (ctx.url = 'mock/url'),
+        })
+      ctx.req.body.email = ctx.user.email = ctx.email = 'email@example.com'
+      await ctx.UserActivateController.register(ctx.req, ctx.res)
+    })
+
+    it('should register the user and send them an email', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.UserRegistrationHandler.promises
+          .registerNewUserAndSendActivationEmail,
+        ctx.email
+      )
+    })
+
+    it('should return the user and activation url', function (ctx) {
+      ctx.res.json
+        .calledWith({
+          email: ctx.email,
+          setNewPasswordUrl: ctx.url,
+        })
+        .should.equal(true)
+    })
+  })
+})
diff --git a/services/web/modules/user-activate/test/unit/src/UserActivateControllerTests.mjs b/services/web/modules/user-activate/test/unit/src/UserActivateControllerTests.mjs
deleted file mode 100644
index 7c4382a720..0000000000
--- a/services/web/modules/user-activate/test/unit/src/UserActivateControllerTests.mjs
+++ /dev/null
@@ -1,134 +0,0 @@
-import Path from 'node:path'
-import { fileURLToPath } from 'node:url'
-import { strict as esmock } from 'esmock'
-import sinon from 'sinon'
-
-const __dirname = Path.dirname(fileURLToPath(import.meta.url))
-
-const MODULE_PATH = '../../../app/src/UserActivateController.mjs'
-
-const VIEW_PATH = Path.join(__dirname, '../../../app/views/user/activate')
-
-describe('UserActivateController', function () {
-  beforeEach(async function () {
-    this.user = {
-      _id: (this.user_id = 'kwjewkl'),
-      features: {},
-      email: 'joe@example.com',
-    }
-
-    this.UserGetter = {
-      promises: {
-        getUser: sinon.stub(),
-      },
-    }
-    this.UserRegistrationHandler = { promises: {} }
-    this.ErrorController = { notFound: sinon.stub() }
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves({ variant: 'default' }),
-      },
-    }
-    this.UserActivateController = await esmock(MODULE_PATH, {
-      '../../../../../app/src/Features/User/UserGetter.js': this.UserGetter,
-      '../../../../../app/src/Features/User/UserRegistrationHandler.js':
-        this.UserRegistrationHandler,
-      '../../../../../app/src/Features/Errors/ErrorController.js':
-        this.ErrorController,
-      '../../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-    })
-    this.req = {
-      body: {},
-      query: {},
-      session: {
-        user: this.user,
-      },
-    }
-    this.res = {
-      json: sinon.stub(),
-    }
-  })
-
-  describe('activateAccountPage', function () {
-    beforeEach(function () {
-      this.UserGetter.promises.getUser = sinon.stub().resolves(this.user)
-      this.req.query.user_id = this.user_id
-      this.req.query.token = this.token = 'mock-token-123'
-    })
-
-    it('should 404 without a user_id', async function (done) {
-      delete this.req.query.user_id
-      this.ErrorController.notFound = () => done()
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-
-    it('should 404 without a token', function (done) {
-      delete this.req.query.token
-      this.ErrorController.notFound = () => done()
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-
-    it('should 404 without a valid user_id', function (done) {
-      this.UserGetter.promises.getUser = sinon.stub().resolves(null)
-      this.ErrorController.notFound = () => done()
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-
-    it('should 403 for complex user_id', function (done) {
-      this.ErrorController.forbidden = () => done()
-      this.req.query.user_id = { first_name: 'X' }
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-
-    it('should redirect activated users to login', function (done) {
-      this.user.loginCount = 1
-      this.res.redirect = url => {
-        sinon.assert.calledWith(this.UserGetter.promises.getUser, this.user_id)
-        url.should.equal('/login')
-        return done()
-      }
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-
-    it('render the activation page if the user has not logged in before', function (done) {
-      this.user.loginCount = 0
-      this.res.render = (page, opts) => {
-        page.should.equal(VIEW_PATH)
-        opts.email.should.equal(this.user.email)
-        opts.token.should.equal(this.token)
-        return done()
-      }
-      this.UserActivateController.activateAccountPage(this.req, this.res)
-    })
-  })
-
-  describe('register', function () {
-    beforeEach(async function () {
-      this.UserRegistrationHandler.promises.registerNewUserAndSendActivationEmail =
-        sinon.stub().resolves({
-          user: this.user,
-          setNewPasswordUrl: (this.url = 'mock/url'),
-        })
-      this.req.body.email = this.user.email = this.email = 'email@example.com'
-      await this.UserActivateController.register(this.req, this.res)
-    })
-
-    it('should register the user and send them an email', function () {
-      sinon.assert.calledWith(
-        this.UserRegistrationHandler.promises
-          .registerNewUserAndSendActivationEmail,
-        this.email
-      )
-    })
-
-    it('should return the user and activation url', function () {
-      this.res.json
-        .calledWith({
-          email: this.email,
-          setNewPasswordUrl: this.url,
-        })
-        .should.equal(true)
-    })
-  })
-})
diff --git a/services/web/package.json b/services/web/package.json
index a2c7a6fe4b..7fccc9e500 100644
--- a/services/web/package.json
+++ b/services/web/package.json
@@ -9,10 +9,14 @@
   "scripts": {
     "test:acceptance:run_dir": "mocha --recursive --timeout 25000 --grep=$MOCHA_GREP --require test/acceptance/bootstrap.js",
     "test:acceptance:app": "npm run test:acceptance:run_dir -- test/acceptance/src",
-    "test:unit:run_dir": "mocha --recursive --timeout 25000 --exit --grep=$MOCHA_GREP --require test/unit/bootstrap.js",
+    "test:unit:run_dir": "bin/test_unit_run_dir",
     "test:unit:all": "npm run test:unit:run_dir -- test/unit/src modules/*/test/unit/src",
     "test:unit:all:silent": "npm run test:unit:all -- --reporter dot",
     "test:unit:app": "npm run test:unit:run_dir -- test/unit/src",
+    "test:unit:mocha": "npm run test:unit:mocha:run_dir -- test/unit/src modules/*/test/unit/src",
+    "test:unit:mocha:run_dir": "mocha --recursive --timeout 25000 --exit --grep=$MOCHA_GREP --require test/unit/bootstrap.js --extension=js",
+    "test:unit:esm": "vitest run",
+    "test:unit:esm:watch": "vitest",
     "test:frontend": "NODE_ENV=test TZ=GMT mocha --recursive --timeout 5000 --exit --extension js,jsx,mjs,ts,tsx --grep=$MOCHA_GREP --require test/frontend/bootstrap.js --ignore '**/*.spec.{js,jsx,ts,tsx}' --ignore '**/helpers/**/*.{js,jsx,ts,tsx}' test/frontend modules/*/test/frontend",
     "test:frontend:coverage": "c8 --all --include 'frontend/js' --include 'modules/*/frontend/js' --exclude 'frontend/js/vendor' --reporter=lcov --reporter=text-summary npm run test:frontend",
     "start": "node app.mjs",
@@ -24,6 +28,8 @@
     "format:fix": "prettier --write $PWD/'**/*.{js,jsx,mjs,ts,tsx,json}'",
     "format:styles": "prettier --list-different $PWD/'**/*.{css,less,scss}'",
     "format:styles:fix": "prettier --write $PWD/'**/*.{css,less,scss}'",
+    "format:pug": "prettier --list-different $PWD/'**/*.pug'",
+    "format:pug:fix": "prettier --write $PWD/'**/*.pug'",
     "lint": "eslint --max-warnings 0 --format unix --ext .js,.jsx,.mjs,.ts,.tsx .",
     "lint:fix": "eslint --fix --ext .js,.jsx,.mjs,.ts,.tsx .",
     "lint:styles": "stylelint '**/*.scss'",
@@ -85,16 +91,16 @@
     "@overleaf/promise-utils": "*",
     "@overleaf/redis-wrapper": "*",
     "@overleaf/settings": "*",
+    "@overleaf/stream-utils": "*",
     "@phosphor-icons/react": "^2.1.7",
     "@slack/webhook": "^7.0.2",
-    "@stripe/stripe-js": "^5.6.0",
-    "@stripe/react-stripe-js": "^3.1.1",
+    "@stripe/stripe-js": "^7.3.0",
     "@xmldom/xmldom": "^0.7.13",
     "accepts": "^1.3.7",
     "ajv": "^8.12.0",
     "archiver": "^5.3.0",
     "async": "^3.2.5",
-    "base-x": "^4.0.0",
+    "base-x": "^4.0.1",
     "basic-auth": "^2.0.1",
     "bcrypt": "^5.0.0",
     "body-parser": "^1.20.3",
@@ -140,7 +146,7 @@
     "moment": "^2.29.4",
     "mongodb-legacy": "6.1.3",
     "mongoose": "8.9.5",
-    "multer": "overleaf/multer#e1df247fbf8e7590520d20ae3601eaef9f3d2e9e",
+    "multer": "overleaf/multer#4dbceda355efc3fc8ac3cf5c66c3778c8a6fdb23",
     "nocache": "^2.1.0",
     "node-fetch": "^2.7.0",
     "nodemailer": "^6.7.0",
@@ -156,6 +162,7 @@
     "passport-ldapauth": "^2.1.4",
     "passport-local": "^1.0.0",
     "passport-oauth2": "^1.5.0",
+    "passport-openidconnect": "^0.1.2",
     "passport-orcid": "0.0.4",
     "pug": "^3.0.3",
     "pug-runtime": "^3.0.1",
@@ -165,7 +172,7 @@
     "request": "^2.88.2",
     "requestretry": "^7.1.0",
     "sanitize-html": "^2.8.1",
-    "stripe": "^17.7.0",
+    "stripe": "^18.1.0",
     "tough-cookie": "^4.0.0",
     "tsscmp": "^1.0.6",
     "uid-safe": "^2.1.5",
@@ -178,52 +185,52 @@
     "yauzl": "^2.10.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.24.8",
-    "@babel/core": "^7.25.2",
-    "@babel/preset-env": "^7.25.3",
-    "@babel/preset-react": "^7.24.7",
-    "@babel/preset-typescript": "^7.24.7",
-    "@babel/register": "^7.24.6",
+    "@babel/cli": "^7.27.0",
+    "@babel/core": "^7.26.10",
+    "@babel/preset-env": "^7.26.9",
+    "@babel/preset-react": "^7.26.3",
+    "@babel/preset-typescript": "^7.27.0",
+    "@babel/register": "^7.25.9",
     "@codemirror/autocomplete": "github:overleaf/codemirror-autocomplete#6445cd056671c98d12d1c597ba705e11327ec4c5",
-    "@codemirror/commands": "^6.8.0",
+    "@codemirror/commands": "^6.8.1",
     "@codemirror/lang-markdown": "^6.3.2",
-    "@codemirror/language": "^6.10.8",
-    "@codemirror/lint": "^6.8.4",
+    "@codemirror/language": "^6.11.0",
+    "@codemirror/lint": "^6.8.5",
     "@codemirror/search": "github:overleaf/codemirror-search#04380a528c339cd4b78fb10b3ef017f657ec17bd",
     "@codemirror/state": "^6.5.2",
-    "@codemirror/view": "^6.36.3",
+    "@codemirror/view": "^6.36.8",
     "@juggle/resize-observer": "^3.3.1",
     "@lezer/common": "^1.2.3",
-    "@lezer/generator": "^1.7.1",
+    "@lezer/generator": "^1.7.3",
     "@lezer/highlight": "^1.2.1",
     "@lezer/lr": "^1.4.2",
-    "@lezer/markdown": "^1.3.2",
+    "@lezer/markdown": "^1.4.3",
     "@overleaf/codemirror-tree-view": "^0.1.3",
     "@overleaf/dictionaries": "https://github.com/overleaf/dictionaries/archive/refs/tags/v0.0.3.tar.gz",
     "@overleaf/ranges-tracker": "*",
     "@overleaf/stream-utils": "*",
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.16",
     "@pollyjs/adapter-node-http": "^6.0.6",
     "@pollyjs/core": "^6.0.6",
     "@pollyjs/persister-fs": "^6.0.6",
+    "@prettier/plugin-pug": "^3.4.0",
     "@replit/codemirror-emacs": "overleaf/codemirror-emacs#4394c03858f27053f8768258e9493866e06e938e",
     "@replit/codemirror-indentation-markers": "overleaf/codemirror-indentation-markers#78264032eb286bc47871569ae87bff5ca1c6c161",
     "@replit/codemirror-vim": "overleaf/codemirror-vim#1bef138382d948018f3f9b8a4d7a70ab61774e4b",
     "@sentry/browser": "7.46.0",
-    "@storybook/addon-a11y": "^8.6.4",
-    "@storybook/addon-essentials": "^8.6.4",
-    "@storybook/addon-interactions": "^8.6.4",
-    "@storybook/addon-links": "^8.6.4",
+    "@storybook/addon-a11y": "^8.6.12",
+    "@storybook/addon-essentials": "^8.6.12",
+    "@storybook/addon-interactions": "^8.6.12",
+    "@storybook/addon-links": "^8.6.12",
     "@storybook/addon-styling-webpack": "^1.0.1",
-    "@storybook/addon-webpack5-compiler-babel": "^3.0.5",
-    "@storybook/cli": "^8.6.4",
-    "@storybook/react": "^8.6.4",
-    "@storybook/react-webpack5": "^8.6.4",
-    "@storybook/theming": "^8.6.4",
+    "@storybook/addon-webpack5-compiler-babel": "^3.0.6",
+    "@storybook/cli": "^8.6.12",
+    "@storybook/react": "^8.6.12",
+    "@storybook/react-webpack5": "^8.6.12",
+    "@storybook/theming": "^8.6.12",
     "@testing-library/cypress": "^10.0.1",
-    "@testing-library/dom": "^9.3.0",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/react-hooks": "^8.0.1",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/bootstrap": "^5.2.10",
     "@types/bootstrap-5": "npm:@types/bootstrap@^5.2.10",
@@ -234,13 +241,11 @@
     "@types/express": "^4.17.13",
     "@types/mocha": "^9.1.0",
     "@types/mocha-each": "^2.0.0",
-    "@types/react": "^17.0.40",
-    "@types/react-bootstrap": "^0.32.36",
-    "@types/react-color": "^3.0.6",
-    "@types/react-dom": "^17.0.13",
-    "@types/react-google-recaptcha": "^2.1.5",
-    "@types/react-linkify": "^1.0.0",
-    "@types/react-overlays": "^1.1.3",
+    "@types/react": "^18.3.20",
+    "@types/react-color": "^3.0.13",
+    "@types/react-dom": "^18.3.6",
+    "@types/react-google-recaptcha": "^2.1.9",
+    "@types/react-linkify": "^1.0.4",
     "@types/recurly__recurly-js": "^4.22.0",
     "@types/sinon-chai": "^3.2.8",
     "@types/uuid": "^9.0.8",
@@ -252,6 +257,7 @@
     "@uppy/react": "^3.2.1",
     "@uppy/utils": "^5.7.0",
     "@uppy/xhr-upload": "^3.6.0",
+    "@vitest/eslint-plugin": "1.1.44",
     "5to6-codemod": "^1.8.0",
     "abort-controller": "^3.0.0",
     "acorn": "^7.1.1",
@@ -263,7 +269,7 @@
     "babel-plugin-module-resolver": "^5.0.2",
     "backbone": "^1.6.0",
     "bootstrap": "^3.4.1",
-    "bootstrap-5": "npm:bootstrap@^5.3.3",
+    "bootstrap-5": "npm:bootstrap@^5.3.6",
     "c8": "^7.2.0",
     "chai": "^4.3.6",
     "chai-as-promised": "^7.1.1",
@@ -273,9 +279,10 @@
     "chartjs-plugin-datalabels": "^2.2.0",
     "cheerio": "^1.0.0-rc.3",
     "classnames": "^2.2.6",
+    "confusing-browser-globals": "^1.0.11",
     "cookie-signature": "^1.2.1",
     "copy-webpack-plugin": "^11.0.0",
-    "core-js": "^3.38.1",
+    "core-js": "^3.41.0",
     "css-loader": "^6.8.1",
     "css-minimizer-webpack-plugin": "^5.0.1",
     "cypress": "13.13.2",
@@ -284,7 +291,7 @@
     "daterangepicker": "2.1.27",
     "diff": "^5.1.0",
     "dompurify": "^3.2.4",
-    "downshift": "^6.1.0",
+    "downshift": "^9.0.9",
     "es6-promise": "^4.2.8",
     "escodegen": "^2.0.0",
     "eslint-config-standard-jsx": "^11.0.0",
@@ -293,13 +300,13 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-testing-library": "^7.1.1",
     "eslint-plugin-unicorn": "^56.0.0",
-    "esmock": "^2.6.7",
     "events": "^3.3.0",
     "fake-indexeddb": "^6.0.0",
-    "fetch-mock": "^9.10.2",
+    "fetch-mock": "^12.5.2",
     "formik": "^2.2.9",
     "fuse.js": "^3.0.0",
     "glob": "^7.1.6",
+    "globals": "^16.2.0",
     "handlebars": "^4.7.8",
     "handlebars-loader": "^1.7.3",
     "html-webpack-plugin": "^5.5.3",
@@ -321,25 +328,23 @@
     "nock": "^13.5.6",
     "nvd3": "^1.8.6",
     "overleaf-editor-core": "*",
-    "pdfjs-dist": "4.10.38",
+    "pdfjs-dist": "5.1.91",
     "pirates": "^4.0.1",
     "postcss": "^8.4.31",
     "postcss-loader": "^7.3.3",
     "prop-types": "^15.7.2",
     "qrcode": "^1.4.4",
-    "react": "^17.0.2",
-    "react-bootstrap": "^0.33.1",
-    "react-bootstrap-5": "npm:react-bootstrap@^2.10.5",
+    "react": "^18.3.1",
+    "react-bootstrap": "^2.10.10",
     "react-chartjs-2": "^5.0.1",
     "react-color": "^2.19.3",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dom": "^17.0.2",
-    "react-error-boundary": "^2.3.1",
+    "react-dom": "^18.3.1",
+    "react-error-boundary": "^5.0.0",
     "react-google-recaptcha": "^3.1.0",
     "react-i18next": "^13.3.1",
     "react-linkify": "^1.0.0-alpha",
-    "react-overlays": "^0.9.3",
     "react-refresh": "^0.14.0",
     "react-resizable-panels": "^2.1.1",
     "resolve-url-loader": "^5.0.0",
@@ -351,20 +356,21 @@
     "sinon": "^7.5.0",
     "sinon-chai": "^3.7.0",
     "sinon-mongoose": "^2.3.0",
-    "storybook": "^8.6.4",
+    "storybook": "^8.6.12",
     "stylelint-config-standard-scss": "^13.1.0",
     "terser-webpack-plugin": "^5.3.9",
     "thread-loader": "^4.0.2",
     "timekeeper": "^2.2.0",
     "to-string-loader": "^1.2.0",
     "tty-browserify": "^0.0.1",
-    "typescript": "^5.0.4",
+    "typescript": "^5.8.3",
     "uuid": "^9.0.1",
+    "vitest": "^3.1.2",
     "w3c-keyname": "^2.2.8",
     "webpack": "^5.98.0",
     "webpack-assets-manifest": "^5.2.1",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^5.2.0",
+    "webpack-dev-server": "^5.2.1",
     "webpack-merge": "^5.10.0",
     "yup": "^0.32.11"
   },
diff --git a/services/web/public/favicon-compiled.svg b/services/web/public/favicon-compiled.svg
new file mode 100644
index 0000000000..8bee787bb2
--- /dev/null
+++ b/services/web/public/favicon-compiled.svg
@@ -0,0 +1,9 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="8" cy="8" r="8" fill="#fff"/>
+  <path
+    d="M13.0748 3.19694C11.6883 2.6541 6.67193 2.45789 6.66539 5.45331C5.20038 6.38857 4.23242 7.91244 4.23242 9.5475C4.23242 11.5226 5.83478 13.125 7.80992 13.125C9.78507 13.125 11.3874 11.5226 11.3874 9.5475C11.3874 8.02362 10.4326 6.71558 9.08527 6.20544C8.82366 6.10734 8.2612 5.93075 7.81646 5.96999C7.17552 6.37549 6.3907 7.21263 6.02444 8.04978C6.57382 7.38922 7.43059 7.10145 8.1958 7.22571C9.31418 7.40884 10.1709 8.37679 10.1709 9.55404C10.1709 10.8555 9.11797 11.9085 7.81646 11.9085C7.09704 11.9085 6.4561 11.588 6.02444 11.0844C5.37696 10.3323 5.21346 9.52133 5.34426 8.72997C5.79554 5.95691 9.08527 4.38072 11.5313 3.77248C10.7334 4.19759 9.29456 4.89085 8.28736 5.64298C11.2239 6.78098 11.7014 4.30223 13.0748 3.19694Z"
+    fill="#046530"/>
+  <circle cx="10.5" cy="11.5" r="3.5" fill="#fff"/>
+  <path fill="#000"
+        d="m9.615 12.032 2.75-2.921a.31.31 0 0 1 .26-.111q.146 0 .26.122a.395.395 0 0 1 0 .555l-3 3.2a.349.349 0 0 1-.531 0l-1.24-1.322a.395.395 0 0 1 0-.556.35.35 0 0 1 .261-.122q.146 0 .26.122z"/>
+</svg>
diff --git a/services/web/public/favicon-compiling.svg b/services/web/public/favicon-compiling.svg
new file mode 100644
index 0000000000..fed675637c
--- /dev/null
+++ b/services/web/public/favicon-compiling.svg
@@ -0,0 +1,9 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="8" cy="8" r="8" fill="#fff"/>
+  <path
+    d="M13.0748 3.19694C11.6883 2.6541 6.67193 2.45789 6.66539 5.45331C5.20038 6.38857 4.23242 7.91244 4.23242 9.5475C4.23242 11.5226 5.83478 13.125 7.80992 13.125C9.78507 13.125 11.3874 11.5226 11.3874 9.5475C11.3874 8.02362 10.4326 6.71558 9.08527 6.20544C8.82366 6.10734 8.2612 5.93075 7.81646 5.96999C7.17552 6.37549 6.3907 7.21263 6.02444 8.04978C6.57382 7.38922 7.43059 7.10145 8.1958 7.22571C9.31418 7.40884 10.1709 8.37679 10.1709 9.55404C10.1709 10.8555 9.11797 11.9085 7.81646 11.9085C7.09704 11.9085 6.4561 11.588 6.02444 11.0844C5.37696 10.3323 5.21346 9.52133 5.34426 8.72997C5.79554 5.95691 9.08527 4.38072 11.5313 3.77248C10.7334 4.19759 9.29456 4.89085 8.28736 5.64298C11.2239 6.78098 11.7014 4.30223 13.0748 3.19694Z"
+    fill="#046530"/>
+  <circle cx="10.5" cy="11.5" r="3.5" fill="#fff"/>
+  <path fill="#000"
+        d="M9.1 11.4q0 .4.158.742.167.341.442.583V12.5q0-.125.083-.208A.3.3 0 0 1 10 12.2a.27.27 0 0 1 .208.092.27.27 0 0 1 .092.208v1q0 .125-.092.217A.28.28 0 0 1 10 13.8H9a.3.3 0 0 1-.217-.083.3.3 0 0 1-.083-.217q0-.125.083-.208A.3.3 0 0 1 9 13.2h.317a2.6 2.6 0 0 1-.6-.792A2.4 2.4 0 0 1 8.5 11.4q0-.708.367-1.275.366-.575.966-.867a.22.22 0 0 1 .217 0 .28.28 0 0 1 .15.167.3.3 0 0 1-.008.233.3.3 0 0 1-.15.167 1.8 1.8 0 0 0-.684.65q-.258.408-.258.925m3.6 0a1.7 1.7 0 0 0-.167-.742 1.7 1.7 0 0 0-.433-.583v.225q0 .125-.092.217a.28.28 0 0 1-.208.083.3.3 0 0 1-.217-.083.3.3 0 0 1-.083-.217v-1q0-.125.083-.208A.3.3 0 0 1 11.8 9h1a.27.27 0 0 1 .208.092.27.27 0 0 1 .092.208q0 .125-.092.217a.28.28 0 0 1-.208.083h-.317q.376.333.592.8.225.459.225 1 0 .708-.367 1.283a2.36 2.36 0 0 1-.966.859.23.23 0 0 1-.217.008.3.3 0 0 1-.15-.175.35.35 0 0 1-.008-.225.3.3 0 0 1 .15-.167q.425-.225.691-.641a1.7 1.7 0 0 0 .267-.942"/>
+</svg>
diff --git a/services/web/public/favicon-error.svg b/services/web/public/favicon-error.svg
new file mode 100644
index 0000000000..5b88401356
--- /dev/null
+++ b/services/web/public/favicon-error.svg
@@ -0,0 +1,9 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="8" cy="8" r="8" fill="#fff"/>
+  <path
+    d="M13.0748 3.19694C11.6883 2.6541 6.67193 2.45789 6.66539 5.45331C5.20038 6.38857 4.23242 7.91244 4.23242 9.5475C4.23242 11.5226 5.83478 13.125 7.80992 13.125C9.78507 13.125 11.3874 11.5226 11.3874 9.5475C11.3874 8.02362 10.4326 6.71558 9.08527 6.20544C8.82366 6.10734 8.2612 5.93075 7.81646 5.96999C7.17552 6.37549 6.3907 7.21263 6.02444 8.04978C6.57382 7.38922 7.43059 7.10145 8.1958 7.22571C9.31418 7.40884 10.1709 8.37679 10.1709 9.55404C10.1709 10.8555 9.11797 11.9085 7.81646 11.9085C7.09704 11.9085 6.4561 11.588 6.02444 11.0844C5.37696 10.3323 5.21346 9.52133 5.34426 8.72997C5.79554 5.95691 9.08527 4.38072 11.5313 3.77248C10.7334 4.19759 9.29456 4.89085 8.28736 5.64298C11.2239 6.78098 11.7014 4.30223 13.0748 3.19694Z"
+    fill="#046530"/>
+  <circle cx="10.5" cy="11.5" r="3.5" fill="#fff"/>
+  <path fill="#000"
+        d="m10.5 12.064-1.814 1.814a.38.38 0 0 1-.277.122.43.43 0 0 1-.276-.133.38.38 0 0 1-.122-.276q0-.166.122-.288L9.936 11.5 8.122 9.686A.38.38 0 0 1 8 9.409a.44.44 0 0 1 .133-.287A.38.38 0 0 1 8.409 9q.166 0 .288.122l1.803 1.814 1.814-1.814A.38.38 0 0 1 12.591 9q.165 0 .287.122a.4.4 0 0 1 .122.287q0 .156-.122.277L11.064 11.5l1.814 1.814a.38.38 0 0 1 .122.277q0 .155-.122.276a.4.4 0 0 1-.287.122.38.38 0 0 1-.277-.122z"/>
+</svg>
diff --git a/services/web/public/img/ai-assist/editing-tools.png b/services/web/public/img/ai-assist/editing-tools.png
new file mode 100644
index 0000000000..c98f77f6aa
Binary files /dev/null and b/services/web/public/img/ai-assist/editing-tools.png differ
diff --git a/services/web/public/img/ai-assist/equation-generator.png b/services/web/public/img/ai-assist/equation-generator.png
new file mode 100644
index 0000000000..98635334b5
Binary files /dev/null and b/services/web/public/img/ai-assist/equation-generator.png differ
diff --git a/services/web/public/img/ai-assist/error-assist.png b/services/web/public/img/ai-assist/error-assist.png
new file mode 100644
index 0000000000..23cfa3710e
Binary files /dev/null and b/services/web/public/img/ai-assist/error-assist.png differ
diff --git a/services/web/public/img/ai-assist/language-suggestions.png b/services/web/public/img/ai-assist/language-suggestions.png
new file mode 100644
index 0000000000..ed821a83ed
Binary files /dev/null and b/services/web/public/img/ai-assist/language-suggestions.png differ
diff --git a/services/web/public/img/ai-assist/table-generator.png b/services/web/public/img/ai-assist/table-generator.png
new file mode 100644
index 0000000000..60d909e159
Binary files /dev/null and b/services/web/public/img/ai-assist/table-generator.png differ
diff --git a/services/web/public/img/ai-assist/texgpt.png b/services/web/public/img/ai-assist/texgpt.png
new file mode 100644
index 0000000000..80cf7fa7bb
Binary files /dev/null and b/services/web/public/img/ai-assist/texgpt.png differ
diff --git a/services/web/public/img/check-circle-blue-filled.svg b/services/web/public/img/check-circle-blue-filled.svg
new file mode 100644
index 0000000000..1a195007cc
--- /dev/null
+++ b/services/web/public/img/check-circle-blue-filled.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="7.90039" cy="8" r="7" fill="#366CBF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8008 5.5166C14.1341 6.28324 14.3008 7.11114 14.3008 8L14.293 8.32715C14.2565 9.08412 14.0924 9.80296 13.8008 10.4834L13.6689 10.7705C13.3493 11.4303 12.9322 12.018 12.417 12.5332L12.1953 12.7441C11.6679 13.2229 11.0643 13.6088 10.3838 13.9004C9.61715 14.2337 8.78925 14.4004 7.90039 14.4004L7.57324 14.3926C6.81627 14.3561 6.09743 14.192 5.41699 13.9004C4.63921 13.5671 3.95608 13.111 3.36719 12.5332C2.78941 11.9443 2.33333 11.2612 2 10.4834C1.7084 9.80296 1.5443 9.08412 1.50781 8.32715L1.5 8C1.5 7.11115 1.66669 6.28324 2 5.5166C2.29164 4.83611 2.67749 4.23247 3.15625 3.70508L3.36719 3.4834C3.88242 2.96817 4.47005 2.55105 5.12988 2.23145L5.41699 2.09961C6.19475 1.7663 7.02265 1.59961 7.90039 1.59961L8.23047 1.60742C8.995 1.64384 9.71286 1.80791 10.3838 2.09961L10.6709 2.23145C11.3294 2.55104 11.9115 2.96821 12.417 3.4834C13.0059 4.06118 13.4674 4.73882 13.8008 5.5166ZM14.8564 10.5342C15.1535 9.72879 15.3008 8.88186 15.3008 8C15.3008 7.10999 15.1533 6.26057 14.8545 5.45898L14.7178 5.11816C14.3825 4.33724 13.9322 3.63797 13.3672 3.02637L13.1172 2.76953C12.4496 2.09262 11.6692 1.5633 10.7822 1.18262C9.88199 0.791261 8.91754 0.599609 7.90039 0.599609C7.01853 0.599609 6.1716 0.746894 5.36621 1.04395L5.02344 1.18066C4.24213 1.51551 3.53918 1.9653 2.91992 2.52832L2.66016 2.77637C1.99035 3.44618 1.46448 4.22955 1.08301 5.11816C0.691652 6.0184 0.5 6.98285 0.5 8C0.5 9.00792 0.692469 9.97013 1.08105 10.877L1.23047 11.2061C1.59508 11.9615 2.06987 12.6387 2.65332 13.2334L2.66699 13.2471C3.34667 13.9139 4.1347 14.4384 5.02344 14.8193L5.36621 14.9561C6.1716 15.2531 7.01853 15.4004 7.90039 15.4004C8.91754 15.4004 9.88199 15.2087 10.7822 14.8174L10.7812 14.8164C11.6701 14.4349 12.4541 13.9102 13.124 13.2402L13.3721 12.9805C13.9351 12.3612 14.3849 11.6583 14.7197 10.877L14.8564 10.5342Z" fill="#366CBF"/>
+<path d="M10.7559 6.56348C10.733 6.67379 10.6755 6.77461 10.584 6.86621L7.4668 9.9834L7.37207 10.0635C7.27429 10.1321 7.16726 10.1669 7.05078 10.167L6.93652 10.1553C6.86301 10.14 6.79371 10.1093 6.72852 10.0635L6.63379 9.9834L5.2168 8.56641C5.09485 8.44435 5.03428 8.30568 5.03418 8.15039C5.03418 7.98381 5.09471 7.83898 5.2168 7.7168C5.33902 7.59457 5.47823 7.5332 5.63379 7.5332C5.78932 7.53322 5.92858 7.59459 6.05078 7.7168L7.05078 8.7002L9.75 6.0166C9.8722 5.8944 10.0115 5.83302 10.167 5.83301C10.3225 5.83301 10.4618 5.89438 10.584 6.0166C10.7061 6.1388 10.7666 6.28357 10.7666 6.4502L10.7559 6.56348Z" fill="white"/>
+</svg>
diff --git a/services/web/public/img/check-circle-blue.svg b/services/web/public/img/check-circle-blue.svg
new file mode 100644
index 0000000000..456ba2bfa4
--- /dev/null
+++ b/services/web/public/img/check-circle-blue.svg
@@ -0,0 +1,7 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="path-1-outside-1_4820_1409" maskUnits="userSpaceOnUse" x="0" y="0" width="16" height="16" fill="black">
+<rect fill="white" width="16" height="16"/>
+<path d="M7.15 8.7L6.15 7.71667C6.02778 7.59444 5.88889 7.53333 5.73333 7.53333C5.57778 7.53333 5.43889 7.59444 5.31667 7.71667C5.19444 7.83889 5.13333 7.98333 5.13333 8.15C5.13333 8.30556 5.19444 8.44444 5.31667 8.56667L6.73333 9.98333C6.85556 10.1056 6.99444 10.1667 7.15 10.1667C7.30556 10.1667 7.44444 10.1056 7.56667 9.98333L10.6833 6.86667C10.8056 6.74444 10.8667 6.60555 10.8667 6.45C10.8667 6.28333 10.8056 6.13889 10.6833 6.01667C10.5611 5.89444 10.4222 5.83333 10.2667 5.83333C10.1111 5.83333 9.97222 5.89444 9.85 6.01667L7.15 8.7ZM8 14.4C7.12222 14.4 6.29444 14.2333 5.51667 13.9C4.73889 13.5667 4.05556 13.1111 3.46667 12.5333C2.88889 11.9444 2.43333 11.2611 2.1 10.4833C1.76667 9.70556 1.6 8.87778 1.6 8C1.6 7.11111 1.76667 6.28333 2.1 5.51667C2.43333 4.73889 2.88889 4.06111 3.46667 3.48333C4.05556 2.89444 4.73889 2.43333 5.51667 2.1C6.29444 1.76667 7.12222 1.6 8 1.6C8.88889 1.6 9.71667 1.76667 10.4833 2.1C11.2611 2.43333 11.9389 2.89444 12.5167 3.48333C13.1056 4.06111 13.5667 4.73889 13.9 5.51667C14.2333 6.28333 14.4 7.11111 14.4 8C14.4 8.87778 14.2333 9.70556 13.9 10.4833C13.5667 11.2611 13.1056 11.9444 12.5167 12.5333C11.9389 13.1111 11.2611 13.5667 10.4833 13.9C9.71667 14.2333 8.88889 14.4 8 14.4Z"/>
+</mask>
+<path d="M7.15 8.7L6.44886 9.41302L7.15373 10.1061L7.85491 9.40929L7.15 8.7ZM6.15 7.71667L5.44287 8.4238L5.44886 8.42969L6.15 7.71667ZM5.31667 8.56667L6.02377 7.85956H6.02377L5.31667 8.56667ZM6.73333 9.98333L6.02623 10.6904H6.02623L6.73333 9.98333ZM10.6833 6.86667L11.3904 7.57377L11.3904 7.57377L10.6833 6.86667ZM10.6833 6.01667L11.3904 5.30956L11.3904 5.30956L10.6833 6.01667ZM9.85 6.01667L10.5549 6.72596L10.5571 6.72377L9.85 6.01667ZM5.51667 13.9L5.12275 14.8191H5.12275L5.51667 13.9ZM3.46667 12.5333L2.75286 13.2337L2.75953 13.2405L2.76633 13.2471L3.46667 12.5333ZM2.1 10.4833L1.18086 10.8773H1.18086L2.1 10.4833ZM2.1 5.51667L3.01708 5.9154L3.01915 5.91059L2.1 5.51667ZM3.46667 3.48333L2.75956 2.77623H2.75956L3.46667 3.48333ZM5.51667 2.1L5.12275 1.18085L5.12275 1.18085L5.51667 2.1ZM10.4833 2.1L10.0846 3.01708L10.0894 3.01914L10.4833 2.1ZM12.5167 3.48333L11.8029 4.18367L11.8095 4.19047L11.8163 4.19714L12.5167 3.48333ZM13.9 5.51667L12.9808 5.91059L12.9829 5.91539L13.9 5.51667ZM13.9 10.4833L14.8191 10.8773L13.9 10.4833ZM12.5167 12.5333L13.2238 13.2404L12.5167 12.5333ZM10.4833 13.9L10.0894 12.9808L10.0846 12.9829L10.4833 13.9ZM7.15 8.7L7.85114 7.98698L6.85114 7.00364L6.15 7.71667L5.44886 8.42969L6.44886 9.41302L7.15 8.7ZM6.15 7.71667L6.85711 7.00956C6.57019 6.72264 6.18475 6.53333 5.73333 6.53333V7.53333V8.53333C5.67603 8.53333 5.61214 8.5212 5.55143 8.49448C5.49273 8.46865 5.45737 8.43825 5.44289 8.42377L6.15 7.71667ZM5.73333 7.53333V6.53333C5.28192 6.53333 4.89648 6.72264 4.60956 7.00956L5.31667 7.71667L6.02377 8.42377C6.0093 8.43825 5.97394 8.46865 5.91524 8.49448C5.85452 8.5212 5.79064 8.53333 5.73333 8.53333V7.53333ZM5.31667 7.71667L4.60956 7.00956C4.30757 7.31155 4.13333 7.70733 4.13333 8.15H5.13333H6.13333C6.13333 8.19202 6.12495 8.24765 6.10013 8.30631C6.07562 8.36425 6.04441 8.40314 6.02377 8.42377L5.31667 7.71667ZM5.13333 8.15H4.13333C4.13333 8.60141 4.32264 8.98685 4.60956 9.27377L5.31667 8.56667L6.02377 7.85956C6.03825 7.87404 6.06866 7.9094 6.09448 7.96809C6.1212 8.02881 6.13333 8.09269 6.13333 8.15H5.13333ZM5.31667 8.56667L4.60956 9.27377L6.02623 10.6904L6.73333 9.98333L7.44044 9.27623L6.02377 7.85956L5.31667 8.56667ZM6.73333 9.98333L6.02623 10.6904C6.31315 10.9774 6.69859 11.1667 7.15 11.1667V10.1667V9.16667C7.20731 9.16667 7.27119 9.1788 7.33191 9.20552C7.3906 9.23135 7.42596 9.26175 7.44044 9.27623L6.73333 9.98333ZM7.15 10.1667V11.1667C7.60141 11.1667 7.98685 10.9774 8.27377 10.6904L7.56667 9.98333L6.85956 9.27623C6.87404 9.26175 6.9094 9.23135 6.96809 9.20552C7.02881 9.1788 7.09269 9.16667 7.15 9.16667V10.1667ZM7.56667 9.98333L8.27377 10.6904L11.3904 7.57377L10.6833 6.86667L9.97623 6.15956L6.85956 9.27623L7.56667 9.98333ZM10.6833 6.86667L11.3904 7.57377C11.6774 7.28685 11.8667 6.90141 11.8667 6.45H10.8667H9.86667C9.86667 6.39269 9.8788 6.32881 9.90552 6.2681C9.93134 6.2094 9.96175 6.17404 9.97623 6.15956L10.6833 6.86667ZM10.8667 6.45H11.8667C11.8667 6.00733 11.6924 5.61155 11.3904 5.30956L10.6833 6.01667L9.97623 6.72377C9.95559 6.70313 9.92438 6.66425 9.89987 6.6063C9.87505 6.54764 9.86667 6.49202 9.86667 6.45H10.8667ZM10.6833 6.01667L11.3904 5.30956C11.1035 5.02264 10.7181 4.83333 10.2667 4.83333V5.83333V6.83333C10.2094 6.83333 10.1455 6.8212 10.0848 6.79448C10.0261 6.76865 9.9907 6.73825 9.97623 6.72377L10.6833 6.01667ZM10.2667 5.83333V4.83333C9.81525 4.83333 9.42981 5.02264 9.14289 5.30956L9.85 6.01667L10.5571 6.72377C10.5426 6.73825 10.5073 6.76865 10.4486 6.79448C10.3879 6.8212 10.324 6.83333 10.2667 6.83333V5.83333ZM9.85 6.01667L9.14509 5.30737L6.44509 7.99071L7.15 8.7L7.85491 9.40929L10.5549 6.72596L9.85 6.01667ZM8 14.4V13.4C7.25248 13.4 6.55923 13.2588 5.91059 12.9809L5.51667 13.9L5.12275 14.8191C6.02966 15.2078 6.99196 15.4 8 15.4V14.4ZM5.51667 13.9L5.91059 12.9809C5.24381 12.6951 4.66508 12.3082 4.16701 11.8195L3.46667 12.5333L2.76633 13.2471C3.44603 13.914 4.23397 14.4382 5.12275 14.8191L5.51667 13.9ZM3.46667 12.5333L4.18048 11.833C3.6918 11.3349 3.30491 10.7562 3.01915 10.0894L2.1 10.4833L1.18086 10.8773C1.56176 11.766 2.08598 12.554 2.75286 13.2337L3.46667 12.5333ZM2.1 10.4833L3.01915 10.0894C2.74116 9.44077 2.6 8.74752 2.6 8H1.6H0.6C0.6 9.00804 0.792177 9.97034 1.18086 10.8773L2.1 10.4833ZM1.6 8H2.6C2.6 7.23948 2.74185 6.5484 3.01707 5.91539L2.1 5.51667L1.18293 5.11794C0.791485 6.01826 0.6 6.98274 0.6 8H1.6ZM2.1 5.51667L3.01915 5.91059C3.30418 5.2455 3.68916 4.67505 4.17377 4.19044L3.46667 3.48333L2.75956 2.77623C2.08862 3.44717 1.56248 4.23228 1.18086 5.12275L2.1 5.51667ZM3.46667 3.48333L4.17377 4.19044C4.67124 3.69298 5.24782 3.30319 5.91059 3.01914L5.51667 2.1L5.12275 1.18085C4.22996 1.56348 3.43987 2.09591 2.75956 2.77623L3.46667 3.48333ZM5.51667 2.1L5.91059 3.01914C6.55923 2.74116 7.25248 2.6 8 2.6V1.6V0.599999C6.99196 0.599999 6.02966 0.792176 5.12275 1.18085L5.51667 2.1ZM8 1.6V2.6C8.76052 2.6 9.4516 2.74185 10.0846 3.01707L10.4833 2.1L10.8821 1.18293C9.98174 0.791485 9.01726 0.599999 8 0.599999V1.6ZM10.4833 2.1L10.0894 3.01914C10.7505 3.30245 11.3188 3.6903 11.8029 4.18367L12.5167 3.48333L13.2305 2.78299C12.559 2.09859 11.7718 1.56421 10.8773 1.18085L10.4833 2.1ZM12.5167 3.48333L11.8163 4.19714C12.3097 4.68121 12.6975 5.24954 12.9809 5.91059L13.9 5.51667L14.8191 5.12275C14.4358 4.22824 13.9014 3.44101 13.217 2.76952L12.5167 3.48333ZM13.9 5.51667L12.9829 5.91539C13.2582 6.5484 13.4 7.23948 13.4 8H14.4H15.4C15.4 6.98274 15.2085 6.01826 14.8171 5.11794L13.9 5.51667ZM14.4 8H13.4C13.4 8.74752 13.2588 9.44077 12.9809 10.0894L13.9 10.4833L14.8191 10.8773C15.2078 9.97034 15.4 9.00804 15.4 8H14.4ZM13.9 10.4833L12.9809 10.0894C12.6968 10.7522 12.307 11.3288 11.8096 11.8262L12.5167 12.5333L13.2238 13.2404C13.9041 12.5601 14.4365 11.77 14.8191 10.8773L13.9 10.4833ZM12.5167 12.5333L11.8096 11.8262C11.3249 12.3108 10.7545 12.6958 10.0894 12.9809L10.4833 13.9L10.8773 14.8191C11.7677 14.4375 12.5528 13.9114 13.2238 13.2404L12.5167 12.5333ZM10.4833 13.9L10.0846 12.9829C9.4516 13.2582 8.76052 13.4 8 13.4V14.4V15.4C9.01726 15.4 9.98174 15.2085 10.8821 14.8171L10.4833 13.9Z" fill="#3265B2" mask="url(#path-1-outside-1_4820_1409)"/>
+</svg>
diff --git a/services/web/public/img/feature-page/feat-accept-poster.jpg b/services/web/public/img/feature-page/feat-accept-poster.jpg
deleted file mode 100644
index bad07902f3..0000000000
Binary files a/services/web/public/img/feature-page/feat-accept-poster.jpg and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-accept.mp4 b/services/web/public/img/feature-page/feat-accept.mp4
deleted file mode 100644
index 88285975ff..0000000000
Binary files a/services/web/public/img/feature-page/feat-accept.mp4 and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-changes-poster.jpg b/services/web/public/img/feature-page/feat-changes-poster.jpg
deleted file mode 100644
index 1303abbad6..0000000000
Binary files a/services/web/public/img/feature-page/feat-changes-poster.jpg and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-changes.mp4 b/services/web/public/img/feature-page/feat-changes.mp4
deleted file mode 100644
index 8cced26501..0000000000
Binary files a/services/web/public/img/feature-page/feat-changes.mp4 and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-discuss-poster.jpg b/services/web/public/img/feature-page/feat-discuss-poster.jpg
deleted file mode 100644
index b632b395e4..0000000000
Binary files a/services/web/public/img/feature-page/feat-discuss-poster.jpg and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-discuss.mp4 b/services/web/public/img/feature-page/feat-discuss.mp4
deleted file mode 100644
index bdb5c952b6..0000000000
Binary files a/services/web/public/img/feature-page/feat-discuss.mp4 and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-todos-poster.jpg b/services/web/public/img/feature-page/feat-todos-poster.jpg
deleted file mode 100644
index f221dba570..0000000000
Binary files a/services/web/public/img/feature-page/feat-todos-poster.jpg and /dev/null differ
diff --git a/services/web/public/img/feature-page/feat-todos.mp4 b/services/web/public/img/feature-page/feat-todos.mp4
deleted file mode 100644
index 4e5d1bf452..0000000000
Binary files a/services/web/public/img/feature-page/feat-todos.mp4 and /dev/null differ
diff --git a/services/web/public/img/feature-page/intro-poster.jpg b/services/web/public/img/feature-page/intro-poster.jpg
deleted file mode 100644
index d228d6bd49..0000000000
Binary files a/services/web/public/img/feature-page/intro-poster.jpg and /dev/null differ
diff --git a/services/web/public/img/feature-page/intro.mp4 b/services/web/public/img/feature-page/intro.mp4
deleted file mode 100644
index e36e1c84bf..0000000000
Binary files a/services/web/public/img/feature-page/intro.mp4 and /dev/null differ
diff --git a/services/web/public/img/feature-page/pamela-marcum.jpg b/services/web/public/img/feature-page/pamela-marcum.jpg
deleted file mode 100644
index 66741607d1..0000000000
Binary files a/services/web/public/img/feature-page/pamela-marcum.jpg and /dev/null differ
diff --git a/services/web/public/img/sparkle-2-stars.svg b/services/web/public/img/sparkle-2-stars.svg
new file mode 100644
index 0000000000..5e4fc5e657
--- /dev/null
+++ b/services/web/public/img/sparkle-2-stars.svg
@@ -0,0 +1,16 @@
+<svg width="41" height="40" viewBox="0 0 41 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M30.2344 23.5171C20.275 21.2682 18.7323 19.7255 16.4837 9.76641C16.3807 9.31122 15.9756 8.987 15.5074 8.987C15.0392 8.987 14.6341 9.3112 14.531 9.76641C12.281 19.7259 10.7394 21.2686 0.780336 23.5171C0.324219 23.6212 0 24.0253 0 24.4935C0 24.9616 0.324203 25.3659 0.780336 25.4698C10.7398 27.7199 12.2813 29.2624 14.531 39.2205C14.6341 39.6757 15.0392 39.9999 15.5074 39.9999C15.9756 39.9999 16.3807 39.6757 16.4837 39.2205C18.7338 29.2622 20.2754 27.7196 30.2344 25.4698C30.6906 25.3657 31.0139 24.9616 31.0139 24.4935C31.0139 24.0253 30.6897 23.6211 30.2344 23.5171Z" fill="url(#paint0_linear_4820_1102)"/>
+<path d="M39.2371 8.01179C33.9428 6.81627 33.1993 6.07299 32.004 0.779476C31.8998 0.32336 31.4958 6.10352e-05 31.0276 6.10352e-05C30.5595 6.10352e-05 30.1552 0.323168 30.0513 0.779476C28.8558 6.07255 28.1125 6.81607 22.819 8.01179C22.3628 8.11589 22.0396 8.51996 22.0396 8.98812C22.0396 9.45629 22.3627 9.86054 22.819 9.96447C28.112 11.16 28.8556 11.9033 30.0513 17.1976C30.1554 17.6528 30.5595 17.977 31.0276 17.977C31.4958 17.977 31.9 17.6528 32.004 17.1976C33.1995 11.9033 33.9427 11.1598 39.2371 9.96447C39.6923 9.86036 40.0165 9.45629 40.0165 8.98812C40.0165 8.51996 39.6923 8.11571 39.2371 8.01179Z" fill="url(#paint1_linear_4820_1102)"/>
+<defs>
+<linearGradient id="paint0_linear_4820_1102" x1="31.0139" y1="8.987" x2="-5.13702" y2="25.3634" gradientUnits="userSpaceOnUse">
+<stop stop-color="#214475"/>
+<stop offset="0.295154" stop-color="#254C84"/>
+<stop offset="1" stop-color="#6597E0"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4820_1102" x1="40.0165" y1="6.2448e-05" x2="19.0617" y2="9.49231" gradientUnits="userSpaceOnUse">
+<stop stop-color="#214475"/>
+<stop offset="0.295154" stop-color="#254C84"/>
+<stop offset="1" stop-color="#6597E0"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/services/web/public/img/website-redesign/stickers/journal-grey.svg b/services/web/public/img/website-redesign/stickers/journal-grey.svg
new file mode 100644
index 0000000000..12dfc2de3c
--- /dev/null
+++ b/services/web/public/img/website-redesign/stickers/journal-grey.svg
@@ -0,0 +1,15 @@
+<svg width="45" height="52" viewBox="0 0 45 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_338_15540)">
+<path d="M10.0357 50.7791C6.67645 51.0559 3.71573 48.5417 3.43849 45.1768L0.644027 11.26L0.632987 11.126C0.284599 6.89757 3.44848 3.15923 7.68476 2.8102L32.716 0.747832C37.086 0.387775 40.9554 3.57662 41.4907 7.89458L41.7974 11.6168L44.1183 39.7865C44.4876 44.2681 41.1464 48.2159 36.6723 48.5845L10.0357 50.7791Z" fill="#DADBEB"/>
+<path d="M38.0814 11.9229L37.8017 8.52828C37.6005 6.08651 35.4604 4.26917 33.0227 4.47002L7.99145 6.53238C5.80642 6.71241 4.16993 8.64604 4.35025 10.8347L4.66797 14.6909L7.15576 44.8855C7.26371 46.1957 8.42225 47.1796 9.7303 47.0718L36.3817 44.8759C38.8046 44.6763 40.6196 42.5481 40.4184 40.1063L38.0962 11.9217L38.0814 11.9229ZM37.4443 40.3364C37.5094 41.1255 36.9229 41.8184 36.1351 41.8833L10.0783 44.0301L7.88492 17.4089L35.3687 15.1444L37.4443 40.3364Z" fill="black"/>
+<path d="M12.733 21.7612C15.5039 21.6079 18.2476 21.3069 21.0111 21.0642C21.7841 21.0005 22.4708 20.2544 22.3749 19.4528C22.2789 18.6513 21.597 18.0029 20.7658 18.0864C18.0035 18.344 15.2585 18.6301 12.4877 18.7835C11.7135 18.8322 11.0292 19.6081 11.1239 20.3948C11.2187 21.1815 11.8994 21.8149 12.733 21.7612Z" fill="black"/>
+<path d="M13.2495 28.0293C19.06 27.7155 24.857 27.2379 30.6381 26.5667C32.5358 26.3504 32.3053 23.3714 30.3927 23.5889C24.6117 24.2601 18.8159 24.7526 13.0041 25.0516C11.0818 25.15 11.3271 28.1278 13.2495 28.0293Z" fill="black"/>
+<path d="M13.7733 34.387C19.5838 34.0732 25.3808 33.5955 31.1619 32.9244C33.0596 32.708 32.8291 29.729 30.9165 29.9466C25.1355 30.6178 19.3397 31.1103 13.5279 31.4092C11.6056 31.5077 11.8509 34.4854 13.7733 34.387Z" fill="black"/>
+<path d="M14.2971 40.7444C20.1076 40.4306 25.9046 39.953 31.6857 39.2818C33.5834 39.0655 33.3529 36.0865 31.4404 36.304C25.6593 36.9752 19.8635 37.4677 14.0518 37.7667C12.1294 37.8651 12.3747 40.8429 14.2971 40.7444Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_338_15540">
+<rect width="41" height="48" fill="white" transform="translate(0 3.44336) rotate(-4.71006)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/services/web/public/img/website-redesign/stickers/pen-yellow.svg b/services/web/public/img/website-redesign/stickers/pen-yellow.svg
new file mode 100644
index 0000000000..ecd90f914c
--- /dev/null
+++ b/services/web/public/img/website-redesign/stickers/pen-yellow.svg
@@ -0,0 +1,4 @@
+<svg width="52" height="53" viewBox="0 0 52 53" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.9381 49.0574C22.4605 48.9282 21.1115 48.2169 20.2335 47.0839C19.6757 46.3695 19.2102 45.6632 18.8141 45.0498C18.773 44.9884 18.7318 44.9269 18.6907 44.8654C16.3038 46.798 13.987 47.0438 12.448 46.9092C11.6015 46.8351 10.7663 46.6318 9.95902 46.2863C9.70491 46.1772 9.45206 46.0538 9.18382 45.9291C8.65079 46.1718 8.11777 46.4146 7.60014 46.6587C6.75961 47.0481 5.81605 47.1971 4.87721 47.1149C3.07647 46.9574 1.50502 45.9518 0.691798 44.4338C-0.573109 42.0515 0.455221 39.1609 2.99094 38.0082C3.07166 37.9719 3.15238 37.9355 3.23311 37.8992C3.09018 36.8739 3.11781 35.849 3.32887 34.8547C4.0208 31.7321 6.49368 29.1704 9.7914 28.1712C10.9872 27.7984 12.2244 27.6606 13.4249 27.7657C15.4257 27.9407 17.3034 28.814 18.732 30.2122C19.8586 31.3381 20.5742 32.7318 20.8013 34.213C20.8475 34.217 20.8924 34.2354 20.9219 34.2525L33.8927 11.4994C34.5344 10.3691 35.5395 9.51656 36.7453 9.02884C38.0881 6.976 40.5302 5.8296 43.1005 6.05447C44.0086 6.13391 44.8861 6.38432 45.7038 6.78863C48.8677 8.38209 50.1785 12.0127 48.722 15.0105C48.7648 15.2313 48.8075 15.452 48.8194 15.6701C49.5199 16.5272 50.1412 17.5799 50.351 18.7268C50.7085 20.6679 50.1133 22.6849 48.7284 24.1553C47.7802 25.2443 47.2022 26.1776 46.9192 27.1078C46.7905 27.5161 46.7041 27.9716 46.6385 28.5446C46.3021 31.1485 43.8625 32.9751 41.1075 32.7341C40.8151 32.7085 40.5406 32.6555 40.2673 32.5882L34.1418 43.3958L33.8042 43.8872L33.2385 44.5032L32.6738 44.9313L27.5527 48.1583C27.0941 48.4365 26.6431 48.6285 26.1971 48.7631C25.5089 49.0068 24.7409 49.0987 23.956 49.0301L23.9381 49.0574Z" fill="#F9D38F"/>
+<path d="M24.2531 45.2795C23.9452 45.2526 23.6641 45.0978 23.4675 44.8636C23.0202 44.3036 22.6229 43.7045 22.255 43.1225C21.7073 42.2933 21.2276 41.5713 20.661 40.9574C19.9517 40.2009 19.3945 39.8338 18.8866 39.7894C18.8097 39.7826 18.7173 39.7746 18.6378 39.7966C18.1365 39.854 17.4876 40.5351 16.959 41.0821C16.6518 41.4025 16.3971 41.6551 16.1449 41.879C15.0386 42.8239 13.8994 43.2596 12.7451 43.1586C12.3449 43.1236 11.9356 43.0155 11.5468 42.8512C10.8281 42.5569 10.1245 42.0902 9.49379 41.4996C8.24587 42.1139 6.98508 42.6981 5.74094 43.2693C5.56285 43.355 5.359 43.3806 5.17431 43.3644C4.78953 43.3307 4.46727 43.1144 4.29356 42.7954C4.0272 42.2946 4.25178 41.6777 4.7848 41.4349C5.89954 40.9248 7.03092 40.4016 8.14816 39.8627C7.30448 38.5156 7.00167 37.0133 7.2878 35.6928C7.69485 33.8764 9.14377 32.3827 11.0714 31.7989C11.7571 31.584 12.4302 31.5127 13.0766 31.5692C14.1078 31.6595 15.0319 32.0875 15.7886 32.8338C16.4887 33.5172 16.8546 34.4752 16.7767 35.3655C16.6976 36.2701 16.1527 37.0037 15.6727 37.526C14.9688 38.3036 14.144 38.8681 13.4049 39.3387C12.7811 39.7327 12.1432 40.1109 11.4924 40.4591C11.798 40.6884 12.1087 40.8603 12.4077 40.9877C12.5873 41.0613 12.7387 41.1035 12.8927 41.117C13.4159 41.1628 13.9964 40.9097 14.6494 40.3591C14.8338 40.2016 15.0386 39.9881 15.26 39.7615C16.1137 38.8668 17.0174 37.933 18.3033 37.7706C18.5546 37.7347 18.8021 37.7419 19.0483 37.7634C20.4951 37.89 21.5857 38.897 22.2808 39.6378C22.6495 40.0318 22.9696 40.4504 23.273 40.8821L23.3019 38.425C23.3028 38.2369 23.3499 38.053 23.442 37.8874L37.438 13.3431C37.8048 12.6951 38.5505 12.3263 39.3354 12.395C39.3662 12.3977 39.3816 12.399 39.4124 12.4017L40.1103 11.1606C40.6229 10.265 41.644 9.76107 42.7368 9.85668C43.1062 9.88899 43.4539 9.99176 43.7812 10.1506C45.0879 10.8147 45.6049 12.3503 44.9249 13.564L44.2257 14.8195C44.4248 15.025 44.5599 15.2539 44.6604 15.5231C44.8216 15.9857 44.7776 16.4883 44.5373 16.9303L44.5348 16.959C45.2795 17.4871 46.2061 18.5955 46.3422 19.3453C46.5002 20.1983 46.2376 21.0724 45.6245 21.6988C44.282 23.2163 43.4472 24.6046 43.0087 26.071C42.8315 26.6776 42.6981 27.3171 42.5982 28.1041C42.5197 28.647 42.0202 29.0374 41.4354 28.9862C40.8044 28.931 40.3841 28.4168 40.4485 27.8582C40.5597 26.9419 40.7186 26.1889 40.9187 25.4975C41.2246 24.4825 41.8449 23.5963 42.4998 22.6697C42.9782 21.9881 43.4898 21.2805 43.9192 20.45C44.0674 20.1736 44.2025 19.6934 44.1548 19.5301C44.0825 19.2923 43.7844 18.9768 43.5096 18.7502L30.6195 41.467L30.53 41.6038L30.3764 41.764L30.2266 41.8811L25.2528 45.0198C25.1055 45.1082 24.9453 45.1665 24.8031 45.1974C24.689 45.2598 24.4993 45.3011 24.2838 45.2822L24.2531 45.2795ZM25.4303 42.4598L26.7112 41.6459C26.2774 41.4633 25.8461 41.2519 25.434 40.9988L25.4149 42.4585L25.4303 42.4598ZM12.8841 33.5925C12.5455 33.5629 12.1698 33.6023 11.7712 33.7266C10.5601 34.0981 9.65767 35.0175 9.40578 36.124C9.22267 36.9761 9.44632 37.9651 10.0315 38.8989C10.7643 38.5 11.4829 38.0854 12.1567 37.6524C12.7971 37.2455 13.458 36.7824 13.9891 36.2067C14.263 35.9124 14.5765 35.5202 14.6054 35.19C14.6343 34.8597 14.481 34.4846 14.2099 34.2149C13.8245 33.8339 13.392 33.6369 12.8687 33.5911L12.8841 33.5925ZM25.9834 38.4425C26.713 39.143 27.6629 39.6312 28.7019 39.8089L37.2663 24.7005L34.5927 23.3525L25.9988 38.4439L25.9834 38.4425ZM38.2749 22.9222L42.07 16.2369L39.4284 14.8773L35.6166 21.5756L38.2902 22.9236L38.2749 22.9222ZM42.1055 13.8816L42.9517 12.3641C43.0437 12.1985 42.9843 11.9908 42.7893 11.9158L42.6379 11.8736C42.4994 11.8615 42.37 11.9225 42.2983 12.032L41.4368 13.5482L42.0901 13.8803L42.1055 13.8816Z" fill="black"/>
+</svg>
diff --git a/services/web/public/img/website-redesign/stickers/rocket-yellow.svg b/services/web/public/img/website-redesign/stickers/rocket-yellow.svg
index e544a00f33..db00ebda6f 100644
--- a/services/web/public/img/website-redesign/stickers/rocket-yellow.svg
+++ b/services/web/public/img/website-redesign/stickers/rocket-yellow.svg
@@ -1,6 +1,6 @@
-<svg width="38" height="37" viewBox="0 0 38 37" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M37.0291 5.62639C37.0496 4.31206 36.5568 3.07987 35.6326 2.16601C34.7598 1.29321 33.5277 0.790068 32.1723 0.769531C29.4101 0.820872 22.4893 1.56018 15.7021 7.05366C14.7163 6.72508 13.5458 6.42731 12.4265 6.42731C12.1595 6.42731 11.9028 6.44784 11.6461 6.47865C9.05855 6.80723 6.21426 9.20999 2.46637 12.9784C1.46009 13.995 1.04936 15.4325 1.38821 16.8187C1.72706 18.2152 2.74361 19.3139 4.10928 19.7554L5.8138 20.2996C5.5879 21.08 5.56737 21.8912 5.74193 22.6716C5.30039 22.9694 4.92047 23.3596 4.64323 23.8319C2.59986 27.395 2.53825 31.3277 2.53825 31.7589C2.53825 33.6791 4.09901 35.2501 6.02943 35.2501C6.47097 35.2501 10.3934 35.1885 13.9667 33.1451C14.4494 32.8679 14.8293 32.4777 15.1168 32.0464C15.4556 32.1286 15.8048 32.1697 16.1539 32.1697C16.6057 32.1697 17.0575 32.1081 17.4887 31.9746L18.033 33.6688C18.4745 35.0345 19.5629 36.0613 20.9697 36.4002C21.288 36.472 21.6063 36.5131 21.9349 36.5131C23.0233 36.5131 24.0398 36.0921 24.81 35.322C28.5784 31.5741 30.9709 28.7298 31.2995 26.1422C31.4843 24.7458 31.1352 23.3082 30.7244 22.0863C36.2179 15.299 36.9572 8.38853 37.0086 5.61612L37.0291 5.62639Z" fill="#F9D38F"/>
-<path d="M11.769 29.3148C10.0748 30.2903 8.16489 30.6394 7.03539 30.7626C7.1586 29.6331 7.50772 27.7232 8.4832 26.029C8.73991 25.5874 8.58588 25.0227 8.14435 24.766C7.70282 24.5093 7.13807 24.6633 6.88136 25.1048C5.13577 28.1442 5.11523 31.6149 5.11523 31.7586C5.11523 32.272 5.52596 32.6828 6.03937 32.6828C6.18313 32.6828 9.65378 32.6622 12.6932 30.9166C13.1347 30.6599 13.2887 30.0952 13.032 29.6536C12.7753 29.2121 12.2106 29.0581 11.769 29.3148Z" fill="black"/>
-<path d="M34.4616 5.5744C34.4718 4.96858 34.2459 4.40383 33.8147 3.97257C33.3834 3.55157 32.7776 3.33594 32.2128 3.33594C29.656 3.38728 22.7558 4.11632 16.2253 9.97946C15.0649 9.52766 13.3091 8.84996 11.9742 9.02452C10.013 9.27095 7.11736 11.9407 4.28334 14.785C3.90342 15.1649 3.75966 15.6988 3.88288 16.2123C4.0061 16.7359 4.38602 17.1364 4.89943 17.3007L9.40717 18.7485C9.06832 19.3646 8.72947 20.0012 8.41115 20.6686C8.00043 21.5106 8.17499 22.5272 8.84242 23.1844L14.6029 28.9448C15.0239 29.3658 15.5886 29.5917 16.1636 29.5917C16.482 29.5917 16.8105 29.5198 17.1186 29.3761C17.786 29.0475 18.4226 28.7189 19.0387 28.3801L20.4865 32.8878C20.6508 33.4012 21.0616 33.7811 21.575 33.9043C21.6982 33.9352 21.8214 33.9454 21.9344 33.9454C22.3348 33.9454 22.7147 33.7914 23.0023 33.5039C25.8465 30.6699 28.5163 27.7742 28.7627 25.813C28.9373 24.4679 28.2596 22.7223 27.8078 21.562C33.6709 15.0314 34.4 8.13118 34.4513 5.56414L34.4616 5.5744ZM5.97759 15.7091C7.48702 14.21 10.7523 11.0474 12.2104 10.8523C12.8676 10.7701 13.8841 11.0782 14.7466 11.3862C13.2167 12.9675 11.738 14.8569 10.3518 17.1056L5.96733 15.6988L5.97759 15.7091ZM16.3177 27.7229C16.1842 27.7845 16.0199 27.7537 15.9172 27.651L10.1567 21.8906C10.0541 21.7879 10.0233 21.6236 10.0849 21.4901C17.2521 6.61149 28.8654 5.24582 32.2539 5.18421C32.3771 5.18421 32.4593 5.23555 32.5003 5.28689C32.5414 5.32797 32.603 5.41011 32.603 5.5436C32.5414 8.9321 31.1757 20.5454 16.3074 27.7229H16.3177ZM26.935 25.5871C26.7501 27.0452 23.5773 30.3207 22.0781 31.8199L20.6714 27.4354C22.9201 26.0492 24.8095 24.5706 26.3908 23.0406C26.7091 23.9031 27.0171 24.9299 26.9247 25.5871H26.935Z" fill="black"/>
-<path d="M27.4999 15.7808C29.0094 14.2713 29.0094 11.807 27.4999 10.2976C26.0316 8.8292 23.4748 8.8292 22.0167 10.2976C21.2877 11.0266 20.877 12.0021 20.877 13.0392C20.877 14.0762 21.2774 15.0517 22.0167 15.7808C22.7458 16.5098 23.7212 16.9205 24.7583 16.9205C25.7954 16.9205 26.7709 16.5201 27.4999 15.7808ZM26.1959 14.4767C25.4258 15.2468 24.0909 15.2468 23.3208 14.4767C22.9409 14.0968 22.7252 13.5834 22.7252 13.0392C22.7252 12.4949 22.9409 11.9918 23.3208 11.6016C23.7007 11.2217 24.2141 11.0061 24.7583 11.0061C25.3025 11.0061 25.8057 11.2217 26.1959 11.6016C26.9865 12.3923 26.9865 13.6758 26.1959 14.4767Z" fill="black"/>
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M47.5406 6.75684C47.5672 5.05176 46.9278 3.45326 45.729 2.2677C44.5967 1.13542 42.9982 0.482696 41.2398 0.456055C37.6565 0.522659 28.6782 1.48176 19.8731 8.60844C18.5943 8.18217 17.0757 7.79587 15.6237 7.79587C15.2774 7.79587 14.9444 7.82251 14.6113 7.86247C11.2545 8.28874 7.56459 11.4058 2.70247 16.2946C1.39702 17.6134 0.864185 19.4783 1.30377 21.2766C1.74336 23.0883 3.06213 24.5136 4.83381 25.0864L7.04508 25.7924C6.75202 26.8048 6.72538 27.8571 6.95183 28.8695C6.37903 29.2558 5.88616 29.762 5.5265 30.3748C2.87564 34.9971 2.79571 40.099 2.79571 40.6585C2.79571 43.1495 4.82049 45.1876 7.32482 45.1876C7.89762 45.1876 12.9862 45.1077 17.6219 42.4568C18.248 42.0972 18.7408 41.591 19.1138 41.0315C19.5534 41.1381 20.0063 41.1913 20.4592 41.1913C21.0453 41.1913 21.6315 41.1114 22.1909 40.9383L22.8969 43.1362C23.4697 44.9079 24.8818 46.24 26.7067 46.6796C27.1197 46.7728 27.5326 46.8261 27.9589 46.8261C29.3709 46.8261 30.6897 46.2799 31.6887 45.2809C36.5775 40.4187 39.6813 36.7288 40.1075 33.372C40.3473 31.5603 39.8944 29.6954 39.3616 28.1102C46.4882 19.3051 47.4473 10.3402 47.514 6.74352L47.5406 6.75684Z" fill="#F9D38F"/>
+<path d="M14.7706 38.0303C12.5727 39.2958 10.095 39.7487 8.62968 39.9085C8.78953 38.4432 9.24244 35.9656 10.5079 33.7676C10.841 33.1948 10.6411 32.4622 10.0683 32.1291C9.49554 31.7961 8.76289 31.9959 8.42987 32.5687C6.16531 36.5117 6.13867 41.0142 6.13867 41.2007C6.13867 41.8667 6.67151 42.3995 7.33755 42.3995C7.52405 42.3995 12.0265 42.3729 15.9695 40.1084C16.5423 39.7753 16.7421 39.0427 16.4091 38.4699C16.0761 37.8971 15.3434 37.6973 14.7706 38.0303Z" fill="black"/>
+<path d="M44.2098 6.69009C44.2231 5.90415 43.9301 5.17151 43.3706 4.61203C42.8111 4.06587 42.0252 3.78613 41.2925 3.78613C37.9756 3.85274 29.024 4.79852 20.5519 12.4048C19.0467 11.8186 16.7688 10.9395 15.0371 11.1659C12.4928 11.4856 8.73629 14.949 5.05972 18.6389C4.56685 19.1318 4.38036 19.8245 4.54021 20.4905C4.70006 21.1699 5.19293 21.6894 5.85898 21.9025L11.7068 23.7808C11.2673 24.58 10.8277 25.4059 10.4147 26.2718C9.88189 27.3641 10.1083 28.6829 10.9742 29.5354L18.4472 37.0084C18.9934 37.5546 19.726 37.8477 20.472 37.8477C20.8849 37.8477 21.3112 37.7544 21.7108 37.5679C22.5767 37.1416 23.4026 36.7154 24.2018 36.2758L26.0801 42.1237C26.2932 42.7897 26.8261 43.2826 27.4921 43.4424C27.652 43.4824 27.8118 43.4957 27.9583 43.4957C28.4779 43.4957 28.9707 43.2959 29.3437 42.9229C33.0336 39.2463 36.497 35.4899 36.8167 32.9456C37.0432 31.2005 36.164 28.936 35.5779 27.4307C43.1841 18.9586 44.1299 10.007 44.1965 6.67677L44.2098 6.69009ZM7.25767 19.8378C9.21584 17.893 13.4519 13.7901 15.3435 13.537C16.196 13.4305 17.5148 13.8301 18.6337 14.2297C16.6489 16.2811 14.7307 18.7322 12.9324 21.6495L7.24435 19.8245L7.25767 19.8378ZM20.6718 35.4233C20.4986 35.5032 20.2855 35.4632 20.1523 35.33L12.6793 27.857C12.5461 27.7238 12.5061 27.5106 12.586 27.3375C21.884 8.0355 36.9499 6.26382 41.3458 6.18389C41.5057 6.18389 41.6123 6.2505 41.6655 6.3171C41.7188 6.37039 41.7987 6.47695 41.7987 6.65012C41.7188 11.046 39.9471 26.1119 20.6585 35.4233H20.6718ZM34.4456 32.6525C34.2058 34.5441 30.0897 38.7934 28.1448 40.7383L26.3199 35.0503C29.2371 33.2519 31.6882 31.3337 33.7396 29.3489C34.1526 30.4679 34.5522 31.8 34.4323 32.6525H34.4456Z" fill="black"/>
+<path d="M35.1799 20.4727C37.138 18.5145 37.138 15.3175 35.1799 13.3593C33.275 11.4544 29.9581 11.4544 28.0665 13.3593C27.1207 14.3051 26.5879 15.5706 26.5879 16.916C26.5879 18.2614 27.1074 19.5269 28.0665 20.4727C29.0123 21.4185 30.2778 21.9513 31.6232 21.9513C32.9686 21.9513 34.2341 21.4318 35.1799 20.4727ZM33.4881 18.7809C32.489 19.78 30.7573 19.78 29.7583 18.7809C29.2654 18.2881 28.9857 17.622 28.9857 16.916C28.9857 16.21 29.2654 15.5573 29.7583 15.0511C30.2511 14.5582 30.9172 14.2785 31.6232 14.2785C32.3292 14.2785 32.9819 14.5582 33.4881 15.0511C34.5138 16.0768 34.5138 17.7419 33.4881 18.7809Z" fill="black"/>
 </svg>
diff --git a/services/web/public/img/website-redesign/stickers/support-green.svg b/services/web/public/img/website-redesign/stickers/support-green.svg
new file mode 100644
index 0000000000..29c97bded6
--- /dev/null
+++ b/services/web/public/img/website-redesign/stickers/support-green.svg
@@ -0,0 +1,4 @@
+<svg width="47" height="48" viewBox="0 0 47 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.1929 48C19.3463 48 16.0977 47.2641 12.9137 45.6613C12.2025 45.8576 11.4429 45.9557 10.6994 45.9557C8.38824 45.9557 6.20633 45.0399 4.57393 43.4044C2.3597 41.1802 1.56774 37.9094 2.32737 34.9656C0.775791 31.7274 0 28.0641 0 24.0082C0 19.9523 0.791953 16.2399 2.34354 13.0017C1.71321 10.2378 2.61829 7.21227 4.89718 4.92266C6.67503 3.14003 8.88927 2.15877 11.1358 2.15877C11.7338 2.15877 12.348 2.22419 12.9298 2.37138C16.1785 0.850426 20.2514 0 24.4213 0C28.5911 0 31.371 0.86678 34.1186 2.32232C34.8298 2.14242 35.5571 2.04429 36.3005 2.04429C38.6118 2.04429 40.7937 2.96014 42.4261 4.59557C44.6403 6.81976 45.4323 10.0906 44.6726 13.0344C46.2242 16.2726 47 19.9359 47 23.9918C47 28.0477 46.2242 31.7274 44.6726 34.9492C45.4323 37.893 44.6403 41.1639 42.4261 43.3881C40.7937 45.0399 38.6118 45.9394 36.3005 45.9394C35.5409 45.9394 34.7813 45.8412 34.054 45.645C30.8539 47.1986 27.2012 47.9836 23.1929 47.9836V48Z" fill="#80CBA2"/>
+<path d="M42.7592 23.7416C42.7592 19.6184 41.847 16.0044 40.0387 12.9819C41.1589 11.1749 40.9509 8.74367 39.3986 7.15024C37.8303 5.54038 35.4459 5.37611 33.7016 6.50958C30.7411 4.66974 28.4367 3.7334 24.404 3.7334C20.3714 3.7334 16.2267 4.66974 13.2661 6.50958C11.5379 5.37611 9.4575 5.86892 7.88923 7.47878C6.32097 9.08863 5.84088 11.2077 6.94507 12.9819C5.13676 16.0044 4.22461 19.6184 4.22461 23.7416C4.22461 27.8648 5.13676 31.4788 6.94507 34.5014C5.82488 36.3083 6.03292 38.7396 7.58518 40.3166C9.15345 41.9264 11.5379 42.0907 13.2822 40.9572C16.2427 42.7971 19.1551 43.7334 23.1878 43.7334C27.2205 43.7334 30.7571 42.7971 33.7176 40.9572C35.4459 42.0907 37.8303 41.9264 39.4146 40.3166C40.9829 38.7067 41.1589 36.2755 40.0547 34.4849C41.863 31.4623 42.7752 27.8484 42.7752 23.7252L42.7592 23.7416ZM33.2535 27.4213C33.6536 26.2714 33.8777 25.0394 33.8777 23.7416C33.8777 22.4439 33.6536 21.2118 33.2535 20.0619L37.8463 15.3802C39.0785 17.7457 39.6866 20.5548 39.6866 23.7416C39.6866 26.9285 39.0625 29.7375 37.8463 32.103L33.2535 27.4213ZM23.1718 31.5609C18.9471 31.5609 16.7547 28.0619 16.7547 23.7416C16.7547 19.4213 18.9631 16.5465 23.1718 16.5465C27.3805 16.5465 29.5889 19.4213 29.5889 23.7416C29.5889 28.0619 27.3805 31.5609 23.1718 31.5609ZM9.12144 32.103C7.88923 29.7375 7.28113 26.9285 7.28113 23.7416C7.28113 20.5548 7.90524 17.7457 9.12144 15.3802L13.7142 20.0619C13.3142 21.2118 13.0901 22.4439 13.0901 23.7416C13.0901 25.0394 13.3142 26.2714 13.7142 27.4213L9.12144 32.103ZM37.2382 9.36789C37.8303 9.9757 37.8303 10.9613 37.2382 11.5856L31.7493 17.1872C31.1412 16.3494 30.4051 15.6102 29.5889 14.9695L35.0779 9.36789C35.67 8.76009 36.6461 8.76009 37.2382 9.36789ZM31.3652 8.74367L26.7724 13.4254C25.6523 13.0147 24.436 12.7847 23.1718 12.7847C21.9076 12.7847 21.3155 13.0147 20.1953 13.4254L15.6025 8.74367C17.9229 7.49521 21.2835 6.85455 24.404 6.85455C27.5246 6.85455 29.0448 7.49521 31.3652 8.74367ZM10.0496 9.69644C10.6417 9.08863 11.2978 8.76009 11.8899 9.36789L17.3788 14.9695C16.5627 15.5938 15.8266 16.3494 15.2185 17.1872L9.72955 11.5856C9.13745 10.9778 9.4415 10.3042 10.0496 9.69644ZM9.72955 38.1153C9.13745 37.5075 9.13745 36.5219 9.72955 35.8977L15.2185 30.296C15.8266 31.1338 16.5627 31.873 17.3788 32.5137L11.8899 38.1153C11.2978 38.7231 10.3216 38.7231 9.72955 38.1153ZM15.6025 38.7396L20.1953 34.0578C21.3155 34.4685 21.9236 34.6985 23.1718 34.6985C24.42 34.6985 25.6363 34.4685 26.7724 34.0578L31.3652 38.7396C29.0448 39.988 26.3084 40.6287 23.1878 40.6287C20.0673 40.6287 17.9389 39.988 15.6185 38.7396H15.6025ZM37.2382 38.1153C36.6461 38.7231 35.67 38.7231 35.0779 38.1153L29.5889 32.5137C30.4051 31.8895 31.1412 31.1338 31.7493 30.296L37.2382 35.8977C37.8303 36.5055 37.8303 37.4911 37.2382 38.1153Z" fill="black"/>
+</svg>
diff --git a/services/web/scripts/add_salesforce_data_to_subscriptions.mjs b/services/web/scripts/add_salesforce_data_to_subscriptions.mjs
index 02ef02689f..264640f587 100755
--- a/services/web/scripts/add_salesforce_data_to_subscriptions.mjs
+++ b/services/web/scripts/add_salesforce_data_to_subscriptions.mjs
@@ -4,6 +4,7 @@ import { parse } from 'csv'
 import Stream from 'node:stream/promises'
 import { ObjectId } from '../app/src/infrastructure/mongodb.js'
 import { Subscription } from '../app/src/models/Subscription.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 function usage() {
   console.log(
@@ -76,20 +77,22 @@ const stats = {
   },
 }
 
-function showStats() {
-  console.log('Stats:')
-  console.log(`  Total rows: ${stats.totalRows}`)
-  console.log(`  Processed rows: ${stats.processedRows}`)
-  console.log(`  Skipped (no subscription ID): ${stats.subscriptionIDMissing}`)
-  console.log(`  Used V1 ID: ${stats.usedV1ID}`)
-  console.log(`  Used Salesforce ID: ${stats.usedSalesforceID}`)
-  if (commit) {
-    console.log('Database operations:')
-    console.log(`  Errors: ${stats.db.errors}`)
-    console.log(`  Matched: ${stats.db.matched}`)
-    console.log(`  Updated: ${stats.db.updated}`)
-    console.log(`  Update attempted: ${stats.db.updateAttempted}`)
-  }
+function generateStats() {
+  return `Stats:
+  Total rows: ${stats.totalRows}
+  Processed rows: ${stats.processedRows}
+  Skipped (no subscription ID): ${stats.subscriptionIDMissing}
+  Used V1 ID: ${stats.usedV1ID}
+  Used Salesforce ID: ${stats.usedSalesforceID}${
+    commit
+      ? `
+Database operations:
+  Errors: ${stats.db.errors}
+  Matched: ${stats.db.matched}
+  Updated: ${stats.db.updated}
+  Update attempted: ${stats.db.updateAttempted}`
+      : ''
+  }`
 }
 
 function pickRelevantColumns(row) {
@@ -161,7 +164,7 @@ async function processRows(rows) {
   }
 }
 
-async function main() {
+async function main(trackProgress) {
   await Stream.pipeline(
     fs.createReadStream(filename),
     parse({
@@ -191,6 +194,7 @@ async function main() {
     }),
     processRows
   )
+  await trackProgress(generateStats())
 }
 
 if (!commit) {
@@ -199,6 +203,5 @@ if (!commit) {
   console.log('Committing changes to the database')
 }
 
-await main()
-showStats()
+await scriptRunner(main)
 process.exit()
diff --git a/services/web/scripts/add_subscription_members_csv.mjs b/services/web/scripts/add_subscription_members_csv.mjs
new file mode 100644
index 0000000000..4120e16fdb
--- /dev/null
+++ b/services/web/scripts/add_subscription_members_csv.mjs
@@ -0,0 +1,202 @@
+import fs from 'node:fs'
+import minimist from 'minimist'
+import { parse } from 'csv'
+import Stream from 'node:stream/promises'
+import SubscriptionGroupHandler from '../app/src/Features/Subscription/SubscriptionGroupHandler.js'
+import { Subscription } from '../app/src/models/Subscription.js'
+import { InvalidEmailError } from '../app/src/Features/Errors/Errors.js'
+
+function usage() {
+  console.log(
+    'Usage: node scripts/add_subscription_members_csv.mjs -f <filename> -i <inviter_id> -s <subscription_id> [options]'
+  )
+  console.log('Required arguments:')
+  console.log(
+    '  -s, --subscriptionId <id>        The ID of the subscription to update'
+  )
+  console.log(
+    '  -i, --inviterId <id>             The ID of the user sending the invites'
+  )
+  console.log(
+    '  -f, --filename <filename>        The path to the file to read data from'
+  )
+  console.log('Options:')
+  console.log(
+    '  --commit, -c                     Whether changes should be committed to the DB invites should be sent/revoked'
+  )
+  console.log(
+    '  --removeMembersNotIncluded -r    Remove members that are not in the CSV. Disabled when managed users are enabled for the subscription'
+  )
+  console.log(
+    '  --verbose, -v                    Prints detailed information about the affected group members'
+  )
+  console.log('  -h, --help                       Show this help message')
+  process.exit(0)
+}
+
+let {
+  commit,
+  removeMembersNotIncluded,
+  inviterId,
+  subscriptionId,
+  filename,
+  help,
+  verbose,
+} = minimist(process.argv.slice(2), {
+  string: ['filename', 'subscriptionId', 'inviterId'],
+  boolean: ['commit', 'removeMembersNotIncluded', 'help', 'verbose'],
+  alias: {
+    commit: 'c',
+    removeMembersNotIncluded: 'r',
+    filename: 'f',
+    help: 'h',
+    inviterId: 'i',
+    subscriptionId: 's',
+    verbose: 'v',
+  },
+  default: {
+    commit: false,
+    removeMembersNotIncluded: false,
+    help: false,
+    verbose: false,
+  },
+})
+
+const EMAIL_FIELD = 'email'
+
+if (help) {
+  usage()
+  process.exit(0)
+}
+
+if (!subscriptionId || !inviterId || !filename) {
+  usage()
+  process.exit(1)
+}
+
+async function processRows(rows) {
+  const emailList = []
+  for await (const row of rows) {
+    const email = row[EMAIL_FIELD]
+    if (email) {
+      emailList.push(email)
+    }
+  }
+  if (emailList.length === 0) {
+    console.error(`CSV error: 'email' column doesn't exist or it's empty'`)
+    process.exit(1)
+  }
+
+  let previewResult
+
+  try {
+    previewResult =
+      await SubscriptionGroupHandler.promises.updateGroupMembersBulk(
+        inviterId,
+        subscriptionId,
+        emailList,
+        { removeMembersNotIncluded }
+      )
+  } catch (error) {
+    if (error instanceof InvalidEmailError) {
+      console.error(`${filename} contains invalid email addresses:`)
+      console.error(error.info?.invalidEmails.join(','))
+      process.exit(1)
+    } else {
+      throw error
+    }
+  }
+
+  console.log('Result Preview:')
+  logResult(previewResult)
+
+  if (previewResult.newTotalCount > previewResult.membersLimit) {
+    console.warn(
+      'WARNING: the invite list has reached the membership limit (newTotalCount > membersLimit)'
+    )
+    if (commit) {
+      console.error(`Invites won't be sent and users won't be deleted`)
+    }
+    process.exit(1)
+  }
+
+  if (!commit) {
+    console.log(
+      'this is a dry-run, use the --commit option to send the invite and make any DB changes'
+    )
+    return
+  }
+
+  console.log(
+    `Sending invites to ${previewResult.emailsToSendInvite.length} email addresses`
+  )
+
+  if (previewResult.membersToRemove > 0) {
+    console.log(
+      `${previewResult.membersToRemove.length} members will be removed from the group`
+    )
+  }
+
+  const commitResult =
+    await SubscriptionGroupHandler.promises.updateGroupMembersBulk(
+      inviterId,
+      subscriptionId,
+      emailList,
+      { removeMembersNotIncluded, commit }
+    )
+
+  console.log('Result:')
+  logResult(commitResult)
+}
+
+function logResult(result) {
+  console.log(
+    JSON.stringify(
+      {
+        ...result,
+        emailsToSendInvite: verbose
+          ? result.emailsToSendInvite
+          : result.emailsToSendInvite.length,
+        membersToRemove: verbose
+          ? result.membersToRemove
+          : result.membersToRemove.length,
+        emailsToRevokeInvite: verbose
+          ? result.emailsToRevokeInvite
+          : result.emailsToRevokeInvite.length,
+      },
+      null,
+      2
+    )
+  )
+}
+
+async function main() {
+  const subscription = await Subscription.findOne({
+    _id: subscriptionId,
+  }).exec()
+  if (!subscription) {
+    console.error(`subscription with id=${subscriptionId} not found`)
+    process.exit(1)
+  }
+  if (subscription.managedUsersEnabled && removeMembersNotIncluded) {
+    console.warn(
+      `subscription with id=${subscriptionId} has 'managedUsersEnabled=true'` +
+        `'--removeMembersNotIncluded' has been disabled`
+    )
+    removeMembersNotIncluded = false
+  }
+  await Stream.pipeline(
+    fs.createReadStream(filename),
+    parse({
+      columns: true,
+    }),
+    processRows
+  )
+}
+
+main()
+  .then(() => process.exit(0))
+  .catch(error => {
+    console.error(error)
+    process.exit(1)
+  })
diff --git a/services/web/scripts/add_user_count_to_csv.mjs b/services/web/scripts/add_user_count_to_csv.mjs
index 04709df5b2..5447ec9c73 100644
--- a/services/web/scripts/add_user_count_to_csv.mjs
+++ b/services/web/scripts/add_user_count_to_csv.mjs
@@ -9,6 +9,7 @@ import minimist from 'minimist'
 import UserGetter from '../app/src/Features/User/UserGetter.js'
 import { db } from '../app/src/infrastructure/mongodb.js'
 import _ from 'lodash'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const argv = minimist(process.argv.slice(2), {
   string: ['domain', 'output'],
@@ -86,7 +87,7 @@ async function getUsersByHostnameWithSubdomain(domain, projection) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/analytics/backfill_recurly_to_subscription_mapping.mjs b/services/web/scripts/analytics/backfill_recurly_to_subscription_mapping.mjs
index 16f5abe0ad..9ad583844c 100644
--- a/services/web/scripts/analytics/backfill_recurly_to_subscription_mapping.mjs
+++ b/services/web/scripts/analytics/backfill_recurly_to_subscription_mapping.mjs
@@ -19,6 +19,7 @@ import AccountMappingHelper from '../../app/src/Features/Analytics/AccountMappin
 import { registerAccountMapping } from '../../app/src/Features/Analytics/AnalyticsManager.js'
 import { triggerGracefulShutdown } from '../../app/src/infrastructure/GracefulShutdown.js'
 import Validation from '../../app/src/infrastructure/Validation.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const paramsSchema = Validation.Joi.object({
   endDate: Validation.Joi.string().isoDate(),
@@ -59,7 +60,7 @@ function registerMapping(subscription) {
   }
 }
 
-async function main() {
+async function main(trackProgress) {
   const additionalBatchedUpdateOptions = {}
 
   if (endDate) {
@@ -83,6 +84,7 @@ async function main() {
     {
       verboseLogging: verbose,
       ...additionalBatchedUpdateOptions,
+      trackProgress,
     }
   )
 
@@ -109,7 +111,7 @@ if (error) {
   triggerGracefulShutdown(done => done(1))
 } else {
   logger.info({ verbose, commit, endDate }, commit ? 'COMMITTING' : 'DRY RUN')
-  await main()
+  await scriptRunner(main)
 
   triggerGracefulShutdown({
     close(done) {
diff --git a/services/web/scripts/analytics/sync_group_subscription_memberships.mjs b/services/web/scripts/analytics/sync_group_subscription_memberships.mjs
index 5bca95eef4..f687f43460 100644
--- a/services/web/scripts/analytics/sync_group_subscription_memberships.mjs
+++ b/services/web/scripts/analytics/sync_group_subscription_memberships.mjs
@@ -5,6 +5,7 @@ import { DeletedSubscription } from '../../app/src/models/DeletedSubscription.js
 import minimist from 'minimist'
 import _ from 'lodash'
 import mongodb from 'mongodb-legacy'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -272,7 +273,7 @@ const setup = () => {
 
 setup()
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/back_fill_deleted_files.mjs b/services/web/scripts/back_fill_deleted_files.mjs
deleted file mode 100644
index e84e11d78a..0000000000
--- a/services/web/scripts/back_fill_deleted_files.mjs
+++ /dev/null
@@ -1,133 +0,0 @@
-import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
-import { promiseMapWithLimit, promisify } from '@overleaf/promise-utils'
-import { db } from '../app/src/infrastructure/mongodb.js'
-import _ from 'lodash'
-import { fileURLToPath } from 'node:url'
-
-const sleep = promisify(setTimeout)
-
-async function main(options) {
-  if (!options) {
-    options = {}
-  }
-  _.defaults(options, {
-    writeConcurrency: parseInt(process.env.WRITE_CONCURRENCY, 10) || 10,
-    performCleanup: process.argv.includes('--perform-cleanup'),
-    fixPartialInserts: process.argv.includes('--fix-partial-inserts'),
-    letUserDoubleCheckInputsFor: parseInt(
-      process.env.LET_USER_DOUBLE_CHECK_INPUTS_FOR || 10 * 1000,
-      10
-    ),
-  })
-
-  await letUserDoubleCheckInputs(options)
-
-  await batchedUpdate(
-    db.projects,
-    // array is not empty ~ array has one item
-    { 'deletedFiles.0': { $exists: true } },
-    async projects => {
-      await processBatch(projects, options)
-    },
-    { _id: 1, deletedFiles: 1 }
-  )
-}
-
-async function processBatch(projects, options) {
-  await promiseMapWithLimit(
-    options.writeConcurrency,
-    projects,
-    async project => {
-      await processProject(project, options)
-    }
-  )
-}
-
-async function processProject(project, options) {
-  await backFillFiles(project, options)
-
-  if (options.performCleanup) {
-    await cleanupProject(project)
-  }
-}
-
-async function backFillFiles(project, options) {
-  const projectId = project._id
-  filterDuplicatesInPlace(project)
-  project.deletedFiles.forEach(file => {
-    file.projectId = projectId
-  })
-
-  if (options.fixPartialInserts) {
-    await fixPartialInserts(project)
-  } else {
-    await db.deletedFiles.insertMany(project.deletedFiles)
-  }
-}
-
-function filterDuplicatesInPlace(project) {
-  const fileIds = new Set()
-  project.deletedFiles = project.deletedFiles.filter(file => {
-    const id = file._id.toString()
-    if (fileIds.has(id)) return false
-    fileIds.add(id)
-    return true
-  })
-}
-
-async function fixPartialInserts(project) {
-  const seenFileIds = new Set(
-    (
-      await db.deletedFiles
-        .find(
-          { _id: { $in: project.deletedFiles.map(file => file._id) } },
-          { projection: { _id: 1 } }
-        )
-        .toArray()
-    ).map(file => file._id.toString())
-  )
-  project.deletedFiles = project.deletedFiles.filter(file => {
-    const id = file._id.toString()
-    if (seenFileIds.has(id)) return false
-    seenFileIds.add(id)
-    return true
-  })
-  if (project.deletedFiles.length > 0) {
-    await db.deletedFiles.insertMany(project.deletedFiles)
-  }
-}
-
-async function cleanupProject(project) {
-  await db.projects.updateOne(
-    { _id: project._id },
-    { $set: { deletedFiles: [] } }
-  )
-}
-
-async function letUserDoubleCheckInputs(options) {
-  if (options.performCleanup) {
-    console.error('BACK FILLING AND PERFORMING CLEANUP')
-  } else {
-    console.error(
-      'BACK FILLING ONLY - You will need to rerun with --perform-cleanup'
-    )
-  }
-  console.error(
-    'Waiting for you to double check inputs for',
-    options.letUserDoubleCheckInputsFor,
-    'ms'
-  )
-  await sleep(options.letUserDoubleCheckInputsFor)
-}
-
-export default main
-
-if (fileURLToPath(import.meta.url) === process.argv[1]) {
-  try {
-    await main()
-    process.exit(0)
-  } catch (error) {
-    console.error({ error })
-    process.exit(1)
-  }
-}
diff --git a/services/web/scripts/back_fill_doc_name_for_deleted_docs.mjs b/services/web/scripts/back_fill_doc_name_for_deleted_docs.mjs
index d22bb3ea7e..b311176184 100644
--- a/services/web/scripts/back_fill_doc_name_for_deleted_docs.mjs
+++ b/services/web/scripts/back_fill_doc_name_for_deleted_docs.mjs
@@ -3,10 +3,11 @@ import { promiseMapWithLimit, promisify } from '@overleaf/promise-utils'
 import { db } from '../app/src/infrastructure/mongodb.js'
 import { fileURLToPath } from 'node:url'
 import _ from 'lodash'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const sleep = promisify(setTimeout)
 
-async function main(options) {
+async function main(options, trackProgress) {
   if (!options) {
     options = {}
   }
@@ -28,7 +29,9 @@ async function main(options) {
     async projects => {
       await processBatch(projects, options)
     },
-    { _id: 1, deletedDocs: 1 }
+    { _id: 1, deletedDocs: 1 },
+    undefined,
+    { trackProgress }
   )
 }
 
@@ -83,7 +86,9 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(
+      async trackProgress => await main(undefined, trackProgress)
+    )
     process.exit(0)
   } catch (error) {
     console.error({ error })
diff --git a/services/web/scripts/back_fill_dummy_doc_meta.mjs b/services/web/scripts/back_fill_dummy_doc_meta.mjs
index 0fccdc46a7..e0684ea0be 100644
--- a/services/web/scripts/back_fill_dummy_doc_meta.mjs
+++ b/services/web/scripts/back_fill_dummy_doc_meta.mjs
@@ -7,6 +7,7 @@ import {
 import _ from 'lodash'
 import LRUCache from 'lru-cache'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 const sleep = promisify(setTimeout)
@@ -151,7 +152,7 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(async () => await main())
     console.error('Done.')
     process.exit(0)
   } catch (error) {
diff --git a/services/web/scripts/back_fill_staff_access.mjs b/services/web/scripts/back_fill_staff_access.mjs
index c26958e8d9..76d17fba83 100644
--- a/services/web/scripts/back_fill_staff_access.mjs
+++ b/services/web/scripts/back_fill_staff_access.mjs
@@ -3,6 +3,7 @@ import {
   READ_PREFERENCE_SECONDARY,
 } from '../app/src/infrastructure/mongodb.js'
 import UserSessionsManager from '../app/src/Features/User/UserSessionsManager.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const COMMIT = process.argv.includes('--commit')
 const KEEP_SESSIONS = process.argv.includes('--keep-sessions')
@@ -84,7 +85,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/back_fill_warning_user_personal_and_group_subscription.mjs b/services/web/scripts/back_fill_warning_user_personal_and_group_subscription.mjs
index efa5a79197..f9b5388e45 100644
--- a/services/web/scripts/back_fill_warning_user_personal_and_group_subscription.mjs
+++ b/services/web/scripts/back_fill_warning_user_personal_and_group_subscription.mjs
@@ -1,6 +1,7 @@
 import NotificationsBuilder from '../app/src/Features/Notifications/NotificationsBuilder.js'
 import { db } from '../app/src/infrastructure/mongodb.js'
 import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const DRY_RUN = !process.argv.includes('--dry-run=false')
 
@@ -55,14 +56,23 @@ async function processBatch(groupSubscriptionsBatch) {
   }
 }
 
-async function main() {
-  await batchedUpdate(db.subscriptions, { groupPlan: true }, processBatch, {
-    member_ids: 1,
-  })
+async function main(trackProgress) {
+  await batchedUpdate(
+    db.subscriptions,
+    { groupPlan: true },
+    processBatch,
+    {
+      member_ids: 1,
+    },
+    undefined,
+    {
+      trackProgress,
+    }
+  )
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/backfill_mixpanel_user_properties.mjs b/services/web/scripts/backfill_mixpanel_user_properties.mjs
index 3e966a3a62..ef8b8e0565 100644
--- a/services/web/scripts/backfill_mixpanel_user_properties.mjs
+++ b/services/web/scripts/backfill_mixpanel_user_properties.mjs
@@ -66,6 +66,7 @@ async function _getGroupSubscriptionPlanCode(userId) {
     const plan = PlansLocator.findLocalPlanInSettings(subscription.planCode)
     if (
       plan &&
+      plan.features &&
       FeaturesHelper.isFeatureSetBetter(plan.features, bestFeatures)
     ) {
       bestPlanCode = plan.planCode
diff --git a/services/web/scripts/check_docs.mjs b/services/web/scripts/check_docs.mjs
index d6fccd5db3..3b7e17128e 100644
--- a/services/web/scripts/check_docs.mjs
+++ b/services/web/scripts/check_docs.mjs
@@ -9,13 +9,14 @@ import {
 } from '../app/src/infrastructure/mongodb.js'
 import DocstoreManager from '../app/src/Features/Docstore/DocstoreManager.js'
 import { NotFoundError } from '../app/src/Features/Errors/Errors.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const OPTS = parseArgs()
 
 function parseArgs() {
   const args = minimist(process.argv.slice(2), {
     string: ['min-project-id', 'max-project-id', 'project-modified-since'],
-    boolean: ['help', 'dangling-comments', 'tracked-changes'],
+    boolean: ['help', 'dangling-comments', 'tracked-changes', 'any-comments'],
   })
 
   if (args.help) {
@@ -25,9 +26,10 @@ function parseArgs() {
 
   const danglingComments = Boolean(args['dangling-comments'])
   const trackedChanges = Boolean(args['tracked-changes'])
-  if (!danglingComments && !trackedChanges) {
+  const anyComments = Boolean(args['any-comments'])
+  if (!danglingComments && !trackedChanges && !anyComments) {
     console.log(
-      'At least one of --dangling-comments or --tracked-changes must be enabled'
+      'At least one of --dangling-comments, --tracked-changes, or --any-comments must be enabled'
     )
     process.exit(1)
   }
@@ -40,6 +42,7 @@ function parseArgs() {
       : null,
     danglingComments,
     trackedChanges,
+    anyComments,
     concurrency: parseInt(args.concurrency ?? '1', 10),
   }
 }
@@ -55,6 +58,7 @@ Options:
                               Example: 2020-01-01
     --dangling-comments       Report projects with dangling comments
     --tracked-changes         Report projects with tracked changes
+    --any-comments            Report projects with any comments
     --concurrency             How many projects can be processed in parallel
     `)
 }
@@ -64,6 +68,8 @@ async function main() {
   let projectsProcessed = 0
   let danglingCommentsFound = 0
   let trackedChangesFound = 0
+  let anyCommentsFound = 0
+
   for await (const projectId of getProjectIds()) {
     await queue.onEmpty()
     queue.add(async () => {
@@ -86,6 +92,13 @@ async function main() {
         }
       }
 
+      if (OPTS.anyComments) {
+        if (docsHaveAnyComments(docs)) {
+          console.log(`Project ${projectId} has comments`)
+          anyCommentsFound += 1
+        }
+      }
+
       projectsProcessed += 1
       if (projectsProcessed % 100000 === 0) {
         console.log(
@@ -105,6 +118,10 @@ async function main() {
   if (OPTS.trackedChanges) {
     console.log(`${trackedChangesFound} projects with tracked changes found`)
   }
+
+  if (OPTS.anyComments) {
+    console.log(`${anyCommentsFound} projects with any comments found`)
+  }
 }
 
 function getProjectIds() {
@@ -212,8 +229,18 @@ function docsHaveTrackedChanges(docs) {
   return false
 }
 
+function docsHaveAnyComments(docs) {
+  for (const doc of docs) {
+    const comments = doc.ranges?.comments ?? []
+    if (comments.length > 0) {
+      return true
+    }
+  }
+  return false
+}
+
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (err) {
   console.error(err)
diff --git a/services/web/scripts/check_duplicate_collaborators.mjs b/services/web/scripts/check_duplicate_collaborators.mjs
new file mode 100644
index 0000000000..cf4ba7eafd
--- /dev/null
+++ b/services/web/scripts/check_duplicate_collaborators.mjs
@@ -0,0 +1,157 @@
+#!/usr/bin/env node
+
+/**
+ * Script to check for and optionally fix duplicate collaborators in projects
+ *
+ * A duplicate collaborator is when the same user id appears in multiple collaborator
+ * arrays for the same project (collaberator_refs, readOnly_refs, reviewer_refs, etc.)
+ *
+ * If "--fix" is used, this script will remove users from higher privilege roles and keeps them in lower privilege roles
+ *
+ * Usage:
+ *   node scripts/check_duplicate_collaborators.mjs [--fix] [--project-id=<id>]
+ */
+
+import {
+  batchedUpdate,
+  READ_PREFERENCE_SECONDARY,
+} from '@overleaf/mongo-utils/batchedUpdate.js'
+import { db, ObjectId } from '../app/src/infrastructure/mongodb.js'
+import minimist from 'minimist'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
+
+const args = minimist(process.argv.slice(2), {
+  boolean: ['fix'],
+  string: ['project-id', 'start-date', 'end-date'],
+  default: {
+    fix: false,
+  },
+})
+
+async function fixDuplicateCollaborators(project, trackProgress) {
+  const dryRun = !args.fix
+  const removeCollaboratorRefs = []
+  const removeReviewerRefs = []
+
+  for (const reviewerRef of project.reviewer_refs || []) {
+    if (includesId(project.readOnly_refs, reviewerRef)) {
+      removeReviewerRefs.push(reviewerRef) // remove from reviewer_refs (keep read-only)
+    }
+    if (includesId(project.collaberator_refs, reviewerRef)) {
+      removeCollaboratorRefs.push(reviewerRef) // remove from collaberator_refs (keep reviewer)
+    }
+  }
+
+  if (
+    !dryRun &&
+    (removeCollaboratorRefs.length > 0 || removeReviewerRefs.length > 0)
+  ) {
+    await db.projects.updateOne(
+      { _id: project._id },
+      {
+        $pull: {
+          collaberator_refs: { $in: removeCollaboratorRefs },
+          reviewer_refs: { $in: removeReviewerRefs },
+        },
+      }
+    )
+  }
+
+  const action = args.fix ? 'Removed' : 'Found duplicates in'
+
+  if (removeCollaboratorRefs.length > 0) {
+    trackProgress(
+      `${action} collaborators from project ${project._id}:`,
+      removeCollaboratorRefs
+    )
+  }
+  if (removeReviewerRefs.length > 0) {
+    trackProgress(
+      `${action} reviewers from project ${project._id}:`,
+      removeReviewerRefs
+    )
+  }
+}
+
+async function main(trackProgress) {
+  if (!args['start-date'] && !args['project-id']) {
+    console.error(
+      'Please provide either --start-date or --project-id argument.'
+    )
+    process.exit(1)
+  }
+
+  if (args['project-id']) {
+    const projectId = new ObjectId(args['project-id'])
+    const project = await db.projects.findOne(
+      { _id: projectId },
+      {
+        readPreference: READ_PREFERENCE_SECONDARY,
+        projection: {
+          _id: 1,
+          collaberator_refs: 1,
+          readOnly_refs: 1,
+          reviewer_refs: 1,
+        },
+      }
+    )
+
+    if (!project) {
+      console.error(`Project with id ${projectId} not found`)
+      process.exit(1)
+    }
+
+    await fixDuplicateCollaborators(project, trackProgress)
+
+    return
+  }
+
+  let projectsProcessed = 0
+  await batchedUpdate(
+    db.projects,
+    {
+      reviewer_refs: { $ne: [] },
+      $or: [{ readOnly_refs: { $ne: [] } }, { collaberator_refs: { $ne: [] } }],
+    },
+    /**
+     * @param {Array<Project>} projects
+     * @return {Promise<void>}
+     */
+    async function projects(projects) {
+      for (const project of projects) {
+        projectsProcessed += 1
+        if (projectsProcessed % 10000 === 0) {
+          console.log(projectsProcessed, 'projects processed')
+        }
+
+        await fixDuplicateCollaborators(project, trackProgress)
+      }
+    },
+    {
+      _id: 1,
+      collaberator_refs: 1,
+      readOnly_refs: 1,
+      reviewer_refs: 1,
+    },
+    undefined,
+    {
+      trackProgress,
+      BATCH_RANGE_START: new Date(args['start-date']).toISOString(),
+      BATCH_RANGE_END: args['end-date']
+        ? new Date(args['end-date']).toISOString()
+        : new Date().toISOString(),
+    }
+  )
+}
+
+function includesId(array, id) {
+  return array?.some(item => item.toString() === id.toString())
+}
+
+try {
+  await scriptRunner(main)
+  process.exit()
+} catch (error) {
+  console.error(error)
+  process.exit(1)
+}
diff --git a/services/web/scripts/check_institution_users.mjs b/services/web/scripts/check_institution_users.mjs
index e89c0d114b..5cb4fb7973 100644
--- a/services/web/scripts/check_institution_users.mjs
+++ b/services/web/scripts/check_institution_users.mjs
@@ -1,5 +1,6 @@
 import InstitutionsManager from '../app/src/Features/Institutions/InstitutionsManager.js'
 import { ensureRunningOnMongoSecondaryWithTimeout } from './helpers/env_variable_helper.mjs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 ensureRunningOnMongoSecondaryWithTimeout(300000)
 
@@ -18,7 +19,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/check_project_files.js b/services/web/scripts/check_project_files.js
new file mode 100644
index 0000000000..e827895e66
--- /dev/null
+++ b/services/web/scripts/check_project_files.js
@@ -0,0 +1,263 @@
+const Path = require('path')
+const DocstoreManager = require('../app/src/Features/Docstore/DocstoreManager')
+const DocumentUpdaterHandler = require('../app/src/Features/DocumentUpdater/DocumentUpdaterHandler')
+const FileStoreHandler = require('../app/src/Features/FileStore/FileStoreHandler')
+const ProjectGetter = require('../app/src/Features/Project/ProjectGetter')
+const ProjectEntityMongoUpdateHandler = require('../app/src/Features/Project/ProjectEntityMongoUpdateHandler')
+const { waitForDb, db, ObjectId } = require('../app/src/infrastructure/mongodb')
+const logger = require('@overleaf/logger').logger
+
+const args = require('minimist')(process.argv.slice(2), {
+  boolean: ['verbose', 'fix'],
+})
+const verbose = args.verbose
+
+if (!verbose) {
+  logger.level('error')
+}
+
+// no remaining arguments, print usage
+if (args._.length === 0) {
+  console.log(
+    'Usage: node services/web/scripts/check_project_docs.js [--verbose] [--fix] <projectId>...'
+  )
+  process.exit(1)
+}
+
+function logDoc(projectId, path, doc, message = '') {
+  console.log(
+    'projectId:',
+    projectId,
+    'doc:',
+    JSON.stringify({
+      _id: doc._id,
+      name: doc.name,
+      lines: doc.lines ? doc.lines.join('\n').length : 0,
+      rev: doc.rev,
+      version: doc.version,
+      ranges: typeof doc.ranges,
+    }),
+    path,
+    message
+  )
+}
+
+function logFile(projectId, path, file, message = '') {
+  console.log(
+    'projectId:',
+    projectId,
+    'file:',
+    JSON.stringify({
+      _id: file._id,
+      name: file.name,
+      linkedFileData: file.linkedFileData,
+      hash: file.hash,
+      size: file.size,
+    }),
+    path,
+    message
+  )
+}
+
+function findPathCounts(projectId, docEntries, fileEntries) {
+  const pathCounts = new Map()
+  const docPaths = docEntries.map(({ path }) => path)
+  const filePaths = fileEntries.map(({ path }) => path)
+  const allPaths = docPaths.concat(filePaths)
+  for (const path of allPaths) {
+    pathCounts.set(path, (pathCounts.get(path) || 0) + 1)
+  }
+  return pathCounts
+}
+
+// copied from services/web/app/src/Features/Project/ProjectDuplicator.js
+function _getFolderEntries(folder, folderPath = '/') {
+  const docEntries = []
+  const fileEntries = []
+  const docs = folder.docs || []
+  const files = folder.fileRefs || []
+  const subfolders = folder.folders || []
+
+  for (const doc of docs) {
+    if (doc == null || doc._id == null) {
+      continue
+    }
+    const path = Path.join(folderPath, doc.name)
+    docEntries.push({ doc, path })
+  }
+
+  for (const file of files) {
+    if (file == null || file._id == null) {
+      continue
+    }
+    const path = Path.join(folderPath, file.name)
+    fileEntries.push({ file, path })
+  }
+
+  for (const subfolder of subfolders) {
+    if (subfolder == null || subfolder._id == null) {
+      continue
+    }
+    const subfolderPath = Path.join(folderPath, subfolder.name)
+    const subfolderEntries = _getFolderEntries(subfolder, subfolderPath)
+    for (const docEntry of subfolderEntries.docEntries) {
+      docEntries.push(docEntry)
+    }
+    for (const fileEntry of subfolderEntries.fileEntries) {
+      fileEntries.push(fileEntry)
+    }
+  }
+  return { docEntries, fileEntries }
+}
+
+async function getDocsInMongo(projectId) {
+  return await db.docs
+    .find({ project_id: new ObjectId(projectId), deleted: { $ne: true } })
+    .toArray()
+}
+
+function getDocIdsInFileTree(docEntries) {
+  return docEntries.map(({ doc }) => doc._id.toString())
+}
+
+function findMissingDocs(docsInMongo, docIdsInFileTree) {
+  const missingDocs = []
+  for (const doc of docsInMongo) {
+    const docId = doc._id.toString()
+    if (!docIdsInFileTree.includes(docId)) {
+      console.log(`Found doc in docstore not in project filetree:`, docId)
+      missingDocs.push(doc)
+    }
+  }
+  return missingDocs
+}
+
+async function createRecoveryFolder(projectId) {
+  const recoveryFolder = `recovered-${Date.now()}`
+  const { folder } = await ProjectEntityMongoUpdateHandler.promises.mkdirp(
+    new ObjectId(projectId),
+    recoveryFolder,
+    null // unset lastUpdatedBy
+  )
+  console.log('Created recovery folder:', folder._id.toString())
+  return folder
+}
+
+async function restoreMissingDocs(projectId, folder, missingDocs) {
+  for (const doc of missingDocs) {
+    doc.name = doc.name || `unknown-file-${doc._id.toString()}`
+    try {
+      await ProjectEntityMongoUpdateHandler.promises.addDoc(
+        new ObjectId(projectId),
+        folder._id,
+        doc,
+        null // unset lastUpdatedBy
+      )
+      console.log('Restored doc to filetree:', doc._id.toString())
+    } catch (err) {
+      console.log(`Error adding doc to filetree:`, err)
+    }
+  }
+}
+
+async function checkProject(projectId) {
+  try {
+    await DocumentUpdaterHandler.promises.flushProjectToMongo(projectId)
+  } catch (err) {
+    console.log(`Error flushing project ${projectId} to mongo: ${err}`)
+  }
+  const project = await ProjectGetter.promises.getProject(projectId, {
+    rootFolder: true,
+    rootDoc_id: true,
+  })
+  if (verbose) {
+    console.log(`project: ${JSON.stringify(project)}`)
+  }
+  const { docEntries, fileEntries } = _getFolderEntries(project.rootFolder[0])
+  console.log(
+    `Found ${docEntries.length} docEntries and ${fileEntries.length} fileEntries`
+  )
+  const pathCounts = findPathCounts(projectId, docEntries, fileEntries)
+
+  for (const [path, count] of pathCounts) {
+    if (count > 1) {
+      console.log(`Found duplicate path: ${path}`)
+    }
+  }
+
+  let errors = 0
+  for (const { doc, path } of docEntries) {
+    try {
+      const { lines, rev, version, ranges } =
+        await DocstoreManager.promises.getDoc(projectId, doc._id)
+      if (!lines) {
+        throw new Error('no doclines')
+      }
+      if (pathCounts.get(path) > 1) {
+        logDoc(
+          projectId,
+          path,
+          { ...doc, lines, rev, version, ranges },
+          'duplicate path'
+        )
+        errors++
+      } else if (verbose) {
+        logDoc(projectId, path, { ...doc, lines, rev, version, ranges })
+      }
+    } catch (err) {
+      logDoc(projectId, path, doc, err)
+      errors++
+    }
+  }
+  for (const { file, path } of fileEntries) {
+    try {
+      const fileSize = await FileStoreHandler.promises.getFileSize(
+        projectId,
+        file._id
+      )
+      if (pathCounts.get(path) > 1) {
+        logFile(projectId, path, { ...file, fileSize }, 'duplicate path')
+        errors++
+      } else if (verbose) {
+        logFile(projectId, path, { ...file, fileSize })
+      }
+    } catch (err) {
+      logFile(projectId, path, file, err)
+      errors++
+    }
+  }
+
+  // now look for docs in the docstore that are not in the project filetree
+  const docsInMongo = await getDocsInMongo(projectId)
+  const docIdsInFileTree = getDocIdsInFileTree(docEntries)
+  const missingDocs = findMissingDocs(docsInMongo, docIdsInFileTree)
+
+  if (args.fix && missingDocs.length > 0) {
+    console.log('Restoring missing docs to filetree...')
+    const folder = await createRecoveryFolder(projectId)
+    await restoreMissingDocs(projectId, folder, missingDocs)
+  }
+
+  if (errors > 0) {
+    console.log(`Errors found in project: ${projectId}`)
+  } else {
+    console.log(`No errors found in project: ${projectId}`)
+  }
+}
+
+async function main() {
+  await waitForDb()
+  for (const projectId of args._) {
+    await checkProject(projectId)
+  }
+}
+
+main()
+  .then(() => {
+    console.log('DONE')
+    process.exit(0)
+  })
+  .catch(err => {
+    console.error(err)
+    process.exit(1)
+  })
diff --git a/services/web/scripts/clear_admin_sessions.mjs b/services/web/scripts/clear_admin_sessions.mjs
index 3d5623c864..c3f5b28c4b 100644
--- a/services/web/scripts/clear_admin_sessions.mjs
+++ b/services/web/scripts/clear_admin_sessions.mjs
@@ -3,6 +3,7 @@ import {
   READ_PREFERENCE_SECONDARY,
 } from '../app/src/infrastructure/mongodb.js'
 import UserSessionsManager from '../app/src/Features/User/UserSessionsManager.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const COMMIT = process.argv.includes('--commit')
 const LOG_SESSIONS = !process.argv.includes('--log-sessions=false')
@@ -58,7 +59,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/clear_institution_notifications.mjs b/services/web/scripts/clear_institution_notifications.mjs
index b97c20d5ff..29a77de5db 100644
--- a/services/web/scripts/clear_institution_notifications.mjs
+++ b/services/web/scripts/clear_institution_notifications.mjs
@@ -1,6 +1,7 @@
 import { promisify } from 'node:util'
 import InstitutionsManager from '../app/src/Features/Institutions/InstitutionsManager.js'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 const sleep = promisify(setTimeout)
 
 async function main() {
@@ -39,7 +40,7 @@ async function main() {
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     console.log('Done.')
     process.exit(0)
   } catch (error) {
diff --git a/services/web/scripts/clear_project_tokens.mjs b/services/web/scripts/clear_project_tokens.mjs
index ab3d3c5a84..798e67aded 100644
--- a/services/web/scripts/clear_project_tokens.mjs
+++ b/services/web/scripts/clear_project_tokens.mjs
@@ -1,4 +1,5 @@
 import ProjectDetailsHandler from '../app/src/Features/Project/ProjectDetailsHandler.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 const projectId = process.argv[2]
 
 if (!/^(?=[a-f\d]{24}$)(\d+[a-f]|[a-f]+\d)/.test(projectId)) {
@@ -21,7 +22,7 @@ function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/clear_sessions_2fa.mjs b/services/web/scripts/clear_sessions_2fa.mjs
index e6058d357c..d6557faa62 100644
--- a/services/web/scripts/clear_sessions_2fa.mjs
+++ b/services/web/scripts/clear_sessions_2fa.mjs
@@ -1,6 +1,7 @@
 import { promisify, promiseMapWithLimit } from '@overleaf/promise-utils'
 import UserSessionsRedis from '../app/src/Features/User/UserSessionsRedis.js'
 import minimist from 'minimist'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const rClient = UserSessionsRedis.client()
 
@@ -76,7 +77,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/confirmed_at_to_dates.mjs b/services/web/scripts/confirmed_at_to_dates.mjs
deleted file mode 100644
index 60fcc543fd..0000000000
--- a/services/web/scripts/confirmed_at_to_dates.mjs
+++ /dev/null
@@ -1,53 +0,0 @@
-import { db } from '../app/src/infrastructure/mongodb.js'
-import { fileURLToPath } from 'node:url'
-
-async function updateStringDates() {
-  const users = await db.users.aggregate([
-    { $unwind: { path: '$emails' } },
-    {
-      $match: { 'emails.confirmedAt': { $exists: true, $type: 'string' } },
-    },
-    {
-      $project: {
-        _id: 1,
-        'emails.email': 1,
-        'emails.confirmedAt': 1,
-      },
-    },
-  ])
-
-  let user
-  let count = 0
-  while ((user = await users.next())) {
-    count += 1
-    if (count % 10000 === 0) {
-      console.log(`processed ${count} users`)
-    }
-    const confirmedAt = user.emails.confirmedAt
-    const dateConfirmedAt = new Date(confirmedAt.replace(/ UTC$/, ''))
-    await db.users.updateOne(
-      {
-        _id: user._id,
-        'emails.email': user.emails.email,
-      },
-      {
-        $set: {
-          'emails.$.confirmedAt': dateConfirmedAt,
-        },
-      }
-    )
-  }
-  console.log(`Updated ${count} confirmedAt strings to dates!`)
-}
-
-if (fileURLToPath(import.meta.url) === process.argv[1]) {
-  try {
-    await updateStringDates()
-    process.exit(0)
-  } catch (error) {
-    console.error(error)
-    process.exit(1)
-  }
-}
-
-export default updateStringDates
diff --git a/services/web/scripts/convert_archived_state.mjs b/services/web/scripts/convert_archived_state.mjs
deleted file mode 100644
index e2c108ed80..0000000000
--- a/services/web/scripts/convert_archived_state.mjs
+++ /dev/null
@@ -1,93 +0,0 @@
-import _ from 'lodash'
-import { db } from '../app/src/infrastructure/mongodb.js'
-import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
-import { promiseMapWithLimit } from '@overleaf/promise-utils'
-import { fileURLToPath } from 'node:url'
-
-const WRITE_CONCURRENCY = parseInt(process.env.WRITE_CONCURRENCY, 10) || 10
-
-// $ node scripts/convert_archived_state.mjs FIRST,SECOND
-
-async function main(STAGE) {
-  for (const FIELD of ['archived', 'trashed']) {
-    if (STAGE.includes('FIRST')) {
-      await batchedUpdate(
-        db.projects,
-        { [FIELD]: false },
-        {
-          $set: { [FIELD]: [] },
-        }
-      )
-
-      console.error('Done, with first part for field:', FIELD)
-    }
-
-    if (STAGE.includes('SECOND')) {
-      await batchedUpdate(
-        db.projects,
-        { [FIELD]: true },
-        async function performUpdate(nextBatch) {
-          await promiseMapWithLimit(
-            WRITE_CONCURRENCY,
-            nextBatch,
-            async project => {
-              try {
-                await upgradeFieldToArray({ project, FIELD })
-              } catch (err) {
-                console.error(project._id, err)
-                throw err
-              }
-            }
-          )
-        },
-        {
-          _id: 1,
-          owner_ref: 1,
-          collaberator_refs: 1,
-          readOnly_refs: 1,
-          tokenAccessReadAndWrite_refs: 1,
-          tokenAccessReadOnly_refs: 1,
-        }
-      )
-
-      console.error('Done, with second part for field:', FIELD)
-    }
-  }
-}
-
-async function upgradeFieldToArray({ project, FIELD }) {
-  return db.projects.updateOne(
-    { _id: project._id },
-    {
-      $set: { [FIELD]: getAllUserIds(project) },
-    }
-  )
-}
-
-function getAllUserIds(project) {
-  return _.unionWith(
-    [project.owner_ref],
-    project.collaberator_refs,
-    project.readOnly_refs,
-    project.tokenAccessReadAndWrite_refs,
-    project.tokenAccessReadOnly_refs,
-    _objectIdEquals
-  )
-}
-
-function _objectIdEquals(firstVal, secondVal) {
-  // For use as a comparator for unionWith
-  return firstVal.toString() === secondVal.toString()
-}
-
-if (fileURLToPath(import.meta.url) === process.argv[1]) {
-  try {
-    await main(process.argv.pop())
-    process.exit(0)
-  } catch (error) {
-    console.error({ error })
-    process.exit(1)
-  }
-}
-
-export default main
diff --git a/services/web/scripts/convert_doc_to_file.mjs b/services/web/scripts/convert_doc_to_file.mjs
index db4cb8b309..a1d401dc23 100644
--- a/services/web/scripts/convert_doc_to_file.mjs
+++ b/services/web/scripts/convert_doc_to_file.mjs
@@ -2,6 +2,7 @@ import minimist from 'minimist'
 import { ObjectId } from '../app/src/infrastructure/mongodb.js'
 import ProjectEntityUpdateHandler from '../app/src/Features/Project/ProjectEntityUpdateHandler.js'
 import Errors from '../app/src/Features/Errors/Errors.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 async function main() {
   const argv = minimist(process.argv.slice(2))
@@ -35,7 +36,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/count_encrypted_access_tokens.mjs b/services/web/scripts/count_encrypted_access_tokens.mjs
index 003179f3eb..e989d49d15 100644
--- a/services/web/scripts/count_encrypted_access_tokens.mjs
+++ b/services/web/scripts/count_encrypted_access_tokens.mjs
@@ -5,6 +5,7 @@ import {
 import _ from 'lodash'
 import { formatTokenUsageStats } from '@overleaf/access-token-encryptor/scripts/helpers/format-usage-stats.js'
 import { ensureMongoTimeout } from './helpers/env_variable_helper.mjs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 if (!process.env.MONGO_SOCKET_TIMEOUT) {
   const TEN_MINUTES = 1000 * 60 * 10
@@ -65,7 +66,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/count_files_in_projects.mjs b/services/web/scripts/count_files_in_projects.mjs
index 437e0d50f1..59b49bbdf3 100644
--- a/services/web/scripts/count_files_in_projects.mjs
+++ b/services/web/scripts/count_files_in_projects.mjs
@@ -19,7 +19,6 @@ async function countFiles() {
       console.error(
         projectId,
         files.length,
-        (project.deletedFiles && project.deletedFiles.length) || 0,
         docs.length,
         (project.deletedDocs && project.deletedDocs.length) || 0
       )
diff --git a/services/web/scripts/count_image_files.mjs b/services/web/scripts/count_image_files.mjs
index 17ad4b84ab..33a9bcc1fd 100644
--- a/services/web/scripts/count_image_files.mjs
+++ b/services/web/scripts/count_image_files.mjs
@@ -3,6 +3,7 @@ import {
   READ_PREFERENCE_SECONDARY,
 } from '../app/src/infrastructure/mongodb.js'
 import { extname } from 'node:path'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const FILE_TYPES = [
   '.jpg',
@@ -71,7 +72,7 @@ function countFiles(folder, result) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/count_project_size.mjs b/services/web/scripts/count_project_size.mjs
index 02f3dea836..fbb1a08281 100644
--- a/services/web/scripts/count_project_size.mjs
+++ b/services/web/scripts/count_project_size.mjs
@@ -43,7 +43,6 @@ async function countProjectFiles() {
       console.error(
         projectId,
         files.length,
-        (project.deletedFiles && project.deletedFiles.length) || 0,
         docs.length,
         (project.deletedDocs && project.deletedDocs.length) || 0,
         fileSize,
diff --git a/services/web/scripts/deactivate_projects.mjs b/services/web/scripts/deactivate_projects.mjs
new file mode 100755
index 0000000000..b229af649d
--- /dev/null
+++ b/services/web/scripts/deactivate_projects.mjs
@@ -0,0 +1,214 @@
+#!/usr/bin/env node
+import minimist from 'minimist'
+import PQueue from 'p-queue'
+import InactiveProjectManager from '../app/src/Features/InactiveData/InactiveProjectManager.js'
+import { gracefulShutdown } from '../app/src/infrastructure/GracefulShutdown.js'
+import logger from '@overleaf/logger'
+
+// Global variables for tracking job and error counts
+let jobCount = 0
+let succeededCount = 0
+let skippedCount = 0
+let failedCount = 0
+let currentAgeInDays = null
+let currentLastOpened = null
+let DRY_RUN = false
+let gracefulShutdownInitiated = false
+const SCRIPT_START_TIME = Date.now()
+const MAX_RUNTIME_DEFAULT = null
+let MAX_RUNTIME = MAX_RUNTIME_DEFAULT // in milliseconds
+
+// Configure signal handling
+process.on('SIGINT', handleSignal)
+process.on('SIGTERM', handleSignal)
+function handleSignal() {
+  if (gracefulShutdownInitiated) return
+  gracefulShutdownInitiated = true
+  logger.warn(
+    { gracefulShutdownInitiated },
+    'graceful shutdown initiated, draining queue'
+  )
+}
+
+// Check if max runtime has been exceeded
+function hasMaxRuntimeExceeded() {
+  if (MAX_RUNTIME === null) return false
+  const elapsedTime = Date.now() - SCRIPT_START_TIME
+  const hasExceeded = elapsedTime >= MAX_RUNTIME
+  if (hasExceeded && !gracefulShutdownInitiated) {
+    gracefulShutdownInitiated = true
+    logger.warn(
+      { elapsedTimeMs: elapsedTime, maxRuntimeMs: MAX_RUNTIME },
+      'maximum runtime exceeded, initiating graceful shutdown'
+    )
+  }
+  return hasExceeded
+}
+
+// Calculates the age in days since the provided lastOpened date.
+function getAgeFromLastOpened(lastOpened) {
+  const lastOpenedDate = new Date(lastOpened)
+  const now = new Date()
+  return Number(((now - lastOpenedDate) / (1000 * 60 * 60 * 24)).toFixed(2))
+}
+
+// Deactivates a single project and handles errors
+async function deactivateSingleProject(project) {
+  const { _id: projectId, lastOpened } = project
+  jobCount++
+
+  if (lastOpened) {
+    currentLastOpened = lastOpened
+    currentAgeInDays = getAgeFromLastOpened(lastOpened)
+  }
+
+  // Periodic progress logging
+  if (jobCount % 1000 === 0) {
+    logger.info(
+      { jobCount, failedCount, currentAgeInDays },
+      'project deactivation in progress'
+    )
+  }
+
+  // Debug level detail logging
+  logger.debug(
+    { projectId, jobCount, failedCount, dryRun: DRY_RUN },
+    'attempting to deactivate project'
+  )
+
+  // Dry run handling
+  if (DRY_RUN) {
+    logger.info({ projectId }, '[DRY RUN] would deactivate project')
+    succeededCount++
+  }
+
+  // Actual deactivation with error handling
+  try {
+    await InactiveProjectManager.promises.deactivateProject(projectId)
+    logger.debug({ projectId }, 'successfully deactivated project')
+    succeededCount++
+  } catch (error) {
+    failedCount++
+    logger.error({ projectId, err: error }, 'failed to deactivate project')
+  }
+}
+
+// Centralized project processing function
+async function processProjects(projectCursor, concurrency) {
+  const queue = new PQueue({ concurrency })
+  for await (const project of projectCursor) {
+    if (gracefulShutdownInitiated || hasMaxRuntimeExceeded()) {
+      skippedCount++
+      break
+    }
+    await queue.onEmpty()
+    logger.debug(
+      { queueSize: queue.size, queuePending: queue.pending },
+      'queue size before adding new job'
+    )
+    queue.add(async () => {
+      await deactivateSingleProject(project)
+    })
+  }
+  await queue.onIdle()
+}
+
+const usage = `
+Usage: scripts/deactivate_projects.mjs [options]
+
+Options:
+  --limit <number>        Max number of projects to process (default: 10)
+  --daysOld <number>      Min age in days for a project to be considered inactive (default: 7)
+  --concurrency <number>  Number of deactivations to run in parallel (default: 1)
+  --max-time <number>     Maximum runtime in seconds before graceful shutdown (default: no limit)
+  --dry-run, -n           Simulate deactivation without making changes (default: false)
+  --help                  Display this usage message
+`
+
+async function main() {
+  const argv = minimist(process.argv.slice(2), {
+    string: ['limit', 'daysOld', 'concurrency', 'maxTime'],
+    boolean: ['dryRun', 'help'],
+    alias: {
+      dryRun: ['dry-run', 'n'],
+      maxTime: 'max-time',
+      help: 'h',
+    },
+    default: {
+      limit: '10',
+      daysOld: '7',
+      concurrency: '1',
+      maxTime: '',
+      dryRun: false,
+    },
+  })
+
+  if (argv.help || process.argv.length <= 2) {
+    console.log(usage)
+    process.exit(0)
+  }
+
+  const limit = parseInt(argv.limit, 10)
+  const daysOld = parseInt(argv.daysOld, 10)
+  const concurrency = parseInt(argv.concurrency, 10)
+  const maxRuntimeInSeconds = parseInt(argv.maxTime, 10)
+  DRY_RUN = argv.dryRun
+  MAX_RUNTIME = maxRuntimeInSeconds * 1000 // Convert seconds to milliseconds
+
+  if (DRY_RUN) {
+    logger.info(
+      {},
+      'DRY RUN MODE ENABLED: No actual deactivations will be performed'
+    )
+  }
+
+  logger.info(
+    {
+      limit,
+      daysOld,
+      concurrency,
+      dryRun: DRY_RUN,
+      maxRuntimeSeconds: maxRuntimeInSeconds || 'unlimited',
+    },
+    'finding inactive projects'
+  )
+
+  try {
+    // Find projects to deactivate
+    const projectCursor = await InactiveProjectManager.findInactiveProjects(
+      limit,
+      daysOld
+    )
+
+    // Process the projects
+    await processProjects(projectCursor, concurrency)
+  } catch (error) {
+    logger.error({ err: error }, 'critical error during script execution')
+    process.exitCode = 1
+  } finally {
+    logger.info(
+      {
+        jobCount,
+        succeededCount,
+        failedCount,
+        skippedCount,
+        currentAgeInDays,
+        currentLastOpened,
+        elapsedTimeInSeconds: Math.floor(
+          (Date.now() - SCRIPT_START_TIME) / 1000
+        ),
+        maxRuntimeInSeconds: maxRuntimeInSeconds || 'unlimited',
+      },
+      'project deactivation process completed'
+    )
+  }
+}
+
+main()
+  .then(async () => {
+    await gracefulShutdown()
+  })
+  .catch(err => {
+    logger.fatal({ err }, 'unhandled error in main execution')
+    process.exit(1)
+  })
diff --git a/services/web/scripts/delete_dangling_file_refs.mjs b/services/web/scripts/delete_dangling_file_refs.mjs
index 262376aa7d..50dde9e174 100644
--- a/services/web/scripts/delete_dangling_file_refs.mjs
+++ b/services/web/scripts/delete_dangling_file_refs.mjs
@@ -10,6 +10,7 @@ import Errors from '../app/src/Features/Errors/Errors.js'
 import FileStoreHandler from '../app/src/Features/FileStore/FileStoreHandler.js'
 import ProjectEntityMongoUpdateHandler from '../app/src/Features/Project/ProjectEntityMongoUpdateHandler.js'
 import { iterablePaths } from '../app/src/Features/Project/IterablePath.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -104,7 +105,8 @@ async function deleteDoc(projectId, docId) {
     await ProjectEntityMongoUpdateHandler.promises.deleteEntity(
       projectId,
       docId,
-      'doc'
+      'doc',
+      null // unset lastUpdatedBy
     )
   }
 }
@@ -115,13 +117,14 @@ async function deleteFile(projectId, fileId) {
     await ProjectEntityMongoUpdateHandler.promises.deleteEntity(
       projectId,
       fileId,
-      'file'
+      'file',
+      null // unset lastUpdatedBy
     )
   }
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error({ error })
diff --git a/services/web/scripts/delete_orphaned_doc_comment_ranges.mjs b/services/web/scripts/delete_orphaned_doc_comment_ranges.mjs
index 5b9a39714c..c99bfe5b9d 100644
--- a/services/web/scripts/delete_orphaned_doc_comment_ranges.mjs
+++ b/services/web/scripts/delete_orphaned_doc_comment_ranges.mjs
@@ -3,6 +3,7 @@ import ChatApiHandler from '../app/src/Features/Chat/ChatApiHandler.js'
 import DocstoreManager from '../app/src/Features/Docstore/DocstoreManager.js'
 import DocumentUpdaterHandler from '../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js'
 import { promiseMapWithLimit } from '@overleaf/promise-utils'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const WRITE_CONCURRENCY = parseInt(process.env.WRITE_CONCURRENCY, 10) || 10
 
@@ -43,7 +44,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/delete_orphaned_docs_online_check.mjs b/services/web/scripts/delete_orphaned_docs_online_check.mjs
index 2affae4cf9..5ab8e17d45 100644
--- a/services/web/scripts/delete_orphaned_docs_online_check.mjs
+++ b/services/web/scripts/delete_orphaned_docs_online_check.mjs
@@ -8,6 +8,7 @@ import {
 } from '../app/src/infrastructure/mongodb.js'
 import { promiseMapWithLimit } from '@overleaf/promise-utils'
 import DeleteOrphanedDataHelper from './delete_orphaned_data_helper.mjs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 const sleep = promisify(setTimeout)
@@ -170,7 +171,7 @@ async function letUserDoubleCheckInputs() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/disconnect_all_users.mjs b/services/web/scripts/disconnect_all_users.mjs
index 41736ac69f..f8e43ad849 100644
--- a/services/web/scripts/disconnect_all_users.mjs
+++ b/services/web/scripts/disconnect_all_users.mjs
@@ -3,6 +3,7 @@ import Settings from '@overleaf/settings'
 import AdminController from '../app/src/Features/ServerAdmin/AdminController.js'
 import minimist from 'minimist'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const args = minimist(process.argv.slice(2), {
   string: ['confirm-site-url', 'delay-in-seconds'],
@@ -60,7 +61,7 @@ async function main() {
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     console.error('Done.')
     process.exit(0)
   } catch (error) {
diff --git a/services/web/scripts/e2e_test_setup.mjs b/services/web/scripts/e2e_test_setup.mjs
index 7f0e8e3fef..4d529ccfe9 100644
--- a/services/web/scripts/e2e_test_setup.mjs
+++ b/services/web/scripts/e2e_test_setup.mjs
@@ -9,6 +9,7 @@ import ProjectDeleter from '../app/src/Features/Project/ProjectDeleter.js'
 import SplitTestManager from '../app/src/Features/SplitTests/SplitTestManager.js'
 import UserDeleter from '../app/src/Features/User/UserDeleter.js'
 import UserRegistrationHandler from '../app/src/Features/User/UserRegistrationHandler.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const MONOREPO = Path.dirname(
   Path.dirname(Path.dirname(Path.dirname(fileURLToPath(import.meta.url))))
@@ -158,7 +159,7 @@ async function main() {
   await provisionSplitTests()
 }
 
-await main()
+await scriptRunner(main)
 await GracefulShutdown.gracefulShutdown(
   {
     close(cb) {
diff --git a/services/web/scripts/example/track_progress.mjs b/services/web/scripts/example/track_progress.mjs
new file mode 100644
index 0000000000..531eb877a6
--- /dev/null
+++ b/services/web/scripts/example/track_progress.mjs
@@ -0,0 +1,31 @@
+// Import the script runner utility (adjust the path as needed)
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
+
+const subJobs = 30
+
+/**
+ * Your script's main work goes here.
+ * It must be an async function and accept `trackProgress`.
+ * @param {(message: string) => Promise<void>} trackProgress - Call this to log progress.
+ */
+async function main(trackProgress) {
+  for (let i = 0; i < subJobs; i++) {
+    await new Promise(resolve => setTimeout(() => resolve(), 1000))
+    await trackProgress(`Job in progress ${i + 1}/${subJobs}`)
+  }
+  await trackProgress('Job finished')
+}
+
+// Define any variables your script needs (optional)
+const scriptVariables = {
+  subJobs,
+}
+
+// --- Execute the script using the runner with async/await ---
+try {
+  await scriptRunner(main, scriptVariables)
+  process.exit()
+} catch (error) {
+  console.error(error)
+  process.exit(1)
+}
diff --git a/services/web/scripts/find_malformed_filetrees.mjs b/services/web/scripts/find_malformed_filetrees.mjs
index 25b4a77a59..2614c7d622 100644
--- a/services/web/scripts/find_malformed_filetrees.mjs
+++ b/services/web/scripts/find_malformed_filetrees.mjs
@@ -1,6 +1,7 @@
 // @ts-check
 import { db, ObjectId } from '../app/src/infrastructure/mongodb.js'
 import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 /**
  * @typedef {Object} Doc
@@ -30,7 +31,12 @@ import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
  * @property {Array<Folder>} rootFolder
  */
 
-async function main() {
+/**
+ * @param {(progress: string) => Promise<void>} trackProgress
+ * @returns {Promise<void>}
+ * @async
+ */
+async function main(trackProgress) {
   let projectsProcessed = 0
   await batchedUpdate(
     db.projects,
@@ -59,7 +65,9 @@ async function main() {
         }
       }
     },
-    { _id: 1, rootFolder: 1 }
+    { _id: 1, rootFolder: 1 },
+    undefined,
+    { trackProgress }
   )
 }
 
@@ -161,7 +169,7 @@ function* findBadPaths(folder) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/fix_collaborator_refs_null.mjs b/services/web/scripts/fix_collaborator_refs_null.mjs
new file mode 100644
index 0000000000..062662a5f8
--- /dev/null
+++ b/services/web/scripts/fix_collaborator_refs_null.mjs
@@ -0,0 +1,175 @@
+import minimist from 'minimist'
+import {
+  db,
+  ObjectId,
+  READ_PREFERENCE_SECONDARY,
+} from '../app/src/infrastructure/mongodb.js'
+import lodash from 'lodash'
+
+const args = minimist(process.argv.slice(2), {
+  boolean: ['commit'],
+})
+
+const run = async () => {
+  try {
+    const projects = await db.projectAuditLogEntries
+      .find(
+        {
+          operation: 'collaborator-limit-exceeded',
+          timestamp: {
+            $gte: new Date('2025-03-26'),
+            $lt: new Date('2025-04-02'),
+          },
+        },
+        {
+          readPreference: READ_PREFERENCE_SECONDARY,
+          projection: {
+            _id: 1,
+            projectId: 1,
+          },
+        }
+      )
+      .toArray()
+
+    const uniqueProjectIds = lodash.uniq(
+      projects.map(p => p.projectId.toString())
+    )
+
+    console.log(
+      `Found ${uniqueProjectIds.length} projects where collaborator-limit-exceeded operation was logged in provided date range`
+    )
+
+    let readOnlyCount = 0
+    let pendingReviewerCount = 0
+    let reviewerCount = 0
+
+    for (const projectId of uniqueProjectIds) {
+      if (args.commit) {
+        const readOnlyUpdate = await db.projects.updateOne(
+          {
+            _id: new ObjectId(projectId),
+            readOnly_refs: null,
+          },
+          {
+            $set: {
+              readOnly_refs: [],
+            },
+          }
+        )
+        if (readOnlyUpdate.modifiedCount > 0) {
+          console.log(`Updated readOnly_refs for project id ${projectId}`)
+        }
+        readOnlyCount += readOnlyUpdate.modifiedCount
+      } else {
+        const project = await db.projects.findOne(
+          {
+            _id: new ObjectId(projectId),
+            readOnly_refs: null,
+          },
+          {
+            projection: {
+              _id: 1,
+              readOnly_refs: 1,
+            },
+          }
+        )
+        if (project) {
+          readOnlyCount++
+          console.log(
+            `Dry run: Would update readOnly_refs for project id ${projectId}`
+          )
+        }
+      }
+
+      if (args.commit) {
+        const pendingReviewerUpdate = await db.projects.updateOne(
+          {
+            _id: new ObjectId(projectId),
+            pendingReviewer_refs: null,
+          },
+          {
+            $set: {
+              pendingReviewer_refs: [],
+            },
+          }
+        )
+        if (pendingReviewerUpdate.modifiedCount > 0) {
+          console.log(
+            `Updated pendingReviewer_refs for project id ${projectId}`
+          )
+        }
+        pendingReviewerCount += pendingReviewerUpdate.modifiedCount
+      } else {
+        const project = await db.projects.findOne(
+          {
+            _id: new ObjectId(projectId),
+            pendingReviewer_refs: null,
+          },
+          {
+            projection: {
+              _id: 1,
+              pendingReviewer_refs: 1,
+            },
+          }
+        )
+        if (project) {
+          pendingReviewerCount++
+          console.log(
+            `Dry run: Would update pendingReviewer_refs for project id ${projectId}`
+          )
+        }
+      }
+
+      if (args.commit) {
+        const reviewerUpdate = await db.projects.updateOne(
+          {
+            _id: new ObjectId(projectId),
+            reviewer_refs: null,
+          },
+          {
+            $set: {
+              reviewer_refs: [],
+            },
+          }
+        )
+        reviewerCount += reviewerUpdate.modifiedCount
+      } else {
+        const project = await db.projects.findOne(
+          {
+            _id: new ObjectId(projectId),
+            reviewer_refs: null,
+          },
+          {
+            projection: {
+              _id: 1,
+              reviewer_refs: 1,
+            },
+          }
+        )
+        if (project) {
+          reviewerCount++
+          console.log(
+            `Dry run: Would update reviewer_refs for project id ${projectId}`
+          )
+        }
+      }
+    }
+
+    if (args.commit) {
+      console.log(
+        `Updated readOnly_refs for ${readOnlyCount} projects, pendingReviewer_refs for ${pendingReviewerCount} projects, and reviewer_refs for ${reviewerCount} projects.`
+      )
+    } else {
+      console.log(
+        `Dry run: Would update readOnly_refs for ${readOnlyCount} projects, pendingReviewer_refs for ${pendingReviewerCount} projects, and reviewer_refs for ${reviewerCount} projects.`
+      )
+    }
+
+    process.exit(0)
+  } catch (err) {
+    console.error('Error while processing projects:', err)
+    process.exit(1)
+  }
+}
+
+run()
diff --git a/services/web/scripts/fix_group_invite_emails_to_lowercase.mjs b/services/web/scripts/fix_group_invite_emails_to_lowercase.mjs
index 83024be6e5..a9bc0636d7 100644
--- a/services/web/scripts/fix_group_invite_emails_to_lowercase.mjs
+++ b/services/web/scripts/fix_group_invite_emails_to_lowercase.mjs
@@ -1,5 +1,6 @@
 import { db } from '../app/src/infrastructure/mongodb.js'
 import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const DRY_RUN = process.env.DRY_RUN !== 'false'
 
@@ -44,7 +45,7 @@ async function processBatch(subscriptions) {
   }
 }
 
-async function main() {
+async function main(trackProgress) {
   const projection = {
     _id: 1,
     teamInvites: 1,
@@ -54,11 +55,18 @@ async function main() {
       $exists: true,
     },
   }
-  await batchedUpdate(db.subscriptions, query, processBatch, projection)
+  await batchedUpdate(
+    db.subscriptions,
+    query,
+    processBatch,
+    projection,
+    undefined,
+    { trackProgress }
+  )
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/fix_malformed_filetree.mjs b/services/web/scripts/fix_malformed_filetree.mjs
index 491da4762d..ff838d15c6 100644
--- a/services/web/scripts/fix_malformed_filetree.mjs
+++ b/services/web/scripts/fix_malformed_filetree.mjs
@@ -8,13 +8,17 @@
  */
 import mongodb from 'mongodb-legacy'
 import { db } from '../app/src/infrastructure/mongodb.js'
-import ProjectLocator from '../app/src/Features/Project/ProjectLocator.js'
+import ProjectLocator, {
+  findDeep,
+} from '../app/src/Features/Project/ProjectLocator.js'
 import minimist from 'minimist'
 import readline from 'node:readline'
 import fs from 'node:fs'
 import logger from '@overleaf/logger'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
+const lastUpdated = new Date()
 
 const argv = minimist(process.argv.slice(2), {
   string: ['logs'],
@@ -72,7 +76,7 @@ async function processBadPath(projectId, mongoPath, _id) {
   if (isRootFolder(mongoPath)) {
     modifiedCount = await fixRootFolder(projectId)
   } else if (isArrayElement(mongoPath)) {
-    modifiedCount = await removeNulls(projectId, parentPath(mongoPath))
+    modifiedCount = await removeNulls(projectId, _id)
   } else if (isArray(mongoPath)) {
     modifiedCount = await fixArray(projectId, mongoPath)
   } else if (isFolderId(mongoPath)) {
@@ -83,7 +87,7 @@ async function processBadPath(projectId, mongoPath, _id) {
       parentPath(parentPath(mongoPath))
     )
   } else if (isName(mongoPath)) {
-    modifiedCount = await fixName(projectId, mongoPath)
+    modifiedCount = await fixName(projectId, _id)
   } else if (isHash(mongoPath)) {
     console.error(`Missing file hash: ${projectId}/${_id} (${mongoPath})`)
     console.error('SaaS: likely needs filestore restore')
@@ -155,6 +159,8 @@ async function fixRootFolder(projectId) {
             fileRefs: [],
           },
         ],
+        lastUpdated,
+        lastUpdatedBy: null, // unset lastUpdatedBy
       },
     }
   )
@@ -164,10 +170,30 @@ async function fixRootFolder(projectId) {
 /**
  * Remove all nulls from the given docs/files/folders array
  */
-async function removeNulls(projectId, path) {
+async function removeNulls(projectId, _id) {
+  if (!_id) {
+    throw new Error('missing _id')
+  }
+  const project = await db.projects.findOne(
+    { _id: new ObjectId(projectId) },
+    { projection: { rootFolder: 1 } }
+  )
+  const foundResult = findDeep(project, obj => obj?._id?.toString() === _id)
+  if (!foundResult) return
+  const { path } = foundResult
   const result = await db.projects.updateOne(
-    { _id: new ObjectId(projectId), [path]: { $type: 'array' } },
-    { $pull: { [path]: null } }
+    { _id: new ObjectId(projectId) },
+    {
+      $pull: {
+        [`${path}.folders`]: null,
+        [`${path}.docs`]: null,
+        [`${path}.fileRefs`]: null,
+      },
+      $set: {
+        lastUpdated,
+        lastUpdatedBy: null, // unset lastUpdatedBy
+      },
+    }
   )
   return result.modifiedCount
 }
@@ -178,7 +204,7 @@ async function removeNulls(projectId, path) {
 async function fixArray(projectId, path) {
   const result = await db.projects.updateOne(
     { _id: new ObjectId(projectId), [path]: { $not: { $type: 'array' } } },
-    { $set: { [path]: [] } }
+    { $set: { [path]: [], lastUpdated, lastUpdatedBy: null } }
   )
   return result.modifiedCount
 }
@@ -189,7 +215,13 @@ async function fixArray(projectId, path) {
 async function fixFolderId(projectId, path) {
   const result = await db.projects.updateOne(
     { _id: new ObjectId(projectId), [path]: { $exists: false } },
-    { $set: { [path]: new ObjectId() } }
+    {
+      $set: {
+        [path]: new ObjectId(),
+        lastUpdated,
+        lastUpdatedBy: null, // unset lastUpdatedBy
+      },
+    }
   )
   return result.modifiedCount
 }
@@ -200,7 +232,13 @@ async function fixFolderId(projectId, path) {
 async function removeElementsWithoutIds(projectId, path) {
   const result = await db.projects.updateOne(
     { _id: new ObjectId(projectId), [path]: { $type: 'array' } },
-    { $pull: { [path]: { _id: null } } }
+    {
+      $pull: { [path]: { _id: null } },
+      $set: {
+        lastUpdated,
+        lastUpdatedBy: null, // unset lastUpdatedBy
+      },
+    }
   )
   return result.modifiedCount
 }
@@ -208,19 +246,32 @@ async function removeElementsWithoutIds(projectId, path) {
 /**
  * Give a name to a file/doc/folder that doesn't have one
  */
-async function fixName(projectId, path) {
+async function fixName(projectId, _id) {
+  if (!_id) {
+    throw new Error('missing _id')
+  }
   const project = await db.projects.findOne(
     { _id: new ObjectId(projectId) },
     { projection: { rootFolder: 1 } }
   )
-  const arrayPath = parentPath(parentPath(path))
-  const array = ProjectLocator.findElementByMongoPath(project, arrayPath)
-  const existingNames = new Set(array.map(x => x.name))
+  const foundResult = findDeep(project, obj => obj?._id?.toString() === _id)
+  if (!foundResult) return
+  const { path } = foundResult
+  const array = ProjectLocator.findElementByMongoPath(project, parentPath(path))
   const name =
-    path === 'rootFolder.0.name' ? 'rootFolder' : findUniqueName(existingNames)
+    path === 'rootFolder.0'
+      ? 'rootFolder'
+      : findUniqueName(new Set(array.map(x => x?.name)))
+  const pathToName = `${path}.name`
   const result = await db.projects.updateOne(
-    { _id: new ObjectId(projectId), [path]: { $in: [null, ''] } },
-    { $set: { [path]: name } }
+    { _id: new ObjectId(projectId), [pathToName]: { $in: [null, ''] } },
+    {
+      $set: {
+        [pathToName]: name,
+        lastUpdated,
+        lastUpdatedBy: null, // unset lastUpdatedBy
+      },
+    }
   )
   return result.modifiedCount
 }
@@ -237,7 +288,7 @@ function findUniqueName(existingFilenames) {
 
 try {
   try {
-    await main()
+    await scriptRunner(main)
   } finally {
     logStats()
   }
diff --git a/services/web/scripts/fix_oversized_docs.mjs b/services/web/scripts/fix_oversized_docs.mjs
index 07f66a76cf..1fe7b8337a 100644
--- a/services/web/scripts/fix_oversized_docs.mjs
+++ b/services/web/scripts/fix_oversized_docs.mjs
@@ -8,6 +8,7 @@ import ProjectEntityMongoUpdateHandler from '../app/src/Features/Project/Project
 import ProjectLocator from '../app/src/Features/Project/ProjectLocator.js'
 import RedisWrapper from '@overleaf/redis-wrapper'
 import Settings from '@overleaf/settings'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const opts = parseArgs()
 const redis = RedisWrapper.createClient(Settings.redis.web)
@@ -76,7 +77,8 @@ async function processDoc(projectId, docId) {
       await ProjectEntityMongoUpdateHandler.promises.replaceDocWithFile(
         new ObjectId(projectId),
         new ObjectId(docId),
-        fileRef
+        fileRef,
+        null // unset lastUpdatedBy
       )
       await deleteDocFromMongo(projectId, doc)
       await deleteDocFromRedis(projectId, docId)
@@ -154,7 +156,7 @@ async function deleteDocFromRedis(projectId, docId) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/force_doc_flush.mjs b/services/web/scripts/force_doc_flush.mjs
index 399816e859..b6791710b0 100644
--- a/services/web/scripts/force_doc_flush.mjs
+++ b/services/web/scripts/force_doc_flush.mjs
@@ -1,6 +1,7 @@
 import mongodb from 'mongodb-legacy'
 import { db } from '../app/src/infrastructure/mongodb.js'
 import DocumentUpdaterHandler from '../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 const PROJECT_ID = process.env.PROJECT_ID
@@ -67,7 +68,7 @@ function getDocument() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/history/clean_sl_history_data.mjs b/services/web/scripts/history/clean_sl_history_data.mjs
index 0f8e93661a..8f2bc1eab0 100644
--- a/services/web/scripts/history/clean_sl_history_data.mjs
+++ b/services/web/scripts/history/clean_sl_history_data.mjs
@@ -1,5 +1,9 @@
-import { db } from '../../app/src/infrastructure/mongodb.js'
+import {
+  db,
+  getCollectionInternal,
+} from '../../app/src/infrastructure/mongodb.js'
 import { ensureMongoTimeout } from '../helpers/env_variable_helper.mjs'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 // Ensure default mongo query timeout has been increased 1h
 if (!process.env.MONGO_SOCKET_TIMEOUT) {
   ensureMongoTimeout(360000)
@@ -46,7 +50,10 @@ async function setAllowDowngradeToFalse() {
 async function deleteHistoryCollections() {
   await gracefullyDropCollection(db.docHistory)
   await gracefullyDropCollection(db.docHistoryIndex)
-  await gracefullyDropCollection(db.projectHistoryMetaData)
+  const projectHistoryMetaData = await getCollectionInternal(
+    'projectHistoryMetaData'
+  )
+  await gracefullyDropCollection(projectHistoryMetaData)
 }
 
 async function gracefullyDropCollection(collection) {
@@ -66,7 +73,7 @@ async function gracefullyDropCollection(collection) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (err) {
   console.error(err)
   process.exit(1)
diff --git a/services/web/scripts/history/migrate_ranges_support.mjs b/services/web/scripts/history/migrate_ranges_support.mjs
index f62628f9ad..d0bde55a0b 100644
--- a/services/web/scripts/history/migrate_ranges_support.mjs
+++ b/services/web/scripts/history/migrate_ranges_support.mjs
@@ -1,5 +1,6 @@
 import HistoryRangesSupportMigration from '../../app/src/Features/History/HistoryRangesSupportMigration.mjs'
 import minimist from 'minimist'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 async function main() {
   const {
@@ -111,7 +112,7 @@ function arrayOpt(value) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/learn/checkSanitize/index.mjs b/services/web/scripts/learn/checkSanitize/index.mjs
index 1c608cb2fe..55ad2caa38 100644
--- a/services/web/scripts/learn/checkSanitize/index.mjs
+++ b/services/web/scripts/learn/checkSanitize/index.mjs
@@ -1,6 +1,7 @@
 import checkSanitizeOptions from './checkSanitizeOptions.mjs'
 import Scrape from './scrape.mjs'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from '../../lib/ScriptRunner.mjs'
 
 const { getAllPagesAndCache, scrapeAndCachePage } = Scrape
 
@@ -32,7 +33,7 @@ async function main() {
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     process.exit(0)
   } catch (error) {
     console.error(error)
diff --git a/services/web/scripts/lib/README.md b/services/web/scripts/lib/README.md
new file mode 100644
index 0000000000..8dae2db07f
--- /dev/null
+++ b/services/web/scripts/lib/README.md
@@ -0,0 +1,55 @@
+# Script Runner
+
+## Overview
+
+The Script Runner wraps your script's main logic to automatically handle logging, status tracking (success/error), and progress updates. Script execution status can be viewed from "Script Logs" portal page.
+
+## Features
+
+- Automatically logs the start and end of your script.
+- Records the final status ('success' or 'error').
+- Provides a simple function (`trackProgress`) to your script for logging custom progress steps.
+- Captures script parameters and basic environment details.
+
+## Usage
+
+1.  **Import `scriptRunner`**.
+2.  **Define your script's main logic** as an `async` function that accepts `trackProgress` as its argument (can ignore `trackProgress` if you don't need to track progress).
+3.  **Call `scriptRunner`**, passing your function and any variables it needs.
+4.  **Check script execution status** by visiting the "Script Logs" portal page using the URL printed in the console output.
+
+**Example:**
+
+```javascript
+// Import the script runner utility (adjust the path as needed)
+import { scriptRunner } from './lib/ScriptRunner.mjs'
+
+const subJobs = 30
+
+/**
+ * Your script's main work goes here.
+ * It must be an async function and accept `trackProgress`.
+ * @param {(message: string) => void} trackProgress - Call this to log progress.
+ */
+async function main(trackProgress) {
+  for (let i = 0; i < subJobs; i++) {
+    await new Promise(resolve => setTimeout(() => resolve(), 1000))
+    await trackProgress(`Job in progress ${i + 1}/${subJobs}`)
+  }
+  await trackProgress('Job finished')
+}
+
+// Define any variables your script needs (optional)
+const scriptVariables = {
+  subJobs,
+}
+
+// --- Execute the script using the runner with async/await ---
+try {
+  await scriptRunner(main, scriptVariables)
+  process.exit()
+} catch (error) {
+  console.error(error)
+  process.exit(1)
+}
+```
diff --git a/services/web/scripts/lib/ScriptRunner.mjs b/services/web/scripts/lib/ScriptRunner.mjs
new file mode 100644
index 0000000000..478a71815b
--- /dev/null
+++ b/services/web/scripts/lib/ScriptRunner.mjs
@@ -0,0 +1,80 @@
+import { ScriptLog } from '../../app/src/models/ScriptLog.mjs'
+import Settings from '@overleaf/settings'
+
+const UNKNOWN = 'unknown'
+
+async function beforeScriptExecution(canonicalName, vars, scriptPath) {
+  let log = new ScriptLog({
+    canonicalName,
+    filePathAtVersion: scriptPath,
+    podName: process.env.OL_POD_NAME ?? UNKNOWN,
+    username: process.env.OL_USERNAME ?? UNKNOWN,
+    imageVersion: process.env.OL_IMAGE_VERSION ?? UNKNOWN,
+    vars,
+  })
+  log = await log.save()
+  // Print Script Log link if ran by a user
+  if (process.env.OL_USERNAME) {
+    console.log(
+      '\n==================================' +
+        '\n✨ Your script is running!' +
+        '\n📊 Track progress at:' +
+        `\n${Settings.adminUrl}/admin/script-log/${log._id}` +
+        '\n==================================\n'
+    )
+  }
+  return log._id
+}
+
+async function afterScriptExecution(logId, status) {
+  await ScriptLog.findByIdAndUpdate(logId, { status, endTime: new Date() })
+}
+
+/**
+ * @param {(trackProgress: (progress: string) => Promise<void>) => Promise<any>} main - Main function for the script
+ * @param {Object} vars - Variables to be used in the script
+ * @param {string} canonicalName - The canonical name of the script, default to filename
+ * @param {string} scriptPath - The file path of the script, default to process.argv[1]
+ * @returns {Promise<void>}
+ * @async
+ */
+export async function scriptRunner(
+  main,
+  vars = {},
+  canonicalName = process.argv[1].split('/').pop().split('.')[0],
+  scriptPath = process.argv[1]
+) {
+  const isSaaS = Boolean(Settings.overleaf)
+  if (!isSaaS) {
+    await main(async message => {
+      console.warn(message)
+    })
+    return
+  }
+  const logId = await beforeScriptExecution(canonicalName, vars, scriptPath)
+
+  async function trackProgress(message) {
+    try {
+      console.warn(message)
+      await ScriptLog.findByIdAndUpdate(logId, {
+        $push: {
+          progressLogs: {
+            timestamp: new Date(),
+            message,
+          },
+        },
+      })
+    } catch (error) {
+      console.error('Error tracking progress:', error)
+    }
+  }
+
+  try {
+    await main(trackProgress)
+  } catch (error) {
+    await afterScriptExecution(logId, 'error')
+    throw error
+  }
+
+  await afterScriptExecution(logId, 'success')
+}
diff --git a/services/web/scripts/lowercase_institution_user_ids.mjs b/services/web/scripts/lowercase_institution_user_ids.mjs
index e670d10615..e72bff87ef 100644
--- a/services/web/scripts/lowercase_institution_user_ids.mjs
+++ b/services/web/scripts/lowercase_institution_user_ids.mjs
@@ -2,6 +2,7 @@ import { db } from '../app/src/infrastructure/mongodb.js'
 import minimist from 'minimist'
 import UserGetter from '../app/src/Features/User/UserGetter.js'
 import fs from 'node:fs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 function usage() {
   console.log(
@@ -112,7 +113,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/merge_group_subscription_members.mjs b/services/web/scripts/merge_group_subscription_members.mjs
index 0d4d6acb6c..d8201c95ea 100644
--- a/services/web/scripts/merge_group_subscription_members.mjs
+++ b/services/web/scripts/merge_group_subscription_members.mjs
@@ -10,6 +10,7 @@ import { db, ObjectId } from '../app/src/infrastructure/mongodb.js'
 
 import SubscriptionUpdater from '../app/src/Features/Subscription/SubscriptionUpdater.js'
 import minimist from 'minimist'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 const argv = minimist(process.argv.slice(2), {
   string: ['target', 'source'],
   boolean: ['commit'],
@@ -93,7 +94,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.error('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/migrate_audit_logs.mjs b/services/web/scripts/migrate_audit_logs.mjs
index 558c20cd06..9591275fca 100644
--- a/services/web/scripts/migrate_audit_logs.mjs
+++ b/services/web/scripts/migrate_audit_logs.mjs
@@ -3,10 +3,11 @@ import { promiseMapWithLimit, promisify } from '@overleaf/promise-utils'
 import { db, ObjectId } from '../app/src/infrastructure/mongodb.js'
 import _ from 'lodash'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const sleep = promisify(setTimeout)
 
-async function main(options) {
+async function main(options, trackProgress) {
   if (!options) {
     options = {}
   }
@@ -54,7 +55,9 @@ async function main(options) {
         async users => {
           await processUsersBatch(users, options)
         },
-        { _id: 1, auditLog: 1 }
+        { _id: 1, auditLog: 1 },
+        undefined,
+        { trackProgress }
       )
     }
 
@@ -67,7 +70,9 @@ async function main(options) {
       async projects => {
         await processProjectsBatch(projects, options)
       },
-      { _id: 1, auditLog: 1 }
+      { _id: 1, auditLog: 1 },
+      undefined,
+      { trackProgress }
     )
   }
 }
@@ -152,7 +157,9 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(
+      async trackProgress => await main(undefined, trackProgress)
+    )
     console.log('Done.')
     process.exit(0)
   } catch (error) {
diff --git a/services/web/scripts/oauth/backfill_hashed_secrets.mjs b/services/web/scripts/oauth/backfill_hashed_secrets.mjs
index e3352ea932..6e0f8c66e9 100644
--- a/services/web/scripts/oauth/backfill_hashed_secrets.mjs
+++ b/services/web/scripts/oauth/backfill_hashed_secrets.mjs
@@ -3,6 +3,7 @@ import {
   READ_PREFERENCE_SECONDARY,
 } from '../../app/src/infrastructure/mongodb.js'
 import { hashSecret } from '../../modules/oauth2-server/app/src/SecretsHelper.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 async function main() {
   console.log('Hashing client secrets...')
@@ -35,7 +36,7 @@ async function hashSecrets(collection, field) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/oauth/create_token.mjs b/services/web/scripts/oauth/create_token.mjs
index cf833e1be2..4d43981a19 100644
--- a/services/web/scripts/oauth/create_token.mjs
+++ b/services/web/scripts/oauth/create_token.mjs
@@ -1,6 +1,7 @@
 import minimist from 'minimist'
 import { db } from '../../app/src/infrastructure/mongodb.js'
 import { hashSecret } from '../../modules/oauth2-server/app/src/SecretsHelper.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 async function main() {
   const opts = parseArgs()
@@ -88,7 +89,7 @@ Options:
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/oauth/register_client.mjs b/services/web/scripts/oauth/register_client.mjs
index 6f14ae1230..65248f3464 100644
--- a/services/web/scripts/oauth/register_client.mjs
+++ b/services/web/scripts/oauth/register_client.mjs
@@ -2,6 +2,7 @@ import minimist from 'minimist'
 import mongodb from 'mongodb-legacy'
 import { db } from '../../app/src/infrastructure/mongodb.js'
 import { hashSecret } from '../../modules/oauth2-server/app/src/SecretsHelper.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -16,10 +17,6 @@ async function main() {
       console.error('Missing --name option')
       process.exit(1)
     }
-    if (opts.secret == null) {
-      console.error('Missing --secret option')
-      process.exit(1)
-    }
   } else {
     console.log(`Updating configuration for client: ${application.name}`)
     if (opts.mongoId != null) {
@@ -38,31 +35,45 @@ async function upsertApplication(opts) {
   const key = { id: opts.id }
   const defaults = {}
   const updates = {}
+
   if (opts.name != null) {
     updates.name = opts.name
   }
+
   if (opts.secret != null) {
     updates.clientSecret = hashSecret(opts.secret)
   }
+
   if (opts.grants != null) {
     updates.grants = opts.grants
   } else {
     defaults.grants = []
   }
+
   if (opts.scopes != null) {
     updates.scopes = opts.scopes
   } else {
     defaults.scopes = []
   }
+
   if (opts.redirectUris != null) {
     updates.redirectUris = opts.redirectUris
   } else {
     defaults.redirectUris = []
   }
+
   if (opts.mongoId != null) {
     defaults._id = new ObjectId(opts.mongoId)
   }
 
+  if (opts.enablePkce) {
+    updates.pkceEnabled = true
+  }
+
+  if (opts.disablePkce) {
+    updates.pkceEnabled = false
+  }
+
   await db.oauthApplications.updateOne(
     key,
     {
@@ -75,17 +86,24 @@ async function upsertApplication(opts) {
 
 function parseArgs() {
   const args = minimist(process.argv.slice(2), {
-    boolean: ['help'],
+    boolean: ['help', 'enable-pkce', 'disable-pkce'],
   })
+
   if (args.help) {
     usage()
     process.exit(0)
   }
+
   if (args._.length !== 1) {
     usage()
     process.exit(1)
   }
 
+  if (args['enable-pkce'] && args['disable-pkce']) {
+    console.error('Options --enable-pkce and --disable-pkce are exclusive')
+    process.exit(1)
+  }
+
   return {
     id: args._[0],
     mongoId: args['mongo-id'],
@@ -94,6 +112,8 @@ function parseArgs() {
     scopes: toArray(args.scope),
     grants: toArray(args.grant),
     redirectUris: toArray(args['redirect-uri']),
+    enablePkce: args['enable-pkce'],
+    disablePkce: args['disable-pkce'],
   }
 }
 
@@ -104,11 +124,13 @@ Creates or updates an OAuth client configuration
 
 Options:
     --name            Descriptive name for the OAuth client (required for creation)
-    --secret          Client secret (required for creation)
+    --secret          Client secret
     --scope           Accepted scope (can be given more than once)
     --grant           Accepted grant type (can be given more than once)
     --redirect-uri    Accepted redirect URI (can be given more than once)
     --mongo-id        Mongo ID to use if the configuration is created (optional)
+    --enable-pkce     Enable PKCE
+    --disable-pkce    Disable PKCE
 `)
 }
 
@@ -121,7 +143,7 @@ function toArray(value) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/oauth/remove_client.mjs b/services/web/scripts/oauth/remove_client.mjs
index 700c19ac70..24080491b2 100644
--- a/services/web/scripts/oauth/remove_client.mjs
+++ b/services/web/scripts/oauth/remove_client.mjs
@@ -3,6 +3,7 @@ import {
   db,
   READ_PREFERENCE_SECONDARY,
 } from '../../app/src/infrastructure/mongodb.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 async function main() {
   const opts = parseArgs()
@@ -113,7 +114,7 @@ Options:
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/oauth/upgrade_token_scopes.mjs b/services/web/scripts/oauth/upgrade_token_scopes.mjs
new file mode 100644
index 0000000000..f28417c1ec
--- /dev/null
+++ b/services/web/scripts/oauth/upgrade_token_scopes.mjs
@@ -0,0 +1,75 @@
+import minimist from 'minimist'
+import { db } from '../../app/src/infrastructure/mongodb.js'
+
+const OPTS = parseArgs()
+
+function parseArgs() {
+  const args = minimist(process.argv.slice(2), {
+    boolean: ['help', 'commit'],
+  })
+  if (args.help) {
+    usage()
+    process.exit(0)
+  }
+
+  if (args._.length === 0) {
+    usage()
+    process.exit(1)
+  }
+
+  return {
+    appIds: args._,
+    commit: args.commit,
+  }
+}
+
+function usage() {
+  console.error(`Usage: updgrade_token_scopes.mjs [--commit] APP_ID ...
+
+  This script will upgrade all existing OAuth tokens for the given app(s) so
+  that their scope matches the scope configured on the app.
+
+  USE WITH CAUTION: any token with limited scope previously issued will be
+  upgraded to support all scopes available to the app.
+  `)
+}
+
+async function main() {
+  for (const appId of OPTS.appIds) {
+    const app = await db.oauthApplications.findOne({ id: appId })
+    if (app == null) {
+      console.error(`App "${appId}" not found. Skipping.`)
+      continue
+    }
+
+    const expectedScope = (app.scopes ?? []).join(' ')
+
+    const filter = {
+      oauthApplication_id: app._id,
+      scope: { $ne: expectedScope },
+    }
+    if (OPTS.commit) {
+      const result = await db.oauthAccessTokens.updateMany(filter, {
+        $set: { scope: expectedScope },
+      })
+      console.error(
+        `App "${appId}": upgraded ${result.modifiedCount} access tokens`
+      )
+    } else {
+      const count = await db.oauthAccessTokens.count(filter)
+      console.error(`App "${appId}": would upgrade ${count} access tokens`)
+    }
+  }
+
+  if (!OPTS.commit) {
+    console.error('This was a dry run. Re-run with --commit to apply changes')
+  }
+}
+
+try {
+  await main()
+  process.exit(0)
+} catch (error) {
+  console.error(error)
+  process.exit(1)
+}
diff --git a/services/web/scripts/plan-prices/plans.mjs b/services/web/scripts/plan-prices/plans.mjs
index 122b2c5683..6d67214d11 100644
--- a/services/web/scripts/plan-prices/plans.mjs
+++ b/services/web/scripts/plan-prices/plans.mjs
@@ -64,11 +64,6 @@ const currencies = [
   'USD',
 ]
 
-/**
- * This is duplicated in:
- *   - services/web/app/src/Features/Subscription/SubscriptionHelper.js
- *   - services/web/modules/subscriptions/frontend/js/pages/plans-new-design/group-member-picker/group-plan-pricing.js
- */
 function roundUpToNearest5Cents(number) {
   return Math.ceil(number * 20) / 20
 }
diff --git a/services/web/scripts/recover_docs_from_redis.mjs b/services/web/scripts/recover_docs_from_redis.mjs
index ad69b5469f..85709b471b 100644
--- a/services/web/scripts/recover_docs_from_redis.mjs
+++ b/services/web/scripts/recover_docs_from_redis.mjs
@@ -8,6 +8,7 @@ import ProjectEntityRestoreHandler from '../app/src/Features/Project/ProjectEnti
 import RedisWrapper from '@overleaf/redis-wrapper'
 import Settings from '@overleaf/settings'
 import logger from '@overleaf/logger'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 const opts = parseArgs()
 const redis = RedisWrapper.createClient(Settings.redis.web)
 
@@ -173,7 +174,7 @@ async function deleteDocFromRedis(projectId, docId) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/recurly/change_prices_at_renewal.mjs b/services/web/scripts/recurly/change_prices_at_renewal.mjs
index ad891f1b9d..53016acc7d 100644
--- a/services/web/scripts/recurly/change_prices_at_renewal.mjs
+++ b/services/web/scripts/recurly/change_prices_at_renewal.mjs
@@ -4,6 +4,7 @@ import * as csv from 'csv'
 import minimist from 'minimist'
 import recurly from 'recurly'
 import Settings from '@overleaf/settings'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const recurlyClient = new recurly.Client(Settings.apis.recurly.apiKey)
 
@@ -223,7 +224,7 @@ class ReportError extends Error {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/recurly/collect_paypal_past_due_invoice.mjs b/services/web/scripts/recurly/collect_paypal_past_due_invoice.mjs
index b735ea17ed..2bf827bae8 100644
--- a/services/web/scripts/recurly/collect_paypal_past_due_invoice.mjs
+++ b/services/web/scripts/recurly/collect_paypal_past_due_invoice.mjs
@@ -2,6 +2,7 @@ import RecurlyWrapper from '../../app/src/Features/Subscription/RecurlyWrapper.j
 import minimist from 'minimist'
 import logger from '@overleaf/logger'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const waitMs =
   fileURLToPath(import.meta.url) === process.argv[1]
@@ -119,7 +120,7 @@ const main = async () => {
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     logger.info('Done.')
     process.exit(0)
   } catch (error) {
diff --git a/services/web/scripts/recurly/generate_addon_prices.mjs b/services/web/scripts/recurly/generate_addon_prices.mjs
index 9885d46b06..6ae9d1846d 100644
--- a/services/web/scripts/recurly/generate_addon_prices.mjs
+++ b/services/web/scripts/recurly/generate_addon_prices.mjs
@@ -1,6 +1,7 @@
 // @ts-check
 import settings from '@overleaf/settings'
 import recurly from 'recurly'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const ADD_ON_CODE = process.argv[2]
 
@@ -37,6 +38,8 @@ async function main() {
       localizedAddOnsPricing[currency] = { [ADD_ON_CODE]: {} }
     }
     localizedAddOnsPricing[currency][ADD_ON_CODE].annual = unitAmount
+    localizedAddOnsPricing[currency][ADD_ON_CODE].annualDividedByTwelve =
+      (unitAmount || 0) / 12
   }
 
   console.log(JSON.stringify({ localizedAddOnsPricing }, null, 2))
@@ -52,4 +55,4 @@ async function getPlan(planCode) {
   return await recurlyClient.getPlan(`code-${planCode}`)
 }
 
-await main()
+await scriptRunner(main)
diff --git a/services/web/scripts/recurly/generate_recurly_prices.mjs b/services/web/scripts/recurly/generate_recurly_prices.mjs
index 78cb7e2138..5624cd6f8c 100644
--- a/services/web/scripts/recurly/generate_recurly_prices.mjs
+++ b/services/web/scripts/recurly/generate_recurly_prices.mjs
@@ -34,8 +34,6 @@ const argv = minimist(process.argv.slice(2), {
 const CURRENCY_CODE_REGEX = /^[A-Z]{3}$/
 // Group plans have a plan code of the form group_name_size_type, e.g.
 const GROUP_SIZE_REGEX = /group_\w+_([0-9]+)_\w+/
-// Only group plans with more than 4 users can have additional licenses
-const SINGLE_LICENSE_MAX_GROUP_SIZE = 4
 
 // Compute prices for the base plan
 
@@ -92,15 +90,13 @@ function transformRecordToPlan(record) {
   // Large group plans have an add-on for additional licenses
   if (isGroupPlan(record)) {
     const size = getGroupSize(record)
-    if (size > SINGLE_LICENSE_MAX_GROUP_SIZE) {
-      const addOnPrices = computeAddOnPrices(prices, size)
-      plan._addOns = [
-        {
-          code: 'additional-license',
-          currencies: addOnPrices,
-        },
-      ]
-    }
+    const addOnPrices = computeAddOnPrices(prices, size)
+    plan._addOns = [
+      {
+        code: 'additional-license',
+        currencies: addOnPrices,
+      },
+    ]
   }
   return plan
 }
diff --git a/services/web/scripts/recurly/get_manually_billed_users_details.mjs b/services/web/scripts/recurly/get_manually_billed_users_details.mjs
index dafec9f8d6..0f7711652b 100644
--- a/services/web/scripts/recurly/get_manually_billed_users_details.mjs
+++ b/services/web/scripts/recurly/get_manually_billed_users_details.mjs
@@ -5,6 +5,7 @@ import { setTimeout } from 'node:timers/promises'
 import minimist from 'minimist'
 import * as csv from 'csv'
 import Stream from 'node:stream/promises'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const recurlyApiKey = Settings.apis.recurly.apiKey
 if (!recurlyApiKey) {
@@ -95,7 +96,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/recurly/get_recurly_group_prices.mjs b/services/web/scripts/recurly/get_recurly_group_prices.mjs
index e00a1e4c66..db734ead31 100644
--- a/services/web/scripts/recurly/get_recurly_group_prices.mjs
+++ b/services/web/scripts/recurly/get_recurly_group_prices.mjs
@@ -7,6 +7,7 @@
 import recurly from 'recurly'
 
 import Settings from '@overleaf/settings'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const recurlySettings = Settings.apis.recurly
 const recurlyApiKey = recurlySettings ? recurlySettings.apiKey : undefined
@@ -39,7 +40,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error({ error })
diff --git a/services/web/scripts/recurly/resync_recurly_state_single_subscription.mjs b/services/web/scripts/recurly/resync_recurly_state_single_subscription.mjs
new file mode 100644
index 0000000000..85d3e3eb77
--- /dev/null
+++ b/services/web/scripts/recurly/resync_recurly_state_single_subscription.mjs
@@ -0,0 +1,137 @@
+import { Subscription } from '../../app/src/models/Subscription.js'
+import RecurlyWrapper from '../../app/src/Features/Subscription/RecurlyWrapper.js'
+import SubscriptionUpdater from '../../app/src/Features/Subscription/SubscriptionUpdater.js'
+import minimist from 'minimist'
+import { setTimeout } from 'node:timers/promises'
+import util from 'node:util'
+
+util.inspect.defaultOptions.maxArrayLength = null
+
+const handleSyncSubscriptionError = async (subscription, error) => {
+  console.warn(`Errors with subscription id=${subscription._id}:`, error)
+
+  if (typeof error === 'string' && error.match(/429$/)) {
+    console.warn('Recurly rate limit hit (429). Waiting for 5 minutes...')
+    await setTimeout(1000 * 60 * 5)
+    return
+  }
+  if (typeof error === 'string' && error.match(/5\d\d$/)) {
+    console.warn('Recurly server error (5xx). Retrying in 1 minute...')
+    await setTimeout(1000 * 60)
+    await syncRecurlyStateInSubscription(subscription)
+    return
+  }
+  await setTimeout(80)
+}
+
+const syncRecurlyStateInSubscription = async subscription => {
+  let recurlySubscription
+
+  try {
+    recurlySubscription = await RecurlyWrapper.promises.getSubscription(
+      subscription.recurlySubscription_id
+    )
+  } catch (error) {
+    await handleSyncSubscriptionError(subscription, error)
+    return
+  }
+
+  if (!subscription.recurlyStatus) {
+    subscription.recurlyStatus = {}
+  }
+
+  if (subscription.recurlyStatus.state !== recurlySubscription.state) {
+    console.log(
+      `Mismatched recurlyStatus.state for subscription ID ${subscription._id}. ` +
+        `Our database: '${subscription.recurlyStatus.state || 'undefined/null'}', recurly: '${recurlySubscription.state}'.`
+    )
+
+    subscription.recurlyStatus.state = recurlySubscription.state
+
+    if (COMMIT) {
+      try {
+        console.log(
+          `Committing update for subscription ID: ${subscription._id}`
+        )
+        await SubscriptionUpdater.promises.updateSubscriptionFromRecurly(
+          recurlySubscription,
+          subscription,
+          {}
+        )
+      } catch (error) {
+        await handleSyncSubscriptionError(subscription, error)
+      }
+
+      console.log(
+        `Successfully updated subscription ID ${subscription._id} with new recurlyStatus.state: ${subscription.recurlyStatus.state}`
+      )
+    }
+  } else {
+    console.log(
+      `Subscription ID ${subscription._id}: recurlyStatus.state is already in sync.`
+    )
+  }
+
+  await setTimeout(80)
+}
+
+let COMMIT, SUBSCRIPTION_ID
+
+const setup = () => {
+  const argv = minimist(process.argv.slice(2))
+
+  SUBSCRIPTION_ID = argv.subscriptionId
+  if (!SUBSCRIPTION_ID) {
+    console.error(
+      'Error: Please provide a subscription ID using --subscriptionId=<id>'
+    )
+    process.exit(1)
+  }
+  console.log(
+    `Attempting to sync subscription.recurlyStatus with ID: ${SUBSCRIPTION_ID}`
+  )
+
+  COMMIT = argv.commit !== undefined
+  if (!COMMIT) {
+    console.warn(
+      'Doing dry run without --commit. No database changes will be made.'
+    )
+  }
+}
+
+const run = async () => {
+  try {
+    const subscription = await Subscription.findById(SUBSCRIPTION_ID).exec()
+
+    if (!subscription) {
+      console.error(
+        `Error: Subscription with ID ${SUBSCRIPTION_ID} not found in the database.`
+      )
+      process.exit(1)
+    }
+
+    if (!subscription.recurlySubscription_id) {
+      console.error(
+        `Error: Subscription ID ${SUBSCRIPTION_ID} does not have a Recurly subscription ID.`
+      )
+      process.exit(1)
+    }
+
+    console.log(
+      `Found subscription: ${subscription._id}, Recurly ID: ${subscription.recurlySubscription_id}`
+    )
+
+    await syncRecurlyStateInSubscription(subscription)
+
+    console.log('DONE')
+  } catch (error) {
+    console.error('An unhandled error occurred during script execution:', error)
+    process.exit(1)
+  }
+}
+
+setup()
+
+await run()
+
+process.exit(0)
diff --git a/services/web/scripts/recurly/resync_subscriptions.mjs b/services/web/scripts/recurly/resync_subscriptions.mjs
index a0b5ca1438..6a03c8e3c1 100644
--- a/services/web/scripts/recurly/resync_subscriptions.mjs
+++ b/services/web/scripts/recurly/resync_subscriptions.mjs
@@ -89,20 +89,18 @@ const syncSubscription = async subscription => {
 
   ScriptLogger.recordMismatch(subscription, recurlySubscription)
 
-  if (!COMMIT) {
-    return
+  if (COMMIT) {
+    try {
+      await SubscriptionUpdater.promises.updateSubscriptionFromRecurly(
+        recurlySubscription,
+        subscription,
+        {}
+      )
+    } catch (error) {
+      await handleSyncSubscriptionError(subscription, error)
+    }
   }
 
-  try {
-    await SubscriptionUpdater.promises.updateSubscriptionFromRecurly(
-      recurlySubscription,
-      subscription,
-      {}
-    )
-  } catch (error) {
-    await handleSyncSubscriptionError(subscription, error)
-    return
-  }
   await setTimeout(80)
 }
 
@@ -181,6 +179,13 @@ const setup = () => {
   }
 }
 
+if (process.env.NODE_ENV !== 'development') {
+  console.warn(
+    'This script can cause issues with manually amended subscriptions and can also exhaust our rate-limit with Recurly so is not intended to be run in production. Please use it in development environments only.'
+  )
+  process.exit(1)
+}
+
 setup()
 await run()
 process.exit()
diff --git a/services/web/scripts/recurly/setup_assistant_addon.js b/services/web/scripts/recurly/setup_assistant_addon.js
index 0df44b54c9..bba4cb3e04 100644
--- a/services/web/scripts/recurly/setup_assistant_addon.js
+++ b/services/web/scripts/recurly/setup_assistant_addon.js
@@ -6,7 +6,7 @@ const minimist = require('minimist')
 const Settings = require('@overleaf/settings')
 
 const ADD_ON_CODE = 'assistant'
-const ADD_ON_NAME = 'Error Assist'
+const ADD_ON_NAME = 'AI Assist'
 
 const INDIVIDUAL_PLANS = [
   'student',
diff --git a/services/web/scripts/recurly/update_terms_and_conditions_for_manually_billed_users.mjs b/services/web/scripts/recurly/update_terms_and_conditions_for_manually_billed_users.mjs
index f47ee6a2f0..ae8f19423b 100644
--- a/services/web/scripts/recurly/update_terms_and_conditions_for_manually_billed_users.mjs
+++ b/services/web/scripts/recurly/update_terms_and_conditions_for_manually_billed_users.mjs
@@ -4,6 +4,7 @@ import fs from 'node:fs'
 import minimist from 'minimist'
 import * as csv from 'csv'
 import { setTimeout } from 'node:timers/promises'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const recurlyApiKey = Settings.apis.recurly.apiKey
 if (!recurlyApiKey) {
@@ -95,7 +96,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/refresh_institution_users.mjs b/services/web/scripts/refresh_institution_users.mjs
index 6edb523108..e67bd3c346 100644
--- a/services/web/scripts/refresh_institution_users.mjs
+++ b/services/web/scripts/refresh_institution_users.mjs
@@ -1,5 +1,6 @@
 import minimist from 'minimist'
 import InstitutionsManager from '../app/src/Features/Institutions/InstitutionsManager.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const institutionId = parseInt(process.argv[2])
 if (isNaN(institutionId)) throw new Error('No institution id')
@@ -31,7 +32,7 @@ function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/remove_feature_from_all_users.mjs b/services/web/scripts/remove_feature_from_all_users.mjs
index fe53bda39a..f138501f0e 100644
--- a/services/web/scripts/remove_feature_from_all_users.mjs
+++ b/services/web/scripts/remove_feature_from_all_users.mjs
@@ -3,6 +3,7 @@ import {
   READ_PREFERENCE_SECONDARY,
 } from '../app/src/infrastructure/mongodb.js'
 import parseArgs from 'minimist'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 async function _removeFeatureFromAllUsers(feature, commit) {
   let removals = 0
@@ -44,7 +45,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/remove_oauth_application.mjs b/services/web/scripts/remove_oauth_application.mjs
index 601a68a171..fd37ca374c 100644
--- a/services/web/scripts/remove_oauth_application.mjs
+++ b/services/web/scripts/remove_oauth_application.mjs
@@ -1,6 +1,7 @@
 import { OauthApplication } from '../app/src/models/OauthApplication.js'
 import parseArgs from 'minimist'
 import OError from '@overleaf/o-error'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 async function _removeOauthApplication(appId) {
   if (!appId) {
@@ -24,7 +25,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/remove_unconfirmed_emails.mjs b/services/web/scripts/remove_unconfirmed_emails.mjs
index e86540dba6..246334315a 100644
--- a/services/web/scripts/remove_unconfirmed_emails.mjs
+++ b/services/web/scripts/remove_unconfirmed_emails.mjs
@@ -8,6 +8,7 @@ import fs from 'node:fs/promises'
 import * as csv from 'csv'
 import { promisify } from 'node:util'
 import _ from 'lodash'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const CSV_FILENAME = '/tmp/remove_unconfirmed_emails.csv'
 /**
@@ -38,7 +39,7 @@ const { generate, consume, commit, help } = minimist(process.argv.slice(2), {
   default: { generate: false, consume: false, commit: false },
 })
 
-async function generateCsvFile() {
+async function generateCsvFile(trackProgress) {
   console.time('generate_csv')
 
   let processedUsersCount = 0
@@ -92,7 +93,9 @@ async function generateCsvFile() {
         totalEmailsToRemove += unconfirmedSecondaries.length
       }
     },
-    { _id: 1, signUpDate: 1, emails: 1, email: 1 }
+    { _id: 1, signUpDate: 1, emails: 1, email: 1 },
+    undefined,
+    { trackProgress }
   )
 
   const csvContent = await stringifyAsync(records)
@@ -226,7 +229,7 @@ async function consumeCsvFile() {
   console.log()
 }
 
-async function main() {
+async function main(trackProgress) {
   if (help) {
     return usage()
   }
@@ -247,14 +250,14 @@ async function main() {
   }
 
   if (generate) {
-    await generateCsvFile()
+    await generateCsvFile(trackProgress)
   } else if (consume) {
     await consumeCsvFile()
   }
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/restore_orphaned_docs.mjs b/services/web/scripts/restore_orphaned_docs.mjs
index ebbe0d5e4b..7b4df055a9 100644
--- a/services/web/scripts/restore_orphaned_docs.mjs
+++ b/services/web/scripts/restore_orphaned_docs.mjs
@@ -1,6 +1,7 @@
 import ProjectEntityRestoreHandler from '../app/src/Features/Project/ProjectEntityRestoreHandler.js'
 import ProjectEntityHandler from '../app/src/Features/Project/ProjectEntityHandler.js'
 import DocstoreManager from '../app/src/Features/Docstore/DocstoreManager.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const ARGV = process.argv.slice(2)
 const DEVELOPER_USER_ID = ARGV.shift()
@@ -35,7 +36,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/restore_soft_deleted_docs.mjs b/services/web/scripts/restore_soft_deleted_docs.mjs
index 3e4575fa2b..5faf85559e 100644
--- a/services/web/scripts/restore_soft_deleted_docs.mjs
+++ b/services/web/scripts/restore_soft_deleted_docs.mjs
@@ -1,5 +1,6 @@
 import ProjectEntityRestoreHandler from '../app/src/Features/Project/ProjectEntityRestoreHandler.js'
 import DocstoreManager from '../app/src/Features/Docstore/DocstoreManager.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const ARGV = process.argv.slice(2)
 const DEVELOPER_USER_ID = ARGV.shift()
@@ -24,7 +25,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/set_tex_live_image.mjs b/services/web/scripts/set_tex_live_image.mjs
index 63b67fb4ca..a0d48dd9f3 100644
--- a/services/web/scripts/set_tex_live_image.mjs
+++ b/services/web/scripts/set_tex_live_image.mjs
@@ -1,6 +1,7 @@
 import Settings from '@overleaf/settings'
 import mongodb from 'mongodb-legacy'
 import { Project } from '../app/src/models/Project.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -61,7 +62,7 @@ async function updateImage(image, projectIds) {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit()
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/soft_delete_project.mjs b/services/web/scripts/soft_delete_project.mjs
index 801bcc9a70..f530040980 100644
--- a/services/web/scripts/soft_delete_project.mjs
+++ b/services/web/scripts/soft_delete_project.mjs
@@ -1,5 +1,6 @@
 import minimist from 'minimist'
 import ProjectDeleter from '../app/src/Features/Project/ProjectDeleter.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 async function main() {
   const argv = minimist(process.argv.slice(2))
@@ -14,7 +15,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/split_tests_assigned_at_to_dates.mjs b/services/web/scripts/split_tests_assigned_at_to_dates.mjs
deleted file mode 100644
index ea6fd3fbea..0000000000
--- a/services/web/scripts/split_tests_assigned_at_to_dates.mjs
+++ /dev/null
@@ -1,46 +0,0 @@
-import { db } from '../app/src/infrastructure/mongodb.js'
-import { fileURLToPath } from 'node:url'
-
-async function updateStringDates() {
-  const users = db.users.find({
-    splitTests: { $exists: true },
-  })
-
-  let user
-  let count = 0
-  while ((user = await users.next())) {
-    count += 1
-    if (count % 10000 === 0) {
-      console.log(`processed ${count} users...`)
-    }
-
-    const splitTests = user.splitTests
-    for (const splitTestKey of Object.keys(splitTests)) {
-      for (const variantIndex in splitTests[splitTestKey]) {
-        splitTests[splitTestKey][variantIndex].assignedAt = new Date(
-          splitTests[splitTestKey][variantIndex].assignedAt
-        )
-      }
-    }
-
-    await db.users.updateOne(
-      {
-        _id: user._id,
-      },
-      { $set: { splitTests } }
-    )
-  }
-  console.log(`Updated ${count} assignedAt strings to dates!`)
-}
-
-if (fileURLToPath(import.meta.url) === process.argv[1]) {
-  try {
-    await updateStringDates()
-    process.exit(0)
-  } catch (error) {
-    console.error(error)
-    process.exit(1)
-  }
-}
-
-export default updateStringDates
diff --git a/services/web/scripts/sso_id_migration_check.mjs b/services/web/scripts/sso_id_migration_check.mjs
index 8f8f037b49..9638f6b960 100644
--- a/services/web/scripts/sso_id_migration_check.mjs
+++ b/services/web/scripts/sso_id_migration_check.mjs
@@ -1,5 +1,6 @@
 import SAMLUserIdMigrationHandler from '../modules/saas-authentication/app/src/SAML/SAMLUserIdMigrationHandler.mjs'
 import { ensureRunningOnMongoSecondaryWithTimeout } from './helpers/env_variable_helper.mjs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 ensureRunningOnMongoSecondaryWithTimeout(300000)
 
@@ -10,7 +11,7 @@ const emitUsers = process.argv.includes('--emit-users')
 console.log('Checking SSO user ID migration for institution:', institutionId)
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/sso_id_remove_not_migrated.mjs b/services/web/scripts/sso_id_remove_not_migrated.mjs
index cf836f4796..cc7a5a874e 100644
--- a/services/web/scripts/sso_id_remove_not_migrated.mjs
+++ b/services/web/scripts/sso_id_remove_not_migrated.mjs
@@ -1,5 +1,6 @@
 import SAMLUserIdMigrationHandler from '../modules/saas-authentication/app/src/SAML/SAMLUserIdMigrationHandler.mjs'
 import { ensureMongoTimeout } from './helpers/env_variable_helper.mjs'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 ensureMongoTimeout(300000)
 
@@ -30,7 +31,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
 } catch (error) {
   console.error(error)
   process.exit(1)
diff --git a/services/web/scripts/translations/Dockerfile b/services/web/scripts/translations/Dockerfile
index e033989372..08dc2265c5 100644
--- a/services/web/scripts/translations/Dockerfile
+++ b/services/web/scripts/translations/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:20.18.2
+FROM node:22.17.0
 
 WORKDIR /app/scripts/translations
 
diff --git a/services/web/scripts/translations/cleanupUnusedLocales.js b/services/web/scripts/translations/cleanupUnusedLocales.js
index e3d4d85435..d98ee6eb7e 100644
--- a/services/web/scripts/translations/cleanupUnusedLocales.js
+++ b/services/web/scripts/translations/cleanupUnusedLocales.js
@@ -74,6 +74,7 @@ async function main() {
     'dropbox_email_not_verified',
     'dropbox_unlinked_because_access_denied',
     'dropbox_unlinked_because_full',
+    'dropbox_unlinked_because_suspended',
 
     // Actually used without the spurious space.
     // TODO: fix the space and upload the changed locales
diff --git a/services/web/scripts/undelete_project_to_user.mjs b/services/web/scripts/undelete_project_to_user.mjs
index ee837a4190..0863ad5f23 100644
--- a/services/web/scripts/undelete_project_to_user.mjs
+++ b/services/web/scripts/undelete_project_to_user.mjs
@@ -1,5 +1,6 @@
 import minimist from 'minimist'
 import ProjectDeleter from '../app/src/Features/Project/ProjectDeleter.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 async function main() {
   const argv = minimist(process.argv.slice(2))
@@ -14,7 +15,7 @@ async function main() {
 }
 
 try {
-  await main()
+  await scriptRunner(main)
   console.log('Done.')
   process.exit(0)
 } catch (error) {
diff --git a/services/web/scripts/unlink_third_party_id.mjs b/services/web/scripts/unlink_third_party_id.mjs
index 8511deb403..eb76995bc2 100644
--- a/services/web/scripts/unlink_third_party_id.mjs
+++ b/services/web/scripts/unlink_third_party_id.mjs
@@ -1,6 +1,7 @@
 import minimist from 'minimist'
 import ThirdPartyIdentityManager from '../app/src/Features/User/ThirdPartyIdentityManager.js'
 import UserGetter from '../app/src/Features/User/UserGetter.js'
+import { scriptRunner } from './lib/ScriptRunner.mjs'
 
 /**
  * This script is used to remove a linked third party identity from a user account.
@@ -79,7 +80,7 @@ async function main() {
 setup()
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error(error)
diff --git a/services/web/scripts/writefull/back_fill_hiding_ai_features.mjs b/services/web/scripts/writefull/back_fill_hiding_ai_features.mjs
index 2b188a812b..e40e065d51 100644
--- a/services/web/scripts/writefull/back_fill_hiding_ai_features.mjs
+++ b/services/web/scripts/writefull/back_fill_hiding_ai_features.mjs
@@ -1,7 +1,8 @@
 import { db } from '../../app/src/infrastructure/mongodb.js'
 import { batchedUpdate } from '@overleaf/mongo-utils/batchedUpdate.js'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
-async function main() {
+async function main(trackProgress) {
   // update all applicable user models
   await batchedUpdate(
     db.users,
@@ -12,7 +13,10 @@ async function main() {
       $set: {
         'aiErrorAssistant.enabled': false,
       },
-    }
+    },
+    undefined,
+    undefined,
+    { trackProgress }
   )
   console.log('completed syncing writefull state with error assist')
 }
@@ -20,7 +24,7 @@ async function main() {
 export default main
 
 try {
-  await main()
+  await scriptRunner(main)
   process.exit(0)
 } catch (error) {
   console.error({ error })
diff --git a/services/web/scripts/writefull/enable_wf_autoCreatedAccount.mjs b/services/web/scripts/writefull/enable_wf_autoCreatedAccount.mjs
index 190af04ef0..bdae9d8f26 100644
--- a/services/web/scripts/writefull/enable_wf_autoCreatedAccount.mjs
+++ b/services/web/scripts/writefull/enable_wf_autoCreatedAccount.mjs
@@ -3,6 +3,7 @@ import mongodb from 'mongodb-legacy'
 import fs from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import { chunkArray } from '../helpers/chunkArray.mjs'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -37,7 +38,7 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     process.exit(0)
   } catch (error) {
     console.error({ error })
diff --git a/services/web/scripts/writefull/enable_writefull_without_autoCreatedAccount.mjs b/services/web/scripts/writefull/enable_writefull_without_autoCreatedAccount.mjs
index 60a20626da..8f76ad666d 100644
--- a/services/web/scripts/writefull/enable_writefull_without_autoCreatedAccount.mjs
+++ b/services/web/scripts/writefull/enable_writefull_without_autoCreatedAccount.mjs
@@ -2,6 +2,7 @@ import { db } from '../../app/src/infrastructure/mongodb.js'
 import mongodb from 'mongodb-legacy'
 import fs from 'node:fs'
 import { fileURLToPath } from 'node:url'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
@@ -36,7 +37,7 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     process.exit(0)
   } catch (error) {
     console.error({ error })
diff --git a/services/web/scripts/writefull/split_writefull_disabled_from_unset.mjs b/services/web/scripts/writefull/split_writefull_disabled_from_unset.mjs
index 85b6cf438c..dc86f8897b 100644
--- a/services/web/scripts/writefull/split_writefull_disabled_from_unset.mjs
+++ b/services/web/scripts/writefull/split_writefull_disabled_from_unset.mjs
@@ -4,10 +4,11 @@ import mongodb from 'mongodb-legacy'
 import fs from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import { chunkArray } from '../helpers/chunkArray.mjs'
+import { scriptRunner } from '../lib/ScriptRunner.mjs'
 
 const { ObjectId } = mongodb
 
-async function main() {
+async function main(trackProgress) {
   // search for file of users who already explicitly opted out first
   const optOutPath = process.argv[2]
   const optedOutFile = fs.readFileSync(optOutPath, 'utf8')
@@ -20,7 +21,10 @@ async function main() {
   await batchedUpdate(
     db.users,
     { 'writefull.enabled': false }, // and is false
-    { $set: { 'writefull.enabled': null } }
+    { $set: { 'writefull.enabled': null } },
+    undefined,
+    undefined,
+    { trackProgress }
   )
 
   const chunks = chunkArray(optedOutList)
@@ -41,7 +45,7 @@ export default main
 
 if (fileURLToPath(import.meta.url) === process.argv[1]) {
   try {
-    await main()
+    await scriptRunner(main)
     process.exit(0)
   } catch (error) {
     console.error({ error })
diff --git a/services/web/test/acceptance/config/settings.test.defaults.js b/services/web/test/acceptance/config/settings.test.defaults.js
index b0db7f7449..860b5e2066 100644
--- a/services/web/test/acceptance/config/settings.test.defaults.js
+++ b/services/web/test/acceptance/config/settings.test.defaults.js
@@ -24,7 +24,7 @@ module.exports = {
     ? JSON.parse(process.env.ADMIN_DOMAINS)
     : ['example.com'],
 
-  statusPageUrl: 'status.example.com',
+  statusPageUrl: 'https://status.example.com',
   cdn: {
     web: {
       host: 'cdn.example.com',
@@ -199,6 +199,30 @@ module.exports = {
       price_in_cents: 3000,
       features: features.professional,
     },
+    {
+      planCode: 'group_professional',
+      name: 'Professional - Group Account - Enterprise',
+      hideFromUsers: true,
+      price_in_cents: 0,
+      annual: true,
+      features: features.professional,
+      groupPlan: true,
+      membersLimit: 0,
+      membersLimitAddOn: 'additional-license',
+      canUseFlexibleLicensing: true,
+    },
+    {
+      planCode: 'group_collaborator',
+      name: 'Collaborator - Group Account - Enterprise',
+      hideFromUsers: true,
+      price_in_cents: 0,
+      annual: true,
+      features: features.collaborator,
+      groupPlan: true,
+      membersLimit: 0,
+      membersLimitAddOn: 'additional-license',
+      canUseFlexibleLicensing: true,
+    },
   ],
 
   bonus_features: {
diff --git a/services/web/test/acceptance/src/AddSecondaryEmailTests.mjs b/services/web/test/acceptance/src/AddSecondaryEmailTests.mjs
index 2fdc7705fe..c153416fe6 100644
--- a/services/web/test/acceptance/src/AddSecondaryEmailTests.mjs
+++ b/services/web/test/acceptance/src/AddSecondaryEmailTests.mjs
@@ -125,7 +125,9 @@ describe('Add secondary email address confirmation code email', function () {
       })
 
       expect(res.response.statusCode).to.equal(409)
-      expect(res.body.message.text).to.equal('This email is already registered')
+      expect(res.body.message.text).to.equal(
+        'This email address is already associated with a different Overleaf account.'
+      )
     })
   })
 
diff --git a/services/web/test/acceptance/src/BackFillDeletedFilesTests.mjs b/services/web/test/acceptance/src/BackFillDeletedFilesTests.mjs
deleted file mode 100644
index 7c49d973ba..0000000000
--- a/services/web/test/acceptance/src/BackFillDeletedFilesTests.mjs
+++ /dev/null
@@ -1,176 +0,0 @@
-import { exec } from 'node:child_process'
-import { promisify } from 'node:util'
-import { expect } from 'chai'
-import logger from '@overleaf/logger'
-import { db, ObjectId } from '../../../app/src/infrastructure/mongodb.js'
-import UserHelper from './helpers/User.mjs'
-
-const User = UserHelper.promises
-
-async function getDeletedFiles(projectId) {
-  return (await db.projects.findOne({ _id: projectId })).deletedFiles
-}
-
-async function setDeletedFiles(projectId, deletedFiles) {
-  await db.projects.updateOne({ _id: projectId }, { $set: { deletedFiles } })
-}
-
-async function unsetDeletedFiles(projectId) {
-  await db.projects.updateOne(
-    { _id: projectId },
-    { $unset: { deletedFiles: 1 } }
-  )
-}
-
-describe('BackFillDeletedFiles', function () {
-  let user, projectId1, projectId2, projectId3, projectId4, projectId5
-
-  beforeEach('create projects', async function () {
-    user = new User()
-    await user.login()
-
-    projectId1 = new ObjectId(await user.createProject('project1'))
-    projectId2 = new ObjectId(await user.createProject('project2'))
-    projectId3 = new ObjectId(await user.createProject('project3'))
-    projectId4 = new ObjectId(await user.createProject('project4'))
-    projectId5 = new ObjectId(await user.createProject('project5'))
-  })
-
-  let fileId1, fileId2, fileId3, fileId4
-  beforeEach('create files', function () {
-    // take a short cut and just allocate file ids
-    fileId1 = new ObjectId()
-    fileId2 = new ObjectId()
-    fileId3 = new ObjectId()
-    fileId4 = new ObjectId()
-  })
-  const otherFileDetails = {
-    name: 'universe.jpg',
-    linkedFileData: null,
-    hash: 'ed19e7d6779b47d8c63f6fa5a21954dcfb6cac00',
-    deletedAt: new Date(),
-    __v: 0,
-  }
-  let deletedFiles1, deletedFiles2, deletedFiles3
-  beforeEach('set deletedFiles details', async function () {
-    deletedFiles1 = [
-      { _id: fileId1, ...otherFileDetails },
-      { _id: fileId2, ...otherFileDetails },
-    ]
-    deletedFiles2 = [{ _id: fileId3, ...otherFileDetails }]
-    await setDeletedFiles(projectId1, deletedFiles1)
-    await setDeletedFiles(projectId2, deletedFiles2)
-
-    // a project without deletedFiles entries
-    await setDeletedFiles(projectId3, [])
-    // a project without deletedFiles array
-    await unsetDeletedFiles(projectId4)
-    // duplicate entry
-    deletedFiles3 = [
-      { _id: fileId4, ...otherFileDetails },
-      { _id: fileId4, ...otherFileDetails },
-    ]
-    await setDeletedFiles(projectId5, deletedFiles3)
-  })
-
-  async function runScript(args = []) {
-    let result
-    try {
-      result = await promisify(exec)(
-        ['LET_USER_DOUBLE_CHECK_INPUTS_FOR=1', 'VERBOSE_LOGGING=true']
-          .concat(['node', 'scripts/back_fill_deleted_files.mjs'])
-          .concat(args)
-          .join(' ')
-      )
-    } catch (error) {
-      // dump details like exit code, stdErr and stdOut
-      logger.error({ error }, 'script failed')
-      throw error
-    }
-    const { stdout: stdOut } = result
-
-    expect(stdOut).to.match(
-      new RegExp(`Running update on batch with ids .+${projectId1}`)
-    )
-    expect(stdOut).to.match(
-      new RegExp(`Running update on batch with ids .+${projectId2}`)
-    )
-    expect(stdOut).to.not.match(
-      new RegExp(`Running update on batch with ids .+${projectId3}`)
-    )
-    expect(stdOut).to.not.match(
-      new RegExp(`Running update on batch with ids .+${projectId4}`)
-    )
-    expect(stdOut).to.match(
-      new RegExp(`Running update on batch with ids .+${projectId5}`)
-    )
-  }
-
-  function checkAreFilesBackFilled() {
-    it('should back fill file and set projectId', async function () {
-      const docs = await db.deletedFiles
-        .find({}, { sort: { _id: 1 } })
-        .toArray()
-      expect(docs).to.deep.equal([
-        { _id: fileId1, projectId: projectId1, ...otherFileDetails },
-        { _id: fileId2, projectId: projectId1, ...otherFileDetails },
-        { _id: fileId3, projectId: projectId2, ...otherFileDetails },
-        { _id: fileId4, projectId: projectId5, ...otherFileDetails },
-      ])
-    })
-  }
-
-  describe('back fill only', function () {
-    beforeEach('run script', runScript)
-
-    checkAreFilesBackFilled()
-
-    it('should leave the deletedFiles as is', async function () {
-      expect(await getDeletedFiles(projectId1)).to.deep.equal(deletedFiles1)
-      expect(await getDeletedFiles(projectId2)).to.deep.equal(deletedFiles2)
-      expect(await getDeletedFiles(projectId5)).to.deep.equal(deletedFiles3)
-    })
-  })
-
-  describe('back fill and cleanup', function () {
-    beforeEach('run script with cleanup flag', async function () {
-      await runScript(['--perform-cleanup'])
-    })
-
-    checkAreFilesBackFilled()
-
-    it('should cleanup the deletedFiles', async function () {
-      expect(await getDeletedFiles(projectId1)).to.deep.equal([])
-      expect(await getDeletedFiles(projectId2)).to.deep.equal([])
-      expect(await getDeletedFiles(projectId5)).to.deep.equal([])
-    })
-  })
-
-  describe('fix partial inserts and cleanup', function () {
-    beforeEach('simulate one missing insert', async function () {
-      await setDeletedFiles(projectId1, [deletedFiles1[0]])
-    })
-    beforeEach('run script with cleanup flag', async function () {
-      await runScript(['--perform-cleanup'])
-    })
-    beforeEach('add case for one missing file', async function () {
-      await setDeletedFiles(projectId1, deletedFiles1)
-    })
-    beforeEach('add cases for no more files to insert', async function () {
-      await setDeletedFiles(projectId2, deletedFiles2)
-      await setDeletedFiles(projectId5, deletedFiles3)
-    })
-
-    beforeEach('fixing partial insert and cleanup', async function () {
-      await runScript(['--fix-partial-inserts', '--perform-cleanup'])
-    })
-
-    checkAreFilesBackFilled()
-
-    it('should cleanup the deletedFiles', async function () {
-      expect(await getDeletedFiles(projectId1)).to.deep.equal([])
-      expect(await getDeletedFiles(projectId2)).to.deep.equal([])
-      expect(await getDeletedFiles(projectId5)).to.deep.equal([])
-    })
-  })
-})
diff --git a/services/web/test/acceptance/src/CaptchaTests.mjs b/services/web/test/acceptance/src/CaptchaTests.mjs
index 10fdcf1626..223fe02cb0 100644
--- a/services/web/test/acceptance/src/CaptchaTests.mjs
+++ b/services/web/test/acceptance/src/CaptchaTests.mjs
@@ -104,6 +104,59 @@ describe('Captcha', function () {
     })
   })
 
+  describe('trustedUsersRegex', function () {
+    let resetTrustedUsersRegex
+    beforeEach(function () {
+      resetTrustedUsersRegex = Settings.recaptcha.trustedUsersRegex
+      Settings.recaptcha.trustedUsersRegex = /\+trusted@example\.com$/
+    })
+
+    afterEach(function () {
+      Settings.recaptcha.trustedUsersRegex = resetTrustedUsersRegex
+    })
+
+    describe('when user is trusted, can login without captcha', function () {
+      let trustedUser
+      beforeEach(async function () {
+        trustedUser = new User({
+          email: 'acceptance-test+trusted@example.com',
+        })
+        await trustedUser.ensureUserExists()
+      })
+
+      it('should be able to skip captcha', async function () {
+        expect(await canSkipCaptcha(trustedUser.email)).to.equal(true)
+      })
+
+      it('should note that the user is trusted', async function () {
+        const { response, body } = await login(
+          trustedUser.email,
+          trustedUser.password,
+          ''
+        )
+        expectSuccessfulLogin(response, body)
+        const auditLog = await trustedUser.getAuditLog()
+        expect(auditLog[0].info).to.deep.equal({
+          captcha: 'trusted',
+          method: 'Password login',
+        })
+      })
+    })
+
+    describe('when user is not trusted', function () {
+      it('should not be able to skip captcha', async function () {
+        expect(await canSkipCaptcha(user.email)).to.equal(false)
+      })
+
+      it('should not add an audit log entry for trusted user', async function () {
+        const { response, body } = await login(user.email, user.password, '')
+        expectBadCaptchaResponse(response, body)
+        const auditLog = await user.getAuditLog()
+        expect(auditLog).to.have.lengthOf(0)
+      })
+    })
+  })
+
   describe('deviceHistory', function () {
     beforeEach('login', async function () {
       const { response, body } = await loginWithCaptcha('valid')
diff --git a/services/web/test/acceptance/src/ConvertArchivedState.mjs b/services/web/test/acceptance/src/ConvertArchivedState.mjs
index 53e2278974..06ce5e3b15 100644
--- a/services/web/test/acceptance/src/ConvertArchivedState.mjs
+++ b/services/web/test/acceptance/src/ConvertArchivedState.mjs
@@ -120,7 +120,7 @@ describe('ConvertArchivedState', function () {
 
   beforeEach(function (done) {
     exec(
-      'CONNECT_DELAY=1 node scripts/convert_archived_state.mjs FIRST,SECOND',
+      'east migrate --tag server-ce --force 20221111111111_ce_sp_convert_archived_state',
       error => {
         if (error) {
           return done(error)
diff --git a/services/web/test/acceptance/src/ConvertEmailConfirmedAtToDates.js b/services/web/test/acceptance/src/ConvertEmailConfirmedAtToDates.js
new file mode 100644
index 0000000000..da5f842bb6
--- /dev/null
+++ b/services/web/test/acceptance/src/ConvertEmailConfirmedAtToDates.js
@@ -0,0 +1,69 @@
+import { expect } from 'chai'
+import { db } from '../../../app/src/infrastructure/mongodb.js'
+import { exec } from 'node:child_process'
+
+describe('ConvertEmailConfirmedAtToDates', function () {
+  beforeEach('insert data', async function () {
+    await db.users.insertMany([
+      { email: 'foo0@bar.com', emails: [{ email: 'foo0@bar.com' }] },
+      {
+        email: 'foo1@bar.com',
+        emails: [
+          { email: 'foo1@bar.com', confirmedAt: '2025-06-20 15:53:31 UTC' },
+        ],
+      },
+      {
+        email: 'foo2@bar.com',
+        emails: [
+          { email: 'foo2@bar.com', confirmedAt: '2025-06-20 15:53:32 UTC' },
+          { email: 'foo3@bar.com', confirmedAt: '2025-06-20 15:53:33 UTC' },
+          {
+            email: 'foo4@bar.com',
+            confirmedAt: new Date('2025-06-20T15:53:31.134Z'),
+          },
+        ],
+      },
+    ])
+  })
+
+  beforeEach('run migration', function (done) {
+    exec(
+      'east migrate -t saas --force 20210726083523_convert_confirmedAt_strings_to_dates',
+      done
+    )
+  })
+
+  it('should update the dates', async function () {
+    expect(
+      await db.users.find({}, { projection: { _id: 0 } }).toArray()
+    ).to.deep.equal([
+      { email: 'foo0@bar.com', emails: [{ email: 'foo0@bar.com' }] },
+      {
+        email: 'foo1@bar.com',
+        emails: [
+          {
+            email: 'foo1@bar.com',
+            confirmedAt: new Date('2025-06-20T15:53:31.000Z'),
+          },
+        ],
+      },
+      {
+        email: 'foo2@bar.com',
+        emails: [
+          {
+            email: 'foo2@bar.com',
+            confirmedAt: new Date('2025-06-20T15:53:32.000Z'),
+          },
+          {
+            email: 'foo3@bar.com',
+            confirmedAt: new Date('2025-06-20T15:53:33.000Z'),
+          },
+          {
+            email: 'foo4@bar.com',
+            confirmedAt: new Date('2025-06-20T15:53:31.134Z'),
+          },
+        ],
+      },
+    ])
+  })
+})
diff --git a/services/web/test/acceptance/src/ConvertSplitTestAssignedAtToDates.js b/services/web/test/acceptance/src/ConvertSplitTestAssignedAtToDates.js
new file mode 100644
index 0000000000..bfec1d1fb2
--- /dev/null
+++ b/services/web/test/acceptance/src/ConvertSplitTestAssignedAtToDates.js
@@ -0,0 +1,134 @@
+import { expect } from 'chai'
+import { db } from '../../../app/src/infrastructure/mongodb.js'
+import { exec } from 'node:child_process'
+
+describe('ConvertSplitTestAssignedAtToDates', function () {
+  beforeEach('insert data', async function () {
+    await db.users.insertMany([
+      {
+        email: 'foo0@bar.com',
+        splitTests: {
+          'split-test-1': [
+            {
+              variantName: 'enabled',
+              versionNumber: 4,
+              phase: 'release',
+              assignedAt: '2025-03-18T13:19:46.627Z',
+            },
+            {
+              variantName: 'default',
+              versionNumber: 5,
+              phase: 'release',
+              assignedAt: new Date('2025-04-30T08:52:13.783Z'),
+            },
+          ],
+          'split-test-2': [
+            {
+              variantName: 'active',
+              versionNumber: 5,
+              phase: 'release',
+              assignedAt: new Date('2025-02-14T09:08:30.190Z'),
+            },
+            {
+              variantName: 'active',
+              versionNumber: 7,
+              phase: 'release',
+              assignedAt: new Date('2025-03-11T11:05:13.640Z'),
+            },
+          ],
+        },
+      },
+      {
+        email: 'foo1@bar.com',
+        splitTests: {
+          'split-test-3': [
+            {
+              variantName: 'default',
+              versionNumber: 1,
+              phase: 'release',
+              assignedAt: '2025-02-11T14:55:38.470Z',
+            },
+            {
+              variantName: 'enabled',
+              versionNumber: 21,
+              phase: 'release',
+              assignedAt: '2025-03-18T13:19:46.826Z',
+            },
+          ],
+        },
+      },
+      {
+        email: 'foo2@bar.com',
+      },
+    ])
+  })
+
+  beforeEach('run migration', function (done) {
+    exec(
+      'east migrate -t saas --force 20210726083523_convert_split_tests_assigned_at_strings_to_dates',
+      done
+    )
+  })
+
+  it('should update the dates', async function () {
+    expect(
+      await db.users.find({}, { projection: { _id: 0 } }).toArray()
+    ).to.deep.equal([
+      {
+        email: 'foo0@bar.com',
+        splitTests: {
+          'split-test-1': [
+            {
+              variantName: 'enabled',
+              versionNumber: 4,
+              phase: 'release',
+              assignedAt: new Date('2025-03-18T13:19:46.627Z'),
+            },
+            {
+              variantName: 'default',
+              versionNumber: 5,
+              phase: 'release',
+              assignedAt: new Date('2025-04-30T08:52:13.783Z'),
+            },
+          ],
+          'split-test-2': [
+            {
+              variantName: 'active',
+              versionNumber: 5,
+              phase: 'release',
+              assignedAt: new Date('2025-02-14T09:08:30.190Z'),
+            },
+            {
+              variantName: 'active',
+              versionNumber: 7,
+              phase: 'release',
+              assignedAt: new Date('2025-03-11T11:05:13.640Z'),
+            },
+          ],
+        },
+      },
+      {
+        email: 'foo1@bar.com',
+        splitTests: {
+          'split-test-3': [
+            {
+              variantName: 'default',
+              versionNumber: 1,
+              phase: 'release',
+              assignedAt: new Date('2025-02-11T14:55:38.470Z'),
+            },
+            {
+              variantName: 'enabled',
+              versionNumber: 21,
+              phase: 'release',
+              assignedAt: new Date('2025-03-18T13:19:46.826Z'),
+            },
+          ],
+        },
+      },
+      {
+        email: 'foo2@bar.com',
+      },
+    ])
+  })
+})
diff --git a/services/web/test/acceptance/src/DeletionTests.mjs b/services/web/test/acceptance/src/DeletionTests.mjs
index 34e7bca200..e589be9474 100644
--- a/services/web/test/acceptance/src/DeletionTests.mjs
+++ b/services/web/test/acceptance/src/DeletionTests.mjs
@@ -1,3 +1,5 @@
+import logger from '@overleaf/logger'
+import sinon from 'sinon'
 import User from './helpers/User.mjs'
 import Subscription from './helpers/Subscription.mjs'
 import request from './helpers/request.js'
@@ -18,6 +20,8 @@ let MockDocstoreApi,
   MockGitBridgeApi,
   MockHistoryBackupDeletionApi
 
+let spy
+
 before(function () {
   MockDocstoreApi = MockDocstoreApiClass.instance()
   MockFilestoreApi = MockFilestoreApiClass.instance()
@@ -28,6 +32,7 @@ before(function () {
 
 describe('Deleting a user', function () {
   beforeEach(function (done) {
+    spy = sinon.spy(logger, 'info')
     async.auto(
       {
         user: cb => {
@@ -64,6 +69,10 @@ describe('Deleting a user', function () {
     )
   })
 
+  afterEach(function () {
+    spy.restore()
+  })
+
   it('Should remove the user from active users', function (done) {
     this.user.get((error, user) => {
       expect(error).not.to.exist
@@ -183,6 +192,7 @@ describe('Deleting a user', function () {
 
 describe('Deleting a project', function () {
   beforeEach(function (done) {
+    spy = sinon.spy(logger, 'info')
     this.user = new User()
     this.projectName = 'wombat'
     this.user.ensureUserExists(() => {
@@ -195,6 +205,10 @@ describe('Deleting a project', function () {
     })
   })
 
+  afterEach(function () {
+    logger.info.restore()
+  })
+
   it('Should remove the project from active projects', function (done) {
     this.user.getProject(this.projectId, (error, project) => {
       expect(error).not.to.exist
@@ -252,81 +266,6 @@ describe('Deleting a project', function () {
     })
   })
 
-  describe('when the project has deleted files', function () {
-    beforeEach('get rootFolder id', function (done) {
-      this.user.getProject(this.projectId, (error, project) => {
-        if (error) return done(error)
-        this.rootFolder = project.rootFolder[0]._id
-        done()
-      })
-    })
-
-    let allFileIds
-    beforeEach('reset allFileIds', function () {
-      allFileIds = []
-    })
-    function createAndDeleteFile(name) {
-      let fileId
-      beforeEach(`create file ${name}`, function (done) {
-        this.user.uploadExampleFileInProject(
-          this.projectId,
-          this.rootFolder,
-          name,
-          (error, theFileId) => {
-            fileId = theFileId
-            allFileIds.push(theFileId)
-            done(error)
-          }
-        )
-      })
-      beforeEach(`delete file ${name}`, function (done) {
-        this.user.deleteItemInProject(this.projectId, 'file', fileId, done)
-      })
-    }
-    for (const name of ['a.png', 'another.png']) {
-      createAndDeleteFile(name)
-    }
-
-    it('should have two deleteFiles entries', async function () {
-      const files = await db.deletedFiles
-        .find({}, { sort: { _id: 1 } })
-        .toArray()
-      expect(files).to.have.length(2)
-      expect(files.map(file => file._id.toString())).to.deep.equal(allFileIds)
-    })
-
-    describe('When the deleted project is expired', function () {
-      beforeEach('soft delete the project', function (done) {
-        this.user.deleteProject(this.projectId, done)
-      })
-      beforeEach('hard delete the project', function (done) {
-        request.post(
-          `/internal/project/${this.projectId}/expire-deleted-project`,
-          {
-            auth: {
-              user: settings.apis.web.user,
-              pass: settings.apis.web.pass,
-              sendImmediately: true,
-            },
-          },
-          (error, res) => {
-            expect(error).not.to.exist
-            expect(res.statusCode).to.equal(200)
-
-            done()
-          }
-        )
-      })
-
-      it('should cleanup the deleteFiles', async function () {
-        const files = await db.deletedFiles
-          .find({}, { sort: { _id: 1 } })
-          .toArray()
-        expect(files).to.deep.equal([])
-      })
-    })
-  })
-
   describe('When the project has docs', function () {
     beforeEach(function (done) {
       this.user.getProject(this.projectId, (error, project) => {
@@ -367,6 +306,28 @@ describe('Deleting a project', function () {
         })
       })
 
+      it('Should log a successful deletion', function (done) {
+        request.post(
+          `/internal/project/${this.projectId}/expire-deleted-project`,
+          {
+            auth: {
+              user: settings.apis.web.user,
+              pass: settings.apis.web.pass,
+              sendImmediately: true,
+            },
+          },
+          (error, res) => {
+            expect(error).not.to.exist
+            expect(res.statusCode).to.equal(200)
+            expect(spy).to.have.been.calledWithMatch(
+              { projectId: this.projectId, userId: this.user._id },
+              'expired deleted project successfully'
+            )
+            done()
+          }
+        )
+      })
+
       it('Should destroy the docs', function (done) {
         expect(
           MockDocstoreApi.docs[this.projectId.toString()][this.docId.toString()]
diff --git a/services/web/test/acceptance/src/EditorHttpControllerTests.mjs b/services/web/test/acceptance/src/EditorHttpControllerTests.mjs
index de38f79be4..6dfdcf0858 100644
--- a/services/web/test/acceptance/src/EditorHttpControllerTests.mjs
+++ b/services/web/test/acceptance/src/EditorHttpControllerTests.mjs
@@ -14,43 +14,14 @@ describe('EditorHttpController', function () {
       done()
     })
   })
-  beforeEach('create doc', function (done) {
-    this.user.createDocInProject(
-      this.projectId,
-      null,
-      'potato.tex',
-      (error, docId) => {
-        this.docId = docId
-        done(error)
-      }
-    )
-  })
-
   describe('joinProject', function () {
-    it('should emit an empty deletedDocs array', function (done) {
+    it('returns project details', function (done) {
       this.user.joinProject(this.projectId, (error, details) => {
         if (error) return done(error)
 
-        expect(details.project.deletedDocs).to.deep.equal([])
+        expect(details.project.name).to.equal(this.projectName)
         done()
       })
     })
-
-    describe('after deleting a doc', function () {
-      beforeEach(function (done) {
-        this.user.deleteItemInProject(this.projectId, 'doc', this.docId, done)
-      })
-
-      it('should include the deleted doc in the deletedDocs array', function (done) {
-        this.user.joinProject(this.projectId, (error, details) => {
-          if (error) return done(error)
-
-          expect(details.project.deletedDocs).to.deep.equal([
-            { _id: this.docId, name: 'potato.tex' },
-          ])
-          done()
-        })
-      })
-    })
   })
 })
diff --git a/services/web/test/acceptance/src/LinkedFilesTests.mjs b/services/web/test/acceptance/src/LinkedFilesTests.mjs
index 2edcada015..8010aac407 100644
--- a/services/web/test/acceptance/src/LinkedFilesTests.mjs
+++ b/services/web/test/acceptance/src/LinkedFilesTests.mjs
@@ -443,7 +443,7 @@ describe('LinkedFiles', function () {
       projectTwoRootFolderId = projectTwo.rootFolder[0]._id.toString()
     })
 
-    it('should import the project.pdf file from the source project and refresh it', async function () {
+    it('should import the output.pdf file from the source project and refresh it', async function () {
       // import the file
       let { response, body } = await owner.doRequest('post', {
         url: `/project/${projectOneId}/linked_file`,
@@ -453,7 +453,7 @@ describe('LinkedFiles', function () {
           provider: 'project_output_file',
           data: {
             source_project_id: projectTwoId,
-            source_output_file_path: 'project.pdf',
+            source_output_file_path: 'output.pdf',
             build_id: '1234-abcd',
           },
         },
@@ -468,7 +468,7 @@ describe('LinkedFiles', function () {
       expect(firstFile.linkedFileData).to.deep.equal({
         provider: 'project_output_file',
         source_project_id: projectTwoId,
-        source_output_file_path: 'project.pdf',
+        source_output_file_path: 'output.pdf',
         build_id: '1234-abcd',
         importedAt: new Date().toISOString(),
       })
@@ -503,7 +503,7 @@ describe('LinkedFiles', function () {
         linkedFileData: {
           provider: 'project_output_file',
           v1_source_doc_id: 9999999, // We won't find this id in the database
-          source_output_file_path: 'project.pdf',
+          source_output_file_path: 'output.pdf',
         },
         _id: 'abcdef',
         rev: 0,
diff --git a/services/web/test/acceptance/src/MalformedFiletreesTests.mjs b/services/web/test/acceptance/src/MalformedFiletreesTests.mjs
index d1dd8ea937..16282d592d 100644
--- a/services/web/test/acceptance/src/MalformedFiletreesTests.mjs
+++ b/services/web/test/acceptance/src/MalformedFiletreesTests.mjs
@@ -5,6 +5,10 @@ import logger from '@overleaf/logger'
 import { filterOutput } from './helpers/settings.mjs'
 import { db, ObjectId } from '../../../app/src/infrastructure/mongodb.js'
 
+const lastUpdated = new Date(42)
+const lastUpdatedBy = new ObjectId()
+const lastUpdatedChanged = new Date(1337)
+
 async function runScriptFind() {
   try {
     const result = await promisify(exec)(
@@ -36,7 +40,18 @@ async function runScriptFix(instructions) {
 
 const findProjects = () =>
   db.projects
-    .find({}, { projection: { rootFolder: 1, _id: 1, version: 1 } })
+    .find(
+      {},
+      {
+        projection: {
+          rootFolder: 1,
+          _id: 1,
+          version: 1,
+          lastUpdated: 1,
+          lastUpdatedBy: 1,
+        },
+      }
+    )
     .toArray()
 
 const projectId = new ObjectId()
@@ -75,13 +90,15 @@ const wellFormedProject = {
       fileRefs: [wellFormedFileRef('fr00'), wellFormedFileRef('fr01')],
     },
   ],
+  lastUpdated,
+  lastUpdatedBy,
 }
 
 const testCases = [
   ...[{}, { rootFolder: undefined }, { rootFolder: '1234' }].map(
     (project, idx) => ({
       name: `bad rootFolder ${idx + 1}`,
-      project: { _id: projectId, ...project },
+      project: { _id: projectId, ...project, lastUpdated, lastUpdatedBy },
       expectFind: [
         {
           _id: null,
@@ -98,7 +115,7 @@ const testCases = [
 
   {
     name: `missing rootFolder`,
-    project: { _id: projectId, rootFolder: [] },
+    project: { _id: projectId, rootFolder: [], lastUpdated, lastUpdatedBy },
     expectFind: [
       {
         _id: null,
@@ -123,6 +140,8 @@ const testCases = [
             docs: [],
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -132,6 +151,8 @@ const testCases = [
     project: {
       _id: projectId,
       rootFolder: [{ _id: '1234' }],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       { reason: 'bad folder id', path: 'rootFolder.0._id' },
@@ -154,6 +175,8 @@ const testCases = [
     project: {
       _id: projectId,
       rootFolder: [{ _id: rootFolderId }],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       { reason: 'bad folder name', path: 'rootFolder.0.name' },
@@ -180,6 +203,8 @@ const testCases = [
             name: 'rootFolder',
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -197,6 +222,8 @@ const testCases = [
           fileRefs: [null, null],
         },
       ],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       {
@@ -222,7 +249,7 @@ const testCases = [
       msg: 'bad file-tree path',
     })),
     expectFixStdout:
-      '"gracefulShutdownInitiated":false,"processedLines":4,"success":3,"alreadyProcessed":1,"hash":0,"failed":0,"unmatched":0',
+      '"gracefulShutdownInitiated":false,"processedLines":4,"success":1,"alreadyProcessed":3,"hash":0,"failed":0,"unmatched":0',
     expectProject: updatedProject => {
       expect(updatedProject).to.deep.equal({
         _id: projectId,
@@ -235,6 +262,8 @@ const testCases = [
             folders: [],
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -255,6 +284,8 @@ const testCases = [
           fileRefs: [{ _id: null, name: 'ref-a' }, { name: 'ref-b' }],
         },
       ],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       { reason: 'bad folder id', path: 'rootFolder.0.folders.0._id', _id: 123 },
@@ -291,6 +322,8 @@ const testCases = [
             fileRefs: [],
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -314,6 +347,8 @@ const testCases = [
           ],
         },
       ],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       {
@@ -386,6 +421,8 @@ const testCases = [
             ],
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -403,6 +440,8 @@ const testCases = [
           ],
         },
       ],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       { path: 'rootFolder.0.fileRefs.0.hash', _id: strId('fa') },
@@ -442,6 +481,8 @@ const testCases = [
           fileRefs: [null, null, { ...wellFormedFileRef('fr02'), name: null }],
         },
       ],
+      lastUpdated,
+      lastUpdatedBy,
     },
     expectFind: [
       {
@@ -495,7 +536,7 @@ const testCases = [
       msg: 'bad file-tree path',
     })),
     expectFixStdout:
-      '"gracefulShutdownInitiated":false,"processedLines":9,"success":6,"alreadyProcessed":3,"hash":0,"failed":0,"unmatched":0',
+      '"gracefulShutdownInitiated":false,"processedLines":9,"success":4,"alreadyProcessed":5,"hash":0,"failed":0,"unmatched":0',
     expectProject: updatedProject => {
       expect(updatedProject).to.deep.equal({
         _id: projectId,
@@ -503,24 +544,146 @@ const testCases = [
           {
             _id: rootFolderId,
             name: 'rootFolder',
-            // FIXME: The 3 arrays should only contain 1 item: the well-formed item with the name 'untitled'.
-            folders: [
-              { ...wellFormedFolder('f02'), name: null },
-              null,
-              { name: 'untitled' },
-            ],
-            docs: [
-              { ...wellFormedDoc('d02'), name: null },
-              null,
-              { name: 'untitled' },
-            ],
-            fileRefs: [
-              { ...wellFormedFileRef('fr02'), name: null },
-              null,
-              { name: 'untitled' },
-            ],
+            folders: [{ ...wellFormedFolder('f02'), name: 'untitled' }],
+            docs: [{ ...wellFormedDoc('d02'), name: 'untitled' }],
+            fileRefs: [{ ...wellFormedFileRef('fr02'), name: 'untitled' }],
           },
         ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
+      })
+    },
+  },
+  {
+    name: 'bug: shifted arrays in filetree folder',
+    project: {
+      _id: projectId,
+      rootFolder: [
+        {
+          _id: rootFolderId,
+          name: 'rootFolder',
+          folders: [
+            null,
+            null,
+            {
+              ...wellFormedFolder('f02'),
+              name: 'folder 1',
+              folders: [null, null, { ...wellFormedFolder('f022') }],
+              docs: [null, null, { ...wellFormedDoc('d022'), name: null }],
+              fileRefs: [
+                null,
+                null,
+                { ...wellFormedFileRef('fr022'), name: null },
+              ],
+            },
+          ],
+
+          docs: [],
+          fileRefs: [],
+        },
+      ],
+      lastUpdated,
+      lastUpdatedBy,
+    },
+    expectFind: [
+      {
+        _id: rootFolderId.toString(),
+        path: 'rootFolder.0.folders.0',
+        reason: 'bad folder',
+      },
+      {
+        _id: rootFolderId.toString(),
+        path: 'rootFolder.0.folders.1',
+        reason: 'bad folder',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.folders.0',
+        reason: 'bad folder',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.folders.1',
+        reason: 'bad folder',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.docs.0',
+        reason: 'bad doc',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.docs.1',
+        reason: 'bad doc',
+      },
+      {
+        _id: strId('d022'),
+        path: 'rootFolder.0.folders.2.docs.2.name',
+        reason: 'bad doc name',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.fileRefs.0',
+        reason: 'bad file',
+      },
+      {
+        _id: strId('f02'),
+        path: 'rootFolder.0.folders.2.fileRefs.1',
+        reason: 'bad file',
+      },
+      {
+        _id: strId('fr022'),
+        path: 'rootFolder.0.folders.2.fileRefs.2.name',
+        reason: 'bad file name',
+      },
+    ].map(entry => ({
+      ...entry,
+      projectId: projectId.toString(),
+      msg: 'bad file-tree path',
+    })),
+    expectFixStdout:
+      '"gracefulShutdownInitiated":false,"processedLines":10,"success":4,"alreadyProcessed":6,"hash":0,"failed":0,"unmatched":0',
+    expectProject: updatedProject => {
+      expect(updatedProject).to.deep.equal({
+        _id: projectId,
+        rootFolder: [
+          {
+            _id: rootFolderId,
+            name: 'rootFolder',
+            folders: [
+              {
+                ...wellFormedFolder('f02'),
+                name: 'folder 1',
+                docs: [
+                  {
+                    ...wellFormedDoc('d022'),
+                    name: 'untitled',
+                  },
+                ],
+                fileRefs: [
+                  {
+                    ...wellFormedFileRef('fr022'),
+                    // FIXME: Make the names unique across different file types
+                    name: 'untitled',
+                  },
+                ],
+                folders: [
+                  {
+                    ...wellFormedFolder('f022'),
+                    name: 'f022',
+                    folders: [],
+                    docs: [],
+                    fileRefs: [],
+                  },
+                ],
+              },
+            ],
+            docs: [],
+            fileRefs: [],
+          },
+        ],
+        lastUpdated: lastUpdatedChanged,
+        lastUpdatedBy: null,
       })
     },
   },
@@ -558,6 +721,9 @@ describe('find_malformed_filetrees and fix_malformed_filetree scripts', function
             expect(expectFixStdout).to.be.a('string')
             expect(stdout).to.include(expectFixStdout)
             const [updatedProject] = await findProjects()
+            if (updatedProject.lastUpdated > lastUpdated) {
+              updatedProject.lastUpdated = lastUpdatedChanged
+            }
             expectProject(updatedProject)
           })
         }
diff --git a/services/web/test/acceptance/src/PrimaryEmailCheckTests.mjs b/services/web/test/acceptance/src/PrimaryEmailCheckTests.mjs
index 1598373f34..bc85f96a5d 100644
--- a/services/web/test/acceptance/src/PrimaryEmailCheckTests.mjs
+++ b/services/web/test/acceptance/src/PrimaryEmailCheckTests.mjs
@@ -69,10 +69,7 @@ describe('PrimaryEmailCheck', function () {
           $set: { lastPrimaryEmailCheck: new Date(time) },
         })
 
-        await userHelper.confirmEmail(
-          userHelper.user._id,
-          userHelper.user.email
-        )
+        await userHelper.confirmEmail(userHelper.user.email)
       })
 
       it("shouldn't be redirected from project list to the primary email check page", async function () {
@@ -153,10 +150,7 @@ describe('PrimaryEmailCheck', function () {
           $set: { lastPrimaryEmailCheck: new Date(time) },
         })
 
-        await userHelper.confirmEmail(
-          userHelper.user._id,
-          userHelper.user.email
-        )
+        await userHelper.confirmEmail(userHelper.user.email)
       })
 
       it("shouldn't be redirected from project list to the primary email check page", async function () {
@@ -219,14 +213,8 @@ describe('PrimaryEmailCheck', function () {
       })
 
       beforeEach(async function () {
-        await userHelper.confirmEmail(
-          userHelper.user._id,
-          userHelper.user.email
-        )
-        await userHelper.addEmailAndConfirm(
-          userHelper.user._id,
-          'secondary@overleaf.com'
-        )
+        await userHelper.confirmEmail(userHelper.user.email)
+        await userHelper.addEmailAndConfirm('secondary@overleaf.com')
 
         checkResponse = await userHelper.fetch(
           '/user/emails/primary-email-check',
diff --git a/services/web/test/acceptance/src/ProjectCRUDTests.mjs b/services/web/test/acceptance/src/ProjectCRUDTests.mjs
index 2212dc8e8b..082499ba91 100644
--- a/services/web/test/acceptance/src/ProjectCRUDTests.mjs
+++ b/services/web/test/acceptance/src/ProjectCRUDTests.mjs
@@ -125,25 +125,6 @@ describe('Project CRUD', function () {
         expectObjectIdArrayEqual(trashedProject.archived, [])
       })
     })
-
-    describe('with a legacy boolean state', function () {
-      it('should mark the project as not archived for the user', async function () {
-        await Project.updateOne(
-          { _id: this.projectId },
-          { $set: { archived: true } }
-        ).exec()
-
-        const { response } = await this.user.doRequest(
-          'POST',
-          `/project/${this.projectId}/trash`
-        )
-
-        expect(response.statusCode).to.equal(200)
-
-        const trashedProject = await Project.findById(this.projectId).exec()
-        expectObjectIdArrayEqual(trashedProject.archived, [])
-      })
-    })
   })
 
   describe('when untrashing a project', function () {
diff --git a/services/web/test/acceptance/src/ProjectInviteTests.mjs b/services/web/test/acceptance/src/ProjectInviteTests.mjs
index df13d71d37..e61feff6c9 100644
--- a/services/web/test/acceptance/src/ProjectInviteTests.mjs
+++ b/services/web/test/acceptance/src/ProjectInviteTests.mjs
@@ -200,7 +200,7 @@ const expectInvitePage = (user, link, callback) => {
   tryFollowInviteLink(user, link, (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(200)
-    expect(body).to.match(/<title>Project Invite - .*<\/title>/)
+    expect(body).to.match(/<title[^>]*>Project Invite - .*<\/title>/)
     callback()
   })
 }
@@ -210,7 +210,7 @@ const expectInvalidInvitePage = (user, link, callback) => {
   tryFollowInviteLink(user, link, (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(404)
-    expect(body).to.match(/<title>Invalid Invite - .*<\/title>/)
+    expect(body).to.match(/<title[^>]*>Invalid Invite - .*<\/title>/)
     callback()
   })
 }
@@ -237,7 +237,9 @@ const expectLoginPage = (user, callback) => {
   tryFollowLoginLink(user, '/login', (err, response, body) => {
     expect(err).not.to.exist
     expect(response.statusCode).to.equal(200)
-    expect(body).to.match(/<title>(Login|Log in to Overleaf) - .*<\/title>/)
+    expect(body).to.match(
+      /<title[^>]*>(Login|Log in to Overleaf) - .*<\/title>/
+    )
     callback()
   })
 }
diff --git a/services/web/test/acceptance/src/ProjectStructureTests.mjs b/services/web/test/acceptance/src/ProjectStructureTests.mjs
index a1f48a8448..d87daba5f5 100644
--- a/services/web/test/acceptance/src/ProjectStructureTests.mjs
+++ b/services/web/test/acceptance/src/ProjectStructureTests.mjs
@@ -138,6 +138,47 @@ describe('ProjectStructureChanges', function () {
     })
   })
 
+  describe('when sending an upload request without a file', function () {
+    describe('project', function () {
+      it('should reject the request with status 400', async function () {
+        const { response, body } = await owner.doRequest('POST', {
+          uri: 'project/new/upload',
+          json: true,
+          formData: {
+            name: 'foo',
+          },
+        })
+
+        expect(response.statusCode).to.equal(400)
+        expect(body).to.deep.equal({
+          success: false,
+          error: 'invalid_upload_request',
+        })
+      })
+    })
+
+    describe('file', function () {
+      it('should reject the request with status 400', async function () {
+        const projectId = await owner.createProject('foo', {
+          template: 'blank',
+        })
+        const { response, body } = await owner.doRequest('POST', {
+          uri: `project/${projectId}/upload`,
+          json: true,
+          formData: {
+            name: 'foo.txt',
+          },
+        })
+
+        expect(response.statusCode).to.equal(400)
+        expect(body).to.deep.equal({
+          success: false,
+          error: 'invalid_upload_request',
+        })
+      })
+    })
+  })
+
   describe('uploading an empty zipfile', function () {
     let res
 
diff --git a/services/web/test/acceptance/src/helpers/SAMLHelper.mjs b/services/web/test/acceptance/src/helpers/SAMLHelper.mjs
index 6732454c1e..531e3fdacc 100644
--- a/services/web/test/acceptance/src/helpers/SAMLHelper.mjs
+++ b/services/web/test/acceptance/src/helpers/SAMLHelper.mjs
@@ -12,7 +12,7 @@ const __dirname = fileURLToPath(new URL('.', import.meta.url))
 const samlDataDefaults = {
   firstName: 'first-name',
   hasEntitlement: 'Y',
-  issuer: 'Overleaf',
+  issuer: 'https://www.overleaf.test/saml/ukamf/sp/entity',
   lastName: 'last-name',
   requestId: 'dummy-request-id',
 }
diff --git a/services/web/test/acceptance/src/helpers/Subscription.mjs b/services/web/test/acceptance/src/helpers/Subscription.mjs
index ee6f1a7d8a..1ce0e87afd 100644
--- a/services/web/test/acceptance/src/helpers/Subscription.mjs
+++ b/services/web/test/acceptance/src/helpers/Subscription.mjs
@@ -25,6 +25,7 @@ class PromisifiedSubscription {
     this.ssoConfig = options.ssoConfig
     this.groupPolicy = options.groupPolicy
     this.addOns = options.addOns
+    this.paymentProvider = options.paymentProvider
   }
 
   async ensureExists() {
@@ -44,6 +45,18 @@ class PromisifiedSubscription {
     return await db.subscriptions.findOne({ _id: new ObjectId(this._id) })
   }
 
+  async getSSOConfig() {
+    const subscription = await this.get()
+
+    if (!subscription.ssoConfig) {
+      return
+    }
+
+    return await db.ssoConfigs.findOne({
+      _id: new ObjectId(subscription.ssoConfig),
+    })
+  }
+
   async getWithGroupPolicy() {
     // eslint-disable-next-line no-restricted-syntax
     return await SubscriptionModel.findById(this._id)
@@ -72,7 +85,14 @@ class PromisifiedSubscription {
   }
 
   async enableManagedUsers() {
-    await Modules.promises.hooks.fire('enableManagedUsers', this._id)
+    await Modules.promises.hooks.fire('enableManagedUsers', this._id, {
+      initiatorId: this.admin_id,
+      ipAddress: '123.456.789.0',
+    })
+  }
+
+  async disableManagedUsers() {
+    await Modules.promises.hooks.fire('disableManagedUsers', this._id)
   }
 
   async enableFeatureSSO() {
@@ -125,7 +145,11 @@ class PromisifiedSubscription {
     return await Modules.promises.hooks.fire(
       'enrollInManagedSubscription',
       user._id,
-      subscription
+      subscription,
+      {
+        initiatorId: user._id,
+        ipAddress: '0:0:0:0',
+      }
     )
   }
 
diff --git a/services/web/test/acceptance/src/helpers/User.mjs b/services/web/test/acceptance/src/helpers/User.mjs
index 5f8ac2903f..4371ecbe49 100644
--- a/services/web/test/acceptance/src/helpers/User.mjs
+++ b/services/web/test/acceptance/src/helpers/User.mjs
@@ -10,6 +10,7 @@ import fs from 'node:fs'
 import Path from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { Cookie } from 'tough-cookie'
+
 const __dirname = fileURLToPath(new URL('.', import.meta.url))
 const COOKIE_DOMAIN = settings.cookieDomain
 // The cookie domain has a leading '.' but the cookie jar stores it without.
@@ -36,6 +37,8 @@ class User {
     this.request = request.defaults({
       jar: this.jar,
     })
+    this.signUpDate = options.signUpDate ?? new Date()
+    this.labsProgram = options.labsProgram || false
   }
 
   getSession(options, callback) {
@@ -256,13 +259,19 @@ class User {
 
   getAuditLog(callback) {
     this.get((error, user) => {
-      if (error) return callback(error)
-      if (!user) return callback(new Error('User not found'))
+      if (error) {
+        return callback(error)
+      }
+      if (!user) {
+        return callback(new Error('User not found'))
+      }
 
       db.userAuditLogEntries
         .find({ userId: new ObjectId(this._id) })
         .toArray((error, auditLog) => {
-          if (error) return callback(error)
+          if (error) {
+            return callback(error)
+          }
           callback(null, auditLog || [])
         })
     })
@@ -270,7 +279,9 @@ class User {
 
   getAuditLogWithoutNoise(callback) {
     this.getAuditLog((error, auditLog) => {
-      if (error) return callback(error)
+      if (error) {
+        return callback(error)
+      }
       callback(
         null,
         auditLog.filter(entry => {
@@ -412,7 +423,9 @@ class User {
   }
 
   ensureUserExists(callback) {
-    if (this._id) return callback() // already exists
+    if (this._id) {
+      return callback()
+    } // already exists
     const filter = { email: this.email }
     const options = { upsert: true, new: true, setDefaultsOnInsert: true }
 
@@ -425,7 +438,14 @@ class User {
 
         UserModel.findOneAndUpdate(
           filter,
-          { $set: { hashedPassword, emails: this.emails } },
+          {
+            $set: {
+              hashedPassword,
+              emails: this.emails,
+              signUpDate: this.signUpDate,
+              labsProgram: this.labsProgram,
+            },
+          },
           options
         )
           .then(user => {
@@ -440,7 +460,9 @@ class User {
   // Update and persist feature upgrade. Downgrades will be flaky!
   upgradeFeatures(features, callback) {
     this.setFeatures(features, err => {
-      if (err) return callback(err)
+      if (err) {
+        return callback(err)
+      }
       // Persist the feature update, otherwise the next feature refresh will reset them.
       this.setFeaturesOverride(
         {
@@ -1188,7 +1210,9 @@ class User {
           json: newSettings,
         },
         (err, response, body) => {
-          if (err) return callback(err)
+          if (err) {
+            return callback(err)
+          }
           if (response.statusCode !== 200) {
             return callback(
               new Error(
diff --git a/services/web/test/acceptance/src/helpers/UserHelper.mjs b/services/web/test/acceptance/src/helpers/UserHelper.mjs
index cfeafed47c..05fef85604 100644
--- a/services/web/test/acceptance/src/helpers/UserHelper.mjs
+++ b/services/web/test/acceptance/src/helpers/UserHelper.mjs
@@ -7,7 +7,6 @@ import UserGetter from '../../../../app/src/Features/User/UserGetter.js'
 import UserUpdater from '../../../../app/src/Features/User/UserUpdater.js'
 import moment from 'moment'
 import fetch from 'node-fetch'
-import { db } from '../../../../app/src/infrastructure/mongodb.js'
 import mongodb from 'mongodb-legacy'
 
 import { UserAuditLogEntry } from '../../../../app/src/models/UserAuditLogEntry.js'
@@ -19,11 +18,20 @@ import { RateLimiter } from '../../../../app/src/infrastructure/RateLimiter.js'
 const { ObjectId } = mongodb
 
 const rateLimiters = {
-  resendConfirmation: new RateLimiter('resend-confirmation'),
+  sendConfirmation: new RateLimiter('send-confirmation'),
 }
 
 let globalUserNum = Settings.test.counterInit
 
+const throwIfErrorResponse = async response => {
+  if (response.status < 200 || response.status >= 300) {
+    const body = await response.text()
+    throw new Error(
+      `request failed: status=${response.status} body=${JSON.stringify(body)}`
+    )
+  }
+}
+
 class UserHelper {
   /**
    * Create UserHelper
@@ -129,13 +137,7 @@ class UserHelper {
     // get csrf token from api and store
     const response = await this.fetch('/dev/csrf')
     const body = await response.text()
-    if (response.status !== 200) {
-      throw new Error(
-        `get csrf token failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
+    await throwIfErrorResponse(response)
     this._csrfToken = body
   }
 
@@ -145,14 +147,7 @@ class UserHelper {
   async getSession() {
     const response = await this.fetch('/dev/session')
     const body = await response.text()
-
-    if (response.status !== 200) {
-      throw new Error(
-        `get session failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
+    await throwIfErrorResponse(response)
     return JSON.parse(body)
   }
 
@@ -160,24 +155,22 @@ class UserHelper {
     const response = await this.fetch(
       `/dev/split_test/get_assignment?splitTestName=${splitTestName}`
     )
+    await throwIfErrorResponse(response)
     const body = await response.text()
-
-    if (response.status !== 200) {
-      throw new Error(
-        `get split test assignment failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
     return JSON.parse(body)
   }
 
-  async getEmailConfirmationCode() {
+  /**
+   *
+   * @param {'pendingExistingEmail'|'pendingUserRegistration'|'pendingSecondaryEmail'}sessionKey
+   * @return {Promise<*>}
+   */
+  async getEmailConfirmationCode(sessionKey) {
     const session = await this.getSession()
 
-    const code = session.pendingUserRegistration?.confirmCode
+    const code = session[sessionKey]?.confirmCode
     if (!code) {
-      throw new Error('No confirmation code found in session')
+      throw new Error(`No confirmation code found in session (${sessionKey})`)
     }
     return code
   }
@@ -383,14 +376,8 @@ class UserHelper {
       body: JSON.stringify(userData),
       ...options,
     })
+    await throwIfErrorResponse(response)
     const body = await response.json()
-    if (response.status !== 200) {
-      throw new Error(
-        `register failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
     if (body.message && body.message.type === 'error') {
       throw new Error(`register api error: ${body.message.text}`)
     }
@@ -400,7 +387,9 @@ class UserHelper {
       )
     }
 
-    const code = await userHelper.getEmailConfirmationCode()
+    const code = await userHelper.getEmailConfirmationCode(
+      'pendingUserRegistration'
+    )
 
     const confirmationResponse = await userHelper.fetch(
       '/registration/confirm-email',
@@ -442,23 +431,16 @@ class UserHelper {
   }
 
   async addEmail(email) {
-    const response = await this.fetch('/user/emails', {
+    const response = await this.fetch('/user/emails/secondary', {
       method: 'POST',
       body: new URLSearchParams([['email', email]]),
     })
-    const body = await response.text()
-    if (response.status !== 204) {
-      throw new Error(
-        `add email failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
+    await throwIfErrorResponse(response)
   }
 
-  async addEmailAndConfirm(userId, email) {
+  async addEmailAndConfirm(email) {
     await this.addEmail(email)
-    await this.confirmEmail(userId, email)
+    await this.confirmSecondaryEmail()
   }
 
   async changeConfirmationDate(userId, email, date) {
@@ -517,42 +499,42 @@ class UserHelper {
     await this.changeConfirmationDate(userId, email, date)
   }
 
-  async confirmEmail(userId, email) {
+  async confirmEmail(email) {
     // clear ratelimiting on resend confirmation endpoint
-    await rateLimiters.resendConfirmation.delete(userId)
-    // UserHelper.createUser does not create a confirmation token
-    let response = await this.fetch('/user/emails/resend_confirmation', {
+    await rateLimiters.sendConfirmation.delete(this.user._id)
+    const requestConfirmationCode = await this.fetch(
+      '/user/emails/send-confirmation-code',
+      {
+        method: 'POST',
+        body: new URLSearchParams({ email }),
+      }
+    )
+    await throwIfErrorResponse(requestConfirmationCode)
+    const code = await this.getEmailConfirmationCode('pendingExistingEmail')
+    const requestConfirmCode = await this.fetch('/user/emails/confirm-code', {
       method: 'POST',
-      body: new URLSearchParams([['email', email]]),
+      body: new URLSearchParams({ code }),
     })
-    if (response.status !== 200) {
-      const body = await response.text()
-      throw new Error(
-        `resend confirmation failed: status=${
-          response.status
-        } body=${JSON.stringify(body)}`
-      )
-    }
-    const tokenData = await db.tokens
-      .find({
-        use: 'email_confirmation',
-        'data.user_id': userId.toString(),
-        'data.email': email,
-        usedAt: { $exists: false },
-      })
-      .next()
-    response = await this.fetch('/user/emails/confirm', {
-      method: 'POST',
-      body: new URLSearchParams([['token', tokenData.token]]),
-    })
-    if (response.status !== 200) {
-      const body = await response.text()
-      throw new Error(
-        `confirm email failed: status=${response.status} body=${JSON.stringify(
-          body
-        )}`
-      )
-    }
+    await throwIfErrorResponse(requestConfirmCode)
+  }
+
+  async confirmSecondaryEmail() {
+    const code = await this.getEmailConfirmationCode('pendingSecondaryEmail')
+    const requestConfirmCode = await this.fetch(
+      '/user/emails/confirm-secondary',
+      {
+        method: 'POST',
+        body: new URLSearchParams({ code }),
+      }
+    )
+    await throwIfErrorResponse(requestConfirmCode)
+  }
+
+  async unconfirmEmail(email) {
+    await UserUpdater.promises.updateUser(
+      { _id: this.user._id, 'emails.email': email.toLowerCase() },
+      { $unset: { 'emails.$.confirmedAt': 1, 'emails.$.reconfirmedAt': 1 } }
+    )
   }
 }
 
diff --git a/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs b/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
index e79bfd5b2e..2bc3010412 100644
--- a/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
+++ b/services/web/test/acceptance/src/helpers/expectErrorResponse.mjs
@@ -12,7 +12,7 @@ export default {
   restricted: {
     html(response, body) {
       expect(response.statusCode).to.equal(403)
-      expect(body).to.match(/<head><title>Restricted/)
+      expect(body).to.match(/<head><title translate="no">Restricted/)
     },
     json(response, body) {
       expect(response.statusCode).to.equal(403)
diff --git a/services/web/test/acceptance/src/helpers/groupSSO.mjs b/services/web/test/acceptance/src/helpers/groupSSO.mjs
index f7efeb9e63..4388279578 100644
--- a/services/web/test/acceptance/src/helpers/groupSSO.mjs
+++ b/services/web/test/acceptance/src/helpers/groupSSO.mjs
@@ -34,7 +34,10 @@ export const baseSsoConfig = {
   userIdAttribute,
 } // the database also sets enabled and validated, but we cannot set that in the POST request for /manage/groups/:ID/settings/sso
 
-export async function createGroupSSO() {
+export async function createGroupSSO(
+  SSOConfigValidated = true,
+  useSettingsUKAMF
+) {
   const nonSSOMemberHelper = await UserHelper.createUser()
   const nonSSOMember = nonSSOMemberHelper.user
 
@@ -44,11 +47,17 @@ export async function createGroupSSO() {
   await groupAdminUser.ensureUserExists()
   await memberUser.ensureUserExists()
 
-  const ssoConfig = new SSOConfig({
+  const ssoConfigDoc = {
     ...baseSsoConfig,
     enabled: true,
-    validated: true,
-  })
+    validated: SSOConfigValidated,
+  }
+
+  if (useSettingsUKAMF) {
+    ssoConfigDoc.useSettingsUKAMF = useSettingsUKAMF // conditionally adding because this field was added after group SSO was released and it will be undefined for some groups
+  }
+
+  const ssoConfig = new SSOConfig(ssoConfigDoc)
 
   await ssoConfig.save()
 
@@ -68,12 +77,15 @@ export async function createGroupSSO() {
   const enrollmentUrl = getEnrollmentUrl(subscriptionId)
   const internalProviderId = getProviderId(subscriptionId)
 
-  await linkGroupMember(
-    memberUser.email,
-    memberUser.password,
-    subscriptionId,
-    'mock@email.com'
-  )
+  if (SSOConfigValidated) {
+    await linkGroupMember(
+      memberUser.email,
+      memberUser.password,
+      subscriptionId,
+      'mock@email.com',
+      useSettingsUKAMF
+    )
+  }
 
   const userHelper = new UserHelper()
 
@@ -96,8 +108,13 @@ export async function linkGroupMember(
   userEmail,
   userPassword,
   groupId,
-  externalUserId
+  externalUserId,
+  usingSettingsUKAMF
 ) {
+  const samlSettings = usingSettingsUKAMF
+    ? Settings.saml.ukamf
+    : Settings.saml.groupSSO
+
   // eslint-disable-next-line no-restricted-syntax
   const subscription = await SubscriptionModel.findById(groupId)
     .populate('ssoConfig')
@@ -119,7 +136,7 @@ export async function linkGroupMember(
   })
   if (
     !headers.get('location') ||
-    !headers.get('location').includes(Settings.saml.groupSSO.initPath)
+    !headers.get('location').includes(samlSettings.initPath)
   ) {
     throw new Error('invalid redirect when linking to group SSO')
   }
@@ -131,18 +148,22 @@ export async function linkGroupMember(
   // redirect to IdP
   const idpEntryPointUrl = new URL(initSSOResponse.headers.get('location'))
   const requestId = await SAMLHelper.getRequestId(idpEntryPointUrl)
-  const response = await userHelper.fetch(Settings.saml.groupSSO.path, {
+  const response = await userHelper.fetch(samlSettings.path, {
     method: 'POST',
     body: new URLSearchParams({
       SAMLResponse: SAMLHelper.createMockSamlResponse({
         requestId,
         userIdAttribute,
         uniqueId: externalUserId,
-        issuer: 'https://www.overleaf.test/saml/group-sso/meta',
+        issuer: samlSettings.issuer,
       }),
     }),
   })
-  if (response.status !== 302) {
+
+  if (
+    response.status !== 302 &&
+    response.headers.get('location').path !== '/project'
+  ) {
     throw new Error('failed to link group SSO')
   }
 
@@ -166,6 +187,29 @@ export async function linkGroupMember(
   return userHelper
 }
 
+export async function checkUserHasSSOLinked(userId, groupId) {
+  const internalProviderId = getProviderId(groupId)
+  const user = await UserGetter.promises.getUser(
+    { _id: userId },
+    { samlIdentifiers: 1, enrollment: 1 }
+  )
+
+  const { enrollment, samlIdentifiers } = user
+  const linkedToGroupSSO = samlIdentifiers.some(
+    identifier => identifier.providerId === internalProviderId
+  )
+  if (!linkedToGroupSSO) {
+    throw new Error('user saml identifiers are not linked to subscription')
+  }
+
+  const userIsEnrolledInSSO = enrollment.sso.some(
+    sso => sso.groupId.toString() === groupId.toString()
+  )
+  if (!userIsEnrolledInSSO) {
+    throw new Error('user is not enrolled in subscription')
+  }
+}
+
 export async function setConfigAndEnableSSO(
   subscriptionHelper,
   adminEmailPassword,
diff --git a/services/web/test/acceptance/src/helpers/request.js b/services/web/test/acceptance/src/helpers/request.js
index 16f8db0700..aa538892e4 100644
--- a/services/web/test/acceptance/src/helpers/request.js
+++ b/services/web/test/acceptance/src/helpers/request.js
@@ -1,5 +1,3 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Sanity-check the conversion and remove this comment.
 const BASE_URL = `http://${process.env.HTTP_TEST_HOST || '127.0.0.1'}:23000`
 const request = require('request').defaults({
   baseUrl: BASE_URL,
@@ -21,4 +19,5 @@ module.exports.promises = {
       })
     })
   },
+  BASE_URL,
 }
diff --git a/services/web/test/acceptance/src/mocks/MockClsiApi.mjs b/services/web/test/acceptance/src/mocks/MockClsiApi.mjs
index 102b75b0d3..de2fc488c0 100644
--- a/services/web/test/acceptance/src/mocks/MockClsiApi.mjs
+++ b/services/web/test/acceptance/src/mocks/MockClsiApi.mjs
@@ -9,14 +9,14 @@ class MockClsiApi extends AbstractMockApi {
         error: null,
         outputFiles: [
           {
-            url: `http://clsi:3013/project/${req.params.project_id}/build/1234/output/project.pdf`,
-            path: 'project.pdf',
+            url: `http://clsi:3013/project/${req.params.project_id}/build/1234/output/output.pdf`,
+            path: 'output.pdf',
             type: 'pdf',
             build: 1234,
           },
           {
-            url: `http://clsi:3013/project/${req.params.project_id}/build/1234/output/project.log`,
-            path: 'project.log',
+            url: `http://clsi:3013/project/${req.params.project_id}/build/1234/output/output.log`,
+            path: 'output.log',
             type: 'log',
             build: 1234,
           },
@@ -36,9 +36,9 @@ class MockClsiApi extends AbstractMockApi {
       '/project/:project_id/build/:build_id/output/*',
       (req, res) => {
         const filename = req.params[0]
-        if (filename === 'project.pdf') {
+        if (filename === 'output.pdf') {
           plainTextResponse(res, 'mock-pdf')
-        } else if (filename === 'project.log') {
+        } else if (filename === 'output.log') {
           plainTextResponse(res, 'mock-log')
         } else {
           res.sendStatus(404)
diff --git a/services/web/test/acceptance/src/mocks/MockGitBridgeApi.mjs b/services/web/test/acceptance/src/mocks/MockGitBridgeApi.mjs
index 4927814b9a..805bbdd8fe 100644
--- a/services/web/test/acceptance/src/mocks/MockGitBridgeApi.mjs
+++ b/services/web/test/acceptance/src/mocks/MockGitBridgeApi.mjs
@@ -3,12 +3,16 @@ import AbstractMockApi from './AbstractMockApi.mjs'
 class MockGitBridgeApi extends AbstractMockApi {
   reset() {
     this.projects = {}
+    this.postbacks = {}
   }
 
   applyRoutes() {
     this.app.delete('/api/projects/:projectId', (req, res) => {
       this.deleteProject(req, res)
     })
+    this.app.post('/postback/:id', (req, res) => {
+      this.postback(req, res)
+    })
   }
 
   deleteProject(req, res) {
@@ -16,6 +20,24 @@ class MockGitBridgeApi extends AbstractMockApi {
     delete this.projects[projectId]
     res.sendStatus(204)
   }
+
+  // Git bridge accepts a postback to indicate when a operation is complete.
+  // Each postback is identified by a unique ID.
+  // Allow registering a handler which resolves when a postback is received.
+  registerPostback(id) {
+    return new Promise((resolve, reject) => {
+      this.postbacks[id] = { resolve, reject }
+    })
+  }
+
+  postback(req, res) {
+    const { id } = req.params
+    const postbackData = req.body
+    if (this.postbacks[id]) {
+      this.postbacks[id].resolve(postbackData)
+    }
+    res.sendStatus(204)
+  }
 }
 
 export default MockGitBridgeApi
diff --git a/services/web/test/acceptance/src/mocks/MockRecurlyApi.mjs b/services/web/test/acceptance/src/mocks/MockRecurlyApi.mjs
index c1e7c2aa8b..091ff62ad5 100644
--- a/services/web/test/acceptance/src/mocks/MockRecurlyApi.mjs
+++ b/services/web/test/acceptance/src/mocks/MockRecurlyApi.mjs
@@ -7,6 +7,9 @@ class MockRecurlyApi extends AbstractMockApi {
     this.mockSubscriptions = []
     this.redemptions = {}
     this.coupons = {}
+    this.rateLimitResetSeconds = Math.ceil(
+      (Date.now() + 24 * 60 * 60 * 1000) / 1000
+    )
   }
 
   addMockSubscription(recurlySubscription) {
@@ -25,7 +28,21 @@ class MockRecurlyApi extends AbstractMockApi {
     )
   }
 
+  getRateLimitHeaders() {
+    return {
+      'X-RateLimit-Limit': 1000,
+      'X-RateLimit-Remaining': 999,
+      'X-RateLimit-Reset': this.rateLimitResetSeconds,
+    }
+  }
+
   applyRoutes() {
+    this.app.use((req, res, next) => {
+      for (const [name, v] of Object.entries(this.getRateLimitHeaders())) {
+        res.setHeader(name, v)
+      }
+      next()
+    })
     this.app.get('/subscriptions/:id', (req, res) => {
       const subscription = this.getMockSubscriptionById(req.params.id)
       if (!subscription) {
diff --git a/services/web/test/frontend/bootstrap.js b/services/web/test/frontend/bootstrap.js
index cdc9300138..496b7b588d 100644
--- a/services/web/test/frontend/bootstrap.js
+++ b/services/web/test/frontend/bootstrap.js
@@ -65,8 +65,12 @@ globalThis.BroadcastChannel =
   global.BroadcastChannel =
   window.BroadcastChannel =
     class BroadcastChannel {
+      // Unused arguments left to document the signature of the stubbed function.
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       addEventListener(type, listener) {}
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       removeEventListener(type, listener) {}
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       postMessage(message) {}
     }
 
@@ -98,3 +102,14 @@ globalThis.DOMParser = window.DOMParser
 
 // Polyfill for IndexedDB
 require('fake-indexeddb/auto')
+
+const fetchMock = require('fetch-mock').default
+
+fetchMock.spyGlobal()
+fetchMock.config.fetch = global.fetch
+fetchMock.config.Response = fetch.Response
+
+Object.defineProperty(navigator, 'onLine', {
+  configurable: true,
+  get: () => true,
+})
diff --git a/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx b/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx
index b5e49765a5..d65669f720 100644
--- a/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx
+++ b/services/web/test/frontend/components/editor-left-menu/editor-left-menu.spec.tsx
@@ -4,11 +4,16 @@ import {
   OverallThemeMeta,
   SpellCheckLanguage,
 } from '../../../../types/project-settings'
-import { EditorProviders } from '../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeProjectProvider,
+} from '../../helpers/editor-providers'
 import { mockScope } from './scope'
 import { Folder } from '../../../../types/folder'
 import { docsInFolder } from '@/features/file-tree/util/docs-in-folder'
 import getMeta from '@/utils/meta'
+import { mockProject } from '../../features/source-editor/helpers/mock-project'
+import { UserId } from '../../../../types/user'
 
 describe('<EditorLeftMenu />', function () {
   beforeEach(function () {
@@ -56,14 +61,15 @@ describe('<EditorLeftMenu />', function () {
     })
 
     it('render full menu', function () {
-      const scope = mockScope({
-        ui: {
-          leftMenuShown: true,
-        },
-      })
+      const scope = mockScope()
+      const project = mockProject()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders
+          scope={scope}
+          layoutContext={{ leftMenuShown: true }}
+          providers={{ ProjectProvider: makeProjectProvider(project) }}
+        >
           <EditorLeftMenu />
         </EditorProviders>
       )
@@ -75,7 +81,7 @@ describe('<EditorLeftMenu />', function () {
 
       // Actions Menu
       cy.findByRole('heading', { name: 'Actions' })
-      cy.findByRole('button', { name: 'Copy Project' })
+      cy.findByRole('button', { name: 'Copy project' })
       cy.findByRole('button', { name: 'Word Count' })
 
       // Sync Menu
@@ -105,19 +111,17 @@ describe('<EditorLeftMenu />', function () {
       cy.findByRole('heading', { name: 'Help' })
       cy.findByRole('button', { name: 'Show Hotkeys' })
       cy.findByRole('link', { name: 'Documentation' })
-      cy.findByRole('button', { name: 'Contact Us' })
+      cy.findByRole('button', { name: 'Contact us' })
     })
 
     describe('download menu', function () {
       it('have a correct source & pdf download url', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
-
+        const scope = mockScope()
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -142,26 +146,25 @@ describe('<EditorLeftMenu />', function () {
           },
         })
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
 
-        cy.findByRole('button', { name: 'Copy Project' }).click()
-        cy.findByRole('heading', { name: 'Copy Project' })
+        cy.findByRole('button', { name: 'Copy project' }).click()
+        cy.findByRole('heading', { name: 'Copy project' })
 
         // try closing & re-opening the modal with different methods
         cy.findByRole('button', { name: 'Close' }).click()
-        cy.findByRole('button', { name: 'Copy Project' }).click()
+        cy.findByRole('button', { name: 'Copy project' }).click()
         cy.findByRole('button', { name: 'Cancel' }).click()
-        cy.findByRole('button', { name: 'Copy Project' }).click()
+        cy.findByRole('button', { name: 'Copy project' }).click()
 
         cy.findByLabelText('New Name').focus()
         cy.findByLabelText('New Name').clear()
@@ -184,14 +187,13 @@ describe('<EditorLeftMenu />', function () {
           },
         }).as('wordCount')
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -217,15 +219,6 @@ describe('<EditorLeftMenu />', function () {
         })
 
         const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-          project: {
-            members: [],
-            owner: {
-              _id: '123',
-            },
-          },
           user: {
             features: {
               dropbox: false,
@@ -234,7 +227,18 @@ describe('<EditorLeftMenu />', function () {
         })
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+            projectOwner={{
+              _id: '123' as UserId,
+              email: 'owner@example.com',
+              first_name: 'Test',
+              last_name: 'Owner',
+              privileges: 'owner',
+              signUpDate: new Date('2025-07-07').toISOString(),
+            }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -244,22 +248,26 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows git modal correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-          project: {
-            owner: {
-              _id: '123',
-            },
-            features: {
-              gitBridge: true,
-            },
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+            projectOwner={{
+              _id: '123' as UserId,
+              email: 'owner@example.com',
+              first_name: 'Test',
+              last_name: 'Owner',
+              privileges: 'owner',
+              signUpDate: new Date('2025-07-07').toISOString(),
+            }}
+            projectFeatures={
+              {
+                gitBridge: true,
+              } as any
+            }
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -270,22 +278,26 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows git modal paywall correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-          project: {
-            owner: {
-              _id: '123',
-            },
-            features: {
-              gitBridge: false,
-            },
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+            projectOwner={{
+              _id: '123' as UserId,
+              email: 'owner@example.com',
+              first_name: 'Test',
+              last_name: 'Owner',
+              privileges: 'owner',
+              signUpDate: new Date('2025-07-07').toISOString(),
+            }}
+            projectFeatures={
+              {
+                gitBridge: false,
+              } as any
+            }
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -304,14 +316,13 @@ describe('<EditorLeftMenu />', function () {
           enabled: false,
         }).as('project-status')
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -335,14 +346,13 @@ describe('<EditorLeftMenu />', function () {
 
     describe('settings menu', function () {
       it('shows compiler menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -369,14 +379,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows texlive version menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -410,14 +419,14 @@ describe('<EditorLeftMenu />', function () {
           folders: [],
         }
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope} rootFolder={[rootFolder as any]}>
+          <EditorProviders
+            layoutContext={{ leftMenuShown: true }}
+            scope={scope}
+            rootFolder={[rootFolder as any]}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -451,14 +460,13 @@ describe('<EditorLeftMenu />', function () {
 
         window.metaAttributesCache.set('ol-languages', languages)
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -475,14 +483,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows dictionary modal correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -493,14 +500,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows auto-complete menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -517,14 +523,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows auto-close brackets menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -541,14 +546,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows code check menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -579,14 +583,13 @@ describe('<EditorLeftMenu />', function () {
           legacyEditorThemes
         )
 
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -619,14 +622,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows overall theme menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -643,14 +645,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows keybindings menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -667,14 +668,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows font size menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -713,14 +713,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows font family menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -741,14 +740,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows line height menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -765,14 +763,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows pdf viewer menu correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -791,14 +788,13 @@ describe('<EditorLeftMenu />', function () {
 
     describe('help menu', function () {
       it('shows hotkeys modal correctly', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -808,14 +804,13 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows correct url for documentation', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
@@ -828,19 +823,18 @@ describe('<EditorLeftMenu />', function () {
       })
 
       it('shows correct contact us modal', function () {
-        const scope = mockScope({
-          ui: {
-            leftMenuShown: true,
-          },
-        })
+        const scope = mockScope()
 
         cy.mount(
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            layoutContext={{ leftMenuShown: true }}
+          >
             <EditorLeftMenu />
           </EditorProviders>
         )
 
-        cy.findByRole('button', { name: 'Contact Us' }).click()
+        cy.findByRole('button', { name: 'Contact us' }).click()
         cy.findByText('Affected project URL (Optional)')
       })
     })
@@ -848,16 +842,13 @@ describe('<EditorLeftMenu />', function () {
 
   describe('for anonymous users', function () {
     it('render minimal menu', function () {
-      const scope = mockScope({
-        ui: {
-          leftMenuShown: true,
-        },
-      })
+      const scope = mockScope()
+
       window.metaAttributesCache.set('ol-anonymous', true)
       Object.assign(getMeta('ol-ExposedSettings'), { ieeeBrandId: 123 })
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} layoutContext={{ leftMenuShown: true }}>
           <EditorLeftMenu />
         </EditorProviders>
       )
@@ -869,7 +860,7 @@ describe('<EditorLeftMenu />', function () {
 
       // Actions Menu
       cy.findByRole('heading', { name: 'Actions' }).should('not.exist')
-      cy.findByRole('button', { name: 'Copy Project' }).should('not.exist')
+      cy.findByRole('button', { name: 'Copy project' }).should('not.exist')
       cy.findByRole('button', { name: 'Word Count' }).should('not.exist')
 
       // Sync Menu
@@ -899,7 +890,7 @@ describe('<EditorLeftMenu />', function () {
       cy.findByRole('heading', { name: 'Help' })
       cy.findByRole('button', { name: 'Show Hotkeys' })
       cy.findByRole('button', { name: 'Documentation' }).should('not.exist')
-      cy.findByRole('link', { name: 'Contact Us' }).should('not.exist')
+      cy.findByRole('link', { name: 'Contact us' }).should('not.exist')
     })
   })
 })
diff --git a/services/web/test/frontend/components/editor-left-menu/scope.tsx b/services/web/test/frontend/components/editor-left-menu/scope.tsx
index ba1764c359..8281fe1f72 100644
--- a/services/web/test/frontend/components/editor-left-menu/scope.tsx
+++ b/services/web/test/frontend/components/editor-left-menu/scope.tsx
@@ -12,7 +12,6 @@ type Scope = {
       getSnapshot?: () => string
     }
   }
-  hasLintingError?: boolean
   ui?: {
     view?: 'editor' | 'history' | 'file' | 'pdf'
     pdfLayout?: 'flat' | 'sideBySide' | 'split'
@@ -46,11 +45,5 @@ export const mockScope = (scope?: Scope) => ({
       getSnapshot: () => 'some doc content',
     },
   },
-  hasLintingError: false,
-  ui: {
-    view: 'editor',
-    pdfLayout: 'sideBySide',
-    leftMenuShown: false,
-  },
   ...scope,
 })
diff --git a/services/web/test/frontend/components/pdf-preview/pdf-js-viewer.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-js-viewer.spec.tsx
index 12ba83cb48..0c15f912c9 100644
--- a/services/web/test/frontend/components/pdf-preview/pdf-js-viewer.spec.tsx
+++ b/services/web/test/frontend/components/pdf-preview/pdf-js-viewer.spec.tsx
@@ -1,7 +1,7 @@
 import { EditorProviders } from '../../helpers/editor-providers'
 import PdfJsViewer from '../../../../frontend/js/features/pdf-preview/components/pdf-js-viewer'
 import { mockScope } from './scope'
-import { getContainerEl } from 'cypress/react'
+import { getContainerEl } from 'cypress/react18'
 import { unmountComponentAtNode } from 'react-dom'
 import { PdfPreviewProvider } from '../../../../frontend/js/features/pdf-preview/components/pdf-preview-provider'
 
@@ -23,7 +23,7 @@ describe('<PdfJSViewer/>', function () {
       <EditorProviders scope={scope}>
         <PdfPreviewProvider>
           <div className="pdf-viewer">
-            <PdfJsViewer url="/build/123/output.pdf" />
+            <PdfJsViewer url="/build/123/output.pdf?clsiserverid=foo" />
           </div>
         </PdfPreviewProvider>
       </EditorProviders>
@@ -68,7 +68,7 @@ describe('<PdfJSViewer/>', function () {
       <EditorProviders scope={scope}>
         <PdfPreviewProvider>
           <div className="pdf-viewer">
-            <PdfJsViewer url="/build/123/output.pdf" />
+            <PdfJsViewer url="/build/123/output.pdf?clsiserverid=foo" />
           </div>
         </PdfPreviewProvider>
       </EditorProviders>
@@ -88,7 +88,7 @@ describe('<PdfJSViewer/>', function () {
       <EditorProviders scope={scope}>
         <PdfPreviewProvider>
           <div className="pdf-viewer">
-            <PdfJsViewer url="/build/123/output.pdf" />
+            <PdfJsViewer url="/build/123/output.pdf?clsiserverid=foo" />
           </div>
         </PdfPreviewProvider>
       </EditorProviders>
diff --git a/services/web/test/frontend/components/pdf-preview/pdf-logs-entries.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-logs-entries.spec.tsx
index 4f134006c2..a3067b566e 100644
--- a/services/web/test/frontend/components/pdf-preview/pdf-logs-entries.spec.tsx
+++ b/services/web/test/frontend/components/pdf-preview/pdf-logs-entries.spec.tsx
@@ -11,6 +11,7 @@ import {
 import { EditorView } from '@codemirror/view'
 import { OpenDocuments } from '@/features/ide-react/editor/open-documents'
 import { LogEntry } from '@/features/pdf-preview/util/types'
+import { EditorViewContext } from '@/features/ide-react/context/editor-view-context'
 
 describe('<PdfLogsEntries/>', function () {
   const fakeFindEntityResult: FindResult = {
@@ -18,7 +19,7 @@ describe('<PdfLogsEntries/>', function () {
     entity: { _id: '123', name: '123 Doc' },
   }
 
-  const FileTreePathProvider: FC = ({ children }) => (
+  const FileTreePathProvider: FC<React.PropsWithChildren> = ({ children }) => (
     <FileTreePathContext.Provider
       value={{
         dirname: cy.stub(),
@@ -34,7 +35,7 @@ describe('<PdfLogsEntries/>', function () {
     </FileTreePathContext.Provider>
   )
 
-  const EditorManagerProvider: FC = ({ children }) => {
+  const EditorManagerProvider: FC<React.PropsWithChildren> = ({ children }) => {
     const value = {
       openDocWithId: cy.spy().as('openDocWithId'),
       // @ts-ignore
@@ -48,6 +49,19 @@ describe('<PdfLogsEntries/>', function () {
     )
   }
 
+  const EditorViewProvider: FC<React.PropsWithChildren> = ({ children }) => {
+    const value = {
+      view: new EditorView({ doc: '\\documentclass{article}' }),
+      setView: cy.stub(),
+    }
+
+    return (
+      <EditorViewContext.Provider value={value}>
+        {children}
+      </EditorViewContext.Provider>
+    )
+  }
+
   const logEntries: LogEntry[] = [
     {
       file: 'main.tex',
@@ -62,10 +76,6 @@ describe('<PdfLogsEntries/>', function () {
     },
   ]
 
-  const scope = {
-    'editor.view': new EditorView({ doc: '\\documentclass{article}' }),
-  }
-
   beforeEach(function () {
     cy.interceptCompile()
     cy.interceptEvents()
@@ -73,7 +83,7 @@ describe('<PdfLogsEntries/>', function () {
 
   it('displays human readable hint', function () {
     cy.mount(
-      <EditorProviders scope={scope}>
+      <EditorProviders providers={{ EditorViewProvider }}>
         <PdfLogsEntries entries={logEntries} />
       </EditorProviders>
     )
@@ -84,8 +94,11 @@ describe('<PdfLogsEntries/>', function () {
   it('opens doc on click', function () {
     cy.mount(
       <EditorProviders
-        scope={scope}
-        providers={{ EditorManagerProvider, FileTreePathProvider }}
+        providers={{
+          EditorManagerProvider,
+          FileTreePathProvider,
+          EditorViewProvider,
+        }}
       >
         <PdfLogsEntries entries={logEntries} />
       </EditorProviders>
@@ -114,8 +127,11 @@ describe('<PdfLogsEntries/>', function () {
 
     cy.mount(
       <EditorProviders
-        scope={scope}
-        providers={{ EditorManagerProvider, FileTreePathProvider }}
+        providers={{
+          EditorManagerProvider,
+          FileTreePathProvider,
+          EditorViewProvider,
+        }}
       >
         <PdfLogsEntries entries={logEntries} />
       </EditorProviders>
@@ -154,8 +170,11 @@ describe('<PdfLogsEntries/>', function () {
 
     cy.mount(
       <EditorProviders
-        scope={scope}
-        providers={{ EditorManagerProvider, FileTreePathProvider }}
+        providers={{
+          EditorManagerProvider,
+          FileTreePathProvider,
+          EditorViewProvider,
+        }}
       >
         <PdfLogsEntries entries={logEntries} />
       </EditorProviders>
diff --git a/services/web/test/frontend/components/pdf-preview/pdf-preview-detached-root.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-preview-detached-root.spec.tsx
index cbb65861f9..4262c8070b 100644
--- a/services/web/test/frontend/components/pdf-preview/pdf-preview-detached-root.spec.tsx
+++ b/services/web/test/frontend/components/pdf-preview/pdf-preview-detached-root.spec.tsx
@@ -8,6 +8,10 @@ describe('<PdfPreviewDetachedRoot/>', function () {
     window.metaAttributesCache.set('ol-detachRole', 'detached')
     window.metaAttributesCache.set('ol-projectName', 'Project Name')
     window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
+    window.metaAttributesCache.set('ol-compileSettings', {
+      reducedWarningThreshold: 'default',
+      compileTimeout: 240,
+    })
 
     cy.interceptEvents()
   })
diff --git a/services/web/test/frontend/components/pdf-preview/pdf-preview.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-preview.spec.tsx
index 245009de74..34a3893ab5 100644
--- a/services/web/test/frontend/components/pdf-preview/pdf-preview.spec.tsx
+++ b/services/web/test/frontend/components/pdf-preview/pdf-preview.spec.tsx
@@ -7,7 +7,9 @@ import {
   IdeView,
   useLayoutContext,
 } from '../../../../frontend/js/shared/context/layout-context'
-import { FC, useEffect } from 'react'
+import { FC, PropsWithChildren, useEffect } from 'react'
+import { useLocalCompileContext } from '@/shared/context/local-compile-context'
+import { ProjectCompiler } from '../../../../types/project-settings'
 
 const storeAndFireEvent = (win: typeof window, key: string, value: unknown) => {
   localStorage.setItem(key, value)
@@ -28,18 +30,38 @@ const Layout: FC<{ layout: IdeLayout; view?: IdeView }> = ({
 }
 
 describe('<PdfPreview/>', function () {
+  let projectId: string
   beforeEach(function () {
+    /**
+     * There are time sensitive tests in this test suite. They need to wait for a Promise before resolving a request.
+     *
+     * Using a promise across the test-env (browser) vs stub-env (server) causes additional latency.
+     *
+     * This latency seems to stack up when adding more intercepts for the same path. Using static responses for some of these intercepts does not help.
+     *
+     * All of that seems like a bug in Cypress. For now just work around it by using a unique projectId for each intercept.
+     */
+    projectId = Math.random().toString().slice(2)
+
     window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
     window.metaAttributesCache.set(
       'ol-compilesUserContentDomain',
       'https://compiles-user.dev-overleaf.com'
     )
+    window.metaAttributesCache.set('ol-splitTestVariants', {
+      'populate-clsi-cache': 'enabled',
+    })
+    window.metaAttributesCache.set('ol-projectOwnerHasPremiumOnPageLoad', true)
+    window.metaAttributesCache.set('ol-compileSettings', {
+      reducedWarningThreshold: 'default',
+      compileTimeout: 240,
+    })
     cy.interceptEvents()
   })
 
   it('renders the PDF preview', function () {
     window.metaAttributesCache.set('ol-preventCompileOnLoad', false)
-    cy.interceptCompile('compile')
+    cy.interceptCompile()
 
     const scope = mockScope()
 
@@ -57,6 +79,216 @@ describe('<PdfPreview/>', function () {
     cy.findByRole('button', { name: 'Recompile' })
   })
 
+  it('uses the cache when available', function () {
+    cy.interceptCompile({
+      prefix: 'compile',
+      times: 1,
+      cached: true,
+      regular: false,
+    })
+
+    const scope = mockScope()
+
+    cy.mount(
+      <EditorProviders scope={scope}>
+        <div className="pdf-viewer">
+          <PdfPreview />
+        </div>
+      </EditorProviders>
+    )
+
+    // wait for "compile from cache on load" to finish
+    cy.waitForCompile({ pdf: true, cached: true, regular: false })
+
+    cy.contains('Your Paper')
+  })
+
+  it('uses the cache when available then compiles', function () {
+    cy.interceptCompile({
+      prefix: 'compile',
+      times: 1,
+      cached: true,
+      regular: false,
+    })
+
+    const scope = mockScope()
+
+    cy.mount(
+      <EditorProviders scope={scope}>
+        <div className="pdf-viewer">
+          <PdfPreview />
+        </div>
+      </EditorProviders>
+    )
+
+    // wait for "compile from cache on load" to finish
+    cy.waitForCompile({ pdf: true, cached: true, regular: false })
+    cy.contains('Your Paper')
+
+    // Then trigger a new compile
+    cy.interceptCompile({
+      prefix: 'recompile',
+      times: 1,
+      cached: false,
+      outputPDFFixture: 'output-2.pdf',
+    })
+
+    // press the Recompile button => compile
+    cy.findByRole('button', { name: 'Recompile' }).click()
+
+    // wait for compile to finish
+    cy.waitForCompile({ prefix: 'recompile', pdf: true })
+    cy.contains('Modern Authoring Tools for Science')
+  })
+
+  describe('racing compile from cache and regular compile trigger', function () {
+    for (const [timing] of ['before rendering', 'after rendering']) {
+      it(`replaces the compile from cache with a regular compile - ${timing}`, function () {
+        const requestedOnce = new Set()
+        ;['log', 'pdf', 'blg'].forEach(ext => {
+          cy.intercept({ pathname: `/build/*/output.${ext}` }, req => {
+            if (requestedOnce.has(ext)) {
+              throw new Error(
+                `compile from cache triggered extra ${ext} request: ${req.url}`
+              )
+            }
+            requestedOnce.add(ext)
+            req.reply({ fixture: `build/output.${ext},null` })
+          }).as(`compile-${ext}`)
+        })
+        const { promise, resolve } = Promise.withResolvers<void>()
+        cy.interceptCompileFromCacheRequest({
+          promise,
+          times: 1,
+        }).as('cached-compile')
+        cy.interceptCompileRequest().as('compile')
+
+        const scope = mockScope()
+        cy.mount(
+          <EditorProviders scope={scope} projectId={projectId}>
+            <div className="pdf-viewer">
+              <PdfPreview />
+            </div>
+          </EditorProviders>
+        )
+
+        // press the Recompile button => compile
+        cy.findByRole('button', { name: 'Recompile' }).click()
+
+        if (timing === 'before rendering') {
+          cy.then(() => resolve())
+          cy.wait('@cached-compile')
+        }
+
+        // wait for rendering to finish
+        cy.waitForCompile({ pdf: true, cached: false })
+
+        if (timing === 'after rendering') {
+          cy.then(() => resolve())
+          cy.wait('@cached-compile')
+        }
+
+        cy.contains('Your Paper')
+        cy.then(() => Array.from(requestedOnce).sort().join(',')).should(
+          'equal',
+          'blg,log,pdf'
+        )
+      })
+    }
+  })
+
+  describe('clsi-cache project settings validation', function () {
+    const cases = {
+      // Flaky, skip for now
+      'uses compile from cache when nothing changed': {
+        cached: true,
+        setup: () => {},
+        props: {},
+      },
+      'ignores the compile from cache when imageName changed': {
+        cached: false,
+        setup: () => {},
+        props: {
+          imageName: 'texlive-full:2025.1',
+        },
+      },
+      'ignores the compile from cache when compiler changed': {
+        cached: false,
+        setup: () => {},
+        props: {
+          compiler: 'lualatex' as ProjectCompiler,
+        },
+      },
+      'ignores the compile from cache when draft mode changed': {
+        cached: false,
+        setup: () => {
+          cy.window().then(w =>
+            w.localStorage.setItem(`draft:${projectId}`, 'true')
+          )
+        },
+        props: {},
+      },
+      'ignores the compile from cache when stopOnFirstError mode changed': {
+        cached: false,
+        setup: () => {
+          cy.window().then(w =>
+            w.localStorage.setItem(`stop_on_first_error:${projectId}`, 'true')
+          )
+        },
+        props: {},
+      },
+      'ignores the compile from cache when rootDoc changed': {
+        cached: false,
+        setup: () => {},
+        props: {
+          rootDocId: 'new-root-doc-id',
+          rootFolder: [
+            {
+              _id: 'root-folder-id',
+              name: 'rootFolder',
+              docs: [
+                {
+                  _id: '_root_doc_id',
+                  name: 'main.tex',
+                },
+                {
+                  _id: 'new-root-doc-id',
+                  name: 'new-main.tex',
+                },
+              ],
+              folders: [],
+              fileRefs: [],
+            },
+          ],
+        },
+      },
+    }
+    Object.entries(cases).forEach(([name, { cached, setup, props }]) => {
+      it(name, function () {
+        cy.interceptCompile({
+          cached: true,
+          regular: !cached,
+        })
+
+        const scope = mockScope()
+        window.metaAttributesCache.set('ol-preventCompileOnLoad', false)
+        setup()
+
+        cy.mount(
+          <EditorProviders scope={scope} projectId={projectId} {...props}>
+            <div className="pdf-viewer">
+              <PdfPreview />
+            </div>
+          </EditorProviders>
+        )
+
+        // wait for compile to finish
+        cy.waitForCompile({ pdf: true, cached, regular: !cached })
+        cy.contains('Your Paper')
+      })
+    })
+  })
+
   it('runs a compile when the Recompile button is pressed', function () {
     cy.interceptCompile()
 
@@ -232,14 +464,20 @@ describe('<PdfPreview/>', function () {
     const scope = mockScope()
     // enable linting in the editor
     const userSettings = { syntaxValidation: true }
-    // mock a linting error
-    scope.hasLintingError = true
+
+    const WithLintingErrors: FC<PropsWithChildren> = ({ children }) => {
+      const { setHasLintingError } = useLocalCompileContext()
+      useEffect(() => setHasLintingError(true), [setHasLintingError])
+      return children
+    }
 
     cy.mount(
       <EditorProviders scope={scope} userSettings={userSettings}>
-        <div className="pdf-viewer">
-          <PdfPreview />
-        </div>
+        <WithLintingErrors>
+          <div className="pdf-viewer">
+            <PdfPreview />
+          </div>
+        </WithLintingErrors>
       </EditorProviders>
     )
 
@@ -479,7 +717,7 @@ describe('<PdfPreview/>', function () {
 
       cy.findByRole('button', { name: 'Recompile' }).click()
       cy.waitForCompile({ pdf: true })
-      cy.interceptCompile('recompile')
+      cy.interceptCompile({ prefix: 'recompile' })
 
       cy.intercept('DELETE', '/project/*/output*', {
         statusCode: 204,
diff --git a/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx b/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx
index b2a64b89a4..3cba86d03d 100644
--- a/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx
+++ b/services/web/test/frontend/components/pdf-preview/pdf-synctex-controls.spec.tsx
@@ -3,7 +3,10 @@ import { cloneDeep } from 'lodash'
 import { useDetachCompileContext as useCompileContext } from '../../../../frontend/js/shared/context/detach-compile-context'
 import { useFileTreeData } from '../../../../frontend/js/shared/context/file-tree-data-context'
 import { useEffect } from 'react'
-import { EditorProviders } from '../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorOpenDocProvider,
+} from '../../helpers/editor-providers'
 import { mockScope } from './scope'
 import { detachChannel, testDetachChannel } from '../../helpers/detach-channel'
 import { FindResult } from '@/features/file-tree/util/path'
@@ -73,6 +76,23 @@ const WithSelectedEntities = ({
   return null
 }
 
+function mockProviders() {
+  return {
+    EditorOpenDocProvider: makeEditorOpenDocProvider({
+      openDocName: 'main.tex',
+      currentDocumentId: null,
+      currentDocument: {
+        doc_id: 'test-doc',
+        getSnapshot: () => 'some doc content',
+        hasBufferedOps: () => false,
+        on: () => {},
+        off: () => {},
+        leaveAndCleanUpPromise: () => Promise.resolve(),
+      } as any,
+    }),
+  }
+}
+
 describe('<PdfSynctexControls/>', function () {
   beforeEach(function () {
     window.metaAttributesCache.set('ol-project_id', 'test-project')
@@ -84,9 +104,10 @@ describe('<PdfSynctexControls/>', function () {
     cy.interceptCompile()
 
     const scope = mockScope()
+    const providers = mockProviders()
 
     cy.mount(
-      <EditorProviders scope={scope}>
+      <EditorProviders scope={scope} providers={providers}>
         <WithPosition mockPosition={mockPosition} />
         <WithSelectedEntities mockSelectedEntities={mockSelectedEntities} />
         <PdfSynctexControls />
@@ -145,9 +166,10 @@ describe('<PdfSynctexControls/>', function () {
     cy.interceptCompile()
 
     const scope = mockScope()
+    const providers = mockProviders()
 
     cy.mount(
-      <EditorProviders scope={scope}>
+      <EditorProviders scope={scope} providers={providers}>
         <WithPosition mockPosition={mockPosition} />
         <WithSelectedEntities
           mockSelectedEntities={
@@ -169,9 +191,10 @@ describe('<PdfSynctexControls/>', function () {
     cy.interceptCompile()
 
     const scope = mockScope()
+    const providers = mockProviders()
 
     cy.mount(
-      <EditorProviders scope={scope}>
+      <EditorProviders scope={scope} providers={providers}>
         <WithPosition mockPosition={mockPosition} />
         <WithSelectedEntities
           mockSelectedEntities={[{ type: 'fileRef' }] as FindResult[]}
@@ -196,9 +219,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <WithPosition mockPosition={mockPosition} />
           <WithSelectedEntities mockSelectedEntities={mockSelectedEntities} />
           <PdfSynctexControls />
@@ -218,9 +242,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <WithPosition mockPosition={mockPosition} />
           <WithSelectedEntities mockSelectedEntities={mockSelectedEntities} />
           <PdfSynctexControls />
@@ -279,9 +304,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <WithPosition mockPosition={mockPosition} />
           <WithSelectedEntities mockSelectedEntities={mockSelectedEntities} />
           <PdfSynctexControls />
@@ -317,9 +343,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <WithPosition mockPosition={mockPosition} />
           <PdfSynctexControls />
         </EditorProviders>
@@ -338,9 +365,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <PdfSynctexControls />
         </EditorProviders>
       )
@@ -385,9 +413,10 @@ describe('<PdfSynctexControls/>', function () {
       cy.interceptCompile()
 
       const scope = mockScope()
+      const providers = mockProviders()
 
       cy.mount(
-        <EditorProviders scope={scope}>
+        <EditorProviders scope={scope} providers={providers}>
           <WithPosition mockPosition={mockPosition} />
           <PdfSynctexControls />
         </EditorProviders>
diff --git a/services/web/test/frontend/components/pdf-preview/scope.tsx b/services/web/test/frontend/components/pdf-preview/scope.tsx
index 8e61102108..08dbebbd3c 100644
--- a/services/web/test/frontend/components/pdf-preview/scope.tsx
+++ b/services/web/test/frontend/components/pdf-preview/scope.tsx
@@ -6,18 +6,13 @@ export const mockScope = () => ({
     pdfViewer: 'pdfjs',
   },
   editor: {
-    open_doc_name: 'main.tex',
     sharejs_doc: {
       doc_id: 'test-doc',
       getSnapshot: () => 'some doc content',
+      hasBufferedOps: () => false,
     },
     view: new EditorView({
       doc: '\\documentclass{article}',
     }),
   },
-  hasLintingError: false,
-  ui: {
-    view: 'editor',
-    pdfLayout: 'sideBySide',
-  },
 })
diff --git a/services/web/test/frontend/components/project-list/notifications/group-invitation.spec.tsx b/services/web/test/frontend/components/project-list/notifications/group-invitation.spec.tsx
index 5767302fed..c29de58f98 100644
--- a/services/web/test/frontend/components/project-list/notifications/group-invitation.spec.tsx
+++ b/services/web/test/frontend/components/project-list/notifications/group-invitation.spec.tsx
@@ -27,6 +27,10 @@ describe('<GroupInvitationNotification />', function () {
   }
 
   beforeEach(function () {
+    cy.intercept('GET', `/user/notification/${notification._id}`, {
+      statusCode: 200,
+      body: notification,
+    }).as('getNotification')
     cy.intercept(
       'PUT',
       `/subscription/invites/${notification.messageOpts.token}`,
@@ -48,6 +52,7 @@ describe('<GroupInvitationNotification />', function () {
 
       cy.findByRole('button', { name: 'Join now' }).click()
 
+      cy.wait('@getNotification')
       cy.wait('@acceptInvite')
 
       cy.findByText(
@@ -62,10 +67,7 @@ describe('<GroupInvitationNotification />', function () {
 
   describe('user with existing personal subscription', function () {
     beforeEach(function () {
-      window.metaAttributesCache.set(
-        'ol-hasIndividualRecurlySubscription',
-        true
-      )
+      window.metaAttributesCache.set('ol-hasIndividualPaidSubscription', true)
     })
 
     it('is able to join group successfully without cancelling personal subscription', function () {
@@ -85,6 +87,7 @@ describe('<GroupInvitationNotification />', function () {
 
       cy.findByRole('button', { name: 'Join now' }).click()
 
+      cy.wait('@getNotification')
       cy.wait('@acceptInvite')
 
       cy.findByText(
@@ -119,6 +122,7 @@ describe('<GroupInvitationNotification />', function () {
 
       cy.findByRole('button', { name: 'Join now' }).click()
 
+      cy.wait('@getNotification')
       cy.wait('@acceptInvite')
 
       cy.findByText(
diff --git a/services/web/test/frontend/components/shared/accessible-modal.spec.tsx b/services/web/test/frontend/components/shared/accessible-modal.spec.tsx
deleted file mode 100644
index 38fb995275..0000000000
--- a/services/web/test/frontend/components/shared/accessible-modal.spec.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { Modal } from 'react-bootstrap'
-import AccessibleModal from '../../../../frontend/js/shared/components/accessible-modal'
-
-describe('AccessibleModal', function () {
-  it('renders a visible modal', function () {
-    const handleHide = cy.stub()
-
-    cy.mount(
-      <AccessibleModal onHide={handleHide} show>
-        <Modal.Header closeButton>
-          <Modal.Title>Test</Modal.Title>
-        </Modal.Header>
-
-        <Modal.Body>Some content</Modal.Body>
-      </AccessibleModal>
-    )
-
-    cy.findByRole('dialog').should('have.length', 1)
-  })
-
-  it('does not render a hidden modal', function () {
-    const handleHide = cy.stub()
-
-    cy.mount(
-      <AccessibleModal onHide={handleHide}>
-        <Modal.Header closeButton>
-          <Modal.Title>Test</Modal.Title>
-        </Modal.Header>
-
-        <Modal.Body>Some content</Modal.Body>
-      </AccessibleModal>
-    )
-
-    cy.findByRole('dialog', { hidden: true }).should('have.length', 0)
-  })
-})
diff --git a/services/web/test/frontend/components/shared/select.spec.tsx b/services/web/test/frontend/components/shared/select.spec.tsx
index 17220f5ef0..fc94b76153 100644
--- a/services/web/test/frontend/components/shared/select.spec.tsx
+++ b/services/web/test/frontend/components/shared/select.spec.tsx
@@ -1,5 +1,7 @@
 import { useCallback, FormEvent } from 'react'
-import { Button, Form, FormControl } from 'react-bootstrap'
+import OLButton from '@/features/ui/components/ol/ol-button'
+import OLForm from '@/features/ui/components/ol/ol-form'
+import OLFormControl from '@/features/ui/components/ol/ol-form-control'
 import {
   Select,
   SelectProps,
@@ -62,17 +64,17 @@ describe('<Select />', function () {
     it('renders default text', function () {
       render({ defaultText: 'Choose an item' })
       cy.findByTestId('spinner').should('not.exist')
-      cy.findByRole('textbox', { name: 'Choose an item' })
+      cy.findByRole('combobox').should('have.value', 'Choose an item')
     })
 
     it('renders default item', function () {
       render({ defaultItem: testData[2] })
-      cy.findByRole('textbox', { name: 'Demo item 3' })
+      cy.findByRole('combobox').should('have.value', 'Demo item 3')
     })
 
     it('default item takes precedence over default text', function () {
       render({ defaultText: 'Choose an item', defaultItem: testData[2] })
-      cy.findByRole('textbox', { name: 'Demo item 3' })
+      cy.findByRole('combobox').should('have.value', 'Demo item 3')
     })
 
     it('renders label', function () {
@@ -81,8 +83,8 @@ describe('<Select />', function () {
         label: 'test label',
         optionalLabel: false,
       })
-      cy.findByRole('textbox', { name: 'test label' })
-      cy.findByRole('textbox', { name: '(Optional)' }).should('not.exist')
+      cy.findByRole('combobox', { name: 'test label' })
+      cy.findByRole('combobox', { name: '(Optional)' }).should('not.exist')
     })
 
     it('renders optional label', function () {
@@ -91,7 +93,7 @@ describe('<Select />', function () {
         label: 'test label',
         optionalLabel: true,
       })
-      cy.findByRole('textbox', { name: 'test label (Optional)' })
+      cy.findByRole('combobox', { name: 'test label (Optional)' })
     })
 
     it('renders a spinner while loading when there is a label', function () {
@@ -115,7 +117,7 @@ describe('<Select />', function () {
   describe('items rendering', function () {
     it('renders all items', function () {
       render({ defaultText: 'Choose an item' })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
 
       cy.findByRole('option', { name: 'Demo item 1' })
       cy.findByRole('option', { name: 'Demo item 2' })
@@ -127,7 +129,7 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         itemToSubtitle: x => String(x?.sub),
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
 
       cy.findByRole('option', { name: 'Demo item 1 Subtitle 1' })
       cy.findByRole('option', { name: 'Demo item 2 Subtitle 2' })
@@ -138,27 +140,27 @@ describe('<Select />', function () {
   describe('item selection', function () {
     it('cannot select an item when disabled', function () {
       render({ defaultText: 'Choose an item', disabled: true })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click({
+      cy.findByRole('combobox').click({
         force: true,
       })
       cy.findByRole('option', { name: 'Demo item 1' }).should('not.exist')
       cy.findByRole('option', { name: 'Demo item 2' }).should('not.exist')
       cy.findByRole('option', { name: 'Demo item 3' }).should('not.exist')
-      cy.findByRole('textbox', { name: 'Choose an item' })
+      cy.findByRole('combobox').should('have.value', 'Choose an item')
     })
 
     it('renders only the selected item after selection', function () {
       render({ defaultText: 'Choose an item' })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
 
       cy.findByRole('option', { name: 'Demo item 1' })
       cy.findByRole('option', { name: 'Demo item 2' })
       cy.findByRole('option', { name: 'Demo item 3' }).click()
 
-      cy.findByRole('textbox', { name: 'Choose an item' }).should('not.exist')
+      cy.findByRole('combobox').should('not.have.value', 'Choose an item')
       cy.findByRole('option', { name: 'Demo item 1' }).should('not.exist')
       cy.findByRole('option', { name: 'Demo item 2' }).should('not.exist')
-      cy.findByRole('textbox', { name: 'Demo item 3' })
+      cy.findByRole('combobox').should('have.value', 'Demo item 3')
     })
 
     it('invokes callback after selection', function () {
@@ -168,7 +170,7 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         onSelectedItemChanged: selectionHandler,
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
       cy.findByRole('option', { name: 'Demo item 2' }).click()
 
       cy.get('@selectionHandler').should(
@@ -193,7 +195,7 @@ describe('<Select />', function () {
       const submitHandler = cy.stub().as('submitHandler')
       render({ defaultItem: testData[1], onSubmit: submitHandler })
 
-      cy.findByRole('textbox', { name: 'Demo item 2' }).click() // open dropdown
+      cy.findByRole('combobox').click() // open dropdown
       cy.findByText('Demo item 3').click() // choose a different item
 
       cy.findByText('submit').click()
@@ -230,7 +232,7 @@ describe('<Select />', function () {
         []
       )
 
-      function handleSubmit(event: FormEvent<Form>) {
+      function handleSubmit(event: FormEvent<HTMLFormElement>) {
         event.preventDefault()
         const formData = new FormData(event.target as HTMLFormElement)
         // a plain object is more convenient to work later with assertions
@@ -238,10 +240,10 @@ describe('<Select />', function () {
       }
 
       return (
-        <Form onSubmit={handleSubmit}>
-          <FormControl componentClass={selectComponent} />
-          <Button type="submit">submit</Button>
-        </Form>
+        <OLForm onSubmit={handleSubmit}>
+          <OLFormControl as={selectComponent} />
+          <OLButton type="submit">submit</OLButton>
+        </OLForm>
       )
     }
 
@@ -260,7 +262,7 @@ describe('<Select />', function () {
         </div>
       )
 
-      cy.findByRole('textbox', { name: 'Demo item 1' }).click() // open dropdown
+      cy.findByRole('combobox').click() // open dropdown
       cy.findByRole('option', { name: 'Demo item 3' }).click() // choose a different item
 
       cy.findByText('submit').click()
@@ -273,11 +275,10 @@ describe('<Select />', function () {
   describe('keyboard navigation', function () {
     it('can select an item using the keyboard', function () {
       render({ defaultText: 'Choose an item' })
-      cy.findByRole('textbox', { name: 'Choose an item' }).type(
-        '{Enter}{downArrow}{Enter}',
-        { force: true }
-      )
-      cy.findByRole('textbox', { name: 'Demo item 1' }).should('exist')
+      cy.findByRole('combobox').type('{Enter}{downArrow}{Enter}', {
+        force: true,
+      })
+      cy.findByRole('combobox').should('exist')
       cy.findByRole('option', { name: 'Demo item 2' }).should('not.exist')
     })
   })
@@ -288,9 +289,9 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         selectedIcon: true,
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
       cy.findByRole('option', { name: 'Demo item 1' }).click()
-      cy.findByRole('textbox', { name: 'Demo item 1' }).click()
+      cy.findByRole('combobox').click()
 
       cy.findByText('check').should('exist')
     })
@@ -299,11 +300,11 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         selectedIcon: false,
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
       cy.findByRole('option', { name: 'Demo item 1' }).click()
-      cy.findByRole('textbox', { name: 'Demo item 1' }).click()
+      cy.findByRole('combobox').click()
 
-      cy.findByText('check').should('exist')
+      cy.findByText('check').should('not.exist')
     })
   })
 
@@ -313,7 +314,7 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         itemToDisabled: x => x?.key === 2,
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).click()
+      cy.findByRole('combobox').click()
       cy.findByRole('option', { name: 'Demo item 2' }).click({ force: true })
       // still showing other list items
       cy.findByRole('option', { name: 'Demo item 3' }).should('exist')
@@ -329,7 +330,7 @@ describe('<Select />', function () {
         defaultText: 'Choose an item',
         selected: testData[1],
       })
-      cy.findByRole('textbox', { name: 'Demo item 2' }).should('exist')
+      cy.findByRole('combobox').should('have.value', 'Demo item 2')
     })
 
     it('should show default text when selected is null', function () {
@@ -337,7 +338,7 @@ describe('<Select />', function () {
         selected: null,
         defaultText: 'Choose an item',
       })
-      cy.findByRole('textbox', { name: 'Choose an item' }).should('exist')
+      cy.findByRole('combobox').should('have.value', 'Choose an item')
     })
   })
 })
diff --git a/services/web/test/frontend/components/shared/split-test-badge.spec.tsx b/services/web/test/frontend/components/shared/split-test-badge.spec.tsx
index 80f1d28be3..1f77f2548d 100644
--- a/services/web/test/frontend/components/shared/split-test-badge.spec.tsx
+++ b/services/web/test/frontend/components/shared/split-test-badge.spec.tsx
@@ -29,7 +29,8 @@ describe('split test badge', function () {
 
     cy.findByRole('link', { name: /this is an alpha feature/i })
       .should('have.attr', 'href', '/alpha/participate')
-      .find('.badge.alpha-badge')
+      .find('.badge')
+      .contains('α')
   })
 
   it('does not render the alpha badge when user is not assigned to the variant', function () {
@@ -87,7 +88,8 @@ describe('split test badge', function () {
 
     cy.findByRole('link', { name: /this is a beta feature/i })
       .should('have.attr', 'href', '/beta/participate')
-      .find('.badge.beta-badge')
+      .find('.badge')
+      .contains('β')
   })
 
   it('does not render the beta badge when user is not assigned to the variant', function () {
diff --git a/services/web/test/frontend/components/shared/tooltip.spec.tsx b/services/web/test/frontend/components/shared/tooltip.spec.tsx
index 764f05b891..b78a559c35 100644
--- a/services/web/test/frontend/components/shared/tooltip.spec.tsx
+++ b/services/web/test/frontend/components/shared/tooltip.spec.tsx
@@ -1,6 +1,6 @@
-import Tooltip from '../../../../frontend/js/shared/components/tooltip'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
 
-describe('<Tooltip />', function () {
+describe('<OLTooltip />', function () {
   it('calls the bound handler and blur then hides text on click', function () {
     const clickHandler = cy.stub().as('clickHandler')
     const blurHandler = cy.stub().as('blurHandler')
@@ -16,11 +16,11 @@ describe('<Tooltip />', function () {
           height: '100vh',
         }}
       >
-        <Tooltip id="abc" description={description}>
+        <OLTooltip id="abc" description={description}>
           <button onClick={clickHandler} onBlur={blurHandler}>
             {btnText}
           </button>
-        </Tooltip>
+        </OLTooltip>
       </div>
     )
 
@@ -32,4 +32,33 @@ describe('<Tooltip />', function () {
     cy.get('@blurHandler').should('have.been.calledOnce')
     cy.findByText(description).should('not.exist')
   })
+
+  it('hides the tooltip when Escape key is pressed', function () {
+    const description = 'Press Escape to close'
+    const btnText = 'Hover me!'
+
+    cy.mount(
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          height: '100vh',
+        }}
+      >
+        <OLTooltip id="esc" description={description}>
+          <button>{btnText}</button>
+        </OLTooltip>
+      </div>
+    )
+
+    cy.findByRole('button', { name: btnText }).as('button')
+    cy.get('@button').trigger('mouseover')
+    cy.findByText(description)
+    cy.get('@button').trigger('mouseout')
+    cy.get('@button').focus()
+    cy.findByText(description)
+    cy.get('body').type('{esc}')
+    cy.findByText(description).should('not.exist')
+  })
 })
diff --git a/services/web/test/frontend/features/chat/components/chat-pane.test.jsx b/services/web/test/frontend/features/chat/components/chat-pane.test.jsx
index 5caf51097e..f990a8c6ce 100644
--- a/services/web/test/frontend/features/chat/components/chat-pane.test.jsx
+++ b/services/web/test/frontend/features/chat/components/chat-pane.test.jsx
@@ -7,10 +7,7 @@ import {
 import fetchMock from 'fetch-mock'
 
 import ChatPane from '../../../../../frontend/js/features/chat/components/chat-pane'
-import {
-  cleanUpContext,
-  renderWithEditorContext,
-} from '../../../helpers/render-with-context'
+import { renderWithEditorContext } from '../../../helpers/render-with-context'
 import { stubMathJax, tearDownMathJaxStubs } from './stubs'
 
 describe('<ChatPane />', function () {
@@ -22,11 +19,11 @@ describe('<ChatPane />', function () {
 
   beforeEach(function () {
     window.metaAttributesCache.set('ol-user', user)
-    window.metaAttributesCache.set('ol-chatEnabled', true)
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   const testMessages = [
@@ -45,9 +42,7 @@ describe('<ChatPane />', function () {
   ]
 
   beforeEach(function () {
-    fetchMock.reset()
-    cleanUpContext()
-
+    fetchMock.removeRoutes().clearHistory()
     stubMathJax()
   })
 
@@ -73,7 +68,7 @@ describe('<ChatPane />', function () {
     await screen.findByText('Try again')
 
     // bring chat back up
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
     fetchMock.get(/messages/, [])
 
     const reconnectButton = screen.getByRole('button', {
diff --git a/services/web/test/frontend/features/chat/context/chat-context.test.jsx b/services/web/test/frontend/features/chat/context/chat-context.test.jsx
index 76410a65fd..a930ba3a9c 100644
--- a/services/web/test/frontend/features/chat/context/chat-context.test.jsx
+++ b/services/web/test/frontend/features/chat/context/chat-context.test.jsx
@@ -1,7 +1,7 @@
 // Disable prop type checks for test harnesses
 /* eslint-disable react/prop-types */
 
-import { renderHook, act } from '@testing-library/react-hooks/dom'
+import { renderHook, act, waitFor } from '@testing-library/react'
 import { expect } from 'chai'
 import sinon from 'sinon'
 import fetchMock from 'fetch-mock'
@@ -9,7 +9,6 @@ import {
   useChatContext,
   chatClientIdGenerator,
 } from '@/features/chat/context/chat-context'
-import { cleanUpContext } from '../../../helpers/render-with-context'
 import { stubMathJax, tearDownMathJaxStubs } from '../components/stubs'
 import { SocketIOMock } from '@/ide/connection/SocketIoShim'
 import { EditorProviders } from '../../../helpers/editor-providers'
@@ -23,13 +22,12 @@ describe('ChatContext', function () {
   const uuidValue = '00000000-0000-0000-0000-000000000000'
 
   beforeEach(function () {
-    fetchMock.reset()
-    cleanUpContext()
+    fetchMock.removeRoutes().clearHistory()
 
     stubMathJax()
 
     window.metaAttributesCache.set('ol-user', user)
-    window.metaAttributesCache.set('ol-chatEnabled', true)
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
 
     this.stub = sinon.stub(chatClientIdGenerator, 'generate').returns(uuidValue)
   })
@@ -43,21 +41,22 @@ describe('ChatContext', function () {
   describe('socket connection', function () {
     beforeEach(function () {
       // Mock GET messages to return no messages
-      fetchMock.get('express:/project/:projectId/messages', [])
+      fetchMock.get('express:/project/:projectId/messages', [], {
+        name: 'fetchMessages',
+      })
 
       // Mock POST new message to return 200
       fetchMock.post('express:/project/:projectId/messages', 200)
     })
 
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('subscribes when mounted', function () {
       const socket = new SocketIOMock()
       renderChatContextHook({ socket })
-      // Assert that there is 1 listener
-      expect(socket.events['new-chat-message']).to.have.length(1)
+      expect(socket.countEventListeners('new-chat-message')).to.equal(1)
     })
 
     it('unsubscribes when unmounted', function () {
@@ -66,20 +65,21 @@ describe('ChatContext', function () {
 
       unmount()
 
-      // Assert that there is 0 listeners
-      expect(socket.events['new-chat-message'].length).to.equal(0)
+      expect(socket.countEventListeners('new-chat-message')).to.equal(0)
     })
 
     it('adds received messages to the list', async function () {
       // Mock socket: we only need to emit events, not mock actual connections
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
       // Wait until initial messages have loaded
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
+      await waitFor(
+        () => expect(result.current.initialMessagesLoaded).to.be.true
+      )
 
       // No messages shown at first
       expect(result.current.messages).to.deep.equal([])
@@ -96,21 +96,22 @@ describe('ChatContext', function () {
         },
       })
 
-      const message = result.current.messages[0]
-      expect(message.id).to.equal('msg_1')
-      expect(message.contents).to.deep.equal(['new message'])
+      await waitFor(() => {
+        const message = result.current.messages[0]
+        expect(message.id).to.equal('msg_1')
+        expect(message.contents).to.deep.equal(['new message'])
+      })
     })
 
     it('deduplicate messages from preloading', async function () {
       // Mock socket: we only need to emit events, not mock actual connections
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
-      fetchMock.get(
-        'express:/project/:projectId/messages',
-        [
+      fetchMock.modifyRoute('fetchMessages', {
+        response: () => [
           {
             id: 'msg_1',
             content: 'new message',
@@ -122,8 +123,7 @@ describe('ChatContext', function () {
             },
           },
         ],
-        { overwriteRoutes: true }
-      )
+      })
 
       // Mock message being received from another user
       socket.emitToClient('new-chat-message', {
@@ -138,11 +138,13 @@ describe('ChatContext', function () {
       })
 
       // Check if received the message ID
-      expect(result.current.messages).to.have.length(1)
+      await waitFor(() => expect(result.current.messages).to.have.length(1))
 
       // Wait until initial messages have loaded
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
+      await waitFor(
+        () => expect(result.current.initialMessagesLoaded).to.be.true
+      )
 
       // Check if there are no message duplication
       expect(result.current.messages).to.have.length(1)
@@ -155,13 +157,12 @@ describe('ChatContext', function () {
     it('deduplicate messages from websocket', async function () {
       // Mock socket: we only need to emit events, not mock actual connections
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
-      fetchMock.get(
-        'express:/project/:projectId/messages',
-        [
+      fetchMock.modifyRoute('fetchMessages', {
+        response: [
           {
             id: 'msg_1',
             content: 'new message',
@@ -173,15 +174,13 @@ describe('ChatContext', function () {
             },
           },
         ],
-        { overwriteRoutes: true }
-      )
+      })
 
       // Wait until initial messages have loaded
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
 
       // Check if received the message ID
-      expect(result.current.messages).to.have.length(1)
+      await waitFor(() => expect(result.current.messages).to.have.length(1))
 
       // Mock message being received from another user
       socket.emitToClient('new-chat-message', {
@@ -205,13 +204,15 @@ describe('ChatContext', function () {
 
     it("doesn't add received messages from the current user if a message was just sent", async function () {
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
       // Wait until initial messages have loaded
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
+      await waitFor(
+        () => expect(result.current.initialMessagesLoaded).to.be.true
+      )
 
       // Send a message from the current user
       const sentMsg = 'sent message'
@@ -228,7 +229,7 @@ describe('ChatContext', function () {
         })
       })
 
-      expect(result.current.messages).to.have.length(1)
+      await waitFor(() => expect(result.current.messages).to.have.length(1))
 
       const [message] = result.current.messages
 
@@ -237,17 +238,21 @@ describe('ChatContext', function () {
 
     it('adds the new message from the current user if another message was received after sending', async function () {
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
       // Wait until initial messages have loaded
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
+      await waitFor(
+        () => expect(result.current.initialMessagesLoaded).to.be.true
+      )
 
       // Send a message from the current user
       const sentMsg = 'sent message from current user'
-      result.current.sendMessage(sentMsg)
+      act(() => {
+        result.current.sendMessage(sentMsg)
+      })
 
       const [sentMessageFromCurrentUser] = result.current.messages
       expect(sentMessageFromCurrentUser.contents).to.deep.equal([sentMsg])
@@ -304,36 +309,41 @@ describe('ChatContext', function () {
     })
 
     it('adds messages to the list', async function () {
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
-
-      expect(result.current.messages[0].contents).to.deep.equal(['a message'])
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.deep.equal(['a message'])
+      )
     })
 
     it("won't load messages a second time", async function () {
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
 
-      expect(result.current.initialMessagesLoaded).to.equal(true)
+      await waitFor(() =>
+        expect(result.current.initialMessagesLoaded).to.equal(true)
+      )
 
       // Calling a second time won't do anything
       result.current.loadInitialMessages()
-      expect(fetchMock.calls()).to.have.lengthOf(1)
+      await waitFor(
+        () => expect(result.current.initialMessagesLoaded).to.be.true
+      )
+
+      expect(
+        fetchMock.callHistory.calls('express:/project/:projectId/messages')
+      ).to.have.lengthOf(1)
     })
 
     it('provides an error on failure', async function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
       fetchMock.get('express:/project/:projectId/messages', 500)
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadInitialMessages()
-      await waitForNextUpdate()
-
-      expect(result.current.error).to.exist
+      await waitFor(() => expect(result.current.error).to.exist)
       expect(result.current.status).to.equal('error')
     })
   })
@@ -350,14 +360,14 @@ describe('ChatContext', function () {
         },
       ])
 
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadMoreMessages()
-      await waitForNextUpdate()
-
-      expect(result.current.messages[0].contents).to.deep.equal([
-        'first message',
-      ])
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.deep.equal([
+          'first message',
+        ])
+      )
 
       // The before query param is not set
       expect(getLastFetchMockQueryParam('before')).to.be.null
@@ -371,33 +381,32 @@ describe('ChatContext', function () {
           // Resolve a full "page" of messages (50)
           createMessages(50, user, new Date('2021-03-04T10:00:00').getTime())
         )
-        .getOnce(
-          'express:/project/:projectId/messages',
-          [
-            {
-              id: 'msg_51',
-              content: 'message from second page',
-              user,
-              timestamp: new Date('2021-03-04T11:00:00').getTime(),
-            },
-          ],
-          { overwriteRoutes: false }
-        )
+        .getOnce('express:/project/:projectId/messages', [
+          {
+            id: 'msg_51',
+            content: 'message from second page',
+            user,
+            timestamp: new Date('2021-03-04T11:00:00').getTime(),
+          },
+        ])
 
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadMoreMessages()
-      await waitForNextUpdate()
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.have.length(50)
+      )
 
       // Call a second time
       result.current.loadMoreMessages()
-      await waitForNextUpdate()
 
       // The second request is added to the list
       // Since both messages from the same user, they are collapsed into the
       // same "message"
-      expect(result.current.messages[0].contents).to.include(
-        'message from second page'
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.include(
+          'message from second page'
+        )
       )
 
       // The before query param for the second request matches the timestamp
@@ -407,24 +416,28 @@ describe('ChatContext', function () {
     })
 
     it("won't load more messages if there are no more messages", async function () {
-      // Mock a GET request for 49 messages. This is less the the full page size
-      // (50 messages), meaning that there are no further messages to be loaded
+      // Mock a GET request for 49 messages. This is less than the full page
+      // size (50 messages), meaning that there are no further messages to be
+      // loaded
       fetchMock.getOnce(
         'express:/project/:projectId/messages',
         createMessages(49, user)
       )
 
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadMoreMessages()
-      await waitForNextUpdate()
-
-      expect(result.current.messages[0].contents).to.have.length(49)
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.have.length(49)
+      )
 
       result.current.loadMoreMessages()
 
-      expect(result.current.atEnd).to.be.true
-      expect(fetchMock.calls()).to.have.lengthOf(1)
+      await waitFor(() => expect(result.current.atEnd).to.be.true)
+
+      expect(
+        fetchMock.callHistory.calls('express:/project/:projectId/messages')
+      ).to.have.lengthOf(1)
     })
 
     it('handles socket messages while loading', async function () {
@@ -438,7 +451,7 @@ describe('ChatContext', function () {
       )
 
       const socket = new SocketIOMock()
-      const { result, waitForNextUpdate } = renderChatContextHook({
+      const { result } = renderChatContextHook({
         socket,
       })
 
@@ -467,28 +480,27 @@ describe('ChatContext', function () {
           timestamp: Date.now(),
         },
       ])
-      await waitForNextUpdate()
 
-      // Although the loaded message was resolved last, it appears first (since
-      // requested messages must have come first)
-      const messageContents = result.current.messages.map(
-        ({ contents }) => contents[0]
-      )
-      expect(messageContents).to.deep.equal([
-        'loaded message',
-        'socket message',
-      ])
+      await waitFor(() => {
+        // Although the loaded message was resolved last, it appears first (since
+        // requested messages must have come first)
+        const messageContents = result.current.messages.map(
+          ({ contents }) => contents[0]
+        )
+        expect(messageContents).to.deep.equal([
+          'loaded message',
+          'socket message',
+        ])
+      })
     })
 
     it('provides an error on failures', async function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
       fetchMock.get('express:/project/:projectId/messages', 500)
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.loadMoreMessages()
-      await waitForNextUpdate()
-
-      expect(result.current.error).to.exist
+      await waitFor(() => expect(result.current.error).to.exist)
       expect(result.current.status).to.equal('error')
     })
   })
@@ -502,14 +514,16 @@ describe('ChatContext', function () {
         .postOnce('express:/project/:projectId/messages', 200)
     })
 
-    it('optimistically adds the message to the list', function () {
+    it('optimistically adds the message to the list', async function () {
       const { result } = renderChatContextHook({})
 
       result.current.sendMessage('sent message')
 
-      expect(result.current.messages[0].contents).to.deep.equal([
-        'sent message',
-      ])
+      await waitFor(() =>
+        expect(result.current.messages[0].contents).to.deep.equal([
+          'sent message',
+        ])
+      )
     })
 
     it('POSTs the message to the backend', function () {
@@ -517,10 +531,11 @@ describe('ChatContext', function () {
 
       result.current.sendMessage('sent message')
 
-      const [, { body }] = fetchMock.lastCall(
-        'express:/project/:projectId/messages',
-        'POST'
-      )
+      const {
+        options: { body },
+      } = fetchMock.callHistory
+        .calls('express:/project/:projectId/messages', { method: 'POST' })
+        .at(-1)
       expect(JSON.parse(body)).to.deep.include({ content: 'sent message' })
     })
 
@@ -531,23 +546,22 @@ describe('ChatContext', function () {
 
       expect(result.current.messages).to.be.empty
       expect(
-        fetchMock.called('express:/project/:projectId/messages', {
+        fetchMock.callHistory.called('express:/project/:projectId/messages', {
           method: 'post',
         })
       ).to.be.false
     })
 
     it('provides an error on failure', async function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
       fetchMock
         .get('express:/project/:projectId/messages', [])
         .postOnce('express:/project/:projectId/messages', 500)
-      const { result, waitForNextUpdate } = renderChatContextHook({})
+      const { result } = renderChatContextHook({})
 
       result.current.sendMessage('sent message')
-      await waitForNextUpdate()
+      await waitFor(() => expect(result.current.error).to.exist)
 
-      expect(result.current.error).to.exist
       expect(result.current.status).to.equal('error')
     })
   })
@@ -563,11 +577,13 @@ describe('ChatContext', function () {
       const { result } = renderChatContextHook({ socket })
 
       // Receive a new message from the socket
-      socket.emitToClient('new-chat-message', {
-        id: 'msg_1',
-        content: 'new message',
-        timestamp: Date.now(),
-        user,
+      act(() => {
+        socket.emitToClient('new-chat-message', {
+          id: 'msg_1',
+          content: 'new message',
+          timestamp: Date.now(),
+          user,
+        })
       })
 
       expect(result.current.unreadMessageCount).to.equal(1)
@@ -616,7 +632,7 @@ function createMessages(number, user, timestamp = Date.now()) {
  * Get query param by key from the last fetchMock response
  */
 function getLastFetchMockQueryParam(key) {
-  const url = fetchMock.lastUrl()
+  const { url } = fetchMock.callHistory.calls().at(-1)
   const { searchParams } = new URL(url, 'https://www.overleaf.com')
   return searchParams.get(key)
 }
diff --git a/services/web/test/frontend/features/clone-project-modal/components/clone-project-modal.test.jsx b/services/web/test/frontend/features/clone-project-modal/components/clone-project-modal.test.jsx
index 4c6d49f752..0f523349e6 100644
--- a/services/web/test/frontend/features/clone-project-modal/components/clone-project-modal.test.jsx
+++ b/services/web/test/frontend/features/clone-project-modal/components/clone-project-modal.test.jsx
@@ -7,16 +7,17 @@ import { renderWithEditorContext } from '../../../helpers/render-with-context'
 
 describe('<EditorCloneProjectModalWrapper />', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   after(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
-  const project = {
-    _id: 'project-1',
-    name: 'Test Project',
+  const contextProps = {
+    projectId: 'project-1',
+    projectName: 'Test Project',
   }
 
   it('renders the translated modal title', async function () {
@@ -29,10 +30,10 @@ describe('<EditorCloneProjectModalWrapper />', function () {
         openProject={openProject}
         show
       />,
-      { scope: { project } }
+      contextProps
     )
 
-    await screen.findByText('Copy Project')
+    await screen.findByText('Copy project')
   })
 
   it('posts the generated project name', async function () {
@@ -54,7 +55,7 @@ describe('<EditorCloneProjectModalWrapper />', function () {
         openProject={openProject}
         show
       />,
-      { scope: { project } }
+      contextProps
     )
 
     const cancelButton = await screen.findByRole('button', { name: 'Cancel' })
@@ -78,19 +79,23 @@ describe('<EditorCloneProjectModalWrapper />', function () {
     fireEvent.click(submitButton)
     expect(submitButton.disabled).to.be.true
 
-    await fetchMock.flush(true)
-    expect(fetchMock.done()).to.be.true
-    const [url, options] = fetchMock.lastCall(
-      'express:/project/:projectId/clone'
+    await fetchMock.callHistory.flush(true)
+    expect(fetchMock.callHistory.done()).to.be.true
+    const { url, options } = fetchMock.callHistory
+      .calls('express:/project/:projectId/clone')
+      .at(-1)
+    expect(url).to.equal(
+      'https://www.test-overleaf.com/project/project-1/clone'
     )
-    expect(url).to.equal('/project/project-1/clone')
 
     expect(JSON.parse(options.body)).to.deep.equal({
       projectName: 'A Cloned Project',
       tags: [],
     })
 
-    expect(openProject).to.be.calledOnce
+    await waitFor(() => {
+      expect(openProject).to.be.calledOnce
+    })
 
     const errorMessage = screen.queryByText('Sorry, something went wrong')
     expect(errorMessage).to.be.null
@@ -118,7 +123,7 @@ describe('<EditorCloneProjectModalWrapper />', function () {
         openProject={openProject}
         show
       />,
-      { scope: { project } }
+      contextProps
     )
 
     const button = await screen.findByRole('button', { name: 'Copy' })
@@ -129,7 +134,7 @@ describe('<EditorCloneProjectModalWrapper />', function () {
 
     fireEvent.click(button)
 
-    expect(fetchMock.done(matcher)).to.be.true
+    expect(fetchMock.callHistory.done(matcher)).to.be.true
     expect(openProject).not.to.be.called
 
     await screen.findByText('Sorry, something went wrong')
@@ -155,7 +160,7 @@ describe('<EditorCloneProjectModalWrapper />', function () {
         openProject={openProject}
         show
       />,
-      { scope: { project } }
+      contextProps
     )
 
     const button = await screen.findByRole('button', { name: 'Copy' })
@@ -165,9 +170,9 @@ describe('<EditorCloneProjectModalWrapper />', function () {
     expect(cancelButton.disabled).to.be.false
 
     fireEvent.click(button)
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
-    expect(fetchMock.done(matcher)).to.be.true
+    expect(fetchMock.callHistory.done(matcher)).to.be.true
     expect(openProject).not.to.be.called
 
     await screen.findByText('There was an error!')
diff --git a/services/web/test/frontend/features/dictionary/components/dictionary-modal-content.spec.jsx b/services/web/test/frontend/features/dictionary/components/dictionary-modal-content.spec.jsx
index c28eef66ef..c8cdd931b3 100644
--- a/services/web/test/frontend/features/dictionary/components/dictionary-modal-content.spec.jsx
+++ b/services/web/test/frontend/features/dictionary/components/dictionary-modal-content.spec.jsx
@@ -19,7 +19,7 @@ describe('<DictionaryModalContent />', function () {
   })
 
   it('list words', function () {
-    cy.then(win => {
+    cy.then(() => {
       learnedWords.global = new Set(['foo', 'bar'])
     })
 
@@ -34,7 +34,7 @@ describe('<DictionaryModalContent />', function () {
   })
 
   it('shows message when empty', function () {
-    cy.then(win => {
+    cy.then(() => {
       learnedWords.global = new Set([])
     })
 
@@ -50,7 +50,7 @@ describe('<DictionaryModalContent />', function () {
   it('removes words', function () {
     cy.intercept('/spelling/unlearn', { statusCode: 200 })
 
-    cy.then(win => {
+    cy.then(() => {
       learnedWords.global = new Set(['Foo', 'bar'])
     })
 
@@ -76,7 +76,7 @@ describe('<DictionaryModalContent />', function () {
   it('handles errors', function () {
     cy.intercept('/spelling/unlearn', { statusCode: 500 }).as('unlearn')
 
-    cy.then(win => {
+    cy.then(() => {
       learnedWords.global = new Set(['foo'])
     })
 
diff --git a/services/web/test/frontend/features/editor-left-menu/components/actions-copy-project.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/actions-copy-project.test.jsx
index 1a239e8147..050e11f653 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/actions-copy-project.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/actions-copy-project.test.jsx
@@ -4,31 +4,26 @@ import sinon from 'sinon'
 import { expect } from 'chai'
 import ActionsCopyProject from '../../../../../frontend/js/features/editor-left-menu/components/actions-copy-project'
 import { renderWithEditorContext } from '../../../helpers/render-with-context'
-import * as useLocationModule from '../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 
 describe('<ActionsCopyProject />', function () {
-  let assignStub
-
   beforeEach(function () {
-    assignStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   afterEach(function () {
-    this.locationStub.restore()
-    fetchMock.reset()
+    this.locationWrapperSandbox.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct modal when clicked', async function () {
     renderWithEditorContext(<ActionsCopyProject />)
 
-    fireEvent.click(screen.getByRole('button', { name: 'Copy Project' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Copy project' }))
 
-    screen.getByPlaceholderText('New Project Name')
+    screen.getByPlaceholderText('New project name')
   })
 
   it('loads the project page when submitted', async function () {
@@ -41,10 +36,10 @@ describe('<ActionsCopyProject />', function () {
 
     renderWithEditorContext(<ActionsCopyProject />)
 
-    fireEvent.click(screen.getByRole('button', { name: 'Copy Project' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Copy project' }))
 
-    const input = screen.getByPlaceholderText('New Project Name')
-    fireEvent.change(input, { target: { value: 'New Project' } })
+    const input = screen.getByPlaceholderText('New project name')
+    fireEvent.change(input, { target: { value: 'New project' } })
 
     const button = screen.getByRole('button', { name: 'Copy' })
     button.click()
@@ -53,6 +48,7 @@ describe('<ActionsCopyProject />', function () {
       expect(button.textContent).to.equal('Copying…')
     })
 
+    const assignStub = this.locationWrapperStub.assign
     await waitFor(() => {
       expect(assignStub).to.have.been.calledOnceWith('/project/new-project')
     })
diff --git a/services/web/test/frontend/features/editor-left-menu/components/actions-menu.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/actions-menu.test.jsx
index 5f1b7d790c..54f0048afa 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/actions-menu.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/actions-menu.test.jsx
@@ -21,7 +21,7 @@ describe('<ActionsMenu />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu for non-anonymous users', async function () {
@@ -41,7 +41,7 @@ describe('<ActionsMenu />', function () {
 
     screen.getByText('Actions')
     screen.getByRole('button', {
-      name: 'Copy Project',
+      name: 'Copy project',
     })
 
     await waitFor(() => {
@@ -69,7 +69,7 @@ describe('<ActionsMenu />', function () {
     expect(screen.queryByText('Actions')).to.equal(null)
     expect(
       screen.queryByRole('button', {
-        name: 'Copy Project',
+        name: 'Copy project',
       })
     ).to.equal(null)
 
diff --git a/services/web/test/frontend/features/editor-left-menu/components/actions-word-count.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/actions-word-count.test.jsx
index 86667b8f17..ec45304035 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/actions-word-count.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/actions-word-count.test.jsx
@@ -6,7 +6,7 @@ import { renderWithEditorContext } from '../../../helpers/render-with-context'
 
 describe('<ActionsWordCount />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct modal when clicked after document is compiled', async function () {
@@ -51,11 +51,15 @@ describe('<ActionsWordCount />', function () {
     // when loading, we don't render the "Word Count" as button yet
     expect(screen.queryByRole('button', { name: 'Word Count' })).to.equal(null)
 
-    await waitFor(() => expect(fetchMock.called(compileEndpoint)).to.be.true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(compileEndpoint)).to.be.true
+    )
 
     const button = await screen.findByRole('button', { name: 'Word Count' })
     button.click()
 
-    await waitFor(() => expect(fetchMock.called(wordcountEndpoint)).to.be.true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(wordcountEndpoint)).to.be.true
+    )
   })
 })
diff --git a/services/web/test/frontend/features/editor-left-menu/components/download-menu.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/download-menu.test.jsx
index 065a9316a1..b6295dfa07 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/download-menu.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/download-menu.test.jsx
@@ -6,7 +6,7 @@ import { renderWithEditorContext } from '../../../helpers/render-with-context'
 
 describe('<DownloadMenu />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows download links with correct url', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/help-contact-us.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/help-contact-us.test.jsx
index 1a29a5d2e5..d75a798214 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/help-contact-us.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/help-contact-us.test.jsx
@@ -14,14 +14,14 @@ describe('<HelpContactUs />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('open contact us modal when clicked', function () {
     renderWithEditorContext(<HelpContactUs />)
 
     expect(screen.queryByRole('dialog')).to.equal(null)
-    fireEvent.click(screen.getByRole('button', { name: 'Contact Us' }))
+    fireEvent.click(screen.getByRole('button', { name: 'Contact us' }))
     const modal = screen.getAllByRole('dialog')[0]
     within(modal).getAllByText('Get in touch')
     within(modal).getByText('Subject')
diff --git a/services/web/test/frontend/features/editor-left-menu/components/help-menu.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/help-menu.test.jsx
index 4831939e88..3eb3fe6d04 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/help-menu.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/help-menu.test.jsx
@@ -14,7 +14,7 @@ describe('<HelpMenu />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu if `showSupport` is `true`', function () {
@@ -23,7 +23,7 @@ describe('<HelpMenu />', function () {
     renderWithEditorContext(<HelpMenu />)
 
     screen.getByRole('button', { name: 'Show Hotkeys' })
-    screen.getByRole('button', { name: 'Contact Us' })
+    screen.getByRole('button', { name: 'Contact us' })
     screen.getByRole('link', { name: 'Documentation' })
   })
 
@@ -33,7 +33,7 @@ describe('<HelpMenu />', function () {
     renderWithEditorContext(<HelpMenu />)
 
     screen.getByRole('button', { name: 'Show Hotkeys' })
-    expect(screen.queryByRole('button', { name: 'Contact Us' })).to.equal(null)
+    expect(screen.queryByRole('button', { name: 'Contact us' })).to.equal(null)
     expect(screen.queryByRole('link', { name: 'Documentation' })).to.equal(null)
   })
 })
diff --git a/services/web/test/frontend/features/editor-left-menu/components/help-show-hotkeys.test.jsx b/services/web/test/frontend/features/editor-left-menu/components/help-show-hotkeys.test.jsx
index 2376e056cd..369fd5bbbd 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/help-show-hotkeys.test.jsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/help-show-hotkeys.test.jsx
@@ -6,7 +6,7 @@ import fetchMock from 'fetch-mock'
 
 describe('<HelpShowHotkeys />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('open hotkeys modal when clicked', function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-close-brackets.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-close-brackets.test.tsx
index af0a625ca7..fff0f3ada7 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-close-brackets.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-close-brackets.test.tsx
@@ -7,7 +7,7 @@ import { EditorProviders } from '../../../../helpers/editor-providers'
 
 describe('<SettingsAutoCloseBrackets />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-complete.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-complete.test.tsx
index 82539b39f6..c0b58d307d 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-complete.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-auto-complete.test.tsx
@@ -7,7 +7,7 @@ import { EditorProviders } from '../../../../helpers/editor-providers'
 
 describe('<SettingsAutoComplete />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-compiler.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-compiler.test.tsx
index 8dd848a1f6..3471b3dcf7 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-compiler.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-compiler.test.tsx
@@ -7,7 +7,7 @@ import { EditorProviders } from '../../../../helpers/editor-providers'
 
 describe('<SettingsCompiler />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-document.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-document.test.tsx
index f7ade270cb..41b6d67746 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-document.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-document.test.tsx
@@ -30,7 +30,7 @@ describe('<SettingsDocument />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
     window.metaAttributesCache.set('ol-ExposedSettings', originalSettings)
   })
 
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-editor-theme.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-editor-theme.test.tsx
index 2b42838a3f..f7b716e984 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-editor-theme.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-editor-theme.test.tsx
@@ -16,7 +16,7 @@ describe('<SettingsEditorTheme />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx
index 2a896982c8..36a4f3838a 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-family.test.tsx
@@ -7,7 +7,7 @@ import { EditorProviders } from '../../../../helpers/editor-providers'
 
 describe('<SettingsFontFamily />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-size.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-size.test.tsx
index 964e81ac46..b65dabb758 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-size.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-font-size.test.tsx
@@ -9,7 +9,7 @@ describe('<SettingsFontSize />', function () {
   const sizes = ['10', '11', '12', '13', '14', '16', '18', '20', '22', '24']
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-image-name.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-image-name.test.tsx
index c59a44acef..b164c02f65 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-image-name.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-image-name.test.tsx
@@ -23,7 +23,7 @@ describe('<SettingsImageName />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-keybindings.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-keybindings.test.tsx
index d924a64c9c..d02f4a0701 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-keybindings.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-keybindings.test.tsx
@@ -7,7 +7,7 @@ import { EditorLeftMenuProvider } from '@/features/editor-left-menu/components/e
 
 describe('<SettingsKeybindings />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-line-height.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-line-height.test.tsx
index 7bc18eb028..c914a9e295 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-line-height.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-line-height.test.tsx
@@ -7,7 +7,7 @@ import { EditorLeftMenuProvider } from '@/features/editor-left-menu/components/e
 
 describe('<SettingsLineHeight />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-math-preview.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-math-preview.test.tsx
index 0fced14737..ecd2fbe34a 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-math-preview.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-math-preview.test.tsx
@@ -7,7 +7,7 @@ import { EditorLeftMenuProvider } from '@/features/editor-left-menu/components/e
 
 describe('<SettingsMathPreview />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-overall-theme.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-overall-theme.test.tsx
index 8a5cc00338..83a46e662d 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-overall-theme.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-overall-theme.test.tsx
@@ -32,7 +32,7 @@ describe('<SettingsOverallTheme />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-pdf-viewer.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-pdf-viewer.test.tsx
index 388016cbb3..d9b15e6bfa 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-pdf-viewer.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-pdf-viewer.test.tsx
@@ -7,7 +7,7 @@ import { EditorLeftMenuProvider } from '@/features/editor-left-menu/components/e
 
 describe('<SettingsPdfViewer />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-spell-check-language.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-spell-check-language.test.tsx
index ed7e4404ed..1b345f9ef6 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-spell-check-language.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-spell-check-language.test.tsx
@@ -25,7 +25,7 @@ describe('<SettingsSpellCheckLanguage />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-syntax-validation.test.tsx b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-syntax-validation.test.tsx
index 1c38ca039f..3b1034f7b5 100644
--- a/services/web/test/frontend/features/editor-left-menu/components/settings/settings-syntax-validation.test.tsx
+++ b/services/web/test/frontend/features/editor-left-menu/components/settings/settings-syntax-validation.test.tsx
@@ -7,7 +7,7 @@ import { EditorLeftMenuProvider } from '@/features/editor-left-menu/components/e
 
 describe('<SettingsSyntaxValidation />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows correct menu', async function () {
diff --git a/services/web/test/frontend/features/editor-navigation-toolbar/components/chat-toggle-button.test.jsx b/services/web/test/frontend/features/editor-navigation-toolbar/components/chat-toggle-button.test.tsx
similarity index 100%
rename from services/web/test/frontend/features/editor-navigation-toolbar/components/chat-toggle-button.test.jsx
rename to services/web/test/frontend/features/editor-navigation-toolbar/components/chat-toggle-button.test.tsx
diff --git a/services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.jsx b/services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.tsx
similarity index 64%
rename from services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.jsx
rename to services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.tsx
index 19173c69e3..c3bd08ed89 100644
--- a/services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.jsx
+++ b/services/web/test/frontend/features/editor-navigation-toolbar/components/layout-dropdown-button.test.tsx
@@ -1,17 +1,20 @@
 import sinon from 'sinon'
 import fetchMock from 'fetch-mock'
 import { expect } from 'chai'
-import { screen } from '@testing-library/react'
+import { screen, waitFor } from '@testing-library/react'
 import LayoutDropdownButton from '../../../../../frontend/js/features/editor-navigation-toolbar/components/layout-dropdown-button'
 import { renderWithEditorContext } from '../../../helpers/render-with-context'
 import * as eventTracking from '@/infrastructure/event-tracking'
+import type { LayoutContextOwnStates } from '@/shared/context/layout-context'
 
 describe('<LayoutDropdownButton />', function () {
-  let openStub
-  let sendMBSpy
-  const defaultUi = {
+  let openStub: sinon.SinonStub
+  let sendMBSpy: sinon.SinonSpy
+
+  const defaultLayout: Partial<LayoutContextOwnStates> = {
     pdfLayout: 'flat',
     view: 'pdf',
+    chatIsOpen: false,
   }
 
   beforeEach(function () {
@@ -22,22 +25,26 @@ describe('<LayoutDropdownButton />', function () {
   afterEach(function () {
     openStub.restore()
     sendMBSpy.restore()
-    fetchMock.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('should mark current layout option as selected', async function () {
     // Selected is aria-label, visually we show a checkmark
-    renderWithEditorContext(<LayoutDropdownButton />, { ui: defaultUi })
+    renderWithEditorContext(<LayoutDropdownButton />, {
+      layoutContext: defaultLayout,
+    })
 
     screen.getByRole('button', { name: 'Layout' }).click()
 
-    expect(
-      screen
-        .getByRole('menuitem', {
-          name: 'Editor & PDF',
-        })
-        .getAttribute('aria-selected')
-    ).to.equal('false')
+    await waitFor(() =>
+      expect(
+        screen
+          .getByRole('menuitem', {
+            name: 'Editor & PDF',
+          })
+          .getAttribute('aria-selected')
+      ).to.equal('false')
+    )
 
     expect(
       screen
@@ -64,21 +71,23 @@ describe('<LayoutDropdownButton />', function () {
     ).to.equal('false')
   })
 
-  it('should not select any option in history view', function () {
+  it('should not select any option in history view', async function () {
     // Selected is aria-label, visually we show a checkmark
     renderWithEditorContext(<LayoutDropdownButton />, {
-      ui: { ...defaultUi, view: 'history' },
+      layoutContext: { ...defaultLayout, view: 'history' },
     })
 
     screen.getByRole('button', { name: 'Layout' }).click()
 
-    expect(
-      screen
-        .getByRole('menuitem', {
-          name: 'Editor & PDF',
-        })
-        .getAttribute('aria-selected')
-    ).to.equal('false')
+    await waitFor(() =>
+      expect(
+        screen
+          .getByRole('menuitem', {
+            name: 'Editor & PDF',
+          })
+          .getAttribute('aria-selected')
+      ).to.equal('false')
+    )
 
     expect(
       screen
@@ -105,24 +114,27 @@ describe('<LayoutDropdownButton />', function () {
     ).to.equal('false')
   })
 
-  it('should treat file and editor views the same way', function () {
+  it('should treat file and editor views the same way', async function () {
     // Selected is aria-label, visually we show a checkmark
     renderWithEditorContext(<LayoutDropdownButton />, {
-      ui: {
+      layoutContext: {
         pdfLayout: 'flat',
         view: 'file',
+        chatIsOpen: false,
       },
     })
 
     screen.getByRole('button', { name: 'Layout' }).click()
 
-    expect(
-      screen
-        .getByRole('menuitem', {
-          name: 'Editor & PDF',
-        })
-        .getAttribute('aria-selected')
-    ).to.equal('false')
+    await waitFor(() =>
+      expect(
+        screen
+          .getByRole('menuitem', {
+            name: 'Editor & PDF',
+          })
+          .getAttribute('aria-selected')
+      ).to.equal('false')
+    )
 
     expect(
       screen
@@ -149,30 +161,33 @@ describe('<LayoutDropdownButton />', function () {
     ).to.equal('false')
   })
 
-  describe('on detach', function () {
-    let originalBroadcastChannel
-    beforeEach(function () {
-      window.BroadcastChannel = originalBroadcastChannel || true // ensure that window.BroadcastChannel is truthy
+  describe('on detach', async function () {
+    const originalBroadcastChannel = window.BroadcastChannel
+    beforeEach(async function () {
+      // @ts-expect-error
+      window.BroadcastChannel = true // ensure that window.BroadcastChannel is truthy
 
       renderWithEditorContext(<LayoutDropdownButton />, {
-        ui: { ...defaultUi, view: 'editor' },
+        layoutContext: { ...defaultLayout, view: 'editor' },
       })
 
       screen.getByRole('button', { name: 'Layout' }).click()
 
-      screen
-        .getByRole('menuitem', {
-          name: 'PDF in separate tab',
-        })
-        .click()
+      await waitFor(() =>
+        screen
+          .getByRole('menuitem', {
+            name: 'PDF in separate tab',
+          })
+          .click()
+      )
     })
 
     afterEach(function () {
       window.BroadcastChannel = originalBroadcastChannel
     })
 
-    it('should show processing', function () {
-      screen.getByText('Layout processing')
+    it('should show processing', async function () {
+      await screen.findByText('Layout processing')
     })
 
     it('should record event', function () {
@@ -180,20 +195,22 @@ describe('<LayoutDropdownButton />', function () {
     })
   })
 
-  describe('on layout change / reattach', function () {
-    beforeEach(function () {
+  describe('on layout change / reattach', async function () {
+    beforeEach(async function () {
       window.metaAttributesCache.set('ol-detachRole', 'detacher')
       renderWithEditorContext(<LayoutDropdownButton />, {
-        ui: { ...defaultUi, view: 'editor' },
+        layoutContext: { ...defaultLayout, view: 'editor' },
       })
 
       screen.getByRole('button', { name: 'Layout' }).click()
 
-      screen
-        .getByRole('menuitem', {
-          name: 'Editor only (hide PDF)',
-        })
-        .click()
+      await waitFor(() =>
+        screen
+          .getByRole('menuitem', {
+            name: 'Editor only (hide PDF)',
+          })
+          .click()
+      )
     })
 
     it('should not show processing', function () {
diff --git a/services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.jsx b/services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.tsx
similarity index 89%
rename from services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.jsx
rename to services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.tsx
index 96a8abe0aa..42c7a04502 100644
--- a/services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.jsx
+++ b/services/web/test/frontend/features/editor-navigation-toolbar/components/online-users-widget.test.tsx
@@ -8,12 +8,16 @@ describe('<OnlineUsersWidget />', function () {
   const defaultProps = {
     onlineUsers: [
       {
+        id: 'test_user',
         user_id: 'test_user',
         name: 'test_user',
+        email: 'test_email',
       },
       {
+        id: 'another_test_user',
         user_id: 'another_test_user',
         name: 'another_test_user',
+        email: 'another_test_email',
       },
     ],
     goToUser: () => {},
@@ -44,8 +48,10 @@ describe('<OnlineUsersWidget />', function () {
       fireEvent.click(icon)
 
       expect(props.goToUser).to.be.calledWith({
-        name: 'test_user',
+        id: 'test_user',
         user_id: 'test_user',
+        name: 'test_user',
+        email: 'test_email',
       })
     })
   })
@@ -55,12 +61,16 @@ describe('<OnlineUsersWidget />', function () {
       ...defaultProps,
       onlineUsers: defaultProps.onlineUsers.concat([
         {
+          id: 'user_3',
           user_id: 'user_3',
           name: 'user_3',
+          email: 'user_3',
         },
         {
+          id: 'user_4',
           user_id: 'user_4',
           name: 'user_4',
+          email: 'user_4',
         },
       ]),
     }
@@ -96,8 +106,10 @@ describe('<OnlineUsersWidget />', function () {
       fireEvent.click(icon)
 
       expect(testProps.goToUser).to.be.calledWith({
-        name: 'user_3',
+        id: 'user_3',
         user_id: 'user_3',
+        name: 'user_3',
+        email: 'user_3',
       })
     })
   })
diff --git a/services/web/test/frontend/features/editor-navigation-toolbar/components/project-name-editable-label.test.jsx b/services/web/test/frontend/features/editor-navigation-toolbar/components/project-name-editable-label.test.tsx
similarity index 100%
rename from services/web/test/frontend/features/editor-navigation-toolbar/components/project-name-editable-label.test.jsx
rename to services/web/test/frontend/features/editor-navigation-toolbar/components/project-name-editable-label.test.tsx
diff --git a/services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.jsx b/services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.tsx
similarity index 87%
rename from services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.jsx
rename to services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.tsx
index f8441aae56..9b2217744e 100644
--- a/services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.jsx
+++ b/services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.tsx
@@ -1,11 +1,13 @@
 import { expect } from 'chai'
 import { screen } from '@testing-library/react'
 
-import ToolbarHeader from '../../../../../frontend/js/features/editor-navigation-toolbar/components/toolbar-header'
+import ToolbarHeader, {
+  type ToolbarHeaderProps,
+} from '../../../../../frontend/js/features/editor-navigation-toolbar/components/toolbar-header'
 import { renderWithEditorContext } from '../../../helpers/render-with-context'
 
 describe('<ToolbarHeader />', function () {
-  const defaultProps = {
+  const defaultProps: ToolbarHeaderProps = {
     onShowLeftMenuClick: () => {},
     toggleChatOpen: () => {},
     toggleReviewPanelOpen: () => {},
@@ -19,15 +21,16 @@ describe('<ToolbarHeader />', function () {
     hasPublishPermissions: true,
     chatVisible: true,
     trackChangesVisible: true,
-    handleChangeLayout: () => {},
-    pdfLayout: 'sideBySide',
-    view: 'editor',
-    reattach: () => {},
-    detach: () => {},
+    cobranding: undefined,
+    isRestrictedTokenMember: false,
+    hasRenamePermissions: true,
+    historyIsOpen: false,
+    chatIsOpen: false,
+    reviewPanelOpen: false,
   }
 
   beforeEach(function () {
-    window.metaAttributesCache.set('ol-chatEnabled', true)
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   describe('cobranding logo', function () {
@@ -40,6 +43,8 @@ describe('<ToolbarHeader />', function () {
       const props = {
         ...defaultProps,
         cobranding: {
+          brandId: 12,
+          brandVariationId: 12,
           brandVariationHomeUrl: 'http://cobranding',
           brandVariationName: 'variation',
           logoImgUrl: 'http://cobranding/logo',
diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-folder.spec.tsx b/services/web/test/frontend/features/file-tree/components/file-tree-folder.spec.tsx
index 24dc139de7..e371bee72f 100644
--- a/services/web/test/frontend/features/file-tree/components/file-tree-folder.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/components/file-tree-folder.spec.tsx
@@ -1,7 +1,7 @@
 import FileTreeFolder from '../../../../../frontend/js/features/file-tree/components/file-tree-folder'
 import { EditorProviders } from '../../../helpers/editor-providers'
 import { FileTreeProvider } from '../helpers/file-tree-provider'
-import { getContainerEl } from 'cypress/react'
+import { getContainerEl } from 'cypress/react18'
 import ReactDom from 'react-dom'
 
 describe('<FileTreeFolder/>', function () {
diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-root.spec.tsx b/services/web/test/frontend/features/file-tree/components/file-tree-root.spec.tsx
index 6e56b1b6bb..0739f5a3d5 100644
--- a/services/web/test/frontend/features/file-tree/components/file-tree-root.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/components/file-tree-root.spec.tsx
@@ -1,6 +1,7 @@
 import FileTreeRoot from '../../../../../frontend/js/features/file-tree/components/file-tree-root'
 import { EditorProviders } from '../../../helpers/editor-providers'
 import { SocketIOMock } from '@/ide/connection/SocketIoShim'
+import type { Socket } from '@/features/ide-react/connection/types/socket'
 
 describe('<FileTreeRoot/>', function () {
   beforeEach(function () {
@@ -245,9 +246,9 @@ describe('<FileTreeRoot/>', function () {
   })
 
   describe('when deselecting files', function () {
-    let socket: SocketIOMock
+    let socket: SocketIOMock & Socket
     beforeEach(function () {
-      socket = new SocketIOMock()
+      socket = new SocketIOMock() as any
       const rootFolder = [
         {
           _id: 'root-folder-id',
diff --git a/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.spec.tsx b/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.spec.tsx
index 70dad331a2..e663541049 100644
--- a/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/components/file-tree-toolbar.spec.tsx
@@ -5,7 +5,7 @@ import { FileTreeProvider } from '../helpers/file-tree-provider'
 describe('<FileTreeToolbar/>', function () {
   it('without selected files', function () {
     cy.mount(
-      <EditorProviders>
+      <EditorProviders rootDocId="">
         <FileTreeProvider>
           <FileTreeToolbar />
         </FileTreeProvider>
diff --git a/services/web/test/frontend/features/file-tree/flows/create-folder.spec.tsx b/services/web/test/frontend/features/file-tree/flows/create-folder.spec.tsx
index a7ccca400b..553757a1f1 100644
--- a/services/web/test/frontend/features/file-tree/flows/create-folder.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/flows/create-folder.spec.tsx
@@ -1,11 +1,12 @@
 import FileTreeRoot from '../../../../../frontend/js/features/file-tree/components/file-tree-root'
 import { EditorProviders } from '../../../helpers/editor-providers'
 import { SocketIOMock } from '@/ide/connection/SocketIoShim'
+import type { Socket } from '@/features/ide-react/connection/types/socket'
 
 describe('FileTree Create Folder Flow', function () {
-  let socket: SocketIOMock
+  let socket: SocketIOMock & Socket
   beforeEach(function () {
-    socket = new SocketIOMock()
+    socket = new SocketIOMock() as any
     cy.window().then(win => {
       win.metaAttributesCache.set('ol-user', { id: 'user1' })
     })
diff --git a/services/web/test/frontend/features/file-tree/flows/delete-entity.spec.tsx b/services/web/test/frontend/features/file-tree/flows/delete-entity.spec.tsx
index af85aa2f46..22de945454 100644
--- a/services/web/test/frontend/features/file-tree/flows/delete-entity.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/flows/delete-entity.spec.tsx
@@ -1,6 +1,7 @@
 import FileTreeRoot from '../../../../../frontend/js/features/file-tree/components/file-tree-root'
 import { EditorProviders } from '../../../helpers/editor-providers'
 import { SocketIOMock } from '@/ide/connection/SocketIoShim'
+import type { Socket } from '@/features/ide-react/connection/types/socket'
 
 describe('FileTree Delete Entity Flow', function () {
   beforeEach(function () {
@@ -10,9 +11,9 @@ describe('FileTree Delete Entity Flow', function () {
   })
 
   describe('single entity', function () {
-    let socket: SocketIOMock
+    let socket: SocketIOMock & Socket
     beforeEach(function () {
-      socket = new SocketIOMock()
+      socket = new SocketIOMock() as any
       const rootFolder = [
         {
           _id: 'root-folder-id',
@@ -136,9 +137,9 @@ describe('FileTree Delete Entity Flow', function () {
   })
 
   describe('folders', function () {
-    let socket: SocketIOMock
+    let socket: SocketIOMock & Socket
     beforeEach(function () {
-      socket = new SocketIOMock()
+      socket = new SocketIOMock() as any
       const rootFolder = [
         {
           _id: 'root-folder-id',
@@ -207,9 +208,9 @@ describe('FileTree Delete Entity Flow', function () {
   })
 
   describe('multiple entities', function () {
-    let socket: SocketIOMock
+    let socket: SocketIOMock & Socket
     beforeEach(function () {
-      socket = new SocketIOMock()
+      socket = new SocketIOMock() as any
       const rootFolder = [
         {
           _id: 'root-folder-id',
diff --git a/services/web/test/frontend/features/file-tree/flows/rename-entity.spec.tsx b/services/web/test/frontend/features/file-tree/flows/rename-entity.spec.tsx
index afa849c265..dbff951dfc 100644
--- a/services/web/test/frontend/features/file-tree/flows/rename-entity.spec.tsx
+++ b/services/web/test/frontend/features/file-tree/flows/rename-entity.spec.tsx
@@ -1,6 +1,7 @@
 import FileTreeRoot from '../../../../../frontend/js/features/file-tree/components/file-tree-root'
 import { EditorProviders } from '../../../helpers/editor-providers'
 import { SocketIOMock } from '@/ide/connection/SocketIoShim'
+import type { Socket } from '@/features/ide-react/connection/types/socket'
 
 describe('FileTree Rename Entity Flow', function () {
   beforeEach(function () {
@@ -9,9 +10,9 @@ describe('FileTree Rename Entity Flow', function () {
     })
   })
 
-  let socket: SocketIOMock
+  let socket: SocketIOMock & Socket
   beforeEach(function () {
-    socket = new SocketIOMock()
+    socket = new SocketIOMock() as any
     const rootFolder = [
       {
         _id: 'root-folder-id',
diff --git a/services/web/test/frontend/features/file-tree/helpers/file-tree-provider.tsx b/services/web/test/frontend/features/file-tree/helpers/file-tree-provider.tsx
index 714128f946..400b43baaa 100644
--- a/services/web/test/frontend/features/file-tree/helpers/file-tree-provider.tsx
+++ b/services/web/test/frontend/features/file-tree/helpers/file-tree-provider.tsx
@@ -1,9 +1,11 @@
 import { ComponentProps, FC, useRef, useState } from 'react'
 import FileTreeContext from '@/features/file-tree/components/file-tree-context'
 
-export const FileTreeProvider: FC<{
-  refProviders?: Record<string, boolean>
-}> = ({ children, refProviders = {} }) => {
+export const FileTreeProvider: FC<
+  React.PropsWithChildren<{
+    refProviders?: Record<string, boolean>
+  }>
+> = ({ children, refProviders = {} }) => {
   const [fileTreeContainer, setFileTreeContainer] =
     useState<HTMLDivElement | null>(null)
 
diff --git a/services/web/test/frontend/features/file-view/components/file-view-header.test.jsx b/services/web/test/frontend/features/file-view/components/file-view-header.test.jsx
index 83c8edb7bc..11a61d9905 100644
--- a/services/web/test/frontend/features/file-view/components/file-view-header.test.jsx
+++ b/services/web/test/frontend/features/file-view/components/file-view-header.test.jsx
@@ -39,7 +39,7 @@ describe('<FileViewHeader/>', function () {
   }
 
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('header text', function () {
diff --git a/services/web/test/frontend/features/file-view/components/file-view-refresh-button.test.jsx b/services/web/test/frontend/features/file-view/components/file-view-refresh-button.test.jsx
index 6e05e4e5d9..da29252be0 100644
--- a/services/web/test/frontend/features/file-view/components/file-view-refresh-button.test.jsx
+++ b/services/web/test/frontend/features/file-view/components/file-view-refresh-button.test.jsx
@@ -23,7 +23,7 @@ describe('<FileViewRefreshButton />', function () {
   }
 
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   // eslint-disable-next-line mocha/no-skipped-tests
diff --git a/services/web/test/frontend/features/file-view/components/file-view-text.test.jsx b/services/web/test/frontend/features/file-view/components/file-view-text.test.jsx
index ec19f57ecf..1ca50fbb8c 100644
--- a/services/web/test/frontend/features/file-view/components/file-view-text.test.jsx
+++ b/services/web/test/frontend/features/file-view/components/file-view-text.test.jsx
@@ -19,7 +19,8 @@ describe('<FileViewText/>', function () {
   }
 
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   it('renders a text view', async function () {
diff --git a/services/web/test/frontend/features/file-view/components/file-view.test.jsx b/services/web/test/frontend/features/file-view/components/file-view.test.jsx
index be32d1fa4f..7159f1ceaf 100644
--- a/services/web/test/frontend/features/file-view/components/file-view.test.jsx
+++ b/services/web/test/frontend/features/file-view/components/file-view.test.jsx
@@ -32,7 +32,8 @@ describe('<FileView/>', function () {
   }
 
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   describe('for a text file', function () {
diff --git a/services/web/test/frontend/features/full-project-search/components/full-project-search.spec.tsx b/services/web/test/frontend/features/full-project-search/components/full-project-search.spec.tsx
index 9041214b20..6e04a9cf3f 100644
--- a/services/web/test/frontend/features/full-project-search/components/full-project-search.spec.tsx
+++ b/services/web/test/frontend/features/full-project-search/components/full-project-search.spec.tsx
@@ -93,9 +93,12 @@ const createInitialValue = () =>
     pdfPreviewOpen: false,
     projectSearchIsOpen: true,
     setProjectSearchIsOpen: cy.stub(),
+    openFile: null,
+    setOpenFile: cy.stub(),
+    restoreView: cy.stub(),
   }) satisfies LayoutContextValue
 
-const LayoutProvider: FC = ({ children }) => {
+const LayoutProvider: FC<React.PropsWithChildren> = ({ children }) => {
   const [value] = useState(createInitialValue)
 
   return (
diff --git a/services/web/test/frontend/features/group-management/components/add-seats.spec.tsx b/services/web/test/frontend/features/group-management/components/add-seats.spec.tsx
index ab5ddb8355..f26357d842 100644
--- a/services/web/test/frontend/features/group-management/components/add-seats.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/add-seats.spec.tsx
@@ -1,6 +1,8 @@
 import AddSeats, {
   MAX_NUMBER_OF_USERS,
+  MAX_NUMBER_OF_PO_NUMBER_CHARACTERS,
 } from '@/features/group-management/components/add-seats/add-seats'
+import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 describe('<AddSeats />', function () {
   beforeEach(function () {
@@ -11,9 +13,14 @@ describe('<AddSeats />', function () {
       win.metaAttributesCache.set('ol-subscriptionId', '123')
       win.metaAttributesCache.set('ol-totalLicenses', this.totalLicenses)
       win.metaAttributesCache.set('ol-isProfessional', false)
+      win.metaAttributesCache.set('ol-isCollectionMethodManual', true)
     })
 
-    cy.mount(<AddSeats />)
+    cy.mount(
+      <SplitTestProvider>
+        <AddSeats />
+      </SplitTestProvider>
+    )
 
     cy.findByRole('button', { name: /buy licenses/i })
     cy.findByTestId('add-more-users-group-form')
@@ -21,7 +28,7 @@ describe('<AddSeats />', function () {
 
   it('renders the back button', function () {
     cy.findByTestId('group-heading').within(() => {
-      cy.findByRole('button', { name: /back to subscription/i }).should(
+      cy.findByRole('link', { name: /back to subscription/i }).should(
         'have.attr',
         'href',
         '/user/subscription'
@@ -61,13 +68,59 @@ describe('<AddSeats />', function () {
   })
 
   it('renders the cancel button', function () {
-    cy.findByRole('button', { name: /cancel/i }).should(
+    cy.findByRole('link', { name: /cancel/i }).should(
       'have.attr',
       'href',
       '/user/subscription'
     )
   })
 
+  describe('PO number', function () {
+    it('should not render the PO checkbox and PO input if collection method is not manual', function () {
+      cy.window().then(win => {
+        win.metaAttributesCache.set('ol-isCollectionMethodManual', false)
+      })
+      cy.mount(
+        <SplitTestProvider>
+          <AddSeats />
+        </SplitTestProvider>
+      )
+
+      cy.findByLabelText(/i want to add a po number/i).should('not.exist')
+      cy.findByLabelText(/^po number$/i).should('not.exist')
+    })
+
+    it('should check the PO checkbox in order to activate the PO input field', function () {
+      cy.findByLabelText(/^po number$/i).should('not.exist')
+      cy.findByLabelText(/i want to add a po number/i).check()
+      cy.findByLabelText(/^po number$/i)
+    })
+
+    describe('validation', function () {
+      beforeEach(function () {
+        cy.findByLabelText(/i want to add a po number/i).check()
+      })
+
+      it('should show max characters error', function () {
+        const totalCharacters = 'a'.repeat(
+          MAX_NUMBER_OF_PO_NUMBER_CHARACTERS + 1
+        )
+        cy.findByLabelText(/^po number$/i).type(totalCharacters)
+        cy.findByText(
+          new RegExp(
+            `po number must not exceed ${MAX_NUMBER_OF_PO_NUMBER_CHARACTERS} characters`,
+            'i'
+          )
+        )
+      })
+
+      it('should show letters and numbers only error', function () {
+        cy.findByLabelText(/^po number$/i).type('🚧')
+        cy.findByText(/po number can include digits and letters only/i)
+      })
+    })
+  })
+
   describe('"Upgrade my plan" link', function () {
     it('shows the link', function () {
       cy.findByRole('link', { name: /upgrade my plan/i }).should(
@@ -82,7 +135,11 @@ describe('<AddSeats />', function () {
         win.metaAttributesCache.set('ol-isProfessional', true)
       })
 
-      cy.mount(<AddSeats />)
+      cy.mount(
+        <SplitTestProvider>
+          <AddSeats />
+        </SplitTestProvider>
+      )
 
       cy.findByRole('link', { name: /upgrade my plan/i }).should('not.exist')
     })
@@ -153,7 +210,7 @@ describe('<AddSeats />', function () {
 
       describe('request', function () {
         afterEach(function () {
-          cy.findByRole('button', { name: /go to subscriptions/i }).should(
+          cy.findByRole('link', { name: /go to subscriptions/i }).should(
             'have.attr',
             'href',
             '/user/subscription'
@@ -216,6 +273,7 @@ describe('<AddSeats />', function () {
             },
           },
           currency: 'USD',
+          netTerms: 30,
           immediateCharge: {
             subtotal: 100,
             tax: 20,
@@ -241,13 +299,16 @@ describe('<AddSeats />', function () {
         cy.findByRole('button', { name: /send request/i }).should('not.exist')
       })
 
-      it('renders the preview data', function () {
+      function makeRequest(body: object, inputValue: string) {
         cy.intercept('POST', '/user/subscription/group/add-users/preview', {
           statusCode: 200,
-          body: this.body,
+          body,
         }).as('addUsersRequest')
-        cy.get('@input').type(this.adding.toString())
+        cy.get('@input').type(inputValue)
+      }
 
+      it('renders common preview data content', function () {
+        makeRequest(this.body, this.adding.toString())
         cy.findByTestId('cost-summary').within(() => {
           cy.contains(
             new RegExp(
@@ -279,22 +340,55 @@ describe('<AddSeats />', function () {
           cy.findByTestId('discount').should('not.exist')
 
           cy.findByTestId('total').within(() => {
-            cy.findByText(/total due today/i)
             cy.findByTestId('price').should(
               'have.text',
               `$${this.body.immediateCharge.total}.00`
             )
           })
 
-          cy.findByText(
-            /we’ll charge you now for the cost of your additional licenses based on the remaining months of your current subscription/i
-          )
           cy.findByText(
             /after that, we’ll bill you \$1,000\.00 \(\$895\.00 \+ \$105\.00 tax\) annually on December 1, unless you cancel/i
           )
         })
       })
 
+      it('renders the preview data with manually billed subscription', function () {
+        makeRequest(this.body, this.adding.toString())
+        cy.findByTestId('cost-summary').within(() => {
+          cy.findByTestId('total').within(() => {
+            cy.findByText(
+              new RegExp(`total due in ${this.body.netTerms} days`, 'i')
+            )
+          })
+        })
+        cy.findByText(
+          new RegExp(
+            `we’ll invoice you now for the additional licences based on the remaining months of your current subscription, and payment will be due in ${this.body.netTerms} days`,
+            'i'
+          )
+        )
+      })
+
+      it('renders the preview data with automatically billed subscription', function () {
+        cy.window().then(win => {
+          win.metaAttributesCache.set('ol-isCollectionMethodManual', false)
+        })
+        cy.mount(
+          <SplitTestProvider>
+            <AddSeats />
+          </SplitTestProvider>
+        )
+        makeRequest(this.body, this.adding.toString())
+        cy.findByTestId('cost-summary').within(() => {
+          cy.findByTestId('total').within(() => {
+            cy.findByText(/total due today/i)
+          })
+        })
+        cy.findByText(
+          /we’ll charge you now for the cost of your additional licenses based on the remaining months of your current subscription/i
+        )
+      })
+
       it('renders the preview data with discount', function () {
         this.body.immediateCharge.discount = 50
 
@@ -317,7 +411,7 @@ describe('<AddSeats />', function () {
 
       describe('request', function () {
         afterEach(function () {
-          cy.findByRole('button', { name: /go to subscriptions/i }).should(
+          cy.findByRole('link', { name: /go to subscriptions/i }).should(
             'have.attr',
             'href',
             '/user/subscription'
@@ -325,16 +419,23 @@ describe('<AddSeats />', function () {
         })
 
         function makeRequest(statusCode: number, adding: string) {
+          const PO_NUMBER = 'PO123456789'
           cy.intercept('POST', '/user/subscription/group/add-users/create', {
             statusCode,
           }).as('addUsersRequest')
           cy.get('@input').type(adding)
+          cy.findByLabelText(/i want to add a po number/i).check()
+          cy.findByLabelText(/^po number$/i).type(PO_NUMBER)
           cy.get('@addUsersBtn').click()
+
+          const body = {
+            adding: Number(adding),
+            poNumber: PO_NUMBER,
+          }
           cy.get('@addUsersRequest')
             .its('request.body')
-            .should('deep.equal', {
-              adding: Number(adding),
-            })
+            .should('deep.equal', body)
+            .and('have.keys', Object.keys(body))
           cy.findByTestId('add-more-users-group-form').should('not.exist')
         }
 
diff --git a/services/web/test/frontend/features/group-management/components/members-table/dropdown-button.spec.tsx b/services/web/test/frontend/features/group-management/components/members-table/dropdown-button.spec.tsx
index 9213069699..93d24865b2 100644
--- a/services/web/test/frontend/features/group-management/components/members-table/dropdown-button.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/members-table/dropdown-button.spec.tsx
@@ -24,6 +24,7 @@ function mountDropDownComponent(user: User, subscriptionId: string) {
       <DropdownButton
         user={user}
         openOffboardingModalForUser={sinon.stub()}
+        openRemoveModalForUser={sinon.stub()}
         openUnlinkUserModal={sinon.stub()}
         groupId={subscriptionId}
         setGroupUserAlert={sinon.stub()}
@@ -174,6 +175,7 @@ describe('DropdownButton', function () {
       beforeEach(function () {
         cy.window().then(win => {
           win.metaAttributesCache.set('ol-users', [user])
+          win.metaAttributesCache.set('ol-isUserGroupManager', true)
         })
         mountDropDownComponent(user, subscriptionId)
       })
@@ -189,6 +191,7 @@ describe('DropdownButton', function () {
         cy.findByRole('button', { name: /actions/i }).click()
 
         cy.findByTestId('delete-user-action').should('be.visible')
+        cy.findByTestId('release-user-action')
 
         cy.findByTestId('remove-user-action').should('not.exist')
         cy.findByTestId('resend-managed-user-invite-action').should('not.exist')
@@ -566,6 +569,7 @@ describe('DropdownButton', function () {
         cy.findByTestId('unlink-user-action').should('be.visible')
 
         cy.findByTestId('delete-user-action').should('not.exist')
+        cy.findByTestId('release-user-action').should('not.exist')
         cy.findByTestId('resend-sso-link-invite-action').should('not.exist')
         cy.findByTestId('no-actions-available').should('not.exist')
       })
@@ -608,6 +612,7 @@ describe('DropdownButton', function () {
         )
         cy.findByTestId('remove-user-action').should('be.visible')
         cy.findByTestId('delete-user-action').should('not.exist')
+        cy.findByTestId('release-user-action').should('not.exist')
         cy.findByTestId('resend-sso-link-invite-action').should('exist')
 
         cy.findByTestId('no-actions-available').should('not.exist')
@@ -633,6 +638,7 @@ describe('DropdownButton', function () {
       beforeEach(function () {
         cy.window().then(win => {
           win.metaAttributesCache.set('ol-users', [user])
+          win.metaAttributesCache.set('ol-isUserGroupManager', true)
         })
         mountDropDownComponent(user, subscriptionId)
       })
@@ -648,6 +654,7 @@ describe('DropdownButton', function () {
         cy.findByRole('button', { name: /actions/i }).click()
 
         cy.findByTestId('delete-user-action').should('be.visible')
+        cy.findByTestId('release-user-action')
 
         cy.findByTestId('remove-user-action').should('not.exist')
         cy.findByTestId('resend-managed-user-invite-action').should('not.exist')
@@ -682,6 +689,7 @@ describe('DropdownButton', function () {
       beforeEach(function () {
         cy.window().then(win => {
           win.metaAttributesCache.set('ol-users', [user])
+          win.metaAttributesCache.set('ol-isUserGroupManager', true)
         })
         mountDropDownComponent(user, subscriptionId)
       })
@@ -697,6 +705,7 @@ describe('DropdownButton', function () {
         cy.findByRole('button', { name: /actions/i }).click()
 
         cy.findByTestId('delete-user-action').should('be.visible')
+        cy.findByTestId('release-user-action')
 
         cy.findByTestId('remove-user-action').should('not.exist')
         cy.findByTestId('resend-managed-user-invite-action').should('not.exist')
@@ -745,6 +754,7 @@ describe('DropdownButton', function () {
         cy.findByTestId('resend-managed-user-invite-action').should('not.exist')
         cy.findByTestId('remove-user-action').should('not.exist')
         cy.findByTestId('delete-user-action').should('not.exist')
+        cy.findByTestId('release-user-action').should('not.exist')
         cy.findByTestId('no-actions-available').should('not.exist')
       })
     })
@@ -793,6 +803,7 @@ describe('DropdownButton', function () {
 
         cy.findByTestId('no-actions-available').should('not.exist')
         cy.findByTestId('delete-user-action').should('not.exist')
+        cy.findByTestId('release-user-action').should('not.exist')
         cy.findByTestId('remove-user-action').should('not.exist')
         cy.findByTestId('resend-managed-user-invite-action').should('not.exist')
         cy.findByTestId('resend-sso-link-invite-action').should('not.exist')
diff --git a/services/web/test/frontend/features/group-management/components/members-table/managed-user-status.spec.tsx b/services/web/test/frontend/features/group-management/components/members-table/managed-user-status.spec.tsx
index 49cadfe0c9..5c09987695 100644
--- a/services/web/test/frontend/features/group-management/components/members-table/managed-user-status.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/members-table/managed-user-status.spec.tsx
@@ -61,26 +61,4 @@ describe('MemberStatus', function () {
       cy.get('.security-state-not-managed').contains('Managed')
     })
   })
-
-  describe('with the group admin', function () {
-    const user: User = {
-      _id: 'some-user',
-      email: 'some.user@example.com',
-      first_name: 'Some',
-      last_name: 'User',
-      invite: false,
-      last_active_at: new Date(),
-      enrollment: undefined,
-      isEntityAdmin: true,
-    }
-    beforeEach(function () {
-      cy.mount(<ManagedUserStatus user={user} />)
-    })
-
-    it('should render no state indicator', function () {
-      cy.get('.security-state-group-admin')
-        .contains('Managed')
-        .should('not.exist')
-    })
-  })
 })
diff --git a/services/web/test/frontend/features/group-management/components/members-table/member-row.spec.tsx b/services/web/test/frontend/features/group-management/components/members-table/member-row.spec.tsx
index 538e3036b8..0ae6ee8d04 100644
--- a/services/web/test/frontend/features/group-management/components/members-table/member-row.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/members-table/member-row.spec.tsx
@@ -30,6 +30,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -82,6 +83,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -121,6 +123,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -159,6 +162,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -207,6 +211,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -258,6 +263,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -297,6 +303,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -335,6 +342,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -383,6 +391,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -435,6 +444,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -474,6 +484,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -512,6 +523,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -561,6 +573,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -613,6 +626,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -652,6 +666,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
@@ -690,6 +705,7 @@ describe('MemberRow', function () {
             <MemberRow
               user={user}
               openOffboardingModalForUser={sinon.stub()}
+              openRemoveModalForUser={sinon.stub()}
               openUnlinkUserModal={sinon.stub()}
               groupId={subscriptionId}
               setGroupUserAlert={sinon.stub()}
diff --git a/services/web/test/frontend/features/group-management/components/members-table/members-list.spec.tsx b/services/web/test/frontend/features/group-management/components/members-table/members-list.spec.tsx
index 0861ab6c34..32958b34d0 100644
--- a/services/web/test/frontend/features/group-management/components/members-table/members-list.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/members-table/members-list.spec.tsx
@@ -121,6 +121,16 @@ describe('MembersList', function () {
         users[1].last_name
       )
     })
+    it('should render the pagination navigation', function () {
+      cy.window().then(win => {
+        win.metaAttributesCache.set(
+          'ol-users',
+          Array.from({ length: 50 }).flatMap(() => users.flat())
+        )
+      })
+      mountManagedUsersList()
+      cy.findByRole('navigation', { name: /pagination navigation/i })
+    })
   })
 
   describe('empty user list', function () {
diff --git a/services/web/test/frontend/features/group-management/components/members-table/remove-managed-user-modal.spec.tsx b/services/web/test/frontend/features/group-management/components/members-table/remove-managed-user-modal.spec.tsx
new file mode 100644
index 0000000000..1bf6b677d5
--- /dev/null
+++ b/services/web/test/frontend/features/group-management/components/members-table/remove-managed-user-modal.spec.tsx
@@ -0,0 +1,96 @@
+import RemoveManagedUserModal from '@/features/group-management/components/members-table/remove-managed-user-modal'
+import sinon from 'sinon'
+
+describe('RemoveManagedUserModal', function () {
+  describe('happy path', function () {
+    const groupId = 'some-group'
+    const user = {
+      _id: 'some-user',
+      email: 'some.user@example.com',
+      first_name: 'Some',
+      last_name: 'User',
+      invite: true,
+      last_active_at: new Date(),
+      enrollment: {
+        managedBy: `${groupId}`,
+        enrolledAt: new Date(),
+      },
+      isEntityAdmin: undefined,
+    }
+
+    beforeEach(function () {
+      cy.mount(
+        <RemoveManagedUserModal
+          user={user}
+          groupId={groupId}
+          onClose={sinon.stub()}
+        />
+      )
+    })
+
+    it('should render the modal', function () {
+      cy.findByTestId('release-user-form')
+    })
+
+    it('should render content', function () {
+      cy.findByText(
+        `You’re about to remove ${user.first_name} ${user.last_name} (${user.email}). Doing this will mean:`
+      )
+      cy.findAllByRole('listitem')
+        .eq(0)
+        .contains(/they will be removed from the group/i)
+      cy.findAllByRole('listitem')
+        .eq(1)
+        .contains(/they will no longer be a managed user/i)
+      cy.findAllByRole('listitem')
+        .eq(2)
+        .contains(
+          /they will retain their existing account on the .* free plan/i
+        )
+      cy.findAllByRole('listitem')
+        .eq(3)
+        .contains(
+          /they will retain ownership of projects currently owned by them and any collaborators on those projects will become read-only/i
+        )
+      cy.findAllByRole('listitem')
+        .eq(4)
+        .contains(
+          /they will continue to have access to any projects shared with them/i
+        )
+      cy.findAllByRole('listitem')
+        .eq(5)
+        .contains(
+          /they won’t be able to log in with SSO \(if you have this enabled\)\. they will need to set an .* password/i
+        )
+      cy.contains(
+        /in cases where a user has left your organization and you need to transfer their projects, the delete user option should be used/i
+      )
+    })
+
+    it('should disable the remove button if the email does not match the user', function () {
+      // Button should be disabled initially
+      cy.findByRole('button', { name: /remove user/i }).should('be.disabled')
+
+      // Fill in the email input, with the wrong email address
+      cy.findByLabelText(
+        /to confirm you want to remove .* please type the email address associated with their account/i
+      ).type('totally.wrong@example.com')
+
+      // Button still disabled
+      cy.findByRole('button', { name: /remove user/i }).should('be.disabled')
+    })
+
+    it('should fill out the form, and enable the remove button', function () {
+      // Button should be disabled initially
+      cy.findByRole('button', { name: /remove user/i }).should('be.disabled')
+
+      // Fill in the email input
+      cy.findByLabelText(
+        /to confirm you want to remove .* please type the email address associated with their account/i
+      ).type(user.email)
+
+      // Button should be enabled now
+      cy.findByRole('button', { name: /remove user/i }).should('be.enabled')
+    })
+  })
+})
diff --git a/services/web/test/frontend/features/group-management/components/members-table/unlink-user-modal.test.tsx b/services/web/test/frontend/features/group-management/components/members-table/unlink-user-modal.test.tsx
index b4787e97c0..57eb8a30c0 100644
--- a/services/web/test/frontend/features/group-management/components/members-table/unlink-user-modal.test.tsx
+++ b/services/web/test/frontend/features/group-management/components/members-table/unlink-user-modal.test.tsx
@@ -1,5 +1,5 @@
 import { fireEvent, render, screen, waitFor } from '@testing-library/react'
-import { ReactElement } from 'react'
+import { FC, PropsWithChildren, ReactElement } from 'react'
 import sinon from 'sinon'
 import fetchMock from 'fetch-mock'
 import UnlinkUserModal from '@/features/group-management/components/members-table/unlink-user-modal'
@@ -7,11 +7,9 @@ import { GroupMembersProvider } from '@/features/group-management/context/group-
 import { expect } from 'chai'
 
 export function renderWithContext(component: ReactElement, props = {}) {
-  const GroupMembersProviderWrapper = ({
-    children,
-  }: {
-    children: ReactElement
-  }) => <GroupMembersProvider {...props}>{children}</GroupMembersProvider>
+  const GroupMembersProviderWrapper: FC<PropsWithChildren> = ({ children }) => (
+    <GroupMembersProvider {...props}>{children}</GroupMembersProvider>
+  )
 
   return render(component, { wrapper: GroupMembersProviderWrapper })
 }
@@ -31,7 +29,7 @@ describe('<UnlinkUserModal />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('displays the modal', async function () {
@@ -58,6 +56,15 @@ describe('<UnlinkUserModal />', function () {
     await waitFor(() => expect(defaultProps.onClose).to.have.been.called)
   })
 
+  it('closes the modal on cancelling', async function () {
+    renderWithContext(<UnlinkUserModal {...defaultProps} />)
+
+    const cancelButton = screen.getByRole('button', { name: 'Cancel' })
+    fireEvent.click(cancelButton)
+
+    await waitFor(() => expect(defaultProps.onClose).to.have.been.called)
+  })
+
   it('handles errors', async function () {
     fetchMock.post(`/manage/groups/${groupId}/unlink-user/${userId}`, 500)
 
diff --git a/services/web/test/frontend/features/group-management/components/missing-billing-information.spec.tsx b/services/web/test/frontend/features/group-management/components/missing-billing-information.spec.tsx
index 4eb137c0dc..d9e8de6770 100644
--- a/services/web/test/frontend/features/group-management/components/missing-billing-information.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/missing-billing-information.spec.tsx
@@ -25,7 +25,7 @@ describe('<MissingBillingInformation />', function () {
         }).should(
           'have.attr',
           'href',
-          '/user/subscription/recurly/billing-details'
+          '/user/subscription/payment/billing-details'
         )
         cy.findByRole('link', { name: /get in touch/i }).should(
           'have.attr',
diff --git a/services/web/test/frontend/features/group-management/components/request-status.spec.tsx b/services/web/test/frontend/features/group-management/components/request-status.spec.tsx
index 79982a13d1..4a3061f464 100644
--- a/services/web/test/frontend/features/group-management/components/request-status.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/request-status.spec.tsx
@@ -12,7 +12,7 @@ describe('<RequestStatus />', function () {
 
   it('renders the back button', function () {
     cy.findByTestId('group-heading').within(() => {
-      cy.findByRole('button', { name: /back to subscription/i }).should(
+      cy.findByRole('link', { name: /back to subscription/i }).should(
         'have.attr',
         'href',
         '/user/subscription'
@@ -35,7 +35,7 @@ describe('<RequestStatus />', function () {
   })
 
   it('renders the link to subscriptions', function () {
-    cy.findByRole('button', { name: /go to subscriptions/i }).should(
+    cy.findByRole('link', { name: /go to subscriptions/i }).should(
       'have.attr',
       'href',
       '/user/subscription'
diff --git a/services/web/test/frontend/features/group-management/components/upgrade-subscription.spec.tsx b/services/web/test/frontend/features/group-management/components/upgrade-subscription.spec.tsx
index 5918c1bd68..f7f2c564d7 100644
--- a/services/web/test/frontend/features/group-management/components/upgrade-subscription.spec.tsx
+++ b/services/web/test/frontend/features/group-management/components/upgrade-subscription.spec.tsx
@@ -66,7 +66,7 @@ describe('<UpgradeSubscription />', function () {
 
   it('shows the "Upgrade" and "Cancel" buttons', function () {
     cy.findByRole('button', { name: /upgrade/i })
-    cy.findByRole('button', { name: /cancel/i }).should(
+    cy.findByRole('link', { name: /cancel/i }).should(
       'have.attr',
       'href',
       '/user/subscription'
diff --git a/services/web/test/frontend/features/history/components/change-list.spec.tsx b/services/web/test/frontend/features/history/components/change-list.spec.tsx
index 05021e9cfd..03c5a90592 100644
--- a/services/web/test/frontend/features/history/components/change-list.spec.tsx
+++ b/services/web/test/frontend/features/history/components/change-list.spec.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useState, FC } from 'react'
 import ToggleSwitch from '../../../../../frontend/js/features/history/components/change-list/toggle-switch'
 import ChangeList from '../../../../../frontend/js/features/history/components/change-list/change-list'
 import {
@@ -10,14 +10,14 @@ import { HistoryProvider } from '../../../../../frontend/js/features/history/con
 import { updates } from '../fixtures/updates'
 import { labels } from '../fixtures/labels'
 import { formatTime, relativeDate } from '@/features/utils/format-date'
+import { withTestContainerErrorBoundary } from '../../../helpers/error-boundary'
 
-const mountWithEditorProviders = (
-  component: React.ReactNode,
-  scope: Record<string, unknown> = {},
-  props: Record<string, unknown> = {}
-) => {
-  cy.mount(
-    <EditorProviders scope={scope} {...props}>
+const TestContainerWithoutErrorBoundary: FC<{
+  component: React.ReactNode
+  props: Record<string, unknown>
+}> = ({ component, props }) => {
+  return (
+    <EditorProviders {...props}>
       <HistoryProvider>
         <div style={{ display: 'flex', justifyContent: 'center' }}>
           <div className="history-react">{component}</div>
@@ -27,11 +27,18 @@ const mountWithEditorProviders = (
   )
 }
 
-describe('change list (Bootstrap 5)', function () {
-  const scope = {
-    ui: { view: 'history', pdfLayout: 'sideBySide', chatOpen: true },
-  }
+const TestContainer = withTestContainerErrorBoundary(
+  TestContainerWithoutErrorBoundary
+)
 
+const mountWithEditorProviders = (
+  component: React.ReactNode,
+  props: Record<string, unknown> = {}
+) => {
+  cy.mount(<TestContainer component={component} props={props} />)
+}
+
+describe('change list (Bootstrap 5)', function () {
   const waitForData = () => {
     cy.wait('@updates')
     cy.wait('@labels')
@@ -88,7 +95,8 @@ describe('change list (Bootstrap 5)', function () {
 
   describe('tags', function () {
     it('renders tags', function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
+      mountWithEditorProviders(<ChangeList />, {
+        layoutContext: { view: 'history' },
         user: {
           id: USER_ID,
           email: USER_EMAIL,
@@ -160,13 +168,18 @@ describe('change list (Bootstrap 5)', function () {
     })
 
     it('deletes tag', function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: true,
-        },
-      })
+      mountWithEditorProviders(
+        <ChangeList />,
+
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: true,
+          },
+        }
+      )
       waitForData()
 
       cy.findByLabelText(/all history/i).click({ force: true })
@@ -222,7 +235,8 @@ describe('change list (Bootstrap 5)', function () {
     })
 
     it('verifies that selecting the same list item will not trigger a new diff', function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
+      mountWithEditorProviders(<ChangeList />, {
+        layoutContext: { view: 'history' },
         user: {
           id: USER_ID,
           email: USER_EMAIL,
@@ -244,13 +258,18 @@ describe('change list (Bootstrap 5)', function () {
 
   describe('all history', function () {
     beforeEach(function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: true,
-        },
-      })
+      mountWithEditorProviders(
+        <ChangeList />,
+
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: true,
+          },
+        }
+      )
       waitForData()
     })
 
@@ -305,13 +324,18 @@ describe('change list (Bootstrap 5)', function () {
 
   describe('labels only', function () {
     beforeEach(function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: true,
-        },
-      })
+      mountWithEditorProviders(
+        <ChangeList />,
+
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: true,
+          },
+        }
+      )
       waitForData()
       cy.findByLabelText(/labels/i).click({ force: true })
     })
@@ -359,7 +383,7 @@ describe('change list (Bootstrap 5)', function () {
       cy.findAllByTestId('history-version-details')
         .eq(1)
         .within(() => {
-          cy.get('[aria-label="Compare"]').click()
+          cy.findByRole('button', { name: /compare/i }).click()
           cy.findByRole('menu').within(() => {
             cy.findByRole('menuitem', {
               name: /compare up to this version/i,
@@ -386,13 +410,18 @@ describe('change list (Bootstrap 5)', function () {
 
   describe('compare mode', function () {
     beforeEach(function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: true,
-        },
-      })
+      mountWithEditorProviders(
+        <ChangeList />,
+
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: true,
+          },
+        }
+      )
       waitForData()
     })
 
@@ -422,13 +451,18 @@ describe('change list (Bootstrap 5)', function () {
 
   describe('dropdown', function () {
     beforeEach(function () {
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: true,
-        },
-      })
+      mountWithEditorProviders(
+        <ChangeList />,
+
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: true,
+          },
+        }
+      )
       waitForData()
     })
 
@@ -597,21 +631,18 @@ describe('change list (Bootstrap 5)', function () {
     })
 
     it('shows non-owner paywall', function () {
-      const scope = {
-        ui: {
-          view: 'history',
-          pdfLayout: 'sideBySide',
-          chatOpen: true,
-        },
-      }
+      mountWithEditorProviders(
+        <ChangeList />,
 
-      mountWithEditorProviders(<ChangeList />, scope, {
-        user: {
-          id: USER_ID,
-          email: USER_EMAIL,
-          isAdmin: false,
-        },
-      })
+        {
+          layoutContext: { view: 'history' },
+          user: {
+            id: USER_ID,
+            email: USER_EMAIL,
+            isAdmin: false,
+          },
+        }
+      )
 
       waitForData()
 
@@ -621,15 +652,8 @@ describe('change list (Bootstrap 5)', function () {
     })
 
     it('shows owner paywall', function () {
-      const scope = {
-        ui: {
-          view: 'history',
-          pdfLayout: 'sideBySide',
-          chatOpen: true,
-        },
-      }
-
-      mountWithEditorProviders(<ChangeList />, scope, {
+      mountWithEditorProviders(<ChangeList />, {
+        layoutContext: { view: 'history' },
         user: {
           id: USER_ID,
           email: USER_EMAIL,
@@ -649,15 +673,8 @@ describe('change list (Bootstrap 5)', function () {
     })
 
     it('shows all labels in free tier', function () {
-      const scope = {
-        ui: {
-          view: 'history',
-          pdfLayout: 'sideBySide',
-          chatOpen: true,
-        },
-      }
-
-      mountWithEditorProviders(<ChangeList />, scope, {
+      mountWithEditorProviders(<ChangeList />, {
+        layoutContext: { view: 'history' },
         user: {
           id: USER_ID,
           email: USER_EMAIL,
diff --git a/services/web/test/frontend/features/history/components/document-diff-viewer.spec.tsx b/services/web/test/frontend/features/history/components/document-diff-viewer.spec.tsx
index 940626b39c..cfa80381d7 100644
--- a/services/web/test/frontend/features/history/components/document-diff-viewer.spec.tsx
+++ b/services/web/test/frontend/features/history/components/document-diff-viewer.spec.tsx
@@ -59,7 +59,7 @@ const highlights: Highlight[] = [
   },
 ]
 
-const Container: FC = ({ children }) => (
+const Container: FC<React.PropsWithChildren> = ({ children }) => (
   <div style={{ width: 600, height: 400 }}>{children}</div>
 )
 
diff --git a/services/web/test/frontend/features/history/components/toolbar.spec.tsx b/services/web/test/frontend/features/history/components/toolbar.spec.tsx
index 18b8b929e8..bc2b518eae 100644
--- a/services/web/test/frontend/features/history/components/toolbar.spec.tsx
+++ b/services/web/test/frontend/features/history/components/toolbar.spec.tsx
@@ -3,12 +3,31 @@ import { HistoryProvider } from '../../../../../frontend/js/features/history/con
 import { HistoryContextValue } from '../../../../../frontend/js/features/history/context/types/history-context-value'
 import { Diff } from '../../../../../frontend/js/features/history/services/types/doc'
 import { EditorProviders } from '../../../helpers/editor-providers'
+import { FC } from 'react'
+import { withTestContainerErrorBoundary } from '../../../helpers/error-boundary'
+import { LayoutContextValue } from '@/shared/context/layout-context'
+
+const TestContainerWithoutErrorBoundary: FC<{
+  layoutContext: LayoutContextValue
+  diff: Diff
+  selection: HistoryContextValue['selection']
+}> = ({ diff, selection, layoutContext }) => {
+  return (
+    <EditorProviders layoutContext={layoutContext}>
+      <HistoryProvider>
+        <div className="history-react">
+          <Toolbar diff={diff} selection={selection} />
+        </div>
+      </HistoryProvider>
+    </EditorProviders>
+  )
+}
+
+const TestContainer = withTestContainerErrorBoundary(
+  TestContainerWithoutErrorBoundary
+)
 
 describe('history toolbar', function () {
-  const editorProvidersScope = {
-    ui: { view: 'history', pdfLayout: 'sideBySide', chatOpen: true },
-  }
-
   const diff: Diff = {
     binary: false,
     docDiff: {
@@ -58,13 +77,11 @@ describe('history toolbar', function () {
     }
 
     cy.mount(
-      <EditorProviders scope={editorProvidersScope}>
-        <HistoryProvider>
-          <div className="history-react">
-            <Toolbar diff={diff} selection={selection} />
-          </div>
-        </HistoryProvider>
-      </EditorProviders>
+      <TestContainer
+        layoutContext={{ view: 'history' }}
+        diff={diff}
+        selection={selection}
+      />
     )
 
     cy.get('.history-react-toolbar').within(() => {
@@ -108,13 +125,11 @@ describe('history toolbar', function () {
     }
 
     cy.mount(
-      <EditorProviders scope={editorProvidersScope}>
-        <HistoryProvider>
-          <div className="history-react">
-            <Toolbar diff={diff} selection={selection} />
-          </div>
-        </HistoryProvider>
-      </EditorProviders>
+      <TestContainer
+        layoutContext={{ view: 'history' }}
+        diff={diff}
+        selection={selection}
+      />
     )
 
     cy.get('.history-react-toolbar').within(() => {
diff --git a/services/web/test/frontend/features/hotkeys-modal/components/hotkeys-modal-bottom-text.test.jsx b/services/web/test/frontend/features/hotkeys-modal/components/hotkeys-modal-bottom-text.test.jsx
index c3baeefa66..399a99ead4 100644
--- a/services/web/test/frontend/features/hotkeys-modal/components/hotkeys-modal-bottom-text.test.jsx
+++ b/services/web/test/frontend/features/hotkeys-modal/components/hotkeys-modal-bottom-text.test.jsx
@@ -15,7 +15,7 @@ describe('<HotkeysModalBottomText />', function () {
     })
 
     expect(link.getAttribute('href')).to.equal(
-      `/articles/overleaf-keyboard-shortcuts/qykqfvmxdnjf`
+      `https://www.overleaf.com/articles/overleaf-keyboard-shortcuts/qykqfvmxdnjf`
     )
   })
 })
diff --git a/services/web/test/frontend/features/ide-react/unit/share-js-history-ot-type.ts b/services/web/test/frontend/features/ide-react/unit/share-js-history-ot-type.ts
new file mode 100644
index 0000000000..8418c59ed0
--- /dev/null
+++ b/services/web/test/frontend/features/ide-react/unit/share-js-history-ot-type.ts
@@ -0,0 +1,134 @@
+import { expect } from 'chai'
+import {
+  StringFileData,
+  TextOperation,
+  AddCommentOperation,
+  Range,
+} from 'overleaf-editor-core'
+import { historyOTType } from '@/features/ide-react/editor/share-js-history-ot-type'
+
+describe('historyOTType', function () {
+  let snapshot: StringFileData
+  let opsA: TextOperation[]
+  let opsB: TextOperation[]
+
+  beforeEach(function () {
+    snapshot = new StringFileData('one plus two equals three')
+
+    // After opsA: "seven plus five equals twelve"
+    opsA = [new TextOperation(), new TextOperation(), new TextOperation()]
+
+    opsA[0].remove(3)
+    opsA[0].insert('seven')
+    opsA[0].retain(22)
+
+    opsA[1].retain(11)
+    opsA[1].remove(3)
+    opsA[1].insert('five')
+    opsA[1].retain(13)
+
+    opsA[2].retain(23)
+    opsA[2].remove(5)
+    opsA[2].insert('twelve')
+
+    // After ops2: "one times two equals two"
+    opsB = [new TextOperation(), new TextOperation()]
+
+    opsB[0].retain(4)
+    opsB[0].remove(4)
+    opsB[0].insert('times')
+    opsB[0].retain(17)
+
+    opsB[1].retain(21)
+    opsB[1].remove(5)
+    opsB[1].insert('two')
+  })
+
+  describe('apply', function () {
+    it('supports an empty operations array', function () {
+      const result = historyOTType.apply(snapshot, [])
+      expect(result.getContent()).to.equal('one plus two equals three')
+    })
+
+    it('applies operations to the snapshot (opsA)', function () {
+      const result = historyOTType.apply(snapshot, opsA)
+      expect(result.getContent()).to.equal('seven plus five equals twelve')
+    })
+
+    it('applies operations to the snapshot (opsB)', function () {
+      const result = historyOTType.apply(snapshot, opsB)
+      expect(result.getContent()).to.equal('one times two equals two')
+    })
+  })
+
+  describe('compose', function () {
+    it('supports empty operations', function () {
+      const ops = historyOTType.compose([], [])
+      expect(ops).to.deep.equal([])
+    })
+
+    it('supports an empty operation on the left', function () {
+      const ops = historyOTType.compose([], opsA)
+      const result = historyOTType.apply(snapshot, ops)
+      expect(result.getContent()).to.equal('seven plus five equals twelve')
+    })
+
+    it('supports an empty operation on the right', function () {
+      const ops = historyOTType.compose(opsA, [])
+      const result = historyOTType.apply(snapshot, ops)
+      expect(result.getContent()).to.equal('seven plus five equals twelve')
+    })
+
+    it('supports operations on both sides', function () {
+      const ops = historyOTType.compose(opsA.slice(0, 2), opsA.slice(2))
+      const result = historyOTType.apply(snapshot, ops)
+      expect(ops.length).to.equal(1)
+      expect(result.getContent()).to.equal('seven plus five equals twelve')
+    })
+
+    it("supports operations that can't be composed", function () {
+      const comment = new AddCommentOperation('comment-id', [new Range(3, 10)])
+      const ops = historyOTType.compose(opsA.slice(0, 2), [
+        comment,
+        ...opsA.slice(2),
+      ])
+      expect(ops.length).to.equal(3)
+      const result = historyOTType.apply(snapshot, ops)
+      expect(result.getContent()).to.equal('seven plus five equals twelve')
+    })
+  })
+
+  describe('transformX', function () {
+    it('supports empty operations', function () {
+      const [aPrime, bPrime] = historyOTType.transformX([], [])
+      expect(aPrime).to.deep.equal([])
+      expect(bPrime).to.deep.equal([])
+    })
+
+    it('supports an empty operation on the left', function () {
+      const [aPrime, bPrime] = historyOTType.transformX([], opsB)
+      expect(aPrime).to.deep.equal([])
+      expect(bPrime).to.deep.equal(opsB)
+    })
+
+    it('supports an empty operation on the right', function () {
+      const [aPrime, bPrime] = historyOTType.transformX(opsA, [])
+      expect(aPrime).to.deep.equal(opsA)
+      expect(bPrime).to.deep.equal([])
+    })
+
+    it('supports operations on both sides (a then b)', function () {
+      const [, bPrime] = historyOTType.transformX(opsA, opsB)
+      const ops = historyOTType.compose(opsA, bPrime)
+      const result = historyOTType.apply(snapshot, ops)
+      expect(result.getContent()).to.equal('seven times five equals twelvetwo')
+    })
+
+    it('supports operations on both sides (b then a)', function () {
+      const [aPrime] = historyOTType.transformX(opsA, opsB)
+      const ops = historyOTType.compose(opsB, aPrime)
+      const result = historyOTType.apply(snapshot, ops)
+      expect(result.getContent()).to.equal('seven times five equals twelvetwo')
+    })
+  })
+})
diff --git a/services/web/test/frontend/features/ide-react/unit/use-status-favicon.test.ts b/services/web/test/frontend/features/ide-react/unit/use-status-favicon.test.ts
new file mode 100644
index 0000000000..f3a9294eb1
--- /dev/null
+++ b/services/web/test/frontend/features/ide-react/unit/use-status-favicon.test.ts
@@ -0,0 +1,131 @@
+import { expect } from 'chai'
+import sinon from 'sinon'
+import { renderHook } from '@testing-library/react'
+import * as CompileContext from '@/shared/context/detach-compile-context'
+
+import { useStatusFavicon } from '@/features/ide-react/hooks/use-status-favicon'
+
+type Compilation = { uncompiled: boolean; compiling: boolean; error: boolean }
+
+describe('useStatusFavicon', function () {
+  let mockUseDetachCompileContext: sinon.SinonStub
+  let clock: sinon.SinonFakeTimers
+  let originalHidden: PropertyDescriptor | undefined
+
+  const setCompilation = (compileContext: Compilation) => {
+    mockUseDetachCompileContext.returns(compileContext)
+  }
+  const setHidden = (hidden: boolean) => {
+    Object.defineProperty(document, 'hidden', {
+      writable: true,
+      configurable: true,
+      value: hidden,
+    })
+    document.dispatchEvent(new Event('visibilitychange'))
+  }
+
+  const getFaviconElements = () =>
+    document.querySelectorAll('link[data-compile-status="true"]')
+
+  const getCurrentFaviconHref = () => {
+    const favicon = document.querySelector(
+      'link[data-compile-status="true"]'
+    ) as HTMLLinkElement
+    return favicon?.href || null
+  }
+
+  beforeEach(function () {
+    mockUseDetachCompileContext = sinon.stub(
+      CompileContext,
+      'useDetachCompileContext'
+    )
+
+    // Mock timers for timeout testing
+    clock = sinon.useFakeTimers()
+
+    // Store original document.hidden descriptor
+    originalHidden = Object.getOwnPropertyDescriptor(
+      Document.prototype,
+      'hidden'
+    )
+
+    // Clean up any existing favicon elements
+    document
+      .querySelectorAll('link[data-compile-status="true"]')
+      .forEach(el => el.remove())
+  })
+
+  afterEach(function () {
+    sinon.restore()
+    clock.restore()
+
+    // Restore original document.hidden
+    if (originalHidden) {
+      Object.defineProperty(document, 'hidden', originalHidden)
+    }
+
+    // Clean up favicon elements
+    document
+      .querySelectorAll('link[data-compile-status="true"]')
+      .forEach(el => el.remove())
+  })
+
+  it('updates favicon to reflect status: UNCOMPILED', function () {
+    setCompilation({ uncompiled: true, compiling: false, error: false })
+    renderHook(() => useStatusFavicon())
+    expect(getCurrentFaviconHref()).to.include('/favicon.svg')
+  })
+
+  it('updates favicon to reflect status: COMPILING', function () {
+    setCompilation({ uncompiled: false, compiling: true, error: false })
+    renderHook(() => useStatusFavicon())
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiling.svg')
+  })
+
+  it('updates favicon to reflect status: COMPILED', function () {
+    setCompilation({ uncompiled: false, compiling: false, error: false })
+    renderHook(() => useStatusFavicon())
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiled.svg')
+  })
+
+  it('updates favicon to reflect status: ERROR', function () {
+    setCompilation({ uncompiled: false, compiling: false, error: true })
+    renderHook(() => useStatusFavicon())
+    expect(getCurrentFaviconHref()).to.include('/favicon-error.svg')
+  })
+
+  it('keeps the COMPILED favicon for 5 seconds when the window is active', function () {
+    setCompilation({ uncompiled: false, compiling: false, error: false })
+    const { rerender } = renderHook(() => useStatusFavicon())
+    setHidden(false)
+    rerender()
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiled.svg')
+    clock.tick(4500)
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiled.svg')
+    clock.tick(1000)
+    expect(getCurrentFaviconHref()).to.include('/favicon.svg')
+  })
+
+  it('keeps the COMPILED favicon forever when the window is hidden', function () {
+    setCompilation({ uncompiled: false, compiling: false, error: false })
+    const { rerender } = renderHook(() => useStatusFavicon())
+    setHidden(true)
+    rerender()
+
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiled.svg')
+    clock.tick(90000)
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiled.svg')
+  })
+
+  it('should only have one favicon element at a time', function () {
+    setCompilation({ uncompiled: true, compiling: false, error: false })
+    const { rerender } = renderHook(() => useStatusFavicon())
+    expect(getFaviconElements()).to.have.length(1)
+    expect(getCurrentFaviconHref()).to.include('/favicon.svg')
+
+    setCompilation({ uncompiled: false, compiling: true, error: false })
+    rerender()
+    expect(getFaviconElements()).to.have.length(1)
+    expect(getCurrentFaviconHref()).to.include('/favicon-compiling.svg')
+  })
+})
diff --git a/services/web/test/frontend/features/layout/components/switch-to-editor-button.spec.tsx b/services/web/test/frontend/features/layout/components/switch-to-editor-button.spec.tsx
index 3cb8ea2fee..9efd500dff 100644
--- a/services/web/test/frontend/features/layout/components/switch-to-editor-button.spec.tsx
+++ b/services/web/test/frontend/features/layout/components/switch-to-editor-button.spec.tsx
@@ -4,7 +4,9 @@ import SwitchToEditorButton from '@/features/pdf-preview/components/switch-to-ed
 describe('<SwitchToEditorButton />', function () {
   it('shows button in full screen pdf layout', function () {
     cy.mount(
-      <EditorProviders ui={{ view: 'pdf', pdfLayout: 'flat', chatOpen: false }}>
+      <EditorProviders
+        layoutContext={{ view: 'pdf', pdfLayout: 'flat', chatIsOpen: false }}
+      >
         <SwitchToEditorButton />
       </EditorProviders>
     )
@@ -15,7 +17,11 @@ describe('<SwitchToEditorButton />', function () {
   it('does not show button in split screen layout', function () {
     cy.mount(
       <EditorProviders
-        ui={{ view: 'pdf', pdfLayout: 'sideBySide', chatOpen: false }}
+        layoutContext={{
+          view: 'pdf',
+          pdfLayout: 'sideBySide',
+          chatIsOpen: false,
+        }}
       >
         <SwitchToEditorButton />
       </EditorProviders>
@@ -28,7 +34,13 @@ describe('<SwitchToEditorButton />', function () {
     window.metaAttributesCache.set('ol-detachRole', 'detacher')
 
     cy.mount(
-      <EditorProviders ui={{ view: 'pdf', pdfLayout: 'flat', chatOpen: false }}>
+      <EditorProviders
+        layoutContext={{
+          view: 'pdf',
+          pdfLayout: 'flat',
+          chatIsOpen: false,
+        }}
+      >
         <SwitchToEditorButton />
       </EditorProviders>
     )
diff --git a/services/web/test/frontend/features/layout/components/switch-to-pdf-button.spec.tsx b/services/web/test/frontend/features/layout/components/switch-to-pdf-button.spec.tsx
index 43fc1cabfc..04e20250d8 100644
--- a/services/web/test/frontend/features/layout/components/switch-to-pdf-button.spec.tsx
+++ b/services/web/test/frontend/features/layout/components/switch-to-pdf-button.spec.tsx
@@ -5,7 +5,7 @@ describe('<SwitchToPDFButton />', function () {
   it('shows button in full screen editor layout', function () {
     cy.mount(
       <EditorProviders
-        ui={{ view: 'editor', pdfLayout: 'flat', chatOpen: false }}
+        layoutContext={{ view: 'editor', pdfLayout: 'flat', chatIsOpen: false }}
       >
         <SwitchToPDFButton />
       </EditorProviders>
@@ -17,7 +17,11 @@ describe('<SwitchToPDFButton />', function () {
   it('does not show button in split screen layout', function () {
     cy.mount(
       <EditorProviders
-        ui={{ view: 'editor', pdfLayout: 'sideBySide', chatOpen: false }}
+        layoutContext={{
+          view: 'editor',
+          pdfLayout: 'sideBySide',
+          chatIsOpen: false,
+        }}
       >
         <SwitchToPDFButton />
       </EditorProviders>
@@ -31,7 +35,7 @@ describe('<SwitchToPDFButton />', function () {
 
     cy.mount(
       <EditorProviders
-        ui={{ view: 'editor', pdfLayout: 'flat', chatOpen: false }}
+        layoutContext={{ view: 'editor', pdfLayout: 'flat', chatIsOpen: false }}
       >
         <SwitchToPDFButton />
       </EditorProviders>
diff --git a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx
index 0ec6db3c9f..00a8593169 100644
--- a/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/current-plan-widget.test.tsx
@@ -70,7 +70,7 @@ describe('<CurrentPlanWidget />', function () {
     })
 
     it('clicks on upgrade button', function () {
-      const upgradeLink = screen.getByRole('button', { name: /upgrade/i })
+      const upgradeLink = screen.getByRole('link', { name: /upgrade/i })
       fireEvent.click(upgradeLink)
       expect(sendMBSpy).to.be.calledOnce
       expect(sendMBSpy).calledWith('upgrade-button-click', {
@@ -83,6 +83,33 @@ describe('<CurrentPlanWidget />', function () {
     })
   })
 
+  describe('free plan with Personal plan name', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-usersBestSubscription', {
+        type: 'individual',
+        plan: {
+          name: 'Free',
+        },
+        subscription: {
+          planCode: 'personal',
+          name: 'Free',
+        },
+        featuresPageURL: '/features',
+      })
+
+      render(<CurrentPlanWidget />)
+    })
+
+    it('shows text and tooltip on mouseover', async function () {
+      const link = screen.getByRole('link', {
+        name: /you’re on the free plan/i,
+      })
+      fireEvent.mouseOver(link)
+
+      await screen.findByRole('tooltip', { name: freePlanTooltipMessage })
+    })
+  })
+
   describe('paid plan', function () {
     describe('trial', function () {
       const subscription = {
diff --git a/services/web/test/frontend/features/project-list/components/load-more.test.tsx b/services/web/test/frontend/features/project-list/components/load-more.test.tsx
index bc99584212..553fbcc487 100644
--- a/services/web/test/frontend/features/project-list/components/load-more.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/load-more.test.tsx
@@ -11,7 +11,7 @@ import { renderWithProjectListContext } from '../helpers/render-with-context'
 
 describe('<LoadMore />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders on a project list longer than 40', async function () {
diff --git a/services/web/test/frontend/features/project-list/components/new-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/new-project-button.test.tsx
index 93c7a68e3a..3f3dc89575 100644
--- a/services/web/test/frontend/features/project-list/components/new-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/new-project-button.test.tsx
@@ -7,7 +7,7 @@ import getMeta from '@/utils/meta'
 
 describe('<NewProjectButton />', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('for every user (affiliated and non-affiliated)', function () {
@@ -28,16 +28,16 @@ describe('<NewProjectButton />', function () {
       renderWithProjectListContext(<NewProjectButton id="test" />)
 
       const newProjectButton = screen.getByRole('button', {
-        name: 'New Project',
+        name: 'New project',
       })
       fireEvent.click(newProjectButton)
     })
 
     it('shows the correct dropdown menu', function () {
       // static menu
-      screen.getByText('Blank Project')
-      screen.getByText('Example Project')
-      screen.getByText('Upload Project')
+      screen.getByText('Blank project')
+      screen.getByText('Example project')
+      screen.getByText('Upload project')
       screen.getByText('Import from GitHub')
 
       // static text
@@ -48,27 +48,27 @@ describe('<NewProjectButton />', function () {
       screen.getByText('View All')
     })
 
-    it('open new project modal when clicking at Blank Project', function () {
-      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+    it('open new project modal when clicking at Blank project', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank project' }))
 
       screen.getByPlaceholderText('Project Name')
     })
 
-    it('open new project modal when clicking at Example Project', function () {
-      fireEvent.click(screen.getByRole('menuitem', { name: 'Example Project' }))
+    it('open new project modal when clicking at Example project', function () {
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Example project' }))
 
       screen.getByPlaceholderText('Project Name')
     })
 
     it('close the new project modal when clicking at the top right "x" button', function () {
-      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank project' }))
       fireEvent.click(screen.getByRole('button', { name: 'Close' }))
 
       expect(screen.queryByRole('dialog')).to.be.null
     })
 
     it('close the new project modal when clicking at the Cancel button', function () {
-      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank Project' }))
+      fireEvent.click(screen.getByRole('menuitem', { name: 'Blank project' }))
       fireEvent.click(screen.getByRole('button', { name: 'Cancel' }))
 
       expect(screen.queryByRole('dialog')).to.be.null
@@ -102,14 +102,14 @@ describe('<NewProjectButton />', function () {
       renderWithProjectListContext(<NewProjectButton id="test" />)
 
       const newProjectButton = screen.getByRole('button', {
-        name: 'New Project',
+        name: 'New project',
       })
 
       fireEvent.click(newProjectButton)
       // static menu
-      screen.getByText('Blank Project')
-      screen.getByText('Example Project')
-      screen.getByText('Upload Project')
+      screen.getByText('Blank project')
+      screen.getByText('Example project')
+      screen.getByText('Upload project')
       screen.getByText('Import from GitHub')
 
       // static text for institution templates
diff --git a/services/web/test/frontend/features/project-list/components/new-project-button/modal-content-new-project-form.test.tsx b/services/web/test/frontend/features/project-list/components/new-project-button/modal-content-new-project-form.test.tsx
index f33ad2f345..7b9a070a85 100644
--- a/services/web/test/frontend/features/project-list/components/new-project-button/modal-content-new-project-form.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/new-project-button/modal-content-new-project-form.test.tsx
@@ -3,24 +3,17 @@ import { expect } from 'chai'
 import fetchMock from 'fetch-mock'
 import sinon from 'sinon'
 import ModalContentNewProjectForm from '../../../../../../frontend/js/features/project-list/components/new-project-button/modal-content-new-project-form'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 
 describe('<ModalContentNewProjectForm />', function () {
-  let assignStub: sinon.SinonStub
-
   beforeEach(function () {
-    assignStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-      setHash: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
   })
 
   afterEach(function () {
-    this.locationStub.restore()
-    fetchMock.reset()
+    this.locationWrapperSandbox.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('submits form', async function () {
@@ -49,12 +42,13 @@ describe('<ModalContentNewProjectForm />', function () {
 
     fireEvent.click(createButton)
 
-    expect(newProjectMock.called()).to.be.true
+    expect(newProjectMock.callHistory.called()).to.be.true
 
+    const assignStub = this.locationWrapperStub.assign
     await waitFor(() => {
       sinon.assert.calledOnce(assignStub)
-      sinon.assert.calledWith(assignStub, `/project/${projectId}`)
     })
+    sinon.assert.calledWith(assignStub, `/project/${projectId}`)
   })
 
   it('shows error when project name contains "/"', async function () {
@@ -76,7 +70,7 @@ describe('<ModalContentNewProjectForm />', function () {
     })
     fireEvent.click(createButton)
 
-    expect(newProjectMock.called()).to.be.true
+    expect(newProjectMock.callHistory.called()).to.be.true
 
     await waitFor(() => {
       screen.getByText(errorMessage)
@@ -102,7 +96,7 @@ describe('<ModalContentNewProjectForm />', function () {
     })
     fireEvent.click(createButton)
 
-    expect(newProjectMock.called()).to.be.true
+    expect(newProjectMock.callHistory.called()).to.be.true
 
     await waitFor(() => {
       screen.getByText(errorMessage)
@@ -141,7 +135,7 @@ describe('<ModalContentNewProjectForm />', function () {
     })
     fireEvent.click(createButton)
 
-    expect(newProjectMock.called()).to.be.true
+    expect(newProjectMock.callHistory.called()).to.be.true
 
     await waitFor(() => {
       screen.getByText(errorMessage)
diff --git a/services/web/test/frontend/features/project-list/components/notifications.test.tsx b/services/web/test/frontend/features/project-list/components/notifications.test.tsx
index 22927c2cf1..8813566a2e 100644
--- a/services/web/test/frontend/features/project-list/components/notifications.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/notifications.test.tsx
@@ -1,11 +1,10 @@
 import { expect } from 'chai'
-import sinon, { SinonStub } from 'sinon'
+import sinon from 'sinon'
 import {
   fireEvent,
   render,
   screen,
   waitForElementToBeRemoved,
-  within,
 } from '@testing-library/react'
 import fetchMock from 'fetch-mock'
 import { merge, cloneDeep } from 'lodash'
@@ -41,7 +40,7 @@ import { Project } from '../../../../../types/project/dashboard/api'
 import GroupsAndEnterpriseBanner from '../../../../../frontend/js/features/project-list/components/notifications/groups-and-enterprise-banner'
 import GroupSsoSetupSuccess from '../../../../../frontend/js/features/project-list/components/notifications/groups/group-sso-setup-success'
 import localStorage from '@/infrastructure/local-storage'
-import * as useLocationModule from '../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import {
   commonsSubscription,
   freeSubscription,
@@ -49,9 +48,10 @@ import {
   individualSubscription,
 } from '../fixtures/user-subscriptions'
 import getMeta from '@/utils/meta'
-import * as bootstrapUtils from '@/features/utils/bootstrap-5'
 
-const renderWithinProjectListProvider = (Component: React.ComponentType) => {
+const renderWithinProjectListProvider = (
+  Component: React.ComponentType<React.PropsWithChildren>
+) => {
   render(<Component />, {
     wrapper: ({ children }) => (
       <ProjectListProvider>
@@ -69,18 +69,8 @@ describe('<UserNotifications />', function () {
     appName: 'Overleaf',
   }
 
-  let isBootstrap5Stub: SinonStub
-
-  before(function () {
-    isBootstrap5Stub = sinon.stub(bootstrapUtils, 'isBootstrap5').returns(true)
-  })
-
-  after(function () {
-    isBootstrap5Stub.restore()
-  })
-
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
 
     // at least one project is required to show some notifications
     const projects = [{}] as Project[]
@@ -94,7 +84,7 @@ describe('<UserNotifications />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('<Common>', function () {
@@ -104,7 +94,7 @@ describe('<UserNotifications />', function () {
     })
 
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('accepts project invite', async function () {
@@ -117,14 +107,14 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
       const deleteMock = fetchMock.delete(
         `/notifications/${reconfiguredNotification._id}`,
         200
       )
       const acceptMock = fetchMock.post(
-        `project/${notificationProjectInvite.messageOpts.projectId}/invite/token/${notificationProjectInvite.messageOpts.token}/accept`,
+        `/project/${notificationProjectInvite.messageOpts.projectId}/invite/token/${notificationProjectInvite.messageOpts.token}/accept`,
         200
       )
 
@@ -145,11 +135,12 @@ describe('<UserNotifications />', function () {
         screen.getByRole('button', { name: /joining/i })
       )
 
-      expect(acceptMock.called()).to.be.true
-      screen.getByText(/joined/i)
+      expect(acceptMock.callHistory.called()).to.be.true
+      await screen.findByText(/joined/i)
+
       expect(screen.queryByRole('button', { name: /join project/i })).to.be.null
 
-      const openProject = screen.getByRole('button', { name: /open project/i })
+      const openProject = screen.getByRole('link', { name: /open project/i })
       expect(openProject.getAttribute('href')).to.equal(
         `/project/${notificationProjectInvite.messageOpts.projectId}`
       )
@@ -157,7 +148,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(deleteMock.called()).to.be.true
+      expect(deleteMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -171,9 +162,9 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.post(
-        `project/${notificationProjectInvite.messageOpts.projectId}/invite/token/${notificationProjectInvite.messageOpts.token}/accept`,
+        `/project/${notificationProjectInvite.messageOpts.projectId}/invite/token/${notificationProjectInvite.messageOpts.token}/accept`,
         500
       )
 
@@ -190,7 +181,7 @@ describe('<UserNotifications />', function () {
         screen.getByRole('button', { name: /joining/i })
       )
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       screen.getByRole('button', { name: /join project/i })
       expect(screen.queryByRole('button', { name: /open project/i })).to.be.null
     })
@@ -205,20 +196,20 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
       screen.getByText(/your free WFH2020 upgrade came to an end on/i)
 
-      const viewLink = screen.getByRole('button', { name: /view/i })
+      const viewLink = screen.getByRole('link', { name: /view/i })
       expect(viewLink.getAttribute('href')).to.equal(
         'https://www.overleaf.com/events/wfh2020'
       )
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -236,7 +227,7 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
@@ -250,14 +241,14 @@ describe('<UserNotifications />', function () {
       expect(findOutMore.getAttribute('href')).to.equal(
         'https://www.overleaf.com/learn/how-to/Institutional_Login'
       )
-      const linkAccount = screen.getByRole('button', { name: /link account/i })
+      const linkAccount = screen.getByRole('link', { name: /link account/i })
       expect(linkAccount.getAttribute('href')).to.equal(
         `${exposedSettings.samlInitPath}?university_id=${notificationIPMatchedAffiliation.messageOpts.institutionId}&auto=/project`
       )
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -275,7 +266,7 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
@@ -285,14 +276,14 @@ describe('<UserNotifications />', function () {
         /add an institutional email address to claim your features/i
       )
 
-      const addAffiliation = screen.getByRole('button', {
+      const addAffiliation = screen.getByRole('link', {
         name: /add affiliation/i,
       })
       expect(addAffiliation.getAttribute('href')).to.equal(`/user/settings`)
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -305,13 +296,13 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
       screen.getByRole('alert')
       screen.getByText(/file limit/i)
       screen.getByText(/You can't add more files to the project or sync it/i)
 
-      const accountSettings = screen.getByRole('button', {
+      const accountSettings = screen.getByRole('link', {
         name: /Open project/i,
       })
       expect(accountSettings.getAttribute('href')).to.equal('/project/123')
@@ -334,7 +325,7 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
@@ -348,7 +339,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -366,7 +357,7 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
@@ -382,7 +373,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -396,7 +387,7 @@ describe('<UserNotifications />', function () {
       ])
 
       renderWithinProjectListProvider(Common)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       fetchMock.delete(`/notifications/${reconfiguredNotification._id}`, 200)
 
       screen.getByRole('alert')
@@ -405,7 +396,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -425,7 +416,7 @@ describe('<UserNotifications />', function () {
           ])
 
           renderWithinProjectListProvider(Common)
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
           fetchMock.delete(`/notifications/${notificationGroupInvite._id}`, 200)
           screen.getByRole('alert')
           screen.getByText('inviter@overleaf.com')
@@ -450,12 +441,12 @@ describe('<UserNotifications />', function () {
               ),
             ])
             window.metaAttributesCache.set(
-              'ol-hasIndividualRecurlySubscription',
+              'ol-hasIndividualPaidSubscription',
               true
             )
 
             renderWithinProjectListProvider(Common)
-            await fetchMock.flush(true)
+            await fetchMock.callHistory.flush(true)
             fetchMock.delete(
               `/notifications/${notificationGroupInvite._id}`,
               200
@@ -476,11 +467,11 @@ describe('<UserNotifications />', function () {
   describe('<Institution>', function () {
     beforeEach(function () {
       Object.assign(getMeta('ol-ExposedSettings'), exposedSettings)
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('shows sso available', function () {
@@ -501,7 +492,7 @@ describe('<UserNotifications />', function () {
         '/learn/how-to/Institutional_Login'
       )
 
-      const action = screen.getByRole('button', { name: /link account/i })
+      const action = screen.getByRole('link', { name: /link account/i })
       expect(action.getAttribute('href')).to.equal(
         `${exposedSettings.samlInitPath}?university_id=${notificationsInstitution.institutionId}&auto=/project&email=${notificationsInstitution.email}`
       )
@@ -524,7 +515,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -548,7 +539,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -566,7 +557,7 @@ describe('<UserNotifications />', function () {
       screen.getByRole('alert')
       screen.getByText(/which is already registered with/i)
 
-      const action = screen.getByRole('button', { name: /find out more/i })
+      const action = screen.getByRole('link', { name: /find out more/i })
       expect(action.getAttribute('href')).to.equal(
         '/learn/how-to/Institutional_Login'
       )
@@ -574,7 +565,7 @@ describe('<UserNotifications />', function () {
       const closeBtn = screen.getByRole('button', { name: /close/i })
       fireEvent.click(closeBtn)
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       expect(screen.queryByRole('alert')).to.be.null
     })
 
@@ -623,8 +614,13 @@ describe('<UserNotifications />', function () {
         unconfirmedUserData,
         signUpDate
       )
+      const dateOptions: Intl.DateTimeFormatOptions = {
+        month: 'long',
+        day: 'numeric',
+        year: 'numeric',
+      }
       expect(emailDeletionDate).to.equal(
-        new Date('2025-09-03').toLocaleDateString()
+        new Date('2025-09-03').toLocaleDateString(undefined, dateOptions)
       )
     })
 
@@ -665,12 +661,10 @@ describe('<UserNotifications />', function () {
       window.metaAttributesCache.set('ol-user', {
         signUpDate: new Date('2024-01-01').toISOString(),
       })
-      this.clock = sinon.useFakeTimers(new Date('2025-07-01').getTime())
     })
 
     afterEach(function () {
-      fetchMock.reset()
-      this.clock.restore()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     function testUnconfirmedNotification(
@@ -681,31 +675,38 @@ describe('<UserNotifications />', function () {
         window.metaAttributesCache.set('ol-userEmails', userEmails)
 
         renderWithinProjectListProvider(ConfirmEmail)
-        await fetchMock.flush(true)
-        fetchMock.post('/user/emails/resend_confirmation', 200)
+        await fetchMock.callHistory.flush(true)
+        fetchMock.post('/user/emails/send-confirmation-code', 200)
 
         const email = userEmails[0].email
-        const notificationBody = screen.getByTestId('pro-notification-body')
+        const alert = await screen.findByRole('alert')
 
         if (isPrimary) {
-          expect(notificationBody.textContent).to.contain(
-            `Please confirm your primary email address ${email} by clicking on the link in the confirmation email.`
+          expect(alert.textContent).to.contain(
+            `Please confirm your primary email address ${email}. To edit it, go to `
           )
         } else {
-          expect(notificationBody.textContent).to.contain(
-            `Please confirm your secondary email address ${email} by clicking on the link in the confirmation email.`
+          expect(alert.textContent).to.contain(
+            `Please confirm your secondary email address ${email}. To edit it, go to `
           )
         }
 
-        const resendButton = screen.getByRole('button', { name: /resend/i })
-        fireEvent.click(resendButton)
+        expect(
+          screen
+            .getByRole('button', { name: 'Send confirmation code' })
+            .classList.contains('button-loading')
+        ).to.be.false
 
-        await waitForElementToBeRemoved(() =>
-          screen.getByRole('button', { name: /resend/i })
-        )
+        expect(screen.queryByRole('dialog')).to.be.null
 
-        expect(fetchMock.called()).to.be.true
-        expect(screen.queryByRole('alert')).to.be.null
+        const sendCodeButton = await screen.findByRole('button', {
+          name: 'Send confirmation code',
+        })
+        fireEvent.click(sendCodeButton)
+
+        await screen.findByRole('dialog')
+
+        expect(fetchMock.callHistory.called()).to.be.true
       })
     }
 
@@ -723,47 +724,41 @@ describe('<UserNotifications />', function () {
       window.metaAttributesCache.set('ol-userEmails', [untrustedUserData])
 
       renderWithinProjectListProvider(ConfirmEmail)
-      await fetchMock.flush(true)
-      fetchMock.post('/user/emails/resend_confirmation', 200)
+      await fetchMock.callHistory.flush(true)
+      fetchMock.post('/user/emails/send-confirmation-code', 200)
 
       const email = untrustedUserData.email
-      const notificationBody = screen.getByTestId(
-        'not-trusted-notification-body'
-      )
-      expect(notificationBody.textContent).to.contain(
+      const alert = await screen.findByRole('alert')
+      expect(alert.textContent).to.contain(
         `To enhance the security of your Overleaf account, please reconfirm your secondary email address ${email}.`
       )
 
-      const resendButton = screen.getByRole('button', { name: /resend/i })
+      const resendButton = screen.getByRole('button', {
+        name: 'Send confirmation code',
+      })
       fireEvent.click(resendButton)
 
-      await waitForElementToBeRemoved(() =>
-        screen.getByRole('button', { name: /resend/i })
-      )
+      await screen.findByRole('dialog')
 
-      expect(fetchMock.called()).to.be.true
-      expect(screen.queryByRole('alert')).to.be.null
+      expect(fetchMock.callHistory.called()).to.be.true
     })
 
     it('fails to send', async function () {
       window.metaAttributesCache.set('ol-userEmails', [unconfirmedUserData])
 
       renderWithinProjectListProvider(ConfirmEmail)
-      await fetchMock.flush(true)
-      fetchMock.post('/user/emails/resend_confirmation', 500)
+      await fetchMock.callHistory.flush(true)
+      fetchMock.post('/user/emails/send-confirmation-code', 500)
 
-      const resendButtons = screen.getAllByRole('button', { name: /resend/i })
+      const resendButtons = await screen.findAllByRole('button', {
+        name: 'Send confirmation code',
+      })
       const resendButton = resendButtons[0]
       fireEvent.click(resendButton)
-      const notificationBody = screen.getByTestId('pro-notification-body')
 
-      await waitForElementToBeRemoved(() =>
-        within(notificationBody).getByTestId(
-          'loading-resending-confirmation-email'
-        )
-      )
+      await screen.findByRole('dialog')
 
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       screen.getByText(/something went wrong/i)
     })
 
@@ -775,15 +770,14 @@ describe('<UserNotifications />', function () {
         window.metaAttributesCache.set('ol-usersBestSubscription', subscription)
 
         renderWithinProjectListProvider(ConfirmEmail)
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
-        const alert = screen.getByRole('alert')
+        const alert = await screen.findByRole('alert')
         const email = unconfirmedCommonsUserData.email
-        const notificationBody = within(alert).getByTestId('notification-body')
-        expect(notificationBody.textContent).to.contain(
+        expect(alert.textContent).to.contain(
           'You are one step away from accessing Overleaf Professional features'
         )
-        expect(notificationBody.textContent).to.contain(
+        expect(alert.textContent).to.contain(
           `Overleaf has an Overleaf subscription. Click the confirmation link sent to ${email} to upgrade to Overleaf Professional`
         )
       })
@@ -796,21 +790,18 @@ describe('<UserNotifications />', function () {
         window.metaAttributesCache.set('ol-usersBestSubscription', subscription)
 
         renderWithinProjectListProvider(ConfirmEmail)
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
-        const alert = screen.getByRole('alert')
+        const alert = await screen.findByRole('alert')
         const email = unconfirmedCommonsUserData.email
-        const notificationBody = within(alert).getByTestId(
-          'pro-notification-body'
-        )
         const isPrimary = unconfirmedCommonsUserData.default
         if (isPrimary) {
-          expect(notificationBody.textContent).to.contain(
-            `Please confirm your primary email address ${email} by clicking on the link in the confirmation email`
+          expect(alert.textContent).to.contain(
+            `Please confirm your primary email address ${email}.`
           )
         } else {
-          expect(notificationBody.textContent).to.contain(
-            `Please confirm your secondary email address ${email} by clicking on the link in the confirmation email`
+          expect(alert.textContent).to.contain(
+            `Please confirm your secondary email address ${email}.`
           )
         }
       })
@@ -818,23 +809,16 @@ describe('<UserNotifications />', function () {
   })
 
   describe('<Affiliation/>', function () {
-    let assignStub: sinon.SinonStub
-
     beforeEach(function () {
       Object.assign(getMeta('ol-ExposedSettings'), exposedSettings)
-      assignStub = sinon.stub()
-      this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-        assign: assignStub,
-        replace: sinon.stub(),
-        reload: sinon.stub(),
-        setHash: sinon.stub(),
-      })
-      fetchMock.reset()
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
+      fetchMock.removeRoutes().clearHistory()
     })
 
     afterEach(function () {
-      this.locationStub.restore()
-      fetchMock.reset()
+      this.locationWrapperSandbox.restore()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('shows reconfirm message with SSO disabled', async function () {
@@ -871,12 +855,12 @@ describe('<UserNotifications />', function () {
         .be.null
       expect(screen.queryByRole('link', { name: /remove it/i })).to.be.null
       expect(screen.queryByRole('link', { name: /learn more/i })).to.be.null
-      expect(sendReconfirmationMock.called()).to.be.true
+      expect(sendReconfirmationMock.callHistory.called()).to.be.true
       fireEvent.click(
         screen.getByRole('button', { name: /resend confirmation email/i })
       )
       await waitForElementToBeRemoved(() => screen.getByText('Sending…'))
-      expect(sendReconfirmationMock.calls()).to.have.lengthOf(2)
+      expect(sendReconfirmationMock.callHistory.calls()).to.have.lengthOf(2)
     })
 
     it('shows reconfirm message with SSO enabled', async function () {
@@ -889,9 +873,9 @@ describe('<UserNotifications />', function () {
       fireEvent.click(
         screen.getByRole('button', { name: /confirm affiliation/i })
       )
-      sinon.assert.calledOnce(assignStub)
+      sinon.assert.calledOnce(this.locationWrapperStub.assign)
       sinon.assert.calledWithMatch(
-        assignStub,
+        this.locationWrapperStub.assign,
         `${exposedSettings.samlInitPath}?university_id=${professionalUserData.affiliation.institution.id}&reconfirm=/project`
       )
     })
@@ -916,7 +900,7 @@ describe('<UserNotifications />', function () {
   describe('<GroupsAndEnterpriseBanner />', function () {
     beforeEach(function () {
       localStorage.clear()
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
 
       // at least one project is required to show some notifications
       const projects = [{}] as Project[]
@@ -935,16 +919,16 @@ describe('<UserNotifications />', function () {
     })
 
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('does not show the banner for users that are in group or are affiliated', async function () {
       window.metaAttributesCache.set('ol-showGroupsAndEnterpriseBanner', false)
 
       renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
-      expect(screen.queryByRole('button', { name: 'Contact Sales' })).to.be.null
+      expect(screen.queryByRole('link', { name: 'Contact sales' })).to.be.null
     })
 
     it('shows the banner for users that have dismissed the previous banners', async function () {
@@ -952,10 +936,9 @@ describe('<UserNotifications />', function () {
       localStorage.setItem('has_dismissed_groups_and_enterprise_banner', true)
 
       renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
-      expect(screen.queryByRole('button', { name: 'Contact Sales' })).to.not.be
-        .null
+      await screen.findByRole('link', { name: 'Contact sales' })
     })
 
     it('shows the banner for users that have dismissed the banner more than 30 days ago', async function () {
@@ -968,10 +951,9 @@ describe('<UserNotifications />', function () {
       )
 
       renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
-      expect(screen.queryByRole('button', { name: 'Contact Sales' })).to.not.be
-        .null
+      await screen.findByRole('link', { name: 'Contact sales' })
     })
 
     it('does not show the banner for users that have dismissed the banner within the last 30 days', async function () {
@@ -984,15 +966,15 @@ describe('<UserNotifications />', function () {
       )
 
       renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
 
-      expect(screen.queryByRole('button', { name: 'Contact Sales' })).to.be.null
+      expect(screen.queryByRole('link', { name: 'Contact sales' })).to.be.null
     })
 
     describe('users that are not in group and are not affiliated', function () {
       beforeEach(function () {
         localStorage.clear()
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
 
         // at least one project is required to show some notifications
         const projects = [{}] as Project[]
@@ -1008,7 +990,7 @@ describe('<UserNotifications />', function () {
       })
 
       afterEach(function () {
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
       })
 
       after(function () {
@@ -1022,12 +1004,12 @@ describe('<UserNotifications />', function () {
         )
 
         renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
-        screen.getByText(
+        await screen.findByText(
           'Overleaf On-Premises: Does your company want to keep its data within its firewall? Overleaf offers Server Pro, an on-premises solution for companies. Get in touch to learn more.'
         )
-        const link = screen.getByRole('button', { name: 'Contact Sales' })
+        const link = screen.getByRole('link', { name: 'Contact sales' })
 
         expect(link.getAttribute('href')).to.equal(`/for/contact-sales-2`)
       })
@@ -1039,12 +1021,12 @@ describe('<UserNotifications />', function () {
         )
 
         renderWithinProjectListProvider(GroupsAndEnterpriseBanner)
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
-        screen.getByText(
+        await screen.findByText(
           'Why do Fortune 500 companies and top research institutions trust Overleaf to streamline their collaboration? Get in touch to learn more.'
         )
-        const link = screen.getByRole('button', { name: 'Contact Sales' })
+        const link = screen.getByRole('link', { name: 'Contact sales' })
 
         expect(link.getAttribute('href')).to.equal(`/for/contact-sales-4`)
       })
diff --git a/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx b/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx
index 3145280f63..f6068f106b 100644
--- a/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/project-list-root.test.tsx
@@ -19,7 +19,7 @@ import {
   archiveableProject,
   copyableProject,
 } from '../fixtures/projects-data'
-import * as useLocationModule from '../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import getMeta from '@/utils/meta'
 
 const {
@@ -37,7 +37,6 @@ describe('<ProjectListRoot />', function () {
   this.timeout('10s')
 
   let sendMBSpy: sinon.SinonSpy
-  let assignStub: sinon.SinonStub
 
   beforeEach(async function () {
     global.localStorage.clear()
@@ -68,19 +67,14 @@ describe('<ProjectListRoot />', function () {
     window.metaAttributesCache.set('ol-navbar', {
       items: [],
     })
-    assignStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-      setHash: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
   })
 
   afterEach(function () {
     sendMBSpy.restore()
-    fetchMock.reset()
-    this.locationStub.restore()
+    fetchMock.removeRoutes().clearHistory()
+    this.locationWrapperSandbox.restore()
   })
 
   describe('welcome page', function () {
@@ -88,11 +82,11 @@ describe('<ProjectListRoot />', function () {
       renderWithProjectListContext(<ProjectListRoot />, {
         projects: [],
       })
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
     })
 
     it('the welcome page is displayed', async function () {
-      screen.getByRole('heading', { name: 'Welcome to Overleaf' })
+      await screen.findByRole('heading', { name: 'Welcome to Overleaf' })
     })
 
     it('the email confirmation alert is not displayed', async function () {
@@ -110,7 +104,7 @@ describe('<ProjectListRoot />', function () {
         projects: fullList,
       })
       this.unmount = unmount
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       await screen.findByRole('table')
     })
 
@@ -136,6 +130,7 @@ describe('<ProjectListRoot />', function () {
             within(actionsToolbar).getByLabelText('Download')
           fireEvent.click(downloadButton)
 
+          const assignStub = this.locationWrapperStub.assign
           await waitFor(() => {
             expect(assignStub).to.have.been.called
           })
@@ -172,13 +167,17 @@ describe('<ProjectListRoot />', function () {
           await waitFor(
             () =>
               expect(
-                archiveProjectMock.called(`/project/${project1Id}/archive`)
+                archiveProjectMock.callHistory.called(
+                  `/project/${project1Id}/archive`
+                )
               ).to.be.true
           )
           await waitFor(
             () =>
               expect(
-                archiveProjectMock.called(`/project/${project2Id}/archive`)
+                archiveProjectMock.callHistory.called(
+                  `/project/${project2Id}/archive`
+                )
               ).to.be.true
           )
         })
@@ -203,13 +202,19 @@ describe('<ProjectListRoot />', function () {
 
           await waitFor(
             () =>
-              expect(trashProjectMock.called(`/project/${project1Id}/trash`)).to
-                .be.true
+              expect(
+                trashProjectMock.callHistory.called(
+                  `/project/${project1Id}/trash`
+                )
+              ).to.be.true
           )
           await waitFor(
             () =>
-              expect(trashProjectMock.called(`/project/${project2Id}/trash`)).to
-                .be.true
+              expect(
+                trashProjectMock.callHistory.called(
+                  `/project/${project2Id}/trash`
+                )
+              ).to.be.true
           )
         })
 
@@ -255,7 +260,7 @@ describe('<ProjectListRoot />', function () {
 
       describe('archived projects', function () {
         beforeEach(function () {
-          const filterButton = screen.getAllByText('Archived Projects')[0]
+          const filterButton = screen.getAllByText('Archived projects')[0]
           fireEvent.click(filterButton)
 
           allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
@@ -281,8 +286,7 @@ describe('<ProjectListRoot />', function () {
           })
           fireEvent.click(unarchiveButton)
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
           await screen.findByText('No projects')
         })
@@ -296,8 +300,7 @@ describe('<ProjectListRoot />', function () {
             archivedProjects.length - 1
           )
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
           expect(screen.queryByText('No projects')).to.be.null
         })
@@ -305,7 +308,7 @@ describe('<ProjectListRoot />', function () {
 
       describe('trashed projects', function () {
         beforeEach(function () {
-          const filterButton = screen.getAllByText('Trashed Projects')[0]
+          const filterButton = screen.getAllByText('Trashed projects')[0]
           fireEvent.click(filterButton)
 
           allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
@@ -330,7 +333,7 @@ describe('<ProjectListRoot />', function () {
         })
 
         it('clears selected projects when filter changed', function () {
-          const filterButton = screen.getAllByText('All Projects')[0]
+          const filterButton = screen.getAllByText('All projects')[0]
           fireEvent.click(filterButton)
 
           const allCheckboxes =
@@ -348,8 +351,7 @@ describe('<ProjectListRoot />', function () {
             within(actionsToolbar).getByText<HTMLButtonElement>('Restore')
           fireEvent.click(untrashButton)
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
           await screen.findByText('No projects')
         })
@@ -361,8 +363,7 @@ describe('<ProjectListRoot />', function () {
           const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
           expect(allCheckboxesChecked.length).to.equal(trashedList.length - 1)
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
           expect(screen.queryByText('No projects')).to.be.null
         })
@@ -386,26 +387,27 @@ describe('<ProjectListRoot />', function () {
           fireEvent.click(confirmButton)
           expect(confirmButton.disabled).to.be.true
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
-          const calls = fetchMock.calls().map(([url]) => url)
+          const calls = fetchMock.callHistory.calls().map(({ url }) => url)
 
           trashedList.forEach(project => {
-            expect(calls).to.contain(`/project/${project.id}/archive`)
+            expect(calls).to.contain(
+              `https://www.test-overleaf.com/project/${project.id}/archive`
+            )
           })
         })
 
         it('removes only selected projects from view when leaving', async function () {
           // rerender content with different projects
           this.unmount()
-          fetchMock.restore()
+          fetchMock.removeRoutes().clearHistory()
 
           renderWithProjectListContext(<ProjectListRoot />, {
             projects: leavableList,
           })
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
           await screen.findByRole('table')
 
           expect(leavableList.length).to.be.greaterThan(0)
@@ -418,12 +420,15 @@ describe('<ProjectListRoot />', function () {
             { repeat: leavableList.length }
           )
 
-          allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
           // + 1 because of select all
-          expect(allCheckboxes.length).to.equal(leavableList.length + 1)
+          await waitFor(() =>
+            expect(
+              screen.getAllByRole<HTMLInputElement>('checkbox').length
+            ).to.equal(leavableList.length + 1)
+          )
 
           // first one is the select all checkbox
-          fireEvent.click(allCheckboxes[0])
+          fireEvent.click(screen.getAllByRole('checkbox')[0])
 
           actionsToolbar = screen.getAllByRole('toolbar')[0]
 
@@ -446,25 +451,26 @@ describe('<ProjectListRoot />', function () {
           fireEvent.click(confirmButton)
           expect(confirmButton.disabled).to.be.true
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
-          const calls = fetchMock.calls().map(([url]) => url)
+          const calls = fetchMock.callHistory.calls().map(({ url }) => url)
           leavableList.forEach(project => {
-            expect(calls).to.contain(`/project/${project.id}/leave`)
+            expect(calls).to.contain(
+              `https://www.test-overleaf.com/project/${project.id}/leave`
+            )
           })
         })
 
         it('removes only selected projects from view when deleting', async function () {
           // rerender content with different projects
           this.unmount()
-          fetchMock.restore()
+          fetchMock.removeRoutes().clearHistory()
 
           renderWithProjectListContext(<ProjectListRoot />, {
             projects: deletableList,
           })
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
           await screen.findByRole('table')
 
           expect(deletableList.length).to.be.greaterThan(0)
@@ -477,9 +483,11 @@ describe('<ProjectListRoot />', function () {
             { repeat: deletableList.length }
           )
 
-          allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
-          // + 1 because of select all
-          expect(allCheckboxes.length).to.equal(deletableList.length + 1)
+          await waitFor(() => {
+            allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
+            // + 1 because of select all
+            expect(allCheckboxes.length).to.equal(deletableList.length + 1)
+          })
 
           // first one is the select all checkbox
           fireEvent.click(allCheckboxes[0])
@@ -505,19 +513,20 @@ describe('<ProjectListRoot />', function () {
           fireEvent.click(confirmButton)
           expect(confirmButton.disabled).to.be.true
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
-          const calls = fetchMock.calls().map(([url]) => url)
+          const calls = fetchMock.callHistory.calls().map(({ url }) => url)
           deletableList.forEach(project => {
-            expect(calls).to.contain(`/project/${project.id}`)
+            expect(calls).to.contain(
+              `https://www.test-overleaf.com/project/${project.id}`
+            )
           })
         })
 
         it('removes only selected projects from view when deleting and leaving', async function () {
           // rerender content with different projects
           this.unmount()
-          fetchMock.restore()
+          fetchMock.removeRoutes().clearHistory()
 
           const deletableAndLeavableList = [...deletableList, ...leavableList]
 
@@ -525,7 +534,7 @@ describe('<ProjectListRoot />', function () {
             projects: deletableAndLeavableList,
           })
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
           await screen.findByRole('table')
 
           expect(deletableList.length).to.be.greaterThan(0)
@@ -547,14 +556,15 @@ describe('<ProjectListRoot />', function () {
               { repeat: leavableList.length }
             )
 
-          allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
           // + 1 because of select all
-          expect(allCheckboxes.length).to.equal(
-            deletableAndLeavableList.length + 1
+          await waitFor(() =>
+            expect(
+              screen.getAllByRole<HTMLInputElement>('checkbox').length
+            ).to.equal(deletableAndLeavableList.length + 1)
           )
 
           // first one is the select all checkbox
-          fireEvent.click(allCheckboxes[0])
+          fireEvent.click(screen.getAllByRole<HTMLInputElement>('checkbox')[0])
 
           actionsToolbar = screen.getAllByRole('toolbar')[0]
 
@@ -573,14 +583,13 @@ describe('<ProjectListRoot />', function () {
           fireEvent.click(confirmButton)
           expect(confirmButton.disabled).to.be.true
 
-          await fetchMock.flush(true)
-          expect(fetchMock.done()).to.be.true
+          await fetchMock.callHistory.flush(true)
 
-          const calls = fetchMock.calls().map(([url]) => url)
+          const calls = fetchMock.callHistory.calls().map(({ url }) => url)
           deletableAndLeavableList.forEach(project => {
             expect(calls).to.contain.oneOf([
-              `/project/${project.id}`,
-              `/project/${project.id}/leave`,
+              `https://www.test-overleaf.com/project/${project.id}`,
+              `https://www.test-overleaf.com/project/${project.id}/leave`,
             ])
           })
         })
@@ -589,7 +598,7 @@ describe('<ProjectListRoot />', function () {
       describe('tags', function () {
         it('does not show archived or trashed project', async function () {
           this.unmount()
-          fetchMock.restore()
+          fetchMock.removeRoutes().clearHistory()
           window.metaAttributesCache.set('ol-tags', [
             {
               _id: this.tagId,
@@ -642,14 +651,16 @@ describe('<ProjectListRoot />', function () {
             )
             await waitFor(() => {
               expect(
-                trashProjectMock.called(
+                trashProjectMock.callHistory.called(
                   `/project/${projectsData[index].id}/trash`
                 )
               ).to.be.true
             })
-            expect(
-              screen.queryAllByText(projectsData[index].name)
-            ).to.have.length(0)
+            await waitFor(() => {
+              expect(
+                screen.queryAllByText(projectsData[index].name)
+              ).to.have.length(0)
+            })
 
             screen.getAllByRole('button', {
               name: `${this.tagName} (${--visibleProjectsCount})`,
@@ -683,13 +694,15 @@ describe('<ProjectListRoot />', function () {
             status: 204,
           })
 
-          await waitFor(() => {
-            const tagsDropdown = within(actionsToolbar).getByLabelText('Tags')
-            fireEvent.click(tagsDropdown)
-          })
+          const tagsDropdown =
+            await within(actionsToolbar).findByLabelText('Tags')
+          fireEvent.click(tagsDropdown)
           screen.getByText('Add to tag')
 
-          const newTagButton = screen.getByText('Create new tag')
+          const newTagButton = screen.getByRole('menuitem', {
+            name: 'Create new tag',
+          })
+
           fireEvent.click(newTagButton)
 
           const modal = screen.getAllByRole('dialog')[0]
@@ -702,18 +715,24 @@ describe('<ProjectListRoot />', function () {
           })
           fireEvent.click(createButton)
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
 
-          expect(fetchMock.called('/tag', { name: this.newTagName })).to.be.true
           expect(
-            fetchMock.called(`/tag/${this.newTagId}/projects`, {
+            fetchMock.callHistory.called('/tag', { name: this.newTagName })
+          ).to.be.true
+          expect(
+            fetchMock.callHistory.called(`/tag/${this.newTagId}/projects`, {
               body: {
                 projectIds: [projectsData[0].id, projectsData[1].id],
               },
             })
           ).to.be.true
 
-          screen.getByRole('button', { name: `${this.newTagName} (2)` })
+          await screen.findByRole(
+            'button',
+            { name: `${this.newTagName} (2)` },
+            { timeout: 5000 }
+          )
         })
 
         it('opens the tags dropdown and remove a tag from selected projects', async function () {
@@ -734,10 +753,10 @@ describe('<ProjectListRoot />', function () {
           )
           fireEvent.click(tagButton)
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
 
           expect(
-            deleteProjectsFromTagMock.called(
+            deleteProjectsFromTagMock.callHistory.called(
               `/tag/${this.tagId}/projects/remove`,
               {
                 body: {
@@ -770,14 +789,17 @@ describe('<ProjectListRoot />', function () {
           )
           fireEvent.click(tagButton)
 
-          await fetchMock.flush(true)
+          await fetchMock.callHistory.flush(true)
 
           expect(
-            addProjectsToTagMock.called(`/tag/${this.tagId}/projects`, {
-              body: {
-                projectIds: [projectsData[2].id],
-              },
-            })
+            addProjectsToTagMock.callHistory.called(
+              `/tag/${this.tagId}/projects`,
+              {
+                body: {
+                  projectIds: [projectsData[2].id],
+                },
+              }
+            )
           ).to.be.true
           screen.getByRole('button', { name: `${this.tagName} (3)` })
         })
@@ -821,7 +843,7 @@ describe('<ProjectListRoot />', function () {
 
         describe('"More" dropdown', function () {
           beforeEach(async function () {
-            const filterButton = screen.getAllByText('All Projects')[0]
+            const filterButton = screen.getAllByText('All projects')[0]
             fireEvent.click(filterButton)
             allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
           })
@@ -853,7 +875,7 @@ describe('<ProjectListRoot />', function () {
             const modals = await screen.findAllByRole('dialog')
             const modal = modals[0]
 
-            expect(sendMBSpy).to.have.been.calledTwice
+            expect(sendMBSpy).to.have.been.calledThrice
             expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash')
             expect(sendMBSpy).to.have.been.calledWith(
               'project-list-page-interaction',
@@ -919,14 +941,16 @@ describe('<ProjectListRoot />', function () {
             expect(confirmButton.disabled).to.be.false
             fireEvent.click(confirmButton)
 
-            await fetchMock.flush(true)
+            await fetchMock.callHistory.flush(true)
 
             expect(
-              renameProjectMock.called(`/project/${projectsData[0].id}/rename`)
+              renameProjectMock.callHistory.called(
+                `/project/${projectsData[0].id}/rename`
+              )
             ).to.be.true
 
             const table = await screen.findByRole('table')
-            within(table).getByText(newProjectName)
+            await within(table).findByText(newProjectName)
             expect(within(table).queryByText(oldName)).to.be.null
 
             const allCheckboxesInTable =
@@ -982,13 +1006,15 @@ describe('<ProjectListRoot />', function () {
             ) as HTMLElement
             fireEvent.click(copyConfirmButton)
 
-            await fetchMock.flush(true)
+            await fetchMock.callHistory.flush(true)
 
             expect(
-              cloneProjectMock.called(`/project/${projectsData[1].id}/clone`)
+              cloneProjectMock.callHistory.called(
+                `/project/${projectsData[1].id}/clone`
+              )
             ).to.be.true
 
-            expect(sendMBSpy).to.have.been.calledTwice
+            expect(sendMBSpy).to.have.been.calledThrice
             expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash')
             expect(sendMBSpy).to.have.been.calledWith(
               'project-list-page-interaction',
@@ -1000,7 +1026,7 @@ describe('<ProjectListRoot />', function () {
               }
             )
 
-            screen.getByText(copiedProjectName)
+            await screen.findByText(copiedProjectName)
           })
         })
       })
@@ -1048,6 +1074,8 @@ describe('<ProjectListRoot />', function () {
         }
 
         beforeEach(function () {
+          fetchMock.removeRoutes().clearHistory()
+
           allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
           // first one is the select all checkbox, just check 2 at first
           fireEvent.click(allCheckboxes[1])
@@ -1149,10 +1177,9 @@ describe('<ProjectListRoot />', function () {
         ) as HTMLElement
         fireEvent.click(copyConfirmButton)
 
-        await fetchMock.flush(true)
-        expect(fetchMock.done()).to.be.true
+        await fetchMock.callHistory.flush(true)
 
-        expect(sendMBSpy).to.have.been.calledTwice
+        expect(sendMBSpy).to.have.been.calledThrice
         expect(sendMBSpy).to.have.been.calledWith('loads_v2_dash')
         expect(sendMBSpy).to.have.been.calledWith(
           'project-list-page-interaction',
@@ -1166,7 +1193,7 @@ describe('<ProjectListRoot />', function () {
 
         expect(screen.queryByText(copiedProjectName)).to.be.null
 
-        const yourProjectFilter = screen.getAllByText('Your Projects')[0]
+        const yourProjectFilter = screen.getAllByText('Your projects')[0]
         fireEvent.click(yourProjectFilter)
         await screen.findByText(copiedProjectName)
       })
diff --git a/services/web/test/frontend/features/project-list/components/project-list-title.tsx b/services/web/test/frontend/features/project-list/components/project-list-title.tsx
index e69cea0151..8e34c6ca0e 100644
--- a/services/web/test/frontend/features/project-list/components/project-list-title.tsx
+++ b/services/web/test/frontend/features/project-list/components/project-list-title.tsx
@@ -4,9 +4,6 @@ import { Tag } from '../../../../../app/src/Features/Tags/types'
 import ProjectListTitle from '../../../../../frontend/js/features/project-list/components/title/project-list-title'
 
 describe('<ProjectListTitle />', function () {
-  beforeEach(function () {
-    window.metaAttributesCache.set('ol-bootstrapVersion', 5)
-  })
   type TestCase = {
     filter: Filter
     selectedTag: Tag | undefined
diff --git a/services/web/test/frontend/features/project-list/components/project-search.test.tsx b/services/web/test/frontend/features/project-list/components/project-search.test.tsx
index f8c482740b..06820a38ca 100644
--- a/services/web/test/frontend/features/project-list/components/project-search.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/project-search.test.tsx
@@ -12,11 +12,11 @@ describe('Project list search form', function () {
 
   beforeEach(function () {
     sendMBSpy = sinon.spy(eventTracking, 'sendMB')
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
     sendMBSpy.restore()
   })
 
diff --git a/services/web/test/frontend/features/project-list/components/sidebar/add-affiliation.test.tsx b/services/web/test/frontend/features/project-list/components/sidebar/add-affiliation.test.tsx
index cfedf93978..0d2d39890b 100644
--- a/services/web/test/frontend/features/project-list/components/sidebar/add-affiliation.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/sidebar/add-affiliation.test.tsx
@@ -14,11 +14,11 @@ describe('Add affiliation widget', function () {
   }
 
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders the component', async function () {
@@ -27,11 +27,13 @@ describe('Add affiliation widget', function () {
 
     renderWithProjectListContext(<AddAffiliation />)
 
-    await fetchMock.flush(true)
-    await waitFor(() => expect(fetchMock.called('/api/project')))
+    await fetchMock.callHistory.flush(true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called('/api/project')).to.be.true
+    )
 
-    screen.getByText(/are you affiliated with an institution/i)
-    const addAffiliationLink = screen.getByRole('button', {
+    await screen.findByText(/are you affiliated with an institution/i)
+    const addAffiliationLink = screen.getByRole('link', {
       name: /add affiliation/i,
     })
     expect(addAffiliationLink.getAttribute('href')).to.equal('/user/settings')
@@ -43,8 +45,10 @@ describe('Add affiliation widget', function () {
 
     renderWithProjectListContext(<AddAffiliation />)
 
-    await fetchMock.flush(true)
-    await waitFor(() => expect(fetchMock.called('/api/project')))
+    await fetchMock.callHistory.flush(true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called('/api/project')).to.be.true
+    )
 
     validateNonExistence()
   })
@@ -57,8 +61,10 @@ describe('Add affiliation widget', function () {
       projects: [],
     })
 
-    await fetchMock.flush(true)
-    await waitFor(() => expect(fetchMock.called('/api/project')))
+    await fetchMock.callHistory.flush(true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called('/api/project')).to.be.true
+    )
 
     validateNonExistence()
   })
@@ -69,8 +75,10 @@ describe('Add affiliation widget', function () {
 
     renderWithProjectListContext(<AddAffiliation />)
 
-    await fetchMock.flush(true)
-    await waitFor(() => expect(fetchMock.called('/api/project')))
+    await fetchMock.callHistory.flush(true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called('/api/project')).to.be.true
+    )
 
     validateNonExistence()
   })
diff --git a/services/web/test/frontend/features/project-list/components/sidebar/tags-list.test.tsx b/services/web/test/frontend/features/project-list/components/sidebar/tags-list.test.tsx
index 1543e2e90d..2b721e373a 100644
--- a/services/web/test/frontend/features/project-list/components/sidebar/tags-list.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/sidebar/tags-list.test.tsx
@@ -24,37 +24,39 @@ describe('<TagsList />', function () {
 
     fetchMock.post('/tag', {
       _id: 'eee888eee888',
-      name: 'New Tag',
+      name: 'New tag',
       project_ids: [],
     })
     fetchMock.post('express:/tag/:tagId/projects', 200)
     fetchMock.post('express:/tag/:tagId/edit', 200)
-    fetchMock.delete('express:/tag/:tagId', 200)
+    fetchMock.delete('express:/tag/:tagId', 200, { name: 'delete tag' })
 
     renderWithProjectListContext(<TagsList />)
 
-    await fetchMock.flush(true)
-    await waitFor(() => expect(fetchMock.called('/api/project')))
+    await fetchMock.callHistory.flush(true)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called('/api/project')).to.be.true
+    )
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
-  it('displays the tags list', function () {
-    const header = screen.getByTestId('organize-projects')
+  it('displays the tags list', async function () {
+    const header = await screen.findByTestId('organize-projects')
     expect(header.textContent).to.equal('Organize Tags')
 
-    screen.getByRole('button', {
-      name: 'New Tag',
+    await screen.findByRole('button', {
+      name: 'New tag',
     })
-    screen.getByRole('button', {
+    await screen.findByRole('button', {
       name: 'Tag 1 (1)',
     })
-    screen.getByRole('button', {
+    await screen.findByRole('button', {
       name: 'Another tag (2)',
     })
-    screen.getByRole('button', {
+    await screen.findByRole('button', {
       name: 'Uncategorized (3)',
     })
   })
@@ -63,7 +65,7 @@ describe('<TagsList />', function () {
     const tag1Button = screen.getByText('Tag 1')
     assert.isFalse(tag1Button.closest('li')?.classList.contains('active'))
 
-    await fireEvent.click(tag1Button)
+    fireEvent.click(tag1Button)
     assert.isTrue(tag1Button.closest('li')?.classList.contains('active'))
   })
 
@@ -82,10 +84,10 @@ describe('<TagsList />', function () {
   describe('Create modal', function () {
     beforeEach(async function () {
       const newTagButton = screen.getByRole('button', {
-        name: 'New Tag',
+        name: 'New tag',
       })
 
-      await fireEvent.click(newTagButton)
+      fireEvent.click(newTagButton)
     })
 
     it('modal is open', async function () {
@@ -97,7 +99,7 @@ describe('<TagsList />', function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const cancelButton = within(modal).getByRole('button', { name: 'Cancel' })
 
-      await fireEvent.click(cancelButton)
+      fireEvent.click(cancelButton)
       expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
     })
 
@@ -139,19 +141,23 @@ describe('<TagsList />', function () {
     it('filling the input and clicking Create sends a request', async function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const input = within(modal).getByRole('textbox')
-      fireEvent.change(input, { target: { value: 'New Tag' } })
+      fireEvent.change(input, { target: { value: 'New tag' } })
 
       const createButton = within(modal).getByRole('button', { name: 'Create' })
       expect(createButton.hasAttribute('disabled')).to.be.false
 
-      await fireEvent.click(createButton)
+      fireEvent.click(createButton)
 
-      await waitFor(() => expect(fetchMock.called(`/tag`)).to.be.true)
+      await waitFor(
+        () => expect(fetchMock.callHistory.called(`/tag`)).to.be.true
+      )
 
-      expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      await waitFor(
+        () => expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      )
 
       screen.getByRole('button', {
-        name: 'New Tag (0)',
+        name: 'New tag (0)',
       })
     })
   })
@@ -162,9 +168,9 @@ describe('<TagsList />', function () {
       const dropdownToggle = within(
         tag1Button.closest('li') as HTMLElement
       ).getByTestId('tag-dropdown-toggle')
-      await fireEvent.click(dropdownToggle)
+      fireEvent.click(dropdownToggle)
       const editMenuItem = await screen.findByRole('menuitem', { name: 'Edit' })
-      await fireEvent.click(editMenuItem)
+      fireEvent.click(editMenuItem)
     })
 
     it('modal is open', async function () {
@@ -176,7 +182,7 @@ describe('<TagsList />', function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const cancelButton = within(modal).getByRole('button', { name: 'Cancel' })
 
-      await fireEvent.click(cancelButton)
+      fireEvent.click(cancelButton)
       expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
     })
 
@@ -230,19 +236,25 @@ describe('<TagsList />', function () {
     it('filling the input and clicking Save sends a request', async function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const input = within(modal).getByRole('textbox')
-      fireEvent.change(input, { target: { value: 'New Tag Name' } })
+      fireEvent.change(input, { target: { value: 'New tag Name' } })
 
       const saveButton = within(modal).getByRole('button', { name: 'Save' })
       expect(saveButton.hasAttribute('disabled')).to.be.false
 
-      await fireEvent.click(saveButton)
+      fireEvent.click(saveButton)
 
-      await waitFor(() => expect(fetchMock.called(`/tag/abc123def456/rename`)))
+      await waitFor(
+        () =>
+          expect(fetchMock.callHistory.called(`/tag/abc123def456/edit`)).to.be
+            .true
+      )
 
-      expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      await waitFor(
+        () => expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      )
 
       screen.getByRole('button', {
-        name: 'New Tag Name (1)',
+        name: 'New tag Name (1)',
       })
     })
   })
@@ -253,11 +265,11 @@ describe('<TagsList />', function () {
       const dropdownToggle = within(
         tag1Button.closest('li') as HTMLElement
       ).getByTestId('tag-dropdown-toggle')
-      await fireEvent.click(dropdownToggle)
+      fireEvent.click(dropdownToggle)
       const deleteMenuItem = await screen.findByRole('menuitem', {
         name: 'Delete',
       })
-      await fireEvent.click(deleteMenuItem)
+      fireEvent.click(deleteMenuItem)
     })
 
     it('modal is open', async function () {
@@ -269,18 +281,23 @@ describe('<TagsList />', function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const cancelButton = within(modal).getByRole('button', { name: 'Cancel' })
 
-      await fireEvent.click(cancelButton)
+      fireEvent.click(cancelButton)
       expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
     })
 
     it('clicking Delete sends a request', async function () {
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const deleteButton = within(modal).getByRole('button', { name: 'Delete' })
-      await fireEvent.click(deleteButton)
+      fireEvent.click(deleteButton)
 
-      await waitFor(() => expect(fetchMock.called(`/tag/bcd234efg567`)))
+      await waitFor(
+        () =>
+          expect(fetchMock.callHistory.called(`/tag/abc123def456`)).to.be.true
+      )
 
-      expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      await waitFor(
+        () => expect(screen.queryByRole('dialog', { hidden: false })).to.be.null
+      )
       expect(
         screen.queryByRole('button', {
           name: 'Another Tag (2)',
@@ -289,15 +306,18 @@ describe('<TagsList />', function () {
     })
 
     it('a failed request displays an error message', async function () {
-      fetchMock.delete('express:/tag/:tagId', 500, { overwriteRoutes: true })
+      fetchMock.modifyRoute('delete tag', { response: { status: 500 } })
 
       const modal = screen.getAllByRole('dialog', { hidden: false })[0]
       const deleteButton = within(modal).getByRole('button', { name: 'Delete' })
-      await fireEvent.click(deleteButton)
+      fireEvent.click(deleteButton)
 
-      await waitFor(() => expect(fetchMock.called(`/tag/bcd234efg567`)))
+      await waitFor(
+        () =>
+          expect(fetchMock.callHistory.called('/tag/abc123def456')).to.be.true
+      )
 
-      within(modal).getByText('Sorry, something went wrong')
+      await within(modal).findByText('Sorry, something went wrong')
     })
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/survey-widget.test.tsx b/services/web/test/frontend/features/project-list/components/survey-widget.test.tsx
index bd6aeb683c..0c0d4f01a2 100644
--- a/services/web/test/frontend/features/project-list/components/survey-widget.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/survey-widget.test.tsx
@@ -1,13 +1,14 @@
 import { expect } from 'chai'
 import { fireEvent, render, screen } from '@testing-library/react'
-import { SurveyWidgetDsNav } from '../../../../../frontend/js/features/project-list/components/survey-widget-ds-nav'
+import { SurveyWidgetDsNav } from '@/features/project-list/components/survey-widget-ds-nav'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 
 describe('<SurveyWidgetDsNav />', function () {
   beforeEach(function () {
     this.name = 'my-survey'
-    this.preText = 'To help shape the future of Overleaf'
-    this.linkText = 'Click here!'
+    this.title = 'To help shape the future of Overleaf'
+    this.text = 'Click here!'
+    this.cta = 'Let’s go!'
     this.url = 'https://example.com/my-survey'
 
     localStorage.clear()
@@ -17,8 +18,8 @@ describe('<SurveyWidgetDsNav />', function () {
     beforeEach(function () {
       window.metaAttributesCache.set('ol-survey', {
         name: this.name,
-        preText: this.preText,
-        linkText: this.linkText,
+        title: this.title,
+        text: this.text,
         url: this.url,
       })
 
@@ -33,10 +34,10 @@ describe('<SurveyWidgetDsNav />', function () {
       const dismissed = localStorage.getItem('dismissed-my-survey')
       expect(dismissed).to.equal(null)
 
-      screen.getByText(this.preText)
-      screen.getByText(this.linkText)
+      screen.getByText(this.title)
+      screen.getByText(this.text)
 
-      const link = screen.getByRole('button', {
+      const link = screen.getByRole('link', {
         name: 'Take survey',
       }) as HTMLAnchorElement
       expect(link.href).to.equal(this.url)
@@ -48,7 +49,7 @@ describe('<SurveyWidgetDsNav />', function () {
       })
       fireEvent.click(dismissButton)
 
-      const text = screen.queryByText(this.preText)
+      const text = screen.queryByText(this.title)
       expect(text).to.be.null
 
       const link = screen.queryByRole('button')
@@ -59,12 +60,43 @@ describe('<SurveyWidgetDsNav />', function () {
     })
   })
 
+  describe('survey widget is visible with custom CTA', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-survey', {
+        name: this.name,
+        title: this.title,
+        text: this.text,
+        cta: this.cta,
+        url: this.url,
+      })
+
+      render(
+        <SplitTestProvider>
+          <SurveyWidgetDsNav />
+        </SplitTestProvider>
+      )
+    })
+
+    it('shows text and link with custom CTA', function () {
+      const dismissed = localStorage.getItem('dismissed-my-survey')
+      expect(dismissed).to.equal(null)
+
+      screen.getByText(this.title)
+      screen.getByText(this.text)
+
+      const link = screen.getByRole('link', {
+        name: this.cta,
+      }) as HTMLAnchorElement
+      expect(link.href).to.equal(this.url)
+    })
+  })
+
   describe('survey widget is not shown when already dismissed', function () {
     beforeEach(function () {
       window.metaAttributesCache.set('ol-survey', {
         name: this.name,
-        preText: this.preText,
-        linkText: this.linkText,
+        title: this.title,
+        text: this.text,
         url: this.url,
       })
       localStorage.setItem('dismissed-my-survey', 'true')
@@ -77,7 +109,7 @@ describe('<SurveyWidgetDsNav />', function () {
     })
 
     it('nothing is displayed', function () {
-      const text = screen.queryByText(this.preText)
+      const text = screen.queryByText(this.title)
       expect(text).to.be.null
 
       const link = screen.queryByRole('button')
@@ -95,7 +127,7 @@ describe('<SurveyWidgetDsNav />', function () {
     })
 
     it('nothing is displayed', function () {
-      const text = screen.queryByText(this.preText)
+      const text = screen.queryByText(this.title)
       expect(text).to.be.null
 
       const link = screen.queryByRole('button')
diff --git a/services/web/test/frontend/features/project-list/components/system-messages.test.tsx b/services/web/test/frontend/features/project-list/components/system-messages.test.tsx
index e825f3c57a..2b98b9218c 100644
--- a/services/web/test/frontend/features/project-list/components/system-messages.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/system-messages.test.tsx
@@ -5,12 +5,12 @@ import SystemMessages from '@/shared/components/system-messages'
 
 describe('<SystemMessages />', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
     localStorage.clear()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
     localStorage.clear()
   })
 
@@ -22,9 +22,9 @@ describe('<SystemMessages />', function () {
     fetchMock.get(/\/system\/messages/, [data])
     render(<SystemMessages />)
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
-    screen.getByText(data.content)
+    await screen.findByText(data.content)
     expect(screen.queryByRole('button', { name: /close/i })).to.be.null
   })
 
@@ -36,9 +36,9 @@ describe('<SystemMessages />', function () {
     fetchMock.get(/\/system\/messages/, [data])
     render(<SystemMessages />)
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
-    screen.getByText(data.content)
+    await screen.findByText(data.content)
     const closeBtn = screen.getByRole('button', { name: /close/i })
     fireEvent.click(closeBtn)
 
@@ -60,7 +60,7 @@ describe('<SystemMessages />', function () {
     window.metaAttributesCache.set('ol-currentUrl', currentUrl)
     render(<SystemMessages />)
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
     const link = screen.getByRole('link', { name: /click here/i })
     expect(link.getAttribute('href')).to.equal(`${data.url}${currentUrl}`)
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/archive-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/archive-project-button.test.tsx
index 6a4eee370f..f5b55a71ba 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/archive-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/archive-project-button.test.tsx
@@ -31,7 +31,7 @@ describe('<ArchiveProjectButton />', function () {
     )
     const btn = screen.getByRole('button', { name: 'Archive' })
     fireEvent.click(btn)
-    screen.getByText('Archive Projects')
+    screen.getByText('Archive projects')
     screen.getByText(archiveableProject.name)
   })
 
@@ -56,7 +56,7 @@ describe('<ArchiveProjectButton />', function () {
     )
     const btn = screen.getByRole('button', { name: 'Archive' })
     fireEvent.click(btn)
-    screen.getByText('Archive Projects')
+    screen.getByText('Archive projects')
     screen.getByText('You are about to archive the following projects:')
     screen.getByText('Archiving projects won’t affect your collaborators.')
     const confirmBtn = screen.getByRole('button', {
@@ -67,8 +67,11 @@ describe('<ArchiveProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(archiveProjectMock.called(`/project/${project.id}/archive`)).to
-          .be.true
+        expect(
+          archiveProjectMock.callHistory.called(
+            `/project/${project.id}/archive`
+          )
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/compile-and-download-project-pdf-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/compile-and-download-project-pdf-button.test.tsx
index ba0b3fd3b9..91f37a8a1e 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/compile-and-download-project-pdf-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/compile-and-download-project-pdf-button.test.tsx
@@ -2,33 +2,26 @@ import { expect } from 'chai'
 import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import sinon from 'sinon'
 import { projectsData } from '../../../../fixtures/projects-data'
-import * as useLocationModule from '../../../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import { CompileAndDownloadProjectPDFButtonTooltip } from '../../../../../../../../frontend/js/features/project-list/components/table/cells/action-buttons/compile-and-download-project-pdf-button'
 import fetchMock from 'fetch-mock'
 import * as eventTracking from '@/infrastructure/event-tracking'
 
 describe('<CompileAndDownloadProjectPDFButton />', function () {
-  let assignStub: sinon.SinonStub
-  let locationStub: sinon.SinonStub
   let sendMBSpy: sinon.SinonSpy
 
   beforeEach(function () {
     sendMBSpy = sinon.spy(eventTracking, 'sendMB')
-    assignStub = sinon.stub()
-    locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-      setHash: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
     render(
       <CompileAndDownloadProjectPDFButtonTooltip project={projectsData[0]} />
     )
   })
 
   afterEach(function () {
-    locationStub.restore()
-    fetchMock.reset()
+    this.locationWrapperSandbox.restore()
+    fetchMock.removeRoutes().clearHistory()
     sendMBSpy.restore()
   })
 
@@ -57,6 +50,7 @@ describe('<CompileAndDownloadProjectPDFButton />', function () {
       screen.getByRole('button', { name: 'Compiling…' })
     })
 
+    const assignStub = this.locationWrapperStub.assign
     await waitFor(() => {
       expect(assignStub).to.have.been.called
     })
@@ -85,9 +79,9 @@ describe('<CompileAndDownloadProjectPDFButton />', function () {
     }) as HTMLButtonElement
     fireEvent.click(btn)
 
-    await waitFor(() => {
-      screen.getByText(`${projectsData[0].name}: PDF unavailable for download`)
-    })
-    expect(assignStub).to.have.not.been.called
+    await screen.findByText(
+      `${projectsData[0].name}: PDF unavailable for download`
+    )
+    expect(this.locationWrapperStub.assign).to.have.not.been.called
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/copy-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/copy-project-button.test.tsx
index d50a8cff0a..98dc43c683 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/copy-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/copy-project-button.test.tsx
@@ -55,7 +55,7 @@ describe('<CopyProjectButton />', function () {
     const btn = screen.getByRole('button', { name: 'Copy' })
 
     fireEvent.click(btn)
-    screen.getByText('Copy Project')
+    screen.getByText('Copy project')
     screen.getByLabelText('New Name')
     screen.getByDisplayValue(`${copyableProject.name} (Copy)`)
     const copyBtn = screen.getAllByRole<HTMLButtonElement>('button', {
@@ -66,8 +66,11 @@ describe('<CopyProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(copyProjectMock.called(`/project/${copyableProject.id}/clone`))
-          .to.be.true
+        expect(
+          copyProjectMock.callHistory.called(
+            `/project/${copyableProject.id}/clone`
+          )
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/delete-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/delete-project-button.test.tsx
index 15555728c9..1f51d4b39a 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/delete-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/delete-project-button.test.tsx
@@ -69,7 +69,8 @@ describe('<DeleteProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(deleteProjectMock.called(`/project/${project.id}`)).to.be.true
+        expect(deleteProjectMock.callHistory.called(`/project/${project.id}`))
+          .to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/download-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/download-project-button.test.tsx
index 89e215c082..1723acc8ae 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/download-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/download-project-button.test.tsx
@@ -3,24 +3,17 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react'
 import sinon from 'sinon'
 import { DownloadProjectButtonTooltip } from '../../../../../../../../frontend/js/features/project-list/components/table/cells/action-buttons/download-project-button'
 import { projectsData } from '../../../../fixtures/projects-data'
-import * as useLocationModule from '../../../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 
 describe('<DownloadProjectButton />', function () {
-  let assignStub: sinon.SinonStub
-
   beforeEach(function () {
-    assignStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-      setHash: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
     render(<DownloadProjectButtonTooltip project={projectsData[0]} />)
   })
 
   afterEach(function () {
-    this.locationStub.restore()
+    this.locationWrapperSandbox.restore()
   })
 
   it('renders tooltip for button', async function () {
@@ -35,6 +28,7 @@ describe('<DownloadProjectButton />', function () {
     }) as HTMLButtonElement
     fireEvent.click(btn)
 
+    const assignStub = this.locationWrapperStub.assign
     await waitFor(() => {
       expect(assignStub).to.have.been.called
     })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/leave-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/leave-project-button.test.tsx
index fcbea5a22c..ef0fc52b73 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/leave-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/leave-project-button.test.tsx
@@ -75,8 +75,9 @@ describe('<LeaveProjectButtton />', function () {
 
     await waitFor(
       () =>
-        expect(leaveProjectMock.called(`/project/${project.id}/leave`)).to.be
-          .true
+        expect(
+          leaveProjectMock.callHistory.called(`/project/${project.id}/leave`)
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/rename-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/rename-project-button.test.tsx
index e5a8e051b7..b383c705ac 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/rename-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/rename-project-button.test.tsx
@@ -63,8 +63,9 @@ describe('<RenameProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(renameProjectMock.called(`/project/${project.id}/rename`)).to.be
-          .true
+        expect(
+          renameProjectMock.callHistory.called(`/project/${project.id}/rename`)
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/trash-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/trash-project-button.test.tsx
index 960d506b2b..7b4dac0b79 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/trash-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/trash-project-button.test.tsx
@@ -57,8 +57,9 @@ describe('<TrashProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(trashProjectMock.called(`/project/${project.id}/trash`)).to.be
-          .true
+        expect(
+          trashProjectMock.callHistory.called(`/project/${project.id}/trash`)
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/unarchive-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/unarchive-project-button.test.tsx
index f4541de3f8..c7f6c342d9 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/unarchive-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/unarchive-project-button.test.tsx
@@ -57,8 +57,11 @@ describe('<UnarchiveProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(unarchiveProjectMock.called(`/project/${project.id}/archive`)).to
-          .be.true
+        expect(
+          unarchiveProjectMock.callHistory.called(
+            `/project/${project.id}/archive`
+          )
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/untrash-project-button.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/untrash-project-button.test.tsx
index d72b7f9344..cde2987f6b 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/untrash-project-button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/action-buttons/untrash-project-button.test.tsx
@@ -49,8 +49,9 @@ describe('<UntrashProjectButton />', function () {
 
     await waitFor(
       () =>
-        expect(untrashProjectMock.called(`/project/${project.id}/trash`)).to.be
-          .true
+        expect(
+          untrashProjectMock.callHistory.called(`/project/${project.id}/trash`)
+        ).to.be.true
     )
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/cells/inline-tags.test.tsx b/services/web/test/frontend/features/project-list/components/table/cells/inline-tags.test.tsx
index 0f12e72265..ddacc6da5b 100644
--- a/services/web/test/frontend/features/project-list/components/table/cells/inline-tags.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/cells/inline-tags.test.tsx
@@ -57,13 +57,17 @@ describe('<InlineTags />', function () {
     const removeButton = screen.getByRole('button', {
       name: 'Remove tag My Test Tag',
     })
-    await fireEvent.click(removeButton)
-    await waitFor(() =>
-      expect(
-        fetchMock.called(`/tag/789fff789fff/project/${copyableProject.id}`, {
-          method: 'DELETE',
-        })
-      )
+    fireEvent.click(removeButton)
+    await waitFor(
+      () =>
+        expect(
+          fetchMock.callHistory.called(
+            `/tag/789fff789fff/project/${copyableProject.id}`,
+            {
+              method: 'DELETE',
+            }
+          )
+        ).to.be.true
     )
     expect(screen.queryByText('My Test Tag')).to.not.exist
     screen.getByText('Tag 2')
diff --git a/services/web/test/frontend/features/project-list/components/table/project-list-table.test.tsx b/services/web/test/frontend/features/project-list/components/table/project-list-table.test.tsx
index e0accb3c06..e870478076 100644
--- a/services/web/test/frontend/features/project-list/components/table/project-list-table.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/project-list-table.test.tsx
@@ -1,4 +1,4 @@
-import { screen, within, fireEvent } from '@testing-library/react'
+import { screen, within, fireEvent, waitFor } from '@testing-library/react'
 import { expect } from 'chai'
 import ProjectListTable from '../../../../../../frontend/js/features/project-list/components/table/project-list-table'
 import { currentProjects } from '../../fixtures/projects-data'
@@ -7,15 +7,17 @@ import { renderWithProjectListContext } from '../../helpers/render-with-context'
 
 const userId = '624333f147cfd8002622a1d3'
 
-describe('<ProjectListTable />', function () {
+// TODO(25331): re-enable
+// eslint-disable-next-line mocha/no-skipped-tests
+describe.skip('<ProjectListTable />', function () {
   beforeEach(function () {
     window.metaAttributesCache.set('ol-tags', [])
     window.metaAttributesCache.set('ol-user_id', userId)
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders the table', function () {
@@ -65,11 +67,15 @@ describe('<ProjectListTable />', function () {
     this.timeout(10000)
 
     renderWithProjectListContext(<ProjectListTable />)
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
+    await waitFor(() =>
+      expect(screen.getAllByRole('row').length).to.equal(
+        currentProjects.length + 1
+      )
+    )
     const rows = screen.getAllByRole('row')
     rows.shift() // remove first row since it's the header
-    expect(rows.length).to.equal(currentProjects.length)
 
     // Project name cell
     currentProjects.forEach(project => {
@@ -138,43 +144,70 @@ describe('<ProjectListTable />', function () {
 
   it('selects all projects when header checkbox checked', async function () {
     renderWithProjectListContext(<ProjectListTable />)
-    await fetchMock.flush(true)
-    const checkbox = screen.getByLabelText('Select all projects')
+    await fetchMock.callHistory.flush(true)
+    const checkbox = await screen.findByLabelText('Select all projects')
     fireEvent.click(checkbox)
-    const allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
-    const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
-    // + 1 because of select all checkbox
-    expect(allCheckboxesChecked.length).to.equal(currentProjects.length + 1)
+
+    await waitFor(() => {
+      const allCheckboxes = screen.queryAllByRole<HTMLInputElement>('checkbox')
+      const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
+      // + 1 because of select all checkbox
+      expect(allCheckboxesChecked.length).to.equal(currentProjects.length + 1)
+    })
   })
 
-  it('unselects all projects when select all checkbox uchecked', async function () {
+  it('unselects all projects when select all checkbox unchecked', async function () {
     renderWithProjectListContext(<ProjectListTable />)
-    await fetchMock.flush(true)
-    const checkbox = screen.getByLabelText('Select all projects')
+    await fetchMock.callHistory.flush(true)
+    const checkbox = await screen.findByLabelText('Select all projects')
+
     fireEvent.click(checkbox)
+
+    await waitFor(() => {
+      const allCheckboxes = screen.queryAllByRole<HTMLInputElement>('checkbox')
+      const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
+      expect(allCheckboxesChecked).to.have.length(currentProjects.length + 1)
+    })
+
     fireEvent.click(checkbox)
-    const allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
-    const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
-    expect(allCheckboxesChecked.length).to.equal(0)
+
+    await waitFor(() => {
+      const allCheckboxes = screen.queryAllByRole<HTMLInputElement>('checkbox')
+      expect(allCheckboxes.every(c => !c.checked)).to.be.true
+    })
   })
 
   it('unselects select all projects checkbox when one project is unchecked', async function () {
     renderWithProjectListContext(<ProjectListTable />)
-    await fetchMock.flush(true)
-    const checkbox = screen.getByLabelText('Select all projects')
+    await fetchMock.callHistory.flush(true)
+    const checkbox = await screen.findByLabelText('Select all projects')
     fireEvent.click(checkbox)
-    let allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
-    expect(allCheckboxes[1].getAttribute('data-project-id')).to.exist // make sure we are unchecking a project checkbox
-    fireEvent.click(allCheckboxes[1])
-    allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
-    const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
-    expect(allCheckboxesChecked.length).to.equal(currentProjects.length - 1)
+
+    // make sure we are unchecking a project checkbox and that it is already
+    // checked
+    await waitFor(() => {
+      expect(
+        screen
+          .getAllByRole<HTMLInputElement>('checkbox', { checked: true })[1]
+          .getAttribute('data-project-id')
+      ).to.exist
+    })
+
+    fireEvent.click(screen.getAllByRole<HTMLInputElement>('checkbox')[1])
+
+    await waitFor(() => {
+      const allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
+      const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
+      expect(allCheckboxesChecked.length).to.equal(currentProjects.length - 1)
+    })
   })
 
   it('only checks the checked project', async function () {
     renderWithProjectListContext(<ProjectListTable />)
-    await fetchMock.flush(true)
-    const checkbox = screen.getByLabelText(`Select ${currentProjects[0].name}`)
+    await fetchMock.callHistory.flush(true)
+    const checkbox = await screen.findByLabelText(
+      `Select ${currentProjects[0].name}`
+    )
     fireEvent.click(checkbox)
     const allCheckboxes = screen.getAllByRole<HTMLInputElement>('checkbox')
     const allCheckboxesChecked = allCheckboxes.filter(c => c.checked)
diff --git a/services/web/test/frontend/features/project-list/components/table/project-tools/buttons/archive-projects.button.test.tsx b/services/web/test/frontend/features/project-list/components/table/project-tools/buttons/archive-projects.button.test.tsx
index 2963592164..4201c092ec 100644
--- a/services/web/test/frontend/features/project-list/components/table/project-tools/buttons/archive-projects.button.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/project-tools/buttons/archive-projects.button.test.tsx
@@ -21,6 +21,6 @@ describe('<ArchiveProjectsButton />', function () {
     renderWithProjectListContext(<ArchiveProjectsButton />)
     const btn = screen.getByRole('button', { name: 'Archive' })
     fireEvent.click(btn)
-    screen.getByText('Archive Projects')
+    screen.getByText('Archive projects')
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/project-tools/project-tools-rename.test.tsx b/services/web/test/frontend/features/project-list/components/table/project-tools/project-tools-rename.test.tsx
index 8903fc3089..cfc9dbfd5f 100644
--- a/services/web/test/frontend/features/project-list/components/table/project-tools/project-tools-rename.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/project-tools/project-tools-rename.test.tsx
@@ -1,11 +1,9 @@
-import { render, screen, within } from '@testing-library/react'
+import { render, screen, waitFor, within } from '@testing-library/react'
 import { expect } from 'chai'
 import moment from 'moment/moment'
 import fetchMock from 'fetch-mock'
 import { Project } from '../../../../../../../types/project/dashboard/api'
 import { ProjectListRootInner } from '@/features/project-list/components/project-list-root'
-import * as bootstrapUtils from '@/features/utils/bootstrap-5'
-import sinon, { type SinonStub } from 'sinon'
 
 const users = {
   picard: {
@@ -48,15 +46,6 @@ const projects: Project[] = [
 ]
 
 describe('<ProjectTools />', function () {
-  let isBootstrap5Stub: SinonStub
-
-  before(function () {
-    isBootstrap5Stub = sinon.stub(bootstrapUtils, 'isBootstrap5').returns(true)
-  })
-
-  after(function () {
-    isBootstrap5Stub.restore()
-  })
   beforeEach(function () {
     window.metaAttributesCache.set('ol-user', {})
     window.metaAttributesCache.set('ol-prefetchedProjectsBlob', {
@@ -76,27 +65,33 @@ describe('<ProjectTools />', function () {
 
   afterEach(function () {
     window.metaAttributesCache.clear()
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
-  it('does not show the Rename option for a project owned by a different user', function () {
+  it('does not show the Rename option for a project owned by a different user', async function () {
     render(<ProjectListRootInner />)
     screen.getByLabelText('Select Starfleet Report (readAndWrite)').click()
     screen.getByRole('button', { name: 'More' }).click()
-    expect(
-      within(
-        screen.getByTestId('project-tools-more-dropdown-menu')
-      ).queryByRole('menuitem', { name: 'Rename' })
-    ).to.be.null
+    await waitFor(
+      () =>
+        expect(
+          within(
+            screen.getByTestId('project-tools-more-dropdown-menu')
+          ).queryByRole('menuitem', { name: 'Rename' })
+        ).to.be.null
+    )
   })
 
-  it('displays the Rename option for a project owned by the current user', function () {
+  it('displays the Rename option for a project owned by the current user', async function () {
     render(<ProjectListRootInner />)
     screen.getByLabelText('Select Starfleet Report (owner)').click()
     screen.getByRole('button', { name: 'More' }).click()
-    within(screen.getByTestId('project-tools-more-dropdown-menu'))
-      .getByRole('menuitem', { name: 'Rename' })
-      .click()
-    within(screen.getByRole('dialog')).getByText('Rename Project')
+    const menu = await screen.findByTestId('project-tools-more-dropdown-menu')
+    const menuItem = within(menu).getByRole('menuitem', {
+      name: 'Rename',
+    })
+    menuItem.click()
+    const dialog = await screen.findByRole('dialog')
+    within(dialog).getByText('Rename Project')
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/table/project-tools/rename-project-modal.test.tsx b/services/web/test/frontend/features/project-list/components/table/project-tools/rename-project-modal.test.tsx
index 607aa32e74..6e9649b137 100644
--- a/services/web/test/frontend/features/project-list/components/table/project-tools/rename-project-modal.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/table/project-tools/rename-project-modal.test.tsx
@@ -58,7 +58,9 @@ describe('<RenameProjectModal />', function () {
     await waitFor(
       () =>
         expect(
-          renameProjectMock.called(`/project/${currentProjects[0].id}/rename`)
+          renameProjectMock.callHistory.called(
+            `/project/${currentProjects[0].id}/rename`
+          )
         ).to.be.true
     )
   })
@@ -88,8 +90,8 @@ describe('<RenameProjectModal />', function () {
     const submitButton = within(modal).getByText('Rename') as HTMLButtonElement
     fireEvent.click(submitButton)
 
-    await waitFor(() => expect(postRenameMock.called()).to.be.true)
+    await waitFor(() => expect(postRenameMock.callHistory.called()).to.be.true)
 
-    screen.getByText('Something went wrong. Please try again.')
+    await screen.findByText('Something went wrong. Please try again.')
   })
 })
diff --git a/services/web/test/frontend/features/project-list/components/welcome-message.test.tsx b/services/web/test/frontend/features/project-list/components/welcome-message.test.tsx
index 064a488e3c..56c3693695 100644
--- a/services/web/test/frontend/features/project-list/components/welcome-message.test.tsx
+++ b/services/web/test/frontend/features/project-list/components/welcome-message.test.tsx
@@ -30,9 +30,9 @@ describe('<WelcomeMessage />', function () {
 
     fireEvent.click(button)
 
-    screen.getByText('Blank Project')
-    screen.getByText('Example Project')
-    screen.getByText('Upload Project')
+    screen.getByText('Blank project')
+    screen.getByText('Example project')
+    screen.getByText('Upload project')
     screen.getByText('Import from GitHub')
   })
 
@@ -52,9 +52,9 @@ describe('<WelcomeMessage />', function () {
 
     fireEvent.click(button)
     // static menu
-    screen.getByText('Blank Project')
-    screen.getByText('Example Project')
-    screen.getByText('Upload Project')
+    screen.getByText('Blank project')
+    screen.getByText('Example project')
+    screen.getByText('Upload project')
     screen.getByText('Import from GitHub')
 
     // static text for institution templates
@@ -79,9 +79,9 @@ describe('<WelcomeMessage />', function () {
 
     fireEvent.click(button)
 
-    screen.getByText('Blank Project')
-    screen.getByText('Example Project')
-    screen.getByText('Upload Project')
+    screen.getByText('Blank project')
+    screen.getByText('Example project')
+    screen.getByText('Upload project')
     screen.getByText('Import from GitHub')
   })
 
@@ -130,9 +130,9 @@ describe('<WelcomeMessage />', function () {
 
       fireEvent.click(button)
 
-      screen.getByText('Blank Project')
-      screen.getByText('Example Project')
-      screen.getByText('Upload Project')
+      screen.getByText('Blank project')
+      screen.getByText('Example project')
+      screen.getByText('Upload project')
       expect(screen.queryByText('Import from GitHub')).to.not.exist
     })
 
diff --git a/services/web/test/frontend/features/project-list/helpers/render-with-context.tsx b/services/web/test/frontend/features/project-list/helpers/render-with-context.tsx
index c28dcd0c94..ef807db4c7 100644
--- a/services/web/test/frontend/features/project-list/helpers/render-with-context.tsx
+++ b/services/web/test/frontend/features/project-list/helpers/render-with-context.tsx
@@ -58,5 +58,5 @@ export function renderWithProjectListContext(
 }
 
 export function resetProjectListContextFetch() {
-  fetchMock.reset()
+  fetchMock.removeRoutes().clearHistory()
 }
diff --git a/services/web/test/frontend/features/review-panel/review-panel.spec.tsx b/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
index f9ed6e38b6..fcad15969b 100644
--- a/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
+++ b/services/web/test/frontend/features/review-panel/review-panel.spec.tsx
@@ -1,133 +1,283 @@
 import CodeMirrorEditor from '../../../../frontend/js/features/source-editor/components/codemirror-editor'
-import { EditorProviders } from '../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeProjectProvider,
+  USER_EMAIL,
+  USER_ID,
+} from '../../helpers/editor-providers'
 import { mockScope } from '../source-editor/helpers/mock-scope'
 import { TestContainer } from '../source-editor/helpers/test-container'
+import { docId } from '../source-editor/helpers/mock-doc'
+import { mockProject } from '../source-editor/helpers/mock-project'
 
-// TODO: update tests and re-enable once reviewer role is active
-// eslint-disable-next-line mocha/no-skipped-tests
-describe.skip('<ReviewPanel />', function () {
+const userData = {
+  avatar_text: 'User',
+  email: USER_EMAIL,
+  hue: 180,
+  id: USER_ID,
+  isSelf: true,
+  first_name: 'Test',
+  last_name: 'User',
+}
+
+const resolvedThreadId = 'resolved-thread-id'
+const unresolvedThreadId = 'unresolved-thread-id'
+
+describe('<ReviewPanel />', function () {
   beforeEach(function () {
     window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
 
     cy.interceptEvents()
 
-    const scope = mockScope('')
-    scope.editor.showVisual = true
+    cy.intercept('GET', '/project/*/changes/users', [
+      {
+        id: USER_ID,
+        email: USER_EMAIL,
+        first_name: 'Test',
+        last_name: 'User',
+      },
+    ])
 
-    // The tests expect no documents, so remove them from the scope
-    scope.project.rootFolder = []
+    cy.intercept('GET', '/project/*/threads', {
+      // Resolved comment thread
+      [resolvedThreadId]: {
+        messages: [
+          {
+            content: 'comment text',
+            id: `${resolvedThreadId}-1`,
+            timestamp: new Date('2025-01-01T00:00:00.000Z'),
+            user: userData,
+            user_id: USER_ID,
+          },
+        ],
+        resolved: true,
+        resolved_at: new Date('2025-01-02T00:00:00.000Z').toISOString(),
+        resolved_by_user_id: USER_ID,
+        resolved_by_user: userData,
+      },
+      // Unresolved comment thread
+      [unresolvedThreadId]: {
+        messages: [
+          {
+            content: 'unresolved comment text',
+            id: `${unresolvedThreadId}-1`,
+            timestamp: new Date('2025-01-01T00:00:00.000Z'),
+            user: userData,
+            user_id: USER_ID,
+          },
+          {
+            content: 'reply to thread',
+            id: `${unresolvedThreadId}-2`,
+            timestamp: new Date('2025-01-01T01:00:00.000Z'),
+            user: userData,
+            user_id: USER_ID,
+          },
+        ],
+      },
+    })
+
+    const commentOps = [
+      {
+        id: 'resolved-op-id',
+        op: { p: 161, c: 'Your introduction', t: resolvedThreadId },
+      },
+      {
+        id: 'unresolved-op-id',
+        op: { p: 210, c: 'Your results', t: unresolvedThreadId },
+      },
+    ]
+
+    const changesOps = [
+      {
+        metadata: {
+          user_id: USER_ID,
+          ts: new Date('2025-01-01T00:00:00.000Z'),
+        },
+        id: 'inserted-op-id',
+        op: { p: 166, t: 'inserted-op-id', i: 'introduction' },
+      },
+      {
+        metadata: {
+          user_id: USER_ID,
+          ts: new Date('2025-01-01T01:00:00.000Z'),
+        },
+        id: 'deleted-op-id',
+        op: { p: 110, t: 'deleted-op-id', d: 'beautiful ' },
+      },
+    ]
+
+    cy.intercept('GET', '/project/*/ranges', [
+      {
+        id: docId,
+        ranges: {
+          changes: changesOps,
+          comments: commentOps,
+          docId,
+        },
+      },
+    ])
+
+    cy.intercept(
+      'POST',
+      `/project/*/doc/${docId}/thread/${resolvedThreadId}/reopen`,
+      {}
+    ).as('reopenThread')
+
+    cy.intercept(
+      'POST',
+      `/project/*/doc/${docId}/thread/${unresolvedThreadId}/resolve`,
+      {}
+    ).as('resolveThreadId')
+
+    cy.intercept(
+      'POST',
+      `/project/*/thread/${unresolvedThreadId}/messages/${unresolvedThreadId}-1/edit`,
+      {}
+    ).as('editComment')
+
+    cy.intercept(
+      'POST',
+      `/project/*/thread/${unresolvedThreadId}/messages`,
+      {}
+    ).as('addReply')
+
+    cy.intercept(
+      'POST',
+      /\/project\/.*\/thread\/[a-z0-9]{24}\/messages/,
+      {}
+    ).as('addNewComment')
+
+    cy.intercept(
+      'DELETE',
+      `/project/*/doc/${docId}/thread/${resolvedThreadId}`,
+      {}
+    ).as('deleteResolvedThread')
+
+    cy.intercept(
+      'DELETE',
+      `/project/*/thread/${unresolvedThreadId}/messages/${unresolvedThreadId}-2`,
+      {}
+    ).as('deleteComment')
+
+    cy.intercept(
+      'DELETE',
+      `/project/*/doc/${docId}/thread/${unresolvedThreadId}`,
+      {}
+    ).as('deleteThread')
+
+    cy.intercept('POST', `/project/*/doc/${docId}/changes/accept`, {}).as(
+      'acceptChange'
+    )
+
+    cy.intercept('POST', `/project/*/doc/${docId}/metadata`, {})
+
+    const getChanges = cy.stub().as('getChanges').returns([])
+    const removeChangeIds = cy.stub().as('removeChangeIds')
+
+    const scope = mockScope(undefined, {
+      docOptions: {
+        rangesOptions: {
+          comments: commentOps,
+          changes: changesOps,
+          getChanges,
+          removeChangeIds,
+        },
+      },
+    })
+    const project = mockProject({
+      projectOwner: {
+        _id: USER_ID,
+      },
+      projectFeatures: { trackChanges: false, trackChangesVisible: true },
+    })
 
     cy.wrap(scope).as('scope')
 
     cy.mount(
       <TestContainer className="rp-size-expanded">
-        <EditorProviders scope={scope}>
+        <EditorProviders
+          scope={scope}
+          providers={{ ProjectProvider: makeProjectProvider(project) }}
+        >
           <CodeMirrorEditor />
         </EditorProviders>
       </TestContainer>
     )
 
+    // Open the review panel with keyboard shortcut
+    cy.findByText('contentLine 0').type('{command}j', { scrollBehavior: false })
+    cy.findByText('contentLine 1').type('{ctrl}j', { scrollBehavior: false })
+
     cy.findByTestId('review-panel').as('review-panel')
   })
 
   describe('toolbar', function () {
     describe('resolved comments dropdown', function () {
-      it('renders dropdown button', function () {
-        cy.findByRole('button', { name: /resolved comments/i })
-      })
-
-      // eslint-disable-next-line mocha/no-skipped-tests
-      it.skip('opens dropdown', function () {
-        cy.findByRole('button', { name: /resolved comments/i }).click()
-        // TODO dropdown opens/closes
-      })
-
-      // eslint-disable-next-line mocha/no-skipped-tests
-      it.skip('renders list of resolved comments', function () {})
-
-      // eslint-disable-next-line mocha/no-skipped-tests
-      it.skip('reopens resolved comment', function () {})
-
-      // eslint-disable-next-line mocha/no-skipped-tests
-      it.skip('deletes resolved comment', function () {})
-    })
-
-    describe('track changes toggle menu', function () {
-      it('renders track changes toolbar', function () {
-        cy.get('@review-panel').within(() => {
-          cy.findByRole('button', { name: /track changes is (on|off)$/i })
-        })
-      })
-
-      it('opens/closes toggle menu', function () {
-        cy.get('@review-panel').within(() => {
-          cy.findByTestId('review-panel-track-changes-menu').should('not.exist')
-          cy.findByRole('button', { name: /track changes is/i }).click()
-          // verify the menu is expanded
-          cy.findByTestId('review-panel-track-changes-menu')
-            .as('menu')
-            .then($el => {
-              const height = window
-                .getComputedStyle($el[0])
-                .getPropertyValue('height')
-              return parseFloat(height)
-            })
-            .should('be.gt', 1)
-          cy.findByRole('button', { name: /track changes is/i }).click()
-          cy.get('@menu').should('not.exist')
-        })
-      })
-
-      it('toggles the "everyone" track changes switch', function () {
-        cy.get('@review-panel').within(() => {
-          cy.findByRole('button', { name: /track changes is off/i }).click()
-          cy.findByLabelText(/track changes for everyone/i).click({
-            force: true,
+      it('renders a dropdown of resolved comments', function () {
+        // The dropdown button should be visible
+        cy.findByLabelText('Resolved comments').click()
+        // It should open the dropdown
+        cy.findByRole('tooltip')
+          .should('exist')
+          .within(() => {
+            // TODO: Fix selector
+            cy.get(
+              '.review-panel-resolved-comments-header .badge-content'
+            ).should('contain.text', '1')
+            // Should name the document with the comment
+            cy.findByText('test.tex').should('exist')
+            // Should show the comment text
+            cy.findByText('comment text').should('exist')
+            // Should show the author name
+            // TODO: Fix selector
+            cy.get('.review-panel-entry-user').should(
+              'contain.text',
+              'Test User'
+            )
           })
-          cy.findByLabelText(/track changes for everyone/i).should('be.checked')
-          // TODO: assert that track changes is on for everyone
+      })
+
+      it('reopens resolved comment', function () {
+        cy.findByLabelText('Resolved comments').click()
+        cy.findByRole('tooltip').within(() => {
+          // Find the re-open icon button using the hidden label
+          cy.findByText('Re-open').click({ force: true })
+          // verify the reopen thread API call
+          cy.wait('@reopenThread')
+
+          // TODO: Figure out a way to plumb the websocket response back through
+          // to the test so we can verify the comment is no longer resolved
+          // cy.get(
+          //   '.review-panel-resolved-comments-header .badge-content'
+          // ).should('contain.text', '0')
         })
       })
 
-      // eslint-disable-next-line mocha/no-skipped-tests
-      it.skip('renders track changes with "on" state', function () {
-        const scope = mockScope('')
-        scope.editor.showVisual = true
-        scope.editor.wantTrackChanges = true
+      it('deletes resolved comment', function () {
+        cy.findByLabelText('Resolved comments').click()
+        cy.findByRole('tooltip').within(() => {
+          // Find the Delete icon button using the hidden label
+          cy.findByText('Delete').click({ force: true })
+          // verify the delete thread API call
+          cy.wait('@deleteResolvedThread')
 
-        cy.mount(
-          <TestContainer className="rp-size-expanded">
-            <EditorProviders scope={scope}>
-              <CodeMirrorEditor />
-            </EditorProviders>
-          </TestContainer>
-        )
-
-        cy.findByTestId('review-panel').within(() => {
-          cy.findByRole('button', { name: /track changes is on/i }).click()
+          // TODO: Figure out a way to plumb the websocket response back through
+          // to the test so we can verify the comment is no longer there
+          // cy.get(
+          //   '.review-panel-resolved-comments-header .badge-content'
+          // ).should('contain.text', '0')
         })
       })
-
-      it('renders a disabled guests switch', function () {
-        cy.findByRole('button', { name: /track changes is off/i }).click()
-        cy.findByLabelText(/track changes for guests/i).should('be.disabled')
-      })
     })
   })
 
   describe('toggler', function () {
-    it('renders toggler button', function () {
+    it('should close panel when pressing close button', function () {
       cy.get('@review-panel').within(() => {
-        cy.findByRole('button', { name: /toggle review panel/i })
-      })
-    })
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('calls the toggler function on click', function () {
-      cy.get('@review-panel').within(() => {
-        cy.findByRole('button', { name: /toggle review panel/i }).click()
-        cy.get('@scope').its('toggleReviewPanel').should('be.calledOnce')
+        cy.findByLabelText('Close').click({ scrollBehavior: false })
       })
+      // We should collapse to the mini state
+      cy.get('.review-panel-mini').should('exist')
     })
   })
 
@@ -167,46 +317,177 @@ describe.skip('<ReviewPanel />', function () {
   })
 
   describe('comment entries', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('shows threads and comments', function () {})
+    it('shows threads and comments', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByText('unresolved comment text').should('exist')
+        cy.findByText('reply to thread').should('exist')
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('edits comment', function () {})
+    it('edits comment', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-comment-wrapper')
+          .first()
+          .within(() => {
+            // Find the options icon button using the hidden label
+            cy.findByText('More options')
+              .first()
+              .click({ force: true, scrollBehavior: false })
+            cy.findByRole('menu').within(() => {
+              cy.findByText('Edit').click({ scrollBehavior: false })
+            })
+            cy.findByRole('textbox').type(
+              '{selectAll}edited comment text{enter}',
+              { scrollBehavior: false }
+            )
+            cy.wait('@editComment')
+            // TODO: Figure out a way to plumb the websocket response back through
+            // to the test so we can verify the comment is resolved
+            // cy.findByText('edited comment text').should('exist')
+          })
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('deletes comment', function () {})
+    it('deletes thread', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-comment-wrapper')
+          .first()
+          .within(() => {
+            // Find the options icon button using the hidden label
+            cy.findByText('More options')
+              .first()
+              .click({ force: true, scrollBehavior: false })
+            cy.findByRole('menu').within(() => {
+              cy.findByText('Delete').click({ scrollBehavior: false })
+            })
+          })
+      })
+      cy.findByRole('dialog').within(() => {
+        cy.findByRole('button', { name: 'Delete' }).click()
+      })
+      cy.wait('@deleteThread')
+      // TODO: Figure out a way to plumb the websocket response back through
+      // to the test so we can verify the thread is deleted
+      // cy.findByText('unresolved comment text').should('not.exist')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('cancels comment editing', function () {})
+    it('deletes reply', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-comment-wrapper')
+          .eq(1)
+          .within(() => {
+            // Find the options icon button using the hidden label
+            cy.findByText('More options')
+              .first()
+              .click({ force: true, scrollBehavior: false })
+            cy.findByRole('menu').within(() => {
+              cy.findByText('Delete').click({ scrollBehavior: false })
+            })
+          })
+      })
+      cy.findByRole('dialog').within(() => {
+        cy.findByRole('button', { name: 'Delete' }).click()
+      })
+      cy.wait('@deleteComment')
+      // TODO: Figure out a way to plumb the websocket response back through
+      // to the test so we can verify the reply is deleted
+      // cy.findByText('reply to thread').should('not.exist')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('cancels comment deletion', function () {})
+    it('cancels comment deletion', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-comment-wrapper')
+          .eq(1)
+          .within(() => {
+            // Find the options icon button using the hidden label
+            cy.findByText('More options')
+              .first()
+              .click({ force: true, scrollBehavior: false })
+            cy.findByRole('menu').within(() => {
+              cy.findByText('Delete').click({ scrollBehavior: false })
+            })
+          })
+      })
+      cy.findByRole('dialog').within(() => {
+        cy.findByRole('button', { name: 'Cancel' }).click()
+      })
+      cy.findByText('unresolved comment text').should('exist')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('adds new comment (replies) to a thread', function () {})
+    it('adds new comment (replies) to a thread', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByRole('textbox').type('a new reply{enter}', {
+          scrollBehavior: false,
+        })
+      })
+      cy.wait('@addReply')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('resolves comment', function () {})
+    it('resolves comment', function () {
+      cy.get('@review-panel').within(() => {
+        // Find the resolve icon button using the hidden label
+        cy.findByText('Resolve comment').click({ force: true })
+        cy.wait('@resolveThreadId')
+        // TODO: Figure out a way to plumb the websocket response back through
+        // to the test so we can verify the comment is resolved
+        // cy.findByText('unresolved comment text').should('not.exist')
+      })
+    })
   })
 
   describe('change entries', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders inserted entries in current file mode', function () {})
+    it('renders inserted entries in current file mode', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByText('Added:').should('exist')
+        cy.findByText('introduction').should('exist')
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders deleted entries in current file mode', function () {})
+    it('renders deleted entries in current file mode', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByText('Deleted:').should('exist')
+        cy.findByText('beautiful').should('exist')
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders inserted entries in overview mode', function () {})
+    it('accepts change', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-entry-insert').within(() => {
+          // Find the accept icon button using the hidden label
+          cy.findByText('Accept change').click({ force: true })
+          cy.wait('@acceptChange')
+        })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders deleted entries in overview mode', function () {})
+        // TODO: Fix selector
+        cy.get('.review-panel-entry-delete').within(() => {
+          // Find the accept icon button using the hidden label
+          cy.findByText('Accept change').click({ force: true })
+          cy.wait('@acceptChange')
+        })
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('accepts change', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('rejects change', function () {})
+    it('rejects change', function () {
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-entry-insert').within(() => {
+          // Find the reject icon button using the hidden label
+          cy.findByText('Reject change').click({ force: true })
+          cy.get('@getChanges').should('be.calledOnce')
+        })
+        // TODO: Fix selector
+        cy.get('.review-panel-entry-delete').within(() => {
+          // Find the reject icon button using the hidden label
+          cy.findByText('Reject change').click({ force: true })
+          cy.get('@getChanges').should('be.calledTwice')
+        })
+      })
+    })
   })
 
   describe('aggregate change entries', function () {
@@ -218,63 +499,386 @@ describe.skip('<ReviewPanel />', function () {
   })
 
   describe('add comment entry', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders `add comment button`', function () {})
+    beforeEach(function () {
+      cy.findByText('contentLine 12').type(
+        '{home}{shift}' + '{rightArrow}'.repeat(6),
+        { scrollBehavior: false }
+      )
+      // TODO: Fix selector
+      cy.get('.review-tooltip-add-comment-button').as('add-comment-button')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('cancels adding comment', function () {})
+    it('renders floating `add comment button`', function () {
+      cy.get('@add-comment-button').should('exist')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('adds comment', function () {})
+    it('can add comment', function () {
+      cy.get('@add-comment-button').click({ scrollBehavior: false })
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-add-comment-textarea').type(
+          'a new comment{enter}',
+          {
+            scrollBehavior: false,
+          }
+        )
+      })
+      cy.wait('@addNewComment')
+      // TODO : Figure out a way to plumb the websocket response back through
+      // to the test so we can verify the comment is added
+      // cy.findByText('a new comment').should('exist')
+    })
+
+    it('cancels adding comment', function () {
+      cy.get('@add-comment-button').click({ scrollBehavior: false })
+      cy.get('@review-panel').within(() => {
+        cy.findByRole('button', { name: 'Cancel' }).click({
+          scrollBehavior: false,
+        })
+      })
+    })
   })
 
   describe('bulk actions entry', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders the reject and accept all buttons`', function () {})
+    beforeEach(function () {
+      // Select a deletion and an insertion
+      cy.findByText('\\maketitle').type(
+        '{home}{shift}' + '{downArrow}'.repeat(10),
+        { scrollBehavior: false }
+      )
+      cy.findByLabelText('Accept selected changes').as(
+        'accept-selected-changes'
+      )
+      cy.findByLabelText('Reject selected changes').as(
+        'reject-selected-changes'
+      )
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('accepts all changes', function () {})
+    it('renders the reject and accept all buttons`', function () {
+      cy.get('@accept-selected-changes').should('exist')
+      cy.get('@reject-selected-changes').should('exist')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('rejects all changes', function () {})
+    it('accepts all changes', function () {
+      cy.get('@accept-selected-changes').click({ scrollBehavior: false })
+      cy.findByRole('dialog').within(() => {
+        cy.findByText(
+          'Are you sure you want to accept the selected 2 changes?'
+        ).should('exist')
+        cy.findByRole('button', { name: 'OK' }).click({
+          scrollBehavior: false,
+        })
+        cy.wait('@acceptChange')
+        cy.get('@removeChangeIds').should('have.been.calledWith', [
+          'inserted-op-id',
+          'deleted-op-id',
+        ])
+      })
+    })
+
+    it('rejects all changes', function () {
+      cy.get('@reject-selected-changes').click({ scrollBehavior: false })
+      cy.findByRole('dialog').within(() => {
+        cy.findByText(
+          'Are you sure you want to reject the selected 2 changes?'
+        ).should('exist')
+        cy.findByRole('button', { name: 'OK' }).click({
+          scrollBehavior: false,
+        })
+        cy.get('@getChanges').should('have.been.calledWith', [
+          'inserted-op-id',
+          'deleted-op-id',
+        ])
+      })
+    })
   })
 
   describe('overview mode', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('shows list of files changed', function () {})
+    beforeEach(function () {
+      cy.findByRole('tab', { name: /overview/i }).click()
+    })
+    it('shows list of files changed', function () {
+      // TODO: Fix selector
+      cy.get('.collapsible-file-header').should('contain.text', 'test.tex')
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders comments', function () {})
-  })
+    it('renders comments', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByText('unresolved comment text').should('exist')
+        cy.findByText('reply to thread').should('exist')
+      })
+    })
 
-  describe('in editor widgets', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('toggle review panel', function () {})
+    it('renders changes', function () {
+      cy.get('@review-panel').within(() => {
+        cy.findByText('Added:').should('exist')
+        cy.findByText('introduction').should('exist')
+        cy.findByText('Deleted:').should('exist')
+        cy.findByText('beautiful').should('exist')
+      })
+    })
 
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('accepts all changes', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('rejects all changes', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('add comment', function () {})
-  })
-
-  describe('upgrade track changes', function () {
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('renders modal', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('closes modal', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('opens subscription page after clicking on `upgrade`', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('opens subscription page after clicking on `try it for free`', function () {})
-
-    // eslint-disable-next-line mocha/no-skipped-tests
-    it.skip('shows `ask project owner to upgrade` message', function () {})
+    it('collapses the file entries when clicked', function () {
+      cy.findByText('test.tex').click()
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-entry').should('not.exist')
+      })
+      cy.findByText('test.tex').click()
+      cy.get('@review-panel').within(() => {
+        // TODO: Fix selector
+        cy.get('.review-panel-entry').should('exist')
+      })
+    })
+  })
+})
+
+describe('<ReviewPanel /> in mini mode', function () {
+  function render({ comments = [], changes = [], threads = {} }: any) {
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
+
+    cy.interceptEvents()
+
+    cy.intercept('GET', '/project/*/changes/users', [
+      {
+        id: USER_ID,
+        email: USER_EMAIL,
+        first_name: 'Test',
+        last_name: 'User',
+      },
+    ])
+
+    const getChanges = cy.stub().as('getChanges').returns([])
+    const removeChangeIds = cy.stub().as('removeChangeIds')
+
+    const scope = mockScope(undefined, {
+      docOptions: {
+        rangesOptions: {
+          comments,
+          changes,
+          getChanges,
+          removeChangeIds,
+        },
+      },
+      projectFeatures: { trackChangesVisible: true },
+    })
+
+    const project = mockProject({
+      projectFeatures: { trackChangesVisible: true },
+    })
+
+    cy.intercept('GET', '/project/*/ranges', [
+      {
+        id: docId,
+        ranges: {
+          changes,
+          comments,
+          docId,
+        },
+      },
+    ])
+
+    cy.intercept('GET', '/project/*/threads', threads)
+
+    cy.intercept('POST', `/project/*/doc/${docId}/metadata`, {})
+
+    cy.wrap(scope).as('scope')
+
+    cy.mount(
+      <TestContainer>
+        <EditorProviders
+          scope={scope}
+          providers={{ ProjectProvider: makeProjectProvider(project) }}
+        >
+          <CodeMirrorEditor />
+        </EditorProviders>
+      </TestContainer>
+    )
+    // Wait for editor
+    cy.get('.cm-content').should('have.css', 'opacity', '1')
+
+    // Toggle the review panel twice to ensure data is loaded
+    cy.findByText('contentLine 0').type('{command}jj', {
+      scrollBehavior: false,
+    })
+    cy.findByText('contentLine 1').type('{ctrl}jj', { scrollBehavior: false })
+  }
+
+  it("doesn't render mini when no comments or changes are present in project", function () {
+    render({
+      comments: [],
+      changes: [],
+      threads: {},
+    })
+    cy.get('.review-panel-mini').should('not.exist')
+  })
+
+  it("doesn't render mini when no comments or changes are present in document", function () {
+    render({
+      comments: [],
+      changes: [],
+      threads: {
+        'random-unrelated-thread': {
+          messages: [
+            {
+              content: 'a comment',
+              id: 'random-unrelated-thread-1',
+              timestamp: new Date('2025-01-01T01:00:00.000Z'),
+              user: userData,
+              user_id: USER_ID,
+            },
+          ],
+        },
+      },
+    })
+    cy.get('.review-panel-mini').should('not.exist')
+  })
+
+  it("doesn't render mini when a resolved comment is present in document", function () {
+    render({
+      comments: [
+        {
+          id: resolvedThreadId,
+          op: { p: 161, c: 'Your introduction', t: resolvedThreadId },
+        },
+      ],
+      changes: [],
+      threads: {
+        [resolvedThreadId]: {
+          resolved: true,
+          resolved_at: new Date('2025-01-02T00:00:00.000Z').toISOString(),
+          resolved_by_user_id: USER_ID,
+          resolved_by_user: userData,
+          messages: [
+            {
+              content: 'a comment',
+              id: `${resolvedThreadId}-1`,
+              timestamp: new Date('2025-01-01T01:00:00.000Z'),
+              user: userData,
+              user_id: USER_ID,
+            },
+          ],
+        },
+      },
+    })
+    cy.get('.review-panel-mini').should('not.exist')
+  })
+
+  it('renders mini when an unresolved comment is present in document', function () {
+    render({
+      comments: [
+        {
+          id: unresolvedThreadId,
+          op: { p: 161, c: 'Your introduction', t: unresolvedThreadId },
+        },
+      ],
+      changes: [],
+      threads: {
+        [unresolvedThreadId]: {
+          messages: [
+            {
+              content: 'a comment',
+              id: `${unresolvedThreadId}-1`,
+              timestamp: new Date('2025-01-01T01:00:00.000Z'),
+              user: userData,
+              user_id: USER_ID,
+            },
+          ],
+        },
+      },
+    })
+    cy.get('.review-panel-mini').should('exist')
+  })
+
+  it('renders mini when a tracked change is present in document', function () {
+    render({
+      comments: [],
+      changes: [
+        {
+          metadata: {
+            user_id: USER_ID,
+            ts: new Date('2025-01-01T00:00:00.000Z'),
+          },
+          id: 'inserted-op-id',
+          op: { p: 166, t: 'inserted-op-id', i: 'introduction' },
+        },
+      ],
+      threads: {},
+    })
+    cy.get('.review-panel-mini').should('exist')
+  })
+})
+
+describe('<ReviewPanel /> for free users', function () {
+  function mountEditor(ownerId = USER_ID) {
+    const scope = mockScope(undefined, {
+      permissions: { write: true, trackedWrite: false, comment: true },
+    })
+    const project = mockProject({
+      projectFeatures: { trackChanges: false, trackChangesVisible: true },
+      projectOwner: {
+        _id: ownerId,
+      },
+    })
+
+    cy.wrap(scope).as('scope')
+
+    cy.mount(
+      <TestContainer className="rp-size-expanded">
+        <EditorProviders
+          scope={scope}
+          providers={{ ProjectProvider: makeProjectProvider(project) }}
+        >
+          <CodeMirrorEditor />
+        </EditorProviders>
+      </TestContainer>
+    )
+
+    cy.findByLabelText('Editing').click()
+    cy.findByRole('menu').within(() => {
+      cy.findByText(/Reviewing/).click()
+    })
+  }
+
+  beforeEach(function () {
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
+    cy.interceptEvents()
+    cy.intercept('GET', '/project/*/changes/users', [])
+    cy.intercept('GET', '/project/*/threads', {})
+  })
+
+  it('renders modal', function () {
+    mountEditor()
+    cy.findByRole('dialog').within(() => {
+      cy.findByText('Upgrade to Review').should('exist')
+    })
+  })
+
+  it('closes modal', function () {
+    mountEditor()
+    cy.findByRole('dialog').within(() => {
+      cy.findByText('Close').click()
+    })
+    cy.findByRole('dialog').should('not.exist')
+  })
+
+  it('opens subscription page after clicking on `upgrade`', function () {
+    mountEditor()
+    cy.findByRole('dialog').within(() => {
+      // Verify the button exists. Clicking it will open a new window
+      cy.findByText('Upgrade').should('exist')
+    })
+  })
+
+  // eslint-disable-next-line mocha/no-skipped-tests
+  it.skip('opens subscription page after clicking on `try it for free`', function () {})
+
+  it('shows `ask project owner to upgrade` message', function () {
+    mountEditor('other-user-id')
+    cy.findByRole('dialog').within(() => {
+      cy.findByText(
+        'Please ask the project owner to upgrade to use track changes'
+      ).should('exist')
+    })
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/account-info-section.test.tsx b/services/web/test/frontend/features/settings/components/account-info-section.test.tsx
index 8e723cf8d1..fc6adebcda 100644
--- a/services/web/test/frontend/features/settings/components/account-info-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/account-info-section.test.tsx
@@ -29,7 +29,7 @@ describe('<AccountInfoSection />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('submits all inputs', async function () {
@@ -47,17 +47,17 @@ describe('<AccountInfoSection />', function () {
     })
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
-    expect(updateMock.called()).to.be.true
-    expect(JSON.parse(updateMock.lastCall()![1]!.body as string)).to.deep.equal(
-      {
-        email: 'john@watson.co.uk',
-        first_name: 'John',
-        last_name: 'Watson',
-      }
-    )
+    expect(updateMock.callHistory.called()).to.be.true
+    expect(
+      JSON.parse(updateMock.callHistory.calls().at(-1)?.options.body as string)
+    ).to.deep.equal({
+      email: 'john@watson.co.uk',
+      first_name: 'John',
+      last_name: 'Watson',
+    })
   })
 
   it('disables button on invalid email', async function () {
@@ -68,13 +68,13 @@ describe('<AccountInfoSection />', function () {
       target: { value: 'john' },
     })
     const button = screen.getByRole('button', {
-      name: 'Update',
+      name: /update/i,
     }) as HTMLButtonElement
 
     expect(button.disabled).to.be.true
     fireEvent.click(button)
 
-    expect(updateMock.called()).to.be.false
+    expect(updateMock.callHistory.called()).to.be.false
   })
 
   it('shows inflight state and success message', async function () {
@@ -87,14 +87,14 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
     await screen.findByRole('button', { name: /saving/i })
 
     finishUpdateCall(200)
     await screen.findByRole('button', {
-      name: 'Update',
+      name: /update/i,
     })
     screen.getByText('Thanks, your settings have been updated.')
   })
@@ -105,7 +105,7 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
     await screen.findByText('Something went wrong. Please try again.')
@@ -117,7 +117,7 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
     await screen.findByText(
@@ -129,17 +129,20 @@ describe('<AccountInfoSection />', function () {
     fetchMock.post('/user/settings', {
       status: 409,
       body: {
-        message: 'This email is already registered',
+        message:
+          'This email address is already associated with a different Overleaf account.',
       },
     })
     renderSectionWithUserProvider()
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
-    await screen.findByText('This email is already registered')
+    await screen.findByText(
+      'This email address is already associated with a different Overleaf account.'
+    )
   })
 
   it('hides email input', async function () {
@@ -153,15 +156,15 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
-    expect(JSON.parse(updateMock.lastCall()![1]!.body as string)).to.deep.equal(
-      {
-        first_name: 'Sherlock',
-        last_name: 'Holmes',
-      }
-    )
+    expect(
+      JSON.parse(updateMock.callHistory.calls().at(-1)?.options.body as string)
+    ).to.deep.equal({
+      first_name: 'Sherlock',
+      last_name: 'Holmes',
+    })
   })
 
   it('disables email input', async function () {
@@ -184,15 +187,15 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update account info/i,
       })
     )
-    expect(JSON.parse(updateMock.lastCall()![1]!.body as string)).to.deep.equal(
-      {
-        first_name: 'Sherlock',
-        last_name: 'Holmes',
-      }
-    )
+    expect(
+      JSON.parse(updateMock.callHistory.calls().at(-1)?.options.body as string)
+    ).to.deep.equal({
+      first_name: 'Sherlock',
+      last_name: 'Holmes',
+    })
   })
 
   it('disables names input', async function () {
@@ -212,13 +215,13 @@ describe('<AccountInfoSection />', function () {
 
     fireEvent.click(
       screen.getByRole('button', {
-        name: 'Update',
+        name: /update/i,
       })
     )
-    expect(JSON.parse(updateMock.lastCall()![1]!.body as string)).to.deep.equal(
-      {
-        email: 'sherlock@holmes.co.uk',
-      }
-    )
+    expect(
+      JSON.parse(updateMock.callHistory.calls().at(-1)?.options.body as string)
+    ).to.deep.equal({
+      email: 'sherlock@holmes.co.uk',
+    })
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/emails/add-email-input.test.tsx b/services/web/test/frontend/features/settings/components/emails/add-email-input.test.tsx
index c7707d9efb..694a13f32c 100644
--- a/services/web/test/frontend/features/settings/components/emails/add-email-input.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/add-email-input.test.tsx
@@ -13,13 +13,13 @@ const testInstitutionData = [
 
 describe('<AddEmailInput/>', function () {
   const defaultProps = {
-    onChange: (value: string) => {},
+    onChange: () => {},
     handleAddNewEmail: () => {},
   }
 
   beforeEach(function () {
     clearDomainCache()
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('on initial render', function () {
@@ -69,7 +69,7 @@ describe('<AddEmailInput/>', function () {
     })
 
     it('should not make any request for institution domains', function () {
-      expect(fetchMock.called()).to.be.false
+      expect(fetchMock.callHistory.called()).to.be.false
     })
 
     it('should submit on Enter if email looks valid', async function () {
@@ -118,10 +118,24 @@ describe('<AddEmailInput/>', function () {
     })
 
     describe('when there is a domain match', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         fetchMock.get('express:/institutions/domains', testInstitutionData)
-        fireEvent.change(screen.getByTestId('affiliations-email'), {
-          target: { value: 'user@d' },
+        const input = await screen.findByTestId('affiliations-email')
+        fireEvent.change(input, { target: { value: 'user@d' } })
+
+        // Wait for the request to complete and the domain cache to pouplate
+        await waitFor(
+          () =>
+            expect(
+              fetchMock.callHistory.called('express:/institutions/domains')
+            ).to.be.true
+        )
+        // Wait for component to process the change and update the shadow input
+        await waitFor(() => {
+          const shadowInput = screen.getByTestId(
+            'affiliations-email-shadow'
+          ) as HTMLInputElement
+          expect(shadowInput.value).to.equal('user@domain.edu')
         })
       })
 
@@ -146,7 +160,7 @@ describe('<AddEmailInput/>', function () {
         fireEvent.change(screen.getByTestId('affiliations-email'), {
           target: { value: 'user@domain.edu' },
         })
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
         expect(
           onChangeStub.calledWith(
             'user@domain.edu',
@@ -231,7 +245,7 @@ describe('<AddEmailInput/>', function () {
       })
 
       it('should cache the result and skip subsequent requests', async function () {
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
 
         // clear input
         fireEvent.change(screen.getByTestId('affiliations-email'), {
@@ -242,7 +256,7 @@ describe('<AddEmailInput/>', function () {
           target: { value: 'user@d' },
         })
 
-        expect(fetchMock.called()).to.be.false
+        expect(fetchMock.callHistory.called()).to.be.false
         expect(onChangeStub.calledWith('user@d')).to.equal(true)
         await waitFor(() => {
           const shadowInput = screen.getByTestId(
@@ -258,7 +272,7 @@ describe('<AddEmailInput/>', function () {
 
       afterEach(function () {
         clearDomainCache()
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
       })
 
       it('should not render the suggestion with blocked domain', async function () {
@@ -269,7 +283,7 @@ describe('<AddEmailInput/>', function () {
         fireEvent.change(screen.getByTestId('affiliations-email'), {
           target: { value: `user@${blockedDomain.split('.')[0]}` },
         })
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
         expect(screen.queryByText(`user@${blockedDomain}`)).to.be.null
       })
 
@@ -286,7 +300,7 @@ describe('<AddEmailInput/>', function () {
             value: `user@subdomain.${blockedDomain.split('.')[0]}`,
           },
         })
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
         expect(screen.queryByText(`user@subdomain.${blockedDomain}`)).to.be.null
       })
     })
@@ -307,7 +321,7 @@ describe('<AddEmailInput/>', function () {
 
         // make sure the next suggestions are delayed
         clearDomainCache()
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get('express:/institutions/domains', 200, { delay: 1000 })
       })
 
@@ -354,7 +368,7 @@ describe('<AddEmailInput/>', function () {
       })
 
       // subsequent requests fail
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
       fetchMock.get('express:/institutions/domains', 500)
     })
 
@@ -373,7 +387,7 @@ describe('<AddEmailInput/>', function () {
         expect(shadowInput.value).to.equal('')
       })
 
-      expect(fetchMock.called()).to.be.true // ensures `domainCache` hasn't been hit
+      expect(fetchMock.callHistory.called()).to.be.true // ensures `domainCache` hasn't been hit
     })
   })
 
@@ -384,7 +398,7 @@ describe('<AddEmailInput/>', function () {
       fireEvent.change(screen.getByTestId('affiliations-email'), {
         target: { value: 'user@other' },
       })
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
       const shadowInput = screen.getByTestId(
         'affiliations-email-shadow'
       ) as HTMLInputElement
diff --git a/services/web/test/frontend/features/settings/components/emails/emails-row.test.tsx b/services/web/test/frontend/features/settings/components/emails/emails-row.test.tsx
index 08928ff23d..f0d105d3e9 100644
--- a/services/web/test/frontend/features/settings/components/emails/emails-row.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/emails-row.test.tsx
@@ -37,7 +37,7 @@ describe('<EmailsRow/>', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('with unaffiliated email data', function () {
@@ -48,7 +48,7 @@ describe('<EmailsRow/>', function () {
 
     it('renders actions', function () {
       renderEmailsRow(unconfirmedUserData)
-      screen.getByRole('button', { name: 'Make Primary' })
+      screen.getByRole('button', { name: 'Make primary' })
     })
   })
 
@@ -86,9 +86,9 @@ describe('<EmailsRow/>', function () {
 
     describe('when the email is not yet linked to the institution', function () {
       beforeEach(async function () {
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [affiliatedEmail, unconfirmedUserData])
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
       })
 
       it('prompts the user to link to their institutional account', function () {
@@ -96,16 +96,16 @@ describe('<EmailsRow/>', function () {
         getByTextContent(
           'You can now link your Overleaf account to your Overleaf institutional account.'
         )
-        screen.getByRole('button', { name: 'Link Accounts' })
+        screen.getByRole('button', { name: 'Link accounts' })
       })
     })
 
     describe('when the email is already linked to the institution', function () {
       beforeEach(async function () {
         affiliatedEmail.samlProviderId = '1'
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [affiliatedEmail, unconfirmedUserData])
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
       })
 
       it('prompts the user to login using their institutional account', function () {
@@ -113,7 +113,7 @@ describe('<EmailsRow/>', function () {
         getByTextContent(
           'You can log in to Overleaf through your Overleaf institutional login.'
         )
-        expect(screen.queryByRole('button', { name: 'Link Accounts' })).to.be
+        expect(screen.queryByRole('button', { name: 'Link accounts' })).to.be
           .null
       })
     })
diff --git a/services/web/test/frontend/features/settings/components/emails/emails-section-actions.test.tsx b/services/web/test/frontend/features/settings/components/emails/emails-section-actions.test.tsx
index c1b83b3421..fca5714fe9 100644
--- a/services/web/test/frontend/features/settings/components/emails/emails-section-actions.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/emails-section-actions.test.tsx
@@ -37,11 +37,11 @@ describe('email actions - make primary', function () {
     Object.assign(getMeta('ol-ExposedSettings'), {
       hasAffiliationsFeature: true,
     })
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('disabled `make primary` button', function () {
@@ -236,11 +236,11 @@ describe('email actions - delete', function () {
     Object.assign(getMeta('ol-ExposedSettings'), {
       hasAffiliationsFeature: true,
     })
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows loader when deleting and removes the row', async function () {
diff --git a/services/web/test/frontend/features/settings/components/emails/emails-section-add-new-email.test.tsx b/services/web/test/frontend/features/settings/components/emails/emails-section-add-new-email.test.tsx
index ed3c227083..63021ca26e 100644
--- a/services/web/test/frontend/features/settings/components/emails/emails-section-add-new-email.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/emails-section-add-new-email.test.tsx
@@ -56,12 +56,14 @@ const institutionDomainData = [
 ] as const
 
 function resetFetchMock() {
-  fetchMock.reset()
+  fetchMock.removeRoutes().clearHistory()
   fetchMock.get('express:/institutions/domains', [])
 }
 
 async function confirmCodeForEmail(email: string) {
-  screen.getByText(`Enter the 6-digit confirmation code sent to ${email}.`)
+  await screen.findByText(
+    `Enter the 6-digit confirmation code sent to ${email}.`
+  )
   const inputCode = screen.getByLabelText(/6-digit confirmation code/i)
   fireEvent.change(inputCode, { target: { value: '123456' } })
   const submitCodeBtn = screen.getByRole<HTMLButtonElement>('button', {
@@ -80,7 +82,7 @@ describe('<EmailsSection />', function () {
       hasSamlFeature: true,
       samlInitPath: 'saml/init',
     })
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
@@ -97,14 +99,14 @@ describe('<EmailsSection />', function () {
   it('renders input', async function () {
     fetchMock.get('/user/emails?ensureAffiliation=true', [])
     render(<EmailsSection />)
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
     const button = await screen.findByRole<HTMLButtonElement>('button', {
       name: /add another email/i,
     })
     fireEvent.click(button)
 
-    await screen.findByLabelText(/email/i)
+    await screen.findByLabelText(/email/i, { selector: 'input' })
   })
 
   it('renders "Start adding your address" until a valid email is typed', async function () {
@@ -112,14 +114,14 @@ describe('<EmailsSection />', function () {
     fetchMock.get(`/institutions/domains?hostname=email.com&limit=1`, 200)
     fetchMock.get(`/institutions/domains?hostname=email&limit=1`, 200)
     render(<EmailsSection />)
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
 
     const button = await screen.findByRole<HTMLButtonElement>('button', {
       name: /add another email/i,
     })
     fireEvent.click(button)
 
-    const input = screen.getByLabelText(/email/i)
+    const input = screen.getByLabelText(/email/i, { selector: 'input' })
 
     // initially the text is displayed and the "add email" button disabled
     screen.getByText('Start by adding your email address.')
@@ -190,7 +192,7 @@ describe('<EmailsSection />', function () {
       { name: /add another email/i }
     )
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
     fetchMock
       .get('/user/emails?ensureAffiliation=true', [userEmailData])
@@ -198,7 +200,7 @@ describe('<EmailsSection />', function () {
       .post('/user/emails/confirm-secondary', 200)
 
     fireEvent.click(addAnotherEmailBtn)
-    const input = screen.getByLabelText(/email/i)
+    const input = screen.getByLabelText(/email/i, { selector: 'input' })
 
     fireEvent.change(input, {
       target: { value: userEmailData.email },
@@ -233,14 +235,14 @@ describe('<EmailsSection />', function () {
       { name: /add another email/i }
     )
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
     fetchMock
       .get('/user/emails?ensureAffiliation=true', [])
       .post('/user/emails/secondary', 400)
 
     fireEvent.click(addAnotherEmailBtn)
-    const input = screen.getByLabelText(/email/i)
+    const input = screen.getByLabelText(/email/i, { selector: 'input' })
 
     fireEvent.change(input, {
       target: { value: userEmailData.email },
@@ -271,18 +273,18 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
     fetchMock.get('express:/institutions/domains', institutionDomainData)
 
     await userEvent.click(button)
 
-    const input = screen.getByLabelText(/email/i)
+    const input = screen.getByLabelText(/email/i, { selector: 'input' })
     fireEvent.change(input, {
       target: { value: 'user@autocomplete.edu' },
     })
 
-    await screen.findByRole('button', { name: 'Link Accounts and Add Email' })
+    await screen.findByRole('button', { name: 'Link accounts and add email' })
   })
 
   it('adds new email address with existing institution and custom departments', async function () {
@@ -295,16 +297,19 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
 
     await userEvent.click(button)
 
-    await userEvent.type(screen.getByLabelText(/email/i), userEmailData.email)
+    await userEvent.type(
+      screen.getByLabelText(/email/i, { selector: 'input' }),
+      userEmailData.email
+    )
 
     await userEvent.click(screen.getByRole('button', { name: /let us know/i }))
 
-    const universityInput = screen.getByRole<HTMLInputElement>('textbox', {
+    const universityInput = screen.getByRole<HTMLInputElement>('combobox', {
       name: /university/i,
     })
 
@@ -321,7 +326,7 @@ describe('<EmailsSection />', function () {
 
     // Select the country from dropdown
     await userEvent.type(
-      screen.getByRole('textbox', {
+      screen.getByRole('combobox', {
         name: /country/i,
       }),
       country
@@ -330,7 +335,7 @@ describe('<EmailsSection />', function () {
 
     expect(universityInput.disabled).to.be.false
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
 
     // Select the university from dropdown
@@ -339,9 +344,11 @@ describe('<EmailsSection />', function () {
       await screen.findByText(userEmailData.affiliation.institution.name)
     )
 
-    const roleInput = screen.getByRole('textbox', { name: /role/i })
+    const roleInput = screen.getByRole('combobox', { name: /role/i })
     await userEvent.type(roleInput, userEmailData.affiliation.role!)
-    const departmentInput = screen.getByRole('textbox', { name: /department/i })
+    const departmentInput = screen.getByRole('combobox', {
+      name: /department/i,
+    })
     await userEvent.click(departmentInput)
     await userEvent.click(screen.getByText(customDepartment))
 
@@ -364,9 +371,11 @@ describe('<EmailsSection />', function () {
       })
     )
 
-    const [[, request]] = fetchMock.calls(/\/user\/emails/)
+    const request = fetchMock.callHistory.calls(/\/user\/emails/).at(0)
 
-    expect(JSON.parse(request?.body?.toString() || '{}')).to.deep.include({
+    expect(
+      JSON.parse(request?.options.body?.toString() || '{}')
+    ).to.deep.include({
       email: userEmailData.email,
       university: {
         id: userEmailData.affiliation?.institution.id,
@@ -375,7 +384,7 @@ describe('<EmailsSection />', function () {
       department: customDepartment,
     })
 
-    screen.getByText(
+    await screen.findByText(
       `Enter the 6-digit confirmation code sent to ${userEmailData.email}.`
     )
 
@@ -393,7 +402,7 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
 
     fetchMock.get('/institutions/list?country_code=de', [
@@ -409,11 +418,14 @@ describe('<EmailsSection />', function () {
 
     // open "add new email" section and click "let us know" to open the Country/University form
     await userEvent.click(button)
-    await userEvent.type(screen.getByLabelText(/email/i), userEmailData.email)
+    await userEvent.type(
+      screen.getByLabelText(/email/i, { selector: 'input' }),
+      userEmailData.email
+    )
     await userEvent.click(screen.getByRole('button', { name: /let us know/i }))
 
     // select a country
-    const countryInput = screen.getByRole<HTMLInputElement>('textbox', {
+    const countryInput = screen.getByRole<HTMLInputElement>('combobox', {
       name: /country/i,
     })
     await userEvent.click(countryInput)
@@ -421,7 +433,7 @@ describe('<EmailsSection />', function () {
     await userEvent.click(await screen.findByText('Germany'))
 
     // match several universities on initial typing
-    const universityInput = screen.getByRole<HTMLInputElement>('textbox', {
+    const universityInput = screen.getByRole<HTMLInputElement>('combobox', {
       name: /university/i,
     })
     await userEvent.click(universityInput)
@@ -446,16 +458,19 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
 
     await userEvent.click(button)
 
-    await userEvent.type(screen.getByLabelText(/email/i), userEmailData.email)
+    await userEvent.type(
+      screen.getByLabelText(/email/i, { selector: 'input' }),
+      userEmailData.email
+    )
 
     await userEvent.click(screen.getByRole('button', { name: /let us know/i }))
 
-    const universityInput = screen.getByRole<HTMLInputElement>('textbox', {
+    const universityInput = screen.getByRole<HTMLInputElement>('combobox', {
       name: /university/i,
     })
 
@@ -472,7 +487,7 @@ describe('<EmailsSection />', function () {
 
     // Select the country from dropdown
     await userEvent.type(
-      screen.getByRole('textbox', {
+      screen.getByRole('combobox', {
         name: /country/i,
       }),
       country
@@ -481,15 +496,17 @@ describe('<EmailsSection />', function () {
 
     expect(universityInput.disabled).to.be.false
 
-    await fetchMock.flush(true)
+    await fetchMock.callHistory.flush(true)
     resetFetchMock()
 
     // Enter the university manually
     await userEvent.type(universityInput, newUniversity)
 
-    const roleInput = screen.getByRole('textbox', { name: /role/i })
+    const roleInput = screen.getByRole('combobox', { name: /role/i })
     await userEvent.type(roleInput, userEmailData.affiliation.role!)
-    const departmentInput = screen.getByRole('textbox', { name: /department/i })
+    const departmentInput = screen.getByRole('combobox', {
+      name: /department/i,
+    })
     await userEvent.type(departmentInput, userEmailData.affiliation.department!)
 
     const userEmailDataCopy = {
@@ -516,9 +533,11 @@ describe('<EmailsSection />', function () {
 
     await confirmCodeForEmail(userEmailData.email)
 
-    const [[, request]] = fetchMock.calls(/\/user\/emails/)
+    const request = fetchMock.callHistory.calls(/\/user\/emails/).at(0)
 
-    expect(JSON.parse(request?.body?.toString() || '{}')).to.deep.include({
+    expect(
+      JSON.parse(request?.options.body?.toString() || '{}')
+    ).to.deep.include({
       email: userEmailData.email,
       university: {
         name: newUniversity,
@@ -554,8 +573,8 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
     fetchMock.get(
       `/institutions/domains?hostname=${hostnameFirstChar}&limit=1`,
       institutionDomainDataCopy
@@ -564,46 +583,46 @@ describe('<EmailsSection />', function () {
     await userEvent.click(button)
 
     await userEvent.type(
-      screen.getByLabelText(/email/i),
+      screen.getByLabelText(/email/i, { selector: 'input' }),
       `user@${hostnameFirstChar}`
     )
 
     await userEvent.keyboard('{Tab}')
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
 
     expect(
-      screen.queryByRole('textbox', {
+      screen.queryByRole('combobox', {
         name: /country/i,
       })
     ).to.be.null
     expect(
-      screen.queryByRole('textbox', {
+      screen.queryByRole('combobox', {
         name: /university/i,
       })
     ).to.be.null
-    screen.getByRole('textbox', {
+    screen.getByRole('combobox', {
       name: /role/i,
     })
-    screen.getByRole('textbox', {
+    screen.getByRole('combobox', {
       name: /department/i,
     })
 
     await userEvent.click(screen.getByRole('button', { name: /change/i }))
 
-    screen.getByRole('textbox', {
+    screen.getByRole('combobox', {
       name: /country/i,
     })
-    screen.getByRole('textbox', {
+    screen.getByRole('combobox', {
       name: /university/i,
     })
     expect(
-      screen.queryByRole('textbox', {
+      screen.queryByRole('combobox', {
         name: /role/i,
       })
     ).to.be.null
     expect(
-      screen.queryByRole('textbox', {
+      screen.queryByRole('combobox', {
         name: /department/i,
       })
     ).to.be.null
@@ -627,8 +646,8 @@ describe('<EmailsSection />', function () {
       name: /add another email/i,
     })
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
     fetchMock.get(
       `/institutions/domains?hostname=${hostnameFirstChar}&limit=1`,
       institutionDomainDataCopy
@@ -637,13 +656,13 @@ describe('<EmailsSection />', function () {
     await userEvent.click(button)
 
     await userEvent.type(
-      screen.getByLabelText(/email/i),
+      screen.getByLabelText(/email/i, { selector: 'input' }),
       `user@${hostnameFirstChar}`
     )
 
     await userEvent.keyboard('{Tab}')
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
 
     screen.getByText(institutionDomainDataCopy[0].university.name)
 
@@ -664,11 +683,11 @@ describe('<EmailsSection />', function () {
       .post('/user/emails/confirm-secondary', 200)
 
     await userEvent.type(
-      screen.getByRole('textbox', { name: /role/i }),
+      screen.getByRole('combobox', { name: /role/i }),
       userEmailData.affiliation.role!
     )
     await userEvent.type(
-      screen.getByRole('textbox', { name: /department/i }),
+      screen.getByRole('combobox', { name: /department/i }),
       userEmailData.affiliation.department!
     )
     await userEvent.click(
@@ -679,8 +698,8 @@ describe('<EmailsSection />', function () {
 
     await confirmCodeForEmail('user@autocomplete.edu')
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
 
     screen.getByText(userEmailDataCopy.affiliation.institution.name, {
       exact: false,
diff --git a/services/web/test/frontend/features/settings/components/emails/emails-section-institution-and-role.test.tsx b/services/web/test/frontend/features/settings/components/emails/emails-section-institution-and-role.test.tsx
index 4906f28fd9..977b9a2bf6 100644
--- a/services/web/test/frontend/features/settings/components/emails/emails-section-institution-and-role.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/emails-section-institution-and-role.test.tsx
@@ -79,12 +79,14 @@ describe('user role and institution', function () {
     Object.assign(getMeta('ol-ExposedSettings'), {
       hasAffiliationsFeature: true,
     })
-    fetchMock.reset()
-    fetchMock.get('/user/emails?ensureAffiliation=true', [])
+    fetchMock.removeRoutes().clearHistory()
+    fetchMock.get('/user/emails?ensureAffiliation=true', [], {
+      name: 'get user emails',
+    })
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders affiliation name with add role/department button', function () {
@@ -122,13 +124,11 @@ describe('user role and institution', function () {
 
   it('fetches institution data and replaces departments dropdown on add/change', async function () {
     const userEmailData = userData1
-    fetchMock.get('/user/emails?ensureAffiliation=true', [userEmailData], {
-      overwriteRoutes: true,
-    })
+    fetchMock.modifyRoute('get user emails', { response: [userEmailData] })
     render(<EmailsSection />)
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
 
     const fakeDepartment = 'Fake department'
     const institution = userEmailData.affiliation.institution
@@ -139,23 +139,23 @@ describe('user role and institution', function () {
       departments: [fakeDepartment],
     })
 
-    fireEvent.click(
-      screen.getByRole('button', { name: /add role and department/i })
-    )
+    const addRoleButton = await screen.findByRole('button', {
+      name: /add role and department/i,
+    })
 
-    await fetchMock.flush(true)
-    fetchMock.reset()
+    fireEvent.click(addRoleButton)
 
-    fireEvent.click(screen.getByRole('textbox', { name: /department/i }))
+    await fetchMock.callHistory.flush(true)
+    fetchMock.removeRoutes().clearHistory()
 
-    screen.getByText(fakeDepartment)
+    fireEvent.click(screen.getByRole('combobox', { name: /department/i }))
+
+    await screen.findByText(fakeDepartment)
   })
 
   it('adds new role and department', async function () {
     fetchMock
-      .get('/user/emails?ensureAffiliation=true', [userData1], {
-        overwriteRoutes: true,
-      })
+      .modifyRoute('get user emails', { response: [userData1] })
       .get(/\/institutions\/list/, { departments: [] })
       .post('/user/emails/endorse', 200)
     render(<EmailsSection />)
diff --git a/services/web/test/frontend/features/settings/components/emails/emails-section.test.tsx b/services/web/test/frontend/features/settings/components/emails/emails-section.test.tsx
index e4183e6e3f..55c833df1c 100644
--- a/services/web/test/frontend/features/settings/components/emails/emails-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/emails-section.test.tsx
@@ -22,11 +22,11 @@ describe('<EmailsSection />', function () {
     Object.assign(getMeta('ol-ExposedSettings'), {
       hasAffiliationsFeature: true,
     })
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders translated heading', function () {
@@ -40,6 +40,9 @@ describe('<EmailsSection />', function () {
 
     screen.getByText(/add additional email addresses/i)
     screen.getByText(/to change your primary email/i)
+    screen.getByRole('link', {
+      name: /learn more about managing your Overleaf emails/i,
+    })
   })
 
   it('renders a loading message when loading', async function () {
@@ -96,7 +99,7 @@ describe('<EmailsSection />', function () {
     fetchMock.get('/user/emails?ensureAffiliation=true', [unconfirmedUserData])
     render(<EmailsSection />)
 
-    await screen.findByRole('button', { name: /resend confirmation code/i })
+    await screen.findByRole('button', { name: 'Send confirmation code' })
   })
 
   it('renders professional label', async function () {
@@ -118,24 +121,24 @@ describe('<EmailsSection />', function () {
     fetchMock.post('/user/emails/send-confirmation-code', 200)
 
     const button = screen.getByRole('button', {
-      name: /resend confirmation code/i,
+      name: 'Send confirmation code',
     })
     fireEvent.click(button)
 
     expect(
       screen.queryByRole('button', {
-        name: /resend confirmation code/i,
+        name: 'Send confirmation code',
       })
     ).to.be.null
 
-    await waitForElementToBeRemoved(() => screen.getByText(/sending/i))
+    await screen.findByRole('dialog')
 
     expect(
       screen.queryByText(/an error has occurred while performing your request/i)
     ).to.be.null
 
     await screen.findAllByRole('button', {
-      name: /resend confirmation code/i,
+      name: 'Resend confirmation code',
     })
   })
 
@@ -148,16 +151,68 @@ describe('<EmailsSection />', function () {
     fetchMock.post('/user/emails/send-confirmation-code', 503)
 
     const button = screen.getByRole('button', {
-      name: /resend confirmation code/i,
+      name: 'Send confirmation code',
     })
     fireEvent.click(button)
 
-    expect(screen.queryByRole('button', { name: /resend confirmation code/i }))
-      .to.be.null
+    expect(screen.queryByRole('button', { name: 'Send confirmation code' })).to
+      .be.null
 
-    await waitForElementToBeRemoved(() => screen.getByText(/sending/i))
+    await screen.findByRole('dialog')
 
-    screen.getByText(/sorry, something went wrong/i)
-    screen.getByRole('button', { name: /resend confirmation code/i })
+    await screen.findByText(/sorry, something went wrong/i)
+    screen.getByRole('button', { name: 'Resend confirmation code' })
+  })
+
+  it('sorts emails with primary first, then confirmed, then unconfirmed', async function () {
+    const unconfirmedEmail = { ...unconfirmedUserData, email: 'b@example.com' }
+    const unconfirmedEmailTwo = {
+      ...unconfirmedUserData,
+      email: 'd@example.com',
+    }
+    const confirmedEmail = {
+      ...confirmedUserData,
+      email: 'a@example.com',
+      confirmedAt: new Date().toISOString(),
+    }
+    const confirmedEmailTwo = {
+      ...confirmedUserData,
+      email: 'e@example.com',
+      confirmedAt: new Date().toISOString(),
+    }
+    const primaryEmail = {
+      ...professionalUserData,
+      email: 'c@example.com',
+      default: true,
+    }
+
+    const emails = [
+      confirmedEmailTwo,
+      unconfirmedEmailTwo,
+      unconfirmedEmail,
+      confirmedEmail,
+      primaryEmail,
+    ]
+
+    fetchMock.get('/user/emails?ensureAffiliation=true', emails)
+    render(<EmailsSection />)
+
+    await waitForElementToBeRemoved(() => screen.getByText(/loading/i))
+
+    const emailElements = screen.getAllByTestId(/email-row/i)
+
+    // Primary should be first regardless of alphabetical order
+    expect(within(emailElements[0]).getByText('c@example.com')).to.exist
+    expect(within(emailElements[0]).getByText('Primary')).to.exist
+
+    // Confirmed should be second in alphabetical order
+    expect(within(emailElements[1]).getByText('a@example.com')).to.exist
+    expect(within(emailElements[2]).getByText('e@example.com')).to.exist
+
+    // Unconfirmed should be last in alphabetical order
+    expect(within(emailElements[3]).getByText('b@example.com')).to.exist
+    expect(within(emailElements[3]).getByText(/unconfirmed/i)).to.exist
+    expect(within(emailElements[4]).getByText('d@example.com')).to.exist
+    expect(within(emailElements[4]).getByText(/unconfirmed/i)).to.exist
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/emails/reconfirmation-info.test.tsx b/services/web/test/frontend/features/settings/components/emails/reconfirmation-info.test.tsx
index ef921ac6b7..801b864cd4 100644
--- a/services/web/test/frontend/features/settings/components/emails/reconfirmation-info.test.tsx
+++ b/services/web/test/frontend/features/settings/components/emails/reconfirmation-info.test.tsx
@@ -13,7 +13,7 @@ import ReconfirmationInfo from '../../../../../../frontend/js/features/settings/
 import { ssoUserData } from '../../fixtures/test-user-email-data'
 import { UserEmailData } from '../../../../../../types/user-email'
 import { UserEmailsProvider } from '../../../../../../frontend/js/features/settings/context/user-email-context'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import getMeta from '@/utils/meta'
 
 function renderReconfirmationInfo(data: UserEmailData) {
@@ -25,25 +25,18 @@ function renderReconfirmationInfo(data: UserEmailData) {
 }
 
 describe('<ReconfirmationInfo/>', function () {
-  let assignStub: sinon.SinonStub
-
   beforeEach(function () {
     Object.assign(getMeta('ol-ExposedSettings'), {
       samlInitPath: '/saml',
     })
     fetchMock.get('/user/emails?ensureAffiliation=true', [])
-    assignStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: assignStub,
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-      setHash: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
   })
 
   afterEach(function () {
-    fetchMock.reset()
-    this.locationStub.restore()
+    fetchMock.removeRoutes().clearHistory()
+    this.locationWrapperSandbox.restore()
   })
 
   describe('reconfirmed via SAML', function () {
@@ -104,7 +97,7 @@ describe('<ReconfirmationInfo/>', function () {
       it('redirects to SAML flow', async function () {
         renderReconfirmationInfo(inReconfirmUserData)
         const confirmButton = screen.getByRole('button', {
-          name: 'Confirm Affiliation',
+          name: 'Confirm affiliation',
         }) as HTMLButtonElement
 
         await waitFor(() => {
@@ -115,9 +108,9 @@ describe('<ReconfirmationInfo/>', function () {
         await waitFor(() => {
           expect(confirmButton.disabled).to.be.true
         })
-        sinon.assert.calledOnce(assignStub)
+        sinon.assert.calledOnce(this.locationWrapperStub.assign)
         sinon.assert.calledWithMatch(
-          assignStub,
+          this.locationWrapperStub.assign,
           '/saml/init?university_id=2&reconfirm=/user/settings'
         )
       })
@@ -134,7 +127,7 @@ describe('<ReconfirmationInfo/>', function () {
       it('sends and resends confirmation email', async function () {
         renderReconfirmationInfo(inReconfirmUserData)
         const confirmButton = (await screen.findByRole('button', {
-          name: 'Confirm Affiliation',
+          name: 'Confirm affiliation',
         })) as HTMLButtonElement
 
         await waitFor(() => {
@@ -145,13 +138,13 @@ describe('<ReconfirmationInfo/>', function () {
         await waitFor(() => {
           expect(confirmButton.disabled).to.be.true
         })
-        expect(fetchMock.called()).to.be.true
+        expect(fetchMock.callHistory.called()).to.be.true
 
         // the confirmation text should now be displayed
         await screen.findByText(/Please check your email inbox to confirm/)
 
         // try the resend button
-        fetchMock.resetHistory()
+        fetchMock.clearHistory()
         const resendButton = await screen.findByRole('button', {
           name: 'Resend confirmation email',
         })
@@ -160,7 +153,7 @@ describe('<ReconfirmationInfo/>', function () {
 
         // commented out as it's already gone by this point
         // await screen.findByText(/Sending/)
-        expect(fetchMock.called()).to.be.true
+        expect(fetchMock.callHistory.called()).to.be.true
         await waitForElementToBeRemoved(() => screen.getByText('Sending…'))
         await screen.findByRole('button', {
           name: 'Resend confirmation email',
diff --git a/services/web/test/frontend/features/settings/components/leave-section.test.tsx b/services/web/test/frontend/features/settings/components/leave-section.test.tsx
index 80d068a619..ddf67ac11f 100644
--- a/services/web/test/frontend/features/settings/components/leave-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/leave-section.test.tsx
@@ -23,7 +23,7 @@ describe('<LeaveSection />', function () {
     })
 
     fireEvent.click(button)
-    await screen.findByText('Delete Account')
+    await screen.findByText('Delete account')
   })
 
   it('closes modal', async function () {
@@ -40,6 +40,6 @@ describe('<LeaveSection />', function () {
 
     fireEvent.click(cancelButton)
 
-    await waitForElementToBeRemoved(() => screen.getByText('Delete Account'))
+    await waitForElementToBeRemoved(() => screen.getByText('Delete account'))
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx b/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx
index eba7176e19..475998064d 100644
--- a/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx
+++ b/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx
@@ -12,7 +12,7 @@ describe('<LeaveModalContent />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('disable delete button if form is not valid', function () {
diff --git a/services/web/test/frontend/features/settings/components/leave/modal-form.test.tsx b/services/web/test/frontend/features/settings/components/leave/modal-form.test.tsx
index 52c07de20f..4d5c7f6bcb 100644
--- a/services/web/test/frontend/features/settings/components/leave/modal-form.test.tsx
+++ b/services/web/test/frontend/features/settings/components/leave/modal-form.test.tsx
@@ -1,10 +1,10 @@
 import { expect } from 'chai'
 import sinon from 'sinon'
 import { fireEvent, screen, render, waitFor } from '@testing-library/react'
-import fetchMock, { FetchMockStatic } from 'fetch-mock'
+import fetchMock, { type FetchMock } from 'fetch-mock'
 
 import LeaveModalForm from '../../../../../../frontend/js/features/settings/components/leave/modal-form'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import getMeta from '@/utils/meta'
 
 describe('<LeaveModalForm />', function () {
@@ -14,7 +14,7 @@ describe('<LeaveModalForm />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('validates form', async function () {
@@ -50,26 +50,20 @@ describe('<LeaveModalForm />', function () {
   describe('submits', async function () {
     let setInFlight: sinon.SinonStub
     let setIsFormValid: sinon.SinonStub
-    let deleteMock: FetchMockStatic
-    let assignStub: sinon.SinonStub
+    let deleteMock: FetchMock
 
     beforeEach(function () {
       setInFlight = sinon.stub()
       setIsFormValid = sinon.stub()
       deleteMock = fetchMock.post('/user/delete', 200)
-      assignStub = sinon.stub()
-      this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-        assign: assignStub,
-        replace: sinon.stub(),
-        reload: sinon.stub(),
-        setHash: sinon.stub(),
-      })
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
       Object.assign(getMeta('ol-ExposedSettings'), { isOverleaf: true })
     })
 
     afterEach(function () {
-      fetchMock.reset()
-      this.locationStub.restore()
+      fetchMock.removeRoutes().clearHistory()
+      this.locationWrapperSandbox.restore()
     })
 
     it('with valid form', async function () {
@@ -85,7 +79,8 @@ describe('<LeaveModalForm />', function () {
 
       sinon.assert.calledOnce(setInFlight)
       sinon.assert.calledWithMatch(setInFlight, true)
-      expect(deleteMock.called()).to.be.true
+      expect(deleteMock.callHistory.called()).to.be.true
+      const assignStub = this.locationWrapperStub.assign
       await waitFor(() => {
         sinon.assert.calledTwice(setInFlight)
         sinon.assert.calledWithMatch(setInFlight, false)
@@ -105,7 +100,7 @@ describe('<LeaveModalForm />', function () {
 
       fireEvent.submit(screen.getByLabelText('Email'))
 
-      expect(deleteMock.called()).to.be.false
+      expect(deleteMock.callHistory.called()).to.be.false
       sinon.assert.notCalled(setInFlight)
     })
   })
diff --git a/services/web/test/frontend/features/settings/components/leave/modal.test.tsx b/services/web/test/frontend/features/settings/components/leave/modal.test.tsx
index 442afb9319..3e52f01638 100644
--- a/services/web/test/frontend/features/settings/components/leave/modal.test.tsx
+++ b/services/web/test/frontend/features/settings/components/leave/modal.test.tsx
@@ -13,7 +13,7 @@ describe('<LeaveModal />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('closes modal on cancel', async function () {
diff --git a/services/web/test/frontend/features/settings/components/leavers-survey-alert.test.tsx b/services/web/test/frontend/features/settings/components/leavers-survey-alert.test.tsx
index 2ffa2e5051..b5de65d392 100644
--- a/services/web/test/frontend/features/settings/components/leavers-survey-alert.test.tsx
+++ b/services/web/test/frontend/features/settings/components/leavers-survey-alert.test.tsx
@@ -21,7 +21,7 @@ describe('<LeaversSurveyAlert/>', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('should render before the expiration date', function () {
diff --git a/services/web/test/frontend/features/settings/components/linking-section.test.tsx b/services/web/test/frontend/features/settings/components/linking-section.test.tsx
index 8567769fc4..92958f7a07 100644
--- a/services/web/test/frontend/features/settings/components/linking-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/linking-section.test.tsx
@@ -52,7 +52,7 @@ describe('<LinkingSection />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows header', async function () {
@@ -66,19 +66,21 @@ describe('<LinkingSection />', function () {
 
   it('lists SSO providers', async function () {
     renderSectionWithProviders()
-    screen.getByText('linked accounts')
+    screen.getByText('Linked accounts')
 
     screen.getByText('Google')
     screen.getByText('Log in with Google.')
-    screen.getByRole('button', { name: 'Unlink' })
+    screen.getByRole('button', { name: /unlink/i })
 
     screen.getByText('ORCID')
     screen.getByText(
       /Securely establish your identity by linking your ORCID iD/
     )
-    const helpLink = screen.getByRole('link', { name: 'Learn more' })
+    const helpLink = screen.getByRole('link', {
+      name: /learn more about orcid/i,
+    })
     expect(helpLink.getAttribute('href')).to.equal('/blog/434')
-    const linkButton = screen.getByRole('button', { name: 'Link' })
+    const linkButton = screen.getByRole('link', { name: /link orcid/i })
     expect(linkButton.getAttribute('href')).to.equal('/auth/orcid?intent=link')
   })
 
@@ -92,6 +94,6 @@ describe('<LinkingSection />', function () {
     window.metaAttributesCache.delete('ol-oauthProviders')
     renderSectionWithProviders()
 
-    expect(screen.queryByText('linked accounts')).to.not.exist
+    expect(screen.queryByText('Linked accounts')).to.not.exist
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/linking/integration-widget.test.tsx b/services/web/test/frontend/features/settings/components/linking/integration-widget.test.tsx
index ed656056e3..1a623ba7b7 100644
--- a/services/web/test/frontend/features/settings/components/linking/integration-widget.test.tsx
+++ b/services/web/test/frontend/features/settings/components/linking/integration-widget.test.tsx
@@ -6,6 +6,7 @@ import * as eventTracking from '@/infrastructure/event-tracking'
 
 describe('<IntegrationLinkingWidgetTest/>', function () {
   const defaultProps = {
+    id: 'integration-widget-id',
     logo: <div />,
     title: 'Integration',
     description: 'paragraph1',
@@ -32,7 +33,7 @@ describe('<IntegrationLinkingWidgetTest/>', function () {
     })
 
     it('should render an upgrade link and track clicks', function () {
-      const upgradeLink = screen.getByRole('button', { name: 'Upgrade' })
+      const upgradeLink = screen.getByRole('link', { name: /upgrade/i })
       expect(upgradeLink.getAttribute('href')).to.equal(
         '/user/subscription/plans'
       )
@@ -51,7 +52,7 @@ describe('<IntegrationLinkingWidgetTest/>', function () {
 
     it('should render a link to initiate integration linking', function () {
       expect(
-        screen.getByRole('button', { name: 'Link' }).getAttribute('href')
+        screen.getByRole('link', { name: 'Link' }).getAttribute('href')
       ).to.equal('/link')
     })
 
diff --git a/services/web/test/frontend/features/settings/components/linking/sso-widget.test.tsx b/services/web/test/frontend/features/settings/components/linking/sso-widget.test.tsx
index d78de73ebc..68c3f35c27 100644
--- a/services/web/test/frontend/features/settings/components/linking/sso-widget.test.tsx
+++ b/services/web/test/frontend/features/settings/components/linking/sso-widget.test.tsx
@@ -25,7 +25,7 @@ describe('<SSOLinkingWidget />', function () {
     screen.getByText('integration')
     screen.getByText('integration description')
     expect(
-      screen.getByRole('link', { name: 'Learn more' }).getAttribute('href')
+      screen.getByRole('link', { name: /learn more/i }).getAttribute('href')
     ).to.equal('/help/integration')
   })
 
@@ -33,7 +33,7 @@ describe('<SSOLinkingWidget />', function () {
     it('should render a link to `linkPath`', function () {
       render(<SSOLinkingWidget {...defaultProps} linked={false} />)
       expect(
-        screen.getByRole('button', { name: 'Link' }).getAttribute('href')
+        screen.getByRole('link', { name: /link/i }).getAttribute('href')
       ).to.equal('/integration/link?intent=link')
     })
   })
@@ -49,11 +49,11 @@ describe('<SSOLinkingWidget />', function () {
     })
 
     it('should display an `unlink` button', function () {
-      screen.getByRole('button', { name: 'Unlink' })
+      screen.getByRole('button', { name: /unlink/i })
     })
 
     it('should open a modal to confirm integration unlinking', function () {
-      fireEvent.click(screen.getByRole('button', { name: 'Unlink' }))
+      fireEvent.click(screen.getByRole('button', { name: /unlink/i }))
       screen.getByText('Unlink integration Account')
       screen.getByText(
         'Warning: When you unlink your account from integration you will not be able to sign in using integration anymore.'
@@ -61,7 +61,7 @@ describe('<SSOLinkingWidget />', function () {
     })
 
     it('should cancel unlinking when clicking cancel in the confirmation modal', async function () {
-      fireEvent.click(screen.getByRole('button', { name: 'Unlink' }))
+      fireEvent.click(screen.getByRole('button', { name: /unlink/i }))
       const cancelBtn = screen.getByRole('button', {
         name: 'Cancel',
         hidden: false,
@@ -80,9 +80,9 @@ describe('<SSOLinkingWidget />', function () {
       render(
         <SSOLinkingWidget {...defaultProps} linked onUnlink={unlinkFunction} />
       )
-      fireEvent.click(screen.getByRole('button', { name: 'Unlink' }))
+      fireEvent.click(screen.getByRole('button', { name: /unlink/i }))
       confirmBtn = within(screen.getByRole('dialog')).getByRole('button', {
-        name: 'Unlink',
+        name: /unlink/i,
         hidden: false,
       })
     })
@@ -100,8 +100,8 @@ describe('<SSOLinkingWidget />', function () {
         })
       )
       fireEvent.click(confirmBtn)
-      await waitFor(() =>
-        expect(screen.getByRole('button', { name: 'Unlinking' }))
+      await waitFor(
+        () => expect(screen.getByRole('button', { name: 'Unlinking' })).to.exist
       )
     })
   })
@@ -114,11 +114,11 @@ describe('<SSOLinkingWidget />', function () {
       render(
         <SSOLinkingWidget {...defaultProps} linked onUnlink={unlinkFunction} />
       )
-      fireEvent.click(screen.getByRole('button', { name: 'Unlink' }))
+      fireEvent.click(screen.getByRole('button', { name: /unlink/i }))
       const confirmBtn = within(screen.getByRole('dialog')).getByRole(
         'button',
         {
-          name: 'Unlink',
+          name: /unlink/i,
           hidden: false,
         }
       )
@@ -130,7 +130,7 @@ describe('<SSOLinkingWidget />', function () {
     })
 
     it('should display the unlink button ', async function () {
-      await screen.findByRole('button', { name: 'Unlink' })
+      await screen.findByRole('button', { name: /unlink/i })
     })
   })
 })
diff --git a/services/web/test/frontend/features/settings/components/password-section.test.tsx b/services/web/test/frontend/features/settings/components/password-section.test.tsx
index ae6a620f1f..5f4e0b01f5 100644
--- a/services/web/test/frontend/features/settings/components/password-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/password-section.test.tsx
@@ -17,7 +17,7 @@ describe('<PasswordSection />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows password managed externally message', async function () {
@@ -45,14 +45,14 @@ describe('<PasswordSection />', function () {
     render(<PasswordSection />)
     submitValidForm()
 
-    expect(updateMock.called()).to.be.true
-    expect(JSON.parse(updateMock.lastCall()![1]!.body as string)).to.deep.equal(
-      {
-        currentPassword: 'foobar',
-        newPassword1: 'barbaz',
-        newPassword2: 'barbaz',
-      }
-    )
+    expect(updateMock.callHistory.called()).to.be.true
+    expect(
+      JSON.parse(updateMock.callHistory.calls().at(-1)?.options.body as string)
+    ).to.deep.equal({
+      currentPassword: 'foobar',
+      newPassword1: 'barbaz',
+      newPassword2: 'barbaz',
+    })
   })
 
   it('disables button on invalid form', async function () {
@@ -64,7 +64,7 @@ describe('<PasswordSection />', function () {
         name: 'Change',
       })
     )
-    expect(updateMock.called()).to.be.false
+    expect(updateMock.callHistory.called()).to.be.false
   })
 
   it('validates inputs', async function () {
@@ -186,7 +186,7 @@ describe('<PasswordSection />', function () {
   it('shows message when user cannot use password log in', async function () {
     window.metaAttributesCache.set('ol-cannot-change-password', true)
     render(<PasswordSection />)
-    await screen.findByRole('heading', { name: 'Change Password' })
+    await screen.findByRole('heading', { name: 'Change password' })
     screen.getByText(
       'You can’t add or change your password because your group or organization uses',
       { exact: false }
diff --git a/services/web/test/frontend/features/settings/components/root.test.tsx b/services/web/test/frontend/features/settings/components/root.test.tsx
index ea4de26aa1..f3f2f80639 100644
--- a/services/web/test/frontend/features/settings/components/root.test.tsx
+++ b/services/web/test/frontend/features/settings/components/root.test.tsx
@@ -36,11 +36,11 @@ describe('<SettingsPageRoot />', function () {
     render(<SettingsPageRoot />)
 
     await waitFor(() => {
-      screen.getByText('Account Settings')
+      screen.getByText('Account settings')
     })
-    screen.getByText('Emails and Affiliations')
-    screen.getByText('Update Account Info')
-    screen.getByText('Change Password')
+    screen.getByText('Emails and affiliations')
+    screen.getByText('Update account info')
+    screen.getByText('Change password')
     screen.getByText('Integrations')
     screen.getByText('Overleaf Beta Program')
     screen.getByText('Sessions')
@@ -58,11 +58,11 @@ describe('<SettingsPageRoot />', function () {
     render(<SettingsPageRoot />)
 
     await waitFor(() => {
-      screen.getByText('Account Settings')
+      screen.getByText('Account settings')
     })
-    expect(screen.queryByText('Emails and Affiliations')).to.not.exist
-    screen.getByText('Update Account Info')
-    screen.getByText('Change Password')
+    expect(screen.queryByText('Emails and affiliations')).to.not.exist
+    screen.getByText('Update account info')
+    screen.getByText('Change password')
     screen.getByText('Integrations')
     expect(screen.queryByText('Overleaf Beta Program')).to.not.exist
     screen.getByText('Sessions')
diff --git a/services/web/test/frontend/features/settings/components/security-section.test.tsx b/services/web/test/frontend/features/settings/components/security-section.test.tsx
index 48146e82cf..e1cfd98c2f 100644
--- a/services/web/test/frontend/features/settings/components/security-section.test.tsx
+++ b/services/web/test/frontend/features/settings/components/security-section.test.tsx
@@ -5,7 +5,7 @@ import fetchMock from 'fetch-mock'
 
 describe('<SecuritySection />', function () {
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows Group SSO rows in security section', async function () {
@@ -22,7 +22,7 @@ describe('<SecuritySection />', function () {
     render(<SecuritySection />)
 
     expect(screen.getAllByText('Single Sign-On (SSO)').length).to.equal(2)
-    const link = screen.getByRole('button', {
+    const link = screen.getByRole('link', {
       name: /Set up SSO/i,
     })
     expect(link).to.exist
diff --git a/services/web/test/frontend/features/settings/context/sso-context.test.tsx b/services/web/test/frontend/features/settings/context/sso-context.test.tsx
index 2c7cbebd2b..0d5cb591b4 100644
--- a/services/web/test/frontend/features/settings/context/sso-context.test.tsx
+++ b/services/web/test/frontend/features/settings/context/sso-context.test.tsx
@@ -1,5 +1,5 @@
 import { expect } from 'chai'
-import { renderHook } from '@testing-library/react-hooks'
+import { renderHook, waitFor } from '@testing-library/react'
 import {
   SSOProvider,
   useSSOContext,
@@ -35,7 +35,7 @@ describe('SSOContext', function () {
       google: 'google-id',
     })
     window.metaAttributesCache.set('ol-oauthProviders', mockOauthProviders)
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('should initialise subscriptions with their linked status', function () {
@@ -60,22 +60,23 @@ describe('SSOContext', function () {
     })
 
     it('should unlink an existing subscription', async function () {
-      const { result, waitForNextUpdate } = renderSSOContext()
+      const { result } = renderSSOContext()
       result.current.unlink('google')
-      await waitForNextUpdate()
-      expect(result.current.subscriptions.google.linked).to.be.false
+      await waitFor(
+        () => expect(result.current.subscriptions.google.linked).to.be.false
+      )
     })
 
     it('when the provider is not linked, should do nothing', function () {
       const { result } = renderSSOContext()
       result.current.unlink('orcid')
-      expect(fetchMock.called()).to.be.false
+      expect(fetchMock.callHistory.called()).to.be.false
     })
 
     it('supports unmounting the component while the request is inflight', async function () {
       const { result, unmount } = renderSSOContext()
       result.current.unlink('google')
-      expect(fetchMock.called()).to.be.true
+      expect(fetchMock.callHistory.called()).to.be.true
       unmount()
     })
   })
diff --git a/services/web/test/frontend/features/settings/context/user-email-context.test.tsx b/services/web/test/frontend/features/settings/context/user-email-context.test.tsx
index 7d9544ffe7..3d68202470 100644
--- a/services/web/test/frontend/features/settings/context/user-email-context.test.tsx
+++ b/services/web/test/frontend/features/settings/context/user-email-context.test.tsx
@@ -1,6 +1,6 @@
 import { expect } from 'chai'
 import { cloneDeep } from 'lodash'
-import { renderHook } from '@testing-library/react-hooks'
+import { renderHook, waitFor } from '@testing-library/react'
 import {
   EmailContextType,
   UserEmailsProvider,
@@ -26,7 +26,7 @@ const renderUserEmailsContext = () =>
 
 describe('UserEmailContext', function () {
   beforeEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   describe('context bootstrap', function () {
@@ -49,14 +49,16 @@ describe('UserEmailContext', function () {
     it('should load all user emails and update the initialisation state to "success"', async function () {
       fetchMock.get(/\/user\/emails/, fakeUsersData)
       const { result } = renderUserEmailsContext()
-      await fetchMock.flush(true)
-      expect(fetchMock.calls()).to.have.lengthOf(1)
-      expect(result.current.state.data.byId).to.deep.equal({
-        'bar@overleaf.com': { ...untrustedUserData, ...confirmedUserData },
-        'baz@overleaf.com': unconfirmedUserData,
-        'foo@overleaf.com': professionalUserData,
-        'qux@overleaf.com': unconfirmedCommonsUserData,
-      })
+      await fetchMock.callHistory.flush(true)
+      expect(fetchMock.callHistory.calls()).to.have.lengthOf(1)
+      await waitFor(() =>
+        expect(result.current.state.data.byId).to.deep.equal({
+          'bar@overleaf.com': { ...untrustedUserData, ...confirmedUserData },
+          'baz@overleaf.com': unconfirmedUserData,
+          'foo@overleaf.com': professionalUserData,
+          'qux@overleaf.com': unconfirmedCommonsUserData,
+        })
+      )
       expect(result.current.state.data.linkedInstitutionIds).to.have.lengthOf(0)
 
       expect(result.current.isInitializing).to.equal(false)
@@ -66,9 +68,9 @@ describe('UserEmailContext', function () {
     it('when loading user email fails, it should update the initialisation state to "failed"', async function () {
       fetchMock.get(/\/user\/emails/, 500)
       const { result } = renderUserEmailsContext()
-      await fetchMock.flush()
+      await fetchMock.callHistory.flush()
 
-      expect(result.current.isInitializing).to.equal(false)
+      await waitFor(() => expect(result.current.isInitializing).to.equal(false))
       expect(result.current.isInitializingError).to.equal(true)
     })
 
@@ -78,12 +80,16 @@ describe('UserEmailContext', function () {
         expect(result.current.state.isLoading).to.equal(true)
       })
 
-      it('should be updated with `setLoading`', function () {
+      it('should be updated with `setLoading`', async function () {
         const { result } = renderUserEmailsContext()
         result.current.setLoading(true)
-        expect(result.current.state.isLoading).to.equal(true)
+        await waitFor(() =>
+          expect(result.current.state.isLoading).to.equal(true)
+        )
         result.current.setLoading(false)
-        expect(result.current.state.isLoading).to.equal(false)
+        await waitFor(() =>
+          expect(result.current.state.isLoading).to.equal(false)
+        )
       })
     })
   })
@@ -94,23 +100,27 @@ describe('UserEmailContext', function () {
       fetchMock.get(/\/user\/emails/, fakeUsersData)
       const value = renderUserEmailsContext()
       result = value.result
-      await fetchMock.flush(true)
+      await fetchMock.callHistory.flush(true)
     })
 
     describe('getEmails()', function () {
       beforeEach(async function () {
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
       })
 
-      it('should set `isLoading === true`', function () {
-        fetchMock.get(/\/user\/emails/, [
-          {
-            email: 'new@email.com',
-            default: true,
-          },
-        ])
+      it('should set `isLoading === true`', async function () {
+        fetchMock.get(
+          /\/user\/emails/,
+          [
+            {
+              email: 'new@email.com',
+              default: true,
+            },
+          ],
+          { delay: 100 }
+        )
         result.current.getEmails()
-        expect(result.current.state.isLoading).to.be.true
+        await waitFor(() => expect(result.current.state.isLoading).to.be.true)
       })
 
       it('requests a new set of emails', async function () {
@@ -120,10 +130,12 @@ describe('UserEmailContext', function () {
         }
         fetchMock.get(/\/user\/emails/, [emailData])
         result.current.getEmails()
-        await fetchMock.flush(true)
-        expect(result.current.state.data.byId).to.deep.equal({
-          'new@email.com': emailData,
-        })
+        await fetchMock.callHistory.flush(true)
+        await waitFor(() =>
+          expect(result.current.state.data.byId).to.deep.equal({
+            'new@email.com': emailData,
+          })
+        )
       })
 
       it('should populate `linkedInstitutionIds`', async function () {
@@ -133,43 +145,56 @@ describe('UserEmailContext', function () {
           { ...professionalUserData, samlProviderId: 'saml_provider_2' },
         ])
         const { result } = renderUserEmailsContext()
-        await fetchMock.flush(true)
-        expect(result.current.state.data.linkedInstitutionIds).to.deep.equal([
-          'saml_provider_1',
-          'saml_provider_2',
-        ])
+        await fetchMock.callHistory.flush(true)
+        await waitFor(() =>
+          expect(result.current.state.data.linkedInstitutionIds).to.deep.equal([
+            'saml_provider_1',
+            'saml_provider_2',
+          ])
+        )
       })
     })
 
     describe('makePrimary()', function () {
-      it('sets an email as `default`', function () {
+      it('sets an email as `default`', async function () {
         expect(result.current.state.data.byId['bar@overleaf.com'].default).to.be
           .false
         result.current.makePrimary('bar@overleaf.com')
-        expect(result.current.state.data.byId['bar@overleaf.com'].default).to.be
-          .true
+        await waitFor(
+          () =>
+            expect(result.current.state.data.byId['bar@overleaf.com'].default)
+              .to.be.true
+        )
       })
 
-      it('sets `default=false` for the current primary email ', function () {
+      it('sets `default=false` for the current primary email ', async function () {
         expect(result.current.state.data.byId['foo@overleaf.com'].default).to.be
           .true
         result.current.makePrimary('bar@overleaf.com')
-        expect(result.current.state.data.byId['foo@overleaf.com'].default).to.be
-          .false
+        await waitFor(
+          () =>
+            expect(result.current.state.data.byId['foo@overleaf.com'].default)
+              .to.be.false
+        )
       })
 
-      it('produces no effect when passing a non-existing email', function () {
+      it('produces no effect when passing a non-existing email', async function () {
         const emails = cloneDeep(result.current.state.data.byId)
         result.current.makePrimary('non-existing@email.com')
-        expect(result.current.state.data.byId).to.deep.equal(emails)
+        await waitFor(() =>
+          expect(result.current.state.data.byId).to.deep.equal(emails)
+        )
       })
     })
 
     describe('deleteEmail()', function () {
-      it('removes data from the deleted email', function () {
+      it('removes data from the deleted email', async function () {
         result.current.deleteEmail('bar@overleaf.com')
-        expect(result.current.state.data.byId['bar@overleaf.com']).to.be
-          .undefined
+        await waitFor(
+          () =>
+            expect(result.current.state.data.byId['bar@overleaf.com']).to.be
+              .undefined
+        )
       })
 
       it('produces no effect when passing a non-existing email', function () {
@@ -180,14 +205,20 @@ describe('UserEmailContext', function () {
     })
 
     describe('setEmailAffiliationBeingEdited()', function () {
-      it('sets an email as currently being edited', function () {
+      it('sets an email as currently being edited', async function () {
         result.current.setEmailAffiliationBeingEdited('bar@overleaf.com')
-        expect(result.current.state.data.emailAffiliationBeingEdited).to.equal(
-          'bar@overleaf.com'
+        await waitFor(() =>
+          expect(
+            result.current.state.data.emailAffiliationBeingEdited
+          ).to.equal('bar@overleaf.com')
         )
 
         result.current.setEmailAffiliationBeingEdited(null)
-        expect(result.current.state.data.emailAffiliationBeingEdited).to.be.null
+        await waitFor(
+          () =>
+            expect(result.current.state.data.emailAffiliationBeingEdited).to.be
+              .null
+        )
       })
 
       it('produces no effect when passing a non-existing email', function () {
@@ -198,15 +229,17 @@ describe('UserEmailContext', function () {
     })
 
     describe('updateAffiliation()', function () {
-      it('updates affiliation data for an email', function () {
+      it('updates affiliation data for an email', async function () {
         result.current.updateAffiliation(
           'foo@overleaf.com',
           'new role',
           'new department'
         )
-        expect(
-          result.current.state.data.byId['foo@overleaf.com'].affiliation!.role
-        ).to.equal('new role')
+        await waitFor(() =>
+          expect(
+            result.current.state.data.byId['foo@overleaf.com'].affiliation!.role
+          ).to.equal('new role')
+        )
         expect(
           result.current.state.data.byId['foo@overleaf.com'].affiliation!
             .department
@@ -257,11 +290,11 @@ describe('UserEmailContext', function () {
         const affiliatedEmail2 = cloneDeep(professionalUserData)
         affiliatedEmail2.emailHasInstitutionLicence = true
 
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [affiliatedEmail1, affiliatedEmail2])
 
         result.current.getEmails()
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
         // `resetLeaversSurveyExpiration` always happens after deletion
         result.current.deleteEmail(affiliatedEmail1.email)
@@ -281,11 +314,11 @@ describe('UserEmailContext', function () {
         const affiliatedEmail2 = cloneDeep(professionalUserData)
         affiliatedEmail2.emailHasInstitutionLicence = true
 
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [affiliatedEmail1, affiliatedEmail2])
 
         result.current.getEmails()
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
         // `resetLeaversSurveyExpiration` always happens after deletion
         result.current.deleteEmail(affiliatedEmail1.email)
@@ -303,19 +336,21 @@ describe('UserEmailContext', function () {
         affiliatedEmail1.email = 'institution-test@example.com'
         affiliatedEmail1.affiliation.pastReconfirmDate = true
 
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [confirmedUserData, affiliatedEmail1])
 
         result.current.getEmails()
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
         // `resetLeaversSurveyExpiration` always happens after deletion
         result.current.deleteEmail(affiliatedEmail1.email)
         result.current.resetLeaversSurveyExpiration(affiliatedEmail1)
 
-        expect(
-          localStorage.getItem('showInstitutionalLeaversSurveyUntil')
-        ).to.be.greaterThan(Date.now())
+        await waitFor(() =>
+          expect(
+            localStorage.getItem('showInstitutionalLeaversSurveyUntil')
+          ).to.be.greaterThan(Date.now())
+        )
       })
 
       it("when the leaver has no institution license, it shouldn't reset the survey expiration date", async function () {
@@ -323,11 +358,11 @@ describe('UserEmailContext', function () {
         emailWithInstitutionLicense.email = 'institution-licensed@example.com'
         emailWithInstitutionLicense.emailHasInstitutionLicence = false
 
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [emailWithInstitutionLicense])
 
         result.current.getEmails()
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
         // `resetLeaversSurveyExpiration` always happens after deletion
         result.current.deleteEmail(emailWithInstitutionLicense.email)
@@ -342,11 +377,11 @@ describe('UserEmailContext', function () {
         emailWithInstitutionLicense.email = 'institution-licensed@example.com'
         emailWithInstitutionLicense.affiliation.pastReconfirmDate = false
 
-        fetchMock.reset()
+        fetchMock.removeRoutes().clearHistory()
         fetchMock.get(/\/user\/emails/, [emailWithInstitutionLicense])
 
         result.current.getEmails()
-        await fetchMock.flush(true)
+        await fetchMock.callHistory.flush(true)
 
         // `resetLeaversSurveyExpiration` always happens after deletion
         result.current.deleteEmail(emailWithInstitutionLicense.email)
diff --git a/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx b/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
index 9e02710275..548423e90f 100644
--- a/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
+++ b/services/web/test/frontend/features/share-project-modal/components/share-project-modal.test.jsx
@@ -1,47 +1,48 @@
 import { expect } from 'chai'
 import sinon from 'sinon'
-import { screen, fireEvent, render, waitFor } from '@testing-library/react'
+import { screen, fireEvent, waitFor } from '@testing-library/react'
 import fetchMock from 'fetch-mock'
 import userEvent from '@testing-library/user-event'
-import * as bootstrapUtils from '@/features/utils/bootstrap-5'
 
 import ShareProjectModal from '../../../../../frontend/js/features/share-project-modal/components/share-project-modal'
+import { renderWithEditorContext } from '../../../helpers/render-with-context'
 import {
-  renderWithEditorContext,
-  cleanUpContext,
-} from '../../../helpers/render-with-context'
-import {
-  EditorProviders,
+  makeProjectProvider,
+  projectDefaults,
   USER_EMAIL,
   USER_ID,
 } from '../../../helpers/editor-providers'
-import * as useLocationModule from '../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
+import { useProjectContext } from '@/shared/context/project-context'
 
 async function changePrivilegeLevel(screen, { current, next }) {
   const select = screen.getByDisplayValue(current)
-  await fireEvent.click(select)
+  fireEvent.click(select)
   const option = screen.getByRole('option', {
     name: next,
   })
-  await fireEvent.click(option)
+  fireEvent.click(option)
+}
+
+const shareModalProjectDefaults = Object.assign({}, projectDefaults, {
+  _id: 'test-project',
+  name: 'Test Project',
+  features: {
+    collaborators: 10,
+    compileGroup: 'standard',
+  },
+  owner: {
+    _id: USER_ID,
+    email: USER_EMAIL,
+  },
+})
+
+function createContextProps(projectOverrides) {
+  const project = Object.assign({}, shareModalProjectDefaults, projectOverrides)
+  return { providers: { ProjectProvider: makeProjectProvider(project) } }
 }
 
 describe('<ShareProjectModal/>', function () {
-  const project = {
-    _id: 'test-project',
-    name: 'Test Project',
-    features: {
-      collaborators: 10,
-      compileGroup: 'standard',
-    },
-    owner: {
-      _id: USER_ID,
-      email: USER_EMAIL,
-    },
-    members: [],
-    invites: [],
-  }
-
   const contacts = [
     // user with edited name
     {
@@ -90,31 +91,24 @@ describe('<ShareProjectModal/>', function () {
   }
 
   beforeEach(function () {
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: sinon.stub(),
-      replace: sinon.stub(),
-      reload: sinon.stub(),
-    })
-    this.isBootstrap5Stub = sinon
-      .stub(bootstrapUtils, 'isBootstrap5')
-      .returns(true)
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
     fetchMock.get('/user/contacts', { contacts })
     window.metaAttributesCache.set('ol-user', { allowedFreeTrial: true })
     window.metaAttributesCache.set('ol-showUpgradePrompt', true)
-    window.metaAttributesCache.set('ol-isReviewerRoleEnabled', true)
+    window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
 
   afterEach(function () {
-    this.locationStub.restore()
-    this.isBootstrap5Stub.restore()
-    fetchMock.restore()
-    cleanUpContext()
+    this.locationWrapperSandbox.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders the modal', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps()
+    )
 
     await screen.findByText('Share Project')
   })
@@ -124,7 +118,7 @@ describe('<ShareProjectModal/>', function () {
 
     renderWithEditorContext(
       <ShareProjectModal {...modalProps} handleHide={handleHide} />,
-      { scope: { project } }
+      createContextProps()
     )
 
     const [headerCloseButton, footerCloseButton] = await screen.findAllByRole(
@@ -139,9 +133,10 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('handles access level "private"', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project: { ...project, publicAccesLevel: 'private' } },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'private' })
+    )
 
     await screen.findByText('Link sharing is off')
     await screen.findByRole('button', { name: 'Turn on link sharing' })
@@ -160,10 +155,11 @@ describe('<ShareProjectModal/>', function () {
       readAndWriteHashPrefix: 'taEVki',
       readOnlyHashPrefix: 'j2xYbL',
     }
-    fetchMock.get(`/project/${project._id}/tokens`, tokens)
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project: { ...project, publicAccesLevel: 'tokenBased' } },
-    })
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, tokens)
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased' })
+    )
 
     await screen.findByText('Link sharing is on')
     await screen.findByRole('button', { name: 'Turn off link sharing' })
@@ -182,28 +178,32 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('handles legacy access level "readAndWrite"', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project: { ...project, publicAccesLevel: 'readAndWrite' } },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'readAndWrite' })
+    )
 
     await screen.findByText(
       'This project is public and can be edited by anyone with the URL.'
     )
-    await screen.findByRole('button', { name: 'Make Private' })
+    await screen.findByRole('button', { name: 'Make private' })
   })
 
   it('handles legacy access level "readOnly"', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project: { ...project, publicAccesLevel: 'readOnly' } },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'readOnly' })
+    )
 
     await screen.findByText(
       'This project is public and can be viewed but not edited by anyone with the URL'
     )
-    await screen.findByRole('button', { name: 'Make Private' })
+    await screen.findByRole('button', { name: 'Make private' })
   })
 
   it('displays actions for project-owners', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
+
     const invites = [
       {
         _id: 'invited-author',
@@ -213,18 +213,9 @@ describe('<ShareProjectModal/>', function () {
     ]
 
     // render as project owner: actions should be present
-    render(
-      <EditorProviders
-        scope={{
-          project: {
-            ...project,
-            invites,
-            publicAccesLevel: 'tokenBased',
-          },
-        }}
-      >
-        <ShareProjectModal {...modalProps} />
-      </EditorProviders>
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', invites })
     )
 
     await screen.findByRole('button', { name: 'Turn off link sharing' })
@@ -240,23 +231,13 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    render(
-      <EditorProviders
-        scope={{
-          project: {
-            ...project,
-            invites,
-            publicAccesLevel: 'tokenBased',
-          },
-        }}
-        user={{
-          id: 'non-project-owner',
-          email: 'non-project-owner@example.com',
-        }}
-      >
-        <ShareProjectModal {...modalProps} />
-      </EditorProviders>
-    )
+    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
+      ...createContextProps({ publicAccessLevel: 'tokenBased', invites }),
+      user: {
+        id: 'non-project-owner',
+        email: 'non-project-owner@example.com',
+      },
+    })
 
     await screen.findByText(
       'To change access permissions, please ask the project owner'
@@ -278,23 +259,13 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    render(
-      <EditorProviders
-        scope={{
-          project: {
-            ...project,
-            invites,
-            publicAccesLevel: 'private',
-          },
-        }}
-        user={{
-          id: 'non-project-owner',
-          email: 'non-project-owner@example.com',
-        }}
-      >
-        <ShareProjectModal {...modalProps} />
-      </EditorProviders>
-    )
+    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
+      ...createContextProps({ publicAccessLevel: 'private', invites }),
+      user: {
+        id: 'non-project-owner',
+        email: 'non-project-owner@example.com',
+      },
+    })
 
     await screen.findByText(
       'To add more collaborators or turn on link sharing, please ask the project owner'
@@ -309,10 +280,11 @@ describe('<ShareProjectModal/>', function () {
 
   it('only shows read-only token link to restricted token members', async function () {
     window.metaAttributesCache.set('ol-isRestrictedTokenMember', true)
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
 
     renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
+      ...createContextProps({ publicAccessLevel: 'private' }),
       isRestrictedTokenMember: true,
-      scope: { project: { ...project, publicAccesLevel: 'tokenBased' } },
     })
 
     // no buttons
@@ -354,16 +326,12 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          members,
-          invites,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
+
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', members, invites })
+    )
 
     const projectOwnerEmail = USER_EMAIL
 
@@ -387,6 +355,7 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('resends an invite', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.postOnce(
       'express:/project/:projectId/invite/:inviteId/resend',
       204
@@ -400,15 +369,10 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          invites,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', invites })
+    )
 
     const [, closeButton] = screen.getAllByRole('button', {
       name: 'Close',
@@ -419,11 +383,12 @@ describe('<ShareProjectModal/>', function () {
 
     await waitFor(() => expect(closeButton.disabled).to.be.true)
 
-    expect(fetchMock.done()).to.be.true
-    expect(closeButton.disabled).to.be.false
+    expect(fetchMock.callHistory.done()).to.be.true
+    await waitFor(() => expect(closeButton.disabled).to.be.false)
   })
 
   it('revokes an invite', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.deleteOnce('express:/project/:projectId/invite/:inviteId', 204)
 
     const invites = [
@@ -434,15 +399,10 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          invites,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', invites })
+    )
 
     const [, closeButton] = screen.getAllByRole('button', {
       name: 'Close',
@@ -452,11 +412,12 @@ describe('<ShareProjectModal/>', function () {
     fireEvent.click(revokeButton)
     await waitFor(() => expect(closeButton.disabled).to.be.true)
 
-    expect(fetchMock.done()).to.be.true
-    expect(closeButton.disabled).to.be.false
+    expect(fetchMock.callHistory.done()).to.be.true
+    await waitFor(() => expect(closeButton.disabled).to.be.false)
   })
 
   it('changes member privileges to read + write', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.putOnce('express:/project/:projectId/users/:userId', 204)
 
     const members = [
@@ -467,17 +428,12 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          members,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', members })
+    )
 
-    const [, closeButton] = await screen.getAllByRole('button', {
+    const [, closeButton] = screen.getAllByRole('button', {
       name: 'Close',
     })
 
@@ -489,14 +445,15 @@ describe('<ShareProjectModal/>', function () {
 
     await waitFor(() => expect(closeButton.disabled).to.be.true)
 
-    const { body } = fetchMock.lastOptions()
+    const { body } = fetchMock.callHistory.calls().at(-1).options
     expect(JSON.parse(body)).to.deep.equal({ privilegeLevel: 'readAndWrite' })
 
-    expect(fetchMock.done()).to.be.true
-    expect(closeButton.disabled).to.be.false
+    expect(fetchMock.callHistory.done()).to.be.true
+    await waitFor(() => expect(closeButton.disabled).to.be.false)
   })
 
   it('removes a member from the project', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.deleteOnce('express:/project/:projectId/users/:userId', 204)
 
     const members = [
@@ -507,15 +464,10 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          members,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', members })
+    )
 
     expect(
       await screen.findAllByText('member-viewer@example.com')
@@ -530,13 +482,16 @@ describe('<ShareProjectModal/>', function () {
     })
     fireEvent.click(removeButton)
 
-    const url = fetchMock.lastUrl()
-    expect(url).to.equal('/project/test-project/users/member-viewer')
+    const url = fetchMock.callHistory.calls().at(-1).url
+    expect(url).to.equal(
+      'https://www.test-overleaf.com/project/test-project/users/member-viewer'
+    )
 
-    expect(fetchMock.done()).to.be.true
+    expect(fetchMock.callHistory.done()).to.be.true
   })
 
   it('changes member privileges to owner with confirmation', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.postOnce('express:/project/:projectId/transfer-ownership', 204)
 
     const members = [
@@ -547,15 +502,10 @@ describe('<ShareProjectModal/>', function () {
       },
     ]
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          members,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased', members })
+    )
 
     await screen.findByText('member-viewer@example.com')
     expect(screen.queryAllByText('member-viewer@example.com')).to.have.length(1)
@@ -578,27 +528,25 @@ describe('<ShareProjectModal/>', function () {
     fireEvent.click(confirmButton)
     await waitFor(() => expect(confirmButton.disabled).to.be.true)
 
-    const { body } = fetchMock.lastOptions()
+    const { body } = fetchMock.callHistory.calls().at(-1).options
     expect(JSON.parse(body)).to.deep.equal({ user_id: 'member-viewer' })
 
-    expect(fetchMock.done()).to.be.true
+    expect(fetchMock.callHistory.done()).to.be.true
   })
 
   it('sends invites to input email addresses', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
+
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({ publicAccessLevel: 'tokenBased' })
+    )
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
 
     // loading contacts
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     // displaying a list of matching contacts
@@ -609,26 +557,29 @@ describe('<ShareProjectModal/>', function () {
 
     // sending invitations
 
-    fetchMock.post('express:/project/:projectId/invite', (url, req) => {
-      const data = JSON.parse(req.body)
+    fetchMock.post(
+      'express:/project/:projectId/invite',
+      ({ args: [, req] }) => {
+        const data = JSON.parse(req.body)
+
+        if (data.email === 'a@b.c') {
+          return {
+            status: 400,
+            body: { errorReason: 'invalid_email' },
+          }
+        }
 
-      if (data.email === 'a@b.c') {
         return {
-          status: 400,
-          body: { errorReason: 'invalid_email' },
+          status: 200,
+          body: {
+            invite: {
+              ...data,
+              _id: data.email,
+            },
+          },
         }
       }
-
-      return {
-        status: 200,
-        body: {
-          invite: {
-            ...data,
-            _id: data.email,
-          },
-        },
-      }
-    })
+    )
 
     fireEvent.paste(inputElement, {
       clipboardData: {
@@ -648,22 +599,24 @@ describe('<ShareProjectModal/>', function () {
     let calls
     await waitFor(
       () => {
-        calls = fetchMock.calls('express:/project/:projectId/invite')
+        calls = fetchMock.callHistory.calls(
+          'express:/project/:projectId/invite'
+        )
         expect(calls).to.have.length(4)
       },
       { timeout: 5000 } // allow time for delay between each request
     )
 
-    expect(calls[0][1].body).to.equal(
+    expect(calls[0].args[1].body).to.equal(
       JSON.stringify({ email: 'test@example.com', privileges: 'readOnly' })
     )
-    expect(calls[1][1].body).to.equal(
+    expect(calls[1].args[1].body).to.equal(
       JSON.stringify({ email: 'foo@example.com', privileges: 'readOnly' })
     )
-    expect(calls[2][1].body).to.equal(
+    expect(calls[2].args[1].body).to.equal(
       JSON.stringify({ email: 'bar@example.com', privileges: 'readOnly' })
     )
-    expect(calls[3][1].body).to.equal(
+    expect(calls[3].args[1].body).to.equal(
       JSON.stringify({ email: 'a@b.c', privileges: 'readOnly' })
     )
 
@@ -672,26 +625,26 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('displays a message when the collaborator limit is reached', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.post(
       '/event/paywall-prompt',
       {},
       { body: { 'paywall-type': 'project-sharing' } }
     )
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          publicAccesLevel: 'tokenBased',
-          features: {
-            collaborators: 0,
-            compileGroup: 'standard',
-          },
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({
+        publicAccessLevel: 'tokenBased',
+        features: {
+          collaborators: 0,
+          compileGroup: 'standard',
+          trackChangesVisible: true,
         },
-      },
-    })
+      })
+    )
 
-    await screen.findByText('Add more editors')
+    await screen.findByText('Add more collaborators')
 
     const user = userEvent.setup()
     await user.click(screen.getByTestId('add-collaborator-select'))
@@ -700,34 +653,33 @@ describe('<ShareProjectModal/>', function () {
     const viewerOption = screen.getByText('Viewer').closest('button')
 
     expect(editorOption.classList.contains('disabled')).to.be.true
-    expect(reviewerOption.classList.contains('disabled')).to.be.false
+    expect(reviewerOption.classList.contains('disabled')).to.be.true
     expect(viewerOption.classList.contains('disabled')).to.be.false
 
     screen.getByText(
-      /Upgrade to add more editors and access collaboration features like track changes and full project history/
+      /Upgrade to add more collaborators and access collaboration features like track changes and full project history/
     )
   })
 
   it('counts reviewers towards the collaborator limit', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          features: {
-            collaborators: 1,
-          },
-          members: [
-            {
-              _id: 'reviewer-id',
-              email: 'reviewer@example.com',
-              privileges: 'review',
-            },
-          ],
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({
+        features: {
+          collaborators: 1,
+          trackChangesVisible: true,
         },
-      },
-    })
+        members: [
+          {
+            _id: 'reviewer-id',
+            email: 'reviewer@example.com',
+            privileges: 'review',
+          },
+        ],
+      })
+    )
 
-    await screen.findByText('Add more editors')
+    await screen.findByText('Add more collaborators')
 
     const user = userEvent.setup()
     await user.click(screen.getByTestId('add-collaborator-select'))
@@ -737,27 +689,27 @@ describe('<ShareProjectModal/>', function () {
     const viewerOption = screen.getByText('Viewer').closest('button')
 
     expect(editorOption.classList.contains('disabled')).to.be.true
-    expect(reviewerOption.classList.contains('disabled')).to.be.false
+    expect(reviewerOption.classList.contains('disabled')).to.be.true
     expect(viewerOption.classList.contains('disabled')).to.be.false
 
     screen.getByText(
-      /Upgrade to add more editors and access collaboration features like track changes and full project history/
+      /Upgrade to add more collaborators and access collaboration features like track changes and full project history/
     )
   })
 
   it('handles server error responses', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: {
-          ...project,
-          publicAccesLevel: 'tokenBased',
-        },
-      },
-    })
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
+
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps({
+        publicAccessLevel: 'tokenBased',
+      })
+    )
 
     // loading contacts
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
@@ -771,19 +723,15 @@ describe('<ShareProjectModal/>', function () {
       })
       fireEvent.blur(inputElement)
 
-      fetchMock.postOnce(
-        'express:/project/:projectId/invite',
-        {
-          status: 400,
-          body: { errorReason },
-        },
-        { overwriteRoutes: true }
-      )
+      fetchMock.postOnce('express:/project/:projectId/invite', {
+        status: 400,
+        body: { errorReason },
+      })
 
       expect(submitButton.disabled).to.be.false
       await userEvent.click(submitButton)
-      await fetchMock.flush(true)
-      expect(fetchMock.done()).to.be.true
+      await fetchMock.callHistory.flush(true)
+      expect(fetchMock.callHistory.done()).to.be.true
     }
 
     await respondWithError('cannot_invite_non_user')
@@ -809,13 +757,25 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('handles switching between access levels', async function () {
+    fetchMock.get(`/project/${shareModalProjectDefaults._id}/tokens`, {})
     fetchMock.post('express:/project/:projectId/settings/admin', 204)
 
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: {
-        project: { ...project, publicAccesLevel: 'private' },
-      },
-    })
+    let setPublicAccessLevel = function () {}
+
+    function WrappedModal() {
+      const { updateProject } = useProjectContext()
+      setPublicAccessLevel = publicAccessLevel => {
+        updateProject({ publicAccessLevel })
+      }
+      return <ShareProjectModal {...modalProps} />
+    }
+
+    renderWithEditorContext(
+      <WrappedModal />,
+      createContextProps({
+        publicAccessLevel: 'private',
+      })
+    )
 
     await screen.findByText('Link sharing is off')
 
@@ -825,18 +785,15 @@ describe('<ShareProjectModal/>', function () {
     fireEvent.click(enableButton)
     await waitFor(() => expect(enableButton.disabled).to.be.true)
 
-    const { body: tokenBody } = fetchMock.lastOptions()
+    const { body: tokenBody } = fetchMock.callHistory.calls().at(-1).options
     expect(JSON.parse(tokenBody)).to.deep.equal({
       publicAccessLevel: 'tokenBased',
     })
 
-    // NOTE: updating the scoped project data manually,
-    // as the project data is usually updated via the websocket connection
-    window.overleaf.unstable.store.set('project', {
-      ...project,
-      publicAccesLevel: 'tokenBased',
-    })
-    // watchCallbacks.project({ ...project, publicAccesLevel: 'tokenBased' })
+    // NOTE: the project data is usually updated via the websocket connection
+    // but we can't do that so we're doing it via the project context, which is
+    // exposed in a hacky way here
+    setPublicAccessLevel('tokenBased')
 
     await screen.findByText('Link sharing is on')
     const disableButton = await screen.findByRole('button', {
@@ -845,32 +802,27 @@ describe('<ShareProjectModal/>', function () {
     fireEvent.click(disableButton)
     await waitFor(() => expect(disableButton.disabled).to.be.true)
 
-    const { body: privateBody } = fetchMock.lastOptions()
+    const { body: privateBody } = fetchMock.callHistory.calls().at(-1).options
     expect(JSON.parse(privateBody)).to.deep.equal({
       publicAccessLevel: 'private',
     })
 
-    // NOTE: updating the scoped project data manually,
-    // as the project data is usually updated via the websocket connection
-    window.overleaf.unstable.store.set('project', {
-      ...project,
-      publicAccesLevel: 'private',
-    })
-    // watchCallbacks.project({ ...project, publicAccesLevel: 'private' })
+    setPublicAccessLevel('private')
 
     await screen.findByText('Link sharing is off')
   })
 
   it('avoids selecting unmatched contact', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps()
+    )
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
 
     // Wait for contacts to load
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     // Enter a prefix that matches a contact
@@ -916,15 +868,16 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('selects contact by typing the entire email and blurring the input', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps()
+    )
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
 
     // Wait for contacts to load
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     // Enter a prefix that matches a contact
@@ -951,15 +904,16 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('selects contact by typing a partial email and selecting the suggestion', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps()
+    )
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
 
     // Wait for contacts to load
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     // Enter a prefix that matches a contact
@@ -985,15 +939,16 @@ describe('<ShareProjectModal/>', function () {
   })
 
   it('allows an email address to be selected, removed, then re-added', async function () {
-    renderWithEditorContext(<ShareProjectModal {...modalProps} />, {
-      scope: { project },
-    })
+    renderWithEditorContext(
+      <ShareProjectModal {...modalProps} />,
+      createContextProps()
+    )
 
     const [inputElement] = await screen.findAllByLabelText('Add people')
 
     // Wait for contacts to load
     await waitFor(() => {
-      expect(fetchMock.called('express:/user/contacts')).to.be.true
+      expect(fetchMock.callHistory.called('express:/user/contacts')).to.be.true
     })
 
     // Enter a prefix that matches a contact
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-autocomplete.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-autocomplete.spec.tsx
index 46f0709614..fc8831efd5 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-autocomplete.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-autocomplete.spec.tsx
@@ -64,7 +64,6 @@ describe('autocomplete', { scrollBehavior: false }, function () {
     ]
 
     const scope = mockScope()
-    scope.project.rootFolder = rootFolder
 
     cy.mount(
       <TestContainer>
@@ -307,7 +306,7 @@ describe('autocomplete', { scrollBehavior: false }, function () {
       packageNames: new Set(['foo']),
     }
 
-    const MetadataProvider: FC = ({ children }) => {
+    const MetadataProvider: FC<React.PropsWithChildren> = ({ children }) => {
       return (
         <MetadataContext.Provider value={metadata}>
           {children}
@@ -376,7 +375,7 @@ describe('autocomplete', { scrollBehavior: false }, function () {
 
     const scope = mockScope()
 
-    const ReferencesProvider: FC = ({ children }) => {
+    const ReferencesProvider: FC<React.PropsWithChildren> = ({ children }) => {
       return (
         <ReferencesContext.Provider
           value={{
@@ -446,7 +445,6 @@ describe('autocomplete', { scrollBehavior: false }, function () {
     ]
 
     const scope = mockScope()
-    scope.project.rootFolder = rootFolder
 
     cy.mount(
       <TestContainer>
@@ -728,7 +726,7 @@ describe('autocomplete', { scrollBehavior: false }, function () {
       packageNames: new Set<string>('amsmath'),
     }
 
-    const MetadataProvider: FC = ({ children }) => {
+    const MetadataProvider: FC<React.PropsWithChildren> = ({ children }) => {
       return (
         <MetadataContext.Provider value={metadata}>
           {children}
@@ -910,7 +908,6 @@ describe('autocomplete', { scrollBehavior: false }, function () {
     ]
 
     const scope = mockScope()
-    scope.project.rootFolder = rootFolder
 
     cy.mount(
       <TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-figure-modal.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-figure-modal.spec.tsx
index 0986e0ee41..22a99e1fc7 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-figure-modal.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-figure-modal.spec.tsx
@@ -1,10 +1,16 @@
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+  makeProjectProvider,
+  USER_ID,
+} from '../../../helpers/editor-providers'
 import { mockScope, rootFolderId } from '../helpers/mock-scope'
 import { FC } from 'react'
 import { FileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import { TestContainer } from '../helpers/test-container'
 import getMeta from '@/utils/meta'
+import { mockProject } from '../helpers/mock-project'
 
 const clickToolbarButton = (text: string) => {
   cy.findByLabelText(text).click()
@@ -41,9 +47,15 @@ describe('<FigureModal />', function () {
   function mount() {
     const content = ''
     const scope = mockScope(content)
-    scope.editor.showVisual = true
+    const project = mockProject({
+      projectOwner: {
+        _id: USER_ID,
+      },
+    })
 
-    const FileTreePathProvider: FC = ({ children }) => (
+    const FileTreePathProvider: FC<React.PropsWithChildren> = ({
+      children,
+    }) => (
       <FileTreePathContext.Provider
         value={{
           dirname: cy.stub(),
@@ -61,7 +73,17 @@ describe('<FigureModal />', function () {
 
     cy.mount(
       <TestContainer>
-        <EditorProviders scope={scope} providers={{ FileTreePathProvider }}>
+        <EditorProviders
+          scope={scope}
+          providers={{
+            FileTreePathProvider,
+            ProjectProvider: makeProjectProvider(project),
+            EditorPropertiesProvider: makeEditorPropertiesProvider({
+              showVisual: true,
+              showSymbolPalette: false,
+            }),
+          }}
+        >
           <CodemirrorEditor />
         </EditorProviders>
       </TestContainer>
@@ -104,9 +126,11 @@ describe('<FigureModal />', function () {
         matchUrl(`/project/test-project/upload?folder_id=${rootFolderId}`)
       )
 
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
       )
     })
 
@@ -126,7 +150,7 @@ describe('<FigureModal />', function () {
     })
 
     it('Lists files from project', function () {
-      cy.findByRole('textbox', { name: 'Image file' }).click()
+      cy.findByRole('combobox', { name: 'Image file' }).click()
       cy.findByRole('listbox')
         .children()
         .should('have.length', 2)
@@ -137,7 +161,7 @@ describe('<FigureModal />', function () {
 
     it('Enables insert button when choosing file', function () {
       cy.findByRole('button', { name: 'Insert figure' }).should('be.disabled')
-      cy.findByRole('textbox', { name: 'Image file' }).click()
+      cy.findByRole('combobox', { name: 'Image file' }).click()
       cy.findByRole('listbox').within(() => {
         cy.findByText('frog.jpg').click()
       })
@@ -145,14 +169,17 @@ describe('<FigureModal />', function () {
     })
 
     it('Inserts file when pressing insert button', function () {
-      cy.findByRole('textbox', { name: 'Image file' }).click()
+      cy.findByRole('combobox', { name: 'Image file' }).click()
       cy.findByRole('listbox').within(() => {
         cy.findByText('frog.jpg').click()
       })
       cy.findByRole('button', { name: 'Insert figure' }).click()
+
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
       )
     })
   })
@@ -166,8 +193,8 @@ describe('<FigureModal />', function () {
       cy.findByRole('menu').within(() => {
         cy.findByRole('button', { name: 'From another project' }).click()
       })
-      cy.findByRole('textbox', { name: 'Project' }).as('project-dropdown')
-      cy.findByRole('textbox', { name: 'Image file' }).as('file-dropdown')
+      cy.findByRole('combobox', { name: 'Project' }).as('project-dropdown')
+      cy.findByRole('combobox', { name: 'Image file' }).as('file-dropdown')
     })
 
     it('List projects and files in projects', function () {
@@ -203,6 +230,19 @@ describe('<FigureModal />', function () {
       cy.findByRole('button', { name: 'Insert figure' }).should('be.enabled')
     })
 
+    it('Closes project dropdown on pressing Esc key but leaves modal open', function () {
+      cy.findByRole('button', { name: 'Insert figure' }).should('be.disabled')
+      cy.get('@project-dropdown').click()
+      cy.findByRole('listbox').should('exist')
+      cy.get('@project-dropdown').type('{esc}', { force: true })
+      cy.findByRole('listbox').should('not.exist')
+      cy.findByRole('dialog').should('exist')
+
+      // Check that a subsequent press of the Esc key closes the modal
+      cy.get('@project-dropdown').type('{esc}', { force: true })
+      cy.findByRole('dialog').should('not.exist')
+    })
+
     it('Creates linked file when pressing insert', function () {
       cy.get('@project-dropdown').click()
       cy.findByRole('listbox').within(() => {
@@ -223,9 +263,11 @@ describe('<FigureModal />', function () {
         },
       })
 
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
       )
     })
 
@@ -235,7 +277,7 @@ describe('<FigureModal />', function () {
         cy.findByRole('option', { name: 'My first project' }).click()
       })
       cy.findByRole('button', { name: 'select from output files' }).click()
-      cy.findByRole('textbox', { name: 'Output file' }).click()
+      cy.findByRole('combobox', { name: 'Output file' }).click()
       cy.findByRole('listbox').within(() => {
         cy.findByRole('option', { name: 'output.pdf' }).click()
       })
@@ -250,9 +292,11 @@ describe('<FigureModal />', function () {
         },
       })
 
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
       )
     })
   })
@@ -298,7 +342,7 @@ describe('<FigureModal />', function () {
       cy.findByRole('menu').within(() => {
         cy.findByText('From another project').click()
       })
-      cy.findByRole('textbox', { name: 'Project' }).click()
+      cy.findByRole('combobox', { name: 'Project' }).click()
       cy.findByRole('listbox').within(() => {
         cy.findByRole('option', { name: 'My first project' }).click()
       })
@@ -322,7 +366,7 @@ describe('<FigureModal />', function () {
       })
       expectNoOutputSwitch()
       it('should show output file selector', function () {
-        cy.findByRole('textbox', { name: 'Output file' }).click()
+        cy.findByRole('combobox', { name: 'Output file' }).click()
         cy.findByRole('listbox').within(() => {
           cy.findByRole('option', { name: 'output.pdf' }).click()
         })
@@ -341,7 +385,7 @@ describe('<FigureModal />', function () {
       expectNoOutputSwitch()
 
       it('should show source file selector', function () {
-        cy.findByRole('textbox', { name: 'Image file' }).click()
+        cy.findByRole('combobox', { name: 'Image file' }).click()
         cy.findByRole('listbox').within(() => {
           cy.findByRole('option', { name: 'frog.jpg' }).click()
         })
@@ -394,9 +438,11 @@ describe('<FigureModal />', function () {
         },
       })
 
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{Enter Caption}    🏷fig:enter-label\\end{figure}'
       )
     })
 
@@ -420,9 +466,12 @@ describe('<FigureModal />', function () {
 
       // If caption is selected then typing will replace the whole caption
       cy.focused().type('My caption')
+
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\caption{My caption}    🏷fig:enter-label\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\caption{My caption}    🏷fig:enter-label\\end{figure}'
       )
     })
 
@@ -447,9 +496,12 @@ describe('<FigureModal />', function () {
 
       // If label is selected then typing will replace the whole label
       cy.focused().type('fig:my-label')
+
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering    \\label{fig:my-label}\\end{figure}'
+        '\\begin{figure}    \\centeringedit    \\label{fig:my-label}\\end{figure}'
       )
     })
 
@@ -469,16 +521,18 @@ describe('<FigureModal />', function () {
         },
       })
 
+      // Note that we have to include the 'edit' text from the edit button's
+      // icon, which is literal text in the document
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering\\end{figure}'
+        '\\begin{figure}    \\centeringedit\\end{figure}'
       )
 
       cy.focused().type('Some more text')
 
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}    \\centering\\end{figure}Some more text'
+        '\\begin{figure}    \\centeringedit\\end{figure}Some more text'
       )
     })
   })
@@ -494,7 +548,7 @@ describe('<FigureModal />', function () {
 \\end{{}figure}`,
         { delay: 0 }
       )
-      cy.get('[aria-label="Edit figure"]').click()
+      cy.get('[aria-label="Edit figure"]').click({ force: true })
       cy.findByRole('checkbox', { name: 'Include caption' }).should(
         'be.checked'
       )
@@ -511,7 +565,7 @@ describe('<FigureModal />', function () {
 \\end{{}figure}`,
         { delay: 0 }
       )
-      cy.get('[aria-label="Edit figure"]').click()
+      cy.get('[aria-label="Edit figure"]').click({ force: true })
       cy.get('[value="0.75"]').should('be.checked')
     })
 
@@ -524,7 +578,7 @@ describe('<FigureModal />', function () {
 \\end{{}figure}`,
         { delay: 0 }
       )
-      cy.get('[aria-label="Edit figure"]').click()
+      cy.get('[aria-label="Edit figure"]').click({ force: true })
       cy.findByRole('checkbox', { name: 'Include label' }).click()
       cy.findByRole('checkbox', { name: 'Include label' }).should(
         'not.be.checked'
@@ -532,7 +586,7 @@ describe('<FigureModal />', function () {
       cy.findByText('Done').click()
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}\\centering\\end{figure}'
+        '\\begin{figure}\\centering\\includegraphics[width=0.75\\linewidth]{frog.jpg}\\end{figure}'
       )
     })
 
@@ -546,7 +600,7 @@ describe('<FigureModal />', function () {
 \\end{{}figure}`,
         { delay: 0 }
       )
-      cy.get('[aria-label="Edit figure"]').click()
+      cy.get('[aria-label="Edit figure"]').click({ force: true })
       cy.findByRole('checkbox', { name: 'Include caption' }).click()
       cy.findByRole('checkbox', { name: 'Include caption' }).should(
         'not.be.checked'
@@ -554,7 +608,7 @@ describe('<FigureModal />', function () {
       cy.findByText('Done').click()
       cy.get('.cm-content').should(
         'have.text',
-        '\\begin{figure}\\centering🏷fig:my-label\\end{figure}'
+        '\\begin{figure}\\centering\\includegraphics[width=0.75\\linewidth]{frog.jpg}🏷fig:my-label\\end{figure}'
       )
     })
 
@@ -570,7 +624,7 @@ describe('<FigureModal />', function () {
 text below`,
         { delay: 0 }
       )
-      cy.get('[aria-label="Edit figure"]').click()
+      cy.get('[aria-label="Edit figure"]').click({ force: true })
       cy.findByRole('button', { name: 'Remove or replace figure' }).click()
       cy.findByText('Delete figure').click()
       cy.get('.cm-content').should('have.text', 'text abovetext below')
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-spellchecker-client.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-spellchecker-client.spec.tsx
index ee96d76d53..3677884a0c 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-spellchecker-client.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-spellchecker-client.spec.tsx
@@ -1,9 +1,13 @@
 import { mockScope } from '../helpers/mock-scope'
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeProjectProvider,
+} from '../../../helpers/editor-providers'
 import CodeMirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { TestContainer } from '../helpers/test-container'
 import forEach from 'mocha-each'
 import PackageVersions from '../../../../../app/src/infrastructure/PackageVersions'
+import { mockProject } from '../helpers/mock-project'
 
 const languages = [
   { code: 'af', dic: 'af_ZA', name: 'Afrikaans' },
@@ -125,11 +129,14 @@ forEach(Object.keys(suggestions)).describe(
       cy.interceptEvents()
 
       const scope = mockScope(content)
-      scope.project.spellCheckLanguage = spellCheckLanguage
+      const project = mockProject({ spellCheckLanguage })
 
       cy.mount(
         <TestContainer>
-          <EditorProviders scope={scope}>
+          <EditorProviders
+            scope={scope}
+            providers={{ ProjectProvider: makeProjectProvider(project) }}
+          >
             <CodeMirrorEditor />
           </EditorProviders>
         </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-table-generator.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-table-generator.spec.tsx
index b391a85222..18422c1ff0 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-table-generator.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-table-generator.spec.tsx
@@ -1,6 +1,9 @@
 // Needed since eslint gets confused by mocha-each
 /* eslint-disable mocha/prefer-arrow-callback */
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import forEach from 'mocha-each'
@@ -14,11 +17,18 @@ const mountEditor = (content: string | string[]) => {
     content = '\n' + content
   }
   const scope = mockScope(content)
-  scope.editor.showVisual = true
   cy.viewport(1000, 800)
   cy.mount(
     <TestContainer style={{ width: 1000, height: 800 }}>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
@@ -108,7 +118,7 @@ describe('<CodeMirrorEditor/> Table editor', function () {
     cy.interceptEvents()
 
     cy.interceptMathJax()
-    cy.interceptCompile('compile', Number.MAX_SAFE_INTEGER)
+    cy.interceptCompile({ prefix: 'compile', times: Number.MAX_SAFE_INTEGER })
     cy.intercept('/project/*/doc/*/metadata', { body: {} })
     window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
   })
@@ -178,7 +188,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Adds and removes borders when theme is changed', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{c|c}
     cell 1 & cell 2 \\\\
     cell 3 & cell 4 \\\\
@@ -215,8 +227,45 @@ cell 3 & cell 4 \\\\
       )
     })
 
-    it('Changes the column alignment with dropdown buttons', function () {
+    it('Correctly sets borders for booktabs', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
+\\begin{tabular}{c|c}
+    cell 1 & cell 2 \\\\
+    cell 3 & cell 4 \\\\
+    cell 5 & cell 6 \\\\
+\\end{tabular}
+`)
+      checkBordersWithNoMultiColumn(
+        [false, false, false, false],
+        [false, true, false]
+      )
+      cy.get('.table-generator-floating-toolbar').should('not.exist')
+      cy.get('.table-generator-cell').first().click()
+      cy.get('.table-generator-floating-toolbar').as('toolbar').should('exist')
+      cy.get('@toolbar').findByText('Custom borders').click({ force: true })
+      cy.get('.table-generator').findByText('Booktabs').click()
+      // The element is partially covered, but we can still click it
+      cy.get('.cm-line').first().click({ force: true })
+      // Table should be unchanged
+      checkTable([
+        ['cell 1', 'cell 2'],
+        ['cell 3', 'cell 4'],
+        ['cell 5', 'cell 6'],
+      ])
+      checkBordersWithNoMultiColumn(
+        [true, true, false, true],
+        [false, false, false]
+      )
+      cy.get('.table-generator-cell').first().click()
+      cy.get('@toolbar').findByText('Booktabs').should('exist')
+    })
+
+    it('Changes the column alignment with dropdown buttons', function () {
+      // Add a blank line above the table to allow room for the table toolbar
+      mountEditor(`
+
 \\begin{tabular}{cc}
     cell 1 & cell 2 \\\\
     cell 3 & cell 4 \\\\
@@ -269,7 +318,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Removes rows and columns', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{|c|c|c|}
     \\hline
     cell 1 & cell 2 & cell 3 \\\\ \\hline
@@ -304,7 +355,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Removes rows correctly when removing from the left', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{|c|c|c|}\\hline
     cell 1&cell 2&cell 3 \\\\\\hline
 \\end{tabular}
@@ -324,7 +377,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Merges and unmerged cells', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{ccc}
     cell 1 & cell 2 & cell 3 \\\\
     cell 4 & cell 5 & cell 6 \\\\
@@ -333,6 +388,7 @@ cell 3 & cell 4 \\\\
       cy.get('.table-generator-cell').first().click()
       cy.get('.table-generator-cell').first().type('{shift}{rightarrow}')
       cy.get('.table-generator-floating-toolbar').as('toolbar').should('exist')
+      cy.get('@toolbar').scrollIntoView()
       cy.get('@toolbar').findByLabelText('Merge cells').click()
       checkTable([
         [{ text: 'cell 1 cell 2', colspan: 2 }, 'cell 3'],
@@ -346,7 +402,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Adds rows and columns', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{c}
     cell 1
 \\end{tabular}
@@ -398,7 +456,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Removes the table on toolbar button click', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{c}
     cell 1
 \\end{tabular}`)
@@ -409,7 +469,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Moves the caption when using dropdown', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{table}
   \\caption{Table caption}
   \\label{tab:table}
@@ -456,7 +518,9 @@ cell 3 & cell 4 \\\\
     })
 
     it('Renders a table with custom column spacing', function () {
+      // Add a blank line above the table to allow room for the table toolbar
       mountEditor(`
+
 \\begin{tabular}{@{}c@{}l!{}}
   cell 1 & cell 2 \\\\
   cell 3 & cell 4 \\\\
@@ -498,8 +562,10 @@ cell 3 & cell 4 \\\\
 
     describe('Fixed width columns', function () {
       it('Can add fixed width columns', function () {
+        // Add a blank line above the table to allow room for the table toolbar
         // Check that no column indicators exist
         mountEditor(`
+
         \\begin{tabular}{cc}
         cell 1 & cell 2\\\\
         cell 3 & cell 4 \\\\
@@ -574,9 +640,11 @@ cell 3 & cell 4 \\\\
         }
       )
 
-      it(`It can justify fixed width cells`, function () {
+      it(`Can justify fixed width cells`, function () {
+        // Add a blank line above the table to allow room for the table toolbar
         // Check that no column indicators exist
         mountEditor(`
+
         \\begin{tabular}{>{\\raggedright\\arraybackslash}p{2cm}c}
         cell 1 & cell 2\\\\
         cell 3 & cell 4 \\\\
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-command-tooltip.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-command-tooltip.spec.tsx
index 28f1363829..7ffd4f0fcd 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-command-tooltip.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-command-tooltip.spec.tsx
@@ -1,15 +1,30 @@
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+  makeProjectProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import { TestContainer } from '../helpers/test-container'
+import { mockProject } from '../helpers/mock-project'
 
 const mountEditor = (content: string) => {
   const scope = mockScope(content)
-  scope.editor.showVisual = true
+
+  const project = mockProject()
 
   cy.mount(
     <TestContainer>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          ProjectProvider: makeProjectProvider(project),
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-floats.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-floats.spec.tsx
index 0e406418fa..3433205a9f 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-floats.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-floats.spec.tsx
@@ -1,15 +1,25 @@
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import { TestContainer } from '../helpers/test-container'
 
 const mountEditor = (content: string) => {
   const scope = mockScope(content)
-  scope.editor.showVisual = true
 
   cy.mount(
     <TestContainer>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-list.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-list.spec.tsx
index f2ae1df68e..ca7efaca04 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-list.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-list.spec.tsx
@@ -1,16 +1,30 @@
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+  makeProjectProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import { TestContainer } from '../helpers/test-container'
 import { isMac } from '@/shared/utils/os'
+import { mockProject } from '../helpers/mock-project'
 
 const mountEditor = (content: string) => {
   const scope = mockScope(content)
-  scope.editor.showVisual = true
+  const project = mockProject()
 
   cy.mount(
     <TestContainer>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          ProjectProvider: makeProjectProvider(project),
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-paste-html.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-paste-html.spec.tsx
index 450af37a5a..8173cefb9d 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-paste-html.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-paste-html.spec.tsx
@@ -1,4 +1,7 @@
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import { TestContainer } from '../helpers/test-container'
@@ -7,11 +10,18 @@ const menuIconsText = 'content_copyexpand_more'
 
 const mountEditor = (content = '') => {
   const scope = mockScope(content)
-  scope.editor.showVisual = true
 
   cy.mount(
     <TestContainer>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
@@ -227,6 +237,40 @@ describe('<CodeMirrorEditor/> paste HTML in Visual mode', function () {
     cy.get('.table-generator-cell[colspan="2"]').should('have.length', 2)
   })
 
+  it('handles a pasted 1-row table with merged columns', function () {
+    mountEditor()
+
+    const data = [
+      `<table><tbody>`,
+      `<tr><td>test</td><td colspan="2">test</td></tr>`,
+      `</tbody></table>`,
+    ].join('')
+
+    const clipboardData = new DataTransfer()
+    clipboardData.setData('text/html', data)
+    cy.get('@content').trigger('paste', { clipboardData })
+
+    cy.get('@content').should('have.text', 'testtest' + menuIconsText)
+    cy.get('.table-generator-cell').should('have.length', 2)
+    cy.get('.table-generator-cell[colspan="2"]').should('have.length', 1)
+  })
+
+  it('handles a pasted table with a bordered merged column', function () {
+    mountEditor()
+
+    const data = [
+      `<table><tbody>`,
+      `<tr><td style="border-right:1px solid black;border-left:1px solid black;">test</td></tr>`,
+      `</tbody></table>`,
+    ].join('')
+
+    const clipboardData = new DataTransfer()
+    clipboardData.setData('text/html', data)
+    cy.get('@content').trigger('paste', { clipboardData })
+    cy.get('.table-generator-cell-border-right').should('have.length', 1)
+    cy.get('.table-generator-cell-border-left').should('have.length', 1)
+  })
+
   it('handles a pasted table with merged rows', function () {
     mountEditor()
 
@@ -312,8 +356,8 @@ describe('<CodeMirrorEditor/> paste HTML in Visual mode', function () {
     cy.get('@content').should('have.text', 'foofoobarfoobar' + menuIconsText)
     cy.get('.table-generator-cell').should('have.length', 5)
     cy.get('.table-generator-cell[colspan="2"]').should('have.length', 1)
-    cy.get('.table-generator-cell-border-left').should('have.length', 2)
-    cy.get('.table-generator-cell-border-right').should('have.length', 4)
+    cy.get('.table-generator-cell-border-left').should('have.length', 3)
+    cy.get('.table-generator-cell-border-right').should('have.length', 5)
     cy.get('.table-generator-row-border-top').should('have.length', 5)
     cy.get('.table-generator-row-border-bottom').should('have.length', 2)
   })
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-readonly.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-readonly.spec.tsx
index c51ae8b68d..5e05429212 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-readonly.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-readonly.spec.tsx
@@ -1,12 +1,15 @@
 import { mockScope } from '../helpers/mock-scope'
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { FC } from 'react'
 import { FileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
 import { TestContainer } from '../helpers/test-container'
 import { PermissionsContext } from '@/features/ide-react/context/permissions-context'
 
-const FileTreePathProvider: FC = ({ children }) => (
+const FileTreePathProvider: FC<React.PropsWithChildren> = ({ children }) => (
   <FileTreePathContext.Provider
     value={{
       dirname: cy.stub(),
@@ -22,7 +25,7 @@ const FileTreePathProvider: FC = ({ children }) => (
   </FileTreePathContext.Provider>
 )
 
-const PermissionsProvider: FC = ({ children }) => (
+const PermissionsProvider: FC<React.PropsWithChildren> = ({ children }) => (
   <PermissionsContext.Provider
     value={{
       read: true,
@@ -43,13 +46,19 @@ const mountEditor = (content: string) => {
   const scope = mockScope(content)
   scope.permissions.write = false
   scope.permissions.trackedWrite = false
-  scope.editor.showVisual = true
 
   cy.mount(
     <TestContainer>
       <EditorProviders
         scope={scope}
-        providers={{ FileTreePathProvider, PermissionsProvider }}
+        providers={{
+          FileTreePathProvider,
+          PermissionsProvider,
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
       >
         <CodemirrorEditor />
       </EditorProviders>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-toolbar.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-toolbar.spec.tsx
index dc34940772..542f1ce662 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-toolbar.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-toolbar.spec.tsx
@@ -1,4 +1,7 @@
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import { TestContainer } from '../helpers/test-container'
@@ -18,11 +21,18 @@ const clickToolbarButton = (name: string) => {
 
 const mountEditor = (content: string) => {
   const scope = mockScope(content)
-  scope.editor.showVisual = true
 
   cy.mount(
     <TestContainer>
-      <EditorProviders scope={scope}>
+      <EditorProviders
+        scope={scope}
+        providers={{
+          EditorPropertiesProvider: makeEditorPropertiesProvider({
+            showVisual: true,
+            showSymbolPalette: false,
+          }),
+        }}
+      >
         <CodemirrorEditor />
       </EditorProviders>
     </TestContainer>
@@ -121,7 +131,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Bullet List')
 
     cy.get('.cm-content').should('have.text', ' test')
@@ -134,7 +144,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     cy.get('.cm-content').should('have.text', ' test')
@@ -147,7 +157,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     // expose the markup
@@ -180,7 +190,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     // expose the markup
@@ -205,7 +215,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test\ntest')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     // expose the markup
@@ -242,7 +252,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
 
     cy.get('.cm-line').eq(1).click()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     cy.get('.cm-line').eq(0).type('{upArrow}')
@@ -263,7 +273,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
     mountEditor('test\ntest')
     selectAll()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     // expose the markup
@@ -300,7 +310,7 @@ describe('<CodeMirrorEditor/> toolbar in Rich Text mode', function () {
 
     cy.get('.cm-line').eq(0).click()
 
-    clickToolbarButton('More')
+    clickToolbarButton('More editor toolbar items')
     clickToolbarButton('Numbered List')
 
     // expose the markup
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-tooltips.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-tooltips.spec.tsx
index 7dcc10d72c..2afed2b813 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-tooltips.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual-tooltips.spec.tsx
@@ -1,5 +1,8 @@
 import { mockScope } from '../helpers/mock-scope'
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { TestContainer } from '../helpers/test-container'
 
@@ -11,11 +14,18 @@ describe('<CodeMirrorEditor/> tooltips in Visual mode', function () {
     cy.interceptEvents()
 
     const scope = mockScope('\n\n\n')
-    scope.editor.showVisual = true
 
     cy.mount(
       <TestContainer>
-        <EditorProviders scope={scope}>
+        <EditorProviders
+          scope={scope}
+          providers={{
+            EditorPropertiesProvider: makeEditorPropertiesProvider({
+              showVisual: true,
+              showSymbolPalette: false,
+            }),
+          }}
+        >
           <CodemirrorEditor />
         </EditorProviders>
       </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual.spec.tsx
index d8c88b46d2..45f68f359b 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor-visual.spec.tsx
@@ -1,7 +1,10 @@
 // Needed since eslint gets confused by mocha-each
 /* eslint-disable mocha/prefer-arrow-callback */
 import { FC } from 'react'
-import { EditorProviders } from '../../../helpers/editor-providers'
+import {
+  EditorProviders,
+  makeEditorPropertiesProvider,
+} from '../../../helpers/editor-providers'
 import CodemirrorEditor from '../../../../../frontend/js/features/source-editor/components/codemirror-editor'
 import { mockScope } from '../helpers/mock-scope'
 import forEach from 'mocha-each'
@@ -19,9 +22,10 @@ describe('<CodeMirrorEditor/> in Visual mode', function () {
     const content = '\n'.repeat(3)
 
     const scope = mockScope(content)
-    scope.editor.showVisual = true
 
-    const FileTreePathProvider: FC = ({ children }) => (
+    const FileTreePathProvider: FC<React.PropsWithChildren> = ({
+      children,
+    }) => (
       <FileTreePathContext.Provider
         value={{
           dirname: cy.stub(),
@@ -39,7 +43,16 @@ describe('<CodeMirrorEditor/> in Visual mode', function () {
 
     cy.mount(
       <TestContainer>
-        <EditorProviders scope={scope} providers={{ FileTreePathProvider }}>
+        <EditorProviders
+          scope={scope}
+          providers={{
+            FileTreePathProvider,
+            EditorPropertiesProvider: makeEditorPropertiesProvider({
+              showVisual: true,
+              showSymbolPalette: false,
+            }),
+          }}
+        >
           <CodemirrorEditor />
         </EditorProviders>
       </TestContainer>
diff --git a/services/web/test/frontend/features/source-editor/components/codemirror-editor.spec.tsx b/services/web/test/frontend/features/source-editor/components/codemirror-editor.spec.tsx
index a280367c7d..b64e66734f 100644
--- a/services/web/test/frontend/features/source-editor/components/codemirror-editor.spec.tsx
+++ b/services/web/test/frontend/features/source-editor/components/codemirror-editor.spec.tsx
@@ -7,12 +7,16 @@ import { activeEditorLine } from '../helpers/active-editor-line'
 import { TestContainer } from '../helpers/test-container'
 import customLocalStorage from '@/infrastructure/local-storage'
 import { OnlineUsersContext } from '@/features/ide-react/context/online-users-context'
-import { FC } from 'react'
+import { LocalCompileContext } from '@/shared/context/local-compile-context'
+import type { FC, PropsWithChildren } from 'react'
+import type { Annotation } from '../../../../../types/annotation'
 
 describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
   beforeEach(function () {
     window.metaAttributesCache.set('ol-preventCompileOnLoad', true)
     cy.interceptEvents()
+    cy.intercept('GET', '/project/*/changes/users', [])
+    cy.intercept('GET', '/project/*/threads', {})
   })
 
   it('deletes selected text on Backspace', function () {
@@ -62,27 +66,39 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
   it('renders annotations in the gutter', function () {
     const scope = mockScope()
 
-    scope.pdf.logEntryAnnotations = {
+    const logEntryAnnotations: Record<string, Annotation[]> = {
       [docId]: [
         {
+          id: '1',
+          entryIndex: 1,
           row: 20,
           type: 'error',
           text: 'Another error',
+          firstOnLine: true,
         },
         {
+          id: '2',
+          entryIndex: 2,
           row: 19,
           type: 'error',
           text: 'An error',
+          firstOnLine: true,
         },
         {
+          id: '3',
+          entryIndex: 3,
           row: 20,
           type: 'warning',
           text: 'A warning on the same line',
+          firstOnLine: false,
         },
         {
+          id: '4',
+          entryIndex: 4,
           row: 25,
           type: 'warning',
           text: 'Another warning',
+          firstOnLine: true,
         },
       ],
     }
@@ -91,9 +107,19 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
 
     cy.clock()
 
+    const LocalCompileProvider: FC<PropsWithChildren> = ({ children }) => (
+      // @ts-expect-error: not entering all the values for LocalCompileContext
+      <LocalCompileContext.Provider value={{ logEntryAnnotations }}>
+        {children}
+      </LocalCompileContext.Provider>
+    )
     cy.mount(
       <TestContainer>
-        <EditorProviders scope={scope} userSettings={userSettings}>
+        <EditorProviders
+          scope={scope}
+          userSettings={userSettings}
+          providers={{ LocalCompileProvider }}
+        >
           <CodeMirrorEditor />
         </EditorProviders>
       </TestContainer>
@@ -216,7 +242,7 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
       onlineUsersCount: 3,
     }
 
-    const OnlineUsersProvider: FC = ({ children }) => {
+    const OnlineUsersProvider: FC<React.PropsWithChildren> = ({ children }) => {
       return (
         <OnlineUsersContext.Provider value={value}>
           {children}
@@ -519,6 +545,9 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
       cy.findByLabelText('Within selection').as('within-selection-label')
       cy.findByRole('button', { name: 'Replace' }).as('replace')
       cy.findByRole('button', { name: 'Replace All' }).as('replace-all')
+      cy.findByRole('button', { name: 'Search all project files' }).as(
+        'search-project'
+      )
       cy.findByRole('button', { name: 'previous' }).as('find-previous')
       cy.findByRole('button', { name: 'next' }).as('find-next')
       cy.findByRole('button', { name: 'Close' }).as('close')
@@ -532,6 +561,7 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
       cy.get('@within-selection').should('be.focused').tab()
       cy.get('@find-previous').should('be.focused').tab()
       cy.get('@find-next').should('be.focused').tab()
+      cy.get('@search-project').should('be.focused').tab()
       cy.get('@replace').should('be.focused').tab()
       cy.get('@replace-all').should('be.focused').tab()
 
@@ -539,6 +569,7 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
       cy.get('@close').should('be.focused').tab({ shift: true })
       cy.get('@replace-all').should('be.focused').tab({ shift: true })
       cy.get('@replace').should('be.focused').tab({ shift: true })
+      cy.get('@search-project').should('be.focused').tab({ shift: true })
       cy.get('@find-next').should('be.focused').tab({ shift: true })
       cy.get('@find-previous').should('be.focused').tab({ shift: true })
       cy.get('@within-selection').should('be.focused').tab({ shift: true })
@@ -591,7 +622,7 @@ describe('<CodeMirrorEditor/>', { scrollBehavior: false }, function () {
 
         const rect = selection.getRangeAt(0).getBoundingClientRect()
         expect(Math.round(rect.top)).to.be.gte(100)
-        expect(Math.round(rect.left)).to.be.gte(90)
+        expect(Math.round(rect.left)).to.be.gte(80)
       })
   })
 })
diff --git a/services/web/test/frontend/features/source-editor/helpers/mock-doc.ts b/services/web/test/frontend/features/source-editor/helpers/mock-doc.ts
index 91f6cc6eff..a4944c1e97 100644
--- a/services/web/test/frontend/features/source-editor/helpers/mock-doc.ts
+++ b/services/web/test/frontend/features/source-editor/helpers/mock-doc.ts
@@ -1,4 +1,4 @@
-import { ShareDoc } from '../../../../../types/share-doc'
+import { ShareLatexOTShareDoc } from '../../../../../types/share-doc'
 import { EventEmitter } from 'events'
 
 export const docId = 'test-doc'
@@ -36,6 +36,9 @@ const defaultContent = mockDocContent(contentLines.join('\n'))
 const MAX_DOC_LENGTH = 2 * 1024 * 1024 // ol-maxDocLength
 
 class MockShareDoc extends EventEmitter {
+  otType = 'sharejs-text-ot' as const
+  snapshot = ''
+
   constructor(public text: string) {
     super()
   }
@@ -51,13 +54,21 @@ class MockShareDoc extends EventEmitter {
   del() {
     // do nothing
   }
+
+  submitOp() {
+    // do nothing
+  }
 }
 
-export const mockDoc = (content = defaultContent) => {
-  const mockShareJSDoc: ShareDoc = new MockShareDoc(content)
+export const mockDoc = (
+  content = defaultContent,
+  { rangesOptions = {} } = {}
+) => {
+  const mockShareJSDoc: ShareLatexOTShareDoc = new MockShareDoc(content)
 
   return {
     doc_id: docId,
+    getType: () => 'sharejs-text-ot',
     getSnapshot: () => {
       return content
     },
@@ -92,10 +103,14 @@ export const mockDoc = (content = defaultContent) => {
         },
       }),
       resetDirtyState: () => {},
+      removeCommentId: () => {},
+      ...rangesOptions,
     },
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    submitOp: (op: any) => {},
     setTrackChangesIdSeeds: () => {},
     getTrackingChanges: () => true,
-    setTrackingChanges: () => {},
+    setTrackChangesUserId: () => {},
     getInflightOp: () => null,
     getPendingOp: () => null,
     hasBufferedOps: () => false,
diff --git a/services/web/test/frontend/features/source-editor/helpers/mock-project.ts b/services/web/test/frontend/features/source-editor/helpers/mock-project.ts
new file mode 100644
index 0000000000..f9848d1a96
--- /dev/null
+++ b/services/web/test/frontend/features/source-editor/helpers/mock-project.ts
@@ -0,0 +1,78 @@
+import { docId } from './mock-doc'
+import { Folder } from '../../../../../types/folder'
+import { UserId } from '../../../../../types/user'
+import { ProjectCompiler } from '../../../../../types/project-settings'
+
+export const rootFolderId = '012345678901234567890123'
+export const figuresFolderId = '123456789012345678901234'
+export const figureId = '234567890123456789012345'
+export const mockProject = ({
+  projectFeatures = {},
+  projectOwner = undefined,
+  spellCheckLanguage = 'en',
+  rootFolder = null,
+}: any = {}) => {
+  return {
+    _id: 'test-project',
+    name: 'Test Project',
+    spellCheckLanguage,
+    rootDocId: '_root_doc_id',
+    rootFolder:
+      rootFolder ||
+      ([
+        {
+          _id: rootFolderId,
+          name: 'rootFolder',
+          docs: [
+            {
+              _id: docId,
+              name: 'test.tex',
+            },
+          ],
+          folders: [
+            {
+              _id: figuresFolderId,
+              name: 'figures',
+              docs: [
+                {
+                  _id: 'fake-nested-doc-id',
+                  name: 'foo.tex',
+                },
+              ],
+              folders: [],
+              fileRefs: [
+                {
+                  _id: figureId,
+                  name: 'frog.jpg',
+                  hash: '42',
+                },
+                {
+                  _id: 'fake-figure-id',
+                  name: 'unicorn.png',
+                  hash: '43',
+                },
+              ],
+            },
+          ],
+          fileRefs: [],
+        },
+      ] as Folder[]),
+    features: {
+      trackChanges: true,
+      ...projectFeatures,
+    },
+    compiler: 'pdflatex' as ProjectCompiler,
+    imageName: 'texlive-full:2024.1',
+    trackChangesState: false,
+    invites: [],
+    members: [],
+    owner: projectOwner || {
+      _id: '124abd' as UserId,
+      email: 'owner@example.com',
+      first_name: 'Test',
+      last_name: 'Owner',
+      privileges: 'owner',
+      signUpDate: new Date('2025-07-07').toISOString(),
+    },
+  }
+}
diff --git a/services/web/test/frontend/features/source-editor/helpers/mock-scope.ts b/services/web/test/frontend/features/source-editor/helpers/mock-scope.ts
index 8eafae47c0..fd19ce4f85 100644
--- a/services/web/test/frontend/features/source-editor/helpers/mock-scope.ts
+++ b/services/web/test/frontend/features/source-editor/helpers/mock-scope.ts
@@ -1,85 +1,31 @@
 import { docId, mockDoc } from './mock-doc'
 import { sleep } from '../../../helpers/sleep'
-import { Folder } from '../../../../../types/folder'
 
 export const rootFolderId = '012345678901234567890123'
-export const figuresFolderId = '123456789012345678901234'
-export const figureId = '234567890123456789012345'
-export const mockScope = (content?: string) => {
+export const mockScope = (
+  content?: string,
+  { docOptions = {}, permissions = {} }: any = {}
+) => {
   return {
     editor: {
-      sharejs_doc: mockDoc(content),
-      open_doc_name: 'test.tex',
-      open_doc_id: docId,
-      showVisual: false,
+      sharejs_doc: mockDoc(content, docOptions),
+      openDocName: 'test.tex',
+      currentDocumentId: docId,
       wantTrackChanges: false,
     },
     pdf: {
       logEntryAnnotations: {},
     },
-    project: {
-      _id: 'test-project',
-      name: 'Test Project',
-      spellCheckLanguage: 'en',
-      rootFolder: [
-        {
-          _id: rootFolderId,
-          name: 'rootFolder',
-          docs: [
-            {
-              _id: docId,
-              name: 'test.tex',
-            },
-          ],
-          folders: [
-            {
-              _id: figuresFolderId,
-              name: 'figures',
-              docs: [
-                {
-                  _id: 'fake-nested-doc-id',
-                  name: 'foo.tex',
-                },
-              ],
-              folders: [],
-              fileRefs: [
-                {
-                  _id: figureId,
-                  name: 'frog.jpg',
-                  hash: '42',
-                },
-                {
-                  _id: 'fake-figure-id',
-                  name: 'unicorn.png',
-                  hash: '43',
-                },
-              ],
-            },
-          ],
-          fileRefs: [],
-        },
-      ] as Folder[],
-      features: {
-        trackChanges: true,
-      },
-      trackChangesState: {},
-      members: [],
-    },
     permissions: {
       comment: true,
       trackedWrite: true,
       write: true,
-    },
-    ui: {
-      reviewPanelOpen: false,
+      ...permissions,
     },
     toggleReviewPanel: cy.stub(),
     toggleTrackChangesForEveryone: cy.stub(),
     refreshResolvedCommentsDropdown: cy.stub(() => sleep(1000)),
     onlineUserCursorHighlights: {},
     permissionsLevel: 'owner',
-    $on: cy.stub().log(false),
-    $broadcast: cy.stub().log(false),
-    $emit: cy.stub().log(false),
   }
 }
diff --git a/services/web/test/frontend/features/source-editor/helpers/test-container.tsx b/services/web/test/frontend/features/source-editor/helpers/test-container.tsx
index 8de4dcdc55..d0920df597 100644
--- a/services/web/test/frontend/features/source-editor/helpers/test-container.tsx
+++ b/services/web/test/frontend/features/source-editor/helpers/test-container.tsx
@@ -1,12 +1,18 @@
-import { FC, ComponentProps, Suspense } from 'react'
+import { FC, ComponentProps, PropsWithChildren, Suspense } from 'react'
+import { withTestContainerErrorBoundary } from '../../../helpers/error-boundary'
 
 const style = { width: 785, height: 785 }
 
-export const TestContainer: FC<ComponentProps<'div'>> = ({
-  children,
-  ...rest
-}) => (
+const TestContainerWithoutErrorBoundary: FC<
+  PropsWithChildren<ComponentProps<'div'>>
+> = ({ children, ...rest }) => (
   <div style={style} {...rest}>
     <Suspense fallback={null}>{children}</Suspense>
   </div>
 )
+
+// react-error-boundary version 5 requires an error boundary when using
+// useErrorBoundary, which we do in several components
+export const TestContainer = withTestContainerErrorBoundary(
+  TestContainerWithoutErrorBoundary
+)
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx
index 830787afc1..c4a2a24f83 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx
@@ -15,7 +15,7 @@ import {
   groupActiveSubscription,
   groupActiveSubscriptionWithPendingLicenseChange,
 } from '../../fixtures/subscriptions'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import { UserId } from '../../../../../../types/user'
 import { SplitTestProvider } from '@/shared/context/split-test-context'
 
@@ -51,7 +51,7 @@ describe('<GroupSubscriptionMemberships />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders all group subscriptions not managed', function () {
@@ -73,16 +73,9 @@ describe('<GroupSubscriptionMemberships />', function () {
   })
 
   describe('opens leave group modal when button is clicked', function () {
-    let reloadStub: sinon.SinonStub
-
     beforeEach(function () {
-      reloadStub = sinon.stub()
-      this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-        assign: sinon.stub(),
-        replace: sinon.stub(),
-        reload: reloadStub,
-        setHash: sinon.stub(),
-      })
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
 
       render(
         <SplitTestProvider>
@@ -111,7 +104,7 @@ describe('<GroupSubscriptionMemberships />', function () {
     })
 
     afterEach(function () {
-      this.locationStub.restore()
+      this.locationWrapperSandbox.restore()
     })
 
     it('close the modal', function () {
@@ -129,7 +122,8 @@ describe('<GroupSubscriptionMemberships />', function () {
 
       fireEvent.click(this.leaveNowButton)
 
-      expect(leaveGroupApiMock.called()).to.be.true
+      expect(leaveGroupApiMock.callHistory.called()).to.be.true
+      const reloadStub = this.locationWrapperStub.reload
       await waitFor(() => {
         expect(reloadStub).to.have.been.called
       })
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx
index c9a28403fd..5c4fa29ed9 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx
@@ -37,7 +37,7 @@ describe('<ManagedInstitutions />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders all managed institutions', function () {
@@ -97,8 +97,10 @@ describe('<ManagedInstitutions />', function () {
     )
 
     const unsubscribeLink = screen.getByText('Unsubscribe')
-    await fireEvent.click(unsubscribeLink)
-    await waitFor(() => expect(fetchMock.called(unsubscribeUrl)).to.be.true)
+    fireEvent.click(unsubscribeLink)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(unsubscribeUrl)).to.be.true
+    )
 
     await waitFor(() => {
       expect(screen.getByText('Subscribe')).to.exist
@@ -122,13 +124,14 @@ describe('<ManagedInstitutions />', function () {
       </SplitTestProvider>
     )
 
-    const subscribeLink = screen.getByText('Subscribe')
-    await fireEvent.click(subscribeLink)
-    await waitFor(() => expect(fetchMock.called(subscribeUrl)).to.be.true)
+    const subscribeLink = await screen.findByText('Subscribe')
 
-    await waitFor(() => {
-      expect(screen.getByText('Unsubscribe')).to.exist
-    })
+    fireEvent.click(subscribeLink)
+    await waitFor(
+      () => expect(fetchMock.callHistory.called(subscribeUrl)).to.be.true
+    )
+
+    await screen.findByText('Unsubscribe')
   })
 
   it('renders nothing when there are no institutions', function () {
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx
index 7c696841db..e350e3efd5 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx
@@ -28,7 +28,7 @@ describe('<ManagedPublishers />', function () {
   })
 
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('renders all managed publishers', function () {
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/pause-modal.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/pause-modal.test.tsx
index 462db9f81b..421f90275d 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/pause-modal.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/pause-modal.test.tsx
@@ -9,12 +9,11 @@ import {
   trialSubscription,
 } from '../../fixtures/subscriptions'
 import { renderActiveSubscription } from '../../helpers/render-active-subscription'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import { MetaTag } from '@/utils/meta'
 
 const pauseSubscriptionSplitTestMeta: MetaTag[] = [
   { name: 'ol-splitTestVariants', value: { 'pause-subscription': 'enabled' } },
-  { name: 'ol-bootstrapVersion', value: 5 },
 ]
 
 function renderSubscriptionWithPauseSupport(
@@ -46,22 +45,17 @@ function clickSubmitButton() {
 
 describe('<PauseSubscriptionModal />', function () {
   beforeEach(function () {
-    reloadStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: sinon.stub(),
-      replace: sinon.stub(),
-      reload: reloadStub,
-      setHash: sinon.stub(),
-      toString: sinon
-        .stub()
-        .returns('https://www.dev-overleaf.com/user/subscription'),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
+    this.locationWrapperStub.toString.returns(
+      'https://www.dev-overleaf.com/user/subscription'
+    )
     this.replaceStateStub = sinon.stub(window.history, 'replaceState')
   })
 
   afterEach(function () {
-    fetchMock.reset()
-    this.locationStub.restore()
+    fetchMock.removeRoutes().clearHistory()
+    this.locationWrapperSandbox.restore()
     this.replaceStateStub.restore()
   })
 
@@ -90,7 +84,6 @@ describe('<PauseSubscriptionModal />', function () {
     clickCancelButton()
     await screen.findByText('Pause instead, to pick up where you left off')
   })
-  let reloadStub: sinon.SinonStub
 
   it('renders options for pause duration', async function () {
     renderSubscriptionWithPauseSupport()
@@ -136,6 +129,7 @@ describe('<PauseSubscriptionModal />', function () {
     renderSubscriptionWithPauseSupport()
     clickCancelButton()
     clickSubmitButton()
+    const reloadStub = this.locationWrapperStub.reload
     await waitFor(() => {
       expect(reloadStub).to.have.been.called
     })
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/personal-subscription.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/personal-subscription.test.tsx
index 6b40314688..a61c9fca7f 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/personal-subscription.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/personal-subscription.test.tsx
@@ -4,6 +4,7 @@ import {
   fireEvent,
   waitForElementToBeRemoved,
   within,
+  waitFor,
 } from '@testing-library/react'
 import PersonalSubscription from '../../../../../../frontend/js/features/subscription/components/dashboard/personal-subscription'
 import {
@@ -19,7 +20,7 @@ import {
 import { reactivateSubscriptionUrl } from '../../../../../../frontend/js/features/subscription/data/subscription-url'
 import fetchMock from 'fetch-mock'
 import sinon from 'sinon'
-import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 
 describe('<PersonalSubscription />', function () {
   afterEach(function () {
@@ -36,33 +37,25 @@ describe('<PersonalSubscription />', function () {
   })
 
   describe('custom subscription', function () {
-    it('displays contact support message', function () {
+    it('displays contact Support message', function () {
       renderWithSubscriptionDashContext(<PersonalSubscription />, {
         metaTags: [{ name: 'ol-subscription', value: customSubscription }],
       })
 
       screen.getByText('Please', { exact: false })
-      screen.getByText('contact support', { exact: false })
+      screen.getByText('contact Support', { exact: false })
       screen.getByText('to make changes to your plan', { exact: false })
     })
   })
 
   describe('subscription states  ', function () {
-    let reloadStub: sinon.SinonStub
-
     beforeEach(function () {
-      reloadStub = sinon.stub()
-      this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-        assign: sinon.stub(),
-        replace: sinon.stub(),
-        reload: reloadStub,
-        setHash: sinon.stub(),
-        toString: sinon.stub(),
-      })
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
     })
 
     afterEach(function () {
-      this.locationStub.restore()
+      this.locationWrapperSandbox.restore()
     })
 
     it('renders the active dash', function () {
@@ -83,13 +76,13 @@ describe('<PersonalSubscription />', function () {
         'Your subscription has been canceled and will terminate on',
         { exact: false }
       )
-      screen.getByText(canceledSubscription.recurly!.nextPaymentDueAt, {
+      screen.getByText(canceledSubscription.payment!.nextPaymentDueAt, {
         exact: false,
       })
 
       screen.getByText('No further payments will be taken.', { exact: false })
 
-      screen.getByRole('button', { name: 'View your invoices' })
+      screen.getByRole('link', { name: 'View your invoices' })
       screen.getByRole('button', { name: 'Reactivate your subscription' })
     })
 
@@ -106,18 +99,20 @@ describe('<PersonalSubscription />', function () {
       fetchMock.postOnce(reactivateSubscriptionUrl, 400)
       fireEvent.click(reactivateBtn)
       expect(reactivateBtn.disabled).to.be.true
-      await fetchMock.flush(true)
-      expect(reactivateBtn.disabled).to.be.false
-      expect(reloadStub).not.to.have.been.called
-      fetchMock.reset()
+      await fetchMock.callHistory.flush(true)
+      await waitFor(() => expect(reactivateBtn.disabled).to.be.false)
+      expect(this.locationWrapperStub.reload).not.to.have.been.called
+      fetchMock.removeRoutes().clearHistory()
 
       // 2nd click - success
       fetchMock.postOnce(reactivateSubscriptionUrl, 200)
       fireEvent.click(reactivateBtn)
-      await fetchMock.flush(true)
-      expect(reloadStub).to.have.been.calledOnce
+      await fetchMock.callHistory.flush(true)
+      await waitFor(() => {
+        expect(this.locationWrapperStub.reload).to.have.been.calledOnce
+      })
       expect(reactivateBtn.disabled).to.be.true
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('renders the expired dash', function () {
@@ -134,7 +129,7 @@ describe('<PersonalSubscription />', function () {
         {},
         JSON.parse(JSON.stringify(annualActiveSubscription))
       )
-      withStateDeleted.recurly.state = undefined
+      withStateDeleted.payment.state = undefined
       renderWithSubscriptionDashContext(<PersonalSubscription />, {
         metaTags: [{ name: 'ol-subscription', value: withStateDeleted }],
       })
@@ -194,8 +189,10 @@ describe('<PersonalSubscription />', function () {
     })
   })
 
-  it('shows different recurly email address section', async function () {
-    fetchMock.post('/user/subscription/account/email', 200)
+  it('shows different payment email address section', async function () {
+    fetchMock.post('/user/subscription/account/email', {
+      status: 200,
+    })
     const usersEmail = 'foo@example.com'
     renderWithSubscriptionDashContext(<PersonalSubscription />, {
       metaTags: [
@@ -208,7 +205,7 @@ describe('<PersonalSubscription />', function () {
       /your billing email address is currently/i
     ).textContent
     expect(billingText).to.contain(
-      `Your billing email address is currently ${annualActiveSubscription.recurly.account.email}.` +
+      `Your billing email address is currently ${annualActiveSubscription.payment.accountEmail}.` +
         ` If needed you can update your billing address to ${usersEmail}`
     )
 
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/states/active/active.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/states/active/active.test.tsx
index 406d6d3710..f5802a2368 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/states/active/active.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/states/active/active.test.tsx
@@ -1,7 +1,7 @@
 import { expect } from 'chai'
 import { fireEvent, screen, waitFor } from '@testing-library/react'
 import * as eventTracking from '@/infrastructure/event-tracking'
-import { RecurlySubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../../../../types/subscription/dashboard/subscription'
 import {
   annualActiveSubscription,
   groupActiveSubscription,
@@ -11,7 +11,7 @@ import {
   trialCollaboratorSubscription,
   trialSubscription,
 } from '../../../../fixtures/subscriptions'
-import sinon, { type SinonStub } from 'sinon'
+import sinon from 'sinon'
 import { cleanUpContext } from '../../../../helpers/render-with-subscription-dash-context'
 import { renderActiveSubscription } from '../../../../helpers/render-active-subscription'
 import { cloneDeep } from 'lodash'
@@ -21,21 +21,11 @@ import {
   extendTrialUrl,
   subscriptionUpdateUrl,
 } from '@/features/subscription/data/subscription-url'
-import * as useLocationModule from '../../../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 import { MetaTag } from '@/utils/meta'
-import * as bootstrapUtils from '@/features/utils/bootstrap-5'
 
 describe('<ActiveSubscription />', function () {
   let sendMBSpy: sinon.SinonSpy
-  let isBootstrap5Stub: SinonStub
-
-  before(function () {
-    isBootstrap5Stub = sinon.stub(bootstrapUtils, 'isBootstrap5').returns(true)
-  })
-
-  after(function () {
-    isBootstrap5Stub.restore()
-  })
 
   beforeEach(function () {
     sendMBSpy = sinon.spy(eventTracking, 'sendMB')
@@ -46,7 +36,7 @@ describe('<ActiveSubscription />', function () {
     sendMBSpy.restore()
   })
 
-  function expectedInActiveSubscription(subscription: RecurlySubscription) {
+  function expectedInActiveSubscription(subscription: PaidSubscription) {
     // sentence broken up by bolding
     screen.getByText('You are currently subscribed to the', { exact: false })
     screen.getByText(subscription.plan.name, { exact: false })
@@ -55,11 +45,11 @@ describe('<ActiveSubscription />', function () {
 
     // sentence broken up by bolding
     screen.getByText('The next payment of', { exact: false })
-    screen.getByText(subscription.recurly.displayPrice, {
+    screen.getByText(subscription.payment.displayPrice, {
       exact: false,
     })
     screen.getByText('will be collected on', { exact: false })
-    const dates = screen.getAllByText(subscription.recurly.nextPaymentDueAt, {
+    const dates = screen.getAllByText(subscription.payment.nextPaymentDueAt, {
       exact: false,
     })
     expect(dates.length).to.equal(2)
@@ -87,9 +77,13 @@ describe('<ActiveSubscription />', function () {
     screen.getByText('You are currently subscribed to the', { exact: false })
 
     await screen.findByRole('heading', { name: 'Change plan' })
-    expect(
-      screen.getAllByRole('button', { name: 'Change to this plan' }).length > 0
-    ).to.be.true
+    await waitFor(
+      () =>
+        expect(
+          screen.getAllByRole('button', { name: 'Change to this plan' })
+            .length > 0
+        ).to.be.true
+    )
   })
 
   it('notes when user is changing plan at end of current plan term', function () {
@@ -108,7 +102,7 @@ describe('<ActiveSubscription />', function () {
       'If you wish this change to apply before the end of your current billing period, please contact us.'
     )
 
-    expect(screen.queryByRole('link', { name: 'contact support' })).to.be.null
+    expect(screen.queryByRole('link', { name: 'contact Support' })).to.be.null
     expect(screen.queryByText('if you wish to change your group subscription.'))
       .to.be.null
   })
@@ -120,7 +114,7 @@ describe('<ActiveSubscription />', function () {
       JSON.parse(JSON.stringify(annualActiveSubscription))
     )
 
-    activePastDueSubscription.recurly.account.has_past_due_invoice._ = 'true'
+    activePastDueSubscription.payment.hasPastDueInvoice = true
 
     renderActiveSubscription(activePastDueSubscription)
 
@@ -136,14 +130,14 @@ describe('<ActiveSubscription />', function () {
     })
 
     screen.getByText(
-      groupActiveSubscriptionWithPendingLicenseChange.recurly
+      groupActiveSubscriptionWithPendingLicenseChange.payment
         .pendingAdditionalLicenses!
     )
 
     screen.getByText('additional license(s) for a total of', { exact: false })
 
     screen.getByText(
-      groupActiveSubscriptionWithPendingLicenseChange.recurly
+      groupActiveSubscriptionWithPendingLicenseChange.payment
         .pendingTotalLicenses!
     )
 
@@ -156,10 +150,10 @@ describe('<ActiveSubscription />', function () {
 
   it('shows the pending license change message when plan change is not pending', function () {
     const subscription = Object.assign({}, groupActiveSubscription)
-    subscription.recurly.additionalLicenses = 4
-    subscription.recurly.totalLicenses =
-      subscription.recurly.totalLicenses +
-      subscription.recurly.additionalLicenses
+    subscription.payment.additionalLicenses = 4
+    subscription.payment.totalLicenses =
+      subscription.payment.totalLicenses +
+      subscription.payment.additionalLicenses
 
     renderActiveSubscription(subscription)
 
@@ -167,11 +161,11 @@ describe('<ActiveSubscription />', function () {
       exact: false,
     })
 
-    screen.getByText(subscription.recurly.additionalLicenses)
+    screen.getByText(subscription.payment.additionalLicenses)
 
     screen.getByText('additional license(s) for a total of', { exact: false })
 
-    screen.getByText(subscription.recurly.totalLicenses)
+    screen.getByText(subscription.payment.totalLicenses)
   })
 
   it('shows when trial ends and first payment collected and when subscription would become inactive if cancelled', function () {
@@ -179,16 +173,18 @@ describe('<ActiveSubscription />', function () {
     screen.getByText('You’re on a free trial which ends on', { exact: false })
 
     const endDate = screen.getAllByText(
-      trialSubscription.recurly.trialEndsAtFormatted!
+      trialSubscription.payment.trialEndsAtFormatted!
     )
     expect(endDate.length).to.equal(3)
   })
 
   it('shows current discounts', function () {
     const subscriptionWithActiveCoupons = cloneDeep(annualActiveSubscription)
-    subscriptionWithActiveCoupons.recurly.activeCoupons = [
+    subscriptionWithActiveCoupons.payment.activeCoupons = [
       {
         name: 'fake coupon name',
+        code: 'fake-coupon',
+        description: '',
       },
     ]
     renderActiveSubscription(subscriptionWithActiveCoupons)
@@ -196,27 +192,19 @@ describe('<ActiveSubscription />', function () {
       /this does not include your current discounts, which will be applied automatically before your next payment/i
     )
     screen.getByText(
-      subscriptionWithActiveCoupons.recurly.activeCoupons[0].name
+      subscriptionWithActiveCoupons.payment.activeCoupons[0].name
     )
   })
 
   describe('cancel plan', function () {
-    const assignStub = sinon.stub()
-    const reloadStub = sinon.stub()
-
     beforeEach(function () {
-      this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-        assign: assignStub,
-        replace: sinon.stub(),
-        reload: reloadStub,
-        setHash: sinon.stub(),
-        toString: sinon.stub(),
-      })
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
     })
 
     afterEach(function () {
-      this.locationStub.restore()
-      fetchMock.reset()
+      this.locationWrapperSandbox.restore()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     function showConfirmCancelUI() {
@@ -233,7 +221,7 @@ describe('<ActiveSubscription />', function () {
         { exact: false }
       )
       const dates = screen.getAllByText(
-        annualActiveSubscription.recurly.nextPaymentDueAt,
+        annualActiveSubscription.payment.nextPaymentDueAt,
         {
           exact: false,
         }
@@ -252,7 +240,7 @@ describe('<ActiveSubscription />', function () {
         { exact: false }
       )
       const dates = screen.getAllByText(
-        trialSubscription.recurly.trialEndsAtFormatted!
+        trialSubscription.payment.trialEndsAtFormatted!
       )
       expect(dates.length).to.equal(3)
       const button = screen.getByRole('button', {
@@ -285,6 +273,7 @@ describe('<ActiveSubscription />', function () {
         name: 'Cancel my subscription',
       })
       fireEvent.click(button)
+      const assignStub = this.locationWrapperStub.assign
       await waitFor(() => {
         expect(assignStub).to.have.been.called
       })
@@ -414,6 +403,7 @@ describe('<ActiveSubscription />', function () {
         })
         fireEvent.click(extendTrialButton)
         // page is reloaded on success
+        const reloadStub = this.locationWrapperStub.reload
         await waitFor(() => {
           expect(reloadStub).to.have.been.called
         })
@@ -480,10 +470,10 @@ describe('<ActiveSubscription />', function () {
         })
       })
 
-      it('does not show option to downgrade when not a collaborator plan', function () {
-        const trialPlan = cloneDeep(monthlyActiveCollaborator)
-        trialPlan.plan.planCode = 'anotherplan'
-        renderActiveSubscription(trialPlan)
+      it('does not show option to downgrade when plan is not eligible for downgrades', function () {
+        const ineligiblePlan = cloneDeep(monthlyActiveCollaborator)
+        ineligiblePlan.payment.isEligibleForDowngradeUpsell = false
+        renderActiveSubscription(ineligiblePlan)
         showConfirmCancelUI()
         expect(
           screen.queryByRole('button', {
@@ -507,7 +497,10 @@ describe('<ActiveSubscription />', function () {
         const endPointResponse = {
           status: 200,
         }
-        fetchMock.post(subscriptionUpdateUrl, endPointResponse)
+        fetchMock.post(
+          `${subscriptionUpdateUrl}?downgradeToPaidPersonal`,
+          endPointResponse
+        )
         renderActiveSubscription(monthlyActiveCollaborator)
         showConfirmCancelUI()
         const downgradeButton = await screen.findByRole('button', {
@@ -515,6 +508,7 @@ describe('<ActiveSubscription />', function () {
         })
         fireEvent.click(downgradeButton)
         // page is reloaded on success
+        const reloadStub = this.locationWrapperStub.reload
         await waitFor(() => {
           expect(reloadStub).to.have.been.called
         })
@@ -522,6 +516,35 @@ describe('<ActiveSubscription />', function () {
     })
   })
 
+  describe('contact support for paused subscription with 0 remaining cycles', function () {
+    beforeEach(function () {
+      this.locationWrapperSandbox = sinon.createSandbox()
+      this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
+    })
+
+    afterEach(function () {
+      this.locationWrapperSandbox.restore()
+    })
+
+    it('redirects to contact page when cancel button clicked', function () {
+      const pausedSubscription = cloneDeep(annualActiveSubscription)
+      pausedSubscription.payment.state = 'paused'
+      pausedSubscription.payment.remainingPauseCycles = 0
+
+      renderActiveSubscription(pausedSubscription)
+
+      const button = screen.getByRole('button', {
+        name: 'Cancel your subscription',
+      })
+      fireEvent.click(button)
+
+      expect(sendMBSpy).to.be.calledOnceWith(
+        'subscription-page-cancel-button-click'
+      )
+      expect(this.locationWrapperStub.assign).to.be.calledOnceWith('/contact')
+    })
+  })
+
   describe('group plans', function () {
     it('does not show "Change plan" option for group plans', function () {
       renderActiveSubscription(groupActiveSubscription)
@@ -530,9 +553,9 @@ describe('<ActiveSubscription />', function () {
       expect(changePlan).to.be.null
     })
 
-    it('shows contact support message for group plan change requests', function () {
+    it('shows contact Support message for group plan change requests', function () {
       renderActiveSubscription(groupActiveSubscription)
-      screen.getByRole('link', { name: 'contact support' })
+      screen.getByRole('link', { name: 'contact Support' })
       screen.getByText('if you wish to change your group subscription.', {
         exact: false,
       })
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/states/active/change-plan/change-plan.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/states/active/change-plan/change-plan.test.tsx
index 6c75d77583..bbcb955d2d 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/states/active/change-plan/change-plan.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/states/active/change-plan/change-plan.test.tsx
@@ -20,26 +20,18 @@ import {
   subscriptionUpdateUrl,
 } from '../../../../../../../../../frontend/js/features/subscription/data/subscription-url'
 import { renderActiveSubscription } from '../../../../../helpers/render-active-subscription'
-import * as useLocationModule from '../../../../../../../../../frontend/js/shared/hooks/use-location'
+import { location } from '@/shared/components/location'
 
 describe('<ChangePlanModal />', function () {
-  let reloadStub: sinon.SinonStub
-
   beforeEach(function () {
-    reloadStub = sinon.stub()
-    this.locationStub = sinon.stub(useLocationModule, 'useLocation').returns({
-      assign: sinon.stub(),
-      replace: sinon.stub(),
-      reload: reloadStub,
-      setHash: sinon.stub(),
-      toString: sinon.stub(),
-    })
+    this.locationWrapperSandbox = sinon.createSandbox()
+    this.locationWrapperStub = this.locationWrapperSandbox.stub(location)
   })
 
   afterEach(function () {
     cleanUpContext()
-    fetchMock.reset()
-    this.locationStub.restore()
+    fetchMock.removeRoutes().clearHistory()
+    this.locationWrapperSandbox.restore()
   })
 
   it('renders the individual plans table and group plans UI', async function () {
@@ -210,6 +202,7 @@ describe('<ChangePlanModal />', function () {
       screen.getByRole('button', { name: 'Processing…' })
 
       // page is reloaded on success
+      const reloadStub = this.locationWrapperStub.reload
       await waitFor(() => {
         expect(reloadStub).to.have.been.called
       })
@@ -245,11 +238,11 @@ describe('<ChangePlanModal />', function () {
 
       screen.getByRole('button', { name: 'Processing…' })
 
-      await screen.findByText('Sorry, something went wrong. ', { exact: false })
-      await screen.findByText('Please try again. ', { exact: false })
-      await screen.findByText('If the problem continues please contact us.', {
-        exact: false,
-      })
+      await screen.findAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'Sorry, something went wrong. Please try again. If the problem continues please contact us.'
+      )
 
       expect(
         within(screen.getByRole('dialog'))
@@ -299,6 +292,7 @@ describe('<ChangePlanModal />', function () {
       screen.getByRole('button', { name: 'Processing…' })
 
       // page is reloaded on success
+      const reloadStub = this.locationWrapperStub.reload
       await waitFor(() => {
         expect(reloadStub).to.have.been.called
       })
@@ -530,7 +524,8 @@ describe('<ChangePlanModal />', function () {
 
       screen.getByRole('button', { name: 'Processing…' })
 
-      // // page is reloaded on success
+      // page is reloaded on success
+      const reloadStub = this.locationWrapperStub.reload
       await waitFor(() => {
         expect(reloadStub).to.have.been.called
       })
diff --git a/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx
index 77d377cd60..2e44b4b6e4 100644
--- a/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/dashboard/subscription-dashboard.test.tsx
@@ -32,7 +32,7 @@ describe('<SubscriptionDashboard />', function () {
     })
 
     it('renders the "Get the most from your subscription" text', function () {
-      screen.getByText(/get the most from your Overleaf subscription/i)
+      screen.getByText(/Get the most out of your subscription/i)
     })
   })
 
@@ -42,13 +42,13 @@ describe('<SubscriptionDashboard />', function () {
     })
 
     it('does not render the "Get the most out of your" subscription text', function () {
-      const text = screen.queryByText('Get the most out of your', {
+      const text = screen.queryByText('Get the most out of your subscription', {
         exact: false,
       })
       expect(text).to.be.null
     })
 
-    it('does not render the contact support message', function () {
+    it('does not render the contact Support message', function () {
       const text = screen.queryByText(
         `You’re on an Overleaf Paid plan. Contact`,
         {
@@ -60,7 +60,7 @@ describe('<SubscriptionDashboard />', function () {
   })
 
   describe('Custom subscription', function () {
-    it('renders the contact support message', function () {
+    it('renders the contact Support message', function () {
       renderWithSubscriptionDashContext(<SubscriptionDashboard />, {
         metaTags: [
           {
@@ -77,7 +77,7 @@ describe('<SubscriptionDashboard />', function () {
       screen.getByText(`You’re on an Overleaf Paid plan.`, {
         exact: false,
       })
-      screen.getByText(`Contact support`, {
+      screen.getByText(`Contact Support`, {
         exact: false,
       })
     })
diff --git a/services/web/test/frontend/features/subscription/components/group-invite/accepted-invite.test.tsx b/services/web/test/frontend/features/subscription/components/group-invite/accepted-invite.test.tsx
index 54222e7fb3..a3d0a4419d 100644
--- a/services/web/test/frontend/features/subscription/components/group-invite/accepted-invite.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/group-invite/accepted-invite.test.tsx
@@ -2,38 +2,34 @@ import { render, screen } from '@testing-library/react'
 import AcceptedInvite from '../../../../../../frontend/js/features/subscription/components/group-invite/accepted-invite'
 import { expect } from 'chai'
 
-for (const bsVersion of [3, 5])
-  describe('accepted group invite' + ` bs${bsVersion}`, function () {
-    beforeEach(function () {
-      window.metaAttributesCache.set('ol-bootstrapVersion', bsVersion)
-    })
-    it('renders', async function () {
-      window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
-      render(<AcceptedInvite />)
-      await screen.findByText(
-        'You have joined the group subscription managed by example@overleaf.com'
-      )
-    })
-
-    it('links to SSO enrollment page for SSO groups', async function () {
-      window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
-      window.metaAttributesCache.set('ol-groupSSOActive', true)
-      window.metaAttributesCache.set('ol-subscriptionId', 'group123')
-      render(<AcceptedInvite />)
-      const linkBtn = (await screen.findByRole('link', {
-        name: 'Done',
-      })) as HTMLLinkElement
-      expect(linkBtn.href).to.equal(
-        'https://www.test-overleaf.com/subscription/group123/sso_enrollment'
-      )
-    })
-
-    it('links to dash for non-SSO groups', async function () {
-      window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
-      render(<AcceptedInvite />)
-      const linkBtn = (await screen.findByRole('link', {
-        name: 'Done',
-      })) as HTMLLinkElement
-      expect(linkBtn.href).to.equal('https://www.test-overleaf.com/project')
-    })
+describe('accepted group invite', function () {
+  it('renders', async function () {
+    window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
+    render(<AcceptedInvite />)
+    await screen.findByText(
+      'You have joined the group subscription managed by example@overleaf.com'
+    )
   })
+
+  it('links to SSO enrollment page for SSO groups', async function () {
+    window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
+    window.metaAttributesCache.set('ol-groupSSOActive', true)
+    window.metaAttributesCache.set('ol-subscriptionId', 'group123')
+    render(<AcceptedInvite />)
+    const linkBtn = (await screen.findByRole('link', {
+      name: 'Done',
+    })) as HTMLLinkElement
+    expect(linkBtn.href).to.equal(
+      'https://www.test-overleaf.com/subscription/group123/sso_enrollment'
+    )
+  })
+
+  it('links to dash for non-SSO groups', async function () {
+    window.metaAttributesCache.set('ol-inviterName', 'example@overleaf.com')
+    render(<AcceptedInvite />)
+    const linkBtn = (await screen.findByRole('link', {
+      name: 'Done',
+    })) as HTMLLinkElement
+    expect(linkBtn.href).to.equal('https://www.test-overleaf.com/project')
+  })
+})
diff --git a/services/web/test/frontend/features/subscription/components/group-invite/group-invite.test.tsx b/services/web/test/frontend/features/subscription/components/group-invite/group-invite.test.tsx
index 1c03302364..d7b769fd20 100644
--- a/services/web/test/frontend/features/subscription/components/group-invite/group-invite.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/group-invite/group-invite.test.tsx
@@ -2,80 +2,34 @@ import { render, screen } from '@testing-library/react'
 import { expect } from 'chai'
 import GroupInvite from '../../../../../../frontend/js/features/subscription/components/group-invite/group-invite'
 
-for (const bsVersion of [3, 5])
-  describe('group invite' + ` bs${bsVersion}`, function () {
-    window.metaAttributesCache.set('ol-bootstrapVersion', bsVersion)
-    const inviterName = 'example@overleaf.com'
+describe('group invite', function () {
+  const inviterName = 'example@overleaf.com'
+  beforeEach(function () {
+    window.metaAttributesCache.set('ol-inviterName', inviterName)
+  })
+
+  it('renders header', async function () {
+    render(<GroupInvite />)
+    await screen.findByText(inviterName)
+    screen.getByText(`has invited you to join a group subscription on Overleaf`)
+    expect(screen.queryByText('Email link expired, please request a new one.'))
+      .to.be.null
+  })
+
+  describe('when user has personal subscription', function () {
     beforeEach(function () {
-      window.metaAttributesCache.set('ol-inviterName', inviterName)
+      window.metaAttributesCache.set('ol-hasIndividualPaidSubscription', true)
     })
 
-    it('renders header', async function () {
+    it('renders cancel personal subscription view', async function () {
       render(<GroupInvite />)
-      await screen.findByText(inviterName)
-      screen.getByText(
-        `has invited you to join a group subscription on Overleaf`
+      await screen.findByText(
+        'You already have an individual subscription, would you like us to cancel this first before joining the group licence?'
       )
-      expect(
-        screen.queryByText('Email link expired, please request a new one.')
-      ).to.be.null
     })
 
-    describe('when user has personal subscription', function () {
-      beforeEach(function () {
-        window.metaAttributesCache.set(
-          'ol-hasIndividualRecurlySubscription',
-          true
-        )
-      })
-
-      it('renders cancel personal subscription view', async function () {
-        render(<GroupInvite />)
-        await screen.findByText(
-          'You already have an individual subscription, would you like us to cancel this first before joining the group licence?'
-        )
-      })
-
-      describe('and in a managed group', function () {
-        // note: this should not be possible but managed user view takes priority over all
-        beforeEach(function () {
-          window.metaAttributesCache.set(
-            'ol-currentManagedUserAdminEmail',
-            'example@overleaf.com'
-          )
-          window.metaAttributesCache.set('ol-cannot-join-subscription', true)
-        })
-
-        it('renders managed user cannot join view', async function () {
-          render(<GroupInvite />)
-          await screen.findByText('You can’t join this group subscription')
-          screen.getByText(
-            'Your Overleaf account is managed by your current group admin (example@overleaf.com). This means you can’t join additional group subscriptions',
-            { exact: false }
-          )
-          screen.getByRole('link', { name: 'Read more about Managed Users.' })
-        })
-      })
-    })
-
-    describe('when user does not have a personal subscription', function () {
-      beforeEach(function () {
-        window.metaAttributesCache.set(
-          'ol-hasIndividualRecurlySubscription',
-          false
-        )
-        window.metaAttributesCache.set('ol-inviteToken', 'token123')
-      })
-
-      it('does not render cancel personal subscription view', async function () {
-        render(<GroupInvite />)
-        await screen.findByText(
-          'Please click the button below to join the group subscription and enjoy the benefits of an upgraded Overleaf account'
-        )
-      })
-    })
-
-    describe('when the user is already a managed user in another group', function () {
+    describe('and in a managed group', function () {
+      // note: this should not be possible but managed user view takes priority over all
       beforeEach(function () {
         window.metaAttributesCache.set(
           'ol-currentManagedUserAdminEmail',
@@ -86,11 +40,7 @@ for (const bsVersion of [3, 5])
 
       it('renders managed user cannot join view', async function () {
         render(<GroupInvite />)
-        await screen.findByText(inviterName)
-        screen.getByText(
-          `has invited you to join a group subscription on Overleaf`
-        )
-        screen.getByText('You can’t join this group subscription')
+        await screen.findByText('You can’t join this group subscription')
         screen.getByText(
           'Your Overleaf account is managed by your current group admin (example@overleaf.com). This means you can’t join additional group subscriptions',
           { exact: false }
@@ -98,28 +48,67 @@ for (const bsVersion of [3, 5])
         screen.getByRole('link', { name: 'Read more about Managed Users.' })
       })
     })
+  })
 
-    describe('expired', function () {
-      beforeEach(function () {
-        window.metaAttributesCache.set('ol-expired', true)
-      })
-
-      it('shows error notification when expired', async function () {
-        render(<GroupInvite />)
-        await screen.findByText('Email link expired, please request a new one.')
-      })
+  describe('when user does not have a personal subscription', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-hasIndividualPaidSubscription', false)
+      window.metaAttributesCache.set('ol-inviteToken', 'token123')
     })
 
-    describe('join view', function () {
-      beforeEach(function () {
-        window.metaAttributesCache.set('ol-inviteToken', 'token123')
-      })
-
-      it('shows view to join group', async function () {
-        render(<GroupInvite />)
-        await screen.findByText(
-          'Please click the button below to join the group subscription and enjoy the benefits of an upgraded Overleaf account'
-        )
-      })
+    it('does not render cancel personal subscription view', async function () {
+      render(<GroupInvite />)
+      await screen.findByText(
+        'Please click the button below to join the group subscription and enjoy the benefits of an upgraded Overleaf account'
+      )
     })
   })
+
+  describe('when the user is already a managed user in another group', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set(
+        'ol-currentManagedUserAdminEmail',
+        'example@overleaf.com'
+      )
+      window.metaAttributesCache.set('ol-cannot-join-subscription', true)
+    })
+
+    it('renders managed user cannot join view', async function () {
+      render(<GroupInvite />)
+      await screen.findByText(inviterName)
+      screen.getByText(
+        `has invited you to join a group subscription on Overleaf`
+      )
+      screen.getByText('You can’t join this group subscription')
+      screen.getByText(
+        'Your Overleaf account is managed by your current group admin (example@overleaf.com). This means you can’t join additional group subscriptions',
+        { exact: false }
+      )
+      screen.getByRole('link', { name: 'Read more about Managed Users.' })
+    })
+  })
+
+  describe('expired', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-expired', true)
+    })
+
+    it('shows error notification when expired', async function () {
+      render(<GroupInvite />)
+      await screen.findByText('Email link expired, please request a new one.')
+    })
+  })
+
+  describe('join view', function () {
+    beforeEach(function () {
+      window.metaAttributesCache.set('ol-inviteToken', 'token123')
+    })
+
+    it('shows view to join group', async function () {
+      render(<GroupInvite />)
+      await screen.findByText(
+        'Please click the button below to join the group subscription and enjoy the benefits of an upgraded Overleaf account'
+      )
+    })
+  })
+})
diff --git a/services/web/test/frontend/features/subscription/components/group-invite/has-individual-recurly-subscription.test.tsx b/services/web/test/frontend/features/subscription/components/group-invite/has-individual-recurly-subscription.test.tsx
index 32a02810cb..fb89b19bf1 100644
--- a/services/web/test/frontend/features/subscription/components/group-invite/has-individual-recurly-subscription.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/group-invite/has-individual-recurly-subscription.test.tsx
@@ -7,7 +7,7 @@ import fetchMock from 'fetch-mock'
 describe('group invite', function () {
   describe('user has a personal subscription', function () {
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     it('shows option to cancel subscription', async function () {
@@ -40,7 +40,7 @@ describe('group invite', function () {
       fireEvent.click(button)
       await waitFor(() => {
         screen.getByText(
-          'Something went wrong canceling your subscription. Please contact support.'
+          'Something went wrong canceling your subscription. Please contact Support.'
         )
       })
     })
diff --git a/services/web/test/frontend/features/subscription/components/group-invite/join-group.test.tsx b/services/web/test/frontend/features/subscription/components/group-invite/join-group.test.tsx
index e297d30ac6..4899f29595 100644
--- a/services/web/test/frontend/features/subscription/components/group-invite/join-group.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/group-invite/join-group.test.tsx
@@ -10,7 +10,7 @@ describe('join group', function () {
     window.metaAttributesCache.set('ol-inviteToken', inviteToken)
   })
   afterEach(function () {
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   it('shows option to join subscription', async function () {
diff --git a/services/web/test/frontend/features/subscription/components/shared/payment-error-notification.test.tsx b/services/web/test/frontend/features/subscription/components/shared/payment-error-notification.test.tsx
new file mode 100644
index 0000000000..e88551b20b
--- /dev/null
+++ b/services/web/test/frontend/features/subscription/components/shared/payment-error-notification.test.tsx
@@ -0,0 +1,103 @@
+import { expect } from 'chai'
+import { render, screen } from '@testing-library/react'
+import PaymentErrorNotification from '../../../../../../frontend/js/features/subscription/components/shared/payment-error-notification'
+import { FetchError } from '@/infrastructure/fetch-json'
+import { billingPortalUrl } from '@/features/subscription/data/subscription-url'
+
+describe('<PaymentErrorNotification />', function () {
+  it('does not render if error is missing', function () {
+    render(<PaymentErrorNotification error={null} />)
+
+    expect(screen.queryByRole('link')).to.be.null
+  })
+
+  it('renders a generic error if adviceCode is missing', function () {
+    const error = { data: { adviceCode: null } } as FetchError
+
+    render(<PaymentErrorNotification error={error} />)
+
+    expect(
+      screen.queryAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'Sorry, something went wrong. Please try again. If the problem continues please contact us.'
+      ).length
+    ).to.be.greaterThan(0)
+
+    const link = screen.queryByRole('link')
+    expect(link).to.exist
+    expect(link?.getAttribute('href')).to.equal('/contact')
+  })
+
+  it('renders an error if adviceCode is missing but clientSecret is present', function () {
+    const error = { data: { clientSecret: 'cs_12345' } } as FetchError
+
+    render(<PaymentErrorNotification error={error} />)
+
+    expect(
+      screen.queryAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'We couldn’t complete your payment because authentication wasn’t successful. Please try again or choose a different payment method. If the problem continues please contact us.'
+      ).length
+    ).to.be.greaterThan(0)
+
+    const link = screen.queryByRole('link')
+    expect(link).to.exist
+    expect(link?.getAttribute('href')).to.equal('/contact')
+  })
+
+  it('renders a error to try again if adviceCode is try_again_later', function () {
+    const error = { data: { adviceCode: 'try_again_later' } } as FetchError
+
+    render(<PaymentErrorNotification error={error} />)
+
+    expect(
+      screen.queryAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'We were unable to process your payment. Please try again later or contact us for assistance.'
+      ).length
+    ).to.be.greaterThan(0)
+
+    const link = screen.queryByRole('link')
+    expect(link).to.exist
+    expect(link?.getAttribute('href')).to.equal('/contact')
+  })
+
+  it('renders an error to update payment method if adviceCode do_not_try_again', function () {
+    const error = { data: { adviceCode: 'do_not_try_again' } } as FetchError
+
+    render(<PaymentErrorNotification error={error} />)
+
+    expect(
+      screen.queryAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'Your payment was declined. Please update your billing information and try again.'
+      ).length
+    ).to.be.greaterThan(0)
+
+    const link = screen.queryByRole('link')
+    expect(link).to.exist
+    expect(link?.getAttribute('href')).to.equal(billingPortalUrl)
+  })
+
+  it('renders an error to update payment method if adviceCode confirm_card_data', function () {
+    const error = { data: { adviceCode: 'confirm_card_data' } } as FetchError
+
+    render(<PaymentErrorNotification error={error} />)
+
+    expect(
+      screen.queryAllByText(
+        (content, element) =>
+          element?.textContent ===
+          'Your payment was declined. Please update your billing information and try again.'
+      ).length
+    ).to.be.greaterThan(0)
+
+    const link = screen.queryByRole('link')
+    expect(link).to.exist
+    expect(link?.getAttribute('href')).to.equal(billingPortalUrl)
+  })
+})
diff --git a/services/web/test/frontend/features/subscription/components/successful-subscription/successful-subscription.test.tsx b/services/web/test/frontend/features/subscription/components/successful-subscription/successful-subscription.test.tsx
index 33979e6b9e..9259eaf259 100644
--- a/services/web/test/frontend/features/subscription/components/successful-subscription/successful-subscription.test.tsx
+++ b/services/web/test/frontend/features/subscription/components/successful-subscription/successful-subscription.test.tsx
@@ -4,21 +4,28 @@ import SuccessfulSubscription from '../../../../../../frontend/js/features/subsc
 import { renderWithSubscriptionDashContext } from '../../helpers/render-with-subscription-dash-context'
 import { annualActiveSubscription } from '../../fixtures/subscriptions'
 import { ExposedSettings } from '../../../../../../types/exposed-settings'
+import { UserProvider } from '@/shared/context/user-context'
 
 describe('successful subscription page', function () {
   it('renders the invoices link', function () {
     const adminEmail = 'foo@example.com'
-    renderWithSubscriptionDashContext(<SuccessfulSubscription />, {
-      metaTags: [
-        {
-          name: 'ol-ExposedSettings',
-          value: {
-            adminEmail,
-          } as ExposedSettings,
-        },
-        { name: 'ol-subscription', value: annualActiveSubscription },
-      ],
-    })
+    renderWithSubscriptionDashContext(
+      <UserProvider>
+        <SuccessfulSubscription />
+      </UserProvider>,
+
+      {
+        metaTags: [
+          {
+            name: 'ol-ExposedSettings',
+            value: {
+              adminEmail,
+            } as ExposedSettings,
+          },
+          { name: 'ol-subscription', value: annualActiveSubscription },
+        ],
+      }
+    )
 
     screen.getByRole('heading', { name: /thanks for subscribing/i })
     const alert = screen.getByRole('alert')
@@ -36,8 +43,8 @@ describe('successful subscription page', function () {
     screen.getByText(
       /it’s support from people like yourself that allows .* to continue to grow and improve/i
     )
-    expect(screen.getByText(/get the most from your/i).textContent).to.match(
-      /get the most from your .* subscription\. discover premium features/i
+    expect(screen.getByText(/get the most out of your/i).textContent).to.match(
+      /get the most out of your subscription by checking out Overleaf’s features/i
     )
     expect(
       screen
@@ -66,7 +73,7 @@ describe('successful subscription page', function () {
     )
 
     const helpLink = screen.getByRole('link', {
-      name: /discover premium features/i,
+      name: /Overleaf’s features/i,
     })
     expect(helpLink.getAttribute('href')).to.equal(
       '/learn/how-to/Overleaf_premium_features'
diff --git a/services/web/test/frontend/features/subscription/fixtures/subscriptions.ts b/services/web/test/frontend/features/subscription/fixtures/subscriptions.ts
index 24194ea080..8011c5206d 100644
--- a/services/web/test/frontend/features/subscription/fixtures/subscriptions.ts
+++ b/services/web/test/frontend/features/subscription/fixtures/subscriptions.ts
@@ -1,7 +1,7 @@
 import {
   CustomSubscription,
   GroupSubscription,
-  RecurlySubscription,
+  PaidSubscription,
 } from '../../../../../types/subscription/dashboard/subscription'
 import dateformat from 'dateformat'
 
@@ -15,7 +15,7 @@ const sevenDaysFromTodayFormatted = dateformat(
   'dS mmmm yyyy'
 )
 
-export const annualActiveSubscription: RecurlySubscription = {
+export const annualActiveSubscription: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -25,7 +25,6 @@ export const annualActiveSubscription: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -33,11 +32,10 @@ export const annualActiveSubscription: RecurlySubscription = {
     annual: true,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -45,22 +43,21 @@ export const annualActiveSubscription: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$199.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: false,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const annualActiveSubscriptionEuro: RecurlySubscription = {
+export const annualActiveSubscriptionEuro: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -70,7 +67,6 @@ export const annualActiveSubscriptionEuro: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -78,11 +74,10 @@ export const annualActiveSubscriptionEuro: RecurlySubscription = {
     annual: true,
     featureDescription: [],
   },
-  recurly: {
-    tax: 4296,
+  payment: {
     taxRate: 0.24,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -90,22 +85,21 @@ export const annualActiveSubscriptionEuro: RecurlySubscription = {
     currency: 'EUR',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '€221.96',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const annualActiveSubscriptionPro: RecurlySubscription = {
+export const annualActiveSubscriptionPro: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -115,18 +109,16 @@ export const annualActiveSubscriptionPro: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'professional',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'professional',
     name: 'Professional',
     price_in_cents: 4500,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -134,22 +126,21 @@ export const annualActiveSubscriptionPro: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$42.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const pastDueExpiredSubscription: RecurlySubscription = {
+export const pastDueExpiredSubscription: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -159,7 +150,6 @@ export const pastDueExpiredSubscription: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -167,11 +157,10 @@ export const pastDueExpiredSubscription: RecurlySubscription = {
     annual: true,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -179,22 +168,21 @@ export const pastDueExpiredSubscription: RecurlySubscription = {
     currency: 'USD',
     state: 'expired',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'true', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: true,
     displayPrice: '$199.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const canceledSubscription: RecurlySubscription = {
+export const canceledSubscription: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -204,7 +192,6 @@ export const canceledSubscription: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -212,11 +199,10 @@ export const canceledSubscription: RecurlySubscription = {
     annual: true,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -224,22 +210,21 @@ export const canceledSubscription: RecurlySubscription = {
     currency: 'USD',
     state: 'canceled',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'true', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$199.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const pendingSubscriptionChange: RecurlySubscription = {
+export const pendingSubscriptionChange: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -249,7 +234,6 @@ export const pendingSubscriptionChange: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -257,11 +241,10 @@ export const pendingSubscriptionChange: RecurlySubscription = {
     annual: true,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -269,18 +252,17 @@ export const pendingSubscriptionChange: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$199.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: false,
+    isEligibleForDowngradeUpsell: false,
   },
   pendingPlan: {
     planCode: 'professional-annual',
@@ -302,7 +284,6 @@ export const groupActiveSubscription: GroupSubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'group_collaborator_10_enterprise',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'group_collaborator_10_enterprise',
     name: 'Overleaf Standard (Collaborator) - Group Account (10 licenses) - Enterprise',
@@ -313,11 +294,10 @@ export const groupActiveSubscription: GroupSubscription = {
     membersLimit: 10,
     membersLimitAddOn: 'additional-license',
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 10,
     nextPaymentDueAt,
@@ -325,18 +305,17 @@ export const groupActiveSubscription: GroupSubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$1290.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: false,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
@@ -352,7 +331,6 @@ export const groupActiveSubscriptionWithPendingLicenseChange: GroupSubscription
     admin_id: 'abc123',
     teamInvites: [],
     planCode: 'group_collaborator_10_enterprise',
-    recurlySubscription_id: 'ghi789',
     plan: {
       planCode: 'group_collaborator_10_enterprise',
       name: 'Overleaf Standard (Collaborator) - Group Account (10 licenses) - Enterprise',
@@ -363,11 +341,10 @@ export const groupActiveSubscriptionWithPendingLicenseChange: GroupSubscription
       membersLimit: 10,
       membersLimitAddOn: 'additional-license',
     },
-    recurly: {
-      tax: 0,
+    payment: {
       taxRate: 0,
-      billingDetailsLink: '/user/subscription/recurly/billing-details',
-      accountManagementLink: '/user/subscription/recurly/account-management',
+      billingDetailsLink: '/user/subscription/payment/billing-details',
+      accountManagementLink: '/user/subscription/payment/account-management',
       additionalLicenses: 11,
       totalLicenses: 21,
       nextPaymentDueAt,
@@ -375,31 +352,19 @@ export const groupActiveSubscriptionWithPendingLicenseChange: GroupSubscription
       currency: 'USD',
       state: 'active',
       trialEndsAtFormatted: null,
-      trial_ends_at: null,
+      trialEndsAt: null,
       activeCoupons: [],
-      account: {
-        email: 'fake@example.com',
-        created_at: '2024-12-31T09:40:27.000Z',
-        has_canceled_subscription: {
-          _: 'false',
-          $: {
-            type: 'boolean',
-          },
-        },
-        has_past_due_invoice: {
-          _: 'false',
-          $: {
-            type: 'boolean',
-          },
-        },
-      },
+      accountEmail: 'fake@example.com',
+      hasPastDueInvoice: false,
       displayPrice: '$2967.00',
-      currentPlanDisplayPrice: '$2709.00',
       pendingAdditionalLicenses: 13,
       pendingTotalLicenses: 23,
       planOnlyDisplayPrice: '',
       addOns: [],
       addOnDisplayPricesWithoutAdditionalLicense: {},
+      isEligibleForGroupPlan: true,
+      isEligibleForPause: false,
+      isEligibleForDowngradeUpsell: false,
     },
     pendingPlan: {
       planCode: 'group_collaborator_10_enterprise',
@@ -413,7 +378,7 @@ export const groupActiveSubscriptionWithPendingLicenseChange: GroupSubscription
     },
   }
 
-export const trialSubscription: RecurlySubscription = {
+export const trialSubscription: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -423,7 +388,6 @@ export const trialSubscription: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'paid-personal_free_trial_7_days',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'paid-personal_free_trial_7_days',
     name: 'Personal',
@@ -431,11 +395,10 @@ export const trialSubscription: RecurlySubscription = {
     featureDescription: [],
     hideFromUsers: true,
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt: sevenDaysFromTodayFormatted,
@@ -443,28 +406,17 @@ export const trialSubscription: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: sevenDaysFromTodayFormatted,
-    trial_ends_at: new Date(sevenDaysFromToday).toString(),
+    trialEndsAt: new Date(sevenDaysFromToday).toString(),
     activeCoupons: [],
-    account: {
-      email: 'fake@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: {
-        _: 'false',
-        $: {
-          type: 'boolean',
-        },
-      },
-      has_past_due_invoice: {
-        _: 'false',
-        $: {
-          type: 'boolean',
-        },
-      },
-    },
+    accountEmail: 'fake@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$14.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: false,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
@@ -478,7 +430,6 @@ export const customSubscription: CustomSubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator-annual',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator-annual',
     name: 'Standard (Collaborator) Annual',
@@ -489,7 +440,7 @@ export const customSubscription: CustomSubscription = {
   customAccount: true,
 }
 
-export const trialCollaboratorSubscription: RecurlySubscription = {
+export const trialCollaboratorSubscription: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -499,7 +450,6 @@ export const trialCollaboratorSubscription: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator_free_trial_7_days',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator_free_trial_7_days',
     name: 'Standard (Collaborator)',
@@ -507,11 +457,10 @@ export const trialCollaboratorSubscription: RecurlySubscription = {
     featureDescription: [],
     hideFromUsers: true,
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt: sevenDaysFromTodayFormatted,
@@ -519,32 +468,21 @@ export const trialCollaboratorSubscription: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: sevenDaysFromTodayFormatted,
-    trial_ends_at: new Date(sevenDaysFromToday).toString(),
+    trialEndsAt: new Date(sevenDaysFromToday).toString(),
     activeCoupons: [],
-    account: {
-      email: 'foo@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: {
-        _: 'false',
-        $: {
-          type: 'boolean',
-        },
-      },
-      has_past_due_invoice: {
-        _: 'false',
-        $: {
-          type: 'boolean',
-        },
-      },
-    },
+    accountEmail: 'foo@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$21.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: false,
   },
 }
 
-export const monthlyActiveCollaborator: RecurlySubscription = {
+export const monthlyActiveCollaborator: PaidSubscription = {
   manager_ids: ['abc123'],
   member_ids: [],
   invited_emails: [],
@@ -554,18 +492,16 @@ export const monthlyActiveCollaborator: RecurlySubscription = {
   admin_id: 'abc123',
   teamInvites: [],
   planCode: 'collaborator',
-  recurlySubscription_id: 'ghi789',
   plan: {
     planCode: 'collaborator',
     name: 'Standard (Collaborator)',
     price_in_cents: 212300900,
     featureDescription: [],
   },
-  recurly: {
-    tax: 0,
+  payment: {
     taxRate: 0,
-    billingDetailsLink: '/user/subscription/recurly/billing-details',
-    accountManagementLink: '/user/subscription/recurly/account-management',
+    billingDetailsLink: '/user/subscription/payment/billing-details',
+    accountManagementLink: '/user/subscription/payment/account-management',
     additionalLicenses: 0,
     totalLicenses: 0,
     nextPaymentDueAt,
@@ -573,17 +509,16 @@ export const monthlyActiveCollaborator: RecurlySubscription = {
     currency: 'USD',
     state: 'active',
     trialEndsAtFormatted: null,
-    trial_ends_at: null,
+    trialEndsAt: null,
     activeCoupons: [],
-    account: {
-      email: 'foo@example.com',
-      created_at: '2024-12-31T09:40:27.000Z',
-      has_canceled_subscription: { _: 'false', $: { type: 'boolean' } },
-      has_past_due_invoice: { _: 'false', $: { type: 'boolean' } },
-    },
+    accountEmail: 'foo@example.com',
+    hasPastDueInvoice: false,
     displayPrice: '$21.00',
     planOnlyDisplayPrice: '',
     addOns: [],
     addOnDisplayPricesWithoutAdditionalLicense: {},
+    isEligibleForGroupPlan: true,
+    isEligibleForPause: true,
+    isEligibleForDowngradeUpsell: true,
   },
 }
diff --git a/services/web/test/frontend/features/subscription/helpers/render-active-subscription.tsx b/services/web/test/frontend/features/subscription/helpers/render-active-subscription.tsx
index 19566a8945..110c6c4f74 100644
--- a/services/web/test/frontend/features/subscription/helpers/render-active-subscription.tsx
+++ b/services/web/test/frontend/features/subscription/helpers/render-active-subscription.tsx
@@ -1,12 +1,12 @@
 import { ActiveSubscription } from '../../../../../frontend/js/features/subscription/components/dashboard/states/active/active'
-import { RecurlySubscription } from '../../../../../types/subscription/dashboard/subscription'
+import { PaidSubscription } from '../../../../../types/subscription/dashboard/subscription'
 import { groupPlans, plans } from '../fixtures/plans'
 import { renderWithSubscriptionDashContext } from './render-with-subscription-dash-context'
 import { MetaTag } from '@/utils/meta'
 import { CurrencyCode } from '../../../../../types/subscription/currency'
 
 export function renderActiveSubscription(
-  subscription: RecurlySubscription,
+  subscription: PaidSubscription,
   tags: MetaTag[] = [],
   currencyCode?: CurrencyCode
 ) {
diff --git a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx
index 38a5d7c021..1246b7271b 100644
--- a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx
+++ b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx
@@ -90,5 +90,5 @@ export function renderWithSubscriptionDashContext(
 export function cleanUpContext() {
   // @ts-ignore
   delete global.recurly
-  fetchMock.reset()
+  fetchMock.removeRoutes().clearHistory()
 }
diff --git a/services/web/test/frontend/features/subscription/util/is-monthly-collaborator-plan.test.ts b/services/web/test/frontend/features/subscription/util/is-monthly-collaborator-plan.test.ts
deleted file mode 100644
index dd9c2a64b1..0000000000
--- a/services/web/test/frontend/features/subscription/util/is-monthly-collaborator-plan.test.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { expect } from 'chai'
-import isMonthlyCollaboratorPlan from '../../../../../frontend/js/features/subscription/util/is-monthly-collaborator-plan'
-
-describe('isMonthlyCollaboratorPlan', function () {
-  it('returns false when a plan code without "collaborator" ', function () {
-    expect(isMonthlyCollaboratorPlan('test', false)).to.be.false
-  })
-  it('returns false when on a plan with "collaborator" and "ann"', function () {
-    expect(isMonthlyCollaboratorPlan('collaborator-annual', false)).to.be.false
-  })
-  it('returns false when on a plan with "collaborator" and without "ann" but is a group plan', function () {
-    expect(isMonthlyCollaboratorPlan('collaborator', true)).to.be.false
-  })
-  it('returns true when on a plan with non-group "collaborator" monthly plan', function () {
-    expect(isMonthlyCollaboratorPlan('collaborator', false)).to.be.true
-  })
-})
diff --git a/services/web/test/frontend/features/subscription/util/show-downgrade-option.test.ts b/services/web/test/frontend/features/subscription/util/show-downgrade-option.test.ts
deleted file mode 100644
index 8a464ac796..0000000000
--- a/services/web/test/frontend/features/subscription/util/show-downgrade-option.test.ts
+++ /dev/null
@@ -1,68 +0,0 @@
-import { expect } from 'chai'
-import showDowngradeOption from '../../../../../frontend/js/features/subscription/util/show-downgrade-option'
-import dateformat from 'dateformat'
-
-describe('showDowngradeOption', function () {
-  const today = new Date()
-  const sevenDaysFromToday = new Date().setDate(today.getDate() + 7)
-  const sevenDaysFromTodayFormatted = dateformat(
-    sevenDaysFromToday,
-    'dS mmmm yyyy'
-  )
-
-  it('returns false when no trial end date', function () {
-    expect(showDowngradeOption('collab')).to.be.false
-  })
-  it('returns false when a plan code without "collaborator" ', function () {
-    expect(showDowngradeOption('test', false, sevenDaysFromTodayFormatted)).to
-      .be.false
-  })
-  it('returns false when on a plan with trial date in future but has "collaborator" and "ann" in plan code', function () {
-    expect(
-      showDowngradeOption(
-        'collaborator-annual',
-        false,
-        sevenDaysFromTodayFormatted
-      )
-    ).to.be.false
-  })
-  it('returns false when on a plan with trial date in future and plan code has "collaborator" and no "ann" but is a group plan', function () {
-    expect(
-      showDowngradeOption('collaborator', true, sevenDaysFromTodayFormatted)
-    ).to.be.false
-  })
-  it('returns false when on a plan with "collaborator" and without "ann" and trial date in future', function () {
-    expect(
-      showDowngradeOption('collaborator', false, sevenDaysFromTodayFormatted)
-    ).to.be.false
-  })
-  it('returns true when on a plan with "collaborator" and without "ann" and no trial date', function () {
-    expect(showDowngradeOption('collaborator', false)).to.be.true
-  })
-  it('returns true when on a plan with "collaborator" and without "ann" and trial date is in the past', function () {
-    expect(
-      showDowngradeOption('collaborator', false, '2000-02-16T17:59:07.000Z')
-    ).to.be.true
-  })
-  it('returns false when on a monthly collaborator plan with a pending pause', function () {
-    expect(
-      showDowngradeOption(
-        'collaborator',
-        false,
-        null,
-        '2030-01-01T12:00:00.000Z'
-      )
-    ).to.be.false
-  })
-  it('returns false when on a monthly collaborator plan with an active pause', function () {
-    expect(
-      showDowngradeOption(
-        'collaborator',
-        false,
-        null,
-        '2030-01-01T12:00:00.000Z',
-        5
-      )
-    ).to.be.false
-  })
-})
diff --git a/services/web/test/frontend/features/word-count-modal/components/word-count-modal.spec.tsx b/services/web/test/frontend/features/word-count-modal/components/word-count-modal.spec.tsx
new file mode 100644
index 0000000000..9fc5887535
--- /dev/null
+++ b/services/web/test/frontend/features/word-count-modal/components/word-count-modal.spec.tsx
@@ -0,0 +1,111 @@
+import WordCountModal from '@/features/word-count-modal/components/word-count-modal'
+import { EditorProviders } from '../../../helpers/editor-providers'
+
+describe('<WordCountModal />', function () {
+  beforeEach(function () {
+    cy.interceptCompile()
+  })
+
+  it('renders the translated modal title', function () {
+    cy.intercept('/project/*/wordcount*', {
+      body: { texcount: { messages: 'This is a test' } },
+    })
+
+    cy.mount(
+      <EditorProviders projectId="project-1">
+        <WordCountModal show handleHide={cy.stub()} />
+      </EditorProviders>
+    )
+
+    cy.findByText('Word Count')
+    cy.findByText(/something went wrong/).should('not.exist')
+  })
+
+  it('renders a loading message when loading', function () {
+    const { promise, resolve } = Promise.withResolvers<void>()
+
+    cy.intercept('/project/*/wordcount*', async req => {
+      await promise
+      req.reply({ texcount: { messages: 'This is a test' } })
+    })
+
+    cy.mount(
+      <EditorProviders projectId="project-1">
+        <WordCountModal show handleHide={cy.stub()} />
+      </EditorProviders>
+    )
+
+    cy.findByText('Loading…').then(() => {
+      resolve()
+    })
+
+    cy.findByText('This is a test')
+  })
+
+  it('renders an error message and hides loading message on error', function () {
+    cy.intercept('/project/*/wordcount?*', {
+      statusCode: 500,
+    })
+
+    cy.mount(
+      <EditorProviders projectId="project-1">
+        <WordCountModal show handleHide={cy.stub()} />
+      </EditorProviders>
+    )
+
+    cy.findByText('Sorry, something went wrong')
+
+    cy.findByText('Loading').should('not.exist')
+  })
+
+  it('displays messages', function () {
+    cy.intercept('/project/*/wordcount*', {
+      body: { texcount: { messages: 'This is a test' } },
+    })
+
+    cy.mount(
+      <EditorProviders projectId="project-1">
+        <WordCountModal show handleHide={cy.stub()} />
+      </EditorProviders>
+    )
+
+    cy.findByText('This is a test')
+  })
+
+  it('displays counts data', function () {
+    cy.intercept('/project/*/wordcount*', {
+      body: {
+        texcount: {
+          textWords: 500,
+          headWords: 100,
+          outside: 200,
+          mathDisplay: 2,
+          mathInline: 3,
+          headers: 4,
+        },
+      },
+    })
+
+    cy.mount(
+      <EditorProviders projectId="project-1">
+        <WordCountModal show handleHide={cy.stub()} />
+      </EditorProviders>
+    )
+
+    cy.findByText((content, element) => {
+      return /^Total Words\s*:\s*500$/.test(element!.textContent!.trim())
+    })
+
+    cy.findByText((content, element) => {
+      return /^Math Display\s*:\s*2$/.test(element!.textContent!.trim())
+    })
+
+    cy.findByText((content, element) => {
+      return /^Math Inline\s*:\s*3$/.test(element!.textContent!.trim())
+    })
+
+    cy.findByText((content, element) => {
+      return /^Headers\s*:\s*4$/.test(element!.textContent!.trim())
+    })
+  })
+})
diff --git a/services/web/test/frontend/features/word-count-modal/components/word-count-modal.test.jsx b/services/web/test/frontend/features/word-count-modal/components/word-count-modal.test.jsx
deleted file mode 100644
index cc2d37158c..0000000000
--- a/services/web/test/frontend/features/word-count-modal/components/word-count-modal.test.jsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import { screen } from '@testing-library/react'
-import { expect } from 'chai'
-import sinon from 'sinon'
-import fetchMock from 'fetch-mock'
-import { renderWithEditorContext } from '../../../helpers/render-with-context'
-import WordCountModal from '../../../../../frontend/js/features/word-count-modal/components/word-count-modal'
-
-describe('<WordCountModal />', function () {
-  afterEach(function () {
-    fetchMock.reset()
-  })
-
-  const contextProps = {
-    projectId: 'project-1',
-    clsiServerId: 'clsi-server-1',
-  }
-
-  it('renders the translated modal title', async function () {
-    fetchMock.get('express:/project/:projectId/wordcount', () => {
-      return { status: 200, body: { texcount: { messages: 'This is a test' } } }
-    })
-
-    const handleHide = sinon.stub()
-
-    renderWithEditorContext(
-      <WordCountModal show handleHide={handleHide} />,
-      contextProps
-    )
-
-    await screen.findByText('Word Count')
-  })
-
-  it('renders a loading message when loading', async function () {
-    fetchMock.get('express:/project/:projectId/wordcount', () => {
-      return { status: 200, body: { texcount: { messages: 'This is a test' } } }
-    })
-
-    const handleHide = sinon.stub()
-
-    renderWithEditorContext(
-      <WordCountModal show handleHide={handleHide} />,
-      contextProps
-    )
-
-    await screen.findByText('Loading…')
-
-    await screen.findByText('This is a test')
-  })
-
-  it('renders an error message and hides loading message on error', async function () {
-    fetchMock.get('express:/project/:projectId/wordcount', 500)
-
-    const handleHide = sinon.stub()
-
-    renderWithEditorContext(
-      <WordCountModal show handleHide={handleHide} />,
-      contextProps
-    )
-
-    await screen.findByText('Sorry, something went wrong')
-
-    expect(screen.queryByText(/Loading/)).to.not.exist
-  })
-
-  it('displays messages', async function () {
-    fetchMock.get('express:/project/:projectId/wordcount', () => {
-      return {
-        status: 200,
-        body: {
-          texcount: {
-            messages: 'This is a test',
-          },
-        },
-      }
-    })
-
-    const handleHide = sinon.stub()
-
-    renderWithEditorContext(
-      <WordCountModal show handleHide={handleHide} />,
-      contextProps
-    )
-
-    await screen.findByText('This is a test')
-  })
-
-  it('displays counts data', async function () {
-    fetchMock.get('express:/project/:projectId/wordcount', () => {
-      return {
-        status: 200,
-        body: {
-          texcount: {
-            textWords: 100,
-            mathDisplay: 200,
-            mathInline: 300,
-            headers: 400,
-          },
-        },
-      }
-    })
-
-    const handleHide = sinon.stub()
-
-    renderWithEditorContext(
-      <WordCountModal show handleHide={handleHide} />,
-      contextProps
-    )
-
-    await screen.findByText((content, element) =>
-      element.textContent.trim().match(/^Total Words\s*:\s*100$/)
-    )
-    await screen.findByText((content, element) =>
-      element.textContent.trim().match(/^Math Display\s*:\s*200$/)
-    )
-    await screen.findByText((content, element) =>
-      element.textContent.trim().match(/^Math Inline\s*:\s*300$/)
-    )
-    await screen.findByText((content, element) =>
-      element.textContent.trim().match(/^Headers\s*:\s*400$/)
-    )
-  })
-})
diff --git a/services/web/test/frontend/features/word-count-modal/utils/count-words-in-file.test.ts b/services/web/test/frontend/features/word-count-modal/utils/count-words-in-file.test.ts
new file mode 100644
index 0000000000..32c7b72c7d
--- /dev/null
+++ b/services/web/test/frontend/features/word-count-modal/utils/count-words-in-file.test.ts
@@ -0,0 +1,72 @@
+import { readFile } from 'node:fs/promises'
+import path from 'node:path'
+import { countWordsInFile } from '@/features/word-count-modal/utils/count-words-in-file'
+import { WordCountData } from '@/features/word-count-modal/components/word-count-data'
+import { createSegmenters } from '@/features/word-count-modal/utils/segmenters'
+import { expect } from 'chai'
+
+describe('word count', function () {
+  beforeEach(async function () {
+    this.data = {
+      encode: '',
+      textWords: 0,
+      headWords: 0,
+      outside: 0,
+      headers: 0,
+      elements: 0,
+      mathInline: 0,
+      mathDisplay: 0,
+      errors: 0,
+      messages: '',
+      textCharacters: 0,
+      headCharacters: 0,
+      captionWords: 0,
+      captionCharacters: 0,
+      footnoteWords: 0,
+      footnoteCharacters: 0,
+      abstractWords: 0,
+      abstractCharacters: 0,
+      otherWords: 0,
+      otherCharacters: 0,
+    } satisfies WordCountData
+
+    const content = {
+      'word-count.tex': await readFile(
+        path.join(__dirname, 'word-count.tex'),
+        'utf-8'
+      ),
+    }
+
+    this.projectSnapshot = {
+      getDocContents(path: keyof typeof content) {
+        return content[path]
+      },
+    }
+
+    this.segmenters = createSegmenters('en_US')
+  })
+
+  it('produces correct counts', function () {
+    countWordsInFile(
+      this.data,
+      this.projectSnapshot,
+      'word-count.tex',
+      this.segmenters
+    )
+
+    expect(this.data).to.deep.include({
+      abstractCharacters: 8,
+      abstractWords: 2,
+      captionCharacters: 16,
+      captionWords: 4,
+      footnoteCharacters: 8,
+      footnoteWords: 2,
+      headCharacters: 296,
+      headWords: 52,
+      otherCharacters: 10,
+      otherWords: 2,
+      textCharacters: 193,
+      textWords: 42,
+    })
+  })
+})
diff --git a/services/web/test/frontend/features/word-count-modal/utils/word-count.tex b/services/web/test/frontend/features/word-count-modal/utils/word-count.tex
new file mode 100644
index 0000000000..4522d6a3bc
--- /dev/null
+++ b/services/web/test/frontend/features/word-count-modal/utils/word-count.tex
@@ -0,0 +1,118 @@
+\documentclass{article}
+\usepackage{graphicx}
+\usepackage{amsmath}
+
+\title{The Title} % 2 in headers
+\author{An Author} % 0
+\date{May 2025} % 0
+
+\begin{document}
+
+\maketitle % 0
+
+\thanks{bleep bloop}
+
+\begin{abstract}
+Word word % 2 in abstract
+\end{abstract}
+
+\section{plain text}
+Word word % 2
+
+\section{accents}
+w\'ard w\`erd w\"ird w\~ord w\.urd w\^ord % 6
+
+\section{accents with groups}
+% w\'{a}rd w\`{e}rd w\"{i}rd w\~{o}rd w\.{u}rd w\^{o}rd w\c{o}rd w\u{o}rd % 8 % TODO
+
+\section{grouped single character command}
+% w{\o}rd w\~{\o}rd % 2 % TODO
+
+\section{commands that create characters}
+\o\oe\aa\AE % 1
+
+\subsection{with braces}
+w\o{}rd w\oe{}rd w\aa{}rd w\AE{}rd % 4
+
+\subsection{with spaces}
+w\o rd w\oe rd w\ae rd w\AE rd % 4
+
+\section{symbols}
+\S{} \P{} % 0
+
+\section{formatting}
+\textit{italic} \textbf{bold} \textit{\textbf{bold italic}} % 4
+\texttt{teletype} \textsf{sans-serif} \textsc{small caps} % 4
+\textsf{-} % 0
+
+\section{formatting inside word}
+% wo\textit{italic}rd %1 % TODO
+
+\section{commands that create text}
+\textbackslash{}word \LaTeX{} % 2
+
+\section{special characters}
+word\&word \$word word\% \#word wo\_rd \{word\} % 7
+
+\section{footnote}
+\footnote{word word} % 2 in footnote
+
+\section{headers}
+\part{word} % 1
+\chapter{word} % 1
+\section{word} % 1
+\subsection{word} % 1
+\subsubsection{word} % 1
+\paragraph{word} % 1
+
+\section{verbatim}
+\verb|word word word| % 0
+
+\section{list}
+\begin{itemize}
+    \item word % 1
+    \item word % 1
+\end{itemize}
+
+\section{figure}
+\begin{figure}
+    \includegraphics[width=0.5\linewidth]{example.png} %0
+    \caption{Word word} %2 in captions
+\end{figure}
+
+\section{table}
+\begin{table}
+    \begin{tabular}{c|c}
+       word & word \\ % 2
+       word & word % 2
+    \end{tabular}
+    \caption{Word word} % 2 in captions
+\end{table}
+
+\section{line break}
+word\\word % 2
+
+\section{inline math}
+$2+3=5$ % 0
+
+\section{display math}
+\[2+3=5\]
+
+\begin{equation}
+    2+3=5
+\end{equation}
+
+\begin{equation*}
+    2+3=5
+\end{equation*}
+
+\begin{align*}
+2x - 5y &=  8 \\
+3x + 9y &=  -12
+\end{align*}
+
+\section{text in math}
+
+$ 2+3 \text{ is equal to } 5 $
+
+\end{document}
diff --git a/services/web/test/frontend/helpers/bootstrap-3.ts b/services/web/test/frontend/helpers/bootstrap-3.ts
deleted file mode 100644
index c651ed9900..0000000000
--- a/services/web/test/frontend/helpers/bootstrap-3.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import '../../../frontend/stylesheets/main-style.less'
-
-beforeEach(function () {
-  window.metaAttributesCache.set('ol-bootstrapVersion', 3)
-})
diff --git a/services/web/test/frontend/helpers/editor-providers.jsx b/services/web/test/frontend/helpers/editor-providers.jsx
deleted file mode 100644
index cd21b92456..0000000000
--- a/services/web/test/frontend/helpers/editor-providers.jsx
+++ /dev/null
@@ -1,224 +0,0 @@
-// Disable prop type checks for test harnesses
-/* eslint-disable react/prop-types */
-import sinon from 'sinon'
-import { get, merge } from 'lodash'
-import { SocketIOMock } from '@/ide/connection/SocketIoShim'
-import { IdeContext } from '@/shared/context/ide-context'
-import React, { useEffect, useState } from 'react'
-import {
-  createReactScopeValueStore,
-  IdeReactContext,
-} from '@/features/ide-react/context/ide-react-context'
-import { IdeEventEmitter } from '@/features/ide-react/create-ide-event-emitter'
-import { ReactScopeEventEmitter } from '@/features/ide-react/scope-event-emitter/react-scope-event-emitter'
-import { ConnectionContext } from '@/features/ide-react/context/connection-context'
-import { ReactContextRoot } from '@/features/ide-react/context/react-context-root'
-
-// these constants can be imported in tests instead of
-// using magic strings
-export const PROJECT_ID = 'project123'
-export const PROJECT_NAME = 'project-name'
-export const USER_ID = '123abd'
-export const USER_EMAIL = 'testuser@example.com'
-
-const defaultUserSettings = {
-  pdfViewer: 'pdfjs',
-  fontSize: 12,
-  fontFamily: 'monaco',
-  lineHeight: 'normal',
-  editorTheme: 'textmate',
-  overallTheme: '',
-  mode: 'default',
-  autoComplete: true,
-  autoPairDelimiters: true,
-  trackChanges: true,
-  syntaxValidation: false,
-  mathPreview: true,
-}
-
-export function EditorProviders({
-  user = { id: USER_ID, email: USER_EMAIL },
-  projectId = PROJECT_ID,
-  projectOwner = {
-    _id: '124abd',
-    email: 'owner@example.com',
-  },
-  rootDocId = '_root_doc_id',
-  socket = new SocketIOMock(),
-  isRestrictedTokenMember = false,
-  clsiServerId = '1234',
-  scope = {},
-  features = {
-    referencesSearch: true,
-  },
-  projectFeatures = features,
-  permissionsLevel = 'owner',
-  children,
-  rootFolder = [
-    {
-      _id: 'root-folder-id',
-      name: 'rootFolder',
-      docs: [],
-      folders: [],
-      fileRefs: [],
-    },
-  ],
-  ui = { view: 'editor', pdfLayout: 'sideBySide', chatOpen: true },
-  fileTreeManager = {
-    findEntityById: () => null,
-    findEntityByPath: () => null,
-    getEntityPath: () => '',
-    getRootDocDirname: () => '',
-    getPreviewByPath: path => ({ url: path, extension: 'png' }),
-  },
-  editorManager = {
-    getCurrentDocumentId: () => 'foo',
-    getCurrentDocValue: () => {},
-    openDoc: sinon.stub(),
-  },
-  userSettings = {},
-  providers = {},
-}) {
-  window.metaAttributesCache.set(
-    'ol-gitBridgePublicBaseUrl',
-    'https://git.overleaf.test'
-  )
-  window.metaAttributesCache.set(
-    'ol-isRestrictedTokenMember',
-    isRestrictedTokenMember
-  )
-  window.metaAttributesCache.set(
-    'ol-userSettings',
-    merge({}, defaultUserSettings, userSettings)
-  )
-
-  const $scope = merge(
-    {
-      user,
-      editor: {
-        sharejs_doc: {
-          doc_id: 'test-doc',
-          getSnapshot: () => 'some doc content',
-        },
-      },
-      project: {
-        _id: projectId,
-        name: PROJECT_NAME,
-        owner: projectOwner,
-        features: projectFeatures,
-        rootDoc_id: rootDocId,
-        rootFolder,
-      },
-      ui,
-      $watch: (path, callback) => {
-        callback(get($scope, path))
-        return () => null
-      },
-      $on: sinon.stub(),
-      $applyAsync: sinon.stub(),
-      permissionsLevel,
-    },
-    scope
-  )
-
-  window._ide = {
-    $scope,
-    socket,
-    clsiServerId,
-    editorManager,
-    fileTreeManager,
-  }
-
-  // Add details for useUserContext
-  window.metaAttributesCache.set('ol-user', { ...user, features })
-  window.metaAttributesCache.set('ol-project_id', projectId)
-
-  return (
-    <ReactContextRoot
-      providers={{
-        ConnectionProvider,
-        IdeReactProvider,
-        ...providers,
-      }}
-    >
-      {children}
-    </ReactContextRoot>
-  )
-}
-
-const ConnectionProvider = ({ children }) => {
-  const [value] = useState(() => ({
-    socket: window._ide.socket,
-    connectionState: {
-      readyState: WebSocket.OPEN,
-      forceDisconnected: false,
-      inactiveDisconnect: false,
-      reconnectAt: null,
-      forcedDisconnectDelay: 0,
-      lastConnectionAttempt: 0,
-      error: '',
-    },
-    isConnected: true,
-    isStillReconnecting: false,
-    secondsUntilReconnect: () => 0,
-    tryReconnectNow: () => {},
-    registerUserActivity: () => {},
-    disconnect: () => {},
-  }))
-
-  return (
-    <ConnectionContext.Provider value={value}>
-      {children}
-    </ConnectionContext.Provider>
-  )
-}
-
-const IdeReactProvider = ({ children }) => {
-  const [startedFreeTrial, setStartedFreeTrial] = useState(false)
-
-  const [ideReactContextValue] = useState(() => ({
-    projectId: PROJECT_ID,
-    eventEmitter: new IdeEventEmitter(),
-    startedFreeTrial,
-    setStartedFreeTrial,
-    reportError: () => {},
-    projectJoined: true,
-  }))
-
-  const [ideContextValue] = useState(() => {
-    const ide = window._ide
-
-    const scopeStore = createReactScopeValueStore(PROJECT_ID)
-    for (const [key, value] of Object.entries(ide.$scope)) {
-      // TODO: path for nested entries
-      scopeStore.set(key, value)
-    }
-    scopeStore.set('editor.sharejs_doc', ide.$scope.editor.sharejs_doc)
-    scopeStore.set('ui.chatOpen', ide.$scope.ui.chatOpen)
-    const scopeEventEmitter = new ReactScopeEventEmitter(new IdeEventEmitter())
-
-    return {
-      ...ide,
-      scopeStore,
-      scopeEventEmitter,
-    }
-  })
-
-  useEffect(() => {
-    window.overleaf = {
-      ...window.overleaf,
-      unstable: {
-        ...window.overleaf?.unstable,
-        store: ideContextValue.scopeStore,
-      },
-    }
-  }, [ideContextValue.scopeStore])
-
-  return (
-    <IdeReactContext.Provider value={ideReactContextValue}>
-      <IdeContext.Provider value={ideContextValue}>
-        {children}
-      </IdeContext.Provider>
-    </IdeReactContext.Provider>
-  )
-}
diff --git a/services/web/test/frontend/helpers/editor-providers.tsx b/services/web/test/frontend/helpers/editor-providers.tsx
new file mode 100644
index 0000000000..16df207b88
--- /dev/null
+++ b/services/web/test/frontend/helpers/editor-providers.tsx
@@ -0,0 +1,576 @@
+// Disable prop type checks for test harnesses
+/* eslint-disable react/prop-types */
+import { merge } from 'lodash'
+import { SocketIOMock } from '@/ide/connection/SocketIoShim'
+import { IdeContext } from '@/shared/context/ide-context'
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  useMemo,
+  type FC,
+  type PropsWithChildren,
+} from 'react'
+import { IdeReactContext } from '@/features/ide-react/context/ide-react-context'
+import { IdeEventEmitter } from '@/features/ide-react/create-ide-event-emitter'
+import { ReactScopeValueStore } from '@/features/ide-react/scope-value-store/react-scope-value-store'
+import { ReactScopeEventEmitter } from '@/features/ide-react/scope-event-emitter/react-scope-event-emitter'
+import { ConnectionContext } from '@/features/ide-react/context/connection-context'
+import {
+  EditorOpenDocContext,
+  type EditorOpenDocContextState,
+} from '@/features/ide-react/context/editor-open-doc-context'
+import { ProjectContext } from '@/shared/context/project-context'
+import { ReactContextRoot } from '@/features/ide-react/context/react-context-root'
+import useEventListener from '@/shared/hooks/use-event-listener'
+import useDetachLayout from '@/shared/hooks/use-detach-layout'
+import useExposedState from '@/shared/hooks/use-exposed-state'
+import { ProjectSnapshot } from '@/infrastructure/project-snapshot'
+import {
+  EditorPropertiesContext,
+  EditorPropertiesContextValue,
+} from '@/features/ide-react/context/editor-properties-context'
+import {
+  type IdeLayout,
+  type IdeView,
+  LayoutContext,
+  type LayoutContextValue,
+} from '@/shared/context/layout-context'
+import type { Socket } from '@/features/ide-react/connection/types/socket'
+import type { PermissionsLevel } from '@/features/ide-react/types/permissions'
+import type { Folder } from '../../../types/folder'
+import type { SocketDebuggingInfo } from '@/features/ide-react/connection/types/connection-state'
+import type { DocumentContainer } from '@/features/ide-react/editor/document-container'
+import {
+  ProjectMetadata,
+  ProjectUpdate,
+} from '@/shared/context/types/project-metadata'
+import { UserId } from '../../../types/user'
+import { ProjectCompiler } from '../../../types/project-settings'
+
+// these constants can be imported in tests instead of
+// using magic strings
+export const PROJECT_ID = 'project123'
+export const PROJECT_NAME = 'project-name'
+export const USER_ID = '123abd'
+export const USER_EMAIL = 'testuser@example.com'
+
+const defaultUserSettings = {
+  pdfViewer: 'pdfjs',
+  fontSize: 12,
+  fontFamily: 'monaco',
+  lineHeight: 'normal',
+  editorTheme: 'textmate',
+  overallTheme: '',
+  mode: 'default',
+  autoComplete: true,
+  autoPairDelimiters: true,
+  trackChanges: true,
+  syntaxValidation: false,
+  mathPreview: true,
+}
+
+export type EditorProvidersProps = {
+  user?: { id: string; email: string }
+  projectId?: string
+  projectName?: string
+  projectOwner?: ProjectMetadata['owner']
+  rootDocId?: string
+  imageName?: string
+  compiler?: ProjectCompiler
+  socket?: Socket
+  isRestrictedTokenMember?: boolean
+  scope?: Record<string, any>
+  features?: Record<string, boolean>
+  projectFeatures?: Record<string, boolean>
+  permissionsLevel?: PermissionsLevel
+  children?: React.ReactNode
+  rootFolder?: Folder[]
+  layoutContext?: Partial<LayoutContextValue>
+  userSettings?: Record<string, any>
+  providers?: Record<string, React.FC<React.PropsWithChildren<any>>>
+}
+
+export const projectDefaults = {
+  _id: PROJECT_ID,
+  name: PROJECT_NAME,
+  owner: {
+    _id: '124abd' as UserId,
+    email: 'owner@example.com',
+    first_name: 'Test',
+    last_name: 'Owner',
+    privileges: 'owner',
+    signUpDate: new Date('2025-07-07').toISOString(),
+  },
+  features: {
+    referencesSearch: true,
+    gitBridge: false,
+  },
+  rootDocId: '_root_doc_id',
+  rootFolder: [
+    {
+      _id: 'root-folder-id',
+      name: 'rootFolder',
+      docs: [
+        {
+          _id: '_root_doc_id',
+          name: 'main.tex',
+        },
+      ],
+      folders: [],
+      fileRefs: [],
+    },
+  ],
+  imageName: 'texlive-full:2024.1',
+  compiler: 'pdflatex' as ProjectCompiler,
+  members: [],
+  invites: [],
+}
+
+/**
+ * @typedef {import('@/shared/context/layout-context').LayoutContextValue} LayoutContextValue
+ * @type Partial<LayoutContextValue>
+ */
+const layoutContextDefault = {
+  view: 'editor',
+  openFile: null,
+  chatIsOpen: true, // false in the application, true in tests
+  reviewPanelOpen: false,
+  miniReviewPanelVisible: false,
+  leftMenuShown: false,
+  projectSearchIsOpen: false,
+  pdfLayout: 'sideBySide',
+  loadingStyleSheet: false,
+} satisfies Partial<LayoutContextValue>
+
+export function EditorProviders({
+  user = { id: USER_ID, email: USER_EMAIL },
+  projectId = projectDefaults._id,
+  projectName = projectDefaults.name,
+  projectOwner = projectDefaults.owner,
+  rootDocId = projectDefaults.rootDocId,
+  imageName = projectDefaults.imageName,
+  compiler = projectDefaults.compiler,
+  socket = new SocketIOMock() as any as Socket,
+  isRestrictedTokenMember = false,
+  scope: defaultScope = {},
+  features = {
+    referencesSearch: true,
+    gitBridge: false,
+  },
+  projectFeatures = features,
+  permissionsLevel = 'owner',
+  children,
+  rootFolder = projectDefaults.rootFolder,
+  /** @type {Partial<LayoutContext>} */
+  layoutContext = layoutContextDefault,
+  userSettings = {},
+  providers = {},
+}: EditorProvidersProps) {
+  window.metaAttributesCache.set(
+    'ol-gitBridgePublicBaseUrl',
+    'https://git.overleaf.test'
+  )
+  window.metaAttributesCache.set(
+    'ol-isRestrictedTokenMember',
+    isRestrictedTokenMember
+  )
+  window.metaAttributesCache.set(
+    'ol-userSettings',
+    merge({}, defaultUserSettings, userSettings)
+  )
+
+  window.metaAttributesCache.set('ol-capabilities', ['chat', 'dropbox'])
+
+  const scope = merge(
+    {
+      user,
+      editor: {
+        sharejs_doc: {
+          doc_id: 'test-doc',
+          getSnapshot: () => 'some doc content',
+          hasBufferedOps: () => false,
+          on: () => {},
+          off: () => {},
+          leaveAndCleanUpPromise: async () => {},
+        } as any as DocumentContainer,
+        openDocName: null,
+        currentDocumentId: null,
+        wantTrackChanges: false,
+      },
+      permissionsLevel,
+    },
+    defaultScope
+  )
+
+  const project = {
+    _id: projectId,
+    name: projectName,
+    owner: projectOwner,
+    features: projectFeatures,
+    rootDocId,
+    rootFolder,
+    imageName,
+    compiler,
+    members: [],
+    invites: [],
+    trackChangesState: false,
+    spellCheckLanguage: 'en',
+  }
+
+  // Add details for useUserContext
+  window.metaAttributesCache.set('ol-user', { ...user, features })
+  window.metaAttributesCache.set('ol-project_id', projectId)
+
+  return (
+    <ReactContextRoot
+      providers={{
+        ConnectionProvider: makeConnectionProvider(socket),
+        IdeReactProvider: makeIdeReactProvider(scope, socket),
+        EditorOpenDocProvider: makeEditorOpenDocProvider({
+          currentDocumentId: scope.editor.currentDocumentId,
+          openDocName: scope.editor.openDocName,
+          currentDocument: scope.editor.sharejs_doc,
+        }),
+        EditorPropertiesProvider: makeEditorPropertiesProvider({
+          wantTrackChanges: scope.editor.wantTrackChanges,
+        }),
+        LayoutProvider: makeLayoutProvider(layoutContext),
+        ProjectProvider: makeProjectProvider(project),
+        ...providers,
+      }}
+    >
+      {children}
+    </ReactContextRoot>
+  )
+}
+
+const makeConnectionProvider = (socket: Socket) => {
+  const ConnectionProvider: FC<PropsWithChildren> = ({ children }) => {
+    const [value] = useState(() => ({
+      socket,
+      connectionState: {
+        readyState: WebSocket.OPEN,
+        forceDisconnected: false,
+        inactiveDisconnect: false,
+        reconnectAt: null,
+        forcedDisconnectDelay: 0,
+        lastConnectionAttempt: 0,
+        error: '' as const,
+      },
+      isConnected: true,
+      isStillReconnecting: false,
+      secondsUntilReconnect: () => 0,
+      tryReconnectNow: () => {},
+      registerUserActivity: () => {},
+      disconnect: () => {},
+      closeConnection: () => {},
+      getSocketDebuggingInfo: () => ({}) as SocketDebuggingInfo,
+    }))
+
+    return (
+      <ConnectionContext.Provider value={value}>
+        {children}
+      </ConnectionContext.Provider>
+    )
+  }
+  return ConnectionProvider
+}
+
+const makeIdeReactProvider = (
+  scope: Record<string, unknown>,
+  socket: Socket
+) => {
+  const IdeReactProvider: FC<PropsWithChildren> = ({ children }) => {
+    const [startedFreeTrial, setStartedFreeTrial] = useState(false)
+
+    const [ideReactContextValue] = useState(() => ({
+      projectId: PROJECT_ID,
+      eventEmitter: new IdeEventEmitter(),
+      startedFreeTrial,
+      setStartedFreeTrial,
+      reportError: () => {},
+      projectJoined: true,
+      permissionsLevel: scope.permissionsLevel as PermissionsLevel,
+      setPermissionsLevel: () => {},
+      setOutOfSync: () => {},
+    }))
+
+    const [ideContextValue] = useState(() => {
+      const scopeEventEmitter = new ReactScopeEventEmitter(
+        new IdeEventEmitter()
+      )
+      const unstableStore = new ReactScopeValueStore()
+
+      return {
+        socket,
+        scopeEventEmitter,
+        unstableStore,
+      }
+    })
+
+    useEffect(() => {
+      window.overleaf = {
+        ...window.overleaf,
+        unstable: {
+          ...window.overleaf?.unstable,
+          store: ideContextValue.unstableStore,
+        },
+      }
+    }, [ideContextValue.unstableStore])
+
+    return (
+      <IdeReactContext.Provider value={ideReactContextValue}>
+        <IdeContext.Provider value={ideContextValue}>
+          {children}
+        </IdeContext.Provider>
+      </IdeReactContext.Provider>
+    )
+  }
+  return IdeReactProvider
+}
+
+export function makeEditorOpenDocProvider(
+  initialValues: EditorOpenDocContextState
+) {
+  const {
+    currentDocumentId: initialCurrentDocumentId,
+    openDocName: initialOpenDocName,
+    currentDocument: initialCurrentDocument,
+  } = initialValues
+  const EditorOpenDocProvider: FC<PropsWithChildren> = ({ children }) => {
+    const [currentDocumentId, setCurrentDocumentId] = useExposedState(
+      initialCurrentDocumentId,
+      'editor.open_doc_id'
+    )
+    const [openDocName, setOpenDocName] = useExposedState(
+      initialOpenDocName,
+      'editor.open_doc_name'
+    )
+    const [currentDocument, setCurrentDocument] = useState(
+      initialCurrentDocument
+    )
+
+    const value = {
+      currentDocumentId,
+      setCurrentDocumentId,
+      openDocName,
+      setOpenDocName,
+      currentDocument,
+      setCurrentDocument,
+    }
+
+    return (
+      <EditorOpenDocContext.Provider value={value}>
+        {children}
+      </EditorOpenDocContext.Provider>
+    )
+  }
+
+  return EditorOpenDocProvider
+}
+
+const makeLayoutProvider = (
+  layoutContextOverrides?: Partial<LayoutContextValue>
+) => {
+  const layout = {
+    ...layoutContextDefault,
+    ...layoutContextOverrides,
+  }
+  const LayoutProvider: FC<PropsWithChildren> = ({ children }) => {
+    const [view, setView] = useState<IdeView | null>(layout.view)
+    const [openFile, setOpenFile] = useState(layout.openFile)
+    const [chatIsOpen, setChatIsOpen] = useState(layout.chatIsOpen)
+    const [reviewPanelOpen, setReviewPanelOpen] = useState(
+      layout.reviewPanelOpen
+    )
+    const [miniReviewPanelVisible, setMiniReviewPanelVisible] = useState(
+      layout.miniReviewPanelVisible
+    )
+    const [leftMenuShown, setLeftMenuShown] = useState(layout.leftMenuShown)
+    const [projectSearchIsOpen, setProjectSearchIsOpen] = useState(
+      layout.projectSearchIsOpen
+    )
+    const [pdfLayout, setPdfLayout] = useState(layout.pdfLayout)
+    const [loadingStyleSheet, setLoadingStyleSheet] = useState(
+      layout.loadingStyleSheet
+    )
+
+    useEventListener(
+      'ui.toggle-review-panel',
+      useCallback(() => {
+        setReviewPanelOpen(open => !open)
+      }, [setReviewPanelOpen])
+    )
+    const changeLayout = useCallback(
+      (newLayout: IdeLayout, newView: IdeView = 'editor') => {
+        setPdfLayout(newLayout)
+        setView(newLayout === 'sideBySide' ? 'editor' : newView)
+      },
+      [setPdfLayout, setView]
+    )
+
+    const restoreView = useCallback(() => {
+      setView('editor')
+    }, [])
+
+    const {
+      reattach,
+      detach,
+      isLinked: detachIsLinked,
+      role: detachRole,
+    } = useDetachLayout()
+    const pdfPreviewOpen =
+      pdfLayout === 'sideBySide' || view === 'pdf' || detachRole === 'detacher'
+    const value = useMemo(
+      () => ({
+        reattach,
+        detach,
+        detachIsLinked,
+        detachRole,
+        changeLayout,
+        chatIsOpen,
+        leftMenuShown,
+        openFile,
+        pdfLayout,
+        pdfPreviewOpen,
+        projectSearchIsOpen,
+        setProjectSearchIsOpen,
+        reviewPanelOpen,
+        miniReviewPanelVisible,
+        loadingStyleSheet,
+        setChatIsOpen,
+        setLeftMenuShown,
+        setOpenFile,
+        setPdfLayout,
+        setReviewPanelOpen,
+        setMiniReviewPanelVisible,
+        setLoadingStyleSheet,
+        setView,
+        view,
+        restoreView,
+      }),
+      [
+        reattach,
+        detach,
+        detachIsLinked,
+        detachRole,
+        changeLayout,
+        chatIsOpen,
+        leftMenuShown,
+        openFile,
+        pdfLayout,
+        pdfPreviewOpen,
+        projectSearchIsOpen,
+        setProjectSearchIsOpen,
+        reviewPanelOpen,
+        miniReviewPanelVisible,
+        loadingStyleSheet,
+        setChatIsOpen,
+        setLeftMenuShown,
+        setOpenFile,
+        setPdfLayout,
+        setReviewPanelOpen,
+        setMiniReviewPanelVisible,
+        setLoadingStyleSheet,
+        setView,
+        view,
+        restoreView,
+      ]
+    )
+
+    return (
+      <LayoutContext.Provider value={value}>{children}</LayoutContext.Provider>
+    )
+  }
+  return LayoutProvider
+}
+
+export function makeEditorPropertiesProvider(
+  initialValues: Partial<
+    Pick<
+      EditorPropertiesContextValue,
+      'showVisual' | 'showSymbolPalette' | 'wantTrackChanges'
+    >
+  >
+) {
+  const EditorPropertiesProvider: FC<PropsWithChildren> = ({ children }) => {
+    const {
+      showVisual: initialShowVisual,
+      showSymbolPalette: initialShowSymbolPalette,
+      wantTrackChanges: initialWantTrackChanges,
+    } = initialValues
+
+    const [showVisual, setShowVisual] = useState(initialShowVisual || false)
+    const [showSymbolPalette, setShowSymbolPalette] = useState(
+      initialShowSymbolPalette || false
+    )
+
+    function toggleSymbolPalette() {
+      setShowSymbolPalette(show => !show)
+    }
+
+    const [opening, setOpening] = useState(true)
+    const [trackChanges, setTrackChanges] = useState(false)
+    const [wantTrackChanges, setWantTrackChanges] = useState(
+      initialWantTrackChanges || false
+    )
+    const [errorState, setErrorState] = useState(false)
+
+    const value = {
+      showVisual,
+      setShowVisual,
+      showSymbolPalette,
+      setShowSymbolPalette,
+      toggleSymbolPalette,
+      opening,
+      setOpening,
+      trackChanges,
+      setTrackChanges,
+      wantTrackChanges,
+      setWantTrackChanges,
+      errorState,
+      setErrorState,
+    }
+
+    return (
+      <EditorPropertiesContext.Provider value={value}>
+        {children}
+      </EditorPropertiesContext.Provider>
+    )
+  }
+
+  return EditorPropertiesProvider
+}
+
+export function makeProjectProvider(initialProject: ProjectMetadata) {
+  const ProjectProvider: FC<PropsWithChildren> = ({ children }) => {
+    const [project, setProject] = useState(initialProject)
+
+    const updateProject = useCallback((projectUpdateData: ProjectUpdate) => {
+      setProject(projectData =>
+        Object.assign({}, projectData, projectUpdateData)
+      )
+    }, [])
+
+    const value = {
+      projectId: project._id,
+      project,
+      joinProject: () => {},
+      updateProject,
+      joinedOnce: true,
+      projectSnapshot: new ProjectSnapshot(project._id),
+      tags: [],
+      features: project.features,
+      name: project.name,
+    }
+
+    return (
+      <ProjectContext.Provider value={value}>
+        {children}
+      </ProjectContext.Provider>
+    )
+  }
+
+  return ProjectProvider
+}
diff --git a/services/web/test/frontend/helpers/error-boundary.tsx b/services/web/test/frontend/helpers/error-boundary.tsx
new file mode 100644
index 0000000000..3fe6101d2e
--- /dev/null
+++ b/services/web/test/frontend/helpers/error-boundary.tsx
@@ -0,0 +1,12 @@
+import { ComponentType, FC } from 'react'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+
+const FallbackComponent: FC = () => {
+  return <>An error occurred within the test container</>
+}
+
+export const withTestContainerErrorBoundary = function <T>(
+  Component: ComponentType<T>
+) {
+  return withErrorBoundary(Component, FallbackComponent)
+}
diff --git a/services/web/test/frontend/helpers/render-with-context.jsx b/services/web/test/frontend/helpers/render-with-context.jsx
deleted file mode 100644
index e3aba6264d..0000000000
--- a/services/web/test/frontend/helpers/render-with-context.jsx
+++ /dev/null
@@ -1,24 +0,0 @@
-// Disable prop type checks for test harnesses
-/* eslint-disable react/prop-types */
-
-import { render } from '@testing-library/react'
-import { EditorProviders } from './editor-providers'
-
-export function renderWithEditorContext(
-  component,
-  contextProps,
-  renderOptions = {}
-) {
-  const EditorProvidersWrapper = ({ children }) => (
-    <EditorProviders {...contextProps}>{children}</EditorProviders>
-  )
-
-  return render(component, {
-    wrapper: EditorProvidersWrapper,
-    ...renderOptions,
-  })
-}
-
-export function cleanUpContext() {
-  delete window._ide
-}
diff --git a/services/web/test/frontend/helpers/render-with-context.tsx b/services/web/test/frontend/helpers/render-with-context.tsx
new file mode 100644
index 0000000000..cf7aa0b575
--- /dev/null
+++ b/services/web/test/frontend/helpers/render-with-context.tsx
@@ -0,0 +1,20 @@
+import React from 'react'
+import { render, type RenderOptions } from '@testing-library/react'
+import { EditorProviders, type EditorProvidersProps } from './editor-providers'
+
+export function renderWithEditorContext(
+  component: React.ReactElement,
+  contextProps: EditorProvidersProps = {},
+  renderOptions: RenderOptions = {}
+) {
+  const EditorProvidersWrapper = ({
+    children,
+  }: {
+    children: React.ReactNode
+  }) => <EditorProviders {...contextProps}>{children}</EditorProviders>
+
+  return render(component, {
+    wrapper: EditorProvidersWrapper,
+    ...renderOptions,
+  })
+}
diff --git a/services/web/test/frontend/helpers/reset-meta.ts b/services/web/test/frontend/helpers/reset-meta.ts
index f5b00b332b..e59e62342d 100644
--- a/services/web/test/frontend/helpers/reset-meta.ts
+++ b/services/web/test/frontend/helpers/reset-meta.ts
@@ -2,7 +2,7 @@ export function resetMeta() {
   window.metaAttributesCache = new Map()
   window.metaAttributesCache.set('ol-projectHistoryBlobsEnabled', true)
   window.metaAttributesCache.set('ol-i18n', { currentLangCode: 'en' })
-  window.metaAttributesCache.set('ol-bootstrapVersion', 5)
+  window.metaAttributesCache.set('ol-capabilities', ['chat', 'dropbox'])
   window.metaAttributesCache.set('ol-ExposedSettings', {
     appName: 'Overleaf',
     maxEntitiesPerProject: 10,
diff --git a/services/web/test/frontend/ide/log-parser/logParserTests.js b/services/web/test/frontend/ide/log-parser/logParserTests.js
index 098ee056b9..59cdd5d22e 100644
--- a/services/web/test/frontend/ide/log-parser/logParserTests.js
+++ b/services/web/test/frontend/ide/log-parser/logParserTests.js
@@ -6,7 +6,7 @@ const fixturePath = '../../helpers/fixtures/logs/'
 const fs = require('fs')
 const path = require('path')
 
-describe('logParser', function (done) {
+describe('logParser', function () {
   it('should parse errors', function () {
     const { errors } = parseLatexLog('errors.log', { ignoreDuplicates: true })
     expect(errors.map(e => [e.line, e.message])).to.deep.equal([
diff --git a/services/web/test/frontend/infrastructure/fetch-json.test.js b/services/web/test/frontend/infrastructure/fetch-json.test.js
index 66e626758c..b5c095e29d 100644
--- a/services/web/test/frontend/infrastructure/fetch-json.test.js
+++ b/services/web/test/frontend/infrastructure/fetch-json.test.js
@@ -1,6 +1,5 @@
 import { expect } from 'chai'
 import fetchMock from 'fetch-mock'
-import { Response } from 'node-fetch'
 import {
   deleteJSON,
   FetchError,
@@ -12,11 +11,11 @@ import {
 
 describe('fetchJSON', function () {
   before(function () {
-    fetchMock.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   afterEach(function () {
-    fetchMock.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   const headers = {
@@ -138,17 +137,7 @@ describe('fetchJSON', function () {
   })
 
   it('handles 5xx responses without a status message', async function () {
-    // It's hard to make a Response object with statusText=null,
-    // so we need to do some monkey-work to make it happen
-    const response = new Response('weird scary error', {
-      ok: false,
-      status: 599,
-    })
-    Object.defineProperty(response, 'statusText', {
-      get: () => null,
-      set: () => {},
-    })
-    fetchMock.get('/test', response)
+    fetchMock.get('/test', { status: 599 })
 
     return expect(getJSON('/test'))
       .to.eventually.be.rejectedWith('Unexpected Error: 599')
diff --git a/services/web/test/frontend/infrastructure/project-snapshot.test.ts b/services/web/test/frontend/infrastructure/project-snapshot.test.ts
index 1e9fa6792b..b3a78efed7 100644
--- a/services/web/test/frontend/infrastructure/project-snapshot.test.ts
+++ b/services/web/test/frontend/infrastructure/project-snapshot.test.ts
@@ -119,10 +119,14 @@ describe('ProjectSnapshot', function () {
   }
 
   function mockChanges() {
-    fetchMock.getOnce(`/project/${projectId}/changes?since=1`, changes, {
-      name: 'changes-1',
-    })
-    fetchMock.get(`/project/${projectId}/changes?since=2`, [], {
+    fetchMock.getOnce(
+      `/project/${projectId}/changes?since=1&paginated=true`,
+      changes,
+      {
+        name: 'changes-1',
+      }
+    )
+    fetchMock.get(`/project/${projectId}/changes?since=2&paginated=true`, [], {
       name: 'changes-2',
     })
   }
@@ -139,7 +143,7 @@ describe('ProjectSnapshot', function () {
     mockLatestChunk()
     mockBlobs(['main.tex', 'hello.txt'])
     await snapshot.refresh()
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   }
 
   describe('after initialization', function () {
@@ -176,7 +180,7 @@ describe('ProjectSnapshot', function () {
     mockChanges()
     mockBlobs(['goodbye.txt'])
     await snapshot.refresh()
-    fetchMock.reset()
+    fetchMock.removeRoutes().clearHistory()
   }
 
   describe('after refresh', function () {
@@ -184,7 +188,7 @@ describe('ProjectSnapshot', function () {
     beforeEach(refreshSnapshot)
 
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     describe('getDocPaths()', function () {
@@ -214,7 +218,7 @@ describe('ProjectSnapshot', function () {
 
   describe('concurrency', function () {
     afterEach(function () {
-      fetchMock.reset()
+      fetchMock.removeRoutes().clearHistory()
     })
 
     specify('two concurrent inits', async function () {
@@ -226,9 +230,9 @@ describe('ProjectSnapshot', function () {
       await Promise.all([snapshot.refresh(), snapshot.refresh()])
 
       // The first request initializes, the second request loads changes
-      expect(fetchMock.calls('flush')).to.have.length(2)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(2)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
     })
 
     specify('three concurrent inits', async function () {
@@ -245,9 +249,9 @@ describe('ProjectSnapshot', function () {
 
       // The first request initializes, the second and third are combined and
       // load changes
-      expect(fetchMock.calls('flush')).to.have.length(2)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(2)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
     })
 
     specify('two concurrent inits - first fails', async function () {
@@ -262,9 +266,9 @@ describe('ProjectSnapshot', function () {
 
       // The first init fails, but the second succeeds
       expect(results.filter(r => r.status === 'fulfilled')).to.have.length(1)
-      expect(fetchMock.calls('flush')).to.have.length(2)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(0)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(2)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(0)
     })
 
     specify('three concurrent inits - second fails', async function () {
@@ -285,10 +289,10 @@ describe('ProjectSnapshot', function () {
       // The first init succeeds, the two queued requests fail, the last request
       // succeeds
       expect(results.filter(r => r.status === 'fulfilled')).to.have.length(1)
-      expect(fetchMock.calls('flush')).to.have.length(3)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
-      expect(fetchMock.calls('changes-2')).to.have.length(0)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(3)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-2')).to.have.length(0)
     })
 
     specify('two concurrent load changes', async function () {
@@ -304,10 +308,10 @@ describe('ProjectSnapshot', function () {
       await Promise.all([snapshot.refresh(), snapshot.refresh()])
 
       // One init, two load changes
-      expect(fetchMock.calls('flush')).to.have.length(3)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
-      expect(fetchMock.calls('changes-2')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(3)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-2')).to.have.length(1)
     })
 
     specify('three concurrent load changes', async function () {
@@ -327,10 +331,10 @@ describe('ProjectSnapshot', function () {
       ])
 
       // One init, two load changes (the two last are queued and combined)
-      expect(fetchMock.calls('flush')).to.have.length(3)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
-      expect(fetchMock.calls('changes-2')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(3)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-2')).to.have.length(1)
     })
 
     specify('two concurrent load changes - first fails', async function () {
@@ -350,10 +354,10 @@ describe('ProjectSnapshot', function () {
 
       // One init, one load changes fails, the second succeeds
       expect(results.filter(r => r.status === 'fulfilled')).to.have.length(1)
-      expect(fetchMock.calls('flush')).to.have.length(3)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
-      expect(fetchMock.calls('changes-2')).to.have.length(0)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(3)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-2')).to.have.length(0)
     })
 
     specify('three concurrent load changes - second fails', async function () {
@@ -378,10 +382,10 @@ describe('ProjectSnapshot', function () {
       // One init, one load changes succeeds, the second and third are combined
       // and fail, the last request succeeds
       expect(results.filter(r => r.status === 'fulfilled')).to.have.length(1)
-      expect(fetchMock.calls('flush')).to.have.length(4)
-      expect(fetchMock.calls('latest-chunk')).to.have.length(1)
-      expect(fetchMock.calls('changes-1')).to.have.length(1)
-      expect(fetchMock.calls('changes-2')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('flush')).to.have.length(4)
+      expect(fetchMock.callHistory.calls('latest-chunk')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-1')).to.have.length(1)
+      expect(fetchMock.callHistory.calls('changes-2')).to.have.length(1)
     })
   })
 })
diff --git a/services/web/test/frontend/shared/components/icon.test.jsx b/services/web/test/frontend/shared/components/icon.test.jsx
deleted file mode 100644
index b10bf0c7c8..0000000000
--- a/services/web/test/frontend/shared/components/icon.test.jsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import { expect } from 'chai'
-import { screen, render } from '@testing-library/react'
-
-import Icon from '../../../../frontend/js/shared/components/icon'
-
-describe('<Icon />', function () {
-  it('renders basic fa classes', function () {
-    const { container } = render(<Icon type="angle-down" />)
-    const element = container.querySelector('i.fa.fa-angle-down')
-    expect(element).to.exist
-  })
-
-  it('renders with aria-hidden', function () {
-    const { container } = render(<Icon type="angle-down" />)
-    const element = container.querySelector('i[aria-hidden="true"]')
-    expect(element).to.exist
-  })
-
-  it('renders accessible label', function () {
-    render(<Icon type="angle-down" accessibilityLabel="Accessible Foo" />)
-    screen.getByText('Accessible Foo')
-  })
-
-  it('renders with spin', function () {
-    const { container } = render(<Icon type="angle-down" spin />)
-    const element = container.querySelector('i.fa.fa-angle-down.fa-spin')
-    expect(element).to.exist
-  })
-
-  it('renders with fw', function () {
-    const { container } = render(<Icon type="angle-down" fw />)
-    const element = container.querySelector('i.fa.fa-angle-down.fa-fw')
-    expect(element).to.exist
-  })
-
-  it('renders with modifier', function () {
-    const { container } = render(<Icon type="angle-down" modifier="2x" />)
-    const element = container.querySelector('i.fa.fa-angle-down.fa-2x')
-    expect(element).to.exist
-  })
-
-  it('renders with custom clases', function () {
-    const { container } = render(
-      <Icon type="angle-down" className="custom-icon-class" />
-    )
-    const element = container.querySelector(
-      'i.fa.fa-angle-down.custom-icon-class'
-    )
-    expect(element).to.exist
-  })
-})
diff --git a/services/web/test/frontend/shared/components/processing.test.jsx b/services/web/test/frontend/shared/components/processing.test.jsx
deleted file mode 100644
index a053193721..0000000000
--- a/services/web/test/frontend/shared/components/processing.test.jsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { expect } from 'chai'
-import { render } from '@testing-library/react'
-import Processing from '../../../../frontend/js/shared/components/processing'
-
-describe('<Processing />', function () {
-  it('renders processing UI when isProcessing is true', function () {
-    const { container } = render(<Processing isProcessing />)
-    const element = container.querySelector('i.fa.fa-refresh')
-    expect(element).to.exist
-  })
-  it('does not render processing UI when isProcessing is false', function () {
-    const { container } = render(<Processing isProcessing={false} />)
-    const element = container.querySelector('i.fa.fa-refresh')
-    expect(element).to.not.exist
-  })
-})
diff --git a/services/web/test/frontend/shared/hooks/use-abort-controller.test.tsx b/services/web/test/frontend/shared/hooks/use-abort-controller.test.tsx
index fd91fa6faa..3b18913117 100644
--- a/services/web/test/frontend/shared/hooks/use-abort-controller.test.tsx
+++ b/services/web/test/frontend/shared/hooks/use-abort-controller.test.tsx
@@ -13,7 +13,7 @@ describe('useAbortController', function () {
   }
 
   beforeEach(function () {
-    fetchMock.restore()
+    fetchMock.removeRoutes().clearHistory()
 
     status = {
       loading: false,
@@ -23,7 +23,7 @@ describe('useAbortController', function () {
   })
 
   after(function () {
-    fetchMock.restore()
+    fetchMock.removeRoutes().clearHistory()
   })
 
   function AbortableRequest({ url }: { url: string }) {
@@ -80,8 +80,8 @@ describe('useAbortController', function () {
 
     unmount()
 
-    await fetchMock.flush(true)
-    expect(fetchMock.done()).to.be.true
+    await fetchMock.callHistory.flush(true)
+    expect(fetchMock.callHistory.done()).to.be.true
 
     // wait for Promises to be resolved
     await new Promise(resolve => setTimeout(resolve, 0))
diff --git a/services/web/test/frontend/shared/hooks/use-async.test.ts b/services/web/test/frontend/shared/hooks/use-async.test.ts
index ee0d033372..1700e890c6 100644
--- a/services/web/test/frontend/shared/hooks/use-async.test.ts
+++ b/services/web/test/frontend/shared/hooks/use-async.test.ts
@@ -1,4 +1,4 @@
-import { renderHook, act } from '@testing-library/react-hooks'
+import { renderHook, act } from '@testing-library/react'
 import { expect } from 'chai'
 import sinon from 'sinon'
 import useAsync from '../../../../frontend/js/shared/hooks/use-async'
diff --git a/services/web/test/frontend/shared/hooks/use-callback-handlers.test.js b/services/web/test/frontend/shared/hooks/use-callback-handlers.test.js
index f1ba354cf3..58cb0a4753 100644
--- a/services/web/test/frontend/shared/hooks/use-callback-handlers.test.js
+++ b/services/web/test/frontend/shared/hooks/use-callback-handlers.test.js
@@ -1,5 +1,5 @@
 import sinon from 'sinon'
-import { renderHook } from '@testing-library/react-hooks'
+import { renderHook } from '@testing-library/react'
 import useCallbackHandlers from '../../../../frontend/js/shared/hooks/use-callback-handlers'
 
 describe('useCallbackHandlers', function () {
diff --git a/services/web/test/frontend/shared/hooks/use-persisted-state.test.tsx b/services/web/test/frontend/shared/hooks/use-persisted-state.test.tsx
index 5b670698e3..9664148ce7 100644
--- a/services/web/test/frontend/shared/hooks/use-persisted-state.test.tsx
+++ b/services/web/test/frontend/shared/hooks/use-persisted-state.test.tsx
@@ -22,7 +22,7 @@ describe('usePersistedState', function () {
     expect(window.Storage.prototype.setItem).to.have.callCount(1)
 
     const Test = () => {
-      const [value] = usePersistedState(key)
+      const [value] = usePersistedState<string>(key)
 
       return <div>{value}</div>
     }
@@ -139,6 +139,35 @@ describe('usePersistedState', function () {
     expect(localStorage.getItem(key)).to.equal('foobar')
   })
 
+  it('converts persisted value (string to boolean)', function () {
+    const key = 'test:convert'
+    localStorage.setItem(key, 'yep')
+
+    const Test = () => {
+      const [value, setValue] = usePersistedState(key, true, {
+        converter: {
+          toPersisted(value) {
+            return value ? 'yep' : 'nope'
+          },
+          fromPersisted(persistedValue) {
+            return persistedValue === 'yep'
+          },
+        },
+      })
+
+      useEffect(() => {
+        setValue(false)
+      }, [setValue])
+
+      return <div>{String(value)}</div>
+    }
+
+    render(<Test />)
+
+    screen.getByText('false')
+    expect(localStorage.getItem(key)).to.equal('nope')
+  })
+
   it('handles syncing values via storage event', async function () {
     const key = 'test:sync'
     localStorage.setItem(key, 'foo')
@@ -149,7 +178,7 @@ describe('usePersistedState', function () {
     window.addEventListener('storage', storageEventListener)
 
     const Test = () => {
-      const [value, setValue] = usePersistedState(key, 'bar', true)
+      const [value, setValue] = usePersistedState(key, 'bar', { listen: true })
 
       useEffect(() => {
         setValue('baz')
diff --git a/services/web/test/frontend/shared/utils/currency.test.js b/services/web/test/frontend/shared/utils/currency.test.js
new file mode 100644
index 0000000000..757b56ad2a
--- /dev/null
+++ b/services/web/test/frontend/shared/utils/currency.test.js
@@ -0,0 +1,316 @@
+import { expect } from 'chai'
+import { formatCurrency } from '../../../../frontend/js/shared/utils/currency'
+
+/*
+  Users can select any language we support, regardless of the country where they are located.
+  Which mean that any combination of "supported language"-"supported currency" can be displayed
+  on the user's screen.
+
+  Users located in the USA visiting https://fr.overleaf.com/user/subscription/plans
+  should see amounts in USD (because of their IP address),
+  but with French text, number formatting and currency formats (because of language choice).
+  (e.g. 1 000,00 $)
+
+  Users located in the France visiting https://www.overleaf.com/user/subscription/plans
+  should see amounts in EUR (because of their IP address),
+  but with English text, number formatting and currency formats (because of language choice).
+  (e.g. €1,000.00)
+ */
+
+describe('formatCurrency', function () {
+  describe('en', function () {
+    const format = currency => priceInCents =>
+      formatCurrency(priceInCents, currency)
+
+    describe('USD', function () {
+      const formatUSD = format('USD')
+
+      it('should format basic amounts', function () {
+        expect(formatUSD(0)).to.equal('$0.00')
+        expect(formatUSD(12.34)).to.equal('$12.34')
+        expect(formatUSD(123)).to.equal('$123.00')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatUSD(1_000)).to.equal('$1,000.00')
+        expect(formatUSD(98_765_432.1)).to.equal('$98,765,432.10')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatUSD(-0.01)).to.equal('-$0.01')
+        expect(formatUSD(-12.34)).to.equal('-$12.34')
+        expect(formatUSD(-123)).to.equal('-$123.00')
+      })
+    })
+
+    describe('EUR', function () {
+      const formatEUR = format('EUR')
+
+      it('should format basic amounts', function () {
+        expect(formatEUR(0)).to.equal('€0.00')
+        expect(formatEUR(12.34)).to.equal('€12.34')
+        expect(formatEUR(123)).to.equal('€123.00')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatEUR(1_000)).to.equal('€1,000.00')
+        expect(formatEUR(98_765_432.1)).to.equal('€98,765,432.10')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatEUR(-0.01)).to.equal('-€0.01')
+        expect(formatEUR(-12.34)).to.equal('-€12.34')
+        expect(formatEUR(-123)).to.equal('-€123.00')
+      })
+    })
+
+    describe('HUF', function () {
+      const formatHUF = format('HUF')
+
+      it('should format basic amounts', function () {
+        expect(formatHUF(0)).to.equal('Ft 0.00')
+        expect(formatHUF(12.34)).to.equal('Ft 12.34')
+        expect(formatHUF(123)).to.equal('Ft 123.00')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatHUF(1_000)).to.equal('Ft 1,000.00')
+        expect(formatHUF(98_765_432.1)).to.equal('Ft 98,765,432.10')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatHUF(-0.01)).to.equal('-Ft 0.01')
+        expect(formatHUF(-12.34)).to.equal('-Ft 12.34')
+        expect(formatHUF(-123)).to.equal('-Ft 123.00')
+      })
+    })
+
+    describe('CLP', function () {
+      const formatCLP = format('CLP')
+
+      it('should format basic amounts', function () {
+        expect(formatCLP(0)).to.equal('$0')
+        expect(formatCLP(12.34)).to.equal('$12')
+        expect(formatCLP(123)).to.equal('$123')
+        expect(formatCLP(1234)).to.equal('$1,234')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatCLP(1_000)).to.equal('$1,000')
+        expect(formatCLP(98_765_432.1)).to.equal('$98,765,432')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatCLP(-1)).to.equal('-$1')
+        expect(formatCLP(-12.34)).to.equal('-$12')
+        expect(formatCLP(-1234)).to.equal('-$1,234')
+      })
+    })
+
+    describe('all currencies', function () {
+      it('should format 1 "minimal atomic units"', function () {
+        const amount = 1
+
+        // "no cents currencies"
+        expect(format('CLP')(amount)).to.equal('$1')
+        expect(format('JPY')(amount)).to.equal('¥1')
+        expect(format('KRW')(amount)).to.equal('₩1')
+        expect(format('VND')(amount)).to.equal('₫1')
+
+        // other currencies
+        expect(format('AUD')(amount)).to.equal('$1.00')
+        expect(format('BRL')(amount)).to.equal('R$1.00')
+        expect(format('CAD')(amount)).to.equal('$1.00')
+        expect(format('CHF')(amount)).to.equal('CHF 1.00')
+        expect(format('CNY')(amount)).to.equal('¥1.00')
+        expect(format('COP')(amount)).to.equal('$1.00')
+        expect(format('DKK')(amount)).to.equal('kr 1.00')
+        expect(format('EUR')(amount)).to.equal('€1.00')
+        expect(format('GBP')(amount)).to.equal('£1.00')
+        expect(format('HUF')(amount)).to.equal('Ft 1.00')
+        expect(format('IDR')(amount)).to.equal('Rp 1.00')
+        expect(format('INR')(amount)).to.equal('₹1.00')
+        expect(format('MXN')(amount)).to.equal('$1.00')
+        expect(format('MYR')(amount)).to.equal('RM 1.00')
+        expect(format('NOK')(amount)).to.equal('kr 1.00')
+        expect(format('NZD')(amount)).to.equal('$1.00')
+        expect(format('PEN')(amount)).to.equal('PEN 1.00')
+        expect(format('PHP')(amount)).to.equal('₱1.00')
+        expect(format('SEK')(amount)).to.equal('kr 1.00')
+        expect(format('SGD')(amount)).to.equal('$1.00')
+        expect(format('THB')(amount)).to.equal('฿1.00')
+        expect(format('USD')(amount)).to.equal('$1.00')
+      })
+
+      it('should format 1_234_567.897_654 "minimal atomic units"', function () {
+        const amount = 1_234_567.897_654
+
+        // "no cents currencies"
+        expect(format('CLP')(amount)).to.equal('$1,234,568')
+        expect(format('JPY')(amount)).to.equal('¥1,234,568')
+        expect(format('KRW')(amount)).to.equal('₩1,234,568')
+        expect(format('VND')(amount)).to.equal('₫1,234,568')
+
+        // other currencies
+        expect(format('AUD')(amount)).to.equal('$1,234,567.90')
+        expect(format('BRL')(amount)).to.equal('R$1,234,567.90')
+        expect(format('CAD')(amount)).to.equal('$1,234,567.90')
+        expect(format('CHF')(amount)).to.equal('CHF 1,234,567.90')
+        expect(format('CNY')(amount)).to.equal('¥1,234,567.90')
+        expect(format('COP')(amount)).to.equal('$1,234,567.90')
+        expect(format('DKK')(amount)).to.equal('kr 1,234,567.90')
+        expect(format('EUR')(amount)).to.equal('€1,234,567.90')
+        expect(format('GBP')(amount)).to.equal('£1,234,567.90')
+        expect(format('HUF')(amount)).to.equal('Ft 1,234,567.90')
+        expect(format('IDR')(amount)).to.equal('Rp 1,234,567.90')
+        expect(format('INR')(amount)).to.equal('₹1,234,567.90')
+        expect(format('MXN')(amount)).to.equal('$1,234,567.90')
+        expect(format('MYR')(amount)).to.equal('RM 1,234,567.90')
+        expect(format('NOK')(amount)).to.equal('kr 1,234,567.90')
+        expect(format('NZD')(amount)).to.equal('$1,234,567.90')
+        expect(format('PEN')(amount)).to.equal('PEN 1,234,567.90')
+        expect(format('PHP')(amount)).to.equal('₱1,234,567.90')
+        expect(format('SEK')(amount)).to.equal('kr 1,234,567.90')
+        expect(format('SGD')(amount)).to.equal('$1,234,567.90')
+        expect(format('THB')(amount)).to.equal('฿1,234,567.90')
+        expect(format('USD')(amount)).to.equal('$1,234,567.90')
+      })
+    })
+  })
+
+  describe('fr', function () {
+    const format = currency => priceInCents =>
+      formatCurrency(priceInCents, currency, 'fr')
+
+    describe('USD', function () {
+      const formatUSD = format('USD')
+
+      it('should format basic amounts', function () {
+        expect(formatUSD(0)).to.equal('0,00 $')
+        expect(formatUSD(12.34)).to.equal('12,34 $')
+        expect(formatUSD(123)).to.equal('123,00 $')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatUSD(1_000)).to.equal('1 000,00 $')
+        expect(formatUSD(98_765_432.1)).to.equal('98 765 432,10 $')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatUSD(-0.01)).to.equal('-0,01 $')
+        expect(formatUSD(-12.34)).to.equal('-12,34 $')
+        expect(formatUSD(-123)).to.equal('-123,00 $')
+      })
+    })
+
+    describe('EUR', function () {
+      const formatEUR = format('EUR')
+
+      it('should format basic amounts', function () {
+        expect(formatEUR(0)).to.equal('0,00 €')
+        expect(formatEUR(12.34)).to.equal('12,34 €')
+        expect(formatEUR(123)).to.equal('123,00 €')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatEUR(1_000)).to.equal('1 000,00 €')
+        expect(formatEUR(98_765_432.1)).to.equal('98 765 432,10 €')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatEUR(-0.01)).to.equal('-0,01 €')
+        expect(formatEUR(-12.34)).to.equal('-12,34 €')
+        expect(formatEUR(-123)).to.equal('-123,00 €')
+      })
+    })
+
+    describe('HUF', function () {
+      const formatHUF = format('HUF')
+
+      it('should format basic amounts', function () {
+        expect(formatHUF(0)).to.equal('0,00 Ft')
+        expect(formatHUF(12.34)).to.equal('12,34 Ft')
+        expect(formatHUF(123)).to.equal('123,00 Ft')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatHUF(1_000)).to.equal('1 000,00 Ft')
+        expect(formatHUF(98_765_432.1)).to.equal('98 765 432,10 Ft')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatHUF(-0.01)).to.equal('-0,01 Ft')
+        expect(formatHUF(-12.34)).to.equal('-12,34 Ft')
+        expect(formatHUF(-123)).to.equal('-123,00 Ft')
+      })
+    })
+
+    describe('CLP', function () {
+      const formatCLP = format('CLP')
+
+      it('should format basic amounts', function () {
+        expect(formatCLP(0)).to.equal('0 $')
+        expect(formatCLP(12.34)).to.equal('12 $')
+        expect(formatCLP(123)).to.equal('123 $')
+        expect(formatCLP(1234)).to.equal('1 234 $')
+      })
+
+      it('should format thousand separators', function () {
+        expect(formatCLP(100_000)).to.equal('100 000 $')
+        expect(formatCLP(9_876_543_210)).to.equal('9 876 543 210 $')
+      })
+
+      it('should format negative amounts', function () {
+        expect(formatCLP(-1)).to.equal('-1 $')
+        expect(formatCLP(-12.34)).to.equal('-12 $')
+        expect(formatCLP(-1234)).to.equal('-1 234 $')
+      })
+    })
+
+    describe('all currencies', function () {
+      it('should format 1 "minimal atomic units"', function () {
+        const amount = 1
+
+        // "no cents currencies"
+        expect(format('CLP')(amount)).to.equal('1 $')
+        expect(format('JPY')(amount)).to.equal('1 ¥')
+        expect(format('KRW')(amount)).to.equal('1 ₩')
+        expect(format('VND')(amount)).to.equal('1 ₫')
+
+        // other currencies
+        expect(format('AUD')(amount)).to.equal('1,00 $')
+        expect(format('BRL')(amount)).to.equal('1,00 R$')
+        expect(format('CAD')(amount)).to.equal('1,00 $')
+        expect(format('CHF')(amount)).to.equal('1,00 CHF')
+        expect(format('CNY')(amount)).to.equal('1,00 ¥')
+        expect(format('COP')(amount)).to.equal('1,00 $')
+
+        expect(format('EUR')(amount)).to.equal('1,00 €')
+        expect(format('GBP')(amount)).to.equal('1,00 £')
+        expect(format('USD')(amount)).to.equal('1,00 $')
+      })
+
+      it('should format 1_234_567.897_654 "minimal atomic units"', function () {
+        const amount = 1_234_567.897_654
+
+        // "no cents currencies"
+        expect(format('CLP')(amount)).to.equal('1 234 568 $')
+        expect(format('JPY')(amount)).to.equal('1 234 568 ¥')
+        expect(format('KRW')(amount)).to.equal('1 234 568 ₩')
+        expect(format('VND')(amount)).to.equal('1 234 568 ₫')
+
+        // other currencies
+        expect(format('AUD')(amount)).to.equal('1 234 567,90 $')
+        expect(format('BRL')(amount)).to.equal('1 234 567,90 R$')
+        expect(format('CAD')(amount)).to.equal('1 234 567,90 $')
+        expect(format('CHF')(amount)).to.equal('1 234 567,90 CHF')
+        expect(format('CNY')(amount)).to.equal('1 234 567,90 ¥')
+        expect(format('COP')(amount)).to.equal('1 234 567,90 $')
+
+        expect(format('EUR')(amount)).to.equal('1 234 567,90 €')
+        expect(format('GBP')(amount)).to.equal('1 234 567,90 £')
+        expect(format('USD')(amount)).to.equal('1 234 567,90 $')
+      })
+    })
+  })
+})
diff --git a/services/web/test/frontend/utils/abortsignal-polyfill.spec.ts b/services/web/test/frontend/utils/abortsignal-polyfill.spec.ts
new file mode 100644
index 0000000000..2aa06f123f
--- /dev/null
+++ b/services/web/test/frontend/utils/abortsignal-polyfill.spec.ts
@@ -0,0 +1,43 @@
+describe('AbortSignal polyfills', function () {
+  before(function () {
+    // @ts-expect-error deleting a required method
+    delete AbortSignal.any
+    // @ts-expect-error deleting a required method
+    delete AbortSignal.timeout
+    // this polyfill provides the required methods
+    cy.wrap(import('@/utils/abortsignal-polyfill'))
+  })
+
+  describe('AbortSignal.any', function () {
+    it('aborts the new signal immediately if one of the signals is aborted already', function () {
+      const controller1 = new AbortController()
+      const controller2 = new AbortController()
+
+      controller1.abort()
+      const signal = AbortSignal.any([controller1.signal, controller2.signal])
+
+      cy.wrap(signal.aborted).should('be.true')
+    })
+
+    it('aborts the new signal asynchronously if one of the signals is aborted later', function () {
+      const controller1 = new AbortController()
+      const controller2 = new AbortController()
+
+      const signal = AbortSignal.any([controller1.signal, controller2.signal])
+      controller1.abort()
+
+      cy.wrap(signal.aborted).should('be.true')
+    })
+  })
+
+  describe('AbortSignal.timeout', function () {
+    it('aborts the signal after the timeout', function () {
+      cy.clock().then(clock => {
+        const signal = AbortSignal.timeout(1000)
+        cy.wrap(signal.aborted).should('be.false')
+        clock.tick(1000)
+        cy.wrap(signal.aborted).should('be.true')
+      })
+    })
+  })
+})
diff --git a/services/web/test/smoke/src/steps/100_loadProjectDashboard.js b/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
index cea96bfc02..aa471e0672 100644
--- a/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
+++ b/services/web/test/smoke/src/steps/100_loadProjectDashboard.js
@@ -1,4 +1,5 @@
-const TITLE_REGEX = /<title>Your Projects - .*, Online LaTeX Editor<\/title>/
+const TITLE_REGEX =
+  /<title[^>]*>Your projects - .*, Online LaTeX Editor<\/title>/
 
 async function run({ request, assertHasStatusCode }) {
   const response = await request('/project')
diff --git a/services/web/test/unit/bootstrap.js b/services/web/test/unit/bootstrap.js
index fa2a7a5b76..00bcc3e958 100644
--- a/services/web/test/unit/bootstrap.js
+++ b/services/web/test/unit/bootstrap.js
@@ -1,6 +1,7 @@
 const Path = require('path')
-const chai = require('chai')
 const sinon = require('sinon')
+require('./common_bootstrap')
+const chai = require('chai')
 
 /*
  * Chai configuration
@@ -18,13 +19,6 @@ chai.use(require('chai-as-promised'))
 
 // Do not truncate assertion errors
 chai.config.truncateThreshold = 0
-
-// add support for mongoose in sinon
-require('sinon-mongoose')
-
-// ensure every ObjectId has the id string as a property for correct comparisons
-require('mongodb-legacy').ObjectId.cacheHexString = true
-
 /*
  * Global stubs
  */
@@ -88,6 +82,7 @@ function getSandboxedModuleRequires() {
     'sshpk',
     'xml2js',
     'mongodb',
+    'mongodb-legacy',
   ]
   for (const modulePath of internalModules) {
     requires[Path.resolve(__dirname, modulePath)] = require(modulePath)
diff --git a/services/web/test/unit/common_bootstrap.js b/services/web/test/unit/common_bootstrap.js
new file mode 100644
index 0000000000..a77aad61c6
--- /dev/null
+++ b/services/web/test/unit/common_bootstrap.js
@@ -0,0 +1,5 @@
+// add support for mongoose in sinon
+require('sinon-mongoose')
+
+// ensure every ObjectId has the id string as a property for correct comparisons
+require('mongodb-legacy').ObjectId.cacheHexString = true
diff --git a/services/web/test/unit/src/Analytics/AnalyticsController.test.mjs b/services/web/test/unit/src/Analytics/AnalyticsController.test.mjs
new file mode 100644
index 0000000000..f0d047ef28
--- /dev/null
+++ b/services/web/test/unit/src/Analytics/AnalyticsController.test.mjs
@@ -0,0 +1,134 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+const modulePath = new URL(
+  '../../../../app/src/Features/Analytics/AnalyticsController.mjs',
+  import.meta.url
+).pathname
+
+describe('AnalyticsController', function () {
+  beforeEach(async function (ctx) {
+    ctx.SessionManager = { getLoggedInUserId: sinon.stub() }
+
+    ctx.AnalyticsManager = {
+      updateEditingSession: sinon.stub(),
+      recordEventForSession: sinon.stub(),
+    }
+
+    ctx.Features = {
+      hasFeature: sinon.stub().returns(true),
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager.js',
+      () => ({
+        default: ctx.AnalyticsManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager.js',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Features.js', () => ({
+      default: ctx.Features,
+    }))
+
+    vi.doMock('../../../../app/src/infrastructure/GeoIpLookup.js', () => ({
+      default: (ctx.GeoIpLookup = {
+        promises: {
+          getDetails: sinon.stub().resolves(),
+        },
+      }),
+    }))
+
+    ctx.controller = (await import(modulePath)).default
+
+    ctx.res = new MockResponse()
+  })
+
+  describe('updateEditingSession', function () {
+    beforeEach(function (ctx) {
+      ctx.req = {
+        params: {
+          projectId: 'a project id',
+        },
+        session: {},
+        body: {
+          segmentation: {
+            editorType: 'abc',
+          },
+        },
+      }
+      ctx.GeoIpLookup.promises.getDetails = sinon
+        .stub()
+        .resolves({ country_code: 'XY' })
+    })
+
+    it('delegates to the AnalyticsManager', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SessionManager.getLoggedInUserId.returns('1234')
+        ctx.res.callback = () => {
+          sinon.assert.calledWith(
+            ctx.AnalyticsManager.updateEditingSession,
+            '1234',
+            'a project id',
+            'XY',
+            { editorType: 'abc' }
+          )
+          resolve()
+        }
+        ctx.controller.updateEditingSession(ctx.req, ctx.res)
+      })
+    })
+  })
+
+  describe('recordEvent', function () {
+    beforeEach(function (ctx) {
+      const body = {
+        foo: 'stuff',
+        _csrf: 'atoken123',
+      }
+      ctx.req = {
+        params: {
+          event: 'i_did_something',
+        },
+        body,
+        sessionID: 'sessionIDHere',
+        session: {},
+      }
+
+      ctx.expectedData = Object.assign({}, body)
+      delete ctx.expectedData._csrf
+    })
+
+    it('should use the session', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.controller.recordEvent(ctx.req, ctx.res)
+        sinon.assert.calledWith(
+          ctx.AnalyticsManager.recordEventForSession,
+          ctx.req.session,
+          ctx.req.params.event,
+          ctx.expectedData
+        )
+        resolve()
+      })
+    })
+
+    it('should remove the CSRF token before sending to the manager', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.controller.recordEvent(ctx.req, ctx.res)
+        sinon.assert.calledWith(
+          ctx.AnalyticsManager.recordEventForSession,
+          ctx.req.session,
+          ctx.req.params.event,
+          ctx.expectedData
+        )
+        resolve()
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Analytics/AnalyticsControllerTests.mjs b/services/web/test/unit/src/Analytics/AnalyticsControllerTests.mjs
deleted file mode 100644
index cba0e935db..0000000000
--- a/services/web/test/unit/src/Analytics/AnalyticsControllerTests.mjs
+++ /dev/null
@@ -1,113 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import MockResponse from '../helpers/MockResponse.js'
-const modulePath = new URL(
-  '../../../../app/src/Features/Analytics/AnalyticsController.mjs',
-  import.meta.url
-).pathname
-
-describe('AnalyticsController', function () {
-  beforeEach(async function () {
-    this.SessionManager = { getLoggedInUserId: sinon.stub() }
-
-    this.AnalyticsManager = {
-      updateEditingSession: sinon.stub(),
-      recordEventForSession: sinon.stub(),
-    }
-
-    this.Features = {
-      hasFeature: sinon.stub().returns(true),
-    }
-
-    this.controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Analytics/AnalyticsManager.js':
-        this.AnalyticsManager,
-      '../../../../app/src/Features/Authentication/SessionManager.js':
-        this.SessionManager,
-      '../../../../app/src/infrastructure/Features.js': this.Features,
-      '../../../../app/src/infrastructure/GeoIpLookup.js': (this.GeoIpLookup = {
-        promises: {
-          getDetails: sinon.stub().resolves(),
-        },
-      }),
-    })
-
-    this.res = new MockResponse()
-  })
-
-  describe('updateEditingSession', function () {
-    beforeEach(function () {
-      this.req = {
-        params: {
-          projectId: 'a project id',
-        },
-        session: {},
-        body: {
-          segmentation: {
-            editorType: 'abc',
-          },
-        },
-      }
-      this.GeoIpLookup.promises.getDetails = sinon
-        .stub()
-        .resolves({ country_code: 'XY' })
-    })
-
-    it('delegates to the AnalyticsManager', function (done) {
-      this.SessionManager.getLoggedInUserId.returns('1234')
-      this.res.callback = () => {
-        sinon.assert.calledWith(
-          this.AnalyticsManager.updateEditingSession,
-          '1234',
-          'a project id',
-          'XY',
-          { editorType: 'abc' }
-        )
-        done()
-      }
-      this.controller.updateEditingSession(this.req, this.res)
-    })
-  })
-
-  describe('recordEvent', function () {
-    beforeEach(function () {
-      const body = {
-        foo: 'stuff',
-        _csrf: 'atoken123',
-      }
-      this.req = {
-        params: {
-          event: 'i_did_something',
-        },
-        body,
-        sessionID: 'sessionIDHere',
-        session: {},
-      }
-
-      this.expectedData = Object.assign({}, body)
-      delete this.expectedData._csrf
-    })
-
-    it('should use the session', function (done) {
-      this.controller.recordEvent(this.req, this.res)
-      sinon.assert.calledWith(
-        this.AnalyticsManager.recordEventForSession,
-        this.req.session,
-        this.req.params.event,
-        this.expectedData
-      )
-      done()
-    })
-
-    it('should remove the CSRF token before sending to the manager', function (done) {
-      this.controller.recordEvent(this.req, this.res)
-      sinon.assert.calledWith(
-        this.AnalyticsManager.recordEventForSession,
-        this.req.session,
-        this.req.params.event,
-        this.expectedData
-      )
-      done()
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddleware.test.mjs b/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddleware.test.mjs
new file mode 100644
index 0000000000..463407b180
--- /dev/null
+++ b/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddleware.test.mjs
@@ -0,0 +1,206 @@
+import { assert, vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+
+const MODULE_PATH = new URL(
+  '../../../../app/src/Features/Analytics/AnalyticsUTMTrackingMiddleware',
+  import.meta.url
+).pathname
+
+describe('AnalyticsUTMTrackingMiddleware', function () {
+  beforeEach(async function (ctx) {
+    ctx.analyticsId = 'ecdb935a-52f3-4f91-aebc-7a70d2ffbb55'
+    ctx.userId = '61795fcb013504bb7b663092'
+
+    ctx.req = new MockRequest()
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub().returns()
+    ctx.req.session = {
+      user: {
+        _id: ctx.userId,
+        analyticsId: ctx.analyticsId,
+      },
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager.js',
+      () => ({
+        default: (ctx.AnalyticsManager = {
+          recordEventForSession: sinon.stub().resolves(),
+          setUserPropertyForSessionInBackground: sinon.stub(),
+        }),
+      })
+    )
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: {
+        siteUrl: 'https://www.overleaf.com',
+      },
+    }))
+
+    ctx.AnalyticsUTMTrackingMiddleware = (await import(MODULE_PATH)).default
+
+    ctx.middleware = ctx.AnalyticsUTMTrackingMiddleware.recordUTMTags()
+  })
+
+  describe('without UTM tags in query', function () {
+    beforeEach(function (ctx) {
+      ctx.req.url = '/project'
+      ctx.middleware(ctx.req, ctx.res, ctx.next)
+    })
+
+    it('user is not redirected', function (ctx) {
+      assert.isFalse(ctx.res.redirected)
+    })
+
+    it('next middleware is executed', function (ctx) {
+      sinon.assert.calledOnce(ctx.next)
+    })
+
+    it('no event or user property is recorded', function (ctx) {
+      sinon.assert.notCalled(ctx.AnalyticsManager.recordEventForSession)
+      sinon.assert.notCalled(
+        ctx.AnalyticsManager.setUserPropertyForSessionInBackground
+      )
+    })
+  })
+
+  describe('with all UTM tags in query', function () {
+    beforeEach(function (ctx) {
+      ctx.req.url =
+        '/project?utm_source=Organic&utm_medium=Facebook&utm_campaign=Some%20Campaign&utm_content=foo-bar&utm_term=overridden'
+      ctx.req.query = {
+        utm_source: 'Organic',
+        utm_medium: 'Facebook',
+        utm_campaign: 'Some Campaign',
+        utm_content: 'foo-bar',
+        utm_term: 'overridden',
+      }
+      ctx.middleware(ctx.req, ctx.res, ctx.next)
+    })
+
+    it('user is redirected', function (ctx) {
+      assert.isTrue(ctx.res.redirected)
+      assert.equal('/project', ctx.res.redirectedTo)
+    })
+
+    it('next middleware is not executed', function (ctx) {
+      sinon.assert.notCalled(ctx.next)
+    })
+
+    it('page-view event is recorded for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.recordEventForSession,
+        ctx.req.session,
+        'page-view',
+        {
+          path: '/project',
+          utm_source: 'Organic',
+          utm_medium: 'Facebook',
+          utm_campaign: 'Some Campaign',
+          utm_content: 'foo-bar',
+          utm_term: 'overridden',
+        }
+      )
+    })
+
+    it('utm-tags user property is set for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.setUserPropertyForSessionInBackground,
+        ctx.req.session,
+        'utm-tags',
+        'Organic;Facebook;Some Campaign;foo-bar'
+      )
+    })
+  })
+
+  describe('with some UTM tags in query', function () {
+    beforeEach(function (ctx) {
+      ctx.req.url =
+        '/project?utm_medium=Facebook&utm_campaign=Some%20Campaign&utm_term=foo'
+      ctx.req.query = {
+        utm_medium: 'Facebook',
+        utm_campaign: 'Some Campaign',
+        utm_term: 'foo',
+      }
+      ctx.middleware(ctx.req, ctx.res, ctx.next)
+    })
+
+    it('user is redirected', function (ctx) {
+      assert.isTrue(ctx.res.redirected)
+      assert.equal('/project', ctx.res.redirectedTo)
+    })
+
+    it('next middleware is not executed', function (ctx) {
+      sinon.assert.notCalled(ctx.next)
+    })
+
+    it('page-view event is recorded for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.recordEventForSession,
+        ctx.req.session,
+        'page-view',
+        {
+          path: '/project',
+          utm_medium: 'Facebook',
+          utm_campaign: 'Some Campaign',
+          utm_term: 'foo',
+        }
+      )
+    })
+
+    it('utm-tags user property is set for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.setUserPropertyForSessionInBackground,
+        ctx.req.session,
+        'utm-tags',
+        'N/A;Facebook;Some Campaign;foo'
+      )
+    })
+  })
+
+  describe('with some UTM tags and additional parameters in query', function () {
+    beforeEach(function (ctx) {
+      ctx.req.url =
+        '/project?utm_medium=Facebook&utm_campaign=Some%20Campaign&other_param=some-value'
+      ctx.req.query = {
+        utm_medium: 'Facebook',
+        utm_campaign: 'Some Campaign',
+        other_param: 'some-value',
+      }
+      ctx.middleware(ctx.req, ctx.res, ctx.next)
+    })
+
+    it('user is redirected', function (ctx) {
+      assert.isTrue(ctx.res.redirected)
+      assert.equal('/project?other_param=some-value', ctx.res.redirectedTo)
+    })
+
+    it('next middleware is not executed', function (ctx) {
+      sinon.assert.notCalled(ctx.next)
+    })
+
+    it('page-view event is recorded for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.recordEventForSession,
+        ctx.req.session,
+        'page-view',
+        {
+          path: '/project',
+          utm_medium: 'Facebook',
+          utm_campaign: 'Some Campaign',
+        }
+      )
+    })
+
+    it('utm-tags user property is set for session', function (ctx) {
+      sinon.assert.calledWith(
+        ctx.AnalyticsManager.setUserPropertyForSessionInBackground,
+        ctx.req.session,
+        'utm-tags',
+        'N/A;Facebook;Some Campaign;N/A'
+      )
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddlewareTests.mjs b/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddlewareTests.mjs
deleted file mode 100644
index 461a2a70d1..0000000000
--- a/services/web/test/unit/src/Analytics/AnalyticsUTMTrackingMiddlewareTests.mjs
+++ /dev/null
@@ -1,200 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import { assert } from 'chai'
-
-const MODULE_PATH = new URL(
-  '../../../../app/src/Features/Analytics/AnalyticsUTMTrackingMiddleware',
-  import.meta.url
-).pathname
-
-describe('AnalyticsUTMTrackingMiddleware', function () {
-  beforeEach(async function () {
-    this.analyticsId = 'ecdb935a-52f3-4f91-aebc-7a70d2ffbb55'
-    this.userId = '61795fcb013504bb7b663092'
-
-    this.req = new MockRequest()
-    this.res = new MockResponse()
-    this.next = sinon.stub().returns()
-    this.req.session = {
-      user: {
-        _id: this.userId,
-        analyticsId: this.analyticsId,
-      },
-    }
-
-    this.AnalyticsUTMTrackingMiddleware = await esmock.strict(MODULE_PATH, {
-      '../../../../app/src/Features/Analytics/AnalyticsManager.js':
-        (this.AnalyticsManager = {
-          recordEventForSession: sinon.stub().resolves(),
-          setUserPropertyForSessionInBackground: sinon.stub(),
-        }),
-      '@overleaf/settings': {
-        siteUrl: 'https://www.overleaf.com',
-      },
-    })
-
-    this.middleware = this.AnalyticsUTMTrackingMiddleware.recordUTMTags()
-  })
-
-  describe('without UTM tags in query', function () {
-    beforeEach(function () {
-      this.req.url = '/project'
-      this.middleware(this.req, this.res, this.next)
-    })
-
-    it('user is not redirected', function () {
-      assert.isFalse(this.res.redirected)
-    })
-
-    it('next middleware is executed', function () {
-      sinon.assert.calledOnce(this.next)
-    })
-
-    it('no event or user property is recorded', function () {
-      sinon.assert.notCalled(this.AnalyticsManager.recordEventForSession)
-      sinon.assert.notCalled(
-        this.AnalyticsManager.setUserPropertyForSessionInBackground
-      )
-    })
-  })
-
-  describe('with all UTM tags in query', function () {
-    beforeEach(function () {
-      this.req.url =
-        '/project?utm_source=Organic&utm_medium=Facebook&utm_campaign=Some%20Campaign&utm_content=foo-bar&utm_term=overridden'
-      this.req.query = {
-        utm_source: 'Organic',
-        utm_medium: 'Facebook',
-        utm_campaign: 'Some Campaign',
-        utm_content: 'foo-bar',
-        utm_term: 'overridden',
-      }
-      this.middleware(this.req, this.res, this.next)
-    })
-
-    it('user is redirected', function () {
-      assert.isTrue(this.res.redirected)
-      assert.equal('/project', this.res.redirectedTo)
-    })
-
-    it('next middleware is not executed', function () {
-      sinon.assert.notCalled(this.next)
-    })
-
-    it('page-view event is recorded for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.recordEventForSession,
-        this.req.session,
-        'page-view',
-        {
-          path: '/project',
-          utm_source: 'Organic',
-          utm_medium: 'Facebook',
-          utm_campaign: 'Some Campaign',
-          utm_content: 'foo-bar',
-          utm_term: 'overridden',
-        }
-      )
-    })
-
-    it('utm-tags user property is set for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.setUserPropertyForSessionInBackground,
-        this.req.session,
-        'utm-tags',
-        'Organic;Facebook;Some Campaign;foo-bar'
-      )
-    })
-  })
-
-  describe('with some UTM tags in query', function () {
-    beforeEach(function () {
-      this.req.url =
-        '/project?utm_medium=Facebook&utm_campaign=Some%20Campaign&utm_term=foo'
-      this.req.query = {
-        utm_medium: 'Facebook',
-        utm_campaign: 'Some Campaign',
-        utm_term: 'foo',
-      }
-      this.middleware(this.req, this.res, this.next)
-    })
-
-    it('user is redirected', function () {
-      assert.isTrue(this.res.redirected)
-      assert.equal('/project', this.res.redirectedTo)
-    })
-
-    it('next middleware is not executed', function () {
-      sinon.assert.notCalled(this.next)
-    })
-
-    it('page-view event is recorded for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.recordEventForSession,
-        this.req.session,
-        'page-view',
-        {
-          path: '/project',
-          utm_medium: 'Facebook',
-          utm_campaign: 'Some Campaign',
-          utm_term: 'foo',
-        }
-      )
-    })
-
-    it('utm-tags user property is set for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.setUserPropertyForSessionInBackground,
-        this.req.session,
-        'utm-tags',
-        'N/A;Facebook;Some Campaign;foo'
-      )
-    })
-  })
-
-  describe('with some UTM tags and additional parameters in query', function () {
-    beforeEach(function () {
-      this.req.url =
-        '/project?utm_medium=Facebook&utm_campaign=Some%20Campaign&other_param=some-value'
-      this.req.query = {
-        utm_medium: 'Facebook',
-        utm_campaign: 'Some Campaign',
-        other_param: 'some-value',
-      }
-      this.middleware(this.req, this.res, this.next)
-    })
-
-    it('user is redirected', function () {
-      assert.isTrue(this.res.redirected)
-      assert.equal('/project?other_param=some-value', this.res.redirectedTo)
-    })
-
-    it('next middleware is not executed', function () {
-      sinon.assert.notCalled(this.next)
-    })
-
-    it('page-view event is recorded for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.recordEventForSession,
-        this.req.session,
-        'page-view',
-        {
-          path: '/project',
-          utm_medium: 'Facebook',
-          utm_campaign: 'Some Campaign',
-        }
-      )
-    })
-
-    it('utm-tags user property is set for session', function () {
-      sinon.assert.calledWith(
-        this.AnalyticsManager.setUserPropertyForSessionInBackground,
-        this.req.session,
-        'utm-tags',
-        'N/A;Facebook;Some Campaign;N/A'
-      )
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Authentication/AuthenticationControllerTests.js b/services/web/test/unit/src/Authentication/AuthenticationControllerTests.js
index 0e4f675b1b..1fa3aba6a6 100644
--- a/services/web/test/unit/src/Authentication/AuthenticationControllerTests.js
+++ b/services/web/test/unit/src/Authentication/AuthenticationControllerTests.js
@@ -1500,4 +1500,331 @@ describe('AuthenticationController', function () {
       })
     })
   })
+
+  describe('checkCredentials', function () {
+    beforeEach(function () {
+      this.userDetailsMap = new Map()
+      this.logger.err = sinon.stub()
+      this.Metrics.inc = sinon.stub()
+    })
+
+    describe('with valid credentials', function () {
+      describe('single password', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', 'correctpassword')
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'correctpassword'
+          )
+        })
+
+        it('should return true', function () {
+          this.result.should.equal(true)
+        })
+
+        it('should not log an error', function () {
+          this.logger.err.called.should.equal(false)
+        })
+
+        it('should record success metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'known-user',
+              status: 'pass',
+            }
+          )
+        })
+      })
+
+      describe('array with primary password', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['primary', 'fallback'])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'primary'
+          )
+        })
+
+        it('should return true', function () {
+          this.result.should.equal(true)
+        })
+
+        it('should not log an error', function () {
+          this.logger.err.called.should.equal(false)
+        })
+
+        it('should record success metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'known-user',
+              status: 'pass',
+            }
+          )
+        })
+      })
+
+      describe('array with fallback password', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['primary', 'fallback'])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'fallback'
+          )
+        })
+
+        it('should return true', function () {
+          this.result.should.equal(true)
+        })
+
+        it('should not log an error', function () {
+          this.logger.err.called.should.equal(false)
+        })
+
+        it('should record success metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'known-user',
+              status: 'pass',
+            }
+          )
+        })
+      })
+    })
+
+    describe('with invalid credentials', function () {
+      describe('unknown user', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', 'correctpassword')
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'unknownuser',
+            'anypassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'unknownuser' },
+            'invalid login details'
+          )
+        })
+
+        it('should record failure metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'unknown-user',
+              status: 'fail',
+            }
+          )
+        })
+      })
+
+      describe('wrong password', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', 'correctpassword')
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'wrongpassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'testuser' },
+            'invalid login details'
+          )
+        })
+
+        it('should record failure metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'known-user',
+              status: 'fail',
+            }
+          )
+        })
+      })
+
+      describe('wrong password with array', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['primary', 'fallback'])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'wrongpassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'testuser' },
+            'invalid login details'
+          )
+        })
+
+        it('should record failure metrics', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'known-user',
+              status: 'fail',
+            }
+          )
+        })
+      })
+
+      describe('null user entry', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', null)
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'anypassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'testuser' },
+            'invalid login details'
+          )
+        })
+
+        it('should record failure metrics for unknown user', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'unknown-user',
+              status: 'fail',
+            }
+          )
+        })
+      })
+
+      describe('empty primary password in array', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['', 'fallback'])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'fallback'
+          )
+        })
+
+        it('should return true with fallback password', function () {
+          this.result.should.equal(true)
+        })
+
+        it('should not log an error', function () {
+          this.logger.err.called.should.equal(false)
+        })
+      })
+
+      describe('empty fallback password in array', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['primary', ''])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'primary'
+          )
+        })
+
+        it('should return true with primary password', function () {
+          this.result.should.equal(true)
+        })
+
+        it('should not log an error', function () {
+          this.logger.err.called.should.equal(false)
+        })
+      })
+
+      describe('both passwords empty in array', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', ['', ''])
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'anypassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'testuser' },
+            'invalid login details'
+          )
+        })
+      })
+
+      describe('empty single password', function () {
+        beforeEach(function () {
+          this.userDetailsMap.set('testuser', '')
+          this.result = this.AuthenticationController.checkCredentials(
+            this.userDetailsMap,
+            'testuser',
+            'anypassword'
+          )
+        })
+
+        it('should return false', function () {
+          this.result.should.equal(false)
+        })
+
+        it('should log an error', function () {
+          this.logger.err.should.have.been.calledWith(
+            { user: 'testuser' },
+            'invalid login details'
+          )
+        })
+
+        it('should record failure metrics for unknown user', function () {
+          this.Metrics.inc.should.have.been.calledWith(
+            'security.http-auth.check-credentials',
+            1,
+            {
+              path: 'unknown-user',
+              status: 'fail',
+            }
+          )
+        })
+      })
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Authorization/AuthorizationManagerTests.js b/services/web/test/unit/src/Authorization/AuthorizationManagerTests.js
index 7463bbdeb7..e4c67d2f77 100644
--- a/services/web/test/unit/src/Authorization/AuthorizationManagerTests.js
+++ b/services/web/test/unit/src/Authorization/AuthorizationManagerTests.js
@@ -27,7 +27,10 @@ describe('AuthorizationManager', function () {
 
     this.CollaboratorsGetter = {
       promises: {
-        getMemberIdPrivilegeLevel: sinon.stub().resolves(PrivilegeLevels.NONE),
+        getProjectAccess: sinon.stub().resolves({
+          publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+          privilegeLevelForUser: sinon.stub().returns(PrivilegeLevels.NONE),
+        }),
       },
     }
 
@@ -113,9 +116,17 @@ describe('AuthorizationManager', function () {
 
       describe('with a user id with a privilege level', function () {
         beforeEach(async function () {
-          this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-            .withArgs(this.user._id, this.project._id)
-            .resolves(PrivilegeLevels.READ_ONLY)
+          this.CollaboratorsGetter.promises.getProjectAccess
+            .withArgs(this.project._id)
+            .resolves({
+              publicAccessLevel: sinon
+                .stub()
+                .returns(PublicAccessLevels.PRIVATE),
+              privilegeLevelForUser: sinon
+                .stub()
+                .withArgs(this.user._id)
+                .returns(PrivilegeLevels.READ_ONLY),
+            })
           this.result =
             await this.AuthorizationManager.promises.getPrivilegeLevelForProject(
               this.user._id,
@@ -171,8 +182,8 @@ describe('AuthorizationManager', function () {
               )
           })
 
-          it('should not call CollaboratorsGetter.getMemberIdPrivilegeLevel', function () {
-            this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel.called.should.equal(
+          it('should not call CollaboratorsGetter.getProjectAccess', function () {
+            this.CollaboratorsGetter.promises.getProjectAccess.called.should.equal(
               false
             )
           })
@@ -204,8 +215,8 @@ describe('AuthorizationManager', function () {
               )
           })
 
-          it('should not call CollaboratorsGetter.getMemberIdPrivilegeLevel', function () {
-            this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel.called.should.equal(
+          it('should not call CollaboratorsGetter.getProjectAccess', function () {
+            this.CollaboratorsGetter.promises.getProjectAccess.called.should.equal(
               false
             )
           })
@@ -237,8 +248,8 @@ describe('AuthorizationManager', function () {
               )
           })
 
-          it('should not call CollaboratorsGetter.getMemberIdPrivilegeLevel', function () {
-            this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel.called.should.equal(
+          it('should not call CollaboratorsGetter.getProjectAccess', function () {
+            this.CollaboratorsGetter.promises.getProjectAccess.called.should.equal(
               false
             )
           })
@@ -264,9 +275,17 @@ describe('AuthorizationManager', function () {
 
       describe('with a user id with a privilege level', function () {
         beforeEach(async function () {
-          this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-            .withArgs(this.user._id, this.project._id)
-            .resolves(PrivilegeLevels.READ_ONLY)
+          this.CollaboratorsGetter.promises.getProjectAccess
+            .withArgs(this.project._id)
+            .resolves({
+              publicAccessLevel: sinon
+                .stub()
+                .returns(PublicAccessLevels.PRIVATE),
+              privilegeLevelForUser: sinon
+                .stub()
+                .withArgs(this.user._id)
+                .returns(PrivilegeLevels.READ_ONLY),
+            })
           this.result =
             await this.AuthorizationManager.promises.getPrivilegeLevelForProject(
               this.user._id,
@@ -321,8 +340,8 @@ describe('AuthorizationManager', function () {
             )
         })
 
-        it('should not call CollaboratorsGetter.getMemberIdPrivilegeLevel', function () {
-          this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel.called.should.equal(
+        it('should not call CollaboratorsGetter.getProjectAccess', function () {
+          this.CollaboratorsGetter.promises.getProjectAccess.called.should.equal(
             false
           )
         })
@@ -336,13 +355,32 @@ describe('AuthorizationManager', function () {
     describe('with a public project', function () {
       beforeEach(function () {
         this.project.publicAccesLevel = 'readAndWrite'
+        this.CollaboratorsGetter.promises.getProjectAccess
+          .withArgs(this.project._id)
+          .resolves({
+            publicAccessLevel: sinon
+              .stub()
+              .returns(this.project.publicAccesLevel),
+            privilegeLevelForUser: sinon
+              .stub()
+              .withArgs(this.user._id)
+              .returns(PrivilegeLevels.NONE),
+          })
       })
 
       describe('with a user id with a privilege level', function () {
         beforeEach(async function () {
-          this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-            .withArgs(this.user._id, this.project._id)
-            .resolves(PrivilegeLevels.READ_ONLY)
+          this.CollaboratorsGetter.promises.getProjectAccess
+            .withArgs(this.project._id)
+            .resolves({
+              publicAccessLevel: sinon
+                .stub()
+                .returns(this.project.publicAccesLevel),
+              privilegeLevelForUser: sinon
+                .stub()
+                .withArgs(this.user._id)
+                .returns(PrivilegeLevels.READ_ONLY),
+            })
           this.result =
             await this.AuthorizationManager.promises.getPrivilegeLevelForProject(
               this.user._id,
@@ -397,8 +435,8 @@ describe('AuthorizationManager', function () {
             )
         })
 
-        it('should not call CollaboratorsGetter.getMemberIdPrivilegeLevel', function () {
-          this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel.called.should.equal(
+        it('should not call CollaboratorsGetter.getProjectAccess', function () {
+          this.CollaboratorsGetter.promises.getProjectAccess.called.should.equal(
             false
           )
         })
@@ -410,6 +448,11 @@ describe('AuthorizationManager', function () {
     })
 
     describe("when the project doesn't exist", function () {
+      beforeEach(function () {
+        this.CollaboratorsGetter.promises.getProjectAccess.rejects(
+          new Errors.NotFoundError()
+        )
+      })
       it('should return a NotFoundError', async function () {
         const someOtherId = new ObjectId()
         await expect(
@@ -424,9 +467,15 @@ describe('AuthorizationManager', function () {
 
     describe('when the project id is not valid', function () {
       beforeEach(function () {
-        this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-          .withArgs(this.user._id, this.project._id)
-          .resolves(PrivilegeLevels.READ_ONLY)
+        this.CollaboratorsGetter.promises.getProjectAccess
+          .withArgs(this.project._id)
+          .resolves({
+            publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+            privilegeLevelForUser: sinon
+              .stub()
+              .withArgs(this.user._id)
+              .returns(PrivilegeLevels.READ_ONLY),
+          })
       })
 
       it('should return a error', async function () {
@@ -529,9 +578,15 @@ describe('AuthorizationManager', function () {
 
   describe('canUserDeleteOrResolveThread', function () {
     it('should return true when user has write permissions', async function () {
-      this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-        .withArgs(this.user._id, this.project._id)
-        .resolves(PrivilegeLevels.READ_AND_WRITE)
+      this.CollaboratorsGetter.promises.getProjectAccess
+        .withArgs(this.project._id)
+        .resolves({
+          publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+          privilegeLevelForUser: sinon
+            .stub()
+            .withArgs(this.user._id)
+            .returns(PrivilegeLevels.READ_AND_WRITE),
+        })
 
       const canResolve =
         await this.AuthorizationManager.promises.canUserDeleteOrResolveThread(
@@ -546,9 +601,15 @@ describe('AuthorizationManager', function () {
     })
 
     it('should return false when user has read permission', async function () {
-      this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-        .withArgs(this.user._id, this.project._id)
-        .resolves(PrivilegeLevels.READ_ONLY)
+      this.CollaboratorsGetter.promises.getProjectAccess
+        .withArgs(this.project._id)
+        .resolves({
+          publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+          privilegeLevelForUser: sinon
+            .stub()
+            .withArgs(this.user._id)
+            .returns(PrivilegeLevels.READ_ONLY),
+        })
 
       const canResolve =
         await this.AuthorizationManager.promises.canUserDeleteOrResolveThread(
@@ -564,9 +625,15 @@ describe('AuthorizationManager', function () {
 
     describe('when user has review permission', function () {
       beforeEach(function () {
-        this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-          .withArgs(this.user._id, this.project._id)
-          .resolves(PrivilegeLevels.REVIEW)
+        this.CollaboratorsGetter.promises.getProjectAccess
+          .withArgs(this.project._id)
+          .resolves({
+            publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+            privilegeLevelForUser: sinon
+              .stub()
+              .withArgs(this.user._id)
+              .returns(PrivilegeLevels.REVIEW),
+          })
       })
 
       it('should return false when user is not the comment author', async function () {
@@ -691,15 +758,27 @@ function testPermission(permission, privilegeLevels) {
 
 function setupUserPrivilegeLevel(privilegeLevel) {
   beforeEach(`set user privilege level to ${privilegeLevel}`, function () {
-    this.CollaboratorsGetter.promises.getMemberIdPrivilegeLevel
-      .withArgs(this.user._id, this.project._id)
-      .resolves(privilegeLevel)
+    this.CollaboratorsGetter.promises.getProjectAccess
+      .withArgs(this.project._id)
+      .resolves({
+        publicAccessLevel: sinon.stub().returns(PublicAccessLevels.PRIVATE),
+        privilegeLevelForUser: sinon
+          .stub()
+          .withArgs(this.user._id)
+          .returns(privilegeLevel),
+      })
   })
 }
 
 function setupPublicAccessLevel(level) {
   beforeEach(`set public access level to ${level}`, function () {
     this.project.publicAccesLevel = level
+    this.CollaboratorsGetter.promises.getProjectAccess
+      .withArgs(this.project._id)
+      .resolves({
+        publicAccessLevel: sinon.stub().returns(this.project.publicAccesLevel),
+        privilegeLevelForUser: sinon.stub().returns(PrivilegeLevels.NONE),
+      })
   })
 }
 
diff --git a/services/web/test/unit/src/Authorization/AuthorizationMiddlewareTests.js b/services/web/test/unit/src/Authorization/AuthorizationMiddlewareTests.js
index 33ff719e32..16514fbe63 100644
--- a/services/web/test/unit/src/Authorization/AuthorizationMiddlewareTests.js
+++ b/services/web/test/unit/src/Authorization/AuthorizationMiddlewareTests.js
@@ -206,7 +206,7 @@ describe('AuthorizationMiddleware', function () {
       expectForbidden()
     })
 
-    describe('for a regular user', function (done) {
+    describe('for a regular user', function () {
       setupPermission('isRestrictedUserForProject', false)
       invokeMiddleware('blockRestrictedUserFromProject')
       expectNext()
diff --git a/services/web/test/unit/src/BetaProgram/BetaProgramController.test.mjs b/services/web/test/unit/src/BetaProgram/BetaProgramController.test.mjs
new file mode 100644
index 0000000000..b1fc8cf2fa
--- /dev/null
+++ b/services/web/test/unit/src/BetaProgram/BetaProgramController.test.mjs
@@ -0,0 +1,265 @@
+import { expect, vi } from 'vitest'
+import path from 'node:path'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+import { fileURLToPath } from 'node:url'
+
+const __dirname = fileURLToPath(new URL('.', import.meta.url))
+
+const modulePath = path.join(
+  __dirname,
+  '../../../../app/src/Features/BetaProgram/BetaProgramController'
+)
+
+describe('BetaProgramController', function () {
+  beforeEach(async function (ctx) {
+    ctx.user = {
+      _id: (ctx.user_id = 'a_simple_id'),
+      email: 'user@example.com',
+      features: {},
+      betaProgram: false,
+    }
+    ctx.req = {
+      query: {},
+      session: {
+        user: ctx.user,
+      },
+    }
+    ctx.SplitTestSessionHandler = {
+      promises: {
+        sessionMaintenance: sinon.stub(),
+      },
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestSessionHandler',
+      () => ({
+        default: ctx.SplitTestSessionHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/BetaProgram/BetaProgramHandler',
+      () => ({
+        default: (ctx.BetaProgramHandler = {
+          promises: {
+            optIn: sinon.stub().resolves(),
+            optOut: sinon.stub().resolves(),
+          },
+        }),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: (ctx.UserGetter = {
+        promises: {
+          getUser: sinon.stub().resolves(),
+        },
+      }),
+    }))
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: (ctx.settings = {
+        languages: {},
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: (ctx.AuthenticationController = {
+          getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+        }),
+      })
+    )
+
+    ctx.BetaProgramController = (await import(modulePath)).default
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub()
+  })
+
+  describe('optIn', function () {
+    it("should redirect to '/beta/participate'", async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.redirectedTo.should.equal('/beta/participate')
+          resolve()
+        }
+        ctx.BetaProgramController.optIn(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should not call next with an error', function (ctx) {
+      ctx.BetaProgramController.optIn(ctx.req, ctx.res, ctx.next)
+      ctx.next.callCount.should.equal(0)
+    })
+
+    it('should call BetaProgramHandler.optIn', function (ctx) {
+      ctx.BetaProgramController.optIn(ctx.req, ctx.res, ctx.next)
+      ctx.BetaProgramHandler.promises.optIn.callCount.should.equal(1)
+    })
+
+    it('should invoke the session maintenance', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.callback = () => {
+          ctx.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
+            ctx.req
+          )
+          resolve()
+        }
+        ctx.BetaProgramController.optIn(ctx.req, ctx.res)
+      })
+    })
+
+    describe('when BetaProgramHandler.opIn produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.BetaProgramHandler.promises.optIn.throws(new Error('woops'))
+      })
+
+      it("should not redirect to '/beta/participate'", function (ctx) {
+        ctx.BetaProgramController.optIn(ctx.req, ctx.res, ctx.next)
+        ctx.res.redirect.callCount.should.equal(0)
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.BetaProgramController.optIn(ctx.req, ctx.res, err => {
+            expect(err).to.be.instanceof(Error)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+
+  describe('optOut', function () {
+    it("should redirect to '/beta/participate'", async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.res.redirectedTo).to.equal('/beta/participate')
+          resolve()
+        }
+        ctx.BetaProgramController.optOut(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should not call next with an error', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.next.callCount.should.equal(0)
+          resolve()
+        }
+        ctx.BetaProgramController.optOut(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should call BetaProgramHandler.optOut', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.BetaProgramHandler.promises.optOut.callCount.should.equal(1)
+          resolve()
+        }
+        ctx.BetaProgramController.optOut(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should invoke the session maintenance', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
+            ctx.req,
+            null
+          )
+          resolve()
+        }
+        ctx.BetaProgramController.optOut(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    describe('when BetaProgramHandler.optOut produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.BetaProgramHandler.promises.optOut.throws(new Error('woops'))
+      })
+
+      it("should not redirect to '/beta/participate'", async function (ctx) {
+        await new Promise(resolve => {
+          ctx.BetaProgramController.optOut(ctx.req, ctx.res, error => {
+            expect(error).to.exist
+            expect(ctx.res.redirected).to.equal(false)
+            resolve()
+          })
+        })
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.BetaProgramController.optOut(ctx.req, ctx.res, error => {
+            expect(error).to.exist
+            resolve()
+          })
+        })
+      })
+    })
+  })
+
+  describe('optInPage', function () {
+    beforeEach(function (ctx) {
+      ctx.UserGetter.promises.getUser.resolves(ctx.user)
+    })
+
+    it('should render the opt-in page', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.res.renderedTemplate).to.equal('beta_program/opt_in')
+          resolve()
+        }
+        ctx.BetaProgramController.optInPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    describe('when UserGetter.getUser produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUser.throws(new Error('woops'))
+      })
+
+      it('should not render the opt-in page', function (ctx) {
+        ctx.BetaProgramController.optInPage(ctx.req, ctx.res, ctx.next)
+        ctx.res.render.callCount.should.equal(0)
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.BetaProgramController.optInPage(ctx.req, ctx.res, error => {
+            expect(error).to.exist
+            expect(error).to.be.instanceof(Error)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/BetaProgram/BetaProgramControllerTests.mjs b/services/web/test/unit/src/BetaProgram/BetaProgramControllerTests.mjs
deleted file mode 100644
index 78747b8880..0000000000
--- a/services/web/test/unit/src/BetaProgram/BetaProgramControllerTests.mjs
+++ /dev/null
@@ -1,199 +0,0 @@
-import esmock from 'esmock'
-import path from 'node:path'
-import sinon from 'sinon'
-import { expect } from 'chai'
-import MockResponse from '../helpers/MockResponse.js'
-import { fileURLToPath } from 'node:url'
-
-const __dirname = fileURLToPath(new URL('.', import.meta.url))
-
-const modulePath = path.join(
-  __dirname,
-  '../../../../app/src/Features/BetaProgram/BetaProgramController'
-)
-
-describe('BetaProgramController', function () {
-  beforeEach(async function () {
-    this.user = {
-      _id: (this.user_id = 'a_simple_id'),
-      email: 'user@example.com',
-      features: {},
-      betaProgram: false,
-    }
-    this.req = {
-      query: {},
-      session: {
-        user: this.user,
-      },
-    }
-    this.SplitTestSessionHandler = {
-      promises: {
-        sessionMaintenance: sinon.stub(),
-      },
-    }
-    this.BetaProgramController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/SplitTests/SplitTestSessionHandler':
-        this.SplitTestSessionHandler,
-      '../../../../app/src/Features/BetaProgram/BetaProgramHandler':
-        (this.BetaProgramHandler = {
-          promises: {
-            optIn: sinon.stub().resolves(),
-            optOut: sinon.stub().resolves(),
-          },
-        }),
-      '../../../../app/src/Features/User/UserGetter': (this.UserGetter = {
-        promises: {
-          getUser: sinon.stub().resolves(),
-        },
-      }),
-      '@overleaf/settings': (this.settings = {
-        languages: {},
-      }),
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        (this.AuthenticationController = {
-          getLoggedInUserId: sinon.stub().returns(this.user._id),
-        }),
-    })
-    this.res = new MockResponse()
-    this.next = sinon.stub()
-  })
-
-  describe('optIn', function () {
-    it("should redirect to '/beta/participate'", function (done) {
-      this.res.callback = () => {
-        this.res.redirectedTo.should.equal('/beta/participate')
-        done()
-      }
-      this.BetaProgramController.optIn(this.req, this.res, done)
-    })
-
-    it('should not call next with an error', function () {
-      this.BetaProgramController.optIn(this.req, this.res, this.next)
-      this.next.callCount.should.equal(0)
-    })
-
-    it('should call BetaProgramHandler.optIn', function () {
-      this.BetaProgramController.optIn(this.req, this.res, this.next)
-      this.BetaProgramHandler.promises.optIn.callCount.should.equal(1)
-    })
-
-    it('should invoke the session maintenance', function (done) {
-      this.res.callback = () => {
-        this.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
-          this.req
-        )
-        done()
-      }
-      this.BetaProgramController.optIn(this.req, this.res, done)
-    })
-
-    describe('when BetaProgramHandler.opIn produces an error', function () {
-      beforeEach(function () {
-        this.BetaProgramHandler.promises.optIn.throws(new Error('woops'))
-      })
-
-      it("should not redirect to '/beta/participate'", function () {
-        this.BetaProgramController.optIn(this.req, this.res, this.next)
-        this.res.redirect.callCount.should.equal(0)
-      })
-
-      it('should produce an error', function (done) {
-        this.BetaProgramController.optIn(this.req, this.res, err => {
-          expect(err).to.be.instanceof(Error)
-          done()
-        })
-      })
-    })
-  })
-
-  describe('optOut', function () {
-    it("should redirect to '/beta/participate'", function (done) {
-      this.res.callback = () => {
-        expect(this.res.redirectedTo).to.equal('/beta/participate')
-        done()
-      }
-      this.BetaProgramController.optOut(this.req, this.res, done)
-    })
-
-    it('should not call next with an error', function (done) {
-      this.res.callback = () => {
-        this.next.callCount.should.equal(0)
-        done()
-      }
-      this.BetaProgramController.optOut(this.req, this.res, done)
-    })
-
-    it('should call BetaProgramHandler.optOut', function (done) {
-      this.res.callback = () => {
-        this.BetaProgramHandler.promises.optOut.callCount.should.equal(1)
-        done()
-      }
-      this.BetaProgramController.optOut(this.req, this.res, done)
-    })
-
-    it('should invoke the session maintenance', function (done) {
-      this.res.callback = () => {
-        this.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
-          this.req,
-          null
-        )
-        done()
-      }
-      this.BetaProgramController.optOut(this.req, this.res, done)
-    })
-
-    describe('when BetaProgramHandler.optOut produces an error', function () {
-      beforeEach(function () {
-        this.BetaProgramHandler.promises.optOut.throws(new Error('woops'))
-      })
-
-      it("should not redirect to '/beta/participate'", function (done) {
-        this.BetaProgramController.optOut(this.req, this.res, error => {
-          expect(error).to.exist
-          expect(this.res.redirected).to.equal(false)
-          done()
-        })
-      })
-
-      it('should produce an error', function (done) {
-        this.BetaProgramController.optOut(this.req, this.res, error => {
-          expect(error).to.exist
-          done()
-        })
-      })
-    })
-  })
-
-  describe('optInPage', function () {
-    beforeEach(function () {
-      this.UserGetter.promises.getUser.resolves(this.user)
-    })
-
-    it('should render the opt-in page', function (done) {
-      this.res.callback = () => {
-        expect(this.res.renderedTemplate).to.equal('beta_program/opt_in')
-        done()
-      }
-      this.BetaProgramController.optInPage(this.req, this.res, done)
-    })
-
-    describe('when UserGetter.getUser produces an error', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUser.throws(new Error('woops'))
-      })
-
-      it('should not render the opt-in page', function () {
-        this.BetaProgramController.optInPage(this.req, this.res, this.next)
-        this.res.render.callCount.should.equal(0)
-      })
-
-      it('should produce an error', function (done) {
-        this.BetaProgramController.optInPage(this.req, this.res, error => {
-          expect(error).to.exist
-          expect(error).to.be.instanceof(Error)
-          done()
-        })
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/BetaProgram/BetaProgramHandler.test.mjs b/services/web/test/unit/src/BetaProgram/BetaProgramHandler.test.mjs
new file mode 100644
index 0000000000..2e6ffb4568
--- /dev/null
+++ b/services/web/test/unit/src/BetaProgram/BetaProgramHandler.test.mjs
@@ -0,0 +1,168 @@
+import { expect, vi } from 'vitest'
+import path from 'node:path'
+
+import sinon from 'sinon'
+import { fileURLToPath } from 'node:url'
+
+const __dirname = fileURLToPath(new URL('.', import.meta.url))
+
+const modulePath = path.join(
+  __dirname,
+  '../../../../app/src/Features/BetaProgram/BetaProgramHandler'
+)
+
+describe('BetaProgramHandler', function () {
+  beforeEach(async function (ctx) {
+    ctx.user_id = 'some_id'
+    ctx.user = {
+      _id: ctx.user_id,
+      email: 'user@example.com',
+      features: {},
+      betaProgram: false,
+      save: sinon.stub().callsArgWith(0, null),
+    }
+
+    vi.doMock('@overleaf/metrics', () => ({
+      default: {
+        inc: sinon.stub(),
+      },
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserUpdater', () => ({
+      default: (ctx.UserUpdater = {
+        promises: {
+          updateUser: sinon.stub().resolves(),
+        },
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager',
+      () => ({
+        default: (ctx.AnalyticsManager = {
+          setUserPropertyForUserInBackground: sinon.stub(),
+        }),
+      })
+    )
+
+    ctx.handler = (await import(modulePath)).default
+  })
+
+  describe('optIn', function () {
+    beforeEach(function (ctx) {
+      ctx.user.betaProgram = false
+      ctx.call = callback => {
+        ctx.handler.optIn(ctx.user_id, callback)
+      }
+    })
+
+    it('should call userUpdater', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          ctx.UserUpdater.promises.updateUser.callCount.should.equal(1)
+          resolve()
+        })
+      })
+    })
+
+    it('should set beta-program user property to true', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          sinon.assert.calledWith(
+            ctx.AnalyticsManager.setUserPropertyForUserInBackground,
+            ctx.user_id,
+            'beta-program',
+            true
+          )
+          resolve()
+        })
+      })
+    })
+
+    it('should not produce an error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          resolve()
+        })
+      })
+    })
+
+    describe('when userUpdater produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserUpdater.promises.updateUser.rejects()
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(err => {
+            expect(err).to.exist
+            expect(err).to.be.instanceof(Error)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+
+  describe('optOut', function () {
+    beforeEach(function (ctx) {
+      ctx.user.betaProgram = true
+      ctx.call = callback => {
+        ctx.handler.optOut(ctx.user_id, callback)
+      }
+    })
+
+    it('should call userUpdater', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          ctx.UserUpdater.promises.updateUser.callCount.should.equal(1)
+          resolve()
+        })
+      })
+    })
+
+    it('should set beta-program user property to false', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          sinon.assert.calledWith(
+            ctx.AnalyticsManager.setUserPropertyForUserInBackground,
+            ctx.user_id,
+            'beta-program',
+            false
+          )
+          resolve()
+        })
+      })
+    })
+
+    it('should not produce an error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(err => {
+          expect(err).to.not.exist
+          resolve()
+        })
+      })
+    })
+
+    describe('when userUpdater produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserUpdater.promises.updateUser.rejects()
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(err => {
+            expect(err).to.exist
+            expect(err).to.be.instanceof(Error)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/BetaProgram/BetaProgramHandlerTests.mjs b/services/web/test/unit/src/BetaProgram/BetaProgramHandlerTests.mjs
deleted file mode 100644
index 2b72271fd5..0000000000
--- a/services/web/test/unit/src/BetaProgram/BetaProgramHandlerTests.mjs
+++ /dev/null
@@ -1,142 +0,0 @@
-import esmock from 'esmock'
-import path from 'node:path'
-
-import sinon from 'sinon'
-import { expect } from 'chai'
-import { fileURLToPath } from 'node:url'
-
-const __dirname = fileURLToPath(new URL('.', import.meta.url))
-
-const modulePath = path.join(
-  __dirname,
-  '../../../../app/src/Features/BetaProgram/BetaProgramHandler'
-)
-
-describe('BetaProgramHandler', function () {
-  beforeEach(async function () {
-    this.user_id = 'some_id'
-    this.user = {
-      _id: this.user_id,
-      email: 'user@example.com',
-      features: {},
-      betaProgram: false,
-      save: sinon.stub().callsArgWith(0, null),
-    }
-    this.handler = await esmock.strict(modulePath, {
-      '@overleaf/metrics': {
-        inc: sinon.stub(),
-      },
-      '../../../../app/src/Features/User/UserUpdater': (this.UserUpdater = {
-        promises: {
-          updateUser: sinon.stub().resolves(),
-        },
-      }),
-      '../../../../app/src/Features/Analytics/AnalyticsManager':
-        (this.AnalyticsManager = {
-          setUserPropertyForUserInBackground: sinon.stub(),
-        }),
-    })
-  })
-
-  describe('optIn', function () {
-    beforeEach(function () {
-      this.user.betaProgram = false
-      this.call = callback => {
-        this.handler.optIn(this.user_id, callback)
-      }
-    })
-
-    it('should call userUpdater', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        this.UserUpdater.promises.updateUser.callCount.should.equal(1)
-        done()
-      })
-    })
-
-    it('should set beta-program user property to true', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        sinon.assert.calledWith(
-          this.AnalyticsManager.setUserPropertyForUserInBackground,
-          this.user_id,
-          'beta-program',
-          true
-        )
-        done()
-      })
-    })
-
-    it('should not produce an error', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        done()
-      })
-    })
-
-    describe('when userUpdater produces an error', function () {
-      beforeEach(function () {
-        this.UserUpdater.promises.updateUser.rejects()
-      })
-
-      it('should produce an error', function (done) {
-        this.call(err => {
-          expect(err).to.exist
-          expect(err).to.be.instanceof(Error)
-          done()
-        })
-      })
-    })
-  })
-
-  describe('optOut', function () {
-    beforeEach(function () {
-      this.user.betaProgram = true
-      this.call = callback => {
-        this.handler.optOut(this.user_id, callback)
-      }
-    })
-
-    it('should call userUpdater', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        this.UserUpdater.promises.updateUser.callCount.should.equal(1)
-        done()
-      })
-    })
-
-    it('should set beta-program user property to false', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        sinon.assert.calledWith(
-          this.AnalyticsManager.setUserPropertyForUserInBackground,
-          this.user_id,
-          'beta-program',
-          false
-        )
-        done()
-      })
-    })
-
-    it('should not produce an error', function (done) {
-      this.call(err => {
-        expect(err).to.not.exist
-        done()
-      })
-    })
-
-    describe('when userUpdater produces an error', function () {
-      beforeEach(function () {
-        this.UserUpdater.promises.updateUser.rejects()
-      })
-
-      it('should produce an error', function (done) {
-        this.call(err => {
-          expect(err).to.exist
-          expect(err).to.be.instanceof(Error)
-          done()
-        })
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/BrandVariations/BrandVariationsHandlerTests.js b/services/web/test/unit/src/BrandVariations/BrandVariationsHandlerTests.js
index 08491cc511..75adfd7e9b 100644
--- a/services/web/test/unit/src/BrandVariations/BrandVariationsHandlerTests.js
+++ b/services/web/test/unit/src/BrandVariations/BrandVariationsHandlerTests.js
@@ -59,47 +59,34 @@ describe('BrandVariationsHandler', function () {
   })
 
   describe('getBrandVariationById', function () {
-    it('should call the callback with an error when the branding variation id is not provided', function (done) {
-      return this.BrandVariationsHandler.getBrandVariationById(
-        null,
-        (err, brandVariationDetails) => {
-          expect(err).to.be.instanceof(Error)
-          return done()
-        }
-      )
+    it('should reject with an error when the branding variation id is not provided', async function () {
+      await expect(
+        this.BrandVariationsHandler.promises.getBrandVariationById(null)
+      ).to.be.rejected
     })
 
-    it('should call the callback with an error when the request errors', function (done) {
+    it('should reject with an error when the request errors', async function () {
       this.V1Api.request.callsArgWith(1, new Error())
-      return this.BrandVariationsHandler.getBrandVariationById(
-        '12',
-        (err, brandVariationDetails) => {
-          expect(err).to.be.instanceof(Error)
-          return done()
-        }
-      )
+      await expect(
+        this.BrandVariationsHandler.promises.getBrandVariationById('12')
+      ).to.be.rejected
     })
 
-    it('should call the callback with branding details when request succeeds', function (done) {
+    it('should return branding details when request succeeds', async function () {
       this.V1Api.request.callsArgWith(
         1,
         null,
         { statusCode: 200 },
         this.mockedBrandVariationDetails
       )
-      return this.BrandVariationsHandler.getBrandVariationById(
-        '12',
-        (err, brandVariationDetails) => {
-          expect(err).to.not.exist
-          expect(brandVariationDetails).to.deep.equal(
-            this.mockedBrandVariationDetails
-          )
-          return done()
-        }
+      const brandVariationDetails =
+        await this.BrandVariationsHandler.promises.getBrandVariationById('12')
+      expect(brandVariationDetails).to.deep.equal(
+        this.mockedBrandVariationDetails
       )
     })
 
-    it('should transform relative URLs in v1 absolute ones', function (done) {
+    it('should transform relative URLs in v1 absolute ones', async function () {
       this.mockedBrandVariationDetails.logo_url = '/journal-logo.png'
       this.V1Api.request.callsArgWith(
         1,
@@ -107,20 +94,16 @@ describe('BrandVariationsHandler', function () {
         { statusCode: 200 },
         this.mockedBrandVariationDetails
       )
-      return this.BrandVariationsHandler.getBrandVariationById(
-        '12',
-        (err, brandVariationDetails) => {
-          expect(
-            brandVariationDetails.logo_url.startsWith(
-              this.settings.apis.v1.publicUrl
-            )
-          ).to.be.true
-          return done()
-        }
-      )
+      const brandVariationDetails =
+        await this.BrandVariationsHandler.promises.getBrandVariationById('12')
+      expect(
+        brandVariationDetails.logo_url.startsWith(
+          this.settings.apis.v1.publicUrl
+        )
+      ).to.be.true
     })
 
-    it("should sanitize 'submit_button_html'", function (done) {
+    it("should sanitize 'submit_button_html'", async function () {
       this.mockedBrandVariationDetails.submit_button_html =
         '<br class="break"/><strong style="color:#B39500">AGU Journal</strong><iframe>hello</iframe>'
       this.V1Api.request.callsArgWith(
@@ -129,14 +112,26 @@ describe('BrandVariationsHandler', function () {
         { statusCode: 200 },
         this.mockedBrandVariationDetails
       )
-      return this.BrandVariationsHandler.getBrandVariationById(
-        '12',
-        (err, brandVariationDetails) => {
-          expect(brandVariationDetails.submit_button_html).to.equal(
-            '<br /><strong style="color:#B39500">AGU Journal</strong>hello'
-          )
-          return done()
-        }
+      const brandVariationDetails =
+        await this.BrandVariationsHandler.promises.getBrandVariationById('12')
+      expect(brandVariationDetails.submit_button_html).to.equal(
+        '<br /><strong style="color:#B39500">AGU Journal</strong>hello'
+      )
+    })
+
+    it("should sanitize and remove breaks in 'submit_button_html_no_br'", async function () {
+      this.mockedBrandVariationDetails.submit_button_html =
+        'Submit to<br class="break"/><strong style="color:#B39500">AGU Journal</strong><iframe>hello</iframe>'
+      this.V1Api.request.callsArgWith(
+        1,
+        null,
+        { statusCode: 200 },
+        this.mockedBrandVariationDetails
+      )
+      const brandVariationDetails =
+        await this.BrandVariationsHandler.promises.getBrandVariationById('12')
+      expect(brandVariationDetails.submit_button_html_no_br).to.equal(
+        'Submit to <strong style="color:#B39500">AGU Journal</strong>hello'
       )
     })
   })
diff --git a/services/web/test/unit/src/Chat/ChatManagerTests.js b/services/web/test/unit/src/Chat/ChatManagerTests.js
index 76d9b79c4b..5578b8b167 100644
--- a/services/web/test/unit/src/Chat/ChatManagerTests.js
+++ b/services/web/test/unit/src/Chat/ChatManagerTests.js
@@ -12,7 +12,7 @@ describe('ChatManager', function () {
     this.user_id = 'mock-user-id'
     this.ChatManager = SandboxedModule.require(modulePath, {
       requires: {
-        '../User/UserInfoManager': (this.UserInfoManager = {}),
+        '../User/UserGetter': (this.UserGetter = { promises: {} }),
         '../User/UserInfoController': (this.UserInfoController = {}),
       },
     })
@@ -32,23 +32,27 @@ describe('ChatManager', function () {
     beforeEach(function () {
       this.users = {
         user_id_1: {
-          mock: 'user_1',
+          _id: 'user_id_1',
         },
         user_id_2: {
-          mock: 'user_2',
+          _id: 'user_id_2',
         },
       }
-      this.UserInfoManager.getPersonalInfo = (userId, callback) => {
-        return callback(null, this.users[userId])
-      }
-      sinon.spy(this.UserInfoManager, 'getPersonalInfo')
+      this.UserGetter.promises.getUsers = userIds =>
+        Promise.resolve(
+          Array.from(userIds)
+            .map(id => this.users[id])
+            .filter(u => !!u)
+        )
+
+      sinon.spy(this.UserGetter.promises, 'getUsers')
       return (this.UserInfoController.formatPersonalInfo = user => ({
-        formatted: user.mock,
+        formatted: { id: user._id.toString() },
       }))
     })
 
-    it('should inject a user object into messaged and resolved data', function (done) {
-      return this.ChatManager.injectUserInfoIntoThreads(
+    it('should inject a user object into messaged and resolved data', async function () {
+      const threads = await this.ChatManager.promises.injectUserInfoIntoThreads(
         {
           thread1: {
             resolved: true,
@@ -72,64 +76,56 @@ describe('ChatManager', function () {
               },
             ],
           },
-        },
-        (error, threads) => {
-          expect(error).to.be.null
-          expect(threads).to.deep.equal({
-            thread1: {
-              resolved: true,
-              resolved_by_user_id: 'user_id_1',
-              resolved_by_user: { formatted: 'user_1' },
-              messages: [
-                {
-                  user_id: 'user_id_1',
-                  user: { formatted: 'user_1' },
-                  content: 'foo',
-                },
-                {
-                  user_id: 'user_id_2',
-                  user: { formatted: 'user_2' },
-                  content: 'bar',
-                },
-              ],
-            },
-            thread2: {
-              messages: [
-                {
-                  user_id: 'user_id_1',
-                  user: { formatted: 'user_1' },
-                  content: 'baz',
-                },
-              ],
-            },
-          })
-          return done()
         }
       )
+
+      expect(threads).to.deep.equal({
+        thread1: {
+          resolved: true,
+          resolved_by_user_id: 'user_id_1',
+          resolved_by_user: { formatted: { id: 'user_id_1' } },
+          messages: [
+            {
+              user_id: 'user_id_1',
+              user: { formatted: { id: 'user_id_1' } },
+              content: 'foo',
+            },
+            {
+              user_id: 'user_id_2',
+              user: { formatted: { id: 'user_id_2' } },
+              content: 'bar',
+            },
+          ],
+        },
+        thread2: {
+          messages: [
+            {
+              user_id: 'user_id_1',
+              user: { formatted: { id: 'user_id_1' } },
+              content: 'baz',
+            },
+          ],
+        },
+      })
     })
 
-    it('should only need to look up each user once', function (done) {
-      return this.ChatManager.injectUserInfoIntoThreads(
-        [
-          {
-            messages: [
-              {
-                user_id: 'user_id_1',
-                content: 'foo',
-              },
-              {
-                user_id: 'user_id_1',
-                content: 'bar',
-              },
-            ],
-          },
-        ],
-        (error, threads) => {
-          expect(error).to.be.null
-          this.UserInfoManager.getPersonalInfo.calledOnce.should.equal(true)
-          return done()
-        }
-      )
+    it('should lookup all users in a single batch', async function () {
+      await this.ChatManager.promises.injectUserInfoIntoThreads([
+        {
+          messages: [
+            {
+              user_id: 'user_id_1',
+              content: 'foo',
+            },
+            {
+              user_id: 'user_id_1',
+              content: 'bar',
+            },
+          ],
+        },
+      ])
+
+      this.UserGetter.promises.getUsers.should.have.been.calledOnce
     })
   })
 })
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsController.test.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsController.test.mjs
new file mode 100644
index 0000000000..85beb949b7
--- /dev/null
+++ b/services/web/test/unit/src/Collaborators/CollaboratorsController.test.mjs
@@ -0,0 +1,519 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import mongodb from 'mongodb-legacy'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH =
+  '../../../../app/src/Features/Collaborators/CollaboratorsController.mjs'
+
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
+describe('CollaboratorsController', function () {
+  beforeEach(async function (ctx) {
+    ctx.res = new MockResponse()
+    ctx.req = new MockRequest()
+
+    ctx.user = { _id: new ObjectId() }
+    ctx.projectId = new ObjectId()
+    ctx.callback = sinon.stub()
+
+    ctx.CollaboratorsHandler = {
+      promises: {
+        removeUserFromProject: sinon.stub().resolves(),
+        setCollaboratorPrivilegeLevel: sinon.stub().resolves(),
+      },
+      createTokenHashPrefix: sinon.stub().returns('abc123'),
+    }
+    ctx.CollaboratorsGetter = {
+      promises: {
+        getAllInvitedMembers: sinon.stub(),
+      },
+    }
+    ctx.EditorRealTimeController = {
+      emitToRoom: sinon.stub(),
+    }
+    ctx.HttpErrorHandler = {
+      forbidden: sinon.stub(),
+      notFound: sinon.stub(),
+    }
+    ctx.TagsHandler = {
+      promises: {
+        removeProjectFromAllTags: sinon.stub().resolves(),
+      },
+    }
+    ctx.SessionManager = {
+      getSessionUser: sinon.stub().returns(ctx.user),
+      getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+    }
+    ctx.OwnershipTransferHandler = {
+      promises: {
+        transferOwnership: sinon.stub().resolves(),
+      },
+    }
+    ctx.TokenAccessHandler = {
+      getRequestToken: sinon.stub().returns('access-token'),
+    }
+
+    ctx.ProjectAuditLogHandler = {
+      addEntryInBackground: sinon.stub(),
+    }
+
+    ctx.ProjectGetter = {
+      promises: {
+        getProject: sinon.stub().resolves({ owner_ref: ctx.user._id }),
+      },
+    }
+
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
+      },
+    }
+
+    ctx.LimitationsManager = {
+      promises: {
+        canAddXEditCollaborators: sinon.stub().resolves(),
+        canChangeCollaboratorPrivilegeLevel: sinon.stub().resolves(true),
+      },
+    }
+
+    vi.doMock('mongodb-legacy', () => ({
+      default: { ObjectId },
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsHandler.js',
+      () => ({
+        default: ctx.CollaboratorsHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsGetter.js',
+      () => ({
+        default: ctx.CollaboratorsGetter,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/OwnershipTransferHandler.js',
+      () => ({
+        default: ctx.OwnershipTransferHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController',
+      () => ({
+        default: ctx.EditorRealTimeController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Errors/HttpErrorHandler.js',
+      () => ({
+        default: ctx.HttpErrorHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Tags/TagsHandler.js', () => ({
+      default: ctx.TagsHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager.js',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/TokenAccess/TokenAccessHandler.js',
+      () => ({
+        default: ctx.TokenAccessHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js',
+      () => ({
+        default: ctx.ProjectAuditLogHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter.js', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler.js',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/LimitationsManager.js',
+      () => ({
+        default: ctx.LimitationsManager,
+      })
+    )
+
+    ctx.CollaboratorsController = (await import(MODULE_PATH)).default
+  })
+
+  describe('removeUserFromProject', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.params = {
+          Project_id: ctx.projectId,
+          user_id: ctx.user._id,
+        }
+        ctx.res.sendStatus = sinon.spy(() => {
+          resolve()
+        })
+        ctx.CollaboratorsController.removeUserFromProject(ctx.req, ctx.res)
+      })
+    })
+
+    it('should from the user from the project', function (ctx) {
+      expect(
+        ctx.CollaboratorsHandler.promises.removeUserFromProject
+      ).to.have.been.calledWith(ctx.projectId, ctx.user._id)
+    })
+
+    it('should emit a userRemovedFromProject event to the proejct', function (ctx) {
+      expect(ctx.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
+        ctx.projectId,
+        'userRemovedFromProject',
+        ctx.user._id
+      )
+    })
+
+    it('should send the back a success response', function (ctx) {
+      ctx.res.sendStatus.calledWith(204).should.equal(true)
+    })
+
+    it('should have called emitToRoom', function (ctx) {
+      expect(ctx.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
+        ctx.projectId,
+        'project:membership:changed'
+      )
+    })
+
+    it('should write a project audit log', function (ctx) {
+      ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+        ctx.projectId,
+        'remove-collaborator',
+        ctx.user._id,
+        ctx.req.ip,
+        { userId: ctx.user._id }
+      )
+    })
+  })
+
+  describe('removeSelfFromProject', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.params = { Project_id: ctx.projectId }
+        ctx.res.sendStatus = sinon.spy(() => {
+          resolve()
+        })
+        ctx.CollaboratorsController.removeSelfFromProject(ctx.req, ctx.res)
+      })
+    })
+
+    it('should remove the logged in user from the project', function (ctx) {
+      expect(
+        ctx.CollaboratorsHandler.promises.removeUserFromProject
+      ).to.have.been.calledWith(ctx.projectId, ctx.user._id)
+    })
+
+    it('should emit a userRemovedFromProject event to the proejct', function (ctx) {
+      expect(ctx.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
+        ctx.projectId,
+        'userRemovedFromProject',
+        ctx.user._id
+      )
+    })
+
+    it('should remove the project from all tags', function (ctx) {
+      expect(
+        ctx.TagsHandler.promises.removeProjectFromAllTags
+      ).to.have.been.calledWith(ctx.user._id, ctx.projectId)
+    })
+
+    it('should return a success code', function (ctx) {
+      ctx.res.sendStatus.calledWith(204).should.equal(true)
+    })
+
+    it('should write a project audit log', function (ctx) {
+      ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+        ctx.projectId,
+        'leave-project',
+        ctx.user._id,
+        ctx.req.ip
+      )
+    })
+  })
+
+  describe('getAllMembers', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.params = { Project_id: ctx.projectId }
+        ctx.res.json = sinon.spy(() => {
+          resolve()
+        })
+        ctx.next = sinon.stub()
+        ctx.members = [{ a: 1 }]
+        ctx.CollaboratorsGetter.promises.getAllInvitedMembers.resolves(
+          ctx.members
+        )
+        ctx.CollaboratorsController.getAllMembers(ctx.req, ctx.res, ctx.next)
+      })
+    })
+
+    it('should not produce an error', function (ctx) {
+      ctx.next.callCount.should.equal(0)
+    })
+
+    it('should produce a json response', function (ctx) {
+      ctx.res.json.callCount.should.equal(1)
+      ctx.res.json.calledWith({ members: ctx.members }).should.equal(true)
+    })
+
+    it('should call CollaboratorsGetter.getAllInvitedMembers', function (ctx) {
+      expect(ctx.CollaboratorsGetter.promises.getAllInvitedMembers).to.have.been
+        .calledOnce
+    })
+
+    describe('when CollaboratorsGetter.getAllInvitedMembers produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.json = sinon.stub()
+          ctx.next = sinon.spy(() => {
+            resolve()
+          })
+          ctx.CollaboratorsGetter.promises.getAllInvitedMembers.rejects(
+            new Error('woops')
+          )
+          ctx.CollaboratorsController.getAllMembers(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should produce an error', function (ctx) {
+        expect(ctx.next).to.have.been.calledOnce
+        expect(ctx.next).to.have.been.calledWithMatch(
+          sinon.match.instanceOf(Error)
+        )
+      })
+
+      it('should not produce a json response', function (ctx) {
+        ctx.res.json.callCount.should.equal(0)
+      })
+    })
+  })
+
+  describe('setCollaboratorInfo', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.projectId,
+        user_id: ctx.user._id,
+      }
+      ctx.req.body = { privilegeLevel: 'readOnly' }
+    })
+
+    it('should set the collaborator privilege level', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.sendStatus = status => {
+          expect(status).to.equal(204)
+          expect(
+            ctx.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
+          ).to.have.been.calledWith(ctx.projectId, ctx.user._id, 'readOnly')
+          resolve()
+        }
+        ctx.CollaboratorsController.setCollaboratorInfo(ctx.req, ctx.res)
+      })
+    })
+
+    it('should return a 404 when the project or collaborator is not found', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.HttpErrorHandler.notFound = sinon.spy((req, res) => {
+          expect(req).to.equal(ctx.req)
+          expect(res).to.equal(ctx.res)
+          resolve()
+        })
+
+        ctx.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel.rejects(
+          new Errors.NotFoundError()
+        )
+        ctx.CollaboratorsController.setCollaboratorInfo(ctx.req, ctx.res)
+      })
+    })
+
+    it('should pass the error to the next handler when setting the privilege level fails', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.next = sinon.spy(err => {
+          expect(err).instanceOf(Error)
+          resolve()
+        })
+
+        ctx.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel.rejects(
+          new Error()
+        )
+        ctx.CollaboratorsController.setCollaboratorInfo(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+    })
+
+    describe('when setting privilege level to readAndWrite', function () {
+      beforeEach(function (ctx) {
+        ctx.req.body = { privilegeLevel: 'readAndWrite' }
+      })
+
+      describe('when owner can add new edit collaborators', function () {
+        it('should set privilege level after checking collaborators can be added', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.sendStatus = status => {
+              expect(status).to.equal(204)
+              expect(
+                ctx.LimitationsManager.promises
+                  .canChangeCollaboratorPrivilegeLevel
+              ).to.have.been.calledWith(
+                ctx.projectId,
+                ctx.user._id,
+                'readAndWrite'
+              )
+              resolve()
+            }
+            ctx.CollaboratorsController.setCollaboratorInfo(ctx.req, ctx.res)
+          })
+        })
+      })
+
+      describe('when owner cannot add edit collaborators', function () {
+        beforeEach(function (ctx) {
+          ctx.LimitationsManager.promises.canChangeCollaboratorPrivilegeLevel.resolves(
+            false
+          )
+        })
+
+        it('should return a 403 if trying to set a new edit collaborator', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.HttpErrorHandler.forbidden = sinon.spy((req, res) => {
+              expect(req).to.equal(ctx.req)
+              expect(res).to.equal(ctx.res)
+              expect(
+                ctx.LimitationsManager.promises
+                  .canChangeCollaboratorPrivilegeLevel
+              ).to.have.been.calledWith(
+                ctx.projectId,
+                ctx.user._id,
+                'readAndWrite'
+              )
+              expect(
+                ctx.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
+              ).to.not.have.been.called
+              resolve()
+            })
+            ctx.CollaboratorsController.setCollaboratorInfo(ctx.req, ctx.res)
+          })
+        })
+      })
+    })
+
+    describe('when setting privilege level to readOnly', function () {
+      beforeEach(function (ctx) {
+        ctx.req.body = { privilegeLevel: 'readOnly' }
+      })
+
+      describe('when owner cannot add edit collaborators', function () {
+        beforeEach(function (ctx) {
+          ctx.LimitationsManager.promises.canAddXEditCollaborators.resolves(
+            false
+          )
+        })
+
+        it('should always allow setting a collaborator to viewer even if user cant add edit collaborators', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.sendStatus = status => {
+              expect(status).to.equal(204)
+              expect(ctx.LimitationsManager.promises.canAddXEditCollaborators)
+                .to.not.have.been.called
+              expect(
+                ctx.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
+              ).to.have.been.calledWith(ctx.projectId, ctx.user._id, 'readOnly')
+              resolve()
+            }
+            ctx.CollaboratorsController.setCollaboratorInfo(ctx.req, ctx.res)
+          })
+        })
+      })
+    })
+  })
+
+  describe('transferOwnership', function () {
+    beforeEach(function (ctx) {
+      ctx.req.body = { user_id: ctx.user._id.toString() }
+    })
+
+    it('returns 204 on success', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.sendStatus = status => {
+          expect(status).to.equal(204)
+          resolve()
+        }
+        ctx.CollaboratorsController.transferOwnership(ctx.req, ctx.res)
+      })
+    })
+
+    it('returns 404 if the project does not exist', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.HttpErrorHandler.notFound = sinon.spy((req, res, message) => {
+          expect(req).to.equal(ctx.req)
+          expect(res).to.equal(ctx.res)
+          expect(message).to.match(/project not found/)
+          resolve()
+        })
+        ctx.OwnershipTransferHandler.promises.transferOwnership.rejects(
+          new Errors.ProjectNotFoundError()
+        )
+        ctx.CollaboratorsController.transferOwnership(ctx.req, ctx.res)
+      })
+    })
+
+    it('returns 404 if the user does not exist', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.HttpErrorHandler.notFound = sinon.spy((req, res, message) => {
+          expect(req).to.equal(ctx.req)
+          expect(res).to.equal(ctx.res)
+          expect(message).to.match(/user not found/)
+          resolve()
+        })
+        ctx.OwnershipTransferHandler.promises.transferOwnership.rejects(
+          new Errors.UserNotFoundError()
+        )
+        ctx.CollaboratorsController.transferOwnership(ctx.req, ctx.res)
+      })
+    })
+
+    it('invokes HTTP forbidden error handler if the user is not a collaborator', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.HttpErrorHandler.forbidden = sinon.spy(() => resolve())
+        ctx.OwnershipTransferHandler.promises.transferOwnership.rejects(
+          new Errors.UserNotCollaboratorError()
+        )
+        ctx.CollaboratorsController.transferOwnership(ctx.req, ctx.res)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsControllerTests.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsControllerTests.mjs
deleted file mode 100644
index 27460da148..0000000000
--- a/services/web/test/unit/src/Collaborators/CollaboratorsControllerTests.mjs
+++ /dev/null
@@ -1,435 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import mongodb from 'mongodb-legacy'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH =
-  '../../../../app/src/Features/Collaborators/CollaboratorsController.mjs'
-
-describe('CollaboratorsController', function () {
-  beforeEach(async function () {
-    this.res = new MockResponse()
-    this.req = new MockRequest()
-
-    this.user = { _id: new ObjectId() }
-    this.projectId = new ObjectId()
-    this.callback = sinon.stub()
-
-    this.CollaboratorsHandler = {
-      promises: {
-        removeUserFromProject: sinon.stub().resolves(),
-        setCollaboratorPrivilegeLevel: sinon.stub().resolves(),
-      },
-      createTokenHashPrefix: sinon.stub().returns('abc123'),
-    }
-    this.CollaboratorsGetter = {
-      promises: {
-        getAllInvitedMembers: sinon.stub(),
-      },
-    }
-    this.EditorRealTimeController = {
-      emitToRoom: sinon.stub(),
-    }
-    this.HttpErrorHandler = {
-      forbidden: sinon.stub(),
-      notFound: sinon.stub(),
-    }
-    this.TagsHandler = {
-      promises: {
-        removeProjectFromAllTags: sinon.stub().resolves(),
-      },
-    }
-    this.SessionManager = {
-      getSessionUser: sinon.stub().returns(this.user),
-      getLoggedInUserId: sinon.stub().returns(this.user._id),
-    }
-    this.OwnershipTransferHandler = {
-      promises: {
-        transferOwnership: sinon.stub().resolves(),
-      },
-    }
-    this.TokenAccessHandler = {
-      getRequestToken: sinon.stub().returns('access-token'),
-    }
-
-    this.ProjectAuditLogHandler = {
-      addEntryInBackground: sinon.stub(),
-    }
-
-    this.ProjectGetter = {
-      promises: {
-        getProject: sinon.stub().resolves({ owner_ref: this.user._id }),
-      },
-    }
-
-    this.SplitTestHandler = {
-      promises: {
-        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
-      },
-    }
-
-    this.LimitationsManager = {
-      promises: {
-        canAddXEditCollaborators: sinon.stub().resolves(),
-        canChangeCollaboratorPrivilegeLevel: sinon.stub().resolves(true),
-      },
-    }
-
-    this.CollaboratorsController = await esmock.strict(MODULE_PATH, {
-      'mongodb-legacy': { ObjectId },
-      '../../../../app/src/Features/Collaborators/CollaboratorsHandler.js':
-        this.CollaboratorsHandler,
-      '../../../../app/src/Features/Collaborators/CollaboratorsGetter.js':
-        this.CollaboratorsGetter,
-      '../../../../app/src/Features/Collaborators/OwnershipTransferHandler.js':
-        this.OwnershipTransferHandler,
-      '../../../../app/src/Features/Editor/EditorRealTimeController':
-        this.EditorRealTimeController,
-      '../../../../app/src/Features/Errors/HttpErrorHandler.js':
-        this.HttpErrorHandler,
-      '../../../../app/src/Features/Tags/TagsHandler.js': this.TagsHandler,
-      '../../../../app/src/Features/Authentication/SessionManager.js':
-        this.SessionManager,
-      '../../../../app/src/Features/TokenAccess/TokenAccessHandler.js':
-        this.TokenAccessHandler,
-      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js':
-        this.ProjectAuditLogHandler,
-      '../../../../app/src/Features/Project/ProjectGetter.js':
-        this.ProjectGetter,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler.js':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/Subscription/LimitationsManager.js':
-        this.LimitationsManager,
-    })
-  })
-
-  describe('removeUserFromProject', function () {
-    beforeEach(function (done) {
-      this.req.params = {
-        Project_id: this.projectId,
-        user_id: this.user._id,
-      }
-      this.res.sendStatus = sinon.spy(() => {
-        done()
-      })
-      this.CollaboratorsController.removeUserFromProject(this.req, this.res)
-    })
-
-    it('should from the user from the project', function () {
-      expect(
-        this.CollaboratorsHandler.promises.removeUserFromProject
-      ).to.have.been.calledWith(this.projectId, this.user._id)
-    })
-
-    it('should emit a userRemovedFromProject event to the proejct', function () {
-      expect(this.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
-        this.projectId,
-        'userRemovedFromProject',
-        this.user._id
-      )
-    })
-
-    it('should send the back a success response', function () {
-      this.res.sendStatus.calledWith(204).should.equal(true)
-    })
-
-    it('should have called emitToRoom', function () {
-      expect(this.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
-        this.projectId,
-        'project:membership:changed'
-      )
-    })
-
-    it('should write a project audit log', function () {
-      this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-        this.projectId,
-        'remove-collaborator',
-        this.user._id,
-        this.req.ip,
-        { userId: this.user._id }
-      )
-    })
-  })
-
-  describe('removeSelfFromProject', function () {
-    beforeEach(function (done) {
-      this.req.params = { Project_id: this.projectId }
-      this.res.sendStatus = sinon.spy(() => {
-        done()
-      })
-      this.CollaboratorsController.removeSelfFromProject(this.req, this.res)
-    })
-
-    it('should remove the logged in user from the project', function () {
-      expect(
-        this.CollaboratorsHandler.promises.removeUserFromProject
-      ).to.have.been.calledWith(this.projectId, this.user._id)
-    })
-
-    it('should emit a userRemovedFromProject event to the proejct', function () {
-      expect(this.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
-        this.projectId,
-        'userRemovedFromProject',
-        this.user._id
-      )
-    })
-
-    it('should remove the project from all tags', function () {
-      expect(
-        this.TagsHandler.promises.removeProjectFromAllTags
-      ).to.have.been.calledWith(this.user._id, this.projectId)
-    })
-
-    it('should return a success code', function () {
-      this.res.sendStatus.calledWith(204).should.equal(true)
-    })
-
-    it('should write a project audit log', function () {
-      this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-        this.projectId,
-        'leave-project',
-        this.user._id,
-        this.req.ip
-      )
-    })
-  })
-
-  describe('getAllMembers', function () {
-    beforeEach(function (done) {
-      this.req.params = { Project_id: this.projectId }
-      this.res.json = sinon.spy(() => {
-        done()
-      })
-      this.next = sinon.stub()
-      this.members = [{ a: 1 }]
-      this.CollaboratorsGetter.promises.getAllInvitedMembers.resolves(
-        this.members
-      )
-      this.CollaboratorsController.getAllMembers(this.req, this.res, this.next)
-    })
-
-    it('should not produce an error', function () {
-      this.next.callCount.should.equal(0)
-    })
-
-    it('should produce a json response', function () {
-      this.res.json.callCount.should.equal(1)
-      this.res.json.calledWith({ members: this.members }).should.equal(true)
-    })
-
-    it('should call CollaboratorsGetter.getAllInvitedMembers', function () {
-      expect(this.CollaboratorsGetter.promises.getAllInvitedMembers).to.have
-        .been.calledOnce
-    })
-
-    describe('when CollaboratorsGetter.getAllInvitedMembers produces an error', function () {
-      beforeEach(function (done) {
-        this.res.json = sinon.stub()
-        this.next = sinon.spy(() => {
-          done()
-        })
-        this.CollaboratorsGetter.promises.getAllInvitedMembers.rejects(
-          new Error('woops')
-        )
-        this.CollaboratorsController.getAllMembers(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce an error', function () {
-        expect(this.next).to.have.been.calledOnce
-        expect(this.next).to.have.been.calledWithMatch(
-          sinon.match.instanceOf(Error)
-        )
-      })
-
-      it('should not produce a json response', function () {
-        this.res.json.callCount.should.equal(0)
-      })
-    })
-  })
-
-  describe('setCollaboratorInfo', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.projectId,
-        user_id: this.user._id,
-      }
-      this.req.body = { privilegeLevel: 'readOnly' }
-    })
-
-    it('should set the collaborator privilege level', function (done) {
-      this.res.sendStatus = status => {
-        expect(status).to.equal(204)
-        expect(
-          this.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
-        ).to.have.been.calledWith(this.projectId, this.user._id, 'readOnly')
-        done()
-      }
-      this.CollaboratorsController.setCollaboratorInfo(this.req, this.res)
-    })
-
-    it('should return a 404 when the project or collaborator is not found', function (done) {
-      this.HttpErrorHandler.notFound = sinon.spy((req, res) => {
-        expect(req).to.equal(this.req)
-        expect(res).to.equal(this.res)
-        done()
-      })
-
-      this.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel.rejects(
-        new Errors.NotFoundError()
-      )
-      this.CollaboratorsController.setCollaboratorInfo(this.req, this.res)
-    })
-
-    it('should pass the error to the next handler when setting the privilege level fails', function (done) {
-      this.next = sinon.spy(err => {
-        expect(err).instanceOf(Error)
-        done()
-      })
-
-      this.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel.rejects(
-        new Error()
-      )
-      this.CollaboratorsController.setCollaboratorInfo(
-        this.req,
-        this.res,
-        this.next
-      )
-    })
-
-    describe('when setting privilege level to readAndWrite', function () {
-      beforeEach(function () {
-        this.req.body = { privilegeLevel: 'readAndWrite' }
-      })
-
-      describe('when owner can add new edit collaborators', function () {
-        it('should set privilege level after checking collaborators can be added', function (done) {
-          this.res.sendStatus = status => {
-            expect(status).to.equal(204)
-            expect(
-              this.LimitationsManager.promises
-                .canChangeCollaboratorPrivilegeLevel
-            ).to.have.been.calledWith(
-              this.projectId,
-              this.user._id,
-              'readAndWrite'
-            )
-            done()
-          }
-          this.CollaboratorsController.setCollaboratorInfo(this.req, this.res)
-        })
-      })
-
-      describe('when owner cannot add edit collaborators', function () {
-        beforeEach(function () {
-          this.LimitationsManager.promises.canChangeCollaboratorPrivilegeLevel.resolves(
-            false
-          )
-        })
-
-        it('should return a 403 if trying to set a new edit collaborator', function (done) {
-          this.HttpErrorHandler.forbidden = sinon.spy((req, res) => {
-            expect(req).to.equal(this.req)
-            expect(res).to.equal(this.res)
-            expect(
-              this.LimitationsManager.promises
-                .canChangeCollaboratorPrivilegeLevel
-            ).to.have.been.calledWith(
-              this.projectId,
-              this.user._id,
-              'readAndWrite'
-            )
-            expect(
-              this.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
-            ).to.not.have.been.called
-            done()
-          })
-          this.CollaboratorsController.setCollaboratorInfo(this.req, this.res)
-        })
-      })
-    })
-
-    describe('when setting privilege level to readOnly', function () {
-      beforeEach(function () {
-        this.req.body = { privilegeLevel: 'readOnly' }
-      })
-
-      describe('when owner cannot add edit collaborators', function () {
-        beforeEach(function () {
-          this.LimitationsManager.promises.canAddXEditCollaborators.resolves(
-            false
-          )
-        })
-
-        it('should always allow setting a collaborator to viewer even if user cant add edit collaborators', function (done) {
-          this.res.sendStatus = status => {
-            expect(status).to.equal(204)
-            expect(this.LimitationsManager.promises.canAddXEditCollaborators).to
-              .not.have.been.called
-            expect(
-              this.CollaboratorsHandler.promises.setCollaboratorPrivilegeLevel
-            ).to.have.been.calledWith(this.projectId, this.user._id, 'readOnly')
-            done()
-          }
-          this.CollaboratorsController.setCollaboratorInfo(this.req, this.res)
-        })
-      })
-    })
-  })
-
-  describe('transferOwnership', function () {
-    beforeEach(function () {
-      this.req.body = { user_id: this.user._id.toString() }
-    })
-
-    it('returns 204 on success', function (done) {
-      this.res.sendStatus = status => {
-        expect(status).to.equal(204)
-        done()
-      }
-      this.CollaboratorsController.transferOwnership(this.req, this.res)
-    })
-
-    it('returns 404 if the project does not exist', function (done) {
-      this.HttpErrorHandler.notFound = sinon.spy((req, res, message) => {
-        expect(req).to.equal(this.req)
-        expect(res).to.equal(this.res)
-        expect(message).to.match(/project not found/)
-        done()
-      })
-      this.OwnershipTransferHandler.promises.transferOwnership.rejects(
-        new Errors.ProjectNotFoundError()
-      )
-      this.CollaboratorsController.transferOwnership(this.req, this.res)
-    })
-
-    it('returns 404 if the user does not exist', function (done) {
-      this.HttpErrorHandler.notFound = sinon.spy((req, res, message) => {
-        expect(req).to.equal(this.req)
-        expect(res).to.equal(this.res)
-        expect(message).to.match(/user not found/)
-        done()
-      })
-      this.OwnershipTransferHandler.promises.transferOwnership.rejects(
-        new Errors.UserNotFoundError()
-      )
-      this.CollaboratorsController.transferOwnership(this.req, this.res)
-    })
-
-    it('invokes HTTP forbidden error handler if the user is not a collaborator', function (done) {
-      this.HttpErrorHandler.forbidden = sinon.spy(() => done())
-      this.OwnershipTransferHandler.promises.transferOwnership.rejects(
-        new Errors.UserNotCollaboratorError()
-      )
-      this.CollaboratorsController.transferOwnership(this.req, this.res)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsGetterTests.js b/services/web/test/unit/src/Collaborators/CollaboratorsGetterTests.js
index 7bfbc1c423..10542c4564 100644
--- a/services/web/test/unit/src/Collaborators/CollaboratorsGetterTests.js
+++ b/services/web/test/unit/src/Collaborators/CollaboratorsGetterTests.js
@@ -52,6 +52,7 @@ describe('CollaboratorsGetter', function () {
     this.UserGetter = {
       promises: {
         getUser: sinon.stub().resolves(null),
+        getUsers: sinon.stub().resolves([]),
       },
     }
     this.ProjectMock = sinon.mock(Project)
@@ -61,7 +62,7 @@ describe('CollaboratorsGetter', function () {
       },
     }
     this.ProjectEditorHandler = {
-      buildOwnerAndMembersViews: sinon.stub(),
+      buildUserModelView: sinon.stub(),
     }
     this.CollaboratorsGetter = SandboxedModule.require(MODULE_PATH, {
       requires: {
@@ -203,38 +204,6 @@ describe('CollaboratorsGetter', function () {
     })
   })
 
-  describe('getInvitedMembersWithPrivilegeLevels', function () {
-    beforeEach(function () {
-      this.UserGetter.promises.getUser
-        .withArgs(this.readOnlyRef1.toString())
-        .resolves({ _id: this.readOnlyRef1 })
-      this.UserGetter.promises.getUser
-        .withArgs(this.readOnlyTokenRef.toString())
-        .resolves({ _id: this.readOnlyTokenRef })
-      this.UserGetter.promises.getUser
-        .withArgs(this.readWriteRef2.toString())
-        .resolves({ _id: this.readWriteRef2 })
-      this.UserGetter.promises.getUser
-        .withArgs(this.readWriteTokenRef.toString())
-        .resolves({ _id: this.readWriteTokenRef })
-      this.UserGetter.promises.getUser
-        .withArgs(this.reviewer1Ref.toString())
-        .resolves({ _id: this.reviewer1Ref })
-    })
-
-    it('should return an array of invited members with their privilege levels', async function () {
-      const result =
-        await this.CollaboratorsGetter.promises.getInvitedMembersWithPrivilegeLevels(
-          this.project._id
-        )
-      expect(result).to.have.deep.members([
-        { user: { _id: this.readOnlyRef1 }, privilegeLevel: 'readOnly' },
-        { user: { _id: this.readWriteRef2 }, privilegeLevel: 'readAndWrite' },
-        { user: { _id: this.reviewer1Ref }, privilegeLevel: 'review' },
-      ])
-    })
-  })
-
   describe('getMemberIdPrivilegeLevel', function () {
     it('should return the privilege level if it exists', async function () {
       const level =
@@ -408,24 +377,21 @@ describe('CollaboratorsGetter', function () {
         { user: this.readWriteUser, privilegeLevel: 'readAndWrite' },
         { user: this.reviewUser, privilegeLevel: 'review' },
       ]
-      this.views = {
-        owner: this.owningUser,
-        ownerFeatures: this.owningUser.features,
-        members: [
-          { _id: this.readWriteUser._id, email: this.readWriteUser.email },
-          { _id: this.reviewUser._id, email: this.reviewUser.email },
-        ],
-      }
-      this.UserGetter.promises.getUser
-        .withArgs(this.owningUser._id.toString())
-        .resolves(this.owningUser)
-      this.UserGetter.promises.getUser
-        .withArgs(this.readWriteUser._id.toString())
-        .resolves(this.readWriteUser)
-      this.UserGetter.promises.getUser
-        .withArgs(this.reviewUser._id.toString())
-        .resolves(this.reviewUser)
-      this.ProjectEditorHandler.buildOwnerAndMembersViews.returns(this.views)
+      this.memberViews = [
+        { _id: this.readWriteUser._id, email: this.readWriteUser.email },
+        { _id: this.reviewUser._id, email: this.reviewUser.email },
+      ]
+      this.UserGetter.promises.getUsers.resolves([
+        this.owningUser,
+        this.readWriteUser,
+        this.reviewUser,
+      ])
+      this.ProjectEditorHandler.buildUserModelView
+        .withArgs(this.members[1])
+        .returns(this.memberViews[0])
+      this.ProjectEditorHandler.buildUserModelView
+        .withArgs(this.members[2])
+        .returns(this.memberViews[1])
       this.result =
         await this.CollaboratorsGetter.promises.getAllInvitedMembers(
           this.project._id
@@ -433,15 +399,18 @@ describe('CollaboratorsGetter', function () {
     })
 
     it('should produce a list of members', function () {
-      expect(this.result).to.deep.equal(this.views.members)
+      expect(this.result).to.deep.equal(this.memberViews)
     })
 
-    it('should call ProjectEditorHandler.buildOwnerAndMembersViews', function () {
-      expect(this.ProjectEditorHandler.buildOwnerAndMembersViews).to.have.been
-        .calledOnce
+    it('should call ProjectEditorHandler.buildUserModelView', function () {
+      expect(this.ProjectEditorHandler.buildUserModelView).to.have.been
+        .calledTwice
       expect(
-        this.ProjectEditorHandler.buildOwnerAndMembersViews
-      ).to.have.been.calledWith(this.members)
+        this.ProjectEditorHandler.buildUserModelView
+      ).to.have.been.calledWith(this.members[1])
+      expect(
+        this.ProjectEditorHandler.buildUserModelView
+      ).to.have.been.calledWith(this.members[2])
     })
   })
 
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsHandlerTests.js b/services/web/test/unit/src/Collaborators/CollaboratorsHandlerTests.js
index 7cf9adbb8e..c97e4f2fe8 100644
--- a/services/web/test/unit/src/Collaborators/CollaboratorsHandlerTests.js
+++ b/services/web/test/unit/src/Collaborators/CollaboratorsHandlerTests.js
@@ -24,16 +24,6 @@ describe('CollaboratorsHandler', function () {
       name: 'Foo',
     }
 
-    this.archivedProject = {
-      _id: new ObjectId(),
-      archived: [new ObjectId(this.userId)],
-    }
-
-    this.oldArchivedProject = {
-      _id: new ObjectId(),
-      archived: true,
-    }
-
     this.UserGetter = {
       promises: {
         getUser: sinon.stub().resolves(null),
@@ -59,9 +49,6 @@ describe('CollaboratorsHandler', function () {
       },
     }
 
-    this.ProjectHelper = {
-      calculateArchivedArray: sinon.stub(),
-    }
     this.CollaboratorsGetter = {
       promises: {
         dangerouslyGetAllProjectsUserIsMemberOf: sinon.stub(),
@@ -77,7 +64,6 @@ describe('CollaboratorsHandler', function () {
         '../ThirdPartyDataStore/TpdsProjectFlusher': this.TpdsProjectFlusher,
         '../ThirdPartyDataStore/TpdsUpdateSender': this.TpdsUpdateSender,
         '../Project/ProjectGetter': this.ProjectGetter,
-        '../Project/ProjectHelper': this.ProjectHelper,
         '../Editor/EditorRealTimeController': this.EditorRealTimeController,
         './CollaboratorsGetter': this.CollaboratorsGetter,
       },
@@ -90,40 +76,7 @@ describe('CollaboratorsHandler', function () {
 
   describe('removeUserFromProject', function () {
     describe('a non-archived project', function () {
-      beforeEach(function () {
-        this.ProjectMock.expects('findOne')
-          .withArgs({
-            _id: this.project._id,
-          })
-          .chain('exec')
-          .resolves(this.project)
-      })
-
       it('should remove the user from mongo', async function () {
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.project._id,
-              pendingReviewer_refs: { $type: 'null' },
-            },
-            {
-              $set: { pendingReviewer_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.project._id,
-              readOnly_refs: { $type: 'null' },
-            },
-            {
-              $set: { readOnly_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
         this.ProjectMock.expects('updateOne')
           .withArgs(
             {
@@ -151,135 +104,6 @@ describe('CollaboratorsHandler', function () {
         )
       })
     })
-
-    describe('an archived project, archived with a boolean value', function () {
-      beforeEach(function () {
-        const archived = [new ObjectId(this.userId)]
-        this.ProjectHelper.calculateArchivedArray.returns(archived)
-
-        this.ProjectMock.expects('findOne')
-          .withArgs({
-            _id: this.oldArchivedProject._id,
-          })
-          .chain('exec')
-          .resolves(this.oldArchivedProject)
-      })
-
-      it('should remove the user from mongo', async function () {
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.oldArchivedProject._id,
-              pendingReviewer_refs: { $type: 'null' },
-            },
-            {
-              $set: { pendingReviewer_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.oldArchivedProject._id,
-              readOnly_refs: { $type: 'null' },
-            },
-            {
-              $set: { readOnly_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.oldArchivedProject._id,
-            },
-            {
-              $set: {
-                archived: [],
-              },
-              $pull: {
-                collaberator_refs: this.userId,
-                reviewer_refs: this.userId,
-                readOnly_refs: this.userId,
-                pendingEditor_refs: this.userId,
-                pendingReviewer_refs: this.userId,
-                tokenAccessReadOnly_refs: this.userId,
-                tokenAccessReadAndWrite_refs: this.userId,
-                trashed: this.userId,
-              },
-            }
-          )
-          .resolves()
-        await this.CollaboratorsHandler.promises.removeUserFromProject(
-          this.oldArchivedProject._id,
-          this.userId
-        )
-      })
-    })
-
-    describe('an archived project, archived with an array value', function () {
-      beforeEach(function () {
-        this.ProjectMock.expects('findOne')
-          .withArgs({
-            _id: this.archivedProject._id,
-          })
-          .chain('exec')
-          .resolves(this.archivedProject)
-      })
-
-      it('should remove the user from mongo', async function () {
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.archivedProject._id,
-              pendingReviewer_refs: { $type: 'null' },
-            },
-            {
-              $set: { pendingReviewer_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.archivedProject._id,
-              readOnly_refs: { $type: 'null' },
-            },
-            {
-              $set: { readOnly_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: this.archivedProject._id,
-            },
-            {
-              $pull: {
-                collaberator_refs: this.userId,
-                reviewer_refs: this.userId,
-                readOnly_refs: this.userId,
-                pendingEditor_refs: this.userId,
-                pendingReviewer_refs: this.userId,
-                tokenAccessReadOnly_refs: this.userId,
-                tokenAccessReadAndWrite_refs: this.userId,
-                archived: this.userId,
-                trashed: this.userId,
-              },
-            }
-          )
-          .resolves()
-        await this.CollaboratorsHandler.promises.removeUserFromProject(
-          this.archivedProject._id,
-          this.userId
-        )
-      })
-    })
   })
 
   describe('addUserIdToProject', function () {
@@ -476,6 +300,40 @@ describe('CollaboratorsHandler', function () {
       })
     })
 
+    describe('when user already exists as a reviewer', function () {
+      beforeEach(function () {
+        this.project.collaberator_refs = []
+        this.project.reviewer_refs = [this.userId]
+        this.project.readOnly_refs = []
+      })
+
+      it('should not add the user again', async function () {
+        await this.CollaboratorsHandler.promises.addUserIdToProject(
+          this.project._id,
+          this.addingUserId,
+          this.userId,
+          'readAndWrite'
+        )
+      })
+    })
+
+    describe('when user already exists as a read-only user', function () {
+      beforeEach(function () {
+        this.project.collaberator_refs = []
+        this.project.reviewer_refs = []
+        this.project.readOnly_refs = [this.userId]
+      })
+
+      it('should not add the user again', async function () {
+        await this.CollaboratorsHandler.promises.addUserIdToProject(
+          this.project._id,
+          this.addingUserId,
+          this.userId,
+          'readAndWrite'
+        )
+      })
+    })
+
     describe('with null addingUserId', function () {
       beforeEach(async function () {
         this.project.collaberator_refs = []
@@ -534,37 +392,6 @@ describe('CollaboratorsHandler', function () {
         'token-read-only-1',
       ]
       for (const projectId of expectedProjects) {
-        this.ProjectMock.expects('findOne')
-          .withArgs({
-            _id: projectId,
-          })
-          .chain('exec')
-          .resolves({ _id: projectId })
-
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: projectId,
-              pendingReviewer_refs: { $type: 'null' },
-            },
-            {
-              $set: { pendingReviewer_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
-        this.ProjectMock.expects('updateOne')
-          .withArgs(
-            {
-              _id: projectId,
-              readOnly_refs: { $type: 'null' },
-            },
-            {
-              $set: { readOnly_refs: [] },
-            }
-          )
-          .chain('exec')
-          .resolves()
         this.ProjectMock.expects('updateOne')
           .withArgs(
             {
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsInviteController.test.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsInviteController.test.mjs
new file mode 100644
index 0000000000..aafbb0dbc0
--- /dev/null
+++ b/services/web/test/unit/src/Collaborators/CollaboratorsInviteController.test.mjs
@@ -0,0 +1,1674 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+import mongodb from 'mongodb-legacy'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import _ from 'lodash'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH =
+  '../../../../app/src/Features/Collaborators/CollaboratorsInviteController.mjs'
+
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
+describe('CollaboratorsInviteController', function () {
+  beforeEach(async function (ctx) {
+    ctx.projectId = 'project-id-123'
+    ctx.token = 'some-opaque-token'
+    ctx.tokenHmac = 'some-hmac-token'
+    ctx.targetEmail = 'user@example.com'
+    ctx.privileges = 'readAndWrite'
+    ctx.projectOwner = {
+      _id: 'project-owner-id',
+      email: 'project-owner@example.com',
+    }
+    ctx.currentUser = {
+      _id: 'current-user-id',
+      email: 'current-user@example.com',
+    }
+    ctx.invite = {
+      _id: new ObjectId(),
+      token: ctx.token,
+      tokenHmac: ctx.tokenHmac,
+      sendingUserId: ctx.currentUser._id,
+      projectId: ctx.projectId,
+      email: ctx.targetEmail,
+      privileges: ctx.privileges,
+      createdAt: new Date(),
+    }
+    ctx.inviteReducedData = _.pick(ctx.invite, ['_id', 'email', 'privileges'])
+    ctx.project = {
+      _id: ctx.projectId,
+      owner_ref: ctx.projectOwner._id,
+    }
+
+    ctx.SessionManager = {
+      getSessionUser: sinon.stub().returns(ctx.currentUser),
+    }
+
+    ctx.AnalyticsManger = { recordEventForUserInBackground: sinon.stub() }
+
+    ctx.rateLimiter = {
+      consume: sinon.stub().resolves(),
+    }
+    ctx.RateLimiter = {
+      RateLimiter: sinon.stub().returns(ctx.rateLimiter),
+    }
+
+    ctx.LimitationsManager = {
+      promises: {
+        allowedNumberOfCollaboratorsForUser: sinon.stub(),
+        canAddXEditCollaborators: sinon.stub().resolves(true),
+      },
+    }
+
+    ctx.UserGetter = {
+      promises: {
+        getUserByAnyEmail: sinon.stub(),
+        getUser: sinon.stub(),
+      },
+    }
+
+    ctx.ProjectGetter = {
+      promises: {
+        getProject: sinon.stub(),
+      },
+    }
+
+    ctx.CollaboratorsGetter = {
+      promises: {
+        isUserInvitedMemberOfProject: sinon.stub(),
+      },
+    }
+
+    ctx.CollaboratorsInviteHandler = {
+      promises: {
+        inviteToProject: sinon.stub().resolves(ctx.inviteReducedData),
+        generateNewInvite: sinon.stub().resolves(ctx.invite),
+        revokeInvite: sinon.stub().resolves(ctx.invite),
+        acceptInvite: sinon.stub(),
+      },
+    }
+
+    ctx.CollaboratorsInviteGetter = {
+      promises: {
+        getAllInvites: sinon.stub(),
+        getInviteByToken: sinon.stub().resolves(ctx.invite),
+      },
+    }
+
+    ctx.EditorRealTimeController = {
+      emitToRoom: sinon.stub(),
+    }
+
+    ctx.settings = {}
+
+    ctx.ProjectAuditLogHandler = {
+      promises: {
+        addEntry: sinon.stub().resolves(),
+      },
+      addEntryInBackground: sinon.stub(),
+    }
+
+    ctx.AuthenticationController = {
+      setRedirectInSession: sinon.stub(),
+    }
+
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().resolves({ variant: 'default' }),
+        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
+      },
+    }
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter.js', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js',
+      () => ({
+        default: ctx.ProjectAuditLogHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/LimitationsManager.js',
+      () => ({
+        default: ctx.LimitationsManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter.js', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsGetter.js',
+      () => ({
+        default: ctx.CollaboratorsGetter,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler.mjs',
+      () => ({
+        default: ctx.CollaboratorsInviteHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsInviteGetter.js',
+      () => ({
+        default: ctx.CollaboratorsInviteGetter,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController.js',
+      () => ({
+        default: ctx.EditorRealTimeController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager.js',
+      () => ({
+        default: ctx.AnalyticsManger,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager.js',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/infrastructure/RateLimiter',
+      () => ctx.RateLimiter
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: ctx.AuthenticationController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    ctx.CollaboratorsInviteController = (await import(MODULE_PATH)).default
+
+    ctx.res = new MockResponse()
+    ctx.req = new MockRequest()
+    ctx.next = sinon.stub()
+  })
+
+  describe('getAllInvites', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeInvites = [
+        { _id: new ObjectId(), one: 1 },
+        { _id: new ObjectId(), two: 2 },
+      ]
+      ctx.req.params = { Project_id: ctx.projectId }
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
+            ctx.fakeInvites
+          )
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.getAllInvites(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should not produce an error', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should produce a list of invite objects', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        ctx.res.json.calledWith({ invites: ctx.fakeInvites }).should.equal(true)
+      })
+
+      it('should have called CollaboratorsInviteHandler.getAllInvites', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getAllInvites.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteGetter.promises.getAllInvites
+          .calledWith(ctx.projectId)
+          .should.equal(true)
+      })
+    })
+
+    describe('when CollaboratorsInviteHandler.getAllInvites produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteGetter.promises.getAllInvites.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.getAllInvites(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should produce an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.firstCall.args[0].should.be.instanceof(Error)
+      })
+    })
+  })
+
+  describe('inviteToProject', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = { Project_id: ctx.projectId }
+      ctx.req.body = {
+        email: ctx.targetEmail,
+        privileges: ctx.privileges,
+      }
+      ctx.ProjectGetter.promises.getProject.resolves({
+        owner_ref: ctx.project.owner_ref,
+      })
+    })
+
+    describe('when all goes well', function (done) {
+      beforeEach(async function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+          .stub()
+          .resolves(true)
+        ctx.CollaboratorsInviteController._checkRateLimit = sinon
+          .stub()
+          .resolves(true)
+
+        await ctx.CollaboratorsInviteController.inviteToProject(
+          ctx.req,
+          ctx.res
+        )
+      })
+
+      it('should produce json response', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json.firstCall.args[0]).to.deep.equal({
+          invite: ctx.inviteReducedData,
+        })
+      })
+
+      it('should have called canAddXEditCollaborators', function (ctx) {
+        ctx.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
+          1
+        )
+        ctx.LimitationsManager.promises.canAddXEditCollaborators
+          .calledWith(ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should have called _checkShouldInviteEmail', function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+          1
+        )
+
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail
+          .calledWith(ctx.targetEmail)
+          .should.equal(true)
+      })
+
+      it('should have called inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject
+          .calledWith(
+            ctx.projectId,
+            ctx.currentUser,
+            ctx.targetEmail,
+            ctx.privileges
+          )
+          .should.equal(true)
+      })
+
+      it('should have called emitToRoom', function (ctx) {
+        ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+        ctx.EditorRealTimeController.emitToRoom
+          .calledWith(ctx.projectId, 'project:membership:changed')
+          .should.equal(true)
+      })
+
+      it('adds a project audit log entry', function (ctx) {
+        ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+          ctx.projectId,
+          'send-invite',
+          ctx.currentUser._id,
+          ctx.req.ip,
+          {
+            inviteId: ctx.invite._id,
+            privileges: ctx.privileges,
+          }
+        )
+      })
+    })
+
+    describe('when the user is not allowed to add more edit collaborators', function () {
+      beforeEach(function (ctx) {
+        ctx.LimitationsManager.promises.canAddXEditCollaborators.resolves(false)
+      })
+
+      describe('readAndWrite collaborator', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.privileges = 'readAndWrite'
+            ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+              .stub()
+              .resolves(true)
+            ctx.CollaboratorsInviteController._checkRateLimit = sinon
+              .stub()
+              .resolves(true)
+            ctx.res.callback = () => resolve()
+            ctx.CollaboratorsInviteController.inviteToProject(
+              ctx.req,
+              ctx.res,
+              ctx.next
+            )
+          })
+        })
+
+        it('should produce json response without an invite', function (ctx) {
+          ctx.res.json.callCount.should.equal(1)
+          expect(ctx.res.json.firstCall.args[0]).to.deep.equal({
+            invite: null,
+          })
+        })
+
+        it('should not have called _checkShouldInviteEmail', function (ctx) {
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+            0
+          )
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail
+            .calledWith(ctx.currentUser, ctx.targetEmail)
+            .should.equal(false)
+        })
+
+        it('should not have called inviteToProject', function (ctx) {
+          ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+            0
+          )
+        })
+      })
+
+      describe('readOnly collaborator (always allowed)', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.req.body = {
+              email: ctx.targetEmail,
+              privileges: (ctx.privileges = 'readOnly'),
+            }
+            ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+              .stub()
+              .resolves(true)
+            ctx.CollaboratorsInviteController._checkRateLimit = sinon
+              .stub()
+              .resolves(true)
+            ctx.res.callback = () => resolve()
+            ctx.CollaboratorsInviteController.inviteToProject(
+              ctx.req,
+              ctx.res,
+              ctx.next
+            )
+          })
+        })
+
+        it('should produce json response', function (ctx) {
+          ctx.res.json.callCount.should.equal(1)
+          expect(ctx.res.json.firstCall.args[0]).to.deep.equal({
+            invite: ctx.inviteReducedData,
+          })
+        })
+
+        it('should not have called canAddXEditCollaborators', function (ctx) {
+          ctx.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
+            0
+          )
+        })
+
+        it('should have called _checkShouldInviteEmail', function (ctx) {
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+            1
+          )
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail
+            .calledWith(ctx.targetEmail)
+            .should.equal(true)
+        })
+
+        it('should have called inviteToProject', function (ctx) {
+          ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+            1
+          )
+          ctx.CollaboratorsInviteHandler.promises.inviteToProject
+            .calledWith(
+              ctx.projectId,
+              ctx.currentUser,
+              ctx.targetEmail,
+              ctx.privileges
+            )
+            .should.equal(true)
+        })
+
+        it('should have called emitToRoom', function (ctx) {
+          ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+          ctx.EditorRealTimeController.emitToRoom
+            .calledWith(ctx.projectId, 'project:membership:changed')
+            .should.equal(true)
+        })
+
+        it('adds a project audit log entry', function (ctx) {
+          ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+            ctx.projectId,
+            'send-invite',
+            ctx.currentUser._id,
+            ctx.req.ip,
+            {
+              inviteId: ctx.invite._id,
+              privileges: ctx.privileges,
+            }
+          )
+        })
+      })
+    })
+
+    describe('when inviteToProject produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+            .stub()
+            .resolves(true)
+          ctx.CollaboratorsInviteController._checkRateLimit = sinon
+            .stub()
+            .resolves(true)
+          ctx.CollaboratorsInviteHandler.promises.inviteToProject.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.inviteToProject(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next).to.have.been.calledWith(sinon.match.instanceOf(Error))
+      })
+
+      it('should have called canAddXEditCollaborators', function (ctx) {
+        ctx.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
+          1
+        )
+        ctx.LimitationsManager.promises.canAddXEditCollaborators
+          .calledWith(ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should have called _checkShouldInviteEmail', function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail
+          .calledWith(ctx.targetEmail)
+          .should.equal(true)
+      })
+
+      it('should have called inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject
+          .calledWith(
+            ctx.projectId,
+            ctx.currentUser,
+            ctx.targetEmail,
+            ctx.privileges
+          )
+          .should.equal(true)
+      })
+    })
+
+    describe('when _checkShouldInviteEmail disallows the invite', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+            .stub()
+            .resolves(false)
+          ctx.CollaboratorsInviteController._checkRateLimit = sinon
+            .stub()
+            .resolves(true)
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.inviteToProject(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should produce json response with no invite, and an error property', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json.firstCall.args[0]).to.deep.equal({
+          invite: null,
+          error: 'cannot_invite_non_user',
+        })
+      })
+
+      it('should have called _checkShouldInviteEmail', function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail
+          .calledWith(ctx.targetEmail)
+          .should.equal(true)
+      })
+
+      it('should not have called inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when _checkShouldInviteEmail produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+            .stub()
+            .rejects(new Error('woops'))
+          ctx.CollaboratorsInviteController._checkRateLimit = sinon
+            .stub()
+            .resolves(true)
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.inviteToProject(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
+      })
+
+      it('should have called _checkShouldInviteEmail', function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail
+          .calledWith(ctx.targetEmail)
+          .should.equal(true)
+      })
+
+      it('should not have called inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when the user invites themselves to the project', function () {
+      beforeEach(function (ctx) {
+        ctx.req.body.email = ctx.currentUser.email
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+          .stub()
+          .resolves(true)
+        ctx.CollaboratorsInviteController._checkRateLimit = sinon
+          .stub()
+          .resolves(true)
+        ctx.CollaboratorsInviteController.inviteToProject(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should reject action, return json response with error code', function (ctx) {
+        ctx.res.json.callCount.should.equal(1)
+        expect(ctx.res.json.firstCall.args[0]).to.deep.equal({
+          invite: null,
+          error: 'cannot_invite_self',
+        })
+      })
+
+      it('should not have called canAddXEditCollaborators', function (ctx) {
+        ctx.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
+          0
+        )
+      })
+
+      it('should not have called _checkShouldInviteEmail', function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
+          0
+        )
+      })
+
+      it('should not have called inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          0
+        )
+      })
+
+      it('should not have called emitToRoom', function (ctx) {
+        ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
+      })
+    })
+
+    describe('when _checkRateLimit returns false', function () {
+      beforeEach(async function (ctx) {
+        ctx.CollaboratorsInviteController._checkShouldInviteEmail = sinon
+          .stub()
+          .resolves(true)
+        ctx.CollaboratorsInviteController._checkRateLimit = sinon
+          .stub()
+          .resolves(false)
+        await ctx.CollaboratorsInviteController.inviteToProject(
+          ctx.req,
+          ctx.res,
+          ctx.next
+        )
+      })
+
+      it('should send a 429 response', function (ctx) {
+        ctx.res.sendStatus.calledWith(429).should.equal(true)
+      })
+
+      it('should not call inviteToProject', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.called.should.equal(
+          false
+        )
+      })
+
+      it('should not call emitToRoom', function (ctx) {
+        ctx.EditorRealTimeController.emitToRoom.called.should.equal(false)
+      })
+    })
+  })
+
+  describe('viewInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.projectId,
+        token: ctx.token,
+      }
+      ctx.fakeProject = {
+        _id: ctx.projectId,
+        name: 'some project',
+        owner_ref: ctx.invite.sendingUserId,
+        collaberator_refs: [],
+        readOnly_refs: [],
+      }
+      ctx.owner = {
+        _id: ctx.fakeProject.owner_ref,
+        first_name: 'John',
+        last_name: 'Doe',
+        email: 'john@example.com',
+      }
+
+      ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
+        false
+      )
+      ctx.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(
+        ctx.invite
+      )
+      ctx.ProjectGetter.promises.getProject.resolves(ctx.fakeProject)
+      ctx.UserGetter.promises.getUser.resolves(ctx.owner)
+    })
+
+    describe('when the token is valid', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should render the view template', function (ctx) {
+        ctx.res.render.callCount.should.equal(1)
+        ctx.res.render.calledWith('project/invite/show').should.equal(true)
+      })
+
+      it('should not call next', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken
+          .calledWith(ctx.fakeProject._id, ctx.invite.token)
+          .should.equal(true)
+      })
+
+      it('should call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUser
+          .calledWith({ _id: ctx.fakeProject.owner_ref })
+          .should.equal(true)
+      })
+
+      it('should call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(1)
+        ctx.ProjectGetter.promises.getProject
+          .calledWith(ctx.projectId)
+          .should.equal(true)
+      })
+    })
+
+    describe('when not logged in', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.SessionManager.getSessionUser.returns(null)
+
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+      it('should not check member status', function (ctx) {
+        expect(ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject).to
+          .not.have.been.called
+      })
+
+      it('should set redirect back to invite', function (ctx) {
+        expect(
+          ctx.AuthenticationController.setRedirectInSession
+        ).to.have.been.calledWith(ctx.req)
+      })
+
+      it('should redirect to the register page', function (ctx) {
+        expect(ctx.res.render).to.not.have.been.called
+        expect(ctx.res.redirect).to.have.been.calledOnce
+        expect(ctx.res.redirect).to.have.been.calledWith('/register')
+      })
+    })
+
+    describe('when user is already a member of the project', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
+            true
+          )
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should redirect to the project page', function (ctx) {
+        ctx.res.redirect.callCount.should.equal(1)
+        ctx.res.redirect
+          .calledWith(`/project/${ctx.projectId}`)
+          .should.equal(true)
+      })
+
+      it('should not call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should not call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          0
+        )
+      })
+
+      it('should not call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(0)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when isUserInvitedMemberOfProject produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should call next with an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.firstCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should not call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          0
+        )
+      })
+
+      it('should not call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(0)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when the getInviteByToken produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteGetter.promises.getInviteByToken.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should call next with the error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should not call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(0)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when the getInviteByToken does not produce an invite', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(null)
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should render the not-valid view template', function (ctx) {
+        ctx.res.render.callCount.should.equal(1)
+        ctx.res.render.calledWith('project/invite/not-valid').should.equal(true)
+      })
+
+      it('should not call next', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should not call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(0)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when User.getUser produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.UserGetter.promises.getUser.rejects(new Error('woops'))
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should produce an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.firstCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+      })
+
+      it('should call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUser
+          .calledWith({ _id: ctx.fakeProject.owner_ref })
+          .should.equal(true)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when User.getUser does not find a user', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.UserGetter.promises.getUser.resolves(null)
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should render the not-valid view template', function (ctx) {
+        ctx.res.render.callCount.should.equal(1)
+        ctx.res.render.calledWith('project/invite/not-valid').should.equal(true)
+      })
+
+      it('should not call next', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+      })
+
+      it('should call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUser
+          .calledWith({ _id: ctx.fakeProject.owner_ref })
+          .should.equal(true)
+      })
+
+      it('should not call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+    })
+
+    describe('when getProject produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectGetter.promises.getProject.rejects(new Error('woops'))
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should produce an error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        expect(ctx.next.firstCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+      })
+
+      it('should call User.getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUser
+          .calledWith({ _id: ctx.fakeProject.owner_ref })
+          .should.equal(true)
+      })
+
+      it('should call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(1)
+      })
+    })
+
+    describe('when Project.getUser does not find a user', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectGetter.promises.getProject.resolves(null)
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.viewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should render the not-valid view template', function (ctx) {
+        ctx.res.render.callCount.should.equal(1)
+        ctx.res.render.calledWith('project/invite/not-valid').should.equal(true)
+      })
+
+      it('should not call next', function (ctx) {
+        ctx.next.callCount.should.equal(0)
+      })
+
+      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function (ctx) {
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
+          .calledWith(ctx.currentUser._id, ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should call getInviteByToken', function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
+          1
+        )
+      })
+
+      it('should call getUser', function (ctx) {
+        ctx.UserGetter.promises.getUser.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUser
+          .calledWith({ _id: ctx.fakeProject.owner_ref })
+          .should.equal(true)
+      })
+
+      it('should call ProjectGetter.getProject', function (ctx) {
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(1)
+      })
+    })
+  })
+
+  describe('generateNewInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.projectId,
+        invite_id: ctx.invite._id.toString(),
+      }
+      ctx.CollaboratorsInviteController._checkRateLimit = sinon
+        .stub()
+        .resolves(true)
+    })
+
+    describe('when generateNewInvite does not produce an error', function () {
+      describe('and returns an invite object', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.callback = () => resolve()
+            ctx.CollaboratorsInviteController.generateNewInvite(
+              ctx.req,
+              ctx.res,
+              ctx.next
+            )
+          })
+        })
+
+        it('should produce a 201 response', function (ctx) {
+          ctx.res.sendStatus.callCount.should.equal(1)
+          ctx.res.sendStatus.calledWith(201).should.equal(true)
+        })
+
+        it('should have called generateNewInvite', function (ctx) {
+          ctx.CollaboratorsInviteHandler.promises.generateNewInvite.callCount.should.equal(
+            1
+          )
+        })
+
+        it('should have called emitToRoom', function (ctx) {
+          ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+          ctx.EditorRealTimeController.emitToRoom
+            .calledWith(ctx.projectId, 'project:membership:changed')
+            .should.equal(true)
+        })
+
+        it('should check the rate limit', function (ctx) {
+          ctx.CollaboratorsInviteController._checkRateLimit.callCount.should.equal(
+            1
+          )
+        })
+
+        it('should add a project audit log entry', function (ctx) {
+          ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+            ctx.projectId,
+            'resend-invite',
+            ctx.currentUser._id,
+            ctx.req.ip,
+            {
+              inviteId: ctx.invite._id,
+              privileges: ctx.privileges,
+            }
+          )
+        })
+      })
+
+      describe('and returns a null invite', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.CollaboratorsInviteHandler.promises.generateNewInvite.resolves(
+              null
+            )
+            ctx.res.callback = () => resolve()
+            ctx.CollaboratorsInviteController.generateNewInvite(
+              ctx.req,
+              ctx.res,
+              ctx.next
+            )
+          })
+        })
+
+        it('should have called emitToRoom', function (ctx) {
+          ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+          ctx.EditorRealTimeController.emitToRoom
+            .calledWith(ctx.projectId, 'project:membership:changed')
+            .should.equal(true)
+        })
+
+        it('should produce a 404 response when invite is null', function (ctx) {
+          ctx.res.sendStatus.callCount.should.equal(1)
+          ctx.res.sendStatus.should.have.been.calledWith(404)
+        })
+      })
+    })
+
+    describe('when generateNewInvite produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteHandler.promises.generateNewInvite.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.generateNewInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should not produce a 201 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(0)
+      })
+
+      it('should call next with the error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
+      })
+
+      it('should have called generateNewInvite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.generateNewInvite.callCount.should.equal(
+          1
+        )
+      })
+    })
+  })
+
+  describe('revokeInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.projectId,
+        invite_id: ctx.invite._id.toString(),
+      }
+    })
+
+    describe('when revokeInvite does not produce an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.revokeInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should produce a 204 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(1)
+        ctx.res.sendStatus.should.have.been.calledWith(204)
+      })
+
+      it('should have called revokeInvite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
+          1
+        )
+      })
+
+      it('should have called emitToRoom', function (ctx) {
+        ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+        ctx.EditorRealTimeController.emitToRoom
+          .calledWith(ctx.projectId, 'project:membership:changed')
+          .should.equal(true)
+      })
+
+      it('should add a project audit log entry', function (ctx) {
+        ctx.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
+          ctx.projectId,
+          'revoke-invite',
+          ctx.currentUser._id,
+          ctx.req.ip,
+          {
+            inviteId: ctx.invite._id,
+            privileges: ctx.privileges,
+          }
+        )
+      })
+    })
+
+    describe('when revokeInvite produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteHandler.promises.revokeInvite.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.revokeInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should not produce a 201 response', function (ctx) {
+        ctx.res.sendStatus.callCount.should.equal(0)
+      })
+
+      it('should call next with the error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
+      })
+
+      it('should have called revokeInvite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
+          1
+        )
+      })
+    })
+  })
+
+  describe('acceptInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.projectId,
+        token: ctx.token,
+      }
+    })
+
+    describe('when acceptInvite does not produce an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.callback = () => resolve()
+          ctx.CollaboratorsInviteController.acceptInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should redirect to project page', function (ctx) {
+        ctx.res.redirect.should.have.been.calledOnce
+        ctx.res.redirect.should.have.been.calledWith(
+          `/project/${ctx.projectId}`
+        )
+      })
+
+      it('should have called acceptInvite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.acceptInvite.should.have.been.calledWith(
+          ctx.invite,
+          ctx.projectId,
+          ctx.currentUser
+        )
+      })
+
+      it('should have called emitToRoom', function (ctx) {
+        ctx.EditorRealTimeController.emitToRoom.should.have.been.calledOnce
+        ctx.EditorRealTimeController.emitToRoom.should.have.been.calledWith(
+          ctx.projectId,
+          'project:membership:changed'
+        )
+      })
+
+      it('should add a project audit log entry', function (ctx) {
+        ctx.ProjectAuditLogHandler.promises.addEntry.should.have.been.calledWith(
+          ctx.projectId,
+          'accept-invite',
+          ctx.currentUser._id,
+          ctx.req.ip,
+          {
+            inviteId: ctx.invite._id,
+            privileges: ctx.privileges,
+          }
+        )
+      })
+    })
+
+    describe('when the invite is not found', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(null)
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.acceptInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('throws a NotFoundError', function (ctx) {
+        expect(ctx.next).to.have.been.calledWith(
+          sinon.match.instanceOf(Errors.NotFoundError)
+        )
+      })
+    })
+
+    describe('when acceptInvite produces an error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.CollaboratorsInviteHandler.promises.acceptInvite.rejects(
+            new Error('woops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.acceptInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should not redirect to project page', function (ctx) {
+        ctx.res.redirect.callCount.should.equal(0)
+      })
+
+      it('should call next with the error', function (ctx) {
+        ctx.next.callCount.should.equal(1)
+        ctx.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
+      })
+
+      it('should have called acceptInvite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.acceptInvite.callCount.should.equal(
+          1
+        )
+      })
+    })
+
+    describe('when the project audit log entry fails', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectAuditLogHandler.promises.addEntry.rejects(
+            new Error('oops')
+          )
+          ctx.next.callsFake(() => resolve())
+          ctx.CollaboratorsInviteController.acceptInvite(
+            ctx.req,
+            ctx.res,
+            ctx.next
+          )
+        })
+      })
+
+      it('should not accept the invite', function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.acceptInvite.should.not.have
+          .been.called
+      })
+    })
+  })
+
+  describe('_checkShouldInviteEmail', function () {
+    beforeEach(function (ctx) {
+      ctx.email = 'user@example.com'
+    })
+
+    describe('when we should be restricting to existing accounts', function () {
+      beforeEach(function (ctx) {
+        ctx.settings.restrictInvitesToExistingAccounts = true
+        ctx.call = () =>
+          ctx.CollaboratorsInviteController._checkShouldInviteEmail(ctx.email)
+      })
+
+      describe('when user account is present', function () {
+        beforeEach(function (ctx) {
+          ctx.user = { _id: new ObjectId().toString() }
+          ctx.UserGetter.promises.getUserByAnyEmail.resolves(ctx.user)
+        })
+
+        it('should callback with `true`', async function (ctx) {
+          const shouldAllow =
+            await ctx.CollaboratorsInviteController._checkShouldInviteEmail(
+              ctx.email
+            )
+          expect(shouldAllow).to.equal(true)
+        })
+      })
+
+      describe('when user account is absent', function () {
+        beforeEach(function (ctx) {
+          ctx.user = null
+          ctx.UserGetter.promises.getUserByAnyEmail.resolves(ctx.user)
+        })
+
+        it('should callback with `false`', async function (ctx) {
+          const shouldAllow =
+            await ctx.CollaboratorsInviteController._checkShouldInviteEmail(
+              ctx.email
+            )
+          expect(shouldAllow).to.equal(false)
+        })
+
+        it('should have called getUser', async function (ctx) {
+          await ctx.CollaboratorsInviteController._checkShouldInviteEmail(
+            ctx.email
+          )
+          ctx.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
+          ctx.UserGetter.promises.getUserByAnyEmail
+            .calledWith(ctx.email, { _id: 1 })
+            .should.equal(true)
+        })
+      })
+
+      describe('when getUser produces an error', function () {
+        beforeEach(function (ctx) {
+          ctx.user = null
+          ctx.UserGetter.promises.getUserByAnyEmail.rejects(new Error('woops'))
+        })
+
+        it('should callback with an error', async function (ctx) {
+          await expect(
+            ctx.CollaboratorsInviteController._checkShouldInviteEmail(ctx.email)
+          ).to.be.rejected
+        })
+      })
+    })
+  })
+
+  describe('_checkRateLimit', function () {
+    beforeEach(function (ctx) {
+      ctx.settings.restrictInvitesToExistingAccounts = false
+      ctx.currentUserId = '32312313'
+      ctx.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
+        .withArgs(ctx.currentUserId)
+        .resolves(17)
+    })
+
+    it('should callback with `true` when rate limit under', async function (ctx) {
+      const result = await ctx.CollaboratorsInviteController._checkRateLimit(
+        ctx.currentUserId
+      )
+      expect(ctx.rateLimiter.consume).to.have.been.calledWith(ctx.currentUserId)
+      result.should.equal(true)
+    })
+
+    it('should callback with `false` when rate limit hit', async function (ctx) {
+      ctx.rateLimiter.consume.rejects({ remainingPoints: 0 })
+      const result = await ctx.CollaboratorsInviteController._checkRateLimit(
+        ctx.currentUserId
+      )
+      expect(ctx.rateLimiter.consume).to.have.been.calledWith(ctx.currentUserId)
+      result.should.equal(false)
+    })
+
+    it('should allow 10x the collaborators', async function (ctx) {
+      await ctx.CollaboratorsInviteController._checkRateLimit(ctx.currentUserId)
+      expect(ctx.rateLimiter.consume).to.have.been.calledWith(
+        ctx.currentUserId,
+        Math.floor(40000 / 170)
+      )
+    })
+
+    it('should allow 200 requests when collaborators is -1', async function (ctx) {
+      ctx.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
+        .withArgs(ctx.currentUserId)
+        .resolves(-1)
+      await ctx.CollaboratorsInviteController._checkRateLimit(ctx.currentUserId)
+      expect(ctx.rateLimiter.consume).to.have.been.calledWith(
+        ctx.currentUserId,
+        Math.floor(40000 / 200)
+      )
+    })
+
+    it('should allow 10 requests when user has no collaborators set', async function (ctx) {
+      ctx.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
+        .withArgs(ctx.currentUserId)
+        .resolves(null)
+      await ctx.CollaboratorsInviteController._checkRateLimit(ctx.currentUserId)
+      expect(ctx.rateLimiter.consume).to.have.been.calledWith(
+        ctx.currentUserId,
+        Math.floor(40000 / 10)
+      )
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsInviteControllerTests.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsInviteControllerTests.mjs
deleted file mode 100644
index 53f49d0eb2..0000000000
--- a/services/web/test/unit/src/Collaborators/CollaboratorsInviteControllerTests.mjs
+++ /dev/null
@@ -1,1577 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import mongodb from 'mongodb-legacy'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-import _ from 'lodash'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH =
-  '../../../../app/src/Features/Collaborators/CollaboratorsInviteController.mjs'
-
-describe('CollaboratorsInviteController', function () {
-  beforeEach(async function () {
-    this.projectId = 'project-id-123'
-    this.token = 'some-opaque-token'
-    this.tokenHmac = 'some-hmac-token'
-    this.targetEmail = 'user@example.com'
-    this.privileges = 'readAndWrite'
-    this.projectOwner = {
-      _id: 'project-owner-id',
-      email: 'project-owner@example.com',
-    }
-    this.currentUser = {
-      _id: 'current-user-id',
-      email: 'current-user@example.com',
-    }
-    this.invite = {
-      _id: new ObjectId(),
-      token: this.token,
-      tokenHmac: this.tokenHmac,
-      sendingUserId: this.currentUser._id,
-      projectId: this.projectId,
-      email: this.targetEmail,
-      privileges: this.privileges,
-      createdAt: new Date(),
-    }
-    this.inviteReducedData = _.pick(this.invite, ['_id', 'email', 'privileges'])
-    this.project = {
-      _id: this.projectId,
-      owner_ref: this.projectOwner._id,
-    }
-
-    this.SessionManager = {
-      getSessionUser: sinon.stub().returns(this.currentUser),
-    }
-
-    this.AnalyticsManger = { recordEventForUserInBackground: sinon.stub() }
-
-    this.rateLimiter = {
-      consume: sinon.stub().resolves(),
-    }
-    this.RateLimiter = {
-      RateLimiter: sinon.stub().returns(this.rateLimiter),
-    }
-
-    this.LimitationsManager = {
-      promises: {
-        allowedNumberOfCollaboratorsForUser: sinon.stub(),
-        canAddXEditCollaborators: sinon.stub().resolves(true),
-      },
-    }
-
-    this.UserGetter = {
-      promises: {
-        getUserByAnyEmail: sinon.stub(),
-        getUser: sinon.stub(),
-      },
-    }
-
-    this.ProjectGetter = {
-      promises: {
-        getProject: sinon.stub(),
-      },
-    }
-
-    this.CollaboratorsGetter = {
-      promises: {
-        isUserInvitedMemberOfProject: sinon.stub(),
-      },
-    }
-
-    this.CollaboratorsInviteHandler = {
-      promises: {
-        inviteToProject: sinon.stub().resolves(this.inviteReducedData),
-        generateNewInvite: sinon.stub().resolves(this.invite),
-        revokeInvite: sinon.stub().resolves(this.invite),
-        acceptInvite: sinon.stub(),
-      },
-    }
-
-    this.CollaboratorsInviteGetter = {
-      promises: {
-        getAllInvites: sinon.stub(),
-        getInviteByToken: sinon.stub().resolves(this.invite),
-      },
-    }
-
-    this.EditorRealTimeController = {
-      emitToRoom: sinon.stub(),
-    }
-
-    this.settings = {}
-
-    this.ProjectAuditLogHandler = {
-      promises: {
-        addEntry: sinon.stub().resolves(),
-      },
-      addEntryInBackground: sinon.stub(),
-    }
-
-    this.AuthenticationController = {
-      setRedirectInSession: sinon.stub(),
-    }
-
-    this.SplitTestHandler = {
-      promises: {
-        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
-      },
-    }
-
-    this.CollaboratorsInviteController = await esmock.strict(MODULE_PATH, {
-      '../../../../app/src/Features/Project/ProjectGetter.js':
-        this.ProjectGetter,
-      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js':
-        this.ProjectAuditLogHandler,
-      '../../../../app/src/Features/Subscription/LimitationsManager.js':
-        this.LimitationsManager,
-      '../../../../app/src/Features/User/UserGetter.js': this.UserGetter,
-      '../../../../app/src/Features/Collaborators/CollaboratorsGetter.js':
-        this.CollaboratorsGetter,
-      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler.mjs':
-        this.CollaboratorsInviteHandler,
-      '../../../../app/src/Features/Collaborators/CollaboratorsInviteGetter.js':
-        this.CollaboratorsInviteGetter,
-      '../../../../app/src/Features/Editor/EditorRealTimeController.js':
-        this.EditorRealTimeController,
-      '../../../../app/src/Features/Analytics/AnalyticsManager.js':
-        this.AnalyticsManger,
-      '../../../../app/src/Features/Authentication/SessionManager.js':
-        this.SessionManager,
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/infrastructure/RateLimiter': this.RateLimiter,
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        this.AuthenticationController,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-    })
-
-    this.res = new MockResponse()
-    this.req = new MockRequest()
-    this.next = sinon.stub()
-  })
-
-  describe('getAllInvites', function () {
-    beforeEach(function () {
-      this.fakeInvites = [
-        { _id: new ObjectId(), one: 1 },
-        { _id: new ObjectId(), two: 2 },
-      ]
-      this.req.params = { Project_id: this.projectId }
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
-          this.fakeInvites
-        )
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.getAllInvites(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should not produce an error', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should produce a list of invite objects', function () {
-        this.res.json.callCount.should.equal(1)
-        this.res.json
-          .calledWith({ invites: this.fakeInvites })
-          .should.equal(true)
-      })
-
-      it('should have called CollaboratorsInviteHandler.getAllInvites', function () {
-        this.CollaboratorsInviteGetter.promises.getAllInvites.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteGetter.promises.getAllInvites
-          .calledWith(this.projectId)
-          .should.equal(true)
-      })
-    })
-
-    describe('when CollaboratorsInviteHandler.getAllInvites produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteGetter.promises.getAllInvites.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.getAllInvites(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce an error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.firstCall.args[0].should.be.instanceof(Error)
-      })
-    })
-  })
-
-  describe('inviteToProject', function () {
-    beforeEach(function () {
-      this.req.params = { Project_id: this.projectId }
-      this.req.body = {
-        email: this.targetEmail,
-        privileges: this.privileges,
-      }
-      this.ProjectGetter.promises.getProject.resolves({
-        owner_ref: this.project.owner_ref,
-      })
-    })
-
-    describe('when all goes well', function (done) {
-      beforeEach(async function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(true)
-
-        await this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res
-        )
-      })
-
-      it('should produce json response', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json.firstCall.args[0]).to.deep.equal({
-          invite: this.inviteReducedData,
-        })
-      })
-
-      it('should have called canAddXEditCollaborators', function () {
-        this.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
-          1
-        )
-        this.LimitationsManager.promises.canAddXEditCollaborators
-          .calledWith(this.projectId)
-          .should.equal(true)
-      })
-
-      it('should have called _checkShouldInviteEmail', function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-          1
-        )
-
-        this.CollaboratorsInviteController._checkShouldInviteEmail
-          .calledWith(this.targetEmail)
-          .should.equal(true)
-      })
-
-      it('should have called inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises.inviteToProject
-          .calledWith(
-            this.projectId,
-            this.currentUser,
-            this.targetEmail,
-            this.privileges
-          )
-          .should.equal(true)
-      })
-
-      it('should have called emitToRoom', function () {
-        this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-        this.EditorRealTimeController.emitToRoom
-          .calledWith(this.projectId, 'project:membership:changed')
-          .should.equal(true)
-      })
-
-      it('adds a project audit log entry', function () {
-        this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-          this.projectId,
-          'send-invite',
-          this.currentUser._id,
-          this.req.ip,
-          {
-            inviteId: this.invite._id,
-            privileges: this.privileges,
-          }
-        )
-      })
-    })
-
-    describe('when the user is not allowed to add more edit collaborators', function () {
-      beforeEach(function () {
-        this.LimitationsManager.promises.canAddXEditCollaborators.resolves(
-          false
-        )
-      })
-
-      describe('readAndWrite collaborator', function () {
-        beforeEach(function (done) {
-          this.privileges = 'readAndWrite'
-          this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-            .stub()
-            .resolves(true)
-          this.CollaboratorsInviteController._checkRateLimit = sinon
-            .stub()
-            .resolves(true)
-          this.res.callback = () => done()
-          this.CollaboratorsInviteController.inviteToProject(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should produce json response without an invite', function () {
-          this.res.json.callCount.should.equal(1)
-          expect(this.res.json.firstCall.args[0]).to.deep.equal({
-            invite: null,
-          })
-        })
-
-        it('should not have called _checkShouldInviteEmail', function () {
-          this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-            0
-          )
-          this.CollaboratorsInviteController._checkShouldInviteEmail
-            .calledWith(this.currentUser, this.targetEmail)
-            .should.equal(false)
-        })
-
-        it('should not have called inviteToProject', function () {
-          this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-            0
-          )
-        })
-      })
-
-      describe('readOnly collaborator (always allowed)', function () {
-        beforeEach(function (done) {
-          this.req.body = {
-            email: this.targetEmail,
-            privileges: (this.privileges = 'readOnly'),
-          }
-          this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-            .stub()
-            .resolves(true)
-          this.CollaboratorsInviteController._checkRateLimit = sinon
-            .stub()
-            .resolves(true)
-          this.res.callback = () => done()
-          this.CollaboratorsInviteController.inviteToProject(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should produce json response', function () {
-          this.res.json.callCount.should.equal(1)
-          expect(this.res.json.firstCall.args[0]).to.deep.equal({
-            invite: this.inviteReducedData,
-          })
-        })
-
-        it('should not have called canAddXEditCollaborators', function () {
-          this.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
-            0
-          )
-        })
-
-        it('should have called _checkShouldInviteEmail', function () {
-          this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-            1
-          )
-          this.CollaboratorsInviteController._checkShouldInviteEmail
-            .calledWith(this.targetEmail)
-            .should.equal(true)
-        })
-
-        it('should have called inviteToProject', function () {
-          this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-            1
-          )
-          this.CollaboratorsInviteHandler.promises.inviteToProject
-            .calledWith(
-              this.projectId,
-              this.currentUser,
-              this.targetEmail,
-              this.privileges
-            )
-            .should.equal(true)
-        })
-
-        it('should have called emitToRoom', function () {
-          this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-          this.EditorRealTimeController.emitToRoom
-            .calledWith(this.projectId, 'project:membership:changed')
-            .should.equal(true)
-        })
-
-        it('adds a project audit log entry', function () {
-          this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-            this.projectId,
-            'send-invite',
-            this.currentUser._id,
-            this.req.ip,
-            {
-              inviteId: this.invite._id,
-              privileges: this.privileges,
-            }
-          )
-        })
-      })
-    })
-
-    describe('when inviteToProject produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteHandler.promises.inviteToProject.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next).to.have.been.calledWith(sinon.match.instanceOf(Error))
-      })
-
-      it('should have called canAddXEditCollaborators', function () {
-        this.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
-          1
-        )
-        this.LimitationsManager.promises.canAddXEditCollaborators
-          .calledWith(this.projectId)
-          .should.equal(true)
-      })
-
-      it('should have called _checkShouldInviteEmail', function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteController._checkShouldInviteEmail
-          .calledWith(this.targetEmail)
-          .should.equal(true)
-      })
-
-      it('should have called inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises.inviteToProject
-          .calledWith(
-            this.projectId,
-            this.currentUser,
-            this.targetEmail,
-            this.privileges
-          )
-          .should.equal(true)
-      })
-    })
-
-    describe('when _checkShouldInviteEmail disallows the invite', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .resolves(false)
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(true)
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce json response with no invite, and an error property', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json.firstCall.args[0]).to.deep.equal({
-          invite: null,
-          error: 'cannot_invite_non_user',
-        })
-      })
-
-      it('should have called _checkShouldInviteEmail', function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteController._checkShouldInviteEmail
-          .calledWith(this.targetEmail)
-          .should.equal(true)
-      })
-
-      it('should not have called inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when _checkShouldInviteEmail produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .rejects(new Error('woops'))
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(true)
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
-      })
-
-      it('should have called _checkShouldInviteEmail', function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteController._checkShouldInviteEmail
-          .calledWith(this.targetEmail)
-          .should.equal(true)
-      })
-
-      it('should not have called inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when the user invites themselves to the project', function () {
-      beforeEach(function () {
-        this.req.body.email = this.currentUser.email
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should reject action, return json response with error code', function () {
-        this.res.json.callCount.should.equal(1)
-        expect(this.res.json.firstCall.args[0]).to.deep.equal({
-          invite: null,
-          error: 'cannot_invite_self',
-        })
-      })
-
-      it('should not have called canAddXEditCollaborators', function () {
-        this.LimitationsManager.promises.canAddXEditCollaborators.callCount.should.equal(
-          0
-        )
-      })
-
-      it('should not have called _checkShouldInviteEmail', function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail.callCount.should.equal(
-          0
-        )
-      })
-
-      it('should not have called inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          0
-        )
-      })
-
-      it('should not have called emitToRoom', function () {
-        this.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
-      })
-    })
-
-    describe('when _checkRateLimit returns false', function () {
-      beforeEach(async function () {
-        this.CollaboratorsInviteController._checkShouldInviteEmail = sinon
-          .stub()
-          .resolves(true)
-        this.CollaboratorsInviteController._checkRateLimit = sinon
-          .stub()
-          .resolves(false)
-        await this.CollaboratorsInviteController.inviteToProject(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should send a 429 response', function () {
-        this.res.sendStatus.calledWith(429).should.equal(true)
-      })
-
-      it('should not call inviteToProject', function () {
-        this.CollaboratorsInviteHandler.promises.inviteToProject.called.should.equal(
-          false
-        )
-      })
-
-      it('should not call emitToRoom', function () {
-        this.EditorRealTimeController.emitToRoom.called.should.equal(false)
-      })
-    })
-  })
-
-  describe('viewInvite', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.projectId,
-        token: this.token,
-      }
-      this.fakeProject = {
-        _id: this.projectId,
-        name: 'some project',
-        owner_ref: this.invite.sendingUserId,
-        collaberator_refs: [],
-        readOnly_refs: [],
-      }
-      this.owner = {
-        _id: this.fakeProject.owner_ref,
-        first_name: 'John',
-        last_name: 'Doe',
-        email: 'john@example.com',
-      }
-
-      this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-        false
-      )
-      this.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(
-        this.invite
-      )
-      this.ProjectGetter.promises.getProject.resolves(this.fakeProject)
-      this.UserGetter.promises.getUser.resolves(this.owner)
-    })
-
-    describe('when the token is valid', function () {
-      beforeEach(function (done) {
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should render the view template', function () {
-        this.res.render.callCount.should.equal(1)
-        this.res.render.calledWith('project/invite/show').should.equal(true)
-      })
-
-      it('should not call next', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteGetter.promises.getInviteByToken
-          .calledWith(this.fakeProject._id, this.invite.token)
-          .should.equal(true)
-      })
-
-      it('should call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(1)
-        this.UserGetter.promises.getUser
-          .calledWith({ _id: this.fakeProject.owner_ref })
-          .should.equal(true)
-      })
-
-      it('should call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(1)
-        this.ProjectGetter.promises.getProject
-          .calledWith(this.projectId)
-          .should.equal(true)
-      })
-    })
-
-    describe('when not logged in', function () {
-      beforeEach(function (done) {
-        this.SessionManager.getSessionUser.returns(null)
-
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-      it('should not check member status', function () {
-        expect(this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject)
-          .to.not.have.been.called
-      })
-
-      it('should set redirect back to invite', function () {
-        expect(
-          this.AuthenticationController.setRedirectInSession
-        ).to.have.been.calledWith(this.req)
-      })
-
-      it('should redirect to the register page', function () {
-        expect(this.res.render).to.not.have.been.called
-        expect(this.res.redirect).to.have.been.calledOnce
-        expect(this.res.redirect).to.have.been.calledWith('/register')
-      })
-    })
-
-    describe('when user is already a member of the project', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-          true
-        )
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should redirect to the project page', function () {
-        this.res.redirect.callCount.should.equal(1)
-        this.res.redirect
-          .calledWith(`/project/${this.projectId}`)
-          .should.equal(true)
-      })
-
-      it('should not call next with an error', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should not call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          0
-        )
-      })
-
-      it('should not call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(0)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when isUserInvitedMemberOfProject produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.firstCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should not call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          0
-        )
-      })
-
-      it('should not call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(0)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when the getInviteByToken produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should call next with the error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should not call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(0)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when the getInviteByToken does not produce an invite', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(null)
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should render the not-valid view template', function () {
-        this.res.render.callCount.should.equal(1)
-        this.res.render
-          .calledWith('project/invite/not-valid')
-          .should.equal(true)
-      })
-
-      it('should not call next', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should not call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(0)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when User.getUser produces an error', function () {
-      beforeEach(function (done) {
-        this.UserGetter.promises.getUser.rejects(new Error('woops'))
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.firstCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-      })
-
-      it('should call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(1)
-        this.UserGetter.promises.getUser
-          .calledWith({ _id: this.fakeProject.owner_ref })
-          .should.equal(true)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when User.getUser does not find a user', function () {
-      beforeEach(function (done) {
-        this.UserGetter.promises.getUser.resolves(null)
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should render the not-valid view template', function () {
-        this.res.render.callCount.should.equal(1)
-        this.res.render
-          .calledWith('project/invite/not-valid')
-          .should.equal(true)
-      })
-
-      it('should not call next', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-      })
-
-      it('should call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(1)
-        this.UserGetter.promises.getUser
-          .calledWith({ _id: this.fakeProject.owner_ref })
-          .should.equal(true)
-      })
-
-      it('should not call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-    })
-
-    describe('when getProject produces an error', function () {
-      beforeEach(function (done) {
-        this.ProjectGetter.promises.getProject.rejects(new Error('woops'))
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce an error', function () {
-        this.next.callCount.should.equal(1)
-        expect(this.next.firstCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-      })
-
-      it('should call User.getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(1)
-        this.UserGetter.promises.getUser
-          .calledWith({ _id: this.fakeProject.owner_ref })
-          .should.equal(true)
-      })
-
-      it('should call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(1)
-      })
-    })
-
-    describe('when Project.getUser does not find a user', function () {
-      beforeEach(function (done) {
-        this.ProjectGetter.promises.getProject.resolves(null)
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.viewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should render the not-valid view template', function () {
-        this.res.render.callCount.should.equal(1)
-        this.res.render
-          .calledWith('project/invite/not-valid')
-          .should.equal(true)
-      })
-
-      it('should not call next', function () {
-        this.next.callCount.should.equal(0)
-      })
-
-      it('should call CollaboratorsGetter.isUserInvitedMemberOfProject', function () {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject
-          .calledWith(this.currentUser._id, this.projectId)
-          .should.equal(true)
-      })
-
-      it('should call getInviteByToken', function () {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.callCount.should.equal(
-          1
-        )
-      })
-
-      it('should call getUser', function () {
-        this.UserGetter.promises.getUser.callCount.should.equal(1)
-        this.UserGetter.promises.getUser
-          .calledWith({ _id: this.fakeProject.owner_ref })
-          .should.equal(true)
-      })
-
-      it('should call ProjectGetter.getProject', function () {
-        this.ProjectGetter.promises.getProject.callCount.should.equal(1)
-      })
-    })
-  })
-
-  describe('generateNewInvite', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.projectId,
-        invite_id: this.invite._id.toString(),
-      }
-      this.CollaboratorsInviteController._checkRateLimit = sinon
-        .stub()
-        .resolves(true)
-    })
-
-    describe('when generateNewInvite does not produce an error', function () {
-      describe('and returns an invite object', function () {
-        beforeEach(function (done) {
-          this.res.callback = () => done()
-          this.CollaboratorsInviteController.generateNewInvite(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should produce a 201 response', function () {
-          this.res.sendStatus.callCount.should.equal(1)
-          this.res.sendStatus.calledWith(201).should.equal(true)
-        })
-
-        it('should have called generateNewInvite', function () {
-          this.CollaboratorsInviteHandler.promises.generateNewInvite.callCount.should.equal(
-            1
-          )
-        })
-
-        it('should have called emitToRoom', function () {
-          this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-          this.EditorRealTimeController.emitToRoom
-            .calledWith(this.projectId, 'project:membership:changed')
-            .should.equal(true)
-        })
-
-        it('should check the rate limit', function () {
-          this.CollaboratorsInviteController._checkRateLimit.callCount.should.equal(
-            1
-          )
-        })
-
-        it('should add a project audit log entry', function () {
-          this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-            this.projectId,
-            'resend-invite',
-            this.currentUser._id,
-            this.req.ip,
-            {
-              inviteId: this.invite._id,
-              privileges: this.privileges,
-            }
-          )
-        })
-      })
-
-      describe('and returns a null invite', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsInviteHandler.promises.generateNewInvite.resolves(
-            null
-          )
-          this.res.callback = () => done()
-          this.CollaboratorsInviteController.generateNewInvite(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('should have called emitToRoom', function () {
-          this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-          this.EditorRealTimeController.emitToRoom
-            .calledWith(this.projectId, 'project:membership:changed')
-            .should.equal(true)
-        })
-
-        it('should produce a 404 response when invite is null', function () {
-          this.res.sendStatus.callCount.should.equal(1)
-          this.res.sendStatus.should.have.been.calledWith(404)
-        })
-      })
-    })
-
-    describe('when generateNewInvite produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteHandler.promises.generateNewInvite.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.generateNewInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should not produce a 201 response', function () {
-        this.res.sendStatus.callCount.should.equal(0)
-      })
-
-      it('should call next with the error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
-      })
-
-      it('should have called generateNewInvite', function () {
-        this.CollaboratorsInviteHandler.promises.generateNewInvite.callCount.should.equal(
-          1
-        )
-      })
-    })
-  })
-
-  describe('revokeInvite', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.projectId,
-        invite_id: this.invite._id.toString(),
-      }
-    })
-
-    describe('when revokeInvite does not produce an error', function () {
-      beforeEach(function (done) {
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.revokeInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should produce a 204 response', function () {
-        this.res.sendStatus.callCount.should.equal(1)
-        this.res.sendStatus.should.have.been.calledWith(204)
-      })
-
-      it('should have called revokeInvite', function () {
-        this.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
-          1
-        )
-      })
-
-      it('should have called emitToRoom', function () {
-        this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-        this.EditorRealTimeController.emitToRoom
-          .calledWith(this.projectId, 'project:membership:changed')
-          .should.equal(true)
-      })
-
-      it('should add a project audit log entry', function () {
-        this.ProjectAuditLogHandler.addEntryInBackground.should.have.been.calledWith(
-          this.projectId,
-          'revoke-invite',
-          this.currentUser._id,
-          this.req.ip,
-          {
-            inviteId: this.invite._id,
-            privileges: this.privileges,
-          }
-        )
-      })
-    })
-
-    describe('when revokeInvite produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteHandler.promises.revokeInvite.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.revokeInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should not produce a 201 response', function () {
-        this.res.sendStatus.callCount.should.equal(0)
-      })
-
-      it('should call next with the error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
-      })
-
-      it('should have called revokeInvite', function () {
-        this.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
-          1
-        )
-      })
-    })
-  })
-
-  describe('acceptInvite', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.projectId,
-        token: this.token,
-      }
-    })
-
-    describe('when acceptInvite does not produce an error', function () {
-      beforeEach(function (done) {
-        this.res.callback = () => done()
-        this.CollaboratorsInviteController.acceptInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should redirect to project page', function () {
-        this.res.redirect.should.have.been.calledOnce
-        this.res.redirect.should.have.been.calledWith(
-          `/project/${this.projectId}`
-        )
-      })
-
-      it('should have called acceptInvite', function () {
-        this.CollaboratorsInviteHandler.promises.acceptInvite.should.have.been.calledWith(
-          this.invite,
-          this.projectId,
-          this.currentUser
-        )
-      })
-
-      it('should have called emitToRoom', function () {
-        this.EditorRealTimeController.emitToRoom.should.have.been.calledOnce
-        this.EditorRealTimeController.emitToRoom.should.have.been.calledWith(
-          this.projectId,
-          'project:membership:changed'
-        )
-      })
-
-      it('should add a project audit log entry', function () {
-        this.ProjectAuditLogHandler.promises.addEntry.should.have.been.calledWith(
-          this.projectId,
-          'accept-invite',
-          this.currentUser._id,
-          this.req.ip,
-          {
-            inviteId: this.invite._id,
-            privileges: this.privileges,
-          }
-        )
-      })
-    })
-
-    describe('when the invite is not found', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteGetter.promises.getInviteByToken.resolves(null)
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.acceptInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('throws a NotFoundError', function () {
-        expect(this.next).to.have.been.calledWith(
-          sinon.match.instanceOf(Errors.NotFoundError)
-        )
-      })
-    })
-
-    describe('when acceptInvite produces an error', function () {
-      beforeEach(function (done) {
-        this.CollaboratorsInviteHandler.promises.acceptInvite.rejects(
-          new Error('woops')
-        )
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.acceptInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should not redirect to project page', function () {
-        this.res.redirect.callCount.should.equal(0)
-      })
-
-      it('should call next with the error', function () {
-        this.next.callCount.should.equal(1)
-        this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
-      })
-
-      it('should have called acceptInvite', function () {
-        this.CollaboratorsInviteHandler.promises.acceptInvite.callCount.should.equal(
-          1
-        )
-      })
-    })
-
-    describe('when the project audit log entry fails', function () {
-      beforeEach(function (done) {
-        this.ProjectAuditLogHandler.promises.addEntry.rejects(new Error('oops'))
-        this.next.callsFake(() => done())
-        this.CollaboratorsInviteController.acceptInvite(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should not accept the invite', function () {
-        this.CollaboratorsInviteHandler.promises.acceptInvite.should.not.have
-          .been.called
-      })
-    })
-  })
-
-  describe('_checkShouldInviteEmail', function () {
-    beforeEach(function () {
-      this.email = 'user@example.com'
-    })
-
-    describe('when we should be restricting to existing accounts', function () {
-      beforeEach(function () {
-        this.settings.restrictInvitesToExistingAccounts = true
-        this.call = () =>
-          this.CollaboratorsInviteController._checkShouldInviteEmail(this.email)
-      })
-
-      describe('when user account is present', function () {
-        beforeEach(function () {
-          this.user = { _id: new ObjectId().toString() }
-          this.UserGetter.promises.getUserByAnyEmail.resolves(this.user)
-        })
-
-        it('should callback with `true`', async function () {
-          const shouldAllow =
-            await this.CollaboratorsInviteController._checkShouldInviteEmail(
-              this.email
-            )
-          expect(shouldAllow).to.equal(true)
-        })
-      })
-
-      describe('when user account is absent', function () {
-        beforeEach(function () {
-          this.user = null
-          this.UserGetter.promises.getUserByAnyEmail.resolves(this.user)
-        })
-
-        it('should callback with `false`', async function () {
-          const shouldAllow =
-            await this.CollaboratorsInviteController._checkShouldInviteEmail(
-              this.email
-            )
-          expect(shouldAllow).to.equal(false)
-        })
-
-        it('should have called getUser', async function () {
-          await this.CollaboratorsInviteController._checkShouldInviteEmail(
-            this.email
-          )
-          this.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
-          this.UserGetter.promises.getUserByAnyEmail
-            .calledWith(this.email, { _id: 1 })
-            .should.equal(true)
-        })
-      })
-
-      describe('when getUser produces an error', function () {
-        beforeEach(function () {
-          this.user = null
-          this.UserGetter.promises.getUserByAnyEmail.rejects(new Error('woops'))
-        })
-
-        it('should callback with an error', async function () {
-          await expect(
-            this.CollaboratorsInviteController._checkShouldInviteEmail(
-              this.email
-            )
-          ).to.be.rejected
-        })
-      })
-    })
-  })
-
-  describe('_checkRateLimit', function () {
-    beforeEach(function () {
-      this.settings.restrictInvitesToExistingAccounts = false
-      this.currentUserId = '32312313'
-      this.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
-        .withArgs(this.currentUserId)
-        .resolves(17)
-    })
-
-    it('should callback with `true` when rate limit under', async function () {
-      const result = await this.CollaboratorsInviteController._checkRateLimit(
-        this.currentUserId
-      )
-      expect(this.rateLimiter.consume).to.have.been.calledWith(
-        this.currentUserId
-      )
-      result.should.equal(true)
-    })
-
-    it('should callback with `false` when rate limit hit', async function () {
-      this.rateLimiter.consume.rejects({ remainingPoints: 0 })
-      const result = await this.CollaboratorsInviteController._checkRateLimit(
-        this.currentUserId
-      )
-      expect(this.rateLimiter.consume).to.have.been.calledWith(
-        this.currentUserId
-      )
-      result.should.equal(false)
-    })
-
-    it('should allow 10x the collaborators', async function () {
-      await this.CollaboratorsInviteController._checkRateLimit(
-        this.currentUserId
-      )
-      expect(this.rateLimiter.consume).to.have.been.calledWith(
-        this.currentUserId,
-        Math.floor(40000 / 170)
-      )
-    })
-
-    it('should allow 200 requests when collaborators is -1', async function () {
-      this.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
-        .withArgs(this.currentUserId)
-        .resolves(-1)
-      await this.CollaboratorsInviteController._checkRateLimit(
-        this.currentUserId
-      )
-      expect(this.rateLimiter.consume).to.have.been.calledWith(
-        this.currentUserId,
-        Math.floor(40000 / 200)
-      )
-    })
-
-    it('should allow 10 requests when user has no collaborators set', async function () {
-      this.LimitationsManager.promises.allowedNumberOfCollaboratorsForUser
-        .withArgs(this.currentUserId)
-        .resolves(null)
-      await this.CollaboratorsInviteController._checkRateLimit(
-        this.currentUserId
-      )
-      expect(this.rateLimiter.consume).to.have.been.calledWith(
-        this.currentUserId,
-        Math.floor(40000 / 10)
-      )
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandler.test.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandler.test.mjs
new file mode 100644
index 0000000000..5d6690d7c0
--- /dev/null
+++ b/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandler.test.mjs
@@ -0,0 +1,888 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import mongodb from 'mongodb-legacy'
+import Crypto from 'crypto'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH =
+  '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler.mjs'
+
+describe('CollaboratorsInviteHandler', function () {
+  beforeEach(async function (ctx) {
+    ctx.ProjectInvite = class ProjectInvite {
+      constructor(options) {
+        if (options == null) {
+          options = {}
+        }
+        this._id = new ObjectId()
+        for (const k in options) {
+          const v = options[k]
+          this[k] = v
+        }
+      }
+    }
+    ctx.ProjectInvite.prototype.save = sinon.stub()
+    ctx.ProjectInvite.findOne = sinon.stub()
+    ctx.ProjectInvite.find = sinon.stub()
+    ctx.ProjectInvite.deleteOne = sinon.stub()
+    ctx.ProjectInvite.findOneAndDelete = sinon.stub()
+    ctx.ProjectInvite.countDocuments = sinon.stub()
+
+    ctx.Crypto = {
+      randomBytes: sinon.stub().callsFake(Crypto.randomBytes),
+    }
+    ctx.settings = {}
+    ctx.CollaboratorsEmailHandler = { promises: {} }
+    ctx.CollaboratorsHandler = {
+      promises: {
+        addUserIdToProject: sinon.stub(),
+      },
+    }
+    ctx.UserGetter = { promises: { getUser: sinon.stub() } }
+    ctx.ProjectGetter = { promises: { getProject: sinon.stub().resolves() } }
+    ctx.NotificationsBuilder = { promises: {} }
+    ctx.tokenHmac = 'jkhajkefhaekjfhkfg'
+    ctx.CollaboratorsInviteHelper = {
+      generateToken: sinon.stub().returns(ctx.Crypto.randomBytes(24)),
+      hashInviteToken: sinon.stub().returns(ctx.tokenHmac),
+    }
+
+    ctx.CollaboratorsInviteGetter = {
+      promises: {
+        getAllInvites: sinon.stub(),
+      },
+    }
+
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignmentForUser: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.LimitationsManager = {
+      promises: {
+        canAcceptEditCollaboratorInvite: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.ProjectAuditLogHandler = {
+      promises: {
+        addEntry: sinon.stub().resolves(),
+      },
+      addEntryInBackground: sinon.stub(),
+    }
+    ctx.logger = {
+      debug: sinon.stub(),
+      warn: sinon.stub(),
+      err: sinon.stub(),
+    }
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock('../../../../app/src/models/ProjectInvite.js', () => ({
+      ProjectInvite: ctx.ProjectInvite,
+    }))
+
+    vi.doMock('@overleaf/logger', () => ({
+      default: ctx.logger,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsEmailHandler.mjs',
+      () => ({
+        default: ctx.CollaboratorsEmailHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsHandler.js',
+      () => ({
+        default: ctx.CollaboratorsHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter.js', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter.js', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsBuilder.js',
+      () => ({
+        default: ctx.NotificationsBuilder,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHelper.js',
+      () => ({
+        default: ctx.CollaboratorsInviteHelper,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsInviteGetter',
+      () => ({
+        default: ctx.CollaboratorsInviteGetter,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler.js',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/LimitationsManager.js',
+      () => ({
+        default: ctx.LimitationsManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js',
+      () => ({
+        default: ctx.ProjectAuditLogHandler,
+      })
+    )
+
+    vi.doMock('crypto', () => ({
+      default: ctx.CryptogetAssignmentForUser,
+    }))
+
+    ctx.CollaboratorsInviteHandler = (await import(MODULE_PATH)).default
+
+    ctx.projectId = new ObjectId()
+    ctx.sendingUserId = new ObjectId()
+    ctx.sendingUser = {
+      _id: ctx.sendingUserId,
+      name: 'Bob',
+    }
+    ctx.email = 'user@example.com'
+    ctx.userId = new ObjectId()
+    ctx.user = {
+      _id: ctx.userId,
+      email: 'someone@example.com',
+    }
+    ctx.inviteId = new ObjectId()
+    ctx.token = 'hnhteaosuhtaeosuahs'
+    ctx.privileges = 'readAndWrite'
+    ctx.fakeInvite = {
+      _id: ctx.inviteId,
+      email: ctx.email,
+      token: ctx.token,
+      tokenHmac: ctx.tokenHmac,
+      sendingUserId: ctx.sendingUserId,
+      projectId: ctx.projectId,
+      privileges: ctx.privileges,
+      createdAt: new Date(),
+    }
+  })
+
+  describe('inviteToProject', function () {
+    beforeEach(function (ctx) {
+      ctx.ProjectInvite.prototype.save.callsFake(async function () {
+        Object.defineProperty(this, 'toObject', {
+          value: function () {
+            return this
+          },
+          writable: true,
+          configurable: true,
+          enumerable: false,
+        })
+        return this
+      })
+      ctx.CollaboratorsInviteHandler.promises._sendMessages = sinon
+        .stub()
+        .resolves()
+      ctx.call = async () => {
+        return await ctx.CollaboratorsInviteHandler.promises.inviteToProject(
+          ctx.projectId,
+          ctx.sendingUser,
+          ctx.email,
+          ctx.privileges
+        )
+      }
+    })
+
+    describe('when all goes well', function () {
+      it('should produce the invite object', async function (ctx) {
+        const invite = await ctx.call()
+        expect(invite).to.not.equal(null)
+        expect(invite).to.not.equal(undefined)
+        expect(invite).to.be.instanceof(Object)
+        expect(invite).to.have.all.keys(['_id', 'email', 'privileges'])
+      })
+
+      it('should have generated a random token', async function (ctx) {
+        await ctx.call()
+        ctx.Crypto.randomBytes.callCount.should.equal(1)
+      })
+
+      it('should have generated a HMAC token', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHelper.hashInviteToken.callCount.should.equal(1)
+      })
+
+      it('should have called ProjectInvite.save', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectInvite.prototype.save.callCount.should.equal(1)
+      })
+
+      it('should have called _sendMessages', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises._sendMessages.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises._sendMessages
+          .calledWith(ctx.projectId, ctx.sendingUser)
+          .should.equal(true)
+      })
+    })
+
+    describe('when saving model produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectInvite.prototype.save.rejects(new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+    })
+  })
+
+  describe('_sendMessages', function () {
+    beforeEach(function (ctx) {
+      ctx.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite = sinon
+        .stub()
+        .resolves()
+      ctx.CollaboratorsInviteHandler.promises._trySendInviteNotification = sinon
+        .stub()
+        .resolves()
+      ctx.call = async () => {
+        await ctx.CollaboratorsInviteHandler.promises._sendMessages(
+          ctx.projectId,
+          ctx.sendingUser,
+          ctx.fakeInvite
+        )
+      }
+    })
+
+    describe('when all goes well', function () {
+      it('should call CollaboratorsEmailHandler.notifyUserOfProjectInvite', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite
+          .calledWith(ctx.projectId, ctx.fakeInvite.email, ctx.fakeInvite)
+          .should.equal(true)
+      })
+
+      it('should call _trySendInviteNotification', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises._trySendInviteNotification.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises._trySendInviteNotification
+          .calledWith(ctx.projectId, ctx.sendingUser, ctx.fakeInvite)
+          .should.equal(true)
+      })
+    })
+
+    describe('when CollaboratorsEmailHandler.notifyUserOfProjectInvite produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite = sinon
+          .stub()
+          .rejects(new Error('woops'))
+      })
+
+      it('should not produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.fulfilled
+        expect(ctx.logger.err).to.be.calledOnce
+      })
+    })
+
+    describe('when _trySendInviteNotification produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises._trySendInviteNotification =
+          sinon.stub().rejects(new Error('woops'))
+      })
+
+      it('should not produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.fulfilled
+        expect(ctx.logger.err).to.be.calledOnce
+      })
+    })
+  })
+  describe('revokeInviteForUser', function () {
+    beforeEach(function (ctx) {
+      ctx.targetInvite = {
+        _id: new ObjectId(),
+        email: 'fake2@example.org',
+        two: 2,
+      }
+      ctx.fakeInvites = [
+        { _id: new ObjectId(), email: 'fake1@example.org', one: 1 },
+        ctx.targetInvite,
+      ]
+      ctx.fakeInvitesWithoutUser = [
+        { _id: new ObjectId(), email: 'fake1@example.org', one: 1 },
+        { _id: new ObjectId(), email: 'fake3@example.org', two: 2 },
+      ]
+      ctx.targetEmail = [{ email: 'fake2@example.org' }]
+
+      ctx.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
+        ctx.fakeInvites
+      )
+      ctx.CollaboratorsInviteHandler.promises.revokeInvite = sinon
+        .stub()
+        .resolves(ctx.targetInvite)
+
+      ctx.call = async () => {
+        return await ctx.CollaboratorsInviteHandler.promises.revokeInviteForUser(
+          ctx.projectId,
+          ctx.targetEmail
+        )
+      }
+    })
+
+    describe('for a valid user', function () {
+      it('should have called CollaboratorsInviteGetter.getAllInvites', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteGetter.promises.getAllInvites.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteGetter.promises.getAllInvites
+          .calledWith(ctx.projectId)
+          .should.equal(true)
+      })
+
+      it('should have called revokeInvite', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
+          1
+        )
+
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite
+          .calledWith(ctx.projectId, ctx.targetInvite._id)
+          .should.equal(true)
+      })
+    })
+
+    describe('for a user without an invite in the project', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
+          ctx.fakeInvitesWithoutUser
+        )
+      })
+      it('should not have called CollaboratorsInviteHandler.revokeInvite', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
+          0
+        )
+      })
+    })
+  })
+
+  describe('revokeInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.ProjectInvite.findOneAndDelete.returns({
+        exec: sinon.stub().resolves(ctx.fakeInvite),
+      })
+      ctx.CollaboratorsInviteHandler.promises._tryCancelInviteNotification =
+        sinon.stub().resolves()
+      ctx.call = async () => {
+        return await ctx.CollaboratorsInviteHandler.promises.revokeInvite(
+          ctx.projectId,
+          ctx.inviteId
+        )
+      }
+    })
+
+    describe('when all goes well', function () {
+      it('should call ProjectInvite.findOneAndDelete', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectInvite.findOneAndDelete.should.have.been.calledOnce
+        ctx.ProjectInvite.findOneAndDelete.should.have.been.calledWith({
+          projectId: ctx.projectId,
+          _id: ctx.inviteId,
+        })
+      })
+
+      it('should call _tryCancelInviteNotification', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises._tryCancelInviteNotification.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises._tryCancelInviteNotification
+          .calledWith(ctx.inviteId)
+          .should.equal(true)
+      })
+
+      it('should return the deleted invite', async function (ctx) {
+        const invite = await ctx.call()
+        expect(invite).to.deep.equal(ctx.fakeInvite)
+      })
+    })
+
+    describe('when remove produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectInvite.findOneAndDelete.returns({
+          exec: sinon.stub().rejects(new Error('woops')),
+        })
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+    })
+  })
+
+  describe('generateNewInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeInviteToProjectObject = {
+        _id: new ObjectId(),
+        email: ctx.email,
+        privileges: ctx.privileges,
+      }
+      ctx.CollaboratorsInviteHandler.promises.revokeInvite = sinon
+        .stub()
+        .resolves(ctx.fakeInvite)
+      ctx.CollaboratorsInviteHandler.promises.inviteToProject = sinon
+        .stub()
+        .resolves(ctx.fakeInviteToProjectObject)
+      ctx.call = async () => {
+        return await ctx.CollaboratorsInviteHandler.promises.generateNewInvite(
+          ctx.projectId,
+          ctx.sendingUser,
+          ctx.inviteId
+        )
+      }
+    })
+
+    describe('when all goes well', function () {
+      it('should call revokeInvite', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite
+          .calledWith(ctx.projectId, ctx.inviteId)
+          .should.equal(true)
+      })
+
+      it('should have called inviteToProject', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject
+          .calledWith(
+            ctx.projectId,
+            ctx.sendingUser,
+            ctx.fakeInvite.email,
+            ctx.fakeInvite.privileges
+          )
+          .should.equal(true)
+      })
+
+      it('should return the invite', async function (ctx) {
+        const invite = await ctx.call()
+        expect(invite).to.deep.equal(ctx.fakeInviteToProjectObject)
+      })
+    })
+
+    describe('when revokeInvite produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite = sinon
+          .stub()
+          .rejects(new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+
+      it('should not have called inviteToProject', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          0
+        )
+      })
+    })
+
+    describe('when findOne does not find an invite', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsInviteHandler.promises.revokeInvite = sinon
+          .stub()
+          .resolves(null)
+      })
+
+      it('should not have called inviteToProject', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
+          0
+        )
+      })
+    })
+  })
+
+  describe('acceptInvite', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeProject = {
+        _id: ctx.projectId,
+        owner_ref: ctx.sendingUserId,
+      }
+      ctx.ProjectGetter.promises.getProject = sinon
+        .stub()
+        .resolves(ctx.fakeProject)
+      ctx.CollaboratorsHandler.promises.addUserIdToProject.resolves()
+      ctx.CollaboratorsInviteHandler.promises._tryCancelInviteNotification =
+        sinon.stub().resolves()
+      ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+        true
+      )
+      ctx.ProjectInvite.deleteOne.returns({ exec: sinon.stub().resolves() })
+      ctx.call = async () => {
+        await ctx.CollaboratorsInviteHandler.promises.acceptInvite(
+          ctx.fakeInvite,
+          ctx.projectId,
+          ctx.user
+        )
+      }
+    })
+
+    describe('when all goes well', function () {
+      it('should add readAndWrite invitees to the project as normal', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
+          ctx.projectId,
+          ctx.sendingUserId,
+          ctx.userId,
+          ctx.fakeInvite.privileges
+        )
+      })
+
+      it('should have called ProjectInvite.deleteOne', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectInvite.deleteOne.callCount.should.equal(1)
+        ctx.ProjectInvite.deleteOne
+          .calledWith({ _id: ctx.inviteId })
+          .should.equal(true)
+      })
+    })
+
+    describe('when the invite is for readOnly access', function () {
+      beforeEach(function (ctx) {
+        ctx.fakeInvite.privileges = 'readOnly'
+      })
+
+      it('should have called CollaboratorsHandler.addUserIdToProject', async function (ctx) {
+        await ctx.call()
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsHandler.promises.addUserIdToProject
+          .calledWith(
+            ctx.projectId,
+            ctx.sendingUserId,
+            ctx.userId,
+            ctx.fakeInvite.privileges
+          )
+          .should.equal(true)
+      })
+    })
+
+    describe('when the project has no more edit collaborator slots', function () {
+      beforeEach(function (ctx) {
+        ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+          false
+        )
+      })
+
+      it('should add readAndWrite invitees to the project as readOnly (pendingEditor) users', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectAuditLogHandler.promises.addEntry.should.have.been.calledWith(
+          ctx.projectId,
+          'editor-moved-to-pending',
+          null,
+          null,
+          { userId: ctx.userId.toString(), role: 'editor' }
+        )
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
+          ctx.projectId,
+          ctx.sendingUserId,
+          ctx.userId,
+          'readOnly',
+          { pendingEditor: true }
+        )
+      })
+    })
+
+    describe('when addUserIdToProject produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.callsArgWith(
+          4,
+          new Error('woops')
+        )
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+
+      it('should have called CollaboratorsHandler.addUserIdToProject', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsHandler.promises.addUserIdToProject
+          .calledWith(
+            ctx.projectId,
+            ctx.sendingUserId,
+            ctx.userId,
+            ctx.fakeInvite.privileges
+          )
+          .should.equal(true)
+      })
+
+      it('should not have called ProjectInvite.deleteOne', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.ProjectInvite.deleteOne.callCount.should.equal(0)
+      })
+    })
+
+    describe('when ProjectInvite.deleteOne produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectInvite.deleteOne.returns({
+          exec: sinon.stub().rejects(new Error('woops')),
+        })
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+
+      it('should have called CollaboratorsHandler.addUserIdToProject', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
+          1
+        )
+        ctx.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
+          ctx.projectId,
+          ctx.sendingUserId,
+          ctx.userId,
+          ctx.fakeInvite.privileges
+        )
+      })
+
+      it('should have called ProjectInvite.deleteOne', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.ProjectInvite.deleteOne.callCount.should.equal(1)
+      })
+    })
+  })
+
+  describe('_tryCancelInviteNotification', function () {
+    beforeEach(function (ctx) {
+      ctx.inviteId = new ObjectId()
+      ctx.currentUser = { _id: new ObjectId() }
+      ctx.notification = { read: sinon.stub().resolves() }
+      ctx.NotificationsBuilder.promises.projectInvite = sinon
+        .stub()
+        .returns(ctx.notification)
+      ctx.call = async () => {
+        await ctx.CollaboratorsInviteHandler.promises._tryCancelInviteNotification(
+          ctx.inviteId
+        )
+      }
+    })
+
+    it('should call notification.read', async function (ctx) {
+      await ctx.call()
+      ctx.notification.read.callCount.should.equal(1)
+    })
+
+    describe('when notification.read produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.notification = {
+          read: sinon.stub().rejects(new Error('woops')),
+        }
+        ctx.NotificationsBuilder.promises.projectInvite = sinon
+          .stub()
+          .returns(ctx.notification)
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+      })
+    })
+  })
+
+  describe('_trySendInviteNotification', function () {
+    beforeEach(function (ctx) {
+      ctx.invite = {
+        _id: new ObjectId(),
+        token: 'some_token',
+        sendingUserId: new ObjectId(),
+        projectId: ctx.project_id,
+        targetEmail: 'user@example.com',
+        createdAt: new Date(),
+      }
+      ctx.sendingUser = {
+        _id: new ObjectId(),
+        first_name: 'jim',
+      }
+      ctx.existingUser = { _id: new ObjectId() }
+      ctx.UserGetter.promises.getUserByAnyEmail = sinon
+        .stub()
+        .resolves(ctx.existingUser)
+      ctx.fakeProject = {
+        _id: ctx.project_id,
+        name: 'some project',
+      }
+      ctx.ProjectGetter.promises.getProject = sinon
+        .stub()
+        .resolves(ctx.fakeProject)
+      ctx.notification = { create: sinon.stub().resolves() }
+      ctx.NotificationsBuilder.promises.projectInvite = sinon
+        .stub()
+        .returns(ctx.notification)
+      ctx.call = async () => {
+        await ctx.CollaboratorsInviteHandler.promises._trySendInviteNotification(
+          ctx.project_id,
+          ctx.sendingUser,
+          ctx.invite
+        )
+      }
+    })
+
+    describe('when the user exists', function () {
+      beforeEach(function () {})
+
+      it('should call getUser', async function (ctx) {
+        await ctx.call()
+        ctx.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUserByAnyEmail
+          .calledWith(ctx.invite.email)
+          .should.equal(true)
+      })
+
+      it('should call getProject', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(1)
+        ctx.ProjectGetter.promises.getProject
+          .calledWith(ctx.project_id)
+          .should.equal(true)
+      })
+
+      it('should call NotificationsBuilder.projectInvite.create', async function (ctx) {
+        await ctx.call()
+        ctx.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
+          1
+        )
+        ctx.notification.create.callCount.should.equal(1)
+      })
+
+      describe('when getProject produces an error', function () {
+        beforeEach(function (ctx) {
+          ctx.ProjectGetter.promises.getProject.callsArgWith(
+            2,
+            new Error('woops')
+          )
+        })
+
+        it('should produce an error', async function (ctx) {
+          await expect(ctx.call()).to.be.rejectedWith(Error)
+        })
+
+        it('should not call NotificationsBuilder.projectInvite.create', async function (ctx) {
+          await expect(ctx.call()).to.be.rejected
+          ctx.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
+            0
+          )
+          ctx.notification.create.callCount.should.equal(0)
+        })
+      })
+
+      describe('when projectInvite.create produces an error', function () {
+        beforeEach(function (ctx) {
+          ctx.notification.create.callsArgWith(0, new Error('woops'))
+        })
+
+        it('should produce an error', async function (ctx) {
+          await expect(ctx.call()).to.be.rejectedWith(Error)
+        })
+      })
+    })
+
+    describe('when the user does not exist', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUserByAnyEmail = sinon.stub().resolves(null)
+      })
+
+      it('should call getUser', async function (ctx) {
+        await ctx.call()
+        ctx.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUserByAnyEmail
+          .calledWith(ctx.invite.email)
+          .should.equal(true)
+      })
+
+      it('should not call getProject', async function (ctx) {
+        await ctx.call()
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+
+      it('should not call NotificationsBuilder.projectInvite.create', async function (ctx) {
+        await ctx.call()
+        ctx.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
+          0
+        )
+        ctx.notification.create.callCount.should.equal(0)
+      })
+    })
+
+    describe('when the getUser produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserGetter.promises.getUserByAnyEmail = sinon
+          .stub()
+          .rejects(new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await expect(ctx.call()).to.be.rejectedWith(Error)
+      })
+
+      it('should call getUser', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
+        ctx.UserGetter.promises.getUserByAnyEmail
+          .calledWith(ctx.invite.email)
+          .should.equal(true)
+      })
+
+      it('should not call getProject', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.ProjectGetter.promises.getProject.callCount.should.equal(0)
+      })
+
+      it('should not call NotificationsBuilder.projectInvite.create', async function (ctx) {
+        await expect(ctx.call()).to.be.rejected
+        ctx.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
+          0
+        )
+        ctx.notification.create.callCount.should.equal(0)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandlerTests.mjs b/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandlerTests.mjs
deleted file mode 100644
index f386648552..0000000000
--- a/services/web/test/unit/src/Collaborators/CollaboratorsInviteHandlerTests.mjs
+++ /dev/null
@@ -1,833 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import mongodb from 'mongodb-legacy'
-import Crypto from 'crypto'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH =
-  '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler.mjs'
-
-describe('CollaboratorsInviteHandler', function () {
-  beforeEach(async function () {
-    this.ProjectInvite = class ProjectInvite {
-      constructor(options) {
-        if (options == null) {
-          options = {}
-        }
-        this._id = new ObjectId()
-        for (const k in options) {
-          const v = options[k]
-          this[k] = v
-        }
-      }
-    }
-    this.ProjectInvite.prototype.save = sinon.stub()
-    this.ProjectInvite.findOne = sinon.stub()
-    this.ProjectInvite.find = sinon.stub()
-    this.ProjectInvite.deleteOne = sinon.stub()
-    this.ProjectInvite.findOneAndDelete = sinon.stub()
-    this.ProjectInvite.countDocuments = sinon.stub()
-
-    this.Crypto = {
-      randomBytes: sinon.stub().callsFake(Crypto.randomBytes),
-    }
-    this.settings = {}
-    this.CollaboratorsEmailHandler = { promises: {} }
-    this.CollaboratorsHandler = {
-      promises: {
-        addUserIdToProject: sinon.stub(),
-      },
-    }
-    this.UserGetter = { promises: { getUser: sinon.stub() } }
-    this.ProjectGetter = { promises: { getProject: sinon.stub().resolves() } }
-    this.NotificationsBuilder = { promises: {} }
-    this.tokenHmac = 'jkhajkefhaekjfhkfg'
-    this.CollaboratorsInviteHelper = {
-      generateToken: sinon.stub().returns(this.Crypto.randomBytes(24)),
-      hashInviteToken: sinon.stub().returns(this.tokenHmac),
-    }
-
-    this.CollaboratorsInviteGetter = {
-      promises: {
-        getAllInvites: sinon.stub(),
-      },
-    }
-
-    this.SplitTestHandler = {
-      promises: {
-        getAssignmentForUser: sinon.stub().resolves(),
-      },
-    }
-
-    this.LimitationsManager = {
-      promises: {
-        canAcceptEditCollaboratorInvite: sinon.stub().resolves(),
-      },
-    }
-
-    this.ProjectAuditLogHandler = {
-      promises: {
-        addEntry: sinon.stub().resolves(),
-      },
-      addEntryInBackground: sinon.stub(),
-    }
-    this.logger = {
-      debug: sinon.stub(),
-      warn: sinon.stub(),
-      err: sinon.stub(),
-    }
-
-    this.CollaboratorsInviteHandler = await esmock.strict(MODULE_PATH, {
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/models/ProjectInvite.js': {
-        ProjectInvite: this.ProjectInvite,
-      },
-      '@overleaf/logger': this.logger,
-      '../../../../app/src/Features/Collaborators/CollaboratorsEmailHandler.mjs':
-        this.CollaboratorsEmailHandler,
-      '../../../../app/src/Features/Collaborators/CollaboratorsHandler.js':
-        this.CollaboratorsHandler,
-      '../../../../app/src/Features/User/UserGetter.js': this.UserGetter,
-      '../../../../app/src/Features/Project/ProjectGetter.js':
-        this.ProjectGetter,
-      '../../../../app/src/Features/Notifications/NotificationsBuilder.js':
-        this.NotificationsBuilder,
-      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHelper.js':
-        this.CollaboratorsInviteHelper,
-      '../../../../app/src/Features/Collaborators/CollaboratorsInviteGetter':
-        this.CollaboratorsInviteGetter,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler.js':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/Subscription/LimitationsManager.js':
-        this.LimitationsManager,
-      '../../../../app/src/Features/Project/ProjectAuditLogHandler.js':
-        this.ProjectAuditLogHandler,
-      crypto: this.CryptogetAssignmentForUser,
-    })
-
-    this.projectId = new ObjectId()
-    this.sendingUserId = new ObjectId()
-    this.sendingUser = {
-      _id: this.sendingUserId,
-      name: 'Bob',
-    }
-    this.email = 'user@example.com'
-    this.userId = new ObjectId()
-    this.user = {
-      _id: this.userId,
-      email: 'someone@example.com',
-    }
-    this.inviteId = new ObjectId()
-    this.token = 'hnhteaosuhtaeosuahs'
-    this.privileges = 'readAndWrite'
-    this.fakeInvite = {
-      _id: this.inviteId,
-      email: this.email,
-      token: this.token,
-      tokenHmac: this.tokenHmac,
-      sendingUserId: this.sendingUserId,
-      projectId: this.projectId,
-      privileges: this.privileges,
-      createdAt: new Date(),
-    }
-  })
-
-  describe('inviteToProject', function () {
-    beforeEach(function () {
-      this.ProjectInvite.prototype.save.callsFake(async function () {
-        Object.defineProperty(this, 'toObject', {
-          value: function () {
-            return this
-          },
-          writable: true,
-          configurable: true,
-          enumerable: false,
-        })
-        return this
-      })
-      this.CollaboratorsInviteHandler.promises._sendMessages = sinon
-        .stub()
-        .resolves()
-      this.call = async () => {
-        return await this.CollaboratorsInviteHandler.promises.inviteToProject(
-          this.projectId,
-          this.sendingUser,
-          this.email,
-          this.privileges
-        )
-      }
-    })
-
-    describe('when all goes well', function () {
-      it('should produce the invite object', async function () {
-        const invite = await this.call()
-        expect(invite).to.not.equal(null)
-        expect(invite).to.not.equal(undefined)
-        expect(invite).to.be.instanceof(Object)
-        expect(invite).to.have.all.keys(['_id', 'email', 'privileges'])
-      })
-
-      it('should have generated a random token', async function () {
-        await this.call()
-        this.Crypto.randomBytes.callCount.should.equal(1)
-      })
-
-      it('should have generated a HMAC token', async function () {
-        await this.call()
-        this.CollaboratorsInviteHelper.hashInviteToken.callCount.should.equal(1)
-      })
-
-      it('should have called ProjectInvite.save', async function () {
-        await this.call()
-        this.ProjectInvite.prototype.save.callCount.should.equal(1)
-      })
-
-      it('should have called _sendMessages', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises._sendMessages.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises._sendMessages
-          .calledWith(this.projectId, this.sendingUser)
-          .should.equal(true)
-      })
-    })
-
-    describe('when saving model produces an error', function () {
-      beforeEach(function () {
-        this.ProjectInvite.prototype.save.rejects(new Error('woops'))
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-    })
-  })
-
-  describe('_sendMessages', function () {
-    beforeEach(function () {
-      this.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite = sinon
-        .stub()
-        .resolves()
-      this.CollaboratorsInviteHandler.promises._trySendInviteNotification =
-        sinon.stub().resolves()
-      this.call = async () => {
-        await this.CollaboratorsInviteHandler.promises._sendMessages(
-          this.projectId,
-          this.sendingUser,
-          this.fakeInvite
-        )
-      }
-    })
-
-    describe('when all goes well', function () {
-      it('should call CollaboratorsEmailHandler.notifyUserOfProjectInvite', async function () {
-        await this.call()
-        this.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite
-          .calledWith(this.projectId, this.fakeInvite.email, this.fakeInvite)
-          .should.equal(true)
-      })
-
-      it('should call _trySendInviteNotification', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises._trySendInviteNotification.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises._trySendInviteNotification
-          .calledWith(this.projectId, this.sendingUser, this.fakeInvite)
-          .should.equal(true)
-      })
-    })
-
-    describe('when CollaboratorsEmailHandler.notifyUserOfProjectInvite produces an error', function () {
-      beforeEach(function () {
-        this.CollaboratorsEmailHandler.promises.notifyUserOfProjectInvite =
-          sinon.stub().rejects(new Error('woops'))
-      })
-
-      it('should not produce an error', async function () {
-        await expect(this.call()).to.be.fulfilled
-        expect(this.logger.err).to.be.calledOnce
-      })
-    })
-
-    describe('when _trySendInviteNotification produces an error', function () {
-      beforeEach(function () {
-        this.CollaboratorsInviteHandler.promises._trySendInviteNotification =
-          sinon.stub().rejects(new Error('woops'))
-      })
-
-      it('should not produce an error', async function () {
-        await expect(this.call()).to.be.fulfilled
-        expect(this.logger.err).to.be.calledOnce
-      })
-    })
-  })
-  describe('revokeInviteForUser', function () {
-    beforeEach(function () {
-      this.targetInvite = {
-        _id: new ObjectId(),
-        email: 'fake2@example.org',
-        two: 2,
-      }
-      this.fakeInvites = [
-        { _id: new ObjectId(), email: 'fake1@example.org', one: 1 },
-        this.targetInvite,
-      ]
-      this.fakeInvitesWithoutUser = [
-        { _id: new ObjectId(), email: 'fake1@example.org', one: 1 },
-        { _id: new ObjectId(), email: 'fake3@example.org', two: 2 },
-      ]
-      this.targetEmail = [{ email: 'fake2@example.org' }]
-
-      this.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
-        this.fakeInvites
-      )
-      this.CollaboratorsInviteHandler.promises.revokeInvite = sinon
-        .stub()
-        .resolves(this.targetInvite)
-
-      this.call = async () => {
-        return await this.CollaboratorsInviteHandler.promises.revokeInviteForUser(
-          this.projectId,
-          this.targetEmail
-        )
-      }
-    })
-
-    describe('for a valid user', function () {
-      it('should have called CollaboratorsInviteGetter.getAllInvites', async function () {
-        await this.call()
-        this.CollaboratorsInviteGetter.promises.getAllInvites.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteGetter.promises.getAllInvites
-          .calledWith(this.projectId)
-          .should.equal(true)
-      })
-
-      it('should have called revokeInvite', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
-          1
-        )
-
-        this.CollaboratorsInviteHandler.promises.revokeInvite
-          .calledWith(this.projectId, this.targetInvite._id)
-          .should.equal(true)
-      })
-    })
-
-    describe('for a user without an invite in the project', function () {
-      beforeEach(function () {
-        this.CollaboratorsInviteGetter.promises.getAllInvites.resolves(
-          this.fakeInvitesWithoutUser
-        )
-      })
-      it('should not have called CollaboratorsInviteHandler.revokeInvite', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
-          0
-        )
-      })
-    })
-  })
-
-  describe('revokeInvite', function () {
-    beforeEach(function () {
-      this.ProjectInvite.findOneAndDelete.returns({
-        exec: sinon.stub().resolves(this.fakeInvite),
-      })
-      this.CollaboratorsInviteHandler.promises._tryCancelInviteNotification =
-        sinon.stub().resolves()
-      this.call = async () => {
-        return await this.CollaboratorsInviteHandler.promises.revokeInvite(
-          this.projectId,
-          this.inviteId
-        )
-      }
-    })
-
-    describe('when all goes well', function () {
-      it('should call ProjectInvite.findOneAndDelete', async function () {
-        await this.call()
-        this.ProjectInvite.findOneAndDelete.should.have.been.calledOnce
-        this.ProjectInvite.findOneAndDelete.should.have.been.calledWith({
-          projectId: this.projectId,
-          _id: this.inviteId,
-        })
-      })
-
-      it('should call _tryCancelInviteNotification', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises._tryCancelInviteNotification.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises._tryCancelInviteNotification
-          .calledWith(this.inviteId)
-          .should.equal(true)
-      })
-
-      it('should return the deleted invite', async function () {
-        const invite = await this.call()
-        expect(invite).to.deep.equal(this.fakeInvite)
-      })
-    })
-
-    describe('when remove produces an error', function () {
-      beforeEach(function () {
-        this.ProjectInvite.findOneAndDelete.returns({
-          exec: sinon.stub().rejects(new Error('woops')),
-        })
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-    })
-  })
-
-  describe('generateNewInvite', function () {
-    beforeEach(function () {
-      this.fakeInviteToProjectObject = {
-        _id: new ObjectId(),
-        email: this.email,
-        privileges: this.privileges,
-      }
-      this.CollaboratorsInviteHandler.promises.revokeInvite = sinon
-        .stub()
-        .resolves(this.fakeInvite)
-      this.CollaboratorsInviteHandler.promises.inviteToProject = sinon
-        .stub()
-        .resolves(this.fakeInviteToProjectObject)
-      this.call = async () => {
-        return await this.CollaboratorsInviteHandler.promises.generateNewInvite(
-          this.projectId,
-          this.sendingUser,
-          this.inviteId
-        )
-      }
-    })
-
-    describe('when all goes well', function () {
-      it('should call revokeInvite', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises.revokeInvite.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises.revokeInvite
-          .calledWith(this.projectId, this.inviteId)
-          .should.equal(true)
-      })
-
-      it('should have called inviteToProject', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsInviteHandler.promises.inviteToProject
-          .calledWith(
-            this.projectId,
-            this.sendingUser,
-            this.fakeInvite.email,
-            this.fakeInvite.privileges
-          )
-          .should.equal(true)
-      })
-
-      it('should return the invite', async function () {
-        const invite = await this.call()
-        expect(invite).to.deep.equal(this.fakeInviteToProjectObject)
-      })
-    })
-
-    describe('when revokeInvite produces an error', function () {
-      beforeEach(function () {
-        this.CollaboratorsInviteHandler.promises.revokeInvite = sinon
-          .stub()
-          .rejects(new Error('woops'))
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-
-      it('should not have called inviteToProject', async function () {
-        await expect(this.call()).to.be.rejected
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          0
-        )
-      })
-    })
-
-    describe('when findOne does not find an invite', function () {
-      beforeEach(function () {
-        this.CollaboratorsInviteHandler.promises.revokeInvite = sinon
-          .stub()
-          .resolves(null)
-      })
-
-      it('should not have called inviteToProject', async function () {
-        await this.call()
-        this.CollaboratorsInviteHandler.promises.inviteToProject.callCount.should.equal(
-          0
-        )
-      })
-    })
-  })
-
-  describe('acceptInvite', function () {
-    beforeEach(function () {
-      this.fakeProject = {
-        _id: this.projectId,
-        owner_ref: this.sendingUserId,
-      }
-      this.ProjectGetter.promises.getProject = sinon
-        .stub()
-        .resolves(this.fakeProject)
-      this.CollaboratorsHandler.promises.addUserIdToProject.resolves()
-      this.CollaboratorsInviteHandler.promises._tryCancelInviteNotification =
-        sinon.stub().resolves()
-      this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-        true
-      )
-      this.ProjectInvite.deleteOne.returns({ exec: sinon.stub().resolves() })
-      this.call = async () => {
-        await this.CollaboratorsInviteHandler.promises.acceptInvite(
-          this.fakeInvite,
-          this.projectId,
-          this.user
-        )
-      }
-    })
-
-    describe('when all goes well', function () {
-      it('should add readAndWrite invitees to the project as normal', async function () {
-        await this.call()
-        this.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
-          this.projectId,
-          this.sendingUserId,
-          this.userId,
-          this.fakeInvite.privileges
-        )
-      })
-
-      it('should have called ProjectInvite.deleteOne', async function () {
-        await this.call()
-        this.ProjectInvite.deleteOne.callCount.should.equal(1)
-        this.ProjectInvite.deleteOne
-          .calledWith({ _id: this.inviteId })
-          .should.equal(true)
-      })
-    })
-
-    describe('when the invite is for readOnly access', function () {
-      beforeEach(function () {
-        this.fakeInvite.privileges = 'readOnly'
-      })
-
-      it('should have called CollaboratorsHandler.addUserIdToProject', async function () {
-        await this.call()
-        this.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsHandler.promises.addUserIdToProject
-          .calledWith(
-            this.projectId,
-            this.sendingUserId,
-            this.userId,
-            this.fakeInvite.privileges
-          )
-          .should.equal(true)
-      })
-    })
-
-    describe('when the project has no more edit collaborator slots', function () {
-      beforeEach(function () {
-        this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-          false
-        )
-      })
-
-      it('should add readAndWrite invitees to the project as readOnly (pendingEditor) users', async function () {
-        await this.call()
-        this.ProjectAuditLogHandler.promises.addEntry.should.have.been.calledWith(
-          this.projectId,
-          'editor-moved-to-pending',
-          null,
-          null,
-          { userId: this.userId.toString(), role: 'editor' }
-        )
-        this.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
-          this.projectId,
-          this.sendingUserId,
-          this.userId,
-          'readOnly',
-          { pendingEditor: true }
-        )
-      })
-    })
-
-    describe('when addUserIdToProject produces an error', function () {
-      beforeEach(function () {
-        this.CollaboratorsHandler.promises.addUserIdToProject.callsArgWith(
-          4,
-          new Error('woops')
-        )
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-
-      it('should have called CollaboratorsHandler.addUserIdToProject', async function () {
-        await expect(this.call()).to.be.rejected
-        this.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsHandler.promises.addUserIdToProject
-          .calledWith(
-            this.projectId,
-            this.sendingUserId,
-            this.userId,
-            this.fakeInvite.privileges
-          )
-          .should.equal(true)
-      })
-
-      it('should not have called ProjectInvite.deleteOne', async function () {
-        await expect(this.call()).to.be.rejected
-        this.ProjectInvite.deleteOne.callCount.should.equal(0)
-      })
-    })
-
-    describe('when ProjectInvite.deleteOne produces an error', function () {
-      beforeEach(function () {
-        this.ProjectInvite.deleteOne.returns({
-          exec: sinon.stub().rejects(new Error('woops')),
-        })
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-
-      it('should have called CollaboratorsHandler.addUserIdToProject', async function () {
-        await expect(this.call()).to.be.rejected
-        this.CollaboratorsHandler.promises.addUserIdToProject.callCount.should.equal(
-          1
-        )
-        this.CollaboratorsHandler.promises.addUserIdToProject.should.have.been.calledWith(
-          this.projectId,
-          this.sendingUserId,
-          this.userId,
-          this.fakeInvite.privileges
-        )
-      })
-
-      it('should have called ProjectInvite.deleteOne', async function () {
-        await expect(this.call()).to.be.rejected
-        this.ProjectInvite.deleteOne.callCount.should.equal(1)
-      })
-    })
-  })
-
-  describe('_tryCancelInviteNotification', function () {
-    beforeEach(function () {
-      this.inviteId = new ObjectId()
-      this.currentUser = { _id: new ObjectId() }
-      this.notification = { read: sinon.stub().resolves() }
-      this.NotificationsBuilder.promises.projectInvite = sinon
-        .stub()
-        .returns(this.notification)
-      this.call = async () => {
-        await this.CollaboratorsInviteHandler.promises._tryCancelInviteNotification(
-          this.inviteId
-        )
-      }
-    })
-
-    it('should call notification.read', async function () {
-      await this.call()
-      this.notification.read.callCount.should.equal(1)
-    })
-
-    describe('when notification.read produces an error', function () {
-      beforeEach(function () {
-        this.notification = {
-          read: sinon.stub().rejects(new Error('woops')),
-        }
-        this.NotificationsBuilder.promises.projectInvite = sinon
-          .stub()
-          .returns(this.notification)
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejected
-      })
-    })
-  })
-
-  describe('_trySendInviteNotification', function () {
-    beforeEach(function () {
-      this.invite = {
-        _id: new ObjectId(),
-        token: 'some_token',
-        sendingUserId: new ObjectId(),
-        projectId: this.project_id,
-        targetEmail: 'user@example.com',
-        createdAt: new Date(),
-      }
-      this.sendingUser = {
-        _id: new ObjectId(),
-        first_name: 'jim',
-      }
-      this.existingUser = { _id: new ObjectId() }
-      this.UserGetter.promises.getUserByAnyEmail = sinon
-        .stub()
-        .resolves(this.existingUser)
-      this.fakeProject = {
-        _id: this.project_id,
-        name: 'some project',
-      }
-      this.ProjectGetter.promises.getProject = sinon
-        .stub()
-        .resolves(this.fakeProject)
-      this.notification = { create: sinon.stub().resolves() }
-      this.NotificationsBuilder.promises.projectInvite = sinon
-        .stub()
-        .returns(this.notification)
-      this.call = async () => {
-        await this.CollaboratorsInviteHandler.promises._trySendInviteNotification(
-          this.project_id,
-          this.sendingUser,
-          this.invite
-        )
-      }
-    })
-
-    describe('when the user exists', function () {
-      beforeEach(function () {})
-
-      it('should call getUser', async function () {
-        await this.call()
-        this.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
-        this.UserGetter.promises.getUserByAnyEmail
-          .calledWith(this.invite.email)
-          .should.equal(true)
-      })
-
-      it('should call getProject', async function () {
-        await this.call()
-        this.ProjectGetter.promises.getProject.callCount.should.equal(1)
-        this.ProjectGetter.promises.getProject
-          .calledWith(this.project_id)
-          .should.equal(true)
-      })
-
-      it('should call NotificationsBuilder.projectInvite.create', async function () {
-        await this.call()
-        this.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
-          1
-        )
-        this.notification.create.callCount.should.equal(1)
-      })
-
-      describe('when getProject produces an error', function () {
-        beforeEach(function () {
-          this.ProjectGetter.promises.getProject.callsArgWith(
-            2,
-            new Error('woops')
-          )
-        })
-
-        it('should produce an error', async function () {
-          await expect(this.call()).to.be.rejectedWith(Error)
-        })
-
-        it('should not call NotificationsBuilder.projectInvite.create', async function () {
-          await expect(this.call()).to.be.rejected
-          this.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
-            0
-          )
-          this.notification.create.callCount.should.equal(0)
-        })
-      })
-
-      describe('when projectInvite.create produces an error', function () {
-        beforeEach(function () {
-          this.notification.create.callsArgWith(0, new Error('woops'))
-        })
-
-        it('should produce an error', async function () {
-          await expect(this.call()).to.be.rejectedWith(Error)
-        })
-      })
-    })
-
-    describe('when the user does not exist', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUserByAnyEmail = sinon.stub().resolves(null)
-      })
-
-      it('should call getUser', async function () {
-        await this.call()
-        this.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
-        this.UserGetter.promises.getUserByAnyEmail
-          .calledWith(this.invite.email)
-          .should.equal(true)
-      })
-
-      it('should not call getProject', async function () {
-        await this.call()
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-
-      it('should not call NotificationsBuilder.projectInvite.create', async function () {
-        await this.call()
-        this.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
-          0
-        )
-        this.notification.create.callCount.should.equal(0)
-      })
-    })
-
-    describe('when the getUser produces an error', function () {
-      beforeEach(function () {
-        this.UserGetter.promises.getUserByAnyEmail = sinon
-          .stub()
-          .rejects(new Error('woops'))
-      })
-
-      it('should produce an error', async function () {
-        await expect(this.call()).to.be.rejectedWith(Error)
-      })
-
-      it('should call getUser', async function () {
-        await expect(this.call()).to.be.rejected
-        this.UserGetter.promises.getUserByAnyEmail.callCount.should.equal(1)
-        this.UserGetter.promises.getUserByAnyEmail
-          .calledWith(this.invite.email)
-          .should.equal(true)
-      })
-
-      it('should not call getProject', async function () {
-        await expect(this.call()).to.be.rejected
-        this.ProjectGetter.promises.getProject.callCount.should.equal(0)
-      })
-
-      it('should not call NotificationsBuilder.projectInvite.create', async function () {
-        await expect(this.call()).to.be.rejected
-        this.NotificationsBuilder.promises.projectInvite.callCount.should.equal(
-          0
-        )
-        this.notification.create.callCount.should.equal(0)
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Collaborators/OwnershipTransferHandlerTests.js b/services/web/test/unit/src/Collaborators/OwnershipTransferHandlerTests.js
index 3ef77e3500..4994a3f129 100644
--- a/services/web/test/unit/src/Collaborators/OwnershipTransferHandlerTests.js
+++ b/services/web/test/unit/src/Collaborators/OwnershipTransferHandlerTests.js
@@ -19,12 +19,17 @@ describe('OwnershipTransferHandler', function () {
       _id: new ObjectId(),
       email: 'readonly@example.com',
     }
+    this.reviewer = {
+      _id: new ObjectId(),
+      email: 'reviewer@example.com',
+    }
     this.project = {
       _id: new ObjectId(),
       name: 'project',
       owner_ref: this.user._id,
       collaberator_refs: [this.collaborator._id],
       readOnly_refs: [this.readOnlyCollaborator._id],
+      reviewer_refs: [this.reviewer._id],
     }
     this.ProjectGetter = {
       promises: {
@@ -97,6 +102,9 @@ describe('OwnershipTransferHandler', function () {
       this.UserGetter.promises.getUser
         .withArgs(this.readOnlyCollaborator._id)
         .resolves(this.readOnlyCollaborator)
+      this.UserGetter.promises.getUser
+        .withArgs(this.reviewer._id)
+        .resolves(this.reviewer)
     })
 
     it("should return a not found error if the project can't be found", async function () {
@@ -200,6 +208,32 @@ describe('OwnershipTransferHandler', function () {
       )
     })
 
+    it('should transfer ownership of the project to a reviewer', async function () {
+      await this.handler.promises.transferOwnership(
+        this.project._id,
+        this.reviewer._id
+      )
+      expect(this.ProjectModel.updateOne).to.have.been.calledWith(
+        { _id: this.project._id },
+        sinon.match({ $set: { owner_ref: this.reviewer._id } })
+      )
+    })
+
+    it('gives old owner reviewer permissions if new owner was previously a reviewer', async function () {
+      await this.handler.promises.transferOwnership(
+        this.project._id,
+        this.reviewer._id
+      )
+      expect(
+        this.CollaboratorsHandler.promises.addUserIdToProject
+      ).to.have.been.calledWith(
+        this.project._id,
+        this.reviewer._id,
+        this.user._id,
+        PrivilegeLevels.REVIEW
+      )
+    })
+
     it('should flush the project to tpds', async function () {
       await this.handler.promises.transferOwnership(
         this.project._id,
diff --git a/services/web/test/unit/src/Compile/ClsiCookieManagerTests.js b/services/web/test/unit/src/Compile/ClsiCookieManagerTests.js
index b61991a100..082262c853 100644
--- a/services/web/test/unit/src/Compile/ClsiCookieManagerTests.js
+++ b/services/web/test/unit/src/Compile/ClsiCookieManagerTests.js
@@ -1,26 +1,22 @@
 const sinon = require('sinon')
-const { assert, expect } = require('chai')
+const { expect } = require('chai')
 const modulePath = '../../../../app/src/Features/Compile/ClsiCookieManager.js'
 const SandboxedModule = require('sandboxed-module')
-const realRequst = require('request')
 
 describe('ClsiCookieManager', function () {
   beforeEach(function () {
     this.redis = {
       auth() {},
       get: sinon.stub(),
-      setex: sinon.stub().callsArg(3),
+      setex: sinon.stub().resolves(),
     }
     this.project_id = '123423431321-proj-id'
     this.user_id = 'abc-user-id'
-    this.request = {
-      post: sinon.stub(),
-      cookie: realRequst.cookie,
-      jar: realRequst.jar,
-      defaults: () => {
-        return this.request
-      },
+    this.fetchUtils = {
+      fetchNothing: sinon.stub().returns(Promise.resolve()),
+      fetchStringWithResponse: sinon.stub().returns(Promise.resolve()),
     }
+    this.metrics = { inc: sinon.stub() }
     this.settings = {
       redis: {
         web: 'redis.something',
@@ -41,7 +37,8 @@ describe('ClsiCookieManager', function () {
         client: () => this.redis,
       }),
       '@overleaf/settings': this.settings,
-      request: this.request,
+      '@overleaf/fetch-utils': this.fetchUtils,
+      '@overleaf/metrics': this.metrics,
     }
     this.ClsiCookieManager = SandboxedModule.require(modulePath, {
       requires: this.requires,
@@ -49,74 +46,56 @@ describe('ClsiCookieManager', function () {
   })
 
   describe('getServerId', function () {
-    it('should call get for the key', function (done) {
-      this.redis.get.callsArgWith(1, null, 'clsi-7')
-      this.ClsiCookieManager.getServerId(
+    it('should call get for the key', async function () {
+      this.redis.get.resolves('clsi-7')
+      const serverId = await this.ClsiCookieManager.promises.getServerId(
         this.project_id,
         this.user_id,
         '',
-        'e2',
-        (err, serverId) => {
-          if (err) {
-            return done(err)
-          }
-          this.redis.get
-            .calledWith(`clsiserver:${this.project_id}:${this.user_id}`)
-            .should.equal(true)
-          serverId.should.equal('clsi-7')
-          done()
-        }
+        'e2'
       )
+      this.redis.get
+        .calledWith(`clsiserver:${this.project_id}:${this.user_id}`)
+        .should.equal(true)
+      serverId.should.equal('clsi-7')
     })
 
-    it('should _populateServerIdViaRequest if no key is found', function (done) {
-      this.ClsiCookieManager._populateServerIdViaRequest = sinon
+    it('should _populateServerIdViaRequest if no key is found', async function () {
+      this.ClsiCookieManager.promises._populateServerIdViaRequest = sinon
         .stub()
-        .yields(null)
-      this.redis.get.callsArgWith(1, null)
-      this.ClsiCookieManager.getServerId(
+        .resolves()
+      this.redis.get.resolves(null)
+      await this.ClsiCookieManager.promises.getServerId(
         this.project_id,
         this.user_id,
-        '',
-        (err, serverId) => {
-          if (err) {
-            return done(err)
-          }
-          this.ClsiCookieManager._populateServerIdViaRequest
-            .calledWith(this.project_id, this.user_id)
-            .should.equal(true)
-          done()
-        }
+        ''
       )
+      this.ClsiCookieManager.promises._populateServerIdViaRequest
+        .calledWith(this.project_id, this.user_id)
+        .should.equal(true)
     })
 
-    it('should _populateServerIdViaRequest if no key is blank', function (done) {
-      this.ClsiCookieManager._populateServerIdViaRequest = sinon
+    it('should _populateServerIdViaRequest if no key is blank', async function () {
+      this.ClsiCookieManager.promises._populateServerIdViaRequest = sinon
         .stub()
-        .yields(null)
-      this.redis.get.callsArgWith(1, null, '')
-      this.ClsiCookieManager.getServerId(
+        .resolves(null)
+      this.redis.get.resolves('')
+      await this.ClsiCookieManager.promises.getServerId(
         this.project_id,
         this.user_id,
         '',
-        'e2',
-        (err, serverId) => {
-          if (err) {
-            return done(err)
-          }
-          this.ClsiCookieManager._populateServerIdViaRequest
-            .calledWith(this.project_id, this.user_id)
-            .should.equal(true)
-          done()
-        }
+        'e2'
       )
+      this.ClsiCookieManager.promises._populateServerIdViaRequest
+        .calledWith(this.project_id, this.user_id)
+        .should.equal(true)
     })
   })
 
   describe('_populateServerIdViaRequest', function () {
     beforeEach(function () {
       this.clsiServerId = 'server-id'
-      this.ClsiCookieManager.setServerId = sinon.stub().yields()
+      this.ClsiCookieManager.promises.setServerId = sinon.stub().resolves()
     })
 
     describe('with a server id in the response', function () {
@@ -128,71 +107,54 @@ describe('ClsiCookieManager', function () {
             ],
           },
         }
-        this.request.post.callsArgWith(1, null, this.response)
+        this.fetchUtils.fetchNothing.returns(this.response)
       })
 
-      it('should make a request to the clsi', function (done) {
-        this.ClsiCookieManager._populateServerIdViaRequest(
+      it('should make a request to the clsi', async function () {
+        await this.ClsiCookieManager.promises._populateServerIdViaRequest(
           this.project_id,
           this.user_id,
           'standard',
-          'e2',
-          (err, serverId) => {
-            if (err) {
-              return done(err)
-            }
-            const args = this.ClsiCookieManager.setServerId.args[0]
-            args[0].should.equal(this.project_id)
-            args[1].should.equal(this.user_id)
-            args[2].should.equal('standard')
-            args[3].should.equal('e2')
-            args[4].should.deep.equal(this.clsiServerId)
-            done()
-          }
+          'e2'
         )
+        const args = this.ClsiCookieManager.promises.setServerId.args[0]
+        args[0].should.equal(this.project_id)
+        args[1].should.equal(this.user_id)
+        args[2].should.equal('standard')
+        args[3].should.equal('e2')
+        args[4].should.deep.equal(this.clsiServerId)
       })
 
-      it('should return the server id', function (done) {
-        this.ClsiCookieManager._populateServerIdViaRequest(
-          this.project_id,
-          this.user_id,
-          '',
-          'e2',
-          (err, serverId) => {
-            if (err) {
-              return done(err)
-            }
-            serverId.should.equal(this.clsiServerId)
-            done()
-          }
-        )
+      it('should return the server id', async function () {
+        const serverId =
+          await this.ClsiCookieManager.promises._populateServerIdViaRequest(
+            this.project_id,
+            this.user_id,
+            '',
+            'e2'
+          )
+        serverId.should.equal(this.clsiServerId)
       })
     })
 
     describe('without a server id in the response', function () {
       beforeEach(function () {
         this.response = { headers: {} }
-        this.request.post.yields(null, this.response)
+        this.fetchUtils.fetchNothing.returns(this.response)
       })
-      it('should not set the server id there is no server id in the response', function (done) {
+      it('should not set the server id there is no server id in the response', async function () {
         this.ClsiCookieManager._parseServerIdFromResponse = sinon
           .stub()
           .returns(null)
-        this.ClsiCookieManager.setServerId(
+        await this.ClsiCookieManager.promises.setServerId(
           this.project_id,
           this.user_id,
           'standard',
           'e2',
           this.clsiServerId,
-          null,
-          err => {
-            if (err) {
-              return done(err)
-            }
-            this.redis.setex.called.should.equal(false)
-            done()
-          }
+          null
         )
+        this.redis.setex.called.should.equal(false)
       })
     })
   })
@@ -205,162 +167,148 @@ describe('ClsiCookieManager', function () {
         .returns('clsi-8')
     })
 
-    it('should set the server id with a ttl', function (done) {
-      this.ClsiCookieManager.setServerId(
+    it('should set the server id with a ttl', async function () {
+      await this.ClsiCookieManager.promises.setServerId(
         this.project_id,
         this.user_id,
         'standard',
         'e2',
         this.clsiServerId,
-        null,
-        err => {
-          if (err) {
-            return done(err)
-          }
-          this.redis.setex.should.have.been.calledWith(
-            `clsiserver:${this.project_id}:${this.user_id}`,
-            this.settings.clsiCookie.ttlInSeconds,
-            this.clsiServerId
-          )
-          done()
-        }
+        null
+      )
+      this.redis.setex.should.have.been.calledWith(
+        `clsiserver:${this.project_id}:${this.user_id}`,
+        this.settings.clsiCookie.ttlInSeconds,
+        this.clsiServerId
       )
     })
 
-    it('should set the server id with the regular ttl for reg instance', function (done) {
+    it('should set the server id with the regular ttl for reg instance', async function () {
       this.clsiServerId = 'clsi-reg-8'
-      this.ClsiCookieManager.setServerId(
+      await this.ClsiCookieManager.promises.setServerId(
         this.project_id,
         this.user_id,
         'standard',
         'e2',
         this.clsiServerId,
-        null,
-        err => {
-          if (err) {
-            return done(err)
-          }
-          expect(this.redis.setex).to.have.been.calledWith(
-            `clsiserver:${this.project_id}:${this.user_id}`,
-            this.settings.clsiCookie.ttlInSecondsRegular,
-            this.clsiServerId
-          )
-          done()
-        }
+        null
+      )
+      expect(this.redis.setex).to.have.been.calledWith(
+        `clsiserver:${this.project_id}:${this.user_id}`,
+        this.settings.clsiCookie.ttlInSecondsRegular,
+        this.clsiServerId
       )
     })
 
-    it('should not set the server id if clsiCookies are not enabled', function (done) {
+    it('should not set the server id if clsiCookies are not enabled', async function () {
       delete this.settings.clsiCookie.key
-      this.ClsiCookieManager = SandboxedModule.require(modulePath, {
+      this.ClsiCookieManager2 = SandboxedModule.require(modulePath, {
         globals: {
           console,
         },
         requires: this.requires,
       })()
-      this.ClsiCookieManager.setServerId(
+      await this.ClsiCookieManager2.promises.setServerId(
         this.project_id,
         this.user_id,
         'standard',
         'e2',
         this.clsiServerId,
-        null,
-        err => {
-          if (err) {
-            return done(err)
-          }
-          this.redis.setex.called.should.equal(false)
-          done()
-        }
+        null
       )
+      this.redis.setex.called.should.equal(false)
     })
 
-    it('should also set in the secondary if secondary redis is enabled', function (done) {
-      this.redis_secondary = { setex: sinon.stub().callsArg(3) }
+    it('should also set in the secondary if secondary redis is enabled', async function () {
+      this.redis_secondary = { setex: sinon.stub().resolves() }
       this.settings.redis.clsi_cookie_secondary = {}
       this.RedisWrapper.client = sinon.stub()
       this.RedisWrapper.client.withArgs('clsi_cookie').returns(this.redis)
       this.RedisWrapper.client
         .withArgs('clsi_cookie_secondary')
         .returns(this.redis_secondary)
-      this.ClsiCookieManager = SandboxedModule.require(modulePath, {
+      this.ClsiCookieManager2 = SandboxedModule.require(modulePath, {
         globals: {
           console,
         },
         requires: this.requires,
       })()
-      this.ClsiCookieManager._parseServerIdFromResponse = sinon
+      this.ClsiCookieManager2._parseServerIdFromResponse = sinon
         .stub()
         .returns('clsi-8')
-      this.ClsiCookieManager.setServerId(
+      await this.ClsiCookieManager2.promises.setServerId(
         this.project_id,
         this.user_id,
         'standard',
         'e2',
         this.clsiServerId,
-        null,
-        err => {
-          if (err) {
-            return done(err)
-          }
-          this.redis_secondary.setex.should.have.been.calledWith(
-            `clsiserver:${this.project_id}:${this.user_id}`,
-            this.settings.clsiCookie.ttlInSeconds,
-            this.clsiServerId
+        null
+      )
+      this.redis_secondary.setex.should.have.been.calledWith(
+        `clsiserver:${this.project_id}:${this.user_id}`,
+        this.settings.clsiCookie.ttlInSeconds,
+        this.clsiServerId
+      )
+    })
+
+    describe('checkIsLoadSheddingEvent', function () {
+      beforeEach(function () {
+        this.fetchUtils.fetchStringWithResponse.reset()
+        this.call = async () => {
+          await this.ClsiCookieManager.promises.setServerId(
+            this.project_id,
+            this.user_id,
+            'standard',
+            'e2',
+            this.clsiServerId,
+            'previous-clsi-server-id'
+          )
+          expect(
+            this.fetchUtils.fetchStringWithResponse
+          ).to.have.been.calledWith(
+            `${this.settings.apis.clsi.url}/instance-state?clsiserverid=previous-clsi-server-id&compileGroup=standard&compileBackendClass=e2`,
+            { method: 'GET', signal: sinon.match.instanceOf(AbortSignal) }
           )
-          done()
         }
-      )
-    })
-  })
+      })
 
-  describe('getCookieJar', function () {
-    beforeEach(function () {
-      this.ClsiCookieManager.getServerId = sinon.stub().yields(null, 'clsi-11')
-    })
+      it('should report "load-shedding" when previous is UP', async function () {
+        this.fetchUtils.fetchStringWithResponse.resolves({
+          response: { status: 200 },
+          body: 'previous-clsi-server-id,UP\n',
+        })
+        await this.call()
+        expect(this.metrics.inc).to.have.been.calledWith(
+          'clsi-lb-switch-backend',
+          1,
+          { status: 'load-shedding' }
+        )
+      })
 
-    it('should return a jar with the cookie set populated from redis', function (done) {
-      this.ClsiCookieManager.getCookieJar(
-        this.project_id,
-        this.user_id,
-        '',
-        'e2',
-        (err, jar) => {
-          if (err) {
-            return done(err)
-          }
-          jar._jar.store.idx['clsi.example.com']['/'][
-            this.settings.clsiCookie.key
-          ].key.should.equal
-          jar._jar.store.idx['clsi.example.com']['/'][
-            this.settings.clsiCookie.key
-          ].value.should.equal('clsi-11')
-          done()
-        }
-      )
-    })
+      it('should report "cycle" when other is UP', async function () {
+        this.fetchUtils.fetchStringWithResponse.resolves({
+          response: { status: 200 },
+          body: 'other-clsi-server-id,UP\n',
+        })
+        await this.call()
+        expect(this.metrics.inc).to.have.been.calledWith(
+          'clsi-lb-switch-backend',
+          1,
+          { status: 'cycle' }
+        )
+      })
 
-    it('should return empty cookie jar if clsiCookies are not enabled', function (done) {
-      delete this.settings.clsiCookie.key
-      this.ClsiCookieManager = SandboxedModule.require(modulePath, {
-        globals: {
-          console,
-        },
-        requires: this.requires,
-      })()
-      this.ClsiCookieManager.getCookieJar(
-        this.project_id,
-        this.user_id,
-        '',
-        'e2',
-        (err, jar) => {
-          if (err) {
-            return done(err)
-          }
-          assert.deepEqual(jar, realRequst.jar())
-          done()
-        }
-      )
+      it('should report "cycle" when previous is 404', async function () {
+        this.fetchUtils.fetchStringWithResponse.resolves({
+          response: { status: 404 },
+        })
+        await this.call()
+        expect(this.metrics.inc).to.have.been.calledWith(
+          'clsi-lb-switch-backend',
+          1,
+          { status: 'cycle' }
+        )
+      })
     })
   })
 })
diff --git a/services/web/test/unit/src/Compile/ClsiFormatCheckerTests.js b/services/web/test/unit/src/Compile/ClsiFormatCheckerTests.js
index 347d9ab422..aa19732b9e 100644
--- a/services/web/test/unit/src/Compile/ClsiFormatCheckerTests.js
+++ b/services/web/test/unit/src/Compile/ClsiFormatCheckerTests.js
@@ -47,62 +47,53 @@ describe('ClsiFormatChecker', function () {
       ])
     })
 
-    it('should call _checkDocsAreUnderSizeLimit and _checkForConflictingPaths', function (done) {
+    it('should call _checkDocsAreUnderSizeLimit and _checkForConflictingPaths', async function () {
       this.ClsiFormatChecker._checkForConflictingPaths = sinon
         .stub()
         .callsArgWith(1, null)
       this.ClsiFormatChecker._checkDocsAreUnderSizeLimit = sinon
         .stub()
         .callsArgWith(1)
-      return this.ClsiFormatChecker.checkRecoursesForProblems(
-        this.resources,
-        (err, problems) => {
-          this.ClsiFormatChecker._checkForConflictingPaths.called.should.equal(
-            true
-          )
-          this.ClsiFormatChecker._checkDocsAreUnderSizeLimit.called.should.equal(
-            true
-          )
-          return done()
-        }
+      const problems =
+        await this.ClsiFormatChecker.promises.checkRecoursesForProblems(
+          this.resources
+        )
+      this.ClsiFormatChecker._checkForConflictingPaths.called.should.equal(true)
+      this.ClsiFormatChecker._checkDocsAreUnderSizeLimit.called.should.equal(
+        true
       )
     })
 
-    it('should remove undefined errors', function (done) {
+    it('should remove undefined errors', async function () {
       this.ClsiFormatChecker._checkForConflictingPaths = sinon
         .stub()
         .callsArgWith(1, null, [])
       this.ClsiFormatChecker._checkDocsAreUnderSizeLimit = sinon
         .stub()
         .callsArgWith(1, null, {})
-      return this.ClsiFormatChecker.checkRecoursesForProblems(
-        this.resources,
-        (err, problems) => {
-          expect(problems).to.not.exist
-          expect(problems).to.not.exist
-          return done()
-        }
-      )
+      const problems =
+        await this.ClsiFormatChecker.promises.checkRecoursesForProblems(
+          this.resources
+        )
+      expect(problems).to.not.exist
     })
 
-    it('should keep populated arrays', function (done) {
+    it('should keep populated arrays', async function () {
       this.ClsiFormatChecker._checkForConflictingPaths = sinon
         .stub()
         .callsArgWith(1, null, [{ path: 'somewhere/main.tex' }])
       this.ClsiFormatChecker._checkDocsAreUnderSizeLimit = sinon
         .stub()
         .callsArgWith(1, null, {})
-      return this.ClsiFormatChecker.checkRecoursesForProblems(
-        this.resources,
-        (err, problems) => {
-          problems.conflictedPaths[0].path.should.equal('somewhere/main.tex')
-          expect(problems.sizeCheck).to.not.exist
-          return done()
-        }
-      )
+      const problems =
+        await this.ClsiFormatChecker.promises.checkRecoursesForProblems(
+          this.resources
+        )
+      problems.conflictedPaths[0].path.should.equal('somewhere/main.tex')
+      expect(problems.sizeCheck).to.not.exist
     })
 
-    it('should keep populated object', function (done) {
+    it('should keep populated object', async function () {
       this.ClsiFormatChecker._checkForConflictingPaths = sinon
         .stub()
         .callsArgWith(1, null, [])
@@ -112,15 +103,13 @@ describe('ClsiFormatChecker', function () {
           resources: [{ 'a.tex': 'a.tex' }, { 'b.tex': 'b.tex' }],
           totalSize: 1000000,
         })
-      return this.ClsiFormatChecker.checkRecoursesForProblems(
-        this.resources,
-        (err, problems) => {
-          problems.sizeCheck.resources.length.should.equal(2)
-          problems.sizeCheck.totalSize.should.equal(1000000)
-          expect(problems.conflictedPaths).to.not.exist
-          return done()
-        }
-      )
+      const problems =
+        await this.ClsiFormatChecker.promises.checkRecoursesForProblems(
+          this.resources
+        )
+      problems.sizeCheck.resources.length.should.equal(2)
+      problems.sizeCheck.totalSize.should.equal(1000000)
+      expect(problems.conflictedPaths).to.not.exist
     })
 
     describe('_checkForConflictingPaths', function () {
@@ -136,56 +125,50 @@ describe('ClsiFormatChecker', function () {
         })
       })
 
-      it('should flag up when a nested file has folder with same subpath as file elsewhere', function (done) {
+      it('should flag up when a nested file has folder with same subpath as file elsewhere', async function () {
         this.resources.push({
           path: 'stuff/image',
           url: 'http://somwhere.com',
         })
 
-        return this.ClsiFormatChecker._checkForConflictingPaths(
-          this.resources,
-          (err, conflictPathErrors) => {
-            conflictPathErrors.length.should.equal(1)
-            conflictPathErrors[0].path.should.equal('stuff/image')
-            return done()
-          }
-        )
+        const conflictPathErrors =
+          await this.ClsiFormatChecker.promises._checkForConflictingPaths(
+            this.resources
+          )
+        conflictPathErrors.length.should.equal(1)
+        conflictPathErrors[0].path.should.equal('stuff/image')
       })
 
-      it('should flag up when a root level file has folder with same subpath as file elsewhere', function (done) {
+      it('should flag up when a root level file has folder with same subpath as file elsewhere', async function () {
         this.resources.push({
           path: 'stuff',
           content: 'other stuff',
         })
 
-        return this.ClsiFormatChecker._checkForConflictingPaths(
-          this.resources,
-          (err, conflictPathErrors) => {
-            conflictPathErrors.length.should.equal(1)
-            conflictPathErrors[0].path.should.equal('stuff')
-            return done()
-          }
-        )
+        const conflictPathErrors =
+          await this.ClsiFormatChecker.promises._checkForConflictingPaths(
+            this.resources
+          )
+        conflictPathErrors.length.should.equal(1)
+        conflictPathErrors[0].path.should.equal('stuff')
       })
 
-      it('should not flag up when the file is a substring of a path', function (done) {
+      it('should not flag up when the file is a substring of a path', async function () {
         this.resources.push({
           path: 'stuf',
           content: 'other stuff',
         })
 
-        return this.ClsiFormatChecker._checkForConflictingPaths(
-          this.resources,
-          (err, conflictPathErrors) => {
-            conflictPathErrors.length.should.equal(0)
-            return done()
-          }
-        )
+        const conflictPathErrors =
+          await this.ClsiFormatChecker.promises._checkForConflictingPaths(
+            this.resources
+          )
+        conflictPathErrors.length.should.equal(0)
       })
     })
 
     describe('_checkDocsAreUnderSizeLimit', function () {
-      it('should error when there is more than 5mb of data', function (done) {
+      it('should error when there is more than 5mb of data', async function () {
         this.resources.push({
           path: 'massive.tex',
           content: 'hello world'.repeat(833333), // over 5mb limit
@@ -198,19 +181,17 @@ describe('ClsiFormatChecker', function () {
           })
         }
 
-        return this.ClsiFormatChecker._checkDocsAreUnderSizeLimit(
-          this.resources,
-          (err, sizeError) => {
-            sizeError.totalSize.should.equal(16 + 833333 * 11) // 16 is for earlier resources
-            sizeError.resources.length.should.equal(10)
-            sizeError.resources[0].path.should.equal('massive.tex')
-            sizeError.resources[0].size.should.equal(833333 * 11)
-            return done()
-          }
-        )
+        const sizeError =
+          await this.ClsiFormatChecker.promises._checkDocsAreUnderSizeLimit(
+            this.resources
+          )
+        sizeError.totalSize.should.equal(16 + 833333 * 11) // 16 is for earlier resources
+        sizeError.resources.length.should.equal(10)
+        sizeError.resources[0].path.should.equal('massive.tex')
+        sizeError.resources[0].size.should.equal(833333 * 11)
       })
 
-      it('should return nothing when project is correct size', function (done) {
+      it('should return nothing when project is correct size', async function () {
         this.resources.push({
           path: 'massive.tex',
           content: 'x'.repeat(2 * 1000 * 1000),
@@ -223,13 +204,11 @@ describe('ClsiFormatChecker', function () {
           })
         }
 
-        return this.ClsiFormatChecker._checkDocsAreUnderSizeLimit(
-          this.resources,
-          (err, sizeError) => {
-            expect(sizeError).to.not.exist
-            return done()
-          }
-        )
+        const sizeError =
+          await this.ClsiFormatChecker.promises._checkDocsAreUnderSizeLimit(
+            this.resources
+          )
+        expect(sizeError).to.not.exist
       })
     })
   })
diff --git a/services/web/test/unit/src/Compile/ClsiManagerTests.js b/services/web/test/unit/src/Compile/ClsiManagerTests.js
index ff50ac16bb..b9b7d9af37 100644
--- a/services/web/test/unit/src/Compile/ClsiManagerTests.js
+++ b/services/web/test/unit/src/Compile/ClsiManagerTests.js
@@ -13,6 +13,8 @@ const GLOBAL_BLOB_HASH = 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa'
 
 describe('ClsiManager', function () {
   beforeEach(function () {
+    tk.freeze(Date.now())
+
     this.user_id = 'user-id'
     this.project = {
       _id: 'project-id',
@@ -144,6 +146,9 @@ describe('ClsiManager', function () {
       enablePdfCaching: true,
       clsiCookie: { key: 'clsiserver' },
     }
+    this.ClsiCacheHandler = {
+      clearCache: sinon.stub().resolves(),
+    }
     this.Features = {
       hasFeature: sinon.stub().withArgs('project-history-blobs').returns(true),
     }
@@ -172,13 +177,13 @@ describe('ClsiManager', function () {
           this.DocumentUpdaterHandler,
         './ClsiCookieManager': () => this.ClsiCookieManager,
         './ClsiStateManager': this.ClsiStateManager,
+        './ClsiCacheHandler': this.ClsiCacheHandler,
         '@overleaf/fetch-utils': this.FetchUtils,
         './ClsiFormatChecker': this.ClsiFormatChecker,
         '@overleaf/metrics': this.Metrics,
         '../History/HistoryManager': this.HistoryManager,
       },
     })
-    tk.freeze(Date.now())
   })
 
   after(function () {
@@ -390,6 +395,8 @@ describe('ClsiManager', function () {
             incrementalCompilesEnabled: true,
             compileBackendClass: 'e2',
             compileGroup: 'priority',
+            compileFromClsiCache: true,
+            populateClsiCache: true,
             enablePdfCaching: true,
             pdfCachingMinChunkSize: 1337,
           }
@@ -448,6 +455,8 @@ describe('ClsiManager', function () {
                   syncType: 'incremental',
                   syncState: '01234567890abcdef',
                   compileGroup: 'priority',
+                  compileFromClsiCache: true,
+                  populateClsiCache: true,
                   enablePdfCaching: true,
                   pdfCachingMinChunkSize: 1337,
                   metricsMethod: 'priority',
@@ -945,6 +954,12 @@ describe('ClsiManager', function () {
         )
       })
 
+      it('should clear the output.tar.gz files in clsi-cache', function () {
+        this.ClsiCacheHandler.clearCache
+          .calledWith(this.project._id, this.user_id)
+          .should.equal(true)
+      })
+
       it('should clear the project state from the docupdater', function () {
         this.DocumentUpdaterHandler.promises.clearProjectState
           .calledWith(this.project._id)
diff --git a/services/web/test/unit/src/Compile/CompileControllerTests.js b/services/web/test/unit/src/Compile/CompileControllerTests.js
index 0e9c33f4c3..92bd21d176 100644
--- a/services/web/test/unit/src/Compile/CompileControllerTests.js
+++ b/services/web/test/unit/src/Compile/CompileControllerTests.js
@@ -1,4 +1,3 @@
-/* eslint-disable mocha/handle-done-callback */
 const sinon = require('sinon')
 const { expect } = require('chai')
 const modulePath = '../../../../app/src/Features/Compile/CompileController.js'
@@ -19,8 +18,15 @@ describe('CompileController', function () {
         compileTimeout: 100,
       },
     }
-    this.CompileManager = { compile: sinon.stub() }
-    this.ClsiManager = {}
+    this.CompileManager = {
+      promises: {
+        compile: sinon.stub(),
+        getProjectCompileLimits: sinon.stub(),
+      },
+    }
+    this.ClsiManager = {
+      promises: {},
+    }
     this.UserGetter = { getUser: sinon.stub() }
     this.rateLimiter = {
       consume: sinon.stub().resolves(),
@@ -47,10 +53,11 @@ describe('CompileController', function () {
       },
     }
     this.ClsiCookieManager = {
-      getServerId: sinon.stub().yields(null, 'clsi-server-id-from-redis'),
+      promises: {
+        getServerId: sinon.stub().resolves('clsi-server-id-from-redis'),
+      },
     }
     this.SessionManager = {
-      getLoggedInUser: sinon.stub().callsArgWith(1, null, this.user),
       getLoggedInUserId: sinon.stub().returns(this.user_id),
       getSessionUser: sinon.stub().returns(this.user),
       isUserLoggedIn: sinon.stub().returns(true),
@@ -76,8 +83,9 @@ describe('CompileController', function () {
         'stream/promises': { pipeline: this.pipeline },
         '@overleaf/settings': this.settings,
         '@overleaf/fetch-utils': this.fetchUtils,
-        request: (this.request = sinon.stub()),
-        '../Project/ProjectGetter': (this.ProjectGetter = {}),
+        '../Project/ProjectGetter': (this.ProjectGetter = {
+          promises: {},
+        }),
         '@overleaf/metrics': (this.Metrics = {
           inc: sinon.stub(),
           Timer: class {
@@ -121,25 +129,23 @@ describe('CompileController', function () {
     beforeEach(function () {
       this.req.params = { Project_id: this.projectId }
       this.req.session = {}
-      this.CompileManager.compile = sinon.stub().callsArgWith(
-        3,
-        null,
-        (this.status = 'success'),
-        (this.outputFiles = [
+      this.CompileManager.promises.compile = sinon.stub().resolves({
+        status: (this.status = 'success'),
+        outputFiles: (this.outputFiles = [
           {
             path: 'output.pdf',
             url: `/project/${this.projectId}/user/${this.user_id}/build/id/output.pdf`,
             type: 'pdf',
           },
         ]),
-        undefined,
-        undefined,
-        undefined,
-        undefined,
-        undefined,
-        undefined,
-        this.build_id
-      )
+        clsiServerId: undefined,
+        limits: undefined,
+        validationProblems: undefined,
+        stats: undefined,
+        timings: undefined,
+        outputUrlPrefix: undefined,
+        buildId: this.build_id,
+      })
     })
 
     describe('pdfDownloadDomain', function () {
@@ -148,9 +154,8 @@ describe('CompileController', function () {
       })
 
       describe('when clsi does not emit zone prefix', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.CompileController.compile(this.req, this.res, this.next)
+        beforeEach(async function () {
+          await this.CompileController.compile(this.req, this.res, this.next)
         })
 
         it('should add domain verbatim', function () {
@@ -177,28 +182,25 @@ describe('CompileController', function () {
       })
 
       describe('when clsi emits a zone prefix', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.CompileManager.compile = sinon.stub().callsArgWith(
-            3,
-            null,
-            (this.status = 'success'),
-            (this.outputFiles = [
+        beforeEach(async function () {
+          this.CompileManager.promises.compile = sinon.stub().resolves({
+            status: (this.status = 'success'),
+            outputFiles: (this.outputFiles = [
               {
                 path: 'output.pdf',
                 url: `/project/${this.projectId}/user/${this.user_id}/build/id/output.pdf`,
                 type: 'pdf',
               },
             ]),
-            undefined, // clsiServerId
-            undefined, // limits
-            undefined, // validationProblems
-            undefined, // stats
-            undefined, // timings
-            '/zone/b',
-            this.build_id
-          )
-          this.CompileController.compile(this.req, this.res, this.next)
+            clsiServerId: undefined,
+            limits: undefined,
+            validationProblems: undefined,
+            stats: undefined,
+            timings: undefined,
+            outputUrlPrefix: '/zone/b',
+            buildId: this.build_id,
+          })
+          await this.CompileController.compile(this.req, this.res, this.next)
         })
 
         it('should add the zone prefix', function () {
@@ -227,9 +229,8 @@ describe('CompileController', function () {
     })
 
     describe('when not an auto compile', function () {
-      beforeEach(function (done) {
-        this.res.callback = done
-        this.CompileController.compile(this.req, this.res, this.next)
+      beforeEach(async function () {
+        await this.CompileController.compile(this.req, this.res, this.next)
       })
 
       it('should look up the user id', function () {
@@ -239,14 +240,17 @@ describe('CompileController', function () {
       })
 
       it('should do the compile without the auto compile flag', function () {
-        this.CompileManager.compile.should.have.been.calledWith(
+        this.CompileManager.promises.compile.should.have.been.calledWith(
           this.projectId,
           this.user_id,
           {
             isAutoCompile: false,
+            compileFromClsiCache: false,
+            populateClsiCache: false,
             enablePdfCaching: false,
             fileLineErrors: false,
             stopOnFirstError: false,
+            editorId: undefined,
           }
         )
       })
@@ -272,43 +276,70 @@ describe('CompileController', function () {
     })
 
     describe('when an auto compile', function () {
-      beforeEach(function (done) {
-        this.res.callback = done
+      beforeEach(async function () {
         this.req.query = { auto_compile: 'true' }
-        this.CompileController.compile(this.req, this.res, this.next)
+        await this.CompileController.compile(this.req, this.res, this.next)
       })
 
       it('should do the compile with the auto compile flag', function () {
-        this.CompileManager.compile.should.have.been.calledWith(
+        this.CompileManager.promises.compile.should.have.been.calledWith(
           this.projectId,
           this.user_id,
           {
             isAutoCompile: true,
+            compileFromClsiCache: false,
+            populateClsiCache: false,
             enablePdfCaching: false,
             fileLineErrors: false,
             stopOnFirstError: false,
+            editorId: undefined,
           }
         )
       })
     })
 
     describe('with the draft attribute', function () {
-      beforeEach(function (done) {
-        this.res.callback = done
+      beforeEach(async function () {
         this.req.body = { draft: true }
-        this.CompileController.compile(this.req, this.res, this.next)
+        await this.CompileController.compile(this.req, this.res, this.next)
       })
 
       it('should do the compile without the draft compile flag', function () {
-        this.CompileManager.compile.should.have.been.calledWith(
+        this.CompileManager.promises.compile.should.have.been.calledWith(
           this.projectId,
           this.user_id,
           {
             isAutoCompile: false,
+            compileFromClsiCache: false,
+            populateClsiCache: false,
             enablePdfCaching: false,
             draft: true,
             fileLineErrors: false,
             stopOnFirstError: false,
+            editorId: undefined,
+          }
+        )
+      })
+    })
+
+    describe('with an editor id', function () {
+      beforeEach(async function () {
+        this.req.body = { editorId: 'the-editor-id' }
+        await this.CompileController.compile(this.req, this.res, this.next)
+      })
+
+      it('should pass the editor id to the compiler', function () {
+        this.CompileManager.promises.compile.should.have.been.calledWith(
+          this.projectId,
+          this.user_id,
+          {
+            isAutoCompile: false,
+            compileFromClsiCache: false,
+            populateClsiCache: false,
+            enablePdfCaching: false,
+            fileLineErrors: false,
+            stopOnFirstError: false,
+            editorId: 'the-editor-id',
           }
         )
       })
@@ -320,25 +351,29 @@ describe('CompileController', function () {
       this.submission_id = 'sub-1234'
       this.req.params = { submission_id: this.submission_id }
       this.req.body = {}
-      this.ClsiManager.sendExternalRequest = sinon
-        .stub()
-        .callsArgWith(
-          3,
-          null,
-          (this.status = 'success'),
-          (this.outputFiles = ['mock-output-files']),
-          (this.clsiServerId = 'mock-server-id'),
-          (this.validationProblems = null)
-        )
+      this.ClsiManager.promises.sendExternalRequest = sinon.stub().resolves({
+        status: (this.status = 'success'),
+        outputFiles: (this.outputFiles = ['mock-output-files']),
+        clsiServerId: 'mock-server-id',
+        validationProblems: null,
+      })
     })
 
-    it('should set the content-type of the response to application/json', function () {
-      this.CompileController.compileSubmission(this.req, this.res, this.next)
+    it('should set the content-type of the response to application/json', async function () {
+      await this.CompileController.compileSubmission(
+        this.req,
+        this.res,
+        this.next
+      )
       this.res.contentType.calledWith('application/json').should.equal(true)
     })
 
-    it('should send a successful response reporting the status and files', function () {
-      this.CompileController.compileSubmission(this.req, this.res, this.next)
+    it('should send a successful response reporting the status and files', async function () {
+      await this.CompileController.compileSubmission(
+        this.req,
+        this.res,
+        this.next
+      )
       this.res.statusCode.should.equal(200)
       this.res.body.should.equal(
         JSON.stringify({
@@ -360,7 +395,7 @@ describe('CompileController', function () {
       })
 
       it('should use the supplied values', function () {
-        this.ClsiManager.sendExternalRequest.should.have.been.calledWith(
+        this.ClsiManager.promises.sendExternalRequest.should.have.been.calledWith(
           this.submission_id,
           { compileGroup: 'special', timeout: 600 },
           { compileGroup: 'special', compileBackendClass: 'n2d', timeout: 600 }
@@ -380,7 +415,7 @@ describe('CompileController', function () {
       })
 
       it('should use the other options but default values for compileGroup and timeout', function () {
-        this.ClsiManager.sendExternalRequest.should.have.been.calledWith(
+        this.ClsiManager.promises.sendExternalRequest.should.have.been.calledWith(
           this.submission_id,
           {
             rootResourcePath: 'main.tex',
@@ -404,24 +439,21 @@ describe('CompileController', function () {
 
   describe('downloadPdf', function () {
     beforeEach(function () {
+      this.CompileController._proxyToClsi = sinon.stub().resolves()
       this.req.params = { Project_id: this.projectId }
-
       this.project = { name: 'test namè; 1' }
-      this.ProjectGetter.getProject = sinon
+      this.ProjectGetter.promises.getProject = sinon
         .stub()
-        .callsArgWith(2, null, this.project)
+        .resolves(this.project)
     })
 
     describe('when downloading for embedding', function () {
-      beforeEach(function (done) {
-        this.CompileController.proxyToClsi = sinon
-          .stub()
-          .callsFake(() => done())
-        this.CompileController.downloadPdf(this.req, this.res, this.next)
+      beforeEach(async function () {
+        await this.CompileController.downloadPdf(this.req, this.res, this.next)
       })
 
       it('should look up the project', function () {
-        this.ProjectGetter.getProject
+        this.ProjectGetter.promises.getProject
           .calledWith(this.projectId, { name: 1 })
           .should.equal(true)
       })
@@ -441,49 +473,72 @@ describe('CompileController', function () {
       })
 
       it('should proxy the PDF from the CLSI', function () {
-        this.CompileController.proxyToClsi
+        this.CompileController._proxyToClsi
           .calledWith(
             this.projectId,
             'output-file',
             `/project/${this.projectId}/user/${this.user_id}/output/output.pdf`,
             {},
             this.req,
-            this.res,
-            this.next
+            this.res
           )
           .should.equal(true)
       })
     })
 
     describe('when a build-id is provided', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.req.params.build_id = this.build_id
-        this.CompileController.proxyToClsi = sinon
-          .stub()
-          .callsFake(() => done())
-        this.CompileController.downloadPdf(this.req, this.res, this.next)
+        await this.CompileController.downloadPdf(this.req, this.res, this.next)
       })
 
       it('should proxy the PDF from the CLSI, with a build-id', function () {
-        this.CompileController.proxyToClsi
+        this.CompileController._proxyToClsi
           .calledWith(
             this.projectId,
             'output-file',
             `/project/${this.projectId}/user/${this.user_id}/build/${this.build_id}/output/output.pdf`,
             {},
             this.req,
-            this.res,
-            this.next
+            this.res
           )
           .should.equal(true)
       })
     })
+
+    describe('when rate-limited', function () {
+      beforeEach(async function () {
+        this.rateLimiter.consume.rejects({
+          msBeforeNext: 250,
+          remainingPoints: 0,
+          consumedPoints: 5,
+          isFirstInDuration: false,
+        })
+      })
+      it('should return 500', async function () {
+        await this.CompileController.downloadPdf(this.req, this.res, this.next)
+        // should it be 429 instead?
+        this.res.sendStatus.calledWith(500).should.equal(true)
+        this.CompileController._proxyToClsi.should.not.have.been.called
+      })
+    })
+
+    describe('when rate-limit errors', function () {
+      beforeEach(async function () {
+        this.rateLimiter.consume.rejects(new Error('uh oh'))
+      })
+      it('should return 500', async function () {
+        await this.CompileController.downloadPdf(this.req, this.res, this.next)
+        this.res.sendStatus.calledWith(500).should.equal(true)
+        this.CompileController._proxyToClsi.should.not.have.been.called
+      })
+    })
   })
 
   describe('getFileFromClsiWithoutUser', function () {
     beforeEach(function () {
       this.submission_id = 'sub-1234'
-      this.file = 'project.pdf'
+      this.file = 'output.pdf'
       this.req.params = {
         submission_id: this.submission_id,
         build_id: this.build_id,
@@ -491,12 +546,12 @@ describe('CompileController', function () {
       }
       this.req.body = {}
       this.expected_url = `/project/${this.submission_id}/build/${this.build_id}/output/${this.file}`
-      this.CompileController.proxyToClsiWithLimits = sinon.stub()
+      this.CompileController._proxyToClsiWithLimits = sinon.stub()
     })
 
     describe('without limits specified', function () {
-      beforeEach(function () {
-        this.CompileController.getFileFromClsiWithoutUser(
+      beforeEach(async function () {
+        await this.CompileController.getFileFromClsiWithoutUser(
           this.req,
           this.res,
           this.next
@@ -504,15 +559,12 @@ describe('CompileController', function () {
       })
 
       it('should proxy to CLSI with correct URL and default limits', function () {
-        this.CompileController.proxyToClsiWithLimits.should.have.been.calledWith(
+        this.CompileController._proxyToClsiWithLimits.should.have.been.calledWith(
           this.submission_id,
           'output-file',
           this.expected_url,
           {},
-          {
-            compileGroup: 'standard',
-            compileBackendClass: 'n2d',
-          }
+          { compileGroup: 'standard', compileBackendClass: 'n2d' }
         )
       })
     })
@@ -528,7 +580,7 @@ describe('CompileController', function () {
       })
 
       it('should proxy to CLSI with correct URL and specified limits', function () {
-        this.CompileController.proxyToClsiWithLimits.should.have.been.calledWith(
+        this.CompileController._proxyToClsiWithLimits.should.have.been.calledWith(
           this.submission_id,
           'output-file',
           this.expected_url,
@@ -542,72 +594,90 @@ describe('CompileController', function () {
     })
   })
   describe('proxySyncCode', function () {
-    let file, line, column, imageName
+    let file, line, column, imageName, editorId, buildId
 
-    beforeEach(function (done) {
+    beforeEach(async function () {
       this.req.params = { Project_id: this.projectId }
       file = 'main.tex'
       line = String(Date.now())
       column = String(Date.now() + 1)
-      this.req.query = { file, line, column }
+      editorId = '172977cb-361e-4854-a4dc-a71cf11512e5'
+      buildId = '195b4a3f9e7-03e5be430a9e7796'
+      this.req.query = { file, line, column, editorId, buildId }
 
       imageName = 'foo/bar:tag-0'
-      this.ProjectGetter.getProject = sinon.stub().yields(null, { imageName })
+      this.ProjectGetter.promises.getProject = sinon
+        .stub()
+        .resolves({ imageName })
 
-      this.next.callsFake(done)
-      this.res.callback = done
-      this.CompileController.proxyToClsi = sinon.stub().callsFake(() => done())
+      this.CompileController._proxyToClsi = sinon.stub().resolves()
 
-      this.CompileController.proxySyncCode(this.req, this.res, this.next)
+      await this.CompileController.proxySyncCode(this.req, this.res, this.next)
     })
 
     it('should proxy the request with an imageName', function () {
-      expect(this.CompileController.proxyToClsi).to.have.been.calledWith(
+      expect(this.CompileController._proxyToClsi).to.have.been.calledWith(
         this.projectId,
         'sync-to-code',
         `/project/${this.projectId}/user/${this.user_id}/sync/code`,
-        { file, line, column, imageName },
+        {
+          file,
+          line,
+          column,
+          imageName,
+          editorId,
+          buildId,
+          compileFromClsiCache: false,
+        },
         this.req,
-        this.res,
-        this.next
+        this.res
       )
     })
   })
 
   describe('proxySyncPdf', function () {
-    let page, h, v, imageName
+    let page, h, v, imageName, editorId, buildId
 
-    beforeEach(function (done) {
+    beforeEach(async function () {
       this.req.params = { Project_id: this.projectId }
       page = String(Date.now())
       h = String(Math.random())
       v = String(Math.random())
-      this.req.query = { page, h, v }
+      editorId = '172977cb-361e-4854-a4dc-a71cf11512e5'
+      buildId = '195b4a3f9e7-03e5be430a9e7796'
+      this.req.query = { page, h, v, editorId, buildId }
 
       imageName = 'foo/bar:tag-1'
-      this.ProjectGetter.getProject = sinon.stub().yields(null, { imageName })
+      this.ProjectGetter.promises.getProject = sinon
+        .stub()
+        .resolves({ imageName })
 
-      this.next.callsFake(done)
-      this.res.callback = done
-      this.CompileController.proxyToClsi = sinon.stub().callsFake(() => done())
+      this.CompileController._proxyToClsi = sinon.stub()
 
-      this.CompileController.proxySyncPdf(this.req, this.res, this.next)
+      await this.CompileController.proxySyncPdf(this.req, this.res, this.next)
     })
 
     it('should proxy the request with an imageName', function () {
-      expect(this.CompileController.proxyToClsi).to.have.been.calledWith(
+      expect(this.CompileController._proxyToClsi).to.have.been.calledWith(
         this.projectId,
         'sync-to-pdf',
         `/project/${this.projectId}/user/${this.user_id}/sync/pdf`,
-        { page, h, v, imageName },
+        {
+          page,
+          h,
+          v,
+          imageName,
+          editorId,
+          buildId,
+          compileFromClsiCache: false,
+        },
         this.req,
-        this.res,
-        this.next
+        this.res
       )
     })
   })
 
-  describe('proxyToClsi', function () {
+  describe('_proxyToClsi', function () {
     beforeEach(function () {
       this.req.method = 'mock-method'
       this.req.headers = {
@@ -620,15 +690,14 @@ describe('CompileController', function () {
 
     describe('old pdf viewer', function () {
       describe('user with standard priority', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.CompileManager.getProjectCompileLimits = sinon
+        beforeEach(async function () {
+          this.CompileManager.promises.getProjectCompileLimits = sinon
             .stub()
-            .callsArgWith(1, null, {
+            .resolves({
               compileGroup: 'standard',
               compileBackendClass: 'e2',
             })
-          this.CompileController.proxyToClsi(
+          await this.CompileController._proxyToClsi(
             this.projectId,
             'output-file',
             (this.url = '/test'),
@@ -651,15 +720,14 @@ describe('CompileController', function () {
       })
 
       describe('user with priority compile', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.CompileManager.getProjectCompileLimits = sinon
+        beforeEach(async function () {
+          this.CompileManager.promises.getProjectCompileLimits = sinon
             .stub()
-            .callsArgWith(1, null, {
+            .resolves({
               compileGroup: 'priority',
               compileBackendClass: 'c2d',
             })
-          this.CompileController.proxyToClsi(
+          await this.CompileController._proxyToClsi(
             this.projectId,
             'output-file',
             (this.url = '/test'),
@@ -678,16 +746,15 @@ describe('CompileController', function () {
       })
 
       describe('user with standard priority via query string', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
+        beforeEach(async function () {
           this.req.query = { compileGroup: 'standard' }
-          this.CompileManager.getProjectCompileLimits = sinon
+          this.CompileManager.promises.getProjectCompileLimits = sinon
             .stub()
-            .callsArgWith(1, null, {
+            .resolves({
               compileGroup: 'standard',
               compileBackendClass: 'e2',
             })
-          this.CompileController.proxyToClsi(
+          await this.CompileController._proxyToClsi(
             this.projectId,
             'output-file',
             (this.url = '/test'),
@@ -710,16 +777,15 @@ describe('CompileController', function () {
       })
 
       describe('user with non-existent priority via query string', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
+        beforeEach(async function () {
           this.req.query = { compileGroup: 'foobar' }
-          this.CompileManager.getProjectCompileLimits = sinon
+          this.CompileManager.promises.getProjectCompileLimits = sinon
             .stub()
-            .callsArgWith(1, null, {
+            .resolves({
               compileGroup: 'standard',
               compileBackendClass: 'e2',
             })
-          this.CompileController.proxyToClsi(
+          await this.CompileController._proxyToClsi(
             this.projectId,
             'output-file',
             (this.url = '/test'),
@@ -738,16 +804,15 @@ describe('CompileController', function () {
       })
 
       describe('user with build parameter via query string', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.CompileManager.getProjectCompileLimits = sinon
+        beforeEach(async function () {
+          this.CompileManager.promises.getProjectCompileLimits = sinon
             .stub()
-            .callsArgWith(1, null, {
+            .resolves({
               compileGroup: 'standard',
               compileBackendClass: 'e2',
             })
           this.req.query = { build: 1234 }
-          this.CompileController.proxyToClsi(
+          await this.CompileController._proxyToClsi(
             this.projectId,
             'output-file',
             (this.url = '/test'),
@@ -768,16 +833,16 @@ describe('CompileController', function () {
   })
 
   describe('deleteAuxFiles', function () {
-    beforeEach(function () {
-      this.CompileManager.deleteAuxFiles = sinon.stub().yields()
+    beforeEach(async function () {
+      this.CompileManager.promises.deleteAuxFiles = sinon.stub().resolves()
       this.req.params = { Project_id: this.projectId }
       this.req.query = { clsiserverid: 'node-1' }
       this.res.sendStatus = sinon.stub()
-      this.CompileController.deleteAuxFiles(this.req, this.res, this.next)
+      await this.CompileController.deleteAuxFiles(this.req, this.res, this.next)
     })
 
     it('should proxy to the CLSI', function () {
-      this.CompileManager.deleteAuxFiles
+      this.CompileManager.promises.deleteAuxFiles
         .calledWith(this.projectId, this.user_id, 'node-1')
         .should.equal(true)
     })
@@ -795,26 +860,25 @@ describe('CompileController', function () {
         },
       }
       this.downloadPath = `/project/${this.projectId}/build/123/output/output.pdf`
-      this.CompileManager.compile.callsArgWith(3, null, 'success', [
-        {
-          path: 'output.pdf',
-          url: this.downloadPath,
-        },
-      ])
-      this.CompileController.proxyToClsi = sinon.stub()
+      this.CompileManager.promises.compile.resolves({
+        status: 'success',
+        outputFiles: [{ path: 'output.pdf', url: this.downloadPath }],
+      })
+      this.CompileController._proxyToClsi = sinon.stub()
       this.res = { send: () => {}, sendStatus: sinon.stub() }
     })
 
-    it('should call compile in the compile manager', function (done) {
-      this.CompileController.compileAndDownloadPdf(this.req, this.res)
-      this.CompileManager.compile.calledWith(this.projectId).should.equal(true)
-      done()
+    it('should call compile in the compile manager', async function () {
+      await this.CompileController.compileAndDownloadPdf(this.req, this.res)
+      this.CompileManager.promises.compile
+        .calledWith(this.projectId)
+        .should.equal(true)
     })
 
-    it('should proxy the res to the clsi with correct url', function (done) {
-      this.CompileController.compileAndDownloadPdf(this.req, this.res)
+    it('should proxy the res to the clsi with correct url', async function () {
+      await this.CompileController.compileAndDownloadPdf(this.req, this.res)
       sinon.assert.calledWith(
-        this.CompileController.proxyToClsi,
+        this.CompileController._proxyToClsi,
         this.projectId,
         'output-file',
         this.downloadPath,
@@ -823,7 +887,7 @@ describe('CompileController', function () {
         this.res
       )
 
-      this.CompileController.proxyToClsi
+      this.CompileController._proxyToClsi
         .calledWith(
           this.projectId,
           'output-file',
@@ -833,38 +897,44 @@ describe('CompileController', function () {
           this.res
         )
         .should.equal(true)
-      done()
     })
 
-    it('should not download anything on compilation failures', function () {
-      this.CompileManager.compile.yields(new Error('failed'))
-      this.CompileController.compileAndDownloadPdf(this.req, this.res)
+    it('should not download anything on compilation failures', async function () {
+      this.CompileManager.promises.compile.rejects(new Error('failed'))
+      await this.CompileController.compileAndDownloadPdf(
+        this.req,
+        this.res,
+        this.next
+      )
       this.res.sendStatus.should.have.been.calledWith(500)
-      this.CompileController.proxyToClsi.should.not.have.been.called
+      this.CompileController._proxyToClsi.should.not.have.been.called
     })
 
-    it('should not download anything on missing pdf', function () {
-      this.CompileManager.compile.yields(null, 'success', [])
-      this.CompileController.compileAndDownloadPdf(this.req, this.res)
+    it('should not download anything on missing pdf', async function () {
+      this.CompileManager.promises.compile.resolves({
+        status: 'success',
+        outputFiles: [],
+      })
+      await this.CompileController.compileAndDownloadPdf(this.req, this.res)
       this.res.sendStatus.should.have.been.calledWith(500)
-      this.CompileController.proxyToClsi.should.not.have.been.called
+      this.CompileController._proxyToClsi.should.not.have.been.called
     })
   })
 
   describe('wordCount', function () {
-    beforeEach(function () {
-      this.CompileManager.wordCount = sinon
+    beforeEach(async function () {
+      this.CompileManager.promises.wordCount = sinon
         .stub()
-        .yields(null, { content: 'body' })
+        .resolves({ content: 'body' })
       this.req.params = { Project_id: this.projectId }
       this.req.query = { clsiserverid: 'node-42' }
       this.res.json = sinon.stub()
       this.res.contentType = sinon.stub()
-      this.CompileController.wordCount(this.req, this.res, this.next)
+      await this.CompileController.wordCount(this.req, this.res, this.next)
     })
 
     it('should proxy to the CLSI', function () {
-      this.CompileManager.wordCount
+      this.CompileManager.promises.wordCount
         .calledWith(this.projectId, this.user_id, false, 'node-42')
         .should.equal(true)
     })
diff --git a/services/web/test/unit/src/Compile/CompileManagerTests.js b/services/web/test/unit/src/Compile/CompileManagerTests.js
index 41b27cbd69..908e2fe803 100644
--- a/services/web/test/unit/src/Compile/CompileManagerTests.js
+++ b/services/web/test/unit/src/Compile/CompileManagerTests.js
@@ -139,7 +139,7 @@ describe('CompileManager', function () {
     })
 
     describe('when the project has been recently compiled', function () {
-      it('should return', function (done) {
+      it('should return', async function () {
         this.CompileManager._checkIfAutoCompileLimitHasBeenHit = async (
           isAutoCompile,
           compileGroup
@@ -147,32 +147,27 @@ describe('CompileManager', function () {
         this.CompileManager._checkIfRecentlyCompiled = sinon
           .stub()
           .resolves(true)
-        this.CompileManager.promises
-          .compile(this.project_id, this.user_id, {})
-          .then(({ status }) => {
-            status.should.equal('too-recently-compiled')
-            done()
-          })
-          .catch(error => {
-            // Catch any errors and fail the test
-            true.should.equal(false)
-            done(error)
-          })
+        const { status } = await this.CompileManager.promises.compile(
+          this.project_id,
+          this.user_id,
+          {}
+        )
+        status.should.equal('too-recently-compiled')
       })
     })
 
     describe('should check the rate limit', function () {
-      it('should return', function (done) {
+      it('should return', async function () {
         this.CompileManager._checkIfAutoCompileLimitHasBeenHit = sinon
           .stub()
           .resolves(false)
-        this.CompileManager.promises
-          .compile(this.project_id, this.user_id, {})
-          .then(({ status }) => {
-            expect(status).to.equal('autocompile-backoff')
-            done()
-          })
-          .catch(err => done(err))
+        const { status } = await this.CompileManager.promises.compile(
+          this.project_id,
+          this.user_id,
+          {}
+        )
+
+        expect(status).to.equal('autocompile-backoff')
       })
     })
   })
@@ -250,15 +245,12 @@ describe('CompileManager', function () {
       beforeEach(function () {
         this.features.compileGroup = 'priority'
       })
-      it('should return the default class', function (done) {
-        this.CompileManager.getProjectCompileLimits(
-          this.project_id,
-          (err, { compileBackendClass }) => {
-            if (err) return done(err)
-            expect(compileBackendClass).to.equal('c2d')
-            done()
-          }
-        )
+      it('should return the default class', async function () {
+        const { compileBackendClass } =
+          await this.CompileManager.promises.getProjectCompileLimits(
+            this.project_id
+          )
+        expect(compileBackendClass).to.equal('c2d')
       })
     })
   })
diff --git a/services/web/test/unit/src/Contact/ContactController.test.mjs b/services/web/test/unit/src/Contact/ContactController.test.mjs
new file mode 100644
index 0000000000..06dd5b768a
--- /dev/null
+++ b/services/web/test/unit/src/Contact/ContactController.test.mjs
@@ -0,0 +1,159 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+const modulePath = '../../../../app/src/Features/Contacts/ContactController.mjs'
+
+describe('ContactController', function () {
+  beforeEach(async function (ctx) {
+    ctx.SessionManager = { getLoggedInUserId: sinon.stub() }
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: (ctx.UserGetter = {
+        promises: {},
+      }),
+    }))
+
+    vi.doMock('../../../../app/src/Features/Contacts/ContactManager', () => ({
+      default: (ctx.ContactManager = { promises: {} }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: (ctx.SessionManager = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: (ctx.Modules = {
+        promises: { hooks: {} },
+      }),
+    }))
+
+    ctx.ContactController = (await import(modulePath)).default
+
+    ctx.req = {}
+    ctx.res = new MockResponse()
+  })
+
+  describe('getContacts', function () {
+    beforeEach(function (ctx) {
+      ctx.user_id = 'mock-user-id'
+      ctx.contact_ids = ['contact-1', 'contact-2', 'contact-3']
+      ctx.contacts = [
+        {
+          _id: 'contact-1',
+          email: 'joe@example.com',
+          first_name: 'Joe',
+          last_name: 'Example',
+          unsued: 'foo',
+        },
+        {
+          _id: 'contact-2',
+          email: 'jane@example.com',
+          first_name: 'Jane',
+          last_name: 'Example',
+          unsued: 'foo',
+          holdingAccount: true,
+        },
+        {
+          _id: 'contact-3',
+          email: 'jim@example.com',
+          first_name: 'Jim',
+          last_name: 'Example',
+          unsued: 'foo',
+        },
+      ]
+      ctx.SessionManager.getLoggedInUserId = sinon.stub().returns(ctx.user_id)
+      ctx.ContactManager.promises.getContactIds = sinon
+        .stub()
+        .resolves(ctx.contact_ids)
+      ctx.UserGetter.promises.getUsers = sinon.stub().resolves(ctx.contacts)
+      ctx.Modules.promises.hooks.fire = sinon.stub()
+    })
+
+    it('should look up the logged in user id', async function (ctx) {
+      ctx.ContactController.getContacts(ctx.req, ctx.res)
+      ctx.SessionManager.getLoggedInUserId
+        .calledWith(ctx.req.session)
+        .should.equal(true)
+    })
+
+    it('should get the users contact ids', async function (ctx) {
+      ctx.res.callback = () => {
+        expect(
+          ctx.ContactManager.promises.getContactIds
+        ).to.have.been.calledWith(ctx.user_id, { limit: 50 })
+      }
+      ctx.ContactController.getContacts(ctx.req, ctx.res)
+    })
+
+    it('should populate the users contacts ids', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.UserGetter.promises.getUsers).to.have.been.calledWith(
+            ctx.contact_ids,
+            {
+              email: 1,
+              first_name: 1,
+              last_name: 1,
+              holdingAccount: 1,
+            }
+          )
+          resolve()
+        }
+        ctx.ContactController.getContacts(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should fire the getContact module hook', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.Modules.promises.hooks.fire).to.have.been.calledWith(
+            'getContacts',
+            ctx.user_id
+          )
+          resolve()
+        }
+        ctx.ContactController.getContacts(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should return a formatted list of contacts in contact list order, without holding accounts', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.json.args[0][0].contacts.should.deep.equal([
+            {
+              id: 'contact-1',
+              email: 'joe@example.com',
+              first_name: 'Joe',
+              last_name: 'Example',
+              type: 'user',
+            },
+            {
+              id: 'contact-3',
+              email: 'jim@example.com',
+              first_name: 'Jim',
+              last_name: 'Example',
+              type: 'user',
+            },
+          ])
+          resolve()
+        }
+        ctx.ContactController.getContacts(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Contact/ContactControllerTests.mjs b/services/web/test/unit/src/Contact/ContactControllerTests.mjs
deleted file mode 100644
index ea5a1d0220..0000000000
--- a/services/web/test/unit/src/Contact/ContactControllerTests.mjs
+++ /dev/null
@@ -1,129 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import MockResponse from '../helpers/MockResponse.js'
-const modulePath = '../../../../app/src/Features/Contacts/ContactController.mjs'
-
-describe('ContactController', function () {
-  beforeEach(async function () {
-    this.SessionManager = { getLoggedInUserId: sinon.stub() }
-    this.ContactController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/User/UserGetter': (this.UserGetter = {
-        promises: {},
-      }),
-      '../../../../app/src/Features/Contacts/ContactManager':
-        (this.ContactManager = { promises: {} }),
-      '../../../../app/src/Features/Authentication/SessionManager':
-        (this.SessionManager = {}),
-      '../../../../app/src/infrastructure/Modules': (this.Modules = {
-        promises: { hooks: {} },
-      }),
-    })
-
-    this.req = {}
-    this.res = new MockResponse()
-  })
-
-  describe('getContacts', function () {
-    beforeEach(function () {
-      this.user_id = 'mock-user-id'
-      this.contact_ids = ['contact-1', 'contact-2', 'contact-3']
-      this.contacts = [
-        {
-          _id: 'contact-1',
-          email: 'joe@example.com',
-          first_name: 'Joe',
-          last_name: 'Example',
-          unsued: 'foo',
-        },
-        {
-          _id: 'contact-2',
-          email: 'jane@example.com',
-          first_name: 'Jane',
-          last_name: 'Example',
-          unsued: 'foo',
-          holdingAccount: true,
-        },
-        {
-          _id: 'contact-3',
-          email: 'jim@example.com',
-          first_name: 'Jim',
-          last_name: 'Example',
-          unsued: 'foo',
-        },
-      ]
-      this.SessionManager.getLoggedInUserId = sinon.stub().returns(this.user_id)
-      this.ContactManager.promises.getContactIds = sinon
-        .stub()
-        .resolves(this.contact_ids)
-      this.UserGetter.promises.getUsers = sinon.stub().resolves(this.contacts)
-      this.Modules.promises.hooks.fire = sinon.stub()
-    })
-
-    it('should look up the logged in user id', async function () {
-      this.ContactController.getContacts(this.req, this.res)
-      this.SessionManager.getLoggedInUserId
-        .calledWith(this.req.session)
-        .should.equal(true)
-    })
-
-    it('should get the users contact ids', async function () {
-      this.res.callback = () => {
-        expect(
-          this.ContactManager.promises.getContactIds
-        ).to.have.been.calledWith(this.user_id, { limit: 50 })
-      }
-      this.ContactController.getContacts(this.req, this.res)
-    })
-
-    it('should populate the users contacts ids', function (done) {
-      this.res.callback = () => {
-        expect(this.UserGetter.promises.getUsers).to.have.been.calledWith(
-          this.contact_ids,
-          {
-            email: 1,
-            first_name: 1,
-            last_name: 1,
-            holdingAccount: 1,
-          }
-        )
-        done()
-      }
-      this.ContactController.getContacts(this.req, this.res, done)
-    })
-
-    it('should fire the getContact module hook', function (done) {
-      this.res.callback = () => {
-        expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
-          'getContacts',
-          this.user_id
-        )
-        done()
-      }
-      this.ContactController.getContacts(this.req, this.res, done)
-    })
-
-    it('should return a formatted list of contacts in contact list order, without holding accounts', function (done) {
-      this.res.callback = () => {
-        this.res.json.args[0][0].contacts.should.deep.equal([
-          {
-            id: 'contact-1',
-            email: 'joe@example.com',
-            first_name: 'Joe',
-            last_name: 'Example',
-            type: 'user',
-          },
-          {
-            id: 'contact-3',
-            email: 'jim@example.com',
-            first_name: 'Jim',
-            last_name: 'Example',
-            type: 'user',
-          },
-        ])
-        done()
-      }
-      this.ContactController.getContacts(this.req, this.res, done)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Cooldown/CooldownManagerTests.js b/services/web/test/unit/src/Cooldown/CooldownManagerTests.js
index ba4245ee55..7efefe1b04 100644
--- a/services/web/test/unit/src/Cooldown/CooldownManagerTests.js
+++ b/services/web/test/unit/src/Cooldown/CooldownManagerTests.js
@@ -1,15 +1,3 @@
-/* eslint-disable
-    n/handle-callback-err,
-    max-len,
-    no-return-assign,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const SandboxedModule = require('sandboxed-module')
 const sinon = require('sinon')
 const { expect } = require('chai')
@@ -23,158 +11,143 @@ describe('CooldownManager', function () {
     this.projectId = 'abcdefg'
     this.rclient = { set: sinon.stub(), get: sinon.stub() }
     this.RedisWrapper = { client: () => this.rclient }
-    return (this.CooldownManager = SandboxedModule.require(modulePath, {
+    this.CooldownManager = SandboxedModule.require(modulePath, {
       requires: {
         '../../infrastructure/RedisWrapper': this.RedisWrapper,
       },
-    }))
+    })
   })
 
   describe('_buildKey', function () {
     it('should build a properly formatted redis key', function () {
-      return expect(this.CooldownManager._buildKey('ABC')).to.equal(
-        'Cooldown:{ABC}'
-      )
+      expect(this.CooldownManager._buildKey('ABC')).to.equal('Cooldown:{ABC}')
     })
   })
 
   describe('isProjectOnCooldown', function () {
-    beforeEach(function () {
-      return (this.call = cb => {
-        return this.CooldownManager.isProjectOnCooldown(this.projectId, cb)
-      })
-    })
-
     describe('when project is on cooldown', function () {
       beforeEach(function () {
-        return (this.rclient.get = sinon.stub().callsArgWith(1, null, '1'))
+        this.rclient.get = sinon.stub().callsArgWith(1, null, '1')
       })
 
-      it('should fetch key from redis', function (done) {
-        return this.call((err, result) => {
-          this.rclient.get.callCount.should.equal(1)
-          this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
-          return done()
-        })
+      it('should fetch key from redis', async function () {
+        await this.CooldownManager.promises.isProjectOnCooldown(this.projectId)
+        this.rclient.get.callCount.should.equal(1)
+        this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
       })
 
-      it('should not produce an error', function (done) {
-        return this.call((err, result) => {
-          expect(err).to.equal(null)
-          return done()
-        })
-      })
-
-      it('should produce a true result', function (done) {
-        return this.call((err, result) => {
-          expect(result).to.equal(true)
-          return done()
-        })
+      it('should produce a true result', async function () {
+        const result = await this.CooldownManager.promises.isProjectOnCooldown(
+          this.projectId
+        )
+        expect(result).to.equal(true)
       })
     })
 
     describe('when project is not on cooldown', function () {
       beforeEach(function () {
-        return (this.rclient.get = sinon.stub().callsArgWith(1, null, null))
+        this.rclient.get = sinon.stub().callsArgWith(1, null, null)
       })
 
-      it('should fetch key from redis', function (done) {
-        return this.call((err, result) => {
-          this.rclient.get.callCount.should.equal(1)
-          this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
-          return done()
-        })
+      it('should fetch key from redis', async function () {
+        await this.CooldownManager.promises.isProjectOnCooldown(this.projectId)
+        this.rclient.get.callCount.should.equal(1)
+        this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
       })
 
-      it('should not produce an error', function (done) {
-        return this.call((err, result) => {
-          expect(err).to.equal(null)
-          return done()
-        })
-      })
-
-      it('should produce a false result', function (done) {
-        return this.call((err, result) => {
-          expect(result).to.equal(false)
-          return done()
-        })
+      it('should produce a false result', async function () {
+        const result = await this.CooldownManager.promises.isProjectOnCooldown(
+          this.projectId
+        )
+        expect(result).to.equal(false)
       })
     })
 
     describe('when rclient.get produces an error', function () {
       beforeEach(function () {
-        return (this.rclient.get = sinon
-          .stub()
-          .callsArgWith(1, new Error('woops')))
+        this.rclient.get = sinon.stub().callsArgWith(1, new Error('woops'))
       })
 
-      it('should fetch key from redis', function (done) {
-        return this.call((err, result) => {
-          this.rclient.get.callCount.should.equal(1)
-          this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
-          return done()
-        })
+      it('should fetch key from redis', async function () {
+        try {
+          await this.CooldownManager.promises.isProjectOnCooldown(
+            this.projectId
+          )
+        } catch {
+          // ignore errors - expected
+        }
+        this.rclient.get.callCount.should.equal(1)
+        this.rclient.get.calledWith('Cooldown:{abcdefg}').should.equal(true)
       })
 
-      it('should produce an error', function (done) {
-        return this.call((err, result) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          return done()
-        })
+      it('should produce an error', async function () {
+        let error
+
+        try {
+          await this.CooldownManager.promises.isProjectOnCooldown(
+            this.projectId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
   })
 
   describe('putProjectOnCooldown', function () {
-    beforeEach(function () {
-      return (this.call = cb => {
-        return this.CooldownManager.putProjectOnCooldown(this.projectId, cb)
-      })
-    })
-
     describe('when rclient.set does not produce an error', function () {
       beforeEach(function () {
-        return (this.rclient.set = sinon.stub().callsArgWith(4, null))
+        this.rclient.set = sinon.stub().callsArgWith(4, null)
       })
 
-      it('should set a key in redis', function (done) {
-        return this.call(err => {
-          this.rclient.set.callCount.should.equal(1)
-          this.rclient.set.calledWith('Cooldown:{abcdefg}').should.equal(true)
-          return done()
-        })
+      it('should set a key in redis', async function () {
+        await this.CooldownManager.promises.putProjectOnCooldown(this.projectId)
+        this.rclient.set.callCount.should.equal(1)
+        this.rclient.set.calledWith('Cooldown:{abcdefg}').should.equal(true)
       })
 
-      it('should not produce an error', function (done) {
-        return this.call(err => {
-          expect(err).to.equal(null)
-          return done()
-        })
+      it('should not produce an error', async function () {
+        let error
+        try {
+          await this.CooldownManager.promises.putProjectOnCooldown(
+            this.projectId
+          )
+        } catch (err) {
+          error = err
+        }
+        expect(error).not.to.exist
       })
     })
 
     describe('when rclient.set produces an error', function () {
       beforeEach(function () {
-        return (this.rclient.set = sinon
-          .stub()
-          .callsArgWith(4, new Error('woops')))
+        this.rclient.set = sinon.stub().callsArgWith(4, new Error('woops'))
       })
 
-      it('should set a key in redis', function (done) {
-        return this.call(err => {
-          this.rclient.set.callCount.should.equal(1)
-          this.rclient.set.calledWith('Cooldown:{abcdefg}').should.equal(true)
-          return done()
-        })
+      it('should set a key in redis', async function () {
+        try {
+          await this.CooldownManager.promises.putProjectOnCooldown(
+            this.projectId
+          )
+        } catch {
+          // ignore errors - expected
+        }
+        this.rclient.set.callCount.should.equal(1)
+        this.rclient.set.calledWith('Cooldown:{abcdefg}').should.equal(true)
       })
 
-      it('produce an error', function (done) {
-        return this.call(err => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          return done()
-        })
+      it('produce an error', async function () {
+        let error
+        try {
+          await this.CooldownManager.promises.putProjectOnCooldown(
+            this.projectId
+          )
+        } catch (err) {
+          error = err
+        }
+        expect(error).to.be.instanceOf(Error)
       })
     })
   })
diff --git a/services/web/test/unit/src/Cooldown/CooldownMiddleware.test.mjs b/services/web/test/unit/src/Cooldown/CooldownMiddleware.test.mjs
new file mode 100644
index 0000000000..846a54d4ce
--- /dev/null
+++ b/services/web/test/unit/src/Cooldown/CooldownMiddleware.test.mjs
@@ -0,0 +1,125 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+const modulePath = new URL(
+  '../../../../app/src/Features/Cooldown/CooldownMiddleware.mjs',
+  import.meta.url
+).pathname
+
+describe('CooldownMiddleware', function () {
+  beforeEach(async function (ctx) {
+    ctx.CooldownManager = { isProjectOnCooldown: sinon.stub() }
+
+    vi.doMock(
+      '../../../../app/src/Features/Cooldown/CooldownManager.js',
+      () => ({
+        default: ctx.CooldownManager,
+      })
+    )
+
+    ctx.CooldownMiddleware = (await import(modulePath)).default
+  })
+
+  describe('freezeProject', function () {
+    describe('when project is on cooldown', function () {
+      beforeEach(function (ctx) {
+        ctx.CooldownManager.isProjectOnCooldown = sinon
+          .stub()
+          .callsArgWith(1, null, true)
+        ctx.req = { params: { Project_id: 'abc' } }
+        ctx.res = { sendStatus: sinon.stub() }
+        return (ctx.next = sinon.stub())
+      })
+
+      it('should call CooldownManager.isProjectOnCooldown', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
+        return ctx.CooldownManager.isProjectOnCooldown
+          .calledWith('abc')
+          .should.equal(true)
+      })
+
+      it('should not produce an error', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        return ctx.next.callCount.should.equal(0)
+      })
+
+      it('should send a 429 status', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.res.sendStatus.callCount.should.equal(1)
+        return ctx.res.sendStatus.calledWith(429).should.equal(true)
+      })
+    })
+
+    describe('when project is not on cooldown', function () {
+      beforeEach(function (ctx) {
+        ctx.CooldownManager.isProjectOnCooldown = sinon
+          .stub()
+          .callsArgWith(1, null, false)
+        ctx.req = { params: { Project_id: 'abc' } }
+        ctx.res = { sendStatus: sinon.stub() }
+        return (ctx.next = sinon.stub())
+      })
+
+      it('should call CooldownManager.isProjectOnCooldown', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
+        return ctx.CooldownManager.isProjectOnCooldown
+          .calledWith('abc')
+          .should.equal(true)
+      })
+
+      it('call next with no arguments', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.next.callCount.should.equal(1)
+        return expect(ctx.next.lastCall.args.length).to.equal(0)
+      })
+    })
+
+    describe('when isProjectOnCooldown produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.CooldownManager.isProjectOnCooldown = sinon
+          .stub()
+          .callsArgWith(1, new Error('woops'))
+        ctx.req = { params: { Project_id: 'abc' } }
+        ctx.res = { sendStatus: sinon.stub() }
+        return (ctx.next = sinon.stub())
+      })
+
+      it('should call CooldownManager.isProjectOnCooldown', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
+        return ctx.CooldownManager.isProjectOnCooldown
+          .calledWith('abc')
+          .should.equal(true)
+      })
+
+      it('call next with an error', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.next.callCount.should.equal(1)
+        return expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+    })
+
+    describe('when projectId is not part of route', function () {
+      beforeEach(function (ctx) {
+        ctx.CooldownManager.isProjectOnCooldown = sinon
+          .stub()
+          .callsArgWith(1, null, true)
+        ctx.req = { params: { lol: 'abc' } }
+        ctx.res = { sendStatus: sinon.stub() }
+        return (ctx.next = sinon.stub())
+      })
+
+      it('call next with an error', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        ctx.next.callCount.should.equal(1)
+        return expect(ctx.next.lastCall.args[0]).to.be.instanceof(Error)
+      })
+
+      it('should not call CooldownManager.isProjectOnCooldown', function (ctx) {
+        ctx.CooldownMiddleware.freezeProject(ctx.req, ctx.res, ctx.next)
+        return ctx.CooldownManager.isProjectOnCooldown.callCount.should.equal(0)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Cooldown/CooldownMiddlewareTests.mjs b/services/web/test/unit/src/Cooldown/CooldownMiddlewareTests.mjs
deleted file mode 100644
index 22d05fba56..0000000000
--- a/services/web/test/unit/src/Cooldown/CooldownMiddlewareTests.mjs
+++ /dev/null
@@ -1,134 +0,0 @@
-/* eslint-disable
-    max-len,
-    no-return-assign,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-const modulePath = new URL(
-  '../../../../app/src/Features/Cooldown/CooldownMiddleware.mjs',
-  import.meta.url
-).pathname
-
-describe('CooldownMiddleware', function () {
-  beforeEach(async function () {
-    this.CooldownManager = { isProjectOnCooldown: sinon.stub() }
-    return (this.CooldownMiddleware = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Cooldown/CooldownManager.js':
-        this.CooldownManager,
-    }))
-  })
-
-  describe('freezeProject', function () {
-    describe('when project is on cooldown', function () {
-      beforeEach(function () {
-        this.CooldownManager.isProjectOnCooldown = sinon
-          .stub()
-          .callsArgWith(1, null, true)
-        this.req = { params: { Project_id: 'abc' } }
-        this.res = { sendStatus: sinon.stub() }
-        return (this.next = sinon.stub())
-      })
-
-      it('should call CooldownManager.isProjectOnCooldown', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
-        return this.CooldownManager.isProjectOnCooldown
-          .calledWith('abc')
-          .should.equal(true)
-      })
-
-      it('should not produce an error', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        return this.next.callCount.should.equal(0)
-      })
-
-      it('should send a 429 status', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.res.sendStatus.callCount.should.equal(1)
-        return this.res.sendStatus.calledWith(429).should.equal(true)
-      })
-    })
-
-    describe('when project is not on cooldown', function () {
-      beforeEach(function () {
-        this.CooldownManager.isProjectOnCooldown = sinon
-          .stub()
-          .callsArgWith(1, null, false)
-        this.req = { params: { Project_id: 'abc' } }
-        this.res = { sendStatus: sinon.stub() }
-        return (this.next = sinon.stub())
-      })
-
-      it('should call CooldownManager.isProjectOnCooldown', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
-        return this.CooldownManager.isProjectOnCooldown
-          .calledWith('abc')
-          .should.equal(true)
-      })
-
-      it('call next with no arguments', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.next.callCount.should.equal(1)
-        return expect(this.next.lastCall.args.length).to.equal(0)
-      })
-    })
-
-    describe('when isProjectOnCooldown produces an error', function () {
-      beforeEach(function () {
-        this.CooldownManager.isProjectOnCooldown = sinon
-          .stub()
-          .callsArgWith(1, new Error('woops'))
-        this.req = { params: { Project_id: 'abc' } }
-        this.res = { sendStatus: sinon.stub() }
-        return (this.next = sinon.stub())
-      })
-
-      it('should call CooldownManager.isProjectOnCooldown', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.CooldownManager.isProjectOnCooldown.callCount.should.equal(1)
-        return this.CooldownManager.isProjectOnCooldown
-          .calledWith('abc')
-          .should.equal(true)
-      })
-
-      it('call next with an error', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.next.callCount.should.equal(1)
-        return expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-    })
-
-    describe('when projectId is not part of route', function () {
-      beforeEach(function () {
-        this.CooldownManager.isProjectOnCooldown = sinon
-          .stub()
-          .callsArgWith(1, null, true)
-        this.req = { params: { lol: 'abc' } }
-        this.res = { sendStatus: sinon.stub() }
-        return (this.next = sinon.stub())
-      })
-
-      it('call next with an error', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        this.next.callCount.should.equal(1)
-        return expect(this.next.lastCall.args[0]).to.be.instanceof(Error)
-      })
-
-      it('should not call CooldownManager.isProjectOnCooldown', function () {
-        this.CooldownMiddleware.freezeProject(this.req, this.res, this.next)
-        return this.CooldownManager.isProjectOnCooldown.callCount.should.equal(
-          0
-        )
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Docstore/DocstoreManagerTests.js b/services/web/test/unit/src/Docstore/DocstoreManagerTests.js
index 2995f90baf..2dbe6b6424 100644
--- a/services/web/test/unit/src/Docstore/DocstoreManagerTests.js
+++ b/services/web/test/unit/src/Docstore/DocstoreManagerTests.js
@@ -1,6 +1,7 @@
 const sinon = require('sinon')
 const modulePath = '../../../../app/src/Features/Docstore/DocstoreManager'
 const SandboxedModule = require('sandboxed-module')
+const { expect } = require('chai')
 const Errors = require('../../../../app/src/Features/Errors/Errors')
 const tk = require('timekeeper')
 
@@ -26,7 +27,6 @@ describe('DocstoreManager', function () {
 
     this.project_id = 'project-id-123'
     this.doc_id = 'doc-id-123'
-    this.callback = sinon.stub()
   })
 
   describe('deleteDoc', function () {
@@ -39,16 +39,15 @@ describe('DocstoreManager', function () {
         tk.reset()
       })
 
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.patch = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 }, '')
-        this.DocstoreManager.deleteDoc(
+        await this.DocstoreManager.promises.deleteDoc(
           this.project_id,
           this.doc_id,
           'wombat.tex',
-          new Date(),
-          this.callback
+          new Date()
         )
       })
 
@@ -61,10 +60,6 @@ describe('DocstoreManager', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback without an error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('with a failed response code', function () {
@@ -72,28 +67,27 @@ describe('DocstoreManager', function () {
         this.request.patch = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 }, '')
-        this.DocstoreManager.deleteDoc(
-          this.project_id,
-          this.doc_id,
-          'main.tex',
-          new Date(),
-          this.callback
-        )
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.deleteDoc(
+            this.project_id,
+            this.doc_id,
+            'main.tex',
+            new Date()
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
 
@@ -102,28 +96,26 @@ describe('DocstoreManager', function () {
         this.request.patch = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 404 }, '')
-        this.DocstoreManager.deleteDoc(
-          this.project_id,
-          this.doc_id,
-          'main.tex',
-          new Date(),
-          this.callback
-        )
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Errors.NotFoundError)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'tried to delete doc not in docstore'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+        try {
+          await this.DocstoreManager.promises.deleteDoc(
+            this.project_id,
+            this.doc_id,
+            'main.tex',
+            new Date()
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'tried to delete doc not in docstore'
+        )
       })
     })
   })
@@ -137,8 +129,8 @@ describe('DocstoreManager', function () {
       this.modified = true
     })
 
-    describe('with a successful response code', function () {
-      beforeEach(function () {
+    describe('with a successful response code', async function () {
+      beforeEach(async function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(
@@ -147,13 +139,12 @@ describe('DocstoreManager', function () {
             { statusCode: 204 },
             { modified: this.modified, rev: this.rev }
           )
-        this.DocstoreManager.updateDoc(
+        this.updateDocResponse = await this.DocstoreManager.promises.updateDoc(
           this.project_id,
           this.doc_id,
           this.lines,
           this.version,
-          this.ranges,
-          this.callback
+          this.ranges
         )
       })
 
@@ -171,10 +162,12 @@ describe('DocstoreManager', function () {
           .should.equal(true)
       })
 
-      it('should call the callback with the modified status and revision', function () {
-        this.callback
-          .calledWith(null, this.modified, this.rev)
-          .should.equal(true)
+      it('should return the modified status and revision', function () {
+        expect(this.updateDocResponse).to.haveOwnProperty(
+          'modified',
+          this.modified
+        )
+        expect(this.updateDocResponse).to.haveOwnProperty('rev', this.rev)
       })
     })
 
@@ -183,29 +176,28 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 }, '')
-        this.DocstoreManager.updateDoc(
-          this.project_id,
-          this.doc_id,
-          this.lines,
-          this.version,
-          this.ranges,
-          this.callback
-        )
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.updateDoc(
+            this.project_id,
+            this.doc_id,
+            this.lines,
+            this.version,
+            this.ranges
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
@@ -221,11 +213,14 @@ describe('DocstoreManager', function () {
     })
 
     describe('with a successful response code', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 }, this.doc)
-        this.DocstoreManager.getDoc(this.project_id, this.doc_id, this.callback)
+        this.getDocResponse = await this.DocstoreManager.promises.getDoc(
+          this.project_id,
+          this.doc_id
+        )
       })
 
       it('should get the doc from the docstore api', function () {
@@ -236,10 +231,13 @@ describe('DocstoreManager', function () {
         })
       })
 
-      it('should call the callback with the lines, version and rev', function () {
-        this.callback
-          .calledWith(null, this.lines, this.rev, this.version, this.ranges)
-          .should.equal(true)
+      it('should resolve with the lines, version and rev', function () {
+        expect(this.getDocResponse).to.eql({
+          lines: this.lines,
+          rev: this.rev,
+          version: this.version,
+          ranges: this.ranges,
+        })
       })
     })
 
@@ -248,35 +246,37 @@ describe('DocstoreManager', function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 }, '')
-        this.DocstoreManager.getDoc(this.project_id, this.doc_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getDoc(
+            this.project_id,
+            this.doc_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
 
     describe('with include_deleted=true', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 }, this.doc)
-        this.DocstoreManager.getDoc(
+        this.getDocResponse = await this.DocstoreManager.promises.getDoc(
           this.project_id,
           this.doc_id,
-          { include_deleted: true },
-          this.callback
+          { include_deleted: true }
         )
       })
 
@@ -289,23 +289,27 @@ describe('DocstoreManager', function () {
         })
       })
 
-      it('should call the callback with the lines, version and rev', function () {
-        this.callback
-          .calledWith(null, this.lines, this.rev, this.version, this.ranges)
-          .should.equal(true)
+      it('should resolve with the lines, version and rev', function () {
+        expect(this.getDocResponse).to.eql({
+          lines: this.lines,
+          rev: this.rev,
+          version: this.version,
+          ranges: this.ranges,
+        })
       })
     })
 
     describe('with peek=true', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 }, this.doc)
-        this.DocstoreManager.getDoc(
+        await this.DocstoreManager.promises.getDoc(
           this.project_id,
           this.doc_id,
-          { peek: true },
-          this.callback
+          {
+            peek: true,
+          }
         )
       })
 
@@ -323,24 +327,30 @@ describe('DocstoreManager', function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 404 }, '')
-        this.DocstoreManager.getDoc(this.project_id, this.doc_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Errors.NotFoundError)
-              .and(sinon.match.has('message', 'doc not found in docstore'))
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getDoc(
+            this.project_id,
+            this.doc_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
+        expect(error).to.have.property('message', 'doc not found in docstore')
       })
     })
   })
 
   describe('getAllDocs', function () {
     describe('with a successful response code', function () {
-      beforeEach(function () {
+      let getAllDocsResult
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(
@@ -349,7 +359,9 @@ describe('DocstoreManager', function () {
             { statusCode: 204 },
             (this.docs = [{ _id: 'mock-doc-id' }])
           )
-        this.DocstoreManager.getAllDocs(this.project_id, this.callback)
+        getAllDocsResult = await this.DocstoreManager.promises.getAllDocs(
+          this.project_id
+        )
       })
 
       it('should get all the project docs in the docstore api', function () {
@@ -362,8 +374,8 @@ describe('DocstoreManager', function () {
           .should.equal(true)
       })
 
-      it('should call the callback with the docs', function () {
-        this.callback.calledWith(null, this.docs).should.equal(true)
+      it('should return the docs', function () {
+        expect(getAllDocsResult).to.eql(this.docs)
       })
     })
 
@@ -372,35 +384,36 @@ describe('DocstoreManager', function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 }, '')
-        this.DocstoreManager.getAllDocs(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getAllDocs(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
 
   describe('getAllDeletedDocs', function () {
     describe('with a successful response code', function () {
-      beforeEach(function (done) {
-        this.callback.callsFake(done)
+      let getAllDeletedDocsResponse
+      beforeEach(async function () {
         this.docs = [{ _id: 'mock-doc-id', name: 'foo.tex' }]
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 200 }, this.docs)
-        this.DocstoreManager.getAllDeletedDocs(this.project_id, this.callback)
+        getAllDeletedDocsResponse =
+          await this.DocstoreManager.promises.getAllDeletedDocs(this.project_id)
       })
 
       it('should get all the project docs in the docstore api', function () {
@@ -411,48 +424,52 @@ describe('DocstoreManager', function () {
         })
       })
 
-      it('should call the callback with the docs', function () {
-        this.callback.should.have.been.calledWith(null, this.docs)
+      it('should resolve with the docs', function () {
+        expect(getAllDeletedDocsResponse).to.eql(this.docs)
       })
     })
 
     describe('with an error', function () {
-      beforeEach(function (done) {
-        this.callback.callsFake(() => done())
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, new Error('connect failed'))
-        this.DocstoreManager.getAllDocs(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback.should.have.been.calledWith(
-          sinon.match
-            .instanceOf(Error)
-            .and(sinon.match.has('message', 'connect failed'))
-        )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getAllDocs(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property('message', 'connect failed')
       })
     })
 
     describe('with a failed response code', function () {
-      beforeEach(function (done) {
-        this.callback.callsFake(() => done())
+      beforeEach(function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 })
-        this.DocstoreManager.getAllDocs(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback.should.have.been.calledWith(
-          sinon.match
-            .instanceOf(Error)
-            .and(
-              sinon.match.has(
-                'message',
-                'docstore api responded with non-success code: 500'
-              )
-            )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getAllDocs(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
         )
       })
     })
@@ -460,7 +477,8 @@ describe('DocstoreManager', function () {
 
   describe('getAllRanges', function () {
     describe('with a successful response code', function () {
-      beforeEach(function () {
+      let getAllRangesResult
+      beforeEach(async function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(
@@ -469,7 +487,9 @@ describe('DocstoreManager', function () {
             { statusCode: 204 },
             (this.docs = [{ _id: 'mock-doc-id', ranges: 'mock-ranges' }])
           )
-        this.DocstoreManager.getAllRanges(this.project_id, this.callback)
+        getAllRangesResult = await this.DocstoreManager.promises.getAllRanges(
+          this.project_id
+        )
       })
 
       it('should get all the project doc ranges in the docstore api', function () {
@@ -482,8 +502,8 @@ describe('DocstoreManager', function () {
           .should.equal(true)
       })
 
-      it('should call the callback with the docs', function () {
-        this.callback.calledWith(null, this.docs).should.equal(true)
+      it('should return the docs', async function () {
+        expect(getAllRangesResult).to.eql(this.docs)
       })
     })
 
@@ -492,22 +512,22 @@ describe('DocstoreManager', function () {
         this.request.get = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 }, '')
-        this.DocstoreManager.getAllRanges(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.getAllRanges(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
@@ -518,11 +538,12 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 })
-        this.DocstoreManager.archiveProject(this.project_id, this.callback)
       })
 
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
+      it('should resolve', async function () {
+        await expect(
+          this.DocstoreManager.promises.archiveProject(this.project_id)
+        ).to.eventually.be.fulfilled
       })
     })
 
@@ -531,22 +552,22 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 })
-        this.DocstoreManager.archiveProject(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.archiveProject(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
@@ -557,11 +578,12 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 })
-        this.DocstoreManager.unarchiveProject(this.project_id, this.callback)
       })
 
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
+      it('should resolve', async function () {
+        await expect(
+          this.DocstoreManager.promises.unarchiveProject(this.project_id)
+        ).to.eventually.be.fulfilled
       })
     })
 
@@ -570,22 +592,22 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 })
-        this.DocstoreManager.unarchiveProject(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.unarchiveProject(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
@@ -596,11 +618,12 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 204 })
-        this.DocstoreManager.destroyProject(this.project_id, this.callback)
       })
 
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
+      it('should resolve', async function () {
+        await expect(
+          this.DocstoreManager.promises.destroyProject(this.project_id)
+        ).to.eventually.be.fulfilled
       })
     })
 
@@ -609,22 +632,22 @@ describe('DocstoreManager', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 500 })
-        this.DocstoreManager.destroyProject(this.project_id, this.callback)
       })
 
-      it('should call the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'docstore api responded with non-success code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.DocstoreManager.promises.destroyProject(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'docstore api responded with non-success code: 500'
+        )
       })
     })
   })
diff --git a/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterController.test.mjs b/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterController.test.mjs
new file mode 100644
index 0000000000..5a60903552
--- /dev/null
+++ b/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterController.test.mjs
@@ -0,0 +1,102 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+
+const MODULE_PATH =
+  '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterController.mjs'
+
+describe('DocumentUpdaterController', function () {
+  beforeEach(async function (ctx) {
+    ctx.DocumentUpdaterHandler = {
+      promises: {
+        getDocument: sinon.stub(),
+      },
+    }
+    ctx.ProjectLocator = {
+      promises: {
+        findElement: sinon.stub(),
+      },
+    }
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator.js', () => ({
+      default: ctx.ProjectLocator,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js',
+      () => ({
+        default: ctx.DocumentUpdaterHandler,
+      })
+    )
+
+    ctx.controller = (await import(MODULE_PATH)).default
+    ctx.projectId = '2k3j1lk3j21lk3j'
+    ctx.fileId = '12321kklj1lk3jk12'
+    ctx.req = {
+      params: {
+        Project_id: ctx.projectId,
+        Doc_id: ctx.docId,
+      },
+      get(key) {
+        return undefined
+      },
+    }
+    ctx.lines = ['test', '', 'testing']
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub()
+    ctx.doc = { name: 'myfile.tex' }
+  })
+
+  describe('getDoc', function () {
+    beforeEach(function (ctx) {
+      ctx.DocumentUpdaterHandler.promises.getDocument.resolves({
+        lines: ctx.lines,
+      })
+      ctx.ProjectLocator.promises.findElement.resolves({
+        element: ctx.doc,
+      })
+      ctx.res = new MockResponse()
+    })
+
+    it('should call the document updater handler with the project_id and doc_id', async function (ctx) {
+      await ctx.controller.getDoc(ctx.req, ctx.res, ctx.next)
+      expect(
+        ctx.DocumentUpdaterHandler.promises.getDocument
+      ).to.have.been.calledOnceWith(
+        ctx.req.params.Project_id,
+        ctx.req.params.Doc_id,
+        -1
+      )
+    })
+
+    it('should return the content', async function (ctx) {
+      await ctx.controller.getDoc(ctx.req, ctx.res)
+      expect(ctx.next).to.not.have.been.called
+      expect(ctx.res.statusCode).to.equal(200)
+      expect(ctx.res.body).to.equal('test\n\ntesting')
+    })
+
+    it('should find the doc in the project', async function (ctx) {
+      await ctx.controller.getDoc(ctx.req, ctx.res)
+      expect(
+        ctx.ProjectLocator.promises.findElement
+      ).to.have.been.calledOnceWith({
+        project_id: ctx.projectId,
+        element_id: ctx.docId,
+        type: 'doc',
+      })
+    })
+
+    it('should set the Content-Disposition header', async function (ctx) {
+      await ctx.controller.getDoc(ctx.req, ctx.res)
+      expect(ctx.res.setContentDisposition).to.have.been.calledWith(
+        'attachment',
+        { filename: ctx.doc.name }
+      )
+    })
+  })
+})
diff --git a/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterControllerTests.mjs b/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterControllerTests.mjs
deleted file mode 100644
index 6a783d452e..0000000000
--- a/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterControllerTests.mjs
+++ /dev/null
@@ -1,93 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import MockResponse from '../helpers/MockResponse.js'
-
-const MODULE_PATH =
-  '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterController.mjs'
-
-describe('DocumentUpdaterController', function () {
-  beforeEach(async function () {
-    this.DocumentUpdaterHandler = {
-      promises: {
-        getDocument: sinon.stub(),
-      },
-    }
-    this.ProjectLocator = {
-      promises: {
-        findElement: sinon.stub(),
-      },
-    }
-    this.controller = await esmock.strict(MODULE_PATH, {
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/Features/Project/ProjectLocator.js':
-        this.ProjectLocator,
-      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js':
-        this.DocumentUpdaterHandler,
-    })
-    this.projectId = '2k3j1lk3j21lk3j'
-    this.fileId = '12321kklj1lk3jk12'
-    this.req = {
-      params: {
-        Project_id: this.projectId,
-        Doc_id: this.docId,
-      },
-      get(key) {
-        return undefined
-      },
-    }
-    this.lines = ['test', '', 'testing']
-    this.res = new MockResponse()
-    this.next = sinon.stub()
-    this.doc = { name: 'myfile.tex' }
-  })
-
-  describe('getDoc', function () {
-    beforeEach(function () {
-      this.DocumentUpdaterHandler.promises.getDocument.resolves({
-        lines: this.lines,
-      })
-      this.ProjectLocator.promises.findElement.resolves({
-        element: this.doc,
-      })
-      this.res = new MockResponse()
-    })
-
-    it('should call the document updater handler with the project_id and doc_id', async function () {
-      await this.controller.getDoc(this.req, this.res, this.next)
-      expect(
-        this.DocumentUpdaterHandler.promises.getDocument
-      ).to.have.been.calledOnceWith(
-        this.req.params.Project_id,
-        this.req.params.Doc_id,
-        -1
-      )
-    })
-
-    it('should return the content', async function () {
-      await this.controller.getDoc(this.req, this.res)
-      expect(this.next).to.not.have.been.called
-      expect(this.res.statusCode).to.equal(200)
-      expect(this.res.body).to.equal('test\n\ntesting')
-    })
-
-    it('should find the doc in the project', async function () {
-      await this.controller.getDoc(this.req, this.res)
-      expect(
-        this.ProjectLocator.promises.findElement
-      ).to.have.been.calledOnceWith({
-        project_id: this.projectId,
-        element_id: this.docId,
-        type: 'doc',
-      })
-    })
-
-    it('should set the Content-Disposition header', async function () {
-      await this.controller.getDoc(this.req, this.res)
-      expect(this.res.setContentDisposition).to.have.been.calledWith(
-        'attachment',
-        { filename: this.doc.name }
-      )
-    })
-  })
-})
diff --git a/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterHandlerTests.js b/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterHandlerTests.js
index 2d5a116337..fdb3945075 100644
--- a/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterHandlerTests.js
+++ b/services/web/test/unit/src/DocumentUpdater/DocumentUpdaterHandlerTests.js
@@ -1,6 +1,7 @@
 const sinon = require('sinon')
 const SandboxedModule = require('sandboxed-module')
 const path = require('path')
+const { expect } = require('chai')
 const { ObjectId } = require('mongodb-legacy')
 const modulePath = path.join(
   __dirname,
@@ -28,11 +29,11 @@ describe('DocumentUpdaterHandler', function () {
           url: 'http://project_history.example.com',
         },
       },
+      filestoreMigrationLevel: 0,
       moduleImportSequence: [],
     }
     this.source = 'dropbox'
 
-    this.callback = sinon.stub()
     this.handler = SandboxedModule.require(modulePath, {
       requires: {
         request: {
@@ -68,9 +69,9 @@ describe('DocumentUpdaterHandler', function () {
 
   describe('flushProjectToMongo', function () {
     describe('successfully', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
-        this.handler.flushProjectToMongo(this.project_id, this.callback)
+        await this.handler.promises.flushProjectToMongo(this.project_id)
       })
 
       it('should flush the document from the document updater', function () {
@@ -81,10 +82,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -95,46 +92,50 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.flushProjectToMongo(this.project_id, this.callback)
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushProjectToMongo(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.flushProjectToMongo(this.project_id, this.callback)
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushProjectToMongo(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
 
   describe('flushProjectToMongoAndDelete', function () {
     describe('successfully', function () {
-      beforeEach(function () {
+      beforeEach(async function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
-        this.handler.flushProjectToMongoAndDelete(
-          this.project_id,
-          this.callback
+        await this.handler.promises.flushProjectToMongoAndDelete(
+          this.project_id
         )
       })
 
@@ -146,10 +147,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -160,41 +157,44 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.flushProjectToMongoAndDelete(
-          this.project_id,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushProjectToMongoAndDelete(
+            this.project_id
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.flushProjectToMongoAndDelete(
-          this.project_id,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushProjectToMongoAndDelete(
+            this.project_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -203,14 +203,13 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
-        this.handler.flushDocToMongo(
-          this.project_id,
-          this.doc_id,
-          this.callback
-        )
       })
 
-      it('should flush the document from the document updater', function () {
+      it('should flush the document from the document updater', async function () {
+        await this.handler.promises.flushDocToMongo(
+          this.project_id,
+          this.doc_id
+        )
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/flush`,
@@ -218,10 +217,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -232,43 +227,46 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.flushDocToMongo(
-          this.project_id,
-          this.doc_id,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushDocToMongo(
+            this.project_id,
+            this.doc_id
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.flushDocToMongo(
-          this.project_id,
-          this.doc_id,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.flushDocToMongo(
+            this.project_id,
+            this.doc_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -277,10 +275,10 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
-        this.handler.deleteDoc(this.project_id, this.doc_id, this.callback)
       })
 
-      it('should delete the document from the document updater', function () {
+      it('should delete the document from the document updater', async function () {
+        await this.handler.promises.deleteDoc(this.project_id, this.doc_id)
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}`,
@@ -288,10 +286,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -302,35 +296,40 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.deleteDoc(this.project_id, this.doc_id, this.callback)
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.deleteDoc(this.project_id, this.doc_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.deleteDoc(this.project_id, this.doc_id, this.callback)
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.deleteDoc(this.project_id, this.doc_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
 
@@ -339,12 +338,11 @@ describe('DocumentUpdaterHandler', function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
       })
 
-      it('when option is true, should send a `ignore_flush_errors=true` URL query to document-updater', function () {
-        this.handler.deleteDoc(
+      it('when option is true, should send a `ignore_flush_errors=true` URL query to document-updater', async function () {
+        await this.handler.promises.deleteDoc(
           this.project_id,
           this.doc_id,
-          true,
-          this.callback
+          true
         )
         this.request
           .calledWithMatch({
@@ -354,12 +352,11 @@ describe('DocumentUpdaterHandler', function () {
           .should.equal(true)
       })
 
-      it("when option is false, shouldn't send any URL query to document-updater", function () {
-        this.handler.deleteDoc(
+      it("when option is false, shouldn't send any URL query to document-updater", async function () {
+        await this.handler.promises.deleteDoc(
           this.project_id,
           this.doc_id,
-          false,
-          this.callback
+          false
         )
         this.request
           .calledWithMatch({
@@ -375,17 +372,16 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 204 }, '')
-        this.handler.setDocument(
+      })
+
+      it('should set the document in the document updater', async function () {
+        await this.handler.promises.setDocument(
           this.project_id,
           this.doc_id,
           this.user_id,
           this.lines,
-          this.source,
-          this.callback
+          this.source
         )
-      })
-
-      it('should set the document in the document updater', function () {
         this.request
           .calledWith({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}`,
@@ -399,10 +395,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -413,49 +405,52 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.setDocument(
-          this.project_id,
-          this.doc_id,
-          this.user_id,
-          this.lines,
-          this.source,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.setDocument(
+            this.project_id,
+            this.doc_id,
+            this.user_id,
+            this.lines,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.setDocument(
-          this.project_id,
-          this.doc_id,
-          this.user_id,
-          this.lines,
-          this.source,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.setDocument(
+            this.project_id,
+            this.doc_id,
+            this.user_id,
+            this.lines,
+            this.source
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -468,15 +463,14 @@ describe('DocumentUpdaterHandler', function () {
         }
         this.body = this.comment
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.getComment(
-          this.project_id,
-          this.doc_id,
-          this.comment.id,
-          this.callback
-        )
       })
 
-      it('should get the comment from the document updater', function () {
+      it('should get the comment from the document updater', async function () {
+        await this.handler.promises.getComment(
+          this.project_id,
+          this.doc_id,
+          this.comment.id
+        )
         const url = `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/comment/${this.comment.id}`
         this.request
           .calledWith({
@@ -487,16 +481,13 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with the comment', function () {
-        this.callback.calledWithExactly(null, this.comment).should.equal(true)
-      })
     })
   })
 
   describe('getDocument', function () {
     describe('successfully', function () {
-      beforeEach(function () {
+      let getDocumentResponse
+      beforeEach(async function () {
         this.body = {
           lines: this.lines,
           version: this.version,
@@ -505,11 +496,10 @@ describe('DocumentUpdaterHandler', function () {
         }
         this.fromVersion = 2
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.getDocument(
+        getDocumentResponse = await this.handler.promises.getDocument(
           this.project_id,
           this.doc_id,
-          this.fromVersion,
-          this.callback
+          this.fromVersion
         )
       })
 
@@ -525,9 +515,12 @@ describe('DocumentUpdaterHandler', function () {
       })
 
       it('should call the callback with the lines and version', function () {
-        this.callback
-          .calledWith(null, this.lines, this.version, this.ranges, this.ops)
-          .should.equal(true)
+        expect(getDocumentResponse).to.eql({
+          lines: this.lines,
+          version: this.version,
+          ranges: this.ranges,
+          ops: this.ops,
+        })
       })
     })
 
@@ -539,45 +532,48 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.getDocument(
-          this.project_id,
-          this.doc_id,
-          this.fromVersion,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.getDocument(
+            this.project_id,
+            this.doc_id,
+            this.fromVersion
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.getDocument(
-          this.project_id,
-          this.doc_id,
-          this.fromVersion,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.getDocument(
+            this.project_id,
+            this.doc_id,
+            this.fromVersion
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -588,7 +584,8 @@ describe('DocumentUpdaterHandler', function () {
     })
 
     describe('successfully', function () {
-      beforeEach(function () {
+      let getProjectDocsIfMatchResponse
+      beforeEach(async function () {
         this.doc0 = {
           _id: this.doc_id,
           lines: this.lines,
@@ -599,11 +596,11 @@ describe('DocumentUpdaterHandler', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.getProjectDocsIfMatch(
-          this.project_id,
-          this.project_state_hash,
-          this.callback
-        )
+        getProjectDocsIfMatchResponse =
+          await this.handler.promises.getProjectDocsIfMatch(
+            this.project_id,
+            this.project_state_hash
+          )
       })
 
       it('should get the documents from the document updater', function () {
@@ -612,7 +609,7 @@ describe('DocumentUpdaterHandler', function () {
       })
 
       it('should call the callback with the documents', function () {
-        this.callback.calledWithExactly(null, this.docs).should.equal(true)
+        expect(getProjectDocsIfMatchResponse).to.eql(this.docs)
       })
     })
 
@@ -621,17 +618,21 @@ describe('DocumentUpdaterHandler', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, new Error('something went wrong'), null, null)
-        this.handler.getProjectDocsIfMatch(
-          this.project_id,
-          this.project_state_hash,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.getProjectDocsIfMatch(
+            this.project_id,
+            this.project_state_hash
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
@@ -640,15 +641,14 @@ describe('DocumentUpdaterHandler', function () {
         this.request.post = sinon
           .stub()
           .callsArgWith(1, null, { statusCode: 409 }, 'Conflict')
-        this.handler.getProjectDocsIfMatch(
-          this.project_id,
-          this.project_state_hash,
-          this.callback
-        )
       })
 
-      it('should return the callback with no documents', function () {
-        this.callback.alwaysCalledWithExactly().should.equal(true)
+      it('should return no documents', async function () {
+        const response = await this.handler.promises.getProjectDocsIfMatch(
+          this.project_id,
+          this.project_state_hash
+        )
+        expect(response).to.be.undefined
       })
     })
   })
@@ -657,10 +657,11 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 200 })
-        this.handler.clearProjectState(this.project_id, this.callback)
       })
 
-      it('should clear the project state from the document updater', function () {
+      it('should clear the project state from the document updater', async function () {
+        await this.handler.promises.clearProjectState(this.project_id)
+
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/clearState`,
@@ -668,10 +669,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -682,35 +679,40 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.clearProjectState(this.project_id, this.callback)
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.clearProjectState(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns an error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, null)
-        this.handler.clearProjectState(this.project_id, this.callback)
       })
 
-      it('should return the callback with no documents', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
-          )
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.clearProjectState(this.project_id)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -723,15 +725,14 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.acceptChanges(
-          this.project_id,
-          this.doc_id,
-          [this.change_id],
-          this.callback
-        )
       })
 
-      it('should accept the change in the document updater', function () {
+      it('should accept the change in the document updater', async function () {
+        await this.handler.promises.acceptChanges(
+          this.project_id,
+          this.doc_id,
+          [this.change_id]
+        )
         this.request
           .calledWith({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/change/accept`,
@@ -743,10 +744,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -757,45 +754,48 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.acceptChanges(
-          this.project_id,
-          this.doc_id,
-          [this.change_id],
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.acceptChanges(
+            this.project_id,
+            this.doc_id,
+            [this.change_id]
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.acceptChanges(
-          this.project_id,
-          this.doc_id,
-          [this.change_id],
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.acceptChanges(
+            this.project_id,
+            this.doc_id,
+            [this.change_id]
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -808,16 +808,15 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.deleteThread(
+      })
+
+      it('should delete the thread in the document updater', async function () {
+        await this.handler.promises.deleteThread(
           this.project_id,
           this.doc_id,
           this.thread_id,
-          this.user_id,
-          this.callback
+          this.user_id
         )
-      })
-
-      it('should delete the thread in the document updater', function () {
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/comment/${this.thread_id}`,
@@ -825,10 +824,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -839,47 +834,50 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.deleteThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.deleteThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.deleteThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.deleteThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -892,16 +890,15 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.resolveThread(
+      })
+
+      it('should resolve the thread in the document updater', async function () {
+        await this.handler.promises.resolveThread(
           this.project_id,
           this.doc_id,
           this.thread_id,
-          this.user_id,
-          this.callback
+          this.user_id
         )
-      })
-
-      it('should resolve the thread in the document updater', function () {
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/comment/${this.thread_id}/resolve`,
@@ -909,10 +906,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -923,47 +916,50 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.resolveThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.resolveThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.resolveThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.resolveThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -976,16 +972,15 @@ describe('DocumentUpdaterHandler', function () {
     describe('successfully', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.reopenThread(
+      })
+
+      it('should reopen the thread in the document updater', async function () {
+        await this.handler.promises.reopenThread(
           this.project_id,
           this.doc_id,
           this.thread_id,
-          this.user_id,
-          this.callback
+          this.user_id
         )
-      })
-
-      it('should reopen the thread in the document updater', function () {
         this.request
           .calledWithMatch({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/comment/${this.thread_id}/reopen`,
@@ -993,10 +988,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -1007,47 +998,50 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.reopenThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.reopenThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.reopenThread(
-          this.project_id,
-          this.doc_id,
-          this.thread_id,
-          this.user_id,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.reopenThread(
+            this.project_id,
+            this.doc_id,
+            this.thread_id,
+            this.user_id
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
@@ -1061,23 +1055,18 @@ describe('DocumentUpdaterHandler', function () {
     describe('with project history disabled', function () {
       beforeEach(function () {
         this.settings.apis.project_history.sendProjectStructureOps = false
-        this.handler.updateProjectStructure(
+      })
+
+      it('does not make a web request', async function () {
+        await this.handler.promises.updateProjectStructure(
           this.project_id,
           this.projectHistoryId,
           this.user_id,
           {},
-          this.source,
-          this.callback
+          this.source
         )
-      })
-
-      it('does not make a web request', function () {
         this.request.called.should.equal(false)
       })
-
-      it('calls the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('with project history enabled', function () {
@@ -1088,7 +1077,7 @@ describe('DocumentUpdaterHandler', function () {
       })
 
       describe('when an entity has changed name', function () {
-        it('should send the structure update to the document updater', function (done) {
+        it('should send the structure update to the document updater', async function () {
           this.docIdA = new ObjectId()
           this.docIdB = new ObjectId()
           this.changes = {
@@ -1119,35 +1108,33 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request
-                .calledWith({
-                  url: this.url,
-                  method: 'POST',
-                  json: {
-                    updates,
-                    userId: this.user_id,
-                    version: this.version,
-                    projectHistoryId: this.projectHistoryId,
-                    source: this.source,
-                  },
-                  timeout: 30 * 1000,
-                })
-                .should.equal(true)
-              done()
-            }
+            this.source
           )
+
+          this.request
+            .calledWith({
+              url: this.url,
+              method: 'POST',
+              json: {
+                updates,
+                userId: this.user_id,
+                version: this.version,
+                projectHistoryId: this.projectHistoryId,
+                source: this.source,
+              },
+              timeout: 30 * 1000,
+            })
+            .should.equal(true)
         })
       })
 
       describe('when a doc has been added', function () {
-        it('should send the structure update to the document updater', function (done) {
+        it('should send the structure update to the document updater', async function () {
           this.docId = new ObjectId()
           this.changes = {
             newDocs: [
@@ -1171,33 +1158,31 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
       })
 
       describe('when a file has been added', function () {
-        it('should send the structure update to the document updater', function (done) {
+        it('should send the structure update to the document updater', async function () {
           this.fileId = new ObjectId()
           this.changes = {
             newFiles: [
@@ -1225,33 +1210,31 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
       })
 
       describe('when an entity has been deleted', function () {
-        it('should end the structure update to the document updater', function (done) {
+        it('should end the structure update to the document updater', async function () {
           this.docId = new ObjectId()
           this.changes = {
             oldDocs: [
@@ -1269,33 +1252,31 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
       })
 
       describe('when a file is converted to a doc', function () {
-        it('should send the delete first', function (done) {
+        it('should send the delete first', async function () {
           this.docId = new ObjectId()
           this.fileId = new ObjectId()
           this.changes = {
@@ -1337,33 +1318,31 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
       })
 
       describe('when the project version is missing', function () {
-        it('should call the callback with an error', function () {
+        it('should call the callback with an error', async function () {
           this.docId = new ObjectId()
           this.changes = {
             oldDocs: [
@@ -1371,20 +1350,23 @@ describe('DocumentUpdaterHandler', function () {
             ],
           }
 
-          this.handler.updateProjectStructure(
-            this.project_id,
-            this.projectHistoryId,
-            this.user_id,
-            this.changes,
-            this.source,
-            this.callback
-          )
+          let error
 
-          this.callback
-            .calledWith(sinon.match.instanceOf(Error))
-            .should.equal(true)
-          const firstCallArgs = this.callback.args[0]
-          firstCallArgs[0].message.should.equal(
+          try {
+            await this.handler.promises.updateProjectStructure(
+              this.project_id,
+              this.projectHistoryId,
+              this.user_id,
+              this.changes,
+              this.source
+            )
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.be.instanceOf(Error)
+          expect(error).to.have.property(
+            'message',
             'did not receive project version in changes'
           )
         })
@@ -1424,7 +1406,7 @@ describe('DocumentUpdaterHandler', function () {
           }
         })
 
-        it('should forward ranges', function (done) {
+        it('should forward ranges', async function () {
           const updates = [
             {
               type: 'add-doc',
@@ -1440,31 +1422,29 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
 
-        it('should include flag when history ranges support is enabled', function (done) {
+        it('should include flag when history ranges support is enabled', async function () {
           this.ProjectGetter.getProjectWithoutLock
             .withArgs(this.project_id)
             .yields(null, {
@@ -1487,36 +1467,34 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
       })
 
       describe('with filestore disabled', function () {
         beforeEach(function () {
-          this.settings.disableFilestore = true
+          this.settings.filestoreMigrationLevel = 2
         })
-        it('should add files without URL and with createdBlob', function (done) {
+        it('should add files without URL and with createdBlob', async function () {
           this.fileId = new ObjectId()
           this.changes = {
             newFiles: [
@@ -1544,30 +1522,28 @@ describe('DocumentUpdaterHandler', function () {
             },
           ]
 
-          this.handler.updateProjectStructure(
+          await this.handler.promises.updateProjectStructure(
             this.project_id,
             this.projectHistoryId,
             this.user_id,
             this.changes,
-            this.source,
-            () => {
-              this.request.should.have.been.calledWith({
-                url: this.url,
-                method: 'POST',
-                json: {
-                  updates,
-                  userId: this.user_id,
-                  version: this.version,
-                  projectHistoryId: this.projectHistoryId,
-                  source: this.source,
-                },
-                timeout: 30 * 1000,
-              })
-              done()
-            }
+            this.source
           )
+
+          this.request.should.have.been.calledWith({
+            url: this.url,
+            method: 'POST',
+            json: {
+              updates,
+              userId: this.user_id,
+              version: this.version,
+              projectHistoryId: this.projectHistoryId,
+              source: this.source,
+            },
+            timeout: 30 * 1000,
+          })
         })
-        it('should flag files without hash', function (done) {
+        it('should flag files without hash', async function () {
           this.fileId = new ObjectId()
           this.changes = {
             newFiles: [
@@ -1580,25 +1556,26 @@ describe('DocumentUpdaterHandler', function () {
             newProject: { version: this.version },
           }
 
-          this.handler.updateProjectStructure(
-            this.project_id,
-            this.projectHistoryId,
-            this.user_id,
-            this.changes,
-            this.source,
-            err => {
-              err.should.match(/found file with missing hash/)
-              this.request.should.not.have.been.called
-              done()
-            }
-          )
+          let error
+          try {
+            await this.handler.promises.updateProjectStructure(
+              this.project_id,
+              this.projectHistoryId,
+              this.user_id,
+              this.changes,
+              this.source
+            )
+          } catch (err) {
+            error = err
+          }
+          expect(error).to.exist
         })
       })
     })
   })
 
   describe('resyncProjectHistory', function () {
-    it('should add docs', function (done) {
+    it('should add docs', async function () {
       const docId1 = new ObjectId()
       const docId2 = new ObjectId()
       const docs = [
@@ -1609,31 +1586,28 @@ describe('DocumentUpdaterHandler', function () {
       this.request.yields(null, { statusCode: 200 })
       const projectId = new ObjectId()
       const projectHistoryId = 99
-      this.handler.resyncProjectHistory(
+      await this.handler.promises.resyncProjectHistory(
         projectId,
         projectHistoryId,
         docs,
         files,
-        {},
-        () => {
-          this.request.should.have.been.calledWith({
-            url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
-            method: 'POST',
-            json: {
-              docs: [
-                { doc: docId1, path: 'main.tex' },
-                { doc: docId2, path: 'references.bib' },
-              ],
-              files: [],
-              projectHistoryId,
-            },
-            timeout: 6 * 60 * 1000,
-          })
-          done()
-        }
+        {}
       )
+      this.request.should.have.been.calledWith({
+        url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
+        method: 'POST',
+        json: {
+          docs: [
+            { doc: docId1, path: 'main.tex' },
+            { doc: docId2, path: 'references.bib' },
+          ],
+          files: [],
+          projectHistoryId,
+        },
+        timeout: 6 * 60 * 1000,
+      })
     })
-    it('should add files', function (done) {
+    it('should add files', async function () {
       const fileId1 = new ObjectId()
       const fileId2 = new ObjectId()
       const fileId3 = new ObjectId()
@@ -1673,66 +1647,63 @@ describe('DocumentUpdaterHandler', function () {
       this.request.yields(null, { statusCode: 200 })
       const projectId = new ObjectId()
       const projectHistoryId = 99
-      this.handler.resyncProjectHistory(
+      await this.handler.promises.resyncProjectHistory(
         projectId,
         projectHistoryId,
         docs,
         files,
-        {},
-        () => {
-          this.request.should.have.been.calledWith({
-            url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
-            method: 'POST',
-            json: {
-              docs: [],
-              files: [
-                {
-                  file: fileId1,
-                  _hash: '42',
-                  path: '1.png',
-                  url: `http://filestore/project/${projectId}/file/${fileId1}`,
-                  createdBlob: false,
-                  metadata: undefined,
-                },
-                {
-                  file: fileId2,
-                  _hash: '1337',
-                  path: '1.bib',
-                  url: `http://filestore/project/${projectId}/file/${fileId2}`,
-                  createdBlob: false,
-                  metadata: {
-                    importedAt: fileCreated2,
-                    provider: 'references-provider',
-                  },
-                },
-                {
-                  file: fileId3,
-                  _hash: '21',
-                  path: 'bar.txt',
-                  url: `http://filestore/project/${projectId}/file/${fileId3}`,
-                  createdBlob: false,
-                  metadata: {
-                    importedAt: fileCreated3,
-                    provider: 'project_output_file',
-                    source_project_id: otherProjectId,
-                    source_output_file_path: 'foo/bar.txt',
-                    // build_id and clsiServerId are omitted
-                  },
-                },
-              ],
-              projectHistoryId,
-            },
-            timeout: 6 * 60 * 1000,
-          })
-          done()
-        }
+        {}
       )
+      this.request.should.have.been.calledWith({
+        url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
+        method: 'POST',
+        json: {
+          docs: [],
+          files: [
+            {
+              file: fileId1,
+              _hash: '42',
+              path: '1.png',
+              url: `http://filestore/project/${projectId}/file/${fileId1}`,
+              createdBlob: false,
+              metadata: undefined,
+            },
+            {
+              file: fileId2,
+              _hash: '1337',
+              path: '1.bib',
+              url: `http://filestore/project/${projectId}/file/${fileId2}`,
+              createdBlob: false,
+              metadata: {
+                importedAt: fileCreated2,
+                provider: 'references-provider',
+              },
+            },
+            {
+              file: fileId3,
+              _hash: '21',
+              path: 'bar.txt',
+              url: `http://filestore/project/${projectId}/file/${fileId3}`,
+              createdBlob: false,
+              metadata: {
+                importedAt: fileCreated3,
+                provider: 'project_output_file',
+                source_project_id: otherProjectId,
+                source_output_file_path: 'foo/bar.txt',
+                // build_id and clsiServerId are omitted
+              },
+            },
+          ],
+          projectHistoryId,
+        },
+        timeout: 6 * 60 * 1000,
+      })
     })
     describe('with filestore disabled', function () {
       beforeEach(function () {
-        this.settings.disableFilestore = true
+        this.settings.filestoreMigrationLevel = 2
       })
-      it('should add files without URL', function (done) {
+      it('should add files without URL', async function () {
         const fileId1 = new ObjectId()
         const fileId2 = new ObjectId()
         const fileId3 = new ObjectId()
@@ -1772,62 +1743,59 @@ describe('DocumentUpdaterHandler', function () {
         this.request.yields(null, { statusCode: 200 })
         const projectId = new ObjectId()
         const projectHistoryId = 99
-        this.handler.resyncProjectHistory(
+        await this.handler.promises.resyncProjectHistory(
           projectId,
           projectHistoryId,
           docs,
           files,
-          {},
-          () => {
-            this.request.should.have.been.calledWith({
-              url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
-              method: 'POST',
-              json: {
-                docs: [],
-                files: [
-                  {
-                    file: fileId1,
-                    _hash: '42',
-                    path: '1.png',
-                    url: undefined,
-                    createdBlob: true,
-                    metadata: undefined,
-                  },
-                  {
-                    file: fileId2,
-                    _hash: '1337',
-                    path: '1.bib',
-                    url: undefined,
-                    createdBlob: true,
-                    metadata: {
-                      importedAt: fileCreated2,
-                      provider: 'references-provider',
-                    },
-                  },
-                  {
-                    file: fileId3,
-                    _hash: '21',
-                    path: 'bar.txt',
-                    url: undefined,
-                    createdBlob: true,
-                    metadata: {
-                      importedAt: fileCreated3,
-                      provider: 'project_output_file',
-                      source_project_id: otherProjectId,
-                      source_output_file_path: 'foo/bar.txt',
-                      // build_id and clsiServerId are omitted
-                    },
-                  },
-                ],
-                projectHistoryId,
-              },
-              timeout: 6 * 60 * 1000,
-            })
-            done()
-          }
+          {}
         )
+        this.request.should.have.been.calledWith({
+          url: `${this.settings.apis.documentupdater.url}/project/${projectId}/history/resync`,
+          method: 'POST',
+          json: {
+            docs: [],
+            files: [
+              {
+                file: fileId1,
+                _hash: '42',
+                path: '1.png',
+                url: undefined,
+                createdBlob: true,
+                metadata: undefined,
+              },
+              {
+                file: fileId2,
+                _hash: '1337',
+                path: '1.bib',
+                url: undefined,
+                createdBlob: true,
+                metadata: {
+                  importedAt: fileCreated2,
+                  provider: 'references-provider',
+                },
+              },
+              {
+                file: fileId3,
+                _hash: '21',
+                path: 'bar.txt',
+                url: undefined,
+                createdBlob: true,
+                metadata: {
+                  importedAt: fileCreated3,
+                  provider: 'project_output_file',
+                  source_project_id: otherProjectId,
+                  source_output_file_path: 'foo/bar.txt',
+                  // build_id and clsiServerId are omitted
+                },
+              },
+            ],
+            projectHistoryId,
+          },
+          timeout: 6 * 60 * 1000,
+        })
       })
-      it('should flag files with missing hashes', function (done) {
+      it('should flag files with missing hashes', async function () {
         const fileId1 = new ObjectId()
         const fileId2 = new ObjectId()
         const fileId3 = new ObjectId()
@@ -1866,18 +1834,15 @@ describe('DocumentUpdaterHandler', function () {
         this.request.yields(null, { statusCode: 200 })
         const projectId = new ObjectId()
         const projectHistoryId = 99
-        this.handler.resyncProjectHistory(
-          projectId,
-          projectHistoryId,
-          docs,
-          files,
-          {},
-          err => {
-            err.should.match(/found file with missing hash/)
-            this.request.should.not.have.been.called
-            done()
-          }
-        )
+        await expect(
+          this.handler.promises.resyncProjectHistory(
+            projectId,
+            projectHistoryId,
+            docs,
+            files,
+            {}
+          )
+        ).to.be.rejected
       })
     })
   })
@@ -1889,17 +1854,16 @@ describe('DocumentUpdaterHandler', function () {
           rev: 1,
         }
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
-        this.handler.appendToDocument(
+      })
+
+      it('should append to the document in the document updater', async function () {
+        await this.handler.promises.appendToDocument(
           this.project_id,
           this.doc_id,
           this.user_id,
           this.lines,
-          this.source,
-          this.callback
+          this.source
         )
-      })
-
-      it('should append to the document in the document updater', function () {
         this.request
           .calledWith({
             url: `${this.settings.apis.documentupdater.url}/project/${this.project_id}/doc/${this.doc_id}/append`,
@@ -1913,10 +1877,6 @@ describe('DocumentUpdaterHandler', function () {
           })
           .should.equal(true)
       })
-
-      it('should call the callback with no error', function () {
-        this.callback.calledWith(null).should.equal(true)
-      })
     })
 
     describe('when the document updater API returns an error', function () {
@@ -1927,49 +1887,52 @@ describe('DocumentUpdaterHandler', function () {
           null,
           null
         )
-        this.handler.appendToDocument(
-          this.project_id,
-          this.doc_id,
-          this.user_id,
-          this.lines,
-          this.source,
-          this.callback
-        )
       })
 
-      it('should return an error to the callback', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Error))
-          .should.equal(true)
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.appendToDocument(
+            this.project_id,
+            this.doc_id,
+            this.user_id,
+            this.lines,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('when the document updater returns a failure error code', function () {
       beforeEach(function () {
         this.request.callsArgWith(1, null, { statusCode: 500 }, '')
-        this.handler.appendToDocument(
-          this.project_id,
-          this.doc_id,
-          this.user_id,
-          this.lines,
-          this.source,
-          this.callback
-        )
       })
 
-      it('should return the callback with an error', function () {
-        this.callback
-          .calledWith(
-            sinon.match
-              .instanceOf(Error)
-              .and(
-                sinon.match.has(
-                  'message',
-                  'document updater returned a failure status code: 500'
-                )
-              )
+      it('should reject with an error', async function () {
+        let error
+
+        try {
+          await this.handler.promises.appendToDocument(
+            this.project_id,
+            this.doc_id,
+            this.user_id,
+            this.lines,
+            this.source
           )
-          .should.equal(true)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
+        expect(error).to.have.property(
+          'message',
+          'document updater returned a failure status code: 500'
+        )
       })
     })
   })
diff --git a/services/web/test/unit/src/Documents/DocumentController.test.mjs b/services/web/test/unit/src/Documents/DocumentController.test.mjs
new file mode 100644
index 0000000000..b683cc5d14
--- /dev/null
+++ b/services/web/test/unit/src/Documents/DocumentController.test.mjs
@@ -0,0 +1,255 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+
+const MODULE_PATH =
+  '../../../../app/src/Features/Documents/DocumentController.mjs'
+
+describe('DocumentController', function () {
+  beforeEach(async function (ctx) {
+    ctx.res = new MockResponse()
+    ctx.req = new MockRequest()
+    ctx.next = sinon.stub()
+    ctx.doc = { _id: 'doc-id-123' }
+    ctx.doc_lines = ['one', 'two', 'three']
+    ctx.version = 42
+    ctx.ranges = {
+      comments: [
+        {
+          id: 'comment1',
+          op: {
+            c: 'foo',
+            p: 123,
+            t: 'comment1',
+          },
+        },
+        {
+          id: 'comment2',
+          op: {
+            c: 'bar',
+            p: 456,
+            t: 'comment2',
+          },
+        },
+      ],
+    }
+    ctx.pathname = '/a/b/c/file.tex'
+    ctx.lastUpdatedAt = new Date().getTime()
+    ctx.lastUpdatedBy = 'fake-last-updater-id'
+    ctx.rev = 5
+    ctx.project = {
+      _id: 'project-id-123',
+      overleaf: {
+        history: {
+          id: 1234,
+          display: true,
+        },
+      },
+    }
+    ctx.resolvedThreadIds = [
+      'comment2',
+      'comment4', // Comment in project but not in doc
+    ]
+
+    ctx.ProjectGetter = {
+      promises: {
+        getProject: sinon.stub().resolves(ctx.project),
+      },
+    }
+    ctx.ProjectLocator = {
+      promises: {
+        findElement: sinon
+          .stub()
+          .resolves({ element: ctx.doc, path: { fileSystem: ctx.pathname } }),
+      },
+    }
+    ctx.ProjectEntityHandler = {
+      promises: {
+        getDoc: sinon.stub().resolves({
+          lines: ctx.doc_lines,
+          rev: ctx.rev,
+          version: ctx.version,
+          ranges: ctx.ranges,
+        }),
+      },
+    }
+    ctx.ProjectEntityUpdateHandler = {
+      promises: {
+        updateDocLines: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.ChatApiHandler = {
+      promises: {
+        getResolvedThreadIds: sinon.stub().resolves(ctx.resolvedThreadIds),
+      },
+    }
+
+    ctx.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub().resolves(),
+        },
+      },
+    }
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator', () => ({
+      default: ctx.ProjectLocator,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectEntityHandler',
+      () => ({
+        default: ctx.ProjectEntityHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectEntityUpdateHandler',
+      () => ({
+        default: ctx.ProjectEntityUpdateHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Chat/ChatApiHandler', () => ({
+      default: ctx.ChatApiHandler,
+    }))
+
+    vi.doMock('../../../../app/src/infrastructure/Modules.js', () => ({
+      default: ctx.Modules,
+    }))
+
+    ctx.DocumentController = (await import(MODULE_PATH)).default
+  })
+
+  describe('getDocument', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.project._id,
+        doc_id: ctx.doc._id,
+      }
+    })
+
+    describe('when project exists with project history enabled', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.callback = err => {
+            resolve(err)
+          }
+          ctx.DocumentController.getDocument(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should return the history id and display setting to the client as JSON', function (ctx) {
+        ctx.res.type.should.equal('application/json')
+        JSON.parse(ctx.res.body).should.deep.equal({
+          lines: ctx.doc_lines,
+          version: ctx.version,
+          ranges: ctx.ranges,
+          pathname: ctx.pathname,
+          projectHistoryId: ctx.project.overleaf.history.id,
+          projectHistoryType: 'project-history',
+          resolvedCommentIds: ['comment2'],
+          historyRangesSupport: false,
+          otMigrationStage: 0,
+        })
+      })
+    })
+
+    describe('when the project does not exist', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectGetter.promises.getProject.resolves(null)
+          ctx.res.callback = err => {
+            resolve(err)
+          }
+          ctx.DocumentController.getDocument(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('returns a 404', function (ctx) {
+        ctx.res.statusCode.should.equal(404)
+      })
+    })
+  })
+
+  describe('setDocument', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = {
+        Project_id: ctx.project._id,
+        doc_id: ctx.doc._id,
+      }
+    })
+
+    describe('when the document exists', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.req.body = {
+            lines: ctx.doc_lines,
+            version: ctx.version,
+            ranges: ctx.ranges,
+            lastUpdatedAt: ctx.lastUpdatedAt,
+            lastUpdatedBy: ctx.lastUpdatedBy,
+          }
+          ctx.res.callback = err => {
+            resolve(err)
+          }
+          ctx.DocumentController.setDocument(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should update the document in Mongo', function (ctx) {
+        sinon.assert.calledWith(
+          ctx.ProjectEntityUpdateHandler.promises.updateDocLines,
+          ctx.project._id,
+          ctx.doc._id,
+          ctx.doc_lines,
+          ctx.version,
+          ctx.ranges,
+          ctx.lastUpdatedAt,
+          ctx.lastUpdatedBy
+        )
+      })
+
+      it('should return a successful response', function (ctx) {
+        ctx.res.success.should.equal(true)
+      })
+
+      it('should call the docModified hook', function (ctx) {
+        sinon.assert.calledWith(
+          ctx.Modules.promises.hooks.fire,
+          'docModified',
+          ctx.project._id,
+          ctx.doc._id
+        )
+      })
+    })
+
+    describe("when the document doesn't exist", function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectEntityUpdateHandler.promises.updateDocLines.rejects(
+            new Errors.NotFoundError('document does not exist')
+          )
+          ctx.req.body = { lines: ctx.doc_lines }
+          ctx.next.callsFake(() => {
+            resolve()
+          })
+          ctx.DocumentController.setDocument(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should call next with the NotFoundError', function (ctx) {
+        ctx.next
+          .calledWith(sinon.match.instanceOf(Errors.NotFoundError))
+          .should.equal(true)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Documents/DocumentControllerTests.mjs b/services/web/test/unit/src/Documents/DocumentControllerTests.mjs
deleted file mode 100644
index 29d03f152c..0000000000
--- a/services/web/test/unit/src/Documents/DocumentControllerTests.mjs
+++ /dev/null
@@ -1,208 +0,0 @@
-import sinon from 'sinon'
-import esmock from 'esmock'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-
-const MODULE_PATH =
-  '../../../../app/src/Features/Documents/DocumentController.mjs'
-
-describe('DocumentController', function () {
-  beforeEach(async function () {
-    this.res = new MockResponse()
-    this.req = new MockRequest()
-    this.next = sinon.stub()
-    this.doc = { _id: 'doc-id-123' }
-    this.doc_lines = ['one', 'two', 'three']
-    this.version = 42
-    this.ranges = {
-      comments: [
-        {
-          id: 'comment1',
-          op: {
-            c: 'foo',
-            p: 123,
-            t: 'comment1',
-          },
-        },
-        {
-          id: 'comment2',
-          op: {
-            c: 'bar',
-            p: 456,
-            t: 'comment2',
-          },
-        },
-      ],
-    }
-    this.pathname = '/a/b/c/file.tex'
-    this.lastUpdatedAt = new Date().getTime()
-    this.lastUpdatedBy = 'fake-last-updater-id'
-    this.rev = 5
-    this.project = {
-      _id: 'project-id-123',
-      overleaf: {
-        history: {
-          id: 1234,
-          display: true,
-        },
-      },
-    }
-    this.resolvedThreadIds = [
-      'comment2',
-      'comment4', // Comment in project but not in doc
-    ]
-
-    this.ProjectGetter = {
-      promises: {
-        getProject: sinon.stub().resolves(this.project),
-      },
-    }
-    this.ProjectLocator = {
-      promises: {
-        findElement: sinon
-          .stub()
-          .resolves({ element: this.doc, path: { fileSystem: this.pathname } }),
-      },
-    }
-    this.ProjectEntityHandler = {
-      promises: {
-        getDoc: sinon.stub().resolves({
-          lines: this.doc_lines,
-          rev: this.rev,
-          version: this.version,
-          ranges: this.ranges,
-        }),
-      },
-    }
-    this.ProjectEntityUpdateHandler = {
-      promises: {
-        updateDocLines: sinon.stub().resolves(),
-      },
-    }
-
-    this.ChatApiHandler = {
-      promises: {
-        getResolvedThreadIds: sinon.stub().resolves(this.resolvedThreadIds),
-      },
-    }
-
-    this.DocumentController = await esmock.strict(MODULE_PATH, {
-      '../../../../app/src/Features/Project/ProjectGetter': this.ProjectGetter,
-      '../../../../app/src/Features/Project/ProjectLocator':
-        this.ProjectLocator,
-      '../../../../app/src/Features/Project/ProjectEntityHandler':
-        this.ProjectEntityHandler,
-      '../../../../app/src/Features/Project/ProjectEntityUpdateHandler':
-        this.ProjectEntityUpdateHandler,
-      '../../../../app/src/Features/Chat/ChatApiHandler': this.ChatApiHandler,
-    })
-  })
-
-  describe('getDocument', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.project._id,
-        doc_id: this.doc._id,
-      }
-    })
-
-    describe('when project exists with project history enabled', function () {
-      beforeEach(function (done) {
-        this.res.callback = err => {
-          done(err)
-        }
-        this.DocumentController.getDocument(this.req, this.res, this.next)
-      })
-
-      it('should return the history id and display setting to the client as JSON', function () {
-        this.res.type.should.equal('application/json')
-        JSON.parse(this.res.body).should.deep.equal({
-          lines: this.doc_lines,
-          version: this.version,
-          ranges: this.ranges,
-          pathname: this.pathname,
-          projectHistoryId: this.project.overleaf.history.id,
-          projectHistoryType: 'project-history',
-          resolvedCommentIds: ['comment2'],
-          historyRangesSupport: false,
-        })
-      })
-    })
-
-    describe('when the project does not exist', function () {
-      beforeEach(function (done) {
-        this.ProjectGetter.promises.getProject.resolves(null)
-        this.res.callback = err => {
-          done(err)
-        }
-        this.DocumentController.getDocument(this.req, this.res, this.next)
-      })
-
-      it('returns a 404', function () {
-        this.res.statusCode.should.equal(404)
-      })
-    })
-  })
-
-  describe('setDocument', function () {
-    beforeEach(function () {
-      this.req.params = {
-        Project_id: this.project._id,
-        doc_id: this.doc._id,
-      }
-    })
-
-    describe('when the document exists', function () {
-      beforeEach(function (done) {
-        this.req.body = {
-          lines: this.doc_lines,
-          version: this.version,
-          ranges: this.ranges,
-          lastUpdatedAt: this.lastUpdatedAt,
-          lastUpdatedBy: this.lastUpdatedBy,
-        }
-        this.res.callback = err => {
-          done(err)
-        }
-        this.DocumentController.setDocument(this.req, this.res, this.next)
-      })
-
-      it('should update the document in Mongo', function () {
-        sinon.assert.calledWith(
-          this.ProjectEntityUpdateHandler.promises.updateDocLines,
-          this.project._id,
-          this.doc._id,
-          this.doc_lines,
-          this.version,
-          this.ranges,
-          this.lastUpdatedAt,
-          this.lastUpdatedBy
-        )
-      })
-
-      it('should return a successful response', function () {
-        this.res.success.should.equal(true)
-      })
-    })
-
-    describe("when the document doesn't exist", function () {
-      beforeEach(function (done) {
-        this.ProjectEntityUpdateHandler.promises.updateDocLines.rejects(
-          new Errors.NotFoundError('document does not exist')
-        )
-        this.req.body = { lines: this.doc_lines }
-        this.next.callsFake(() => {
-          done()
-        })
-        this.DocumentController.setDocument(this.req, this.res, this.next)
-      })
-
-      it('should call next with the NotFoundError', function () {
-        this.next
-          .calledWith(sinon.match.instanceOf(Errors.NotFoundError))
-          .should.equal(true)
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Downloads/ProjectDownloadsController.test.mjs b/services/web/test/unit/src/Downloads/ProjectDownloadsController.test.mjs
new file mode 100644
index 0000000000..f3737df0ab
--- /dev/null
+++ b/services/web/test/unit/src/Downloads/ProjectDownloadsController.test.mjs
@@ -0,0 +1,167 @@
+import { vi } from 'vitest'
+// TODO: This file was created by bulk-decaffeinate.
+// Fix any style issues and re-enable lint.
+/*
+ * decaffeinate suggestions:
+ * DS102: Remove unnecessary code created because of implicit returns
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
+ */
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+const modulePath =
+  '../../../../app/src/Features/Downloads/ProjectDownloadsController.mjs'
+
+describe('ProjectDownloadsController', function () {
+  beforeEach(async function (ctx) {
+    ctx.project_id = 'project-id-123'
+    ctx.req = new MockRequest()
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub()
+    ctx.DocumentUpdaterHandler = sinon.stub()
+
+    vi.doMock(
+      '../../../../app/src/Features/Downloads/ProjectZipStreamManager.mjs',
+      () => ({
+        default: (ctx.ProjectZipStreamManager = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter.js', () => ({
+      default: (ctx.ProjectGetter = {}),
+    }))
+
+    vi.doMock('@overleaf/metrics', () => ({
+      default: (ctx.metrics = {}),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js',
+      () => ({
+        default: ctx.DocumentUpdaterHandler,
+      })
+    )
+
+    ctx.ProjectDownloadsController = (await import(modulePath)).default
+  })
+
+  describe('downloadProject', function () {
+    beforeEach(function (ctx) {
+      ctx.stream = { pipe: sinon.stub() }
+      ctx.ProjectZipStreamManager.createZipStreamForProject = sinon
+        .stub()
+        .callsArgWith(1, null, ctx.stream)
+      ctx.req.params = { Project_id: ctx.project_id }
+      ctx.project_name = 'project name with accênts and % special characters'
+      ctx.ProjectGetter.getProject = sinon
+        .stub()
+        .callsArgWith(2, null, { name: ctx.project_name })
+      ctx.DocumentUpdaterHandler.flushProjectToMongo = sinon
+        .stub()
+        .callsArgWith(1)
+      ctx.metrics.inc = sinon.stub()
+      return ctx.ProjectDownloadsController.downloadProject(
+        ctx.req,
+        ctx.res,
+        ctx.next
+      )
+    })
+
+    it('should create a zip from the project', function (ctx) {
+      return ctx.ProjectZipStreamManager.createZipStreamForProject
+        .calledWith(ctx.project_id)
+        .should.equal(true)
+    })
+
+    it('should stream the zip to the request', function (ctx) {
+      return ctx.stream.pipe.calledWith(ctx.res).should.equal(true)
+    })
+
+    it('should set the correct content type on the request', function (ctx) {
+      return ctx.res.contentType
+        .calledWith('application/zip')
+        .should.equal(true)
+    })
+
+    it('should flush the project to mongo', function (ctx) {
+      return ctx.DocumentUpdaterHandler.flushProjectToMongo
+        .calledWith(ctx.project_id)
+        .should.equal(true)
+    })
+
+    it("should look up the project's name", function (ctx) {
+      return ctx.ProjectGetter.getProject
+        .calledWith(ctx.project_id, { name: true })
+        .should.equal(true)
+    })
+
+    it('should name the downloaded file after the project but sanitise special characters', function (ctx) {
+      ctx.res.headers.should.deep.equal({
+        'Content-Disposition': `attachment; filename="project_name_with_accênts_and___special_characters.zip"`,
+        'Content-Type': 'application/zip',
+        'X-Content-Type-Options': 'nosniff',
+      })
+    })
+
+    it('should record the action via Metrics', function (ctx) {
+      return ctx.metrics.inc.calledWith('zip-downloads').should.equal(true)
+    })
+  })
+
+  describe('downloadMultipleProjects', function () {
+    beforeEach(function (ctx) {
+      ctx.stream = { pipe: sinon.stub() }
+      ctx.ProjectZipStreamManager.createZipStreamForMultipleProjects = sinon
+        .stub()
+        .callsArgWith(1, null, ctx.stream)
+      ctx.project_ids = ['project-1', 'project-2']
+      ctx.req.query = { project_ids: ctx.project_ids.join(',') }
+      ctx.DocumentUpdaterHandler.flushMultipleProjectsToMongo = sinon
+        .stub()
+        .callsArgWith(1)
+      ctx.metrics.inc = sinon.stub()
+      return ctx.ProjectDownloadsController.downloadMultipleProjects(
+        ctx.req,
+        ctx.res,
+        ctx.next
+      )
+    })
+
+    it('should create a zip from the project', function (ctx) {
+      return ctx.ProjectZipStreamManager.createZipStreamForMultipleProjects
+        .calledWith(ctx.project_ids)
+        .should.equal(true)
+    })
+
+    it('should stream the zip to the request', function (ctx) {
+      return ctx.stream.pipe.calledWith(ctx.res).should.equal(true)
+    })
+
+    it('should set the correct content type on the request', function (ctx) {
+      return ctx.res.contentType
+        .calledWith('application/zip')
+        .should.equal(true)
+    })
+
+    it('should flush the projects to mongo', function (ctx) {
+      return ctx.DocumentUpdaterHandler.flushMultipleProjectsToMongo
+        .calledWith(ctx.project_ids)
+        .should.equal(true)
+    })
+
+    it('should name the downloaded file after the project', function (ctx) {
+      ctx.res.headers.should.deep.equal({
+        'Content-Disposition':
+          'attachment; filename="Overleaf Projects (2 items).zip"',
+        'Content-Type': 'application/zip',
+        'X-Content-Type-Options': 'nosniff',
+      })
+    })
+
+    it('should record the action via Metrics', function (ctx) {
+      return ctx.metrics.inc
+        .calledWith('zip-downloads-multiple')
+        .should.equal(true)
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Downloads/ProjectDownloadsControllerTests.mjs b/services/web/test/unit/src/Downloads/ProjectDownloadsControllerTests.mjs
deleted file mode 100644
index db9cf19df7..0000000000
--- a/services/web/test/unit/src/Downloads/ProjectDownloadsControllerTests.mjs
+++ /dev/null
@@ -1,152 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import sinon from 'sinon'
-import esmock from 'esmock'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-const modulePath =
-  '../../../../app/src/Features/Downloads/ProjectDownloadsController.mjs'
-
-describe('ProjectDownloadsController', function () {
-  beforeEach(async function () {
-    this.project_id = 'project-id-123'
-    this.req = new MockRequest()
-    this.res = new MockResponse()
-    this.next = sinon.stub()
-    this.DocumentUpdaterHandler = sinon.stub()
-    return (this.ProjectDownloadsController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Downloads/ProjectZipStreamManager.mjs':
-        (this.ProjectZipStreamManager = {}),
-      '../../../../app/src/Features/Project/ProjectGetter.js':
-        (this.ProjectGetter = {}),
-      '@overleaf/metrics': (this.metrics = {}),
-      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler.js':
-        this.DocumentUpdaterHandler,
-    }))
-  })
-
-  describe('downloadProject', function () {
-    beforeEach(function () {
-      this.stream = { pipe: sinon.stub() }
-      this.ProjectZipStreamManager.createZipStreamForProject = sinon
-        .stub()
-        .callsArgWith(1, null, this.stream)
-      this.req.params = { Project_id: this.project_id }
-      this.project_name = 'project name with accênts'
-      this.ProjectGetter.getProject = sinon
-        .stub()
-        .callsArgWith(2, null, { name: this.project_name })
-      this.DocumentUpdaterHandler.flushProjectToMongo = sinon
-        .stub()
-        .callsArgWith(1)
-      this.metrics.inc = sinon.stub()
-      return this.ProjectDownloadsController.downloadProject(
-        this.req,
-        this.res,
-        this.next
-      )
-    })
-
-    it('should create a zip from the project', function () {
-      return this.ProjectZipStreamManager.createZipStreamForProject
-        .calledWith(this.project_id)
-        .should.equal(true)
-    })
-
-    it('should stream the zip to the request', function () {
-      return this.stream.pipe.calledWith(this.res).should.equal(true)
-    })
-
-    it('should set the correct content type on the request', function () {
-      return this.res.contentType
-        .calledWith('application/zip')
-        .should.equal(true)
-    })
-
-    it('should flush the project to mongo', function () {
-      return this.DocumentUpdaterHandler.flushProjectToMongo
-        .calledWith(this.project_id)
-        .should.equal(true)
-    })
-
-    it("should look up the project's name", function () {
-      return this.ProjectGetter.getProject
-        .calledWith(this.project_id, { name: true })
-        .should.equal(true)
-    })
-
-    it('should name the downloaded file after the project', function () {
-      this.res.headers.should.deep.equal({
-        'Content-Disposition': `attachment; filename="${this.project_name}.zip"`,
-        'Content-Type': 'application/zip',
-        'X-Content-Type-Options': 'nosniff',
-      })
-    })
-
-    it('should record the action via Metrics', function () {
-      return this.metrics.inc.calledWith('zip-downloads').should.equal(true)
-    })
-  })
-
-  describe('downloadMultipleProjects', function () {
-    beforeEach(function () {
-      this.stream = { pipe: sinon.stub() }
-      this.ProjectZipStreamManager.createZipStreamForMultipleProjects = sinon
-        .stub()
-        .callsArgWith(1, null, this.stream)
-      this.project_ids = ['project-1', 'project-2']
-      this.req.query = { project_ids: this.project_ids.join(',') }
-      this.DocumentUpdaterHandler.flushMultipleProjectsToMongo = sinon
-        .stub()
-        .callsArgWith(1)
-      this.metrics.inc = sinon.stub()
-      return this.ProjectDownloadsController.downloadMultipleProjects(
-        this.req,
-        this.res,
-        this.next
-      )
-    })
-
-    it('should create a zip from the project', function () {
-      return this.ProjectZipStreamManager.createZipStreamForMultipleProjects
-        .calledWith(this.project_ids)
-        .should.equal(true)
-    })
-
-    it('should stream the zip to the request', function () {
-      return this.stream.pipe.calledWith(this.res).should.equal(true)
-    })
-
-    it('should set the correct content type on the request', function () {
-      return this.res.contentType
-        .calledWith('application/zip')
-        .should.equal(true)
-    })
-
-    it('should flush the projects to mongo', function () {
-      return this.DocumentUpdaterHandler.flushMultipleProjectsToMongo
-        .calledWith(this.project_ids)
-        .should.equal(true)
-    })
-
-    it('should name the downloaded file after the project', function () {
-      this.res.headers.should.deep.equal({
-        'Content-Disposition':
-          'attachment; filename="Overleaf Projects (2 items).zip"',
-        'Content-Type': 'application/zip',
-        'X-Content-Type-Options': 'nosniff',
-      })
-    })
-
-    it('should record the action via Metrics', function () {
-      return this.metrics.inc
-        .calledWith('zip-downloads-multiple')
-        .should.equal(true)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Downloads/ProjectZipStreamManager.test.mjs b/services/web/test/unit/src/Downloads/ProjectZipStreamManager.test.mjs
new file mode 100644
index 0000000000..deb9275c5f
--- /dev/null
+++ b/services/web/test/unit/src/Downloads/ProjectZipStreamManager.test.mjs
@@ -0,0 +1,503 @@
+import { vi } from 'vitest'
+// TODO: This file was created by bulk-decaffeinate.
+// Fix any style issues and re-enable lint.
+/*
+ * decaffeinate suggestions:
+ * DS101: Remove unnecessary use of Array.from
+ * DS102: Remove unnecessary code created because of implicit returns
+ * DS201: Simplify complex destructure assignments
+ * DS205: Consider reworking code to avoid use of IIFEs
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
+ */
+import sinon from 'sinon'
+import { EventEmitter } from 'events'
+const modulePath =
+  '../../../../app/src/Features/Downloads/ProjectZipStreamManager.mjs'
+
+describe('ProjectZipStreamManager', function () {
+  beforeEach(async function (ctx) {
+    ctx.project_id = 'project-id-123'
+    ctx.callback = sinon.stub()
+    ctx.archive = {
+      on() {},
+      append: sinon.stub(),
+    }
+    ctx.logger = {
+      error: sinon.stub(),
+      info: sinon.stub(),
+      debug: sinon.stub(),
+    }
+
+    vi.doMock('archiver', () => ({
+      default: (ctx.archiver = sinon.stub().returns(ctx.archive)),
+    }))
+
+    vi.doMock('@overleaf/logger', () => ({
+      default: ctx.logger,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectEntityHandler',
+      () => ({
+        default: (ctx.ProjectEntityHandler = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/History/HistoryManager.js', () => ({
+      default: (ctx.HistoryManager = {}),
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: (ctx.ProjectGetter = {}),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/FileStore/FileStoreHandler',
+      () => ({
+        default: (ctx.FileStoreHandler = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Features', () => ({
+      default: (ctx.Features = {
+        hasFeature: sinon
+          .stub()
+          .withArgs('project-history-blobs')
+          .returns(true),
+      }),
+    }))
+
+    ctx.ProjectZipStreamManager = (await import(modulePath)).default
+  })
+
+  describe('createZipStreamForMultipleProjects', function () {
+    describe('successfully', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.project_ids = ['project-1', 'project-2']
+          ctx.zip_streams = {
+            'project-1': new EventEmitter(),
+            'project-2': new EventEmitter(),
+          }
+
+          ctx.project_names = {
+            'project-1': 'Project One Name',
+            'project-2': 'Project Two Name',
+          }
+
+          ctx.ProjectZipStreamManager.createZipStreamForProject = (
+            projectId,
+            callback
+          ) => {
+            callback(null, ctx.zip_streams[projectId])
+            setTimeout(() => {
+              return ctx.zip_streams[projectId].emit('end')
+            })
+            return 0
+          }
+          sinon.spy(ctx.ProjectZipStreamManager, 'createZipStreamForProject')
+
+          ctx.ProjectGetter.getProject = (projectId, fields, callback) => {
+            return callback(null, { name: ctx.project_names[projectId] })
+          }
+          sinon.spy(ctx.ProjectGetter, 'getProject')
+
+          ctx.ProjectZipStreamManager.createZipStreamForMultipleProjects(
+            ctx.project_ids,
+            (...args) => {
+              return ctx.callback(...Array.from(args || []))
+            }
+          )
+
+          return (ctx.archive.finalize = () => resolve())
+        })
+      })
+
+      it('should create a zip archive', function (ctx) {
+        return ctx.archiver.calledWith('zip').should.equal(true)
+      })
+
+      it('should return a stream before any processing is done', function (ctx) {
+        ctx.callback
+          .calledWith(sinon.match.falsy, ctx.archive)
+          .should.equal(true)
+        return ctx.callback
+          .calledBefore(ctx.ProjectZipStreamManager.createZipStreamForProject)
+          .should.equal(true)
+      })
+
+      it('should get a zip stream for all of the projects', function (ctx) {
+        return Array.from(ctx.project_ids).map(projectId =>
+          ctx.ProjectZipStreamManager.createZipStreamForProject
+            .calledWith(projectId)
+            .should.equal(true)
+        )
+      })
+
+      it('should get the names of each project', function (ctx) {
+        return Array.from(ctx.project_ids).map(projectId =>
+          ctx.ProjectGetter.getProject
+            .calledWith(projectId, { name: true })
+            .should.equal(true)
+        )
+      })
+
+      it('should add all of the projects to the zip', function (ctx) {
+        return Array.from(ctx.project_ids).map(projectId =>
+          ctx.archive.append
+            .calledWith(ctx.zip_streams[projectId], {
+              name: ctx.project_names[projectId] + '.zip',
+            })
+            .should.equal(true)
+        )
+      })
+    })
+
+    describe('with a project not existing', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.project_ids = ['project-1', 'wrong-id']
+          ctx.project_names = {
+            'project-1': 'Project One Name',
+          }
+          ctx.zip_streams = {
+            'project-1': new EventEmitter(),
+          }
+
+          ctx.ProjectZipStreamManager.createZipStreamForProject = (
+            projectId,
+            callback
+          ) => {
+            callback(null, ctx.zip_streams[projectId])
+            setTimeout(() => {
+              ctx.zip_streams[projectId].emit('end')
+            })
+          }
+          sinon.spy(ctx.ProjectZipStreamManager, 'createZipStreamForProject')
+
+          ctx.ProjectGetter.getProject = (projectId, fields, callback) => {
+            const name = ctx.project_names[projectId]
+            callback(null, name ? { name } : undefined)
+          }
+          sinon.spy(ctx.ProjectGetter, 'getProject')
+
+          ctx.ProjectZipStreamManager.createZipStreamForMultipleProjects(
+            ctx.project_ids,
+            ctx.callback
+          )
+
+          ctx.archive.finalize = () => resolve()
+        })
+      })
+
+      it('should create a zip archive', function (ctx) {
+        ctx.archiver.calledWith('zip').should.equal(true)
+      })
+
+      it('should return a stream before any processing is done', function (ctx) {
+        ctx.callback
+          .calledWith(sinon.match.falsy, ctx.archive)
+          .should.equal(true)
+        ctx.callback
+          .calledBefore(ctx.ProjectZipStreamManager.createZipStreamForProject)
+          .should.equal(true)
+      })
+
+      it('should get the names of each project', function (ctx) {
+        ctx.project_ids.map(projectId =>
+          ctx.ProjectGetter.getProject
+            .calledWith(projectId, { name: true })
+            .should.equal(true)
+        )
+      })
+
+      it('should get a zip stream only for the existing project', function (ctx) {
+        ctx.ProjectZipStreamManager.createZipStreamForProject
+          .calledWith('project-1')
+          .should.equal(true)
+        ctx.ProjectZipStreamManager.createZipStreamForProject
+          .calledWith('wrong-id')
+          .should.equal(false)
+      })
+
+      it('should only add the existing project to the zip', function (ctx) {
+        sinon.assert.calledOnce(ctx.archive.append)
+        ctx.archive.append
+          .calledWith(ctx.zip_streams['project-1'], {
+            name: ctx.project_names['project-1'] + '.zip',
+          })
+          .should.equal(true)
+      })
+    })
+  })
+
+  describe('createZipStreamForProject', function () {
+    describe('successfully', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectZipStreamManager.addAllDocsToArchive = sinon
+          .stub()
+          .callsArg(2)
+        ctx.ProjectZipStreamManager.addAllFilesToArchive = sinon
+          .stub()
+          .callsArg(2)
+        ctx.archive.finalize = sinon.stub()
+        return ctx.ProjectZipStreamManager.createZipStreamForProject(
+          ctx.project_id,
+          ctx.callback
+        )
+      })
+
+      it('should create a zip archive', function (ctx) {
+        return ctx.archiver.calledWith('zip').should.equal(true)
+      })
+
+      it('should return a stream before any processing is done', function (ctx) {
+        ctx.callback
+          .calledWith(sinon.match.falsy, ctx.archive)
+          .should.equal(true)
+        ctx.callback
+          .calledBefore(ctx.ProjectZipStreamManager.addAllDocsToArchive)
+          .should.equal(true)
+        return ctx.callback
+          .calledBefore(ctx.ProjectZipStreamManager.addAllFilesToArchive)
+          .should.equal(true)
+      })
+
+      it('should add all of the project docs to the zip', function (ctx) {
+        return ctx.ProjectZipStreamManager.addAllDocsToArchive
+          .calledWith(ctx.project_id, ctx.archive)
+          .should.equal(true)
+      })
+
+      it('should add all of the project files to the zip', function (ctx) {
+        return ctx.ProjectZipStreamManager.addAllFilesToArchive
+          .calledWith(ctx.project_id, ctx.archive)
+          .should.equal(true)
+      })
+
+      it('should finalise the stream', function (ctx) {
+        return ctx.archive.finalize.called.should.equal(true)
+      })
+    })
+
+    describe('with an error adding docs', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectZipStreamManager.addAllDocsToArchive = sinon
+          .stub()
+          .callsArgWith(2, new Error('something went wrong'))
+        ctx.ProjectZipStreamManager.addAllFilesToArchive = sinon
+          .stub()
+          .callsArg(2)
+        ctx.archive.finalize = sinon.stub()
+        ctx.ProjectZipStreamManager.createZipStreamForProject(
+          ctx.project_id,
+          ctx.callback
+        )
+      })
+
+      it('should log out an error', function (ctx) {
+        return ctx.logger.error
+          .calledWith(sinon.match.any, 'error adding docs to zip stream')
+          .should.equal(true)
+      })
+
+      it('should continue with the process', function (ctx) {
+        ctx.ProjectZipStreamManager.addAllDocsToArchive.called.should.equal(
+          true
+        )
+        ctx.ProjectZipStreamManager.addAllFilesToArchive.called.should.equal(
+          true
+        )
+        return ctx.archive.finalize.called.should.equal(true)
+      })
+    })
+
+    describe('with an error adding files', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectZipStreamManager.addAllDocsToArchive = sinon
+          .stub()
+          .callsArg(2)
+        ctx.ProjectZipStreamManager.addAllFilesToArchive = sinon
+          .stub()
+          .callsArgWith(2, new Error('something went wrong'))
+        ctx.archive.finalize = sinon.stub()
+        return ctx.ProjectZipStreamManager.createZipStreamForProject(
+          ctx.project_id,
+          ctx.callback
+        )
+      })
+
+      it('should log out an error', function (ctx) {
+        return ctx.logger.error
+          .calledWith(sinon.match.any, 'error adding files to zip stream')
+          .should.equal(true)
+      })
+
+      it('should continue with the process', function (ctx) {
+        ctx.ProjectZipStreamManager.addAllDocsToArchive.called.should.equal(
+          true
+        )
+        ctx.ProjectZipStreamManager.addAllFilesToArchive.called.should.equal(
+          true
+        )
+        return ctx.archive.finalize.called.should.equal(true)
+      })
+    })
+  })
+
+  describe('addAllDocsToArchive', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.docs = {
+          '/main.tex': {
+            lines: [
+              '\\documentclass{article}',
+              '\\begin{document}',
+              'Hello world',
+              '\\end{document}',
+            ],
+          },
+          '/chapters/chapter1.tex': {
+            lines: ['chapter1', 'content'],
+          },
+        }
+        ctx.ProjectEntityHandler.getAllDocs = sinon
+          .stub()
+          .callsArgWith(1, null, ctx.docs)
+        return ctx.ProjectZipStreamManager.addAllDocsToArchive(
+          ctx.project_id,
+          ctx.archive,
+          error => {
+            ctx.callback(error)
+            return resolve()
+          }
+        )
+      })
+    })
+
+    it('should get the docs for the project', function (ctx) {
+      return ctx.ProjectEntityHandler.getAllDocs
+        .calledWith(ctx.project_id)
+        .should.equal(true)
+    })
+
+    it('should add each doc to the archive', function (ctx) {
+      return (() => {
+        const result = []
+        for (let path in ctx.docs) {
+          const doc = ctx.docs[path]
+          path = path.slice(1) // remove "/"
+          result.push(
+            ctx.archive.append
+              .calledWith(doc.lines.join('\n'), { name: path })
+              .should.equal(true)
+          )
+        }
+        return result
+      })()
+    })
+  })
+
+  describe('addAllFilesToArchive', function () {
+    beforeEach(function (ctx) {
+      ctx.files = {
+        '/image.png': {
+          _id: 'file-id-1',
+          hash: 'abc',
+        },
+        '/folder/picture.png': {
+          _id: 'file-id-2',
+          hash: 'def',
+        },
+      }
+      ctx.streams = {
+        'file-id-1': new EventEmitter(),
+        'file-id-2': new EventEmitter(),
+      }
+      ctx.ProjectEntityHandler.getAllFiles = sinon
+        .stub()
+        .callsArgWith(1, null, ctx.files)
+    })
+    describe('with project-history-blobs feature enabled', function () {
+      beforeEach(function (ctx) {
+        ctx.HistoryManager.requestBlobWithFallback = (
+          projectId,
+          hash,
+          fileId,
+          callback
+        ) => {
+          return callback(null, { stream: ctx.streams[fileId] })
+        }
+        sinon.spy(ctx.HistoryManager, 'requestBlobWithFallback')
+        ctx.ProjectZipStreamManager.addAllFilesToArchive(
+          ctx.project_id,
+          ctx.archive,
+          ctx.callback
+        )
+        for (const path in ctx.streams) {
+          const stream = ctx.streams[path]
+          stream.emit('end')
+        }
+      })
+
+      it('should get the files for the project', function (ctx) {
+        return ctx.ProjectEntityHandler.getAllFiles
+          .calledWith(ctx.project_id)
+          .should.equal(true)
+      })
+
+      it('should get a stream for each file', function (ctx) {
+        for (const path in ctx.files) {
+          const file = ctx.files[path]
+
+          ctx.HistoryManager.requestBlobWithFallback
+            .calledWith(ctx.project_id, file.hash, file._id)
+            .should.equal(true)
+        }
+      })
+
+      it('should add each file to the archive', function (ctx) {
+        for (let path in ctx.files) {
+          const file = ctx.files[path]
+          path = path.slice(1) // remove "/"
+          ctx.archive.append
+            .calledWith(ctx.streams[file._id], { name: path })
+            .should.equal(true)
+        }
+      })
+    })
+
+    describe('with project-history-blobs feature disabled', function () {
+      beforeEach(function (ctx) {
+        ctx.FileStoreHandler.getFileStream = (
+          projectId,
+          fileId,
+          query,
+          callback
+        ) => callback(null, ctx.streams[fileId])
+
+        sinon.spy(ctx.FileStoreHandler, 'getFileStream')
+        ctx.Features.hasFeature.withArgs('project-history-blobs').returns(false)
+        ctx.ProjectZipStreamManager.addAllFilesToArchive(
+          ctx.project_id,
+          ctx.archive,
+          ctx.callback
+        )
+        for (const path in ctx.streams) {
+          const stream = ctx.streams[path]
+          stream.emit('end')
+        }
+      })
+
+      it('should get a stream for each file', function (ctx) {
+        for (const path in ctx.files) {
+          const file = ctx.files[path]
+
+          ctx.FileStoreHandler.getFileStream
+            .calledWith(ctx.project_id, file._id)
+            .should.equal(true)
+        }
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Downloads/ProjectZipStreamManagerTests.mjs b/services/web/test/unit/src/Downloads/ProjectZipStreamManagerTests.mjs
deleted file mode 100644
index f86b99bd96..0000000000
--- a/services/web/test/unit/src/Downloads/ProjectZipStreamManagerTests.mjs
+++ /dev/null
@@ -1,477 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS101: Remove unnecessary use of Array.from
- * DS102: Remove unnecessary code created because of implicit returns
- * DS201: Simplify complex destructure assignments
- * DS205: Consider reworking code to avoid use of IIFEs
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import sinon from 'sinon'
-import esmock from 'esmock'
-import { EventEmitter } from 'events'
-const modulePath =
-  '../../../../app/src/Features/Downloads/ProjectZipStreamManager.mjs'
-
-describe('ProjectZipStreamManager', function () {
-  beforeEach(async function () {
-    this.project_id = 'project-id-123'
-    this.callback = sinon.stub()
-    this.archive = {
-      on() {},
-      append: sinon.stub(),
-    }
-    this.logger = {
-      error: sinon.stub(),
-      info: sinon.stub(),
-      debug: sinon.stub(),
-    }
-
-    return (this.ProjectZipStreamManager = await esmock.strict(modulePath, {
-      archiver: (this.archiver = sinon.stub().returns(this.archive)),
-      '@overleaf/logger': this.logger,
-      '../../../../app/src/Features/Project/ProjectEntityHandler':
-        (this.ProjectEntityHandler = {}),
-      '../../../../app/src/Features/History/HistoryManager.js':
-        (this.HistoryManager = {}),
-      '../../../../app/src/Features/Project/ProjectGetter':
-        (this.ProjectGetter = {}),
-      '../../../../app/src/Features/FileStore/FileStoreHandler':
-        (this.FileStoreHandler = {}),
-      '../../../../app/src/infrastructure/Features': (this.Features = {
-        hasFeature: sinon
-          .stub()
-          .withArgs('project-history-blobs')
-          .returns(true),
-      }),
-    }))
-  })
-
-  describe('createZipStreamForMultipleProjects', function () {
-    describe('successfully', function () {
-      beforeEach(function (done) {
-        this.project_ids = ['project-1', 'project-2']
-        this.zip_streams = {
-          'project-1': new EventEmitter(),
-          'project-2': new EventEmitter(),
-        }
-
-        this.project_names = {
-          'project-1': 'Project One Name',
-          'project-2': 'Project Two Name',
-        }
-
-        this.ProjectZipStreamManager.createZipStreamForProject = (
-          projectId,
-          callback
-        ) => {
-          callback(null, this.zip_streams[projectId])
-          setTimeout(() => {
-            return this.zip_streams[projectId].emit('end')
-          })
-          return 0
-        }
-        sinon.spy(this.ProjectZipStreamManager, 'createZipStreamForProject')
-
-        this.ProjectGetter.getProject = (projectId, fields, callback) => {
-          return callback(null, { name: this.project_names[projectId] })
-        }
-        sinon.spy(this.ProjectGetter, 'getProject')
-
-        this.ProjectZipStreamManager.createZipStreamForMultipleProjects(
-          this.project_ids,
-          (...args) => {
-            return this.callback(...Array.from(args || []))
-          }
-        )
-
-        return (this.archive.finalize = () => done())
-      })
-
-      it('should create a zip archive', function () {
-        return this.archiver.calledWith('zip').should.equal(true)
-      })
-
-      it('should return a stream before any processing is done', function () {
-        this.callback
-          .calledWith(sinon.match.falsy, this.archive)
-          .should.equal(true)
-        return this.callback
-          .calledBefore(this.ProjectZipStreamManager.createZipStreamForProject)
-          .should.equal(true)
-      })
-
-      it('should get a zip stream for all of the projects', function () {
-        return Array.from(this.project_ids).map(projectId =>
-          this.ProjectZipStreamManager.createZipStreamForProject
-            .calledWith(projectId)
-            .should.equal(true)
-        )
-      })
-
-      it('should get the names of each project', function () {
-        return Array.from(this.project_ids).map(projectId =>
-          this.ProjectGetter.getProject
-            .calledWith(projectId, { name: true })
-            .should.equal(true)
-        )
-      })
-
-      it('should add all of the projects to the zip', function () {
-        return Array.from(this.project_ids).map(projectId =>
-          this.archive.append
-            .calledWith(this.zip_streams[projectId], {
-              name: this.project_names[projectId] + '.zip',
-            })
-            .should.equal(true)
-        )
-      })
-    })
-
-    describe('with a project not existing', function () {
-      beforeEach(function (done) {
-        this.project_ids = ['project-1', 'wrong-id']
-        this.project_names = {
-          'project-1': 'Project One Name',
-        }
-        this.zip_streams = {
-          'project-1': new EventEmitter(),
-        }
-
-        this.ProjectZipStreamManager.createZipStreamForProject = (
-          projectId,
-          callback
-        ) => {
-          callback(null, this.zip_streams[projectId])
-          setTimeout(() => {
-            this.zip_streams[projectId].emit('end')
-          })
-        }
-        sinon.spy(this.ProjectZipStreamManager, 'createZipStreamForProject')
-
-        this.ProjectGetter.getProject = (projectId, fields, callback) => {
-          const name = this.project_names[projectId]
-          callback(null, name ? { name } : undefined)
-        }
-        sinon.spy(this.ProjectGetter, 'getProject')
-
-        this.ProjectZipStreamManager.createZipStreamForMultipleProjects(
-          this.project_ids,
-          this.callback
-        )
-
-        this.archive.finalize = () => done()
-      })
-
-      it('should create a zip archive', function () {
-        this.archiver.calledWith('zip').should.equal(true)
-      })
-
-      it('should return a stream before any processing is done', function () {
-        this.callback
-          .calledWith(sinon.match.falsy, this.archive)
-          .should.equal(true)
-        this.callback
-          .calledBefore(this.ProjectZipStreamManager.createZipStreamForProject)
-          .should.equal(true)
-      })
-
-      it('should get the names of each project', function () {
-        this.project_ids.map(projectId =>
-          this.ProjectGetter.getProject
-            .calledWith(projectId, { name: true })
-            .should.equal(true)
-        )
-      })
-
-      it('should get a zip stream only for the existing project', function () {
-        this.ProjectZipStreamManager.createZipStreamForProject
-          .calledWith('project-1')
-          .should.equal(true)
-        this.ProjectZipStreamManager.createZipStreamForProject
-          .calledWith('wrong-id')
-          .should.equal(false)
-      })
-
-      it('should only add the existing project to the zip', function () {
-        sinon.assert.calledOnce(this.archive.append)
-        this.archive.append
-          .calledWith(this.zip_streams['project-1'], {
-            name: this.project_names['project-1'] + '.zip',
-          })
-          .should.equal(true)
-      })
-    })
-  })
-
-  describe('createZipStreamForProject', function () {
-    describe('successfully', function () {
-      beforeEach(function () {
-        this.ProjectZipStreamManager.addAllDocsToArchive = sinon
-          .stub()
-          .callsArg(2)
-        this.ProjectZipStreamManager.addAllFilesToArchive = sinon
-          .stub()
-          .callsArg(2)
-        this.archive.finalize = sinon.stub()
-        return this.ProjectZipStreamManager.createZipStreamForProject(
-          this.project_id,
-          this.callback
-        )
-      })
-
-      it('should create a zip archive', function () {
-        return this.archiver.calledWith('zip').should.equal(true)
-      })
-
-      it('should return a stream before any processing is done', function () {
-        this.callback
-          .calledWith(sinon.match.falsy, this.archive)
-          .should.equal(true)
-        this.callback
-          .calledBefore(this.ProjectZipStreamManager.addAllDocsToArchive)
-          .should.equal(true)
-        return this.callback
-          .calledBefore(this.ProjectZipStreamManager.addAllFilesToArchive)
-          .should.equal(true)
-      })
-
-      it('should add all of the project docs to the zip', function () {
-        return this.ProjectZipStreamManager.addAllDocsToArchive
-          .calledWith(this.project_id, this.archive)
-          .should.equal(true)
-      })
-
-      it('should add all of the project files to the zip', function () {
-        return this.ProjectZipStreamManager.addAllFilesToArchive
-          .calledWith(this.project_id, this.archive)
-          .should.equal(true)
-      })
-
-      it('should finalise the stream', function () {
-        return this.archive.finalize.called.should.equal(true)
-      })
-    })
-
-    describe('with an error adding docs', function () {
-      beforeEach(function () {
-        this.ProjectZipStreamManager.addAllDocsToArchive = sinon
-          .stub()
-          .callsArgWith(2, new Error('something went wrong'))
-        this.ProjectZipStreamManager.addAllFilesToArchive = sinon
-          .stub()
-          .callsArg(2)
-        this.archive.finalize = sinon.stub()
-        this.ProjectZipStreamManager.createZipStreamForProject(
-          this.project_id,
-          this.callback
-        )
-      })
-
-      it('should log out an error', function () {
-        return this.logger.error
-          .calledWith(sinon.match.any, 'error adding docs to zip stream')
-          .should.equal(true)
-      })
-
-      it('should continue with the process', function () {
-        this.ProjectZipStreamManager.addAllDocsToArchive.called.should.equal(
-          true
-        )
-        this.ProjectZipStreamManager.addAllFilesToArchive.called.should.equal(
-          true
-        )
-        return this.archive.finalize.called.should.equal(true)
-      })
-    })
-
-    describe('with an error adding files', function () {
-      beforeEach(function () {
-        this.ProjectZipStreamManager.addAllDocsToArchive = sinon
-          .stub()
-          .callsArg(2)
-        this.ProjectZipStreamManager.addAllFilesToArchive = sinon
-          .stub()
-          .callsArgWith(2, new Error('something went wrong'))
-        this.archive.finalize = sinon.stub()
-        return this.ProjectZipStreamManager.createZipStreamForProject(
-          this.project_id,
-          this.callback
-        )
-      })
-
-      it('should log out an error', function () {
-        return this.logger.error
-          .calledWith(sinon.match.any, 'error adding files to zip stream')
-          .should.equal(true)
-      })
-
-      it('should continue with the process', function () {
-        this.ProjectZipStreamManager.addAllDocsToArchive.called.should.equal(
-          true
-        )
-        this.ProjectZipStreamManager.addAllFilesToArchive.called.should.equal(
-          true
-        )
-        return this.archive.finalize.called.should.equal(true)
-      })
-    })
-  })
-
-  describe('addAllDocsToArchive', function () {
-    beforeEach(function (done) {
-      this.docs = {
-        '/main.tex': {
-          lines: [
-            '\\documentclass{article}',
-            '\\begin{document}',
-            'Hello world',
-            '\\end{document}',
-          ],
-        },
-        '/chapters/chapter1.tex': {
-          lines: ['chapter1', 'content'],
-        },
-      }
-      this.ProjectEntityHandler.getAllDocs = sinon
-        .stub()
-        .callsArgWith(1, null, this.docs)
-      return this.ProjectZipStreamManager.addAllDocsToArchive(
-        this.project_id,
-        this.archive,
-        error => {
-          this.callback(error)
-          return done()
-        }
-      )
-    })
-
-    it('should get the docs for the project', function () {
-      return this.ProjectEntityHandler.getAllDocs
-        .calledWith(this.project_id)
-        .should.equal(true)
-    })
-
-    it('should add each doc to the archive', function () {
-      return (() => {
-        const result = []
-        for (let path in this.docs) {
-          const doc = this.docs[path]
-          path = path.slice(1) // remove "/"
-          result.push(
-            this.archive.append
-              .calledWith(doc.lines.join('\n'), { name: path })
-              .should.equal(true)
-          )
-        }
-        return result
-      })()
-    })
-  })
-
-  describe('addAllFilesToArchive', function () {
-    beforeEach(function () {
-      this.files = {
-        '/image.png': {
-          _id: 'file-id-1',
-          hash: 'abc',
-        },
-        '/folder/picture.png': {
-          _id: 'file-id-2',
-          hash: 'def',
-        },
-      }
-      this.streams = {
-        'file-id-1': new EventEmitter(),
-        'file-id-2': new EventEmitter(),
-      }
-      this.ProjectEntityHandler.getAllFiles = sinon
-        .stub()
-        .callsArgWith(1, null, this.files)
-    })
-    describe('with project-history-blobs feature enabled', function () {
-      beforeEach(function () {
-        this.HistoryManager.requestBlobWithFallback = (
-          projectId,
-          hash,
-          fileId,
-          callback
-        ) => {
-          return callback(null, { stream: this.streams[fileId] })
-        }
-        sinon.spy(this.HistoryManager, 'requestBlobWithFallback')
-        this.ProjectZipStreamManager.addAllFilesToArchive(
-          this.project_id,
-          this.archive,
-          this.callback
-        )
-        for (const path in this.streams) {
-          const stream = this.streams[path]
-          stream.emit('end')
-        }
-      })
-
-      it('should get the files for the project', function () {
-        return this.ProjectEntityHandler.getAllFiles
-          .calledWith(this.project_id)
-          .should.equal(true)
-      })
-
-      it('should get a stream for each file', function () {
-        for (const path in this.files) {
-          const file = this.files[path]
-
-          this.HistoryManager.requestBlobWithFallback
-            .calledWith(this.project_id, file.hash, file._id)
-            .should.equal(true)
-        }
-      })
-
-      it('should add each file to the archive', function () {
-        for (let path in this.files) {
-          const file = this.files[path]
-          path = path.slice(1) // remove "/"
-          this.archive.append
-            .calledWith(this.streams[file._id], { name: path })
-            .should.equal(true)
-        }
-      })
-    })
-
-    describe('with project-history-blobs feature disabled', function () {
-      beforeEach(function () {
-        this.FileStoreHandler.getFileStream = (
-          projectId,
-          fileId,
-          query,
-          callback
-        ) => callback(null, this.streams[fileId])
-
-        sinon.spy(this.FileStoreHandler, 'getFileStream')
-        this.Features.hasFeature
-          .withArgs('project-history-blobs')
-          .returns(false)
-        this.ProjectZipStreamManager.addAllFilesToArchive(
-          this.project_id,
-          this.archive,
-          this.callback
-        )
-        for (const path in this.streams) {
-          const stream = this.streams[path]
-          stream.emit('end')
-        }
-      })
-
-      it('should get a stream for each file', function () {
-        for (const path in this.files) {
-          const file = this.files[path]
-
-          this.FileStoreHandler.getFileStream
-            .calledWith(this.project_id, file._id)
-            .should.equal(true)
-        }
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Editor/EditorControllerTests.js b/services/web/test/unit/src/Editor/EditorControllerTests.js
index 798f2f9499..2dd11bdf0f 100644
--- a/services/web/test/unit/src/Editor/EditorControllerTests.js
+++ b/services/web/test/unit/src/Editor/EditorControllerTests.js
@@ -518,7 +518,12 @@ describe('EditorController', function () {
 
     it('should add the folder using the project entity handler', function () {
       return this.ProjectEntityUpdateHandler.addFolder
-        .calledWith(this.project_id, this.folder_id, this.folderName)
+        .calledWith(
+          this.project_id,
+          this.folder_id,
+          this.folderName,
+          this.user_id
+        )
         .should.equal(true)
     })
 
@@ -540,6 +545,7 @@ describe('EditorController', function () {
         (this.folderA = { _id: 2, parentFolder_id: 1 }),
         (this.folderB = { _id: 3, parentFolder_id: 2 }),
       ]
+      this.userId = new ObjectId().toString()
       this.EditorController._notifyProjectUsersOfNewFolders = sinon
         .stub()
         .yields()
@@ -549,13 +555,14 @@ describe('EditorController', function () {
       return this.EditorController.mkdirp(
         this.project_id,
         this.path,
+        this.userId,
         this.callback
       )
     })
 
     it('should create the folder using the project entity handler', function () {
       return this.ProjectEntityUpdateHandler.mkdirp
-        .calledWith(this.project_id, this.path)
+        .calledWith(this.project_id, this.path, this.userId)
         .should.equal(true)
     })
 
diff --git a/services/web/test/unit/src/Editor/EditorHttpControllerTests.js b/services/web/test/unit/src/Editor/EditorHttpControllerTests.js
index dffa2d21ff..7fc08c45d3 100644
--- a/services/web/test/unit/src/Editor/EditorHttpControllerTests.js
+++ b/services/web/test/unit/src/Editor/EditorHttpControllerTests.js
@@ -20,6 +20,12 @@ describe('EditorHttpController', function () {
       _id: new ObjectId(),
       projects: {},
     }
+    this.members = [
+      { user: { _id: 'owner', features: {} }, privilegeLevel: 'owner' },
+      { user: { _id: 'one' }, privilegeLevel: 'readOnly' },
+    ]
+    this.ownerMember = this.members[0]
+    this.invites = [{ _id: 'three' }, { _id: 'four' }]
     this.projectView = {
       _id: this.project._id,
       owner: {
@@ -27,7 +33,10 @@ describe('EditorHttpController', function () {
         email: 'owner@example.com',
         other_property: true,
       },
-      members: [{ one: 1 }, { two: 2 }],
+      members: [
+        { _id: 'owner', privileges: 'owner' },
+        { _id: 'one', privileges: 'readOnly' },
+      ],
       invites: [{ three: 3 }, { four: 4 }],
     }
     this.reducedProjectView = {
@@ -51,14 +60,32 @@ describe('EditorHttpController', function () {
     this.AuthorizationManager = {
       isRestrictedUser: sinon.stub().returns(false),
       promises: {
-        getPrivilegeLevelForProject: sinon.stub().resolves('owner'),
+        getPrivilegeLevelForProjectWithProjectAccess: sinon
+          .stub()
+          .resolves('owner'),
       },
     }
+    const members = this.members
+    const ownerMember = this.ownerMember
     this.CollaboratorsGetter = {
+      ProjectAccess: class {
+        loadOwnerAndInvitedMembers() {
+          return { members, ownerMember }
+        }
+
+        loadOwner() {
+          return ownerMember
+        }
+
+        isUserTokenMember() {
+          return false
+        }
+
+        isUserInvitedMember() {
+          return false
+        }
+      },
       promises: {
-        getInvitedMembersWithPrivilegeLevels: sinon
-          .stub()
-          .resolves(['members', 'mock']),
         isUserInvitedMemberOfProject: sinon.stub().resolves(false),
       },
     }
@@ -67,22 +94,23 @@ describe('EditorHttpController', function () {
         userIsTokenMember: sinon.stub().resolves(false),
       },
     }
+    this.invites = [
+      {
+        _id: 'invite_one',
+        email: 'user-one@example.com',
+        privileges: 'readOnly',
+        projectId: this.project._id,
+      },
+      {
+        _id: 'invite_two',
+        email: 'user-two@example.com',
+        privileges: 'readOnly',
+        projectId: this.project._id,
+      },
+    ]
     this.CollaboratorsInviteGetter = {
       promises: {
-        getAllInvites: sinon.stub().resolves([
-          {
-            _id: 'invite_one',
-            email: 'user-one@example.com',
-            privileges: 'readOnly',
-            projectId: this.project._id,
-          },
-          {
-            _id: 'invite_two',
-            email: 'user-two@example.com',
-            privileges: 'readOnly',
-            projectId: this.project._id,
-          },
-        ]),
+        getAllInvites: sinon.stub().resolves(this.invites),
       },
     }
     this.EditorController = {
@@ -170,13 +198,28 @@ describe('EditorHttpController', function () {
 
     describe('successfully', function () {
       beforeEach(function (done) {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-          true
-        )
+        sinon
+          .stub(
+            this.CollaboratorsGetter.ProjectAccess.prototype,
+            'isUserInvitedMember'
+          )
+          .returns(true)
         this.res.callback = done
         this.EditorHttpController.joinProject(this.req, this.res)
       })
 
+      it('should request a full view', function () {
+        expect(
+          this.ProjectEditorHandler.buildProjectModelView
+        ).to.have.been.calledWith(
+          this.project,
+          this.ownerMember,
+          this.members,
+          this.invites,
+          false
+        )
+      })
+
       it('should return the project and privilege level', function () {
         expect(this.res.json).to.have.been.calledWith({
           project: this.projectView,
@@ -213,14 +256,23 @@ describe('EditorHttpController', function () {
 
     describe('with a restricted user', function () {
       beforeEach(function (done) {
+        this.ProjectEditorHandler.buildProjectModelView.returns(
+          this.reducedProjectView
+        )
         this.AuthorizationManager.isRestrictedUser.returns(true)
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject.resolves(
+        this.AuthorizationManager.promises.getPrivilegeLevelForProjectWithProjectAccess.resolves(
           'readOnly'
         )
         this.res.callback = done
         this.EditorHttpController.joinProject(this.req, this.res)
       })
 
+      it('should request a restricted view', function () {
+        expect(
+          this.ProjectEditorHandler.buildProjectModelView
+        ).to.have.been.calledWith(this.project, this.ownerMember, [], [], true)
+      })
+
       it('should mark the user as restricted, and hide details of owner', function () {
         expect(this.res.json).to.have.been.calledWith({
           project: this.reducedProjectView,
@@ -234,7 +286,7 @@ describe('EditorHttpController', function () {
 
     describe('when not authorized', function () {
       beforeEach(function (done) {
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject.resolves(
+        this.AuthorizationManager.promises.getPrivilegeLevelForProjectWithProjectAccess.resolves(
           null
         )
         this.res.callback = done
@@ -250,6 +302,9 @@ describe('EditorHttpController', function () {
       beforeEach(function (done) {
         this.token = 'token'
         this.TokenAccessHandler.getRequestToken.returns(this.token)
+        this.ProjectEditorHandler.buildProjectModelView.returns(
+          this.reducedProjectView
+        )
         this.req.body = {
           userId: 'anonymous-user',
           anonymousAccessToken: this.token,
@@ -258,12 +313,18 @@ describe('EditorHttpController', function () {
         this.AuthorizationManager.isRestrictedUser
           .withArgs(null, 'readOnly', false, false)
           .returns(true)
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject
+        this.AuthorizationManager.promises.getPrivilegeLevelForProjectWithProjectAccess
           .withArgs(null, this.project._id, this.token)
           .resolves('readOnly')
         this.EditorHttpController.joinProject(this.req, this.res)
       })
 
+      it('should request a restricted view', function () {
+        expect(
+          this.ProjectEditorHandler.buildProjectModelView
+        ).to.have.been.calledWith(this.project, this.ownerMember, [], [], true)
+      })
+
       it('should mark the user as restricted', function () {
         expect(this.res.json).to.have.been.calledWith({
           project: this.reducedProjectView,
@@ -277,11 +338,19 @@ describe('EditorHttpController', function () {
 
     describe('with a token access user', function () {
       beforeEach(function (done) {
-        this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-          false
-        )
-        this.CollaboratorsHandler.promises.userIsTokenMember.resolves(true)
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject.resolves(
+        sinon
+          .stub(
+            this.CollaboratorsGetter.ProjectAccess.prototype,
+            'isUserInvitedMember'
+          )
+          .returns(false)
+        sinon
+          .stub(
+            this.CollaboratorsGetter.ProjectAccess.prototype,
+            'isUserTokenMember'
+          )
+          .returns(true)
+        this.AuthorizationManager.promises.getPrivilegeLevelForProjectWithProjectAccess.resolves(
           'readAndWrite'
         )
         this.res.callback = done
diff --git a/services/web/test/unit/src/Email/EmailBuilderTests.js b/services/web/test/unit/src/Email/EmailBuilderTests.js
index 1f7628bc3f..8cc83f0228 100644
--- a/services/web/test/unit/src/Email/EmailBuilderTests.js
+++ b/services/web/test/unit/src/Email/EmailBuilderTests.js
@@ -229,7 +229,7 @@ describe('EmailBuilder', function () {
         describe('HTML email', function () {
           it('should include a CTA button and a fallback CTA link', function () {
             const dom = cheerio.load(this.email.html)
-            const buttonLink = dom('a:contains("Confirm Email")')
+            const buttonLink = dom('a:contains("Confirm email")')
             expect(buttonLink.length).to.equal(1)
             expect(buttonLink.attr('href')).to.equal(this.opts.confirmEmailUrl)
             const fallback = dom('.force-overleaf-style').last()
@@ -592,7 +592,7 @@ describe('EmailBuilder', function () {
 
         describe('HTML email', function () {
           it('should include a CTA button and a fallback CTA link', function () {
-            const buttonLink = this.dom('a:contains("Confirm Email")')
+            const buttonLink = this.dom('a:contains("Confirm email")')
             expect(buttonLink.length).to.equal(1)
             expect(buttonLink.attr('href')).to.equal(this.opts.confirmEmailUrl)
             const fallback = this.dom('.force-overleaf-style').last()
@@ -818,6 +818,43 @@ describe('EmailBuilder', function () {
           })
         })
       })
+
+      describe('removeGroupMember', function () {
+        beforeEach(function () {
+          this.passwordResetUrl = `${this.settings.siteUrl}/user/password/reset`
+          this.emailAddress = 'example@overleaf.com'
+          this.opts = {
+            to: this.emailAddress,
+            adminName: 'abcdef',
+          }
+          this.email = this.EmailBuilder.buildEmail(
+            'removeGroupMember',
+            this.opts
+          )
+          this.dom = cheerio.load(this.email.html)
+        })
+
+        it('should build the email', function () {
+          expect(this.email.html).to.exist
+          expect(this.email.text).to.exist
+        })
+
+        describe('HTML email', function () {
+          it('should include links', function () {
+            const resetPasswordLink = this.dom('a:contains("set a password")')
+            expect(resetPasswordLink.length).to.equal(1)
+            expect(resetPasswordLink.attr('href')).to.equal(
+              this.passwordResetUrl
+            )
+          })
+        })
+
+        describe('plain text email', function () {
+          it('should include URLs', function () {
+            expect(this.email.text).to.contain(this.passwordResetUrl)
+          })
+        })
+      })
     })
   })
 })
diff --git a/services/web/test/unit/src/Exports/ExportsController.test.mjs b/services/web/test/unit/src/Exports/ExportsController.test.mjs
new file mode 100644
index 0000000000..9e92a8c6d5
--- /dev/null
+++ b/services/web/test/unit/src/Exports/ExportsController.test.mjs
@@ -0,0 +1,215 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+const modulePath = new URL(
+  '../../../../app/src/Features/Exports/ExportsController.mjs',
+  import.meta.url
+).pathname
+
+describe('ExportsController', function () {
+  const projectId = '123njdskj9jlk'
+  const userId = '123nd3ijdks'
+  const brandVariationId = 22
+  const firstName = 'first'
+  const lastName = 'last'
+  const title = 'title'
+  const description = 'description'
+  const author = 'author'
+  const license = 'other'
+  const showSource = true
+
+  beforeEach(async function (ctx) {
+    ctx.handler = { getUserNotifications: sinon.stub().callsArgWith(1) }
+    ctx.req = {
+      params: {
+        project_id: projectId,
+        brand_variation_id: brandVariationId,
+      },
+      body: {
+        firstName,
+        lastName,
+      },
+      session: {
+        user: {
+          _id: userId,
+        },
+      },
+      i18n: {
+        translate() {},
+      },
+    }
+    ctx.res = {
+      json: sinon.stub(),
+      status: sinon.stub(),
+    }
+    ctx.res.status.returns(ctx.res)
+    ctx.next = sinon.stub()
+    ctx.AuthenticationController = {
+      getLoggedInUserId: sinon.stub().returns(ctx.req.session.user._id),
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Exports/ExportsHandler.mjs',
+      () => ({
+        default: ctx.handler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController.js',
+      () => ({
+        default: ctx.AuthenticationController,
+      })
+    )
+
+    ctx.controller = (await import(modulePath)).default
+  })
+
+  describe('without gallery fields', function () {
+    it('should ask the handler to perform the export', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.handler.exportProject = sinon
+          .stub()
+          .yields(null, { iAmAnExport: true, v1_id: 897 })
+        const expected = {
+          project_id: projectId,
+          user_id: userId,
+          brand_variation_id: brandVariationId,
+          first_name: firstName,
+          last_name: lastName,
+        }
+        return ctx.controller.exportProject(ctx.req, {
+          json: body => {
+            expect(ctx.handler.exportProject.args[0][0]).to.deep.equal(expected)
+            expect(body).to.deep.equal({
+              export_v1_id: 897,
+              message: undefined,
+            })
+            return resolve()
+          },
+        })
+      })
+    })
+  })
+
+  describe('with a message from v1', function () {
+    it('should ask the handler to perform the export', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.handler.exportProject = sinon.stub().yields(null, {
+          iAmAnExport: true,
+          v1_id: 897,
+          message: 'RESUBMISSION',
+        })
+        const expected = {
+          project_id: projectId,
+          user_id: userId,
+          brand_variation_id: brandVariationId,
+          first_name: firstName,
+          last_name: lastName,
+        }
+        return ctx.controller.exportProject(ctx.req, {
+          json: body => {
+            expect(ctx.handler.exportProject.args[0][0]).to.deep.equal(expected)
+            expect(body).to.deep.equal({
+              export_v1_id: 897,
+              message: 'RESUBMISSION',
+            })
+            return resolve()
+          },
+        })
+      })
+    })
+  })
+
+  describe('with gallery fields', function () {
+    beforeEach(function (ctx) {
+      ctx.req.body.title = title
+      ctx.req.body.description = description
+      ctx.req.body.author = author
+      ctx.req.body.license = license
+      return (ctx.req.body.showSource = true)
+    })
+
+    it('should ask the handler to perform the export', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.handler.exportProject = sinon
+          .stub()
+          .yields(null, { iAmAnExport: true, v1_id: 897 })
+        const expected = {
+          project_id: projectId,
+          user_id: userId,
+          brand_variation_id: brandVariationId,
+          first_name: firstName,
+          last_name: lastName,
+          title,
+          description,
+          author,
+          license,
+          show_source: showSource,
+        }
+        return ctx.controller.exportProject(ctx.req, {
+          json: body => {
+            expect(ctx.handler.exportProject.args[0][0]).to.deep.equal(expected)
+            expect(body).to.deep.equal({
+              export_v1_id: 897,
+              message: undefined,
+            })
+            return resolve()
+          },
+        })
+      })
+    })
+  })
+
+  describe('with an error return from v1 to forward to the publish modal', function () {
+    it('should forward the response onward', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.error_json = { status: 422, message: 'nope' }
+        ctx.handler.exportProject = sinon
+          .stub()
+          .yields({ forwardResponse: ctx.error_json })
+        ctx.controller.exportProject(ctx.req, ctx.res, ctx.next)
+        expect(ctx.res.json.args[0][0]).to.deep.equal(ctx.error_json)
+        expect(ctx.res.status.args[0][0]).to.equal(ctx.error_json.status)
+        return resolve()
+      })
+    })
+  })
+
+  it('should ask the handler to return the status of an export', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.handler.fetchExport = sinon.stub().yields(
+        null,
+        `{
+  "id":897,
+  "status_summary":"completed",
+  "status_detail":"all done",
+  "partner_submission_id":"abc123",
+  "v2_user_email":"la@tex.com",
+  "v2_user_first_name":"Arthur",
+  "v2_user_last_name":"Author",
+  "title":"my project",
+  "token":"token"
+  }`
+      )
+
+      ctx.req.params = { project_id: projectId, export_id: 897 }
+      return ctx.controller.exportStatus(ctx.req, {
+        json: body => {
+          expect(body).to.deep.equal({
+            export_json: {
+              status_summary: 'completed',
+              status_detail: 'all done',
+              partner_submission_id: 'abc123',
+              v2_user_email: 'la@tex.com',
+              v2_user_first_name: 'Arthur',
+              v2_user_last_name: 'Author',
+              title: 'my project',
+              token: 'token',
+            },
+          })
+          return resolve()
+        },
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Exports/ExportsControllerTests.mjs b/services/web/test/unit/src/Exports/ExportsControllerTests.mjs
deleted file mode 100644
index 65e6e16d27..0000000000
--- a/services/web/test/unit/src/Exports/ExportsControllerTests.mjs
+++ /dev/null
@@ -1,196 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import esmock from 'esmock'
-import { expect } from 'chai'
-import sinon from 'sinon'
-const modulePath = new URL(
-  '../../../../app/src/Features/Exports/ExportsController.mjs',
-  import.meta.url
-).pathname
-
-describe('ExportsController', function () {
-  const projectId = '123njdskj9jlk'
-  const userId = '123nd3ijdks'
-  const brandVariationId = 22
-  const firstName = 'first'
-  const lastName = 'last'
-  const title = 'title'
-  const description = 'description'
-  const author = 'author'
-  const license = 'other'
-  const showSource = true
-
-  beforeEach(async function () {
-    this.handler = { getUserNotifications: sinon.stub().callsArgWith(1) }
-    this.req = {
-      params: {
-        project_id: projectId,
-        brand_variation_id: brandVariationId,
-      },
-      body: {
-        firstName,
-        lastName,
-      },
-      session: {
-        user: {
-          _id: userId,
-        },
-      },
-      i18n: {
-        translate() {},
-      },
-    }
-    this.res = {
-      json: sinon.stub(),
-      status: sinon.stub(),
-    }
-    this.res.status.returns(this.res)
-    this.next = sinon.stub()
-    this.AuthenticationController = {
-      getLoggedInUserId: sinon.stub().returns(this.req.session.user._id),
-    }
-    return (this.controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Exports/ExportsHandler.mjs': this.handler,
-      '../../../../app/src/Features/Authentication/AuthenticationController.js':
-        this.AuthenticationController,
-    }))
-  })
-
-  describe('without gallery fields', function () {
-    it('should ask the handler to perform the export', function (done) {
-      this.handler.exportProject = sinon
-        .stub()
-        .yields(null, { iAmAnExport: true, v1_id: 897 })
-      const expected = {
-        project_id: projectId,
-        user_id: userId,
-        brand_variation_id: brandVariationId,
-        first_name: firstName,
-        last_name: lastName,
-      }
-      return this.controller.exportProject(this.req, {
-        json: body => {
-          expect(this.handler.exportProject.args[0][0]).to.deep.equal(expected)
-          expect(body).to.deep.equal({ export_v1_id: 897, message: undefined })
-          return done()
-        },
-      })
-    })
-  })
-
-  describe('with a message from v1', function () {
-    it('should ask the handler to perform the export', function (done) {
-      this.handler.exportProject = sinon.stub().yields(null, {
-        iAmAnExport: true,
-        v1_id: 897,
-        message: 'RESUBMISSION',
-      })
-      const expected = {
-        project_id: projectId,
-        user_id: userId,
-        brand_variation_id: brandVariationId,
-        first_name: firstName,
-        last_name: lastName,
-      }
-      return this.controller.exportProject(this.req, {
-        json: body => {
-          expect(this.handler.exportProject.args[0][0]).to.deep.equal(expected)
-          expect(body).to.deep.equal({
-            export_v1_id: 897,
-            message: 'RESUBMISSION',
-          })
-          return done()
-        },
-      })
-    })
-  })
-
-  describe('with gallery fields', function () {
-    beforeEach(function () {
-      this.req.body.title = title
-      this.req.body.description = description
-      this.req.body.author = author
-      this.req.body.license = license
-      return (this.req.body.showSource = true)
-    })
-
-    it('should ask the handler to perform the export', function (done) {
-      this.handler.exportProject = sinon
-        .stub()
-        .yields(null, { iAmAnExport: true, v1_id: 897 })
-      const expected = {
-        project_id: projectId,
-        user_id: userId,
-        brand_variation_id: brandVariationId,
-        first_name: firstName,
-        last_name: lastName,
-        title,
-        description,
-        author,
-        license,
-        show_source: showSource,
-      }
-      return this.controller.exportProject(this.req, {
-        json: body => {
-          expect(this.handler.exportProject.args[0][0]).to.deep.equal(expected)
-          expect(body).to.deep.equal({ export_v1_id: 897, message: undefined })
-          return done()
-        },
-      })
-    })
-  })
-
-  describe('with an error return from v1 to forward to the publish modal', function () {
-    it('should forward the response onward', function (done) {
-      this.error_json = { status: 422, message: 'nope' }
-      this.handler.exportProject = sinon
-        .stub()
-        .yields({ forwardResponse: this.error_json })
-      this.controller.exportProject(this.req, this.res, this.next)
-      expect(this.res.json.args[0][0]).to.deep.equal(this.error_json)
-      expect(this.res.status.args[0][0]).to.equal(this.error_json.status)
-      return done()
-    })
-  })
-
-  it('should ask the handler to return the status of an export', function (done) {
-    this.handler.fetchExport = sinon.stub().yields(
-      null,
-      `{
-"id":897,
-"status_summary":"completed",
-"status_detail":"all done",
-"partner_submission_id":"abc123",
-"v2_user_email":"la@tex.com",
-"v2_user_first_name":"Arthur",
-"v2_user_last_name":"Author",
-"title":"my project",
-"token":"token"
-}`
-    )
-
-    this.req.params = { project_id: projectId, export_id: 897 }
-    return this.controller.exportStatus(this.req, {
-      json: body => {
-        expect(body).to.deep.equal({
-          export_json: {
-            status_summary: 'completed',
-            status_detail: 'all done',
-            partner_submission_id: 'abc123',
-            v2_user_email: 'la@tex.com',
-            v2_user_first_name: 'Arthur',
-            v2_user_last_name: 'Author',
-            title: 'my project',
-            token: 'token',
-          },
-        })
-        return done()
-      },
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Exports/ExportsHandler.test.mjs b/services/web/test/unit/src/Exports/ExportsHandler.test.mjs
new file mode 100644
index 0000000000..05523834a6
--- /dev/null
+++ b/services/web/test/unit/src/Exports/ExportsHandler.test.mjs
@@ -0,0 +1,737 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+const modulePath = '../../../../app/src/Features/Exports/ExportsHandler.mjs'
+
+describe('ExportsHandler', function () {
+  beforeEach(async function (ctx) {
+    ctx.stubRequest = {}
+    ctx.request = {
+      defaults: () => {
+        return ctx.stubRequest
+      },
+    }
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: (ctx.ProjectGetter = {}),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectHistoryHandler',
+      () => ({
+        default: (ctx.ProjectHistoryHandler = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator', () => ({
+      default: (ctx.ProjectLocator = {}),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectRootDocManager',
+      () => ({
+        default: (ctx.ProjectRootDocManager = {}),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: (ctx.UserGetter = {}),
+    }))
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: (ctx.settings = {}),
+    }))
+
+    vi.doMock('request', () => ({
+      default: ctx.request,
+    }))
+
+    ctx.ExportsHandler = (await import(modulePath)).default
+    ctx.project_id = 'project-id-123'
+    ctx.project_history_id = 987
+    ctx.user_id = 'user-id-456'
+    ctx.brand_variation_id = 789
+    ctx.title = 'title'
+    ctx.description = 'description'
+    ctx.author = 'author'
+    ctx.license = 'other'
+    ctx.show_source = true
+    ctx.export_params = {
+      project_id: ctx.project_id,
+      brand_variation_id: ctx.brand_variation_id,
+      user_id: ctx.user_id,
+      title: ctx.title,
+      description: ctx.description,
+      author: ctx.author,
+      license: ctx.license,
+      show_source: ctx.show_source,
+    }
+    ctx.callback = sinon.stub()
+  })
+
+  describe('exportProject', function () {
+    beforeEach(function (ctx) {
+      ctx.export_data = { iAmAnExport: true }
+      ctx.response_body = { iAmAResponseBody: true }
+      ctx.ExportsHandler._buildExport = sinon
+        .stub()
+        .yields(null, ctx.export_data)
+      ctx.ExportsHandler._requestExport = sinon
+        .stub()
+        .yields(null, ctx.response_body)
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ExportsHandler.exportProject(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should build the export', function (ctx) {
+        ctx.ExportsHandler._buildExport
+          .calledWith(ctx.export_params)
+          .should.equal(true)
+      })
+
+      it('should request the export', function (ctx) {
+        ctx.ExportsHandler._requestExport
+          .calledWith(ctx.export_data)
+          .should.equal(true)
+      })
+
+      it('should return the export', function (ctx) {
+        ctx.callback.calledWith(null, ctx.export_data).should.equal(true)
+      })
+    })
+
+    describe("when request can't be built", function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ExportsHandler._buildExport = sinon
+            .stub()
+            .yields(new Error('cannot export project without root doc'))
+          ctx.ExportsHandler.exportProject(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return an error', function (ctx) {
+        expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+      })
+    })
+
+    describe('when export request returns an error to forward to the user', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.error_json = { status: 422, message: 'nope' }
+          ctx.ExportsHandler._requestExport = sinon
+            .stub()
+            .yields(null, { forwardResponse: ctx.error_json })
+          ctx.ExportsHandler.exportProject(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return success and the response to forward', function (ctx) {
+        expect(ctx.callback.args[0][0]).not.to.be.instanceOf(Error)
+        ctx.callback.calledWith(null, {
+          forwardResponse: ctx.error_json,
+        })
+      })
+    })
+  })
+
+  describe('_buildExport', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.project = {
+          id: ctx.project_id,
+          rootDoc_id: 'doc1_id',
+          compiler: 'pdflatex',
+          imageName: 'mock-image-name',
+          overleaf: {
+            id: ctx.project_history_id, // for projects imported from v1
+            history: {
+              id: ctx.project_history_id,
+            },
+          },
+        }
+        ctx.user = {
+          id: ctx.user_id,
+          first_name: 'Arthur',
+          last_name: 'Author',
+          email: 'arthur.author@arthurauthoring.org',
+          overleaf: {
+            id: 876,
+          },
+        }
+        ctx.rootDocPath = 'main.tex'
+        ctx.historyVersion = 777
+        ctx.ProjectGetter.getProject = sinon.stub().yields(null, ctx.project)
+        ctx.ProjectHistoryHandler.ensureHistoryExistsForProject = sinon
+          .stub()
+          .yields(null)
+        ctx.ProjectLocator.findRootDoc = sinon
+          .stub()
+          .yields(null, [null, { fileSystem: 'main.tex' }])
+        ctx.ProjectRootDocManager.ensureRootDocumentIsValid = sinon
+          .stub()
+          .callsArgWith(1, null)
+        ctx.UserGetter.getUser = sinon.stub().yields(null, ctx.user)
+        ctx.ExportsHandler._requestVersion = sinon
+          .stub()
+          .yields(null, ctx.historyVersion)
+        resolve()
+      })
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ExportsHandler._buildExport(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should ensure the project has history', function (ctx) {
+        ctx.ProjectHistoryHandler.ensureHistoryExistsForProject.called.should.equal(
+          true
+        )
+      })
+
+      it('should request the project history version', function (ctx) {
+        ctx.ExportsHandler._requestVersion.called.should.equal(true)
+      })
+
+      it('should return export data', function (ctx) {
+        const expectedExportData = {
+          project: {
+            id: ctx.project_id,
+            rootDocPath: ctx.rootDocPath,
+            historyId: ctx.project_history_id,
+            historyVersion: ctx.historyVersion,
+            v1ProjectId: ctx.project_history_id,
+            metadata: {
+              compiler: 'pdflatex',
+              imageName: 'mock-image-name',
+              title: ctx.title,
+              description: ctx.description,
+              author: ctx.author,
+              license: ctx.license,
+              showSource: ctx.show_source,
+            },
+          },
+          user: {
+            id: ctx.user_id,
+            firstName: ctx.user.first_name,
+            lastName: ctx.user.last_name,
+            email: ctx.user.email,
+            orcidId: null,
+            v1UserId: 876,
+          },
+          destination: {
+            brandVariationId: ctx.brand_variation_id,
+          },
+          options: {
+            callbackUrl: null,
+          },
+        }
+        ctx.callback.calledWith(null, expectedExportData).should.equal(true)
+      })
+    })
+
+    describe('when we send replacement user first and last name', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.custom_first_name = 'FIRST'
+          ctx.custom_last_name = 'LAST'
+          ctx.export_params.first_name = ctx.custom_first_name
+          ctx.export_params.last_name = ctx.custom_last_name
+          ctx.ExportsHandler._buildExport(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should send the data from the user input', function (ctx) {
+        const expectedExportData = {
+          project: {
+            id: ctx.project_id,
+            rootDocPath: ctx.rootDocPath,
+            historyId: ctx.project_history_id,
+            historyVersion: ctx.historyVersion,
+            v1ProjectId: ctx.project_history_id,
+            metadata: {
+              compiler: 'pdflatex',
+              imageName: 'mock-image-name',
+              title: ctx.title,
+              description: ctx.description,
+              author: ctx.author,
+              license: ctx.license,
+              showSource: ctx.show_source,
+            },
+          },
+          user: {
+            id: ctx.user_id,
+            firstName: ctx.custom_first_name,
+            lastName: ctx.custom_last_name,
+            email: ctx.user.email,
+            orcidId: null,
+            v1UserId: 876,
+          },
+          destination: {
+            brandVariationId: ctx.brand_variation_id,
+          },
+          options: {
+            callbackUrl: null,
+          },
+        }
+        ctx.callback.calledWith(null, expectedExportData).should.equal(true)
+      })
+    })
+
+    describe('when project is not found', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ProjectGetter.getProject = sinon
+            .stub()
+            .yields(new Error('project not found'))
+          ctx.ExportsHandler._buildExport(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return an error', function (ctx) {
+        expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+      })
+    })
+
+    describe('when project has no root doc', function () {
+      describe('when a root doc can be set automatically', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.project.rootDoc_id = null
+            ctx.ProjectLocator.findRootDoc = sinon
+              .stub()
+              .yields(null, [null, { fileSystem: 'other.tex' }])
+            ctx.ExportsHandler._buildExport(
+              ctx.export_params,
+              (error, exportData) => {
+                ctx.callback(error, exportData)
+                resolve()
+              }
+            )
+          })
+        })
+
+        it('should set a root doc', function (ctx) {
+          ctx.ProjectRootDocManager.ensureRootDocumentIsValid.called.should.equal(
+            true
+          )
+        })
+
+        it('should return export data', function (ctx) {
+          const expectedExportData = {
+            project: {
+              id: ctx.project_id,
+              rootDocPath: 'other.tex',
+              historyId: ctx.project_history_id,
+              historyVersion: ctx.historyVersion,
+              v1ProjectId: ctx.project_history_id,
+              metadata: {
+                compiler: 'pdflatex',
+                imageName: 'mock-image-name',
+                title: ctx.title,
+                description: ctx.description,
+                author: ctx.author,
+                license: ctx.license,
+                showSource: ctx.show_source,
+              },
+            },
+            user: {
+              id: ctx.user_id,
+              firstName: ctx.user.first_name,
+              lastName: ctx.user.last_name,
+              email: ctx.user.email,
+              orcidId: null,
+              v1UserId: 876,
+            },
+            destination: {
+              brandVariationId: ctx.brand_variation_id,
+            },
+            options: {
+              callbackUrl: null,
+            },
+          }
+          ctx.callback.calledWith(null, expectedExportData).should.equal(true)
+        })
+      })
+    })
+
+    describe('when project has an invalid root doc', function () {
+      describe('when a new root doc can be set automatically', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.fakeDoc_id = '1a2b3c4d5e6f'
+            ctx.project.rootDoc_id = ctx.fakeDoc_id
+            ctx.ProjectLocator.findRootDoc = sinon
+              .stub()
+              .yields(null, [null, { fileSystem: 'other.tex' }])
+            ctx.ExportsHandler._buildExport(
+              ctx.export_params,
+              (error, exportData) => {
+                ctx.callback(error, exportData)
+                resolve()
+              }
+            )
+          })
+        })
+
+        it('should set a valid root doc', function (ctx) {
+          ctx.ProjectRootDocManager.ensureRootDocumentIsValid.called.should.equal(
+            true
+          )
+        })
+
+        it('should return export data', function (ctx) {
+          const expectedExportData = {
+            project: {
+              id: ctx.project_id,
+              rootDocPath: 'other.tex',
+              historyId: ctx.project_history_id,
+              historyVersion: ctx.historyVersion,
+              v1ProjectId: ctx.project_history_id,
+              metadata: {
+                compiler: 'pdflatex',
+                imageName: 'mock-image-name',
+                title: ctx.title,
+                description: ctx.description,
+                author: ctx.author,
+                license: ctx.license,
+                showSource: ctx.show_source,
+              },
+            },
+            user: {
+              id: ctx.user_id,
+              firstName: ctx.user.first_name,
+              lastName: ctx.user.last_name,
+              email: ctx.user.email,
+              orcidId: null,
+              v1UserId: 876,
+            },
+            destination: {
+              brandVariationId: ctx.brand_variation_id,
+            },
+            options: {
+              callbackUrl: null,
+            },
+          }
+          ctx.callback.calledWith(null, expectedExportData).should.equal(true)
+        })
+      })
+
+      describe('when no root doc can be identified', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.ProjectLocator.findRootDoc = sinon
+              .stub()
+              .yields(null, [null, null])
+            ctx.ExportsHandler._buildExport(
+              ctx.export_params,
+              (error, exportData) => {
+                ctx.callback(error, exportData)
+                resolve()
+              }
+            )
+          })
+        })
+
+        it('should return an error', function (ctx) {
+          expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+        })
+      })
+    })
+
+    describe('when user is not found', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.UserGetter.getUser = sinon
+            .stub()
+            .yields(new Error('user not found'))
+          ctx.ExportsHandler._buildExport(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return an error', function (ctx) {
+        expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+      })
+    })
+
+    describe('when project history request fails', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.ExportsHandler._requestVersion = sinon
+            .stub()
+            .yields(new Error('project history call failed'))
+          ctx.ExportsHandler._buildExport(
+            ctx.export_params,
+            (error, exportData) => {
+              ctx.callback(error, exportData)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return an error', function (ctx) {
+        expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+      })
+    })
+  })
+
+  describe('_requestExport', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.settings.apis = {
+          v1: {
+            url: 'http://127.0.0.1:5000',
+            user: 'overleaf',
+            pass: 'pass',
+            timeout: 15000,
+          },
+        }
+        ctx.export_data = { iAmAnExport: true }
+        ctx.export_id = 4096
+        ctx.stubPost = sinon
+          .stub()
+          .yields(null, { statusCode: 200 }, { exportId: ctx.export_id })
+        resolve()
+      })
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.stubRequest.post = ctx.stubPost
+          ctx.ExportsHandler._requestExport(
+            ctx.export_data,
+            (error, exportV1Id) => {
+              ctx.callback(error, exportV1Id)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should issue the request', function (ctx) {
+        expect(ctx.stubPost.getCall(0).args[0]).to.deep.equal({
+          url: ctx.settings.apis.v1.url + '/api/v1/overleaf/exports',
+          auth: {
+            user: ctx.settings.apis.v1.user,
+            pass: ctx.settings.apis.v1.pass,
+          },
+          json: ctx.export_data,
+          timeout: 15000,
+        })
+      })
+
+      it('should return the body with v1 export id', function (ctx) {
+        ctx.callback
+          .calledWith(null, { exportId: ctx.export_id })
+          .should.equal(true)
+      })
+    })
+
+    describe('when the request fails', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.stubRequest.post = sinon
+            .stub()
+            .yields(new Error('export request failed'))
+          ctx.ExportsHandler._requestExport(
+            ctx.export_data,
+            (error, exportV1Id) => {
+              ctx.callback(error, exportV1Id)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return an error', function (ctx) {
+        expect(ctx.callback.args[0][0]).to.be.instanceOf(Error)
+      })
+    })
+
+    describe('when the request returns an error response to forward', function () {
+      beforeEach(async function (ctx) {
+        ctx.error_code = 422
+        ctx.error_json = { status: ctx.error_code, message: 'nope' }
+        ctx.stubRequest.post = sinon
+          .stub()
+          .yields(null, { statusCode: ctx.error_code }, ctx.error_json)
+
+        await new Promise(resolve => {
+          ctx.ExportsHandler._requestExport(
+            ctx.export_data,
+            (error, exportV1Id) => {
+              ctx.callback(error, exportV1Id)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should return success and the response to forward', function (ctx) {
+        expect(ctx.callback.args[0][0]).not.to.be.instanceOf(Error)
+        ctx.callback.calledWith(null, {
+          forwardResponse: ctx.error_json,
+        })
+      })
+    })
+  })
+
+  describe('fetchExport', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.settings.apis = {
+          v1: {
+            url: 'http://127.0.0.1:5000',
+            user: 'overleaf',
+            pass: 'pass',
+            timeout: 15000,
+          },
+        }
+        ctx.export_id = 897
+        ctx.body = '{"id":897, "status_summary":"completed"}'
+        ctx.stubGet = sinon
+          .stub()
+          .yields(null, { statusCode: 200 }, { body: ctx.body })
+        resolve()
+      })
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.stubRequest.get = ctx.stubGet
+          ctx.ExportsHandler.fetchExport(ctx.export_id, (error, body) => {
+            ctx.callback(error, body)
+            resolve()
+          })
+        })
+      })
+
+      it('should issue the request', function (ctx) {
+        expect(ctx.stubGet.getCall(0).args[0]).to.deep.equal({
+          url:
+            ctx.settings.apis.v1.url +
+            '/api/v1/overleaf/exports/' +
+            ctx.export_id,
+          auth: {
+            user: ctx.settings.apis.v1.user,
+            pass: ctx.settings.apis.v1.pass,
+          },
+          timeout: 15000,
+        })
+      })
+
+      it('should return the v1 export id', function (ctx) {
+        ctx.callback.calledWith(null, { body: ctx.body }).should.equal(true)
+      })
+    })
+  })
+
+  describe('fetchDownload', function () {
+    beforeEach(async function (ctx) {
+      await new Promise(resolve => {
+        ctx.settings.apis = {
+          v1: {
+            url: 'http://127.0.0.1:5000',
+            user: 'overleaf',
+            pass: 'pass',
+            timeout: 15000,
+          },
+        }
+        ctx.export_id = 897
+        ctx.body =
+          'https://writelatex-conversions-dev.s3.amazonaws.com/exports/ieee_latexqc/tnb/2912/xggmprcrpfwbsnqzqqmvktddnrbqkqkr.zip?X-Amz-Expires=14400&X-Amz-Date=20180730T181003Z&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAJDGDIJFGLNVGZH6A/20180730/us-east-1/s3/aws4_request&X-Amz-SignedHeaders=host&X-Amz-Signature=dec990336913cef9933f0e269afe99722d7ab2830ebf2c618a75673ee7159fee'
+        ctx.stubGet = sinon
+          .stub()
+          .yields(null, { statusCode: 200 }, { body: ctx.body })
+        resolve()
+      })
+    })
+
+    describe('when all goes well', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.stubRequest.get = ctx.stubGet
+          ctx.ExportsHandler.fetchDownload(
+            ctx.export_id,
+            'zip',
+            (error, body) => {
+              ctx.callback(error, body)
+              resolve()
+            }
+          )
+        })
+      })
+
+      it('should issue the request', function (ctx) {
+        expect(ctx.stubGet.getCall(0).args[0]).to.deep.equal({
+          url:
+            ctx.settings.apis.v1.url +
+            '/api/v1/overleaf/exports/' +
+            ctx.export_id +
+            '/zip_url',
+          auth: {
+            user: ctx.settings.apis.v1.user,
+            pass: ctx.settings.apis.v1.pass,
+          },
+          timeout: 15000,
+        })
+      })
+
+      it('should return the v1 export id', function (ctx) {
+        ctx.callback.calledWith(null, { body: ctx.body }).should.equal(true)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Exports/ExportsHandlerTests.mjs b/services/web/test/unit/src/Exports/ExportsHandlerTests.mjs
deleted file mode 100644
index 1a7f985250..0000000000
--- a/services/web/test/unit/src/Exports/ExportsHandlerTests.mjs
+++ /dev/null
@@ -1,698 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import sinon from 'sinon'
-import esmock from 'esmock'
-import { expect } from 'chai'
-const modulePath = '../../../../app/src/Features/Exports/ExportsHandler.mjs'
-
-describe('ExportsHandler', function () {
-  beforeEach(async function () {
-    this.stubRequest = {}
-    this.request = {
-      defaults: () => {
-        return this.stubRequest
-      },
-    }
-    this.ExportsHandler = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Project/ProjectGetter':
-        (this.ProjectGetter = {}),
-      '../../../../app/src/Features/Project/ProjectHistoryHandler':
-        (this.ProjectHistoryHandler = {}),
-      '../../../../app/src/Features/Project/ProjectLocator':
-        (this.ProjectLocator = {}),
-      '../../../../app/src/Features/Project/ProjectRootDocManager':
-        (this.ProjectRootDocManager = {}),
-      '../../../../app/src/Features/User/UserGetter': (this.UserGetter = {}),
-      '@overleaf/settings': (this.settings = {}),
-      request: this.request,
-    })
-    this.project_id = 'project-id-123'
-    this.project_history_id = 987
-    this.user_id = 'user-id-456'
-    this.brand_variation_id = 789
-    this.title = 'title'
-    this.description = 'description'
-    this.author = 'author'
-    this.license = 'other'
-    this.show_source = true
-    this.export_params = {
-      project_id: this.project_id,
-      brand_variation_id: this.brand_variation_id,
-      user_id: this.user_id,
-      title: this.title,
-      description: this.description,
-      author: this.author,
-      license: this.license,
-      show_source: this.show_source,
-    }
-    return (this.callback = sinon.stub())
-  })
-
-  describe('exportProject', function () {
-    beforeEach(function () {
-      this.export_data = { iAmAnExport: true }
-      this.response_body = { iAmAResponseBody: true }
-      this.ExportsHandler._buildExport = sinon
-        .stub()
-        .yields(null, this.export_data)
-      return (this.ExportsHandler._requestExport = sinon
-        .stub()
-        .yields(null, this.response_body))
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        return this.ExportsHandler.exportProject(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should build the export', function () {
-        return this.ExportsHandler._buildExport
-          .calledWith(this.export_params)
-          .should.equal(true)
-      })
-
-      it('should request the export', function () {
-        return this.ExportsHandler._requestExport
-          .calledWith(this.export_data)
-          .should.equal(true)
-      })
-
-      it('should return the export', function () {
-        return this.callback
-          .calledWith(null, this.export_data)
-          .should.equal(true)
-      })
-    })
-
-    describe("when request can't be built", function () {
-      beforeEach(function (done) {
-        this.ExportsHandler._buildExport = sinon
-          .stub()
-          .yields(new Error('cannot export project without root doc'))
-        return this.ExportsHandler.exportProject(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should return an error', function () {
-        return (this.callback.args[0][0] instanceof Error).should.equal(true)
-      })
-    })
-
-    describe('when export request returns an error to forward to the user', function () {
-      beforeEach(function (done) {
-        this.error_json = { status: 422, message: 'nope' }
-        this.ExportsHandler._requestExport = sinon
-          .stub()
-          .yields(null, { forwardResponse: this.error_json })
-        return this.ExportsHandler.exportProject(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should return success and the response to forward', function () {
-        ;(this.callback.args[0][0] instanceof Error).should.equal(false)
-        return this.callback.calledWith(null, {
-          forwardResponse: this.error_json,
-        })
-      })
-    })
-  })
-
-  describe('_buildExport', function () {
-    beforeEach(function (done) {
-      this.project = {
-        id: this.project_id,
-        rootDoc_id: 'doc1_id',
-        compiler: 'pdflatex',
-        imageName: 'mock-image-name',
-        overleaf: {
-          id: this.project_history_id, // for projects imported from v1
-          history: {
-            id: this.project_history_id,
-          },
-        },
-      }
-      this.user = {
-        id: this.user_id,
-        first_name: 'Arthur',
-        last_name: 'Author',
-        email: 'arthur.author@arthurauthoring.org',
-        overleaf: {
-          id: 876,
-        },
-      }
-      this.rootDocPath = 'main.tex'
-      this.historyVersion = 777
-      this.ProjectGetter.getProject = sinon.stub().yields(null, this.project)
-      this.ProjectHistoryHandler.ensureHistoryExistsForProject = sinon
-        .stub()
-        .yields(null)
-      this.ProjectLocator.findRootDoc = sinon
-        .stub()
-        .yields(null, [null, { fileSystem: 'main.tex' }])
-      this.ProjectRootDocManager.ensureRootDocumentIsValid = sinon
-        .stub()
-        .callsArgWith(1, null)
-      this.UserGetter.getUser = sinon.stub().yields(null, this.user)
-      this.ExportsHandler._requestVersion = sinon
-        .stub()
-        .yields(null, this.historyVersion)
-      return done()
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        return this.ExportsHandler._buildExport(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should ensure the project has history', function () {
-        return this.ProjectHistoryHandler.ensureHistoryExistsForProject.called.should.equal(
-          true
-        )
-      })
-
-      it('should request the project history version', function () {
-        return this.ExportsHandler._requestVersion.called.should.equal(true)
-      })
-
-      it('should return export data', function () {
-        const expectedExportData = {
-          project: {
-            id: this.project_id,
-            rootDocPath: this.rootDocPath,
-            historyId: this.project_history_id,
-            historyVersion: this.historyVersion,
-            v1ProjectId: this.project_history_id,
-            metadata: {
-              compiler: 'pdflatex',
-              imageName: 'mock-image-name',
-              title: this.title,
-              description: this.description,
-              author: this.author,
-              license: this.license,
-              showSource: this.show_source,
-            },
-          },
-          user: {
-            id: this.user_id,
-            firstName: this.user.first_name,
-            lastName: this.user.last_name,
-            email: this.user.email,
-            orcidId: null,
-            v1UserId: 876,
-          },
-          destination: {
-            brandVariationId: this.brand_variation_id,
-          },
-          options: {
-            callbackUrl: null,
-          },
-        }
-        return this.callback
-          .calledWith(null, expectedExportData)
-          .should.equal(true)
-      })
-    })
-
-    describe('when we send replacement user first and last name', function () {
-      beforeEach(function (done) {
-        this.custom_first_name = 'FIRST'
-        this.custom_last_name = 'LAST'
-        this.export_params.first_name = this.custom_first_name
-        this.export_params.last_name = this.custom_last_name
-        return this.ExportsHandler._buildExport(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should send the data from the user input', function () {
-        const expectedExportData = {
-          project: {
-            id: this.project_id,
-            rootDocPath: this.rootDocPath,
-            historyId: this.project_history_id,
-            historyVersion: this.historyVersion,
-            v1ProjectId: this.project_history_id,
-            metadata: {
-              compiler: 'pdflatex',
-              imageName: 'mock-image-name',
-              title: this.title,
-              description: this.description,
-              author: this.author,
-              license: this.license,
-              showSource: this.show_source,
-            },
-          },
-          user: {
-            id: this.user_id,
-            firstName: this.custom_first_name,
-            lastName: this.custom_last_name,
-            email: this.user.email,
-            orcidId: null,
-            v1UserId: 876,
-          },
-          destination: {
-            brandVariationId: this.brand_variation_id,
-          },
-          options: {
-            callbackUrl: null,
-          },
-        }
-        return this.callback
-          .calledWith(null, expectedExportData)
-          .should.equal(true)
-      })
-    })
-
-    describe('when project is not found', function () {
-      beforeEach(function (done) {
-        this.ProjectGetter.getProject = sinon
-          .stub()
-          .yields(new Error('project not found'))
-        return this.ExportsHandler._buildExport(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should return an error', function () {
-        return (this.callback.args[0][0] instanceof Error).should.equal(true)
-      })
-    })
-
-    describe('when project has no root doc', function () {
-      describe('when a root doc can be set automatically', function () {
-        beforeEach(function (done) {
-          this.project.rootDoc_id = null
-          this.ProjectLocator.findRootDoc = sinon
-            .stub()
-            .yields(null, [null, { fileSystem: 'other.tex' }])
-          return this.ExportsHandler._buildExport(
-            this.export_params,
-            (error, exportData) => {
-              this.callback(error, exportData)
-              return done()
-            }
-          )
-        })
-
-        it('should set a root doc', function () {
-          return this.ProjectRootDocManager.ensureRootDocumentIsValid.called.should.equal(
-            true
-          )
-        })
-
-        it('should return export data', function () {
-          const expectedExportData = {
-            project: {
-              id: this.project_id,
-              rootDocPath: 'other.tex',
-              historyId: this.project_history_id,
-              historyVersion: this.historyVersion,
-              v1ProjectId: this.project_history_id,
-              metadata: {
-                compiler: 'pdflatex',
-                imageName: 'mock-image-name',
-                title: this.title,
-                description: this.description,
-                author: this.author,
-                license: this.license,
-                showSource: this.show_source,
-              },
-            },
-            user: {
-              id: this.user_id,
-              firstName: this.user.first_name,
-              lastName: this.user.last_name,
-              email: this.user.email,
-              orcidId: null,
-              v1UserId: 876,
-            },
-            destination: {
-              brandVariationId: this.brand_variation_id,
-            },
-            options: {
-              callbackUrl: null,
-            },
-          }
-          return this.callback
-            .calledWith(null, expectedExportData)
-            .should.equal(true)
-        })
-      })
-    })
-
-    describe('when project has an invalid root doc', function () {
-      describe('when a new root doc can be set automatically', function () {
-        beforeEach(function (done) {
-          this.fakeDoc_id = '1a2b3c4d5e6f'
-          this.project.rootDoc_id = this.fakeDoc_id
-          this.ProjectLocator.findRootDoc = sinon
-            .stub()
-            .yields(null, [null, { fileSystem: 'other.tex' }])
-          return this.ExportsHandler._buildExport(
-            this.export_params,
-            (error, exportData) => {
-              this.callback(error, exportData)
-              return done()
-            }
-          )
-        })
-
-        it('should set a valid root doc', function () {
-          return this.ProjectRootDocManager.ensureRootDocumentIsValid.called.should.equal(
-            true
-          )
-        })
-
-        it('should return export data', function () {
-          const expectedExportData = {
-            project: {
-              id: this.project_id,
-              rootDocPath: 'other.tex',
-              historyId: this.project_history_id,
-              historyVersion: this.historyVersion,
-              v1ProjectId: this.project_history_id,
-              metadata: {
-                compiler: 'pdflatex',
-                imageName: 'mock-image-name',
-                title: this.title,
-                description: this.description,
-                author: this.author,
-                license: this.license,
-                showSource: this.show_source,
-              },
-            },
-            user: {
-              id: this.user_id,
-              firstName: this.user.first_name,
-              lastName: this.user.last_name,
-              email: this.user.email,
-              orcidId: null,
-              v1UserId: 876,
-            },
-            destination: {
-              brandVariationId: this.brand_variation_id,
-            },
-            options: {
-              callbackUrl: null,
-            },
-          }
-          return this.callback
-            .calledWith(null, expectedExportData)
-            .should.equal(true)
-        })
-      })
-
-      describe('when no root doc can be identified', function () {
-        beforeEach(function (done) {
-          this.ProjectLocator.findRootDoc = sinon
-            .stub()
-            .yields(null, [null, null])
-          return this.ExportsHandler._buildExport(
-            this.export_params,
-            (error, exportData) => {
-              this.callback(error, exportData)
-              return done()
-            }
-          )
-        })
-
-        it('should return an error', function () {
-          return (this.callback.args[0][0] instanceof Error).should.equal(true)
-        })
-      })
-    })
-
-    describe('when user is not found', function () {
-      beforeEach(function (done) {
-        this.UserGetter.getUser = sinon
-          .stub()
-          .yields(new Error('user not found'))
-        return this.ExportsHandler._buildExport(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should return an error', function () {
-        return (this.callback.args[0][0] instanceof Error).should.equal(true)
-      })
-    })
-
-    describe('when project history request fails', function () {
-      beforeEach(function (done) {
-        this.ExportsHandler._requestVersion = sinon
-          .stub()
-          .yields(new Error('project history call failed'))
-        return this.ExportsHandler._buildExport(
-          this.export_params,
-          (error, exportData) => {
-            this.callback(error, exportData)
-            return done()
-          }
-        )
-      })
-
-      it('should return an error', function () {
-        return (this.callback.args[0][0] instanceof Error).should.equal(true)
-      })
-    })
-  })
-
-  describe('_requestExport', function () {
-    beforeEach(function (done) {
-      this.settings.apis = {
-        v1: {
-          url: 'http://127.0.0.1:5000',
-          user: 'overleaf',
-          pass: 'pass',
-          timeout: 15000,
-        },
-      }
-      this.export_data = { iAmAnExport: true }
-      this.export_id = 4096
-      this.stubPost = sinon
-        .stub()
-        .yields(null, { statusCode: 200 }, { exportId: this.export_id })
-      return done()
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        this.stubRequest.post = this.stubPost
-        return this.ExportsHandler._requestExport(
-          this.export_data,
-          (error, exportV1Id) => {
-            this.callback(error, exportV1Id)
-            return done()
-          }
-        )
-      })
-
-      it('should issue the request', function () {
-        return expect(this.stubPost.getCall(0).args[0]).to.deep.equal({
-          url: this.settings.apis.v1.url + '/api/v1/overleaf/exports',
-          auth: {
-            user: this.settings.apis.v1.user,
-            pass: this.settings.apis.v1.pass,
-          },
-          json: this.export_data,
-          timeout: 15000,
-        })
-      })
-
-      it('should return the body with v1 export id', function () {
-        return this.callback
-          .calledWith(null, { exportId: this.export_id })
-          .should.equal(true)
-      })
-    })
-
-    describe('when the request fails', function () {
-      beforeEach(function (done) {
-        this.stubRequest.post = sinon
-          .stub()
-          .yields(new Error('export request failed'))
-        return this.ExportsHandler._requestExport(
-          this.export_data,
-          (error, exportV1Id) => {
-            this.callback(error, exportV1Id)
-            return done()
-          }
-        )
-      })
-
-      it('should return an error', function () {
-        return (this.callback.args[0][0] instanceof Error).should.equal(true)
-      })
-    })
-
-    describe('when the request returns an error response to forward', function () {
-      beforeEach(function (done) {
-        this.error_code = 422
-        this.error_json = { status: this.error_code, message: 'nope' }
-        this.stubRequest.post = sinon
-          .stub()
-          .yields(null, { statusCode: this.error_code }, this.error_json)
-        return this.ExportsHandler._requestExport(
-          this.export_data,
-          (error, exportV1Id) => {
-            this.callback(error, exportV1Id)
-            return done()
-          }
-        )
-      })
-
-      it('should return success and the response to forward', function () {
-        ;(this.callback.args[0][0] instanceof Error).should.equal(false)
-        return this.callback.calledWith(null, {
-          forwardResponse: this.error_json,
-        })
-      })
-    })
-  })
-
-  describe('fetchExport', function () {
-    beforeEach(function (done) {
-      this.settings.apis = {
-        v1: {
-          url: 'http://127.0.0.1:5000',
-          user: 'overleaf',
-          pass: 'pass',
-          timeout: 15000,
-        },
-      }
-      this.export_id = 897
-      this.body = '{"id":897, "status_summary":"completed"}'
-      this.stubGet = sinon
-        .stub()
-        .yields(null, { statusCode: 200 }, { body: this.body })
-      return done()
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        this.stubRequest.get = this.stubGet
-        return this.ExportsHandler.fetchExport(
-          this.export_id,
-          (error, body) => {
-            this.callback(error, body)
-            return done()
-          }
-        )
-      })
-
-      it('should issue the request', function () {
-        return expect(this.stubGet.getCall(0).args[0]).to.deep.equal({
-          url:
-            this.settings.apis.v1.url +
-            '/api/v1/overleaf/exports/' +
-            this.export_id,
-          auth: {
-            user: this.settings.apis.v1.user,
-            pass: this.settings.apis.v1.pass,
-          },
-          timeout: 15000,
-        })
-      })
-
-      it('should return the v1 export id', function () {
-        return this.callback
-          .calledWith(null, { body: this.body })
-          .should.equal(true)
-      })
-    })
-  })
-
-  describe('fetchDownload', function () {
-    beforeEach(function (done) {
-      this.settings.apis = {
-        v1: {
-          url: 'http://127.0.0.1:5000',
-          user: 'overleaf',
-          pass: 'pass',
-          timeout: 15000,
-        },
-      }
-      this.export_id = 897
-      this.body =
-        'https://writelatex-conversions-dev.s3.amazonaws.com/exports/ieee_latexqc/tnb/2912/xggmprcrpfwbsnqzqqmvktddnrbqkqkr.zip?X-Amz-Expires=14400&X-Amz-Date=20180730T181003Z&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAJDGDIJFGLNVGZH6A/20180730/us-east-1/s3/aws4_request&X-Amz-SignedHeaders=host&X-Amz-Signature=dec990336913cef9933f0e269afe99722d7ab2830ebf2c618a75673ee7159fee'
-      this.stubGet = sinon
-        .stub()
-        .yields(null, { statusCode: 200 }, { body: this.body })
-      return done()
-    })
-
-    describe('when all goes well', function () {
-      beforeEach(function (done) {
-        this.stubRequest.get = this.stubGet
-        return this.ExportsHandler.fetchDownload(
-          this.export_id,
-          'zip',
-          (error, body) => {
-            this.callback(error, body)
-            return done()
-          }
-        )
-      })
-
-      it('should issue the request', function () {
-        return expect(this.stubGet.getCall(0).args[0]).to.deep.equal({
-          url:
-            this.settings.apis.v1.url +
-            '/api/v1/overleaf/exports/' +
-            this.export_id +
-            '/zip_url',
-          auth: {
-            user: this.settings.apis.v1.user,
-            pass: this.settings.apis.v1.pass,
-          },
-          timeout: 15000,
-        })
-      })
-
-      it('should return the v1 export id', function () {
-        return this.callback
-          .calledWith(null, { body: this.body })
-          .should.equal(true)
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/FileStore/FileStoreController.test.mjs b/services/web/test/unit/src/FileStore/FileStoreController.test.mjs
new file mode 100644
index 0000000000..2119c72a53
--- /dev/null
+++ b/services/web/test/unit/src/FileStore/FileStoreController.test.mjs
@@ -0,0 +1,255 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import MockResponse from '../helpers/MockResponse.js'
+
+const MODULE_PATH =
+  '../../../../app/src/Features/FileStore/FileStoreController.mjs'
+
+const expectedFileHeaders = {
+  'Cache-Control': 'private, max-age=3600',
+  'X-Served-By': 'filestore',
+}
+
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
+describe('FileStoreController', function () {
+  beforeEach(async function (ctx) {
+    ctx.FileStoreHandler = {
+      promises: {
+        getFileStream: sinon.stub(),
+        getFileSize: sinon.stub(),
+      },
+    }
+    ctx.ProjectLocator = { promises: { findElement: sinon.stub() } }
+    ctx.Stream = { pipeline: sinon.stub().resolves() }
+    ctx.HistoryManager = {}
+
+    vi.doMock('node:stream/promises', () => ctx.Stream)
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator', () => ({
+      default: ctx.ProjectLocator,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/FileStore/FileStoreHandler',
+      () => ({
+        default: ctx.FileStoreHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/History/HistoryManager', () => ({
+      default: ctx.HistoryManager,
+    }))
+
+    ctx.controller = (await import(MODULE_PATH)).default
+    ctx.stream = {}
+    ctx.projectId = '2k3j1lk3j21lk3j'
+    ctx.fileId = '12321kklj1lk3jk12'
+    ctx.req = {
+      params: {
+        Project_id: ctx.projectId,
+        File_id: ctx.fileId,
+      },
+      query: 'query string here',
+      get(key) {
+        return undefined
+      },
+      logger: {
+        addFields: sinon.stub(),
+      },
+    }
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub()
+    ctx.file = { name: 'myfile.png' }
+  })
+
+  describe('getFile', function () {
+    beforeEach(function (ctx) {
+      ctx.FileStoreHandler.promises.getFileStream.resolves(ctx.stream)
+      ctx.ProjectLocator.promises.findElement.resolves({ element: ctx.file })
+    })
+
+    it('should call the file store handler with the project_id file_id and any query string', async function (ctx) {
+      await ctx.controller.getFile(ctx.req, ctx.res)
+      ctx.FileStoreHandler.promises.getFileStream.should.have.been.calledWith(
+        ctx.req.params.Project_id,
+        ctx.req.params.File_id,
+        ctx.req.query
+      )
+    })
+
+    it('should pipe to res', async function (ctx) {
+      await ctx.controller.getFile(ctx.req, ctx.res)
+      ctx.Stream.pipeline.should.have.been.calledWith(ctx.stream, ctx.res)
+    })
+
+    it('should get the file from the db', async function (ctx) {
+      await ctx.controller.getFile(ctx.req, ctx.res)
+      ctx.ProjectLocator.promises.findElement.should.have.been.calledWith({
+        project_id: ctx.projectId,
+        element_id: ctx.fileId,
+        type: 'file',
+      })
+    })
+
+    it('should set the Content-Disposition header', async function (ctx) {
+      await ctx.controller.getFile(ctx.req, ctx.res)
+      ctx.res.setContentDisposition.should.be.calledWith('attachment', {
+        filename: ctx.file.name,
+      })
+    })
+
+    it('should return a 404 when not found', async function (ctx) {
+      ctx.ProjectLocator.promises.findElement.rejects(
+        new Errors.NotFoundError()
+      )
+      await ctx.controller.getFile(ctx.req, ctx.res)
+      expect(ctx.res.statusCode).to.equal(404)
+    })
+
+    // Test behaviour around handling html files
+    ;['.html', '.htm', '.xhtml'].forEach(extension => {
+      describe(`with a '${extension}' file extension`, function () {
+        beforeEach(function (ctx) {
+          ctx.file.name = `bad${extension}`
+          ctx.req.get = key => {
+            if (key === 'User-Agent') {
+              return 'A generic browser'
+            }
+          }
+        })
+
+        describe('from a non-ios browser', function () {
+          it('should not set Content-Type', async function (ctx) {
+            await ctx.controller.getFile(ctx.req, ctx.res)
+            ctx.res.headers.should.deep.equal({
+              ...expectedFileHeaders,
+            })
+          })
+        })
+
+        describe('from an iPhone', function () {
+          beforeEach(function (ctx) {
+            ctx.req.get = key => {
+              if (key === 'User-Agent') {
+                return 'An iPhone browser'
+              }
+            }
+          })
+
+          it("should set Content-Type to 'text/plain'", async function (ctx) {
+            await ctx.controller.getFile(ctx.req, ctx.res)
+            ctx.res.headers.should.deep.equal({
+              ...expectedFileHeaders,
+              'Content-Type': 'text/plain; charset=utf-8',
+              'X-Content-Type-Options': 'nosniff',
+            })
+          })
+        })
+
+        describe('from an iPad', function () {
+          beforeEach(function (ctx) {
+            ctx.req.get = key => {
+              if (key === 'User-Agent') {
+                return 'An iPad browser'
+              }
+            }
+          })
+
+          it("should set Content-Type to 'text/plain'", async function (ctx) {
+            await ctx.controller.getFile(ctx.req, ctx.res)
+            ctx.res.headers.should.deep.equal({
+              ...expectedFileHeaders,
+              'Content-Type': 'text/plain; charset=utf-8',
+              'X-Content-Type-Options': 'nosniff',
+            })
+          })
+        })
+      })
+    })
+    ;[
+      // None of these should trigger the iOS/html logic
+      'x.html-is-rad',
+      'html.pdf',
+      '.html-is-good-for-hidden-files',
+      'somefile',
+    ].forEach(filename => {
+      describe(`with filename as '${filename}'`, function () {
+        beforeEach(function (ctx) {
+          ctx.user_agent = 'A generic browser'
+          ctx.file.name = filename
+          ctx.req.get = key => {
+            if (key === 'User-Agent') {
+              return ctx.user_agent
+            }
+          }
+        })
+        ;['iPhone', 'iPad', 'Firefox', 'Chrome'].forEach(browser => {
+          describe(`downloaded from ${browser}`, function () {
+            beforeEach(function (ctx) {
+              ctx.user_agent = `Some ${browser} thing`
+            })
+
+            it('Should not set the Content-type', async function (ctx) {
+              await ctx.controller.getFile(ctx.req, ctx.res)
+              ctx.res.headers.should.deep.equal({
+                ...expectedFileHeaders,
+              })
+            })
+          })
+        })
+      })
+    })
+  })
+
+  describe('getFileHead', function () {
+    beforeEach(function (ctx) {
+      ctx.ProjectLocator.promises.findElement.resolves({ element: ctx.file })
+    })
+
+    it('reports the file size', async function (ctx) {
+      await new Promise(resolve => {
+        const expectedFileSize = 99393
+        ctx.FileStoreHandler.promises.getFileSize.rejects(
+          new Error('getFileSize: unexpected arguments')
+        )
+        ctx.FileStoreHandler.promises.getFileSize
+          .withArgs(ctx.projectId, ctx.fileId)
+          .resolves(expectedFileSize)
+
+        ctx.res.end = () => {
+          expect(ctx.res.status.lastCall.args).to.deep.equal([200])
+          expect(ctx.res.header.lastCall.args).to.deep.equal([
+            'Content-Length',
+            expectedFileSize,
+          ])
+          resolve()
+        }
+
+        ctx.controller.getFileHead(ctx.req, ctx.res)
+      })
+    })
+
+    it('returns 404 on NotFoundError', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.FileStoreHandler.promises.getFileSize.rejects(
+          new Errors.NotFoundError()
+        )
+
+        ctx.res.end = () => {
+          expect(ctx.res.status.lastCall.args).to.deep.equal([404])
+          resolve()
+        }
+
+        ctx.controller.getFileHead(ctx.req, ctx.res)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/FileStore/FileStoreControllerTests.mjs b/services/web/test/unit/src/FileStore/FileStoreControllerTests.mjs
deleted file mode 100644
index 2758068ce3..0000000000
--- a/services/web/test/unit/src/FileStore/FileStoreControllerTests.mjs
+++ /dev/null
@@ -1,235 +0,0 @@
-import { expect } from 'chai'
-import sinon from 'sinon'
-import esmock from 'esmock'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-import MockResponse from '../helpers/MockResponse.js'
-
-const MODULE_PATH =
-  '../../../../app/src/Features/FileStore/FileStoreController.mjs'
-
-const expectedFileHeaders = {
-  'Cache-Control': 'private, max-age=3600',
-  'X-Served-By': 'filestore',
-}
-
-describe('FileStoreController', function () {
-  beforeEach(async function () {
-    this.FileStoreHandler = {
-      promises: {
-        getFileStream: sinon.stub(),
-        getFileSize: sinon.stub(),
-      },
-    }
-    this.ProjectLocator = { promises: { findElement: sinon.stub() } }
-    this.Stream = { pipeline: sinon.stub().resolves() }
-    this.HistoryManager = {}
-    this.controller = await esmock.strict(MODULE_PATH, {
-      'node:stream/promises': this.Stream,
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/Features/Project/ProjectLocator':
-        this.ProjectLocator,
-      '../../../../app/src/Features/FileStore/FileStoreHandler':
-        this.FileStoreHandler,
-      '../../../../app/src/Features/History/HistoryManager':
-        this.HistoryManager,
-    })
-    this.stream = {}
-    this.projectId = '2k3j1lk3j21lk3j'
-    this.fileId = '12321kklj1lk3jk12'
-    this.req = {
-      params: {
-        Project_id: this.projectId,
-        File_id: this.fileId,
-      },
-      query: 'query string here',
-      get(key) {
-        return undefined
-      },
-      logger: {
-        addFields: sinon.stub(),
-      },
-    }
-    this.res = new MockResponse()
-    this.next = sinon.stub()
-    this.file = { name: 'myfile.png' }
-  })
-
-  describe('getFile', function () {
-    beforeEach(function () {
-      this.FileStoreHandler.promises.getFileStream.resolves(this.stream)
-      this.ProjectLocator.promises.findElement.resolves({ element: this.file })
-    })
-
-    it('should call the file store handler with the project_id file_id and any query string', async function () {
-      await this.controller.getFile(this.req, this.res)
-      this.FileStoreHandler.promises.getFileStream.should.have.been.calledWith(
-        this.req.params.Project_id,
-        this.req.params.File_id,
-        this.req.query
-      )
-    })
-
-    it('should pipe to res', async function () {
-      await this.controller.getFile(this.req, this.res)
-      this.Stream.pipeline.should.have.been.calledWith(this.stream, this.res)
-    })
-
-    it('should get the file from the db', async function () {
-      await this.controller.getFile(this.req, this.res)
-      this.ProjectLocator.promises.findElement.should.have.been.calledWith({
-        project_id: this.projectId,
-        element_id: this.fileId,
-        type: 'file',
-      })
-    })
-
-    it('should set the Content-Disposition header', async function () {
-      await this.controller.getFile(this.req, this.res)
-      this.res.setContentDisposition.should.be.calledWith('attachment', {
-        filename: this.file.name,
-      })
-    })
-
-    it('should return a 404 when not found', async function () {
-      this.ProjectLocator.promises.findElement.rejects(
-        new Errors.NotFoundError()
-      )
-      await this.controller.getFile(this.req, this.res)
-      expect(this.res.statusCode).to.equal(404)
-    })
-
-    // Test behaviour around handling html files
-    ;['.html', '.htm', '.xhtml'].forEach(extension => {
-      describe(`with a '${extension}' file extension`, function () {
-        beforeEach(function () {
-          this.file.name = `bad${extension}`
-          this.req.get = key => {
-            if (key === 'User-Agent') {
-              return 'A generic browser'
-            }
-          }
-        })
-
-        describe('from a non-ios browser', function () {
-          it('should not set Content-Type', async function () {
-            await this.controller.getFile(this.req, this.res)
-            this.res.headers.should.deep.equal({
-              ...expectedFileHeaders,
-            })
-          })
-        })
-
-        describe('from an iPhone', function () {
-          beforeEach(function () {
-            this.req.get = key => {
-              if (key === 'User-Agent') {
-                return 'An iPhone browser'
-              }
-            }
-          })
-
-          it("should set Content-Type to 'text/plain'", async function () {
-            await this.controller.getFile(this.req, this.res)
-            this.res.headers.should.deep.equal({
-              ...expectedFileHeaders,
-              'Content-Type': 'text/plain; charset=utf-8',
-              'X-Content-Type-Options': 'nosniff',
-            })
-          })
-        })
-
-        describe('from an iPad', function () {
-          beforeEach(function () {
-            this.req.get = key => {
-              if (key === 'User-Agent') {
-                return 'An iPad browser'
-              }
-            }
-          })
-
-          it("should set Content-Type to 'text/plain'", async function () {
-            await this.controller.getFile(this.req, this.res)
-            this.res.headers.should.deep.equal({
-              ...expectedFileHeaders,
-              'Content-Type': 'text/plain; charset=utf-8',
-              'X-Content-Type-Options': 'nosniff',
-            })
-          })
-        })
-      })
-    })
-    ;[
-      // None of these should trigger the iOS/html logic
-      'x.html-is-rad',
-      'html.pdf',
-      '.html-is-good-for-hidden-files',
-      'somefile',
-    ].forEach(filename => {
-      describe(`with filename as '${filename}'`, function () {
-        beforeEach(function () {
-          this.user_agent = 'A generic browser'
-          this.file.name = filename
-          this.req.get = key => {
-            if (key === 'User-Agent') {
-              return this.user_agent
-            }
-          }
-        })
-        ;['iPhone', 'iPad', 'Firefox', 'Chrome'].forEach(browser => {
-          describe(`downloaded from ${browser}`, function () {
-            beforeEach(function () {
-              this.user_agent = `Some ${browser} thing`
-            })
-
-            it('Should not set the Content-type', async function () {
-              await this.controller.getFile(this.req, this.res)
-              this.res.headers.should.deep.equal({
-                ...expectedFileHeaders,
-              })
-            })
-          })
-        })
-      })
-    })
-  })
-
-  describe('getFileHead', function () {
-    beforeEach(function () {
-      this.ProjectLocator.promises.findElement.resolves({ element: this.file })
-    })
-
-    it('reports the file size', function (done) {
-      const expectedFileSize = 99393
-      this.FileStoreHandler.promises.getFileSize.rejects(
-        new Error('getFileSize: unexpected arguments')
-      )
-      this.FileStoreHandler.promises.getFileSize
-        .withArgs(this.projectId, this.fileId)
-        .resolves(expectedFileSize)
-
-      this.res.end = () => {
-        expect(this.res.status.lastCall.args).to.deep.equal([200])
-        expect(this.res.header.lastCall.args).to.deep.equal([
-          'Content-Length',
-          expectedFileSize,
-        ])
-        done()
-      }
-
-      this.controller.getFileHead(this.req, this.res)
-    })
-
-    it('returns 404 on NotFoundError', function (done) {
-      this.FileStoreHandler.promises.getFileSize.rejects(
-        new Errors.NotFoundError()
-      )
-
-      this.res.end = () => {
-        expect(this.res.status.lastCall.args).to.deep.equal([404])
-        done()
-      }
-
-      this.controller.getFileHead(this.req, this.res)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/FileStore/FileStoreHandlerTests.js b/services/web/test/unit/src/FileStore/FileStoreHandlerTests.js
index bf9fe6c900..3a66f275a7 100644
--- a/services/web/test/unit/src/FileStore/FileStoreHandlerTests.js
+++ b/services/web/test/unit/src/FileStore/FileStoreHandlerTests.js
@@ -95,7 +95,7 @@ describe('FileStoreHandler', function () {
       this.request.returns(this.writeStream)
     })
 
-    it('should get the project details', function (done) {
+    it('should get the project details', async function () {
       this.fs.createReadStream.returns({
         pipe() {},
         on(type, cb) {
@@ -104,20 +104,17 @@ describe('FileStoreHandler', function () {
           }
         },
       })
-      this.handler.uploadFileFromDisk(
+      await this.handler.promises.uploadFileFromDisk(
         this.projectId,
         this.fileArgs,
-        this.fsPath,
-        () => {
-          this.ProjectDetailsHandler.getDetails
-            .calledWith(this.projectId)
-            .should.equal(true)
-          done()
-        }
+        this.fsPath
       )
+      this.ProjectDetailsHandler.getDetails
+        .calledWith(this.projectId)
+        .should.equal(true)
     })
 
-    it('should compute the file hash', function (done) {
+    it('should compute the file hash', async function () {
       this.fs.createReadStream.returns({
         pipe() {},
         on(type, cb) {
@@ -126,21 +123,18 @@ describe('FileStoreHandler', function () {
           }
         },
       })
-      this.handler.uploadFileFromDisk(
+      await this.handler.promises.uploadFileFromDisk(
         this.projectId,
         this.fileArgs,
-        this.fsPath,
-        () => {
-          this.FileHashManager.computeHash
-            .calledWith(this.fsPath)
-            .should.equal(true)
-          done()
-        }
+        this.fsPath
       )
+      this.FileHashManager.computeHash
+        .calledWith(this.fsPath)
+        .should.equal(true)
     })
 
     describe('when project-history-blobs feature is enabled', function () {
-      it('should upload the file to the history store as a blob', function (done) {
+      it('should upload the file to the history store as a blob', async function () {
         this.fs.createReadStream.returns({
           pipe() {},
           on(type, cb) {
@@ -150,26 +144,23 @@ describe('FileStoreHandler', function () {
           },
         })
         this.Features.hasFeature.withArgs('project-history-blobs').returns(true)
-        this.handler.uploadFileFromDisk(
+        await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          () => {
-            this.HistoryManager.uploadBlobFromDisk
-              .calledWith(
-                this.historyId,
-                this.hashValue,
-                this.fileSize,
-                this.fsPath
-              )
-              .should.equal(true)
-            done()
-          }
+          this.fsPath
         )
+        this.HistoryManager.uploadBlobFromDisk
+          .calledWith(
+            this.historyId,
+            this.hashValue,
+            this.fileSize,
+            this.fsPath
+          )
+          .should.equal(true)
       })
     })
     describe('when project-history-blobs feature is disabled', function () {
-      it('should not upload the file to the history store as a blob', function (done) {
+      it('should not upload the file to the history store as a blob', async function () {
         this.fs.createReadStream.returns({
           pipe() {},
           on(type, cb) {
@@ -178,15 +169,12 @@ describe('FileStoreHandler', function () {
             }
           },
         })
-        this.handler.uploadFileFromDisk(
+        await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          () => {
-            this.HistoryManager.uploadBlobFromDisk.called.should.equal(false)
-            done()
-          }
+          this.fsPath
         )
+        this.HistoryManager.uploadBlobFromDisk.called.should.equal(false)
       })
     })
 
@@ -214,71 +202,63 @@ describe('FileStoreHandler', function () {
         )
       })
 
-      it('should pipe the read stream to request', function (done) {
+      it('should pipe the read stream to request', function () {
         this.request.returns(this.writeStream)
-        this.fs.createReadStream.returns({
-          on(type, cb) {
-            if (type === 'open') {
-              cb()
-            }
-          },
-          pipe: o => {
-            this.writeStream.should.equal(o)
-            done()
-          },
+        return new Promise((resolve, reject) => {
+          this.fs.createReadStream.returns({
+            on(type, cb) {
+              if (type === 'open') {
+                cb()
+              }
+            },
+            pipe: o => {
+              this.writeStream.should.equal(o)
+              resolve()
+            },
+          })
+          this.handler.promises
+            .uploadFileFromDisk(this.projectId, this.fileArgs, this.fsPath)
+            .catch(reject)
         })
-        this.handler.uploadFileFromDisk(
-          this.projectId,
-          this.fileArgs,
-          this.fsPath,
-          () => {}
-        )
       })
 
-      it('should pass the correct options to request', function (done) {
+      it('should pass the correct options to request', async function () {
         const fileUrl = this.getFileUrl(this.projectId, this.fileId)
         this.fs.createReadStream.returns({
-          pipe() {},
-          on(type, cb) {
+          pipe: sinon.stub(),
+          on: sinon.stub((type, cb) => {
             if (type === 'open') {
               cb()
             }
-          },
+          }),
         })
-        this.handler.uploadFileFromDisk(
+        await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          () => {
-            this.request.args[0][0].method.should.equal('post')
-            this.request.args[0][0].uri.should.equal(fileUrl)
-            done()
-          }
+          this.fsPath
         )
+        this.request.args[0][0].method.should.equal('post')
+        this.request.args[0][0].uri.should.equal(fileUrl)
       })
 
-      it('should callback with the url and fileRef', function (done) {
+      it('should resolve with the url and fileRef', async function () {
         const fileUrl = this.getFileUrl(this.projectId, this.fileId)
         this.fs.createReadStream.returns({
-          pipe() {},
-          on(type, cb) {
+          pipe: sinon.stub(),
+          on: sinon.stub((type, cb) => {
             if (type === 'open') {
               cb()
             }
-          },
+          }),
         })
-        this.handler.uploadFileFromDisk(
+        const { url, fileRef } = await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          (err, url, fileRef) => {
-            expect(err).to.not.exist
-            expect(url).to.equal(fileUrl)
-            expect(fileRef._id).to.equal(this.fileId)
-            expect(fileRef.hash).to.equal(this.hashValue)
-            done()
-          }
+          this.fsPath
         )
+        expect(url).to.equal(fileUrl)
+        expect(fileRef._id).to.equal(this.fileId)
+        expect(fileRef.hash).to.equal(this.hashValue)
       })
       describe('when upload to filestore fails', function () {
         beforeEach(function () {
@@ -289,28 +269,32 @@ describe('FileStoreHandler', function () {
           }
         })
 
-        it('should callback with an error', function (done) {
+        it('should reject with an error', async function () {
           this.fs.createReadStream.callCount = 0
           this.fs.createReadStream.returns({
-            pipe() {},
-            on(type, cb) {
+            pipe: sinon.stub(),
+            on: sinon.stub((type, cb) => {
               if (type === 'open') {
                 cb()
               }
-            },
+            }),
           })
-          this.handler.uploadFileFromDisk(
-            this.projectId,
-            this.fileArgs,
-            this.fsPath,
-            err => {
-              expect(err).to.exist
-              expect(err).to.be.instanceof(Error)
-              expect(this.fs.createReadStream.callCount).to.equal(
-                this.handler.RETRY_ATTEMPTS
-              )
-              done()
-            }
+          let error
+
+          try {
+            await this.handler.promises.uploadFileFromDisk(
+              this.projectId,
+              this.fileArgs,
+              this.fsPath
+            )
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.be.instanceOf(Error)
+
+          expect(this.fs.createReadStream.callCount).to.equal(
+            this.handler.RETRY_ATTEMPTS
           )
         })
       })
@@ -319,49 +303,40 @@ describe('FileStoreHandler', function () {
       beforeEach(function () {
         this.Features.hasFeature.withArgs('filestore').returns(false)
       })
-      it('should not open file handle', function (done) {
-        this.handler.uploadFileFromDisk(
+      it('should not open file handle', async function () {
+        await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          () => {
-            expect(this.fs.createReadStream).to.not.have.been.called
-            done()
-          }
+          this.fsPath
         )
+        expect(this.fs.createReadStream).to.not.have.been.called
       })
 
-      it('should not talk to filestore', function (done) {
-        this.handler.uploadFileFromDisk(
+      it('should not talk to filestore', async function () {
+        await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          () => {
-            expect(this.request).to.not.have.been.called
-            done()
-          }
+          this.fsPath
         )
+
+        expect(this.request).to.not.have.been.called
       })
 
-      it('should callback with the url and fileRef', function (done) {
+      it('should resolve with the url and fileRef', async function () {
         const fileUrl = this.getFileUrl(this.projectId, this.fileId)
-        this.handler.uploadFileFromDisk(
+        const { url, fileRef } = await this.handler.promises.uploadFileFromDisk(
           this.projectId,
           this.fileArgs,
-          this.fsPath,
-          (err, url, fileRef) => {
-            expect(err).to.not.exist
-            expect(url).to.equal(fileUrl)
-            expect(fileRef._id).to.equal(this.fileId)
-            expect(fileRef.hash).to.equal(this.hashValue)
-            done()
-          }
+          this.fsPath
         )
+        expect(url).to.equal(fileUrl)
+        expect(fileRef._id).to.equal(this.fileId)
+        expect(fileRef.hash).to.equal(this.hashValue)
       })
     })
 
     describe('symlink', function () {
-      it('should not read file if it is symlink', function (done) {
+      it('should not read file if it is symlink', async function () {
         this.fs.lstat = sinon.stub().callsArgWith(1, null, {
           isFile() {
             return false
@@ -371,28 +346,40 @@ describe('FileStoreHandler', function () {
           },
         })
 
-        this.handler.uploadFileFromDisk(
-          this.projectId,
-          this.fileArgs,
-          this.fsPath,
-          () => {
-            this.fs.createReadStream.called.should.equal(false)
-            done()
-          }
-        )
+        let error
+
+        try {
+          await this.handler.promises.uploadFileFromDisk(
+            this.projectId,
+            this.fileArgs,
+            this.fsPath
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+
+        this.fs.createReadStream.called.should.equal(false)
       })
 
-      it('should not read file stat returns nothing', function (done) {
+      it('should not read file stat returns nothing', async function () {
         this.fs.lstat = sinon.stub().callsArgWith(1, null, null)
-        this.handler.uploadFileFromDisk(
-          this.projectId,
-          this.fileArgs,
-          this.fsPath,
-          () => {
-            this.fs.createReadStream.called.should.equal(false)
-            done()
-          }
-        )
+        let error
+
+        try {
+          await this.handler.promises.uploadFileFromDisk(
+            this.projectId,
+            this.fileArgs,
+            this.fsPath
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+
+        this.fs.createReadStream.called.should.equal(false)
       })
     })
   })
@@ -410,13 +397,18 @@ describe('FileStoreHandler', function () {
       })
     })
 
-    it('should return the error if there is one', function (done) {
-      const error = 'my error'
-      this.request.callsArgWith(1, error)
-      this.handler.deleteFile(this.projectId, this.fileId, err => {
-        assert.equal(err, error)
-        done()
-      })
+    it('should reject with the error if there is one', async function () {
+      const expectedError = 'my error'
+      this.request.callsArgWith(1, expectedError)
+      let error
+
+      try {
+        await this.handler.promises.deleteFile(this.projectId, this.fileId)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.equal(expectedError)
     })
   })
 
@@ -425,40 +417,43 @@ describe('FileStoreHandler', function () {
       beforeEach(function () {
         this.Features.hasFeature.withArgs('filestore').returns(true)
       })
-      it('should send a delete request to filestore api', function (done) {
+      it('should send a delete request to filestore api', async function () {
         const projectUrl = this.getProjectUrl(this.projectId)
         this.request.callsArgWith(1, null)
 
-        this.handler.deleteProject(this.projectId, err => {
-          assert.equal(err, undefined)
-          this.request.args[0][0].method.should.equal('delete')
-          this.request.args[0][0].uri.should.equal(projectUrl)
-          done()
-        })
+        await this.handler.promises.deleteProject(this.projectId)
+        this.request.args[0][0].method.should.equal('delete')
+        this.request.args[0][0].uri.should.equal(projectUrl)
       })
 
-      it('should wrap the error if there is one', function (done) {
-        const error = new Error('my error')
-        this.request.callsArgWith(1, error)
-        this.handler.deleteProject(this.projectId, err => {
-          expect(OError.getFullStack(err)).to.match(
-            /something went wrong deleting a project in filestore/
-          )
-          expect(OError.getFullStack(err)).to.match(/my error/)
-          done()
-        })
+      it('should wrap the error if there is one', async function () {
+        const expectedError = new Error('my error')
+        this.request.callsArgWith(1, expectedError)
+        const promise = this.handler.promises.deleteProject(this.projectId)
+        let error
+
+        try {
+          await promise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+
+        expect(OError.getFullStack(error)).to.match(
+          /something went wrong deleting a project in filestore/
+        )
+        expect(OError.getFullStack(error)).to.match(/my error/)
       })
     })
     describe('when filestore is disabled', function () {
       beforeEach(function () {
         this.Features.hasFeature.withArgs('filestore').returns(false)
       })
-      it('should not send a delete request to filestore api', function (done) {
-        this.handler.deleteProject(this.projectId, err => {
-          assert.equal(err, undefined)
-          this.request.called.should.equal(false)
-          done()
-        })
+      it('should not send a delete request to filestore api', async function () {
+        await this.handler.promises.deleteProject(this.projectId)
+
+        this.request.called.should.equal(false)
       })
     })
   })
@@ -469,18 +464,37 @@ describe('FileStoreHandler', function () {
         this.Features.hasFeature.withArgs('filestore').returns(false)
       })
 
-      it('should callback with a NotFoundError', function (done) {
-        this.handler.getFileStream(this.projectId, this.fileId, {}, err => {
-          expect(err).to.be.instanceof(Errors.NotFoundError)
-          done()
-        })
+      it('should callback with a NotFoundError', async function () {
+        let error
+
+        try {
+          await this.handler.promises.getFileStream(
+            this.projectId,
+            this.fileId,
+            {}
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
       })
 
-      it('should not call request', function (done) {
-        this.handler.getFileStream(this.projectId, this.fileId, {}, () => {
-          this.request.called.should.equal(false)
-          done()
-        })
+      it('should not call request', async function () {
+        let error
+
+        try {
+          await this.handler.promises.getFileStream(
+            this.projectId,
+            this.fileId,
+            {}
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+        this.request.called.should.equal(false)
       })
     })
     describe('when filestore is enabled', function () {
@@ -490,53 +504,36 @@ describe('FileStoreHandler', function () {
         this.Features.hasFeature.withArgs('filestore').returns(true)
       })
 
-      it('should get the stream with the correct params', function (done) {
+      it('should get the stream with the correct params', async function () {
         const fileUrl = this.getFileUrl(this.projectId, this.fileId)
-        this.handler.getFileStream(
+        await this.handler.promises.getFileStream(
           this.projectId,
           this.fileId,
-          this.query,
-          (err, stream) => {
-            if (err) {
-              return done(err)
-            }
-            this.request.args[0][0].method.should.equal('get')
-            this.request.args[0][0].uri.should.equal(
-              fileUrl + '?from=getFileStream'
-            )
-            done()
-          }
+          this.query
+        )
+        this.request.args[0][0].method.should.equal('get')
+        this.request.args[0][0].uri.should.equal(
+          fileUrl + '?from=getFileStream'
         )
       })
 
-      it('should get stream from request', function (done) {
-        this.handler.getFileStream(
+      it('should get stream from request', async function () {
+        const stream = await this.handler.promises.getFileStream(
           this.projectId,
           this.fileId,
-          this.query,
-          (err, stream) => {
-            if (err) {
-              return done(err)
-            }
-            stream.should.equal(this.readStream)
-            done()
-          }
+          this.query
         )
+
+        stream.should.equal(this.readStream)
       })
 
-      it('should add an error handler', function (done) {
-        this.handler.getFileStream(
+      it('should add an error handler', async function () {
+        const stream = await this.handler.promises.getFileStream(
           this.projectId,
           this.fileId,
-          this.query,
-          (err, stream) => {
-            if (err) {
-              return done(err)
-            }
-            stream.on.calledWith('error').should.equal(true)
-            done()
-          }
+          this.query
         )
+        stream.on.calledWith('error').should.equal(true)
       })
 
       describe('when range is specified in query', function () {
@@ -544,22 +541,17 @@ describe('FileStoreHandler', function () {
           this.query = { range: '0-10' }
         })
 
-        it('should add a range header', function (done) {
-          this.handler.getFileStream(
+        it('should add a range header', async function () {
+          await this.handler.promises.getFileStream(
             this.projectId,
             this.fileId,
-            this.query,
-            (err, stream) => {
-              if (err) {
-                return done(err)
-              }
-              this.request.callCount.should.equal(1)
-              const { headers } = this.request.firstCall.args[0]
-              expect(headers).to.have.keys('range')
-              expect(headers.range).to.equal('bytes=0-10')
-              done()
-            }
+            this.query
           )
+
+          this.request.callCount.should.equal(1)
+          const { headers } = this.request.firstCall.args[0]
+          expect(headers).to.have.keys('range')
+          expect(headers.range).to.equal('bytes=0-10')
         })
 
         describe('when range is invalid', function () {
@@ -568,21 +560,15 @@ describe('FileStoreHandler', function () {
               this.query = { range: `${r}` }
             })
 
-            it(`should not add a range header for '${r}'`, function (done) {
-              this.handler.getFileStream(
+            it(`should not add a range header for '${r}'`, async function () {
+              await this.handler.promises.getFileStream(
                 this.projectId,
                 this.fileId,
-                this.query,
-                (err, stream) => {
-                  if (err) {
-                    return done(err)
-                  }
-                  this.request.callCount.should.equal(1)
-                  const { headers } = this.request.firstCall.args[0]
-                  expect(headers).to.not.have.keys('range')
-                  done()
-                }
+                this.query
               )
+              this.request.callCount.should.equal(1)
+              const { headers } = this.request.firstCall.args[0]
+              expect(headers).to.not.have.keys('range')
             })
           })
         })
@@ -591,7 +577,7 @@ describe('FileStoreHandler', function () {
   })
 
   describe('getFileSize', function () {
-    it('returns the file size reported by filestore', function (done) {
+    it('returns the file size reported by filestore', async function () {
       const expectedFileSize = 32432
       const fileUrl =
         this.getFileUrl(this.projectId, this.fileId) + '?from=getFileSize'
@@ -605,40 +591,54 @@ describe('FileStoreHandler', function () {
         },
       })
 
-      this.handler.getFileSize(this.projectId, this.fileId, (err, fileSize) => {
-        if (err) {
-          return done(err)
-        }
-        expect(fileSize).to.equal(expectedFileSize)
-        done()
-      })
+      const fileSize = await this.handler.promises.getFileSize(
+        this.projectId,
+        this.fileId
+      )
+      expect(fileSize).to.equal(expectedFileSize)
     })
 
-    it('throws a NotFoundError on a 404 from filestore', function (done) {
+    it('throws a NotFoundError on a 404 from filestore', async function () {
       this.request.head.yields(null, { statusCode: 404 })
 
-      this.handler.getFileSize(this.projectId, this.fileId, err => {
-        expect(err).to.be.instanceof(Errors.NotFoundError)
-        done()
-      })
+      let error
+
+      try {
+        await this.handler.promises.getFileSize(this.projectId, this.fileId)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.NotFoundError)
     })
 
-    it('throws an error on a non-200 from filestore', function (done) {
+    it('throws an error on a non-200 from filestore', async function () {
       this.request.head.yields(null, { statusCode: 500 })
 
-      this.handler.getFileSize(this.projectId, this.fileId, err => {
-        expect(err).to.be.instanceof(Error)
-        done()
-      })
+      let error
+
+      try {
+        await this.handler.promises.getFileSize(this.projectId, this.fileId)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Error)
     })
 
-    it('rethrows errors from filestore', function (done) {
-      this.request.head.yields(new Error())
+    it('rethrows errors from filestore', async function () {
+      const expectedError = new Error('from filestore')
+      this.request.head.yields(expectedError)
 
-      this.handler.getFileSize(this.projectId, this.fileId, err => {
-        expect(err).to.be.instanceof(Error)
-        done()
-      })
+      let error
+
+      try {
+        await this.handler.promises.getFileSize(this.projectId, this.fileId)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.equal(expectedError)
     })
   })
 
@@ -648,74 +648,75 @@ describe('FileStoreHandler', function () {
       this.newFileId = 'new file id'
     })
 
-    it('should post json', function (done) {
+    it('should post json', async function () {
       const newFileUrl = this.getFileUrl(this.newProjectId, this.newFileId)
       this.request.callsArgWith(1, null, { statusCode: 200 })
 
-      this.handler.copyFile(
+      await this.handler.promises.copyFile(
         this.projectId,
         this.fileId,
         this.newProjectId,
-        this.newFileId,
-        () => {
-          this.request.args[0][0].method.should.equal('put')
-          this.request.args[0][0].uri.should.equal(newFileUrl)
-          this.request.args[0][0].json.source.project_id.should.equal(
-            this.projectId
-          )
-          this.request.args[0][0].json.source.file_id.should.equal(this.fileId)
-          done()
-        }
+        this.newFileId
       )
+      this.request.args[0][0].method.should.equal('put')
+      this.request.args[0][0].uri.should.equal(newFileUrl)
+      this.request.args[0][0].json.source.project_id.should.equal(
+        this.projectId
+      )
+      this.request.args[0][0].json.source.file_id.should.equal(this.fileId)
     })
 
-    it('returns the url', function (done) {
+    it('returns the url', async function () {
       const expectedUrl = this.getFileUrl(this.newProjectId, this.newFileId)
       this.request.callsArgWith(1, null, { statusCode: 200 })
-      this.handler.copyFile(
+      const url = await this.handler.promises.copyFile(
         this.projectId,
         this.fileId,
         this.newProjectId,
-        this.newFileId,
-        (err, url) => {
-          if (err) {
-            return done(err)
-          }
-          url.should.equal(expectedUrl)
-          done()
-        }
+        this.newFileId
       )
+
+      url.should.equal(expectedUrl)
     })
 
-    it('should return the err', function (done) {
-      const error = new Error('error')
-      this.request.callsArgWith(1, error)
-      this.handler.copyFile(
-        this.projectId,
-        this.fileId,
-        this.newProjectId,
-        this.newFileId,
-        err => {
-          err.should.equal(error)
-          done()
-        }
-      )
+    it('should return the err', async function () {
+      const expectedError = new Error('error')
+      this.request.callsArgWith(1, expectedError)
+      let error
+
+      try {
+        await this.handler.promises.copyFile(
+          this.projectId,
+          this.fileId,
+          this.newProjectId,
+          this.newFileId
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.equal(expectedError)
     })
 
-    it('should return an error for a non-success statusCode', function (done) {
+    it('should return an error for a non-success statusCode', async function () {
       this.request.callsArgWith(1, null, { statusCode: 500 })
-      this.handler.copyFile(
-        this.projectId,
-        this.fileId,
-        this.newProjectId,
-        this.newFileId,
-        err => {
-          err.should.be.an('error')
-          err.message.should.equal(
-            'non-ok response from filestore for copyFile: 500'
-          )
-          done()
-        }
+      let error
+
+      try {
+        await this.handler.promises.copyFile(
+          this.projectId,
+          this.fileId,
+          this.newProjectId,
+          this.newFileId
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Error)
+      expect(error).to.have.property(
+        'message',
+        'non-ok response from filestore for copyFile: 500'
       )
     })
   })
diff --git a/services/web/test/unit/src/HelperFiles/AuthorizationHelperTests.js b/services/web/test/unit/src/HelperFiles/AuthorizationHelperTests.js
index ef8b5fcc6a..a82143dce6 100644
--- a/services/web/test/unit/src/HelperFiles/AuthorizationHelperTests.js
+++ b/services/web/test/unit/src/HelperFiles/AuthorizationHelperTests.js
@@ -63,72 +63,4 @@ describe('AuthorizationHelper', function () {
       expect(this.AuthorizationHelper.hasAnyStaffAccess(user)).to.be.false
     })
   })
-
-  describe('isReviewerRoleEnabled', function () {
-    it('with no reviewers and no split test', async function () {
-      this.ProjectGetter.promises.getProject = sinon.stub().resolves({
-        reviewer_refs: {},
-        owner_ref: 'ownerId',
-      })
-      this.SplitTestHandler.promises.getAssignmentForUser = sinon
-        .stub()
-        .resolves({
-          variant: 'disabled',
-        })
-      expect(
-        await this.AuthorizationHelper.promises.isReviewerRoleEnabled(
-          'projectId'
-        )
-      ).to.be.false
-    })
-
-    it('with no reviewers and enabled split test', async function () {
-      this.ProjectGetter.promises.getProject = sinon.stub().resolves({
-        reviewer_refs: {},
-        owner_ref: 'userId',
-      })
-      this.SplitTestHandler.promises.getAssignmentForUser = sinon
-        .stub()
-        .resolves({
-          variant: 'enabled',
-        })
-      expect(
-        await this.AuthorizationHelper.promises.isReviewerRoleEnabled(
-          'projectId'
-        )
-      ).to.be.true
-    })
-
-    it('with reviewers and disabled split test', async function () {
-      this.ProjectGetter.promises.getProject = sinon.stub().resolves({
-        reviewer_refs: [{ $oid: 'userId' }],
-      })
-      this.SplitTestHandler.promises.getAssignmentForUser = sinon
-        .stub()
-        .resolves({
-          variant: 'default',
-        })
-      expect(
-        await this.AuthorizationHelper.promises.isReviewerRoleEnabled(
-          'projectId'
-        )
-      ).to.be.true
-    })
-
-    it('with reviewers and enabled split test', async function () {
-      this.ProjectGetter.promises.getProject = sinon.stub().resolves({
-        reviewer_refs: [{ $oid: 'userId' }],
-      })
-      this.SplitTestHandler.promises.getAssignmentForUser = sinon
-        .stub()
-        .resolves({
-          variant: 'enabled',
-        })
-      expect(
-        await this.AuthorizationHelper.promises.isReviewerRoleEnabled(
-          'projectId'
-        )
-      ).to.be.true
-    })
-  })
 })
diff --git a/services/web/test/unit/src/History/HistoryControllerTests.js b/services/web/test/unit/src/History/HistoryControllerTests.js
index 8f37e6d258..f575859073 100644
--- a/services/web/test/unit/src/History/HistoryControllerTests.js
+++ b/services/web/test/unit/src/History/HistoryControllerTests.js
@@ -1,16 +1,6 @@
-/* eslint-disable
-    max-len,
-    no-return-assign,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const sinon = require('sinon')
 const { expect } = require('chai')
+const { RequestFailedError } = require('@overleaf/fetch-utils')
 
 const Errors = require('../../../../app/src/Features/Errors/Errors')
 
@@ -22,25 +12,59 @@ describe('HistoryController', function () {
   beforeEach(function () {
     this.callback = sinon.stub()
     this.user_id = 'user-id-123'
+    this.project_id = 'mock-project-id'
+    this.stream = sinon.stub()
+    this.fetchResponse = {
+      headers: {
+        get: sinon.stub(),
+      },
+    }
+    this.next = sinon.stub()
+
     this.SessionManager = {
       getLoggedInUserId: sinon.stub().returns(this.user_id),
     }
+
     this.Stream = {
-      pipeline: sinon.stub(),
+      pipeline: sinon.stub().resolves(),
     }
+
+    this.HistoryManager = {
+      promises: {
+        injectUserDetails: sinon.stub(),
+      },
+    }
+
+    this.ProjectEntityUpdateHandler = {
+      promises: {
+        resyncProjectHistory: sinon.stub().resolves(),
+      },
+    }
+
+    this.fetchJson = sinon.stub()
+    this.fetchStream = sinon.stub().resolves(this.stream)
+    this.fetchStreamWithResponse = sinon
+      .stub()
+      .resolves({ stream: this.stream, response: this.fetchResponse })
+    this.fetchNothing = sinon.stub().resolves()
+
     this.HistoryController = SandboxedModule.require(modulePath, {
       requires: {
-        request: (this.request = sinon.stub()),
+        'stream/promises': this.Stream,
         '@overleaf/settings': (this.settings = {}),
-        '@overleaf/fetch-utils': {},
+        '@overleaf/fetch-utils': {
+          fetchJson: this.fetchJson,
+          fetchStream: this.fetchStream,
+          fetchStreamWithResponse: this.fetchStreamWithResponse,
+          fetchNothing: this.fetchNothing,
+        },
         '@overleaf/Metrics': {},
         '../../infrastructure/mongodb': { ObjectId },
-        stream: this.Stream,
         '../Authentication/SessionManager': this.SessionManager,
-        './HistoryManager': (this.HistoryManager = {}),
+        './HistoryManager': this.HistoryManager,
         '../Project/ProjectDetailsHandler': (this.ProjectDetailsHandler = {}),
         '../Project/ProjectEntityUpdateHandler':
-          (this.ProjectEntityUpdateHandler = {}),
+          this.ProjectEntityUpdateHandler,
         '../User/UserGetter': (this.UserGetter = {}),
         '../Project/ProjectGetter': (this.ProjectGetter = {}),
         './RestoreManager': (this.RestoreManager = {}),
@@ -50,172 +74,125 @@ describe('HistoryController', function () {
           .returns(true)),
       },
     })
-    return (this.settings.apis = {
+    this.settings.apis = {
       project_history: {
         url: 'http://project_history.example.com',
       },
-    })
+    }
   })
 
   describe('proxyToHistoryApi', function () {
-    beforeEach(function () {
-      this.req = { url: '/mock/url', method: 'POST' }
-      this.res = 'mock-res'
-      this.next = sinon.stub()
-      this.proxy = sinon.stub()
-      this.request.returns(this.proxy)
+    beforeEach(async function () {
+      this.req = { url: '/mock/url', method: 'POST', session: sinon.stub() }
+      this.res = {
+        set: sinon.stub(),
+      }
+      this.contentType = 'application/json'
+      this.contentLength = 212
+      this.fetchResponse.headers.get
+        .withArgs('Content-Type')
+        .returns(this.contentType)
+      this.fetchResponse.headers.get
+        .withArgs('Content-Length')
+        .returns(this.contentLength)
+      await this.HistoryController.proxyToHistoryApi(
+        this.req,
+        this.res,
+        this.next
+      )
     })
 
-    describe('for a project with the project history flag', function () {
-      beforeEach(function () {
-        this.req.useProjectHistory = true
-        return this.HistoryController.proxyToHistoryApi(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should get the user id', function () {
-        return this.SessionManager.getLoggedInUserId
-          .calledWith(this.req.session)
-          .should.equal(true)
-      })
-
-      it('should call the project history api', function () {
-        return this.request
-          .calledWith({
-            url: `${this.settings.apis.project_history.url}${this.req.url}`,
-            method: this.req.method,
-            headers: {
-              'X-User-Id': this.user_id,
-            },
-          })
-          .should.equal(true)
-      })
-
-      it('should pipe the response to the client', function () {
-        expect(this.Stream.pipeline).to.have.been.calledWith(
-          this.proxy,
-          this.res
-        )
-      })
+    it('should get the user id', function () {
+      this.SessionManager.getLoggedInUserId.should.have.been.calledWith(
+        this.req.session
+      )
     })
 
-    describe('for a project without the project history flag', function () {
-      beforeEach(function () {
-        this.req.useProjectHistory = false
-        return this.HistoryController.proxyToHistoryApi(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
+    it('should call the project history api', function () {
+      this.fetchStreamWithResponse.should.have.been.calledWith(
+        `${this.settings.apis.project_history.url}${this.req.url}`,
+        {
+          method: this.req.method,
+          headers: {
+            'X-User-Id': this.user_id,
+          },
+        }
+      )
+    })
 
-      it('should get the user id', function () {
-        return this.SessionManager.getLoggedInUserId
-          .calledWith(this.req.session)
-          .should.equal(true)
-      })
+    it('should pipe the response to the client', function () {
+      expect(this.Stream.pipeline).to.have.been.calledWith(
+        this.stream,
+        this.res
+      )
+    })
 
-      it('should pipe the response to the client', function () {
-        expect(this.Stream.pipeline).to.have.been.calledWith(
-          this.proxy,
-          this.res
-        )
-      })
+    it('should propagate the appropriate headers', function () {
+      expect(this.res.set).to.have.been.calledWith(
+        'Content-Type',
+        this.contentType
+      )
+      expect(this.res.set).to.have.been.calledWith(
+        'Content-Length',
+        this.contentLength
+      )
     })
   })
 
   describe('proxyToHistoryApiAndInjectUserDetails', function () {
-    beforeEach(function () {
+    beforeEach(async function () {
       this.req = { url: '/mock/url', method: 'POST' }
       this.res = { json: sinon.stub() }
-      this.next = sinon.stub()
-      this.request.yields(null, { statusCode: 200 }, (this.data = 'mock-data'))
-      return (this.HistoryManager.injectUserDetails = sinon
-        .stub()
-        .yields(null, (this.data_with_users = 'mock-injected-data')))
+      this.data = 'mock-data'
+      this.dataWithUsers = 'mock-injected-data'
+      this.fetchJson.resolves(this.data)
+      this.HistoryManager.promises.injectUserDetails.resolves(
+        this.dataWithUsers
+      )
+      await this.HistoryController.proxyToHistoryApiAndInjectUserDetails(
+        this.req,
+        this.res,
+        this.next
+      )
     })
 
-    describe('for a project with the project history flag', function () {
-      beforeEach(function () {
-        this.req.useProjectHistory = true
-        return this.HistoryController.proxyToHistoryApiAndInjectUserDetails(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
-
-      it('should get the user id', function () {
-        return this.SessionManager.getLoggedInUserId
-          .calledWith(this.req.session)
-          .should.equal(true)
-      })
-
-      it('should call the project history api', function () {
-        return this.request
-          .calledWith({
-            url: `${this.settings.apis.project_history.url}${this.req.url}`,
-            method: this.req.method,
-            json: true,
-            headers: {
-              'X-User-Id': this.user_id,
-            },
-          })
-          .should.equal(true)
-      })
-
-      it('should inject the user data', function () {
-        return this.HistoryManager.injectUserDetails
-          .calledWith(this.data)
-          .should.equal(true)
-      })
-
-      it('should return the data with users to the client', function () {
-        return this.res.json.calledWith(this.data_with_users).should.equal(true)
-      })
+    it('should get the user id', function () {
+      this.SessionManager.getLoggedInUserId.should.have.been.calledWith(
+        this.req.session
+      )
     })
 
-    describe('for a project without the project history flag', function () {
-      beforeEach(function () {
-        this.req.useProjectHistory = false
-        return this.HistoryController.proxyToHistoryApiAndInjectUserDetails(
-          this.req,
-          this.res,
-          this.next
-        )
-      })
+    it('should call the project history api', function () {
+      this.fetchJson.should.have.been.calledWith(
+        `${this.settings.apis.project_history.url}${this.req.url}`,
+        {
+          method: this.req.method,
+          headers: {
+            'X-User-Id': this.user_id,
+          },
+        }
+      )
+    })
 
-      it('should get the user id', function () {
-        return this.SessionManager.getLoggedInUserId
-          .calledWith(this.req.session)
-          .should.equal(true)
-      })
+    it('should inject the user data', function () {
+      this.HistoryManager.promises.injectUserDetails.should.have.been.calledWith(
+        this.data
+      )
+    })
 
-      it('should inject the user data', function () {
-        return this.HistoryManager.injectUserDetails
-          .calledWith(this.data)
-          .should.equal(true)
-      })
-
-      it('should return the data with users to the client', function () {
-        return this.res.json.calledWith(this.data_with_users).should.equal(true)
-      })
+    it('should return the data with users to the client', function () {
+      this.res.json.should.have.been.calledWith(this.dataWithUsers)
     })
   })
 
   describe('proxyToHistoryApiAndInjectUserDetails (with the history API failing)', function () {
-    beforeEach(function () {
-      this.req = { url: '/mock/url', method: 'POST', useProjectHistory: true }
+    beforeEach(async function () {
+      this.url = '/mock/url'
+      this.req = { url: this.url, method: 'POST' }
       this.res = { json: sinon.stub() }
-      this.next = sinon.stub()
-      this.request.yields(null, { statusCode: 500 }, (this.data = 'mock-data'))
-      this.HistoryManager.injectUserDetails = sinon
-        .stub()
-        .yields(null, (this.data_with_users = 'mock-injected-data'))
-      return this.HistoryController.proxyToHistoryApiAndInjectUserDetails(
+      this.err = new RequestFailedError(this.url, {}, { status: 500 })
+      this.fetchJson.rejects(this.err)
+      await this.HistoryController.proxyToHistoryApiAndInjectUserDetails(
         this.req,
         this.res,
         this.next
@@ -223,30 +200,30 @@ describe('HistoryController', function () {
     })
 
     it('should not inject the user data', function () {
-      return this.HistoryManager.injectUserDetails
-        .calledWith(this.data)
-        .should.equal(false)
+      this.HistoryManager.promises.injectUserDetails.should.not.have.been.called
     })
 
     it('should not return the data with users to the client', function () {
-      return this.res.json.calledWith(this.data_with_users).should.equal(false)
+      this.res.json.should.not.have.been.called
+    })
+
+    it('should throw an error', function () {
+      this.next.should.have.been.calledWith(this.err)
     })
   })
 
   describe('resyncProjectHistory', function () {
     describe('for a project without project-history enabled', function () {
-      beforeEach(function () {
-        this.project_id = 'mock-project-id'
+      beforeEach(async function () {
         this.req = { params: { Project_id: this.project_id }, body: {} }
         this.res = { setTimeout: sinon.stub(), sendStatus: sinon.stub() }
-        this.next = sinon.stub()
 
         this.error = new Errors.ProjectHistoryDisabledError()
-        this.ProjectEntityUpdateHandler.resyncProjectHistory = sinon
-          .stub()
-          .yields(this.error)
+        this.ProjectEntityUpdateHandler.promises.resyncProjectHistory.rejects(
+          this.error
+        )
 
-        return this.HistoryController.resyncProjectHistory(
+        await this.HistoryController.resyncProjectHistory(
           this.req,
           this.res,
           this.next
@@ -254,22 +231,16 @@ describe('HistoryController', function () {
       })
 
       it('response with a 404', function () {
-        return this.res.sendStatus.calledWith(404).should.equal(true)
+        this.res.sendStatus.should.have.been.calledWith(404)
       })
     })
 
     describe('for a project with project-history enabled', function () {
-      beforeEach(function () {
-        this.project_id = 'mock-project-id'
+      beforeEach(async function () {
         this.req = { params: { Project_id: this.project_id }, body: {} }
         this.res = { setTimeout: sinon.stub(), sendStatus: sinon.stub() }
-        this.next = sinon.stub()
 
-        this.ProjectEntityUpdateHandler.resyncProjectHistory = sinon
-          .stub()
-          .yields()
-
-        return this.HistoryController.resyncProjectHistory(
+        await this.HistoryController.resyncProjectHistory(
           this.req,
           this.res,
           this.next
@@ -281,13 +252,13 @@ describe('HistoryController', function () {
       })
 
       it('resyncs the project', function () {
-        return this.ProjectEntityUpdateHandler.resyncProjectHistory
-          .calledWith(this.project_id)
-          .should.equal(true)
+        this.ProjectEntityUpdateHandler.promises.resyncProjectHistory.should.have.been.calledWith(
+          this.project_id
+        )
       })
 
       it('responds with a 204', function () {
-        return this.res.sendStatus.calledWith(204).should.equal(true)
+        this.res.sendStatus.should.have.been.calledWith(204)
       })
     })
   })
diff --git a/services/web/test/unit/src/History/HistoryManagerTests.js b/services/web/test/unit/src/History/HistoryManagerTests.js
index bfb13feaf2..aa59cda4e6 100644
--- a/services/web/test/unit/src/History/HistoryManagerTests.js
+++ b/services/web/test/unit/src/History/HistoryManagerTests.js
@@ -2,10 +2,36 @@ const { expect } = require('chai')
 const sinon = require('sinon')
 const SandboxedModule = require('sandboxed-module')
 const { ObjectId } = require('mongodb-legacy')
+const {
+  cleanupTestDatabase,
+  db,
+  waitForDb,
+} = require('../../../../app/src/infrastructure/mongodb')
 
 const MODULE_PATH = '../../../../app/src/Features/History/HistoryManager'
 
+const GLOBAL_BLOBS = {
+  e69de29bb2d1d6434b8b29ae775ad8c2e48c5391:
+    'e6/9d/e29bb2d1d6434b8b29ae775ad8c2e48c5391',
+  '02426c2b3a484003ca42ed52b374b7907b757d12':
+    '02/42/6c2b3a484003ca42ed52b374b7907b757d12',
+}
+
 describe('HistoryManager', function () {
+  before(async function () {
+    await waitForDb()
+  })
+  before(cleanupTestDatabase)
+  before(async function () {
+    await db.projectHistoryGlobalBlobs.insertMany(
+      Object.keys(GLOBAL_BLOBS).map(sha => ({
+        _id: sha,
+        byteLength: 0,
+        stringLength: 0,
+      }))
+    )
+  })
+
   beforeEach(function () {
     this.user_id = 'user-id-123'
     this.historyId = new ObjectId().toString()
@@ -29,6 +55,10 @@ describe('HistoryManager', function () {
           url: this.v1HistoryUrl,
           user: this.v1HistoryUser,
           pass: this.v1HistoryPassword,
+          buckets: {
+            globalBlobs: 'globalBlobs',
+            projectBlobs: 'projectBlobs',
+          },
         },
       },
     }
@@ -60,7 +90,7 @@ describe('HistoryManager', function () {
 
     this.HistoryManager = SandboxedModule.require(MODULE_PATH, {
       requires: {
-        '../../infrastructure/mongodb': { ObjectId },
+        '../../infrastructure/mongodb': { ObjectId, db, waitForDb },
         '@overleaf/fetch-utils': this.FetchUtils,
         '@overleaf/settings': this.settings,
         '../User/UserGetter': this.UserGetter,
@@ -70,6 +100,28 @@ describe('HistoryManager', function () {
     })
   })
 
+  describe('getBlobLocation', function () {
+    beforeEach(async function () {
+      await this.HistoryManager.loadGlobalBlobsPromise
+    })
+    it('should return a global blob location', function () {
+      for (const [sha, key] of Object.entries(GLOBAL_BLOBS)) {
+        expect(this.HistoryManager.getBlobLocation('42', sha)).to.deep.equal({
+          bucket: this.settings.apis.v1_history.buckets.globalBlobs,
+          key,
+        })
+      }
+    })
+    it('should return a project blob location', function () {
+      const sha = '6ddfa0578a67fe5ad6623a8665ec9aafce1eb5ca'
+      const key = '240/000/000/6d/dfa0578a67fe5ad6623a8665ec9aafce1eb5ca'
+      expect(this.HistoryManager.getBlobLocation('42', sha)).to.deep.equal({
+        bucket: this.settings.apis.v1_history.buckets.projectBlobs,
+        key,
+      })
+    })
+  })
+
   describe('initializeProject', function () {
     beforeEach(function () {
       this.settings.apis.project_history.initializeHistoryForNewProjects = true
diff --git a/services/web/test/unit/src/History/RestoreManagerTests.js b/services/web/test/unit/src/History/RestoreManagerTests.js
index d4bb9fc9ff..f76ba506ad 100644
--- a/services/web/test/unit/src/History/RestoreManagerTests.js
+++ b/services/web/test/unit/src/History/RestoreManagerTests.js
@@ -9,6 +9,12 @@ const tk = require('timekeeper')
 const moment = require('moment')
 const { expect } = require('chai')
 
+function nestedMapWithSetToObject(m) {
+  return Object.fromEntries(
+    Array.from(m.entries()).map(([key, set]) => [key, Array.from(set)])
+  )
+}
+
 describe('RestoreManager', function () {
   beforeEach(function () {
     tk.freeze(Date.now()) // freeze the time for these tests
@@ -28,7 +34,7 @@ describe('RestoreManager', function () {
             promises: { flushProjectToMongo: sinon.stub().resolves() },
           }),
         '../Docstore/DocstoreManager': (this.DocstoreManager = {
-          promises: {},
+          promises: { getCommentThreadIds: sinon.stub().resolves({}) },
         }),
         '../Chat/ChatApiHandler': (this.ChatApiHandler = { promises: {} }),
         '../Chat/ChatManager': (this.ChatManager = { promises: {} }),
@@ -81,7 +87,7 @@ describe('RestoreManager', function () {
 
       it('should find the root folder', function () {
         this.RestoreManager.promises._findOrCreateFolder
-          .calledWith(this.project_id, '')
+          .calledWith(this.project_id, '', this.user_id)
           .should.equal(true)
       })
 
@@ -116,7 +122,7 @@ describe('RestoreManager', function () {
 
       it('should find the folder', function () {
         this.RestoreManager.promises._findOrCreateFolder
-          .calledWith(this.project_id, 'foo')
+          .calledWith(this.project_id, 'foo', this.user_id)
           .should.equal(true)
       })
 
@@ -143,13 +149,14 @@ describe('RestoreManager', function () {
       })
       this.result = await this.RestoreManager.promises._findOrCreateFolder(
         this.project_id,
-        'folder/name'
+        'folder/name',
+        this.user_id
       )
     })
 
     it('should look up or create the folder', function () {
       this.EditorController.promises.mkdirp
-        .calledWith(this.project_id, 'folder/name')
+        .calledWith(this.project_id, 'folder/name', this.user_id)
         .should.equal(true)
     })
 
@@ -259,22 +266,33 @@ describe('RestoreManager', function () {
       beforeEach(function () {
         this.pathname = 'foo.tex'
         this.comments = [
-          { op: { t: 'comment-in-other-doc', p: 0, c: 'foo' } },
-          { op: { t: 'single-comment', p: 10, c: 'bar' } },
-          { op: { t: 'deleted-comment', p: 20, c: 'baz' } },
+          {
+            id: 'comment-in-other-doc',
+            op: { t: 'comment-in-other-doc', p: 0, c: 'foo' },
+          },
+          {
+            id: 'single-comment',
+            op: { t: 'single-comment', p: 10, c: 'bar' },
+          },
+          {
+            id: 'deleted-comment',
+            op: { t: 'deleted-comment', p: 20, c: 'baz' },
+          },
         ]
         this.remappedComments = [
-          { op: { t: 'duplicate-comment', p: 0, c: 'foo' } },
-          { op: { t: 'single-comment', p: 10, c: 'bar' } },
+          {
+            id: 'duplicate-comment',
+            op: { t: 'duplicate-comment', p: 0, c: 'foo' },
+          },
+          {
+            id: 'single-comment',
+            op: { t: 'single-comment', p: 10, c: 'bar' },
+          },
         ]
         this.ProjectLocator.promises.findElementByPath = sinon.stub().rejects()
-        this.DocstoreManager.promises.getAllRanges = sinon.stub().resolves([
-          {
-            ranges: {
-              comments: this.comments.slice(0, 1),
-            },
-          },
-        ])
+        this.DocstoreManager.promises.getCommentThreadIds = sinon
+          .stub()
+          .resolves({ 'other-doc': [this.comments[0].op.t] })
         this.ChatApiHandler.promises.duplicateCommentThreads = sinon
           .stub()
           .resolves({
@@ -354,7 +372,7 @@ describe('RestoreManager', function () {
           expect(
             this.DocumentUpdaterHandler.promises.flushProjectToMongo
           ).to.have.been.calledBefore(
-            this.DocstoreManager.promises.getAllRanges
+            this.DocstoreManager.promises.getCommentThreadIds
           )
         })
 
@@ -450,19 +468,11 @@ describe('RestoreManager', function () {
           )
         })
 
-        it('should delete the document before flushing', function () {
-          expect(
-            this.EditorController.promises.deleteEntity
-          ).to.have.been.calledBefore(
-            this.DocumentUpdaterHandler.promises.flushProjectToMongo
-          )
-        })
-
         it('should flush the document before fetching ranges', function () {
           expect(
             this.DocumentUpdaterHandler.promises.flushProjectToMongo
           ).to.have.been.calledBefore(
-            this.DocstoreManager.promises.getAllRanges
+            this.DocstoreManager.promises.getCommentThreadIds
           )
         })
 
@@ -498,6 +508,143 @@ describe('RestoreManager', function () {
           )
         })
       })
+
+      describe('with comments in same doc', function () {
+        // copy of the above, addition: inject and later inspect threadIds set
+        beforeEach(async function () {
+          this.ProjectLocator.promises.findElementByPath = sinon
+            .stub()
+            .resolves({ type: 'doc', element: { _id: 'mock-file-id' } })
+          this.EditorController.promises.deleteEntity = sinon.stub().resolves()
+          this.ChatApiHandler.promises.generateThreadData = sinon
+            .stub()
+            .resolves(
+              (this.threadData = {
+                [this.comments[0].op.t]: {
+                  messages: [
+                    {
+                      content: 'message',
+                      timestamp: '2024-01-01T00:00:00.000Z',
+                      user_id: 'user-1',
+                    },
+                  ],
+                },
+                [this.comments[1].op.t]: {
+                  messages: [
+                    {
+                      content: 'other message',
+                      timestamp: '2024-01-01T00:00:00.000Z',
+                      user_id: 'user-1',
+                    },
+                  ],
+                },
+              })
+            )
+
+          this.threadIds = new Map([
+            [
+              'mock-file-id',
+              new Set([this.comments[0].op.t, this.comments[1].op.t]),
+            ],
+          ])
+          // Comments are updated in-place. Look up threads before reverting.
+          this.afterThreadIds = {
+            // mock-file-id removed
+            [this.addedFile._id]: [
+              this.comments[0].op.t,
+              this.comments[1].op.t,
+            ],
+          }
+          this.data = await this.RestoreManager.promises._revertSingleFile(
+            this.user_id,
+            this.project_id,
+            this.version,
+            this.pathname,
+            this.threadIds
+          )
+        })
+
+        it('should import the file with original comments minus the deleted one', function () {
+          expect(
+            this.EditorController.promises.addDocWithRanges
+          ).to.have.been.calledWith(
+            this.project_id,
+            this.folder_id,
+            'foo.tex',
+            ['foo', 'bar', 'baz'],
+            {
+              changes: this.tracked_changes,
+              comments: this.comments.slice(0, 2),
+            },
+            {
+              kind: 'file-restore',
+              path: this.pathname,
+              version: this.version,
+              timestamp: new Date(this.endTs).toISOString(),
+            }
+          )
+        })
+
+        it('should add the seen thread ids to the map', function () {
+          expect(nestedMapWithSetToObject(this.threadIds)).to.deep.equal(
+            this.afterThreadIds
+          )
+        })
+      })
+
+      describe('with remapped comments during revertProject', function () {
+        // copy of the above, addition: inject and later inspect threadIds set
+        beforeEach(async function () {
+          this.ProjectLocator.promises.findElementByPath = sinon
+            .stub()
+            .resolves({ type: 'doc', element: { _id: 'mock-file-id' } })
+          this.EditorController.promises.deleteEntity = sinon.stub().resolves()
+
+          this.threadIds = new Map([
+            ['other-doc', new Set([this.comments[0].op.t])],
+          ])
+          // Comments are updated in-place. Look up threads before reverting.
+          this.afterThreadIds = {
+            // mock-file-id removed
+            'other-doc': [this.comments[0].op.t],
+            [this.addedFile._id]: [
+              this.remappedComments[0].op.t,
+              this.remappedComments[1].op.t,
+            ],
+          }
+          this.data = await this.RestoreManager.promises._revertSingleFile(
+            this.user_id,
+            this.project_id,
+            this.version,
+            this.pathname,
+            this.threadIds
+          )
+        })
+
+        it('should import the file', function () {
+          expect(
+            this.EditorController.promises.addDocWithRanges
+          ).to.have.been.calledWith(
+            this.project_id,
+            this.folder_id,
+            'foo.tex',
+            ['foo', 'bar', 'baz'],
+            { changes: this.tracked_changes, comments: this.remappedComments },
+            {
+              kind: 'file-restore',
+              path: this.pathname,
+              version: this.version,
+              timestamp: new Date(this.endTs).toISOString(),
+            }
+          )
+        })
+
+        it('should add the seen thread ids to the map', function () {
+          expect(nestedMapWithSetToObject(this.threadIds)).to.deep.equal(
+            this.afterThreadIds
+          )
+        })
+      })
     })
 
     describe('reverting a file or document with metadata', function () {
@@ -523,7 +670,9 @@ describe('RestoreManager', function () {
           .stub()
           .resolves((this.addedFile = { _id: 'mock-doc-id', type: 'doc' }))
 
-        this.DocstoreManager.promises.getAllRanges = sinon.stub().resolves([])
+        this.DocstoreManager.promises.getCommentThreadIds = sinon
+          .stub()
+          .resolves({})
         this.ChatApiHandler.promises.generateThreadData = sinon
           .stub()
           .resolves({})
@@ -740,7 +889,7 @@ describe('RestoreManager', function () {
       this.ProjectGetter.promises.getProject
         .withArgs(this.project_id)
         .resolves({ overleaf: { history: { rangesSupportEnabled: true } } })
-      this.RestoreManager.promises.revertFile = sinon.stub().resolves()
+      this.RestoreManager.promises._revertSingleFile = sinon.stub().resolves()
       this.RestoreManager.promises._getProjectPathsAtVersion = sinon
         .stub()
         .resolves([])
@@ -831,21 +980,27 @@ describe('RestoreManager', function () {
       })
 
       it('should revert the old files', function () {
-        expect(this.RestoreManager.promises.revertFile).to.have.been.calledWith(
+        expect(
+          this.RestoreManager.promises._revertSingleFile
+        ).to.have.been.calledWith(
           this.user_id,
           this.project_id,
           this.version,
           'main.tex'
         )
 
-        expect(this.RestoreManager.promises.revertFile).to.have.been.calledWith(
+        expect(
+          this.RestoreManager.promises._revertSingleFile
+        ).to.have.been.calledWith(
           this.user_id,
           this.project_id,
           this.version,
           'figures/image.png'
         )
 
-        expect(this.RestoreManager.promises.revertFile).to.have.been.calledWith(
+        expect(
+          this.RestoreManager.promises._revertSingleFile
+        ).to.have.been.calledWith(
           this.user_id,
           this.project_id,
           this.version,
@@ -855,7 +1010,7 @@ describe('RestoreManager', function () {
 
       it('should not revert the current files', function () {
         expect(
-          this.RestoreManager.promises.revertFile
+          this.RestoreManager.promises._revertSingleFile
         ).to.not.have.been.calledWith(
           this.user_id,
           this.project_id,
diff --git a/services/web/test/unit/src/Institutions/InstitutionsAPITests.js b/services/web/test/unit/src/Institutions/InstitutionsAPITests.js
index eb98115ec2..f3458f51f7 100644
--- a/services/web/test/unit/src/Institutions/InstitutionsAPITests.js
+++ b/services/web/test/unit/src/Institutions/InstitutionsAPITests.js
@@ -45,48 +45,43 @@ describe('InstitutionsAPI', function () {
   })
 
   describe('getInstitutionAffiliations', function () {
-    it('get affiliations', function (done) {
+    it('get affiliations', async function () {
       this.institutionId = 123
       const responseBody = ['123abc', '456def']
       this.request.yields(null, { statusCode: 200 }, responseBody)
-      this.InstitutionsAPI.getInstitutionAffiliations(
-        this.institutionId,
-        (err, body) => {
-          expect(err).not.to.exist
-          this.request.calledOnce.should.equal(true)
-          const requestOptions = this.request.lastCall.args[0]
-          const expectedUrl = `v1.url/api/v2/institutions/${this.institutionId}/affiliations`
-          requestOptions.url.should.equal(expectedUrl)
-          requestOptions.method.should.equal('GET')
-          requestOptions.maxAttempts.should.exist
-          requestOptions.maxAttempts.should.not.equal(0)
-          requestOptions.retryDelay.should.exist
-          expect(requestOptions.body).not.to.exist
-          body.should.equal(responseBody)
-          done()
-        }
-      )
+      const body =
+        await this.InstitutionsAPI.promises.getInstitutionAffiliations(
+          this.institutionId
+        )
+
+      this.request.calledOnce.should.equal(true)
+      const requestOptions = this.request.lastCall.args[0]
+      const expectedUrl = `v1.url/api/v2/institutions/${this.institutionId}/affiliations`
+      requestOptions.url.should.equal(expectedUrl)
+      requestOptions.method.should.equal('GET')
+      requestOptions.maxAttempts.should.exist
+      requestOptions.maxAttempts.should.not.equal(0)
+      requestOptions.retryDelay.should.exist
+      expect(requestOptions.body).not.to.exist
+      body.should.equal(responseBody)
     })
 
-    it('handle empty response', function (done) {
+    it('handle empty response', async function () {
       this.settings.apis.v1.url = ''
 
-      this.InstitutionsAPI.getInstitutionAffiliations(
-        this.institutionId,
-        (err, body) => {
-          expect(err).not.to.exist
-          expect(body).to.be.a('Array')
-          body.length.should.equal(0)
-          done()
-        }
-      )
+      const body =
+        await this.InstitutionsAPI.promises.getInstitutionAffiliations(
+          this.institutionId
+        )
+      expect(body).to.be.a('Array')
+      body.length.should.equal(0)
     })
   })
 
   describe('getLicencesForAnalytics', function () {
     const lag = 'daily'
     const queryDate = '2017-01-07:00:00.000Z'
-    it('should send the request to v1', function (done) {
+    it('should send the request to v1', async function () {
       const v1Result = {
         lag: 'daily',
         date: queryDate,
@@ -96,100 +91,91 @@ describe('InstitutionsAPI', function () {
         },
       }
       this.request.callsArgWith(1, null, { statusCode: 201 }, v1Result)
-      this.InstitutionsAPI.getLicencesForAnalytics(
+      await this.InstitutionsAPI.promises.getLicencesForAnalytics(
         lag,
-        queryDate,
-        (error, result) => {
-          expect(error).not.to.exist
-          const requestOptions = this.request.lastCall.args[0]
-          expect(requestOptions.body.query_date).to.equal(queryDate)
-          expect(requestOptions.body.lag).to.equal(lag)
-          requestOptions.method.should.equal('GET')
-          done()
-        }
+        queryDate
       )
+      const requestOptions = this.request.lastCall.args[0]
+      expect(requestOptions.body.query_date).to.equal(queryDate)
+      expect(requestOptions.body.lag).to.equal(lag)
+      requestOptions.method.should.equal('GET')
     })
-    it('should handle errors', function (done) {
+    it('should handle errors', async function () {
       this.request.callsArgWith(1, null, { statusCode: 500 })
-      this.InstitutionsAPI.getLicencesForAnalytics(
-        lag,
-        queryDate,
-        (error, result) => {
-          expect(error).to.be.instanceof(Errors.V1ConnectionError)
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.getLicencesForAnalytics(
+          lag,
+          queryDate
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.V1ConnectionError)
     })
   })
 
   describe('getUserAffiliations', function () {
-    it('get affiliations', function (done) {
+    it('get affiliations', async function () {
       const responseBody = [{ foo: 'bar' }]
       this.request.callsArgWith(1, null, { statusCode: 201 }, responseBody)
-      this.InstitutionsAPI.getUserAffiliations(
-        this.stubbedUser._id,
-        (err, body) => {
-          expect(err).not.to.exist
-          this.request.calledOnce.should.equal(true)
-          const requestOptions = this.request.lastCall.args[0]
-          const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
-          requestOptions.url.should.equal(expectedUrl)
-          requestOptions.method.should.equal('GET')
-          requestOptions.maxAttempts.should.equal(3)
-          expect(requestOptions.body).not.to.exist
-          body.should.equal(responseBody)
-          done()
-        }
+      const body = await this.InstitutionsAPI.promises.getUserAffiliations(
+        this.stubbedUser._id
       )
+      this.request.calledOnce.should.equal(true)
+      const requestOptions = this.request.lastCall.args[0]
+      const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
+      requestOptions.url.should.equal(expectedUrl)
+      requestOptions.method.should.equal('GET')
+      requestOptions.maxAttempts.should.equal(3)
+      expect(requestOptions.body).not.to.exist
+      body.should.equal(responseBody)
     })
 
-    it('handle error', function (done) {
+    it('handle error', async function () {
       const body = { errors: 'affiliation error message' }
       this.request.callsArgWith(1, null, { statusCode: 503 }, body)
-      this.InstitutionsAPI.getUserAffiliations(this.stubbedUser._id, err => {
-        expect(err).to.be.instanceof(Errors.V1ConnectionError)
-        done()
-      })
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.getUserAffiliations(
+          this.stubbedUser._id
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.V1ConnectionError)
     })
 
-    it('handle empty response', function (done) {
+    it('handle empty response', async function () {
       this.settings.apis.v1.url = ''
-      this.InstitutionsAPI.getUserAffiliations(
-        this.stubbedUser._id,
-        (err, body) => {
-          expect(err).not.to.exist
-          expect(body).to.be.a('Array')
-          body.length.should.equal(0)
-          done()
-        }
+      const body = await this.InstitutionsAPI.promises.getUserAffiliations(
+        this.stubbedUser._id
       )
+      expect(body).to.be.a('Array')
+      body.length.should.equal(0)
     })
   })
 
   describe('getUsersNeedingReconfirmationsLapsedProcessed', function () {
-    it('get the list of users', function (done) {
+    it('get the list of users', async function () {
       this.fetchJson.resolves({ statusCode: 200 })
-      this.InstitutionsAPI.getUsersNeedingReconfirmationsLapsedProcessed(
-        error => {
-          expect(error).not.to.exist
-          this.fetchJson.calledOnce.should.equal(true)
-          const requestOptions = this.fetchJson.lastCall.args[1]
-          const expectedUrl = `v1.url/api/v2/institutions/need_reconfirmation_lapsed_processed`
-          this.fetchJson.lastCall.args[0].should.equal(expectedUrl)
-          requestOptions.method.should.equal('GET')
-          done()
-        }
-      )
+      await this.InstitutionsAPI.promises.getUsersNeedingReconfirmationsLapsedProcessed()
+      this.fetchJson.calledOnce.should.equal(true)
+      const requestOptions = this.fetchJson.lastCall.args[1]
+      const expectedUrl = `v1.url/api/v2/institutions/need_reconfirmation_lapsed_processed`
+      this.fetchJson.lastCall.args[0].should.equal(expectedUrl)
+      requestOptions.method.should.equal('GET')
     })
 
-    it('handle error', function (done) {
+    it('handle error', async function () {
       this.fetchJson.throws({ info: { statusCode: 500 } })
-      this.InstitutionsAPI.getUsersNeedingReconfirmationsLapsedProcessed(
-        error => {
-          expect(error).to.exist
-          done()
-        }
-      )
+      await expect(
+        this.InstitutionsAPI.promises.getUsersNeedingReconfirmationsLapsedProcessed()
+      ).to.be.rejected
     })
   })
 
@@ -198,7 +184,7 @@ describe('InstitutionsAPI', function () {
       this.fetchNothing.resolves({ status: 201 })
     })
 
-    it('add affiliation', function (done) {
+    it('add affiliation', async function () {
       const affiliationOptions = {
         university: { id: 1 },
         department: 'Math',
@@ -206,95 +192,104 @@ describe('InstitutionsAPI', function () {
         confirmedAt: new Date(),
         entitlement: true,
       }
-      this.InstitutionsAPI.addAffiliation(
+      await this.InstitutionsAPI.promises.addAffiliation(
         this.stubbedUser._id,
         this.newEmail,
-        affiliationOptions,
-        err => {
-          expect(err).not.to.exist
-          this.fetchNothing.calledOnce.should.equal(true)
-          const requestOptions = this.fetchNothing.lastCall.args[1]
-          const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
-          expect(this.fetchNothing.lastCall.args[0]).to.equal(expectedUrl)
-          requestOptions.method.should.equal('POST')
-
-          const { json } = requestOptions
-          Object.keys(json).length.should.equal(7)
-          expect(json).to.deep.equal(
-            Object.assign(
-              { email: this.newEmail, rejectIfBlocklisted: undefined },
-              affiliationOptions
-            )
-          )
-          this.markAsReadIpMatcher.calledOnce.should.equal(true)
-          done()
-        }
+        affiliationOptions
       )
+      this.fetchNothing.calledOnce.should.equal(true)
+      const requestOptions = this.fetchNothing.lastCall.args[1]
+      const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
+      expect(this.fetchNothing.lastCall.args[0]).to.equal(expectedUrl)
+      requestOptions.method.should.equal('POST')
+
+      const { json } = requestOptions
+      Object.keys(json).length.should.equal(7)
+      expect(json).to.deep.equal(
+        Object.assign(
+          { email: this.newEmail, rejectIfBlocklisted: undefined },
+          affiliationOptions
+        )
+      )
+      this.markAsReadIpMatcher.calledOnce.should.equal(true)
     })
 
-    it('handles 422 error', function (done) {
+    it('handles 422 error', async function () {
       const messageFromApi = 'affiliation error message'
       const body = JSON.stringify({ errors: messageFromApi })
       this.fetchNothing.throws({ response: { status: 422 }, body })
-      this.InstitutionsAPI.addAffiliation(
-        this.stubbedUser._id,
-        this.newEmail,
-        {},
-        err => {
-          expect(err).to.exist
-          expect(err).to.be.instanceOf(Errors.InvalidInstitutionalEmailError)
-          err.message.should.have.string(422)
-          err.message.should.have.string(messageFromApi)
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.addAffiliation(
+          this.stubbedUser._id,
+          this.newEmail,
+          {}
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.InvalidInstitutionalEmailError)
+      expect(error).to.have.property('message', `422: ${messageFromApi}`)
     })
 
-    it('handles 500 error', function (done) {
+    it('handles 500 error', async function () {
       const body = { errors: 'affiliation error message' }
       this.fetchNothing.throws({ response: { status: 500 }, body })
-      this.InstitutionsAPI.addAffiliation(
-        this.stubbedUser._id,
-        this.newEmail,
-        {},
-        err => {
-          expect(err).to.be.instanceOf(Errors.V1ConnectionError)
-          expect(err.message).to.equal('error getting affiliations from v1')
-          expect(err.info).to.deep.equal({ status: 500, body })
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.addAffiliation(
+          this.stubbedUser._id,
+          this.newEmail,
+          {}
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.V1ConnectionError)
+      expect(error.message).to.equal('error getting affiliations from v1')
+      expect(error.info).to.eql({
+        status: 500,
+        body: { errors: 'affiliation error message' },
+      })
     })
 
-    it('uses default error message when no error body in response', function (done) {
+    it('uses default error message when no error body in response', async function () {
       this.fetchNothing.throws({ response: { status: 429 } })
-      this.InstitutionsAPI.addAffiliation(
-        this.stubbedUser._id,
-        this.newEmail,
-        {},
-        err => {
-          expect(err).to.exist
-          expect(err.message).to.equal("Couldn't create affiliation: 429")
-          done()
-        }
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.addAffiliation(
+          this.stubbedUser._id,
+          this.newEmail,
+          {}
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Error)
+      expect(error).to.have.property(
+        'message',
+        "Couldn't create affiliation: 429"
       )
     })
 
-    it('does not try to mark IP matcher notifications as read if no university passed', function (done) {
+    it('does not try to mark IP matcher notifications as read if no university passed', async function () {
       const affiliationOptions = {
         confirmedAt: new Date(),
       }
 
-      this.InstitutionsAPI.addAffiliation(
+      await this.InstitutionsAPI.promises.addAffiliation(
         this.stubbedUser._id,
         this.newEmail,
-        affiliationOptions,
-        err => {
-          expect(err).not.to.exist
-          expect(this.markAsReadIpMatcher.callCount).to.equal(0)
-          done()
-        }
+        affiliationOptions
       )
+
+      expect(this.markAsReadIpMatcher.callCount).to.equal(0)
     })
   })
 
@@ -303,58 +298,64 @@ describe('InstitutionsAPI', function () {
       this.fetchNothing.throws({ response: { status: 404 } })
     })
 
-    it('remove affiliation', function (done) {
-      this.InstitutionsAPI.removeAffiliation(
+    it('remove affiliation', async function () {
+      await this.InstitutionsAPI.promises.removeAffiliation(
         this.stubbedUser._id,
-        this.newEmail,
-        err => {
-          expect(err).not.to.exist
-          this.fetchNothing.calledOnce.should.equal(true)
-          const requestOptions = this.fetchNothing.lastCall.args[1]
-          const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations/remove`
-          this.fetchNothing.lastCall.args[0].should.equal(expectedUrl)
-          requestOptions.method.should.equal('POST')
-          expect(requestOptions.json).to.deep.equal({ email: this.newEmail })
-          done()
-        }
+        this.newEmail
       )
+      this.fetchNothing.calledOnce.should.equal(true)
+      const requestOptions = this.fetchNothing.lastCall.args[1]
+      const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations/remove`
+      this.fetchNothing.lastCall.args[0].should.equal(expectedUrl)
+      requestOptions.method.should.equal('POST')
+      expect(requestOptions.json).to.deep.equal({ email: this.newEmail })
     })
 
-    it('handle error', function (done) {
+    it('handle error', async function () {
       this.fetchNothing.throws({ response: { status: 500 } })
-      this.InstitutionsAPI.removeAffiliation(
-        this.stubbedUser._id,
-        this.newEmail,
-        err => {
-          expect(err).to.exist
-          err.message.should.exist
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.removeAffiliation(
+          this.stubbedUser._id,
+          this.newEmail
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
+      expect(error).to.have.property('message')
     })
   })
 
   describe('deleteAffiliations', function () {
-    it('delete affiliations', function (done) {
+    it('delete affiliations', async function () {
       this.request.callsArgWith(1, null, { statusCode: 200 })
-      this.InstitutionsAPI.deleteAffiliations(this.stubbedUser._id, err => {
-        expect(err).not.to.exist
-        this.request.calledOnce.should.equal(true)
-        const requestOptions = this.request.lastCall.args[0]
-        const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
-        requestOptions.url.should.equal(expectedUrl)
-        requestOptions.method.should.equal('DELETE')
-        done()
-      })
+      await this.InstitutionsAPI.promises.deleteAffiliations(
+        this.stubbedUser._id
+      )
+      this.request.calledOnce.should.equal(true)
+      const requestOptions = this.request.lastCall.args[0]
+      const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations`
+      requestOptions.url.should.equal(expectedUrl)
+      requestOptions.method.should.equal('DELETE')
     })
 
-    it('handle error', function (done) {
+    it('handle error', async function () {
       const body = { errors: 'affiliation error message' }
       this.request.callsArgWith(1, null, { statusCode: 518 }, body)
-      this.InstitutionsAPI.deleteAffiliations(this.stubbedUser._id, err => {
-        expect(err).to.be.instanceof(Errors.V1ConnectionError)
-        done()
-      })
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.deleteAffiliations(
+          this.stubbedUser._id
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.V1ConnectionError)
     })
   })
 
@@ -363,61 +364,57 @@ describe('InstitutionsAPI', function () {
       this.request.callsArgWith(1, null, { statusCode: 204 })
     })
 
-    it('endorse affiliation', function (done) {
-      this.InstitutionsAPI.endorseAffiliation(
+    it('endorse affiliation', async function () {
+      await this.InstitutionsAPI.promises.endorseAffiliation(
         this.stubbedUser._id,
         this.newEmail,
         'Student',
-        'Physics',
-        err => {
-          expect(err).not.to.exist
-          this.request.calledOnce.should.equal(true)
-          const requestOptions = this.request.lastCall.args[0]
-          const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations/endorse`
-          requestOptions.url.should.equal(expectedUrl)
-          requestOptions.method.should.equal('POST')
-
-          const { body } = requestOptions
-          Object.keys(body).length.should.equal(3)
-          body.email.should.equal(this.newEmail)
-          body.role.should.equal('Student')
-          body.department.should.equal('Physics')
-          done()
-        }
+        'Physics'
       )
+      this.request.calledOnce.should.equal(true)
+      const requestOptions = this.request.lastCall.args[0]
+      const expectedUrl = `v1.url/api/v2/users/${this.stubbedUser._id}/affiliations/endorse`
+      requestOptions.url.should.equal(expectedUrl)
+      requestOptions.method.should.equal('POST')
+
+      const { body } = requestOptions
+      Object.keys(body).length.should.equal(3)
+      body.email.should.equal(this.newEmail)
+      body.role.should.equal('Student')
+      body.department.should.equal('Physics')
     })
   })
 
   describe('sendUsersWithReconfirmationsLapsedProcessed', function () {
     const users = ['abc123', 'def456']
 
-    it('sends the list of users', function (done) {
+    it('sends the list of users', async function () {
       this.request.callsArgWith(1, null, { statusCode: 200 })
-      this.InstitutionsAPI.sendUsersWithReconfirmationsLapsedProcessed(
-        users,
-        error => {
-          expect(error).not.to.exist
-          this.request.calledOnce.should.equal(true)
-          const requestOptions = this.request.lastCall.args[0]
-          const expectedUrl =
-            'v1.url/api/v2/institutions/reconfirmation_lapsed_processed'
-          requestOptions.url.should.equal(expectedUrl)
-          requestOptions.method.should.equal('POST')
-          expect(requestOptions.body).to.deep.equal({ users })
-          done()
-        }
+      await this.InstitutionsAPI.promises.sendUsersWithReconfirmationsLapsedProcessed(
+        users
       )
+      this.request.calledOnce.should.equal(true)
+      const requestOptions = this.request.lastCall.args[0]
+      const expectedUrl =
+        'v1.url/api/v2/institutions/reconfirmation_lapsed_processed'
+      requestOptions.url.should.equal(expectedUrl)
+      requestOptions.method.should.equal('POST')
+      expect(requestOptions.body).to.deep.equal({ users })
     })
 
-    it('handle error', function (done) {
+    it('handle error', async function () {
       this.request.callsArgWith(1, null, { statusCode: 500 })
-      this.InstitutionsAPI.sendUsersWithReconfirmationsLapsedProcessed(
-        users,
-        error => {
-          expect(error).to.exist
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsAPI.promises.sendUsersWithReconfirmationsLapsedProcessed(
+          users
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
     })
   })
 })
diff --git a/services/web/test/unit/src/Institutions/InstitutionsFeaturesTests.js b/services/web/test/unit/src/Institutions/InstitutionsFeaturesTests.js
index 69def3076f..6f4a1e9715 100644
--- a/services/web/test/unit/src/Institutions/InstitutionsFeaturesTests.js
+++ b/services/web/test/unit/src/Institutions/InstitutionsFeaturesTests.js
@@ -1,17 +1,4 @@
-/* eslint-disable
-    max-len,
-    no-return-assign,
-    no-unused-vars,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const SandboxedModule = require('sandboxed-module')
-const assert = require('assert')
 const { expect } = require('chai')
 const sinon = require('sinon')
 const modulePath = require('path').join(
@@ -41,45 +28,39 @@ describe('InstitutionsFeatures', function () {
   })
 
   describe('hasLicence', function () {
-    it('should handle error', function (done) {
+    it('should handle error', async function () {
       this.UserGetter.promises.getUserFullEmails.rejects(new Error('Nope'))
-      return this.InstitutionsFeatures.hasLicence(
-        this.userId,
-        (error, hasLicence) => {
-          expect(error).to.exist
-          return done()
-        }
-      )
+      let error
+
+      try {
+        await this.InstitutionsFeatures.promises.hasLicence(this.userId)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
     })
 
-    it('should return false if user has no paid affiliations', function (done) {
+    it('should return false if user has no paid affiliations', async function () {
       this.UserGetter.promises.getUserFullEmails.resolves(
         this.emailDataWithoutLicense
       )
-      return this.InstitutionsFeatures.hasLicence(
-        this.userId,
-        (error, hasLicence) => {
-          expect(error).to.not.exist
-          expect(hasLicence).to.be.false
-          return done()
-        }
+      const hasLicence = await this.InstitutionsFeatures.promises.hasLicence(
+        this.userId
       )
+      expect(hasLicence).to.be.false
     })
 
-    it('should return true if user has confirmed paid affiliation', function (done) {
+    it('should return true if user has confirmed paid affiliation', async function () {
       const emailData = [
         { emailHasInstitutionLicence: true },
         { emailHasInstitutionLicence: false },
       ]
       this.UserGetter.promises.getUserFullEmails.resolves(emailData)
-      return this.InstitutionsFeatures.hasLicence(
-        this.userId,
-        (error, hasLicence) => {
-          expect(error).to.not.exist
-          expect(hasLicence).to.be.true
-          return done()
-        }
+      const hasLicence = await this.InstitutionsFeatures.promises.hasLicence(
+        this.userId
       )
+      expect(hasLicence).to.be.true
     })
   })
 
@@ -91,84 +72,62 @@ describe('InstitutionsFeatures', function () {
         .returns(this.testFeatures)
     })
 
-    it('should handle error', function (done) {
+    it('should handle error', async function () {
       this.UserGetter.promises.getUserFullEmails.rejects(new Error('Nope'))
-      return this.InstitutionsFeatures.getInstitutionsFeatures(
-        this.userId,
-        (error, features) => {
-          expect(error).to.exist
-          return done()
-        }
-      )
+      await expect(
+        this.InstitutionsFeatures.promises.getInstitutionsFeatures(this.userId)
+      ).to.be.rejected
     })
 
-    it('should return no feaures if user has no plan code', function (done) {
+    it('should return no feaures if user has no plan code', async function () {
       this.UserGetter.promises.getUserFullEmails.resolves(
         this.emailDataWithoutLicense
       )
-      return this.InstitutionsFeatures.getInstitutionsFeatures(
-        this.userId,
-        (error, features) => {
-          expect(error).to.not.exist
-          expect(features).to.deep.equal({})
-          return done()
-        }
-      )
+      const features =
+        await this.InstitutionsFeatures.promises.getInstitutionsFeatures(
+          this.userId
+        )
+      expect(features).to.deep.equal({})
     })
 
-    it('should return feaures if user has affiliations plan code', function (done) {
+    it('should return feaures if user has affiliations plan code', async function () {
       this.UserGetter.promises.getUserFullEmails.resolves(
         this.emailDataWithLicense
       )
-      return this.InstitutionsFeatures.getInstitutionsFeatures(
-        this.userId,
-        (error, features) => {
-          expect(error).to.not.exist
-          expect(features).to.deep.equal(this.testFeatures.features)
-          return done()
-        }
-      )
+      const features =
+        await this.InstitutionsFeatures.promises.getInstitutionsFeatures(
+          this.userId
+        )
+      expect(features).to.deep.equal(this.testFeatures.features)
     })
   })
 
   describe('getInstitutionsPlan', function () {
-    it('should handle error', function (done) {
+    it('should handle error', async function () {
       this.UserGetter.promises.getUserFullEmails.rejects(new Error('Nope'))
-      return this.InstitutionsFeatures.getInstitutionsPlan(
-        this.userId,
-        error => {
-          expect(error).to.exist
-          return done()
-        }
-      )
+      await expect(
+        this.InstitutionsFeatures.promises.getInstitutionsPlan(this.userId)
+      ).to.be.rejected
     })
 
-    it('should return no plan if user has no licence', function (done) {
+    it('should return no plan if user has no licence', async function () {
       this.UserGetter.promises.getUserFullEmails.resolves(
         this.emailDataWithoutLicense
       )
-      return this.InstitutionsFeatures.getInstitutionsPlan(
-        this.userId,
-        (error, plan) => {
-          expect(error).to.not.exist
-          expect(plan).to.equal(null)
-          return done()
-        }
+      const plan = await this.InstitutionsFeatures.promises.getInstitutionsPlan(
+        this.userId
       )
+      expect(plan).to.equal(null)
     })
 
-    it('should return plan if user has licence', function (done) {
+    it('should return plan if user has licence', async function () {
       this.UserGetter.promises.getUserFullEmails.resolves(
         this.emailDataWithLicense
       )
-      return this.InstitutionsFeatures.getInstitutionsPlan(
-        this.userId,
-        (error, plan) => {
-          expect(error).to.not.exist
-          expect(plan).to.equal(this.institutionPlanCode)
-          return done()
-        }
+      const plan = await this.InstitutionsFeatures.promises.getInstitutionsPlan(
+        this.userId
       )
+      expect(plan).to.equal(this.institutionPlanCode)
     })
   })
 })
diff --git a/services/web/test/unit/src/LinkedFiles/LinkedFilesController.test.mjs b/services/web/test/unit/src/LinkedFiles/LinkedFilesController.test.mjs
new file mode 100644
index 0000000000..d75a853c84
--- /dev/null
+++ b/services/web/test/unit/src/LinkedFiles/LinkedFilesController.test.mjs
@@ -0,0 +1,204 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+const modulePath =
+  '../../../../app/src/Features/LinkedFiles/LinkedFilesController.mjs'
+
+describe('LinkedFilesController', function () {
+  beforeEach(function (ctx) {
+    ctx.fakeTime = new Date()
+    ctx.clock = sinon.useFakeTimers(ctx.fakeTime.getTime())
+  })
+
+  afterEach(function (ctx) {
+    ctx.clock.restore()
+  })
+
+  beforeEach(async function (ctx) {
+    ctx.userId = 'user-id'
+    ctx.Agent = {
+      promises: {
+        createLinkedFile: sinon.stub().resolves(),
+        refreshLinkedFile: sinon.stub().resolves(),
+      },
+    }
+    ctx.projectId = 'projectId'
+    ctx.provider = 'provider'
+    ctx.fileName = 'linked-file-name'
+    ctx.data = { customAgentData: 'foo' }
+    ctx.LinkedFilesHandler = {
+      promises: {
+        getFileById: sinon.stub(),
+      },
+    }
+    ctx.AnalyticsManager = {}
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns(ctx.userId),
+    }
+    ctx.EditorRealTimeController = {}
+    ctx.ReferencesHandler = {}
+    ctx.UrlAgent = {}
+    ctx.ProjectFileAgent = {}
+    ctx.ProjectOutputFileAgent = {}
+    ctx.EditorController = {}
+    ctx.ProjectLocator = {}
+    ctx.logger = {
+      error: sinon.stub(),
+    }
+    ctx.settings = { enabledLinkedFileTypes: [] }
+
+    vi.doMock(
+      '.../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager',
+      () => ({
+        default: ctx.AnalyticsManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/LinkedFiles/LinkedFilesHandler',
+      () => ({
+        default: ctx.LinkedFilesHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController',
+      () => ({
+        default: ctx.EditorRealTimeController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/References/ReferencesHandler',
+      () => ({
+        default: ctx.ReferencesHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/LinkedFiles/UrlAgent', () => ({
+      default: ctx.UrlAgent,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/LinkedFiles/ProjectFileAgent',
+      () => ({
+        default: ctx.ProjectFileAgent,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/LinkedFiles/ProjectOutputFileAgent',
+      () => ({
+        default: ctx.ProjectOutputFileAgent,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Editor/EditorController', () => ({
+      default: ctx.EditorController,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator', () => ({
+      default: ctx.ProjectLocator,
+    }))
+
+    vi.doMock('@overleaf/logger', () => ({
+      default: ctx.logger,
+    }))
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    ctx.LinkedFilesController = (await import(modulePath)).default
+    ctx.LinkedFilesController._getAgent = sinon.stub().resolves(ctx.Agent)
+  })
+
+  describe('createLinkedFile', function () {
+    beforeEach(function (ctx) {
+      ctx.req = {
+        params: { project_id: ctx.projectId },
+        body: {
+          name: ctx.fileName,
+          provider: ctx.provider,
+          data: ctx.data,
+        },
+      }
+      ctx.next = sinon.stub()
+    })
+
+    it('sets importedAt timestamp on linkedFileData', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.next = sinon.stub().callsFake(() => resolve('unexpected error'))
+        ctx.res = {
+          json: () => {
+            expect(ctx.Agent.promises.createLinkedFile).to.have.been.calledWith(
+              ctx.projectId,
+              { ...ctx.data, importedAt: ctx.fakeTime.toISOString() },
+              ctx.fileName,
+              undefined,
+              ctx.userId
+            )
+            resolve()
+          },
+        }
+        ctx.LinkedFilesController.createLinkedFile(ctx.req, ctx.res, ctx.next)
+      })
+    })
+  })
+  describe('refreshLinkedFiles', function () {
+    beforeEach(function (ctx) {
+      ctx.data.provider = ctx.provider
+      ctx.file = {
+        name: ctx.fileName,
+        linkedFileData: {
+          ...ctx.data,
+          importedAt: new Date(2020, 1, 1).toISOString(),
+        },
+      }
+      ctx.LinkedFilesHandler.promises.getFileById
+        .withArgs(ctx.projectId, 'file-id')
+        .resolves({
+          file: ctx.file,
+          path: 'fake-path',
+          parentFolder: {
+            _id: 'parent-folder-id',
+          },
+        })
+      ctx.req = {
+        params: { project_id: ctx.projectId, file_id: 'file-id' },
+        body: {},
+      }
+      ctx.next = sinon.stub()
+    })
+
+    it('resets importedAt timestamp on linkedFileData', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.next = sinon.stub().callsFake(() => resolve('unexpected error'))
+        ctx.res = {
+          json: () => {
+            expect(
+              ctx.Agent.promises.refreshLinkedFile
+            ).to.have.been.calledWith(
+              ctx.projectId,
+              {
+                ...ctx.data,
+                importedAt: ctx.fakeTime.toISOString(),
+              },
+              ctx.name,
+              'parent-folder-id',
+              ctx.userId
+            )
+            resolve()
+          },
+        }
+        ctx.LinkedFilesController.refreshLinkedFile(ctx.req, ctx.res, ctx.next)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/LinkedFiles/LinkedFilesControllerTests.mjs b/services/web/test/unit/src/LinkedFiles/LinkedFilesControllerTests.mjs
deleted file mode 100644
index f1b7b58c10..0000000000
--- a/services/web/test/unit/src/LinkedFiles/LinkedFilesControllerTests.mjs
+++ /dev/null
@@ -1,155 +0,0 @@
-import { expect } from 'chai'
-import esmock from 'esmock'
-import sinon from 'sinon'
-const modulePath =
-  '../../../../app/src/Features/LinkedFiles/LinkedFilesController.mjs'
-
-describe('LinkedFilesController', function () {
-  beforeEach(function () {
-    this.fakeTime = new Date()
-    this.clock = sinon.useFakeTimers(this.fakeTime.getTime())
-  })
-
-  afterEach(function () {
-    this.clock.restore()
-  })
-
-  beforeEach(async function () {
-    this.userId = 'user-id'
-    this.Agent = {
-      promises: {
-        createLinkedFile: sinon.stub().resolves(),
-        refreshLinkedFile: sinon.stub().resolves(),
-      },
-    }
-    this.projectId = 'projectId'
-    this.provider = 'provider'
-    this.name = 'linked-file-name'
-    this.data = { customAgentData: 'foo' }
-    this.LinkedFilesHandler = {
-      promises: {
-        getFileById: sinon.stub(),
-      },
-    }
-    this.AnalyticsManager = {}
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns(this.userId),
-    }
-    this.EditorRealTimeController = {}
-    this.ReferencesHandler = {}
-    this.UrlAgent = {}
-    this.ProjectFileAgent = {}
-    this.ProjectOutputFileAgent = {}
-    this.EditorController = {}
-    this.ProjectLocator = {}
-    this.logger = {
-      error: sinon.stub(),
-    }
-    this.settings = { enabledLinkedFileTypes: [] }
-    this.LinkedFilesController = await esmock.strict(modulePath, {
-      '.../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/Analytics/AnalyticsManager':
-        this.AnalyticsManager,
-      '../../../../app/src/Features/LinkedFiles/LinkedFilesHandler':
-        this.LinkedFilesHandler,
-      '../../../../app/src/Features/Editor/EditorRealTimeController':
-        this.EditorRealTimeController,
-      '../../../../app/src/Features/References/ReferencesHandler':
-        this.ReferencesHandler,
-      '../../../../app/src/Features/LinkedFiles/UrlAgent': this.UrlAgent,
-      '../../../../app/src/Features/LinkedFiles/ProjectFileAgent':
-        this.ProjectFileAgent,
-      '../../../../app/src/Features/LinkedFiles/ProjectOutputFileAgent':
-        this.ProjectOutputFileAgent,
-      '../../../../app/src/Features/Editor/EditorController':
-        this.EditorController,
-      '../../../../app/src/Features/Project/ProjectLocator':
-        this.ProjectLocator,
-      '@overleaf/logger': this.logger,
-      '@overleaf/settings': this.settings,
-    })
-    this.LinkedFilesController._getAgent = sinon.stub().resolves(this.Agent)
-  })
-
-  describe('createLinkedFile', function () {
-    beforeEach(function () {
-      this.req = {
-        params: { project_id: this.projectId },
-        body: {
-          name: this.name,
-          provider: this.provider,
-          data: this.data,
-        },
-      }
-      this.next = sinon.stub()
-    })
-
-    it('sets importedAt timestamp on linkedFileData', function (done) {
-      this.next = sinon.stub().callsFake(() => done('unexpected error'))
-      this.res = {
-        json: () => {
-          expect(this.Agent.promises.createLinkedFile).to.have.been.calledWith(
-            this.projectId,
-            { ...this.data, importedAt: this.fakeTime.toISOString() },
-            this.name,
-            undefined,
-            this.userId
-          )
-          done()
-        },
-      }
-      this.LinkedFilesController.createLinkedFile(this.req, this.res, this.next)
-    })
-  })
-  describe('refreshLinkedFiles', function () {
-    beforeEach(function () {
-      this.data.provider = this.provider
-      this.file = {
-        name: this.name,
-        linkedFileData: {
-          ...this.data,
-          importedAt: new Date(2020, 1, 1).toISOString(),
-        },
-      }
-      this.LinkedFilesHandler.promises.getFileById
-        .withArgs(this.projectId, 'file-id')
-        .resolves({
-          file: this.file,
-          path: 'fake-path',
-          parentFolder: {
-            _id: 'parent-folder-id',
-          },
-        })
-      this.req = {
-        params: { project_id: this.projectId, file_id: 'file-id' },
-        body: {},
-      }
-      this.next = sinon.stub()
-    })
-
-    it('resets importedAt timestamp on linkedFileData', function (done) {
-      this.next = sinon.stub().callsFake(() => done('unexpected error'))
-      this.res = {
-        json: () => {
-          expect(this.Agent.promises.refreshLinkedFile).to.have.been.calledWith(
-            this.projectId,
-            {
-              ...this.data,
-              importedAt: this.fakeTime.toISOString(),
-            },
-            this.name,
-            'parent-folder-id',
-            this.userId
-          )
-          done()
-        },
-      }
-      this.LinkedFilesController.refreshLinkedFile(
-        this.req,
-        this.res,
-        this.next
-      )
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Metadata/MetaControllerTests.mjs b/services/web/test/unit/src/Metadata/MetaController.test.mjs
similarity index 58%
rename from services/web/test/unit/src/Metadata/MetaControllerTests.mjs
rename to services/web/test/unit/src/Metadata/MetaController.test.mjs
index 5695d289f7..ee3488137a 100644
--- a/services/web/test/unit/src/Metadata/MetaControllerTests.mjs
+++ b/services/web/test/unit/src/Metadata/MetaController.test.mjs
@@ -1,31 +1,37 @@
-import { expect } from 'chai'
+import { expect, vi } from 'vitest'
 import sinon from 'sinon'
-import esmock from 'esmock'
 import MockResponse from '../helpers/MockResponse.js'
 const modulePath = '../../../../app/src/Features/Metadata/MetaController.mjs'
 
 describe('MetaController', function () {
-  beforeEach(async function () {
-    this.EditorRealTimeController = {
+  beforeEach(async function (ctx) {
+    ctx.EditorRealTimeController = {
       emitToRoom: sinon.stub(),
     }
 
-    this.MetaHandler = {
+    ctx.MetaHandler = {
       promises: {
         getAllMetaForProject: sinon.stub(),
         getMetaForDoc: sinon.stub(),
       },
     }
 
-    this.MetadataController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Editor/EditorRealTimeController':
-        this.EditorRealTimeController,
-      '../../../../app/src/Features/Metadata/MetaHandler': this.MetaHandler,
-    })
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController',
+      () => ({
+        default: ctx.EditorRealTimeController,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Metadata/MetaHandler', () => ({
+      default: ctx.MetaHandler,
+    }))
+
+    ctx.MetadataController = (await import(modulePath)).default
   })
 
   describe('getMetadata', function () {
-    it('should respond with json', async function () {
+    it('should respond with json', async function (ctx) {
       const projectMeta = {
         'doc-id': {
           labels: ['foo'],
@@ -34,7 +40,7 @@ describe('MetaController', function () {
         },
       }
 
-      this.MetaHandler.promises.getAllMetaForProject = sinon
+      ctx.MetaHandler.promises.getAllMetaForProject = sinon
         .stub()
         .resolves(projectMeta)
 
@@ -42,9 +48,9 @@ describe('MetaController', function () {
       const res = new MockResponse()
       const next = sinon.stub()
 
-      await this.MetadataController.getMetadata(req, res, next)
+      await ctx.MetadataController.getMetadata(req, res, next)
 
-      this.MetaHandler.promises.getAllMetaForProject.should.have.been.calledWith(
+      ctx.MetaHandler.promises.getAllMetaForProject.should.have.been.calledWith(
         'project-id'
       )
       res.json.should.have.been.calledOnceWith({
@@ -54,8 +60,8 @@ describe('MetaController', function () {
       next.should.not.have.been.called
     })
 
-    it('should handle an error', async function () {
-      this.MetaHandler.promises.getAllMetaForProject = sinon
+    it('should handle an error', async function (ctx) {
+      ctx.MetaHandler.promises.getAllMetaForProject = sinon
         .stub()
         .throws(new Error('woops'))
 
@@ -63,9 +69,9 @@ describe('MetaController', function () {
       const res = new MockResponse()
       const next = sinon.stub()
 
-      await this.MetadataController.getMetadata(req, res, next)
+      await ctx.MetadataController.getMetadata(req, res, next)
 
-      this.MetaHandler.promises.getAllMetaForProject.should.have.been.calledWith(
+      ctx.MetaHandler.promises.getAllMetaForProject.should.have.been.calledWith(
         'project-id'
       )
       res.json.should.not.have.been.called
@@ -74,14 +80,14 @@ describe('MetaController', function () {
   })
 
   describe('broadcastMetadataForDoc', function () {
-    it('should broadcast on broadcast:true ', async function () {
-      this.MetaHandler.promises.getMetaForDoc = sinon.stub().resolves({
+    it('should broadcast on broadcast:true ', async function (ctx) {
+      ctx.MetaHandler.promises.getMetaForDoc = sinon.stub().resolves({
         labels: ['foo'],
         packages: { a: { commands: [] } },
         packageNames: ['a'],
       })
 
-      this.EditorRealTimeController.emitToRoom = sinon.stub()
+      ctx.EditorRealTimeController.emitToRoom = sinon.stub()
 
       const req = {
         params: { project_id: 'project-id', doc_id: 'doc-id' },
@@ -90,32 +96,32 @@ describe('MetaController', function () {
       const res = new MockResponse()
       const next = sinon.stub()
 
-      await this.MetadataController.broadcastMetadataForDoc(req, res, next)
+      await ctx.MetadataController.broadcastMetadataForDoc(req, res, next)
 
-      this.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
+      ctx.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
         'project-id'
       )
       res.json.should.not.have.been.called
       res.sendStatus.should.have.been.calledOnceWith(200)
       next.should.not.have.been.called
 
-      this.EditorRealTimeController.emitToRoom.should.have.been.calledOnce
-      const { lastCall } = this.EditorRealTimeController.emitToRoom
+      ctx.EditorRealTimeController.emitToRoom.should.have.been.calledOnce
+      const { lastCall } = ctx.EditorRealTimeController.emitToRoom
       expect(lastCall.args[0]).to.equal('project-id')
       expect(lastCall.args[1]).to.equal('broadcastDocMeta')
       expect(lastCall.args[2]).to.have.all.keys(['docId', 'meta'])
     })
 
-    it('should return json on broadcast:false ', async function () {
+    it('should return json on broadcast:false ', async function (ctx) {
       const docMeta = {
         labels: ['foo'],
         packages: { a: [] },
         packageNames: ['a'],
       }
 
-      this.MetaHandler.promises.getMetaForDoc = sinon.stub().resolves(docMeta)
+      ctx.MetaHandler.promises.getMetaForDoc = sinon.stub().resolves(docMeta)
 
-      this.EditorRealTimeController.emitToRoom = sinon.stub()
+      ctx.EditorRealTimeController.emitToRoom = sinon.stub()
 
       const req = {
         params: { project_id: 'project-id', doc_id: 'doc-id' },
@@ -124,12 +130,12 @@ describe('MetaController', function () {
       const res = new MockResponse()
       const next = sinon.stub()
 
-      await this.MetadataController.broadcastMetadataForDoc(req, res, next)
+      await ctx.MetadataController.broadcastMetadataForDoc(req, res, next)
 
-      this.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
+      ctx.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
         'project-id'
       )
-      this.EditorRealTimeController.emitToRoom.should.not.have.been.called
+      ctx.EditorRealTimeController.emitToRoom.should.not.have.been.called
       res.json.should.have.been.calledOnceWith({
         docId: 'doc-id',
         meta: docMeta,
@@ -137,12 +143,12 @@ describe('MetaController', function () {
       next.should.not.have.been.called
     })
 
-    it('should handle an error', async function () {
-      this.MetaHandler.promises.getMetaForDoc = sinon
+    it('should handle an error', async function (ctx) {
+      ctx.MetaHandler.promises.getMetaForDoc = sinon
         .stub()
         .throws(new Error('woops'))
 
-      this.EditorRealTimeController.emitToRoom = sinon.stub()
+      ctx.EditorRealTimeController.emitToRoom = sinon.stub()
 
       const req = {
         params: { project_id: 'project-id', doc_id: 'doc-id' },
@@ -151,9 +157,9 @@ describe('MetaController', function () {
       const res = new MockResponse()
       const next = sinon.stub()
 
-      await this.MetadataController.broadcastMetadataForDoc(req, res, next)
+      await ctx.MetadataController.broadcastMetadataForDoc(req, res, next)
 
-      this.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
+      ctx.MetaHandler.promises.getMetaForDoc.should.have.been.calledWith(
         'project-id'
       )
       res.json.should.not.have.been.called
diff --git a/services/web/test/unit/src/Metadata/MetaHandlerTests.mjs b/services/web/test/unit/src/Metadata/MetaHandler.test.mjs
similarity index 71%
rename from services/web/test/unit/src/Metadata/MetaHandlerTests.mjs
rename to services/web/test/unit/src/Metadata/MetaHandler.test.mjs
index 289fd0b164..48d5cc51a4 100644
--- a/services/web/test/unit/src/Metadata/MetaHandlerTests.mjs
+++ b/services/web/test/unit/src/Metadata/MetaHandler.test.mjs
@@ -1,15 +1,14 @@
-import { expect } from 'chai'
+import { expect, vi } from 'vitest'
 import sinon from 'sinon'
-import esmock from 'esmock'
 
 const modulePath = '../../../../app/src/Features/Metadata/MetaHandler.mjs'
 
 describe('MetaHandler', function () {
-  beforeEach(async function () {
-    this.projectId = 'someprojectid'
-    this.docId = 'somedocid'
+  beforeEach(async function (ctx) {
+    ctx.projectId = 'someprojectid'
+    ctx.docId = 'somedocid'
 
-    this.lines = [
+    ctx.lines = [
       '\\usepackage{ foo, bar }',
       '\\usepackage{baz}',
       'one',
@@ -23,28 +22,28 @@ describe('MetaHandler', function () {
       '\\begin{lstlisting}[label={lst:foo},caption={Test}]', // lst:foo should be in the returned labels
     ]
 
-    this.docs = {
-      [this.docId]: {
-        _id: this.docId,
-        lines: this.lines,
+    ctx.docs = {
+      [ctx.docId]: {
+        _id: ctx.docId,
+        lines: ctx.lines,
       },
     }
 
-    this.ProjectEntityHandler = {
+    ctx.ProjectEntityHandler = {
       promises: {
-        getAllDocs: sinon.stub().resolves(this.docs),
-        getDoc: sinon.stub().resolves(this.docs[this.docId]),
+        getAllDocs: sinon.stub().resolves(ctx.docs),
+        getDoc: sinon.stub().resolves(ctx.docs[ctx.docId]),
       },
     }
 
-    this.DocumentUpdaterHandler = {
+    ctx.DocumentUpdaterHandler = {
       promises: {
         flushDocToMongo: sinon.stub().resolves(),
         flushProjectToMongo: sinon.stub().resolves(),
       },
     }
 
-    this.packageMapping = {
+    ctx.packageMapping = {
       foo: [
         {
           caption: '\\bar',
@@ -69,47 +68,58 @@ describe('MetaHandler', function () {
       ],
     }
 
-    this.MetaHandler = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Project/ProjectEntityHandler':
-        this.ProjectEntityHandler,
-      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler':
-        this.DocumentUpdaterHandler,
-      '../../../../app/src/Features/Metadata/packageMapping':
-        this.packageMapping,
-    })
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectEntityHandler',
+      () => ({
+        default: ctx.ProjectEntityHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler',
+      () => ({
+        default: ctx.DocumentUpdaterHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Metadata/packageMapping', () => ({
+      default: ctx.packageMapping,
+    }))
+
+    ctx.MetaHandler = (await import(modulePath)).default
   })
 
   describe('getMetaForDoc', function () {
-    it('should extract all the labels and packages', async function () {
-      const result = await this.MetaHandler.promises.getMetaForDoc(
-        this.projectId,
-        this.docId
+    it('should extract all the labels and packages', async function (ctx) {
+      const result = await ctx.MetaHandler.promises.getMetaForDoc(
+        ctx.projectId,
+        ctx.docId
       )
 
       expect(result).to.deep.equal({
         labels: ['aaa', 'ccc', 'ddd', 'e,f,g', 'foo', 'lst:foo'],
         packages: {
-          foo: this.packageMapping.foo,
-          baz: this.packageMapping.baz,
+          foo: ctx.packageMapping.foo,
+          baz: ctx.packageMapping.baz,
         },
         packageNames: ['foo', 'bar', 'baz'],
       })
 
-      this.DocumentUpdaterHandler.promises.flushDocToMongo.should.be.calledWith(
-        this.projectId,
-        this.docId
+      ctx.DocumentUpdaterHandler.promises.flushDocToMongo.should.be.calledWith(
+        ctx.projectId,
+        ctx.docId
       )
 
-      this.ProjectEntityHandler.promises.getDoc.should.be.calledWith(
-        this.projectId,
-        this.docId
+      ctx.ProjectEntityHandler.promises.getDoc.should.be.calledWith(
+        ctx.projectId,
+        ctx.docId
       )
     })
   })
 
   describe('getAllMetaForProject', function () {
-    it('should extract all metadata', async function () {
-      this.ProjectEntityHandler.promises.getAllDocs = sinon.stub().resolves({
+    it('should extract all metadata', async function (ctx) {
+      ctx.ProjectEntityHandler.promises.getAllDocs = sinon.stub().resolves({
         doc_one: {
           _id: 'id_one',
           lines: ['one', '\\label{aaa} two', 'three'],
@@ -142,8 +152,8 @@ describe('MetaHandler', function () {
         },
       })
 
-      const result = await this.MetaHandler.promises.getAllMetaForProject(
-        this.projectId
+      const result = await ctx.MetaHandler.promises.getAllMetaForProject(
+        ctx.projectId
       )
 
       expect(result).to.deep.equal({
@@ -206,12 +216,12 @@ describe('MetaHandler', function () {
         },
       })
 
-      this.DocumentUpdaterHandler.promises.flushProjectToMongo.should.be.calledWith(
-        this.projectId
+      ctx.DocumentUpdaterHandler.promises.flushProjectToMongo.should.be.calledWith(
+        ctx.projectId
       )
 
-      this.ProjectEntityHandler.promises.getAllDocs.should.be.calledWith(
-        this.projectId
+      ctx.ProjectEntityHandler.promises.getAllDocs.should.be.calledWith(
+        ctx.projectId
       )
     })
   })
diff --git a/services/web/test/unit/src/Notifications/NotificationsBuilderTests.js b/services/web/test/unit/src/Notifications/NotificationsBuilderTests.js
index 234cf7547e..b668fffd2a 100644
--- a/services/web/test/unit/src/Notifications/NotificationsBuilderTests.js
+++ b/services/web/test/unit/src/Notifications/NotificationsBuilderTests.js
@@ -22,22 +22,19 @@ describe('NotificationsBuilder', function () {
     })
   })
 
-  describe('dropboxUnlinkedDueToLapsedReconfirmation', function (done) {
-    it('should create the notification', function (done) {
-      this.controller
+  describe('dropboxUnlinkedDueToLapsedReconfirmation', function () {
+    it('should create the notification', async function () {
+      await this.controller.promises
         .dropboxUnlinkedDueToLapsedReconfirmation(userId)
-        .create(error => {
-          expect(error).to.not.exist
-          expect(this.handler.createNotification).to.have.been.calledWith(
-            userId,
-            'drobox-unlinked-due-to-lapsed-reconfirmation',
-            'notification_dropbox_unlinked_due_to_lapsed_reconfirmation',
-            {},
-            null,
-            true
-          )
-          done()
-        })
+        .create()
+      expect(this.handler.createNotification).to.have.been.calledWith(
+        userId,
+        'drobox-unlinked-due-to-lapsed-reconfirmation',
+        'notification_dropbox_unlinked_due_to_lapsed_reconfirmation',
+        {},
+        null,
+        true
+      )
     })
     describe('NotificationsHandler error', function () {
       let anError
@@ -45,19 +42,23 @@ describe('NotificationsBuilder', function () {
         anError = new Error('oops')
         this.handler.createNotification.yields(anError)
       })
-      it('should return errors from NotificationsHandler', function (done) {
-        this.controller
-          .dropboxUnlinkedDueToLapsedReconfirmation(userId)
-          .create(error => {
-            expect(error).to.exist
-            expect(error).to.deep.equal(anError)
-            done()
-          })
+      it('should return errors from NotificationsHandler', async function () {
+        let error
+
+        try {
+          await this.controller.promises
+            .dropboxUnlinkedDueToLapsedReconfirmation(userId)
+            .create()
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.equal(anError)
       })
     })
   })
 
-  describe('groupInvitation', function (done) {
+  describe('groupInvitation', function () {
     const subscriptionId = '123123bcabca'
     beforeEach(function () {
       this.invite = {
@@ -67,29 +68,26 @@ describe('NotificationsBuilder', function () {
       }
     })
 
-    it('should create the notification', function (done) {
-      this.controller
+    it('should create the notification', async function () {
+      await this.controller.promises
         .groupInvitation(
           userId,
           subscriptionId,
           this.invite.managedUsersEnabled
         )
-        .create(this.invite, error => {
-          expect(error).to.not.exist
-          expect(this.handler.createNotification).to.have.been.calledWith(
-            userId,
-            `groupInvitation-${subscriptionId}-${userId}`,
-            'notification_group_invitation',
-            {
-              token: this.invite.token,
-              inviterName: this.invite.inviterName,
-              managedUsersEnabled: this.invite.managedUsersEnabled,
-            },
-            null,
-            true
-          )
-          done()
-        })
+        .create(this.invite)
+      expect(this.handler.createNotification).to.have.been.calledWith(
+        userId,
+        `groupInvitation-${subscriptionId}-${userId}`,
+        'notification_group_invitation',
+        {
+          token: this.invite.token,
+          inviterName: this.invite.inviterName,
+          managedUsersEnabled: this.invite.managedUsersEnabled,
+        },
+        null,
+        true
+      )
     })
   })
 
@@ -107,27 +105,25 @@ describe('NotificationsBuilder', function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
       })
 
-      it('should call v1 and create affiliation notifications', function (done) {
+      it('should call v1 and create affiliation notifications', async function () {
         const ip = '192.168.0.1'
-        this.controller.ipMatcherAffiliation(userId).create(ip, callback => {
-          this.request.calledOnce.should.equal(true)
-          const expectedOpts = {
-            institutionId: this.body.id,
-            university_name: this.body.name,
-            content: this.body.enrolment_ad_html,
-            ssoEnabled: false,
-            portalPath: undefined,
-          }
-          this.handler.createNotification
-            .calledWith(
-              userId,
-              `ip-matched-affiliation-${this.body.id}`,
-              'notification_ip_matched_affiliation',
-              expectedOpts
-            )
-            .should.equal(true)
-          done()
-        })
+        await this.controller.promises.ipMatcherAffiliation(userId).create(ip)
+        this.request.calledOnce.should.equal(true)
+        const expectedOpts = {
+          institutionId: this.body.id,
+          university_name: this.body.name,
+          content: this.body.enrolment_ad_html,
+          ssoEnabled: false,
+          portalPath: undefined,
+        }
+        this.handler.createNotification
+          .calledWith(
+            userId,
+            `ip-matched-affiliation-${this.body.id}`,
+            'notification_ip_matched_affiliation',
+            expectedOpts
+          )
+          .should.equal(true)
       })
     })
     describe('without portal and without SSO', function () {
@@ -143,27 +139,25 @@ describe('NotificationsBuilder', function () {
         this.request.callsArgWith(1, null, { statusCode: 200 }, this.body)
       })
 
-      it('should call v1 and create affiliation notifications', function (done) {
+      it('should call v1 and create affiliation notifications', async function () {
         const ip = '192.168.0.1'
-        this.controller.ipMatcherAffiliation(userId).create(ip, callback => {
-          this.request.calledOnce.should.equal(true)
-          const expectedOpts = {
-            institutionId: this.body.id,
-            university_name: this.body.name,
-            content: this.body.enrolment_ad_html,
-            ssoEnabled: true,
-            portalPath: '/edu/stanford',
-          }
-          this.handler.createNotification
-            .calledWith(
-              userId,
-              `ip-matched-affiliation-${this.body.id}`,
-              'notification_ip_matched_affiliation',
-              expectedOpts
-            )
-            .should.equal(true)
-          done()
-        })
+        await this.controller.promises.ipMatcherAffiliation(userId).create(ip)
+        this.request.calledOnce.should.equal(true)
+        const expectedOpts = {
+          institutionId: this.body.id,
+          university_name: this.body.name,
+          content: this.body.enrolment_ad_html,
+          ssoEnabled: true,
+          portalPath: '/edu/stanford',
+        }
+        this.handler.createNotification
+          .calledWith(
+            userId,
+            `ip-matched-affiliation-${this.body.id}`,
+            'notification_ip_matched_affiliation',
+            expectedOpts
+          )
+          .should.equal(true)
       })
     })
   })
diff --git a/services/web/test/unit/src/Notifications/NotificationsController.test.mjs b/services/web/test/unit/src/Notifications/NotificationsController.test.mjs
new file mode 100644
index 0000000000..43d9c0c07e
--- /dev/null
+++ b/services/web/test/unit/src/Notifications/NotificationsController.test.mjs
@@ -0,0 +1,101 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+
+const modulePath = new URL(
+  '../../../../app/src/Features/Notifications/NotificationsController.mjs',
+  import.meta.url
+).pathname
+
+describe('NotificationsController', function () {
+  const userId = '123nd3ijdks'
+  const notificationId = '123njdskj9jlk'
+
+  beforeEach(async function (ctx) {
+    ctx.handler = {
+      getUserNotifications: sinon.stub().callsArgWith(1),
+      markAsRead: sinon.stub().callsArgWith(2),
+      promises: {
+        getUserNotifications: sinon.stub().callsArgWith(1),
+      },
+    }
+    ctx.req = {
+      params: {
+        notificationId,
+      },
+      session: {
+        user: {
+          _id: userId,
+        },
+      },
+      i18n: {
+        translate() {},
+      },
+    }
+    ctx.AuthenticationController = {
+      getLoggedInUserId: sinon.stub().returns(ctx.req.session.user._id),
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsHandler',
+      () => ({
+        default: ctx.handler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: ctx.AuthenticationController,
+      })
+    )
+
+    ctx.controller = (await import(modulePath)).default
+  })
+
+  it('should ask the handler for all unread notifications', async function (ctx) {
+    await new Promise(resolve => {
+      const allNotifications = [{ _id: notificationId, user_id: userId }]
+      ctx.handler.getUserNotifications = sinon
+        .stub()
+        .callsArgWith(1, null, allNotifications)
+      ctx.controller.getAllUnreadNotifications(ctx.req, {
+        json: body => {
+          body.should.deep.equal(allNotifications)
+          ctx.handler.getUserNotifications.calledWith(userId).should.equal(true)
+          resolve()
+        },
+      })
+    })
+  })
+
+  it('should send a delete request when a delete has been received to mark a notification', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.controller.markNotificationAsRead(ctx.req, {
+        sendStatus: () => {
+          ctx.handler.markAsRead
+            .calledWith(userId, notificationId)
+            .should.equal(true)
+          resolve()
+        },
+      })
+    })
+  })
+
+  it('should get a notification by notification id', async function (ctx) {
+    await new Promise(resolve => {
+      const notification = { _id: notificationId, user_id: userId }
+      ctx.handler.getUserNotifications = sinon
+        .stub()
+        .callsArgWith(1, null, [notification])
+      ctx.controller.getNotification(ctx.req, {
+        json: body => {
+          body.should.deep.equal(notification)
+          resolve()
+        },
+        status: () => ({
+          end: () => {},
+        }),
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Notifications/NotificationsControllerTests.mjs b/services/web/test/unit/src/Notifications/NotificationsControllerTests.mjs
deleted file mode 100644
index 0e22b228c5..0000000000
--- a/services/web/test/unit/src/Notifications/NotificationsControllerTests.mjs
+++ /dev/null
@@ -1,66 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-
-const modulePath = new URL(
-  '../../../../app/src/Features/Notifications/NotificationsController.mjs',
-  import.meta.url
-).pathname
-
-describe('NotificationsController', function () {
-  const userId = '123nd3ijdks'
-  const notificationId = '123njdskj9jlk'
-
-  beforeEach(async function () {
-    this.handler = {
-      getUserNotifications: sinon.stub().callsArgWith(1),
-      markAsRead: sinon.stub().callsArgWith(2),
-    }
-    this.req = {
-      params: {
-        notificationId,
-      },
-      session: {
-        user: {
-          _id: userId,
-        },
-      },
-      i18n: {
-        translate() {},
-      },
-    }
-    this.AuthenticationController = {
-      getLoggedInUserId: sinon.stub().returns(this.req.session.user._id),
-    }
-    this.controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Notifications/NotificationsHandler':
-        this.handler,
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        this.AuthenticationController,
-    })
-  })
-
-  it('should ask the handler for all unread notifications', function (done) {
-    const allNotifications = [{ _id: notificationId, user_id: userId }]
-    this.handler.getUserNotifications = sinon
-      .stub()
-      .callsArgWith(1, null, allNotifications)
-    this.controller.getAllUnreadNotifications(this.req, {
-      json: body => {
-        body.should.deep.equal(allNotifications)
-        this.handler.getUserNotifications.calledWith(userId).should.equal(true)
-        done()
-      },
-    })
-  })
-
-  it('should send a delete request when a delete has been received to mark a notification', function (done) {
-    this.controller.markNotificationAsRead(this.req, {
-      sendStatus: () => {
-        this.handler.markAsRead
-          .calledWith(userId, notificationId)
-          .should.equal(true)
-        done()
-      },
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Notifications/NotificationsHandlerTests.js b/services/web/test/unit/src/Notifications/NotificationsHandlerTests.js
index 5eb431f522..0ed0001d65 100644
--- a/services/web/test/unit/src/Notifications/NotificationsHandlerTests.js
+++ b/services/web/test/unit/src/Notifications/NotificationsHandlerTests.js
@@ -1,16 +1,3 @@
-/* eslint-disable
-    n/handle-callback-err,
-    max-len,
-    no-return-assign,
-    no-unused-vars,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const SandboxedModule = require('sandboxed-module')
 const { assert } = require('chai')
 const sinon = require('sinon')
@@ -18,7 +5,6 @@ const modulePath = require('path').join(
   __dirname,
   '../../../../app/src/Features/Notifications/NotificationsHandler.js'
 )
-const _ = require('lodash')
 
 describe('NotificationsHandler', function () {
   const userId = '123nd3ijdks'
@@ -27,18 +13,18 @@ describe('NotificationsHandler', function () {
 
   beforeEach(function () {
     this.request = sinon.stub().callsArgWith(1)
-    return (this.handler = SandboxedModule.require(modulePath, {
+    this.handler = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/settings': {
           apis: { notifications: { url: notificationUrl } },
         },
         request: this.request,
       },
-    }))
+    })
   })
 
   describe('getUserNotifications', function () {
-    it('should get unread notifications', function (done) {
+    it('should get unread notifications', async function () {
       const stubbedNotifications = [{ _id: notificationId, user_id: userId }]
       this.request.callsArgWith(
         1,
@@ -46,51 +32,42 @@ describe('NotificationsHandler', function () {
         { statusCode: 200 },
         stubbedNotifications
       )
-      return this.handler.getUserNotifications(
-        userId,
-        (err, unreadNotifications) => {
-          stubbedNotifications.should.deep.equal(unreadNotifications)
-          const getOpts = {
-            uri: `${notificationUrl}/user/${userId}`,
-            json: true,
-            timeout: 1000,
-            method: 'GET',
-          }
-          this.request.calledWith(getOpts).should.equal(true)
-          return done()
-        }
-      )
+      const unreadNotifications =
+        await this.handler.promises.getUserNotifications(userId)
+      stubbedNotifications.should.deep.equal(unreadNotifications)
+      const getOpts = {
+        uri: `${notificationUrl}/user/${userId}`,
+        json: true,
+        timeout: 1000,
+        method: 'GET',
+      }
+      this.request.calledWith(getOpts).should.equal(true)
     })
 
-    it('should return empty arrays if there are no notifications', function () {
+    it('should return empty arrays if there are no notifications', async function () {
       this.request.callsArgWith(1, null, { statusCode: 200 }, null)
-      return this.handler.getUserNotifications(
-        userId,
-        (err, unreadNotifications) => {
-          return unreadNotifications.length.should.equal(0)
-        }
-      )
+      const unreadNotifications =
+        await this.handler.promises.getUserNotifications(userId)
+      unreadNotifications.length.should.equal(0)
     })
   })
 
   describe('markAsRead', function () {
     beforeEach(function () {
-      return (this.key = 'some key here')
+      this.key = 'some key here'
     })
 
-    it('should send a delete request when a delete has been received to mark a notification', function (done) {
-      return this.handler.markAsReadWithKey(userId, this.key, () => {
-        const opts = {
-          uri: `${notificationUrl}/user/${userId}`,
-          json: {
-            key: this.key,
-          },
-          timeout: 1000,
-          method: 'DELETE',
-        }
-        this.request.calledWith(opts).should.equal(true)
-        return done()
-      })
+    it('should send a delete request when a delete has been received to mark a notification', async function () {
+      await this.handler.promises.markAsReadWithKey(userId, this.key)
+      const opts = {
+        uri: `${notificationUrl}/user/${userId}`,
+        json: {
+          key: this.key,
+        },
+        timeout: 1000,
+        method: 'DELETE',
+      }
+      this.request.calledWith(opts).should.equal(true)
     })
   })
 
@@ -99,30 +76,27 @@ describe('NotificationsHandler', function () {
       this.key = 'some key here'
       this.messageOpts = { value: 12344 }
       this.templateKey = 'renderThisHtml'
-      return (this.expiry = null)
+      this.expiry = null
     })
 
-    it('should post the message over', function (done) {
-      return this.handler.createNotification(
+    it('should post the message over', async function () {
+      await this.handler.promises.createNotification(
         userId,
         this.key,
         this.templateKey,
         this.messageOpts,
-        this.expiry,
-        () => {
-          const args = this.request.args[0][0]
-          args.uri.should.equal(`${notificationUrl}/user/${userId}`)
-          args.timeout.should.equal(1000)
-          const expectedJson = {
-            key: this.key,
-            templateKey: this.templateKey,
-            messageOpts: this.messageOpts,
-            forceCreate: true,
-          }
-          assert.deepEqual(args.json, expectedJson)
-          return done()
-        }
+        this.expiry
       )
+      const args = this.request.args[0][0]
+      args.uri.should.equal(`${notificationUrl}/user/${userId}`)
+      args.timeout.should.equal(1000)
+      const expectedJson = {
+        key: this.key,
+        templateKey: this.templateKey,
+        messageOpts: this.messageOpts,
+        forceCreate: true,
+      }
+      assert.deepEqual(args.json, expectedJson)
     })
 
     describe('when expiry date is supplied', function () {
@@ -130,50 +104,46 @@ describe('NotificationsHandler', function () {
         this.key = 'some key here'
         this.messageOpts = { value: 12344 }
         this.templateKey = 'renderThisHtml'
-        return (this.expiry = new Date())
+        this.expiry = new Date()
       })
 
-      it('should post the message over with expiry field', function (done) {
-        return this.handler.createNotification(
+      it('should post the message over with expiry field', async function () {
+        await this.handler.promises.createNotification(
           userId,
           this.key,
           this.templateKey,
           this.messageOpts,
-          this.expiry,
-          () => {
-            const args = this.request.args[0][0]
-            args.uri.should.equal(`${notificationUrl}/user/${userId}`)
-            args.timeout.should.equal(1000)
-            const expectedJson = {
-              key: this.key,
-              templateKey: this.templateKey,
-              messageOpts: this.messageOpts,
-              expires: this.expiry,
-              forceCreate: true,
-            }
-            assert.deepEqual(args.json, expectedJson)
-            return done()
-          }
+          this.expiry
         )
+
+        const args = this.request.args[0][0]
+        args.uri.should.equal(`${notificationUrl}/user/${userId}`)
+        args.timeout.should.equal(1000)
+        const expectedJson = {
+          key: this.key,
+          templateKey: this.templateKey,
+          messageOpts: this.messageOpts,
+          expires: this.expiry,
+          forceCreate: true,
+        }
+        assert.deepEqual(args.json, expectedJson)
       })
     })
   })
 
   describe('markAsReadByKeyOnly', function () {
     beforeEach(function () {
-      return (this.key = 'some key here')
+      this.key = 'some key here'
     })
 
-    it('should send a delete request when a delete has been received to mark a notification', function (done) {
-      return this.handler.markAsReadByKeyOnly(this.key, () => {
-        const opts = {
-          uri: `${notificationUrl}/key/${this.key}`,
-          timeout: 1000,
-          method: 'DELETE',
-        }
-        this.request.calledWith(opts).should.equal(true)
-        return done()
-      })
+    it('should send a delete request when a delete has been received to mark a notification', async function () {
+      await this.handler.promises.markAsReadByKeyOnly(this.key)
+      const opts = {
+        uri: `${notificationUrl}/key/${this.key}`,
+        timeout: 1000,
+        method: 'DELETE',
+      }
+      this.request.calledWith(opts).should.equal(true)
     })
   })
 })
diff --git a/services/web/test/unit/src/PasswordReset/PasswordResetController.test.mjs b/services/web/test/unit/src/PasswordReset/PasswordResetController.test.mjs
new file mode 100644
index 0000000000..d225c7ff81
--- /dev/null
+++ b/services/web/test/unit/src/PasswordReset/PasswordResetController.test.mjs
@@ -0,0 +1,556 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+
+const MODULE_PATH = new URL(
+  '../../../../app/src/Features/PasswordReset/PasswordResetController.mjs',
+  import.meta.url
+).pathname
+
+describe('PasswordResetController', function () {
+  beforeEach(async function (ctx) {
+    ctx.email = 'bob@bob.com'
+    ctx.user_id = 'mock-user-id'
+    ctx.token = 'my security token that was emailed to me'
+    ctx.password = 'my new password'
+    ctx.req = {
+      body: {
+        email: ctx.email,
+        passwordResetToken: ctx.token,
+        password: ctx.password,
+      },
+      i18n: {
+        translate() {
+          return '.'
+        },
+      },
+      session: {},
+      query: {},
+    }
+    ctx.res = new MockResponse()
+
+    ctx.settings = {}
+    ctx.PasswordResetHandler = {
+      generateAndEmailResetToken: sinon.stub(),
+      promises: {
+        generateAndEmailResetToken: sinon.stub(),
+        setNewUserPassword: sinon.stub().resolves({
+          found: true,
+          reset: true,
+          userID: ctx.user_id,
+          mustReconfirm: true,
+        }),
+        getUserForPasswordResetToken: sinon
+          .stub()
+          .withArgs(ctx.token)
+          .resolves({
+            user: { _id: ctx.user_id },
+            remainingPeeks: 1,
+          }),
+      },
+    }
+    ctx.UserSessionsManager = {
+      promises: {
+        removeSessionsFromRedis: sinon.stub().resolves(),
+      },
+    }
+    ctx.UserUpdater = {
+      promises: {
+        removeReconfirmFlag: sinon.stub().resolves(),
+      },
+    }
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/PasswordReset/PasswordResetHandler',
+      () => ({
+        default: ctx.PasswordResetHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationManager',
+      () => ({
+        default: {
+          validatePassword: sinon.stub().returns(null),
+        },
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: (ctx.AuthenticationController = {
+          getLoggedInUserId: sinon.stub(),
+          finishLogin: sinon.stub(),
+          setAuditInfo: sinon.stub(),
+        }),
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: (ctx.UserGetter = {
+        promises: {
+          getUser: sinon.stub(),
+        },
+      }),
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserSessionsManager', () => ({
+      default: ctx.UserSessionsManager,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserUpdater', () => ({
+      default: ctx.UserUpdater,
+    }))
+
+    ctx.PasswordResetController = (await import(MODULE_PATH)).default
+  })
+
+  describe('requestReset', function () {
+    it('should tell the handler to process that email', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
+          'primary'
+        )
+        ctx.res.callback = () => {
+          ctx.res.statusCode.should.equal(200)
+          ctx.res.json.calledWith(sinon.match.has('message')).should.equal(true)
+          expect(
+            ctx.PasswordResetHandler.promises.generateAndEmailResetToken
+              .lastCall.args[0]
+          ).equal(ctx.email)
+          resolve()
+        }
+        ctx.PasswordResetController.requestReset(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send a 500 if there is an error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.generateAndEmailResetToken.rejects(
+          new Error('error')
+        )
+        ctx.PasswordResetController.requestReset(ctx.req, ctx.res, error => {
+          expect(error).to.exist
+          resolve()
+        })
+      })
+    })
+
+    it("should send a 404 if the email doesn't exist", async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
+          null
+        )
+        ctx.res.callback = () => {
+          ctx.res.statusCode.should.equal(404)
+          ctx.res.json.calledWith(sinon.match.has('message')).should.equal(true)
+          resolve()
+        }
+        ctx.PasswordResetController.requestReset(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send a 404 if the email is registered as a secondard email', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
+          'secondary'
+        )
+        ctx.res.callback = () => {
+          ctx.res.statusCode.should.equal(404)
+          ctx.res.json.calledWith(sinon.match.has('message')).should.equal(true)
+          resolve()
+        }
+        ctx.PasswordResetController.requestReset(ctx.req, ctx.res)
+      })
+    })
+
+    it('should normalize the email address', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.email = '  UPperCaseEMAILWithSpacesAround@example.Com '
+        ctx.req.body.email = ctx.email
+        ctx.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
+          'primary'
+        )
+        ctx.res.callback = () => {
+          ctx.res.statusCode.should.equal(200)
+          ctx.res.json.calledWith(sinon.match.has('message')).should.equal(true)
+          resolve()
+        }
+        ctx.PasswordResetController.requestReset(ctx.req, ctx.res)
+      })
+    })
+  })
+
+  describe('setNewUserPassword', function () {
+    beforeEach(function (ctx) {
+      ctx.req.session.resetToken = ctx.token
+    })
+
+    it('should tell the user handler to reset the password', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.sendStatus = code => {
+          code.should.equal(200)
+          ctx.PasswordResetHandler.promises.setNewUserPassword
+            .calledWith(ctx.token, ctx.password)
+            .should.equal(true)
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should preserve spaces in the password', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.password = ctx.req.body.password = ' oh! clever! spaces around!   '
+        ctx.res.sendStatus = code => {
+          code.should.equal(200)
+          ctx.PasswordResetHandler.promises.setNewUserPassword.should.have.been.calledWith(
+            ctx.token,
+            ctx.password
+          )
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send 404 if the token was not found', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.setNewUserPassword.resolves({
+          found: false,
+          reset: false,
+          userId: ctx.user_id,
+        })
+        ctx.res.status = code => {
+          code.should.equal(404)
+          return ctx.res
+        }
+        ctx.res.json = data => {
+          data.message.key.should.equal('token-expired')
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should return 500 if not reset', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.PasswordResetHandler.promises.setNewUserPassword.resolves({
+          found: true,
+          reset: false,
+          userId: ctx.user_id,
+        })
+        ctx.res.status = code => {
+          code.should.equal(500)
+          return ctx.res
+        }
+        ctx.res.json = data => {
+          expect(data.message).to.exist
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should return 400 (Bad Request) if there is no password', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body.password = ''
+        ctx.res.status = code => {
+          code.should.equal(400)
+          return ctx.res
+        }
+        ctx.res.json = data => {
+          data.message.key.should.equal('invalid-password')
+          ctx.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
+            false
+          )
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should return 400 (Bad Request) if there is no passwordResetToken', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body.passwordResetToken = ''
+        ctx.res.status = code => {
+          code.should.equal(400)
+          return ctx.res
+        }
+        ctx.res.json = data => {
+          data.message.key.should.equal('invalid-password')
+          ctx.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
+            false
+          )
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should return 400 (Bad Request) if the password is invalid', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body.password = 'correct horse battery staple'
+        const err = new Error('bad')
+        err.name = 'InvalidPasswordError'
+        ctx.PasswordResetHandler.promises.setNewUserPassword.rejects(err)
+        ctx.res.status = code => {
+          code.should.equal(400)
+          return ctx.res
+        }
+        ctx.res.json = data => {
+          data.message.key.should.equal('invalid-password')
+          ctx.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
+            true
+          )
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should clear sessions', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.sendStatus = code => {
+          ctx.UserSessionsManager.promises.removeSessionsFromRedis.callCount.should.equal(
+            1
+          )
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    it('should call removeReconfirmFlag if user.must_reconfirm', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.sendStatus = code => {
+          ctx.UserUpdater.promises.removeReconfirmFlag.callCount.should.equal(1)
+          resolve()
+        }
+        ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+      })
+    })
+
+    describe('catch errors', function () {
+      it('should return 404 for NotFoundError', async function (ctx) {
+        await new Promise(resolve => {
+          const anError = new Error('oops')
+          anError.name = 'NotFoundError'
+          ctx.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
+          ctx.res.status = code => {
+            code.should.equal(404)
+            return ctx.res
+          }
+          ctx.res.json = data => {
+            data.message.key.should.equal('token-expired')
+            resolve()
+          }
+          ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+        })
+      })
+      it('should return 400 for InvalidPasswordError', async function (ctx) {
+        await new Promise(resolve => {
+          const anError = new Error('oops')
+          anError.name = 'InvalidPasswordError'
+          ctx.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
+          ctx.res.status = code => {
+            code.should.equal(400)
+            return ctx.res
+          }
+          ctx.res.json = data => {
+            data.message.key.should.equal('invalid-password')
+            resolve()
+          }
+          ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+        })
+      })
+      it('should return 500 for other errors', async function (ctx) {
+        await new Promise(resolve => {
+          const anError = new Error('oops')
+          ctx.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
+          ctx.res.status = code => {
+            code.should.equal(500)
+            return ctx.res
+          }
+          ctx.res.json = data => {
+            expect(data.message).to.exist
+            resolve()
+          }
+          ctx.res.sendStatus = code => {
+            code.should.equal(500)
+            resolve()
+          }
+          ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('when doLoginAfterPasswordReset is set', function () {
+      beforeEach(function (ctx) {
+        ctx.user = {
+          _id: ctx.userId,
+          email: 'joe@example.com',
+        }
+        ctx.UserGetter.promises.getUser.resolves(ctx.user)
+        ctx.req.session.doLoginAfterPasswordReset = 'true'
+      })
+
+      it('should login user', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.AuthenticationController.finishLogin.callsFake((...args) => {
+            expect(args[0]).to.equal(ctx.user)
+            resolve()
+          })
+          ctx.PasswordResetController.setNewUserPassword(ctx.req, ctx.res)
+        })
+      })
+    })
+  })
+
+  describe('renderSetPasswordForm', function () {
+    describe('with token in query-string', function () {
+      beforeEach(function (ctx) {
+        ctx.req.query.passwordResetToken = ctx.token
+      })
+
+      it('should set session.resetToken and redirect', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.req.session.should.not.have.property('resetToken')
+          ctx.res.redirect = path => {
+            path.should.equal('/user/password/set')
+            ctx.req.session.resetToken.should.equal(ctx.token)
+            resolve()
+          }
+          ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('with expired token in query', function () {
+      beforeEach(function (ctx) {
+        ctx.req.query.passwordResetToken = ctx.token
+        ctx.PasswordResetHandler.promises.getUserForPasswordResetToken = sinon
+          .stub()
+          .withArgs(ctx.token)
+          .resolves({ user: { _id: ctx.user_id }, remainingPeeks: 0 })
+      })
+
+      it('should redirect to the reset request page with an error message', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.redirect = path => {
+            path.should.equal('/user/password/reset?error=token_expired')
+            ctx.req.session.should.not.have.property('resetToken')
+            resolve()
+          }
+          ctx.res.render = (templatePath, options) => {
+            resolve('should not render')
+          }
+          ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('with token and email in query-string', function () {
+      beforeEach(function (ctx) {
+        ctx.req.query.passwordResetToken = ctx.token
+        ctx.req.query.email = 'foo@bar.com'
+      })
+
+      it('should set session.resetToken and redirect with email', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.req.session.should.not.have.property('resetToken')
+          ctx.res.redirect = path => {
+            path.should.equal('/user/password/set?email=foo%40bar.com')
+            ctx.req.session.resetToken.should.equal(ctx.token)
+            resolve()
+          }
+          ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('with token and invalid email in query-string', function () {
+      beforeEach(function (ctx) {
+        ctx.req.query.passwordResetToken = ctx.token
+        ctx.req.query.email = 'not-an-email'
+      })
+
+      it('should set session.resetToken and redirect without email', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.req.session.should.not.have.property('resetToken')
+          ctx.res.redirect = path => {
+            path.should.equal('/user/password/set')
+            ctx.req.session.resetToken.should.equal(ctx.token)
+            resolve()
+          }
+          ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('with token and non-string email in query-string', function () {
+      beforeEach(function (ctx) {
+        ctx.req.query.passwordResetToken = ctx.token
+        ctx.req.query.email = { foo: 'bar' }
+      })
+
+      it('should set session.resetToken and redirect without email', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.req.session.should.not.have.property('resetToken')
+          ctx.res.redirect = path => {
+            path.should.equal('/user/password/set')
+            ctx.req.session.resetToken.should.equal(ctx.token)
+            resolve()
+          }
+          ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('without a token in query-string', function () {
+      describe('with token in session', function () {
+        beforeEach(function (ctx) {
+          ctx.req.session.resetToken = ctx.token
+        })
+
+        it('should render the page, passing the reset token', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.render = (templatePath, options) => {
+              options.passwordResetToken.should.equal(ctx.token)
+              resolve()
+            }
+            ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+          })
+        })
+
+        it('should clear the req.session.resetToken', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.render = (templatePath, options) => {
+              ctx.req.session.should.not.have.property('resetToken')
+              resolve()
+            }
+            ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+          })
+        })
+      })
+
+      describe('without a token in session', function () {
+        it('should redirect to the reset request page', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.res.redirect = path => {
+              path.should.equal('/user/password/reset')
+              ctx.req.session.should.not.have.property('resetToken')
+              resolve()
+            }
+            ctx.PasswordResetController.renderSetPasswordForm(ctx.req, ctx.res)
+          })
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/PasswordReset/PasswordResetControllerTests.mjs b/services/web/test/unit/src/PasswordReset/PasswordResetControllerTests.mjs
deleted file mode 100644
index 6df3c765b1..0000000000
--- a/services/web/test/unit/src/PasswordReset/PasswordResetControllerTests.mjs
+++ /dev/null
@@ -1,485 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-import MockResponse from '../helpers/MockResponse.js'
-
-const MODULE_PATH = new URL(
-  '../../../../app/src/Features/PasswordReset/PasswordResetController.mjs',
-  import.meta.url
-).pathname
-
-describe('PasswordResetController', function () {
-  beforeEach(async function () {
-    this.email = 'bob@bob.com'
-    this.user_id = 'mock-user-id'
-    this.token = 'my security token that was emailed to me'
-    this.password = 'my new password'
-    this.req = {
-      body: {
-        email: this.email,
-        passwordResetToken: this.token,
-        password: this.password,
-      },
-      i18n: {
-        translate() {
-          return '.'
-        },
-      },
-      session: {},
-      query: {},
-    }
-    this.res = new MockResponse()
-
-    this.settings = {}
-    this.PasswordResetHandler = {
-      generateAndEmailResetToken: sinon.stub(),
-      promises: {
-        generateAndEmailResetToken: sinon.stub(),
-        setNewUserPassword: sinon.stub().resolves({
-          found: true,
-          reset: true,
-          userID: this.user_id,
-          mustReconfirm: true,
-        }),
-        getUserForPasswordResetToken: sinon
-          .stub()
-          .withArgs(this.token)
-          .resolves({
-            user: { _id: this.user_id },
-            remainingPeeks: 1,
-          }),
-      },
-    }
-    this.UserSessionsManager = {
-      promises: {
-        removeSessionsFromRedis: sinon.stub().resolves(),
-      },
-    }
-    this.UserUpdater = {
-      promises: {
-        removeReconfirmFlag: sinon.stub().resolves(),
-      },
-    }
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves('default'),
-      },
-    }
-    this.PasswordResetController = await esmock.strict(MODULE_PATH, {
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/Features/PasswordReset/PasswordResetHandler':
-        this.PasswordResetHandler,
-      '../../../../app/src/Features/Authentication/AuthenticationManager': {
-        validatePassword: sinon.stub().returns(null),
-      },
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        (this.AuthenticationController = {
-          getLoggedInUserId: sinon.stub(),
-          finishLogin: sinon.stub(),
-          setAuditInfo: sinon.stub(),
-        }),
-      '../../../../app/src/Features/User/UserGetter': (this.UserGetter = {
-        promises: {
-          getUser: sinon.stub(),
-        },
-      }),
-      '../../../../app/src/Features/User/UserSessionsManager':
-        this.UserSessionsManager,
-      '../../../../app/src/Features/User/UserUpdater': this.UserUpdater,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-    })
-  })
-
-  describe('requestReset', function () {
-    it('should tell the handler to process that email', function (done) {
-      this.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
-        'primary'
-      )
-      this.res.callback = () => {
-        this.res.statusCode.should.equal(200)
-        this.res.json.calledWith(sinon.match.has('message')).should.equal(true)
-        expect(
-          this.PasswordResetHandler.promises.generateAndEmailResetToken.lastCall
-            .args[0]
-        ).equal(this.email)
-        done()
-      }
-      this.PasswordResetController.requestReset(this.req, this.res)
-    })
-
-    it('should send a 500 if there is an error', function (done) {
-      this.PasswordResetHandler.promises.generateAndEmailResetToken.rejects(
-        new Error('error')
-      )
-      this.PasswordResetController.requestReset(this.req, this.res, error => {
-        expect(error).to.exist
-        done()
-      })
-    })
-
-    it("should send a 404 if the email doesn't exist", function (done) {
-      this.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
-        null
-      )
-      this.res.callback = () => {
-        this.res.statusCode.should.equal(404)
-        this.res.json.calledWith(sinon.match.has('message')).should.equal(true)
-        done()
-      }
-      this.PasswordResetController.requestReset(this.req, this.res)
-    })
-
-    it('should send a 404 if the email is registered as a secondard email', function (done) {
-      this.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
-        'secondary'
-      )
-      this.res.callback = () => {
-        this.res.statusCode.should.equal(404)
-        this.res.json.calledWith(sinon.match.has('message')).should.equal(true)
-        done()
-      }
-      this.PasswordResetController.requestReset(this.req, this.res)
-    })
-
-    it('should normalize the email address', function (done) {
-      this.email = '  UPperCaseEMAILWithSpacesAround@example.Com '
-      this.req.body.email = this.email
-      this.PasswordResetHandler.promises.generateAndEmailResetToken.resolves(
-        'primary'
-      )
-      this.res.callback = () => {
-        this.res.statusCode.should.equal(200)
-        this.res.json.calledWith(sinon.match.has('message')).should.equal(true)
-        done()
-      }
-      this.PasswordResetController.requestReset(this.req, this.res)
-    })
-  })
-
-  describe('setNewUserPassword', function () {
-    beforeEach(function () {
-      this.req.session.resetToken = this.token
-    })
-
-    it('should tell the user handler to reset the password', function (done) {
-      this.res.sendStatus = code => {
-        code.should.equal(200)
-        this.PasswordResetHandler.promises.setNewUserPassword
-          .calledWith(this.token, this.password)
-          .should.equal(true)
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should preserve spaces in the password', function (done) {
-      this.password = this.req.body.password = ' oh! clever! spaces around!   '
-      this.res.sendStatus = code => {
-        code.should.equal(200)
-        this.PasswordResetHandler.promises.setNewUserPassword.should.have.been.calledWith(
-          this.token,
-          this.password
-        )
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should send 404 if the token was not found', function (done) {
-      this.PasswordResetHandler.promises.setNewUserPassword.resolves({
-        found: false,
-        reset: false,
-        userId: this.user_id,
-      })
-      this.res.status = code => {
-        code.should.equal(404)
-        return this.res
-      }
-      this.res.json = data => {
-        data.message.key.should.equal('token-expired')
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should return 500 if not reset', function (done) {
-      this.PasswordResetHandler.promises.setNewUserPassword.resolves({
-        found: true,
-        reset: false,
-        userId: this.user_id,
-      })
-      this.res.status = code => {
-        code.should.equal(500)
-        return this.res
-      }
-      this.res.json = data => {
-        expect(data.message).to.exist
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should return 400 (Bad Request) if there is no password', function (done) {
-      this.req.body.password = ''
-      this.res.status = code => {
-        code.should.equal(400)
-        return this.res
-      }
-      this.res.json = data => {
-        data.message.key.should.equal('invalid-password')
-        this.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
-          false
-        )
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should return 400 (Bad Request) if there is no passwordResetToken', function (done) {
-      this.req.body.passwordResetToken = ''
-      this.res.status = code => {
-        code.should.equal(400)
-        return this.res
-      }
-      this.res.json = data => {
-        data.message.key.should.equal('invalid-password')
-        this.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
-          false
-        )
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should return 400 (Bad Request) if the password is invalid', function (done) {
-      this.req.body.password = 'correct horse battery staple'
-      const err = new Error('bad')
-      err.name = 'InvalidPasswordError'
-      this.PasswordResetHandler.promises.setNewUserPassword.rejects(err)
-      this.res.status = code => {
-        code.should.equal(400)
-        return this.res
-      }
-      this.res.json = data => {
-        data.message.key.should.equal('invalid-password')
-        this.PasswordResetHandler.promises.setNewUserPassword.called.should.equal(
-          true
-        )
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should clear sessions', function (done) {
-      this.res.sendStatus = code => {
-        this.UserSessionsManager.promises.removeSessionsFromRedis.callCount.should.equal(
-          1
-        )
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    it('should call removeReconfirmFlag if user.must_reconfirm', function (done) {
-      this.res.sendStatus = code => {
-        this.UserUpdater.promises.removeReconfirmFlag.callCount.should.equal(1)
-        done()
-      }
-      this.PasswordResetController.setNewUserPassword(this.req, this.res)
-    })
-
-    describe('catch errors', function () {
-      it('should return 404 for NotFoundError', function (done) {
-        const anError = new Error('oops')
-        anError.name = 'NotFoundError'
-        this.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
-        this.res.status = code => {
-          code.should.equal(404)
-          return this.res
-        }
-        this.res.json = data => {
-          data.message.key.should.equal('token-expired')
-          done()
-        }
-        this.PasswordResetController.setNewUserPassword(this.req, this.res)
-      })
-      it('should return 400 for InvalidPasswordError', function (done) {
-        const anError = new Error('oops')
-        anError.name = 'InvalidPasswordError'
-        this.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
-        this.res.status = code => {
-          code.should.equal(400)
-          return this.res
-        }
-        this.res.json = data => {
-          data.message.key.should.equal('invalid-password')
-          done()
-        }
-        this.PasswordResetController.setNewUserPassword(this.req, this.res)
-      })
-      it('should return 500 for other errors', function (done) {
-        const anError = new Error('oops')
-        this.PasswordResetHandler.promises.setNewUserPassword.rejects(anError)
-        this.res.status = code => {
-          code.should.equal(500)
-          return this.res
-        }
-        this.res.json = data => {
-          expect(data.message).to.exist
-          done()
-        }
-        this.res.sendStatus = code => {
-          code.should.equal(500)
-          done()
-        }
-        this.PasswordResetController.setNewUserPassword(this.req, this.res)
-      })
-    })
-
-    describe('when doLoginAfterPasswordReset is set', function () {
-      beforeEach(function () {
-        this.user = {
-          _id: this.userId,
-          email: 'joe@example.com',
-        }
-        this.UserGetter.promises.getUser.resolves(this.user)
-        this.req.session.doLoginAfterPasswordReset = 'true'
-      })
-
-      it('should login user', function (done) {
-        this.AuthenticationController.finishLogin.callsFake((...args) => {
-          expect(args[0]).to.equal(this.user)
-          done()
-        })
-        this.PasswordResetController.setNewUserPassword(this.req, this.res)
-      })
-    })
-  })
-
-  describe('renderSetPasswordForm', function () {
-    describe('with token in query-string', function () {
-      beforeEach(function () {
-        this.req.query.passwordResetToken = this.token
-      })
-
-      it('should set session.resetToken and redirect', function (done) {
-        this.req.session.should.not.have.property('resetToken')
-        this.res.redirect = path => {
-          path.should.equal('/user/password/set')
-          this.req.session.resetToken.should.equal(this.token)
-          done()
-        }
-        this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-      })
-    })
-
-    describe('with expired token in query', function () {
-      beforeEach(function () {
-        this.req.query.passwordResetToken = this.token
-        this.PasswordResetHandler.promises.getUserForPasswordResetToken = sinon
-          .stub()
-          .withArgs(this.token)
-          .resolves({ user: { _id: this.user_id }, remainingPeeks: 0 })
-      })
-
-      it('should redirect to the reset request page with an error message', function (done) {
-        this.res.redirect = path => {
-          path.should.equal('/user/password/reset?error=token_expired')
-          this.req.session.should.not.have.property('resetToken')
-          done()
-        }
-        this.res.render = (templatePath, options) => {
-          done('should not render')
-        }
-        this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-      })
-    })
-
-    describe('with token and email in query-string', function () {
-      beforeEach(function () {
-        this.req.query.passwordResetToken = this.token
-        this.req.query.email = 'foo@bar.com'
-      })
-
-      it('should set session.resetToken and redirect with email', function (done) {
-        this.req.session.should.not.have.property('resetToken')
-        this.res.redirect = path => {
-          path.should.equal('/user/password/set?email=foo%40bar.com')
-          this.req.session.resetToken.should.equal(this.token)
-          done()
-        }
-        this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-      })
-    })
-
-    describe('with token and invalid email in query-string', function () {
-      beforeEach(function () {
-        this.req.query.passwordResetToken = this.token
-        this.req.query.email = 'not-an-email'
-      })
-
-      it('should set session.resetToken and redirect without email', function (done) {
-        this.req.session.should.not.have.property('resetToken')
-        this.res.redirect = path => {
-          path.should.equal('/user/password/set')
-          this.req.session.resetToken.should.equal(this.token)
-          done()
-        }
-        this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-      })
-    })
-
-    describe('with token and non-string email in query-string', function () {
-      beforeEach(function () {
-        this.req.query.passwordResetToken = this.token
-        this.req.query.email = { foo: 'bar' }
-      })
-
-      it('should set session.resetToken and redirect without email', function (done) {
-        this.req.session.should.not.have.property('resetToken')
-        this.res.redirect = path => {
-          path.should.equal('/user/password/set')
-          this.req.session.resetToken.should.equal(this.token)
-          done()
-        }
-        this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-      })
-    })
-
-    describe('without a token in query-string', function () {
-      describe('with token in session', function () {
-        beforeEach(function () {
-          this.req.session.resetToken = this.token
-        })
-
-        it('should render the page, passing the reset token', function (done) {
-          this.res.render = (templatePath, options) => {
-            options.passwordResetToken.should.equal(this.token)
-            done()
-          }
-          this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-        })
-
-        it('should clear the req.session.resetToken', function (done) {
-          this.res.render = (templatePath, options) => {
-            this.req.session.should.not.have.property('resetToken')
-            done()
-          }
-          this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-        })
-      })
-
-      describe('without a token in session', function () {
-        it('should redirect to the reset request page', function (done) {
-          this.res.redirect = path => {
-            path.should.equal('/user/password/reset')
-            this.req.session.should.not.have.property('resetToken')
-            done()
-          }
-          this.PasswordResetController.renderSetPasswordForm(this.req, this.res)
-        })
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/PasswordReset/PasswordResetHandler.test.mjs b/services/web/test/unit/src/PasswordReset/PasswordResetHandler.test.mjs
new file mode 100644
index 0000000000..0eb52c4410
--- /dev/null
+++ b/services/web/test/unit/src/PasswordReset/PasswordResetHandler.test.mjs
@@ -0,0 +1,616 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+const modulePath = new URL(
+  '../../../../app/src/Features/PasswordReset/PasswordResetHandler',
+  import.meta.url
+).pathname
+
+describe('PasswordResetHandler', function () {
+  beforeEach(async function (ctx) {
+    ctx.settings = { siteUrl: 'https://www.overleaf.com' }
+    ctx.OneTimeTokenHandler = {
+      promises: {
+        getNewToken: sinon.stub(),
+        peekValueFromToken: sinon.stub(),
+      },
+      peekValueFromToken: sinon.stub(),
+      expireToken: sinon.stub(),
+    }
+    ctx.UserGetter = {
+      getUserByMainEmail: sinon.stub(),
+      getUser: sinon.stub(),
+      promises: {
+        getUserByAnyEmail: sinon.stub(),
+        getUserByMainEmail: sinon.stub(),
+      },
+    }
+    ctx.EmailHandler = { promises: { sendEmail: sinon.stub() } }
+    ctx.AuthenticationManager = {
+      setUserPasswordInV2: sinon.stub(),
+      promises: {
+        setUserPassword: sinon.stub().resolves(),
+      },
+    }
+
+    vi.doMock('../../../../app/src/Features/User/UserAuditLogHandler', () => ({
+      default: (ctx.UserAuditLogHandler = {
+        promises: {
+          addEntry: sinon.stub().resolves(),
+        },
+      }),
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Security/OneTimeTokenHandler',
+      () => ({
+        default: ctx.OneTimeTokenHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Email/EmailHandler', () => ({
+      default: ctx.EmailHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationManager',
+      () => ({
+        default: ctx.AuthenticationManager,
+      })
+    )
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authorization/PermissionsManager',
+      () => ({
+        default: (ctx.PermissionsManager = {
+          promises: {
+            assertUserPermissions: sinon.stub(),
+          },
+        }),
+      })
+    )
+
+    ctx.PasswordResetHandler = (await import(modulePath)).default
+    ctx.token = '12312321i'
+    ctx.user_id = 'user_id_here'
+    ctx.user = { email: (ctx.email = 'bob@bob.com'), _id: ctx.user_id }
+    ctx.password = 'my great secret password'
+    ctx.callback = sinon.stub()
+    // this should not have any effect now
+    ctx.settings.overleaf = true
+  })
+
+  afterEach(function (ctx) {
+    ctx.settings.overleaf = false
+  })
+
+  describe('generateAndEmailResetToken', function () {
+    it('should check the user exists', function (ctx) {
+      ctx.UserGetter.promises.getUserByAnyEmail.resolves()
+      ctx.PasswordResetHandler.generateAndEmailResetToken(
+        ctx.user.email,
+        ctx.callback
+      )
+      ctx.UserGetter.promises.getUserByAnyEmail.should.have.been.calledWith(
+        ctx.user.email
+      )
+    })
+
+    it('should send the email with the token', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserGetter.promises.getUserByAnyEmail.resolves(ctx.user)
+        ctx.OneTimeTokenHandler.promises.getNewToken.resolves(ctx.token)
+        ctx.EmailHandler.promises.sendEmail.resolves()
+        ctx.PasswordResetHandler.generateAndEmailResetToken(
+          ctx.user.email,
+          (err, status) => {
+            expect(err).to.not.exist
+            ctx.EmailHandler.promises.sendEmail.called.should.equal(true)
+            status.should.equal('primary')
+            const args = ctx.EmailHandler.promises.sendEmail.args[0]
+            args[0].should.equal('passwordResetRequested')
+            args[1].setNewPasswordUrl.should.equal(
+              `${ctx.settings.siteUrl}/user/password/set?passwordResetToken=${
+                ctx.token
+              }&email=${encodeURIComponent(ctx.user.email)}`
+            )
+            resolve()
+          }
+        )
+      })
+    })
+
+    it('should return errors from getUserByAnyEmail', async function (ctx) {
+      await new Promise(resolve => {
+        const err = new Error('oops')
+        ctx.UserGetter.promises.getUserByAnyEmail.rejects(err)
+        ctx.PasswordResetHandler.generateAndEmailResetToken(
+          ctx.user.email,
+          err => {
+            expect(err).to.equal(err)
+            resolve()
+          }
+        )
+      })
+    })
+
+    describe('when the email exists', function () {
+      let result
+      beforeEach(async function (ctx) {
+        ctx.UserGetter.promises.getUserByAnyEmail.resolves(ctx.user)
+        ctx.OneTimeTokenHandler.promises.getNewToken.resolves(ctx.token)
+        ctx.EmailHandler.promises.sendEmail.resolves()
+        result =
+          await ctx.PasswordResetHandler.promises.generateAndEmailResetToken(
+            ctx.email
+          )
+      })
+
+      it('should set the password token data to the user id and email', function (ctx) {
+        ctx.OneTimeTokenHandler.promises.getNewToken.should.have.been.calledWith(
+          'password',
+          {
+            email: ctx.email,
+            user_id: ctx.user._id,
+          }
+        )
+      })
+
+      it('should send an email with the token', function (ctx) {
+        ctx.EmailHandler.promises.sendEmail.called.should.equal(true)
+        const args = ctx.EmailHandler.promises.sendEmail.args[0]
+        args[0].should.equal('passwordResetRequested')
+        args[1].setNewPasswordUrl.should.equal(
+          `${ctx.settings.siteUrl}/user/password/set?passwordResetToken=${
+            ctx.token
+          }&email=${encodeURIComponent(ctx.user.email)}`
+        )
+      })
+
+      it('should return status == true', async function () {
+        expect(result).to.equal('primary')
+      })
+    })
+
+    describe("when the email doesn't exist", function () {
+      let result
+      beforeEach(async function (ctx) {
+        ctx.UserGetter.promises.getUserByAnyEmail.resolves(null)
+        result =
+          await ctx.PasswordResetHandler.promises.generateAndEmailResetToken(
+            ctx.email
+          )
+      })
+
+      it('should not set the password token data', function (ctx) {
+        ctx.OneTimeTokenHandler.promises.getNewToken.called.should.equal(false)
+      })
+
+      it('should send an email with the token', function (ctx) {
+        ctx.EmailHandler.promises.sendEmail.called.should.equal(false)
+      })
+
+      it('should return status == null', function () {
+        expect(result).to.equal(null)
+      })
+    })
+
+    describe('when the email is a secondary email', function () {
+      let result
+      beforeEach(async function (ctx) {
+        ctx.UserGetter.promises.getUserByAnyEmail.resolves(ctx.user)
+        result =
+          await ctx.PasswordResetHandler.promises.generateAndEmailResetToken(
+            'secondary@email.com'
+          )
+      })
+
+      it('should not set the password token data', function (ctx) {
+        ctx.OneTimeTokenHandler.promises.getNewToken.called.should.equal(false)
+      })
+
+      it('should not send an email with the token', function (ctx) {
+        ctx.EmailHandler.promises.sendEmail.called.should.equal(false)
+      })
+
+      it('should return status == secondary', function () {
+        expect(result).to.equal('secondary')
+      })
+    })
+  })
+
+  describe('setNewUserPassword', function () {
+    beforeEach(function (ctx) {
+      ctx.auditLog = { ip: '0:0:0:0' }
+    })
+    describe('when no data is found', function () {
+      beforeEach(function (ctx) {
+        ctx.OneTimeTokenHandler.promises.peekValueFromToken.resolves(null)
+      })
+
+      it('should return found == false and reset == false', function (ctx) {
+        ctx.PasswordResetHandler.setNewUserPassword(
+          ctx.token,
+          ctx.password,
+          ctx.auditLog,
+          (error, result) => {
+            expect(error).to.not.exist
+            expect(result).to.deep.equal({
+              found: false,
+              reset: false,
+              userId: null,
+            })
+          }
+        )
+      })
+    })
+
+    describe('when the token has a user_id and email', function () {
+      beforeEach(function (ctx) {
+        ctx.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
+          data: {
+            user_id: ctx.user._id,
+            email: ctx.email,
+          },
+        })
+        ctx.AuthenticationManager.promises.setUserPassword
+          .withArgs(ctx.user, ctx.password)
+          .resolves(true)
+        ctx.OneTimeTokenHandler.expireToken = sinon.stub().callsArgWith(2, null)
+      })
+
+      describe('when no user is found with this email', function () {
+        beforeEach(function (ctx) {
+          ctx.UserGetter.getUserByMainEmail
+            .withArgs(ctx.email)
+            .yields(null, null)
+        })
+
+        it('should return found == false and reset == false', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.PasswordResetHandler.setNewUserPassword(
+              ctx.token,
+              ctx.password,
+              ctx.auditLog,
+              (err, result) => {
+                const { found, reset } = result
+                expect(err).to.not.exist
+                expect(found).to.be.false
+                expect(reset).to.be.false
+                expect(ctx.OneTimeTokenHandler.expireToken.callCount).to.equal(
+                  0
+                )
+                resolve()
+              }
+            )
+          })
+        })
+      })
+
+      describe("when the email and user don't match", function () {
+        beforeEach(function (ctx) {
+          ctx.UserGetter.getUserByMainEmail
+            .withArgs(ctx.email)
+            .yields(null, { _id: 'not-the-same', email: ctx.email })
+          ctx.OneTimeTokenHandler.expireToken.callsArgWith(2, null)
+        })
+
+        it('should return found == false and reset == false', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.PasswordResetHandler.setNewUserPassword(
+              ctx.token,
+              ctx.password,
+              ctx.auditLog,
+              (err, result) => {
+                const { found, reset } = result
+                expect(err).to.not.exist
+                expect(found).to.be.false
+                expect(reset).to.be.false
+                expect(ctx.OneTimeTokenHandler.expireToken.callCount).to.equal(
+                  0
+                )
+                resolve()
+              }
+            )
+          })
+        })
+      })
+
+      describe('when the email and user match', function () {
+        describe('success', function () {
+          beforeEach(function (ctx) {
+            ctx.UserGetter.promises.getUserByMainEmail.resolves(ctx.user)
+            ctx.OneTimeTokenHandler.expireToken = sinon
+              .stub()
+              .callsArgWith(2, null)
+          })
+
+          it('should update the user audit log', async function (ctx) {
+            await new Promise(resolve => {
+              ctx.PasswordResetHandler.setNewUserPassword(
+                ctx.token,
+                ctx.password,
+                ctx.auditLog,
+                (error, result) => {
+                  sinon.assert.calledWith(
+                    ctx.UserAuditLogHandler.promises.addEntry,
+                    ctx.user_id,
+                    'reset-password',
+                    undefined,
+                    ctx.auditLog.ip,
+                    { token: ctx.token.substring(0, 10) }
+                  )
+                  expect(error).to.not.exist
+                  resolve()
+                }
+              )
+            })
+          })
+
+          it('should return reset == true and the user id', async function (ctx) {
+            await new Promise(resolve => {
+              ctx.PasswordResetHandler.setNewUserPassword(
+                ctx.token,
+                ctx.password,
+                ctx.auditLog,
+                (err, result) => {
+                  const { reset, userId } = result
+                  expect(err).to.not.exist
+                  expect(reset).to.be.true
+                  expect(userId).to.equal(ctx.user._id)
+                  resolve()
+                }
+              )
+            })
+          })
+
+          it('should expire the token', async function (ctx) {
+            await new Promise(resolve => {
+              ctx.PasswordResetHandler.setNewUserPassword(
+                ctx.token,
+                ctx.password,
+                ctx.auditLog,
+                (_err, _result) => {
+                  expect(ctx.OneTimeTokenHandler.expireToken.called).to.equal(
+                    true
+                  )
+                  resolve()
+                }
+              )
+            })
+          })
+
+          describe('when logged in', function () {
+            beforeEach(function (ctx) {
+              ctx.auditLog.initiatorId = ctx.user_id
+            })
+            it('should update the user audit log with initiatorId', async function (ctx) {
+              await new Promise(resolve => {
+                ctx.PasswordResetHandler.setNewUserPassword(
+                  ctx.token,
+                  ctx.password,
+                  ctx.auditLog,
+                  (error, result) => {
+                    expect(error).to.not.exist
+                    sinon.assert.calledWith(
+                      ctx.UserAuditLogHandler.promises.addEntry,
+                      ctx.user_id,
+                      'reset-password',
+                      ctx.user_id,
+                      ctx.auditLog.ip,
+                      { token: ctx.token.substring(0, 10) }
+                    )
+                    resolve()
+                  }
+                )
+              })
+            })
+          })
+        })
+
+        describe('errors', function () {
+          describe('via setUserPassword', function () {
+            beforeEach(function (ctx) {
+              ctx.PasswordResetHandler.promises.getUserForPasswordResetToken =
+                sinon.stub().withArgs(ctx.token).resolves({ user: ctx.user })
+              ctx.AuthenticationManager.promises.setUserPassword
+                .withArgs(ctx.user, ctx.password)
+                .rejects()
+            })
+            it('should return the error', async function (ctx) {
+              await new Promise(resolve => {
+                ctx.PasswordResetHandler.setNewUserPassword(
+                  ctx.token,
+                  ctx.password,
+                  ctx.auditLog,
+                  (error, _result) => {
+                    expect(error).to.exist
+                    expect(
+                      ctx.UserAuditLogHandler.promises.addEntry.callCount
+                    ).to.equal(1)
+                    resolve()
+                  }
+                )
+              })
+            })
+          })
+
+          describe('via UserAuditLogHandler', function () {
+            beforeEach(function (ctx) {
+              ctx.PasswordResetHandler.promises.getUserForPasswordResetToken =
+                sinon.stub().withArgs(ctx.token).resolves({ user: ctx.user })
+              ctx.UserAuditLogHandler.promises.addEntry.rejects(
+                new Error('oops')
+              )
+            })
+            it('should return the error', async function (ctx) {
+              await new Promise(resolve => {
+                ctx.PasswordResetHandler.setNewUserPassword(
+                  ctx.token,
+                  ctx.password,
+                  ctx.auditLog,
+                  (error, _result) => {
+                    expect(error).to.exist
+                    expect(
+                      ctx.UserAuditLogHandler.promises.addEntry.callCount
+                    ).to.equal(1)
+                    expect(ctx.AuthenticationManager.promises.setUserPassword)
+                      .to.not.have.been.called
+                    resolve()
+                  }
+                )
+              })
+            })
+          })
+        })
+      })
+    })
+
+    describe('when the token has a v1_user_id and email', function () {
+      beforeEach(function (ctx) {
+        ctx.user.overleaf = { id: 184 }
+        ctx.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
+          data: {
+            v1_user_id: ctx.user.overleaf.id,
+            email: ctx.email,
+          },
+        })
+        ctx.AuthenticationManager.promises.setUserPassword
+          .withArgs(ctx.user, ctx.password)
+          .resolves(true)
+        ctx.OneTimeTokenHandler.expireToken = sinon.stub().callsArgWith(2, null)
+      })
+
+      describe('when no user is reset with this email', function () {
+        beforeEach(function (ctx) {
+          ctx.UserGetter.getUserByMainEmail
+            .withArgs(ctx.email)
+            .yields(null, null)
+        })
+
+        it('should return reset == false', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.PasswordResetHandler.setNewUserPassword(
+              ctx.token,
+              ctx.password,
+              ctx.auditLog,
+              (err, result) => {
+                const { reset } = result
+                expect(err).to.not.exist
+                expect(reset).to.be.false
+                expect(ctx.OneTimeTokenHandler.expireToken.called).to.equal(
+                  false
+                )
+                resolve()
+              }
+            )
+          })
+        })
+      })
+
+      describe("when the email and user don't match", function () {
+        beforeEach(function (ctx) {
+          ctx.UserGetter.getUserByMainEmail.withArgs(ctx.email).yields(null, {
+            _id: ctx.user._id,
+            email: ctx.email,
+            overleaf: { id: 'not-the-same' },
+          })
+        })
+
+        it('should return reset == false', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.PasswordResetHandler.setNewUserPassword(
+              ctx.token,
+              ctx.password,
+              ctx.auditLog,
+              (err, result) => {
+                const { reset } = result
+                expect(err).to.not.exist
+                expect(reset).to.be.false
+                expect(ctx.OneTimeTokenHandler.expireToken.called).to.equal(
+                  false
+                )
+                resolve()
+              }
+            )
+          })
+        })
+      })
+
+      describe('when the email and user match', function () {
+        beforeEach(function (ctx) {
+          ctx.UserGetter.promises.getUserByMainEmail.resolves(ctx.user)
+        })
+
+        it('should return reset == true and the user id', async function (ctx) {
+          await new Promise(resolve => {
+            ctx.PasswordResetHandler.setNewUserPassword(
+              ctx.token,
+              ctx.password,
+              ctx.auditLog,
+              (err, result) => {
+                const { reset, userId } = result
+                expect(err).to.not.exist
+                expect(reset).to.be.true
+                expect(userId).to.equal(ctx.user._id)
+                expect(ctx.OneTimeTokenHandler.expireToken.called).to.equal(
+                  true
+                )
+                resolve()
+              }
+            )
+          })
+        })
+      })
+    })
+  })
+
+  describe('getUserForPasswordResetToken', function () {
+    beforeEach(function (ctx) {
+      ctx.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
+        data: {
+          user_id: ctx.user._id,
+          email: ctx.email,
+        },
+        remainingPeeks: 1,
+      })
+
+      ctx.UserGetter.promises.getUserByMainEmail.resolves({
+        _id: ctx.user._id,
+        email: ctx.email,
+      })
+    })
+
+    it('should returns errors from user permissions', async function (ctx) {
+      let error
+      const err = new Error('nope')
+      ctx.PermissionsManager.promises.assertUserPermissions.rejects(err)
+      try {
+        await ctx.PasswordResetHandler.promises.getUserForPasswordResetToken(
+          'abc123'
+        )
+      } catch (e) {
+        error = e
+      }
+      expect(error).to.deep.equal(error)
+    })
+
+    it('returns user when user has permissions and remaining peaks', async function (ctx) {
+      const result =
+        await ctx.PasswordResetHandler.promises.getUserForPasswordResetToken(
+          'abc123'
+        )
+      expect(result).to.deep.equal({
+        user: { _id: ctx.user._id, email: ctx.email },
+        remainingPeeks: 1,
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/PasswordReset/PasswordResetHandlerTests.mjs b/services/web/test/unit/src/PasswordReset/PasswordResetHandlerTests.mjs
deleted file mode 100644
index b99cc527e2..0000000000
--- a/services/web/test/unit/src/PasswordReset/PasswordResetHandlerTests.mjs
+++ /dev/null
@@ -1,563 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-const modulePath = new URL(
-  '../../../../app/src/Features/PasswordReset/PasswordResetHandler',
-  import.meta.url
-).pathname
-
-describe('PasswordResetHandler', function () {
-  beforeEach(async function () {
-    this.settings = { siteUrl: 'https://www.overleaf.com' }
-    this.OneTimeTokenHandler = {
-      promises: {
-        getNewToken: sinon.stub(),
-        peekValueFromToken: sinon.stub(),
-      },
-      peekValueFromToken: sinon.stub(),
-      expireToken: sinon.stub(),
-    }
-    this.UserGetter = {
-      getUserByMainEmail: sinon.stub(),
-      getUser: sinon.stub(),
-      promises: {
-        getUserByAnyEmail: sinon.stub(),
-        getUserByMainEmail: sinon.stub(),
-      },
-    }
-    this.EmailHandler = { promises: { sendEmail: sinon.stub() } }
-    this.AuthenticationManager = {
-      setUserPasswordInV2: sinon.stub(),
-      promises: {
-        setUserPassword: sinon.stub().resolves(),
-      },
-    }
-    this.PasswordResetHandler = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/User/UserAuditLogHandler':
-        (this.UserAuditLogHandler = {
-          promises: {
-            addEntry: sinon.stub().resolves(),
-          },
-        }),
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/Security/OneTimeTokenHandler':
-        this.OneTimeTokenHandler,
-      '../../../../app/src/Features/Email/EmailHandler': this.EmailHandler,
-      '../../../../app/src/Features/Authentication/AuthenticationManager':
-        this.AuthenticationManager,
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/Features/Authorization/PermissionsManager':
-        (this.PermissionsManager = {
-          promises: {
-            assertUserPermissions: sinon.stub(),
-          },
-        }),
-    })
-    this.token = '12312321i'
-    this.user_id = 'user_id_here'
-    this.user = { email: (this.email = 'bob@bob.com'), _id: this.user_id }
-    this.password = 'my great secret password'
-    this.callback = sinon.stub()
-    // this should not have any effect now
-    this.settings.overleaf = true
-  })
-
-  afterEach(function () {
-    this.settings.overleaf = false
-  })
-
-  describe('generateAndEmailResetToken', function () {
-    it('should check the user exists', function () {
-      this.UserGetter.promises.getUserByAnyEmail.resolves()
-      this.PasswordResetHandler.generateAndEmailResetToken(
-        this.user.email,
-        this.callback
-      )
-      this.UserGetter.promises.getUserByAnyEmail.should.have.been.calledWith(
-        this.user.email
-      )
-    })
-
-    it('should send the email with the token', function (done) {
-      this.UserGetter.promises.getUserByAnyEmail.resolves(this.user)
-      this.OneTimeTokenHandler.promises.getNewToken.resolves(this.token)
-      this.EmailHandler.promises.sendEmail.resolves()
-      this.PasswordResetHandler.generateAndEmailResetToken(
-        this.user.email,
-        (err, status) => {
-          expect(err).to.not.exist
-          this.EmailHandler.promises.sendEmail.called.should.equal(true)
-          status.should.equal('primary')
-          const args = this.EmailHandler.promises.sendEmail.args[0]
-          args[0].should.equal('passwordResetRequested')
-          args[1].setNewPasswordUrl.should.equal(
-            `${this.settings.siteUrl}/user/password/set?passwordResetToken=${
-              this.token
-            }&email=${encodeURIComponent(this.user.email)}`
-          )
-          done()
-        }
-      )
-    })
-
-    it('should return errors from getUserByAnyEmail', function (done) {
-      const err = new Error('oops')
-      this.UserGetter.promises.getUserByAnyEmail.rejects(err)
-      this.PasswordResetHandler.generateAndEmailResetToken(
-        this.user.email,
-        err => {
-          expect(err).to.equal(err)
-          done()
-        }
-      )
-    })
-
-    describe('when the email exists', function () {
-      let result
-      beforeEach(async function () {
-        this.UserGetter.promises.getUserByAnyEmail.resolves(this.user)
-        this.OneTimeTokenHandler.promises.getNewToken.resolves(this.token)
-        this.EmailHandler.promises.sendEmail.resolves()
-        result =
-          await this.PasswordResetHandler.promises.generateAndEmailResetToken(
-            this.email
-          )
-      })
-
-      it('should set the password token data to the user id and email', function () {
-        this.OneTimeTokenHandler.promises.getNewToken.should.have.been.calledWith(
-          'password',
-          {
-            email: this.email,
-            user_id: this.user._id,
-          }
-        )
-      })
-
-      it('should send an email with the token', function () {
-        this.EmailHandler.promises.sendEmail.called.should.equal(true)
-        const args = this.EmailHandler.promises.sendEmail.args[0]
-        args[0].should.equal('passwordResetRequested')
-        args[1].setNewPasswordUrl.should.equal(
-          `${this.settings.siteUrl}/user/password/set?passwordResetToken=${
-            this.token
-          }&email=${encodeURIComponent(this.user.email)}`
-        )
-      })
-
-      it('should return status == true', async function () {
-        expect(result).to.equal('primary')
-      })
-    })
-
-    describe("when the email doesn't exist", function () {
-      let result
-      beforeEach(async function () {
-        this.UserGetter.promises.getUserByAnyEmail.resolves(null)
-        result =
-          await this.PasswordResetHandler.promises.generateAndEmailResetToken(
-            this.email
-          )
-      })
-
-      it('should not set the password token data', function () {
-        this.OneTimeTokenHandler.promises.getNewToken.called.should.equal(false)
-      })
-
-      it('should send an email with the token', function () {
-        this.EmailHandler.promises.sendEmail.called.should.equal(false)
-      })
-
-      it('should return status == null', function () {
-        expect(result).to.equal(null)
-      })
-    })
-
-    describe('when the email is a secondary email', function () {
-      let result
-      beforeEach(async function () {
-        this.UserGetter.promises.getUserByAnyEmail.resolves(this.user)
-        result =
-          await this.PasswordResetHandler.promises.generateAndEmailResetToken(
-            'secondary@email.com'
-          )
-      })
-
-      it('should not set the password token data', function () {
-        this.OneTimeTokenHandler.promises.getNewToken.called.should.equal(false)
-      })
-
-      it('should not send an email with the token', function () {
-        this.EmailHandler.promises.sendEmail.called.should.equal(false)
-      })
-
-      it('should return status == secondary', function () {
-        expect(result).to.equal('secondary')
-      })
-    })
-  })
-
-  describe('setNewUserPassword', function () {
-    beforeEach(function () {
-      this.auditLog = { ip: '0:0:0:0' }
-    })
-    describe('when no data is found', function () {
-      beforeEach(function () {
-        this.OneTimeTokenHandler.promises.peekValueFromToken.resolves(null)
-      })
-
-      it('should return found == false and reset == false', function () {
-        this.PasswordResetHandler.setNewUserPassword(
-          this.token,
-          this.password,
-          this.auditLog,
-          (error, result) => {
-            expect(error).to.not.exist
-            expect(result).to.deep.equal({
-              found: false,
-              reset: false,
-              userId: null,
-            })
-          }
-        )
-      })
-    })
-
-    describe('when the token has a user_id and email', function () {
-      beforeEach(function () {
-        this.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
-          data: {
-            user_id: this.user._id,
-            email: this.email,
-          },
-        })
-        this.AuthenticationManager.promises.setUserPassword
-          .withArgs(this.user, this.password)
-          .resolves(true)
-        this.OneTimeTokenHandler.expireToken = sinon
-          .stub()
-          .callsArgWith(2, null)
-      })
-
-      describe('when no user is found with this email', function () {
-        beforeEach(function () {
-          this.UserGetter.getUserByMainEmail
-            .withArgs(this.email)
-            .yields(null, null)
-        })
-
-        it('should return found == false and reset == false', function (done) {
-          this.PasswordResetHandler.setNewUserPassword(
-            this.token,
-            this.password,
-            this.auditLog,
-            (err, result) => {
-              const { found, reset } = result
-              expect(err).to.not.exist
-              expect(found).to.be.false
-              expect(reset).to.be.false
-              expect(this.OneTimeTokenHandler.expireToken.callCount).to.equal(0)
-              done()
-            }
-          )
-        })
-      })
-
-      describe("when the email and user don't match", function () {
-        beforeEach(function () {
-          this.UserGetter.getUserByMainEmail
-            .withArgs(this.email)
-            .yields(null, { _id: 'not-the-same', email: this.email })
-          this.OneTimeTokenHandler.expireToken.callsArgWith(2, null)
-        })
-
-        it('should return found == false and reset == false', function (done) {
-          this.PasswordResetHandler.setNewUserPassword(
-            this.token,
-            this.password,
-            this.auditLog,
-            (err, result) => {
-              const { found, reset } = result
-              expect(err).to.not.exist
-              expect(found).to.be.false
-              expect(reset).to.be.false
-              expect(this.OneTimeTokenHandler.expireToken.callCount).to.equal(0)
-              done()
-            }
-          )
-        })
-      })
-
-      describe('when the email and user match', function () {
-        describe('success', function () {
-          beforeEach(function () {
-            this.UserGetter.promises.getUserByMainEmail.resolves(this.user)
-            this.OneTimeTokenHandler.expireToken = sinon
-              .stub()
-              .callsArgWith(2, null)
-          })
-
-          it('should update the user audit log', function (done) {
-            this.PasswordResetHandler.setNewUserPassword(
-              this.token,
-              this.password,
-              this.auditLog,
-              (error, result) => {
-                sinon.assert.calledWith(
-                  this.UserAuditLogHandler.promises.addEntry,
-                  this.user_id,
-                  'reset-password',
-                  undefined,
-                  this.auditLog.ip,
-                  { token: this.token.substring(0, 10) }
-                )
-                expect(error).to.not.exist
-                done()
-              }
-            )
-          })
-
-          it('should return reset == true and the user id', function (done) {
-            this.PasswordResetHandler.setNewUserPassword(
-              this.token,
-              this.password,
-              this.auditLog,
-              (err, result) => {
-                const { reset, userId } = result
-                expect(err).to.not.exist
-                expect(reset).to.be.true
-                expect(userId).to.equal(this.user._id)
-                done()
-              }
-            )
-          })
-
-          it('should expire the token', function (done) {
-            this.PasswordResetHandler.setNewUserPassword(
-              this.token,
-              this.password,
-              this.auditLog,
-              (_err, _result) => {
-                expect(this.OneTimeTokenHandler.expireToken.called).to.equal(
-                  true
-                )
-                done()
-              }
-            )
-          })
-
-          describe('when logged in', function () {
-            beforeEach(function () {
-              this.auditLog.initiatorId = this.user_id
-            })
-            it('should update the user audit log with initiatorId', function (done) {
-              this.PasswordResetHandler.setNewUserPassword(
-                this.token,
-                this.password,
-                this.auditLog,
-                (error, result) => {
-                  expect(error).to.not.exist
-                  sinon.assert.calledWith(
-                    this.UserAuditLogHandler.promises.addEntry,
-                    this.user_id,
-                    'reset-password',
-                    this.user_id,
-                    this.auditLog.ip,
-                    { token: this.token.substring(0, 10) }
-                  )
-                  done()
-                }
-              )
-            })
-          })
-        })
-
-        describe('errors', function () {
-          describe('via setUserPassword', function () {
-            beforeEach(function () {
-              this.PasswordResetHandler.promises.getUserForPasswordResetToken =
-                sinon.stub().withArgs(this.token).resolves({ user: this.user })
-              this.AuthenticationManager.promises.setUserPassword
-                .withArgs(this.user, this.password)
-                .rejects()
-            })
-            it('should return the error', function (done) {
-              this.PasswordResetHandler.setNewUserPassword(
-                this.token,
-                this.password,
-                this.auditLog,
-                (error, _result) => {
-                  expect(error).to.exist
-                  expect(
-                    this.UserAuditLogHandler.promises.addEntry.callCount
-                  ).to.equal(1)
-                  done()
-                }
-              )
-            })
-          })
-
-          describe('via UserAuditLogHandler', function () {
-            beforeEach(function () {
-              this.PasswordResetHandler.promises.getUserForPasswordResetToken =
-                sinon.stub().withArgs(this.token).resolves({ user: this.user })
-              this.UserAuditLogHandler.promises.addEntry.rejects(
-                new Error('oops')
-              )
-            })
-            it('should return the error', function (done) {
-              this.PasswordResetHandler.setNewUserPassword(
-                this.token,
-                this.password,
-                this.auditLog,
-                (error, _result) => {
-                  expect(error).to.exist
-                  expect(
-                    this.UserAuditLogHandler.promises.addEntry.callCount
-                  ).to.equal(1)
-                  expect(this.AuthenticationManager.promises.setUserPassword).to
-                    .not.have.been.called
-                  done()
-                }
-              )
-            })
-          })
-        })
-      })
-    })
-
-    describe('when the token has a v1_user_id and email', function () {
-      beforeEach(function () {
-        this.user.overleaf = { id: 184 }
-        this.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
-          data: {
-            v1_user_id: this.user.overleaf.id,
-            email: this.email,
-          },
-        })
-        this.AuthenticationManager.promises.setUserPassword
-          .withArgs(this.user, this.password)
-          .resolves(true)
-        this.OneTimeTokenHandler.expireToken = sinon
-          .stub()
-          .callsArgWith(2, null)
-      })
-
-      describe('when no user is reset with this email', function () {
-        beforeEach(function () {
-          this.UserGetter.getUserByMainEmail
-            .withArgs(this.email)
-            .yields(null, null)
-        })
-
-        it('should return reset == false', function (done) {
-          this.PasswordResetHandler.setNewUserPassword(
-            this.token,
-            this.password,
-            this.auditLog,
-            (err, result) => {
-              const { reset } = result
-              expect(err).to.not.exist
-              expect(reset).to.be.false
-              expect(this.OneTimeTokenHandler.expireToken.called).to.equal(
-                false
-              )
-              done()
-            }
-          )
-        })
-      })
-
-      describe("when the email and user don't match", function () {
-        beforeEach(function () {
-          this.UserGetter.getUserByMainEmail.withArgs(this.email).yields(null, {
-            _id: this.user._id,
-            email: this.email,
-            overleaf: { id: 'not-the-same' },
-          })
-        })
-
-        it('should return reset == false', function (done) {
-          this.PasswordResetHandler.setNewUserPassword(
-            this.token,
-            this.password,
-            this.auditLog,
-            (err, result) => {
-              const { reset } = result
-              expect(err).to.not.exist
-              expect(reset).to.be.false
-              expect(this.OneTimeTokenHandler.expireToken.called).to.equal(
-                false
-              )
-              done()
-            }
-          )
-        })
-      })
-
-      describe('when the email and user match', function () {
-        beforeEach(function () {
-          this.UserGetter.promises.getUserByMainEmail.resolves(this.user)
-        })
-
-        it('should return reset == true and the user id', function (done) {
-          this.PasswordResetHandler.setNewUserPassword(
-            this.token,
-            this.password,
-            this.auditLog,
-            (err, result) => {
-              const { reset, userId } = result
-              expect(err).to.not.exist
-              expect(reset).to.be.true
-              expect(userId).to.equal(this.user._id)
-              expect(this.OneTimeTokenHandler.expireToken.called).to.equal(true)
-              done()
-            }
-          )
-        })
-      })
-    })
-  })
-
-  describe('getUserForPasswordResetToken', function () {
-    beforeEach(function () {
-      this.OneTimeTokenHandler.promises.peekValueFromToken.resolves({
-        data: {
-          user_id: this.user._id,
-          email: this.email,
-        },
-        remainingPeeks: 1,
-      })
-
-      this.UserGetter.promises.getUserByMainEmail.resolves({
-        _id: this.user._id,
-        email: this.email,
-      })
-    })
-
-    it('should returns errors from user permissions', async function () {
-      let error
-      const err = new Error('nope')
-      this.PermissionsManager.promises.assertUserPermissions.rejects(err)
-      try {
-        await this.PasswordResetHandler.promises.getUserForPasswordResetToken(
-          'abc123'
-        )
-      } catch (e) {
-        error = e
-      }
-      expect(error).to.deep.equal(error)
-    })
-
-    it('returns user when user has permissions and remaining peaks', async function () {
-      const result =
-        await this.PasswordResetHandler.promises.getUserForPasswordResetToken(
-          'abc123'
-        )
-      expect(result).to.deep.equal({
-        user: { _id: this.user._id, email: this.email },
-        remainingPeeks: 1,
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Project/DocLinesComparitorTests.mjs b/services/web/test/unit/src/Project/DocLinesComparitor.test.mjs
similarity index 68%
rename from services/web/test/unit/src/Project/DocLinesComparitorTests.mjs
rename to services/web/test/unit/src/Project/DocLinesComparitor.test.mjs
index 4f1f3b4f5f..55c4187f83 100644
--- a/services/web/test/unit/src/Project/DocLinesComparitorTests.mjs
+++ b/services/web/test/unit/src/Project/DocLinesComparitor.test.mjs
@@ -1,16 +1,14 @@
-import esmock from 'esmock'
-
 const modulePath = '../../../../app/src/Features/Project/DocLinesComparitor.mjs'
 
 describe('doc lines comparitor', function () {
-  beforeEach(async function () {
-    this.comparitor = await esmock.strict(modulePath, {})
+  beforeEach(async function (ctx) {
+    ctx.comparitor = (await import(modulePath)).default
   })
 
-  it('should return true when the lines are the same', function () {
+  it('should return true when the lines are the same', function (ctx) {
     const lines1 = ['hello', 'world']
     const lines2 = ['hello', 'world']
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(true)
   })
   ;[
@@ -23,58 +21,58 @@ describe('doc lines comparitor', function () {
       lines2: ['hello', 'wrld'],
     },
   ].forEach(({ lines1, lines2 }) => {
-    it('should return false when the lines are different', function () {
-      const result = this.comparitor.areSame(lines1, lines2)
+    it('should return false when the lines are different', function (ctx) {
+      const result = ctx.comparitor.areSame(lines1, lines2)
       result.should.equal(false)
     })
   })
 
-  it('should return true when the lines are same', function () {
+  it('should return true when the lines are same', function (ctx) {
     const lines1 = ['hello', 'world']
     const lines2 = ['hello', 'world']
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(true)
   })
 
-  it('should return false if the doc lines are different in length', function () {
+  it('should return false if the doc lines are different in length', function (ctx) {
     const lines1 = ['hello', 'world']
     const lines2 = ['hello', 'world', 'please']
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(false)
   })
 
-  it('should return false if the first array is undefined', function () {
+  it('should return false if the first array is undefined', function (ctx) {
     const lines1 = undefined
     const lines2 = ['hello', 'world']
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(false)
   })
 
-  it('should return false if the second array is undefined', function () {
+  it('should return false if the second array is undefined', function (ctx) {
     const lines1 = ['hello']
     const lines2 = undefined
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(false)
   })
 
-  it('should return false if the second array is not an array', function () {
+  it('should return false if the second array is not an array', function (ctx) {
     const lines1 = ['hello']
     const lines2 = ''
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(false)
   })
 
-  it('should return true when comparing equal orchard docs', function () {
+  it('should return true when comparing equal orchard docs', function (ctx) {
     const lines1 = [{ text: 'hello world' }]
     const lines2 = [{ text: 'hello world' }]
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(true)
   })
 
-  it('should return false when comparing different orchard docs', function () {
+  it('should return false when comparing different orchard docs', function (ctx) {
     const lines1 = [{ text: 'goodbye world' }]
     const lines2 = [{ text: 'hello world' }]
-    const result = this.comparitor.areSame(lines1, lines2)
+    const result = ctx.comparitor.areSame(lines1, lines2)
     result.should.equal(false)
   })
 })
diff --git a/services/web/test/unit/src/Project/ProjectApiController.test.mjs b/services/web/test/unit/src/Project/ProjectApiController.test.mjs
new file mode 100644
index 0000000000..f23a81280e
--- /dev/null
+++ b/services/web/test/unit/src/Project/ProjectApiController.test.mjs
@@ -0,0 +1,57 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+
+const modulePath = '../../../../app/src/Features/Project/ProjectApiController'
+
+describe('Project api controller', function () {
+  beforeEach(async function (ctx) {
+    ctx.ProjectDetailsHandler = { getDetails: sinon.stub() }
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectDetailsHandler',
+      () => ({
+        default: ctx.ProjectDetailsHandler,
+      })
+    )
+
+    ctx.controller = (await import(modulePath)).default
+    ctx.project_id = '321l3j1kjkjl'
+    ctx.req = {
+      params: {
+        project_id: ctx.project_id,
+      },
+      session: {
+        destroy: sinon.stub(),
+      },
+    }
+    ctx.res = {}
+    ctx.next = sinon.stub()
+    return (ctx.projDetails = { name: 'something' })
+  })
+
+  describe('getProjectDetails', function () {
+    it('should ask the project details handler for proj details', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.ProjectDetailsHandler.getDetails.callsArgWith(
+          1,
+          null,
+          ctx.projDetails
+        )
+        ctx.res.json = data => {
+          ctx.ProjectDetailsHandler.getDetails
+            .calledWith(ctx.project_id)
+            .should.equal(true)
+          data.should.deep.equal(ctx.projDetails)
+          return resolve()
+        }
+        return ctx.controller.getProjectDetails(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send a 500 if there is an error', function (ctx) {
+      ctx.ProjectDetailsHandler.getDetails.callsArgWith(1, 'error')
+      ctx.controller.getProjectDetails(ctx.req, ctx.res, ctx.next)
+      return ctx.next.calledWith('error').should.equal(true)
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Project/ProjectApiControllerTests.mjs b/services/web/test/unit/src/Project/ProjectApiControllerTests.mjs
deleted file mode 100644
index bda54a932c..0000000000
--- a/services/web/test/unit/src/Project/ProjectApiControllerTests.mjs
+++ /dev/null
@@ -1,57 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import esmock from 'esmock'
-import sinon from 'sinon'
-
-const modulePath = '../../../../app/src/Features/Project/ProjectApiController'
-
-describe('Project api controller', function () {
-  beforeEach(async function () {
-    this.ProjectDetailsHandler = { getDetails: sinon.stub() }
-    this.controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Project/ProjectDetailsHandler':
-        this.ProjectDetailsHandler,
-    })
-    this.project_id = '321l3j1kjkjl'
-    this.req = {
-      params: {
-        project_id: this.project_id,
-      },
-      session: {
-        destroy: sinon.stub(),
-      },
-    }
-    this.res = {}
-    this.next = sinon.stub()
-    return (this.projDetails = { name: 'something' })
-  })
-
-  describe('getProjectDetails', function () {
-    it('should ask the project details handler for proj details', function (done) {
-      this.ProjectDetailsHandler.getDetails.callsArgWith(
-        1,
-        null,
-        this.projDetails
-      )
-      this.res.json = data => {
-        this.ProjectDetailsHandler.getDetails
-          .calledWith(this.project_id)
-          .should.equal(true)
-        data.should.deep.equal(this.projDetails)
-        return done()
-      }
-      return this.controller.getProjectDetails(this.req, this.res)
-    })
-
-    it('should send a 500 if there is an error', function () {
-      this.ProjectDetailsHandler.getDetails.callsArgWith(1, 'error')
-      this.controller.getProjectDetails(this.req, this.res, this.next)
-      return this.next.calledWith('error').should.equal(true)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Project/ProjectControllerTests.js b/services/web/test/unit/src/Project/ProjectControllerTests.js
index 71de5023b1..0acd900b90 100644
--- a/services/web/test/unit/src/Project/ProjectControllerTests.js
+++ b/services/web/test/unit/src/Project/ProjectControllerTests.js
@@ -201,9 +201,6 @@ describe('ProjectController', function () {
         getCurrentAffiliations: sinon.stub().resolves([]),
       },
     }
-    this.SubscriptionViewModelBuilder = {
-      getBestSubscription: sinon.stub().yields(null, { type: 'free' }),
-    }
     this.SurveyHandler = {
       getSurvey: sinon.stub().yields(null, {}),
     }
@@ -303,6 +300,7 @@ describe('ProjectController', function () {
         translate() {},
       },
       ip: '192.170.18.1',
+      capabilitySet: new Set(['chat']),
     }
     this.res = {
       locals: {
@@ -1088,72 +1086,12 @@ describe('ProjectController', function () {
       this.ProjectController.loadEditor(this.req, this.res)
     })
 
-    describe('chatEnabled flag', function () {
-      it('should be set to false when the feature is disabled', function (done) {
+    describe('capabilitySet', function () {
+      it('should be passed as an array when loading the editor', function (done) {
         this.Features.hasFeature = sinon.stub().withArgs('chat').returns(false)
 
         this.res.render = (pageName, opts) => {
-          expect(opts.chatEnabled).to.be.false
-          done()
-        }
-        this.ProjectController.loadEditor(this.req, this.res)
-      })
-
-      it('should be set to false when the feature is enabled but the capability is not available', function (done) {
-        this.Features.hasFeature = sinon.stub().withArgs('chat').returns(false)
-        this.req.capabilitySet = new Set()
-
-        this.res.render = (pageName, opts) => {
-          expect(opts.chatEnabled).to.be.false
-          done()
-        }
-        this.ProjectController.loadEditor(this.req, this.res)
-      })
-
-      it('should be set to true when the feature is enabled and the capability is available', function (done) {
-        this.Features.hasFeature = sinon.stub().withArgs('chat').returns(true)
-        this.req.capabilitySet = new Set(['chat'])
-
-        this.res.render = (pageName, opts) => {
-          expect(opts.chatEnabled).to.be.true
-          done()
-        }
-        this.ProjectController.loadEditor(this.req, this.res)
-      })
-    })
-
-    describe('when fetching the users featureSet', function () {
-      beforeEach(function () {
-        this.Modules.promises.hooks.fire = sinon.stub().resolves()
-        this.user.features = {}
-      })
-
-      it('should take into account features overrides from modules', function (done) {
-        // this case occurs when the user has bought the ai bundle on WF, which should include our error assistant
-        const bundleFeatures = { aiErrorAssistant: true }
-        this.user.features = { aiErrorAssistant: false }
-        this.Modules.promises.hooks.fire = sinon
-          .stub()
-          .resolves([bundleFeatures])
-        this.res.render = (pageName, opts) => {
-          expect(opts.user.features).to.deep.equal(bundleFeatures)
-          this.Modules.promises.hooks.fire.should.have.been.calledWith(
-            'getModuleProvidedFeatures',
-            this.user._id
-          )
-          done()
-        }
-        this.ProjectController.loadEditor(this.req, this.res)
-      })
-
-      it('should handle modules not returning any features', function (done) {
-        this.Modules.promises.hooks.fire = sinon.stub().resolves([])
-        this.res.render = (pageName, opts) => {
-          expect(opts.user.features).to.deep.equal({})
-          this.Modules.promises.hooks.fire.should.have.been.calledWith(
-            'getModuleProvidedFeatures',
-            this.user._id
-          )
+          expect(opts.capabilities).to.deep.equal(['chat'])
           done()
         }
         this.ProjectController.loadEditor(this.req, this.res)
diff --git a/services/web/test/unit/src/Project/ProjectDeleterTests.js b/services/web/test/unit/src/Project/ProjectDeleterTests.js
index 9e05a0f1a0..ee01037d14 100644
--- a/services/web/test/unit/src/Project/ProjectDeleterTests.js
+++ b/services/web/test/unit/src/Project/ProjectDeleterTests.js
@@ -36,6 +36,7 @@ describe('ProjectDeleter', function () {
           deleterId: '588f3ddae8ebc1bac07c9fa4',
           deleterIpAddress: '172.19.0.1',
           deletedProjectId: '5cf9270b4eff6e186cf8b05e',
+          deletedProjectOwnerId: this.user._id,
         },
         project: {
           _id: '5cf9270b4eff6e186cf8b05e',
@@ -94,15 +95,7 @@ describe('ProjectDeleter', function () {
       },
     }
 
-    this.ProjectHelper = {
-      calculateArchivedArray: sinon.stub(),
-    }
-
     this.db = {
-      deletedFiles: {
-        indexExists: sinon.stub().resolves(false),
-        deleteMany: sinon.stub(),
-      },
       projects: {
         insertOne: sinon.stub().resolves(),
       },
@@ -146,7 +139,6 @@ describe('ProjectDeleter', function () {
         '../../infrastructure/Features': this.Features,
         '../Editor/EditorRealTimeController': this.EditorRealTimeController,
         '../../models/Project': { Project },
-        './ProjectHelper': this.ProjectHelper,
         '../../models/DeletedProject': { DeletedProject },
         '../DocumentUpdater/DocumentUpdaterHandler':
           this.DocumentUpdaterHandler,
@@ -505,6 +497,16 @@ describe('ProjectDeleter', function () {
           projectId: this.deletedProjects[0].project._id,
         })
       })
+
+      it('should log a completed deletion', async function () {
+        expect(this.logger.info).to.have.been.calledWith(
+          {
+            projectId: this.deletedProjects[0].project._id,
+            userId: this.user._id,
+          },
+          'expired deleted project successfully'
+        )
+      })
     })
 
     describe('on an active project (from an incomplete delete)', function () {
@@ -552,19 +554,11 @@ describe('ProjectDeleter', function () {
 
   describe('archiveProject', function () {
     beforeEach(function () {
-      const archived = [new ObjectId(this.user._id)]
-      this.ProjectHelper.calculateArchivedArray.returns(archived)
-
-      this.ProjectMock.expects('findOne')
-        .withArgs({ _id: this.project._id })
-        .chain('exec')
-        .resolves(this.project)
-
       this.ProjectMock.expects('updateOne')
         .withArgs(
           { _id: this.project._id },
           {
-            $set: { archived },
+            $addToSet: { archived: new ObjectId(this.user._id) },
             $pull: { trashed: new ObjectId(this.user._id) },
           }
         )
@@ -578,32 +572,15 @@ describe('ProjectDeleter', function () {
       )
       this.ProjectMock.verify()
     })
-
-    it('calculates the archived array', async function () {
-      await this.ProjectDeleter.promises.archiveProject(
-        this.project._id,
-        this.user._id
-      )
-      expect(this.ProjectHelper.calculateArchivedArray).to.have.been.calledWith(
-        this.project,
-        this.user._id,
-        'ARCHIVE'
-      )
-    })
   })
 
   describe('unarchiveProject', function () {
     beforeEach(function () {
-      const archived = [new ObjectId(this.user._id)]
-      this.ProjectHelper.calculateArchivedArray.returns(archived)
-
-      this.ProjectMock.expects('findOne')
-        .withArgs({ _id: this.project._id })
-        .chain('exec')
-        .resolves(this.project)
-
       this.ProjectMock.expects('updateOne')
-        .withArgs({ _id: this.project._id }, { $set: { archived } })
+        .withArgs(
+          { _id: this.project._id },
+          { $pull: { archived: new ObjectId(this.user._id) } }
+        )
         .resolves()
     })
 
@@ -614,36 +591,16 @@ describe('ProjectDeleter', function () {
       )
       this.ProjectMock.verify()
     })
-
-    it('calculates the archived array', async function () {
-      await this.ProjectDeleter.promises.unarchiveProject(
-        this.project._id,
-        this.user._id
-      )
-      expect(this.ProjectHelper.calculateArchivedArray).to.have.been.calledWith(
-        this.project,
-        this.user._id,
-        'UNARCHIVE'
-      )
-    })
   })
 
   describe('trashProject', function () {
     beforeEach(function () {
-      const archived = [new ObjectId(this.user._id)]
-      this.ProjectHelper.calculateArchivedArray.returns(archived)
-
-      this.ProjectMock.expects('findOne')
-        .withArgs({ _id: this.project._id })
-        .chain('exec')
-        .resolves(this.project)
-
       this.ProjectMock.expects('updateOne')
         .withArgs(
           { _id: this.project._id },
           {
             $addToSet: { trashed: new ObjectId(this.user._id) },
-            $set: { archived },
+            $pull: { archived: new ObjectId(this.user._id) },
           }
         )
         .resolves()
@@ -656,27 +613,10 @@ describe('ProjectDeleter', function () {
       )
       this.ProjectMock.verify()
     })
-
-    it('unarchives the project', async function () {
-      await this.ProjectDeleter.promises.trashProject(
-        this.project._id,
-        this.user._id
-      )
-      expect(this.ProjectHelper.calculateArchivedArray).to.have.been.calledWith(
-        this.project,
-        this.user._id,
-        'UNARCHIVE'
-      )
-    })
   })
 
   describe('untrashProject', function () {
     beforeEach(function () {
-      this.ProjectMock.expects('findOne')
-        .withArgs({ _id: this.project._id })
-        .chain('exec')
-        .resolves(this.project)
-
       this.ProjectMock.expects('updateOne')
         .withArgs(
           { _id: this.project._id },
diff --git a/services/web/test/unit/src/Project/ProjectDuplicatorTests.js b/services/web/test/unit/src/Project/ProjectDuplicatorTests.js
index 1a49171163..8a2006a907 100644
--- a/services/web/test/unit/src/Project/ProjectDuplicatorTests.js
+++ b/services/web/test/unit/src/Project/ProjectDuplicatorTests.js
@@ -245,6 +245,9 @@ describe('ProjectDuplicator', function () {
         '../Tags/TagsHandler': this.TagsHandler,
         '../History/HistoryManager': this.HistoryManager,
         '../../infrastructure/Features': this.Features,
+        '../Compile/ClsiCacheManager': {
+          prepareClsiCache: sinon.stub().rejects(new Error('ignore this')),
+        },
       },
     })
   })
diff --git a/services/web/test/unit/src/Project/ProjectEditorHandlerTests.js b/services/web/test/unit/src/Project/ProjectEditorHandlerTests.js
index 8e78ea5168..8456fe2227 100644
--- a/services/web/test/unit/src/Project/ProjectEditorHandlerTests.js
+++ b/services/web/test/unit/src/Project/ProjectEditorHandlerTests.js
@@ -8,6 +8,7 @@ describe('ProjectEditorHandler', function () {
   beforeEach(function () {
     this.project = {
       _id: 'project-id',
+      owner_ref: 'owner-id',
       name: 'Project Name',
       rootDoc_id: 'file-id',
       publicAccesLevel: 'private',
@@ -42,24 +43,20 @@ describe('ProjectEditorHandler', function () {
           ],
         },
       ],
-      deletedDocs: [
-        {
-          _id: 'deleted-doc-id',
-          name: 'main.tex',
-          deletedAt: (this.deletedAt = new Date('2017-01-01')),
+    }
+    this.ownerMember = {
+      user: (this.owner = {
+        _id: 'owner-id',
+        first_name: 'Owner',
+        last_name: 'Overleaf',
+        email: 'owner@overleaf.com',
+        features: {
+          compileTimeout: 240,
         },
-      ],
+      }),
+      privilegeLevel: 'owner',
     }
     this.members = [
-      {
-        user: (this.owner = {
-          _id: 'owner-id',
-          first_name: 'Owner',
-          last_name: 'Overleaf',
-          email: 'owner@overleaf.com',
-        }),
-        privilegeLevel: 'owner',
-      },
       {
         user: {
           _id: 'read-only-id',
@@ -95,9 +92,6 @@ describe('ProjectEditorHandler', function () {
         token: 'my-secret-token2',
       },
     ]
-    this.deletedDocsFromDocstore = [
-      { _id: 'deleted-doc-id-from-docstore', name: 'docstore.tex' },
-    ]
     this.handler = SandboxedModule.require(modulePath)
   })
 
@@ -106,9 +100,10 @@ describe('ProjectEditorHandler', function () {
       beforeEach(function () {
         this.result = this.handler.buildProjectModelView(
           this.project,
+          this.ownerMember,
           this.members,
           this.invites,
-          this.deletedDocsFromDocstore
+          false
         )
       })
 
@@ -141,18 +136,6 @@ describe('ProjectEditorHandler', function () {
         this.result.owner.privileges.should.equal('owner')
       })
 
-      it('should include the deletedDocs', function () {
-        expect(this.result.deletedDocs).to.exist
-        this.result.deletedDocs.should.deep.equal([
-          {
-            // omit deletedAt field
-            _id: this.project.deletedDocs[0]._id,
-            name: this.project.deletedDocs[0].name,
-          },
-          this.deletedDocsFromDocstore[0],
-        ])
-      })
-
       it('should gather readOnly_refs and collaberators_refs into a list of members', function () {
         const findMember = id => {
           for (const member of this.result.members) {
@@ -229,25 +212,92 @@ describe('ProjectEditorHandler', function () {
           expect(invite.token).not.to.exist
         }
       })
+
+      it('should have the correct features', function () {
+        expect(this.result.features.compileTimeout).to.equal(240)
+      })
     })
 
-    describe('when docstore sends a deleted doc that is also present in the project', function () {
+    describe('with a restricted user', function () {
       beforeEach(function () {
-        this.deletedDocsFromDocstore.push(this.project.deletedDocs[0])
         this.result = this.handler.buildProjectModelView(
           this.project,
-          this.members,
-          this.invites,
-          this.deletedDocsFromDocstore
+          this.ownerMember,
+          [],
+          [],
+          true
         )
       })
 
-      it('should not send any duplicate', function () {
-        expect(this.result.deletedDocs).to.exist
-        this.result.deletedDocs.should.deep.equal([
-          this.project.deletedDocs[0],
-          this.deletedDocsFromDocstore[0],
-        ])
+      it('should include the id', function () {
+        expect(this.result._id).to.exist
+        this.result._id.should.equal('project-id')
+      })
+
+      it('should include the name', function () {
+        expect(this.result.name).to.exist
+        this.result.name.should.equal('Project Name')
+      })
+
+      it('should include the root doc id', function () {
+        expect(this.result.rootDoc_id).to.exist
+        this.result.rootDoc_id.should.equal('file-id')
+      })
+
+      it('should include the public access level', function () {
+        expect(this.result.publicAccesLevel).to.exist
+        this.result.publicAccesLevel.should.equal('private')
+      })
+
+      it('should hide the owner', function () {
+        expect(this.result.owner).to.deep.equal({ _id: 'owner-id' })
+      })
+
+      it('should hide members', function () {
+        this.result.members.length.should.equal(0)
+      })
+
+      it('should include folders in the project', function () {
+        this.result.rootFolder[0]._id.should.equal('root-folder-id')
+        this.result.rootFolder[0].name.should.equal('')
+
+        this.result.rootFolder[0].folders[0]._id.should.equal('sub-folder-id')
+        this.result.rootFolder[0].folders[0].name.should.equal('folder')
+      })
+
+      it('should not duplicate folder contents', function () {
+        this.result.rootFolder[0].docs.length.should.equal(0)
+        this.result.rootFolder[0].fileRefs.length.should.equal(0)
+      })
+
+      it('should include files in the project', function () {
+        this.result.rootFolder[0].folders[0].fileRefs[0]._id.should.equal(
+          'file-id'
+        )
+        this.result.rootFolder[0].folders[0].fileRefs[0].name.should.equal(
+          'image.png'
+        )
+        this.result.rootFolder[0].folders[0].fileRefs[0].created.should.equal(
+          this.created
+        )
+        expect(this.result.rootFolder[0].folders[0].fileRefs[0].size).not.to
+          .exist
+      })
+
+      it('should include docs in the project but not the lines', function () {
+        this.result.rootFolder[0].folders[0].docs[0]._id.should.equal('doc-id')
+        this.result.rootFolder[0].folders[0].docs[0].name.should.equal(
+          'main.tex'
+        )
+        expect(this.result.rootFolder[0].folders[0].docs[0].lines).not.to.exist
+      })
+
+      it('should hide invites', function () {
+        expect(this.result.invites).to.have.length(0)
+      })
+
+      it('should have the correct features', function () {
+        expect(this.result.features.compileTimeout).to.equal(240)
       })
     })
 
@@ -256,9 +306,10 @@ describe('ProjectEditorHandler', function () {
         delete this.project.deletedByExternalDataSource
         const result = this.handler.buildProjectModelView(
           this.project,
+          this.ownerMember,
           this.members,
           [],
-          []
+          false
         )
         result.deletedByExternalDataSource.should.equal(false)
       })
@@ -266,9 +317,10 @@ describe('ProjectEditorHandler', function () {
       it('should set the deletedByExternalDataSource flag to false when it is false', function () {
         const result = this.handler.buildProjectModelView(
           this.project,
+          this.ownerMember,
           this.members,
           [],
-          []
+          false
         )
         result.deletedByExternalDataSource.should.equal(false)
       })
@@ -277,9 +329,10 @@ describe('ProjectEditorHandler', function () {
         this.project.deletedByExternalDataSource = true
         const result = this.handler.buildProjectModelView(
           this.project,
+          this.ownerMember,
           this.members,
           [],
-          []
+          false
         )
         result.deletedByExternalDataSource.should.equal(true)
       })
@@ -295,9 +348,10 @@ describe('ProjectEditorHandler', function () {
         }
         this.result = this.handler.buildProjectModelView(
           this.project,
+          this.ownerMember,
           this.members,
           [],
-          []
+          false
         )
       })
 
@@ -325,9 +379,10 @@ describe('ProjectEditorHandler', function () {
           }
           this.result = this.handler.buildProjectModelView(
             this.project,
+            this.ownerMember,
             this.members,
             [],
-            []
+            false
           )
         })
         it('should not emit trackChangesState', function () {
@@ -350,9 +405,10 @@ describe('ProjectEditorHandler', function () {
               this.project.track_changes = dbEntry
               this.result = this.handler.buildProjectModelView(
                 this.project,
+                this.ownerMember,
                 this.members,
                 [],
-                []
+                false
               )
             })
             it(`should set trackChangesState=${expected}`, function () {
@@ -371,66 +427,4 @@ describe('ProjectEditorHandler', function () {
       })
     })
   })
-
-  describe('buildOwnerAndMembersViews', function () {
-    beforeEach(function () {
-      this.owner.features = {
-        versioning: true,
-        collaborators: 3,
-        compileGroup: 'priority',
-        compileTimeout: 22,
-      }
-      this.result = this.handler.buildOwnerAndMembersViews(this.members)
-    })
-
-    it('should produce an object with the right keys', function () {
-      expect(this.result).to.have.all.keys([
-        'owner',
-        'ownerFeatures',
-        'members',
-      ])
-    })
-
-    it('should separate the owner from the members', function () {
-      this.result.members.length.should.equal(this.members.length - 1)
-      expect(this.result.owner._id).to.equal(this.owner._id)
-      expect(this.result.owner.email).to.equal(this.owner.email)
-      expect(
-        this.result.members.filter(m => m._id === this.owner._id).length
-      ).to.equal(0)
-    })
-
-    it('should extract the ownerFeatures from the owner object', function () {
-      expect(this.result.ownerFeatures).to.deep.equal(this.owner.features)
-    })
-
-    describe('when there is no owner', function () {
-      beforeEach(function () {
-        // remove the owner from members list
-        this.membersWithoutOwner = this.members.filter(
-          m => m.user._id !== this.owner._id
-        )
-        this.result = this.handler.buildOwnerAndMembersViews(
-          this.membersWithoutOwner
-        )
-      })
-
-      it('should produce an object with the right keys', function () {
-        expect(this.result).to.have.all.keys([
-          'owner',
-          'ownerFeatures',
-          'members',
-        ])
-      })
-
-      it('should not separate out an owner', function () {
-        this.result.members.length.should.equal(this.membersWithoutOwner.length)
-        expect(this.result.owner).to.equal(null)
-      })
-
-      it('should not extract the ownerFeatures from the owner object', function () {
-        expect(this.result.ownerFeatures).to.equal(null)
-      })
-    })
-  })
 })
diff --git a/services/web/test/unit/src/Project/ProjectEntityHandlerTests.js b/services/web/test/unit/src/Project/ProjectEntityHandlerTests.js
index f3cc6e0c06..8221ae6c7e 100644
--- a/services/web/test/unit/src/Project/ProjectEntityHandlerTests.js
+++ b/services/web/test/unit/src/Project/ProjectEntityHandlerTests.js
@@ -430,14 +430,15 @@ describe('ProjectEntityHandler', function () {
       })
     })
 
-    it('should call the callback with the lines, version and rev', function (done) {
-      this.ProjectEntityHandler.getDoc(projectId, docId, doc => {
-        this.DocstoreManager.promises.getDoc
-          .calledWith(projectId, docId)
-          .should.equal(true)
-        expect(doc).to.exist
-        done()
-      })
+    it('should call the callback with the lines, version and rev', async function () {
+      const doc = await this.ProjectEntityHandler.promises.getDoc(
+        projectId,
+        docId
+      )
+      this.DocstoreManager.promises.getDoc
+        .calledWith(projectId, docId)
+        .should.equal(true)
+      expect(doc).to.exist
     })
   })
 
diff --git a/services/web/test/unit/src/Project/ProjectEntityMongoUpdateHandlerTests.js b/services/web/test/unit/src/Project/ProjectEntityMongoUpdateHandlerTests.js
index 53b459ff05..ce6fa4ccc6 100644
--- a/services/web/test/unit/src/Project/ProjectEntityMongoUpdateHandlerTests.js
+++ b/services/web/test/unit/src/Project/ProjectEntityMongoUpdateHandlerTests.js
@@ -4,7 +4,6 @@ const tk = require('timekeeper')
 const Errors = require('../../../../app/src/Features/Errors/Errors')
 const { ObjectId } = require('mongodb-legacy')
 const SandboxedModule = require('sandboxed-module')
-const { DeletedFile } = require('../helpers/models/DeletedFile')
 const { Project } = require('../helpers/models/Project')
 
 const MODULE_PATH =
@@ -12,6 +11,7 @@ const MODULE_PATH =
 
 describe('ProjectEntityMongoUpdateHandler', function () {
   beforeEach(function () {
+    tk.freeze(new Date())
     this.doc = {
       _id: new ObjectId(),
       name: 'test-doc.txt',
@@ -76,7 +76,6 @@ describe('ProjectEntityMongoUpdateHandler', function () {
     }
 
     this.FolderModel = sinon.stub()
-    this.DeletedFileMock = sinon.mock(DeletedFile)
     this.ProjectMock = sinon.mock(Project)
     this.ProjectEntityHandler = {
       getAllEntitiesFromProject: sinon.stub(),
@@ -196,7 +195,6 @@ describe('ProjectEntityMongoUpdateHandler', function () {
         '../Cooldown/CooldownManager': this.CooldownManager,
         '../../models/Folder': { Folder: this.FolderModel },
         '../../infrastructure/LockManager': this.LockManager,
-        '../../models/DeletedFile': { DeletedFile },
         '../../models/Project': { Project },
         './ProjectEntityHandler': this.ProjectEntityHandler,
         './ProjectLocator': this.ProjectLocator,
@@ -207,21 +205,14 @@ describe('ProjectEntityMongoUpdateHandler', function () {
   })
 
   afterEach(function () {
-    this.DeletedFileMock.restore()
     this.ProjectMock.restore()
-  })
-
-  beforeEach(function () {
-    tk.freeze(Date.now())
-  })
-
-  afterEach(function () {
     tk.reset()
   })
 
   describe('addDoc', function () {
     beforeEach(async function () {
       const doc = { _id: new ObjectId(), name: 'other.txt' }
+      const userId = new ObjectId().toString()
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
           {
@@ -231,6 +222,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           {
             $push: { 'rootFolder.0.folders.0.docs': doc },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           }
         )
         .chain('exec')
@@ -238,7 +230,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       this.result = await this.subject.promises.addDoc(
         this.project._id,
         this.folder._id,
-        doc
+        doc,
+        userId
       )
     })
 
@@ -260,7 +253,9 @@ describe('ProjectEntityMongoUpdateHandler', function () {
   })
 
   describe('addFile', function () {
+    let userId
     beforeEach(function () {
+      userId = new ObjectId().toString()
       this.newFile = { _id: new ObjectId(), name: 'picture.jpg' }
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
@@ -271,6 +266,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           {
             $push: { 'rootFolder.0.folders.0.fileRefs': this.newFile },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           }
         )
         .chain('exec')
@@ -282,7 +278,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
         this.result = await this.subject.promises.addFile(
           this.project._id,
           this.folder._id,
-          this.newFile
+          this.newFile,
+          userId
         )
       })
 
@@ -318,7 +315,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           this.subject.promises.addFile(
             this.project._id,
             this.folder._id,
-            this.newFile
+            this.newFile,
+            userId
           )
         ).to.be.rejected
       })
@@ -327,6 +325,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
   describe('addFolder', function () {
     beforeEach(async function () {
+      const userId = new ObjectId().toString()
       const folderName = 'New folder'
       this.FolderModel.withArgs({ name: folderName }).returns({
         _id: new ObjectId(),
@@ -345,6 +344,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
               }),
             },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           }
         )
         .chain('exec')
@@ -352,7 +352,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       await this.subject.promises.addFolder(
         this.project._id,
         this.folder._id,
-        folderName
+        folderName,
+        userId
       )
     })
 
@@ -369,17 +370,6 @@ describe('ProjectEntityMongoUpdateHandler', function () {
         linkedFileData: { some: 'data' },
         hash: 'some-hash',
       }
-      // Add a deleted file record
-      this.DeletedFileMock.expects('create')
-        .withArgs({
-          projectId: this.project._id,
-          _id: this.file._id,
-          name: this.file.name,
-          linkedFileData: this.file.linkedFileData,
-          hash: this.file.hash,
-          deletedAt: sinon.match.date,
-        })
-        .resolves()
       // Update the file in place
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
@@ -393,6 +383,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
               'rootFolder.0.fileRefs.0.created': sinon.match.date,
               'rootFolder.0.fileRefs.0.linkedFileData': newFile.linkedFileData,
               'rootFolder.0.fileRefs.0.hash': newFile.hash,
+              lastUpdated: new Date(),
+              lastUpdatedBy: 'userId',
             },
             $inc: {
               version: 1,
@@ -408,12 +400,12 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       await this.subject.promises.replaceFileWithNew(
         this.project._id,
         this.file._id,
-        newFile
+        newFile,
+        'userId'
       )
     })
 
     it('updates the database', function () {
-      this.DeletedFileMock.verify()
       this.ProjectMock.verify()
     })
   })
@@ -460,6 +452,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
     describe('when the path is a new folder at the top level', function () {
       beforeEach(async function () {
+        const userId = new ObjectId().toString()
         this.newFolder = { _id: new ObjectId(), name: 'new-folder' }
         this.FolderModel.returns(this.newFolder)
         this.exactCaseMatch = false
@@ -469,6 +462,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             {
               $push: { 'rootFolder.0.folders': this.newFolder },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -476,6 +470,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
         this.result = await this.subject.promises.mkdirp(
           this.project._id,
           '/new-folder/',
+          userId,
           { exactCaseMatch: this.exactCaseMatch }
         )
       })
@@ -504,6 +499,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
     describe('adding a subfolder', function () {
       beforeEach(async function () {
+        const userId = new ObjectId().toString()
         this.newFolder = { _id: new ObjectId(), name: 'new-folder' }
         this.FolderModel.returns(this.newFolder)
         this.ProjectMock.expects('findOneAndUpdate')
@@ -519,13 +515,15 @@ describe('ProjectEntityMongoUpdateHandler', function () {
                 }),
               },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
           .resolves(this.project)
         this.result = await this.subject.promises.mkdirp(
           this.project._id,
-          '/test-folder/new-folder'
+          '/test-folder/new-folder',
+          userId
         )
       })
 
@@ -547,7 +545,9 @@ describe('ProjectEntityMongoUpdateHandler', function () {
     })
 
     describe('when mutliple folders are missing', async function () {
+      let userId
       beforeEach(function () {
+        userId = new ObjectId().toString()
         this.folder1 = { _id: new ObjectId(), name: 'folder1' }
         this.folder1Path = {
           fileSystem: '/test-folder/folder1',
@@ -593,6 +593,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
                 }),
               },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -610,6 +611,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
                 }),
               },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -629,7 +631,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           beforeEach(async function () {
             this.result = await this.subject.promises.mkdirp(
               this.project._id,
-              path
+              path,
+              userId
             )
           })
 
@@ -661,6 +664,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
   describe('moveEntity', function () {
     describe('moving a doc into a different folder', function () {
       beforeEach(async function () {
+        const userId = new ObjectId().toString()
         this.pathAfterMove = {
           fileSystem: '/somewhere/else.txt',
         }
@@ -685,6 +689,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             {
               $push: { 'rootFolder.0.folders.0.docs': this.doc },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -695,6 +700,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             {
               $pull: { 'rootFolder.0.docs': { _id: this.doc._id } },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -703,7 +709,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           this.project._id,
           this.doc._id,
           this.folder._id,
-          'doc'
+          'doc',
+          userId
         )
       })
 
@@ -770,12 +777,14 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
   describe('deleteEntity', function () {
     beforeEach(async function () {
+      const userId = new ObjectId().toString()
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
           { _id: this.project._id },
           {
             $pull: { 'rootFolder.0.docs': { _id: this.doc._id } },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           }
         )
         .chain('exec')
@@ -783,7 +792,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       await this.subject.promises.deleteEntity(
         this.project._id,
         this.doc._id,
-        'doc'
+        'doc',
+        userId
       )
     })
 
@@ -795,6 +805,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
   describe('renameEntity', function () {
     describe('happy path', function () {
       beforeEach(async function () {
+        const userId = new ObjectId().toString()
         this.newName = 'new.tex'
         this.oldDocs = ['old-doc']
         this.oldFiles = ['old-file']
@@ -812,7 +823,11 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           .withArgs(
             { _id: this.project._id, 'rootFolder.0.docs.0': { $exists: true } },
             {
-              $set: { 'rootFolder.0.docs.0.name': this.newName },
+              $set: {
+                'rootFolder.0.docs.0.name': this.newName,
+                lastUpdated: new Date(),
+                lastUpdatedBy: userId,
+              },
               $inc: { version: 1 },
             }
           )
@@ -822,7 +837,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           this.project._id,
           this.doc._id,
           'doc',
-          this.newName
+          this.newName,
+          userId
         )
       })
 
@@ -864,7 +880,9 @@ describe('ProjectEntityMongoUpdateHandler', function () {
   describe('_putElement', function () {
     describe('updating the project', function () {
       describe('when the parent folder is given', function () {
+        let userId
         beforeEach(function () {
+          userId = new ObjectId().toString()
           this.newFile = { _id: new ObjectId(), name: 'new file.png' }
           this.ProjectMock.expects('findOneAndUpdate')
             .withArgs(
@@ -875,6 +893,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
               {
                 $push: { 'rootFolder.0.folders.0.fileRefs': this.newFile },
                 $inc: { version: 1 },
+                $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
               }
             )
             .chain('exec')
@@ -886,7 +905,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             this.project,
             this.folder._id,
             this.newFile,
-            'files'
+            'files',
+            userId
           )
           this.ProjectMock.verify()
         })
@@ -896,7 +916,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             this.project,
             this.folder._id,
             this.newFile,
-            'file'
+            'file',
+            userId
           )
           this.ProjectMock.verify()
         })
@@ -998,6 +1019,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
     describe('when the parent folder is not given', function () {
       it('should default to root folder insert', async function () {
+        const userId = new ObjectId().toString()
         this.newFile = { _id: new ObjectId(), name: 'new file.png' }
         this.ProjectMock.expects('findOneAndUpdate')
           .withArgs(
@@ -1005,6 +1027,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             {
               $push: { 'rootFolder.0.fileRefs': this.newFile },
               $inc: { version: 1 },
+              $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
             }
           )
           .chain('exec')
@@ -1013,35 +1036,13 @@ describe('ProjectEntityMongoUpdateHandler', function () {
           this.project,
           this.rootFolder._id,
           this.newFile,
-          'file'
+          'file',
+          userId
         )
       })
     })
   })
 
-  describe('_insertDeletedFileReference', function () {
-    beforeEach(async function () {
-      this.DeletedFileMock.expects('create')
-        .withArgs({
-          projectId: this.project._id,
-          _id: this.file._id,
-          name: this.file.name,
-          linkedFileData: this.file.linkedFileData,
-          hash: this.file.hash,
-          deletedAt: sinon.match.date,
-        })
-        .resolves()
-      await this.subject.promises._insertDeletedFileReference(
-        this.project._id,
-        this.file
-      )
-    })
-
-    it('should update the database', function () {
-      this.DeletedFileMock.verify()
-    })
-  })
-
   describe('createNewFolderStructure', function () {
     beforeEach(function () {
       this.mockRootFolder = 'MOCK_ROOT_FOLDER'
@@ -1098,6 +1099,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
   describe('replaceDocWithFile', function () {
     it('should simultaneously remove the doc and add the file', async function () {
+      const userId = new ObjectId().toString()
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
           { _id: this.project._id, 'rootFolder.0': { $exists: true } },
@@ -1105,6 +1107,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             $pull: { 'rootFolder.0.docs': { _id: this.doc._id } },
             $push: { 'rootFolder.0.fileRefs': this.file },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           },
           { new: true }
         )
@@ -1113,7 +1116,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       await this.subject.promises.replaceDocWithFile(
         this.project._id,
         this.doc._id,
-        this.file
+        this.file,
+        userId
       )
       this.ProjectMock.verify()
     })
@@ -1121,6 +1125,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
 
   describe('replaceFileWithDoc', function () {
     it('should simultaneously remove the file and add the doc', async function () {
+      const userId = new ObjectId().toString()
       this.ProjectMock.expects('findOneAndUpdate')
         .withArgs(
           { _id: this.project._id, 'rootFolder.0': { $exists: true } },
@@ -1128,6 +1133,7 @@ describe('ProjectEntityMongoUpdateHandler', function () {
             $pull: { 'rootFolder.0.fileRefs': { _id: this.file._id } },
             $push: { 'rootFolder.0.docs': this.doc },
             $inc: { version: 1 },
+            $set: { lastUpdated: new Date(), lastUpdatedBy: userId },
           },
           { new: true }
         )
@@ -1136,7 +1142,8 @@ describe('ProjectEntityMongoUpdateHandler', function () {
       await this.subject.promises.replaceFileWithDoc(
         this.project._id,
         this.file._id,
-        this.doc
+        this.doc,
+        userId
       )
       this.ProjectMock.verify()
     })
diff --git a/services/web/test/unit/src/Project/ProjectEntityUpdateHandlerTests.js b/services/web/test/unit/src/Project/ProjectEntityUpdateHandlerTests.js
index de4a67be93..72c5080d62 100644
--- a/services/web/test/unit/src/Project/ProjectEntityUpdateHandlerTests.js
+++ b/services/web/test/unit/src/Project/ProjectEntityUpdateHandlerTests.js
@@ -100,7 +100,7 @@ describe('ProjectEntityUpdateHandler', function () {
       withTimeout: sinon.stub().returns(this.LockManager),
     }
     this.ProjectModel = {
-      updateOne: sinon.stub(),
+      updateOne: sinon.stub().returns({ exec: sinon.stub().resolves() }),
     }
     this.ProjectGetter = {
       promises: {
@@ -133,7 +133,6 @@ describe('ProjectEntityUpdateHandler', function () {
         addFolder: sinon.stub(),
         _confirmFolder: sinon.stub(),
         _putElement: sinon.stub(),
-        _insertDeletedFileReference: sinon.stub(),
         replaceFileWithNew: sinon.stub(),
         mkdirp: sinon.stub(),
         moveEntity: sinon.stub(),
@@ -225,26 +224,20 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('when the doc has been modified', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.DocstoreManager.promises.updateDoc.resolves({
           modified: true,
           rev: (this.rev = 5),
         })
 
-        const callback = (...args) => {
-          this.callback(...args)
-          done()
-        }
-
-        this.ProjectEntityUpdateHandler.updateDocLines(
+        await this.ProjectEntityUpdateHandler.promises.updateDocLines(
           projectId,
           docId,
           this.docLines,
           this.version,
           this.ranges,
           this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          callback
+          this.lastUpdatedBy
         )
       })
 
@@ -288,7 +281,7 @@ describe('ProjectEntityUpdateHandler', function () {
         )
       })
 
-      it('should send the doc the to the TPDS', function () {
+      it('should send the doc to the TPDS', function () {
         this.TpdsUpdateSender.promises.addDoc.should.have.been.calledWith({
           projectId,
           projectName: this.project.name,
@@ -298,33 +291,23 @@ describe('ProjectEntityUpdateHandler', function () {
           folderId: this.parentFolder._id,
         })
       })
-
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('when the doc has not been modified', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.DocstoreManager.promises.updateDoc.resolves({
           modified: false,
           rev: (this.rev = 5),
         })
 
-        const callback = () => {
-          this.callback()
-          done()
-        }
-
-        this.ProjectEntityUpdateHandler.updateDocLines(
+        await this.ProjectEntityUpdateHandler.promises.updateDocLines(
           projectId,
           docId,
           this.docLines,
           this.version,
           this.ranges,
           this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          callback
+          this.lastUpdatedBy
         )
       })
 
@@ -335,33 +318,25 @@ describe('ProjectEntityUpdateHandler', function () {
       it('should not send the doc the to the TPDS', function () {
         this.TpdsUpdateSender.promises.addDoc.called.should.equal(false)
       })
-
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('when the doc has been deleted', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.ProjectLocator.promises.findElement.rejects(
           new Errors.NotFoundError()
         )
         this.DocstoreManager.promises.isDocDeleted.resolves(true)
-        this.DocstoreManager.promises.updateDoc.resolves()
+        this.DocstoreManager.promises.updateDoc.resolves({})
 
-        this.ProjectEntityUpdateHandler.updateDocLines(
+        await this.ProjectEntityUpdateHandler.promises.updateDocLines(
           projectId,
           docId,
           this.docLines,
           this.version,
           this.ranges,
           this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
+          this.lastUpdatedBy
         )
       })
 
@@ -384,14 +359,10 @@ describe('ProjectEntityUpdateHandler', function () {
       it('should not send the doc the to the TPDS', function () {
         this.TpdsUpdateSender.promises.addDoc.called.should.equal(false)
       })
-
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('when projects and docs collection are de-synced', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
 
         // The doc is not in the file-tree, but also not marked as deleted.
@@ -401,21 +372,16 @@ describe('ProjectEntityUpdateHandler', function () {
         )
         this.DocstoreManager.promises.isDocDeleted.resolves(false)
 
-        this.DocstoreManager.promises.updateDoc.resolves()
-        const callback = (...args) => {
-          this.callback(...args)
-          done()
-        }
+        this.DocstoreManager.promises.updateDoc.resolves({})
 
-        this.ProjectEntityUpdateHandler.updateDocLines(
+        await this.ProjectEntityUpdateHandler.promises.updateDocLines(
           projectId,
           docId,
           this.docLines,
           this.version,
           this.ranges,
           this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          callback
+          this.lastUpdatedBy
         )
       })
 
@@ -438,14 +404,11 @@ describe('ProjectEntityUpdateHandler', function () {
       it('should not send the doc the to the TPDS', function () {
         this.TpdsUpdateSender.promises.addDoc.called.should.equal(false)
       })
-
-      it('should call the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('when the doc is not related to the project', function () {
-      beforeEach(function (done) {
+      let updateDocLinesPromise
+      beforeEach(function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.ProjectLocator.promises.findElement.rejects(
           new Errors.NotFoundError()
@@ -453,65 +416,84 @@ describe('ProjectEntityUpdateHandler', function () {
         this.DocstoreManager.promises.isDocDeleted.rejects(
           new Errors.NotFoundError()
         )
-        const callback = (...args) => {
-          this.callback(...args)
-          done()
+
+        updateDocLinesPromise =
+          this.ProjectEntityUpdateHandler.promises.updateDocLines(
+            projectId,
+            docId,
+            this.docLines,
+            this.version,
+            this.ranges,
+            this.lastUpdatedAt,
+            this.lastUpdatedBy
+          )
+      })
+
+      it('should return a not found error', async function () {
+        let error
+
+        try {
+          await updateDocLinesPromise
+        } catch (err) {
+          error = err
         }
 
-        this.ProjectEntityUpdateHandler.updateDocLines(
-          projectId,
-          docId,
-          this.docLines,
-          this.version,
-          this.ranges,
-          this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          callback
-        )
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
       })
 
-      it('should return a not found error', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Errors.NotFoundError))
-          .should.equal(true)
-      })
+      it('should not update the doc', async function () {
+        let error
 
-      it('should not update the doc', function () {
+        try {
+          await updateDocLinesPromise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
         this.DocstoreManager.promises.updateDoc.called.should.equal(false)
       })
 
-      it('should not send the doc the to the TPDS', function () {
+      it('should not send the doc the to the TPDS', async function () {
+        let error
+
+        try {
+          await updateDocLinesPromise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
         this.TpdsUpdateSender.promises.addDoc.called.should.equal(false)
       })
     })
 
     describe('when the project is not found', function () {
-      beforeEach(function (done) {
+      let error
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.rejects(
           new Errors.NotFoundError()
         )
-        this.ProjectEntityUpdateHandler.updateDocLines(
-          projectId,
-          docId,
-          this.docLines,
-          this.version,
-          this.ranges,
-          this.lastUpdatedAt,
-          this.lastUpdatedBy,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        try {
+          await this.ProjectEntityUpdateHandler.promises.updateDocLines(
+            projectId,
+            docId,
+            this.docLines,
+            this.version,
+            this.ranges,
+            this.lastUpdatedAt,
+            this.lastUpdatedBy
+          )
+        } catch (err) {
+          error = err
+        }
       })
 
-      it('should return a not found error', function () {
-        this.callback
-          .calledWith(sinon.match.instanceOf(Errors.NotFoundError))
-          .should.equal(true)
+      it('should return a not found error', async function () {
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
       })
 
-      it('should not update the doc', function () {
+      it('should not update the doc', async function () {
         this.DocstoreManager.promises.updateDoc.called.should.equal(false)
       })
 
@@ -526,38 +508,42 @@ describe('ProjectEntityUpdateHandler', function () {
       this.rootDocId = 'root-doc-id-123123'
     })
 
-    it('should call Project.updateOne when the doc exists and has a valid extension', function (done) {
+    it('should call Project.updateOne when the doc exists and has a valid extension', async function () {
       this.ProjectEntityHandler.promises.getDocPathByProjectIdAndDocId.resolves(
         `/main.tex`
       )
 
-      this.ProjectEntityUpdateHandler.setRootDoc(
+      await this.ProjectEntityUpdateHandler.promises.setRootDoc(
         projectId,
-        this.rootDocId,
-        () => {
-          this.ProjectModel.updateOne
-            .calledWith({ _id: projectId }, { rootDoc_id: this.rootDocId })
-            .should.equal(true)
-          done()
-        }
+        this.rootDocId
       )
+
+      this.ProjectModel.updateOne
+        .calledWith({ _id: projectId }, { rootDoc_id: this.rootDocId })
+        .should.equal(true)
     })
 
-    it("should not call Project.updateOne when the doc doesn't exist", function (done) {
+    it("should not call Project.updateOne when the doc doesn't exist", async function () {
       this.ProjectEntityHandler.promises.getDocPathByProjectIdAndDocId.rejects(
         Errors.NotFoundError
       )
 
-      this.ProjectEntityUpdateHandler.setRootDoc(
-        projectId,
-        this.rootDocId,
-        () => {
-          this.ProjectModel.updateOne
-            .calledWith({ _id: projectId }, { rootDoc_id: this.rootDocId })
-            .should.equal(false)
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.ProjectEntityUpdateHandler.promises.setRootDoc(
+          projectId,
+          this.rootDocId
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
+
+      this.ProjectModel.updateOne
+        .calledWith({ _id: projectId }, { rootDoc_id: this.rootDocId })
+        .should.equal(false)
     })
 
     it('should call the callback with an UnsupportedFileTypeError when the doc has an unaccepted file extension', function () {
@@ -576,19 +562,17 @@ describe('ProjectEntityUpdateHandler', function () {
   })
 
   describe('unsetRootDoc', function () {
-    it('should call Project.updateOne', function (done) {
-      this.ProjectEntityUpdateHandler.unsetRootDoc(projectId, () => {
-        this.ProjectModel.updateOne
-          .calledWith({ _id: projectId }, { $unset: { rootDoc_id: true } })
-          .should.equal(true)
-        done()
-      })
+    it('should call Project.updateOne', async function () {
+      await this.ProjectEntityUpdateHandler.promises.unsetRootDoc(projectId)
+      this.ProjectModel.updateOne
+        .calledWith({ _id: projectId }, { $unset: { rootDoc_id: true } })
+        .should.equal(true)
     })
   })
 
   describe('addDoc', function () {
     describe('adding a doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.path = '/path/to/doc'
         this.rev = 5
 
@@ -607,17 +591,13 @@ describe('ProjectEntityUpdateHandler', function () {
           result: { path: { fileSystem: this.path } },
           project: this.project,
         })
-        this.ProjectEntityUpdateHandler.addDoc(
+        await this.ProjectEntityUpdateHandler.promises.addDoc(
           projectId,
           docId,
           this.docName,
           this.docLines,
           userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
+          this.source
         )
       })
 
@@ -650,34 +630,36 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('adding a doc with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/path/to/doc'
 
         this.newDoc = { _id: docId }
-        this.ProjectEntityUpdateHandler.addDoc(
-          projectId,
-          folderId,
-          `*${this.docName}`,
-          this.docLines,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.addDoc(
+            projectId,
+            folderId,
+            `*${this.docName}`,
+            this.docLines,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
   })
 
   describe('addFile', function () {
     describe('adding a file', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.path = '/path/to/file'
 
         this.newFile = {
@@ -697,18 +679,14 @@ describe('ProjectEntityUpdateHandler', function () {
           result: { path: { fileSystem: this.path } },
           project: this.project,
         })
-        this.ProjectEntityUpdateHandler.addFile(
+        await this.ProjectEntityUpdateHandler.promises.addFile(
           projectId,
           folderId,
           this.fileName,
           this.fileSystemPath,
           this.linkedFileData,
           userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
+          this.source
         )
       })
 
@@ -747,13 +725,6 @@ describe('ProjectEntityUpdateHandler', function () {
           .should.equal(true)
       })
 
-      it('should mark the project as updated', function () {
-        const args = this.ProjectUpdater.promises.markAsUpdated.args[0]
-        args[0].should.equal(projectId)
-        args[1].should.exist
-        args[2].should.equal(userId)
-      })
-
       it('sends the change in project structure to the doc updater', function () {
         const newFiles = [
           {
@@ -777,7 +748,7 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('adding a file with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/path/to/file'
 
         this.newFile = {
@@ -792,54 +763,59 @@ describe('ProjectEntityUpdateHandler', function () {
           result: { path: { fileSystem: this.path } },
           project: this.project,
         })
-        this.ProjectEntityUpdateHandler.addFile(
-          projectId,
-          folderId,
-          `*${this.fileName}`,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.addFile(
+            projectId,
+            folderId,
+            `*${this.fileName}`,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
   })
 
   describe('upsertDoc', function () {
     describe('upserting into an invalid folder', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.ProjectLocator.promises.findElement.resolves({ element: null })
-        this.ProjectEntityUpdateHandler.upsertDoc(
-          projectId,
-          folderId,
-          this.docName,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Error)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertDoc(
+            projectId,
+            folderId,
+            this.docName,
+            this.docLines,
+            this.source,
+            userId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('updating an existing doc', function () {
-      beforeEach(function (done) {
+      let upsertDocResponse
+      beforeEach(async function () {
         this.existingDoc = { _id: docId, name: this.docName }
         this.existingFile = {
           _id: fileId,
@@ -856,18 +832,15 @@ describe('ProjectEntityUpdateHandler', function () {
         })
         this.DocumentUpdaterHandler.promises.setDocument.resolves()
 
-        this.ProjectEntityUpdateHandler.upsertDoc(
-          projectId,
-          folderId,
-          this.docName,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertDocResponse =
+          await this.ProjectEntityUpdateHandler.promises.upsertDoc(
+            projectId,
+            folderId,
+            this.docName,
+            this.docLines,
+            this.source,
+            userId
+          )
       })
 
       it('tries to find the folder', function () {
@@ -893,12 +866,15 @@ describe('ProjectEntityUpdateHandler', function () {
       })
 
       it('returns the doc', function () {
-        this.callback.calledWith(null, this.existingDoc, false)
+        expect(upsertDocResponse.isNew).to.equal(false)
+        expect(upsertDocResponse.doc).to.eql(this.existingDoc)
       })
     })
 
     describe('creating a new doc', function () {
-      beforeEach(function (done) {
+      let upsertDocResponse
+
+      beforeEach(async function () {
         this.folder = { _id: folderId, docs: [], fileRefs: [] }
         this.newDoc = { _id: docId }
         this.ProjectLocator.promises.findElement.resolves({
@@ -908,18 +884,15 @@ describe('ProjectEntityUpdateHandler', function () {
           withoutLock: sinon.stub().resolves({ doc: this.newDoc }),
         }
 
-        this.ProjectEntityUpdateHandler.upsertDoc(
-          projectId,
-          folderId,
-          this.docName,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertDocResponse =
+          await this.ProjectEntityUpdateHandler.promises.upsertDoc(
+            projectId,
+            folderId,
+            this.docName,
+            this.docLines,
+            this.source,
+            userId
+          )
       })
 
       it('tries to find the folder', function () {
@@ -945,12 +918,13 @@ describe('ProjectEntityUpdateHandler', function () {
       })
 
       it('returns the doc', function () {
-        this.callback.calledWith(null, this.newDoc, true)
+        expect(upsertDocResponse.isNew).to.equal(true)
+        expect(upsertDocResponse.doc).to.equal(this.newDoc)
       })
     })
 
     describe('upserting a new doc with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.folder = { _id: folderId, docs: [], fileRefs: [] }
         this.newDoc = { _id: docId }
         this.ProjectLocator.promises.findElement.resolves({
@@ -959,29 +933,30 @@ describe('ProjectEntityUpdateHandler', function () {
         this.ProjectEntityUpdateHandler.promises.addDocWithRanges = {
           withoutLock: sinon.stub().resolves({ doc: this.newDoc }),
         }
-
-        this.ProjectEntityUpdateHandler.upsertDoc(
-          projectId,
-          folderId,
-          `*${this.docName}`,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertDoc(
+            projectId,
+            folderId,
+            `*${this.docName}`,
+            this.docLines,
+            this.source,
+            userId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
 
     describe('upserting a doc on top of a file', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.newProject = {
           name: 'new project',
           overleaf: { history: { id: projectHistoryId } },
@@ -1010,17 +985,13 @@ describe('ProjectEntityUpdateHandler', function () {
         )
         this.TpdsUpdateSender.promises.addDoc.resolves()
 
-        this.ProjectEntityUpdateHandler.upsertDoc(
+        await this.ProjectEntityUpdateHandler.promises.upsertDoc(
           projectId,
           folderId,
           'foo.tex',
           this.docLines,
           this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
+          userId
         )
       })
 
@@ -1105,31 +1076,34 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('upserting into an invalid folder', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.ProjectLocator.promises.findElement.resolves({ element: null })
-        this.ProjectEntityUpdateHandler.upsertFile(
-          projectId,
-          folderId,
-          this.fileName,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Error)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertFile(
+            projectId,
+            folderId,
+            this.fileName,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
 
     describe('updating an existing file', function () {
-      beforeEach(function (done) {
+      let upsertFileResult
+      beforeEach(async function () {
         this.existingFile = { _id: fileId, name: this.fileName, rev: 1 }
         this.newFile = {
           _id: new ObjectId(),
@@ -1151,19 +1125,16 @@ describe('ProjectEntityUpdateHandler', function () {
             newFileRef: this.newFile,
           }
         )
-        this.ProjectEntityUpdateHandler.upsertFile(
-          projectId,
-          folderId,
-          this.fileName,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertFileResult =
+          await this.ProjectEntityUpdateHandler.promises.upsertFile(
+            projectId,
+            folderId,
+            this.fileName,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
       })
 
       it('uploads a new version of the file', function () {
@@ -1181,7 +1152,8 @@ describe('ProjectEntityUpdateHandler', function () {
         this.ProjectEntityMongoUpdateHandler.promises.replaceFileWithNew.should.have.been.calledWith(
           projectId,
           this.existingFile._id,
-          this.file
+          this.file,
+          userId
         )
       })
 
@@ -1198,13 +1170,6 @@ describe('ProjectEntityUpdateHandler', function () {
         })
       })
 
-      it('should mark the project as updated', function () {
-        const args = this.ProjectUpdater.promises.markAsUpdated.args[0]
-        args[0].should.equal(projectId)
-        args[1].should.exist
-        args[2].should.equal(userId)
-      })
-
       it('updates the project structure in the doc updater', function () {
         const oldFiles = [
           {
@@ -1234,12 +1199,16 @@ describe('ProjectEntityUpdateHandler', function () {
       })
 
       it('returns the file', function () {
-        this.callback.calledWith(null, this.existingFile, false)
+        expect(upsertFileResult.isNew).to.be.false
+        expect(upsertFileResult.fileRef.toString()).to.eql(
+          this.existingFile.toString()
+        )
       })
     })
 
     describe('creating a new file', function () {
-      beforeEach(function (done) {
+      let upsertFileResult
+      beforeEach(async function () {
         this.folder = { _id: folderId, fileRefs: [], docs: [] }
         this.newFile = {
           _id: fileId,
@@ -1257,19 +1226,16 @@ describe('ProjectEntityUpdateHandler', function () {
           mainTask: sinon.stub().resolves(this.newFile),
         }
 
-        this.ProjectEntityUpdateHandler.upsertFile(
-          projectId,
-          folderId,
-          this.fileName,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertFileResult =
+          await this.ProjectEntityUpdateHandler.promises.upsertFile(
+            projectId,
+            folderId,
+            this.fileName,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
       })
 
       it('tries to find the folder', function () {
@@ -1295,12 +1261,13 @@ describe('ProjectEntityUpdateHandler', function () {
       })
 
       it('returns the file', function () {
-        this.callback.calledWith(null, this.newFile, true)
+        expect(upsertFileResult.fileRef).to.eql(this.newFile)
+        expect(upsertFileResult.isNew).to.be.true
       })
     })
 
     describe('upserting a new file with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.folder = { _id: folderId, fileRefs: [] }
         this.newFile = { _id: fileId }
         this.ProjectLocator.promises.findElement.resolves({
@@ -1309,30 +1276,31 @@ describe('ProjectEntityUpdateHandler', function () {
         this.ProjectEntityUpdateHandler.promises.addFile = {
           mainTask: sinon.stub().resolves(this.newFile),
         }
-
-        this.ProjectEntityUpdateHandler.upsertFile(
-          projectId,
-          folderId,
-          `*${this.fileName}`,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertFile(
+            projectId,
+            folderId,
+            `*${this.fileName}`,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
 
     describe('upserting file on top of a doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.path = '/path/to/doc'
         this.existingDoc = { _id: new ObjectId(), name: this.fileName }
         this.folder = {
@@ -1379,22 +1347,26 @@ describe('ProjectEntityUpdateHandler', function () {
           this.newProject
         )
 
-        this.ProjectEntityUpdateHandler.upsertFile(
+        await this.ProjectEntityUpdateHandler.promises.upsertFile(
           projectId,
           folderId,
           this.fileName,
           this.fileSystemPath,
           this.linkedFileData,
           userId,
-          this.source,
-          done
+          this.source
         )
       })
 
       it('replaces the existing doc with a file', function () {
         expect(
           this.ProjectEntityMongoUpdateHandler.promises.replaceDocWithFile
-        ).to.have.been.calledWith(projectId, this.existingDoc._id, this.newFile)
+        ).to.have.been.calledWith(
+          projectId,
+          this.existingDoc._id,
+          this.newFile,
+          userId
+        )
       })
 
       it('updates the doc structure', function () {
@@ -1443,7 +1415,8 @@ describe('ProjectEntityUpdateHandler', function () {
 
   describe('upsertDocWithPath', function () {
     describe('upserting a doc', function () {
-      beforeEach(function (done) {
+      let upsertDocWithPathResult
+      beforeEach(async function () {
         this.path = '/folder/doc.tex'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1460,22 +1433,19 @@ describe('ProjectEntityUpdateHandler', function () {
             .resolves({ doc: this.doc, isNew: this.isNewDoc }),
         }
 
-        this.ProjectEntityUpdateHandler.upsertDocWithPath(
-          projectId,
-          this.path,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertDocWithPathResult =
+          await this.ProjectEntityUpdateHandler.promises.upsertDocWithPath(
+            projectId,
+            this.path,
+            this.docLines,
+            this.source,
+            userId
+          )
       })
 
       it('creates any necessary folders', function () {
         this.ProjectEntityUpdateHandler.promises.mkdirp.withoutLock
-          .calledWith(projectId, '/folder')
+          .calledWith(projectId, '/folder', userId)
           .should.equal(true)
       })
 
@@ -1492,21 +1462,18 @@ describe('ProjectEntityUpdateHandler', function () {
           .should.equal(true)
       })
 
-      it('calls the callback', function () {
-        this.callback
-          .calledWith(
-            null,
-            this.doc,
-            this.isNewDoc,
-            this.newFolders,
-            this.folder
-          )
-          .should.equal(true)
+      it('returns a doc, the isNewDoc flag, newFolders and a folder', function () {
+        expect(upsertDocWithPathResult).to.eql({
+          doc: this.doc,
+          isNew: this.isNewDoc,
+          newFolders: this.newFolders,
+          folder: this.folder,
+        })
       })
     })
 
     describe('upserting a doc with an invalid path', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/*folder/doc.tex'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1522,28 +1489,29 @@ describe('ProjectEntityUpdateHandler', function () {
             .stub()
             .resolves({ doc: this.doc, isNew: this.isNewDoc }),
         }
-
-        this.ProjectEntityUpdateHandler.upsertDocWithPath(
-          projectId,
-          this.path,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertDocWithPath(
+            projectId,
+            this.path,
+            this.docLines,
+            this.source,
+            userId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
 
     describe('upserting a doc with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/folder/*doc.tex'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1559,30 +1527,32 @@ describe('ProjectEntityUpdateHandler', function () {
             .stub()
             .resolves({ doc: this.doc, isNew: this.isNewDoc }),
         }
-
-        this.ProjectEntityUpdateHandler.upsertDocWithPath(
-          projectId,
-          this.path,
-          this.docLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertDocWithPath(
+            projectId,
+            this.path,
+            this.docLines,
+            this.source,
+            userId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
   })
 
   describe('upsertFileWithPath', function () {
     describe('upserting a file', function () {
-      beforeEach(function (done) {
+      let upsertFileWithPathResult
+      beforeEach(async function () {
         this.path = '/folder/file.png'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1604,23 +1574,20 @@ describe('ProjectEntityUpdateHandler', function () {
             .resolves({ fileRef: this.file, isNew: this.isNewFile }),
         }
 
-        this.ProjectEntityUpdateHandler.upsertFileWithPath(
-          projectId,
-          this.path,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        upsertFileWithPathResult =
+          await this.ProjectEntityUpdateHandler.promises.upsertFileWithPath(
+            projectId,
+            this.path,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
       })
 
       it('creates any necessary folders', function () {
         this.ProjectEntityUpdateHandler.promises.mkdirp.withoutLock
-          .calledWith(projectId, '/folder')
+          .calledWith(projectId, '/folder', userId)
           .should.equal(true)
       })
 
@@ -1641,20 +1608,19 @@ describe('ProjectEntityUpdateHandler', function () {
         )
       })
 
-      it('calls the callback', function () {
-        this.callback.should.have.been.calledWith(
-          null,
-          this.file,
-          this.isNewFile,
-          undefined,
-          this.newFolders,
-          this.folder
-        )
+      it('returns an object with the fileRef, isNew flag, undefined oldFileRef, newFolders, and folder', function () {
+        expect(upsertFileWithPathResult).to.eql({
+          fileRef: this.file,
+          isNew: this.isNewFile,
+          newFolders: this.newFolders,
+          folder: this.folder,
+          oldFileRef: undefined,
+        })
       })
     })
 
     describe('upserting a file with an invalid path', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/*folder/file.png'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1670,29 +1636,30 @@ describe('ProjectEntityUpdateHandler', function () {
             .stub()
             .resolves({ doc: this.file, isNew: this.isNewFile }),
         }
-
-        this.ProjectEntityUpdateHandler.upsertFileWithPath(
-          projectId,
-          this.path,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertFileWithPath(
+            projectId,
+            this.path,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
 
     describe('upserting a file with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.path = '/folder/*file.png'
         this.newFolders = ['mock-a', 'mock-b']
         this.folder = { _id: folderId }
@@ -1708,30 +1675,32 @@ describe('ProjectEntityUpdateHandler', function () {
             .stub()
             .resolves({ doc: this.file, isNew: this.isNewFile }),
         }
-
-        this.ProjectEntityUpdateHandler.upsertFileWithPath(
-          projectId,
-          this.path,
-          this.fileSystemPath,
-          this.linkedFileData,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.upsertFileWithPath(
+            projectId,
+            this.path,
+            this.fileSystemPath,
+            this.linkedFileData,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
   })
 
   describe('deleteEntity', function () {
-    beforeEach(function (done) {
+    let deleteEntityResult
+    beforeEach(async function () {
       this.path = '/path/to/doc.tex'
       this.doc = { _id: docId }
       this.projectBeforeDeletion = { _id: projectId, name: 'project' }
@@ -1746,17 +1715,14 @@ describe('ProjectEntityUpdateHandler', function () {
         .stub()
         .resolves([{ type: 'doc', entity: this.doc, path: this.path }])
 
-      this.ProjectEntityUpdateHandler.deleteEntity(
-        projectId,
-        docId,
-        'doc',
-        userId,
-        this.source,
-        (...args) => {
-          this.callback(...args)
-          done()
-        }
-      )
+      deleteEntityResult =
+        await this.ProjectEntityUpdateHandler.promises.deleteEntity(
+          projectId,
+          docId,
+          'doc',
+          userId,
+          this.source
+        )
     })
 
     it('flushes the project to mongo', function () {
@@ -1767,7 +1733,7 @@ describe('ProjectEntityUpdateHandler', function () {
 
     it('deletes the entity in mongo', function () {
       this.ProjectEntityMongoUpdateHandler.promises.deleteEntity
-        .calledWith(projectId, docId, 'doc')
+        .calledWith(projectId, docId, 'doc', userId)
         .should.equal(true)
     })
 
@@ -1797,13 +1763,13 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     it('retuns the entity_id', function () {
-      this.callback.calledWith(null, docId).should.equal(true)
+      expect(deleteEntityResult).to.equal(docId)
     })
   })
 
   describe('deleteEntityWithPath', function () {
     describe('when the entity exists', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.doc = { _id: docId }
         this.ProjectLocator.promises.findElementByPath.resolves({
           element: this.doc,
@@ -1813,12 +1779,11 @@ describe('ProjectEntityUpdateHandler', function () {
           withoutLock: sinon.stub().resolves(),
         }
         this.path = '/path/to/doc.tex'
-        this.ProjectEntityUpdateHandler.deleteEntityWithPath(
+        await this.ProjectEntityUpdateHandler.promises.deleteEntityWithPath(
           projectId,
           this.path,
           userId,
-          this.source,
-          done
+          this.source
         )
       })
 
@@ -1844,109 +1809,116 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('when the entity does not exist', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.ProjectLocator.promises.findElementByPath.resolves({
           element: null,
         })
         this.path = '/doc.tex'
-        this.ProjectEntityUpdateHandler.deleteEntityWithPath(
-          projectId,
-          this.path,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        this.callback.should.have.been.calledWith(
-          sinon.match.instanceOf(Errors.NotFoundError)
-        )
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.deleteEntityWithPath(
+            projectId,
+            this.path,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
       })
     })
   })
 
   describe('mkdirp', function () {
-    beforeEach(function (done) {
+    beforeEach(async function () {
       this.docPath = '/folder/doc.tex'
       this.ProjectEntityMongoUpdateHandler.promises.mkdirp.resolves({})
-      this.ProjectEntityUpdateHandler.mkdirp(projectId, this.docPath, done)
-    })
-
-    it('calls ProjectEntityMongoUpdateHandler', function () {
-      this.ProjectEntityMongoUpdateHandler.promises.mkdirp
-        .calledWith(projectId, this.docPath)
-        .should.equal(true)
-    })
-  })
-
-  describe('mkdirpWithExactCase', function () {
-    beforeEach(function (done) {
-      this.docPath = '/folder/doc.tex'
-      this.ProjectEntityMongoUpdateHandler.promises.mkdirp.resolves({})
-      this.ProjectEntityUpdateHandler.mkdirpWithExactCase(
+      await this.ProjectEntityUpdateHandler.promises.mkdirp(
         projectId,
         this.docPath,
-        done
+        userId
       )
     })
 
     it('calls ProjectEntityMongoUpdateHandler', function () {
       this.ProjectEntityMongoUpdateHandler.promises.mkdirp
-        .calledWith(projectId, this.docPath, { exactCaseMatch: true })
+        .calledWith(projectId, this.docPath, userId)
+        .should.equal(true)
+    })
+  })
+
+  describe('mkdirpWithExactCase', function () {
+    beforeEach(async function () {
+      this.docPath = '/folder/doc.tex'
+      this.ProjectEntityMongoUpdateHandler.promises.mkdirp.resolves({})
+      await this.ProjectEntityUpdateHandler.promises.mkdirpWithExactCase(
+        projectId,
+        this.docPath,
+        userId
+      )
+    })
+
+    it('calls ProjectEntityMongoUpdateHandler', function () {
+      this.ProjectEntityMongoUpdateHandler.promises.mkdirp
+        .calledWith(projectId, this.docPath, userId, { exactCaseMatch: true })
         .should.equal(true)
     })
   })
 
   describe('addFolder', function () {
     describe('adding a folder', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.parentFolderId = '123asdf'
         this.folderName = 'new-folder'
         this.ProjectEntityMongoUpdateHandler.promises.addFolder.resolves({})
-        this.ProjectEntityUpdateHandler.addFolder(
+        await this.ProjectEntityUpdateHandler.promises.addFolder(
           projectId,
           this.parentFolderId,
           this.folderName,
-          done
+          userId
         )
       })
 
       it('calls ProjectEntityMongoUpdateHandler', function () {
         this.ProjectEntityMongoUpdateHandler.promises.addFolder
-          .calledWith(projectId, this.parentFolderId, this.folderName)
+          .calledWith(projectId, this.parentFolderId, this.folderName, userId)
           .should.equal(true)
       })
     })
 
     describe('adding a folder with an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.parentFolderId = '123asdf'
         this.folderName = '*new-folder'
         this.ProjectEntityMongoUpdateHandler.promises.addFolder.resolves({})
-        this.ProjectEntityUpdateHandler.addFolder(
-          projectId,
-          this.parentFolderId,
-          this.folderName,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.addFolder(
+            projectId,
+            this.parentFolderId,
+            this.folderName
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
   })
 
   describe('moveEntity', function () {
-    beforeEach(function (done) {
+    beforeEach(async function () {
       this.project_name = 'project name'
       this.startPath = '/a.tex'
       this.endPath = '/folder/b.tex'
@@ -1960,20 +1932,19 @@ describe('ProjectEntityUpdateHandler', function () {
         changes: this.changes,
       })
 
-      this.ProjectEntityUpdateHandler.moveEntity(
+      await this.ProjectEntityUpdateHandler.promises.moveEntity(
         projectId,
         docId,
         folderId,
         'doc',
         userId,
-        this.source,
-        done
+        this.source
       )
     })
 
     it('moves the entity in mongo', function () {
       this.ProjectEntityMongoUpdateHandler.promises.moveEntity
-        .calledWith(projectId, docId, folderId, 'doc')
+        .calledWith(projectId, docId, folderId, 'doc', userId)
         .should.equal(true)
     })
 
@@ -2007,7 +1978,7 @@ describe('ProjectEntityUpdateHandler', function () {
 
   describe('renameEntity', function () {
     describe('renaming an entity', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.project_name = 'project name'
         this.startPath = '/folder/a.tex'
         this.endPath = '/folder/b.tex'
@@ -2022,20 +1993,19 @@ describe('ProjectEntityUpdateHandler', function () {
           changes: this.changes,
         })
 
-        this.ProjectEntityUpdateHandler.renameEntity(
+        await this.ProjectEntityUpdateHandler.promises.renameEntity(
           projectId,
           docId,
           'doc',
           this.newDocName,
           userId,
-          this.source,
-          done
+          this.source
         )
       })
 
       it('moves the entity in mongo', function () {
         this.ProjectEntityMongoUpdateHandler.promises.renameEntity
-          .calledWith(projectId, docId, 'doc', this.newDocName)
+          .calledWith(projectId, docId, 'doc', this.newDocName, userId)
           .should.equal(true)
       })
 
@@ -2074,7 +2044,7 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('renaming an entity to an invalid name', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.project_name = 'project name'
         this.startPath = '/folder/a.tex'
         this.endPath = '/folder/b.tex'
@@ -2088,29 +2058,30 @@ describe('ProjectEntityUpdateHandler', function () {
           rev: this.rev,
           changes: this.changes,
         })
-
-        this.ProjectEntityUpdateHandler.renameEntity(
-          projectId,
-          docId,
-          'doc',
-          this.newDocName,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Errors.InvalidNameError)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.renameEntity(
+            projectId,
+            docId,
+            'doc',
+            this.newDocName,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.InvalidNameError)
       })
     })
 
     describe('renaming an entity with a non-string value', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.project_name = 'project name'
         this.startPath = '/folder/a.tex'
         this.endPath = '/folder/b.tex'
@@ -2124,24 +2095,25 @@ describe('ProjectEntityUpdateHandler', function () {
           rev: this.rev,
           changes: this.changes,
         })
-
-        this.ProjectEntityUpdateHandler.renameEntity(
-          projectId,
-          docId,
-          'doc',
-          this.newDocName,
-          userId,
-          this.source,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('returns an error', function () {
-        const errorMatcher = sinon.match.instanceOf(Error)
-        this.callback.calledWithMatch(errorMatcher).should.equal(true)
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.renameEntity(
+            projectId,
+            docId,
+            'doc',
+            this.newDocName,
+            userId,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
         expect(
           this.ProjectEntityMongoUpdateHandler.promises.renameEntity.called
         ).to.equal(false)
@@ -2151,58 +2123,52 @@ describe('ProjectEntityUpdateHandler', function () {
 
   describe('resyncProjectHistory', function () {
     describe('a deleted project', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.ProjectGetter.promises.getProject.resolves({})
-
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
-          projectId,
-          {},
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('should return an error', function () {
-        expect(this.callback).to.have.been.calledWith(
-          sinon.match
-            .instanceOf(Errors.ProjectHistoryDisabledError)
-            .and(
-              sinon.match.has(
-                'message',
-                `project history not enabled for ${projectId}`
-              )
-            )
+      it('should return an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
+            projectId,
+            {}
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.ProjectHistoryDisabledError)
+        expect(error).to.have.property(
+          'message',
+          `project history not enabled for ${projectId}`
         )
       })
     })
 
     describe('a project without project-history enabled', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.project.overleaf = {}
         this.ProjectGetter.promises.getProject.resolves(this.project)
-
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
-          projectId,
-          {},
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('should return an error', function () {
-        expect(this.callback).to.have.been.calledWith(
-          sinon.match
-            .instanceOf(Errors.ProjectHistoryDisabledError)
-            .and(
-              sinon.match.has(
-                'message',
-                `project history not enabled for ${projectId}`
-              )
-            )
+      it('should return an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
+            projectId,
+            {}
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.ProjectHistoryDisabledError)
+        expect(error).to.have.property(
+          'message',
+          `project history not enabled for ${projectId}`
         )
       })
     })
@@ -2215,7 +2181,7 @@ describe('ProjectEntityUpdateHandler', function () {
           path: 'universe.png',
         },
       ]
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         const folders = []
         this.ProjectEntityHandler.getAllEntitiesFromProject.returns({
@@ -2223,13 +2189,10 @@ describe('ProjectEntityUpdateHandler', function () {
           files,
           folders,
         })
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
+
+        await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
           projectId,
-          {},
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
+          {}
         )
       })
 
@@ -2254,14 +2217,10 @@ describe('ProjectEntityUpdateHandler', function () {
           .calledWith(projectId, projectHistoryId, docs, files)
           .should.equal(true)
       })
-
-      it('calls the callback', function () {
-        this.callback.called.should.equal(true)
-      })
     })
 
     describe('a project with duplicate filenames', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.docs = [
           { doc: { _id: 'doc1', name: 'main.tex' }, path: 'main.tex' },
@@ -2305,10 +2264,9 @@ describe('ProjectEntityUpdateHandler', function () {
           files: this.files,
           folders: [],
         })
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
+        await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
           projectId,
-          {},
-          done
+          {}
         )
       })
 
@@ -2320,25 +2278,29 @@ describe('ProjectEntityUpdateHandler', function () {
           projectId,
           'doc3',
           'doc',
-          'duplicate.tex (1)'
+          'duplicate.tex (1)',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'doc5',
           'doc',
-          'duplicate.tex (2)'
+          'duplicate.tex (2)',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'file3',
           'file',
-          'duplicate.jpg (1)'
+          'duplicate.jpg (1)',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'file4',
           'file',
-          'another dupe (23)'
+          'another dupe (23)',
+          null
         )
       })
 
@@ -2368,7 +2330,7 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('a project with bad filenames', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.docs = [
           {
@@ -2395,10 +2357,9 @@ describe('ProjectEntityUpdateHandler', function () {
           files: this.files,
           folders: [],
         })
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
+        await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
           projectId,
-          {},
-          done
+          {}
         )
       })
 
@@ -2410,25 +2371,29 @@ describe('ProjectEntityUpdateHandler', function () {
           projectId,
           'doc1',
           'doc',
-          '_d_e_f_test.tex'
+          '_d_e_f_test.tex',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'doc2',
           'doc',
-          'untitled'
+          'untitled',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'file1',
           'file',
-          'A_.png'
+          'A_.png',
+          null
         )
         expect(renameEntity).to.have.been.calledWith(
           projectId,
           'file2',
           'file',
-          'A_.png (1)'
+          'A_.png (1)',
+          null
         )
       })
 
@@ -2479,17 +2444,16 @@ describe('ProjectEntityUpdateHandler', function () {
         },
       ]
       const files = []
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.ProjectEntityHandler.getAllEntitiesFromProject.returns({
           docs,
           files,
           folders,
         })
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
+        await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
           projectId,
-          {},
-          done
+          {}
         )
       })
 
@@ -2501,7 +2465,8 @@ describe('ProjectEntityUpdateHandler', function () {
           projectId,
           'folder2',
           'folder',
-          'bad_'
+          'bad_',
+          null
         )
       })
 
@@ -2536,17 +2501,16 @@ describe('ProjectEntityUpdateHandler', function () {
         },
       ]
       const files = []
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.ProjectEntityHandler.getAllEntitiesFromProject.returns({
           docs,
           files,
           folders,
         })
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
+        await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
           projectId,
-          {},
-          done
+          {}
         )
       })
 
@@ -2558,7 +2522,8 @@ describe('ProjectEntityUpdateHandler', function () {
           projectId,
           'doc1',
           'doc',
-          'chapters (1)'
+          'chapters (1)',
+          null
         )
       })
 
@@ -2576,24 +2541,25 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('a project with an invalid file tree', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.callback = sinon.stub()
         this.ProjectGetter.promises.getProject.resolves(this.project)
         this.ProjectEntityHandler.getAllEntitiesFromProject.throws()
-        this.ProjectEntityUpdateHandler.resyncProjectHistory(
-          projectId,
-          {},
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('calls the callback with an error', function () {
-        expect(this.callback).to.have.been.calledWith(
-          sinon.match.instanceOf(Error)
-        )
+      it('calls the callback with an error', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.resyncProjectHistory(
+            projectId,
+            {}
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
   })
@@ -2605,7 +2571,6 @@ describe('ProjectEntityUpdateHandler', function () {
       this.ProjectEntityUpdateHandler.promises.unsetRootDoc = sinon
         .stub()
         .resolves()
-      this.ProjectEntityMongoUpdateHandler.promises._insertDeletedFileReference.resolves()
     })
 
     describe('a file', function () {
@@ -2625,12 +2590,6 @@ describe('ProjectEntityUpdateHandler', function () {
           )
       })
 
-      it('should insert the file into the deletedFiles collection', function () {
-        this.ProjectEntityMongoUpdateHandler.promises._insertDeletedFileReference
-          .calledWith(this.project._id, this.entity)
-          .should.equal(true)
-      })
-
       it('should not delete the file from FileStoreHandler', function () {
         this.FileStoreHandler.promises.deleteFile
           .calledWith(projectId, this.entityId)
@@ -2729,7 +2688,6 @@ describe('ProjectEntityUpdateHandler', function () {
         }
 
         this.ProjectEntityUpdateHandler._cleanUpDoc = sinon.stub().resolves()
-        this.ProjectEntityUpdateHandler._cleanUpFile = sinon.stub().resolves()
         const path = '/folder'
         this.newProject = 'new-project'
         this.subtreeListing =
@@ -2744,17 +2702,6 @@ describe('ProjectEntityUpdateHandler', function () {
           )
       })
 
-      it('should clean up all sub files', function () {
-        this.ProjectEntityUpdateHandler._cleanUpFile.should.have.been.calledWith(
-          this.project,
-          this.file1
-        )
-        this.ProjectEntityUpdateHandler._cleanUpFile.should.have.been.calledWith(
-          this.project,
-          this.file2
-        )
-      })
-
       it('should clean up all sub docs', function () {
         this.ProjectEntityUpdateHandler._cleanUpDoc
           .calledWith(
@@ -2925,13 +2872,12 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('successfully', function () {
-      beforeEach(function (done) {
-        this.ProjectEntityUpdateHandler.convertDocToFile(
+      beforeEach(async function () {
+        await this.ProjectEntityUpdateHandler.promises.convertDocToFile(
           this.project._id,
           this.doc._id,
-          this.user._id,
-          this.source,
-          done
+          userId,
+          this.source
         )
       })
 
@@ -2960,7 +2906,12 @@ describe('ProjectEntityUpdateHandler', function () {
       it('replaces the doc with the file', function () {
         expect(
           this.ProjectEntityMongoUpdateHandler.promises.replaceDocWithFile
-        ).to.have.been.calledWith(this.project._id, this.doc._id, this.file)
+        ).to.have.been.calledWith(
+          this.project._id,
+          this.doc._id,
+          this.file,
+          userId
+        )
       })
 
       it('notifies document updater of changes', function () {
@@ -2969,7 +2920,7 @@ describe('ProjectEntityUpdateHandler', function () {
         ).to.have.been.calledWith(
           this.project._id,
           this.project.overleaf.history.id,
-          this.user._id,
+          userId,
           {
             oldDocs: [{ doc: this.doc, path: this.path }],
             newFiles: [
@@ -3012,7 +2963,7 @@ describe('ProjectEntityUpdateHandler', function () {
     })
 
     describe('when the doc has ranges', function () {
-      it('should throw a DocHasRangesError', function (done) {
+      it('should throw a DocHasRangesError', async function () {
         this.ranges = { comments: [{ id: 123 }] }
         this.DocstoreManager.promises.getDoc
           .withArgs(this.project._id, this.doc._id)
@@ -3022,16 +2973,20 @@ describe('ProjectEntityUpdateHandler', function () {
             version: 'version',
             ranges: this.ranges,
           })
-        this.ProjectEntityUpdateHandler.convertDocToFile(
-          this.project._id,
-          this.doc._id,
-          this.user._id,
-          this.source,
-          err => {
-            expect(err).to.be.instanceof(Errors.DocHasRangesError)
-            done()
-          }
-        )
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.convertDocToFile(
+            this.project._id,
+            this.doc._id,
+            this.user._id,
+            this.source
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.DocHasRangesError)
       })
     })
   })
@@ -3076,7 +3031,7 @@ describe('ProjectEntityUpdateHandler', function () {
 
   describe('setMainBibliographyDoc', function () {
     describe('on success', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.doc = {
           _id: new ObjectId(),
           name: 'test.bib',
@@ -3086,12 +3041,9 @@ describe('ProjectEntityUpdateHandler', function () {
           .withArgs(this.project._id, this.doc._id)
           .resolves(this.path)
 
-        this.callback = sinon.stub().callsFake(() => done())
-
-        this.ProjectEntityUpdateHandler.setMainBibliographyDoc(
+        await this.ProjectEntityUpdateHandler.promises.setMainBibliographyDoc(
           this.project._id,
-          this.doc._id,
-          this.callback
+          this.doc._id
         )
       })
 
@@ -3105,7 +3057,8 @@ describe('ProjectEntityUpdateHandler', function () {
 
     describe('on failure', function () {
       describe("when document can't be found", function () {
-        beforeEach(function (done) {
+        let setMainBibliographyDocPromise
+        beforeEach(function () {
           this.doc = {
             _id: new ObjectId(),
             name: 'test.bib',
@@ -3113,29 +3066,42 @@ describe('ProjectEntityUpdateHandler', function () {
           this.ProjectEntityHandler.promises.getDocPathByProjectIdAndDocId
             .withArgs(this.project._id, this.doc._id)
             .rejects(new Error('error'))
-
-          this.callback = sinon.stub().callsFake(() => done())
-
-          this.ProjectEntityUpdateHandler.setMainBibliographyDoc(
-            this.project._id,
-            this.doc._id,
-            this.callback
-          )
+          setMainBibliographyDocPromise =
+            this.ProjectEntityUpdateHandler.promises.setMainBibliographyDoc(
+              this.project._id,
+              this.doc._id
+            )
         })
 
-        it('should call the callback with an error', function () {
-          expect(this.callback).to.have.been.calledWith(
-            sinon.match.instanceOf(Error)
-          )
+        it('should call the callback with an error', async function () {
+          let error
+
+          try {
+            await setMainBibliographyDocPromise
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.be.instanceOf(Error)
         })
 
-        it('should not update the project with the new main bibliography doc', function () {
+        it('should not update the project with the new main bibliography doc', async function () {
+          let error
+
+          try {
+            await setMainBibliographyDocPromise
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.exist
           expect(this.ProjectModel.updateOne).to.not.have.been.called
         })
       })
 
       describe("when path is not a bib file can't be found", function () {
-        beforeEach(function (done) {
+        let setMainBibliographyDocPromise
+        beforeEach(function () {
           this.doc = {
             _id: new ObjectId(),
             name: 'test.bib',
@@ -3145,23 +3111,35 @@ describe('ProjectEntityUpdateHandler', function () {
           this.ProjectEntityHandler.promises.getDocPathByProjectIdAndDocId
             .withArgs(this.project._id, this.doc._id)
             .resolves(this.path)
-
-          this.callback = sinon.stub().callsFake(() => done())
-
-          this.ProjectEntityUpdateHandler.setMainBibliographyDoc(
-            this.project._id,
-            this.doc._id,
-            this.callback
-          )
+          setMainBibliographyDocPromise =
+            this.ProjectEntityUpdateHandler.promises.setMainBibliographyDoc(
+              this.project._id,
+              this.doc._id
+            )
         })
 
-        it('should call the callback with an error', function () {
-          expect(this.callback).to.have.been.calledWith(
-            sinon.match.instanceOf(Error)
-          )
+        it('should reject with an error', async function () {
+          let error
+
+          try {
+            await setMainBibliographyDocPromise
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.be.instanceOf(Error)
         })
 
-        it('should not update the project with the new main bibliography doc', function () {
+        it('should not update the project with the new main bibliography doc', async function () {
+          let error
+
+          try {
+            await setMainBibliographyDocPromise
+          } catch (err) {
+            error = err
+          }
+
+          expect(error).to.exist
           expect(this.ProjectModel.updateOne).to.not.have.been.called
         })
       })
@@ -3170,40 +3148,54 @@ describe('ProjectEntityUpdateHandler', function () {
 
   describe('appendToDoc', function () {
     describe('when document cannot be found', function () {
-      beforeEach(function (done) {
+      let appendToDocPromise
+      beforeEach(function () {
         this.appendedLines = ['5678', 'def']
         this.DocumentUpdaterHandler.promises.appendToDocument = sinon.stub()
         this.ProjectLocator.promises.findElement = sinon.stub()
         this.ProjectLocator.promises.findElement
           .withArgs({ project_id: projectId, element_id: docId, type: 'doc' })
           .rejects(new Errors.NotFoundError())
-        this.ProjectEntityUpdateHandler.appendToDoc(
-          projectId,
-          docId,
-          this.appendedLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        appendToDocPromise =
+          this.ProjectEntityUpdateHandler.promises.appendToDocWithPath(
+            projectId,
+            docId,
+            this.appendedLines,
+            this.source,
+            userId
+          )
       })
 
-      it('should not talk to DocumentUpdaterHandler', function () {
+      it('should not talk to DocumentUpdaterHandler', async function () {
+        let error
+
+        try {
+          await appendToDocPromise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
         this.DocumentUpdaterHandler.promises.appendToDocument.should.not.have
           .been.called
       })
 
-      it('should throw the error', function () {
-        this.callback.should.have.been.calledWith(
-          sinon.match.instanceOf(Errors.NotFoundError)
-        )
+      it('should throw the error', async function () {
+        let error
+
+        try {
+          await appendToDocPromise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Errors.NotFoundError)
       })
     })
 
     describe('when document is found', function () {
-      beforeEach(function (done) {
+      let appendToDocResult
+      beforeEach(async function () {
         this.appendedLines = ['5678', 'def']
         this.DocumentUpdaterHandler.promises.appendToDocument = sinon.stub()
         this.DocumentUpdaterHandler.promises.appendToDocument
@@ -3213,17 +3205,14 @@ describe('ProjectEntityUpdateHandler', function () {
         this.ProjectLocator.promises.findElement
           .withArgs({ project_id: projectId, element_id: docId, type: 'doc' })
           .resolves({ element: { _id: docId } })
-        this.ProjectEntityUpdateHandler.appendToDoc(
-          projectId,
-          docId,
-          this.appendedLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
+        appendToDocResult =
+          await this.ProjectEntityUpdateHandler.promises.appendToDocWithPath(
+            projectId,
+            docId,
+            this.appendedLines,
+            this.source,
+            userId
+          )
       })
 
       it('should forward call to DocumentUpdaterHandler.appendToDocument', function () {
@@ -3237,12 +3226,12 @@ describe('ProjectEntityUpdateHandler', function () {
       })
 
       it('should return the response from DocumentUpdaterHandler', function () {
-        this.callback.should.have.been.calledWith(null, { rev: 1 })
+        expect(appendToDocResult).to.eql({ rev: 1 })
       })
     })
 
     describe('when DocumentUpdater throws an error', function () {
-      beforeEach(function (done) {
+      beforeEach(function () {
         this.appendedLines = ['5678', 'def']
         this.DocumentUpdaterHandler.promises.appendToDocument = sinon.stub()
         this.DocumentUpdaterHandler.promises.appendToDocument.rejects(
@@ -3252,21 +3241,24 @@ describe('ProjectEntityUpdateHandler', function () {
         this.ProjectLocator.promises.findElement
           .withArgs({ project_id: projectId, element_id: docId, type: 'doc' })
           .resolves({ element: { _id: docId } })
-        this.ProjectEntityUpdateHandler.appendToDoc(
-          projectId,
-          docId,
-          this.appendedLines,
-          this.source,
-          userId,
-          (...args) => {
-            this.callback(...args)
-            done()
-          }
-        )
       })
 
-      it('should return the response from DocumentUpdaterHandler', function () {
-        this.callback.should.have.been.calledWith(sinon.match.instanceOf(Error))
+      it('should return the response from DocumentUpdaterHandler', async function () {
+        let error
+
+        try {
+          await this.ProjectEntityUpdateHandler.promises.appendToDocWithPath(
+            projectId,
+            docId,
+            this.appendedLines,
+            this.source,
+            userId
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(Error)
       })
     })
   })
diff --git a/services/web/test/unit/src/Project/ProjectHelperTests.js b/services/web/test/unit/src/Project/ProjectHelperTests.js
index 7dc2343313..9aee9fc363 100644
--- a/services/web/test/unit/src/Project/ProjectHelperTests.js
+++ b/services/web/test/unit/src/Project/ProjectHelperTests.js
@@ -101,134 +101,6 @@ describe('ProjectHelper', function () {
     })
   })
 
-  describe('calculateArchivedArray', function () {
-    describe('project.archived being an array', function () {
-      it('returns an array adding the current user id when archiving', function () {
-        const project = { archived: [] }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'ARCHIVE'
-        )
-        expect(result).to.deep.equal([new ObjectId('5c922599cdb09e014aa7d499')])
-      })
-
-      it('returns an array without the current user id when unarchiving', function () {
-        const project = { archived: [new ObjectId('5c922599cdb09e014aa7d499')] }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'UNARCHIVE'
-        )
-        expect(result).to.deep.equal([])
-      })
-    })
-
-    describe('project.archived being a boolean and being true', function () {
-      it('returns an array of all associated user ids when archiving', function () {
-        const project = {
-          archived: true,
-          owner_ref: this.user._id,
-          collaberator_refs: [
-            new ObjectId('4f2cfb341eb5855a5b000f8b'),
-            new ObjectId('5c45f3bd425ead01488675aa'),
-          ],
-          readOnly_refs: [new ObjectId('5c92243fcdb09e014aa7d487')],
-          tokenAccessReadAndWrite_refs: [
-            new ObjectId('5c922599cdb09e014aa7d499'),
-          ],
-          tokenAccessReadOnly_refs: [],
-        }
-
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          this.user._id,
-          'ARCHIVE'
-        )
-        expect(result).to.deep.equal([
-          this.user._id,
-          new ObjectId('4f2cfb341eb5855a5b000f8b'),
-          new ObjectId('5c45f3bd425ead01488675aa'),
-          new ObjectId('5c92243fcdb09e014aa7d487'),
-          new ObjectId('5c922599cdb09e014aa7d499'),
-        ])
-      })
-
-      it('returns an array of all associated users without the current user id when unarchived', function () {
-        const project = {
-          archived: true,
-          owner_ref: this.user._id,
-          collaberator_refs: [
-            new ObjectId('4f2cfb341eb5855a5b000f8b'),
-            new ObjectId('5c45f3bd425ead01488675aa'),
-            new ObjectId('5c922599cdb09e014aa7d499'),
-          ],
-          readOnly_refs: [new ObjectId('5c92243fcdb09e014aa7d487')],
-          tokenAccessReadAndWrite_refs: [
-            new ObjectId('5c922599cdb09e014aa7d499'),
-          ],
-          tokenAccessReadOnly_refs: [],
-        }
-
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          this.user._id,
-          'UNARCHIVE'
-        )
-        expect(result).to.deep.equal([
-          new ObjectId('4f2cfb341eb5855a5b000f8b'),
-          new ObjectId('5c45f3bd425ead01488675aa'),
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          new ObjectId('5c92243fcdb09e014aa7d487'),
-        ])
-      })
-    })
-
-    describe('project.archived being a boolean and being false', function () {
-      it('returns an array adding the current user id when archiving', function () {
-        const project = { archived: false }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'ARCHIVE'
-        )
-        expect(result).to.deep.equal([new ObjectId('5c922599cdb09e014aa7d499')])
-      })
-
-      it('returns an empty array when unarchiving', function () {
-        const project = { archived: false }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'UNARCHIVE'
-        )
-        expect(result).to.deep.equal([])
-      })
-    })
-
-    describe('project.archived not being set', function () {
-      it('returns an array adding the current user id when archiving', function () {
-        const project = { archived: undefined }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'ARCHIVE'
-        )
-        expect(result).to.deep.equal([new ObjectId('5c922599cdb09e014aa7d499')])
-      })
-
-      it('returns an empty array when unarchiving', function () {
-        const project = { archived: undefined }
-        const result = this.ProjectHelper.calculateArchivedArray(
-          project,
-          new ObjectId('5c922599cdb09e014aa7d499'),
-          'UNARCHIVE'
-        )
-        expect(result).to.deep.equal([])
-      })
-    })
-  })
-
   describe('compilerFromV1Engine', function () {
     it('returns the correct engine for latex_dvipdf', function () {
       expect(this.ProjectHelper.compilerFromV1Engine('latex_dvipdf')).to.equal(
diff --git a/services/web/test/unit/src/Project/ProjectListController.test.mjs b/services/web/test/unit/src/Project/ProjectListController.test.mjs
new file mode 100644
index 0000000000..1f83bfb0c5
--- /dev/null
+++ b/services/web/test/unit/src/Project/ProjectListController.test.mjs
@@ -0,0 +1,891 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import mongodb from 'mongodb-legacy'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH = new URL(
+  '../../../../app/src/Features/Project/ProjectListController',
+  import.meta.url
+).pathname
+
+describe('ProjectListController', function () {
+  beforeEach(async function (ctx) {
+    ctx.project_id = new ObjectId('abcdefabcdefabcdefabcdef')
+
+    ctx.user = {
+      _id: new ObjectId('123456123456123456123456'),
+      email: 'test@overleaf.com',
+      first_name: 'bjkdsjfk',
+      features: {},
+      emails: [{ email: 'test@overleaf.com' }],
+      lastLoginIp: '111.111.111.112',
+    }
+    ctx.users = {
+      'user-1': {
+        first_name: 'James',
+      },
+      'user-2': {
+        first_name: 'Henry',
+      },
+    }
+    ctx.users[ctx.user._id] = ctx.user // Owner
+    ctx.usersArr = Object.entries(ctx.users).map(([key, value]) => ({
+      _id: key,
+      ...value,
+    }))
+    ctx.tags = [
+      { name: 1, project_ids: ['1', '2', '3'] },
+      { name: 2, project_ids: ['a', '1'] },
+      { name: 3, project_ids: ['a', 'b', 'c', 'd'] },
+    ]
+    ctx.notifications = [
+      {
+        _id: '1',
+        user_id: '2',
+        templateKey: '3',
+        messageOpts: '4',
+        key: '5',
+      },
+    ]
+    ctx.settings = {
+      siteUrl: 'https://overleaf.com',
+    }
+    ctx.TagsHandler = {
+      promises: {
+        getAllTags: sinon.stub().resolves(ctx.tags),
+      },
+    }
+    ctx.NotificationsHandler = {
+      promises: {
+        getUserNotifications: sinon.stub().resolves(ctx.notifications),
+      },
+    }
+    ctx.UserModel = {
+      findById: sinon.stub().resolves(ctx.user),
+    }
+    ctx.UserPrimaryEmailCheckHandler = {
+      requiresPrimaryEmailCheck: sinon.stub().returns(false),
+    }
+    ctx.ProjectGetter = {
+      promises: {
+        findAllUsersProjects: sinon.stub(),
+      },
+    }
+    ctx.ProjectHelper = {
+      isArchived: sinon.stub(),
+      isTrashed: sinon.stub(),
+    }
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+    }
+    ctx.UserController = {
+      logout: sinon.stub(),
+    }
+    ctx.UserGetter = {
+      promises: {
+        getUsers: sinon.stub().resolves(ctx.usersArr),
+        getUserFullEmails: sinon.stub().resolves([]),
+        getWritefullData: sinon.stub().resolves({ isPremium: true }),
+      },
+    }
+    ctx.Features = {
+      hasFeature: sinon.stub(),
+    }
+    ctx.Metrics = {
+      inc: sinon.stub(),
+    }
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().resolves({ variant: 'default' }),
+        hasUserBeenAssignedToVariant: sinon.stub().resolves(false),
+      },
+    }
+    ctx.SplitTestSessionHandler = {
+      promises: {
+        sessionMaintenance: sinon.stub().resolves(),
+      },
+    }
+    ctx.SubscriptionViewModelBuilder = {
+      promises: {
+        getUsersSubscriptionDetails: sinon.stub().resolves({
+          bestSubscription: { type: 'free' },
+          individualSubscription: null,
+          memberGroupSubscriptions: [],
+        }),
+      },
+    }
+    ctx.SurveyHandler = {
+      promises: {
+        getSurvey: sinon.stub().resolves({}),
+      },
+    }
+    ctx.NotificationBuilder = {
+      promises: {
+        ipMatcherAffiliation: sinon.stub().returns({ create: sinon.stub() }),
+      },
+    }
+    ctx.GeoIpLookup = {
+      promises: {
+        getCurrencyCode: sinon.stub().resolves({
+          countryCode: 'US',
+          currencyCode: 'USD',
+        }),
+      },
+    }
+    ctx.TutorialHandler = {
+      getInactiveTutorials: sinon.stub().returns([]),
+    }
+
+    ctx.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub().resolves([]),
+        },
+      },
+    }
+
+    ctx.PermissionsManager = {
+      promises: {
+        checkUserPermissions: sinon.stub().resolves(true),
+      },
+    }
+
+    ctx.SubscriptionLocator = {
+      promises: {
+        getUsersSubscription: sinon.stub().resolves({}),
+      },
+    }
+
+    vi.doMock('mongodb-legacy', () => ({
+      default: { ObjectId },
+    }))
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock('@overleaf/metrics', () => ({
+      default: ctx.Metrics,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestSessionHandler',
+      () => ({
+        default: ctx.SplitTestSessionHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserController', () => ({
+      default: ctx.UserController,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectHelper', () => ({
+      default: ctx.ProjectHelper,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Tags/TagsHandler', () => ({
+      default: ctx.TagsHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsHandler',
+      () => ({
+        default: ctx.NotificationsHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/models/User', () => ({
+      User: ctx.UserModel,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Features', () => ({
+      default: ctx.Features,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionViewModelBuilder',
+      () => ({
+        default: ctx.SubscriptionViewModelBuilder,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: ctx.Modules,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Survey/SurveyHandler', () => ({
+      default: ctx.SurveyHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/User/UserPrimaryEmailCheckHandler',
+      () => ({
+        default: ctx.UserPrimaryEmailCheckHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsBuilder',
+      () => ({
+        default: ctx.NotificationBuilder,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/GeoIpLookup', () => ({
+      default: ctx.GeoIpLookup,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Tutorial/TutorialHandler', () => ({
+      default: ctx.TutorialHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authorization/PermissionsManager',
+      () => ({
+        default: ctx.PermissionsManager,
+      })
+    )
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionLocator',
+      () => ({
+        default: ctx.SubscriptionLocator,
+      })
+    )
+
+    ctx.ProjectListController = (await import(MODULE_PATH)).default
+
+    ctx.req = {
+      query: {},
+      params: {
+        Project_id: ctx.project_id,
+      },
+      headers: {},
+      session: {
+        user: ctx.user,
+      },
+      body: {},
+      i18n: {
+        translate() {},
+      },
+    }
+    ctx.res = {}
+  })
+
+  describe('projectListPage', function () {
+    beforeEach(function (ctx) {
+      ctx.projects = [
+        { _id: 1, lastUpdated: 1, owner_ref: 'user-1' },
+        {
+          _id: 2,
+          lastUpdated: 2,
+          owner_ref: 'user-2',
+          lastUpdatedBy: 'user-1',
+        },
+      ]
+      ctx.readAndWrite = [{ _id: 5, lastUpdated: 5, owner_ref: 'user-1' }]
+      ctx.readOnly = [{ _id: 3, lastUpdated: 3, owner_ref: 'user-1' }]
+      ctx.tokenReadAndWrite = [{ _id: 6, lastUpdated: 5, owner_ref: 'user-4' }]
+      ctx.tokenReadOnly = [{ _id: 7, lastUpdated: 4, owner_ref: 'user-5' }]
+      ctx.review = [{ _id: 8, lastUpdated: 4, owner_ref: 'user-6' }]
+      ctx.allProjects = {
+        owned: ctx.projects,
+        readAndWrite: ctx.readAndWrite,
+        readOnly: ctx.readOnly,
+        tokenReadAndWrite: ctx.tokenReadAndWrite,
+        tokenReadOnly: ctx.tokenReadOnly,
+        review: ctx.review,
+      }
+
+      ctx.ProjectGetter.promises.findAllUsersProjects.resolves(ctx.allProjects)
+    })
+
+    it('should render the project/list-react page', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          pageName.should.equal('project/list-react')
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should invoke the session maintenance', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.Features.hasFeature.withArgs('saas').returns(true)
+        ctx.res.render = () => {
+          ctx.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
+            ctx.req,
+            ctx.user
+          )
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send the tags', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          opts.tags.length.should.equal(ctx.tags.length)
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should create trigger ip matcher notifications', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.settings.overleaf = true
+        ctx.req.ip = '111.111.111.111'
+        ctx.res.render = (pageName, opts) => {
+          ctx.NotificationBuilder.promises.ipMatcherAffiliation.called.should.equal(
+            true
+          )
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send the projects', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          opts.prefetchedProjectsBlob.projects.length.should.equal(
+            ctx.projects.length +
+              ctx.readAndWrite.length +
+              ctx.readOnly.length +
+              ctx.tokenReadAndWrite.length +
+              ctx.tokenReadOnly.length +
+              ctx.review.length
+          )
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should send the user', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          opts.user.should.deep.equal(ctx.user)
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should inject the users', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          const projects = opts.prefetchedProjectsBlob.projects
+
+          projects
+            .filter(p => p.id === '1')[0]
+            .owner.firstName.should.equal(
+              ctx.users[ctx.projects.filter(p => p._id === 1)[0].owner_ref]
+                .first_name
+            )
+          projects
+            .filter(p => p.id === '2')[0]
+            .owner.firstName.should.equal(
+              ctx.users[ctx.projects.filter(p => p._id === 2)[0].owner_ref]
+                .first_name
+            )
+          projects
+            .filter(p => p.id === '2')[0]
+            .lastUpdatedBy.firstName.should.equal(
+              ctx.users[ctx.projects.filter(p => p._id === 2)[0].lastUpdatedBy]
+                .first_name
+            )
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it("should send the user's best subscription when saas feature present", async function (ctx) {
+      await new Promise(resolve => {
+        ctx.Features.hasFeature.withArgs('saas').returns(true)
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.usersBestSubscription).to.deep.include({ type: 'free' })
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should not return a best subscription without saas feature', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.Features.hasFeature.withArgs('saas').returns(false)
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.usersBestSubscription).to.be.undefined
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should show INR Banner for Indian users with free account', async function (ctx) {
+      await new Promise(resolve => {
+        // usersBestSubscription is only available when saas feature is present
+        ctx.Features.hasFeature.withArgs('saas').returns(true)
+        ctx.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails.resolves(
+          {
+            bestSubscription: {
+              type: 'free',
+            },
+          }
+        )
+        ctx.GeoIpLookup.promises.getCurrencyCode.resolves({
+          countryCode: 'IN',
+        })
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.showInrGeoBanner).to.be.true
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should not show INR Banner for Indian users with premium account', async function (ctx) {
+      await new Promise(resolve => {
+        // usersBestSubscription is only available when saas feature is present
+        ctx.Features.hasFeature.withArgs('saas').returns(true)
+        ctx.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails.resolves(
+          {
+            bestSubscription: {
+              type: 'individual',
+            },
+          }
+        )
+        ctx.GeoIpLookup.promises.getCurrencyCode.resolves({
+          countryCode: 'IN',
+        })
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.showInrGeoBanner).to.be.false
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    describe('With Institution SSO feature', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.institutionEmail = 'test@overleaf.com'
+          ctx.institutionName = 'Overleaf'
+          ctx.Features.hasFeature.withArgs('saml').returns(true)
+          ctx.Features.hasFeature.withArgs('affiliations').returns(true)
+          ctx.Features.hasFeature.withArgs('saas').returns(true)
+          resolve()
+        })
+      })
+      it('should show institution SSO available notification for confirmed domains', function (ctx) {
+        ctx.UserGetter.promises.getUserFullEmails.resolves([
+          {
+            email: 'test@overleaf.com',
+            affiliation: {
+              institution: {
+                id: 1,
+                confirmed: true,
+                name: 'Overleaf',
+                ssoBeta: false,
+                ssoEnabled: true,
+              },
+            },
+          },
+        ])
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.include({
+            email: ctx.institutionEmail,
+            institutionId: 1,
+            institutionName: ctx.institutionName,
+            templateKey: 'notification_institution_sso_available',
+          })
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+      it('should show a linked notification', function (ctx) {
+        ctx.req.session.saml = {
+          institutionEmail: ctx.institutionEmail,
+          linked: {
+            hasEntitlement: false,
+            universityName: ctx.institutionName,
+          },
+        }
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.include({
+            email: ctx.institutionEmail,
+            institutionName: ctx.institutionName,
+            templateKey: 'notification_institution_sso_linked',
+          })
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+      it('should show a linked another email notification', function (ctx) {
+        // when they request to link an email but the institution returns
+        // a different email
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.include({
+            institutionEmail: ctx.institutionEmail,
+            requestedEmail: 'requested@overleaf.com',
+            templateKey: 'notification_institution_sso_non_canonical',
+          })
+        }
+        ctx.req.session.saml = {
+          emailNonCanonical: ctx.institutionEmail,
+          institutionEmail: ctx.institutionEmail,
+          requestedEmail: 'requested@overleaf.com',
+          linked: {
+            hasEntitlement: false,
+            universityName: ctx.institutionName,
+          },
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+
+      it('should show a notification when intent was to register via SSO but account existed', function (ctx) {
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.include({
+            email: ctx.institutionEmail,
+            templateKey: 'notification_institution_sso_already_registered',
+          })
+        }
+        ctx.req.session.saml = {
+          institutionEmail: ctx.institutionEmail,
+          linked: {
+            hasEntitlement: false,
+            universityName: 'Overleaf',
+          },
+          registerIntercept: {
+            id: 1,
+            name: 'Example University',
+          },
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+
+      it('should not show a register notification if the flow was abandoned', function (ctx) {
+        // could initially start to register with an SSO email and then
+        // abandon flow and login with an existing non-institution SSO email
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.not.include({
+            email: 'test@overleaf.com',
+            templateKey: 'notification_institution_sso_already_registered',
+          })
+        }
+        ctx.req.session.saml = {
+          registerIntercept: {
+            id: 1,
+            name: 'Example University',
+          },
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+
+      it('should show error notification', function (ctx) {
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution.length).to.equal(1)
+          expect(opts.notificationsInstitution[0].templateKey).to.equal(
+            'notification_institution_sso_error'
+          )
+          expect(opts.notificationsInstitution[0].error).to.be.instanceof(
+            Errors.SAMLAlreadyLinkedError
+          )
+        }
+        ctx.req.session.saml = {
+          institutionEmail: ctx.institutionEmail,
+          error: new Errors.SAMLAlreadyLinkedError(),
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+
+      describe('for an unconfirmed domain for an SSO institution', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.UserGetter.promises.getUserFullEmails.resolves([
+              {
+                email: 'test@overleaf-uncofirmed.com',
+                affiliation: {
+                  institution: {
+                    id: 1,
+                    confirmed: false,
+                    name: 'Overleaf',
+                    ssoBeta: false,
+                    ssoEnabled: true,
+                  },
+                },
+              },
+            ])
+            resolve()
+          })
+        })
+        it('should not show institution SSO available notification', function (ctx) {
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.notificationsInstitution.length).to.equal(0)
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+      })
+      describe('when linking/logging in initiated on institution side', function () {
+        it('should not show a linked another email notification', function (ctx) {
+          // this is only used when initated on Overleaf,
+          // because we keep track of the requested email they tried to link
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.notificationsInstitution).to.not.deep.include({
+              institutionEmail: ctx.institutionEmail,
+              requestedEmail: undefined,
+              templateKey: 'notification_institution_sso_non_canonical',
+            })
+          }
+          ctx.req.session.saml = {
+            emailNonCanonical: ctx.institutionEmail,
+            institutionEmail: ctx.institutionEmail,
+            linked: {
+              hasEntitlement: false,
+              universityName: ctx.institutionName,
+            },
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+      })
+      describe('Institution with SSO beta testable', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.UserGetter.promises.getUserFullEmails.resolves([
+              {
+                email: 'beta@beta.com',
+                affiliation: {
+                  institution: {
+                    id: 2,
+                    confirmed: true,
+                    name: 'Beta University',
+                    ssoBeta: true,
+                    ssoEnabled: false,
+                  },
+                },
+              },
+            ])
+            resolve()
+          })
+        })
+        it('should show institution SSO available notification when on a beta testing session', function (ctx) {
+          ctx.req.session.samlBeta = true
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.notificationsInstitution).to.deep.include({
+              email: 'beta@beta.com',
+              institutionId: 2,
+              institutionName: 'Beta University',
+              templateKey: 'notification_institution_sso_available',
+            })
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+        it('should not show institution SSO available notification when not on a beta testing session', function (ctx) {
+          ctx.req.session.samlBeta = false
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.notificationsInstitution).to.deep.not.include({
+              email: 'test@overleaf.com',
+              institutionId: 1,
+              institutionName: 'Overleaf',
+              templateKey: 'notification_institution_sso_available',
+            })
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+      })
+    })
+
+    describe('Without Institution SSO feature', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.Features.hasFeature.withArgs('saml').returns(false)
+          resolve()
+        })
+      })
+      it('should not show institution sso available notification', function (ctx) {
+        ctx.res.render = (pageName, opts) => {
+          expect(opts.notificationsInstitution).to.deep.not.include({
+            email: 'test@overleaf.com',
+            institutionId: 1,
+            institutionName: 'Overleaf',
+            templateKey: 'notification_institution_sso_available',
+          })
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    describe('enterprise banner', function () {
+      beforeEach(function (ctx) {
+        ctx.Features.hasFeature.withArgs('saas').returns(true)
+        ctx.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails.resolves(
+          { memberGroupSubscriptions: [] }
+        )
+        ctx.UserGetter.promises.getUserFullEmails.resolves([
+          {
+            email: 'test@test-domain.com',
+          },
+        ])
+      })
+
+      describe('normal enterprise banner', function () {
+        it('shows banner', function (ctx) {
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.showGroupsAndEnterpriseBanner).to.be.true
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+
+        it('does not show banner if user is part of any affiliation', function (ctx) {
+          ctx.UserGetter.promises.getUserFullEmails.resolves([
+            {
+              email: 'test@overleaf.com',
+              affiliation: {
+                licence: 'pro_plus',
+                institution: {
+                  id: 1,
+                  confirmed: true,
+                  name: 'Overleaf',
+                  ssoBeta: false,
+                  ssoEnabled: true,
+                },
+              },
+            },
+          ])
+
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+
+        it('does not show banner if user is part of any group subscription', function (ctx) {
+          ctx.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails.resolves(
+            { memberGroupSubscriptions: [{}] }
+          )
+
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+
+        it('have a banner variant of "FOMO" or "on-premise"', function (ctx) {
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.groupsAndEnterpriseBannerVariant).to.be.oneOf([
+              'FOMO',
+              'on-premise',
+            ])
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+      })
+
+      describe('US government enterprise banner', function () {
+        it('does not show enterprise banner if US government enterprise banner is shown', function (ctx) {
+          const emails = [
+            {
+              email: 'test@test.mil',
+              confirmedAt: new Date('2024-01-01'),
+            },
+          ]
+
+          ctx.UserGetter.promises.getUserFullEmails.resolves(emails)
+          ctx.Modules.promises.hooks.fire
+            .withArgs('getUSGovBanner', emails, false, [])
+            .resolves([
+              {
+                showUSGovBanner: true,
+                usGovBannerVariant: 'variant',
+              },
+            ])
+          ctx.res.render = (pageName, opts) => {
+            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
+            expect(opts.showUSGovBanner).to.be.true
+          }
+          ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+        })
+      })
+    })
+  })
+
+  describe('projectListReactPage with duplicate projects', function () {
+    beforeEach(function (ctx) {
+      ctx.projects = [
+        { _id: 1, lastUpdated: 1, owner_ref: 'user-1' },
+        { _id: 2, lastUpdated: 2, owner_ref: 'user-2' },
+      ]
+      ctx.readAndWrite = [{ _id: 5, lastUpdated: 5, owner_ref: 'user-1' }]
+      ctx.readOnly = [{ _id: 3, lastUpdated: 3, owner_ref: 'user-1' }]
+      ctx.tokenReadAndWrite = [{ _id: 6, lastUpdated: 5, owner_ref: 'user-4' }]
+      ctx.tokenReadOnly = [
+        { _id: 6, lastUpdated: 5, owner_ref: 'user-4' }, // Also in tokenReadAndWrite
+        { _id: 7, lastUpdated: 4, owner_ref: 'user-5' },
+      ]
+      ctx.review = [{ _id: 8, lastUpdated: 5, owner_ref: 'user-6' }]
+      ctx.allProjects = {
+        owned: ctx.projects,
+        readAndWrite: ctx.readAndWrite,
+        readOnly: ctx.readOnly,
+        tokenReadAndWrite: ctx.tokenReadAndWrite,
+        tokenReadOnly: ctx.tokenReadOnly,
+        review: ctx.review,
+      }
+
+      ctx.ProjectGetter.promises.findAllUsersProjects.resolves(ctx.allProjects)
+    })
+
+    it('should render the project/list-react page', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          pageName.should.equal('project/list-react')
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+
+    it('should omit one of the projects', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.res.render = (pageName, opts) => {
+          opts.prefetchedProjectsBlob.projects.length.should.equal(
+            ctx.projects.length +
+              ctx.readAndWrite.length +
+              ctx.readOnly.length +
+              ctx.tokenReadAndWrite.length +
+              ctx.tokenReadOnly.length +
+              ctx.review.length -
+              1
+          )
+          resolve()
+        }
+        ctx.ProjectListController.projectListPage(ctx.req, ctx.res)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Project/ProjectListControllerTests.mjs b/services/web/test/unit/src/Project/ProjectListControllerTests.mjs
deleted file mode 100644
index 40c6dfaa54..0000000000
--- a/services/web/test/unit/src/Project/ProjectListControllerTests.mjs
+++ /dev/null
@@ -1,764 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-import mongodb from 'mongodb-legacy'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH = new URL(
-  '../../../../app/src/Features/Project/ProjectListController',
-  import.meta.url
-).pathname
-
-describe('ProjectListController', function () {
-  beforeEach(async function () {
-    this.project_id = new ObjectId('abcdefabcdefabcdefabcdef')
-
-    this.user = {
-      _id: new ObjectId('123456123456123456123456'),
-      email: 'test@overleaf.com',
-      first_name: 'bjkdsjfk',
-      features: {},
-      emails: [{ email: 'test@overleaf.com' }],
-      lastLoginIp: '111.111.111.112',
-    }
-    this.users = {
-      'user-1': {
-        first_name: 'James',
-      },
-      'user-2': {
-        first_name: 'Henry',
-      },
-    }
-    this.users[this.user._id] = this.user // Owner
-    this.usersArr = Object.entries(this.users).map(([key, value]) => ({
-      _id: key,
-      ...value,
-    }))
-    this.tags = [
-      { name: 1, project_ids: ['1', '2', '3'] },
-      { name: 2, project_ids: ['a', '1'] },
-      { name: 3, project_ids: ['a', 'b', 'c', 'd'] },
-    ]
-    this.notifications = [
-      {
-        _id: '1',
-        user_id: '2',
-        templateKey: '3',
-        messageOpts: '4',
-        key: '5',
-      },
-    ]
-    this.settings = {
-      siteUrl: 'https://overleaf.com',
-    }
-    this.LimitationsManager = {
-      promises: {
-        userIsMemberOfGroupSubscription: sinon.stub().resolves(false),
-      },
-    }
-    this.TagsHandler = {
-      promises: {
-        getAllTags: sinon.stub().resolves(this.tags),
-      },
-    }
-    this.NotificationsHandler = {
-      promises: {
-        getUserNotifications: sinon.stub().resolves(this.notifications),
-      },
-    }
-    this.UserModel = {
-      findById: sinon.stub().resolves(this.user),
-    }
-    this.UserPrimaryEmailCheckHandler = {
-      requiresPrimaryEmailCheck: sinon.stub().returns(false),
-    }
-    this.ProjectGetter = {
-      promises: {
-        findAllUsersProjects: sinon.stub(),
-      },
-    }
-    this.ProjectHelper = {
-      isArchived: sinon.stub(),
-      isTrashed: sinon.stub(),
-    }
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns(this.user._id),
-    }
-    this.UserController = {
-      logout: sinon.stub(),
-    }
-    this.UserGetter = {
-      promises: {
-        getUsers: sinon.stub().resolves(this.usersArr),
-        getUserFullEmails: sinon.stub().resolves([]),
-      },
-    }
-    this.Features = {
-      hasFeature: sinon.stub(),
-    }
-    this.Metrics = {
-      inc: sinon.stub(),
-    }
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves({ variant: 'default' }),
-      },
-    }
-    this.SplitTestSessionHandler = {
-      promises: {
-        sessionMaintenance: sinon.stub().resolves(),
-      },
-    }
-    this.SubscriptionViewModelBuilder = {
-      promises: {
-        getBestSubscription: sinon.stub().resolves({ type: 'free' }),
-      },
-    }
-    this.SurveyHandler = {
-      promises: {
-        getSurvey: sinon.stub().resolves({}),
-      },
-    }
-    this.NotificationBuilder = {
-      promises: {
-        ipMatcherAffiliation: sinon.stub().returns({ create: sinon.stub() }),
-      },
-    }
-    this.SubscriptionLocator = {
-      promises: {
-        getUserSubscription: sinon.stub().resolves({}),
-      },
-    }
-    this.GeoIpLookup = {
-      promises: {
-        getCurrencyCode: sinon.stub().resolves({
-          countryCode: 'US',
-          currencyCode: 'USD',
-        }),
-      },
-    }
-    this.TutorialHandler = {
-      getInactiveTutorials: sinon.stub().returns([]),
-    }
-
-    this.Modules = {
-      promises: {
-        hooks: {
-          fire: sinon.stub().resolves([]),
-        },
-      },
-    }
-
-    this.ProjectListController = await esmock.strict(MODULE_PATH, {
-      'mongodb-legacy': { ObjectId },
-      '@overleaf/settings': this.settings,
-      '@overleaf/metrics': this.Metrics,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/SplitTests/SplitTestSessionHandler':
-        this.SplitTestSessionHandler,
-      '../../../../app/src/Features/User/UserController': this.UserController,
-      '../../../../app/src/Features/Project/ProjectHelper': this.ProjectHelper,
-      '../../../../app/src/Features/Subscription/LimitationsManager':
-        this.LimitationsManager,
-      '../../../../app/src/Features/Tags/TagsHandler': this.TagsHandler,
-      '../../../../app/src/Features/Notifications/NotificationsHandler':
-        this.NotificationsHandler,
-      '../../../../app/src/models/User': { User: this.UserModel },
-      '../../../../app/src/Features/Project/ProjectGetter': this.ProjectGetter,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/infrastructure/Features': this.Features,
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/Subscription/SubscriptionViewModelBuilder':
-        this.SubscriptionViewModelBuilder,
-      '../../../../app/src/infrastructure/Modules': this.Modules,
-      '../../../../app/src/Features/Survey/SurveyHandler': this.SurveyHandler,
-      '../../../../app/src/Features/User/UserPrimaryEmailCheckHandler':
-        this.UserPrimaryEmailCheckHandler,
-      '../../../../app/src/Features/Notifications/NotificationsBuilder':
-        this.NotificationBuilder,
-      '../../../../app/src/Features/Subscription/SubscriptionLocator':
-        this.SubscriptionLocator,
-      '../../../../app/src/infrastructure/GeoIpLookup': this.GeoIpLookup,
-      '../../../../app/src/Features/Tutorial/TutorialHandler':
-        this.TutorialHandler,
-    })
-
-    this.req = {
-      query: {},
-      params: {
-        Project_id: this.project_id,
-      },
-      headers: {},
-      session: {
-        user: this.user,
-      },
-      body: {},
-      i18n: {
-        translate() {},
-      },
-    }
-    this.res = {}
-  })
-
-  describe('projectListPage', function () {
-    beforeEach(function () {
-      this.projects = [
-        { _id: 1, lastUpdated: 1, owner_ref: 'user-1' },
-        {
-          _id: 2,
-          lastUpdated: 2,
-          owner_ref: 'user-2',
-          lastUpdatedBy: 'user-1',
-        },
-      ]
-      this.readAndWrite = [{ _id: 5, lastUpdated: 5, owner_ref: 'user-1' }]
-      this.readOnly = [{ _id: 3, lastUpdated: 3, owner_ref: 'user-1' }]
-      this.tokenReadAndWrite = [{ _id: 6, lastUpdated: 5, owner_ref: 'user-4' }]
-      this.tokenReadOnly = [{ _id: 7, lastUpdated: 4, owner_ref: 'user-5' }]
-      this.review = [{ _id: 8, lastUpdated: 4, owner_ref: 'user-6' }]
-      this.allProjects = {
-        owned: this.projects,
-        readAndWrite: this.readAndWrite,
-        readOnly: this.readOnly,
-        tokenReadAndWrite: this.tokenReadAndWrite,
-        tokenReadOnly: this.tokenReadOnly,
-        review: this.review,
-      }
-
-      this.ProjectGetter.promises.findAllUsersProjects.resolves(
-        this.allProjects
-      )
-    })
-
-    it('should render the project/list-react page', function (done) {
-      this.res.render = (pageName, opts) => {
-        pageName.should.equal('project/list-react')
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should invoke the session maintenance', function (done) {
-      this.Features.hasFeature.withArgs('saas').returns(true)
-      this.res.render = () => {
-        this.SplitTestSessionHandler.promises.sessionMaintenance.should.have.been.calledWith(
-          this.req,
-          this.user
-        )
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should send the tags', function (done) {
-      this.res.render = (pageName, opts) => {
-        opts.tags.length.should.equal(this.tags.length)
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should create trigger ip matcher notifications', function (done) {
-      this.settings.overleaf = true
-      this.req.ip = '111.111.111.111'
-      this.res.render = (pageName, opts) => {
-        this.NotificationBuilder.promises.ipMatcherAffiliation.called.should.equal(
-          true
-        )
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should send the projects', function (done) {
-      this.res.render = (pageName, opts) => {
-        opts.prefetchedProjectsBlob.projects.length.should.equal(
-          this.projects.length +
-            this.readAndWrite.length +
-            this.readOnly.length +
-            this.tokenReadAndWrite.length +
-            this.tokenReadOnly.length +
-            this.review.length
-        )
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should send the user', function (done) {
-      this.res.render = (pageName, opts) => {
-        opts.user.should.deep.equal(this.user)
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should inject the users', function (done) {
-      this.res.render = (pageName, opts) => {
-        const projects = opts.prefetchedProjectsBlob.projects
-
-        projects
-          .filter(p => p.id === '1')[0]
-          .owner.firstName.should.equal(
-            this.users[this.projects.filter(p => p._id === 1)[0].owner_ref]
-              .first_name
-          )
-        projects
-          .filter(p => p.id === '2')[0]
-          .owner.firstName.should.equal(
-            this.users[this.projects.filter(p => p._id === 2)[0].owner_ref]
-              .first_name
-          )
-        projects
-          .filter(p => p.id === '2')[0]
-          .lastUpdatedBy.firstName.should.equal(
-            this.users[this.projects.filter(p => p._id === 2)[0].lastUpdatedBy]
-              .first_name
-          )
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it("should send the user's best subscription when saas feature present", function (done) {
-      this.Features.hasFeature.withArgs('saas').returns(true)
-      this.res.render = (pageName, opts) => {
-        expect(opts.usersBestSubscription).to.deep.include({ type: 'free' })
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should not return a best subscription without saas feature', function (done) {
-      this.Features.hasFeature.withArgs('saas').returns(false)
-      this.res.render = (pageName, opts) => {
-        expect(opts.usersBestSubscription).to.be.undefined
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should show INR Banner for Indian users with free account', function (done) {
-      // usersBestSubscription is only available when saas feature is present
-      this.Features.hasFeature.withArgs('saas').returns(true)
-      this.SubscriptionViewModelBuilder.promises.getBestSubscription.resolves({
-        type: 'free',
-      })
-      this.GeoIpLookup.promises.getCurrencyCode.resolves({
-        countryCode: 'IN',
-      })
-      this.res.render = (pageName, opts) => {
-        expect(opts.showInrGeoBanner).to.be.true
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should not show INR Banner for Indian users with premium account', function (done) {
-      // usersBestSubscription is only available when saas feature is present
-      this.Features.hasFeature.withArgs('saas').returns(true)
-      this.SubscriptionViewModelBuilder.promises.getBestSubscription.resolves({
-        type: 'individual',
-      })
-      this.GeoIpLookup.promises.getCurrencyCode.resolves({
-        countryCode: 'IN',
-      })
-      this.res.render = (pageName, opts) => {
-        expect(opts.showInrGeoBanner).to.be.false
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    describe('With Institution SSO feature', function () {
-      beforeEach(function (done) {
-        this.institutionEmail = 'test@overleaf.com'
-        this.institutionName = 'Overleaf'
-        this.Features.hasFeature.withArgs('saml').returns(true)
-        this.Features.hasFeature.withArgs('affiliations').returns(true)
-        this.Features.hasFeature.withArgs('saas').returns(true)
-        done()
-      })
-      it('should show institution SSO available notification for confirmed domains', function () {
-        this.UserGetter.promises.getUserFullEmails.resolves([
-          {
-            email: 'test@overleaf.com',
-            affiliation: {
-              institution: {
-                id: 1,
-                confirmed: true,
-                name: 'Overleaf',
-                ssoBeta: false,
-                ssoEnabled: true,
-              },
-            },
-          },
-        ])
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.include({
-            email: this.institutionEmail,
-            institutionId: 1,
-            institutionName: this.institutionName,
-            templateKey: 'notification_institution_sso_available',
-          })
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-      it('should show a linked notification', function () {
-        this.req.session.saml = {
-          institutionEmail: this.institutionEmail,
-          linked: {
-            hasEntitlement: false,
-            universityName: this.institutionName,
-          },
-        }
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.include({
-            email: this.institutionEmail,
-            institutionName: this.institutionName,
-            templateKey: 'notification_institution_sso_linked',
-          })
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-      it('should show a linked another email notification', function () {
-        // when they request to link an email but the institution returns
-        // a different email
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.include({
-            institutionEmail: this.institutionEmail,
-            requestedEmail: 'requested@overleaf.com',
-            templateKey: 'notification_institution_sso_non_canonical',
-          })
-        }
-        this.req.session.saml = {
-          emailNonCanonical: this.institutionEmail,
-          institutionEmail: this.institutionEmail,
-          requestedEmail: 'requested@overleaf.com',
-          linked: {
-            hasEntitlement: false,
-            universityName: this.institutionName,
-          },
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-
-      it('should show a notification when intent was to register via SSO but account existed', function () {
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.include({
-            email: this.institutionEmail,
-            templateKey: 'notification_institution_sso_already_registered',
-          })
-        }
-        this.req.session.saml = {
-          institutionEmail: this.institutionEmail,
-          linked: {
-            hasEntitlement: false,
-            universityName: 'Overleaf',
-          },
-          registerIntercept: {
-            id: 1,
-            name: 'Example University',
-          },
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-
-      it('should not show a register notification if the flow was abandoned', function () {
-        // could initially start to register with an SSO email and then
-        // abandon flow and login with an existing non-institution SSO email
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.not.include({
-            email: 'test@overleaf.com',
-            templateKey: 'notification_institution_sso_already_registered',
-          })
-        }
-        this.req.session.saml = {
-          registerIntercept: {
-            id: 1,
-            name: 'Example University',
-          },
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-
-      it('should show error notification', function () {
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution.length).to.equal(1)
-          expect(opts.notificationsInstitution[0].templateKey).to.equal(
-            'notification_institution_sso_error'
-          )
-          expect(opts.notificationsInstitution[0].error).to.be.instanceof(
-            Errors.SAMLAlreadyLinkedError
-          )
-        }
-        this.req.session.saml = {
-          institutionEmail: this.institutionEmail,
-          error: new Errors.SAMLAlreadyLinkedError(),
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-
-      describe('for an unconfirmed domain for an SSO institution', function () {
-        beforeEach(function (done) {
-          this.UserGetter.promises.getUserFullEmails.resolves([
-            {
-              email: 'test@overleaf-uncofirmed.com',
-              affiliation: {
-                institution: {
-                  id: 1,
-                  confirmed: false,
-                  name: 'Overleaf',
-                  ssoBeta: false,
-                  ssoEnabled: true,
-                },
-              },
-            },
-          ])
-          done()
-        })
-        it('should not show institution SSO available notification', function () {
-          this.res.render = (pageName, opts) => {
-            expect(opts.notificationsInstitution.length).to.equal(0)
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-      })
-      describe('when linking/logging in initiated on institution side', function () {
-        it('should not show a linked another email notification', function () {
-          // this is only used when initated on Overleaf,
-          // because we keep track of the requested email they tried to link
-          this.res.render = (pageName, opts) => {
-            expect(opts.notificationsInstitution).to.not.deep.include({
-              institutionEmail: this.institutionEmail,
-              requestedEmail: undefined,
-              templateKey: 'notification_institution_sso_non_canonical',
-            })
-          }
-          this.req.session.saml = {
-            emailNonCanonical: this.institutionEmail,
-            institutionEmail: this.institutionEmail,
-            linked: {
-              hasEntitlement: false,
-              universityName: this.institutionName,
-            },
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-      })
-      describe('Institution with SSO beta testable', function () {
-        beforeEach(function (done) {
-          this.UserGetter.promises.getUserFullEmails.resolves([
-            {
-              email: 'beta@beta.com',
-              affiliation: {
-                institution: {
-                  id: 2,
-                  confirmed: true,
-                  name: 'Beta University',
-                  ssoBeta: true,
-                  ssoEnabled: false,
-                },
-              },
-            },
-          ])
-          done()
-        })
-        it('should show institution SSO available notification when on a beta testing session', function () {
-          this.req.session.samlBeta = true
-          this.res.render = (pageName, opts) => {
-            expect(opts.notificationsInstitution).to.deep.include({
-              email: 'beta@beta.com',
-              institutionId: 2,
-              institutionName: 'Beta University',
-              templateKey: 'notification_institution_sso_available',
-            })
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-        it('should not show institution SSO available notification when not on a beta testing session', function () {
-          this.req.session.samlBeta = false
-          this.res.render = (pageName, opts) => {
-            expect(opts.notificationsInstitution).to.deep.not.include({
-              email: 'test@overleaf.com',
-              institutionId: 1,
-              institutionName: 'Overleaf',
-              templateKey: 'notification_institution_sso_available',
-            })
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-      })
-    })
-
-    describe('Without Institution SSO feature', function () {
-      beforeEach(function (done) {
-        this.Features.hasFeature.withArgs('saml').returns(false)
-        done()
-      })
-      it('should not show institution sso available notification', function () {
-        this.res.render = (pageName, opts) => {
-          expect(opts.notificationsInstitution).to.deep.not.include({
-            email: 'test@overleaf.com',
-            institutionId: 1,
-            institutionName: 'Overleaf',
-            templateKey: 'notification_institution_sso_available',
-          })
-        }
-        this.ProjectListController.projectListPage(this.req, this.res)
-      })
-    })
-
-    describe('enterprise banner', function () {
-      beforeEach(function (done) {
-        this.Features.hasFeature.withArgs('saas').returns(true)
-        this.LimitationsManager.promises.userIsMemberOfGroupSubscription.resolves(
-          { isMember: false }
-        )
-        this.UserGetter.promises.getUserFullEmails.resolves([
-          {
-            email: 'test@test-domain.com',
-          },
-        ])
-
-        done()
-      })
-
-      describe('normal enterprise banner', function () {
-        it('shows banner', function () {
-          this.res.render = (pageName, opts) => {
-            expect(opts.showGroupsAndEnterpriseBanner).to.be.true
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-
-        it('does not show banner if user is part of any affiliation', function () {
-          this.UserGetter.promises.getUserFullEmails.resolves([
-            {
-              email: 'test@overleaf.com',
-              affiliation: {
-                licence: 'pro_plus',
-                institution: {
-                  id: 1,
-                  confirmed: true,
-                  name: 'Overleaf',
-                  ssoBeta: false,
-                  ssoEnabled: true,
-                },
-              },
-            },
-          ])
-
-          this.res.render = (pageName, opts) => {
-            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-
-        it('does not show banner if user is part of any group subscription', function () {
-          this.LimitationsManager.promises.userIsMemberOfGroupSubscription.resolves(
-            { isMember: true }
-          )
-
-          this.res.render = (pageName, opts) => {
-            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-
-        it('have a banner variant of "FOMO" or "on-premise"', function () {
-          this.res.render = (pageName, opts) => {
-            expect(opts.groupsAndEnterpriseBannerVariant).to.be.oneOf([
-              'FOMO',
-              'on-premise',
-            ])
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-      })
-
-      describe('US government enterprise banner', function () {
-        it('does not show enterprise banner if US government enterprise banner is shown', function () {
-          const emails = [
-            {
-              email: 'test@test.mil',
-              confirmedAt: new Date('2024-01-01'),
-            },
-          ]
-
-          this.UserGetter.promises.getUserFullEmails.resolves(emails)
-          this.Modules.promises.hooks.fire
-            .withArgs('getUSGovBanner', emails, false, [])
-            .resolves([
-              {
-                showUSGovBanner: true,
-                usGovBannerVariant: 'variant',
-              },
-            ])
-          this.res.render = (pageName, opts) => {
-            expect(opts.showGroupsAndEnterpriseBanner).to.be.false
-            expect(opts.showUSGovBanner).to.be.true
-          }
-          this.ProjectListController.projectListPage(this.req, this.res)
-        })
-      })
-    })
-  })
-
-  describe('projectListReactPage with duplicate projects', function () {
-    beforeEach(function () {
-      this.projects = [
-        { _id: 1, lastUpdated: 1, owner_ref: 'user-1' },
-        { _id: 2, lastUpdated: 2, owner_ref: 'user-2' },
-      ]
-      this.readAndWrite = [{ _id: 5, lastUpdated: 5, owner_ref: 'user-1' }]
-      this.readOnly = [{ _id: 3, lastUpdated: 3, owner_ref: 'user-1' }]
-      this.tokenReadAndWrite = [{ _id: 6, lastUpdated: 5, owner_ref: 'user-4' }]
-      this.tokenReadOnly = [
-        { _id: 6, lastUpdated: 5, owner_ref: 'user-4' }, // Also in tokenReadAndWrite
-        { _id: 7, lastUpdated: 4, owner_ref: 'user-5' },
-      ]
-      this.review = [{ _id: 8, lastUpdated: 5, owner_ref: 'user-6' }]
-      this.allProjects = {
-        owned: this.projects,
-        readAndWrite: this.readAndWrite,
-        readOnly: this.readOnly,
-        tokenReadAndWrite: this.tokenReadAndWrite,
-        tokenReadOnly: this.tokenReadOnly,
-        review: this.review,
-      }
-
-      this.ProjectGetter.promises.findAllUsersProjects.resolves(
-        this.allProjects
-      )
-    })
-
-    it('should render the project/list-react page', function (done) {
-      this.res.render = (pageName, opts) => {
-        pageName.should.equal('project/list-react')
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-
-    it('should omit one of the projects', function (done) {
-      this.res.render = (pageName, opts) => {
-        opts.prefetchedProjectsBlob.projects.length.should.equal(
-          this.projects.length +
-            this.readAndWrite.length +
-            this.readOnly.length +
-            this.tokenReadAndWrite.length +
-            this.tokenReadOnly.length +
-            this.review.length -
-            1
-        )
-        done()
-      }
-      this.ProjectListController.projectListPage(this.req, this.res)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Project/ProjectLocatorTests.js b/services/web/test/unit/src/Project/ProjectLocatorTests.js
index 4647dd0a55..14de550401 100644
--- a/services/web/test/unit/src/Project/ProjectLocatorTests.js
+++ b/services/web/test/unit/src/Project/ProjectLocatorTests.js
@@ -5,7 +5,6 @@ const sinon = require('sinon')
 const Errors = require('../../../../app/src/Features/Errors/Errors')
 
 const project = { _id: '1234566', rootFolder: [] }
-class Project {}
 const rootDoc = { name: 'rootDoc', _id: 'das239djd' }
 const doc1 = { name: 'otherDoc.txt', _id: 'dsad2ddd' }
 const doc2 = { name: 'docname.txt', _id: 'dsad2ddddd' }
@@ -40,9 +39,6 @@ project.rootDoc_id = rootDoc._id
 
 describe('ProjectLocator', function () {
   beforeEach(function () {
-    Project.findById = (projectId, callback) => {
-      callback(null, project)
-    }
     this.ProjectGetter = {
       getProject: sinon.stub().callsArgWith(2, null, project),
     }
@@ -53,7 +49,6 @@ describe('ProjectLocator', function () {
     }
     this.locator = SandboxedModule.require(modulePath, {
       requires: {
-        '../../models/Project': { Project },
         '../../models/User': { User: this.User },
         './ProjectGetter': this.ProjectGetter,
         './ProjectHelper': this.ProjectHelper,
@@ -62,170 +57,152 @@ describe('ProjectLocator', function () {
   })
 
   describe('finding a doc', function () {
-    it('finds one at the root level', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: doc2._id, type: 'docs' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(doc2._id)
-          path.fileSystem.should.equal(`/${doc2.name}`)
-          parentFolder._id.should.equal(project.rootFolder[0]._id)
-          path.mongo.should.equal('rootFolder.0.docs.1')
-          done()
+    it('finds one at the root level', async function () {
+      const { element, path, folder } = await this.locator.promises.findElement(
+        {
+          project_id: project._id,
+          element_id: doc2._id,
+          type: 'docs',
         }
       )
+      element._id.should.equal(doc2._id)
+      path.fileSystem.should.equal(`/${doc2.name}`)
+      folder._id.should.equal(project.rootFolder[0]._id)
+      path.mongo.should.equal('rootFolder.0.docs.1')
     })
 
-    it('when it is nested', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: subSubDoc._id, type: 'doc' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          expect(foundElement._id).to.equal(subSubDoc._id)
-          path.fileSystem.should.equal(
-            `/${subFolder.name}/${secondSubFolder.name}/${subSubDoc.name}`
-          )
-          parentFolder._id.should.equal(secondSubFolder._id)
-          path.mongo.should.equal('rootFolder.0.folders.1.folders.0.docs.0')
-          done()
+    it('when it is nested', async function () {
+      const { element, path, folder } = await this.locator.promises.findElement(
+        {
+          project_id: project._id,
+          element_id: subSubDoc._id,
+          type: 'doc',
         }
       )
+      expect(element._id).to.equal(subSubDoc._id)
+      path.fileSystem.should.equal(
+        `/${subFolder.name}/${secondSubFolder.name}/${subSubDoc.name}`
+      )
+      folder._id.should.equal(secondSubFolder._id)
+      path.mongo.should.equal('rootFolder.0.folders.1.folders.0.docs.0')
     })
 
-    it('should give error if element could not be found', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: 'ddsd432nj42', type: 'docs' },
-        (err, foundElement, path, parentFolder) => {
-          expect(err).to.be.instanceOf(Errors.NotFoundError)
-          expect(err).to.have.property('message', 'entity not found')
-          done()
-        }
+    it('should give error if element could not be found', async function () {
+      await expect(
+        this.locator.promises.findElement({
+          project_id: project._id,
+          element_id: 'ddsd432nj42',
+          type: 'docs',
+        })
       )
+        .to.eventually.be.rejectedWith(Errors.NotFoundError)
+        .and.eventually.have.property('message', 'entity not found')
     })
   })
 
   describe('finding a folder', function () {
-    it('should return root folder when looking for root folder', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: rootFolder._id, type: 'folder' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(rootFolder._id)
-          done()
-        }
-      )
-    })
-
-    it('when at root', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: subFolder._id, type: 'folder' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(subFolder._id)
-          path.fileSystem.should.equal(`/${subFolder.name}`)
-          parentFolder._id.should.equal(rootFolder._id)
-          path.mongo.should.equal('rootFolder.0.folders.1')
-          done()
-        }
-      )
-    })
-
-    it('when deeply nested', function (done) {
-      this.locator.findElement(
+    it('should return root folder when looking for root folder', async function () {
+      const { element: foundElement } = await this.locator.promises.findElement(
         {
           project_id: project._id,
-          element_id: secondSubFolder._id,
+          element_id: rootFolder._id,
           type: 'folder',
-        },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(secondSubFolder._id)
-          path.fileSystem.should.equal(
-            `/${subFolder.name}/${secondSubFolder.name}`
-          )
-          parentFolder._id.should.equal(subFolder._id)
-          path.mongo.should.equal('rootFolder.0.folders.1.folders.0')
-          done()
         }
       )
+      foundElement._id.should.equal(rootFolder._id)
+    })
+
+    it('when at root', async function () {
+      const {
+        element: foundElement,
+        path,
+        folder: parentFolder,
+      } = await this.locator.promises.findElement({
+        project_id: project._id,
+        element_id: subFolder._id,
+        type: 'folder',
+      })
+      foundElement._id.should.equal(subFolder._id)
+      path.fileSystem.should.equal(`/${subFolder.name}`)
+      parentFolder._id.should.equal(rootFolder._id)
+      path.mongo.should.equal('rootFolder.0.folders.1')
+    })
+
+    it('when deeply nested', async function () {
+      const {
+        element: foundElement,
+        path,
+        folder: parentFolder,
+      } = await this.locator.promises.findElement({
+        project_id: project._id,
+        element_id: secondSubFolder._id,
+        type: 'folder',
+      })
+
+      foundElement._id.should.equal(secondSubFolder._id)
+      path.fileSystem.should.equal(`/${subFolder.name}/${secondSubFolder.name}`)
+      parentFolder._id.should.equal(subFolder._id)
+      path.mongo.should.equal('rootFolder.0.folders.1.folders.0')
     })
   })
 
   describe('finding a file', function () {
-    it('when at root', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: file1._id, type: 'fileRefs' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(file1._id)
-          path.fileSystem.should.equal(`/${file1.name}`)
-          parentFolder._id.should.equal(rootFolder._id)
-          path.mongo.should.equal('rootFolder.0.fileRefs.0')
-          done()
-        }
-      )
+    it('when at root', async function () {
+      const {
+        element: foundElement,
+        path,
+        folder: parentFolder,
+      } = await this.locator.promises.findElement({
+        project_id: project._id,
+        element_id: file1._id,
+        type: 'fileRefs',
+      })
+      foundElement._id.should.equal(file1._id)
+      path.fileSystem.should.equal(`/${file1.name}`)
+      parentFolder._id.should.equal(rootFolder._id)
+      path.mongo.should.equal('rootFolder.0.fileRefs.0')
     })
 
-    it('when deeply nested', function (done) {
-      this.locator.findElement(
-        {
-          project_id: project._id,
-          element_id: subSubFile._id,
-          type: 'fileRefs',
-        },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(subSubFile._id)
-          path.fileSystem.should.equal(
-            `/${subFolder.name}/${secondSubFolder.name}/${subSubFile.name}`
-          )
-          parentFolder._id.should.equal(secondSubFolder._id)
-          path.mongo.should.equal('rootFolder.0.folders.1.folders.0.fileRefs.0')
-          done()
-        }
+    it('when deeply nested', async function () {
+      const {
+        element: foundElement,
+        path,
+        folder: parentFolder,
+      } = await this.locator.promises.findElement({
+        project_id: project._id,
+        element_id: subSubFile._id,
+        type: 'fileRefs',
+      })
+      foundElement._id.should.equal(subSubFile._id)
+      path.fileSystem.should.equal(
+        `/${subFolder.name}/${secondSubFolder.name}/${subSubFile.name}`
       )
+      parentFolder._id.should.equal(secondSubFolder._id)
+      path.mongo.should.equal('rootFolder.0.folders.1.folders.0.fileRefs.0')
     })
   })
 
   describe('finding an element with wrong element type', function () {
-    it('should add an s onto the element type', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: subSubDoc._id, type: 'doc' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(subSubDoc._id)
-          done()
+    it('should add an s onto the element type', async function () {
+      const { element: foundElement } = await this.locator.promises.findElement(
+        {
+          project_id: project._id,
+          element_id: subSubDoc._id,
+          type: 'doc',
         }
       )
+      foundElement._id.should.equal(subSubDoc._id)
     })
 
-    it('should convert file to fileRefs', function (done) {
-      this.locator.findElement(
-        { project_id: project._id, element_id: file1._id, type: 'fileRefs' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(file1._id)
-          done()
+    it('should convert file to fileRefs', async function () {
+      const { element: foundElement } = await this.locator.promises.findElement(
+        {
+          project_id: project._id,
+          element_id: file1._id,
+          type: 'fileRefs',
         }
       )
+      foundElement._id.should.equal(file1._id)
     })
   })
 
@@ -242,233 +219,173 @@ describe('ProjectLocator', function () {
       _id: '1234566',
       rootFolder: [rootFolder2],
     }
-    it('should find doc in project', function (done) {
-      this.locator.findElement(
-        { project: project2, element_id: doc3._id, type: 'docs' },
-        (err, foundElement, path, parentFolder) => {
-          if (err != null) {
-            return done(err)
-          }
-          foundElement._id.should.equal(doc3._id)
-          path.fileSystem.should.equal(`/${doc3.name}`)
-          parentFolder._id.should.equal(project2.rootFolder[0]._id)
-          path.mongo.should.equal('rootFolder.0.docs.0')
-          done()
-        }
-      )
+    it('should find doc in project', async function () {
+      const {
+        element: foundElement,
+        path,
+        folder: parentFolder,
+      } = await this.locator.promises.findElement({
+        project: project2,
+        element_id: doc3._id,
+        type: 'docs',
+      })
+      foundElement._id.should.equal(doc3._id)
+      path.fileSystem.should.equal(`/${doc3.name}`)
+      parentFolder._id.should.equal(project2.rootFolder[0]._id)
+      path.mongo.should.equal('rootFolder.0.docs.0')
     })
   })
 
   describe('finding root doc', function () {
-    it('should return root doc when passed project', function (done) {
-      this.locator.findRootDoc(project, (err, doc) => {
-        if (err != null) {
-          return done(err)
-        }
-        doc._id.should.equal(rootDoc._id)
-        done()
-      })
+    it('should return root doc when passed project', async function () {
+      const { element: doc } = await this.locator.promises.findRootDoc(project)
+      doc._id.should.equal(rootDoc._id)
     })
 
-    it('should return root doc when passed project_id', function (done) {
-      this.locator.findRootDoc(project._id, (err, doc) => {
-        if (err != null) {
-          return done(err)
-        }
-        doc._id.should.equal(rootDoc._id)
-        done()
-      })
+    it('should return root doc when passed project_id', async function () {
+      const { element: doc } = await this.locator.promises.findRootDoc(
+        project._id
+      )
+      doc._id.should.equal(rootDoc._id)
     })
 
-    it('should return null when the project has no rootDoc', function (done) {
+    it('should return null when the project has no rootDoc', async function () {
       project.rootDoc_id = null
-      this.locator.findRootDoc(project, (err, doc) => {
-        if (err != null) {
-          return done(err)
-        }
-        expect(doc).to.equal(null)
-        done()
-      })
+      const { element: rootDoc } =
+        await this.locator.promises.findRootDoc(project)
+      expect(rootDoc).to.equal(null)
     })
 
-    it('should return null when the rootDoc_id no longer exists', function (done) {
+    it('should return null when the rootDoc_id no longer exists', async function () {
       project.rootDoc_id = 'doesntexist'
-      this.locator.findRootDoc(project, (err, doc) => {
-        if (err != null) {
-          return done(err)
-        }
-        expect(doc).to.equal(null)
-        done()
-      })
+      const { element: rootDoc } =
+        await this.locator.promises.findRootDoc(project)
+      expect(rootDoc).to.equal(null)
     })
   })
 
   describe('findElementByPath', function () {
-    it('should take a doc path and return the element for a root level document', function (done) {
+    it('should take a doc path and return the element for a root level document', async function () {
       const path = `${doc1.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(doc1)
-          expect(type).to.equal('doc')
-          expect(folder).to.equal(rootFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(doc1)
+      expect(type).to.equal('doc')
+      expect(folder).to.equal(rootFolder)
     })
 
-    it('should take a doc path and return the element for a root level document with a starting slash', function (done) {
+    it('should take a doc path and return the element for a root level document with a starting slash', async function () {
       const path = `/${doc1.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(doc1)
-          expect(type).to.equal('doc')
-          expect(folder).to.equal(rootFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(doc1)
+      expect(type).to.equal('doc')
+      expect(folder).to.equal(rootFolder)
     })
 
-    it('should take a doc path and return the element for a nested document', function (done) {
+    it('should take a doc path and return the element for a nested document', async function () {
       const path = `${subFolder.name}/${secondSubFolder.name}/${subSubDoc.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(subSubDoc)
-          expect(type).to.equal('doc')
-          expect(folder).to.equal(secondSubFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(subSubDoc)
+      expect(type).to.equal('doc')
+      expect(folder).to.equal(secondSubFolder)
     })
 
-    it('should take a file path and return the element for a root level document', function (done) {
+    it('should take a file path and return the element for a root level document', async function () {
       const path = `${file1.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(file1)
-          expect(type).to.equal('file')
-          expect(folder).to.equal(rootFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(file1)
+      expect(type).to.equal('file')
+      expect(folder).to.equal(rootFolder)
     })
 
-    it('should take a file path and return the element for a nested document', function (done) {
+    it('should take a file path and return the element for a nested document', async function () {
       const path = `${subFolder.name}/${secondSubFolder.name}/${subSubFile.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(subSubFile)
-          expect(type).to.equal('file')
-          expect(folder).to.equal(secondSubFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(subSubFile)
+      expect(type).to.equal('file')
+      expect(folder).to.equal(secondSubFolder)
     })
 
-    it('should take a file path and return the element for a nested document case insenstive', function (done) {
+    it('should take a file path and return the element for a nested document case insenstive', async function () {
       const path = `${subFolder.name.toUpperCase()}/${secondSubFolder.name.toUpperCase()}/${subSubFile.name.toUpperCase()}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(subSubFile)
-          expect(type).to.equal('file')
-          expect(folder).to.equal(secondSubFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(subSubFile)
+      expect(type).to.equal('file')
+      expect(folder).to.equal(secondSubFolder)
     })
 
-    it('should not return elements with a case-insensitive match when exactCaseMatch is true', function (done) {
+    it('should not return elements with a case-insensitive match when exactCaseMatch is true', async function () {
       const path = `${subFolder.name.toUpperCase()}/${secondSubFolder.name.toUpperCase()}/${subSubFile.name.toUpperCase()}`
-      this.locator.findElementByPath(
-        { project, path, exactCaseMatch: true },
-        (err, element, type, folder) => {
-          err.should.not.equal(undefined)
-          expect(element).to.be.undefined
-          expect(type).to.be.undefined
-          done()
-        }
-      )
+      await expect(
+        this.locator.promises.findElementByPath({
+          project,
+          path,
+          exactCaseMatch: true,
+        })
+      ).to.eventually.be.rejected
     })
 
-    it('should take a file path and return the element for a nested folder', function (done) {
+    it('should take a file path and return the element for a nested folder', async function () {
       const path = `${subFolder.name}/${secondSubFolder.name}`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(secondSubFolder)
-          expect(type).to.equal('folder')
-          expect(folder).to.equal(subFolder)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(secondSubFolder)
+      expect(type).to.equal('folder')
+      expect(folder).to.equal(subFolder)
     })
 
-    it('should take a file path and return the root folder', function (done) {
+    it('should take a file path and return the root folder', async function () {
       const path = '/'
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type, folder) => {
-          if (err != null) {
-            return done(err)
-          }
-          element.should.deep.equal(rootFolder)
-          expect(type).to.equal('folder')
-          expect(folder).to.equal(null)
-          done()
-        }
-      )
+      const { element, type, folder } =
+        await this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      element.should.deep.equal(rootFolder)
+      expect(type).to.equal('folder')
+      expect(folder).to.equal(null)
     })
 
-    it('should return an error if the file can not be found inside know folder', function (done) {
+    it('should return an error if the file can not be found inside know folder', async function () {
       const path = `${subFolder.name}/${secondSubFolder.name}/exist.txt`
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type) => {
-          err.should.not.equal(undefined)
-          expect(element).to.be.undefined
-          expect(type).to.be.undefined
-          done()
-        }
-      )
+      await expect(this.locator.promises.findElementByPath({ project, path }))
+        .to.eventually.be.rejected
     })
 
-    it('should return an error if the file can not be found inside unknown folder', function (done) {
+    it('should return an error if the file can not be found inside unknown folder', async function () {
       const path = 'this/does/not/exist.txt'
-      this.locator.findElementByPath(
-        { project, path },
-        (err, element, type) => {
-          err.should.not.equal(undefined)
-          expect(element).to.be.undefined
-          expect(type).to.be.undefined
-          done()
-        }
-      )
+      await expect(
+        this.locator.promises.findElementByPath({
+          project,
+          path,
+        })
+      ).to.eventually.be.rejected
     })
 
     describe('where duplicate folder exists', function () {
@@ -498,18 +415,20 @@ describe('ProjectLocator', function () {
         }
       })
 
-      it('should not call the callback more than once', function (done) {
+      it('should not call the callback more than once', async function () {
         const path = `${this.duplicateFolder.name}/${this.doc.name}`
-        this.locator.findElementByPath({ project: this.project, path }, () =>
-          done()
-        )
+        await this.locator.promises.findElementByPath({
+          project: this.project,
+          path,
+        })
       }) // mocha will throw exception if done called multiple times
 
-      it('should not call the callback more than once when the path is longer than 1 level below the duplicate level', function (done) {
+      it('should not call the callback more than once when the path is longer than 1 level below the duplicate level', async function () {
         const path = `${this.duplicateFolder.name}/1/main.tex`
-        this.locator.findElementByPath({ project: this.project, path }, () =>
-          done()
-        )
+        await this.locator.promises.findElementByPath({
+          project: this.project,
+          path,
+        })
       })
     }) // mocha will throw exception if done called multiple times
 
@@ -526,18 +445,13 @@ describe('ProjectLocator', function () {
         }
       })
 
-      it('should not crash with a null', function (done) {
+      it('should not crash with a null', async function () {
         const path = '/other.tex'
-        this.locator.findElementByPath(
-          { project: this.project, path },
-          (err, element) => {
-            if (err != null) {
-              return done(err)
-            }
-            element.name.should.equal('other.tex')
-            done()
-          }
-        )
+        const { element } = await this.locator.promises.findElementByPath({
+          project: this.project,
+          path,
+        })
+        element.name.should.equal('other.tex')
       })
     })
 
@@ -546,35 +460,31 @@ describe('ProjectLocator', function () {
         this.ProjectGetter = { getProject: sinon.stub().callsArg(2) }
       })
 
-      it('should not crash with a null', function (done) {
+      it('should not crash with a null', async function () {
         const path = '/other.tex'
-        this.locator.findElementByPath(
-          { project_id: project._id, path },
-          (err, element) => {
-            expect(err).to.exist
-            done()
-          }
-        )
+        await expect(
+          this.locator.promises.findElementByPath({
+            project_id: project._id,
+            path,
+          })
+        ).to.be.rejected
       })
     })
 
     describe('with a project_id', function () {
-      it('should take a doc path and return the element for a root level document', function (done) {
+      it('should take a doc path and return the element for a root level document', async function () {
         const path = `${doc1.name}`
-        this.locator.findElementByPath(
-          { project_id: project._id, path },
-          (err, element, type) => {
-            if (err != null) {
-              return done(err)
-            }
-            this.ProjectGetter.getProject
-              .calledWith(project._id, { rootFolder: true, rootDoc_id: true })
-              .should.equal(true)
-            element.should.deep.equal(doc1)
-            expect(type).to.equal('doc')
-            done()
+        const { element, type } = await this.locator.promises.findElementByPath(
+          {
+            project_id: project._id,
+            path,
           }
         )
+        this.ProjectGetter.getProject
+          .calledWith(project._id, { rootFolder: true, rootDoc_id: true })
+          .should.equal(true)
+        element.should.deep.equal(doc1)
+        expect(type).to.equal('doc')
       })
     })
   })
diff --git a/services/web/test/unit/src/Project/ProjectRootDocManagerTests.js b/services/web/test/unit/src/Project/ProjectRootDocManagerTests.js
index 41b7516baa..ec4ea57778 100644
--- a/services/web/test/unit/src/Project/ProjectRootDocManagerTests.js
+++ b/services/web/test/unit/src/Project/ProjectRootDocManagerTests.js
@@ -1,16 +1,3 @@
-/* eslint-disable
-    max-len,
-    no-return-assign,
-    no-unused-vars,
-    no-useless-escape,
-*/
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
 const { expect } = require('chai')
 const { ObjectId } = require('mongodb-legacy')
 const sinon = require('sinon')
@@ -33,16 +20,13 @@ describe('ProjectRootDocManager', function () {
     this.sl_req_id = 'sl-req-id-123'
     this.callback = sinon.stub()
     this.globbyFiles = ['a.tex', 'b.tex', 'main.tex']
-    this.globby = sinon.stub().returns(
-      new Promise(resolve => {
-        return resolve(this.globbyFiles)
-      })
-    )
+    this.globby = sinon.stub().resolves(this.globbyFiles)
+
     this.fs = {
       readFile: sinon.stub().callsArgWith(2, new Error('file not found')),
       stat: sinon.stub().callsArgWith(1, null, { size: 100 }),
     }
-    return (this.ProjectRootDocManager = SandboxedModule.require(modulePath, {
+    this.ProjectRootDocManager = SandboxedModule.require(modulePath, {
       requires: {
         './ProjectEntityHandler': (this.ProjectEntityHandler = {}),
         './ProjectEntityUpdateHandler': (this.ProjectEntityUpdateHandler = {}),
@@ -56,7 +40,7 @@ describe('ProjectRootDocManager', function () {
         globby: this.globby,
         fs: this.fs,
       },
-    }))
+    })
   })
 
   describe('setRootDocAutomatically', function () {
@@ -67,7 +51,7 @@ describe('ProjectRootDocManager', function () {
         .returns(true)
     })
     describe('when there is a suitable root doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.docs = {
           '/chapter1.tex': {
             _id: this.docId1,
@@ -98,27 +82,26 @@ describe('ProjectRootDocManager', function () {
         this.ProjectEntityHandler.getAllDocs = sinon
           .stub()
           .callsArgWith(1, null, this.docs)
-        this.ProjectRootDocManager.setRootDocAutomatically(
-          this.project_id,
-          done
+        await this.ProjectRootDocManager.promises.setRootDocAutomatically(
+          this.project_id
         )
       })
 
       it('should check the docs of the project', function () {
-        return this.ProjectEntityHandler.getAllDocs
+        this.ProjectEntityHandler.getAllDocs
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should set the root doc to the doc containing a documentclass', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId2)
           .should.equal(true)
       })
     })
 
     describe('when the root doc is an Rtex file', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.docs = {
           '/chapter1.tex': {
             _id: this.docId1,
@@ -132,21 +115,20 @@ describe('ProjectRootDocManager', function () {
         this.ProjectEntityHandler.getAllDocs = sinon
           .stub()
           .callsArgWith(1, null, this.docs)
-        return this.ProjectRootDocManager.setRootDocAutomatically(
-          this.project_id,
-          done
+        await this.ProjectRootDocManager.promises.setRootDocAutomatically(
+          this.project_id
         )
       })
 
       it('should set the root doc to the doc containing a documentclass', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId2)
           .should.equal(true)
       })
     })
 
     describe('when there is no suitable root doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.docs = {
           '/chapter1.tex': {
             _id: this.docId1,
@@ -160,16 +142,13 @@ describe('ProjectRootDocManager', function () {
         this.ProjectEntityHandler.getAllDocs = sinon
           .stub()
           .callsArgWith(1, null, this.docs)
-        return this.ProjectRootDocManager.setRootDocAutomatically(
-          this.project_id,
-          done
+        await this.ProjectRootDocManager.promises.setRootDocAutomatically(
+          this.project_id
         )
       })
 
       it('should not set the root doc to the doc containing a documentclass', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc.called.should.equal(
-          false
-        )
+        this.ProjectEntityUpdateHandler.setRootDoc.called.should.equal(false)
       })
     })
   })
@@ -191,13 +170,13 @@ describe('ProjectRootDocManager', function () {
       this.fs.readFile
         .withArgs('/foo/a/a.tex')
         .callsArgWith(2, null, 'Potato? Potahto. Potootee!')
-      return (this.documentclassContent = '% test\n\\documentclass\n% test')
+      this.documentclassContent = '% test\n\\documentclass\n% test'
     })
 
     describe('when there is a file in a subfolder', function () {
       beforeEach(function () {
         // have to splice globbyFiles weirdly because of the way the stubbed globby method handles references
-        return this.globbyFiles.splice(
+        this.globbyFiles.splice(
           0,
           this.globbyFiles.length,
           'c.tex',
@@ -207,70 +186,56 @@ describe('ProjectRootDocManager', function () {
         )
       })
 
-      it('processes the root folder files first, and then the subfolder, in alphabetical order', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('a.tex')
-            sinon.assert.callOrder(
-              this.fs.readFile.withArgs('/foo/a.tex'),
-              this.fs.readFile.withArgs('/foo/b.tex'),
-              this.fs.readFile.withArgs('/foo/c.tex'),
-              this.fs.readFile.withArgs('/foo/a/a.tex')
-            )
-            return done()
-          }
+      it('processes the root folder files first, and then the subfolder, in alphabetical order', async function () {
+        const { path } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('a.tex')
+        sinon.assert.callOrder(
+          this.fs.readFile.withArgs('/foo/a.tex'),
+          this.fs.readFile.withArgs('/foo/b.tex'),
+          this.fs.readFile.withArgs('/foo/c.tex'),
+          this.fs.readFile.withArgs('/foo/a/a.tex')
         )
       })
 
-      it('processes smaller files first', function (done) {
+      it('processes smaller files first', async function () {
         this.fs.stat.withArgs('/foo/c.tex').callsArgWith(1, null, { size: 1 })
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('c.tex')
-            sinon.assert.callOrder(
-              this.fs.readFile.withArgs('/foo/c.tex'),
-              this.fs.readFile.withArgs('/foo/a.tex'),
-              this.fs.readFile.withArgs('/foo/b.tex'),
-              this.fs.readFile.withArgs('/foo/a/a.tex')
-            )
-            return done()
-          }
+        const { path } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('c.tex')
+        sinon.assert.callOrder(
+          this.fs.readFile.withArgs('/foo/c.tex'),
+          this.fs.readFile.withArgs('/foo/a.tex'),
+          this.fs.readFile.withArgs('/foo/b.tex'),
+          this.fs.readFile.withArgs('/foo/a/a.tex')
         )
       })
     })
 
     describe('when main.tex contains a documentclass', function () {
       beforeEach(function () {
-        return this.fs.readFile
+        this.fs.readFile
           .withArgs('/foo/main.tex')
           .callsArgWith(2, null, this.documentclassContent)
       })
 
-      it('returns main.tex', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path, content) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('main.tex')
-            expect(content).to.equal(this.documentclassContent)
-            return done()
-          }
-        )
+      it('returns main.tex', async function () {
+        const { path, content } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('main.tex')
+        expect(content).to.equal(this.documentclassContent)
       })
 
-      it('processes main.text first and stops processing when it finds the content', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          () => {
-            expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
-            expect(this.fs.readFile).not.to.be.calledWith('/foo/a.tex')
-            return done()
-          }
-        )
+      it('processes main.text first and stops processing when it finds the content', async function () {
+        await this.ProjectRootDocManager.findRootDocFileFromDirectory('/foo')
+        expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
+        expect(this.fs.readFile).not.to.be.calledWith('/foo/a.tex')
       })
     })
 
@@ -284,7 +249,7 @@ describe('ProjectRootDocManager', function () {
           .callsArgWith(2, null, 'foo')
       })
 
-      it('returns the first .tex file from the root folder', function (done) {
+      it('returns the first .tex file from the root folder', async function () {
         this.globbyFiles.splice(
           0,
           this.globbyFiles.length,
@@ -293,18 +258,15 @@ describe('ProjectRootDocManager', function () {
           'nested/chapter1a.tex'
         )
 
-        this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path, content) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('a.tex')
-            expect(content).to.equal('foo')
-            return done()
-          }
-        )
+        const { path, content } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('a.tex')
+        expect(content).to.equal('foo')
       })
 
-      it('returns main.tex file from the root folder', function (done) {
+      it('returns main.tex file from the root folder', async function () {
         this.globbyFiles.splice(
           0,
           this.globbyFiles.length,
@@ -314,227 +276,206 @@ describe('ProjectRootDocManager', function () {
           'nested/chapter1a.tex'
         )
 
-        this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path, content) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('main.tex')
-            expect(content).to.equal('foo')
-            return done()
-          }
-        )
+        const { path, content } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('main.tex')
+        expect(content).to.equal('foo')
       })
     })
 
     describe('when a.tex contains a documentclass', function () {
       beforeEach(function () {
-        return this.fs.readFile
+        this.fs.readFile
           .withArgs('/foo/a.tex')
           .callsArgWith(2, null, this.documentclassContent)
       })
 
-      it('returns a.tex', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path, content) => {
-            expect(error).not.to.exist
-            expect(path).to.equal('a.tex')
-            expect(content).to.equal(this.documentclassContent)
-            return done()
-          }
-        )
+      it('returns a.tex', async function () {
+        const { path, content } =
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        expect(path).to.equal('a.tex')
+        expect(content).to.equal(this.documentclassContent)
       })
 
-      it('processes main.text first and stops processing when it finds the content', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          () => {
-            expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
-            expect(this.fs.readFile).to.be.calledWith('/foo/a.tex')
-            expect(this.fs.readFile).not.to.be.calledWith('/foo/b.tex')
-            return done()
-          }
+      it('processes main.text first and stops processing when it finds the content', async function () {
+        await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+          '/foo'
         )
+        expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
+        expect(this.fs.readFile).to.be.calledWith('/foo/a.tex')
+        expect(this.fs.readFile).not.to.be.calledWith('/foo/b.tex')
       })
     })
 
     describe('when there is no documentclass', function () {
-      it('returns with no error', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          error => {
-            expect(error).not.to.exist
-            return done()
-          }
+      it('returns with no error', async function () {
+        await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+          '/foo'
         )
       })
 
-      it('processes all the files', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          () => {
-            expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
-            expect(this.fs.readFile).to.be.calledWith('/foo/a.tex')
-            expect(this.fs.readFile).to.be.calledWith('/foo/b.tex')
-            return done()
-          }
+      it('processes all the files', async function () {
+        await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+          '/foo'
         )
+        expect(this.fs.readFile).to.be.calledWith('/foo/main.tex')
+        expect(this.fs.readFile).to.be.calledWith('/foo/a.tex')
+        expect(this.fs.readFile).to.be.calledWith('/foo/b.tex')
       })
     })
 
     describe('when there is an error reading a file', function () {
       beforeEach(function () {
-        return this.fs.readFile
+        this.fs.readFile
           .withArgs('/foo/a.tex')
           .callsArgWith(2, new Error('something went wrong'))
       })
 
-      it('returns an error', function (done) {
-        return this.ProjectRootDocManager.findRootDocFileFromDirectory(
-          '/foo',
-          (error, path, content) => {
-            expect(error).to.exist
-            expect(path).not.to.exist
-            expect(content).not.to.exist
-            return done()
-          }
-        )
+      it('returns an error', async function () {
+        let error
+
+        try {
+          await this.ProjectRootDocManager.promises.findRootDocFileFromDirectory(
+            '/foo'
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
       })
     })
   })
 
   describe('setRootDocFromName', function () {
     describe('when there is a suitable root doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectEntityHandler.getAllDocPathsFromProjectById = sinon
           .stub()
           .callsArgWith(1, null, this.docPaths)
         this.ProjectEntityUpdateHandler.setRootDoc = sinon
           .stub()
           .callsArgWith(2)
-        return this.ProjectRootDocManager.setRootDocFromName(
+        await this.ProjectRootDocManager.promises.setRootDocFromName(
           this.project_id,
-          '/main.tex',
-          done
+          '/main.tex'
         )
       })
 
       it('should check the docs of the project', function () {
-        return this.ProjectEntityHandler.getAllDocPathsFromProjectById
+        this.ProjectEntityHandler.getAllDocPathsFromProjectById
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should set the root doc to main.tex', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId2.toString())
           .should.equal(true)
       })
     })
 
     describe('when there is a suitable root doc but the leading slash is missing', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectEntityHandler.getAllDocPathsFromProjectById = sinon
           .stub()
           .callsArgWith(1, null, this.docPaths)
         this.ProjectEntityUpdateHandler.setRootDoc = sinon
           .stub()
           .callsArgWith(2)
-        return this.ProjectRootDocManager.setRootDocFromName(
+        await this.ProjectRootDocManager.promises.setRootDocFromName(
           this.project_id,
-          'main.tex',
-          done
+          'main.tex'
         )
       })
 
       it('should check the docs of the project', function () {
-        return this.ProjectEntityHandler.getAllDocPathsFromProjectById
+        this.ProjectEntityHandler.getAllDocPathsFromProjectById
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should set the root doc to main.tex', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId2.toString())
           .should.equal(true)
       })
     })
 
     describe('when there is a suitable root doc with a basename match', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectEntityHandler.getAllDocPathsFromProjectById = sinon
           .stub()
           .callsArgWith(1, null, this.docPaths)
         this.ProjectEntityUpdateHandler.setRootDoc = sinon
           .stub()
           .callsArgWith(2)
-        return this.ProjectRootDocManager.setRootDocFromName(
+        await this.ProjectRootDocManager.promises.setRootDocFromName(
           this.project_id,
-          'chapter1a.tex',
-          done
+          'chapter1a.tex'
         )
       })
 
       it('should check the docs of the project', function () {
-        return this.ProjectEntityHandler.getAllDocPathsFromProjectById
+        this.ProjectEntityHandler.getAllDocPathsFromProjectById
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should set the root doc using the basename', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId3.toString())
           .should.equal(true)
       })
     })
 
     describe('when there is a suitable root doc but the filename is in quotes', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectEntityHandler.getAllDocPathsFromProjectById = sinon
           .stub()
           .callsArgWith(1, null, this.docPaths)
         this.ProjectEntityUpdateHandler.setRootDoc = sinon
           .stub()
           .callsArgWith(2)
-        return this.ProjectRootDocManager.setRootDocFromName(
+        await this.ProjectRootDocManager.promises.setRootDocFromName(
           this.project_id,
-          "'main.tex'",
-          done
+          "'main.tex'"
         )
       })
 
       it('should check the docs of the project', function () {
-        return this.ProjectEntityHandler.getAllDocPathsFromProjectById
+        this.ProjectEntityHandler.getAllDocPathsFromProjectById
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should set the root doc to main.tex', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc
+        this.ProjectEntityUpdateHandler.setRootDoc
           .calledWith(this.project_id, this.docId2.toString())
           .should.equal(true)
       })
     })
 
     describe('when there is no suitable root doc', function () {
-      beforeEach(function (done) {
+      beforeEach(async function () {
         this.ProjectEntityHandler.getAllDocPathsFromProjectById = sinon
           .stub()
           .callsArgWith(1, null, this.docPaths)
         this.ProjectEntityUpdateHandler.setRootDoc = sinon
           .stub()
           .callsArgWith(2)
-        return this.ProjectRootDocManager.setRootDocFromName(
+        await this.ProjectRootDocManager.promises.setRootDocFromName(
           this.project_id,
-          'other.tex',
-          done
+          'other.tex'
         )
       })
 
       it('should not set the root doc', function () {
-        return this.ProjectEntityUpdateHandler.setRootDoc.called.should.equal(
-          false
-        )
+        this.ProjectEntityUpdateHandler.setRootDoc.called.should.equal(false)
       })
     })
   })
@@ -545,73 +486,73 @@ describe('ProjectRootDocManager', function () {
       this.ProjectGetter.getProject = sinon
         .stub()
         .callsArgWith(2, null, this.project)
-      return (this.ProjectRootDocManager.setRootDocAutomatically = sinon
+      this.ProjectRootDocManager.setRootDocAutomatically = sinon
         .stub()
-        .callsArgWith(1, null))
+        .callsArgWith(1, null)
     })
 
     describe('when the root doc is set', function () {
       beforeEach(function () {
         this.project.rootDoc_id = this.docId2
-        return this.ProjectRootDocManager.ensureRootDocumentIsSet(
+        this.ProjectRootDocManager.ensureRootDocumentIsSet(
           this.project_id,
           this.callback
         )
       })
 
       it('should find the project fetching only the rootDoc_id field', function () {
-        return this.ProjectGetter.getProject
+        this.ProjectGetter.getProject
           .calledWith(this.project_id, { rootDoc_id: 1 })
           .should.equal(true)
       })
 
       it('should not try to update the project rootDoc_id', function () {
-        return this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
+        this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
           false
         )
       })
 
       it('should call the callback', function () {
-        return this.callback.called.should.equal(true)
+        this.callback.called.should.equal(true)
       })
     })
 
     describe('when the root doc is not set', function () {
       beforeEach(function () {
-        return this.ProjectRootDocManager.ensureRootDocumentIsSet(
+        this.ProjectRootDocManager.ensureRootDocumentIsSet(
           this.project_id,
           this.callback
         )
       })
 
       it('should find the project with only the rootDoc_id field', function () {
-        return this.ProjectGetter.getProject
+        this.ProjectGetter.getProject
           .calledWith(this.project_id, { rootDoc_id: 1 })
           .should.equal(true)
       })
 
       it('should update the project rootDoc_id', function () {
-        return this.ProjectRootDocManager.setRootDocAutomatically
+        this.ProjectRootDocManager.setRootDocAutomatically
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should call the callback', function () {
-        return this.callback.called.should.equal(true)
+        this.callback.called.should.equal(true)
       })
     })
 
     describe('when the project does not exist', function () {
       beforeEach(function () {
         this.ProjectGetter.getProject = sinon.stub().callsArgWith(2, null, null)
-        return this.ProjectRootDocManager.ensureRootDocumentIsSet(
+        this.ProjectRootDocManager.ensureRootDocumentIsSet(
           this.project_id,
           this.callback
         )
       })
 
       it('should call the callback with an error', function () {
-        return this.callback
+        this.callback
           .calledWith(
             sinon.match
               .instanceOf(Error)
@@ -645,26 +586,26 @@ describe('ProjectRootDocManager', function () {
           this.ProjectEntityHandler.getDocPathFromProjectByDocId = sinon
             .stub()
             .callsArgWith(2, null, this.docPaths[this.docId2])
-          return this.ProjectRootDocManager.ensureRootDocumentIsValid(
+          this.ProjectRootDocManager.ensureRootDocumentIsValid(
             this.project_id,
             this.callback
           )
         })
 
         it('should find the project without doc lines', function () {
-          return this.ProjectGetter.getProjectWithoutDocLines
+          this.ProjectGetter.getProjectWithoutDocLines
             .calledWith(this.project_id)
             .should.equal(true)
         })
 
         it('should not try to update the project rootDoc_id', function () {
-          return this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
+          this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
             false
           )
         })
 
         it('should call the callback', function () {
-          return this.callback.called.should.equal(true)
+          this.callback.called.should.equal(true)
         })
       })
 
@@ -674,58 +615,58 @@ describe('ProjectRootDocManager', function () {
           this.ProjectEntityHandler.getDocPathFromProjectByDocId = sinon
             .stub()
             .callsArgWith(2, null, null)
-          return this.ProjectRootDocManager.ensureRootDocumentIsValid(
+          this.ProjectRootDocManager.ensureRootDocumentIsValid(
             this.project_id,
             this.callback
           )
         })
 
         it('should find the project without doc lines', function () {
-          return this.ProjectGetter.getProjectWithoutDocLines
+          this.ProjectGetter.getProjectWithoutDocLines
             .calledWith(this.project_id)
             .should.equal(true)
         })
 
         it('should unset the root doc', function () {
-          return this.ProjectEntityUpdateHandler.unsetRootDoc
+          this.ProjectEntityUpdateHandler.unsetRootDoc
             .calledWith(this.project_id)
             .should.equal(true)
         })
 
         it('should try to find a new rootDoc', function () {
-          return this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
+          this.ProjectRootDocManager.setRootDocAutomatically.called.should.equal(
             true
           )
         })
 
         it('should call the callback', function () {
-          return this.callback.called.should.equal(true)
+          this.callback.called.should.equal(true)
         })
       })
     })
 
     describe('when the root doc is not set', function () {
       beforeEach(function () {
-        return this.ProjectRootDocManager.ensureRootDocumentIsValid(
+        this.ProjectRootDocManager.ensureRootDocumentIsValid(
           this.project_id,
           this.callback
         )
       })
 
       it('should find the project without doc lines', function () {
-        return this.ProjectGetter.getProjectWithoutDocLines
+        this.ProjectGetter.getProjectWithoutDocLines
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should update the project rootDoc_id', function () {
-        return this.ProjectRootDocManager.setRootDocAutomatically
+        this.ProjectRootDocManager.setRootDocAutomatically
           .calledWith(this.project_id)
           .should.equal(true)
       })
 
       it('should call the callback', function () {
-        return this.callback.called.should.equal(true)
+        this.callback.called.should.equal(true)
       })
     })
 
@@ -734,14 +675,14 @@ describe('ProjectRootDocManager', function () {
         this.ProjectGetter.getProjectWithoutDocLines = sinon
           .stub()
           .callsArgWith(1, null, null)
-        return this.ProjectRootDocManager.ensureRootDocumentIsValid(
+        this.ProjectRootDocManager.ensureRootDocumentIsValid(
           this.project_id,
           this.callback
         )
       })
 
       it('should call the callback with an error', function () {
-        return this.callback
+        this.callback
           .calledWith(
             sinon.match
               .instanceOf(Error)
diff --git a/services/web/test/unit/src/Publishers/PublishersGetterTests.js b/services/web/test/unit/src/Publishers/PublishersGetterTests.js
index bad46039de..b5a3124436 100644
--- a/services/web/test/unit/src/Publishers/PublishersGetterTests.js
+++ b/services/web/test/unit/src/Publishers/PublishersGetterTests.js
@@ -42,15 +42,10 @@ describe('PublishersGetter', function () {
   })
 
   describe('getManagedPublishers', function () {
-    it('fetches v1 data before returning publisher list', function (done) {
-      this.PublishersGetter.getManagedPublishers(
-        this.userId,
-        (error, publishers) => {
-          expect(error).to.be.null
-          publishers.length.should.equal(1)
-          done()
-        }
-      )
+    it('fetches v1 data before returning publisher list', async function () {
+      const publishers =
+        await this.PublishersGetter.promises.getManagedPublishers(this.userId)
+      expect(publishers.length).to.equal(1)
     })
   })
 })
diff --git a/services/web/test/unit/src/Referal/ReferalConnect.test.mjs b/services/web/test/unit/src/Referal/ReferalConnect.test.mjs
new file mode 100644
index 0000000000..c4b66228b2
--- /dev/null
+++ b/services/web/test/unit/src/Referal/ReferalConnect.test.mjs
@@ -0,0 +1,153 @@
+const modulePath = new URL(
+  '../../../../app/src/Features/Referal/ReferalConnect.mjs',
+  import.meta.url
+).pathname
+
+describe('Referal connect middle wear', function () {
+  beforeEach(async function (ctx) {
+    ctx.connect = (await import(modulePath)).default
+  })
+
+  it('should take a referal query string and put it on the session if it exists', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { referal: '12345' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_id.should.equal(req.query.referal)
+        resolve()
+      })
+    })
+  })
+
+  it('should not change the referal_id on the session if not in query', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: {},
+        session: { referal_id: 'same' },
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_id.should.equal('same')
+        resolve()
+      })
+    })
+  })
+
+  it('should take a facebook referal query string and put it on the session if it exists', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { fb_ref: '12345' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_id.should.equal(req.query.fb_ref)
+        resolve()
+      })
+    })
+  })
+
+  it('should map the facebook medium into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rm: 'fb' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_medium.should.equal('facebook')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the twitter medium into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rm: 't' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_medium.should.equal('twitter')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the google plus medium into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rm: 'gp' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_medium.should.equal('google_plus')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the email medium into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rm: 'e' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_medium.should.equal('email')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the direct medium into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rm: 'd' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_medium.should.equal('direct')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the bonus source into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rs: 'b' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_source.should.equal('bonus')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the public share source into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rs: 'ps' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_source.should.equal('public_share')
+        resolve()
+      })
+    })
+  })
+
+  it('should map the collaborator invite into the session', async function (ctx) {
+    await new Promise(resolve => {
+      const req = {
+        query: { rs: 'ci' },
+        session: {},
+      }
+      ctx.connect.use(req, {}, () => {
+        req.session.referal_source.should.equal('collaborator_invite')
+        resolve()
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Referal/ReferalConnectTests.mjs b/services/web/test/unit/src/Referal/ReferalConnectTests.mjs
deleted file mode 100644
index c6e56c3c6a..0000000000
--- a/services/web/test/unit/src/Referal/ReferalConnectTests.mjs
+++ /dev/null
@@ -1,132 +0,0 @@
-import esmock from 'esmock'
-const modulePath = new URL(
-  '../../../../app/src/Features/Referal/ReferalConnect.mjs',
-  import.meta.url
-).pathname
-
-describe('Referal connect middle wear', function () {
-  beforeEach(async function () {
-    this.connect = await esmock.strict(modulePath, {})
-  })
-
-  it('should take a referal query string and put it on the session if it exists', function (done) {
-    const req = {
-      query: { referal: '12345' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_id.should.equal(req.query.referal)
-      done()
-    })
-  })
-
-  it('should not change the referal_id on the session if not in query', function (done) {
-    const req = {
-      query: {},
-      session: { referal_id: 'same' },
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_id.should.equal('same')
-      done()
-    })
-  })
-
-  it('should take a facebook referal query string and put it on the session if it exists', function (done) {
-    const req = {
-      query: { fb_ref: '12345' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_id.should.equal(req.query.fb_ref)
-      done()
-    })
-  })
-
-  it('should map the facebook medium into the session', function (done) {
-    const req = {
-      query: { rm: 'fb' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_medium.should.equal('facebook')
-      done()
-    })
-  })
-
-  it('should map the twitter medium into the session', function (done) {
-    const req = {
-      query: { rm: 't' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_medium.should.equal('twitter')
-      done()
-    })
-  })
-
-  it('should map the google plus medium into the session', function (done) {
-    const req = {
-      query: { rm: 'gp' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_medium.should.equal('google_plus')
-      done()
-    })
-  })
-
-  it('should map the email medium into the session', function (done) {
-    const req = {
-      query: { rm: 'e' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_medium.should.equal('email')
-      done()
-    })
-  })
-
-  it('should map the direct medium into the session', function (done) {
-    const req = {
-      query: { rm: 'd' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_medium.should.equal('direct')
-      done()
-    })
-  })
-
-  it('should map the bonus source into the session', function (done) {
-    const req = {
-      query: { rs: 'b' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_source.should.equal('bonus')
-      done()
-    })
-  })
-
-  it('should map the public share source into the session', function (done) {
-    const req = {
-      query: { rs: 'ps' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_source.should.equal('public_share')
-      done()
-    })
-  })
-
-  it('should map the collaborator invite into the session', function (done) {
-    const req = {
-      query: { rs: 'ci' },
-      session: {},
-    }
-    this.connect.use(req, {}, () => {
-      req.session.referal_source.should.equal('collaborator_invite')
-      done()
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Referal/ReferalController.test.mjs b/services/web/test/unit/src/Referal/ReferalController.test.mjs
new file mode 100644
index 0000000000..383902946f
--- /dev/null
+++ b/services/web/test/unit/src/Referal/ReferalController.test.mjs
@@ -0,0 +1,7 @@
+const modulePath = '../../../../app/src/Features/Referal/ReferalController.js'
+
+describe.todo('Referal controller', function () {
+  beforeEach(async function (ctx) {
+    ctx.controller = (await import(modulePath)).default
+  })
+})
diff --git a/services/web/test/unit/src/Referal/ReferalControllerTests.mjs b/services/web/test/unit/src/Referal/ReferalControllerTests.mjs
deleted file mode 100644
index 523fd23728..0000000000
--- a/services/web/test/unit/src/Referal/ReferalControllerTests.mjs
+++ /dev/null
@@ -1,11 +0,0 @@
-import esmock from 'esmock'
-const modulePath = new URL(
-  '../../../../app/src/Features/Referal/ReferalController.js',
-  import.meta.url
-).pathname
-
-describe('Referal controller', function () {
-  beforeEach(async function () {
-    this.controller = await esmock.strict(modulePath, {})
-  })
-})
diff --git a/services/web/test/unit/src/Referal/ReferalHandlerTests.mjs b/services/web/test/unit/src/Referal/ReferalHandler.test.mjs
similarity index 63%
rename from services/web/test/unit/src/Referal/ReferalHandlerTests.mjs
rename to services/web/test/unit/src/Referal/ReferalHandler.test.mjs
index 6fd58a6569..5c042f2ef9 100644
--- a/services/web/test/unit/src/Referal/ReferalHandlerTests.mjs
+++ b/services/web/test/unit/src/Referal/ReferalHandler.test.mjs
@@ -1,88 +1,85 @@
-import esmock from 'esmock'
-import { expect } from 'chai'
+import { expect, vi } from 'vitest'
 import sinon from 'sinon'
-const modulePath = new URL(
-  '../../../../app/src/Features/Referal/ReferalHandler.mjs',
-  import.meta.url
-).pathname
+const modulePath = '../../../../app/src/Features/Referal/ReferalHandler.mjs'
 
 describe('Referal handler', function () {
-  beforeEach(async function () {
-    this.User = {
+  beforeEach(async function (ctx) {
+    ctx.User = {
       findById: sinon.stub().returns({
         exec: sinon.stub(),
       }),
     }
-    this.handler = await esmock.strict(modulePath, {
-      '../../../../app/src/models/User': {
-        User: this.User,
-      },
-    })
-    this.user_id = '12313'
+
+    vi.doMock('../../../../app/src/models/User', () => ({
+      User: ctx.User,
+    }))
+
+    ctx.handler = (await import(modulePath)).default
+    ctx.user_id = '12313'
   })
 
   describe('getting refered user_ids', function () {
-    it('should get the user from mongo and return the refered users array', async function () {
+    it('should get the user from mongo and return the refered users array', async function (ctx) {
       const user = {
         refered_users: ['1234', '312312', '3213129'],
         refered_user_count: 3,
       }
-      this.User.findById.returns({
+      ctx.User.findById.returns({
         exec: sinon.stub().resolves(user),
       })
 
       const {
         referedUsers: passedReferedUserIds,
         referedUserCount: passedReferedUserCount,
-      } = await this.handler.promises.getReferedUsers(this.user_id)
+      } = await ctx.handler.promises.getReferedUsers(ctx.user_id)
 
       passedReferedUserIds.should.deep.equal(user.refered_users)
       passedReferedUserCount.should.equal(3)
     })
 
-    it('should return an empty array if it is not set', async function () {
+    it('should return an empty array if it is not set', async function (ctx) {
       const user = {}
-      this.User.findById.returns({
+      ctx.User.findById.returns({
         exec: sinon.stub().resolves(user),
       })
 
       const { referedUsers: passedReferedUserIds } =
-        await this.handler.promises.getReferedUsers(this.user_id)
+        await ctx.handler.promises.getReferedUsers(ctx.user_id)
 
       passedReferedUserIds.length.should.equal(0)
     })
 
-    it('should return a zero count if neither it or the array are set', async function () {
+    it('should return a zero count if neither it or the array are set', async function (ctx) {
       const user = {}
-      this.User.findById.returns({
+      ctx.User.findById.returns({
         exec: sinon.stub().resolves(user),
       })
 
       const { referedUserCount: passedReferedUserCount } =
-        await this.handler.promises.getReferedUsers(this.user_id)
+        await ctx.handler.promises.getReferedUsers(ctx.user_id)
 
       passedReferedUserCount.should.equal(0)
     })
 
-    it('should return the array length if count is not set', async function () {
+    it('should return the array length if count is not set', async function (ctx) {
       const user = { refered_users: ['1234', '312312', '3213129'] }
-      this.User.findById.returns({
+      ctx.User.findById.returns({
         exec: sinon.stub().resolves(user),
       })
 
       const { referedUserCount: passedReferedUserCount } =
-        await this.handler.promises.getReferedUsers(this.user_id)
+        await ctx.handler.promises.getReferedUsers(ctx.user_id)
 
       passedReferedUserCount.should.equal(3)
     })
 
-    it('should error if finding the user fails', async function () {
-      this.User.findById.returns({
+    it('should error if finding the user fails', async function (ctx) {
+      ctx.User.findById.returns({
         exec: sinon.stub().rejects(new Error('user not found')),
       })
 
       expect(
-        this.handler.promises.getReferedUsers(this.user_id)
+        ctx.handler.promises.getReferedUsers(ctx.user_id)
       ).to.be.rejectedWith('user not found')
     })
   })
diff --git a/services/web/test/unit/src/References/ReferencesController.test.mjs b/services/web/test/unit/src/References/ReferencesController.test.mjs
new file mode 100644
index 0000000000..c578712f45
--- /dev/null
+++ b/services/web/test/unit/src/References/ReferencesController.test.mjs
@@ -0,0 +1,213 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+const modulePath =
+  '../../../../app/src/Features/References/ReferencesController'
+
+describe('ReferencesController', function () {
+  beforeEach(async function (ctx) {
+    ctx.projectId = '2222'
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: (ctx.settings = {
+        apis: { web: { url: 'http://some.url' } },
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/References/ReferencesHandler',
+      () => ({
+        default: (ctx.ReferencesHandler = {
+          index: sinon.stub(),
+          indexAll: sinon.stub(),
+        }),
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController',
+      () => ({
+        default: (ctx.EditorRealTimeController = {
+          emitToRoom: sinon.stub(),
+        }),
+      })
+    )
+
+    ctx.controller = (await import(modulePath)).default
+    ctx.req = new MockRequest()
+    ctx.req.params.Project_id = ctx.projectId
+    ctx.req.body = {
+      docIds: (ctx.docIds = ['aaa', 'bbb']),
+      shouldBroadcast: false,
+    }
+    ctx.res = new MockResponse()
+    ctx.res.json = sinon.stub()
+    ctx.res.sendStatus = sinon.stub()
+    ctx.next = sinon.stub()
+    ctx.fakeResponseData = {
+      projectId: ctx.projectId,
+      keys: ['one', 'two', 'three'],
+    }
+  })
+
+  describe('indexAll', function () {
+    beforeEach(function (ctx) {
+      ctx.req.body = { shouldBroadcast: false }
+      ctx.ReferencesHandler.indexAll.callsArgWith(1, null, ctx.fakeResponseData)
+      ctx.call = callback => {
+        ctx.controller.indexAll(ctx.req, ctx.res, ctx.next)
+        return callback()
+      }
+    })
+
+    it('should not produce an error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.res.sendStatus.callCount.should.equal(0)
+          ctx.res.sendStatus.calledWith(500).should.equal(false)
+          ctx.res.sendStatus.calledWith(400).should.equal(false)
+          resolve()
+        })
+      })
+    })
+
+    it('should return data', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.res.json.callCount.should.equal(1)
+          ctx.res.json.calledWith(ctx.fakeResponseData).should.equal(true)
+          resolve()
+        })
+      })
+    })
+
+    it('should call ReferencesHandler.indexAll', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.ReferencesHandler.indexAll.callCount.should.equal(1)
+          ctx.ReferencesHandler.indexAll
+            .calledWith(ctx.projectId)
+            .should.equal(true)
+          resolve()
+        })
+      })
+    })
+
+    describe('when shouldBroadcast is true', function () {
+      beforeEach(function (ctx) {
+        ctx.ReferencesHandler.index.callsArgWith(2, null, ctx.fakeResponseData)
+        ctx.req.body.shouldBroadcast = true
+      })
+
+      it('should call EditorRealTimeController.emitToRoom', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
+            resolve()
+          })
+        })
+      })
+
+      it('should not produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.res.sendStatus.callCount.should.equal(0)
+            ctx.res.sendStatus.calledWith(500).should.equal(false)
+            ctx.res.sendStatus.calledWith(400).should.equal(false)
+            resolve()
+          })
+        })
+      })
+
+      it('should still return data', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.res.json.callCount.should.equal(1)
+            ctx.res.json.calledWith(ctx.fakeResponseData).should.equal(true)
+            resolve()
+          })
+        })
+      })
+    })
+
+    describe('when shouldBroadcast is false', function () {
+      beforeEach(function (ctx) {
+        ctx.ReferencesHandler.index.callsArgWith(2, null, ctx.fakeResponseData)
+        ctx.req.body.shouldBroadcast = false
+      })
+
+      it('should not call EditorRealTimeController.emitToRoom', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
+            resolve()
+          })
+        })
+      })
+
+      it('should not produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.res.sendStatus.callCount.should.equal(0)
+            ctx.res.sendStatus.calledWith(500).should.equal(false)
+            ctx.res.sendStatus.calledWith(400).should.equal(false)
+            resolve()
+          })
+        })
+      })
+
+      it('should still return data', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.res.json.callCount.should.equal(1)
+            ctx.res.json.calledWith(ctx.fakeResponseData).should.equal(true)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+
+  describe('there is no data', function () {
+    beforeEach(function (ctx) {
+      ctx.ReferencesHandler.indexAll.callsArgWith(1)
+      ctx.call = callback => {
+        ctx.controller.indexAll(ctx.req, ctx.res, ctx.next)
+        callback()
+      }
+    })
+
+    it('should not call EditorRealTimeController.emitToRoom', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
+          resolve()
+        })
+      })
+    })
+
+    it('should not produce an error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.res.sendStatus.callCount.should.equal(0)
+          ctx.res.sendStatus.calledWith(500).should.equal(false)
+          ctx.res.sendStatus.calledWith(400).should.equal(false)
+          resolve()
+        })
+      })
+    })
+
+    it('should send a response with an empty keys list', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.call(() => {
+          ctx.res.json.called.should.equal(true)
+          ctx.res.json
+            .calledWith({ projectId: ctx.projectId, keys: [] })
+            .should.equal(true)
+          resolve()
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/References/ReferencesControllerTests.mjs b/services/web/test/unit/src/References/ReferencesControllerTests.mjs
deleted file mode 100644
index fca2acea12..0000000000
--- a/services/web/test/unit/src/References/ReferencesControllerTests.mjs
+++ /dev/null
@@ -1,188 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-const modulePath =
-  '../../../../app/src/Features/References/ReferencesController'
-
-describe('ReferencesController', function () {
-  beforeEach(async function () {
-    this.projectId = '2222'
-    this.controller = await esmock.strict(modulePath, {
-      '@overleaf/settings': (this.settings = {
-        apis: { web: { url: 'http://some.url' } },
-      }),
-      '../../../../app/src/Features/References/ReferencesHandler':
-        (this.ReferencesHandler = {
-          index: sinon.stub(),
-          indexAll: sinon.stub(),
-        }),
-      '../../../../app/src/Features/Editor/EditorRealTimeController':
-        (this.EditorRealTimeController = {
-          emitToRoom: sinon.stub(),
-        }),
-    })
-    this.req = new MockRequest()
-    this.req.params.Project_id = this.projectId
-    this.req.body = {
-      docIds: (this.docIds = ['aaa', 'bbb']),
-      shouldBroadcast: false,
-    }
-    this.res = new MockResponse()
-    this.res.json = sinon.stub()
-    this.res.sendStatus = sinon.stub()
-    this.next = sinon.stub()
-    this.fakeResponseData = {
-      projectId: this.projectId,
-      keys: ['one', 'two', 'three'],
-    }
-  })
-
-  describe('indexAll', function () {
-    beforeEach(function () {
-      this.req.body = { shouldBroadcast: false }
-      this.ReferencesHandler.indexAll.callsArgWith(
-        1,
-        null,
-        this.fakeResponseData
-      )
-      this.call = callback => {
-        this.controller.indexAll(this.req, this.res, this.next)
-        return callback()
-      }
-    })
-
-    it('should not produce an error', function (done) {
-      this.call(() => {
-        this.res.sendStatus.callCount.should.equal(0)
-        this.res.sendStatus.calledWith(500).should.equal(false)
-        this.res.sendStatus.calledWith(400).should.equal(false)
-        done()
-      })
-    })
-
-    it('should return data', function (done) {
-      this.call(() => {
-        this.res.json.callCount.should.equal(1)
-        this.res.json.calledWith(this.fakeResponseData).should.equal(true)
-        done()
-      })
-    })
-
-    it('should call ReferencesHandler.indexAll', function (done) {
-      this.call(() => {
-        this.ReferencesHandler.indexAll.callCount.should.equal(1)
-        this.ReferencesHandler.indexAll
-          .calledWith(this.projectId)
-          .should.equal(true)
-        done()
-      })
-    })
-
-    describe('when shouldBroadcast is true', function () {
-      beforeEach(function () {
-        this.ReferencesHandler.index.callsArgWith(
-          2,
-          null,
-          this.fakeResponseData
-        )
-        this.req.body.shouldBroadcast = true
-      })
-
-      it('should call EditorRealTimeController.emitToRoom', function (done) {
-        this.call(() => {
-          this.EditorRealTimeController.emitToRoom.callCount.should.equal(1)
-          done()
-        })
-      })
-
-      it('should not produce an error', function (done) {
-        this.call(() => {
-          this.res.sendStatus.callCount.should.equal(0)
-          this.res.sendStatus.calledWith(500).should.equal(false)
-          this.res.sendStatus.calledWith(400).should.equal(false)
-          done()
-        })
-      })
-
-      it('should still return data', function (done) {
-        this.call(() => {
-          this.res.json.callCount.should.equal(1)
-          this.res.json.calledWith(this.fakeResponseData).should.equal(true)
-          done()
-        })
-      })
-    })
-
-    describe('when shouldBroadcast is false', function () {
-      beforeEach(function () {
-        this.ReferencesHandler.index.callsArgWith(
-          2,
-          null,
-          this.fakeResponseData
-        )
-        this.req.body.shouldBroadcast = false
-      })
-
-      it('should not call EditorRealTimeController.emitToRoom', function (done) {
-        this.call(() => {
-          this.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
-          done()
-        })
-      })
-
-      it('should not produce an error', function (done) {
-        this.call(() => {
-          this.res.sendStatus.callCount.should.equal(0)
-          this.res.sendStatus.calledWith(500).should.equal(false)
-          this.res.sendStatus.calledWith(400).should.equal(false)
-          done()
-        })
-      })
-
-      it('should still return data', function (done) {
-        this.call(() => {
-          this.res.json.callCount.should.equal(1)
-          this.res.json.calledWith(this.fakeResponseData).should.equal(true)
-          done()
-        })
-      })
-    })
-  })
-
-  describe('there is no data', function () {
-    beforeEach(function () {
-      this.ReferencesHandler.indexAll.callsArgWith(1)
-      this.call = callback => {
-        this.controller.indexAll(this.req, this.res, this.next)
-        callback()
-      }
-    })
-
-    it('should not call EditorRealTimeController.emitToRoom', function (done) {
-      this.call(() => {
-        this.EditorRealTimeController.emitToRoom.callCount.should.equal(0)
-        done()
-      })
-    })
-
-    it('should not produce an error', function (done) {
-      this.call(() => {
-        this.res.sendStatus.callCount.should.equal(0)
-        this.res.sendStatus.calledWith(500).should.equal(false)
-        this.res.sendStatus.calledWith(400).should.equal(false)
-        done()
-      })
-    })
-
-    it('should send a response with an empty keys list', function (done) {
-      this.call(() => {
-        this.res.json.called.should.equal(true)
-        this.res.json
-          .calledWith({ projectId: this.projectId, keys: [] })
-          .should.equal(true)
-        done()
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/References/ReferencesHandler.test.mjs b/services/web/test/unit/src/References/ReferencesHandler.test.mjs
new file mode 100644
index 0000000000..971d815e2e
--- /dev/null
+++ b/services/web/test/unit/src/References/ReferencesHandler.test.mjs
@@ -0,0 +1,445 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+const modulePath =
+  '../../../../app/src/Features/References/ReferencesHandler.mjs'
+
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
+describe('ReferencesHandler', function () {
+  beforeEach(async function (ctx) {
+    ctx.projectId = '222'
+    ctx.historyId = 42
+    ctx.fakeProject = {
+      _id: ctx.projectId,
+      owner_ref: (ctx.fakeOwner = {
+        _id: 'some_owner',
+        features: {
+          references: false,
+        },
+      }),
+      rootFolder: [
+        {
+          docs: [
+            { name: 'one.bib', _id: 'aaa' },
+            { name: 'two.txt', _id: 'bbb' },
+          ],
+          folders: [
+            {
+              docs: [{ name: 'three.bib', _id: 'ccc' }],
+              fileRefs: [
+                { name: 'four.bib', _id: 'fff' },
+                { name: 'five.bib', _id: 'ggg', hash: 'hash' },
+              ],
+              folders: [],
+            },
+          ],
+        },
+      ],
+      overleaf: { history: { id: ctx.historyId } },
+    }
+    ctx.docIds = ['aaa', 'ccc']
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: (ctx.settings = {
+        apis: {
+          references: { url: 'http://some.url/references' },
+          docstore: { url: 'http://some.url/docstore' },
+          filestore: { url: 'http://some.url/filestore' },
+          project_history: { url: 'http://project-history.local' },
+        },
+        filestoreMigrationLevel: 2,
+      }),
+    }))
+
+    vi.doMock('request', () => ({
+      default: (ctx.request = {
+        get: sinon.stub(),
+        post: sinon.stub(),
+      }),
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: (ctx.ProjectGetter = {
+        getProject: sinon.stub().callsArgWith(2, null, ctx.fakeProject),
+      }),
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: (ctx.UserGetter = {
+        getUser: sinon.stub(),
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler',
+      () => ({
+        default: (ctx.DocumentUpdaterHandler = {
+          flushDocToMongo: sinon.stub().callsArgWith(2, null),
+        }),
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Features', () => ({
+      default: (ctx.Features = {
+        hasFeature: sinon.stub().returns(true),
+      }),
+    }))
+
+    ctx.handler = (await import(modulePath)).default
+    ctx.fakeResponseData = {
+      projectId: ctx.projectId,
+      keys: ['k1', 'k2'],
+    }
+  })
+
+  describe('indexAll', function () {
+    beforeEach(function (ctx) {
+      sinon.stub(ctx.handler, '_findBibDocIds').returns(['aaa', 'ccc'])
+      sinon
+        .stub(ctx.handler, '_findBibFileRefs')
+        .returns([{ _id: 'fff' }, { _id: 'ggg', hash: 'hash' }])
+      sinon.stub(ctx.handler, '_isFullIndex').callsArgWith(1, null, true)
+      ctx.request.post.callsArgWith(
+        1,
+        null,
+        { statusCode: 200 },
+        ctx.fakeResponseData
+      )
+      return (ctx.call = callback => {
+        return ctx.handler.indexAll(ctx.projectId, callback)
+      })
+    })
+
+    it('should call _findBibDocIds', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.be.null
+          ctx.handler._findBibDocIds.callCount.should.equal(1)
+          ctx.handler._findBibDocIds
+            .calledWith(ctx.fakeProject)
+            .should.equal(true)
+          return resolve()
+        })
+      })
+    })
+
+    it('should call _findBibFileRefs', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.be.null
+          ctx.handler._findBibDocIds.callCount.should.equal(1)
+          ctx.handler._findBibDocIds
+            .calledWith(ctx.fakeProject)
+            .should.equal(true)
+          return resolve()
+        })
+      })
+    })
+
+    it('should call DocumentUpdaterHandler.flushDocToMongo', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.be.null
+          ctx.DocumentUpdaterHandler.flushDocToMongo.callCount.should.equal(2)
+          return resolve()
+        })
+      })
+    })
+
+    it('should make a request to references service', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.be.null
+          ctx.request.post.callCount.should.equal(1)
+          const arg = ctx.request.post.firstCall.args[0]
+          expect(arg.json).to.have.all.keys(
+            'docUrls',
+            'sourceURLs',
+            'fullIndex'
+          )
+          expect(arg.json.docUrls.length).to.equal(4)
+          expect(arg.json.docUrls).to.deep.equal([
+            `${ctx.settings.apis.docstore.url}/project/${ctx.projectId}/doc/aaa/raw`,
+            `${ctx.settings.apis.docstore.url}/project/${ctx.projectId}/doc/ccc/raw`,
+            `${ctx.settings.apis.filestore.url}/project/${ctx.projectId}/file/fff?from=bibFileUrls`,
+            `${ctx.settings.apis.filestore.url}/project/${ctx.projectId}/file/ggg?from=bibFileUrls`,
+          ])
+          expect(arg.json.sourceURLs.length).to.equal(4)
+          expect(arg.json.sourceURLs).to.deep.equal([
+            {
+              url: `${ctx.settings.apis.docstore.url}/project/${ctx.projectId}/doc/aaa/raw`,
+            },
+            {
+              url: `${ctx.settings.apis.docstore.url}/project/${ctx.projectId}/doc/ccc/raw`,
+            },
+            {
+              url: `${ctx.settings.apis.filestore.url}/project/${ctx.projectId}/file/fff?from=bibFileUrls`,
+            },
+            {
+              url: `${ctx.settings.apis.project_history.url}/project/${ctx.historyId}/blob/hash`,
+              fallbackURL: `${ctx.settings.apis.filestore.url}/project/${ctx.projectId}/file/ggg?from=bibFileUrls`,
+            },
+          ])
+          expect(arg.json.fullIndex).to.equal(true)
+          return resolve()
+        })
+      })
+    })
+
+    it('should not produce an error', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.equal(null)
+          return resolve()
+        })
+      })
+    })
+
+    it('should return data', async function (ctx) {
+      await new Promise(resolve => {
+        return ctx.call((err, data) => {
+          expect(err).to.be.null
+          expect(data).to.not.equal(null)
+          expect(data).to.not.equal(undefined)
+          expect(data).to.equal(ctx.fakeResponseData)
+          return resolve()
+        })
+      })
+    })
+
+    describe('when ProjectGetter.getProject produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectGetter.getProject.callsArgWith(2, new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call((err, data) => {
+            expect(err).to.not.equal(null)
+            expect(err).to.be.instanceof(Error)
+            expect(data).to.equal(undefined)
+            resolve()
+          })
+        })
+      })
+
+      it('should not send request', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.request.post.callCount.should.equal(0)
+            resolve()
+          })
+        })
+      })
+    })
+
+    describe('when ProjectGetter.getProject returns null', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectGetter.getProject.callsArgWith(2, null)
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call((err, data) => {
+            expect(err).to.not.equal(null)
+            expect(err).to.be.instanceof(Errors.NotFoundError)
+            expect(data).to.equal(undefined)
+            resolve()
+          })
+        })
+      })
+
+      it('should not send request', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.request.post.callCount.should.equal(0)
+            resolve()
+          })
+        })
+      })
+    })
+
+    describe('when _isFullIndex produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectGetter.getProject.callsArgWith(2, null, ctx.fakeProject)
+        ctx.handler._isFullIndex.callsArgWith(1, new Error('woops'))
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call((err, data) => {
+            expect(err).to.not.equal(null)
+            expect(err).to.be.instanceof(Error)
+            expect(data).to.equal(undefined)
+            resolve()
+          })
+        })
+      })
+
+      it('should not send request', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.request.post.callCount.should.equal(0)
+            resolve()
+          })
+        })
+      })
+    })
+
+    describe('when flushDocToMongo produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectGetter.getProject.callsArgWith(2, null, ctx.fakeProject)
+        ctx.handler._isFullIndex.callsArgWith(1, false)
+        ctx.DocumentUpdaterHandler.flushDocToMongo.callsArgWith(
+          2,
+          new Error('woops')
+        )
+      })
+
+      it('should produce an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call((err, data) => {
+            expect(err).to.not.equal(null)
+            expect(err).to.be.instanceof(Error)
+            expect(data).to.equal(undefined)
+            resolve()
+          })
+        })
+      })
+
+      it('should not send request', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.call(() => {
+            ctx.request.post.callCount.should.equal(0)
+            resolve()
+          })
+        })
+      })
+    })
+  })
+
+  describe('_findBibDocIds', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeProject = {
+        rootFolder: [
+          {
+            docs: [
+              { name: 'one.bib', _id: 'aaa' },
+              { name: 'two.txt', _id: 'bbb' },
+            ],
+            folders: [
+              { docs: [{ name: 'three.bib', _id: 'ccc' }], folders: [] },
+            ],
+          },
+        ],
+      }
+      ctx.expectedIds = ['aaa', 'ccc']
+    })
+
+    it('should select the correct docIds', function (ctx) {
+      const result = ctx.handler._findBibDocIds(ctx.fakeProject)
+      expect(result).to.deep.equal(ctx.expectedIds)
+    })
+
+    it('should not error with a non array of folders from dirty data', function (ctx) {
+      ctx.fakeProject.rootFolder[0].folders[0].folders = {}
+      const result = ctx.handler._findBibDocIds(ctx.fakeProject)
+      expect(result).to.deep.equal(ctx.expectedIds)
+    })
+  })
+
+  describe('_findBibFileRefs', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeProject = {
+        rootFolder: [
+          {
+            docs: [
+              { name: 'one.bib', _id: 'aaa' },
+              { name: 'two.txt', _id: 'bbb' },
+            ],
+            fileRefs: [{ name: 'other.bib', _id: 'ddd' }],
+            folders: [
+              {
+                docs: [{ name: 'three.bib', _id: 'ccc' }],
+                fileRefs: [{ name: 'four.bib', _id: 'ghg' }],
+                folders: [],
+              },
+            ],
+          },
+        ],
+      }
+      ctx.expectedIds = [
+        ctx.fakeProject.rootFolder[0].fileRefs[0],
+        ctx.fakeProject.rootFolder[0].folders[0].fileRefs[0],
+      ]
+    })
+
+    it('should select the correct docIds', function (ctx) {
+      const result = ctx.handler._findBibFileRefs(ctx.fakeProject)
+      expect(result).to.deep.equal(ctx.expectedIds)
+    })
+  })
+
+  describe('_isFullIndex', function () {
+    beforeEach(function (ctx) {
+      ctx.fakeProject = { owner_ref: (ctx.owner_ref = 'owner-ref-123') }
+      ctx.owner = {
+        features: {
+          references: false,
+        },
+      }
+      ctx.UserGetter.getUser = sinon.stub()
+      ctx.UserGetter.getUser
+        .withArgs(ctx.owner_ref, { features: true })
+        .yields(null, ctx.owner)
+      ctx.call = callback => {
+        ctx.handler._isFullIndex(ctx.fakeProject, callback)
+      }
+    })
+
+    describe('with references feature on', function () {
+      beforeEach(function (ctx) {
+        ctx.owner.features.references = true
+      })
+
+      it('should return true', function (ctx) {
+        ctx.call((err, isFullIndex) => {
+          expect(err).to.equal(null)
+          expect(isFullIndex).to.equal(true)
+        })
+      })
+    })
+
+    describe('with references feature off', function () {
+      beforeEach(function (ctx) {
+        ctx.owner.features.references = false
+      })
+
+      it('should return false', function (ctx) {
+        ctx.call((err, isFullIndex) => {
+          expect(err).to.equal(null)
+          expect(isFullIndex).to.equal(false)
+        })
+      })
+    })
+
+    describe('with referencesSearch', function () {
+      beforeEach(function (ctx) {
+        ctx.owner.features = {
+          referencesSearch: true,
+          references: false,
+        }
+      })
+
+      it('should return true', function (ctx) {
+        ctx.call((err, isFullIndex) => {
+          expect(err).to.equal(null)
+          expect(isFullIndex).to.equal(true)
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/References/ReferencesHandlerTests.mjs b/services/web/test/unit/src/References/ReferencesHandlerTests.mjs
deleted file mode 100644
index 57570dcf12..0000000000
--- a/services/web/test/unit/src/References/ReferencesHandlerTests.mjs
+++ /dev/null
@@ -1,399 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import esmock from 'esmock'
-
-import { expect } from 'chai'
-import sinon from 'sinon'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-const modulePath =
-  '../../../../app/src/Features/References/ReferencesHandler.mjs'
-
-describe('ReferencesHandler', function () {
-  beforeEach(async function () {
-    this.projectId = '222'
-    this.historyId = 42
-    this.fakeProject = {
-      _id: this.projectId,
-      owner_ref: (this.fakeOwner = {
-        _id: 'some_owner',
-        features: {
-          references: false,
-        },
-      }),
-      rootFolder: [
-        {
-          docs: [
-            { name: 'one.bib', _id: 'aaa' },
-            { name: 'two.txt', _id: 'bbb' },
-          ],
-          folders: [
-            {
-              docs: [{ name: 'three.bib', _id: 'ccc' }],
-              fileRefs: [
-                { name: 'four.bib', _id: 'fff' },
-                { name: 'five.bib', _id: 'ggg', hash: 'hash' },
-              ],
-              folders: [],
-            },
-          ],
-        },
-      ],
-      overleaf: { history: { id: this.historyId } },
-    }
-    this.docIds = ['aaa', 'ccc']
-    this.handler = await esmock.strict(modulePath, {
-      '@overleaf/settings': (this.settings = {
-        apis: {
-          references: { url: 'http://some.url/references' },
-          docstore: { url: 'http://some.url/docstore' },
-          filestore: { url: 'http://some.url/filestore' },
-          project_history: { url: 'http://project-history.local' },
-        },
-        enableProjectHistoryBlobs: true,
-      }),
-      request: (this.request = {
-        get: sinon.stub(),
-        post: sinon.stub(),
-      }),
-      '../../../../app/src/Features/Project/ProjectGetter':
-        (this.ProjectGetter = {
-          getProject: sinon.stub().callsArgWith(2, null, this.fakeProject),
-        }),
-      '../../../../app/src/Features/User/UserGetter': (this.UserGetter = {
-        getUser: sinon.stub(),
-      }),
-      '../../../../app/src/Features/DocumentUpdater/DocumentUpdaterHandler':
-        (this.DocumentUpdaterHandler = {
-          flushDocToMongo: sinon.stub().callsArgWith(2, null),
-        }),
-      '../../../../app/src/infrastructure/Features': (this.Features = {
-        hasFeature: sinon.stub().returns(true),
-      }),
-    })
-    this.fakeResponseData = {
-      projectId: this.projectId,
-      keys: ['k1', 'k2'],
-    }
-  })
-
-  describe('indexAll', function () {
-    beforeEach(function () {
-      sinon.stub(this.handler, '_findBibDocIds').returns(['aaa', 'ccc'])
-      sinon
-        .stub(this.handler, '_findBibFileRefs')
-        .returns([{ _id: 'fff' }, { _id: 'ggg', hash: 'hash' }])
-      sinon.stub(this.handler, '_isFullIndex').callsArgWith(1, null, true)
-      this.request.post.callsArgWith(
-        1,
-        null,
-        { statusCode: 200 },
-        this.fakeResponseData
-      )
-      return (this.call = callback => {
-        return this.handler.indexAll(this.projectId, callback)
-      })
-    })
-
-    it('should call _findBibDocIds', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.be.null
-        this.handler._findBibDocIds.callCount.should.equal(1)
-        this.handler._findBibDocIds
-          .calledWith(this.fakeProject)
-          .should.equal(true)
-        return done()
-      })
-    })
-
-    it('should call _findBibFileRefs', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.be.null
-        this.handler._findBibDocIds.callCount.should.equal(1)
-        this.handler._findBibDocIds
-          .calledWith(this.fakeProject)
-          .should.equal(true)
-        return done()
-      })
-    })
-
-    it('should call DocumentUpdaterHandler.flushDocToMongo', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.be.null
-        this.DocumentUpdaterHandler.flushDocToMongo.callCount.should.equal(2)
-        return done()
-      })
-    })
-
-    it('should make a request to references service', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.be.null
-        this.request.post.callCount.should.equal(1)
-        const arg = this.request.post.firstCall.args[0]
-        expect(arg.json).to.have.all.keys('docUrls', 'sourceURLs', 'fullIndex')
-        expect(arg.json.docUrls.length).to.equal(4)
-        expect(arg.json.docUrls).to.deep.equal([
-          `${this.settings.apis.docstore.url}/project/${this.projectId}/doc/aaa/raw`,
-          `${this.settings.apis.docstore.url}/project/${this.projectId}/doc/ccc/raw`,
-          `${this.settings.apis.filestore.url}/project/${this.projectId}/file/fff?from=bibFileUrls`,
-          `${this.settings.apis.filestore.url}/project/${this.projectId}/file/ggg?from=bibFileUrls`,
-        ])
-        expect(arg.json.sourceURLs.length).to.equal(4)
-        expect(arg.json.sourceURLs).to.deep.equal([
-          {
-            url: `${this.settings.apis.docstore.url}/project/${this.projectId}/doc/aaa/raw`,
-          },
-          {
-            url: `${this.settings.apis.docstore.url}/project/${this.projectId}/doc/ccc/raw`,
-          },
-          {
-            url: `${this.settings.apis.filestore.url}/project/${this.projectId}/file/fff?from=bibFileUrls`,
-          },
-          {
-            url: `${this.settings.apis.project_history.url}/project/${this.historyId}/blob/hash`,
-            fallbackURL: `${this.settings.apis.filestore.url}/project/${this.projectId}/file/ggg?from=bibFileUrls`,
-          },
-        ])
-        expect(arg.json.fullIndex).to.equal(true)
-        return done()
-      })
-    })
-
-    it('should not produce an error', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.equal(null)
-        return done()
-      })
-    })
-
-    it('should return data', function (done) {
-      return this.call((err, data) => {
-        expect(err).to.be.null
-        expect(data).to.not.equal(null)
-        expect(data).to.not.equal(undefined)
-        expect(data).to.equal(this.fakeResponseData)
-        return done()
-      })
-    })
-
-    describe('when ProjectGetter.getProject produces an error', function () {
-      beforeEach(function () {
-        return this.ProjectGetter.getProject.callsArgWith(2, new Error('woops'))
-      })
-
-      it('should produce an error', function (done) {
-        return this.call((err, data) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          expect(data).to.equal(undefined)
-          return done()
-        })
-      })
-
-      it('should not send request', function (done) {
-        return this.call(() => {
-          this.request.post.callCount.should.equal(0)
-          return done()
-        })
-      })
-    })
-
-    describe('when ProjectGetter.getProject returns null', function () {
-      beforeEach(function () {
-        return this.ProjectGetter.getProject.callsArgWith(2, null)
-      })
-
-      it('should produce an error', function (done) {
-        return this.call((err, data) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Errors.NotFoundError)
-          expect(data).to.equal(undefined)
-          return done()
-        })
-      })
-
-      it('should not send request', function (done) {
-        return this.call(() => {
-          this.request.post.callCount.should.equal(0)
-          return done()
-        })
-      })
-    })
-
-    describe('when _isFullIndex produces an error', function () {
-      beforeEach(function () {
-        this.ProjectGetter.getProject.callsArgWith(2, null, this.fakeProject)
-        return this.handler._isFullIndex.callsArgWith(1, new Error('woops'))
-      })
-
-      it('should produce an error', function (done) {
-        return this.call((err, data) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          expect(data).to.equal(undefined)
-          return done()
-        })
-      })
-
-      it('should not send request', function (done) {
-        return this.call(() => {
-          this.request.post.callCount.should.equal(0)
-          return done()
-        })
-      })
-    })
-
-    describe('when flushDocToMongo produces an error', function () {
-      beforeEach(function () {
-        this.ProjectGetter.getProject.callsArgWith(2, null, this.fakeProject)
-        this.handler._isFullIndex.callsArgWith(1, false)
-        return this.DocumentUpdaterHandler.flushDocToMongo.callsArgWith(
-          2,
-          new Error('woops')
-        )
-      })
-
-      it('should produce an error', function (done) {
-        return this.call((err, data) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          expect(data).to.equal(undefined)
-          return done()
-        })
-      })
-
-      it('should not send request', function (done) {
-        return this.call(() => {
-          this.request.post.callCount.should.equal(0)
-          return done()
-        })
-      })
-    })
-  })
-
-  describe('_findBibDocIds', function () {
-    beforeEach(function () {
-      this.fakeProject = {
-        rootFolder: [
-          {
-            docs: [
-              { name: 'one.bib', _id: 'aaa' },
-              { name: 'two.txt', _id: 'bbb' },
-            ],
-            folders: [
-              { docs: [{ name: 'three.bib', _id: 'ccc' }], folders: [] },
-            ],
-          },
-        ],
-      }
-      return (this.expectedIds = ['aaa', 'ccc'])
-    })
-
-    it('should select the correct docIds', function () {
-      const result = this.handler._findBibDocIds(this.fakeProject)
-      return expect(result).to.deep.equal(this.expectedIds)
-    })
-
-    it('should not error with a non array of folders from dirty data', function () {
-      this.fakeProject.rootFolder[0].folders[0].folders = {}
-      const result = this.handler._findBibDocIds(this.fakeProject)
-      return expect(result).to.deep.equal(this.expectedIds)
-    })
-  })
-
-  describe('_findBibFileRefs', function () {
-    beforeEach(function () {
-      this.fakeProject = {
-        rootFolder: [
-          {
-            docs: [
-              { name: 'one.bib', _id: 'aaa' },
-              { name: 'two.txt', _id: 'bbb' },
-            ],
-            fileRefs: [{ name: 'other.bib', _id: 'ddd' }],
-            folders: [
-              {
-                docs: [{ name: 'three.bib', _id: 'ccc' }],
-                fileRefs: [{ name: 'four.bib', _id: 'ghg' }],
-                folders: [],
-              },
-            ],
-          },
-        ],
-      }
-      this.expectedIds = [
-        this.fakeProject.rootFolder[0].fileRefs[0],
-        this.fakeProject.rootFolder[0].folders[0].fileRefs[0],
-      ]
-    })
-
-    it('should select the correct docIds', function () {
-      const result = this.handler._findBibFileRefs(this.fakeProject)
-      return expect(result).to.deep.equal(this.expectedIds)
-    })
-  })
-
-  describe('_isFullIndex', function () {
-    beforeEach(function () {
-      this.fakeProject = { owner_ref: (this.owner_ref = 'owner-ref-123') }
-      this.owner = {
-        features: {
-          references: false,
-        },
-      }
-      this.UserGetter.getUser = sinon.stub()
-      this.UserGetter.getUser
-        .withArgs(this.owner_ref, { features: true })
-        .yields(null, this.owner)
-      return (this.call = callback => {
-        return this.handler._isFullIndex(this.fakeProject, callback)
-      })
-    })
-
-    describe('with references feature on', function () {
-      beforeEach(function () {
-        return (this.owner.features.references = true)
-      })
-
-      it('should return true', function () {
-        return this.call((err, isFullIndex) => {
-          expect(err).to.equal(null)
-          return expect(isFullIndex).to.equal(true)
-        })
-      })
-    })
-
-    describe('with references feature off', function () {
-      beforeEach(function () {
-        return (this.owner.features.references = false)
-      })
-
-      it('should return false', function () {
-        return this.call((err, isFullIndex) => {
-          expect(err).to.equal(null)
-          return expect(isFullIndex).to.equal(false)
-        })
-      })
-    })
-
-    describe('with referencesSearch', function () {
-      beforeEach(function () {
-        return (this.owner.features = {
-          referencesSearch: true,
-          references: false,
-        })
-      })
-
-      it('should return true', function () {
-        return this.call((err, isFullIndex) => {
-          expect(err).to.equal(null)
-          return expect(isFullIndex).to.equal(true)
-        })
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Security/LoginRateLimiterTests.js b/services/web/test/unit/src/Security/LoginRateLimiterTests.js
index 645002400e..6dadaad8c2 100644
--- a/services/web/test/unit/src/Security/LoginRateLimiterTests.js
+++ b/services/web/test/unit/src/Security/LoginRateLimiterTests.js
@@ -25,23 +25,17 @@ describe('LoginRateLimiter', function () {
   })
 
   describe('processLoginRequest', function () {
-    it('should consume points', function (done) {
-      this.LoginRateLimiter.processLoginRequest(this.email, (err, allow) => {
-        if (err) {
-          return done(err)
-        }
-        expect(this.rateLimiter.consume).to.have.been.calledWith(this.email)
-        done()
-      })
+    it('should consume points', async function () {
+      await this.LoginRateLimiter.promises.processLoginRequest(this.email)
+      expect(this.rateLimiter.consume).to.have.been.calledWith(this.email)
     })
 
     describe('when login is allowed', function () {
-      it('should call pass allow=true', function (done) {
-        this.LoginRateLimiter.processLoginRequest(this.email, (err, allow) => {
-          expect(err).to.equal(null)
-          expect(allow).to.equal(true)
-          done()
-        })
+      it('should call pass allow=true', async function () {
+        const allow = await this.LoginRateLimiter.promises.processLoginRequest(
+          this.email
+        )
+        expect(allow).to.equal(true)
       })
     })
 
@@ -50,12 +44,11 @@ describe('LoginRateLimiter', function () {
         this.rateLimiter.consume.rejects({ remainingPoints: 0 })
       })
 
-      it('should call pass allow=false', function (done) {
-        this.LoginRateLimiter.processLoginRequest(this.email, (err, allow) => {
-          expect(err).to.equal(null)
-          expect(allow).to.equal(false)
-          done()
-        })
+      it('should call pass allow=false', async function () {
+        const allow = await this.LoginRateLimiter.promises.processLoginRequest(
+          this.email
+        )
+        expect(allow).to.equal(false)
       })
     })
 
@@ -64,22 +57,24 @@ describe('LoginRateLimiter', function () {
         this.rateLimiter.consume.rejects(new Error('woops'))
       })
 
-      it('should produce an error', function (done) {
-        this.LoginRateLimiter.processLoginRequest(this.email, (err, allow) => {
-          expect(err).to.not.equal(null)
-          expect(err).to.be.instanceof(Error)
-          done()
-        })
+      it('should produce an error', async function () {
+        let error
+
+        try {
+          await this.LoginRateLimiter.promises.processLoginRequest(this.email)
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
       })
     })
   })
 
   describe('recordSuccessfulLogin', function () {
-    it('should clear the rate limit', function (done) {
-      this.LoginRateLimiter.recordSuccessfulLogin(this.email, () => {
-        expect(this.rateLimiter.delete).to.have.been.calledWith(this.email)
-        done()
-      })
+    it('should clear the rate limit', async function () {
+      await this.LoginRateLimiter.promises.recordSuccessfulLogin(this.email)
+      expect(this.rateLimiter.delete).to.have.been.calledWith(this.email)
     })
   })
 })
diff --git a/services/web/test/unit/src/SplitTests/SplitTestHandlerTests.js b/services/web/test/unit/src/SplitTests/SplitTestHandlerTests.js
index a682f0c954..4970492eee 100644
--- a/services/web/test/unit/src/SplitTests/SplitTestHandlerTests.js
+++ b/services/web/test/unit/src/SplitTests/SplitTestHandlerTests.js
@@ -39,6 +39,7 @@ describe('SplitTestHandler', function () {
     }
     this.SplitTestCache.get.resolves(this.cachedSplitTests)
     this.Settings = {
+      filestoreMigrationLevel: 0,
       moduleImportSequence: [],
       overleaf: {},
       devToolbar: {
diff --git a/services/web/test/unit/src/Subscription/FeaturesUpdaterTests.js b/services/web/test/unit/src/Subscription/FeaturesUpdaterTests.js
index cf7d8d8683..dccbff476c 100644
--- a/services/web/test/unit/src/Subscription/FeaturesUpdaterTests.js
+++ b/services/web/test/unit/src/Subscription/FeaturesUpdaterTests.js
@@ -4,7 +4,7 @@ const sinon = require('sinon')
 const { ObjectId } = require('mongodb-legacy')
 const {
   AI_ADD_ON_CODE,
-} = require('../../../../app/src/Features/Subscription/RecurlyEntities')
+} = require('../../../../app/src/Features/Subscription/AiHelper')
 
 const MODULE_PATH = '../../../../app/src/Features/Subscription/FeaturesUpdater'
 
diff --git a/services/web/test/unit/src/Subscription/LimitationsManagerTests.js b/services/web/test/unit/src/Subscription/LimitationsManagerTests.js
index 29c97de6b6..96de680e82 100644
--- a/services/web/test/unit/src/Subscription/LimitationsManagerTests.js
+++ b/services/web/test/unit/src/Subscription/LimitationsManagerTests.js
@@ -434,6 +434,19 @@ describe('LimitationsManager', function () {
       expect(hasSubscription).to.be.true
     })
 
+    it('should return true if the paymentProvider field is set', async function () {
+      this.SubscriptionLocator.promises.getUsersSubscription = sinon
+        .stub()
+        .resolves({
+          paymentProvider: {
+            subscriptionId: '1234',
+          },
+        })
+      const { hasSubscription } =
+        await this.LimitationsManager.promises.userHasSubscription(this.user)
+      expect(hasSubscription).to.be.true
+    })
+
     it('should return false if the recurly token is not set', async function () {
       this.SubscriptionLocator.promises.getUsersSubscription.resolves({})
       const { hasSubscription } =
diff --git a/services/web/test/unit/src/Subscription/RecurlyEntitiesTest.js b/services/web/test/unit/src/Subscription/PaymentProviderEntitiesTest.js
similarity index 50%
rename from services/web/test/unit/src/Subscription/RecurlyEntitiesTest.js
rename to services/web/test/unit/src/Subscription/PaymentProviderEntitiesTest.js
index 22811ac04f..7b2b85b4d8 100644
--- a/services/web/test/unit/src/Subscription/RecurlyEntitiesTest.js
+++ b/services/web/test/unit/src/Subscription/PaymentProviderEntitiesTest.js
@@ -3,18 +3,23 @@
 const SandboxedModule = require('sandboxed-module')
 const { expect } = require('chai')
 const Errors = require('../../../../app/src/Features/Subscription/Errors')
+const {
+  PaymentProviderSubscriptionChangeRequest,
+  PaymentProviderSubscriptionUpdateRequest,
+  PaymentProviderSubscriptionChange,
+  PaymentProviderSubscription,
+  PaymentProviderSubscriptionAddOnUpdate,
+} = require('../../../../app/src/Features/Subscription/PaymentProviderEntities')
 const {
   AI_ADD_ON_CODE,
-  RecurlySubscriptionChangeRequest,
-  RecurlySubscriptionChange,
-  RecurlySubscription,
-  RecurlySubscriptionAddOnUpdate,
-} = require('../../../../app/src/Features/Subscription/RecurlyEntities')
+} = require('../../../../app/src/Features/Subscription/AiHelper')
+const SubscriptionHelper = require('../../../../app/src/Features/Subscription/SubscriptionHelper')
 
-const MODULE_PATH = '../../../../app/src/Features/Subscription/RecurlyEntities'
+const MODULE_PATH =
+  '../../../../app/src/Features/Subscription/PaymentProviderEntities'
 
-describe('RecurlyEntities', function () {
-  describe('RecurlySubscription', function () {
+describe('PaymentProviderEntities', function () {
+  describe('PaymentProviderSubscription', function () {
     beforeEach(function () {
       this.Settings = {
         plans: [
@@ -22,29 +27,36 @@ describe('RecurlyEntities', function () {
           { planCode: 'cheap-plan', price_in_cents: 500 },
           { planCode: 'regular-plan', price_in_cents: 1000 },
           { planCode: 'premium-plan', price_in_cents: 2000 },
+          {
+            planCode: 'group_collaborator_10_enterprise',
+            price_in_cents: 10000,
+          },
         ],
         features: [],
       }
 
-      this.RecurlyEntities = SandboxedModule.require(MODULE_PATH, {
+      this.PaymentProviderEntities = SandboxedModule.require(MODULE_PATH, {
         requires: {
           '@overleaf/settings': this.Settings,
           './Errors': Errors,
+          './SubscriptionHelper': SubscriptionHelper,
         },
       })
     })
 
     describe('with add-ons', function () {
       beforeEach(function () {
-        const { RecurlySubscription, RecurlySubscriptionAddOn } =
-          this.RecurlyEntities
-        this.addOn = new RecurlySubscriptionAddOn({
+        const {
+          PaymentProviderSubscription,
+          PaymentProviderSubscriptionAddOn,
+        } = this.PaymentProviderEntities
+        this.addOn = new PaymentProviderSubscriptionAddOn({
           code: 'add-on-code',
           name: 'My Add-On',
           quantity: 1,
           unitPrice: 2,
         })
-        this.subscription = new RecurlySubscription({
+        this.subscription = new PaymentProviderSubscription({
           id: 'subscription-id',
           userId: 'user-id',
           planCode: 'regular-plan',
@@ -71,11 +83,15 @@ describe('RecurlyEntities', function () {
 
       describe('getRequestForPlanChange()', function () {
         it('returns a change request for upgrades', function () {
-          const { RecurlySubscriptionChangeRequest } = this.RecurlyEntities
-          const changeRequest =
-            this.subscription.getRequestForPlanChange('premium-plan')
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'premium-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('premium-plan')
+          )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               planCode: 'premium-plan',
@@ -84,11 +100,15 @@ describe('RecurlyEntities', function () {
         })
 
         it('returns a change request for downgrades', function () {
-          const { RecurlySubscriptionChangeRequest } = this.RecurlyEntities
-          const changeRequest =
-            this.subscription.getRequestForPlanChange('cheap-plan')
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'cheap-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('cheap-plan')
+          )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'term_end',
               planCode: 'cheap-plan',
@@ -96,18 +116,42 @@ describe('RecurlyEntities', function () {
           )
         })
 
-        it('preserves the AI add-on on upgrades', function () {
-          const { RecurlySubscriptionChangeRequest } = this.RecurlyEntities
-          this.addOn.code = AI_ADD_ON_CODE
-          const changeRequest =
-            this.subscription.getRequestForPlanChange('premium-plan')
+        it('returns a change request for downgrades while on trial', function () {
+          const fiveDaysFromNow = new Date()
+          fiveDaysFromNow.setDate(fiveDaysFromNow.getDate() + 5)
+          this.subscription.trialPeriodEnd = fiveDaysFromNow
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'cheap-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('cheap-plan')
+          )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
+              subscription: this.subscription,
+              timeframe: 'now',
+              planCode: 'cheap-plan',
+            })
+          )
+        })
+
+        it('preserves the AI add-on on upgrades', function () {
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          this.addOn.code = AI_ADD_ON_CODE
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'premium-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('premium-plan')
+          )
+          expect(changeRequest).to.deep.equal(
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               planCode: 'premium-plan',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: AI_ADD_ON_CODE,
                   quantity: 1,
                 }),
@@ -117,17 +161,21 @@ describe('RecurlyEntities', function () {
         })
 
         it('preserves the AI add-on on downgrades', function () {
-          const { RecurlySubscriptionChangeRequest } = this.RecurlyEntities
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
           this.addOn.code = AI_ADD_ON_CODE
-          const changeRequest =
-            this.subscription.getRequestForPlanChange('cheap-plan')
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'cheap-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('cheap-plan')
+          )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'term_end',
               planCode: 'cheap-plan',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: AI_ADD_ON_CODE,
                   quantity: 1,
                 }),
@@ -137,18 +185,79 @@ describe('RecurlyEntities', function () {
         })
 
         it('preserves the AI add-on on upgrades from the standalone AI plan', function () {
-          const { RecurlySubscriptionChangeRequest } = this.RecurlyEntities
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
           this.subscription.planCode = 'assistant-annual'
           this.subscription.addOns = []
-          const changeRequest =
-            this.subscription.getRequestForPlanChange('cheap-plan')
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'cheap-plan',
+            1,
+            this.subscription.shouldPlanChangeAtTermEnd('cheap-plan')
+          )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
-              timeframe: 'term_end',
+              timeframe: 'now',
               planCode: 'cheap-plan',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
+                  code: AI_ADD_ON_CODE,
+                  quantity: 1,
+                }),
+              ],
+            })
+          )
+        })
+
+        it('upgrade from individual to group plan for Stripe subscription', function () {
+          this.subscription.service = 'stripe-uk'
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'group_collaborator',
+            10,
+            this.subscription.shouldPlanChangeAtTermEnd(
+              'group_collaborator_10_enterprise'
+            )
+          )
+          expect(changeRequest).to.deep.equal(
+            new PaymentProviderSubscriptionChangeRequest({
+              subscription: this.subscription,
+              timeframe: 'now',
+              planCode: 'group_collaborator',
+              addOnUpdates: [
+                new PaymentProviderSubscriptionAddOnUpdate({
+                  code: 'additional-license',
+                  quantity: 10,
+                }),
+              ],
+            })
+          )
+        })
+
+        it('upgrade from individual to group plan and preserves the AI add-on for Stripe subscription', function () {
+          this.subscription.service = 'stripe-uk'
+          const { PaymentProviderSubscriptionChangeRequest } =
+            this.PaymentProviderEntities
+          this.addOn.code = AI_ADD_ON_CODE
+          const changeRequest = this.subscription.getRequestForPlanChange(
+            'group_collaborator',
+            10,
+            this.subscription.shouldPlanChangeAtTermEnd(
+              'group_collaborator_10_enterprise'
+            )
+          )
+          expect(changeRequest).to.deep.equal(
+            new PaymentProviderSubscriptionChangeRequest({
+              subscription: this.subscription,
+              timeframe: 'now',
+              planCode: 'group_collaborator',
+              addOnUpdates: [
+                new PaymentProviderSubscriptionAddOnUpdate({
+                  code: 'additional-license',
+                  quantity: 10,
+                }),
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: AI_ADD_ON_CODE,
                   quantity: 1,
                 }),
@@ -161,22 +270,22 @@ describe('RecurlyEntities', function () {
       describe('getRequestForAddOnPurchase()', function () {
         it('returns a change request', function () {
           const {
-            RecurlySubscriptionChangeRequest,
-            RecurlySubscriptionAddOnUpdate,
-          } = this.RecurlyEntities
+            PaymentProviderSubscriptionChangeRequest,
+            PaymentProviderSubscriptionAddOnUpdate,
+          } = this.PaymentProviderEntities
           const changeRequest =
             this.subscription.getRequestForAddOnPurchase('another-add-on')
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: this.addOn.code,
                   quantity: this.addOn.quantity,
                   unitPrice: this.addOn.unitPrice,
                 }),
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: 'another-add-on',
                   quantity: 1,
                 }),
@@ -187,9 +296,9 @@ describe('RecurlyEntities', function () {
 
         it('returns a change request with quantity and unit price specified', function () {
           const {
-            RecurlySubscriptionChangeRequest,
-            RecurlySubscriptionAddOnUpdate,
-          } = this.RecurlyEntities
+            PaymentProviderSubscriptionChangeRequest,
+            PaymentProviderSubscriptionAddOnUpdate,
+          } = this.PaymentProviderEntities
           const quantity = 5
           const unitPrice = 10
           const changeRequest = this.subscription.getRequestForAddOnPurchase(
@@ -198,16 +307,16 @@ describe('RecurlyEntities', function () {
             unitPrice
           )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: this.addOn.code,
                   quantity: this.addOn.quantity,
                   unitPrice: this.addOn.unitPrice,
                 }),
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: 'another-add-on',
                   quantity,
                   unitPrice,
@@ -227,20 +336,20 @@ describe('RecurlyEntities', function () {
       describe('getRequestForAddOnUpdate()', function () {
         it('returns a change request', function () {
           const {
-            RecurlySubscriptionChangeRequest,
-            RecurlySubscriptionAddOnUpdate,
-          } = this.RecurlyEntities
+            PaymentProviderSubscriptionChangeRequest,
+            PaymentProviderSubscriptionAddOnUpdate,
+          } = this.PaymentProviderEntities
           const newQuantity = 2
           const changeRequest = this.subscription.getRequestForAddOnUpdate(
             'add-on-code',
             newQuantity
           )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               addOnUpdates: [
-                new RecurlySubscriptionAddOnUpdate({
+                new PaymentProviderSubscriptionAddOnUpdate({
                   code: this.addOn.code,
                   quantity: newQuantity,
                   unitPrice: this.addOn.unitPrice,
@@ -263,7 +372,7 @@ describe('RecurlyEntities', function () {
             this.addOn.code
           )
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'term_end',
               addOnUpdates: [],
@@ -271,6 +380,22 @@ describe('RecurlyEntities', function () {
           )
         })
 
+        it('returns a change request when in trial', function () {
+          const fiveDaysFromNow = new Date()
+          fiveDaysFromNow.setDate(fiveDaysFromNow.getDate() + 5)
+          this.subscription.trialPeriodEnd = fiveDaysFromNow
+          const changeRequest = this.subscription.getRequestForAddOnRemoval(
+            this.addOn.code
+          )
+          expect(changeRequest).to.deep.equal(
+            new PaymentProviderSubscriptionChangeRequest({
+              subscription: this.subscription,
+              timeframe: 'now',
+              addOnUpdates: [],
+            })
+          )
+        })
+
         it("throws an AddOnNotPresentError if the subscription doesn't have the add-on", function () {
           expect(() =>
             this.subscription.getRequestForAddOnRemoval('another-add-on')
@@ -283,13 +408,13 @@ describe('RecurlyEntities', function () {
           const changeRequest =
             this.subscription.getRequestForGroupPlanUpgrade('test_plan_code')
           const addOns = [
-            new RecurlySubscriptionAddOnUpdate({
+            new PaymentProviderSubscriptionAddOnUpdate({
               code: 'add-on-code',
               quantity: 1,
             }),
           ]
           expect(changeRequest).to.deep.equal(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               addOnUpdates: addOns,
@@ -299,10 +424,40 @@ describe('RecurlyEntities', function () {
         })
       })
 
+      describe('getRequestForPoNumberAndTermsAndConditionsUpdate()', function () {
+        it('returns a correct update request', function () {
+          const updateRequest =
+            this.subscription.getRequestForPoNumberAndTermsAndConditionsUpdate(
+              'O12345',
+              'T&C copy'
+            )
+          expect(updateRequest).to.deep.equal(
+            new PaymentProviderSubscriptionUpdateRequest({
+              subscription: this.subscription,
+              poNumber: 'O12345',
+              termsAndConditions: 'T&C copy',
+            })
+          )
+        })
+      })
+
+      describe('getRequestForTermsAndConditionsUpdate()', function () {
+        it('returns a correct update request', function () {
+          const updateRequest =
+            this.subscription.getRequestForTermsAndConditionsUpdate('T&C copy')
+          expect(updateRequest).to.deep.equal(
+            new PaymentProviderSubscriptionUpdateRequest({
+              subscription: this.subscription,
+              termsAndConditions: 'T&C copy',
+            })
+          )
+        })
+      })
+
       describe('without add-ons', function () {
         beforeEach(function () {
-          const { RecurlySubscription } = this.RecurlyEntities
-          this.subscription = new RecurlySubscription({
+          const { PaymentProviderSubscription } = this.PaymentProviderEntities
+          this.subscription = new PaymentProviderSubscription({
             id: 'subscription-id',
             userId: 'user-id',
             planCode: 'regular-plan',
@@ -325,17 +480,17 @@ describe('RecurlyEntities', function () {
         describe('getRequestForAddOnPurchase()', function () {
           it('returns a change request', function () {
             const {
-              RecurlySubscriptionChangeRequest,
-              RecurlySubscriptionAddOnUpdate,
-            } = this.RecurlyEntities
+              PaymentProviderSubscriptionChangeRequest,
+              PaymentProviderSubscriptionAddOnUpdate,
+            } = this.PaymentProviderEntities
             const changeRequest =
               this.subscription.getRequestForAddOnPurchase('some-add-on')
             expect(changeRequest).to.deep.equal(
-              new RecurlySubscriptionChangeRequest({
+              new PaymentProviderSubscriptionChangeRequest({
                 subscription: this.subscription,
                 timeframe: 'now',
                 addOnUpdates: [
-                  new RecurlySubscriptionAddOnUpdate({
+                  new PaymentProviderSubscriptionAddOnUpdate({
                     code: 'some-add-on',
                     quantity: 1,
                   }),
@@ -356,10 +511,10 @@ describe('RecurlyEntities', function () {
     })
   })
 
-  describe('RecurlySubscriptionChange', function () {
+  describe('PaymentProviderSubscriptionChange', function () {
     describe('constructor', function () {
       it('rounds the amounts when calculating the taxes', function () {
-        const subscription = new RecurlySubscription({
+        const subscription = new PaymentProviderSubscription({
           id: 'subscription-id',
           userId: 'user-id',
           planCode: 'premium-plan',
@@ -373,8 +528,11 @@ describe('RecurlyEntities', function () {
           periodStart: new Date(),
           periodEnd: new Date(),
           collectionMethod: 'automatic',
+          netTerms: 0,
+          poNumber: '012345',
+          termsAndConditions: 'T&C copy',
         })
-        const change = new RecurlySubscriptionChange({
+        const change = new PaymentProviderSubscriptionChange({
           subscription,
           nextPlanCode: 'promotional-plan',
           nextPlanName: 'Promotial plan',
diff --git a/services/web/test/unit/src/Subscription/PlansLocatorTests.js b/services/web/test/unit/src/Subscription/PlansLocatorTests.js
index 9373c02b89..7e35ccea58 100644
--- a/services/web/test/unit/src/Subscription/PlansLocatorTests.js
+++ b/services/web/test/unit/src/Subscription/PlansLocatorTests.js
@@ -29,6 +29,7 @@ const plans = [
 describe('PlansLocator', function () {
   beforeEach(function () {
     this.settings = { plans }
+    this.AI_ADD_ON_CODE = 'assistant'
 
     this.PlansLocator = SandboxedModule.require(modulePath, {
       requires: {
@@ -49,68 +50,139 @@ describe('PlansLocator', function () {
     })
   })
 
-  describe('mapRecurlyPlanCodeToStripeLookupKey', function () {
+  describe('buildStripeLookupKey', function () {
     it('should map "collaborator" plan code to stripe lookup keys', function () {
       const planCode = 'collaborator'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('standard_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('standard_monthly_jun2025_eur')
     })
 
     it('should map "collaborator_free_trial_7_days" plan code to stripe lookup keys', function () {
       const planCode = 'collaborator_free_trial_7_days'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('standard_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('standard_monthly_jun2025_eur')
     })
 
     it('should map "collaborator-annual" plan code to stripe lookup keys', function () {
       const planCode = 'collaborator-annual'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('standard_annual')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('standard_annual_jun2025_eur')
     })
 
     it('should map "professional" plan code to stripe lookup keys', function () {
       const planCode = 'professional'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('professional_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('professional_monthly_jun2025_eur')
     })
 
     it('should map "professional_free_trial_7_days" plan code to stripe lookup keys', function () {
       const planCode = 'professional_free_trial_7_days'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('professional_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('professional_monthly_jun2025_eur')
     })
 
     it('should map "professional-annual" plan code to stripe lookup keys', function () {
       const planCode = 'professional-annual'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('professional_annual')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('professional_annual_jun2025_eur')
     })
 
     it('should map "student" plan code to stripe lookup keys', function () {
       const planCode = 'student'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('student_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('student_monthly_jun2025_eur')
     })
 
     it('shoult map "student_free_trial_7_days" plan code to stripe lookup keys', function () {
       const planCode = 'student_free_trial_7_days'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('student_monthly')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('student_monthly_jun2025_eur')
     })
 
     it('should map "student-annual" plan code to stripe lookup keys', function () {
       const planCode = 'student-annual'
-      const lookupKey =
-        this.PlansLocator.mapRecurlyPlanCodeToStripeLookupKey(planCode)
-      expect(lookupKey).to.equal('student_annual')
+      const currency = 'eur'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        planCode,
+        currency
+      )
+      expect(lookupKey).to.equal('student_annual_jun2025_eur')
+    })
+
+    it('should return null for unknown add-on codes', function () {
+      const billingCycleInterval = 'month'
+      const addOnCode = 'unknown_addon'
+      const currency = 'gbp'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        addOnCode,
+        currency,
+        billingCycleInterval
+      )
+      expect(lookupKey).to.equal(null)
+    })
+
+    it('should handle missing input', function () {
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        undefined,
+        undefined
+      )
+      expect(lookupKey).to.equal(null)
+    })
+
+    it('returns the key for a monthly AI assist add-on', function () {
+      const billingCycleInterval = 'month'
+      const addOnCode = this.AI_ADD_ON_CODE
+      const currency = 'gbp'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        addOnCode,
+        currency,
+        billingCycleInterval
+      )
+      expect(lookupKey).to.equal('assistant_monthly_jun2025_gbp')
+    })
+
+    it('returns the key for an annual AI assist add-on', function () {
+      const billingCycleInterval = 'year'
+      const addOnCode = this.AI_ADD_ON_CODE
+      const currency = 'gbp'
+      const lookupKey = this.PlansLocator.buildStripeLookupKey(
+        addOnCode,
+        currency,
+        billingCycleInterval
+      )
+      expect(lookupKey).to.equal('assistant_annual_jun2025_gbp')
     })
   })
 
@@ -120,7 +192,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'collaborator'
         )
-      expect(planType).to.equal('standard')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('monthly')
     })
 
@@ -129,7 +201,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'collaborator_free_trial_7_days'
         )
-      expect(planType).to.equal('standard')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('monthly')
     })
 
@@ -138,7 +210,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'collaborator-annual'
         )
-      expect(planType).to.equal('standard')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('annual')
     })
 
@@ -147,7 +219,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'professional'
         )
-      expect(planType).to.equal('professional')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('monthly')
     })
 
@@ -156,7 +228,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'professional_free_trial_7_days'
         )
-      expect(planType).to.equal('professional')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('monthly')
     })
 
@@ -165,7 +237,7 @@ describe('PlansLocator', function () {
         this.PlansLocator.getPlanTypeAndPeriodFromRecurlyPlanCode(
           'professional-annual'
         )
-      expect(planType).to.equal('professional')
+      expect(planType).to.equal('individual')
       expect(period).to.equal('annual')
     })
 
@@ -194,4 +266,39 @@ describe('PlansLocator', function () {
       expect(period).to.equal('annual')
     })
   })
+
+  describe('convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded', function () {
+    it('returns original plan name for non-group plan codes', function () {
+      expect(
+        this.PlansLocator.convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded(
+          'professional'
+        )
+      ).to.deep.equal({
+        planCode: 'professional',
+        quantity: 1,
+      })
+    })
+
+    it('converts Recurly enterprise group plan codes to Stripe group plan codes', function () {
+      expect(
+        this.PlansLocator.convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded(
+          'group_collaborator_10_enterprise'
+        )
+      ).to.deep.equal({
+        planCode: 'group_collaborator',
+        quantity: 10,
+      })
+    })
+
+    it('converts Recurly educational group plan codes to Stripe group plan codes', function () {
+      expect(
+        this.PlansLocator.convertLegacyGroupPlanCodeToConsolidatedGroupPlanCodeIfNeeded(
+          'group_professional_10_educational'
+        )
+      ).to.deep.equal({
+        planCode: 'group_professional_educational',
+        quantity: 10,
+      })
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/RecurlyClientTests.js b/services/web/test/unit/src/Subscription/RecurlyClientTests.js
index 91c16b1ac1..6194e35a5f 100644
--- a/services/web/test/unit/src/Subscription/RecurlyClientTests.js
+++ b/services/web/test/unit/src/Subscription/RecurlyClientTests.js
@@ -3,10 +3,13 @@ const { expect } = require('chai')
 const recurly = require('recurly')
 const SandboxedModule = require('sandboxed-module')
 const {
-  RecurlySubscription,
-  RecurlySubscriptionChangeRequest,
-  RecurlySubscriptionAddOnUpdate,
-} = require('../../../../app/src/Features/Subscription/RecurlyEntities')
+  PaymentProviderSubscription,
+  PaymentProviderSubscriptionChangeRequest,
+  PaymentProviderSubscriptionUpdateRequest,
+  PaymentProviderSubscriptionAddOnUpdate,
+  PaymentProviderAccount,
+  PaymentProviderCoupon,
+} = require('../../../../app/src/Features/Subscription/PaymentProviderEntities')
 
 const MODULE_PATH = '../../../../app/src/Features/Subscription/RecurlyClient'
 
@@ -17,6 +20,7 @@ describe('RecurlyClient', function () {
         recurly: {
           apiKey: 'nonsense',
           privateKey: 'private_nonsense',
+          subdomain: 'test',
         },
       },
       plans: [],
@@ -26,7 +30,10 @@ describe('RecurlyClient', function () {
     this.user = { _id: '123456', email: 'joe@example.com', first_name: 'Joe' }
     this.subscriptionChange = { id: 'subscription-change-123' }
     this.recurlyAccount = new recurly.Account()
-    Object.assign(this.recurlyAccount, { code: this.user._id })
+    Object.assign(this.recurlyAccount, {
+      code: this.user._id,
+      email: this.user.email,
+    })
 
     this.subscriptionAddOn = {
       code: 'addon-code',
@@ -36,7 +43,7 @@ describe('RecurlyClient', function () {
       preTaxTotal: 2,
     }
 
-    this.subscription = new RecurlySubscription({
+    this.subscription = new PaymentProviderSubscription({
       id: 'subscription-id',
       userId: 'user-id',
       currency: 'EUR',
@@ -51,6 +58,9 @@ describe('RecurlyClient', function () {
       periodStart: new Date(),
       periodEnd: new Date(),
       collectionMethod: 'automatic',
+      netTerms: 0,
+      poNumber: '',
+      termsAndConditions: '',
     })
 
     this.recurlySubscription = {
@@ -81,6 +91,9 @@ describe('RecurlyClient', function () {
       currentPeriodStartedAt: this.subscription.periodStart,
       currentPeriodEndsAt: this.subscription.periodEnd,
       collectionMethod: this.subscription.collectionMethod,
+      netTerms: this.subscription.netTerms,
+      poNumber: this.subscription.poNumber,
+      termsAndConditions: this.subscription.termsAndConditions,
     }
 
     this.recurlySubscriptionChange = new recurly.SubscriptionChange()
@@ -101,6 +114,7 @@ describe('RecurlyClient', function () {
       getAccount: sinon.stub(),
       getBillingInfo: sinon.stub(),
       listAccountSubscriptions: sinon.stub(),
+      listActiveCouponRedemptions: sinon.stub(),
       previewSubscriptionChange: sinon.stub(),
     }
     this.recurly = {
@@ -147,20 +161,24 @@ describe('RecurlyClient', function () {
   describe('getAccountForUserId', function () {
     it('should return an Account if one exists', async function () {
       this.client.getAccount = sinon.stub().resolves(this.recurlyAccount)
-      await expect(
-        this.RecurlyClient.promises.getAccountForUserId(this.user._id)
+      const account = await this.RecurlyClient.promises.getAccountForUserId(
+        this.user._id
       )
-        .to.eventually.be.an.instanceOf(recurly.Account)
-        .that.has.property('code', this.user._id)
+      const expectedAccount = new PaymentProviderAccount({
+        code: this.user._id,
+        email: this.user.email,
+        hasPastDueInvoice: false,
+      })
+      expect(account).to.deep.equal(expectedAccount)
     })
 
-    it('should return nothing if no account found', async function () {
+    it('should return null if no account found', async function () {
       this.client.getAccount = sinon
         .stub()
         .throws(new recurly.errors.NotFoundError())
-      expect(
-        this.RecurlyClient.promises.getAccountForUserId('nonsense')
-      ).to.eventually.equal(undefined)
+      const account =
+        await this.RecurlyClient.promises.getAccountForUserId('nonsense')
+      expect(account).to.equal(null)
     })
 
     it('should re-throw caught errors', async function () {
@@ -189,6 +207,102 @@ describe('RecurlyClient', function () {
     })
   })
 
+  describe('getActiveCouponsForUserId', function () {
+    it('should return an empty array if no coupons returned', async function () {
+      this.client.listActiveCouponRedemptions.returns({
+        each: async function* () {},
+      })
+      const coupons =
+        await this.RecurlyClient.promises.getActiveCouponsForUserId('some-user')
+      expect(coupons).to.deep.equal([])
+    })
+
+    it('should return a coupons returned by recurly', async function () {
+      const recurlyCoupon = {
+        coupon: {
+          code: 'coupon-code',
+          name: 'Coupon Name',
+          hostedPageDescription: 'hosted page description',
+          invoiceDescription: 'invoice description',
+        },
+      }
+      this.client.listActiveCouponRedemptions.returns({
+        each: async function* () {
+          yield recurlyCoupon
+        },
+      })
+      const coupons =
+        await this.RecurlyClient.promises.getActiveCouponsForUserId('some-user')
+      const expectedCoupons = [
+        new PaymentProviderCoupon({
+          code: 'coupon-code',
+          name: 'Coupon Name',
+          description: 'hosted page description',
+        }),
+      ]
+      expect(coupons).to.deep.equal(expectedCoupons)
+    })
+
+    it('should not throw for Recurly not found error', async function () {
+      this.client.listActiveCouponRedemptions = sinon
+        .stub()
+        .throws(new recurly.errors.NotFoundError())
+      const coupons =
+        await this.RecurlyClient.promises.getActiveCouponsForUserId('some-user')
+      expect(coupons).to.deep.equal([])
+    })
+
+    it('should throw any other API errors', async function () {
+      this.client.listActiveCouponRedemptions = sinon.stub().throws()
+      await expect(
+        this.RecurlyClient.promises.getActiveCouponsForUserId('some-user')
+      ).to.eventually.be.rejectedWith(Error)
+    })
+  })
+
+  describe('getCustomerManagementLink', function () {
+    it('should throw if recurly token is not returned', async function () {
+      this.client.getAccount.resolves({})
+      await expect(
+        this.RecurlyClient.promises.getCustomerManagementLink(
+          '12345',
+          'account-management',
+          'en-US'
+        )
+      ).to.be.rejectedWith('recurly account does not have hosted login token')
+    })
+
+    it('should generate the correct account management url', async function () {
+      this.client.getAccount.resolves({
+        hostedLoginToken: '987654321',
+      })
+      const result =
+        await this.RecurlyClient.promises.getCustomerManagementLink(
+          '12345',
+          'account-management',
+          'en-US'
+        )
+
+      expect(result).to.equal('https://test.recurly.com/account/987654321')
+    })
+
+    it('should generate the correct billing details url', async function () {
+      this.client.getAccount.resolves({
+        hostedLoginToken: '987654321',
+      })
+      const result =
+        await this.RecurlyClient.promises.getCustomerManagementLink(
+          '12345',
+          'billing-details',
+          'en-US'
+        )
+
+      expect(result).to.equal(
+        'https://test.recurly.com/account/billing_info/edit?ht=987654321'
+      )
+    })
+  })
+
   describe('getSubscription', function () {
     it('should return the subscription found by recurly', async function () {
       this.client.getSubscription = sinon
@@ -266,7 +380,7 @@ describe('RecurlyClient', function () {
 
     it('handles plan changes', async function () {
       await this.RecurlyClient.promises.applySubscriptionChangeRequest(
-        new RecurlySubscriptionChangeRequest({
+        new PaymentProviderSubscriptionChangeRequest({
           subscription: this.subscription,
           timeframe: 'now',
           planCode: 'new-plan',
@@ -280,11 +394,11 @@ describe('RecurlyClient', function () {
 
     it('handles add-on changes', async function () {
       await this.RecurlyClient.promises.applySubscriptionChangeRequest(
-        new RecurlySubscriptionChangeRequest({
+        new PaymentProviderSubscriptionChangeRequest({
           subscription: this.subscription,
           timeframe: 'now',
           addOnUpdates: [
-            new RecurlySubscriptionAddOnUpdate({
+            new PaymentProviderSubscriptionAddOnUpdate({
               code: 'new-add-on',
               quantity: 2,
               unitPrice: 8.99,
@@ -337,6 +451,37 @@ describe('RecurlyClient', function () {
     })
   })
 
+  describe('updateSubscriptionDetails', function () {
+    beforeEach(function () {
+      this.client.updateSubscription = sinon
+        .stub()
+        .resolves({ id: this.subscription.id })
+    })
+
+    it('handles subscription update', async function () {
+      await this.RecurlyClient.promises.updateSubscriptionDetails(
+        new PaymentProviderSubscriptionUpdateRequest({
+          subscription: this.subscription,
+          poNumber: '012345',
+          termsAndConditions: 'T&C',
+        })
+      )
+      expect(this.client.updateSubscription).to.be.calledWith(
+        'uuid-subscription-id',
+        { poNumber: '012345', termsAndConditions: 'T&C' }
+      )
+    })
+
+    it('should throw any API errors', async function () {
+      this.client.updateSubscription = sinon.stub().throws()
+      await expect(
+        this.RecurlyClient.promises.updateSubscriptionDetails({
+          subscription: this.subscription,
+        })
+      ).to.eventually.be.rejectedWith(Error)
+    })
+  })
+
   describe('removeSubscriptionChange', function () {
     beforeEach(function () {
       this.client.removeSubscriptionChange = sinon.stub().resolves()
@@ -451,7 +596,7 @@ describe('RecurlyClient', function () {
         })
         const { immediateCharge } =
           await this.RecurlyClient.promises.previewSubscriptionChange(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               planCode: 'new-plan',
@@ -483,7 +628,7 @@ describe('RecurlyClient', function () {
         })
         const { immediateCharge } =
           await this.RecurlyClient.promises.previewSubscriptionChange(
-            new RecurlySubscriptionChangeRequest({
+            new PaymentProviderSubscriptionChangeRequest({
               subscription: this.subscription,
               timeframe: 'now',
               planCode: 'new-plan',
@@ -507,7 +652,7 @@ describe('RecurlyClient', function () {
         .throws(new ValidationError())
       await expect(
         this.RecurlyClient.promises.previewSubscriptionChange(
-          new RecurlySubscriptionChangeRequest({
+          new PaymentProviderSubscriptionChangeRequest({
             subscription: this.subscription,
             timeframe: 'now',
             planCode: 'new-plan',
@@ -520,7 +665,7 @@ describe('RecurlyClient', function () {
       this.client.previewSubscriptionChange = sinon.stub().throws(new Error())
       await expect(
         this.RecurlyClient.promises.previewSubscriptionChange(
-          new RecurlySubscriptionChangeRequest({
+          new PaymentProviderSubscriptionChangeRequest({
             subscription: this.subscription,
             timeframe: 'now',
             planCode: 'new-plan',
@@ -547,4 +692,20 @@ describe('RecurlyClient', function () {
       ).to.be.rejectedWith(Error)
     })
   })
+
+  describe('terminateSubscriptionByUuid', function () {
+    it('should attempt to terminate the subscription', async function () {
+      this.client.terminateSubscription = sinon
+        .stub()
+        .resolves(this.recurlySubscription)
+      const subscription =
+        await this.RecurlyClient.promises.terminateSubscriptionByUuid(
+          this.subscription.uuid
+        )
+      expect(subscription).to.deep.equal(this.recurlySubscription)
+      expect(this.client.terminateSubscription).to.be.calledWith(
+        'uuid-' + this.subscription.uuid
+      )
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/RecurlyEventHandlerTests.js b/services/web/test/unit/src/Subscription/RecurlyEventHandlerTests.js
index 4928f81e0d..5620d0f106 100644
--- a/services/web/test/unit/src/Subscription/RecurlyEventHandlerTests.js
+++ b/services/web/test/unit/src/Subscription/RecurlyEventHandlerTests.js
@@ -41,14 +41,15 @@ describe('RecurlyEventHandler', function () {
             getAssignmentForUser: sinon.stub().resolves({
               variant: 'default',
             }),
+            hasUserBeenAssignedToVariant: sinon.stub().resolves(false),
           },
         }),
       },
     })
   })
 
-  it('with new_subscription_notification - free trial', function () {
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+  it('with new_subscription_notification - free trial', async function () {
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'new_subscription_notification',
       this.eventData
     )
@@ -62,6 +63,49 @@ describe('RecurlyEventHandler', function () {
         is_trial: true,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
+      }
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-plan-code',
+      this.planCode
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-state',
+      'active'
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-is-trial',
+      true
+    )
+  })
+
+  it('with new_subscription_notification - free trial with customerio integration enabled', async function () {
+    this.SplitTestHandler.promises.hasUserBeenAssignedToVariant.resolves(true)
+
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+      'new_subscription_notification',
+      this.eventData
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.recordEventForUserInBackground,
+      this.userId,
+      'subscription-started',
+      {
+        plan_code: this.planCode,
+        quantity: 1,
+        is_trial: true,
+        has_ai_add_on: false,
+        subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': true,
       }
     )
     sinon.assert.calledWith(
@@ -93,7 +137,7 @@ describe('RecurlyEventHandler', function () {
     sinon.assert.called(this.SubscriptionEmailHandler.sendTrialOnboardingEmail)
   })
 
-  it('with new_subscription_notification - no free trial', function () {
+  it('with new_subscription_notification - no free trial', async function () {
     this.eventData.subscription.current_period_started_at = new Date(
       '2021-02-10 12:34:56'
     )
@@ -102,7 +146,7 @@ describe('RecurlyEventHandler', function () {
     )
     this.eventData.subscription.quantity = 3
 
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'new_subscription_notification',
       this.eventData
     )
@@ -116,6 +160,8 @@ describe('RecurlyEventHandler', function () {
         is_trial: false,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
       }
     )
     sinon.assert.calledWith(
@@ -132,10 +178,10 @@ describe('RecurlyEventHandler', function () {
     )
   })
 
-  it('with updated_subscription_notification', function () {
+  it('with updated_subscription_notification', async function () {
     this.planCode = 'new-plan-code'
     this.eventData.subscription.plan.plan_code = this.planCode
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'updated_subscription_notification',
       this.eventData
     )
@@ -149,6 +195,51 @@ describe('RecurlyEventHandler', function () {
         is_trial: true,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
+      }
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-plan-code',
+      this.planCode
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-state',
+      'active'
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.setUserPropertyForUserInBackground,
+      this.userId,
+      'subscription-is-trial',
+      true
+    )
+  })
+
+  it('with updated_subscription_notification with customerio integration enabled', async function () {
+    this.SplitTestHandler.promises.hasUserBeenAssignedToVariant.resolves(true)
+    this.planCode = 'new-plan-code'
+    this.eventData.subscription.plan.plan_code = this.planCode
+
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+      'updated_subscription_notification',
+      this.eventData
+    )
+    sinon.assert.calledWith(
+      this.AnalyticsManager.recordEventForUserInBackground,
+      this.userId,
+      'subscription-updated',
+      {
+        plan_code: this.planCode,
+        quantity: 1,
+        is_trial: true,
+        has_ai_add_on: false,
+        subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': true,
       }
     )
     sinon.assert.calledWith(
@@ -187,6 +278,8 @@ describe('RecurlyEventHandler', function () {
         is_trial: true,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
       }
     )
     sinon.assert.calledWith(
@@ -203,9 +296,9 @@ describe('RecurlyEventHandler', function () {
     )
   })
 
-  it('with expired_subscription_notification', function () {
+  it('with expired_subscription_notification', async function () {
     this.eventData.subscription.state = 'expired'
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'expired_subscription_notification',
       this.eventData
     )
@@ -219,6 +312,8 @@ describe('RecurlyEventHandler', function () {
         is_trial: true,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
       }
     )
     sinon.assert.calledWith(
@@ -241,8 +336,8 @@ describe('RecurlyEventHandler', function () {
     )
   })
 
-  it('with renewed_subscription_notification', function () {
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+  it('with renewed_subscription_notification', async function () {
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'renewed_subscription_notification',
       this.eventData
     )
@@ -256,12 +351,14 @@ describe('RecurlyEventHandler', function () {
         is_trial: true,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
       }
     )
   })
 
-  it('with reactivated_account_notification', function () {
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+  it('with reactivated_account_notification', async function () {
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'reactivated_account_notification',
       this.eventData
     )
@@ -274,11 +371,13 @@ describe('RecurlyEventHandler', function () {
         quantity: 1,
         has_ai_add_on: false,
         subscriptionId: this.eventData.subscription.uuid,
+        payment_provider: 'recurly',
+        'customerio-integration': false,
       }
     )
   })
 
-  it('with paid_charge_invoice_notification', function () {
+  it('with paid_charge_invoice_notification', async function () {
     const invoice = {
       invoice_number: 1234,
       currency: 'USD',
@@ -291,7 +390,7 @@ describe('RecurlyEventHandler', function () {
       collection_method: 'automatic',
       subscription_ids: ['abcd1234', 'defa3214'],
     }
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'paid_charge_invoice_notification',
       {
         account: {
@@ -313,12 +412,13 @@ describe('RecurlyEventHandler', function () {
         collectionMethod: invoice.collection_method,
         subscriptionId1: invoice.subscription_ids[0],
         subscriptionId2: invoice.subscription_ids[1],
+        payment_provider: 'recurly',
       }
     )
   })
 
-  it('with paid_charge_invoice_notification and total_in_cents 0', function () {
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+  it('with paid_charge_invoice_notification and total_in_cents 0', async function () {
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'paid_charge_invoice_notification',
       {
         account: {
@@ -333,8 +433,8 @@ describe('RecurlyEventHandler', function () {
     sinon.assert.notCalled(this.AnalyticsManager.recordEventForUserInBackground)
   })
 
-  it('with closed_invoice_notification', function () {
-    this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
+  it('with closed_invoice_notification', async function () {
+    await this.RecurlyEventHandler.sendRecurlyAnalyticsEvent(
       'closed_invoice_notification',
       {
         account: {
diff --git a/services/web/test/unit/src/Subscription/RecurlyWrapperTests.js b/services/web/test/unit/src/Subscription/RecurlyWrapperTests.js
index ac353cddd7..6f768e680e 100644
--- a/services/web/test/unit/src/Subscription/RecurlyWrapperTests.js
+++ b/services/web/test/unit/src/Subscription/RecurlyWrapperTests.js
@@ -1,4 +1,4 @@
-const { expect } = require('chai')
+const { assert, expect } = require('chai')
 const sinon = require('sinon')
 const modulePath = '../../../../app/src/Features/Subscription/RecurlyWrapper'
 const SandboxedModule = require('sandboxed-module')
@@ -107,6 +107,7 @@ const mockApiRequest = function (options) {
 
 describe('RecurlyWrapper', function () {
   beforeEach(function () {
+    tk.freeze(Date.now()) // freeze the time for these tests
     this.settings = {
       plans: [
         {
@@ -134,7 +135,6 @@ describe('RecurlyWrapper', function () {
       fetchStringWithResponse: sinon.stub(),
       RequestFailedError,
     }
-    tk.freeze(Date.now()) // freeze the time for these tests
     this.RecurlyWrapper = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/settings': this.settings,
@@ -294,7 +294,7 @@ describe('RecurlyWrapper', function () {
   })
 
   describe('updateAccountEmailAddress, with invalid XML', function () {
-    beforeEach(async function (done) {
+    beforeEach(async function () {
       this.recurlyAccountId = 'account-id-123'
       this.newEmail = '\uD800@example.com'
       this.apiRequest = sinon
@@ -307,22 +307,24 @@ describe('RecurlyWrapper', function () {
             body: fixtures['accounts/104'],
           }
         })
-      done()
     })
 
     afterEach(function () {
       this.RecurlyWrapper.promises.apiRequest.restore()
     })
 
-    it('should produce an error', function (done) {
-      this.RecurlyWrapper.promises
-        .updateAccountEmailAddress(this.recurlyAccountId, this.newEmail)
-        .catch(error => {
-          expect(error).to.exist
-          expect(error.message.startsWith('Invalid character')).to.equal(true)
-          expect(this.apiRequest.called).to.equal(false)
-          done()
-        })
+    it('should produce an error', async function () {
+      try {
+        await this.RecurlyWrapper.promises.updateAccountEmailAddress(
+          this.recurlyAccountId,
+          this.newEmail
+        )
+        assert.fail('Expected error not thrown')
+      } catch (error) {
+        expect(error).to.have.property('message')
+        expect(error.message.startsWith('Invalid character')).to.be.true
+        expect(this.apiRequest.called).to.equal(false)
+      }
     })
   })
 
@@ -702,19 +704,27 @@ describe('RecurlyWrapper', function () {
         })
       })
 
-      it('should produce an error', function (done) {
-        this.call().catch(err => {
-          expect(err).to.be.instanceof(
-            SubscriptionErrors.RecurlyTransactionError
-          )
-          expect(err.info.public.message).to.be.equal(
-            'Your card must be authenticated with 3D Secure before continuing.'
-          )
-          expect(err.info.public.threeDSecureActionTokenId).to.be.equal(
-            'mock_three_d_secure_action_token'
-          )
-          done()
-        })
+      it('should produce an error', async function () {
+        const promise = this.call()
+        let error
+
+        try {
+          await promise
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.be.instanceOf(
+          SubscriptionErrors.RecurlyTransactionError
+        )
+        expect(error).to.have.nested.property(
+          'info.public.message',
+          'Your card must be authenticated with 3D Secure before continuing.'
+        )
+        expect(error).to.have.nested.property(
+          'info.public.threeDSecureActionTokenId',
+          'mock_three_d_secure_action_token'
+        )
       })
     })
 
diff --git a/services/web/test/unit/src/Subscription/SubscriptionControllerTests.js b/services/web/test/unit/src/Subscription/SubscriptionControllerTests.js
index ef4b055dc3..24ce1bce8b 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionControllerTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionControllerTests.js
@@ -6,6 +6,10 @@ const MockResponse = require('../helpers/MockResponse')
 const modulePath =
   '../../../../app/src/Features/Subscription/SubscriptionController'
 const SubscriptionErrors = require('../../../../app/src/Features/Subscription/Errors')
+const SubscriptionHelper = require('../../../../app/src/Features/Subscription/SubscriptionHelper')
+const {
+  AI_ADD_ON_CODE,
+} = require('../../../../app/src/Features/Subscription/AiHelper')
 
 const mockSubscriptions = {
   'subscription-123-active': {
@@ -58,6 +62,7 @@ describe('SubscriptionController', function () {
         syncSubscription: sinon.stub().resolves(),
         attemptPaypalInvoiceCollection: sinon.stub().resolves(),
         startFreeTrial: sinon.stub().resolves(),
+        purchaseAddon: sinon.stub().resolves(),
       },
     }
 
@@ -77,7 +82,6 @@ describe('SubscriptionController', function () {
       buildPlansList: sinon.stub(),
       promises: {
         buildUsersSubscriptionViewModel: sinon.stub().resolves({}),
-        getBestSubscription: sinon.stub().resolves({}),
       },
       buildPlansListForSubscriptionDash: sinon
         .stub()
@@ -127,6 +131,9 @@ describe('SubscriptionController', function () {
       getUser: sinon.stub().callsArgWith(2, null, this.user),
       promises: {
         getUser: sinon.stub().resolves(this.user),
+        getWritefullData: sinon
+          .stub()
+          .resolves({ isPremium: false, premiumSource: null }),
       },
     }
     this.SplitTestV2Hander = {
@@ -143,19 +150,25 @@ describe('SubscriptionController', function () {
         '../SplitTests/SplitTestHandler': this.SplitTestV2Hander,
         '../Authentication/SessionManager': this.SessionManager,
         './SubscriptionHandler': this.SubscriptionHandler,
-        './SubscriptionHelper': this.SubscriptionHelper,
+        './SubscriptionHelper': SubscriptionHelper,
         './SubscriptionViewModelBuilder': this.SubscriptionViewModelBuilder,
         './LimitationsManager': this.LimitationsManager,
         '../../infrastructure/GeoIpLookup': this.GeoIpLookup,
         '@overleaf/settings': this.settings,
         '../User/UserGetter': this.UserGetter,
         './RecurlyWrapper': (this.RecurlyWrapper = {
-          updateAccountEmailAddress: sinon.stub().yields(),
+          promises: {
+            updateAccountEmailAddress: sinon.stub().resolves(),
+          },
         }),
         './RecurlyEventHandler': {
           sendRecurlyAnalyticsEvent: sinon.stub().resolves(),
         },
-        './FeaturesUpdater': (this.FeaturesUpdater = {}),
+        './FeaturesUpdater': (this.FeaturesUpdater = {
+          promises: {
+            refreshFeatures: sinon.stub().resolves({ features: {} }),
+          },
+        }),
         './GroupPlansData': (this.GroupPlansData = {}),
         './V1SubscriptionManager': (this.V1SubscriptionManager = {}),
         '../Errors/HttpErrorHandler': (this.HttpErrorHandler = {
@@ -182,6 +195,11 @@ describe('SubscriptionController', function () {
         '../../util/currency': (this.currency = {
           formatCurrency: sinon.stub(),
         }),
+        '../../models/User': {
+          User: {
+            findById: sinon.stub().resolves(this.user),
+          },
+        },
       },
     })
 
@@ -217,7 +235,10 @@ describe('SubscriptionController', function () {
           title: 'thank_you',
           personalSubscription: 'foo',
           postCheckoutRedirect: undefined,
-          user: this.user,
+          user: {
+            _id: this.user._id,
+            features: this.user.features,
+          },
         })
         done()
       }
@@ -294,31 +315,50 @@ describe('SubscriptionController', function () {
   })
 
   describe('updateAccountEmailAddress via put', function () {
-    it('should send the user and subscriptionId to RecurlyWrapper', function () {
-      this.res.sendStatus = sinon.spy()
-      this.SubscriptionController.updateAccountEmailAddress(this.req, this.res)
-      this.RecurlyWrapper.updateAccountEmailAddress
-        .calledWith(this.user._id, this.user.email)
-        .should.equal(true)
+    beforeEach(function () {
+      this.req.body = {
+        account_email: 'current_account_email@overleaf.com',
+      }
     })
 
-    it('should respond with 200', function () {
+    it('should send the user and subscriptionId to "updateAccountEmailAddress" hooks', async function () {
       this.res.sendStatus = sinon.spy()
-      this.SubscriptionController.updateAccountEmailAddress(this.req, this.res)
+
+      await this.SubscriptionController.updateAccountEmailAddress(
+        this.req,
+        this.res
+      )
+
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'updateAccountEmailAddress',
+        this.user._id,
+        this.user.email
+      )
+    })
+
+    it('should respond with 200', async function () {
+      this.res.sendStatus = sinon.spy()
+      await this.SubscriptionController.updateAccountEmailAddress(
+        this.req,
+        this.res
+      )
       this.res.sendStatus.calledWith(200).should.equal(true)
     })
 
-    it('should send the error to the next handler when updating recurly account email fails', function (done) {
-      this.RecurlyWrapper.updateAccountEmailAddress.yields(new Error())
+    it('should send the error to the next handler when updating recurly account email fails', async function () {
+      this.Modules.promises.hooks.fire
+        .withArgs('updateAccountEmailAddress', this.user._id, this.user.email)
+        .rejects(new Error())
+
       this.next = sinon.spy(error => {
-        expect(error).instanceOf(Error)
-        done()
+        expect(error).to.be.instanceOf(Error)
       })
-      this.SubscriptionController.updateAccountEmailAddress(
+      await this.SubscriptionController.updateAccountEmailAddress(
         this.req,
         this.res,
         this.next
       )
+      expect(this.next.calledOnce).to.be.true
     })
   })
 
@@ -451,28 +491,39 @@ describe('SubscriptionController', function () {
   })
 
   describe('cancelSubscription', function () {
-    beforeEach(function (done) {
-      this.res = {
-        redirect() {
-          done()
-        },
-      }
-      sinon.spy(this.res, 'redirect')
-      this.SubscriptionController.cancelSubscription(this.req, this.res)
-    })
-
-    it('should tell the handler to cancel this user', function (done) {
-      this.SubscriptionHandler.cancelSubscription
+    it('should tell the handler to cancel this user', async function () {
+      this.next = sinon.stub()
+      await this.SubscriptionController.cancelSubscription(
+        this.req,
+        this.res,
+        this.next
+      )
+      this.SubscriptionHandler.promises.cancelSubscription
         .calledWith(this.user)
         .should.equal(true)
-      done()
     })
 
-    it('should redurect to the subscription page', function (done) {
-      this.res.redirect
-        .calledWith('/user/subscription/canceled')
-        .should.equal(true)
-      done()
+    it('should return a 200 on success', async function () {
+      this.next = sinon.stub()
+      await this.SubscriptionController.cancelSubscription(
+        this.req,
+        this.res,
+        this.next
+      )
+      expect(this.res.statusCode).to.equal(200)
+    })
+
+    it('should call next with error', async function () {
+      this.SubscriptionHandler.promises.cancelSubscription.rejects(
+        new Error('cancel error')
+      )
+      this.next = sinon.stub()
+      await this.SubscriptionController.cancelSubscription(
+        this.req,
+        this.res,
+        this.next
+      )
+      this.next.calledWith(sinon.match.instanceOf(Error)).should.equal(true)
     })
   })
 
@@ -588,4 +639,109 @@ describe('SubscriptionController', function () {
       })
     })
   })
+
+  describe('purchaseAddon', function () {
+    beforeEach(function () {
+      this.SessionManager.getSessionUser.returns(this.user) // Make sure getSessionUser returns the user
+      this.next = sinon.stub()
+      this.req.params = { addOnCode: AI_ADD_ON_CODE } // Mock add-on code
+    })
+
+    it('should return 200 on successful purchase of AI add-on', async function () {
+      await this.SubscriptionController.purchaseAddon(
+        this.req,
+        this.res,
+        this.next
+      )
+      this.res.sendStatus = sinon.spy()
+
+      await this.SubscriptionController.purchaseAddon(
+        this.req,
+        this.res,
+        this.next
+      )
+
+      expect(this.SubscriptionHandler.promises.purchaseAddon).to.have.been
+        .called
+      expect(
+        this.SubscriptionHandler.promises.purchaseAddon
+      ).to.have.been.calledWith(this.user._id, AI_ADD_ON_CODE, 1)
+      expect(
+        this.FeaturesUpdater.promises.refreshFeatures
+      ).to.have.been.calledWith(this.user._id, 'add-on-purchase')
+      expect(this.res.sendStatus).to.have.been.calledWith(200)
+      expect(this.logger.debug).to.have.been.calledWith(
+        { userId: this.user._id, addOnCode: AI_ADD_ON_CODE },
+        'purchasing add-ons'
+      )
+    })
+
+    it('should return 404 if the add-on code is not AI_ADD_ON_CODE', async function () {
+      this.req.params = { addOnCode: 'some-other-addon' }
+      this.res.sendStatus = sinon.spy()
+
+      await this.SubscriptionController.purchaseAddon(
+        this.req,
+        this.res,
+        this.next
+      )
+
+      expect(this.SubscriptionHandler.promises.purchaseAddon).to.not.have.been
+        .called
+      expect(this.FeaturesUpdater.promises.refreshFeatures).to.not.have.been
+        .called
+      expect(this.res.sendStatus).to.have.been.calledWith(404)
+    })
+
+    it('should handle DuplicateAddOnError and send badRequest while sending 200', async function () {
+      this.req.params.addOnCode = AI_ADD_ON_CODE
+      this.SubscriptionHandler.promises.purchaseAddon.rejects(
+        new SubscriptionErrors.DuplicateAddOnError()
+      )
+
+      await this.SubscriptionController.purchaseAddon(
+        this.req,
+        this.res,
+        this.next
+      )
+
+      expect(this.HttpErrorHandler.badRequest).to.have.been.calledWith(
+        this.req,
+        this.res,
+        'Your subscription already includes this add-on',
+        { addon: AI_ADD_ON_CODE }
+      )
+      expect(
+        this.FeaturesUpdater.promises.refreshFeatures
+      ).to.have.been.calledWith(this.user._id, 'add-on-purchase')
+      expect(this.res.sendStatus).to.have.been.calledWith(200)
+    })
+
+    it('should handle PaymentActionRequiredError and return 402 with details', async function () {
+      this.req.params.addOnCode = AI_ADD_ON_CODE
+      const paymentError = new SubscriptionErrors.PaymentActionRequiredError({
+        clientSecret: 'secret123',
+        publicKey: 'pubkey456',
+      })
+      this.SubscriptionHandler.promises.purchaseAddon.rejects(paymentError)
+
+      await this.SubscriptionController.purchaseAddon(
+        this.req,
+        this.res,
+        this.next
+      )
+
+      this.res.status.calledWith(402).should.equal(true)
+      this.res.json
+        .calledWith({
+          message: 'Payment action required',
+          clientSecret: 'secret123',
+          publicKey: 'pubkey456',
+        })
+        .should.equal(true)
+
+      expect(this.FeaturesUpdater.promises.refreshFeatures).to.not.have.been
+        .called
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionFormattersTests.js b/services/web/test/unit/src/Subscription/SubscriptionFormattersTests.js
index 972f6d8961..0ee781d54f 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionFormattersTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionFormattersTests.js
@@ -3,298 +3,30 @@ const SubscriptionFormatters = require('../../../../app/src/Features/Subscriptio
 
 const { expect } = chai
 
-/*
-  Users can select any language we support, regardless of the country where they are located.
-  Which mean that any combination of "supported language"-"supported currency" can be displayed
-  on the user's screen.
-
-  Users located in the USA visiting https://fr.overleaf.com/user/subscription/plans
-  should see amounts in USD (because of their IP address),
-  but with French text, number formatting and currency formats (because of language choice).
-  (e.g. 1 000,00 $)
-
-  Users located in the France visiting https://www.overleaf.com/user/subscription/plans
-  should see amounts in EUR (because of their IP address),
-  but with English text, number formatting and currency formats (because of language choice).
-  (e.g. €1,000.00)
- */
-
-describe('SubscriptionFormatters.formatPrice', function () {
-  describe('en', function () {
-    const format = currency => priceInCents =>
-      SubscriptionFormatters.formatPriceLocalized(priceInCents, currency)
-
-    describe('USD', function () {
-      const formatUSD = format('USD')
-
-      it('should format basic amounts', function () {
-        expect(formatUSD(0)).to.equal('$0.00')
-        expect(formatUSD(1234)).to.equal('$12.34')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatUSD(100_000)).to.equal('$1,000.00')
-        expect(formatUSD(9_876_543_210)).to.equal('$98,765,432.10')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatUSD(-1)).to.equal('-$0.01')
-        expect(formatUSD(-1234)).to.equal('-$12.34')
-      })
+describe('SubscriptionFormatters', function () {
+  describe('formatDateTime', function () {
+    it('should return null if no date', function () {
+      const result = SubscriptionFormatters.formatDateTime(null)
+      expect(result).to.equal(null)
     })
 
-    describe('EUR', function () {
-      const formatEUR = format('EUR')
-
-      it('should format basic amounts', function () {
-        expect(formatEUR(0)).to.equal('€0.00')
-        expect(formatEUR(1234)).to.equal('€12.34')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatEUR(100_000)).to.equal('€1,000.00')
-        expect(formatEUR(9_876_543_210)).to.equal('€98,765,432.10')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatEUR(-1)).to.equal('-€0.01')
-        expect(formatEUR(-1234)).to.equal('-€12.34')
-      })
-    })
-
-    describe('HUF', function () {
-      const formatHUF = format('HUF')
-
-      it('should format basic amounts', function () {
-        expect(formatHUF(0)).to.equal('Ft 0.00')
-        expect(formatHUF(1234)).to.equal('Ft 12.34')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatHUF(100_000)).to.equal('Ft 1,000.00')
-        expect(formatHUF(9_876_543_210)).to.equal('Ft 98,765,432.10')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatHUF(-1)).to.equal('-Ft 0.01')
-        expect(formatHUF(-1234)).to.equal('-Ft 12.34')
-      })
-    })
-
-    describe('CLP', function () {
-      const formatCLP = format('CLP')
-
-      it('should format basic amounts', function () {
-        expect(formatCLP(0)).to.equal('$0')
-        expect(formatCLP(1234)).to.equal('$1,234')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatCLP(100_000)).to.equal('$100,000')
-        expect(formatCLP(9_876_543_210)).to.equal('$9,876,543,210')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatCLP(-1)).to.equal('-$1')
-        expect(formatCLP(-1234)).to.equal('-$1,234')
-      })
-    })
-
-    describe('all currencies', function () {
-      it('should format 100 "minimal atomic units"', function () {
-        const amount = 100
-
-        // "no cents currencies"
-        expect(format('CLP')(amount)).to.equal('$100')
-        expect(format('JPY')(amount)).to.equal('¥100')
-        expect(format('KRW')(amount)).to.equal('₩100')
-        expect(format('VND')(amount)).to.equal('₫100')
-
-        // other currencies
-        expect(format('AUD')(amount)).to.equal('$1.00')
-        expect(format('BRL')(amount)).to.equal('R$1.00')
-        expect(format('CAD')(amount)).to.equal('$1.00')
-        expect(format('CHF')(amount)).to.equal('CHF 1.00')
-        expect(format('CNY')(amount)).to.equal('¥1.00')
-        expect(format('COP')(amount)).to.equal('$1.00')
-        expect(format('DKK')(amount)).to.equal('kr 1.00')
-        expect(format('EUR')(amount)).to.equal('€1.00')
-        expect(format('GBP')(amount)).to.equal('£1.00')
-        expect(format('HUF')(amount)).to.equal('Ft 1.00')
-        expect(format('IDR')(amount)).to.equal('Rp 1.00')
-        expect(format('INR')(amount)).to.equal('₹1.00')
-        expect(format('MXN')(amount)).to.equal('$1.00')
-        expect(format('MYR')(amount)).to.equal('RM 1.00')
-        expect(format('NOK')(amount)).to.equal('kr 1.00')
-        expect(format('NZD')(amount)).to.equal('$1.00')
-        expect(format('PEN')(amount)).to.equal('PEN 1.00')
-        expect(format('PHP')(amount)).to.equal('₱1.00')
-        expect(format('SEK')(amount)).to.equal('kr 1.00')
-        expect(format('SGD')(amount)).to.equal('$1.00')
-        expect(format('THB')(amount)).to.equal('฿1.00')
-        expect(format('USD')(amount)).to.equal('$1.00')
-      })
-
-      it('should format 123_456_789.987_654 "minimal atomic units"', function () {
-        const amount = 123_456_789.987_654
-
-        // "no cents currencies"
-        expect(format('CLP')(amount)).to.equal('$123,456,790')
-        expect(format('JPY')(amount)).to.equal('¥123,456,790')
-        expect(format('KRW')(amount)).to.equal('₩123,456,790')
-        expect(format('VND')(amount)).to.equal('₫123,456,790')
-
-        // other currencies
-        expect(format('AUD')(amount)).to.equal('$1,234,567.90')
-        expect(format('BRL')(amount)).to.equal('R$1,234,567.90')
-        expect(format('CAD')(amount)).to.equal('$1,234,567.90')
-        expect(format('CHF')(amount)).to.equal('CHF 1,234,567.90')
-        expect(format('CNY')(amount)).to.equal('¥1,234,567.90')
-        expect(format('COP')(amount)).to.equal('$1,234,567.90')
-        expect(format('DKK')(amount)).to.equal('kr 1,234,567.90')
-        expect(format('EUR')(amount)).to.equal('€1,234,567.90')
-        expect(format('GBP')(amount)).to.equal('£1,234,567.90')
-        expect(format('HUF')(amount)).to.equal('Ft 1,234,567.90')
-        expect(format('IDR')(amount)).to.equal('Rp 1,234,567.90')
-        expect(format('INR')(amount)).to.equal('₹1,234,567.90')
-        expect(format('MXN')(amount)).to.equal('$1,234,567.90')
-        expect(format('MYR')(amount)).to.equal('RM 1,234,567.90')
-        expect(format('NOK')(amount)).to.equal('kr 1,234,567.90')
-        expect(format('NZD')(amount)).to.equal('$1,234,567.90')
-        expect(format('PEN')(amount)).to.equal('PEN 1,234,567.90')
-        expect(format('PHP')(amount)).to.equal('₱1,234,567.90')
-        expect(format('SEK')(amount)).to.equal('kr 1,234,567.90')
-        expect(format('SGD')(amount)).to.equal('$1,234,567.90')
-        expect(format('THB')(amount)).to.equal('฿1,234,567.90')
-        expect(format('USD')(amount)).to.equal('$1,234,567.90')
-      })
+    it('should format date with time', function () {
+      const date = new Date(1639904485000)
+      const result = SubscriptionFormatters.formatDateTime(date)
+      expect(result).to.equal('December 19th, 2021 9:01 AM UTC')
     })
   })
 
-  describe('fr', function () {
-    const format = currency => priceInCents =>
-      SubscriptionFormatters.formatPriceLocalized(priceInCents, currency, 'fr')
-
-    describe('USD', function () {
-      const formatUSD = format('USD')
-
-      it('should format basic amounts', function () {
-        expect(formatUSD(0)).to.equal('0,00 $')
-        expect(formatUSD(1234)).to.equal('12,34 $')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatUSD(100_000)).to.equal('1 000,00 $')
-        expect(formatUSD(9_876_543_210)).to.equal('98 765 432,10 $')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatUSD(-1)).to.equal('-0,01 $')
-        expect(formatUSD(-1234)).to.equal('-12,34 $')
-      })
+  describe('formatDate', function () {
+    it('should return null if no date', function () {
+      const result = SubscriptionFormatters.formatDate(null)
+      expect(result).to.equal(null)
     })
 
-    describe('EUR', function () {
-      const formatEUR = format('EUR')
-
-      it('should format basic amounts', function () {
-        expect(formatEUR(0)).to.equal('0,00 €')
-        expect(formatEUR(1234)).to.equal('12,34 €')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatEUR(100_000)).to.equal('1 000,00 €')
-        expect(formatEUR(9_876_543_210)).to.equal('98 765 432,10 €')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatEUR(-1)).to.equal('-0,01 €')
-        expect(formatEUR(-1234)).to.equal('-12,34 €')
-      })
-    })
-
-    describe('HUF', function () {
-      const formatHUF = format('HUF')
-
-      it('should format basic amounts', function () {
-        expect(formatHUF(0)).to.equal('0,00 Ft')
-        expect(formatHUF(1234)).to.equal('12,34 Ft')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatHUF(100_000)).to.equal('1 000,00 Ft')
-        expect(formatHUF(9_876_543_210)).to.equal('98 765 432,10 Ft')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatHUF(-1)).to.equal('-0,01 Ft')
-        expect(formatHUF(-1234)).to.equal('-12,34 Ft')
-      })
-    })
-
-    describe('CLP', function () {
-      const formatCLP = format('CLP')
-
-      it('should format basic amounts', function () {
-        expect(formatCLP(0)).to.equal('0 $')
-        expect(formatCLP(1234)).to.equal('1 234 $')
-      })
-
-      it('should format thousand separators', function () {
-        expect(formatCLP(100_000)).to.equal('100 000 $')
-        expect(formatCLP(9_876_543_210)).to.equal('9 876 543 210 $')
-      })
-
-      it('should format negative amounts', function () {
-        expect(formatCLP(-1)).to.equal('-1 $')
-        expect(formatCLP(-1234)).to.equal('-1 234 $')
-      })
-    })
-
-    describe('all currencies', function () {
-      it('should format 100 "minimal atomic units"', function () {
-        const amount = 100
-
-        // "no cents currencies"
-        expect(format('CLP')(amount)).to.equal('100 $')
-        expect(format('JPY')(amount)).to.equal('100 ¥')
-        expect(format('KRW')(amount)).to.equal('100 ₩')
-        expect(format('VND')(amount)).to.equal('100 ₫')
-
-        // other currencies
-        expect(format('AUD')(amount)).to.equal('1,00 $')
-        expect(format('BRL')(amount)).to.equal('1,00 R$')
-        expect(format('CAD')(amount)).to.equal('1,00 $')
-        expect(format('CHF')(amount)).to.equal('1,00 CHF')
-        expect(format('CNY')(amount)).to.equal('1,00 ¥')
-        expect(format('COP')(amount)).to.equal('1,00 $')
-
-        expect(format('EUR')(amount)).to.equal('1,00 €')
-        expect(format('GBP')(amount)).to.equal('1,00 £')
-        expect(format('USD')(amount)).to.equal('1,00 $')
-      })
-
-      it('should format 123_456_789.987_654 "minimal atomic units"', function () {
-        const amount = 123_456_789.987_654
-
-        // "no cents currencies"
-        expect(format('CLP')(amount)).to.equal('123 456 790 $')
-        expect(format('JPY')(amount)).to.equal('123 456 790 ¥')
-        expect(format('KRW')(amount)).to.equal('123 456 790 ₩')
-        expect(format('VND')(amount)).to.equal('123 456 790 ₫')
-
-        // other currencies
-        expect(format('AUD')(amount)).to.equal('1 234 567,90 $')
-        expect(format('BRL')(amount)).to.equal('1 234 567,90 R$')
-        expect(format('CAD')(amount)).to.equal('1 234 567,90 $')
-        expect(format('CHF')(amount)).to.equal('1 234 567,90 CHF')
-        expect(format('CNY')(amount)).to.equal('1 234 567,90 ¥')
-        expect(format('COP')(amount)).to.equal('1 234 567,90 $')
-
-        expect(format('EUR')(amount)).to.equal('1 234 567,90 €')
-        expect(format('GBP')(amount)).to.equal('1 234 567,90 £')
-        expect(format('USD')(amount)).to.equal('1 234 567,90 $')
-      })
+    it('should format date', function () {
+      const date = new Date(1639904485000)
+      const result = SubscriptionFormatters.formatDate(date)
+      expect(result).to.equal('December 19th, 2021')
     })
   })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionGroupController.test.mjs b/services/web/test/unit/src/Subscription/SubscriptionGroupController.test.mjs
new file mode 100644
index 0000000000..4783a44bcb
--- /dev/null
+++ b/services/web/test/unit/src/Subscription/SubscriptionGroupController.test.mjs
@@ -0,0 +1,967 @@
+import { vi } from 'vitest'
+import sinon from 'sinon'
+
+const modulePath =
+  '../../../../app/src/Features/Subscription/SubscriptionGroupController'
+
+describe('SubscriptionGroupController', function () {
+  beforeEach(async function (ctx) {
+    ctx.user = { _id: '!@312431', email: 'user@email.com' }
+    ctx.adminUserId = '123jlkj'
+    ctx.subscriptionId = '123434325412'
+    ctx.user_email = 'bob@gmail.com'
+    ctx.req = {
+      session: {
+        user: {
+          _id: ctx.adminUserId,
+          email: ctx.user_email,
+        },
+      },
+      params: {
+        subscriptionId: ctx.subscriptionId,
+      },
+      query: {},
+    }
+
+    ctx.subscription = {
+      _id: ctx.subscriptionId,
+      teamName: 'Cool group',
+      groupPlan: true,
+      membersLimit: 5,
+    }
+
+    ctx.plan = {
+      canUseFlexibleLicensing: true,
+    }
+
+    ctx.recurlySubscription = {
+      get isCollectionMethodManual() {
+        return true
+      },
+    }
+
+    ctx.previewSubscriptionChangeData = {
+      change: {},
+      currency: 'USD',
+    }
+
+    ctx.createSubscriptionChangeData = { adding: 1 }
+
+    ctx.paymentMethod = { cardType: 'Visa', lastFour: '1111' }
+
+    ctx.SubscriptionGroupHandler = {
+      promises: {
+        removeUserFromGroup: sinon.stub().resolves(),
+        getUsersGroupSubscriptionDetails: sinon.stub().resolves({
+          subscription: ctx.subscription,
+          plan: ctx.plan,
+          paymentProviderSubscription: ctx.recurlySubscription,
+        }),
+        previewAddSeatsSubscriptionChange: sinon
+          .stub()
+          .resolves(ctx.previewSubscriptionChangeData),
+        createAddSeatsSubscriptionChange: sinon
+          .stub()
+          .resolves(ctx.createSubscriptionChangeData),
+        ensureFlexibleLicensingEnabled: sinon.stub().resolves(),
+        ensureSubscriptionIsActive: sinon.stub().resolves(),
+        ensureSubscriptionCollectionMethodIsNotManual: sinon.stub().resolves(),
+        ensureSubscriptionHasNoPendingChanges: sinon.stub().resolves(),
+        ensureSubscriptionHasNoPastDueInvoice: sinon.stub().resolves(),
+        getGroupPlanUpgradePreview: sinon
+          .stub()
+          .resolves(ctx.previewSubscriptionChangeData),
+        checkBillingInfoExistence: sinon.stub().resolves(ctx.paymentMethod),
+        updateSubscriptionPaymentTerms: sinon.stub().resolves(),
+        ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual:
+          sinon.stub().resolves(),
+      },
+    }
+
+    ctx.SubscriptionLocator = {
+      promises: {
+        getSubscription: sinon.stub().resolves(ctx.subscription),
+      },
+    }
+
+    ctx.SessionManager = {
+      getLoggedInUserId(session) {
+        return session.user._id
+      },
+      getSessionUser(session) {
+        return session.user
+      },
+    }
+
+    ctx.UserAuditLogHandler = {
+      promises: {
+        addEntry: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub().resolves(),
+        },
+      },
+    }
+
+    ctx.UserGetter = {
+      promises: {
+        getUserEmail: sinon.stub().resolves(ctx.user.email),
+      },
+    }
+
+    ctx.paymentMethod = { cardType: 'Visa', lastFour: '1111' }
+
+    ctx.RecurlyClient = {
+      promises: {
+        getPaymentMethod: sinon.stub().resolves(ctx.paymentMethod),
+      },
+    }
+
+    ctx.SubscriptionController = {}
+
+    ctx.SubscriptionModel = { Subscription: {} }
+
+    ctx.PlansHelper = {
+      isProfessionalGroupPlan: sinon.stub().returns(false),
+    }
+
+    ctx.Errors = {
+      MissingBillingInfoError: class extends Error {},
+      ManuallyCollectedError: class extends Error {},
+      PendingChangeError: class extends Error {},
+      InactiveError: class extends Error {},
+      SubtotalLimitExceededError: class extends Error {},
+      HasPastDueInvoiceError: class extends Error {},
+      HasNoAdditionalLicenseWhenManuallyCollectedError: class extends Error {},
+      PaymentActionRequiredError: class extends Error {
+        constructor(info) {
+          super('Payment action required')
+          this.info = info
+        }
+      },
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionGroupHandler',
+      () => ({
+        default: ctx.SubscriptionGroupHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionLocator',
+      () => ({
+        default: ctx.SubscriptionLocator,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserAuditLogHandler', () => ({
+      default: ctx.UserAuditLogHandler,
+    }))
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: ctx.Modules,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Errors/ErrorController', () => ({
+      default: (ctx.ErrorController = {
+        notFound: sinon.stub(),
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionController',
+      () => ({
+        default: ctx.SubscriptionController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/RecurlyClient',
+      () => ({
+        default: ctx.RecurlyClient,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/PlansHelper',
+      () => ctx.PlansHelper
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/Errors',
+      () => ctx.Errors
+    )
+
+    vi.doMock(
+      '../../../../app/src/models/Subscription',
+      () => ctx.SubscriptionModel
+    )
+
+    vi.doMock('@overleaf/logger', () => ({
+      default: {
+        err: sinon.stub(),
+        error: sinon.stub(),
+        warn: sinon.stub(),
+        log: sinon.stub(),
+        debug: sinon.stub(),
+      },
+    }))
+
+    ctx.Controller = (await import(modulePath)).default
+  })
+
+  describe('removeUserFromGroup', function () {
+    it('should use the subscription id for the logged in user and take the user id from the params', async function (ctx) {
+      await new Promise(resolve => {
+        const userIdToRemove = '31231'
+        ctx.req.params = { user_id: userIdToRemove }
+        ctx.req.entity = ctx.subscription
+
+        const res = {
+          sendStatus: () => {
+            ctx.SubscriptionGroupHandler.promises.removeUserFromGroup
+              .calledWith(ctx.subscriptionId, userIdToRemove, {
+                initiatorId: ctx.req.session.user._id,
+                ipAddress: ctx.req.ip,
+              })
+              .should.equal(true)
+            resolve()
+          },
+        }
+        ctx.Controller.removeUserFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should log that the user has been removed', async function (ctx) {
+      await new Promise(resolve => {
+        const userIdToRemove = '31231'
+        ctx.req.params = { user_id: userIdToRemove }
+        ctx.req.entity = ctx.subscription
+
+        const res = {
+          sendStatus: () => {
+            sinon.assert.calledWith(
+              ctx.UserAuditLogHandler.promises.addEntry,
+              userIdToRemove,
+              'remove-from-group-subscription',
+              ctx.adminUserId,
+              ctx.req.ip,
+              { subscriptionId: ctx.subscriptionId }
+            )
+            resolve()
+          },
+        }
+        ctx.Controller.removeUserFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should call the group SSO hooks with group SSO enabled', async function (ctx) {
+      await new Promise(resolve => {
+        const userIdToRemove = '31231'
+        ctx.req.params = { user_id: userIdToRemove }
+        ctx.req.entity = ctx.subscription
+        ctx.Modules.promises.hooks.fire
+          .withArgs('hasGroupSSOEnabled', ctx.subscription)
+          .resolves([true])
+
+        const res = {
+          sendStatus: () => {
+            ctx.Modules.promises.hooks.fire
+              .calledWith('hasGroupSSOEnabled', ctx.subscription)
+              .should.equal(true)
+            ctx.Modules.promises.hooks.fire
+              .calledWith(
+                'unlinkUserFromGroupSSO',
+                userIdToRemove,
+                ctx.subscriptionId
+              )
+              .should.equal(true)
+            sinon.assert.calledTwice(ctx.Modules.promises.hooks.fire)
+            resolve()
+          },
+        }
+        ctx.Controller.removeUserFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should call the group SSO hooks with group SSO disabled', async function (ctx) {
+      await new Promise(resolve => {
+        const userIdToRemove = '31231'
+        ctx.req.params = { user_id: userIdToRemove }
+        ctx.req.entity = ctx.subscription
+        ctx.Modules.promises.hooks.fire
+          .withArgs('hasGroupSSOEnabled', ctx.subscription)
+          .resolves([false])
+
+        const res = {
+          sendStatus: () => {
+            ctx.Modules.promises.hooks.fire
+              .calledWith('hasGroupSSOEnabled', ctx.subscription)
+              .should.equal(true)
+            sinon.assert.calledOnce(ctx.Modules.promises.hooks.fire)
+            resolve()
+          },
+        }
+        ctx.Controller.removeUserFromGroup(ctx.req, res, resolve)
+      })
+    })
+  })
+
+  describe('removeSelfFromGroup', function () {
+    it('gets subscription and remove user', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.query = { subscriptionId: ctx.subscriptionId }
+        const memberUserIdToremove = 123456789
+        ctx.req.session.user._id = memberUserIdToremove
+
+        const res = {
+          sendStatus: () => {
+            sinon.assert.calledWith(
+              ctx.SubscriptionLocator.promises.getSubscription,
+              ctx.subscriptionId
+            )
+            sinon.assert.calledWith(
+              ctx.SubscriptionGroupHandler.promises.removeUserFromGroup,
+              ctx.subscriptionId,
+              memberUserIdToremove,
+              {
+                initiatorId: ctx.req.session.user._id,
+                ipAddress: ctx.req.ip,
+              }
+            )
+            resolve()
+          },
+        }
+        ctx.Controller.removeSelfFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should log that the user has left the subscription', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.query = { subscriptionId: ctx.subscriptionId }
+        const memberUserIdToremove = '123456789'
+        ctx.req.session.user._id = memberUserIdToremove
+
+        const res = {
+          sendStatus: () => {
+            sinon.assert.calledWith(
+              ctx.UserAuditLogHandler.promises.addEntry,
+              memberUserIdToremove,
+              'remove-from-group-subscription',
+              memberUserIdToremove,
+              ctx.req.ip,
+              { subscriptionId: ctx.subscriptionId }
+            )
+            resolve()
+          },
+        }
+        ctx.Controller.removeSelfFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should call the group SSO hooks with group SSO enabled', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.query = { subscriptionId: ctx.subscriptionId }
+        const memberUserIdToremove = '123456789'
+        ctx.req.session.user._id = memberUserIdToremove
+
+        ctx.Modules.promises.hooks.fire
+          .withArgs('hasGroupSSOEnabled', ctx.subscription)
+          .resolves([true])
+
+        const res = {
+          sendStatus: () => {
+            ctx.Modules.promises.hooks.fire
+              .calledWith('hasGroupSSOEnabled', ctx.subscription)
+              .should.equal(true)
+            ctx.Modules.promises.hooks.fire
+              .calledWith(
+                'unlinkUserFromGroupSSO',
+                memberUserIdToremove,
+                ctx.subscriptionId
+              )
+              .should.equal(true)
+            sinon.assert.calledTwice(ctx.Modules.promises.hooks.fire)
+            resolve()
+          },
+        }
+        ctx.Controller.removeSelfFromGroup(ctx.req, res, resolve)
+      })
+    })
+
+    it('should call the group SSO hooks with group SSO disabled', async function (ctx) {
+      await new Promise(resolve => {
+        const userIdToRemove = '31231'
+        ctx.req.session.user._id = userIdToRemove
+        ctx.req.params = { user_id: userIdToRemove }
+        ctx.req.entity = ctx.subscription
+        ctx.Modules.promises.hooks.fire
+          .withArgs('hasGroupSSOEnabled', ctx.subscription)
+          .resolves([false])
+
+        const res = {
+          sendStatus: () => {
+            ctx.Modules.promises.hooks.fire
+              .calledWith('hasGroupSSOEnabled', ctx.subscription)
+              .should.equal(true)
+            sinon.assert.calledOnce(ctx.Modules.promises.hooks.fire)
+            resolve()
+          },
+        }
+        ctx.Controller.removeSelfFromGroup(ctx.req, res, resolve)
+      })
+    })
+  })
+
+  describe('addSeatsToGroupSubscription', function () {
+    it('should render the "add seats" page', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        const res = {
+          render: (page, props) => {
+            ctx.SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails
+              .calledWith(ctx.req.session.user._id)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.ensureFlexibleLicensingEnabled
+              .calledWith(ctx.plan)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPendingChanges
+              .calledWith(ctx.recurlySubscription)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.ensureSubscriptionIsActive
+              .calledWith(ctx.subscription)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPastDueInvoice
+              .calledWith(ctx.subscription)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.checkBillingInfoExistence
+              .calledWith(ctx.recurlySubscription, ctx.adminUserId)
+              .should.equal(true)
+            ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual
+              .calledWith(ctx.recurlySubscription)
+              .should.equal(true)
+            page.should.equal('subscriptions/add-seats')
+            props.subscriptionId.should.equal(ctx.subscriptionId)
+            props.groupName.should.equal(ctx.subscription.teamName)
+            props.totalLicenses.should.equal(ctx.subscription.membersLimit)
+            props.isProfessional.should.equal(false)
+            props.isCollectionMethodManual.should.equal(true)
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subscription page when getting subscription details fails', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails =
+          sinon.stub().rejects()
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subscription page when flexible licensing is not enabled', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.ensureFlexibleLicensingEnabled =
+          sinon.stub().rejects()
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to missing billing information page when billing information is missing', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.checkBillingInfoExistence = sinon
+          .stub()
+          .throws(new ctx.Errors.MissingBillingInfoError())
+
+        const res = {
+          redirect: url => {
+            url.should.equal(
+              '/user/subscription/group/missing-billing-information'
+            )
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to manually collected subscription error page when collection method is manual and has no additional license add-on', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual =
+          sinon
+            .stub()
+            .throws(
+              new ctx.Errors.HasNoAdditionalLicenseWhenManuallyCollectedError()
+            )
+
+        const res = {
+          redirect: url => {
+            url.should.equal(
+              '/user/subscription/group/manually-collected-subscription'
+            )
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subscription page when there is a pending change', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPendingChanges =
+          sinon.stub().throws(new ctx.Errors.PendingChangeError())
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subscription page when subscription is not active', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.ensureSubscriptionIsActive = sinon
+          .stub()
+          .rejects()
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subscription page when subscription has pending invoice', async function (ctx) {
+      ctx.SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPastDueInvoice =
+        sinon.stub().rejects()
+
+      await new Promise(resolve => {
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.addSeatsToGroupSubscription(ctx.req, res)
+      })
+    })
+  })
+
+  describe('previewAddSeatsSubscriptionChange', function () {
+    it('should preview "add seats" change', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = { adding: 2 }
+
+        const res = {
+          json: data => {
+            ctx.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange
+              .calledWith(ctx.req.session.user._id, ctx.req.body.adding)
+              .should.equal(true)
+            data.should.deep.equal(ctx.previewSubscriptionChangeData)
+            resolve()
+          },
+        }
+
+        ctx.Controller.previewAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+
+    it('should fail previewing "add seats" change', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange =
+          sinon.stub().rejects()
+
+        const res = {
+          status: statusCode => {
+            statusCode.should.equal(500)
+
+            return {
+              end: () => {
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.previewAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+
+    it('should fail previewing "add seats" change with SubtotalLimitExceededError', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = { adding: 2 }
+        ctx.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange =
+          sinon.stub().throws(new ctx.Errors.SubtotalLimitExceededError())
+
+        const res = {
+          status: statusCode => {
+            statusCode.should.equal(422)
+
+            return {
+              json: data => {
+                data.should.deep.equal({
+                  code: 'subtotal_limit_exceeded',
+                  adding: ctx.req.body.adding,
+                })
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.previewAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+  })
+
+  describe('createAddSeatsSubscriptionChange', function () {
+    it('should apply "add seats" change', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = { adding: 2 }
+
+        const res = {
+          json: data => {
+            ctx.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange
+              .calledWith(ctx.req.session.user._id, ctx.req.body.adding)
+              .should.equal(true)
+            data.should.deep.equal(ctx.createSubscriptionChangeData)
+            resolve()
+          },
+        }
+
+        ctx.Controller.createAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+
+    it('should fail applying "add seats" change', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange =
+          sinon.stub().rejects()
+
+        const res = {
+          status: statusCode => {
+            statusCode.should.equal(500)
+
+            return {
+              end: () => {
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.createAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+
+    it('should fail applying "add seats" change with SubtotalLimitExceededError', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = { adding: 2 }
+        ctx.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange =
+          sinon.stub().throws(new ctx.Errors.SubtotalLimitExceededError())
+
+        const res = {
+          status: statusCode => {
+            statusCode.should.equal(422)
+
+            return {
+              json: data => {
+                data.should.deep.equal({
+                  code: 'subtotal_limit_exceeded',
+                  adding: ctx.req.body.adding,
+                })
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.createAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+
+    it('should send 402 response with PaymentActionRequiredError', async function (ctx) {
+      await new Promise(resolve => {
+        const adding = 2
+        ctx.req.body = { adding }
+        const error = new ctx.Errors.PaymentActionRequiredError({
+          clientSecret: 'secret',
+          publicKey: 'key',
+        })
+        ctx.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange =
+          sinon.stub().throws(error)
+
+        const res = {
+          status: statusCode => {
+            statusCode.should.equal(402)
+
+            return {
+              json: data => {
+                data.should.deep.equal({
+                  message: 'Payment action required',
+                  clientSecret: error.info.clientSecret,
+                  publicKey: error.info.publicKey,
+                })
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.createAddSeatsSubscriptionChange(ctx.req, res)
+      })
+    })
+  })
+
+  describe('submitForm', function () {
+    it('should build and pass the request body to the sales submit handler', async function (ctx) {
+      await new Promise(resolve => {
+        const adding = 100
+        const poNumber = 'PO123456'
+        ctx.req.body = { adding, poNumber }
+
+        const res = {
+          sendStatus: code => {
+            ctx.SubscriptionGroupHandler.promises.updateSubscriptionPaymentTerms(
+              ctx.adminUserId,
+              ctx.recurlySubscription,
+              poNumber
+            )
+            ctx.Modules.promises.hooks.fire
+              .calledWith('sendSupportRequest', {
+                email: ctx.user.email,
+                subject: 'Sales Contact Form',
+                message:
+                  '\n' +
+                  '**Overleaf Sales Contact Form:**\n' +
+                  '\n' +
+                  '**Subject:** Self-Serve Group User Increase Request\n' +
+                  '\n' +
+                  `**Estimated Number of Users:** ${adding}\n` +
+                  '\n' +
+                  `**PO Number:** ${poNumber}\n` +
+                  '\n' +
+                  `**Message:** This email has been generated on behalf of user with email **${ctx.user.email}** to request an increase in the total number of users for their subscription.`,
+                inbox: 'sales',
+              })
+              .should.equal(true)
+            sinon.assert.calledOnce(ctx.Modules.promises.hooks.fire)
+            code.should.equal(204)
+            resolve()
+          },
+        }
+        ctx.Controller.submitForm(ctx.req, res, resolve)
+      })
+    })
+  })
+
+  describe('subscriptionUpgradePage', function () {
+    it('should render "subscription upgrade" page', async function (ctx) {
+      await new Promise(resolve => {
+        const olSubscription = { membersLimit: 1, teamName: 'test team' }
+        ctx.SubscriptionModel.Subscription.findOne = () => {
+          return {
+            exec: () => olSubscription,
+          }
+        }
+
+        const res = {
+          render: (page, data) => {
+            ctx.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview
+              .calledWith(ctx.req.session.user._id)
+              .should.equal(true)
+            page.should.equal('subscriptions/upgrade-group-subscription-react')
+            data.totalLicenses.should.equal(olSubscription.membersLimit)
+            data.groupName.should.equal(olSubscription.teamName)
+            data.changePreview.should.equal(ctx.previewSubscriptionChangeData)
+            resolve()
+          },
+        }
+
+        ctx.Controller.subscriptionUpgradePage(ctx.req, res)
+      })
+    })
+
+    it('should redirect if failed to generate preview', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
+          .stub()
+          .rejects()
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription')
+            resolve()
+          },
+        }
+
+        ctx.Controller.subscriptionUpgradePage(ctx.req, res)
+      })
+    })
+
+    it('should redirect to missing billing information page when billing information is missing', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
+          .stub()
+          .throws(new ctx.Errors.MissingBillingInfoError())
+
+        const res = {
+          redirect: url => {
+            url.should.equal(
+              '/user/subscription/group/missing-billing-information'
+            )
+            resolve()
+          },
+        }
+
+        ctx.Controller.subscriptionUpgradePage(ctx.req, res)
+      })
+    })
+
+    it('should redirect to manually collected subscription error page when collection method is manual', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
+          .stub()
+          .throws(new ctx.Errors.ManuallyCollectedError())
+
+        const res = {
+          redirect: url => {
+            url.should.equal(
+              '/user/subscription/group/manually-collected-subscription'
+            )
+            resolve()
+          },
+        }
+
+        ctx.Controller.subscriptionUpgradePage(ctx.req, res)
+      })
+    })
+
+    it('should redirect to subtotal limit exceeded page', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
+          .stub()
+          .throws(new ctx.Errors.SubtotalLimitExceededError())
+
+        const res = {
+          redirect: url => {
+            url.should.equal('/user/subscription/group/subtotal-limit-exceeded')
+            resolve()
+          },
+        }
+
+        ctx.Controller.subscriptionUpgradePage(ctx.req, res)
+      })
+    })
+  })
+
+  describe('upgradeSubscription', function () {
+    it('should send 200 response', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.upgradeGroupPlan = sinon
+          .stub()
+          .resolves()
+
+        const res = {
+          sendStatus: code => {
+            code.should.equal(200)
+            resolve()
+          },
+        }
+
+        ctx.Controller.upgradeSubscription(ctx.req, res)
+      })
+    })
+
+    it('should send 500 response', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.SubscriptionGroupHandler.promises.upgradeGroupPlan = sinon
+          .stub()
+          .rejects()
+
+        const res = {
+          sendStatus: code => {
+            code.should.equal(500)
+            resolve()
+          },
+        }
+
+        ctx.Controller.upgradeSubscription(ctx.req, res)
+      })
+    })
+
+    it('should send 402 response with PaymentActionRequiredError', async function (ctx) {
+      await new Promise(resolve => {
+        const error = new ctx.Errors.PaymentActionRequiredError({
+          clientSecret: 'secret',
+          publicKey: 'public',
+        })
+        ctx.SubscriptionGroupHandler.promises.upgradeGroupPlan = sinon
+          .stub()
+          .rejects(error)
+        const res = {
+          status: code => {
+            code.should.equal(402)
+            return {
+              json: data => {
+                data.should.deep.equal({
+                  message: 'Payment action required',
+                  clientSecret: error.info.clientSecret,
+                  publicKey: error.info.publicKey,
+                })
+                resolve()
+              },
+            }
+          },
+        }
+
+        ctx.Controller.upgradeSubscription(ctx.req, res)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Subscription/SubscriptionGroupControllerTests.mjs b/services/web/test/unit/src/Subscription/SubscriptionGroupControllerTests.mjs
deleted file mode 100644
index b3b6b66dbd..0000000000
--- a/services/web/test/unit/src/Subscription/SubscriptionGroupControllerTests.mjs
+++ /dev/null
@@ -1,739 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-
-const modulePath =
-  '../../../../app/src/Features/Subscription/SubscriptionGroupController'
-
-describe('SubscriptionGroupController', function () {
-  beforeEach(async function () {
-    this.user = { _id: '!@312431', email: 'user@email.com' }
-    this.adminUserId = '123jlkj'
-    this.subscriptionId = '123434325412'
-    this.user_email = 'bob@gmail.com'
-    this.req = {
-      session: {
-        user: {
-          _id: this.adminUserId,
-          email: this.user_email,
-        },
-      },
-      params: {
-        subscriptionId: this.subscriptionId,
-      },
-      query: {},
-    }
-
-    this.subscription = {
-      _id: this.subscriptionId,
-      teamName: 'Cool group',
-      groupPlan: true,
-      membersLimit: 5,
-    }
-
-    this.plan = {
-      canUseFlexibleLicensing: true,
-    }
-
-    this.previewSubscriptionChangeData = {
-      change: {},
-      currency: 'USD',
-    }
-
-    this.createSubscriptionChangeData = { adding: 1 }
-
-    this.SubscriptionGroupHandler = {
-      promises: {
-        removeUserFromGroup: sinon.stub().resolves(),
-        getUsersGroupSubscriptionDetails: sinon.stub().resolves({
-          subscription: this.subscription,
-          plan: this.plan,
-          recurlySubscription: {},
-        }),
-        previewAddSeatsSubscriptionChange: sinon
-          .stub()
-          .resolves(this.previewSubscriptionChangeData),
-        createAddSeatsSubscriptionChange: sinon
-          .stub()
-          .resolves(this.createSubscriptionChangeData),
-        ensureFlexibleLicensingEnabled: sinon.stub().resolves(),
-        ensureSubscriptionIsActive: sinon.stub().resolves(),
-        ensureSubscriptionCollectionMethodIsNotManual: sinon.stub().resolves(),
-        ensureSubscriptionHasNoPendingChanges: sinon.stub().resolves(),
-        getGroupPlanUpgradePreview: sinon
-          .stub()
-          .resolves(this.previewSubscriptionChangeData),
-      },
-    }
-
-    this.SubscriptionLocator = {
-      promises: {
-        getSubscription: sinon.stub().resolves(this.subscription),
-      },
-    }
-
-    this.SessionManager = {
-      getLoggedInUserId(session) {
-        return session.user._id
-      },
-      getSessionUser(session) {
-        return session.user
-      },
-    }
-
-    this.UserAuditLogHandler = {
-      promises: {
-        addEntry: sinon.stub().resolves(),
-      },
-    }
-
-    this.Modules = {
-      promises: {
-        hooks: {
-          fire: sinon.stub().resolves(),
-        },
-      },
-    }
-
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves(),
-      },
-    }
-
-    this.UserGetter = {
-      promises: {
-        getUserEmail: sinon.stub().resolves(this.user.email),
-      },
-    }
-
-    this.paymentMethod = { cardType: 'Visa', lastFour: '1111' }
-
-    this.RecurlyClient = {
-      promises: {
-        getPaymentMethod: sinon.stub().resolves(this.paymentMethod),
-        // getSubscription: sinon.stub().resolves(this.subscription),
-      },
-    }
-
-    this.SubscriptionController = {}
-
-    this.SubscriptionModel = { Subscription: {} }
-
-    this.PlansHelper = {
-      isProfessionalGroupPlan: sinon.stub().returns(false),
-    }
-
-    this.Errors = {
-      MissingBillingInfoError: class extends Error {},
-      ManuallyCollectedError: class extends Error {},
-      PendingChangeError: class extends Error {},
-      InactiveError: class extends Error {},
-      SubtotalLimitExceededError: class extends Error {},
-    }
-
-    this.Controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Subscription/SubscriptionGroupHandler':
-        this.SubscriptionGroupHandler,
-      '../../../../app/src/Features/Subscription/SubscriptionLocator':
-        this.SubscriptionLocator,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/User/UserAuditLogHandler':
-        this.UserAuditLogHandler,
-      '../../../../app/src/infrastructure/Modules': this.Modules,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/Errors/ErrorController':
-        (this.ErrorController = {
-          notFound: sinon.stub(),
-        }),
-      '../../../../app/src/Features/Subscription/SubscriptionController':
-        this.SubscriptionController,
-      '../../../../app/src/Features/Subscription/RecurlyClient':
-        this.RecurlyClient,
-      '../../../../app/src/Features/Subscription/PlansHelper': this.PlansHelper,
-      '../../../../app/src/Features/Subscription/Errors': this.Errors,
-      '../../../../app/src/models/Subscription': this.SubscriptionModel,
-      '@overleaf/logger': {
-        err: sinon.stub(),
-        error: sinon.stub(),
-        warn: sinon.stub(),
-        log: sinon.stub(),
-        debug: sinon.stub(),
-      },
-    })
-  })
-
-  describe('removeUserFromGroup', function () {
-    it('should use the subscription id for the logged in user and take the user id from the params', function (done) {
-      const userIdToRemove = '31231'
-      this.req.params = { user_id: userIdToRemove }
-      this.req.entity = this.subscription
-
-      const res = {
-        sendStatus: () => {
-          this.SubscriptionGroupHandler.promises.removeUserFromGroup
-            .calledWith(this.subscriptionId, userIdToRemove)
-            .should.equal(true)
-          done()
-        },
-      }
-      this.Controller.removeUserFromGroup(this.req, res, done)
-    })
-
-    it('should log that the user has been removed', function (done) {
-      const userIdToRemove = '31231'
-      this.req.params = { user_id: userIdToRemove }
-      this.req.entity = this.subscription
-
-      const res = {
-        sendStatus: () => {
-          sinon.assert.calledWith(
-            this.UserAuditLogHandler.promises.addEntry,
-            userIdToRemove,
-            'remove-from-group-subscription',
-            this.adminUserId,
-            this.req.ip,
-            { subscriptionId: this.subscriptionId }
-          )
-          done()
-        },
-      }
-      this.Controller.removeUserFromGroup(this.req, res, done)
-    })
-
-    it('should call the group SSO hooks with group SSO enabled', function (done) {
-      const userIdToRemove = '31231'
-      this.req.params = { user_id: userIdToRemove }
-      this.req.entity = this.subscription
-      this.Modules.promises.hooks.fire
-        .withArgs('hasGroupSSOEnabled', this.subscription)
-        .resolves([true])
-
-      const res = {
-        sendStatus: () => {
-          this.Modules.promises.hooks.fire
-            .calledWith('hasGroupSSOEnabled', this.subscription)
-            .should.equal(true)
-          this.Modules.promises.hooks.fire
-            .calledWith(
-              'unlinkUserFromGroupSSO',
-              userIdToRemove,
-              this.subscriptionId
-            )
-            .should.equal(true)
-          sinon.assert.calledTwice(this.Modules.promises.hooks.fire)
-          done()
-        },
-      }
-      this.Controller.removeUserFromGroup(this.req, res, done)
-    })
-
-    it('should call the group SSO hooks with group SSO disabled', function (done) {
-      const userIdToRemove = '31231'
-      this.req.params = { user_id: userIdToRemove }
-      this.req.entity = this.subscription
-      this.Modules.promises.hooks.fire
-        .withArgs('hasGroupSSOEnabled', this.subscription)
-        .resolves([false])
-
-      const res = {
-        sendStatus: () => {
-          this.Modules.promises.hooks.fire
-            .calledWith('hasGroupSSOEnabled', this.subscription)
-            .should.equal(true)
-          sinon.assert.calledOnce(this.Modules.promises.hooks.fire)
-          done()
-        },
-      }
-      this.Controller.removeUserFromGroup(this.req, res, done)
-    })
-  })
-
-  describe('removeSelfFromGroup', function () {
-    it('gets subscription and remove user', function (done) {
-      this.req.query = { subscriptionId: this.subscriptionId }
-      const memberUserIdToremove = 123456789
-      this.req.session.user._id = memberUserIdToremove
-
-      const res = {
-        sendStatus: () => {
-          sinon.assert.calledWith(
-            this.SubscriptionLocator.promises.getSubscription,
-            this.subscriptionId
-          )
-          sinon.assert.calledWith(
-            this.SubscriptionGroupHandler.promises.removeUserFromGroup,
-            this.subscriptionId,
-            memberUserIdToremove
-          )
-          done()
-        },
-      }
-      this.Controller.removeSelfFromGroup(this.req, res, done)
-    })
-
-    it('should log that the user has left the subscription', function (done) {
-      this.req.query = { subscriptionId: this.subscriptionId }
-      const memberUserIdToremove = '123456789'
-      this.req.session.user._id = memberUserIdToremove
-
-      const res = {
-        sendStatus: () => {
-          sinon.assert.calledWith(
-            this.UserAuditLogHandler.promises.addEntry,
-            memberUserIdToremove,
-            'remove-from-group-subscription',
-            memberUserIdToremove,
-            this.req.ip,
-            { subscriptionId: this.subscriptionId }
-          )
-          done()
-        },
-      }
-      this.Controller.removeSelfFromGroup(this.req, res, done)
-    })
-
-    it('should call the group SSO hooks with group SSO enabled', function (done) {
-      this.req.query = { subscriptionId: this.subscriptionId }
-      const memberUserIdToremove = '123456789'
-      this.req.session.user._id = memberUserIdToremove
-
-      this.Modules.promises.hooks.fire
-        .withArgs('hasGroupSSOEnabled', this.subscription)
-        .resolves([true])
-
-      const res = {
-        sendStatus: () => {
-          this.Modules.promises.hooks.fire
-            .calledWith('hasGroupSSOEnabled', this.subscription)
-            .should.equal(true)
-          this.Modules.promises.hooks.fire
-            .calledWith(
-              'unlinkUserFromGroupSSO',
-              memberUserIdToremove,
-              this.subscriptionId
-            )
-            .should.equal(true)
-          sinon.assert.calledTwice(this.Modules.promises.hooks.fire)
-          done()
-        },
-      }
-      this.Controller.removeSelfFromGroup(this.req, res, done)
-    })
-
-    it('should call the group SSO hooks with group SSO disabled', function (done) {
-      const userIdToRemove = '31231'
-      this.req.session.user._id = userIdToRemove
-      this.req.params = { user_id: userIdToRemove }
-      this.req.entity = this.subscription
-      this.Modules.promises.hooks.fire
-        .withArgs('hasGroupSSOEnabled', this.subscription)
-        .resolves([false])
-
-      const res = {
-        sendStatus: () => {
-          this.Modules.promises.hooks.fire
-            .calledWith('hasGroupSSOEnabled', this.subscription)
-            .should.equal(true)
-          sinon.assert.calledOnce(this.Modules.promises.hooks.fire)
-          done()
-        },
-      }
-      this.Controller.removeSelfFromGroup(this.req, res, done)
-    })
-  })
-
-  describe('addSeatsToGroupSubscription', function () {
-    it('should render the "add seats" page', function (done) {
-      const res = {
-        render: (page, props) => {
-          this.SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails
-            .calledWith(this.req.session.user._id)
-            .should.equal(true)
-          this.SubscriptionGroupHandler.promises.ensureFlexibleLicensingEnabled
-            .calledWith(this.plan)
-            .should.equal(true)
-          this.SubscriptionGroupHandler.promises.ensureSubscriptionIsActive
-            .calledWith(this.subscription)
-            .should.equal(true)
-          page.should.equal('subscriptions/add-seats')
-          props.subscriptionId.should.equal(this.subscriptionId)
-          props.groupName.should.equal(this.subscription.teamName)
-          props.totalLicenses.should.equal(this.subscription.membersLimit)
-          props.isProfessional.should.equal(false)
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to subscription page when getting subscription details fails', function (done) {
-      this.SubscriptionGroupHandler.promises.getUsersGroupSubscriptionDetails =
-        sinon.stub().rejects()
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription')
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to subscription page when flexible licensing is not enabled', function (done) {
-      this.SubscriptionGroupHandler.promises.ensureFlexibleLicensingEnabled =
-        sinon.stub().rejects()
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription')
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to missing billing information page when billing information is missing', function (done) {
-      this.RecurlyClient.promises.getPaymentMethod = sinon
-        .stub()
-        .throws(new this.Errors.MissingBillingInfoError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal(
-            '/user/subscription/group/missing-billing-information'
-          )
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to manually collected subscription error page when collection method is manual', function (done) {
-      this.SubscriptionGroupHandler.promises.ensureSubscriptionCollectionMethodIsNotManual =
-        sinon.stub().throws(new this.Errors.ManuallyCollectedError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal(
-            '/user/subscription/group/manually-collected-subscription'
-          )
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to subscription page when there is a pending change', function (done) {
-      this.SubscriptionGroupHandler.promises.ensureSubscriptionHasNoPendingChanges =
-        sinon.stub().throws(new this.Errors.PendingChangeError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription')
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-
-    it('should redirect to subscription page when subscription is not active', function (done) {
-      this.SubscriptionGroupHandler.promises.ensureSubscriptionIsActive = sinon
-        .stub()
-        .rejects()
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription')
-          done()
-        },
-      }
-
-      this.Controller.addSeatsToGroupSubscription(this.req, res)
-    })
-  })
-
-  describe('previewAddSeatsSubscriptionChange', function () {
-    it('should preview "add seats" change', function (done) {
-      this.req.body = { adding: 2 }
-
-      const res = {
-        json: data => {
-          this.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange
-            .calledWith(this.req.session.user._id, this.req.body.adding)
-            .should.equal(true)
-          data.should.deep.equal(this.previewSubscriptionChangeData)
-          done()
-        },
-      }
-
-      this.Controller.previewAddSeatsSubscriptionChange(this.req, res)
-    })
-
-    it('should fail previewing "add seats" change', function (done) {
-      this.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange =
-        sinon.stub().rejects()
-
-      const res = {
-        status: statusCode => {
-          statusCode.should.equal(500)
-
-          return {
-            end: () => {
-              done()
-            },
-          }
-        },
-      }
-
-      this.Controller.previewAddSeatsSubscriptionChange(this.req, res)
-    })
-
-    it('should fail previewing "add seats" change with SubtotalLimitExceededError', function (done) {
-      this.req.body = { adding: 2 }
-      this.SubscriptionGroupHandler.promises.previewAddSeatsSubscriptionChange =
-        sinon.stub().throws(new this.Errors.SubtotalLimitExceededError())
-
-      const res = {
-        status: statusCode => {
-          statusCode.should.equal(422)
-
-          return {
-            json: data => {
-              data.should.deep.equal({
-                code: 'subtotal_limit_exceeded',
-                adding: this.req.body.adding,
-              })
-              done()
-            },
-          }
-        },
-      }
-
-      this.Controller.previewAddSeatsSubscriptionChange(this.req, res)
-    })
-  })
-
-  describe('createAddSeatsSubscriptionChange', function () {
-    it('should apply "add seats" change', function (done) {
-      this.req.body = { adding: 2 }
-
-      const res = {
-        json: data => {
-          this.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange
-            .calledWith(this.req.session.user._id, this.req.body.adding)
-            .should.equal(true)
-          data.should.deep.equal(this.createSubscriptionChangeData)
-          done()
-        },
-      }
-
-      this.Controller.createAddSeatsSubscriptionChange(this.req, res)
-    })
-
-    it('should fail applying "add seats" change', function (done) {
-      this.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange =
-        sinon.stub().rejects()
-
-      const res = {
-        status: statusCode => {
-          statusCode.should.equal(500)
-
-          return {
-            end: () => {
-              done()
-            },
-          }
-        },
-      }
-
-      this.Controller.createAddSeatsSubscriptionChange(this.req, res)
-    })
-
-    it('should fail applying "add seats" change with SubtotalLimitExceededError', function (done) {
-      this.req.body = { adding: 2 }
-      this.SubscriptionGroupHandler.promises.createAddSeatsSubscriptionChange =
-        sinon.stub().throws(new this.Errors.SubtotalLimitExceededError())
-
-      const res = {
-        status: statusCode => {
-          statusCode.should.equal(422)
-
-          return {
-            json: data => {
-              data.should.deep.equal({
-                code: 'subtotal_limit_exceeded',
-                adding: this.req.body.adding,
-              })
-              done()
-            },
-          }
-        },
-      }
-
-      this.Controller.createAddSeatsSubscriptionChange(this.req, res)
-    })
-  })
-
-  describe('submitForm', function () {
-    it('should build and pass the request body to the sales submit handler', function (done) {
-      const adding = 100
-      this.req.body = { adding }
-
-      const res = {
-        sendStatus: code => {
-          this.Modules.promises.hooks.fire
-            .calledWith('sendSupportRequest', {
-              email: this.user.email,
-              subject: 'Sales Contact Form',
-              message:
-                '\n' +
-                '**Overleaf Sales Contact Form:**\n' +
-                '\n' +
-                '**Subject:** Self-Serve Group User Increase Request\n' +
-                '\n' +
-                `**Estimated Number of Users:** ${adding}\n` +
-                '\n' +
-                `**Message:** This email has been generated on behalf of user with email **${this.user.email}** to request an increase in the total number of users for their subscription.`,
-              inbox: 'sales',
-            })
-            .should.equal(true)
-          sinon.assert.calledOnce(this.Modules.promises.hooks.fire)
-          code.should.equal(204)
-          done()
-        },
-      }
-      this.Controller.submitForm(this.req, res, done)
-    })
-  })
-
-  describe('subscriptionUpgradePage', function () {
-    it('should render "subscription upgrade" page', function (done) {
-      const olSubscription = { membersLimit: 1, teamName: 'test team' }
-      this.SubscriptionModel.Subscription.findOne = () => {
-        return {
-          exec: () => olSubscription,
-        }
-      }
-
-      const res = {
-        render: (page, data) => {
-          this.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview
-            .calledWith(this.req.session.user._id)
-            .should.equal(true)
-          page.should.equal('subscriptions/upgrade-group-subscription-react')
-          data.totalLicenses.should.equal(olSubscription.membersLimit)
-          data.groupName.should.equal(olSubscription.teamName)
-          data.changePreview.should.equal(this.previewSubscriptionChangeData)
-          done()
-        },
-      }
-
-      this.Controller.subscriptionUpgradePage(this.req, res)
-    })
-
-    it('should redirect if failed to generate preview', function (done) {
-      this.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
-        .stub()
-        .rejects()
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription')
-          done()
-        },
-      }
-
-      this.Controller.subscriptionUpgradePage(this.req, res)
-    })
-
-    it('should redirect to missing billing information page when billing information is missing', function (done) {
-      this.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
-        .stub()
-        .throws(new this.Errors.MissingBillingInfoError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal(
-            '/user/subscription/group/missing-billing-information'
-          )
-          done()
-        },
-      }
-
-      this.Controller.subscriptionUpgradePage(this.req, res)
-    })
-
-    it('should redirect to manually collected subscription error page when collection method is manual', function (done) {
-      this.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
-        .stub()
-        .throws(new this.Errors.ManuallyCollectedError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal(
-            '/user/subscription/group/manually-collected-subscription'
-          )
-          done()
-        },
-      }
-
-      this.Controller.subscriptionUpgradePage(this.req, res)
-    })
-
-    it('should redirect to subtotal limit exceeded page', function (done) {
-      this.SubscriptionGroupHandler.promises.getGroupPlanUpgradePreview = sinon
-        .stub()
-        .throws(new this.Errors.SubtotalLimitExceededError())
-
-      const res = {
-        redirect: url => {
-          url.should.equal('/user/subscription/group/subtotal-limit-exceeded')
-          done()
-        },
-      }
-
-      this.Controller.subscriptionUpgradePage(this.req, res)
-    })
-  })
-
-  describe('upgradeSubscription', function () {
-    it('should send 200 response', function (done) {
-      this.SubscriptionGroupHandler.promises.upgradeGroupPlan = sinon
-        .stub()
-        .resolves()
-
-      const res = {
-        sendStatus: code => {
-          code.should.equal(200)
-          done()
-        },
-      }
-
-      this.Controller.upgradeSubscription(this.req, res)
-    })
-
-    it('should send 500 response', function (done) {
-      this.SubscriptionGroupHandler.promises.upgradeGroupPlan = sinon
-        .stub()
-        .rejects()
-
-      const res = {
-        sendStatus: code => {
-          code.should.equal(500)
-          done()
-        },
-      }
-
-      this.Controller.upgradeSubscription(this.req, res)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Subscription/SubscriptionGroupHandlerTests.js b/services/web/test/unit/src/Subscription/SubscriptionGroupHandlerTests.js
index cdb3c15089..87793fe440 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionGroupHandlerTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionGroupHandlerTests.js
@@ -1,7 +1,11 @@
 const SandboxedModule = require('sandboxed-module')
+const { ObjectId } = require('mongodb-legacy')
 const sinon = require('sinon')
 const { expect } = require('chai')
 const MockRequest = require('../helpers/MockRequest')
+const {
+  InvalidEmailError,
+} = require('../../../../app/src/Features/Errors/Errors')
 const modulePath =
   '../../../../app/src/Features/Subscription/SubscriptionGroupHandler'
 
@@ -15,18 +19,19 @@ describe('SubscriptionGroupHandler', function () {
     this.subscription_id = '31DSd1123D'
     this.adding = 1
     this.paymentMethod = { cardType: 'Visa', lastFour: '1111' }
-    this.RecurlyEntities = {
+    this.PaymentProviderEntities = {
       MEMBERS_LIMIT_ADD_ON_CODE: 'additional-license',
     }
     this.localPlanInSettings = {
       membersLimit: 5,
-      membersLimitAddOn: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+      membersLimitAddOn: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
     }
 
     this.subscription = {
       admin_id: this.adminUser_id,
       manager_ids: [this.adminUser_id],
       _id: this.subscription_id,
+      membersLimit: 100,
     }
 
     this.changeRequest = {
@@ -36,11 +41,20 @@ describe('SubscriptionGroupHandler', function () {
       },
     }
 
+    this.termsAndConditionsUpdate = {
+      termsAndConditions: 'T&C copy',
+    }
+
+    this.poNumberAndTermsAndConditionsUpdate = {
+      poNumber: '4444',
+      ...this.termsAndConditionsUpdate,
+    }
+
     this.recurlySubscription = {
       id: 123,
       addOns: [
         {
-          code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+          code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
           quantity: 1,
         },
       ],
@@ -50,10 +64,19 @@ describe('SubscriptionGroupHandler', function () {
       getRequestForFlexibleLicensingGroupPlanUpgrade: sinon
         .stub()
         .returns(this.changeRequest),
+      getRequestForPoNumberAndTermsAndConditionsUpdate: sinon
+        .stub()
+        .returns(this.poNumberAndTermsAndConditionsUpdate),
+      getRequestForTermsAndConditionsUpdate: sinon
+        .stub()
+        .returns(this.termsAndConditionsUpdate),
       currency: 'USD',
       hasAddOn(code) {
         return this.addOns.some(addOn => addOn.code === code)
       },
+      get isCollectionMethodManual() {
+        return false
+      },
     }
 
     this.SubscriptionLocator = {
@@ -91,6 +114,10 @@ describe('SubscriptionGroupHandler', function () {
       findOne: sinon.stub().returns({ exec: sinon.stub().resolves }),
     }
 
+    this.User = {
+      find: sinon.stub().returns({ exec: sinon.stub().resolves }),
+    }
+
     this.SessionManager = {
       getLoggedInUserId: sinon.stub().returns(this.user._id),
     }
@@ -98,7 +125,7 @@ describe('SubscriptionGroupHandler', function () {
     this.previewSubscriptionChange = {
       nextAddOns: [
         {
-          code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+          code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
           quantity: this.recurlySubscription.addOns[0].quantity + this.adding,
         },
       ],
@@ -119,6 +146,7 @@ describe('SubscriptionGroupHandler', function () {
         applySubscriptionChangeRequest: sinon
           .stub()
           .resolves(this.applySubscriptionChange),
+        updateSubscriptionDetails: sinon.stub().resolves(),
       },
     }
 
@@ -132,6 +160,13 @@ describe('SubscriptionGroupHandler', function () {
       },
     }
 
+    this.TeamInvitesHandler = {
+      promises: {
+        revokeInvite: sinon.stub().resolves(),
+        createInvite: sinon.stub().resolves(),
+      },
+    }
+
     this.GroupPlansData = {
       enterprise: {
         collaborator: {
@@ -155,33 +190,63 @@ describe('SubscriptionGroupHandler', function () {
       },
     }
 
+    this.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub(),
+        },
+      },
+    }
+
+    this.Modules.promises.hooks.fire
+      .withArgs('generateTermsAndConditions')
+      .resolves(['T&Cs'])
+      .withArgs('getPaymentFromRecord')
+      .resolves([
+        {
+          subscription: this.recurlySubscription,
+          account: { hasPastDueInvoice: false },
+        },
+      ])
+      .withArgs('previewSubscriptionChangeRequest')
+      .resolves([this.previewSubscriptionChange])
+      .withArgs('previewGroupPlanUpgrade')
+      .resolves([{ subscriptionChange: this.previewSubscriptionChange }])
+
     this.Handler = SandboxedModule.require(modulePath, {
       requires: {
         './SubscriptionUpdater': this.SubscriptionUpdater,
         './SubscriptionLocator': this.SubscriptionLocator,
         './SubscriptionController': this.SubscriptionController,
         './SubscriptionHandler': this.SubscriptionHandler,
+        './TeamInvitesHandler': this.TeamInvitesHandler,
         '../../models/Subscription': {
           Subscription: this.Subscription,
         },
+        '../../models/User': {
+          User: this.User,
+        },
         './RecurlyClient': this.RecurlyClient,
         './PlansLocator': this.PlansLocator,
-        './RecurlyEntities': this.RecurlyEntities,
+        './PaymentProviderEntities': this.PaymentProviderEntities,
         '../Authentication/SessionManager': this.SessionManager,
         './GroupPlansData': this.GroupPlansData,
+        '../../infrastructure/Modules': this.Modules,
       },
     })
   })
 
   describe('removeUserFromGroup', function () {
     it('should call the subscription updater to remove the user', async function () {
+      const auditLog = { ipAddress: '0:0:0:0', initiatorId: this.user._id }
       await this.Handler.promises.removeUserFromGroup(
         this.adminUser_id,
-        this.user._id
+        this.user._id,
+        auditLog
       )
 
       this.SubscriptionUpdater.promises.removeUserFromGroup
-        .calledWith(this.adminUser_id, this.user._id)
+        .calledWith(this.adminUser_id, this.user._id, auditLog)
         .should.equal(true)
     })
   })
@@ -325,10 +390,11 @@ describe('SubscriptionGroupHandler', function () {
         },
         plan: {
           membersLimit: 5,
-          membersLimitAddOn: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+          membersLimitAddOn:
+            this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
           canUseFlexibleLicensing: true,
         },
-        recurlySubscription: this.recurlySubscription,
+        paymentProviderSubscription: this.recurlySubscription,
       })
     })
   })
@@ -347,14 +413,14 @@ describe('SubscriptionGroupHandler', function () {
       beforeEach(function () {
         this.recurlySubscription.addOns = [
           {
-            code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+            code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
             quantity: 6,
           },
         ]
         this.prevQuantity = this.recurlySubscription.addOns[0].quantity
         this.previewSubscriptionChange.nextAddOns = [
           {
-            code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+            code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
             quantity: this.prevQuantity + this.adding,
           },
         ]
@@ -367,7 +433,7 @@ describe('SubscriptionGroupHandler', function () {
 
         this.recurlySubscription.getRequestForAddOnUpdate
           .calledWith(
-            this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+            this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
             this.recurlySubscription.addOns[0].quantity + this.adding
           )
           .should.equal(true)
@@ -380,25 +446,29 @@ describe('SubscriptionGroupHandler', function () {
               this.adminUser_id,
               this.adding
             )
-          this.RecurlyClient.promises.getPaymentMethod
-            .calledWith(this.adminUser_id)
+          this.Modules.promises.hooks.fire
+            .calledWith('getPaymentFromRecord', {
+              groupPlan: true,
+              recurlyStatus: {
+                state: 'active',
+              },
+            })
             .should.equal(true)
-          this.RecurlyClient.promises.previewSubscriptionChange
-            .calledWith(this.changeRequest)
+          this.Modules.promises.hooks.fire
+            .calledWith('previewSubscriptionChangeRequest', this.changeRequest)
             .should.equal(true)
           this.SubscriptionController.makeChangePreview
             .calledWith(
               {
                 type: 'add-on-update',
                 addOn: {
-                  code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+                  code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
                   quantity:
                     this.previewSubscriptionChange.nextAddOns[0].quantity,
                   prevQuantity: this.prevQuantity,
                 },
               },
-              this.previewSubscriptionChange,
-              this.paymentMethod
+              this.previewSubscriptionChange
             )
             .should.equal(true)
           preview.should.equal(this.changePreview)
@@ -407,19 +477,39 @@ describe('SubscriptionGroupHandler', function () {
 
       describe('createAddSeatsSubscriptionChange', function () {
         it('should change the subscription', async function () {
+          this.recurlySubscription = {
+            ...this.recurlySubscription,
+            get isCollectionMethodManual() {
+              return true
+            },
+          }
+          this.Modules.promises.hooks.fire
+            .withArgs('getPaymentFromRecord')
+            .resolves([
+              {
+                subscription: this.recurlySubscription,
+                account: { hasPastDueInvoice: false },
+              },
+            ])
+
           const result =
             await this.Handler.promises.createAddSeatsSubscriptionChange(
               this.adminUser_id,
-              this.adding
+              this.adding,
+              '123'
             )
 
-          this.RecurlyClient.promises.applySubscriptionChangeRequest
-            .calledWith(this.changeRequest)
-            .should.equal(true)
-          this.SubscriptionHandler.promises.syncSubscription
+          this.RecurlyClient.promises.updateSubscriptionDetails
             .calledWith(
-              { uuid: this.recurlySubscription.id },
-              this.adminUser_id
+              sinon.match
+                .has('poNumber')
+                .and(sinon.match.has('termsAndConditions'))
+            )
+            .should.equal(true)
+          this.Modules.promises.hooks.fire
+            .calledWith(
+              'applySubscriptionChangeRequestAndSync',
+              this.changeRequest
             )
             .should.equal(true)
           expect(result).to.deep.equal({
@@ -429,13 +519,59 @@ describe('SubscriptionGroupHandler', function () {
       })
     })
 
+    describe('updateSubscriptionPaymentTerms', function () {
+      describe('accounts with PO number', function () {
+        it('should update the subscription PO number and T&C', async function () {
+          await this.Handler.promises.updateSubscriptionPaymentTerms(
+            this.recurlySubscription,
+            this.poNumberAndTermsAndConditionsUpdate.poNumber
+          )
+          this.recurlySubscription.getRequestForPoNumberAndTermsAndConditionsUpdate
+            .calledWithMatch(
+              this.poNumberAndTermsAndConditionsUpdate.poNumber,
+              'T&Cs'
+            )
+            .should.equal(true)
+          this.RecurlyClient.promises.updateSubscriptionDetails
+            .calledWith(this.poNumberAndTermsAndConditionsUpdate)
+            .should.equal(true)
+        })
+
+        it('should fail for stripe', async function () {
+          this.recurlySubscription.service = 'stripe'
+          await expect(
+            this.Handler.promises.updateSubscriptionPaymentTerms(
+              this.recurlySubscription,
+              this.poNumberAndTermsAndConditionsUpdate.poNumber
+            )
+          ).to.be.rejectedWith(
+            'Updating payment terms is not supported for Stripe subscriptions'
+          )
+        })
+      })
+
+      describe('accounts with no PO number', function () {
+        it('should update the subscription T&C only', async function () {
+          await this.Handler.promises.updateSubscriptionPaymentTerms(
+            this.recurlySubscription
+          )
+          this.recurlySubscription.getRequestForTermsAndConditionsUpdate
+            .calledWithMatch('T&Cs')
+            .should.equal(true)
+          this.RecurlyClient.promises.updateSubscriptionDetails
+            .calledWith(this.termsAndConditionsUpdate)
+            .should.equal(true)
+        })
+      })
+    })
+
     describe('has no "additional-license" add-on', function () {
       beforeEach(function () {
         this.recurlySubscription.addOns = []
         this.prevQuantity = this.recurlySubscription.addOns[0]?.quantity ?? 0
         this.previewSubscriptionChange.nextAddOns = [
           {
-            code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+            code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
             quantity: this.prevQuantity + this.adding,
           },
         ]
@@ -456,25 +592,29 @@ describe('SubscriptionGroupHandler', function () {
         let preview
 
         afterEach(function () {
-          this.RecurlyClient.promises.getPaymentMethod
-            .calledWith(this.adminUser_id)
+          this.Modules.promises.hooks.fire
+            .calledWith('getPaymentFromRecord', {
+              groupPlan: true,
+              recurlyStatus: {
+                state: 'active',
+              },
+            })
             .should.equal(true)
-          this.RecurlyClient.promises.previewSubscriptionChange
-            .calledWith(this.changeRequest)
+          this.Modules.promises.hooks.fire
+            .calledWith('previewSubscriptionChangeRequest', this.changeRequest)
             .should.equal(true)
           this.SubscriptionController.makeChangePreview
             .calledWith(
               {
                 type: 'add-on-update',
                 addOn: {
-                  code: this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+                  code: this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
                   quantity:
                     this.previewSubscriptionChange.nextAddOns[0].quantity,
                   prevQuantity: this.prevQuantity,
                 },
               },
-              this.previewSubscriptionChange,
-              this.paymentMethod
+              this.previewSubscriptionChange
             )
             .should.equal(true)
           preview.should.equal(this.changePreview)
@@ -493,7 +633,7 @@ describe('SubscriptionGroupHandler', function () {
             )
           this.recurlySubscription.getRequestForAddOnPurchase
             .calledWithExactly(
-              this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+              this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
               this.adding,
               this.GroupPlansData.enterprise.collaborator.USD[5]
                 .additional_license_legacy_price_in_cents / 100
@@ -513,7 +653,7 @@ describe('SubscriptionGroupHandler', function () {
             )
           this.recurlySubscription.getRequestForAddOnPurchase
             .calledWithExactly(
-              this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+              this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
               this.adding,
               undefined
             )
@@ -538,7 +678,7 @@ describe('SubscriptionGroupHandler', function () {
             )
           this.recurlySubscription.getRequestForAddOnPurchase
             .calledWithExactly(
-              this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+              this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
               this.adding,
               this.GroupPlansData.enterprise.collaborator.USD[5]
                 .additional_license_legacy_price_in_cents / 100
@@ -563,7 +703,7 @@ describe('SubscriptionGroupHandler', function () {
             )
           this.recurlySubscription.getRequestForAddOnPurchase
             .calledWithExactly(
-              this.RecurlyEntities.MEMBERS_LIMIT_ADD_ON_CODE,
+              this.PaymentProviderEntities.MEMBERS_LIMIT_ADD_ON_CODE,
               this.adding,
               undefined
             )
@@ -645,101 +785,429 @@ describe('SubscriptionGroupHandler', function () {
     })
   })
 
-  describe('upgradeGroupPlan', function () {
-    it('should upgrade the subscription for flexible licensing group plans', async function () {
-      this.SubscriptionLocator.promises.getUsersSubscription = sinon
-        .stub()
-        .resolves({
-          groupPlan: true,
-          recurlyStatus: {
-            state: 'active',
-          },
-          planCode: 'group_collaborator',
-        })
-      await this.Handler.promises.upgradeGroupPlan(this.user_id)
-      this.recurlySubscription.getRequestForGroupPlanUpgrade
-        .calledWith('group_professional')
-        .should.equal(true)
-      this.RecurlyClient.promises.applySubscriptionChangeRequest
-        .calledWith(this.changeRequest)
-        .should.equal(true)
-      this.SubscriptionHandler.promises.syncSubscription
-        .calledWith({ uuid: this.changeRequest.subscription.id }, this.user_id)
-        .should.equal(true)
-    })
-
-    it('should upgrade the subscription for legacy group plans', async function () {
-      this.SubscriptionLocator.promises.getUsersSubscription = sinon
-        .stub()
-        .resolves({
-          groupPlan: true,
-          recurlyStatus: {
-            state: 'active',
-          },
-          planCode: 'group_collaborator_10_educational',
-        })
-      await this.Handler.promises.upgradeGroupPlan(this.user_id)
-      this.recurlySubscription.getRequestForGroupPlanUpgrade
-        .calledWith('group_professional_10_educational')
-        .should.equal(true)
-      this.RecurlyClient.promises.applySubscriptionChangeRequest
-        .calledWith(this.changeRequest)
-        .should.equal(true)
-      this.SubscriptionHandler.promises.syncSubscription
-        .calledWith({ uuid: this.changeRequest.subscription.id }, this.user_id)
-        .should.equal(true)
-    })
-
-    it('should fail the upgrade if is professional already', async function () {
-      this.SubscriptionLocator.promises.getUsersSubscription = sinon
-        .stub()
-        .resolves({
-          groupPlan: true,
-          recurlyStatus: {
-            state: 'active',
-          },
-          planCode: 'group_professional',
-        })
+  describe('ensureSubscriptionHasNoPastDueInvoice', function () {
+    it('should throw if the subscription has past due invoice', async function () {
+      this.Modules.promises.hooks.fire
+        .withArgs('getPaymentFromRecord')
+        .resolves([{ account: { hasPastDueInvoice: true } }])
       await expect(
-        this.Handler.promises.upgradeGroupPlan(this.user_id)
-      ).to.be.rejectedWith('Not eligible for group plan upgrade')
+        this.Handler.promises.ensureSubscriptionHasNoPastDueInvoice(
+          this.subscription
+        )
+      ).to.be.rejectedWith('This subscription has a past due invoice')
     })
 
-    it('should fail the upgrade if not group plan', async function () {
-      this.SubscriptionLocator.promises.getUsersSubscription = sinon
-        .stub()
-        .resolves({
-          groupPlan: false,
-          recurlyStatus: {
-            state: 'active',
-          },
-          planCode: 'test_plan_code',
-        })
+    it('should not throw if the subscription has no past due invoice', async function () {
       await expect(
-        this.Handler.promises.upgradeGroupPlan(this.user_id)
-      ).to.be.rejectedWith('Not eligible for group plan upgrade')
+        this.Handler.promises.ensureSubscriptionHasNoPastDueInvoice(
+          this.subscription
+        )
+      ).to.not.be.rejected
+    })
+  })
+
+  describe('ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual', function () {
+    it('should throw if the subscription is manually collected and has no additional license add-on', async function () {
+      await expect(
+        this.Handler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual(
+          {
+            isCollectionMethodManual: true,
+            hasAddOn: sinon
+              .stub()
+              .withArgs('additional-license')
+              .returns(false),
+          }
+        )
+      ).to.be.rejectedWith(
+        'This subscription is being collected manually has no "additional-license" add-on'
+      )
+    })
+
+    it('should not throw if the subscription is not manually collected and has no additional license add-on and ', async function () {
+      await expect(
+        this.Handler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual(
+          {
+            isCollectionMethodManual: false,
+            hasAddOn: sinon
+              .stub()
+              .withArgs('additional-license')
+              .returns(false),
+          }
+        )
+      ).to.not.be.rejected
+    })
+
+    it('should not throw if the subscription is not manually collected and has additional license add-on', async function () {
+      await expect(
+        this.Handler.promises.ensureSubscriptionHasAdditionalLicenseAddOnWhenCollectionMethodIsManual(
+          {
+            isCollectionMethodManual: true,
+            hasAddOn: sinon.stub().withArgs('additional-license').returns(true),
+          }
+        )
+      ).to.not.be.rejected
     })
   })
 
   describe('getGroupPlanUpgradePreview', function () {
     it('should generate preview for subscription upgrade', async function () {
-      this.SubscriptionLocator.promises.getUsersSubscription = sinon
-        .stub()
-        .resolves({
-          groupPlan: true,
-          recurlyStatus: {
-            state: 'active',
-          },
-          planCode: 'group_collaborator',
-        })
       const result = await this.Handler.promises.getGroupPlanUpgradePreview(
         this.user_id
       )
-      this.RecurlyClient.promises.previewSubscriptionChange
-        .calledWith(this.changeRequest)
-        .should.equal(true)
-
       result.should.equal(this.changePreview)
     })
   })
+
+  describe('checkBillingInfoExistence', function () {
+    it('should invoke the payment method function when collection method is "automatic"', async function () {
+      await this.Handler.promises.checkBillingInfoExistence(
+        this.recurlySubscription,
+        this.adminUser_id
+      )
+      this.Modules.promises.hooks.fire
+        .calledWith('getPaymentMethod', this.adminUser_id)
+        .should.equal(true)
+    })
+
+    it('shouldn’t invoke the payment method function when collection method is "manual"', async function () {
+      const recurlySubscription = {
+        ...this.recurlySubscription,
+        get isCollectionMethodManual() {
+          return true
+        },
+      }
+      await this.Handler.promises.checkBillingInfoExistence(
+        recurlySubscription,
+        this.adminUser_id
+      )
+      this.RecurlyClient.promises.getPaymentMethod.should.not.have.been.called
+    })
+  })
+
+  describe('updateGroupMembersBulk', function () {
+    const inviterId = new ObjectId()
+
+    let members
+    let emailList
+    let callUpdateGroupMembersBulk
+
+    beforeEach(function () {
+      members = [
+        {
+          _id: new ObjectId(),
+          email: 'user1@example.com',
+          emails: [{ email: 'user1@example.com' }],
+        },
+        {
+          _id: new ObjectId(),
+          email: 'user2-alias@example.com',
+          emails: [
+            {
+              email: 'user2-alias@example.com',
+            },
+            {
+              email: 'user2@example.com',
+            },
+          ],
+        },
+        {
+          _id: new ObjectId(),
+          email: 'user3@example.com',
+          emails: [{ email: 'user3@example.com' }],
+        },
+      ]
+
+      emailList = [
+        'user1@example.com',
+        'user2@example.com',
+        'new-user@example.com', // primary email of existing user
+        'new-user-2@example.com', // secondary email of existing user
+      ]
+      callUpdateGroupMembersBulk = async (options = {}) => {
+        this.Subscription.findOne = sinon
+          .stub()
+          .returns({ exec: sinon.stub().resolves(this.subscription) })
+
+        this.User.find = sinon
+          .stub()
+          .returns({ exec: sinon.stub().resolves(members) })
+
+        return await this.Handler.promises.updateGroupMembersBulk(
+          inviterId,
+          this.subscription._id,
+          emailList,
+          options
+        )
+      }
+    })
+
+    it('throws an error when any of the emails is invalid', async function () {
+      emailList.push('invalid@email')
+
+      await expect(
+        callUpdateGroupMembersBulk({ commit: true })
+      ).to.be.rejectedWith(InvalidEmailError)
+    })
+
+    describe('with commit = false', function () {
+      describe('with removeMembersNotIncluded = false', function () {
+        it('should preview zero users to delete, and should not send invites', async function () {
+          const result = await callUpdateGroupMembersBulk()
+
+          expect(result).to.deep.equal({
+            emailsToSendInvite: [
+              'new-user@example.com',
+              'new-user-2@example.com',
+            ],
+            emailsToRevokeInvite: [],
+            membersToRemove: [],
+            currentMemberCount: 3,
+            newTotalCount: 5,
+            membersLimit: this.subscription.membersLimit,
+          })
+
+          expect(this.TeamInvitesHandler.promises.createInvite).not.to.have.been
+            .called
+
+          expect(this.SubscriptionUpdater.promises.removeUserFromGroup).not.to
+            .have.been.called
+        })
+      })
+
+      describe('with removeMembersNotIncluded = true', function () {
+        it('should preview the users to be deleted, and should not send invites', async function () {
+          const result = await callUpdateGroupMembersBulk({
+            removeMembersNotIncluded: true,
+          })
+
+          expect(result).to.deep.equal({
+            emailsToSendInvite: [
+              'new-user@example.com',
+              'new-user-2@example.com',
+            ],
+            emailsToRevokeInvite: [],
+            membersToRemove: [members[2]._id],
+            currentMemberCount: 3,
+            newTotalCount: 4,
+            membersLimit: this.subscription.membersLimit,
+          })
+
+          expect(this.TeamInvitesHandler.promises.createInvite).not.to.have.been
+            .called
+
+          expect(this.SubscriptionUpdater.promises.removeUserFromGroup).not.to
+            .have.been.called
+        })
+
+        it('should preview but not revoke invites to emails that are no longer invited', async function () {
+          this.subscription.teamInvites = [
+            { email: 'new-user@example.com' },
+            { email: 'no-longer-invited@example.com' },
+          ]
+
+          const result = await callUpdateGroupMembersBulk({
+            removeMembersNotIncluded: true,
+          })
+
+          expect(result.emailsToRevokeInvite).to.deep.equal([
+            'no-longer-invited@example.com',
+          ])
+
+          expect(this.TeamInvitesHandler.promises.revokeInvite).not.to.have.been
+            .called
+        })
+      })
+
+      it('does not throw an error when the member limit is reached', async function () {
+        this.subscription.membersLimit = 3
+        const result = await callUpdateGroupMembersBulk()
+
+        expect(result.membersLimit).to.equal(3)
+        expect(result.newTotalCount).to.equal(5)
+      })
+    })
+
+    describe('with commit = true', function () {
+      describe('with removeMembersNotIncluded = false', function () {
+        it('should preview zero users to delete, and should send invites', async function () {
+          const result = await callUpdateGroupMembersBulk({ commit: true })
+
+          expect(result).to.deep.equal({
+            emailsToSendInvite: [
+              'new-user@example.com',
+              'new-user-2@example.com',
+            ],
+            emailsToRevokeInvite: [],
+            membersToRemove: [],
+            currentMemberCount: 3,
+            newTotalCount: 5,
+            membersLimit: this.subscription.membersLimit,
+          })
+
+          expect(this.SubscriptionUpdater.promises.removeUserFromGroup).not.to
+            .have.been.called
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite.callCount
+          ).to.equal(2)
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user@example.com'
+          )
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user-2@example.com'
+          )
+        })
+
+        it('should not send invites to emails already invited', async function () {
+          this.subscription.teamInvites = [{ email: 'new-user@example.com' }]
+
+          const result = await callUpdateGroupMembersBulk({ commit: true })
+
+          expect(result.emailsToSendInvite).to.deep.equal([
+            'new-user-2@example.com',
+          ])
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite.callCount
+          ).to.equal(1)
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user-2@example.com'
+          )
+        })
+
+        it('should preview and not revoke invites to emails that are no longer invited', async function () {
+          this.subscription.teamInvites = [
+            { email: 'new-user@example.com' },
+            { email: 'no-longer-invited@example.com' },
+          ]
+
+          const result = await callUpdateGroupMembersBulk({
+            commit: true,
+          })
+
+          expect(result.emailsToRevokeInvite).to.deep.equal([])
+
+          expect(this.TeamInvitesHandler.promises.revokeInvite).not.to.have.been
+            .called
+        })
+      })
+
+      describe('with removeMembersNotIncluded = true', function () {
+        it('should remove users from group, and should send invites', async function () {
+          const result = await callUpdateGroupMembersBulk({
+            commit: true,
+            removeMembersNotIncluded: true,
+          })
+
+          expect(result).to.deep.equal({
+            emailsToSendInvite: [
+              'new-user@example.com',
+              'new-user-2@example.com',
+            ],
+            emailsToRevokeInvite: [],
+            membersToRemove: [members[2]._id],
+            currentMemberCount: 3,
+            newTotalCount: 4,
+            membersLimit: this.subscription.membersLimit,
+          })
+
+          expect(
+            this.SubscriptionUpdater.promises.removeUserFromGroup.callCount
+          ).to.equal(1)
+
+          expect(
+            this.SubscriptionUpdater.promises.removeUserFromGroup
+          ).to.have.been.calledWith(this.subscription._id, members[2]._id, {
+            initiatorId: inviterId,
+          })
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite.callCount
+          ).to.equal(2)
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user@example.com'
+          )
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user-2@example.com'
+          )
+        })
+
+        it('should send invites and revoke invites to emails no longer invited', async function () {
+          this.subscription.teamInvites = [
+            { email: 'new-user@example.com' },
+            { email: 'no-longer-invited@example.com' },
+          ]
+
+          const result = await callUpdateGroupMembersBulk({
+            commit: true,
+            removeMembersNotIncluded: true,
+          })
+
+          expect(result.emailsToSendInvite).to.deep.equal([
+            'new-user-2@example.com',
+          ])
+
+          expect(result.emailsToRevokeInvite).to.deep.equal([
+            'no-longer-invited@example.com',
+          ])
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite.callCount
+          ).to.equal(1)
+
+          expect(
+            this.TeamInvitesHandler.promises.createInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'new-user-2@example.com'
+          )
+
+          expect(
+            this.TeamInvitesHandler.promises.revokeInvite.callCount
+          ).to.equal(1)
+
+          expect(
+            this.TeamInvitesHandler.promises.revokeInvite
+          ).to.have.been.calledWith(
+            inviterId,
+            this.subscription,
+            'no-longer-invited@example.com'
+          )
+        })
+      })
+
+      it('throws an error when the member limit is reached', async function () {
+        this.subscription.membersLimit = 3
+        await expect(
+          callUpdateGroupMembersBulk({ commit: true })
+        ).to.be.rejectedWith('limit reached')
+      })
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionHandlerTests.js b/services/web/test/unit/src/Subscription/SubscriptionHandlerTests.js
index 64e9381b49..7bf23defd2 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionHandlerTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionHandlerTests.js
@@ -3,9 +3,9 @@ const sinon = require('sinon')
 const chai = require('chai')
 const { expect } = chai
 const {
-  RecurlySubscription,
-  RecurlySubscriptionChangeRequest,
-} = require('../../../../app/src/Features/Subscription/RecurlyEntities')
+  PaymentProviderSubscription,
+} = require('../../../../app/src/Features/Subscription/PaymentProviderEntities')
+const SubscriptionHelper = require('../../../../app/src/Features/Subscription/SubscriptionHelper')
 
 const MODULE_PATH =
   '../../../../app/src/Features/Subscription/SubscriptionHandler'
@@ -27,7 +27,7 @@ const mockRecurlySubscriptions = {
 }
 
 const mockRecurlyClientSubscriptions = {
-  'subscription-123-active': new RecurlySubscription({
+  'subscription-123-active': new PaymentProviderSubscription({
     id: 'subscription-123-active',
     userId: 'user-id',
     planCode: 'collaborator',
@@ -114,6 +114,7 @@ describe('SubscriptionHandler', function () {
       promises: {
         updateSubscriptionFromRecurly: sinon.stub().resolves(),
         syncSubscription: sinon.stub().resolves(),
+        syncStripeSubscription: sinon.stub().resolves(),
         startFreeTrial: sinon.stub().resolves(),
       },
     }
@@ -149,12 +150,20 @@ describe('SubscriptionHandler', function () {
         '../../models/User': {
           User: this.User,
         },
+        './SubscriptionHelper': SubscriptionHelper,
         './SubscriptionUpdater': this.SubscriptionUpdater,
         './SubscriptionLocator': this.SubscriptionLocator,
         './LimitationsManager': this.LimitationsManager,
         '../Email/EmailHandler': this.EmailHandler,
         '../Analytics/AnalyticsManager': this.AnalyticsManager,
         '../User/UserUpdater': this.UserUpdater,
+        '../../infrastructure/Modules': (this.Modules = {
+          promises: {
+            hooks: {
+              fire: sinon.stub(),
+            },
+          },
+        }),
       },
     })
   })
@@ -250,151 +259,107 @@ describe('SubscriptionHandler', function () {
   })
 
   describe('updateSubscription', function () {
-    describe('with a user with a subscription', function () {
-      beforeEach(async function () {
-        this.user.id = this.activeRecurlySubscription.account.account_code
-        this.User.findById = (userId, projection) => ({
-          exec: () => {
-            userId.should.equal(this.user.id)
-            return Promise.resolve(this.user)
-          },
-        })
-        this.plan_code = 'professional'
-        this.LimitationsManager.promises.userHasSubscription.resolves({
-          hasSubscription: true,
-          subscription: this.subscription,
-        })
-        await this.SubscriptionHandler.promises.updateSubscription(
-          this.user,
-          this.plan_code,
-          null
-        )
-      })
-
-      it('should update the subscription', function () {
-        expect(
-          this.RecurlyClient.promises.applySubscriptionChangeRequest
-        ).to.have.been.calledWith(
-          new RecurlySubscriptionChangeRequest({
-            subscription: this.activeRecurlyClientSubscription,
-            timeframe: 'now',
-            planCode: this.plan_code,
-          })
-        )
-      })
-
-      it('should sync the new subscription to the user', function () {
-        expect(this.SubscriptionUpdater.promises.syncSubscription).to.have.been
-          .called
-
-        this.SubscriptionUpdater.promises.syncSubscription.args[0][0].should.deep.equal(
-          this.activeRecurlySubscription
-        )
-        this.SubscriptionUpdater.promises.syncSubscription.args[0][1].should.deep.equal(
-          this.user._id
-        )
+    beforeEach(function () {
+      this.user.id = this.activeRecurlySubscription.account.account_code
+      this.User.findById = (userId, projection) => ({
+        exec: () => {
+          userId.should.equal(this.user.id)
+          return Promise.resolve(this.user)
+        },
       })
     })
 
-    describe('when plan(s) could not be located in settings', function () {
-      beforeEach(async function () {
-        this.user.id = this.activeRecurlySubscription.account.account_code
-        this.User.findById = (userId, projection) => ({
-          exec: () => {
-            userId.should.equal(this.user.id)
-            return Promise.resolve(this.user)
-          },
-        })
-
-        this.LimitationsManager.promises.userHasSubscription.resolves({
-          hasSubscription: true,
-          subscription: this.subscription,
-        })
+    it('should not fire updatePaidSubscription hook if user has no subscription', async function () {
+      this.LimitationsManager.promises.userHasSubscription.resolves({
+        hasSubscription: false,
+        subscription: null,
       })
+      await this.SubscriptionHandler.promises.updateSubscription(
+        this.user,
+        this.plan_code
+      )
+      expect(this.Modules.promises.hooks.fire).to.not.have.been.calledWith(
+        'updatePaidSubscription',
+        sinon.match.any,
+        sinon.match.any,
+        sinon.match.any
+      )
+    })
 
-      it('should be rejected and should not update the subscription', function () {
-        expect(
-          this.SubscriptionHandler.promises.updateSubscription(
-            this.user,
-            'unknown-plan',
-            null
-          )
-        ).to.be.rejected
-        this.RecurlyClient.promises.applySubscriptionChangeRequest.called.should.equal(
-          false
-        )
+    it('should not fire updatePaidSubscription hook if user has custom subscription', async function () {
+      this.LimitationsManager.promises.userHasSubscription.resolves({
+        hasSubscription: true,
+        subscription: { customAccount: true },
+      })
+      await this.SubscriptionHandler.promises.updateSubscription(
+        this.user,
+        this.plan_code
+      )
+      expect(this.Modules.promises.hooks.fire).to.not.have.been.calledWith(
+        'updatePaidSubscription',
+        sinon.match.any,
+        sinon.match.any,
+        sinon.match.any
+      )
+    })
+
+    it('should fire updatePaidSubscription to update a valid subscription', async function () {
+      this.LimitationsManager.promises.userHasSubscription.resolves({
+        hasSubscription: true,
+        subscription: this.subscription,
+      })
+      await this.SubscriptionHandler.promises.updateSubscription(
+        this.user,
+        this.plan_code
+      )
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'updatePaidSubscription',
+        this.subscription,
+        this.plan_code,
+        this.user._id
+      )
+    })
+  })
+
+  describe('cancelPendingSubscriptionChange', function () {
+    beforeEach(function () {
+      this.user.id = this.activeRecurlySubscription.account.account_code
+      this.User.findById = (userId, projection) => ({
+        exec: () => {
+          userId.should.equal(this.user.id)
+          return Promise.resolve(this.user)
+        },
       })
     })
 
-    describe('with a user without a subscription', function () {
-      beforeEach(async function () {
-        this.LimitationsManager.promises.userHasSubscription.resolves(false)
-        await this.SubscriptionHandler.promises.updateSubscription(
-          this.user,
-          this.plan_code,
-          null
-        )
-      })
-
-      it('should redirect to the subscription dashboard', function () {
-        this.RecurlyClient.promises.applySubscriptionChangeRequest.called.should.equal(
-          false
-        )
-        this.SubscriptionUpdater.promises.syncSubscription.called.should.equal(
-          false
-        )
+    it('should not fire cancelPendingPaidSubscriptionChange hook if user has no subscription', async function () {
+      this.LimitationsManager.promises.userHasSubscription.resolves({
+        hasSubscription: false,
+        subscription: null,
       })
+      await this.SubscriptionHandler.promises.cancelPendingSubscriptionChange(
+        this.user,
+        this.plan_code
+      )
+      expect(this.Modules.promises.hooks.fire).to.not.have.been.calledWith(
+        'cancelPendingPaidSubscriptionChange',
+        sinon.match.any
+      )
     })
 
-    describe('with a coupon code', function () {
-      beforeEach(async function () {
-        this.user.id = this.activeRecurlySubscription.account.account_code
-
-        this.User.findById = (userId, projection) => ({
-          exec: () => {
-            userId.should.equal(this.user.id)
-            return Promise.resolve(this.user)
-          },
-        })
-        this.plan_code = 'collaborator'
-        this.coupon_code = '1231312'
-        this.LimitationsManager.promises.userHasSubscription.resolves({
-          hasSubscription: true,
-          subscription: this.subscription,
-        })
-        await this.SubscriptionHandler.promises.updateSubscription(
-          this.user,
-          this.plan_code,
-          this.coupon_code
-        )
-      })
-
-      it('should get the users account', function () {
-        this.RecurlyWrapper.promises.getSubscription
-          .calledWith(this.activeRecurlySubscription.uuid)
-          .should.equal(true)
-      })
-
-      it('should redeem the coupon', function () {
-        this.RecurlyWrapper.promises.redeemCoupon
-          .calledWith(
-            this.activeRecurlySubscription.account.account_code,
-            this.coupon_code
-          )
-          .should.equal(true)
-      })
-
-      it('should update the subscription', function () {
-        expect(
-          this.RecurlyClient.promises.applySubscriptionChangeRequest
-        ).to.be.calledWith(
-          new RecurlySubscriptionChangeRequest({
-            subscription: this.activeRecurlyClientSubscription,
-            timeframe: 'now',
-            planCode: this.plan_code,
-          })
-        )
+    it('should fire cancelPendingPaidSubscriptionChange to update a valid subscription', async function () {
+      this.LimitationsManager.promises.userHasSubscription.resolves({
+        hasSubscription: true,
+        subscription: this.subscription,
       })
+      await this.SubscriptionHandler.promises.cancelPendingSubscriptionChange(
+        this.user,
+        this.plan_code
+      )
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'cancelPendingPaidSubscriptionChange',
+        this.subscription
+      )
     })
   })
 
@@ -425,12 +390,10 @@ describe('SubscriptionHandler', function () {
       })
 
       it('should cancel the subscription', function () {
-        this.RecurlyClient.promises.cancelSubscriptionByUuid.called.should.equal(
-          true
+        expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+          'cancelPaidSubscription',
+          this.subscription
         )
-        this.RecurlyClient.promises.cancelSubscriptionByUuid
-          .calledWith(this.subscription.recurlySubscription_id)
-          .should.equal(true)
       })
 
       it('should send the email after 1 hour', function () {
@@ -625,12 +588,10 @@ describe('SubscriptionHandler', function () {
       })
 
       it('should reactivate the subscription', function () {
-        this.RecurlyClient.promises.reactivateSubscriptionByUuid.called.should.equal(
-          true
+        expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+          'reactivatePaidSubscription',
+          this.subscription
         )
-        this.RecurlyClient.promises.reactivateSubscriptionByUuid
-          .calledWith(this.subscription.recurlySubscription_id)
-          .should.equal(true)
       })
 
       it('should send a notification email', function () {
diff --git a/services/web/test/unit/src/Subscription/SubscriptionHelperTests.js b/services/web/test/unit/src/Subscription/SubscriptionHelperTests.js
index a6e1ffa089..4c618221ca 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionHelperTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionHelperTests.js
@@ -102,38 +102,65 @@ describe('SubscriptionHelper', function () {
   })
 
   describe('shouldPlanChangeAtTermEnd', function () {
-    it('should return true if the new plan is less expensive', function () {
+    it('should return false if isInTrial is true', function () {
+      const isInTrial = true
       const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
         plans.expensive,
-        plans.cheaper
+        plans.cheaper,
+        isInTrial
+      )
+      expect(changeAtTermEnd).to.be.false
+    })
+
+    it('should return true if the new plan is less expensive', function () {
+      const isInTrial = false
+      const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
+        plans.expensive,
+        plans.cheaper,
+        isInTrial
       )
       expect(changeAtTermEnd).to.be.true
     })
+
     it('should return false if the new plan is more exepensive', function () {
+      const isInTrial = false
       const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
         plans.cheaper,
-        plans.expensive
+        plans.expensive,
+        isInTrial
       )
       expect(changeAtTermEnd).to.be.false
     })
+
     it('should return false if the new plan is the same price', function () {
+      const isInTrial = false
+
       const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
         plans.cheaper,
-        plans.alsoCheap
+        plans.alsoCheap,
+        isInTrial
       )
       expect(changeAtTermEnd).to.be.false
     })
+
     it('should return false if the change is from an individual plan to a more expensive group plan', function () {
+      const isInTrial = false
+
       const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
         plans.expensive,
-        plans.expensiveGroup
+        plans.expensiveGroup,
+        isInTrial
       )
       expect(changeAtTermEnd).to.be.false
     })
+
     it('should return true if the change is from an individual plan to a cheaper group plan', function () {
+      const isInTrial = false
+
       const changeAtTermEnd = this.SubscriptionHelper.shouldPlanChangeAtTermEnd(
         plans.expensive,
-        plans.cheapGroup
+        plans.cheapGroup,
+        isInTrial
       )
       expect(changeAtTermEnd).to.be.true
     })
@@ -157,10 +184,6 @@ describe('SubscriptionHelper', function () {
             collaborator: '5 CHF',
             professional: '50 CHF',
           },
-          pricePerUserPerMonth: {
-            collaborator: '0,45 CHF',
-            professional: '4,20 CHF',
-          },
         })
       })
     })
@@ -182,10 +205,6 @@ describe('SubscriptionHelper', function () {
             collaborator: '10 kr.',
             professional: '100 kr.',
           },
-          pricePerUserPerMonth: {
-            collaborator: '0,85 kr.',
-            professional: '8,35 kr.',
-          },
         })
       })
     })
@@ -207,10 +226,6 @@ describe('SubscriptionHelper', function () {
             collaborator: '15 kr',
             professional: '150 kr',
           },
-          pricePerUserPerMonth: {
-            collaborator: '1,25 kr',
-            professional: '12,50 kr',
-          },
         })
       })
     })
@@ -234,10 +249,6 @@ describe('SubscriptionHelper', function () {
             collaborator: 'kr 20',
             professional: 'kr 200',
           },
-          pricePerUserPerMonth: {
-            collaborator: 'kr 1.70',
-            professional: 'kr 16.70',
-          },
         })
       })
     })
@@ -259,12 +270,233 @@ describe('SubscriptionHelper', function () {
             collaborator: '$25',
             professional: '$250',
           },
-          pricePerUserPerMonth: {
-            collaborator: '$2.10',
-            professional: '$20.85',
-          },
         })
       })
     })
   })
+
+  describe('isPaidSubscription', function () {
+    it('should return true for a subscription with a recurly subscription id', function () {
+      const result = this.SubscriptionHelper.isPaidSubscription({
+        recurlySubscription_id: 'some-id',
+      })
+      expect(result).to.be.true
+    })
+
+    it('should return true for a subscription with a stripe subscription id', function () {
+      const result = this.SubscriptionHelper.isPaidSubscription({
+        paymentProvider: { subscriptionId: 'some-id' },
+      })
+      expect(result).to.be.true
+    })
+
+    it('should return false for a free subscription', function () {
+      const result = this.SubscriptionHelper.isPaidSubscription({})
+      expect(result).to.be.false
+    })
+
+    it('should return false for a missing subscription', function () {
+      const result = this.SubscriptionHelper.isPaidSubscription()
+      expect(result).to.be.false
+    })
+  })
+
+  describe('isIndividualActivePaidSubscription', function () {
+    it('should return true for an active recurly subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          recurlyStatus: { state: 'active' },
+          recurlySubscription_id: 'some-id',
+        }
+      )
+      expect(result).to.be.true
+    })
+
+    it('should return true for an active stripe subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          paymentProvider: { subscriptionId: 'sub_123', state: 'active' },
+        }
+      )
+      expect(result).to.be.true
+    })
+
+    it('should return false for a canceled recurly subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          recurlyStatus: { state: 'canceled' },
+          recurlySubscription_id: 'some-id',
+        }
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a canceled stripe subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          paymentProvider: { state: 'canceled', subscriptionId: 'sub_123' },
+        }
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a group plan subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: true,
+          recurlyStatus: { state: 'active' },
+          recurlySubscription_id: 'some-id',
+        }
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a free subscription', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {}
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a subscription with an empty string for recurlySubscription_id', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          recurlySubscription_id: '',
+          recurlyStatus: { state: 'active' },
+        }
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a subscription with an empty string for paymentProvider.subscriptionId', function () {
+      const result = this.SubscriptionHelper.isIndividualActivePaidSubscription(
+        {
+          groupPlan: false,
+          paymentProvider: { state: 'active', subscriptionId: '' },
+        }
+      )
+      expect(result).to.be.false
+    })
+
+    it('should return false for a missing subscription', function () {
+      const result = this.SubscriptionHelper.isPaidSubscription()
+      expect(result).to.be.false
+    })
+  })
+
+  describe('getPaymentProviderSubscriptionId', function () {
+    it('should return the recurly subscription id if it exists', function () {
+      const result = this.SubscriptionHelper.getPaymentProviderSubscriptionId({
+        recurlySubscription_id: 'some-id',
+      })
+      expect(result).to.equal('some-id')
+    })
+
+    it('should return the payment provider subscription id if it exists', function () {
+      const result = this.SubscriptionHelper.getPaymentProviderSubscriptionId({
+        paymentProvider: { subscriptionId: 'sub_123' },
+      })
+      expect(result).to.equal('sub_123')
+    })
+
+    it('should return null if no subscription id exists', function () {
+      const result = this.SubscriptionHelper.getPaymentProviderSubscriptionId(
+        {}
+      )
+      expect(result).to.be.null
+    })
+  })
+
+  describe('getPaidSubscriptionState', function () {
+    it('should return the recurly state if it exists', function () {
+      const result = this.SubscriptionHelper.getPaidSubscriptionState({
+        recurlyStatus: { state: 'active' },
+      })
+      expect(result).to.equal('active')
+    })
+
+    it('should return the payment provider state if it exists', function () {
+      const result = this.SubscriptionHelper.getPaidSubscriptionState({
+        paymentProvider: { state: 'active' },
+      })
+      expect(result).to.equal('active')
+    })
+
+    it('should return null if no state exists', function () {
+      const result = this.SubscriptionHelper.getPaidSubscriptionState({})
+      expect(result).to.be.null
+    })
+  })
+
+  describe('getSubscriptionTrialStartedAt', function () {
+    it('should return the recurly trial start date if it exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialStartedAt({
+        recurlySubscription_id: 'some-id',
+        recurlyStatus: { trialStartedAt: new Date('2023-01-01') },
+      })
+      expect(result).to.deep.equal(new Date('2023-01-01'))
+    })
+
+    it('should return the payment provider trial start date if it exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialStartedAt({
+        recurlyStatus: {},
+        paymentProvider: { trialStartedAt: new Date('2023-01-01') },
+      })
+      expect(result).to.deep.equal(new Date('2023-01-01'))
+    })
+
+    it('should return undefined if no trial start date exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialStartedAt({})
+      expect(result).to.be.undefined
+    })
+  })
+
+  describe('getSubscriptionTrialEndsAt', function () {
+    it('should return the recurly trial end date if it exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialEndsAt({
+        recurlySubscription_id: 'some-id',
+        recurlyStatus: { trialEndsAt: new Date('2023-01-01') },
+      })
+      expect(result).to.deep.equal(new Date('2023-01-01'))
+    })
+
+    it('should return the payment provider trial end date if it exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialEndsAt({
+        recurlyStatus: {},
+        paymentProvider: { trialEndsAt: new Date('2023-01-01') },
+      })
+      expect(result).to.deep.equal(new Date('2023-01-01'))
+    })
+
+    it('should return undefined if no trial end date exists', function () {
+      const result = this.SubscriptionHelper.getSubscriptionTrialEndsAt({})
+      expect(result).to.be.undefined
+    })
+  })
+
+  describe('isInTrial', function () {
+    it('should return false if trialEndsAt is null', function () {
+      const result = this.SubscriptionHelper.isInTrial(null)
+      expect(result).to.be.false
+    })
+
+    it('should return false if trialEndsAt is before now', function () {
+      const tenDaysAgo = new Date()
+      tenDaysAgo.setDate(tenDaysAgo.getDate() - 10)
+      const result = this.SubscriptionHelper.isInTrial(tenDaysAgo)
+      expect(result).to.be.false
+    })
+
+    it('should return true if trialEndsAt is after now', function () {
+      const tenDaysFromNow = new Date()
+      tenDaysFromNow.setDate(tenDaysFromNow.getDate() + 10)
+      const result = this.SubscriptionHelper.isInTrial(tenDaysFromNow)
+      expect(result).to.be.true
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionLocatorTests.js b/services/web/test/unit/src/Subscription/SubscriptionLocatorTests.js
index f66eda5b7f..e8202424fc 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionLocatorTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionLocatorTests.js
@@ -13,6 +13,11 @@ describe('Subscription Locator Tests', function () {
         exec: sinon.stub().resolves(),
       }),
       find: sinon.stub().returns({
+        populate: sinon.stub().returns({
+          populate: sinon.stub().returns({
+            exec: sinon.stub().resolves([]),
+          }),
+        }),
         exec: sinon.stub().resolves(),
       }),
     }
@@ -77,4 +82,110 @@ describe('Subscription Locator Tests', function () {
       subscription.should.equal(this.subscription)
     })
   })
+
+  describe('getUserSubscriptionStatus', function () {
+    it('should return no active personal or group subscription when no user is passed', async function () {
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          undefined
+        )
+      expect(subscriptionStatus).to.deep.equal({
+        personal: false,
+        group: false,
+      })
+    })
+
+    it('should return no active personal or group subscription when the user has no subscription', async function () {
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          this.user._id
+        )
+      expect(subscriptionStatus).to.deep.equal({
+        personal: false,
+        group: false,
+      })
+    })
+
+    it('should return active personal subscription', async function () {
+      this.Subscription.findOne.returns({
+        exec: sinon.stub().resolves({
+          recurlyStatus: {
+            state: 'active',
+          },
+        }),
+      })
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          this.user._id
+        )
+      expect(subscriptionStatus).to.deep.equal({ personal: true, group: false })
+    })
+
+    it('should return active group subscription when member of a group plan', async function () {
+      this.Subscription.find.returns({
+        populate: sinon.stub().returns({
+          populate: sinon.stub().returns({
+            exec: sinon.stub().resolves([
+              {
+                recurlyStatus: {
+                  state: 'active',
+                },
+                groupPlan: true,
+              },
+            ]),
+          }),
+        }),
+      })
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          this.user._id
+        )
+      expect(subscriptionStatus).to.deep.equal({ personal: false, group: true })
+    })
+
+    it('should return active group subscription when owner of a group plan', async function () {
+      this.Subscription.findOne.returns({
+        exec: sinon.stub().resolves({
+          recurlyStatus: {
+            state: 'active',
+          },
+          groupPlan: true,
+        }),
+      })
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          this.user._id
+        )
+      expect(subscriptionStatus).to.deep.equal({ personal: false, group: true })
+    })
+
+    it('should return active personal and group subscription when has personal subscription and member of a group', async function () {
+      this.Subscription.find.returns({
+        populate: sinon.stub().returns({
+          populate: sinon.stub().returns({
+            exec: sinon.stub().resolves([
+              {
+                recurlyStatus: {
+                  state: 'active',
+                },
+                groupPlan: true,
+              },
+            ]),
+          }),
+        }),
+      })
+      this.Subscription.findOne.returns({
+        exec: sinon.stub().resolves({
+          recurlyStatus: {
+            state: 'active',
+          },
+        }),
+      })
+      const subscriptionStatus =
+        await this.SubscriptionLocator.promises.getUserSubscriptionStatus(
+          this.user._id
+        )
+      expect(subscriptionStatus).to.deep.equal({ personal: true, group: true })
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionUpdaterTests.js b/services/web/test/unit/src/Subscription/SubscriptionUpdaterTests.js
index 666f7ffda9..d272ad51e4 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionUpdaterTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionUpdaterTests.js
@@ -70,6 +70,7 @@ describe('SubscriptionUpdater', function () {
       .stub()
       .returns({ exec: sinon.stub().resolves() })
     this.SubscriptionModel.findOne = sinon.stub().resolves()
+    this.SubscriptionModel.findById = sinon.stub().resolves()
     this.SubscriptionModel.updateMany = sinon
       .stub()
       .returns({ exec: sinon.stub().resolves() })
@@ -120,6 +121,18 @@ describe('SubscriptionUpdater', function () {
           },
         },
       ],
+      mongo: {
+        options: {
+          appname: 'web',
+          maxPoolSize: 100,
+          serverSelectionTimeoutMS: 60000,
+          socketTimeoutMS: 60000,
+          monitorCommands: true,
+          family: 4,
+        },
+        url: 'mongodb://mongo/test-overleaf',
+        hasSecondaries: false,
+      },
     }
 
     this.UserFeaturesUpdater = {
@@ -161,6 +174,12 @@ describe('SubscriptionUpdater', function () {
       },
     }
 
+    this.UserUpdater = {
+      promises: {
+        updateUser: sinon.stub().resolves(),
+      },
+    }
+
     this.SubscriptionUpdater = SandboxedModule.require(modulePath, {
       requires: {
         '../../models/Subscription': {
@@ -181,6 +200,14 @@ describe('SubscriptionUpdater', function () {
         }),
         '../../infrastructure/Features': this.Features,
         '../User/UserAuditLogHandler': this.UserAuditLogHandler,
+        '../User/UserUpdater': this.UserUpdater,
+        '../../infrastructure/Modules': (this.Modules = {
+          promises: {
+            hooks: {
+              fire: sinon.stub().resolves(),
+            },
+          },
+        }),
       },
     })
   })
@@ -486,6 +513,7 @@ describe('SubscriptionUpdater', function () {
       this.SubscriptionModel.updateOne
         .calledWith(searchOps, insertOperation)
         .should.equal(true)
+      expect(this.SubscriptionModel.updateOne.lastCall.args[2].session).to.exist
       sinon.assert.calledWith(
         this.AnalyticsManager.recordEventForUserInBackground,
         this.otherUserId,
@@ -571,6 +599,24 @@ describe('SubscriptionUpdater', function () {
         }
       )
     })
+
+    it('should add an entry to the group audit log when joining a group', async function () {
+      await this.SubscriptionUpdater.promises.addUserToGroup(
+        this.subscription._id,
+        this.otherUserId,
+        { ipAddress: '0:0:0:0', initiatorId: 'user123' }
+      )
+
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'addGroupAuditLogEntry',
+        {
+          groupId: this.subscription._id,
+          initiatorId: 'user123',
+          ipAddress: '0:0:0:0',
+          operation: 'join-group',
+        }
+      )
+    })
   })
 
   describe('removeUserFromGroup', function () {
@@ -584,6 +630,9 @@ describe('SubscriptionUpdater', function () {
         },
       ]
       this.SubscriptionModel.findOne.resolves(this.groupSubscription)
+      this.SubscriptionModel.findById = sinon
+        .stub()
+        .resolves(this.groupSubscription)
       this.SubscriptionLocator.promises.getMemberSubscriptions.resolves(
         this.fakeSubscriptions
       )
@@ -600,6 +649,28 @@ describe('SubscriptionUpdater', function () {
         .should.equal(true)
     })
 
+    it('should remove user enrollment if the group is managed', async function () {
+      this.SubscriptionModel.findById.resolves({
+        ...this.groupSubscription,
+        managedUsersEnabled: true,
+      })
+      await this.SubscriptionUpdater.promises.removeUserFromGroup(
+        this.groupSubscription._id,
+        this.otherUserId
+      )
+      this.UserUpdater.promises.updateUser
+        .calledWith(
+          { _id: this.otherUserId },
+          {
+            $unset: {
+              'enrollment.managedBy': 1,
+              'enrollment.enrolledAt': 1,
+            },
+          }
+        )
+        .should.equal(true)
+    })
+
     it('should send a group-subscription-left event', async function () {
       await this.SubscriptionUpdater.promises.removeUserFromGroup(
         this.groupSubscription._id,
@@ -801,4 +872,38 @@ describe('SubscriptionUpdater', function () {
       }
     })
   })
+
+  describe('scheduleRefreshFeatures', function () {
+    it('should call upgrades feature for personal subscription from admin_id', async function () {
+      this.subscription = {
+        _id: new ObjectId().toString(),
+        mock: 'subscription',
+        admin_id: new ObjectId(),
+      }
+
+      await this.SubscriptionUpdater.promises.scheduleRefreshFeatures(
+        this.subscription
+      )
+
+      expect(
+        this.FeaturesUpdater.promises.scheduleRefreshFeatures
+      ).to.have.been.calledOnceWith(this.subscription.admin_id)
+    })
+
+    it('should call upgrades feature for group subscription from admin_id and member_ids', async function () {
+      this.subscription = {
+        _id: new ObjectId().toString(),
+        mock: 'subscription',
+        admin_id: new ObjectId(),
+        member_ids: [new ObjectId(), new ObjectId(), new ObjectId()],
+      }
+      await this.SubscriptionUpdater.promises.scheduleRefreshFeatures(
+        this.subscription
+      )
+
+      expect(
+        this.FeaturesUpdater.promises.scheduleRefreshFeatures.callCount
+      ).to.equal(4)
+    })
+  })
 })
diff --git a/services/web/test/unit/src/Subscription/SubscriptionViewModelBuilderTests.js b/services/web/test/unit/src/Subscription/SubscriptionViewModelBuilderTests.js
index c1075f1a60..235abf600e 100644
--- a/services/web/test/unit/src/Subscription/SubscriptionViewModelBuilderTests.js
+++ b/services/web/test/unit/src/Subscription/SubscriptionViewModelBuilderTests.js
@@ -1,6 +1,14 @@
 const SandboxedModule = require('sandboxed-module')
 const sinon = require('sinon')
 const { assert } = require('chai')
+const {
+  PaymentProviderAccount,
+  PaymentProviderSubscription,
+  PaymentProviderSubscriptionAddOn,
+  PaymentProviderSubscriptionChange,
+} = require('../../../../app/src/Features/Subscription/PaymentProviderEntities')
+const SubscriptionHelper = require('../../../../app/src/Features/Subscription/SubscriptionHelper')
+
 const modulePath =
   '../../../../app/src/Features/Subscription/SubscriptionViewModelBuilder'
 
@@ -18,6 +26,11 @@ describe('SubscriptionViewModelBuilder', function () {
       planCode: this.planCode,
       features: this.planFeatures,
     }
+    this.annualPlanCode = 'collaborator_annual'
+    this.annualPlan = {
+      planCode: this.annualPlanCode,
+      features: this.planFeatures,
+    }
     this.individualSubscription = {
       planCode: this.planCode,
       plan: this.plan,
@@ -26,6 +39,29 @@ describe('SubscriptionViewModelBuilder', function () {
         state: 'active',
       },
     }
+    this.paymentRecord = new PaymentProviderSubscription({
+      id: this.recurlySubscription_id,
+      userId: this.user._id,
+      currency: 'EUR',
+      planCode: 'plan-code',
+      planName: 'plan-name',
+      planPrice: 13,
+      addOns: [
+        new PaymentProviderSubscriptionAddOn({
+          code: 'addon-code',
+          name: 'addon name',
+          quantity: 1,
+          unitPrice: 2,
+        }),
+      ],
+      subtotal: 15,
+      taxRate: 0.1,
+      taxAmount: 1.5,
+      total: 16.5,
+      periodStart: new Date('2025-01-20T12:00:00.000Z'),
+      periodEnd: new Date('2025-02-20T12:00:00.000Z'),
+      collectionMethod: 'automatic',
+    })
 
     this.individualCustomSubscription = {
       planCode: this.planCode,
@@ -42,6 +78,9 @@ describe('SubscriptionViewModelBuilder', function () {
     this.groupPlan = {
       planCode: this.groupPlanCode,
       features: this.groupPlanFeatures,
+      membersLimit: 4,
+      membersLimitAddOn: 'additional-license',
+      groupPlan: true,
     }
     this.groupSubscription = {
       planCode: this.groupPlanCode,
@@ -75,18 +114,29 @@ describe('SubscriptionViewModelBuilder', function () {
         getUsersSubscription: sinon.stub().resolves(),
         getMemberSubscriptions: sinon.stub().resolves(),
       },
+      getUsersSubscription: sinon.stub().yields(),
+      getMemberSubscriptions: sinon.stub().yields(null, []),
+      getManagedGroupSubscriptions: sinon.stub().yields(null, []),
       findLocalPlanInSettings: sinon.stub(),
     }
     this.InstitutionsGetter = {
       promises: {
         getCurrentInstitutionsWithLicence: sinon.stub().resolves(),
       },
+      getCurrentInstitutionsWithLicence: sinon.stub().yields(null, []),
+      getManagedInstitutions: sinon.stub().yields(null, []),
     }
     this.InstitutionsManager = {
       promises: {
         fetchV1Data: sinon.stub().resolves(),
       },
     }
+    this.PublishersGetter = {
+      promises: {
+        fetchV1Data: sinon.stub().resolves(),
+      },
+      getManagedPublishers: sinon.stub().yields(null, []),
+    }
     this.RecurlyWrapper = {
       promises: {
         getSubscription: sinon.stub().resolves(),
@@ -100,6 +150,11 @@ describe('SubscriptionViewModelBuilder', function () {
     this.PlansLocator = {
       findLocalPlanInSettings: sinon.stub(),
     }
+    this.SplitTestHandler = {
+      promises: {
+        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
+      },
+    }
     this.SubscriptionViewModelBuilder = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/settings': this.Settings,
@@ -109,26 +164,34 @@ describe('SubscriptionViewModelBuilder', function () {
         './RecurlyWrapper': this.RecurlyWrapper,
         './SubscriptionUpdater': this.SubscriptionUpdater,
         './PlansLocator': this.PlansLocator,
+        '../../infrastructure/Modules': (this.Modules = {
+          promises: { hooks: { fire: sinon.stub().resolves([]) } },
+          hooks: {
+            fire: sinon.stub().yields(null, []),
+          },
+        }),
         './V1SubscriptionManager': {},
-        './SubscriptionFormatters': {},
-        '../Publishers/PublishersGetter': {},
-        './SubscriptionHelper': {},
+        '../Publishers/PublishersGetter': this.PublishersGetter,
+        './SubscriptionHelper': SubscriptionHelper,
+        '../SplitTests/SplitTestHandler': this.SplitTestHandler,
       },
     })
 
     this.PlansLocator.findLocalPlanInSettings
       .withArgs(this.planCode)
       .returns(this.plan)
+      .withArgs(this.annualPlanCode)
+      .returns(this.annualPlan)
       .withArgs(this.groupPlanCode)
       .returns(this.groupPlan)
       .withArgs(this.commonsPlanCode)
       .returns(this.commonsPlan)
   })
 
-  describe('getBestSubscription', function () {
+  describe('getUsersSubscriptionDetails', function () {
     it('should return a free plan when user has no subscription or affiliation', async function () {
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+      const { bestSubscription: usersBestSubscription } =
+        await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
           this.user
         )
       assert.deepEqual(usersBestSubscription, { type: 'free' })
@@ -140,8 +203,8 @@ describe('SubscriptionViewModelBuilder', function () {
           .withArgs(this.user)
           .resolves(this.individualCustomSubscription)
 
-        const usersBestSubscription =
-          await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
             this.user
           )
 
@@ -158,8 +221,8 @@ describe('SubscriptionViewModelBuilder', function () {
           .withArgs(this.user)
           .resolves(this.individualSubscription)
 
-        const usersBestSubscription =
-          await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
             this.user
           )
 
@@ -179,8 +242,8 @@ describe('SubscriptionViewModelBuilder', function () {
           .withArgs(this.user)
           .resolves(this.individualSubscription)
 
-        const usersBestSubscription =
-          await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
             this.user
           )
 
@@ -200,8 +263,8 @@ describe('SubscriptionViewModelBuilder', function () {
           .withArgs(this.user)
           .resolves(this.individualSubscription)
 
-        const usersBestSubscription =
-          await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
             this.user
           )
 
@@ -213,49 +276,116 @@ describe('SubscriptionViewModelBuilder', function () {
         })
       })
 
-      it('should update subscription if recurly data is missing', async function () {
-        this.individualSubscriptionWithoutRecurly = {
+      it('should update subscription if recurly payment state is missing', async function () {
+        this.individualSubscriptionWithoutPaymentState = {
           planCode: this.planCode,
           plan: this.plan,
           recurlySubscription_id: this.recurlySubscription_id,
         }
-        this.recurlySubscription = {
+        this.paymentRecord = {
           state: 'active',
         }
         this.SubscriptionLocator.promises.getUsersSubscription
           .withArgs(this.user)
           .onCall(0)
-          .resolves(this.individualSubscriptionWithoutRecurly)
+          .resolves(this.individualSubscriptionWithoutPaymentState)
           .withArgs(this.user)
           .onCall(1)
           .resolves(this.individualSubscription)
-        this.RecurlyWrapper.promises.getSubscription
-          .withArgs(this.individualSubscription.recurlySubscription_id, {
-            includeAccount: true,
-          })
-          .resolves(this.recurlySubscription)
+        const payment = {
+          subscription: this.paymentRecord,
+          account: new PaymentProviderAccount({}),
+          coupons: [],
+        }
 
-        const usersBestSubscription =
-          await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+        this.Modules.promises.hooks.fire
+          .withArgs(
+            'getPaymentFromRecordPromise',
+            this.individualSubscriptionWithoutPaymentState
+          )
+          .resolves([payment])
+        this.Modules.promises.hooks.fire
+          .withArgs(
+            'syncSubscription',
+            payment,
+            this.individualSubscriptionWithoutPaymentState
+          )
+          .resolves([])
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
             this.user
           )
 
-        sinon.assert.calledWith(
-          this.RecurlyWrapper.promises.getSubscription,
-          this.individualSubscriptionWithoutRecurly.recurlySubscription_id,
-          { includeAccount: true }
-        )
-        sinon.assert.calledWith(
-          this.SubscriptionUpdater.promises.updateSubscriptionFromRecurly,
-          this.recurlySubscription,
-          this.individualSubscriptionWithoutRecurly
-        )
         assert.deepEqual(usersBestSubscription, {
           type: 'individual',
           subscription: this.individualSubscription,
           plan: this.plan,
           remainingTrialDays: -1,
         })
+        assert.isTrue(
+          this.Modules.promises.hooks.fire.withArgs(
+            'getPaymentFromRecordPromise',
+            this.individualSubscriptionWithoutPaymentState
+          ).calledOnce
+        )
+      })
+
+      it('should update subscription if stripe payment state is missing', async function () {
+        this.individualSubscriptionWithoutPaymentState = {
+          planCode: this.planCode,
+          plan: this.plan,
+          paymentProvider: {
+            subscriptionId: this.recurlySubscription_id,
+          },
+        }
+        this.paymentRecord = {
+          state: 'active',
+        }
+        this.SubscriptionLocator.promises.getUsersSubscription
+          .withArgs(this.user)
+          .onCall(0)
+          .resolves(this.individualSubscriptionWithoutPaymentState)
+          .withArgs(this.user)
+          .onCall(1)
+          .resolves(this.individualSubscription)
+        const payment = {
+          subscription: this.paymentRecord,
+          account: new PaymentProviderAccount({}),
+          coupons: [],
+        }
+
+        this.Modules.promises.hooks.fire
+          .withArgs(
+            'getPaymentFromRecordPromise',
+            this.individualSubscriptionWithoutPaymentState
+          )
+          .resolves([payment])
+        this.Modules.promises.hooks.fire
+          .withArgs(
+            'syncSubscription',
+            payment,
+            this.individualSubscriptionWithoutPaymentState
+          )
+          .resolves([])
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'individual',
+          subscription: this.individualSubscription,
+          plan: this.plan,
+          remainingTrialDays: -1,
+        })
+        assert.isTrue(
+          this.Modules.promises.hooks.fire.withArgs(
+            'getPaymentFromRecordPromise',
+            this.individualSubscriptionWithoutPaymentState
+          ).calledOnce
+        )
       })
     })
 
@@ -263,8 +393,8 @@ describe('SubscriptionViewModelBuilder', function () {
       this.SubscriptionLocator.promises.getMemberSubscriptions
         .withArgs(this.user)
         .resolves([this.groupSubscription])
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+      const { bestSubscription: usersBestSubscription } =
+        await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
           this.user
         )
       assert.deepEqual(usersBestSubscription, {
@@ -281,8 +411,8 @@ describe('SubscriptionViewModelBuilder', function () {
         .resolves([
           Object.assign({}, this.groupSubscription, { teamName: 'test team' }),
         ])
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+      const { bestSubscription: usersBestSubscription } =
+        await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
           this.user
         )
       assert.deepEqual(usersBestSubscription, {
@@ -298,8 +428,8 @@ describe('SubscriptionViewModelBuilder', function () {
         .withArgs(this.user._id)
         .resolves([this.commonsSubscription])
 
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
+      const { bestSubscription: usersBestSubscription } =
+        await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
           this.user
         )
 
@@ -309,152 +439,514 @@ describe('SubscriptionViewModelBuilder', function () {
         plan: this.commonsPlan,
       })
     })
+
+    describe('with multiple subscriptions', function () {
+      beforeEach(function () {
+        this.SubscriptionLocator.promises.getUsersSubscription
+          .withArgs(this.user)
+          .resolves(this.individualSubscription)
+        this.SubscriptionLocator.promises.getMemberSubscriptions
+          .withArgs(this.user)
+          .resolves([this.groupSubscription])
+        this.InstitutionsGetter.promises.getCurrentInstitutionsWithLicence
+          .withArgs(this.user._id)
+          .resolves([this.commonsSubscription])
+      })
+
+      it('should return individual when the individual subscription has the best feature set', async function () {
+        this.commonsPlan.features = {
+          compileGroup: 'standard',
+          collaborators: 1,
+          compileTimeout: 60,
+        }
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'individual',
+          subscription: this.individualSubscription,
+          plan: this.plan,
+          remainingTrialDays: -1,
+        })
+      })
+
+      it('should return group when the group subscription has the best feature set', async function () {
+        this.plan.features = {
+          compileGroup: 'standard',
+          collaborators: 1,
+          compileTimeout: 60,
+        }
+        this.commonsPlan.features = {
+          compileGroup: 'standard',
+          collaborators: 1,
+          compileTimeout: 60,
+        }
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'group',
+          subscription: {},
+          plan: this.groupPlan,
+          remainingTrialDays: -1,
+        })
+      })
+
+      it('should return commons when the commons affiliation has the best feature set', async function () {
+        this.plan.features = {
+          compileGroup: 'priority',
+          collaborators: 5,
+          compileTimeout: 240,
+        }
+        this.groupPlan.features = {
+          compileGroup: 'standard',
+          collaborators: 1,
+          compileTimeout: 60,
+        }
+        this.commonsPlan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'commons',
+          subscription: this.commonsSubscription,
+          plan: this.commonsPlan,
+        })
+      })
+
+      it('should return individual with equal feature sets', async function () {
+        this.plan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+        this.groupPlan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+        this.commonsPlan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'individual',
+          subscription: this.individualSubscription,
+          plan: this.plan,
+          remainingTrialDays: -1,
+        })
+      })
+
+      it('should return group over commons with equal feature sets', async function () {
+        this.plan.features = {
+          compileGroup: 'standard',
+          collaborators: 1,
+          compileTimeout: 60,
+        }
+        this.groupPlan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+        this.commonsPlan.features = {
+          compileGroup: 'priority',
+          collaborators: -1,
+          compileTimeout: 240,
+        }
+
+        const { bestSubscription: usersBestSubscription } =
+          await this.SubscriptionViewModelBuilder.promises.getUsersSubscriptionDetails(
+            this.user
+          )
+
+        assert.deepEqual(usersBestSubscription, {
+          type: 'group',
+          subscription: {},
+          plan: this.groupPlan,
+          remainingTrialDays: -1,
+        })
+      })
+    })
   })
 
-  describe('with multiple subscriptions', function () {
+  describe('buildUsersSubscriptionViewModel', function () {
     beforeEach(function () {
-      this.SubscriptionLocator.promises.getUsersSubscription
-        .withArgs(this.user)
-        .resolves(this.individualSubscription)
-      this.SubscriptionLocator.promises.getMemberSubscriptions
-        .withArgs(this.user)
-        .resolves([this.groupSubscription])
-      this.InstitutionsGetter.promises.getCurrentInstitutionsWithLicence
-        .withArgs(this.user._id)
-        .resolves([this.commonsSubscription])
+      this.SubscriptionLocator.getUsersSubscription.yields(
+        null,
+        this.individualSubscription
+      )
+      this.Modules.hooks.fire
+        .withArgs('getPaymentFromRecord', this.individualSubscription)
+        .yields(null, [
+          {
+            subscription: this.paymentRecord,
+            account: new PaymentProviderAccount({}),
+            coupons: [],
+          },
+        ])
     })
 
-    it('should return individual when the individual subscription has the best feature set', async function () {
-      this.commonsPlan.features = {
-        compileGroup: 'standard',
-        collaborators: 1,
-        compileTimeout: 60,
-      }
-
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
-          this.user
-        )
-
-      assert.deepEqual(usersBestSubscription, {
-        type: 'individual',
-        subscription: this.individualSubscription,
-        plan: this.plan,
-        remainingTrialDays: -1,
+    describe('with a paid subscription', function () {
+      it('adds payment data to the personal subscription', async function () {
+        this.Modules.hooks.fire
+          .withArgs('getPaymentFromRecord', this.individualSubscription)
+          .yields(null, [
+            {
+              subscription: this.paymentRecord,
+              account: new PaymentProviderAccount({
+                email: 'example@example.com',
+                hasPastDueInvoice: false,
+              }),
+              coupons: [],
+            },
+          ])
+        const result =
+          await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+            this.user
+          )
+        assert.deepEqual(result.personalSubscription.payment, {
+          taxRate: 0.1,
+          billingDetailsLink: '/user/subscription/payment/billing-details',
+          accountManagementLink:
+            '/user/subscription/payment/account-management',
+          additionalLicenses: 0,
+          addOns: [
+            {
+              code: 'addon-code',
+              name: 'addon name',
+              quantity: 1,
+              unitPrice: 2,
+              preTaxTotal: 2,
+            },
+          ],
+          totalLicenses: 0,
+          nextPaymentDueAt: 'February 20th, 2025 12:00 PM UTC',
+          nextPaymentDueDate: 'February 20th, 2025',
+          currency: 'EUR',
+          state: 'active',
+          trialEndsAtFormatted: null,
+          trialEndsAt: null,
+          activeCoupons: [],
+          accountEmail: 'example@example.com',
+          hasPastDueInvoice: false,
+          pausedAt: null,
+          remainingPauseCycles: null,
+          displayPrice: '€16.50',
+          planOnlyDisplayPrice: '€14.30',
+          addOnDisplayPricesWithoutAdditionalLicense: {
+            'addon-code': '€2.20',
+          },
+          isEligibleForGroupPlan: true,
+          isEligibleForPause: false,
+          isEligibleForDowngradeUpsell: true,
+        })
       })
-    })
 
-    it('should return group when the group subscription has the best feature set', async function () {
-      this.plan.features = {
-        compileGroup: 'standard',
-        collaborators: 1,
-        compileTimeout: 60,
-      }
-      this.commonsPlan.features = {
-        compileGroup: 'standard',
-        collaborators: 1,
-        compileTimeout: 60,
-      }
+      describe('isEligibleForGroupPlan', function () {
+        it('is false for Stripe subscriptions', async function () {
+          this.paymentRecord.service = 'stripe-us'
+          this.Modules.promises.hooks.fire
+            .withArgs('canUpgradeFromIndividualToGroup')
+            .resolves([false])
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForGroupPlan
+          )
+        })
 
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
-          this.user
-        )
+        it('is false when in trial', async function () {
+          const msIn24Hours = 24 * 60 * 60 * 1000
+          const tomorrow = new Date(Date.now() + msIn24Hours)
+          this.paymentRecord.trialPeriodEnd = tomorrow
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForGroupPlan
+          )
+        })
 
-      assert.deepEqual(usersBestSubscription, {
-        type: 'group',
-        subscription: {},
-        plan: this.groupPlan,
-        remainingTrialDays: -1,
+        it('is true when not in trial and for a Recurly subscription', async function () {
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isTrue(
+            result.personalSubscription.payment.isEligibleForGroupPlan
+          )
+        })
       })
-    })
 
-    it('should return commons when the commons affiliation has the best feature set', async function () {
-      this.plan.features = {
-        compileGroup: 'priority',
-        collaborators: 5,
-        compileTimeout: 240,
-      }
-      this.groupPlan.features = {
-        compileGroup: 'standard',
-        collaborators: 1,
-        compileTimeout: 60,
-      }
-      this.commonsPlan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
+      describe('isEligibleForPause', function () {
+        it('is false for Stripe subscriptions', async function () {
+          this.paymentRecord.service = 'stripe-us'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
 
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
-          this.user
-        )
+        it('is false for subscriptions with pending plan', async function () {
+          this.paymentRecord.service = 'recurly'
+          this.individualSubscription.pendingPlan = {} // anything
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
 
-      assert.deepEqual(usersBestSubscription, {
-        type: 'commons',
-        subscription: this.commonsSubscription,
-        plan: this.commonsPlan,
+        it('is false for a group subscription', async function () {
+          this.paymentRecord.service = 'recurly'
+          this.individualSubscription.groupPlan = true
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
+
+        it('is false when in trial', async function () {
+          this.paymentRecord.service = 'recurly'
+          const msIn24Hours = 24 * 60 * 60 * 1000
+          const tomorrow = new Date(Date.now() + msIn24Hours)
+          this.paymentRecord.trialPeriodEnd = tomorrow
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
+
+        it('is false for annual subscriptions', async function () {
+          this.paymentRecord.service = 'recurly'
+          this.paymentRecord.planCode = 'collaborator-annual'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
+
+        it('is false for subscriptions with add-ons', async function () {
+          this.paymentRecord.service = 'recurly'
+          this.paymentRecord.addOns = [{}] // anything
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(result.personalSubscription.payment.isEligibleForPause)
+        })
+
+        it('is true when conditions are met', async function () {
+          this.paymentRecord.service = 'recurly'
+          this.paymentRecord.addOns = []
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isTrue(result.personalSubscription.payment.isEligibleForPause)
+        })
       })
-    })
 
-    it('should return individual with equal feature sets', async function () {
-      this.plan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
-      this.groupPlan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
-      this.commonsPlan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
+      describe('isEligibleForDowngradeUpsell', function () {
+        it('is true for eligible individual subscriptions', async function () {
+          this.paymentRecord.pausePeriodStart = null
+          this.paymentRecord.remainingPauseCycles = null
+          this.paymentRecord.trialPeriodEnd = null
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isTrue(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
 
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
-          this.user
-        )
+        it('is false for group plans', async function () {
+          this.individualSubscription.planCode = this.groupPlanCode
+          this.paymentRecord.pausePeriodStart = null
+          this.paymentRecord.remainingPauseCycles = null
+          this.paymentRecord.trialPeriodEnd = null
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
 
-      assert.deepEqual(usersBestSubscription, {
-        type: 'individual',
-        subscription: this.individualSubscription,
-        plan: this.plan,
-        remainingTrialDays: -1,
+        it('is false for annual individual plans', async function () {
+          this.individualSubscription.planCode = this.annualPlanCode
+          this.paymentRecord.pausePeriodStart = null
+          this.paymentRecord.remainingPauseCycles = null
+          this.paymentRecord.trialPeriodEnd = null
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
+
+        it('is false for paused plans', async function () {
+          this.paymentRecord.pausePeriodStart = new Date()
+          this.paymentRecord.remainingPauseCycles = 1
+          this.paymentRecord.trialPeriodEnd = null
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
+
+        it('is false for plans in free trial period', async function () {
+          this.paymentRecord.pausePeriodStart = null
+          this.paymentRecord.remainingPauseCycles = null
+          this.paymentRecord.trialPeriodEnd = new Date(
+            Date.now() + 24 * 60 * 60 * 1000 // tomorrow
+          )
+          this.paymentRecord.service = 'recurly'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
+
+        it('is false for Stripe subscriptions', async function () {
+          this.paymentRecord.pausePeriodStart = null
+          this.paymentRecord.remainingPauseCycles = null
+          this.paymentRecord.trialPeriodEnd = null
+          this.paymentRecord.service = 'stripe-us'
+          const result =
+            await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+              this.user
+            )
+          assert.isFalse(
+            result.personalSubscription.payment.isEligibleForDowngradeUpsell
+          )
+        })
       })
-    })
 
-    it('should return group over commons with equal feature sets', async function () {
-      this.plan.features = {
-        compileGroup: 'standard',
-        collaborators: 1,
-        compileTimeout: 60,
-      }
-      this.groupPlan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
-      this.commonsPlan.features = {
-        compileGroup: 'priority',
-        collaborators: -1,
-        compileTimeout: 240,
-      }
-
-      const usersBestSubscription =
-        await this.SubscriptionViewModelBuilder.promises.getBestSubscription(
-          this.user
+      it('includes pending changes', async function () {
+        this.paymentRecord.pendingChange =
+          new PaymentProviderSubscriptionChange({
+            subscription: this.paymentRecord,
+            nextPlanCode: this.groupPlanCode,
+            nextPlanName: 'Group Collaborator (Annual) 4 licenses',
+            nextPlanPrice: 1400,
+            nextAddOns: [
+              new PaymentProviderSubscriptionAddOn({
+                code: 'additional-license',
+                name: 'additional license',
+                quantity: 8,
+                unitPrice: 24.4,
+              }),
+              new PaymentProviderSubscriptionAddOn({
+                code: 'addon-code',
+                name: 'addon name',
+                quantity: 1,
+                unitPrice: 2,
+              }),
+            ],
+          })
+        this.Modules.hooks.fire
+          .withArgs('getPaymentFromRecord', this.individualSubscription)
+          .yields(null, [
+            {
+              subscription: this.paymentRecord,
+              account: {},
+              coupons: [],
+            },
+          ])
+        const result =
+          await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+            this.user
+          )
+        assert.equal(
+          result.personalSubscription.payment.displayPrice,
+          '€1,756.92'
         )
+        assert.equal(
+          result.personalSubscription.payment.planOnlyDisplayPrice,
+          '€1,754.72'
+        )
+        assert.deepEqual(
+          result.personalSubscription.payment
+            .addOnDisplayPricesWithoutAdditionalLicense,
+          { 'addon-code': '€2.20' }
+        )
+        assert.equal(
+          result.personalSubscription.payment.pendingAdditionalLicenses,
+          8
+        )
+        assert.equal(
+          result.personalSubscription.payment.pendingTotalLicenses,
+          12
+        )
+      })
 
-      assert.deepEqual(usersBestSubscription, {
-        type: 'group',
-        subscription: {},
-        plan: this.groupPlan,
-        remainingTrialDays: -1,
+      it('does not add a billing details link for a Stripe subscription', async function () {
+        this.paymentRecord.service = 'stripe-us'
+        this.Modules.hooks.fire
+          .withArgs('getPaymentFromRecord', this.individualSubscription)
+          .yields(null, [
+            {
+              subscription: this.paymentRecord,
+              account: new PaymentProviderAccount({}),
+              coupons: [],
+            },
+          ])
+        const result =
+          await this.SubscriptionViewModelBuilder.promises.buildUsersSubscriptionViewModel(
+            this.user
+          )
+        assert.equal(
+          result.personalSubscription.payment.billingDetailsLink,
+          undefined
+        )
+        assert.equal(
+          result.personalSubscription.payment.accountManagementLink,
+          '/user/subscription/payment/account-management'
+        )
       })
     })
   })
diff --git a/services/web/test/unit/src/Subscription/TeamInvitesController.test.mjs b/services/web/test/unit/src/Subscription/TeamInvitesController.test.mjs
new file mode 100644
index 0000000000..0d777a5b44
--- /dev/null
+++ b/services/web/test/unit/src/Subscription/TeamInvitesController.test.mjs
@@ -0,0 +1,277 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+
+const modulePath =
+  '../../../../app/src/Features/Subscription/TeamInvitesController'
+
+describe('TeamInvitesController', function () {
+  beforeEach(async function (ctx) {
+    ctx.user = { _id: '!@312431', email: 'user@email.com' }
+    ctx.adminUserId = '123jlkj'
+    ctx.subscriptionId = '123434325412'
+    ctx.user_email = 'bob@gmail.com'
+    ctx.req = {
+      session: {
+        user: {
+          _id: ctx.adminUserId,
+          email: ctx.user_email,
+        },
+      },
+      params: {},
+      query: {},
+      ip: '0.0.0.0',
+    }
+
+    ctx.subscription = {
+      _id: ctx.subscriptionId,
+    }
+
+    ctx.TeamInvitesHandler = {
+      promises: {
+        acceptInvite: sinon.stub().resolves(ctx.subscription),
+        getInvite: sinon.stub().resolves({
+          invite: {
+            email: ctx.user.email,
+            token: 'token123',
+            inviterName: ctx.user_email,
+          },
+          subscription: ctx.subscription,
+        }),
+      },
+    }
+
+    ctx.SubscriptionLocator = {
+      promises: {
+        hasSSOEnabled: sinon.stub().resolves(true),
+        getUsersSubscription: sinon.stub().resolves(),
+      },
+    }
+    ctx.ErrorController = { notFound: sinon.stub() }
+
+    ctx.SessionManager = {
+      getLoggedInUserId(session) {
+        return session.user?._id
+      },
+      getSessionUser(session) {
+        return session.user
+      },
+    }
+
+    ctx.UserAuditLogHandler = {
+      promises: {
+        addEntry: sinon.stub().resolves(),
+      },
+    }
+    ctx.UserGetter = {
+      promises: {
+        getUser: sinon.stub().resolves(ctx.user),
+        getUserByMainEmail: sinon.stub().resolves(ctx.user),
+        getUserByAnyEmail: sinon.stub().resolves(ctx.user),
+      },
+    }
+    ctx.EmailHandler = {
+      sendDeferredEmail: sinon.stub().resolves(),
+    }
+
+    ctx.RateLimiter = {
+      RateLimiter: class {},
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/TeamInvitesHandler',
+      () => ({
+        default: ctx.TeamInvitesHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionLocator',
+      () => ({
+        default: ctx.SubscriptionLocator,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserAuditLogHandler', () => ({
+      default: ctx.UserAuditLogHandler,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Errors/ErrorController', () => ({
+      default: ctx.ErrorController,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Email/EmailHandler', () => ({
+      default: ctx.EmailHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/infrastructure/RateLimiter',
+      () => ctx.RateLimiter
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: (ctx.Modules = {
+        promises: {
+          hooks: {
+            fire: sinon.stub().resolves([]),
+          },
+        },
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: (ctx.SplitTestHandler = {
+          promises: {
+            getAssignment: sinon.stub().resolves({}),
+          },
+        }),
+      })
+    )
+
+    ctx.Controller = (await import(modulePath)).default
+  })
+
+  describe('acceptInvite', function () {
+    it('should add an audit log entry', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.params.token = 'foo'
+        ctx.req.session.user = ctx.user
+        const res = {
+          json: () => {
+            sinon.assert.calledWith(
+              ctx.UserAuditLogHandler.promises.addEntry,
+              ctx.user._id,
+              'accept-group-invitation',
+              ctx.user._id,
+              ctx.req.ip,
+              { subscriptionId: ctx.subscriptionId }
+            )
+            resolve()
+          },
+        }
+        ctx.Controller.acceptInvite(ctx.req, res)
+      })
+    })
+  })
+
+  describe('viewInvite', function () {
+    const req = {
+      params: { token: 'token123' },
+      query: {},
+      session: {
+        user: { _id: 'user123' },
+      },
+    }
+
+    describe('hasIndividualPaidSubscription', function () {
+      it('is true for personal subscription', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.SubscriptionLocator.promises.getUsersSubscription.resolves({
+            recurlySubscription_id: 'subscription123',
+            groupPlan: false,
+          })
+          const res = {
+            render: (template, data) => {
+              expect(data.hasIndividualPaidSubscription).to.be.true
+              resolve()
+            },
+          }
+          ctx.Controller.viewInvite(req, res)
+        })
+      })
+
+      it('is true for group subscriptions', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.SubscriptionLocator.promises.getUsersSubscription.resolves({
+            recurlySubscription_id: 'subscription123',
+            groupPlan: true,
+          })
+          const res = {
+            render: (template, data) => {
+              expect(data.hasIndividualPaidSubscription).to.be.false
+              resolve()
+            },
+          }
+          ctx.Controller.viewInvite(req, res)
+        })
+      })
+
+      it('is false for canceled subscriptions', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.SubscriptionLocator.promises.getUsersSubscription.resolves({
+            recurlySubscription_id: 'subscription123',
+            groupPlan: false,
+            recurlyStatus: {
+              state: 'canceled',
+            },
+          })
+          const res = {
+            render: (template, data) => {
+              expect(data.hasIndividualPaidSubscription).to.be.false
+              resolve()
+            },
+          }
+          ctx.Controller.viewInvite(req, res)
+        })
+      })
+    })
+
+    describe('when user is logged out', function () {
+      it('renders logged out invite page', async function (ctx) {
+        await new Promise(resolve => {
+          const res = {
+            render: (template, data) => {
+              expect(template).to.equal('subscriptions/team/invite_logged_out')
+              expect(data.groupSSOActive).to.be.undefined
+              resolve()
+            },
+          }
+          ctx.Controller.viewInvite(
+            { params: { token: 'token123' }, session: {} },
+            res
+          )
+        })
+      })
+
+      it('includes groupSSOActive flag when the group has SSO enabled', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.Modules.promises.hooks.fire = sinon.stub().resolves([true])
+          const res = {
+            render: (template, data) => {
+              expect(data.groupSSOActive).to.be.true
+              resolve()
+            },
+          }
+          ctx.Controller.viewInvite(
+            { params: { token: 'token123' }, session: {} },
+            res
+          )
+        })
+      })
+    })
+
+    it('renders the view', async function (ctx) {
+      await new Promise(resolve => {
+        const res = {
+          render: template => {
+            expect(template).to.equal('subscriptions/team/invite')
+            resolve()
+          },
+        }
+        ctx.Controller.viewInvite(req, res)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Subscription/TeamInvitesControllerTests.mjs b/services/web/test/unit/src/Subscription/TeamInvitesControllerTests.mjs
deleted file mode 100644
index 3a1e8c3462..0000000000
--- a/services/web/test/unit/src/Subscription/TeamInvitesControllerTests.mjs
+++ /dev/null
@@ -1,227 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-const modulePath =
-  '../../../../app/src/Features/Subscription/TeamInvitesController'
-
-describe('TeamInvitesController', function () {
-  beforeEach(async function () {
-    this.user = { _id: '!@312431', email: 'user@email.com' }
-    this.adminUserId = '123jlkj'
-    this.subscriptionId = '123434325412'
-    this.user_email = 'bob@gmail.com'
-    this.req = {
-      session: {
-        user: {
-          _id: this.adminUserId,
-          email: this.user_email,
-        },
-      },
-      params: {},
-      query: {},
-      ip: '0.0.0.0',
-    }
-
-    this.subscription = {
-      _id: this.subscriptionId,
-    }
-
-    this.TeamInvitesHandler = {
-      promises: {
-        acceptInvite: sinon.stub().resolves(this.subscription),
-        getInvite: sinon.stub().resolves({
-          invite: {
-            email: this.user.email,
-            token: 'token123',
-            inviterName: this.user_email,
-          },
-          subscription: this.subscription,
-        }),
-      },
-    }
-
-    this.SubscriptionLocator = {
-      promises: {
-        hasSSOEnabled: sinon.stub().resolves(true),
-        getUsersSubscription: sinon.stub().resolves(),
-      },
-    }
-    this.ErrorController = { notFound: sinon.stub() }
-
-    this.SessionManager = {
-      getLoggedInUserId(session) {
-        return session.user?._id
-      },
-      getSessionUser(session) {
-        return session.user
-      },
-    }
-
-    this.UserAuditLogHandler = {
-      promises: {
-        addEntry: sinon.stub().resolves(),
-      },
-    }
-    this.UserGetter = {
-      promises: {
-        getUser: sinon.stub().resolves(this.user),
-        getUserByMainEmail: sinon.stub().resolves(this.user),
-        getUserByAnyEmail: sinon.stub().resolves(this.user),
-      },
-    }
-    this.EmailHandler = {
-      sendDeferredEmail: sinon.stub().resolves(),
-    }
-
-    this.RateLimiter = {
-      RateLimiter: class {},
-    }
-
-    this.Controller = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Subscription/TeamInvitesHandler':
-        this.TeamInvitesHandler,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/Subscription/SubscriptionLocator':
-        this.SubscriptionLocator,
-      '../../../../app/src/Features/User/UserAuditLogHandler':
-        this.UserAuditLogHandler,
-      '../../../../app/src/Features/Errors/ErrorController':
-        this.ErrorController,
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/Email/EmailHandler': this.EmailHandler,
-      '../../../../app/src/infrastructure/RateLimiter': this.RateLimiter,
-      '../../../../app/src/infrastructure/Modules': (this.Modules = {
-        promises: {
-          hooks: {
-            fire: sinon.stub().resolves([]),
-          },
-        },
-      }),
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        (this.SplitTestHandler = {
-          promises: {
-            getAssignment: sinon.stub().resolves({}),
-          },
-        }),
-    })
-  })
-
-  describe('acceptInvite', function () {
-    it('should add an audit log entry', function (done) {
-      this.req.params.token = 'foo'
-      this.req.session.user = this.user
-      const res = {
-        json: () => {
-          sinon.assert.calledWith(
-            this.UserAuditLogHandler.promises.addEntry,
-            this.user._id,
-            'accept-group-invitation',
-            this.user._id,
-            this.req.ip,
-            { subscriptionId: this.subscriptionId }
-          )
-          done()
-        },
-      }
-      this.Controller.acceptInvite(this.req, res)
-    })
-  })
-
-  describe('viewInvite', function () {
-    const req = {
-      params: { token: 'token123' },
-      query: {},
-      session: {
-        user: { _id: 'user123' },
-      },
-    }
-
-    describe('hasIndividualRecurlySubscription', function () {
-      it('is true for personal subscription', function (done) {
-        this.SubscriptionLocator.promises.getUsersSubscription.resolves({
-          recurlySubscription_id: 'subscription123',
-          groupPlan: false,
-        })
-        const res = {
-          render: (template, data) => {
-            expect(data.hasIndividualRecurlySubscription).to.be.true
-            done()
-          },
-        }
-        this.Controller.viewInvite(req, res)
-      })
-
-      it('is true for group subscriptions', function (done) {
-        this.SubscriptionLocator.promises.getUsersSubscription.resolves({
-          recurlySubscription_id: 'subscription123',
-          groupPlan: true,
-        })
-        const res = {
-          render: (template, data) => {
-            expect(data.hasIndividualRecurlySubscription).to.be.false
-            done()
-          },
-        }
-        this.Controller.viewInvite(req, res)
-      })
-
-      it('is false for canceled subscriptions', function (done) {
-        this.SubscriptionLocator.promises.getUsersSubscription.resolves({
-          recurlySubscription_id: 'subscription123',
-          groupPlan: false,
-          recurlyStatus: {
-            state: 'canceled',
-          },
-        })
-        const res = {
-          render: (template, data) => {
-            expect(data.hasIndividualRecurlySubscription).to.be.false
-            done()
-          },
-        }
-        this.Controller.viewInvite(req, res)
-      })
-    })
-
-    describe('when user is logged out', function () {
-      it('renders logged out invite page', function (done) {
-        const res = {
-          render: (template, data) => {
-            expect(template).to.equal('subscriptions/team/invite_logged_out')
-            expect(data.groupSSOActive).to.be.undefined
-            done()
-          },
-        }
-        this.Controller.viewInvite(
-          { params: { token: 'token123' }, session: {} },
-          res
-        )
-      })
-
-      it('includes groupSSOActive flag when the group has SSO enabled', function (done) {
-        this.Modules.promises.hooks.fire = sinon.stub().resolves([true])
-        const res = {
-          render: (template, data) => {
-            expect(data.groupSSOActive).to.be.true
-            done()
-          },
-        }
-        this.Controller.viewInvite(
-          { params: { token: 'token123' }, session: {} },
-          res
-        )
-      })
-    })
-
-    it('renders the view', function (done) {
-      const res = {
-        render: template => {
-          expect(template).to.equal('subscriptions/team/invite')
-          done()
-        },
-      }
-      this.Controller.viewInvite(req, res)
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Subscription/TeamInvitesHandlerTests.js b/services/web/test/unit/src/Subscription/TeamInvitesHandlerTests.js
index 0b762823a4..b15232c822 100644
--- a/services/web/test/unit/src/Subscription/TeamInvitesHandlerTests.js
+++ b/services/web/test/unit/src/Subscription/TeamInvitesHandlerTests.js
@@ -29,6 +29,7 @@ describe('TeamInvitesHandler', function () {
     this.subscription = {
       id: '55153a8014829a865bbf700d',
       _id: new ObjectId('55153a8014829a865bbf700d'),
+      recurlySubscription_id: '1a2b3c4d5e6f7g',
       admin_id: this.manager._id,
       groupPlan: true,
       member_ids: [],
@@ -54,6 +55,7 @@ describe('TeamInvitesHandler', function () {
     this.SubscriptionUpdater = {
       promises: {
         addUserToGroup: sinon.stub().resolves(),
+        deleteSubscription: sinon.stub().resolves(),
       },
     }
 
@@ -109,6 +111,12 @@ describe('TeamInvitesHandler', function () {
 
     this.Subscription.findOne.resolves(this.subscription)
 
+    this.RecurlyClient = {
+      promises: {
+        terminateSubscriptionByUuid: sinon.stub().resolves(),
+      },
+    }
+
     this.TeamInvitesHandler = SandboxedModule.require(modulePath, {
       requires: {
         'mongodb-legacy': { ObjectId },
@@ -126,179 +134,155 @@ describe('TeamInvitesHandler', function () {
         '../../infrastructure/Modules': (this.Modules = {
           promises: { hooks: { fire: sinon.stub().resolves() } },
         }),
+        './RecurlyClient': this.RecurlyClient,
       },
     })
   })
 
   describe('getInvite', function () {
-    it("returns the invite if there's one", function (done) {
-      this.TeamInvitesHandler.getInvite(
-        this.token,
-        (err, invite, subscription) => {
-          expect(err).to.eq(null)
-          expect(invite).to.deep.eq(this.teamInvite)
-          expect(subscription).to.deep.eq(this.subscription)
-          done()
-        }
-      )
+    it("returns the invite if there's one", async function () {
+      const { invite, subscription } =
+        await this.TeamInvitesHandler.promises.getInvite(this.token)
+
+      expect(invite).to.deep.eq(this.teamInvite)
+      expect(subscription).to.deep.eq(this.subscription)
     })
 
-    it("returns teamNotFound if there's none", function (done) {
+    it("returns teamNotFound if there's none", async function () {
       this.Subscription.findOne = sinon.stub().resolves(null)
 
-      this.TeamInvitesHandler.getInvite(
-        this.token,
-        (err, invite, subscription) => {
-          expect(err).to.be.instanceof(Errors.NotFoundError)
-          done()
-        }
-      )
+      let error
+      try {
+        await this.TeamInvitesHandler.promises.getInvite(this.token)
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(Errors.NotFoundError)
     })
   })
 
   describe('createInvite', function () {
-    it('adds the team invite to the subscription', function (done) {
-      this.TeamInvitesHandler.createInvite(
+    it('adds the team invite to the subscription', async function () {
+      const invite = await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          expect(err).to.eq(null)
-          expect(invite.token).to.eq(this.newToken)
-          expect(invite.email).to.eq('john.snow@example.com')
-          expect(invite.inviterName).to.eq(
-            'Daenerys Targaryen (daenerys@example.com)'
-          )
-          expect(invite.invite).to.be.true
-          expect(this.subscription.teamInvites).to.deep.include(invite)
-          done()
-        }
+        'John.Snow@example.com'
       )
+      expect(invite.token).to.eq(this.newToken)
+      expect(invite.email).to.eq('john.snow@example.com')
+      expect(invite.inviterName).to.eq(
+        'Daenerys Targaryen (daenerys@example.com)'
+      )
+      expect(invite.invite).to.be.true
+      expect(this.subscription.teamInvites).to.deep.include(invite)
     })
 
-    it('sends an email', function (done) {
-      this.TeamInvitesHandler.createInvite(
+    it('sends an email', async function () {
+      await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          this.EmailHandler.promises.sendEmail
-            .calledWith(
-              'verifyEmailToJoinTeam',
-              sinon.match({
-                to: 'john.snow@example.com',
-                inviter: this.manager,
-                acceptInviteUrl: `http://example.com/subscription/invites/${this.newToken}/`,
-              })
-            )
-            .should.equal(true)
-          done(err)
-        }
+        'John.Snow@example.com'
       )
+
+      this.EmailHandler.promises.sendEmail
+        .calledWith(
+          'verifyEmailToJoinTeam',
+          sinon.match({
+            to: 'john.snow@example.com',
+            inviter: this.manager,
+            acceptInviteUrl: `http://example.com/subscription/invites/${this.newToken}/`,
+          })
+        )
+        .should.equal(true)
     })
 
-    it('refreshes the existing invite if the email has already been invited', function (done) {
+    it('refreshes the existing invite if the email has already been invited', async function () {
       const originalInvite = Object.assign({}, this.teamInvite)
 
-      this.TeamInvitesHandler.createInvite(
+      const invite = await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        originalInvite.email,
-        (err, invite) => {
-          expect(err).to.eq(null)
-          expect(invite).to.exist
-
-          expect(this.subscription.teamInvites.length).to.eq(1)
-          expect(this.subscription.teamInvites).to.deep.include(invite)
-
-          expect(invite.email).to.eq(originalInvite.email)
-
-          this.subscription.save.calledOnce.should.eq(true)
-
-          done()
-        }
+        originalInvite.email
       )
+      expect(invite).to.exist
+
+      expect(this.subscription.teamInvites.length).to.eq(1)
+      expect(this.subscription.teamInvites).to.deep.include(invite)
+
+      expect(invite.email).to.eq(originalInvite.email)
+
+      this.subscription.save.calledOnce.should.eq(true)
     })
 
-    it('removes any legacy invite from the subscription', function (done) {
-      this.TeamInvitesHandler.createInvite(
+    it('removes any legacy invite from the subscription', async function () {
+      await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          this.Subscription.updateOne
-            .calledWith(
-              { _id: new ObjectId('55153a8014829a865bbf700d') },
-              { $pull: { invited_emails: 'john.snow@example.com' } }
-            )
-            .should.eq(true)
-          done(err)
-        }
+        'John.Snow@example.com'
       )
+
+      this.Subscription.updateOne
+        .calledWith(
+          { _id: new ObjectId('55153a8014829a865bbf700d') },
+          { $pull: { invited_emails: 'john.snow@example.com' } }
+        )
+        .should.eq(true)
     })
 
-    it('add user to subscription if inviting self', function (done) {
-      this.TeamInvitesHandler.createInvite(
+    it('add user to subscription if inviting self', async function () {
+      const invite = await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        this.manager.email,
-        (err, invite) => {
-          sinon.assert.calledWith(
-            this.SubscriptionUpdater.promises.addUserToGroup,
-            this.subscription._id,
-            this.manager._id
-          )
-          sinon.assert.notCalled(this.subscription.save)
-          expect(invite.token).to.not.exist
-          expect(invite.email).to.eq(this.manager.email)
-          expect(invite.first_name).to.eq(this.manager.first_name)
-          expect(invite.last_name).to.eq(this.manager.last_name)
-          expect(invite.invite).to.be.false
-          done(err)
-        }
+        this.manager.email
       )
+      sinon.assert.calledWith(
+        this.SubscriptionUpdater.promises.addUserToGroup,
+        this.subscription._id,
+        this.manager._id
+      )
+      sinon.assert.notCalled(this.subscription.save)
+      expect(invite.token).to.not.exist
+      expect(invite.email).to.eq(this.manager.email)
+      expect(invite.first_name).to.eq(this.manager.first_name)
+      expect(invite.last_name).to.eq(this.manager.last_name)
+      expect(invite.invite).to.be.false
     })
 
-    it('sends an SSO invite if SSO is enabled and inviting self', function (done) {
+    it('sends an SSO invite if SSO is enabled and inviting self', async function () {
       this.subscription.ssoConfig = new ObjectId('abc123abc123abc123abc123')
       this.SSOConfig.findById
         .withArgs(this.subscription.ssoConfig)
         .resolves({ enabled: true })
 
-      this.TeamInvitesHandler.createInvite(
+      await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        this.manager.email,
-        (err, invite) => {
-          sinon.assert.calledWith(
-            this.Modules.promises.hooks.fire,
-            'sendGroupSSOReminder',
-            this.manager._id,
-            this.subscription._id
-          )
-          done(err)
-        }
+        this.manager.email
+      )
+      sinon.assert.calledWith(
+        this.Modules.promises.hooks.fire,
+        'sendGroupSSOReminder',
+        this.manager._id,
+        this.subscription._id
       )
     })
 
-    it('does not send an SSO invite if SSO is disabled and inviting self', function (done) {
+    it('does not send an SSO invite if SSO is disabled and inviting self', async function () {
       this.subscription.ssoConfig = new ObjectId('abc123abc123abc123abc123')
       this.SSOConfig.findById
         .withArgs(this.subscription.ssoConfig)
         .resolves({ enabled: false })
 
-      this.TeamInvitesHandler.createInvite(
+      await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        this.manager.email,
-        (err, invite) => {
-          sinon.assert.notCalled(this.Modules.promises.hooks.fire)
-          done(err)
-        }
+        this.manager.email
       )
+      sinon.assert.notCalled(this.Modules.promises.hooks.fire)
     })
 
-    it('sends a notification if inviting registered user', function (done) {
+    it('sends a notification if inviting registered user', async function () {
       const id = new ObjectId('6a6b3a8014829a865bbf700d')
       const managedUsersEnabled = false
 
@@ -308,22 +292,19 @@ describe('TeamInvitesHandler', function () {
           _id: id,
         })
 
-      this.TeamInvitesHandler.createInvite(
+      const invite = await this.TeamInvitesHandler.promises.createInvite(
         this.manager._id,
         this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          this.NotificationsBuilder.promises
-            .groupInvitation(
-              id.toString(),
-              this.subscription._id,
-              managedUsersEnabled
-            )
-            .create.calledWith(invite)
-            .should.eq(true)
-          done(err)
-        }
+        'John.Snow@example.com'
       )
+      this.NotificationsBuilder.promises
+        .groupInvitation(
+          id.toString(),
+          this.subscription._id,
+          managedUsersEnabled
+        )
+        .create.calledWith(invite)
+        .should.eq(true)
     })
   })
 
@@ -363,6 +344,8 @@ describe('TeamInvitesHandler', function () {
         email: 'tyrion@example.com',
       }
 
+      this.ipAddress = '127.0.0.1'
+
       this.UserGetter.promises.getUserByAnyEmail
         .withArgs(this.user.email)
         .resolves(this.user)
@@ -375,112 +358,130 @@ describe('TeamInvitesHandler', function () {
     })
 
     describe('with standard group', function () {
-      it('adds the user to the team', function (done) {
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          this.SubscriptionUpdater.promises.addUserToGroup
-            .calledWith(this.subscription._id, this.user.id)
-            .should.eq(true)
-          done()
-        })
+      it('adds the user to the team', async function () {
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        this.SubscriptionUpdater.promises.addUserToGroup
+          .calledWith(this.subscription._id, this.user.id)
+          .should.eq(true)
       })
 
-      it('removes the invite from the subscription', function (done) {
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          this.Subscription.updateOne
-            .calledWith(
-              { _id: new ObjectId('55153a8014829a865bbf700d') },
-              { $pull: { teamInvites: { email: 'john.snow@example.com' } } }
-            )
-            .should.eq(true)
-          done()
-        })
+      it('removes the invite from the subscription', async function () {
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        this.Subscription.updateOne
+          .calledWith(
+            { _id: new ObjectId('55153a8014829a865bbf700d') },
+            { $pull: { teamInvites: { email: 'john.snow@example.com' } } }
+          )
+          .should.eq(true)
       })
 
-      it('removes dashboard notification after they accepted group invitation', function (done) {
+      it('removes dashboard notification after they accepted group invitation', async function () {
         const managedUsersEnabled = false
 
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          sinon.assert.called(
-            this.NotificationsBuilder.promises.groupInvitation(
-              this.user.id,
-              this.subscription._id,
-              managedUsersEnabled
-            ).read
-          )
-          done()
-        })
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        sinon.assert.called(
+          this.NotificationsBuilder.promises.groupInvitation(
+            this.user.id,
+            this.subscription._id,
+            managedUsersEnabled
+          ).read
+        )
       })
 
-      it('should not schedule an SSO invite reminder', function (done) {
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          sinon.assert.notCalled(this.Modules.promises.hooks.fire)
-          done()
-        })
+      it('should not schedule an SSO invite reminder', async function () {
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        sinon.assert.notCalled(this.Modules.promises.hooks.fire)
       })
     })
 
     describe('with managed group', function () {
-      it('should enroll the group member', function (done) {
+      it('should enroll the group member', async function () {
         this.subscription.managedUsersEnabled = true
 
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          sinon.assert.calledWith(
-            this.Modules.promises.hooks.fire,
-            'enrollInManagedSubscription',
-            this.user.id,
-            this.subscription
-          )
-          done()
-        })
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        sinon.assert.calledWith(
+          this.SubscriptionUpdater.promises.deleteSubscription,
+          this.subscription,
+          { id: this.user.id, ip: this.ipAddress }
+        )
+        sinon.assert.calledWith(
+          this.RecurlyClient.promises.terminateSubscriptionByUuid,
+          this.subscription.recurlySubscription_id
+        )
+        sinon.assert.calledWith(
+          this.Modules.promises.hooks.fire,
+          'enrollInManagedSubscription',
+          this.user.id,
+          this.subscription
+        )
       })
     })
 
     describe('with group SSO enabled', function () {
-      it('should schedule an SSO invite reminder', function (done) {
+      it('should schedule an SSO invite reminder', async function () {
         this.subscription.ssoConfig = 'ssoconfig1'
         this.SSOConfig.findById
           .withArgs('ssoconfig1')
           .resolves({ enabled: true })
 
-        this.TeamInvitesHandler.acceptInvite('dddddddd', this.user.id, () => {
-          sinon.assert.calledWith(
-            this.Modules.promises.hooks.fire,
-            'scheduleGroupSSOReminder',
-            this.user.id,
-            this.subscription._id
-          )
-          done()
-        })
+        await this.TeamInvitesHandler.promises.acceptInvite(
+          'dddddddd',
+          this.user.id,
+          this.ipAddress
+        )
+        sinon.assert.calledWith(
+          this.Modules.promises.hooks.fire,
+          'scheduleGroupSSOReminder',
+          this.user.id,
+          this.subscription._id
+        )
       })
     })
   })
 
   describe('revokeInvite', function () {
-    it('removes the team invite from the subscription', function (done) {
-      this.TeamInvitesHandler.revokeInvite(
+    it('removes the team invite from the subscription', async function () {
+      await this.TeamInvitesHandler.promises.revokeInvite(
         this.manager._id,
         this.subscription,
-        'jorah@example.com',
-        () => {
-          this.Subscription.updateOne
-            .calledWith(
-              { _id: new ObjectId('55153a8014829a865bbf700d') },
-              { $pull: { teamInvites: { email: 'jorah@example.com' } } }
-            )
-            .should.eq(true)
-
-          this.Subscription.updateOne
-            .calledWith(
-              { _id: new ObjectId('55153a8014829a865bbf700d') },
-              { $pull: { invited_emails: 'jorah@example.com' } }
-            )
-            .should.eq(true)
-          done()
-        }
+        'jorah@example.com'
       )
+      this.Subscription.updateOne
+        .calledWith(
+          { _id: new ObjectId('55153a8014829a865bbf700d') },
+          { $pull: { teamInvites: { email: 'jorah@example.com' } } }
+        )
+        .should.eq(true)
+
+      this.Subscription.updateOne
+        .calledWith(
+          { _id: new ObjectId('55153a8014829a865bbf700d') },
+          { $pull: { invited_emails: 'jorah@example.com' } }
+        )
+        .should.eq(true)
     })
 
-    it('removes dashboard notification for pending group invitation', function (done) {
+    it('removes dashboard notification for pending group invitation', async function () {
       const managedUsersEnabled = false
 
       const pendingUser = {
@@ -492,26 +493,23 @@ describe('TeamInvitesHandler', function () {
         .withArgs(pendingUser.email)
         .resolves(pendingUser)
 
-      this.TeamInvitesHandler.revokeInvite(
+      await this.TeamInvitesHandler.promises.revokeInvite(
         this.manager._id,
         this.subscription,
-        pendingUser.email,
-        () => {
-          sinon.assert.called(
-            this.NotificationsBuilder.promises.groupInvitation(
-              pendingUser.id,
-              this.subscription._id,
-              managedUsersEnabled
-            ).read
-          )
+        pendingUser.email
+      )
 
-          done()
-        }
+      sinon.assert.called(
+        this.NotificationsBuilder.promises.groupInvitation(
+          pendingUser.id,
+          this.subscription._id,
+          managedUsersEnabled
+        ).read
       )
     })
   })
 
-  describe('createTeamInvitesForLegacyInvitedEmail', function (done) {
+  describe('createTeamInvitesForLegacyInvitedEmail', function () {
     beforeEach(function () {
       this.subscription.invited_emails = [
         'eddard@example.com',
@@ -523,58 +521,71 @@ describe('TeamInvitesHandler', function () {
         .resolves([this.subscription])
     })
 
-    it('sends an invitation email to addresses in the legacy invited_emails field', function (done) {
-      this.TeamInvitesHandler.createTeamInvitesForLegacyInvitedEmail(
-        'eddard@example.com',
-        (err, invites) => {
-          expect(err).not.to.exist
-          expect(invites.length).to.eq(1)
+    it('sends an invitation email to addresses in the legacy invited_emails field', async function () {
+      const invites =
+        await this.TeamInvitesHandler.promises.createTeamInvitesForLegacyInvitedEmail(
+          'eddard@example.com'
+        )
 
-          const [invite] = invites
-          expect(invite.token).to.eq(this.newToken)
-          expect(invite.email).to.eq('eddard@example.com')
-          expect(invite.inviterName).to.eq(
-            'Daenerys Targaryen (daenerys@example.com)'
-          )
-          expect(invite.invite).to.be.true
-          expect(this.subscription.teamInvites).to.deep.include(invite)
+      expect(invites.length).to.eq(1)
 
-          done()
-        }
+      const [invite] = invites
+      expect(invite.token).to.eq(this.newToken)
+      expect(invite.email).to.eq('eddard@example.com')
+      expect(invite.inviterName).to.eq(
+        'Daenerys Targaryen (daenerys@example.com)'
       )
+      expect(invite.invite).to.be.true
+      expect(this.subscription.teamInvites).to.deep.include(invite)
     })
   })
 
   describe('validation', function () {
-    it("doesn't create an invite if the team limit has been reached", function (done) {
+    it("doesn't create an invite if the team limit has been reached", async function () {
       this.LimitationsManager.teamHasReachedMemberLimit = sinon
         .stub()
         .returns(true)
-      this.TeamInvitesHandler.createInvite(
-        this.manager._id,
-        this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          expect(err).to.deep.equal({ limitReached: true })
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.TeamInvitesHandler.promises.createInvite(
+          this.manager._id,
+          this.subscription,
+          'John.Snow@example.com'
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
+
+      expect(error).to.deep.equal({
+        limitReached: true,
+      })
     })
 
-    it("doesn't create an invite if the subscription is not in a group plan", function (done) {
+    it("doesn't create an invite if the subscription is not in a group plan", async function () {
       this.subscription.groupPlan = false
-      this.TeamInvitesHandler.createInvite(
-        this.manager._id,
-        this.subscription,
-        'John.Snow@example.com',
-        (err, invite) => {
-          expect(err).to.deep.equal({ wrongPlan: true })
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.TeamInvitesHandler.promises.createInvite(
+          this.manager._id,
+          this.subscription,
+          'John.Snow@example.com'
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
+
+      expect(error).to.deep.equal({
+        wrongPlan: true,
+      })
     })
 
-    it("doesn't create an invite if the user is already part of the team", function (done) {
+    it("doesn't create an invite if the user is already part of the team", async function () {
       const member = {
         id: '1a2b',
         _id: '1a2b',
@@ -586,16 +597,23 @@ describe('TeamInvitesHandler', function () {
         .withArgs(member.email)
         .resolves(member)
 
-      this.TeamInvitesHandler.createInvite(
-        this.manager._id,
-        this.subscription,
-        'tyrion@example.com',
-        (err, invite) => {
-          expect(err).to.deep.equal({ alreadyInTeam: true })
-          expect(invite).not.to.exist
-          done()
-        }
-      )
+      let error
+
+      try {
+        await this.TeamInvitesHandler.promises.createInvite(
+          this.manager._id,
+          this.subscription,
+          'tyrion@example.com'
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.exist
+
+      expect(error).to.eql({
+        alreadyInTeam: true,
+      })
     })
   })
 })
diff --git a/services/web/test/unit/src/Tags/TagsController.test.mjs b/services/web/test/unit/src/Tags/TagsController.test.mjs
new file mode 100644
index 0000000000..178217a834
--- /dev/null
+++ b/services/web/test/unit/src/Tags/TagsController.test.mjs
@@ -0,0 +1,315 @@
+import { assert, vi } from 'vitest'
+import sinon from 'sinon'
+
+const modulePath = '../../../../app/src/Features/Tags/TagsController.mjs'
+
+describe('TagsController', function () {
+  const userId = '123nd3ijdks'
+  const projectId = '123njdskj9jlk'
+
+  beforeEach(async function (ctx) {
+    ctx.TagsHandler = {
+      promises: {
+        addProjectToTag: sinon.stub().resolves(),
+        addProjectsToTag: sinon.stub().resolves(),
+        removeProjectFromTag: sinon.stub().resolves(),
+        removeProjectsFromTag: sinon.stub().resolves(),
+        deleteTag: sinon.stub().resolves(),
+        editTag: sinon.stub().resolves(),
+        renameTag: sinon.stub().resolves(),
+        createTag: sinon.stub().resolves(),
+      },
+    }
+    ctx.SessionManager = {
+      getLoggedInUserId: session => {
+        return session.user._id
+      },
+    }
+
+    vi.doMock('../../../../app/src/Features/Tags/TagsHandler', () => ({
+      default: ctx.TagsHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    ctx.TagsController = (await import(modulePath)).default
+    ctx.req = {
+      params: {
+        projectId,
+      },
+      session: {
+        user: {
+          _id: userId,
+        },
+      },
+      body: {},
+    }
+
+    ctx.res = {}
+    ctx.res.status = sinon.stub().returns(ctx.res)
+    ctx.res.end = sinon.stub()
+    ctx.res.json = sinon.stub()
+  })
+
+  it('get all tags', async function (ctx) {
+    await new Promise(resolve => {
+      const allTags = [{ name: 'tag', projects: ['123423', '423423'] }]
+      ctx.TagsHandler.promises.getAllTags = sinon.stub().resolves(allTags)
+      ctx.TagsController.getAllTags(ctx.req, {
+        json: body => {
+          body.should.equal(allTags)
+          sinon.assert.calledWith(ctx.TagsHandler.promises.getAllTags, userId)
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+
+  describe('create a tag', function (done) {
+    it('without a color', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.tag = { mock: 'tag' }
+        ctx.TagsHandler.promises.createTag = sinon.stub().resolves(ctx.tag)
+        ctx.req.session.user._id = ctx.userId = 'user-id-123'
+        ctx.req.body = { name: (ctx.tagName = 'tag-name') }
+        ctx.TagsController.createTag(ctx.req, {
+          json: () => {
+            sinon.assert.calledWith(
+              ctx.TagsHandler.promises.createTag,
+              ctx.userId,
+              ctx.tagName
+            )
+            resolve()
+            return {
+              end: () => {},
+            }
+          },
+        })
+      })
+    })
+
+    it('with a color', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.tag = { mock: 'tag' }
+        ctx.TagsHandler.promises.createTag = sinon.stub().resolves(ctx.tag)
+        ctx.req.session.user._id = ctx.userId = 'user-id-123'
+        ctx.req.body = {
+          name: (ctx.tagName = 'tag-name'),
+          color: (ctx.color = '#123456'),
+        }
+        ctx.TagsController.createTag(ctx.req, {
+          json: () => {
+            sinon.assert.calledWith(
+              ctx.TagsHandler.promises.createTag,
+              ctx.userId,
+              ctx.tagName,
+              ctx.color
+            )
+            resolve()
+            return {
+              end: () => {},
+            }
+          },
+        })
+      })
+    })
+  })
+
+  it('delete a tag', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+      ctx.TagsController.deleteTag(ctx.req, {
+        status: code => {
+          assert.equal(code, 204)
+          sinon.assert.calledWith(
+            ctx.TagsHandler.promises.deleteTag,
+            ctx.userId,
+            ctx.tagId
+          )
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+
+  describe('edit a tag', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+    })
+
+    it('with a name and no color', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = {
+          name: (ctx.tagName = 'new-name'),
+        }
+        ctx.TagsController.editTag(ctx.req, {
+          status: code => {
+            assert.equal(code, 204)
+            sinon.assert.calledWith(
+              ctx.TagsHandler.promises.editTag,
+              ctx.userId,
+              ctx.tagId,
+              ctx.tagName
+            )
+            resolve()
+            return {
+              end: () => {},
+            }
+          },
+        })
+      })
+    })
+
+    it('with a name and color', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = {
+          name: (ctx.tagName = 'new-name'),
+          color: (ctx.color = '#FF0011'),
+        }
+        ctx.TagsController.editTag(ctx.req, {
+          status: code => {
+            assert.equal(code, 204)
+            sinon.assert.calledWith(
+              ctx.TagsHandler.promises.editTag,
+              ctx.userId,
+              ctx.tagId,
+              ctx.tagName,
+              ctx.color
+            )
+            resolve()
+            return {
+              end: () => {},
+            }
+          },
+        })
+      })
+    })
+
+    it('without a name', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body = { name: undefined }
+        ctx.TagsController.renameTag(ctx.req, {
+          status: code => {
+            assert.equal(code, 400)
+            sinon.assert.notCalled(ctx.TagsHandler.promises.renameTag)
+            resolve()
+            return {
+              end: () => {},
+            }
+          },
+        })
+      })
+    })
+  })
+
+  it('add a project to a tag', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.params.projectId = ctx.projectId = 'project-id-123'
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+      ctx.TagsController.addProjectToTag(ctx.req, {
+        status: code => {
+          assert.equal(code, 204)
+          sinon.assert.calledWith(
+            ctx.TagsHandler.promises.addProjectToTag,
+            ctx.userId,
+            ctx.tagId,
+            ctx.projectId
+          )
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+
+  it('add projects to a tag', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.body.projectIds = ctx.projectIds = [
+        'project-id-123',
+        'project-id-234',
+      ]
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+      ctx.TagsController.addProjectsToTag(ctx.req, {
+        status: code => {
+          assert.equal(code, 204)
+          sinon.assert.calledWith(
+            ctx.TagsHandler.promises.addProjectsToTag,
+            ctx.userId,
+            ctx.tagId,
+            ctx.projectIds
+          )
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+
+  it('remove a project from a tag', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.params.projectId = ctx.projectId = 'project-id-123'
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+      ctx.TagsController.removeProjectFromTag(ctx.req, {
+        status: code => {
+          assert.equal(code, 204)
+          sinon.assert.calledWith(
+            ctx.TagsHandler.promises.removeProjectFromTag,
+            ctx.userId,
+            ctx.tagId,
+            ctx.projectId
+          )
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+
+  it('remove projects from a tag', async function (ctx) {
+    await new Promise(resolve => {
+      ctx.req.params.tagId = ctx.tagId = 'tag-id-123'
+      ctx.req.body.projectIds = ctx.projectIds = [
+        'project-id-123',
+        'project-id-234',
+      ]
+      ctx.req.session.user._id = ctx.userId = 'user-id-123'
+      ctx.TagsController.removeProjectsFromTag(ctx.req, {
+        status: code => {
+          assert.equal(code, 204)
+          sinon.assert.calledWith(
+            ctx.TagsHandler.promises.removeProjectsFromTag,
+            ctx.userId,
+            ctx.tagId,
+            ctx.projectIds
+          )
+          resolve()
+          return {
+            end: () => {},
+          }
+        },
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Tags/TagsControllerTests.mjs b/services/web/test/unit/src/Tags/TagsControllerTests.mjs
deleted file mode 100644
index 4474ba0d38..0000000000
--- a/services/web/test/unit/src/Tags/TagsControllerTests.mjs
+++ /dev/null
@@ -1,288 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { assert } from 'chai'
-const modulePath = new URL(
-  '../../../../app/src/Features/Tags/TagsController.mjs',
-  import.meta.url
-).pathname
-
-describe('TagsController', function () {
-  const userId = '123nd3ijdks'
-  const projectId = '123njdskj9jlk'
-
-  beforeEach(async function () {
-    this.TagsHandler = {
-      promises: {
-        addProjectToTag: sinon.stub().resolves(),
-        addProjectsToTag: sinon.stub().resolves(),
-        removeProjectFromTag: sinon.stub().resolves(),
-        removeProjectsFromTag: sinon.stub().resolves(),
-        deleteTag: sinon.stub().resolves(),
-        editTag: sinon.stub().resolves(),
-        renameTag: sinon.stub().resolves(),
-        createTag: sinon.stub().resolves(),
-      },
-    }
-    this.SessionManager = {
-      getLoggedInUserId: session => {
-        return session.user._id
-      },
-    }
-    this.TagsController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/Tags/TagsHandler': this.TagsHandler,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-    })
-    this.req = {
-      params: {
-        projectId,
-      },
-      session: {
-        user: {
-          _id: userId,
-        },
-      },
-      body: {},
-    }
-
-    this.res = {}
-    this.res.status = sinon.stub().returns(this.res)
-    this.res.end = sinon.stub()
-    this.res.json = sinon.stub()
-  })
-
-  it('get all tags', function (done) {
-    const allTags = [{ name: 'tag', projects: ['123423', '423423'] }]
-    this.TagsHandler.promises.getAllTags = sinon.stub().resolves(allTags)
-    this.TagsController.getAllTags(this.req, {
-      json: body => {
-        body.should.equal(allTags)
-        sinon.assert.calledWith(this.TagsHandler.promises.getAllTags, userId)
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-
-  describe('create a tag', function (done) {
-    it('without a color', function (done) {
-      this.tag = { mock: 'tag' }
-      this.TagsHandler.promises.createTag = sinon.stub().resolves(this.tag)
-      this.req.session.user._id = this.userId = 'user-id-123'
-      this.req.body = { name: (this.name = 'tag-name') }
-      this.TagsController.createTag(this.req, {
-        json: () => {
-          sinon.assert.calledWith(
-            this.TagsHandler.promises.createTag,
-            this.userId,
-            this.name
-          )
-          done()
-          return {
-            end: () => {},
-          }
-        },
-      })
-    })
-
-    it('with a color', function (done) {
-      this.tag = { mock: 'tag' }
-      this.TagsHandler.promises.createTag = sinon.stub().resolves(this.tag)
-      this.req.session.user._id = this.userId = 'user-id-123'
-      this.req.body = {
-        name: (this.name = 'tag-name'),
-        color: (this.color = '#123456'),
-      }
-      this.TagsController.createTag(this.req, {
-        json: () => {
-          sinon.assert.calledWith(
-            this.TagsHandler.promises.createTag,
-            this.userId,
-            this.name,
-            this.color
-          )
-          done()
-          return {
-            end: () => {},
-          }
-        },
-      })
-    })
-  })
-
-  it('delete a tag', function (done) {
-    this.req.params.tagId = this.tagId = 'tag-id-123'
-    this.req.session.user._id = this.userId = 'user-id-123'
-    this.TagsController.deleteTag(this.req, {
-      status: code => {
-        assert.equal(code, 204)
-        sinon.assert.calledWith(
-          this.TagsHandler.promises.deleteTag,
-          this.userId,
-          this.tagId
-        )
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-
-  describe('edit a tag', function () {
-    beforeEach(function () {
-      this.req.params.tagId = this.tagId = 'tag-id-123'
-      this.req.session.user._id = this.userId = 'user-id-123'
-    })
-
-    it('with a name and no color', function (done) {
-      this.req.body = {
-        name: (this.name = 'new-name'),
-      }
-      this.TagsController.editTag(this.req, {
-        status: code => {
-          assert.equal(code, 204)
-          sinon.assert.calledWith(
-            this.TagsHandler.promises.editTag,
-            this.userId,
-            this.tagId,
-            this.name
-          )
-          done()
-          return {
-            end: () => {},
-          }
-        },
-      })
-    })
-
-    it('with a name and color', function (done) {
-      this.req.body = {
-        name: (this.name = 'new-name'),
-        color: (this.color = '#FF0011'),
-      }
-      this.TagsController.editTag(this.req, {
-        status: code => {
-          assert.equal(code, 204)
-          sinon.assert.calledWith(
-            this.TagsHandler.promises.editTag,
-            this.userId,
-            this.tagId,
-            this.name,
-            this.color
-          )
-          done()
-          return {
-            end: () => {},
-          }
-        },
-      })
-    })
-
-    it('without a name', function (done) {
-      this.req.body = { name: undefined }
-      this.TagsController.renameTag(this.req, {
-        status: code => {
-          assert.equal(code, 400)
-          sinon.assert.notCalled(this.TagsHandler.promises.renameTag)
-          done()
-          return {
-            end: () => {},
-          }
-        },
-      })
-    })
-  })
-
-  it('add a project to a tag', function (done) {
-    this.req.params.tagId = this.tagId = 'tag-id-123'
-    this.req.params.projectId = this.projectId = 'project-id-123'
-    this.req.session.user._id = this.userId = 'user-id-123'
-    this.TagsController.addProjectToTag(this.req, {
-      status: code => {
-        assert.equal(code, 204)
-        sinon.assert.calledWith(
-          this.TagsHandler.promises.addProjectToTag,
-          this.userId,
-          this.tagId,
-          this.projectId
-        )
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-
-  it('add projects to a tag', function (done) {
-    this.req.params.tagId = this.tagId = 'tag-id-123'
-    this.req.body.projectIds = this.projectIds = [
-      'project-id-123',
-      'project-id-234',
-    ]
-    this.req.session.user._id = this.userId = 'user-id-123'
-    this.TagsController.addProjectsToTag(this.req, {
-      status: code => {
-        assert.equal(code, 204)
-        sinon.assert.calledWith(
-          this.TagsHandler.promises.addProjectsToTag,
-          this.userId,
-          this.tagId,
-          this.projectIds
-        )
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-
-  it('remove a project from a tag', function (done) {
-    this.req.params.tagId = this.tagId = 'tag-id-123'
-    this.req.params.projectId = this.projectId = 'project-id-123'
-    this.req.session.user._id = this.userId = 'user-id-123'
-    this.TagsController.removeProjectFromTag(this.req, {
-      status: code => {
-        assert.equal(code, 204)
-        sinon.assert.calledWith(
-          this.TagsHandler.promises.removeProjectFromTag,
-          this.userId,
-          this.tagId,
-          this.projectId
-        )
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-
-  it('remove projects from a tag', function (done) {
-    this.req.params.tagId = this.tagId = 'tag-id-123'
-    this.req.body.projectIds = this.projectIds = [
-      'project-id-123',
-      'project-id-234',
-    ]
-    this.req.session.user._id = this.userId = 'user-id-123'
-    this.TagsController.removeProjectsFromTag(this.req, {
-      status: code => {
-        assert.equal(code, 204)
-        sinon.assert.calledWith(
-          this.TagsHandler.promises.removeProjectsFromTag,
-          this.userId,
-          this.tagId,
-          this.projectIds
-        )
-        done()
-        return {
-          end: () => {},
-        }
-      },
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Tags/TagsHandlerTests.js b/services/web/test/unit/src/Tags/TagsHandlerTests.js
index f30a649681..0ea36d7e17 100644
--- a/services/web/test/unit/src/Tags/TagsHandlerTests.js
+++ b/services/web/test/unit/src/Tags/TagsHandlerTests.js
@@ -30,78 +30,72 @@ describe('TagsHandler', function () {
   })
 
   describe('finding users tags', function () {
-    it('should find all the documents with that user id', function (done) {
+    it('should find all the documents with that user id', async function () {
       const stubbedTags = [{ name: 'tag1' }, { name: 'tag2' }, { name: 'tag3' }]
       this.TagMock.expects('find')
         .once()
         .withArgs({ user_id: this.userId })
         .resolves(stubbedTags)
-      this.TagsHandler.getAllTags(this.userId, (err, result) => {
-        expect(err).to.not.exist
-        this.TagMock.verify()
-        expect(result).to.deep.equal(stubbedTags)
-        done()
-      })
+      const result = await this.TagsHandler.promises.getAllTags(this.userId)
+      this.TagMock.verify()
+      expect(result).to.deep.equal(stubbedTags)
     })
   })
 
   describe('createTag', function () {
     describe('when insert succeeds', function () {
-      it('should call insert in mongo', function (done) {
+      it('should call insert in mongo', async function () {
         this.TagMock.expects('create')
           .withArgs(this.tag)
           .once()
           .resolves(this.tag)
-        this.TagsHandler.createTag(
+        const resultTag = await this.TagsHandler.promises.createTag(
           this.tag.user_id,
           this.tag.name,
-          this.tag.color,
-          (err, resultTag) => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            expect(resultTag.user_id).to.equal(this.tag.user_id)
-            expect(resultTag.name).to.equal(this.tag.name)
-            expect(resultTag.color).to.equal(this.tag.color)
-            done()
-          }
+          this.tag.color
         )
+        this.TagMock.verify()
+        expect(resultTag.user_id).to.equal(this.tag.user_id)
+        expect(resultTag.name).to.equal(this.tag.name)
+        expect(resultTag.color).to.equal(this.tag.color)
       })
     })
 
     describe('when truncate=true, and tag is too long', function () {
-      it('should truncate the tag name', function (done) {
+      it('should truncate the tag name', async function () {
         // Expect the tag to end up with this truncated name
         this.tag.name = 'a comically long tag that will be truncated intern'
         this.TagMock.expects('create')
           .withArgs(this.tag)
           .once()
           .resolves(this.tag)
-        this.TagsHandler.createTag(
+        const resultTag = await this.TagsHandler.promises.createTag(
           this.tag.user_id,
           // Pass this too-long name
           'a comically long tag that will be truncated internally and not throw an error',
           this.tag.color,
-          { truncate: true },
-          (err, resultTag) => {
-            expect(err).to.not.exist
-            expect(resultTag.name).to.equal(this.tag.name)
-            done()
-          }
+          { truncate: true }
         )
+        expect(resultTag.name).to.equal(this.tag.name)
       })
     })
 
     describe('when tag is too long', function () {
-      it('should throw an error', function (done) {
-        this.TagsHandler.createTag(
-          this.tag.user_id,
-          'this is a tag that is very very very very very very long',
-          undefined,
-          err => {
-            expect(err.message).to.equal('Exceeded max tag length')
-            done()
-          }
-        )
+      it('should throw an error', async function () {
+        let error
+
+        try {
+          await this.TagsHandler.promises.createTag(
+            this.tag.user_id,
+            'this is a tag that is very very very very very very long',
+            undefined
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+        expect(error).to.have.property('message', 'Exceeded max tag length')
       })
     })
 
@@ -111,7 +105,7 @@ describe('TagsHandler', function () {
         this.duplicateKeyError.code = 11000
       })
 
-      it('should get tag with findOne and return that tag', function (done) {
+      it('should get tag with findOne and return that tag', async function () {
         this.TagMock.expects('create')
           .withArgs(this.tag)
           .once()
@@ -120,26 +114,22 @@ describe('TagsHandler', function () {
           .withArgs({ user_id: this.tag.user_id, name: this.tag.name })
           .once()
           .resolves(this.tag)
-        this.TagsHandler.createTag(
+        const resultTag = await this.TagsHandler.promises.createTag(
           this.tag.user_id,
           this.tag.name,
-          this.tag.color,
-          (err, resultTag) => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            expect(resultTag.user_id).to.equal(this.tag.user_id)
-            expect(resultTag.name).to.equal(this.tag.name)
-            expect(resultTag.color).to.equal(this.tag.color)
-            done()
-          }
+          this.tag.color
         )
+        this.TagMock.verify()
+        expect(resultTag.user_id).to.equal(this.tag.user_id)
+        expect(resultTag.name).to.equal(this.tag.name)
+        expect(resultTag.color).to.equal(this.tag.color)
       })
     })
   })
 
   describe('addProjectToTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call update in mongo', function (done) {
+      it('should call update in mongo', async function () {
         this.TagMock.expects('findOneAndUpdate')
           .once()
           .withArgs(
@@ -147,23 +137,19 @@ describe('TagsHandler', function () {
             { $addToSet: { project_ids: this.projectId } }
           )
           .resolves()
-        this.TagsHandler.addProjectToTag(
+        await this.TagsHandler.promises.addProjectToTag(
           this.userId,
           this.tagId,
-          this.projectId,
-          err => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            done()
-          }
+          this.projectId
         )
+        this.TagMock.verify()
       })
     })
   })
 
   describe('addProjectsToTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call update in mongo', function (done) {
+      it('should call update in mongo', async function () {
         this.TagMock.expects('findOneAndUpdate')
           .once()
           .withArgs(
@@ -171,22 +157,18 @@ describe('TagsHandler', function () {
             { $addToSet: { project_ids: { $each: this.projectIds } } }
           )
           .resolves()
-        this.TagsHandler.addProjectsToTag(
+        await this.TagsHandler.promises.addProjectsToTag(
           this.userId,
           this.tagId,
-          this.projectIds,
-          err => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            done()
-          }
+          this.projectIds
         )
+        this.TagMock.verify()
       })
     })
   })
 
   describe('addProjectToTagName', function () {
-    it('should call update in mongo', function (done) {
+    it('should call update in mongo', async function () {
       this.TagMock.expects('updateOne')
         .once()
         .withArgs(
@@ -195,22 +177,18 @@ describe('TagsHandler', function () {
           { upsert: true }
         )
         .resolves()
-      this.TagsHandler.addProjectToTagName(
+      await this.TagsHandler.promises.addProjectToTagName(
         this.tag.userId,
         this.tag.name,
-        this.projectId,
-        err => {
-          expect(err).to.not.exist
-          this.TagMock.verify()
-          done()
-        }
+        this.projectId
       )
+      this.TagMock.verify()
     })
   })
 
   describe('removeProjectFromTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call update in mongo', function (done) {
+      it('should call update in mongo', async function () {
         this.TagMock.expects('updateOne')
           .once()
           .withArgs(
@@ -223,23 +201,20 @@ describe('TagsHandler', function () {
             }
           )
           .resolves()
-        this.TagsHandler.removeProjectFromTag(
+        await this.TagsHandler.promises.removeProjectFromTag(
           this.userId,
           this.tagId,
-          this.projectId,
-          err => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            done()
-          }
+          this.projectId
         )
+
+        this.TagMock.verify()
       })
     })
   })
 
   describe('removeProjectsFromTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call update in mongo', function (done) {
+      it('should call update in mongo', async function () {
         this.TagMock.expects('updateOne')
           .once()
           .withArgs(
@@ -252,22 +227,18 @@ describe('TagsHandler', function () {
             }
           )
           .resolves()
-        this.TagsHandler.removeProjectsFromTag(
+        await this.TagsHandler.promises.removeProjectsFromTag(
           this.userId,
           this.tagId,
-          this.projectIds,
-          err => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            done()
-          }
+          this.projectIds
         )
+        this.TagMock.verify()
       })
     })
   })
 
   describe('removeProjectFromAllTags', function () {
-    it('should pull the project id from the tag', function (done) {
+    it('should pull the project id from the tag', async function () {
       this.TagMock.expects('updateMany')
         .once()
         .withArgs(
@@ -279,20 +250,16 @@ describe('TagsHandler', function () {
           }
         )
         .resolves()
-      this.TagsHandler.removeProjectFromAllTags(
+      await this.TagsHandler.promises.removeProjectFromAllTags(
         this.userId,
-        this.projectId,
-        err => {
-          expect(err).to.not.exist
-          this.TagMock.verify()
-          done()
-        }
+        this.projectId
       )
+      this.TagMock.verify()
     })
   })
 
   describe('addProjectToTags', function () {
-    it('should add the project id to each tag', function (done) {
+    it('should add the project id to each tag', async function () {
       const tagIds = []
 
       this.TagMock.expects('updateMany')
@@ -307,38 +274,31 @@ describe('TagsHandler', function () {
           }
         )
         .resolves()
-      this.TagsHandler.addProjectToTags(
+      await this.TagsHandler.promises.addProjectToTags(
         this.userId,
         tagIds,
-        this.projectId,
-        (err, result) => {
-          expect(err).to.not.exist
-          this.TagMock.verify()
-          done()
-        }
+        this.projectId
       )
+      this.TagMock.verify()
     })
   })
 
   describe('deleteTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call remove in mongo', function (done) {
+      it('should call remove in mongo', async function () {
         this.TagMock.expects('deleteOne')
           .once()
           .withArgs({ _id: this.tagId, user_id: this.userId })
           .resolves()
-        this.TagsHandler.deleteTag(this.userId, this.tagId, err => {
-          expect(err).to.not.exist
-          this.TagMock.verify()
-          done()
-        })
+        await this.TagsHandler.promises.deleteTag(this.userId, this.tagId)
+        this.TagMock.verify()
       })
     })
   })
 
   describe('renameTag', function () {
     describe('with a valid tag_id', function () {
-      it('should call remove in mongo', function (done) {
+      it('should call remove in mongo', async function () {
         this.newName = 'new name'
         this.TagMock.expects('updateOne')
           .once()
@@ -347,30 +307,31 @@ describe('TagsHandler', function () {
             { $set: { name: this.newName } }
           )
           .resolves()
-        this.TagsHandler.renameTag(
+        await this.TagsHandler.promises.renameTag(
           this.userId,
           this.tagId,
-          this.newName,
-          err => {
-            expect(err).to.not.exist
-            this.TagMock.verify()
-            done()
-          }
+          this.newName
         )
+        this.TagMock.verify()
       })
     })
 
     describe('when tag is too long', function () {
-      it('should throw an error', function (done) {
-        this.TagsHandler.renameTag(
-          this.userId,
-          this.tagId,
-          'this is a tag that is very very very very very very long',
-          err => {
-            expect(err.message).to.equal('Exceeded max tag length')
-            done()
-          }
-        )
+      it('should throw an error', async function () {
+        let error
+
+        try {
+          await this.TagsHandler.promises.renameTag(
+            this.userId,
+            this.tagId,
+            'this is a tag that is very very very very very very long'
+          )
+        } catch (err) {
+          error = err
+        }
+
+        expect(error).to.exist
+        expect(error).to.have.property('message', 'Exceeded max tag length')
       })
     })
   })
diff --git a/services/web/test/unit/src/Templates/TemplatesControllerTests.js b/services/web/test/unit/src/Templates/TemplatesControllerTests.js
index 911a16a515..282f3121f9 100644
--- a/services/web/test/unit/src/Templates/TemplatesControllerTests.js
+++ b/services/web/test/unit/src/Templates/TemplatesControllerTests.js
@@ -18,6 +18,11 @@ describe('TemplatesController', function () {
         './TemplatesManager': (this.TemplatesManager = {
           promises: { createProjectFromV1Template: sinon.stub() },
         }),
+        '../SplitTests/SplitTestHandler': (this.SplitTestHandler = {
+          promises: {
+            getAssignment: sinon.stub().resolves({ variant: 'default' }),
+          },
+        }),
       },
     })
     this.next = sinon.stub()
diff --git a/services/web/test/unit/src/Templates/TemplatesManagerTests.js b/services/web/test/unit/src/Templates/TemplatesManagerTests.js
index f75827094d..2dcf821a05 100644
--- a/services/web/test/unit/src/Templates/TemplatesManagerTests.js
+++ b/services/web/test/unit/src/Templates/TemplatesManagerTests.js
@@ -121,6 +121,9 @@ describe('TemplatesManager', function () {
         fs: this.fs,
         '../../models/Project': { Project: this.Project },
         'stream/promises': { pipeline: this.pipeline },
+        '../Compile/ClsiCacheManager': {
+          prepareClsiCache: sinon.stub().rejects(new Error('ignore this')),
+        },
       },
     }).promises
     return (this.zipUrl =
diff --git a/services/web/test/unit/src/ThirdPartyDataStore/TpdsController.test.mjs b/services/web/test/unit/src/ThirdPartyDataStore/TpdsController.test.mjs
new file mode 100644
index 0000000000..b38e3c2bab
--- /dev/null
+++ b/services/web/test/unit/src/ThirdPartyDataStore/TpdsController.test.mjs
@@ -0,0 +1,568 @@
+import { expect, vi } from 'vitest'
+import mongodb from 'mongodb-legacy'
+import sinon from 'sinon'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import MockResponse from '../helpers/MockResponse.js'
+import MockRequest from '../helpers/MockRequest.js'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH =
+  '../../../../app/src/Features/ThirdPartyDataStore/TpdsController.mjs'
+
+describe('TpdsController', function () {
+  beforeEach(async function (ctx) {
+    ctx.metadata = {
+      projectId: new ObjectId(),
+      entityId: new ObjectId(),
+      folderId: new ObjectId(),
+      entityType: 'doc',
+      rev: 2,
+    }
+    ctx.TpdsUpdateHandler = {
+      promises: {
+        newUpdate: sinon.stub().resolves(ctx.metadata),
+        deleteUpdate: sinon.stub().resolves(ctx.metadata.entityId),
+        createFolder: sinon.stub().resolves(),
+      },
+    }
+    ctx.UpdateMerger = {
+      promises: {
+        mergeUpdate: sinon.stub().resolves(ctx.metadata),
+        deleteUpdate: sinon.stub().resolves(ctx.metadata.entityId),
+      },
+    }
+    ctx.NotificationsBuilder = {
+      tpdsFileLimit: sinon.stub().returns({ create: sinon.stub() }),
+    }
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns('user-id'),
+    }
+    ctx.TpdsQueueManager = {
+      promises: {
+        getQueues: sinon.stub().resolves('queues'),
+      },
+    }
+    ctx.HttpErrorHandler = {
+      conflict: sinon.stub(),
+    }
+
+    ctx.newProject = { _id: new ObjectId() }
+    ctx.ProjectCreationHandler = {
+      promises: { createBlankProject: sinon.stub().resolves(ctx.newProject) },
+    }
+    ctx.ProjectDetailsHandler = {
+      promises: {
+        generateUniqueName: sinon.stub().resolves('unique'),
+      },
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler',
+      () => ({
+        default: ctx.TpdsUpdateHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/ThirdPartyDataStore/UpdateMerger',
+      () => ({
+        default: ctx.UpdateMerger,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsBuilder',
+      () => ({
+        default: ctx.NotificationsBuilder,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Errors/HttpErrorHandler', () => ({
+      default: ctx.HttpErrorHandler,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/ThirdPartyDataStore/TpdsQueueManager',
+      () => ({
+        default: ctx.TpdsQueueManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectCreationHandler',
+      () => ({
+        default: ctx.ProjectCreationHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectDetailsHandler',
+      () => ({
+        default: ctx.ProjectDetailsHandler,
+      })
+    )
+
+    ctx.TpdsController = (await import(MODULE_PATH)).default
+
+    ctx.user_id = 'dsad29jlkjas'
+  })
+
+  describe('creating a project', function () {
+    it('should yield the new projects id', async function (ctx) {
+      await new Promise(resolve => {
+        const res = new MockResponse()
+        const req = new MockRequest()
+        req.params.user_id = ctx.user_id
+        req.body = { projectName: 'foo' }
+        res.callback = err => {
+          if (err) resolve(err)
+          expect(res.body).to.equal(
+            JSON.stringify({ projectId: ctx.newProject._id.toString() })
+          )
+          expect(
+            ctx.ProjectDetailsHandler.promises.generateUniqueName
+          ).to.have.been.calledWith(ctx.user_id, 'foo')
+          expect(
+            ctx.ProjectCreationHandler.promises.createBlankProject
+          ).to.have.been.calledWith(
+            ctx.user_id,
+            'unique',
+            {},
+            { skipCreatingInTPDS: true }
+          )
+          resolve()
+        }
+        ctx.TpdsController.createProject(req, res)
+      })
+    })
+  })
+
+  describe('getting an update', function () {
+    beforeEach(function (ctx) {
+      ctx.projectName = 'projectName'
+      ctx.path = '/here.txt'
+      ctx.req = {
+        params: {
+          0: `${ctx.projectName}${ctx.path}`,
+          user_id: ctx.user_id,
+          project_id: '',
+        },
+        headers: {
+          'x-update-source': (ctx.source = 'dropbox'),
+        },
+      }
+    })
+
+    it('should process the update with the update receiver by name', async function (ctx) {
+      await new Promise(resolve => {
+        const res = {
+          json: payload => {
+            expect(payload).to.deep.equal({
+              status: 'applied',
+              projectId: ctx.metadata.projectId.toString(),
+              entityId: ctx.metadata.entityId.toString(),
+              folderId: ctx.metadata.folderId.toString(),
+              entityType: ctx.metadata.entityType,
+              rev: ctx.metadata.rev.toString(),
+            })
+            ctx.TpdsUpdateHandler.promises.newUpdate
+              .calledWith(
+                ctx.user_id,
+                '', // projectId
+                ctx.projectName,
+                ctx.path,
+                ctx.req,
+                ctx.source
+              )
+              .should.equal(true)
+            resolve()
+          },
+        }
+        ctx.TpdsController.mergeUpdate(ctx.req, res)
+      })
+    })
+
+    it('should indicate in the response when the update was rejected', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TpdsUpdateHandler.promises.newUpdate.resolves(null)
+        const res = {
+          json: payload => {
+            expect(payload).to.deep.equal({ status: 'rejected' })
+            resolve()
+          },
+        }
+        ctx.TpdsController.mergeUpdate(ctx.req, res)
+      })
+    })
+
+    it('should process the update with the update receiver by id', async function (ctx) {
+      await new Promise(resolve => {
+        const path = '/here.txt'
+        const req = {
+          pause() {},
+          params: { 0: path, user_id: ctx.user_id, project_id: '123' },
+          session: {
+            destroy() {},
+          },
+          headers: {
+            'x-update-source': (ctx.source = 'dropbox'),
+          },
+        }
+        const res = {
+          json: () => {
+            ctx.TpdsUpdateHandler.promises.newUpdate.should.have.been.calledWith(
+              ctx.user_id,
+              '123',
+              '', // projectName
+              '/here.txt',
+              req,
+              ctx.source
+            )
+            resolve()
+          },
+        }
+        ctx.TpdsController.mergeUpdate(req, res)
+      })
+    })
+
+    it('should return a 500 error when the update receiver fails', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TpdsUpdateHandler.promises.newUpdate.rejects(new Error())
+        const res = {
+          json: sinon.stub(),
+        }
+        ctx.TpdsController.mergeUpdate(ctx.req, res, err => {
+          expect(err).to.exist
+          expect(res.json).not.to.have.been.called
+          resolve()
+        })
+      })
+    })
+
+    it('should return a 400 error when the project is too big', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TpdsUpdateHandler.promises.newUpdate.rejects({
+          message: 'project_has_too_many_files',
+        })
+        const res = {
+          sendStatus: status => {
+            expect(status).to.equal(400)
+            ctx.NotificationsBuilder.tpdsFileLimit.should.have.been.calledWith(
+              ctx.user_id
+            )
+            resolve()
+          },
+        }
+        ctx.TpdsController.mergeUpdate(ctx.req, res)
+      })
+    })
+
+    it('should return a 429 error when the update receiver fails due to too many requests error', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TpdsUpdateHandler.promises.newUpdate.rejects(
+          new Errors.TooManyRequestsError('project on cooldown')
+        )
+        const res = {
+          sendStatus: status => {
+            expect(status).to.equal(429)
+            resolve()
+          },
+        }
+        ctx.TpdsController.mergeUpdate(ctx.req, res)
+      })
+    })
+  })
+
+  describe('getting a delete update', function () {
+    it('should process the delete with the update receiver by name', async function (ctx) {
+      await new Promise(resolve => {
+        const path = '/projectName/here.txt'
+        const req = {
+          params: { 0: path, user_id: ctx.user_id, project_id: '' },
+          session: {
+            destroy() {},
+          },
+          headers: {
+            'x-update-source': (ctx.source = 'dropbox'),
+          },
+        }
+        const res = {
+          sendStatus: () => {
+            ctx.TpdsUpdateHandler.promises.deleteUpdate
+              .calledWith(
+                ctx.user_id,
+                '',
+                'projectName',
+                '/here.txt',
+                ctx.source
+              )
+              .should.equal(true)
+            resolve()
+          },
+        }
+        ctx.TpdsController.deleteUpdate(req, res)
+      })
+    })
+
+    it('should process the delete with the update receiver by id', async function (ctx) {
+      await new Promise(resolve => {
+        const path = '/here.txt'
+        const req = {
+          params: { 0: path, user_id: ctx.user_id, project_id: '123' },
+          session: {
+            destroy() {},
+          },
+          headers: {
+            'x-update-source': (ctx.source = 'dropbox'),
+          },
+        }
+        const res = {
+          sendStatus: () => {
+            ctx.TpdsUpdateHandler.promises.deleteUpdate.should.have.been.calledWith(
+              ctx.user_id,
+              '123',
+              '', // projectName
+              '/here.txt',
+              ctx.source
+            )
+            resolve()
+          },
+        }
+        ctx.TpdsController.deleteUpdate(req, res)
+      })
+    })
+  })
+
+  describe('updateFolder', function () {
+    beforeEach(function (ctx) {
+      ctx.req = {
+        body: { userId: ctx.user_id, path: '/abc/def/ghi.txt' },
+      }
+      ctx.res = {
+        json: sinon.stub(),
+      }
+    })
+
+    it("creates a folder if it doesn't exist", async function (ctx) {
+      await new Promise(resolve => {
+        const metadata = {
+          folderId: new ObjectId(),
+          projectId: new ObjectId(),
+          path: '/def/ghi.txt',
+          parentFolderId: new ObjectId(),
+        }
+        ctx.TpdsUpdateHandler.promises.createFolder.resolves(metadata)
+        ctx.res.json.callsFake(body => {
+          expect(body).to.deep.equal({
+            entityId: metadata.folderId.toString(),
+            projectId: metadata.projectId.toString(),
+            path: metadata.path,
+            folderId: metadata.parentFolderId.toString(),
+          })
+          resolve()
+        })
+        ctx.TpdsController.updateFolder(ctx.req, ctx.res)
+      })
+    })
+
+    it('supports top level folders', async function (ctx) {
+      await new Promise(resolve => {
+        const metadata = {
+          folderId: new ObjectId(),
+          projectId: new ObjectId(),
+          path: '/',
+          parentFolderId: null,
+        }
+        ctx.TpdsUpdateHandler.promises.createFolder.resolves(metadata)
+        ctx.res.json.callsFake(body => {
+          expect(body).to.deep.equal({
+            entityId: metadata.folderId.toString(),
+            projectId: metadata.projectId.toString(),
+            path: metadata.path,
+            folderId: null,
+          })
+          resolve()
+        })
+        ctx.TpdsController.updateFolder(ctx.req, ctx.res)
+      })
+    })
+
+    it("returns a 409 if the folder couldn't be created", async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TpdsUpdateHandler.promises.createFolder.resolves(null)
+        ctx.HttpErrorHandler.conflict.callsFake((req, res) => {
+          expect(req).to.equal(ctx.req)
+          expect(res).to.equal(ctx.res)
+          resolve()
+        })
+        ctx.TpdsController.updateFolder(ctx.req, ctx.res)
+      })
+    })
+  })
+
+  describe('parseParams', function () {
+    it('should take the project name off the start and replace with slash', function (ctx) {
+      const path = 'noSlashHere'
+      const req = { params: { 0: path, user_id: ctx.user_id } }
+      const result = ctx.TpdsController.parseParams(req)
+      result.userId.should.equal(ctx.user_id)
+      result.filePath.should.equal('/')
+      result.projectName.should.equal(path)
+    })
+
+    it('should take the project name off the start and it with no slashes in', function (ctx) {
+      const path = '/project/file.tex'
+      const req = { params: { 0: path, user_id: ctx.user_id } }
+      const result = ctx.TpdsController.parseParams(req)
+      result.userId.should.equal(ctx.user_id)
+      result.filePath.should.equal('/file.tex')
+      result.projectName.should.equal('project')
+    })
+
+    it('should take the project name of and return a slash for the file path', function (ctx) {
+      const path = '/project_name'
+      const req = { params: { 0: path, user_id: ctx.user_id } }
+      const result = ctx.TpdsController.parseParams(req)
+      result.projectName.should.equal('project_name')
+      result.filePath.should.equal('/')
+    })
+  })
+
+  describe('updateProjectContents', function () {
+    beforeEach(async function (ctx) {
+      ctx.req = {
+        params: {
+          0: (ctx.path = 'chapters/main.tex'),
+          project_id: (ctx.project_id = 'project-id-123'),
+        },
+        session: {
+          destroy: sinon.stub(),
+        },
+        headers: {
+          'x-update-source': (ctx.source = 'github'),
+        },
+      }
+
+      ctx.res = {
+        json: sinon.stub(),
+        sendStatus: sinon.stub(),
+      }
+
+      await ctx.TpdsController.promises.updateProjectContents(ctx.req, ctx.res)
+    })
+
+    it('should merge the update', function (ctx) {
+      ctx.UpdateMerger.promises.mergeUpdate.should.be.calledWith(
+        null,
+        ctx.project_id,
+        `/${ctx.path}`,
+        ctx.req,
+        ctx.source
+      )
+    })
+
+    it('should return a success', function (ctx) {
+      ctx.res.json.should.be.calledWith({
+        entityId: ctx.metadata.entityId.toString(),
+        rev: ctx.metadata.rev,
+      })
+    })
+  })
+
+  describe('deleteProjectContents', function () {
+    beforeEach(async function (ctx) {
+      ctx.req = {
+        params: {
+          0: (ctx.path = 'chapters/main.tex'),
+          project_id: (ctx.project_id = 'project-id-123'),
+        },
+        session: {
+          destroy: sinon.stub(),
+        },
+        headers: {
+          'x-update-source': (ctx.source = 'github'),
+        },
+      }
+      ctx.res = {
+        sendStatus: sinon.stub(),
+        json: sinon.stub(),
+      }
+
+      await ctx.TpdsController.promises.deleteProjectContents(ctx.req, ctx.res)
+    })
+
+    it('should delete the file', function (ctx) {
+      ctx.UpdateMerger.promises.deleteUpdate.should.be.calledWith(
+        null,
+        ctx.project_id,
+        `/${ctx.path}`,
+        ctx.source
+      )
+    })
+
+    it('should return a success', function (ctx) {
+      ctx.res.json.should.be.calledWith({
+        entityId: ctx.metadata.entityId,
+      })
+    })
+  })
+
+  describe('getQueues', function () {
+    beforeEach(function (ctx) {
+      ctx.req = {}
+      ctx.res = { json: sinon.stub() }
+      ctx.next = sinon.stub()
+    })
+
+    describe('success', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.res.json.callsFake(() => {
+            resolve()
+          })
+          ctx.TpdsController.getQueues(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should use userId from session', function (ctx) {
+        ctx.SessionManager.getLoggedInUserId.should.have.been.calledOnce
+        ctx.TpdsQueueManager.promises.getQueues.should.have.been.calledWith(
+          'user-id'
+        )
+      })
+
+      it('should call json with response', function (ctx) {
+        ctx.res.json.should.have.been.calledWith('queues')
+        ctx.next.should.not.have.been.called
+      })
+    })
+
+    describe('error', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.err = new Error()
+          ctx.TpdsQueueManager.promises.getQueues = sinon
+            .stub()
+            .rejects(ctx.err)
+          ctx.next.callsFake(() => {
+            resolve()
+          })
+          ctx.TpdsController.getQueues(ctx.req, ctx.res, ctx.next)
+        })
+      })
+
+      it('should call next with error', function (ctx) {
+        ctx.res.json.should.not.have.been.called
+        ctx.next.should.have.been.calledWith(ctx.err)
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/ThirdPartyDataStore/TpdsControllerTests.mjs b/services/web/test/unit/src/ThirdPartyDataStore/TpdsControllerTests.mjs
deleted file mode 100644
index 4dd72b117f..0000000000
--- a/services/web/test/unit/src/ThirdPartyDataStore/TpdsControllerTests.mjs
+++ /dev/null
@@ -1,510 +0,0 @@
-import mongodb from 'mongodb-legacy'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import sinon from 'sinon'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-import MockResponse from '../helpers/MockResponse.js'
-import MockRequest from '../helpers/MockRequest.js'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH =
-  '../../../../app/src/Features/ThirdPartyDataStore/TpdsController.mjs'
-
-describe('TpdsController', function () {
-  beforeEach(async function () {
-    this.metadata = {
-      projectId: new ObjectId(),
-      entityId: new ObjectId(),
-      folderId: new ObjectId(),
-      entityType: 'doc',
-      rev: 2,
-    }
-    this.TpdsUpdateHandler = {
-      promises: {
-        newUpdate: sinon.stub().resolves(this.metadata),
-        deleteUpdate: sinon.stub().resolves(this.metadata.entityId),
-        createFolder: sinon.stub().resolves(),
-      },
-    }
-    this.UpdateMerger = {
-      promises: {
-        mergeUpdate: sinon.stub().resolves(this.metadata),
-        deleteUpdate: sinon.stub().resolves(this.metadata.entityId),
-      },
-    }
-    this.NotificationsBuilder = {
-      tpdsFileLimit: sinon.stub().returns({ create: sinon.stub() }),
-    }
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns('user-id'),
-    }
-    this.TpdsQueueManager = {
-      promises: {
-        getQueues: sinon.stub().resolves('queues'),
-      },
-    }
-    this.HttpErrorHandler = {
-      conflict: sinon.stub(),
-    }
-
-    this.newProject = { _id: new ObjectId() }
-    this.ProjectCreationHandler = {
-      promises: { createBlankProject: sinon.stub().resolves(this.newProject) },
-    }
-    this.ProjectDetailsHandler = {
-      promises: {
-        generateUniqueName: sinon.stub().resolves('unique'),
-      },
-    }
-    this.TpdsController = await esmock.strict(MODULE_PATH, {
-      '../../../../app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler':
-        this.TpdsUpdateHandler,
-      '../../../../app/src/Features/ThirdPartyDataStore/UpdateMerger':
-        this.UpdateMerger,
-      '../../../../app/src/Features/Notifications/NotificationsBuilder':
-        this.NotificationsBuilder,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/Errors/HttpErrorHandler':
-        this.HttpErrorHandler,
-      '../../../../app/src/Features/ThirdPartyDataStore/TpdsQueueManager':
-        this.TpdsQueueManager,
-      '../../../../app/src/Features/Project/ProjectCreationHandler':
-        this.ProjectCreationHandler,
-      '../../../../app/src/Features/Project/ProjectDetailsHandler':
-        this.ProjectDetailsHandler,
-    })
-
-    this.user_id = 'dsad29jlkjas'
-  })
-
-  describe('creating a project', function () {
-    it('should yield the new projects id', function (done) {
-      const res = new MockResponse()
-      const req = new MockRequest()
-      req.params.user_id = this.user_id
-      req.body = { projectName: 'foo' }
-      res.callback = err => {
-        if (err) done(err)
-        expect(res.body).to.equal(
-          JSON.stringify({ projectId: this.newProject._id.toString() })
-        )
-        expect(
-          this.ProjectDetailsHandler.promises.generateUniqueName
-        ).to.have.been.calledWith(this.user_id, 'foo')
-        expect(
-          this.ProjectCreationHandler.promises.createBlankProject
-        ).to.have.been.calledWith(
-          this.user_id,
-          'unique',
-          {},
-          { skipCreatingInTPDS: true }
-        )
-        done()
-      }
-      this.TpdsController.createProject(req, res)
-    })
-  })
-
-  describe('getting an update', function () {
-    beforeEach(function () {
-      this.projectName = 'projectName'
-      this.path = '/here.txt'
-      this.req = {
-        params: {
-          0: `${this.projectName}${this.path}`,
-          user_id: this.user_id,
-          project_id: '',
-        },
-        headers: {
-          'x-update-source': (this.source = 'dropbox'),
-        },
-      }
-    })
-
-    it('should process the update with the update receiver by name', function (done) {
-      const res = {
-        json: payload => {
-          expect(payload).to.deep.equal({
-            status: 'applied',
-            projectId: this.metadata.projectId.toString(),
-            entityId: this.metadata.entityId.toString(),
-            folderId: this.metadata.folderId.toString(),
-            entityType: this.metadata.entityType,
-            rev: this.metadata.rev.toString(),
-          })
-          this.TpdsUpdateHandler.promises.newUpdate
-            .calledWith(
-              this.user_id,
-              '', // projectId
-              this.projectName,
-              this.path,
-              this.req,
-              this.source
-            )
-            .should.equal(true)
-          done()
-        },
-      }
-      this.TpdsController.mergeUpdate(this.req, res)
-    })
-
-    it('should indicate in the response when the update was rejected', function (done) {
-      this.TpdsUpdateHandler.promises.newUpdate.resolves(null)
-      const res = {
-        json: payload => {
-          expect(payload).to.deep.equal({ status: 'rejected' })
-          done()
-        },
-      }
-      this.TpdsController.mergeUpdate(this.req, res)
-    })
-
-    it('should process the update with the update receiver by id', function (done) {
-      const path = '/here.txt'
-      const req = {
-        pause() {},
-        params: { 0: path, user_id: this.user_id, project_id: '123' },
-        session: {
-          destroy() {},
-        },
-        headers: {
-          'x-update-source': (this.source = 'dropbox'),
-        },
-      }
-      const res = {
-        json: () => {
-          this.TpdsUpdateHandler.promises.newUpdate.should.have.been.calledWith(
-            this.user_id,
-            '123',
-            '', // projectName
-            '/here.txt',
-            req,
-            this.source
-          )
-          done()
-        },
-      }
-      this.TpdsController.mergeUpdate(req, res)
-    })
-
-    it('should return a 500 error when the update receiver fails', function (done) {
-      this.TpdsUpdateHandler.promises.newUpdate.rejects(new Error())
-      const res = {
-        json: sinon.stub(),
-      }
-      this.TpdsController.mergeUpdate(this.req, res, err => {
-        expect(err).to.exist
-        expect(res.json).not.to.have.been.called
-        done()
-      })
-    })
-
-    it('should return a 400 error when the project is too big', function (done) {
-      this.TpdsUpdateHandler.promises.newUpdate.rejects({
-        message: 'project_has_too_many_files',
-      })
-      const res = {
-        sendStatus: status => {
-          expect(status).to.equal(400)
-          this.NotificationsBuilder.tpdsFileLimit.should.have.been.calledWith(
-            this.user_id
-          )
-          done()
-        },
-      }
-      this.TpdsController.mergeUpdate(this.req, res)
-    })
-
-    it('should return a 429 error when the update receiver fails due to too many requests error', function (done) {
-      this.TpdsUpdateHandler.promises.newUpdate.rejects(
-        new Errors.TooManyRequestsError('project on cooldown')
-      )
-      const res = {
-        sendStatus: status => {
-          expect(status).to.equal(429)
-          done()
-        },
-      }
-      this.TpdsController.mergeUpdate(this.req, res)
-    })
-  })
-
-  describe('getting a delete update', function () {
-    it('should process the delete with the update receiver by name', function (done) {
-      const path = '/projectName/here.txt'
-      const req = {
-        params: { 0: path, user_id: this.user_id, project_id: '' },
-        session: {
-          destroy() {},
-        },
-        headers: {
-          'x-update-source': (this.source = 'dropbox'),
-        },
-      }
-      const res = {
-        sendStatus: () => {
-          this.TpdsUpdateHandler.promises.deleteUpdate
-            .calledWith(
-              this.user_id,
-              '',
-              'projectName',
-              '/here.txt',
-              this.source
-            )
-            .should.equal(true)
-          done()
-        },
-      }
-      this.TpdsController.deleteUpdate(req, res)
-    })
-
-    it('should process the delete with the update receiver by id', function (done) {
-      const path = '/here.txt'
-      const req = {
-        params: { 0: path, user_id: this.user_id, project_id: '123' },
-        session: {
-          destroy() {},
-        },
-        headers: {
-          'x-update-source': (this.source = 'dropbox'),
-        },
-      }
-      const res = {
-        sendStatus: () => {
-          this.TpdsUpdateHandler.promises.deleteUpdate.should.have.been.calledWith(
-            this.user_id,
-            '123',
-            '', // projectName
-            '/here.txt',
-            this.source
-          )
-          done()
-        },
-      }
-      this.TpdsController.deleteUpdate(req, res)
-    })
-  })
-
-  describe('updateFolder', function () {
-    beforeEach(function () {
-      this.req = {
-        body: { userId: this.user_id, path: '/abc/def/ghi.txt' },
-      }
-      this.res = {
-        json: sinon.stub(),
-      }
-    })
-
-    it("creates a folder if it doesn't exist", function (done) {
-      const metadata = {
-        folderId: new ObjectId(),
-        projectId: new ObjectId(),
-        path: '/def/ghi.txt',
-        parentFolderId: new ObjectId(),
-      }
-      this.TpdsUpdateHandler.promises.createFolder.resolves(metadata)
-      this.res.json.callsFake(body => {
-        expect(body).to.deep.equal({
-          entityId: metadata.folderId.toString(),
-          projectId: metadata.projectId.toString(),
-          path: metadata.path,
-          folderId: metadata.parentFolderId.toString(),
-        })
-        done()
-      })
-      this.TpdsController.updateFolder(this.req, this.res)
-    })
-
-    it('supports top level folders', function (done) {
-      const metadata = {
-        folderId: new ObjectId(),
-        projectId: new ObjectId(),
-        path: '/',
-        parentFolderId: null,
-      }
-      this.TpdsUpdateHandler.promises.createFolder.resolves(metadata)
-      this.res.json.callsFake(body => {
-        expect(body).to.deep.equal({
-          entityId: metadata.folderId.toString(),
-          projectId: metadata.projectId.toString(),
-          path: metadata.path,
-          folderId: null,
-        })
-        done()
-      })
-      this.TpdsController.updateFolder(this.req, this.res)
-    })
-
-    it("returns a 409 if the folder couldn't be created", function (done) {
-      this.TpdsUpdateHandler.promises.createFolder.resolves(null)
-      this.HttpErrorHandler.conflict.callsFake((req, res) => {
-        expect(req).to.equal(this.req)
-        expect(res).to.equal(this.res)
-        done()
-      })
-      this.TpdsController.updateFolder(this.req, this.res)
-    })
-  })
-
-  describe('parseParams', function () {
-    it('should take the project name off the start and replace with slash', function () {
-      const path = 'noSlashHere'
-      const req = { params: { 0: path, user_id: this.user_id } }
-      const result = this.TpdsController.parseParams(req)
-      result.userId.should.equal(this.user_id)
-      result.filePath.should.equal('/')
-      result.projectName.should.equal(path)
-    })
-
-    it('should take the project name off the start and it with no slashes in', function () {
-      const path = '/project/file.tex'
-      const req = { params: { 0: path, user_id: this.user_id } }
-      const result = this.TpdsController.parseParams(req)
-      result.userId.should.equal(this.user_id)
-      result.filePath.should.equal('/file.tex')
-      result.projectName.should.equal('project')
-    })
-
-    it('should take the project name of and return a slash for the file path', function () {
-      const path = '/project_name'
-      const req = { params: { 0: path, user_id: this.user_id } }
-      const result = this.TpdsController.parseParams(req)
-      result.projectName.should.equal('project_name')
-      result.filePath.should.equal('/')
-    })
-  })
-
-  describe('updateProjectContents', function () {
-    beforeEach(async function () {
-      this.req = {
-        params: {
-          0: (this.path = 'chapters/main.tex'),
-          project_id: (this.project_id = 'project-id-123'),
-        },
-        session: {
-          destroy: sinon.stub(),
-        },
-        headers: {
-          'x-update-source': (this.source = 'github'),
-        },
-      }
-
-      this.res = {
-        json: sinon.stub(),
-        sendStatus: sinon.stub(),
-      }
-
-      await this.TpdsController.promises.updateProjectContents(
-        this.req,
-        this.res
-      )
-    })
-
-    it('should merge the update', function () {
-      this.UpdateMerger.promises.mergeUpdate.should.be.calledWith(
-        null,
-        this.project_id,
-        `/${this.path}`,
-        this.req,
-        this.source
-      )
-    })
-
-    it('should return a success', function () {
-      this.res.json.should.be.calledWith({
-        entityId: this.metadata.entityId.toString(),
-        rev: this.metadata.rev,
-      })
-    })
-  })
-
-  describe('deleteProjectContents', function () {
-    beforeEach(async function () {
-      this.req = {
-        params: {
-          0: (this.path = 'chapters/main.tex'),
-          project_id: (this.project_id = 'project-id-123'),
-        },
-        session: {
-          destroy: sinon.stub(),
-        },
-        headers: {
-          'x-update-source': (this.source = 'github'),
-        },
-      }
-      this.res = {
-        sendStatus: sinon.stub(),
-        json: sinon.stub(),
-      }
-
-      await this.TpdsController.promises.deleteProjectContents(
-        this.req,
-        this.res
-      )
-    })
-
-    it('should delete the file', function () {
-      this.UpdateMerger.promises.deleteUpdate.should.be.calledWith(
-        null,
-        this.project_id,
-        `/${this.path}`,
-        this.source
-      )
-    })
-
-    it('should return a success', function () {
-      this.res.json.should.be.calledWith({
-        entityId: this.metadata.entityId,
-      })
-    })
-  })
-
-  describe('getQueues', function () {
-    beforeEach(function () {
-      this.req = {}
-      this.res = { json: sinon.stub() }
-      this.next = sinon.stub()
-    })
-
-    describe('success', function () {
-      beforeEach(function (done) {
-        this.res.json.callsFake(() => {
-          done()
-        })
-        this.TpdsController.getQueues(this.req, this.res, this.next)
-      })
-
-      it('should use userId from session', function () {
-        this.SessionManager.getLoggedInUserId.should.have.been.calledOnce
-        this.TpdsQueueManager.promises.getQueues.should.have.been.calledWith(
-          'user-id'
-        )
-      })
-
-      it('should call json with response', function () {
-        this.res.json.should.have.been.calledWith('queues')
-        this.next.should.not.have.been.called
-      })
-    })
-
-    describe('error', function () {
-      beforeEach(function (done) {
-        this.err = new Error()
-        this.TpdsQueueManager.promises.getQueues = sinon
-          .stub()
-          .rejects(this.err)
-        this.next.callsFake(() => {
-          done()
-        })
-        this.TpdsController.getQueues(this.req, this.res, this.next)
-      })
-
-      it('should call next with error', function () {
-        this.res.json.should.not.have.been.called
-        this.next.should.have.been.calledWith(this.err)
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandlerTests.mjs b/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandler.test.mjs
similarity index 59%
rename from services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandlerTests.mjs
rename to services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandler.test.mjs
index 5d52417434..f58ef6ec1c 100644
--- a/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandlerTests.mjs
+++ b/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateHandler.test.mjs
@@ -1,6 +1,5 @@
-import esmock from 'esmock'
+import { expect, vi } from 'vitest'
 import sinon from 'sinon'
-import { expect } from 'chai'
 import mongodb from 'mongodb-legacy'
 import Errors from '../../../../app/src/Features/Errors/Errors.js'
 
@@ -9,120 +8,158 @@ const ObjectId = mongodb.ObjectId
 const MODULE_PATH =
   '../../../../app/src/Features/ThirdPartyDataStore/TpdsUpdateHandler.mjs'
 
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
 describe('TpdsUpdateHandler', function () {
-  beforeEach(async function () {
-    this.projectName = 'My recipes'
-    this.projects = {
-      active1: { _id: new ObjectId(), name: this.projectName },
-      active2: { _id: new ObjectId(), name: this.projectName },
+  beforeEach(async function (ctx) {
+    ctx.projectName = 'My recipes'
+    ctx.projects = {
+      active1: { _id: new ObjectId(), name: ctx.projectName },
+      active2: { _id: new ObjectId(), name: ctx.projectName },
       archived1: {
         _id: new ObjectId(),
-        name: this.projectName,
-        archived: [this.userId],
+        name: ctx.projectName,
+        archived: [ctx.userId],
       },
       archived2: {
         _id: new ObjectId(),
-        name: this.projectName,
-        archived: [this.userId],
+        name: ctx.projectName,
+        archived: [ctx.userId],
       },
     }
-    this.userId = new ObjectId()
-    this.source = 'dropbox'
-    this.path = `/some/file`
-    this.update = {}
-    this.folderPath = '/some/folder'
-    this.folder = {
+    ctx.userId = new ObjectId()
+    ctx.source = 'dropbox'
+    ctx.path = `/some/file`
+    ctx.update = {}
+    ctx.folderPath = '/some/folder'
+    ctx.folder = {
       _id: new ObjectId(),
       parentFolder_id: new ObjectId(),
     }
 
-    this.CooldownManager = {
+    ctx.CooldownManager = {
       promises: {
         isProjectOnCooldown: sinon.stub().resolves(false),
       },
     }
-    this.FileTypeManager = {
+    ctx.FileTypeManager = {
       promises: {
         shouldIgnore: sinon.stub().resolves(false),
       },
     }
-    this.Modules = {
+    ctx.Modules = {
       promises: {
         hooks: { fire: sinon.stub().resolves() },
       },
     }
-    this.notification = {
+    ctx.notification = {
       create: sinon.stub().resolves(),
     }
-    this.NotificationsBuilder = {
+    ctx.NotificationsBuilder = {
       promises: {
-        dropboxDuplicateProjectNames: sinon.stub().returns(this.notification),
+        dropboxDuplicateProjectNames: sinon.stub().returns(ctx.notification),
       },
     }
-    this.ProjectCreationHandler = {
+    ctx.ProjectCreationHandler = {
       promises: {
-        createBlankProject: sinon.stub().resolves(this.projects.active1),
+        createBlankProject: sinon.stub().resolves(ctx.projects.active1),
       },
     }
-    this.ProjectDeleter = {
+    ctx.ProjectDeleter = {
       promises: {
         markAsDeletedByExternalSource: sinon.stub().resolves(),
       },
     }
-    this.ProjectGetter = {
+    ctx.ProjectGetter = {
       promises: {
         findUsersProjectsByName: sinon.stub(),
         findAllUsersProjects: sinon
           .stub()
-          .resolves({ owned: [this.projects.active1], readAndWrite: [] }),
+          .resolves({ owned: [ctx.projects.active1], readAndWrite: [] }),
       },
     }
-    this.ProjectHelper = {
+    ctx.ProjectHelper = {
       isArchivedOrTrashed: sinon.stub().returns(false),
     }
-    this.ProjectHelper.isArchivedOrTrashed
-      .withArgs(this.projects.archived1, this.userId)
+    ctx.ProjectHelper.isArchivedOrTrashed
+      .withArgs(ctx.projects.archived1, ctx.userId)
       .returns(true)
-    this.ProjectHelper.isArchivedOrTrashed
-      .withArgs(this.projects.archived2, this.userId)
+    ctx.ProjectHelper.isArchivedOrTrashed
+      .withArgs(ctx.projects.archived2, ctx.userId)
       .returns(true)
-    this.RootDocManager = {
+    ctx.RootDocManager = {
       setRootDocAutomaticallyInBackground: sinon.stub(),
     }
-    this.UpdateMerger = {
+    ctx.UpdateMerger = {
       promises: {
         deleteUpdate: sinon.stub().resolves(),
         mergeUpdate: sinon.stub().resolves(),
-        createFolder: sinon.stub().resolves(this.folder),
+        createFolder: sinon.stub().resolves(ctx.folder),
       },
     }
 
-    this.TpdsUpdateHandler = await esmock.strict(MODULE_PATH, {
-      '.../../../../app/src/Features/Cooldown/CooldownManager':
-        this.CooldownManager,
-      '../../../../app/src/Features/Uploads/FileTypeManager':
-        this.FileTypeManager,
-      '../../../../app/src/infrastructure/Modules': this.Modules,
-      '../../../../app/src/Features/Notifications/NotificationsBuilder':
-        this.NotificationsBuilder,
-      '../../../../app/src/Features/Project/ProjectCreationHandler':
-        this.ProjectCreationHandler,
-      '../../../../app/src/Features/Project/ProjectDeleter':
-        this.ProjectDeleter,
-      '../../../../app/src/Features/Project/ProjectGetter': this.ProjectGetter,
-      '../../../../app/src/Features/Project/ProjectHelper': this.ProjectHelper,
-      '../../../../app/src/Features/Project/ProjectRootDocManager':
-        this.RootDocManager,
-      '../../../../app/src/Features/ThirdPartyDataStore/UpdateMerger':
-        this.UpdateMerger,
-    })
+    vi.doMock('../../../../app/src/Features/Cooldown/CooldownManager', () => ({
+      default: ctx.CooldownManager,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Uploads/FileTypeManager', () => ({
+      default: ctx.FileTypeManager,
+    }))
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: ctx.Modules,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Notifications/NotificationsBuilder',
+      () => ({
+        default: ctx.NotificationsBuilder,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectCreationHandler',
+      () => ({
+        default: ctx.ProjectCreationHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectDeleter', () => ({
+      default: ctx.ProjectDeleter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectHelper', () => ({
+      default: ctx.ProjectHelper,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectRootDocManager',
+      () => ({
+        default: ctx.RootDocManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/ThirdPartyDataStore/UpdateMerger',
+      () => ({
+        default: ctx.UpdateMerger,
+      })
+    )
+
+    ctx.TpdsUpdateHandler = (await import(MODULE_PATH)).default
   })
 
   describe('getting an update', function () {
     describe('byId', function () {
       describe('with no matching project', function () {
-        beforeEach(function () {
-          this.projectId = new ObjectId().toString()
+        beforeEach(function (ctx) {
+          ctx.projectId = new ObjectId().toString()
         })
         receiveUpdateById()
         expectProjectNotCreated()
@@ -130,8 +167,8 @@ describe('TpdsUpdateHandler', function () {
       })
 
       describe('with one matching active project', function () {
-        beforeEach(function () {
-          this.projectId = this.projects.active1._id.toString()
+        beforeEach(function (ctx) {
+          ctx.projectId = ctx.projects.active1._id.toString()
         })
         receiveUpdateById()
         expectProjectNotCreated()
@@ -187,8 +224,8 @@ describe('TpdsUpdateHandler', function () {
 
     describe('update to a file that should be ignored', async function () {
       setupMatchingProjects(['active1'])
-      beforeEach(function () {
-        this.FileTypeManager.promises.shouldIgnore.resolves(true)
+      beforeEach(function (ctx) {
+        ctx.FileTypeManager.promises.shouldIgnore.resolves(true)
       })
       receiveUpdate()
       expectProjectNotCreated()
@@ -199,15 +236,15 @@ describe('TpdsUpdateHandler', function () {
     describe('update to a project on cooldown', async function () {
       setupMatchingProjects(['active1'])
       setupProjectOnCooldown()
-      beforeEach(async function () {
+      beforeEach(async function (ctx) {
         await expect(
-          this.TpdsUpdateHandler.promises.newUpdate(
-            this.userId,
+          ctx.TpdsUpdateHandler.promises.newUpdate(
+            ctx.userId,
             '', // projectId
-            this.projectName,
-            this.path,
-            this.update,
-            this.source
+            ctx.projectName,
+            ctx.path,
+            ctx.update,
+            ctx.source
           )
         ).to.be.rejectedWith(Errors.TooManyRequestsError)
       })
@@ -218,8 +255,8 @@ describe('TpdsUpdateHandler', function () {
   describe('getting a file delete', function () {
     describe('byId', function () {
       describe('with no matching project', function () {
-        beforeEach(function () {
-          this.projectId = new ObjectId().toString()
+        beforeEach(function (ctx) {
+          ctx.projectId = new ObjectId().toString()
         })
         receiveFileDeleteById()
         expectDeleteNotProcessed()
@@ -227,8 +264,8 @@ describe('TpdsUpdateHandler', function () {
       })
 
       describe('with one matching active project', function () {
-        beforeEach(function () {
-          this.projectId = this.projects.active1._id.toString()
+        beforeEach(function (ctx) {
+          ctx.projectId = ctx.projects.active1._id.toString()
         })
         receiveFileDeleteById()
         expectDeleteProcessed()
@@ -379,13 +416,13 @@ describe('TpdsUpdateHandler', function () {
     describe('update to a project on cooldown', async function () {
       setupMatchingProjects(['active1'])
       setupProjectOnCooldown()
-      beforeEach(async function () {
+      beforeEach(async function (ctx) {
         await expect(
-          this.TpdsUpdateHandler.promises.createFolder(
-            this.userId,
-            this.projectId,
-            this.projectName,
-            this.path
+          ctx.TpdsUpdateHandler.promises.createFolder(
+            ctx.userId,
+            ctx.projectId,
+            ctx.projectName,
+            ctx.path
           )
         ).to.be.rejectedWith(Errors.TooManyRequestsError)
       })
@@ -397,18 +434,18 @@ describe('TpdsUpdateHandler', function () {
 /* Setup helpers */
 
 function setupMatchingProjects(projectKeys) {
-  beforeEach(function () {
-    const projects = projectKeys.map(key => this.projects[key])
-    this.ProjectGetter.promises.findUsersProjectsByName
-      .withArgs(this.userId, this.projectName)
+  beforeEach(function (ctx) {
+    const projects = projectKeys.map(key => ctx.projects[key])
+    ctx.ProjectGetter.promises.findUsersProjectsByName
+      .withArgs(ctx.userId, ctx.projectName)
       .resolves(projects)
   })
 }
 
 function setupProjectOnCooldown() {
-  beforeEach(function () {
-    this.CooldownManager.promises.isProjectOnCooldown
-      .withArgs(this.projects.active1._id)
+  beforeEach(function (ctx) {
+    ctx.CooldownManager.promises.isProjectOnCooldown
+      .withArgs(ctx.projects.active1._id)
       .resolves(true)
   })
 }
@@ -416,76 +453,77 @@ function setupProjectOnCooldown() {
 /* Test helpers */
 
 function receiveUpdate() {
-  beforeEach(async function () {
-    await this.TpdsUpdateHandler.promises.newUpdate(
-      this.userId,
+  beforeEach(async function (ctx) {
+    await ctx.TpdsUpdateHandler.promises.newUpdate(
+      ctx.userId,
       '', // projectId
-      this.projectName,
-      this.path,
-      this.update,
-      this.source
+      ctx.projectName,
+      ctx.path,
+      ctx.update,
+      ctx.source
     )
   })
 }
 
 function receiveUpdateById() {
-  beforeEach(function (done) {
-    this.TpdsUpdateHandler.newUpdate(
-      this.userId,
-      this.projectId,
+  beforeEach(async function (ctx) {
+    await ctx.TpdsUpdateHandler.promises.newUpdate(
+      ctx.userId,
+      ctx.projectId,
       '', // projectName
-      this.path,
-      this.update,
-      this.source,
-      done
+      ctx.path,
+      ctx.update,
+      ctx.source
     )
   })
 }
 
 function receiveFileDelete() {
-  beforeEach(async function () {
-    await this.TpdsUpdateHandler.promises.deleteUpdate(
-      this.userId,
+  beforeEach(async function (ctx) {
+    await ctx.TpdsUpdateHandler.promises.deleteUpdate(
+      ctx.userId,
       '', // projectId
-      this.projectName,
-      this.path,
-      this.source
+      ctx.projectName,
+      ctx.path,
+      ctx.source
     )
   })
 }
 
 function receiveFileDeleteById() {
-  beforeEach(function (done) {
-    this.TpdsUpdateHandler.deleteUpdate(
-      this.userId,
-      this.projectId,
-      '', // projectName
-      this.path,
-      this.source,
-      done
-    )
+  beforeEach(async function (ctx) {
+    await new Promise(resolve => {
+      ctx.TpdsUpdateHandler.deleteUpdate(
+        ctx.userId,
+        ctx.projectId,
+        '', // projectName
+        ctx.path,
+        ctx.source,
+        resolve
+      )
+    })
   })
 }
 
 function receiveProjectDelete() {
-  beforeEach(async function () {
-    await this.TpdsUpdateHandler.promises.deleteUpdate(
-      this.userId,
+  beforeEach(async function (ctx) {
+    await ctx.TpdsUpdateHandler.promises.deleteUpdate(
+      ctx.userId,
       '', // projectId
-      this.projectName,
+      ctx.projectName,
       '/',
-      this.source
+      ctx.source
     )
   })
 }
 
 function receiveFolderUpdate() {
-  beforeEach(async function () {
-    await this.TpdsUpdateHandler.promises.createFolder(
-      this.userId,
-      this.projectId,
-      this.projectName,
-      this.folderPath
+  beforeEach(async function (ctx) {
+    await ctx.TpdsUpdateHandler.promises.createFolder(
+      ctx.userId,
+      ctx.projectId,
+      ctx.projectName,
+      ctx.folderPath
     )
   })
 }
@@ -493,120 +531,121 @@ function receiveFolderUpdate() {
 /* Expectations */
 
 function expectProjectCreated() {
-  it('creates a project', function () {
+  it('creates a project', function (ctx) {
     expect(
-      this.ProjectCreationHandler.promises.createBlankProject
-    ).to.have.been.calledWith(this.userId, this.projectName)
+      ctx.ProjectCreationHandler.promises.createBlankProject
+    ).to.have.been.calledWith(ctx.userId, ctx.projectName)
   })
 
-  it('sets the root doc', function () {
+  it('sets the root doc', function (ctx) {
     expect(
-      this.RootDocManager.setRootDocAutomaticallyInBackground
-    ).to.have.been.calledWith(this.projects.active1._id)
+      ctx.RootDocManager.setRootDocAutomaticallyInBackground
+    ).to.have.been.calledWith(ctx.projects.active1._id)
   })
 }
 
 function expectProjectNotCreated() {
-  it('does not create a project', function () {
-    expect(this.ProjectCreationHandler.promises.createBlankProject).not.to.have
+  it('does not create a project', function (ctx) {
+    expect(ctx.ProjectCreationHandler.promises.createBlankProject).not.to.have
       .been.called
   })
 
-  it('does not set the root doc', function () {
-    expect(this.RootDocManager.setRootDocAutomaticallyInBackground).not.to.have
+  it('does not set the root doc', function (ctx) {
+    expect(ctx.RootDocManager.setRootDocAutomaticallyInBackground).not.to.have
       .been.called
   })
 }
 
 function expectUpdateProcessed() {
-  it('processes the update', function () {
-    expect(this.UpdateMerger.promises.mergeUpdate).to.have.been.calledWith(
-      this.userId,
-      this.projects.active1._id,
-      this.path,
-      this.update,
-      this.source
+  it('processes the update', function (ctx) {
+    expect(ctx.UpdateMerger.promises.mergeUpdate).to.have.been.calledWith(
+      ctx.userId,
+      ctx.projects.active1._id,
+      ctx.path,
+      ctx.update,
+      ctx.source
     )
   })
 }
 
 function expectUpdateNotProcessed() {
-  it('does not process the update', function () {
-    expect(this.UpdateMerger.promises.mergeUpdate).not.to.have.been.called
+  it('does not process the update', function (ctx) {
+    expect(ctx.UpdateMerger.promises.mergeUpdate).not.to.have.been.called
   })
 }
 
 function expectFolderUpdateProcessed() {
-  it('processes the folder update', function () {
-    expect(this.UpdateMerger.promises.createFolder).to.have.been.calledWith(
-      this.projects.active1._id,
-      this.folderPath
+  it('processes the folder update', function (ctx) {
+    expect(ctx.UpdateMerger.promises.createFolder).to.have.been.calledWith(
+      ctx.projects.active1._id,
+      ctx.folderPath,
+      ctx.userId
     )
   })
 }
 
 function expectFolderUpdateNotProcessed() {
-  it("doesn't process the folder update", function () {
-    expect(this.UpdateMerger.promises.createFolder).not.to.have.been.called
+  it("doesn't process the folder update", function (ctx) {
+    expect(ctx.UpdateMerger.promises.createFolder).not.to.have.been.called
   })
 }
 
 function expectDropboxUnlinked() {
-  it('unlinks Dropbox', function () {
-    expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+  it('unlinks Dropbox', function (ctx) {
+    expect(ctx.Modules.promises.hooks.fire).to.have.been.calledWith(
       'removeDropbox',
-      this.userId,
+      ctx.userId,
       'duplicate-projects'
     )
   })
 
-  it('creates a notification that dropbox was unlinked', function () {
+  it('creates a notification that dropbox was unlinked', function (ctx) {
     expect(
-      this.NotificationsBuilder.promises.dropboxDuplicateProjectNames
-    ).to.have.been.calledWith(this.userId)
-    expect(this.notification.create).to.have.been.calledWith(this.projectName)
+      ctx.NotificationsBuilder.promises.dropboxDuplicateProjectNames
+    ).to.have.been.calledWith(ctx.userId)
+    expect(ctx.notification.create).to.have.been.calledWith(ctx.projectName)
   })
 }
 
 function expectDropboxNotUnlinked() {
-  it('does not unlink Dropbox', function () {
-    expect(this.Modules.promises.hooks.fire).not.to.have.been.called
+  it('does not unlink Dropbox', function (ctx) {
+    expect(ctx.Modules.promises.hooks.fire).not.to.have.been.called
   })
 
-  it('does not create a notification that dropbox was unlinked', function () {
-    expect(this.NotificationsBuilder.promises.dropboxDuplicateProjectNames).not
+  it('does not create a notification that dropbox was unlinked', function (ctx) {
+    expect(ctx.NotificationsBuilder.promises.dropboxDuplicateProjectNames).not
       .to.have.been.called
   })
 }
 
 function expectDeleteProcessed() {
-  it('processes the delete', function () {
-    expect(this.UpdateMerger.promises.deleteUpdate).to.have.been.calledWith(
-      this.userId,
-      this.projects.active1._id,
-      this.path,
-      this.source
+  it('processes the delete', function (ctx) {
+    expect(ctx.UpdateMerger.promises.deleteUpdate).to.have.been.calledWith(
+      ctx.userId,
+      ctx.projects.active1._id,
+      ctx.path,
+      ctx.source
     )
   })
 }
 
 function expectDeleteNotProcessed() {
-  it('does not process the delete', function () {
-    expect(this.UpdateMerger.promises.deleteUpdate).not.to.have.been.called
+  it('does not process the delete', function (ctx) {
+    expect(ctx.UpdateMerger.promises.deleteUpdate).not.to.have.been.called
   })
 }
 
 function expectProjectDeleted() {
-  it('deletes the project', function () {
+  it('deletes the project', function (ctx) {
     expect(
-      this.ProjectDeleter.promises.markAsDeletedByExternalSource
-    ).to.have.been.calledWith(this.projects.active1._id)
+      ctx.ProjectDeleter.promises.markAsDeletedByExternalSource
+    ).to.have.been.calledWith(ctx.projects.active1._id)
   })
 }
 
 function expectProjectNotDeleted() {
-  it('does not delete the project', function () {
-    expect(this.ProjectDeleter.promises.markAsDeletedByExternalSource).not.to
+  it('does not delete the project', function (ctx) {
+    expect(ctx.ProjectDeleter.promises.markAsDeletedByExternalSource).not.to
       .have.been.called
   })
 }
diff --git a/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateSenderTests.js b/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateSenderTests.js
index f7f733388e..a0f0276f4a 100644
--- a/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateSenderTests.js
+++ b/services/web/test/unit/src/ThirdPartyDataStore/TpdsUpdateSenderTests.js
@@ -57,7 +57,7 @@ describe('TpdsUpdateSender', function () {
           url: projectHistoryUrl,
         },
       },
-      enableProjectHistoryBlobs: true,
+      filestoreMigrationLevel: true,
     }
     const getUsers = sinon.stub()
     getUsers
diff --git a/services/web/test/unit/src/TokenAccess/TokenAccessController.test.mjs b/services/web/test/unit/src/TokenAccess/TokenAccessController.test.mjs
new file mode 100644
index 0000000000..7586757cf0
--- /dev/null
+++ b/services/web/test/unit/src/TokenAccess/TokenAccessController.test.mjs
@@ -0,0 +1,1273 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import mongodb from 'mongodb-legacy'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+import PrivilegeLevels from '../../../../app/src/Features/Authorization/PrivilegeLevels.js'
+import { getSafeRedirectPath } from '../../../../app/src/Features/Helpers/UrlHelper.js'
+
+const ObjectId = mongodb.ObjectId
+
+const MODULE_PATH =
+  '../../../../app/src/Features/TokenAccess/TokenAccessController'
+
+describe('TokenAccessController', function () {
+  beforeEach(async function (ctx) {
+    ctx.token = 'abc123'
+    ctx.user = { _id: new ObjectId() }
+    ctx.project = {
+      _id: new ObjectId(),
+      owner_ref: ctx.user._id,
+      name: 'test',
+      tokenAccessReadAndWrite_refs: [],
+      tokenAccessReadOnly_refs: [],
+    }
+    ctx.req = new MockRequest()
+    ctx.res = new MockResponse()
+    ctx.next = sinon.stub().returns()
+
+    ctx.Settings = {
+      siteUrl: 'https://www.dev-overleaf.com',
+      adminPrivilegeAvailable: false,
+      adminUrl: 'https://admin.dev-overleaf.com',
+      adminDomains: ['overleaf.com'],
+    }
+    ctx.TokenAccessHandler = {
+      TOKEN_TYPES: {
+        READ_ONLY: 'readOnly',
+        READ_AND_WRITE: 'readAndWrite',
+      },
+      isReadAndWriteToken: sinon.stub().returns(true),
+      isReadOnlyToken: sinon.stub().returns(true),
+      tokenAccessEnabledForProject: sinon.stub().returns(true),
+      checkTokenHashPrefix: sinon.stub(),
+      makeTokenUrl: sinon.stub().returns('/'),
+      grantSessionTokenAccess: sinon.stub(),
+      promises: {
+        addReadOnlyUserToProject: sinon.stub().resolves(),
+        getProjectByToken: sinon.stub().resolves(ctx.project),
+        getV1DocPublishedInfo: sinon.stub().resolves({ allow: true }),
+        getV1DocInfo: sinon.stub(),
+        removeReadAndWriteUserFromProject: sinon.stub().resolves(),
+        moveReadAndWriteUserToReadOnly: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+      getSessionUser: sinon.stub().returns(ctx.user._id),
+    }
+
+    ctx.AuthenticationController = {
+      setRedirectInSession: sinon.stub(),
+    }
+
+    ctx.AuthorizationManager = {
+      promises: {
+        getPrivilegeLevelForProject: sinon
+          .stub()
+          .resolves(PrivilegeLevels.NONE),
+      },
+    }
+
+    ctx.AuthorizationMiddleware = {}
+
+    ctx.ProjectAuditLogHandler = {
+      promises: {
+        addEntry: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().resolves({ variant: 'default' }),
+        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
+      },
+    }
+
+    ctx.CollaboratorsInviteHandler = {
+      promises: {
+        revokeInviteForUser: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.CollaboratorsHandler = {
+      promises: {
+        addUserIdToProject: sinon.stub().resolves(),
+        setCollaboratorPrivilegeLevel: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.CollaboratorsGetter = {
+      promises: {
+        userIsReadWriteTokenMember: sinon.stub().resolves(),
+        isUserInvitedReadWriteMemberOfProject: sinon.stub().resolves(),
+        isUserInvitedMemberOfProject: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.EditorRealTimeController = { emitToRoom: sinon.stub() }
+
+    ctx.ProjectGetter = {
+      promises: {
+        getProject: sinon.stub().resolves(ctx.project),
+      },
+    }
+
+    ctx.AnalyticsManager = {
+      recordEventForSession: sinon.stub(),
+      recordEventForUserInBackground: sinon.stub(),
+    }
+
+    ctx.UserGetter = {
+      promises: {
+        getUser: sinon.stub().callsFake(async (userId, filter) => {
+          if (userId === ctx.userId) {
+            return ctx.user
+          } else {
+            return null
+          }
+        }),
+        getUserEmail: sinon.stub().resolves(),
+        getUserConfirmedEmails: sinon.stub().resolves(),
+      },
+    }
+
+    ctx.LimitationsManager = {
+      promises: {
+        canAcceptEditCollaboratorInvite: sinon.stub().resolves(),
+      },
+    }
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.Settings,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/TokenAccess/TokenAccessHandler',
+      () => ({
+        default: ctx.TokenAccessHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: ctx.AuthenticationController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authorization/AuthorizationManager',
+      () => ({
+        default: ctx.AuthorizationManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authorization/AuthorizationMiddleware',
+      () => ({
+        default: ctx.AuthorizationMiddleware,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Project/ProjectAuditLogHandler',
+      () => ({
+        default: ctx.ProjectAuditLogHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Errors/Errors', () => ({
+      default: (ctx.Errors = {
+        NotFoundError: sinon.stub(),
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsHandler',
+      () => ({
+        default: ctx.CollaboratorsHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler',
+      () => ({
+        default: ctx.CollaboratorsInviteHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Collaborators/CollaboratorsGetter',
+      () => ({
+        default: ctx.CollaboratorsGetter,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Editor/EditorRealTimeController',
+      () => ({
+        default: ctx.EditorRealTimeController,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectGetter', () => ({
+      default: ctx.ProjectGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Helpers/AsyncFormHelper', () => ({
+      default: (ctx.AsyncFormHelper = {
+        redirect: sinon.stub(),
+      }),
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Helpers/AdminAuthorizationHelper',
+      () =>
+        (ctx.AdminAuthorizationHelper = {
+          canRedirectToAdminDomain: sinon.stub(),
+        })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Helpers/UrlHelper',
+      () =>
+        (ctx.UrlHelper = {
+          getSafeAdminDomainRedirect: sinon
+            .stub()
+            .callsFake(
+              path => `${ctx.Settings.adminUrl}${getSafeRedirectPath(path)}`
+            ),
+        })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Analytics/AnalyticsManager',
+      () => ({
+        default: ctx.AnalyticsManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/LimitationsManager',
+      () => ({
+        default: ctx.LimitationsManager,
+      })
+    )
+
+    ctx.TokenAccessController = (await import(MODULE_PATH)).default
+  })
+
+  describe('grantTokenAccessReadAndWrite', function () {
+    beforeEach(function (ctx) {
+      ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+        true
+      )
+    })
+
+    describe('normal case (edit slot available)', function () {
+      beforeEach(async function (ctx) {
+        ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+          true
+        )
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = {
+          confirmedByUser: true,
+          tokenHashPrefix: '#prefix',
+        }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('adds the user as a read and write invited member', function (ctx) {
+        expect(
+          ctx.CollaboratorsHandler.promises.addUserIdToProject
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          undefined,
+          ctx.user._id,
+          PrivilegeLevels.READ_AND_WRITE
+        )
+      })
+
+      it('writes a project audit log', function (ctx) {
+        expect(
+          ctx.ProjectAuditLogHandler.promises.addEntry
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          'accept-via-link-sharing',
+          ctx.user._id,
+          ctx.req.ip,
+          { privileges: 'readAndWrite' }
+        )
+      })
+
+      it('records a project-joined event for the user', function (ctx) {
+        expect(
+          ctx.AnalyticsManager.recordEventForUserInBackground
+        ).to.have.been.calledWith(ctx.user._id, 'project-joined', {
+          mode: 'edit',
+          projectId: ctx.project._id.toString(),
+          ownerId: ctx.project.owner_ref.toString(),
+          role: PrivilegeLevels.READ_AND_WRITE,
+          source: 'link-sharing',
+        })
+      })
+
+      it('emits a project membership changed event', function (ctx) {
+        expect(ctx.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
+          ctx.project._id,
+          'project:membership:changed',
+          { members: true, invites: true }
+        )
+      })
+
+      it('checks token hash', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          '#prefix',
+          'readAndWrite',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    describe('when there are no edit collaborator slots available', function () {
+      beforeEach(async function (ctx) {
+        ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+          false
+        )
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = {
+          confirmedByUser: true,
+          tokenHashPrefix: '#prefix',
+        }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('adds the user as a read only invited member instead (pendingEditor)', function (ctx) {
+        expect(
+          ctx.CollaboratorsHandler.promises.addUserIdToProject
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          undefined,
+          ctx.user._id,
+          PrivilegeLevels.READ_ONLY,
+          { pendingEditor: true }
+        )
+      })
+
+      it('writes a project audit log', function (ctx) {
+        expect(
+          ctx.ProjectAuditLogHandler.promises.addEntry
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          'accept-via-link-sharing',
+          ctx.user._id,
+          ctx.req.ip,
+          { privileges: 'readOnly', pendingEditor: true }
+        )
+      })
+
+      it('records a project-joined event for the user', function (ctx) {
+        expect(
+          ctx.AnalyticsManager.recordEventForUserInBackground
+        ).to.have.been.calledWith(ctx.user._id, 'project-joined', {
+          mode: 'view',
+          projectId: ctx.project._id.toString(),
+          pendingEditor: true,
+          ownerId: ctx.project.owner_ref.toString(),
+          role: PrivilegeLevels.READ_ONLY,
+          source: 'link-sharing',
+        })
+      })
+
+      it('emits a project membership changed event', function (ctx) {
+        expect(ctx.EditorRealTimeController.emitToRoom).to.have.been.calledWith(
+          ctx.project._id,
+          'project:membership:changed',
+          { members: true, invites: true }
+        )
+      })
+
+      it('checks token hash', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          '#prefix',
+          'readAndWrite',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    describe('when the access was already granted', function () {
+      beforeEach(async function (ctx) {
+        ctx.project.tokenAccessReadAndWrite_refs.push(ctx.user._id)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { confirmedByUser: true }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('writes a project audit log', function (ctx) {
+        expect(
+          ctx.ProjectAuditLogHandler.promises.addEntry
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          'accept-via-link-sharing',
+          ctx.user._id,
+          ctx.req.ip,
+          { privileges: 'readAndWrite' }
+        )
+      })
+
+      it('checks token hash', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          undefined,
+          'readAndWrite',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    describe('hash prefix missing in request', function () {
+      beforeEach(async function (ctx) {
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { confirmedByUser: true }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('adds the user as a read and write invited member', function (ctx) {
+        expect(
+          ctx.CollaboratorsHandler.promises.addUserIdToProject
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          undefined,
+          ctx.user._id,
+          PrivilegeLevels.READ_AND_WRITE
+        )
+      })
+
+      it('checks the hash prefix', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          undefined,
+          'readAndWrite',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    describe('user is owner of project', function () {
+      beforeEach(async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.AuthorizationManager.promises.getPrivilegeLevelForProject.returns(
+            PrivilegeLevels.OWNER
+          )
+          ctx.req.params = { token: ctx.token }
+          ctx.req.body = {}
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+      it('checks token hash and includes log data', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          undefined,
+          'readAndWrite',
+          ctx.user._id,
+          {
+            projectId: ctx.project._id,
+            action: 'user already has higher or same privilege',
+          }
+        )
+      })
+    })
+
+    describe('when user is not logged in', function () {
+      beforeEach(function (ctx) {
+        ctx.SessionManager.getLoggedInUserId.returns(null)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { tokenHashPrefix: '#prefix' }
+      })
+      describe('ANONYMOUS_READ_AND_WRITE_ENABLED is undefined', function () {
+        beforeEach(async function (ctx) {
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+            ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('redirects to restricted', function (ctx) {
+          expect(ctx.res.json).to.have.been.calledWith({
+            redirect: '/restricted',
+            anonWriteAccessDenied: true,
+          })
+        })
+
+        it('checks the hash prefix and includes log data', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.checkTokenHashPrefix
+          ).to.have.been.calledWith(
+            ctx.token,
+            '#prefix',
+            'readAndWrite',
+            null,
+            {
+              action: 'denied anonymous read-and-write token access',
+            }
+          )
+        })
+
+        it('saves redirect URL with URL fragment', function (ctx) {
+          expect(
+            ctx.AuthenticationController.setRedirectInSession.lastCall.args[1]
+          ).to.equal('/#prefix')
+        })
+      })
+
+      describe('ANONYMOUS_READ_AND_WRITE_ENABLED is true', function () {
+        beforeEach(async function (ctx) {
+          ctx.TokenAccessHandler.ANONYMOUS_READ_AND_WRITE_ENABLED = true
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+
+            ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('redirects to project', function (ctx) {
+          expect(ctx.res.json).to.have.been.calledWith({
+            redirect: `/project/${ctx.project._id}`,
+            grantAnonymousAccess: 'readAndWrite',
+          })
+        })
+
+        it('checks the hash prefix and includes log data', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.checkTokenHashPrefix
+          ).to.have.been.calledWith(
+            ctx.token,
+            '#prefix',
+            'readAndWrite',
+            null,
+            {
+              projectId: ctx.project._id,
+              action: 'granting read-write anonymous access',
+            }
+          )
+        })
+      })
+    })
+
+    describe('when Overleaf SaaS', function () {
+      beforeEach(function (ctx) {
+        ctx.Settings.overleaf = {}
+      })
+      describe('when token is for v1 project', function () {
+        beforeEach(async function (ctx) {
+          ctx.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
+          ctx.TokenAccessHandler.promises.getV1DocInfo.resolves({
+            exists: true,
+            has_owner: true,
+          })
+          ctx.req.params = { token: ctx.token }
+          ctx.req.body = { tokenHashPrefix: '#prefix' }
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+            ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+        it('returns v1 import data', function (ctx) {
+          expect(ctx.res.json).to.have.been.calledWith({
+            v1Import: {
+              status: 'canDownloadZip',
+              projectId: ctx.token,
+              hasOwner: true,
+              name: 'Untitled',
+              brandInfo: undefined,
+            },
+          })
+        })
+        it('checks the hash prefix and includes log data', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.checkTokenHashPrefix
+          ).to.have.been.calledWith(
+            ctx.token,
+            '#prefix',
+            'readAndWrite',
+            ctx.user._id,
+            {
+              action: 'import v1',
+            }
+          )
+        })
+      })
+
+      describe('when token is not for a v1 or v2 project', function () {
+        beforeEach(async function (ctx) {
+          ctx.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
+          ctx.TokenAccessHandler.promises.getV1DocInfo.resolves({
+            exists: false,
+          })
+          ctx.req.params = { token: ctx.token }
+          ctx.req.body = { tokenHashPrefix: '#prefix' }
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+            ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+        it('returns 404', function (ctx) {
+          expect(ctx.res.sendStatus).to.have.been.calledWith(404)
+        })
+        it('checks the hash prefix and includes log data', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.checkTokenHashPrefix
+          ).to.have.been.calledWith(
+            ctx.token,
+            '#prefix',
+            'readAndWrite',
+            ctx.user._id,
+            {
+              action: '404',
+            }
+          )
+        })
+      })
+    })
+
+    describe('not Overleaf SaaS', function () {
+      beforeEach(function (ctx) {
+        ctx.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { tokenHashPrefix: '#prefix' }
+      })
+      it('passes Errors.NotFoundError to next when project not found and still checks token hash', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res,
+            args => {
+              expect(args).to.be.instanceof(ctx.Errors.NotFoundError)
+
+              expect(
+                ctx.TokenAccessHandler.checkTokenHashPrefix
+              ).to.have.been.calledWith(
+                ctx.token,
+                '#prefix',
+                'readAndWrite',
+                ctx.user._id,
+                {
+                  action: '404',
+                }
+              )
+
+              resolve()
+            }
+          )
+        })
+      })
+    })
+
+    describe('when user is admin', function () {
+      const admin = { _id: new ObjectId(), isAdmin: true }
+      beforeEach(function (ctx) {
+        ctx.SessionManager.getLoggedInUserId.returns(admin._id)
+        ctx.SessionManager.getSessionUser.returns(admin)
+        ctx.AdminAuthorizationHelper.canRedirectToAdminDomain.returns(true)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { confirmedByUser: true, tokenHashPrefix: '#prefix' }
+      })
+
+      it('redirects if project owner is non-admin', async function (ctx) {
+        ctx.UserGetter.promises.getUserConfirmedEmails = sinon
+          .stub()
+          .resolves([{ email: 'test@not-overleaf.com' }])
+
+        await new Promise(resolve => {
+          ctx.res.callback = () => {
+            expect(ctx.res.json).to.have.been.calledWith({
+              redirect: `${ctx.Settings.adminUrl}/#prefix`,
+            })
+            resolve()
+          }
+          ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+            ctx.req,
+            ctx.res
+          )
+        })
+      })
+
+      it('grants access if project owner is an internal staff', function (ctx) {
+        const internalStaff = { _id: new ObjectId(), isAdmin: true }
+        const projectFromInternalStaff = {
+          _id: new ObjectId(),
+          name: 'test',
+          tokenAccessReadAndWrite_refs: [],
+          tokenAccessReadOnly_refs: [],
+          owner_ref: internalStaff._id,
+        }
+        ctx.UserGetter.promises.getUser = sinon.stub().resolves(internalStaff)
+        ctx.UserGetter.promises.getUserConfirmedEmails = sinon
+          .stub()
+          .resolves([{ email: 'test@overleaf.com' }])
+        ctx.TokenAccessHandler.promises.getProjectByToken = sinon
+          .stub()
+          .resolves(projectFromInternalStaff)
+        ctx.res.callback = () => {
+          expect(
+            ctx.CollaboratorsHandler.promises.addUserIdToProject
+          ).to.have.been.calledWith(
+            projectFromInternalStaff._id,
+            undefined,
+            admin._id,
+            PrivilegeLevels.READ_AND_WRITE
+          )
+        }
+        ctx.TokenAccessController.grantTokenAccessReadAndWrite(ctx.req, ctx.res)
+      })
+    })
+
+    it('passes Errors.NotFoundError to next when token access is not enabled but still checks token hash', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TokenAccessHandler.tokenAccessEnabledForProject.returns(false)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { tokenHashPrefix: '#prefix' }
+        ctx.TokenAccessController.grantTokenAccessReadAndWrite(
+          ctx.req,
+          ctx.res,
+          args => {
+            expect(args).to.be.instanceof(ctx.Errors.NotFoundError)
+
+            expect(
+              ctx.TokenAccessHandler.checkTokenHashPrefix
+            ).to.have.been.calledWith(
+              ctx.token,
+              '#prefix',
+              'readAndWrite',
+              ctx.user._id,
+              {
+                projectId: ctx.project._id,
+                action: 'token access not enabled',
+              }
+            )
+
+            resolve()
+          }
+        )
+      })
+    })
+
+    it('returns 400 when not using a read write token', function (ctx) {
+      ctx.TokenAccessHandler.isReadAndWriteToken.returns(false)
+      ctx.req.params = { token: ctx.token }
+      ctx.req.body = { tokenHashPrefix: '#prefix' }
+      ctx.TokenAccessController.grantTokenAccessReadAndWrite(ctx.req, ctx.res)
+      expect(ctx.res.sendStatus).to.have.been.calledWith(400)
+    })
+  })
+
+  describe('grantTokenAccessReadOnly', function () {
+    describe('normal case', function () {
+      beforeEach(async function (ctx) {
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { confirmedByUser: true, tokenHashPrefix: '#prefix' }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadOnly(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('grants read-only access', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.promises.addReadOnlyUserToProject
+        ).to.have.been.calledWith(
+          ctx.user._id,
+          ctx.project._id,
+          ctx.project.owner_ref
+        )
+      })
+
+      it('writes a project audit log', function (ctx) {
+        expect(
+          ctx.ProjectAuditLogHandler.promises.addEntry
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          'join-via-token',
+          ctx.user._id,
+          ctx.req.ip,
+          { privileges: 'readOnly' }
+        )
+      })
+
+      it('checks if hash prefix matches', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          '#prefix',
+          'readOnly',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    describe('when the access was already granted', function () {
+      beforeEach(async function (ctx) {
+        ctx.project.tokenAccessReadOnly_refs.push(ctx.user._id)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { confirmedByUser: true }
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadOnly(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it("doesn't write a project audit log", function (ctx) {
+        expect(ctx.ProjectAuditLogHandler.promises.addEntry).to.not.have.been
+          .called
+      })
+
+      it('still checks if hash prefix matches', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          undefined,
+          'readOnly',
+          ctx.user._id,
+          { projectId: ctx.project._id, action: 'continue' }
+        )
+      })
+    })
+
+    it('returns 400 when not using a read only token', function (ctx) {
+      ctx.TokenAccessHandler.isReadOnlyToken.returns(false)
+      ctx.req.params = { token: ctx.token }
+      ctx.req.body = { tokenHashPrefix: '#prefix' }
+      ctx.TokenAccessController.grantTokenAccessReadOnly(ctx.req, ctx.res)
+      expect(ctx.res.sendStatus).to.have.been.calledWith(400)
+    })
+
+    describe('anonymous users', function () {
+      beforeEach(async function (ctx) {
+        ctx.req.params = { token: ctx.token }
+        ctx.SessionManager.getLoggedInUserId.returns(null)
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+
+          ctx.TokenAccessController.grantTokenAccessReadOnly(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('allows anonymous users and checks the token hash', function (ctx) {
+        expect(ctx.res.json).to.have.been.calledWith({
+          redirect: `/project/${ctx.project._id}`,
+          grantAnonymousAccess: 'readOnly',
+        })
+
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(ctx.token, undefined, 'readOnly', null, {
+          projectId: ctx.project._id,
+          action: 'granting read-only anonymous access',
+        })
+      })
+    })
+
+    describe('user is owner of project', function () {
+      beforeEach(async function (ctx) {
+        ctx.AuthorizationManager.promises.getPrivilegeLevelForProject.returns(
+          PrivilegeLevels.OWNER
+        )
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = {}
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.grantTokenAccessReadOnly(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+      it('checks token hash and includes log data', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.checkTokenHashPrefix
+        ).to.have.been.calledWith(
+          ctx.token,
+          undefined,
+          'readOnly',
+          ctx.user._id,
+          {
+            projectId: ctx.project._id,
+            action: 'user already has higher or same privilege',
+          }
+        )
+      })
+    })
+
+    it('passes Errors.NotFoundError to next when token access is not enabled but still checks token hash', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.TokenAccessHandler.tokenAccessEnabledForProject.returns(false)
+        ctx.req.params = { token: ctx.token }
+        ctx.req.body = { tokenHashPrefix: '#prefix' }
+        ctx.TokenAccessController.grantTokenAccessReadOnly(
+          ctx.req,
+          ctx.res,
+          args => {
+            expect(args).to.be.instanceof(ctx.Errors.NotFoundError)
+
+            expect(
+              ctx.TokenAccessHandler.checkTokenHashPrefix
+            ).to.have.been.calledWith(
+              ctx.token,
+              '#prefix',
+              'readOnly',
+              ctx.user._id,
+              {
+                projectId: ctx.project._id,
+                action: 'token access not enabled',
+              }
+            )
+
+            resolve()
+          }
+        )
+      })
+    })
+  })
+
+  describe('ensureUserCanUseSharingUpdatesConsentPage', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = { Project_id: ctx.project._id }
+    })
+
+    describe('when not in link sharing changes test', function () {
+      beforeEach(async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.AsyncFormHelper.redirect = sinon.stub().callsFake(() => resolve())
+          ctx.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('redirects to the project/editor', function (ctx) {
+        expect(ctx.AsyncFormHelper.redirect).to.have.been.calledWith(
+          ctx.req,
+          ctx.res,
+          `/project/${ctx.project._id}`
+        )
+      })
+    })
+
+    describe('when link sharing changes test active', function () {
+      beforeEach(function (ctx) {
+        ctx.SplitTestHandler.promises.getAssignmentForUser.resolves({
+          variant: 'active',
+        })
+      })
+
+      describe('when user is not an invited editor and is a read write token member', function () {
+        beforeEach(async function (ctx) {
+          await new Promise(resolve => {
+            ctx.CollaboratorsGetter.promises.isUserInvitedReadWriteMemberOfProject.resolves(
+              false
+            )
+            ctx.CollaboratorsGetter.promises.userIsReadWriteTokenMember.resolves(
+              true
+            )
+            ctx.next.callsFake(() => resolve())
+            ctx.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
+              ctx.req,
+              ctx.res,
+              ctx.next
+            )
+          })
+        })
+
+        it('calls next', function (ctx) {
+          expect(
+            ctx.CollaboratorsGetter.promises
+              .isUserInvitedReadWriteMemberOfProject
+          ).to.have.been.calledWith(ctx.user._id, ctx.project._id)
+          expect(
+            ctx.CollaboratorsGetter.promises.userIsReadWriteTokenMember
+          ).to.have.been.calledWith(ctx.user._id, ctx.project._id)
+          expect(ctx.next).to.have.been.calledOnce
+          expect(ctx.next.firstCall.args[0]).to.not.exist
+        })
+      })
+
+      describe('when user is already an invited editor', function () {
+        beforeEach(async function (ctx) {
+          ctx.CollaboratorsGetter.promises.isUserInvitedReadWriteMemberOfProject.resolves(
+            true
+          )
+          await new Promise((resolve, reject) => {
+            ctx.AsyncFormHelper.redirect = sinon
+              .stub()
+              .callsFake(() => resolve())
+            ctx.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('redirects to the project/editor', function (ctx) {
+          expect(ctx.AsyncFormHelper.redirect).to.have.been.calledWith(
+            ctx.req,
+            ctx.res,
+            `/project/${ctx.project._id}`
+          )
+        })
+      })
+
+      describe('when user not a read write token member', function () {
+        beforeEach(async function (ctx) {
+          ctx.CollaboratorsGetter.promises.userIsReadWriteTokenMember.resolves(
+            false
+          )
+          await new Promise((resolve, reject) => {
+            ctx.AsyncFormHelper.redirect = sinon
+              .stub()
+              .callsFake(() => resolve())
+            ctx.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('redirects to the project/editor', function (ctx) {
+          expect(ctx.AsyncFormHelper.redirect).to.have.been.calledWith(
+            ctx.req,
+            ctx.res,
+            `/project/${ctx.project._id}`
+          )
+        })
+      })
+    })
+  })
+
+  describe('moveReadWriteToCollaborators', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = { Project_id: ctx.project._id }
+    })
+
+    describe('when there are collaborator slots available', function () {
+      beforeEach(function (ctx) {
+        ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+          true
+        )
+      })
+
+      describe('previously joined token access user moving to named collaborator', function () {
+        beforeEach(async function (ctx) {
+          ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
+            false
+          )
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+            ctx.TokenAccessController.moveReadWriteToCollaborators(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('sets the privilege level to read and write for the invited viewer', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.promises.removeReadAndWriteUserFromProject
+          ).to.have.been.calledWith(ctx.user._id, ctx.project._id)
+          expect(
+            ctx.CollaboratorsHandler.promises.addUserIdToProject
+          ).to.have.been.calledWith(
+            ctx.project._id,
+            undefined,
+            ctx.user._id,
+            PrivilegeLevels.READ_AND_WRITE
+          )
+          expect(ctx.res.sendStatus).to.have.been.calledWith(204)
+        })
+      })
+    })
+
+    describe('when there are no edit collaborator slots available', function () {
+      beforeEach(function (ctx) {
+        ctx.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
+          false
+        )
+      })
+
+      describe('previously joined token access user moving to named collaborator', function () {
+        beforeEach(async function (ctx) {
+          ctx.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
+            false
+          )
+          await new Promise((resolve, reject) => {
+            ctx.res.callback = resolve
+            ctx.TokenAccessController.moveReadWriteToCollaborators(
+              ctx.req,
+              ctx.res,
+              ctx.rejectOnError(reject)
+            )
+          })
+        })
+
+        it('sets the privilege level to read only for the invited viewer (pendingEditor)', function (ctx) {
+          expect(
+            ctx.TokenAccessHandler.promises.removeReadAndWriteUserFromProject
+          ).to.have.been.calledWith(ctx.user._id, ctx.project._id)
+          expect(
+            ctx.CollaboratorsHandler.promises.addUserIdToProject
+          ).to.have.been.calledWith(
+            ctx.project._id,
+            undefined,
+            ctx.user._id,
+            PrivilegeLevels.READ_ONLY,
+            { pendingEditor: true }
+          )
+          expect(ctx.res.sendStatus).to.have.been.calledWith(204)
+        })
+      })
+    })
+  })
+
+  describe('moveReadWriteToReadOnly', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params = { Project_id: ctx.project._id }
+    })
+
+    describe('previously joined token access user moving to anonymous viewer', function () {
+      beforeEach(async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = resolve
+          ctx.TokenAccessController.moveReadWriteToReadOnly(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+
+      it('removes them from read write token access refs and adds them to read only token access refs', function (ctx) {
+        expect(
+          ctx.TokenAccessHandler.promises.moveReadAndWriteUserToReadOnly
+        ).to.have.been.calledWith(ctx.user._id, ctx.project._id)
+        expect(ctx.res.sendStatus).to.have.been.calledWith(204)
+      })
+
+      it('writes a project audit log', function (ctx) {
+        expect(
+          ctx.ProjectAuditLogHandler.promises.addEntry
+        ).to.have.been.calledWith(
+          ctx.project._id,
+          'readonly-via-sharing-updates',
+          ctx.user._id,
+          ctx.req.ip
+        )
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/TokenAccess/TokenAccessControllerTests.mjs b/services/web/test/unit/src/TokenAccess/TokenAccessControllerTests.mjs
deleted file mode 100644
index 8097218076..0000000000
--- a/services/web/test/unit/src/TokenAccess/TokenAccessControllerTests.mjs
+++ /dev/null
@@ -1,1143 +0,0 @@
-import esmock from 'esmock'
-import sinon from 'sinon'
-import { expect } from 'chai'
-import mongodb from 'mongodb-legacy'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import PrivilegeLevels from '../../../../app/src/Features/Authorization/PrivilegeLevels.js'
-import { getSafeRedirectPath } from '../../../../app/src/Features/Helpers/UrlHelper.js'
-
-const ObjectId = mongodb.ObjectId
-
-const MODULE_PATH =
-  '../../../../app/src/Features/TokenAccess/TokenAccessController'
-
-describe('TokenAccessController', function () {
-  beforeEach(async function () {
-    this.token = 'abc123'
-    this.user = { _id: new ObjectId() }
-    this.project = {
-      _id: new ObjectId(),
-      owner_ref: this.user._id,
-      name: 'test',
-      tokenAccessReadAndWrite_refs: [],
-      tokenAccessReadOnly_refs: [],
-    }
-    this.req = new MockRequest()
-    this.res = new MockResponse()
-    this.next = sinon.stub().returns()
-
-    this.Settings = {
-      siteUrl: 'https://www.dev-overleaf.com',
-      adminPrivilegeAvailable: false,
-      adminUrl: 'https://admin.dev-overleaf.com',
-      adminDomains: ['overleaf.com'],
-    }
-    this.TokenAccessHandler = {
-      TOKEN_TYPES: {
-        READ_ONLY: 'readOnly',
-        READ_AND_WRITE: 'readAndWrite',
-      },
-      isReadAndWriteToken: sinon.stub().returns(true),
-      isReadOnlyToken: sinon.stub().returns(true),
-      tokenAccessEnabledForProject: sinon.stub().returns(true),
-      checkTokenHashPrefix: sinon.stub(),
-      makeTokenUrl: sinon.stub().returns('/'),
-      grantSessionTokenAccess: sinon.stub(),
-      promises: {
-        addReadOnlyUserToProject: sinon.stub().resolves(),
-        getProjectByToken: sinon.stub().resolves(this.project),
-        getV1DocPublishedInfo: sinon.stub().resolves({ allow: true }),
-        getV1DocInfo: sinon.stub(),
-        removeReadAndWriteUserFromProject: sinon.stub().resolves(),
-        moveReadAndWriteUserToReadOnly: sinon.stub().resolves(),
-      },
-    }
-
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns(this.user._id),
-      getSessionUser: sinon.stub().returns(this.user._id),
-    }
-
-    this.AuthenticationController = {
-      setRedirectInSession: sinon.stub(),
-    }
-
-    this.AuthorizationManager = {
-      promises: {
-        getPrivilegeLevelForProject: sinon
-          .stub()
-          .resolves(PrivilegeLevels.NONE),
-      },
-    }
-
-    this.AuthorizationMiddleware = {}
-
-    this.ProjectAuditLogHandler = {
-      promises: {
-        addEntry: sinon.stub().resolves(),
-      },
-    }
-
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves({ variant: 'default' }),
-        getAssignmentForUser: sinon.stub().resolves({ variant: 'default' }),
-      },
-    }
-
-    this.CollaboratorsInviteHandler = {
-      promises: {
-        revokeInviteForUser: sinon.stub().resolves(),
-      },
-    }
-
-    this.CollaboratorsHandler = {
-      promises: {
-        addUserIdToProject: sinon.stub().resolves(),
-        setCollaboratorPrivilegeLevel: sinon.stub().resolves(),
-      },
-    }
-
-    this.CollaboratorsGetter = {
-      promises: {
-        userIsReadWriteTokenMember: sinon.stub().resolves(),
-        isUserInvitedReadWriteMemberOfProject: sinon.stub().resolves(),
-        isUserInvitedMemberOfProject: sinon.stub().resolves(),
-      },
-    }
-
-    this.EditorRealTimeController = { emitToRoom: sinon.stub() }
-
-    this.ProjectGetter = {
-      promises: {
-        getProject: sinon.stub().resolves(this.project),
-      },
-    }
-
-    this.AnalyticsManager = {
-      recordEventForSession: sinon.stub(),
-      recordEventForUserInBackground: sinon.stub(),
-    }
-
-    this.UserGetter = {
-      promises: {
-        getUser: sinon.stub().callsFake(async (userId, filter) => {
-          if (userId === this.userId) {
-            return this.user
-          } else {
-            return null
-          }
-        }),
-        getUserEmail: sinon.stub().resolves(),
-        getUserConfirmedEmails: sinon.stub().resolves(),
-      },
-    }
-
-    this.LimitationsManager = {
-      promises: {
-        canAcceptEditCollaboratorInvite: sinon.stub().resolves(),
-      },
-    }
-
-    this.TokenAccessController = await esmock.strict(MODULE_PATH, {
-      '@overleaf/settings': this.Settings,
-      '../../../../app/src/Features/TokenAccess/TokenAccessHandler':
-        this.TokenAccessHandler,
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        this.AuthenticationController,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/Authorization/AuthorizationManager':
-        this.AuthorizationManager,
-      '../../../../app/src/Features/Authorization/AuthorizationMiddleware':
-        this.AuthorizationMiddleware,
-      '../../../../app/src/Features/Project/ProjectAuditLogHandler':
-        this.ProjectAuditLogHandler,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/Errors/Errors': (this.Errors = {
-        NotFoundError: sinon.stub(),
-      }),
-      '../../../../app/src/Features/Collaborators/CollaboratorsHandler':
-        this.CollaboratorsHandler,
-      '../../../../app/src/Features/Collaborators/CollaboratorsInviteHandler':
-        this.CollaboratorsInviteHandler,
-      '../../../../app/src/Features/Collaborators/CollaboratorsGetter':
-        this.CollaboratorsGetter,
-      '../../../../app/src/Features/Editor/EditorRealTimeController':
-        this.EditorRealTimeController,
-      '../../../../app/src/Features/Project/ProjectGetter': this.ProjectGetter,
-      '../../../../app/src/Features/Helpers/AsyncFormHelper':
-        (this.AsyncFormHelper = {
-          redirect: sinon.stub(),
-        }),
-      '../../../../app/src/Features/Helpers/AdminAuthorizationHelper':
-        (this.AdminAuthorizationHelper = {
-          canRedirectToAdminDomain: sinon.stub(),
-        }),
-      '../../../../app/src/Features/Helpers/UrlHelper': (this.UrlHelper = {
-        getSafeAdminDomainRedirect: sinon
-          .stub()
-          .callsFake(
-            path => `${this.Settings.adminUrl}${getSafeRedirectPath(path)}`
-          ),
-      }),
-      '../../../../app/src/Features/Analytics/AnalyticsManager':
-        this.AnalyticsManager,
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/Subscription/LimitationsManager':
-        this.LimitationsManager,
-    })
-  })
-
-  describe('grantTokenAccessReadAndWrite', function () {
-    beforeEach(function () {
-      this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-        true
-      )
-    })
-
-    describe('normal case (edit slot available)', function () {
-      beforeEach(function (done) {
-        this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-          true
-        )
-        this.req.params = { token: this.token }
-        this.req.body = {
-          confirmedByUser: true,
-          tokenHashPrefix: '#prefix',
-        }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('adds the user as a read and write invited member', function () {
-        expect(
-          this.CollaboratorsHandler.promises.addUserIdToProject
-        ).to.have.been.calledWith(
-          this.project._id,
-          undefined,
-          this.user._id,
-          PrivilegeLevels.READ_AND_WRITE
-        )
-      })
-
-      it('writes a project audit log', function () {
-        expect(
-          this.ProjectAuditLogHandler.promises.addEntry
-        ).to.have.been.calledWith(
-          this.project._id,
-          'accept-via-link-sharing',
-          this.user._id,
-          this.req.ip,
-          { privileges: 'readAndWrite' }
-        )
-      })
-
-      it('records a project-joined event for the user', function () {
-        expect(
-          this.AnalyticsManager.recordEventForUserInBackground
-        ).to.have.been.calledWith(this.user._id, 'project-joined', {
-          mode: 'edit',
-          projectId: this.project._id.toString(),
-          ownerId: this.project.owner_ref.toString(),
-          role: PrivilegeLevels.READ_AND_WRITE,
-          source: 'link-sharing',
-        })
-      })
-
-      it('emits a project membership changed event', function () {
-        expect(
-          this.EditorRealTimeController.emitToRoom
-        ).to.have.been.calledWith(
-          this.project._id,
-          'project:membership:changed',
-          { members: true, invites: true }
-        )
-      })
-
-      it('checks token hash', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          '#prefix',
-          'readAndWrite',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    describe('when there are no edit collaborator slots available', function () {
-      beforeEach(function (done) {
-        this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-          false
-        )
-        this.req.params = { token: this.token }
-        this.req.body = {
-          confirmedByUser: true,
-          tokenHashPrefix: '#prefix',
-        }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('adds the user as a read only invited member instead (pendingEditor)', function () {
-        expect(
-          this.CollaboratorsHandler.promises.addUserIdToProject
-        ).to.have.been.calledWith(
-          this.project._id,
-          undefined,
-          this.user._id,
-          PrivilegeLevels.READ_ONLY,
-          { pendingEditor: true }
-        )
-      })
-
-      it('writes a project audit log', function () {
-        expect(
-          this.ProjectAuditLogHandler.promises.addEntry
-        ).to.have.been.calledWith(
-          this.project._id,
-          'accept-via-link-sharing',
-          this.user._id,
-          this.req.ip,
-          { privileges: 'readOnly', pendingEditor: true }
-        )
-      })
-
-      it('records a project-joined event for the user', function () {
-        expect(
-          this.AnalyticsManager.recordEventForUserInBackground
-        ).to.have.been.calledWith(this.user._id, 'project-joined', {
-          mode: 'view',
-          projectId: this.project._id.toString(),
-          pendingEditor: true,
-          ownerId: this.project.owner_ref.toString(),
-          role: PrivilegeLevels.READ_ONLY,
-          source: 'link-sharing',
-        })
-      })
-
-      it('emits a project membership changed event', function () {
-        expect(
-          this.EditorRealTimeController.emitToRoom
-        ).to.have.been.calledWith(
-          this.project._id,
-          'project:membership:changed',
-          { members: true, invites: true }
-        )
-      })
-
-      it('checks token hash', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          '#prefix',
-          'readAndWrite',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    describe('when the access was already granted', function () {
-      beforeEach(function (done) {
-        this.project.tokenAccessReadAndWrite_refs.push(this.user._id)
-        this.req.params = { token: this.token }
-        this.req.body = { confirmedByUser: true }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('writes a project audit log', function () {
-        expect(
-          this.ProjectAuditLogHandler.promises.addEntry
-        ).to.have.been.calledWith(
-          this.project._id,
-          'accept-via-link-sharing',
-          this.user._id,
-          this.req.ip,
-          { privileges: 'readAndWrite' }
-        )
-      })
-
-      it('checks token hash', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          undefined,
-          'readAndWrite',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    describe('hash prefix missing in request', function () {
-      beforeEach(function (done) {
-        this.req.params = { token: this.token }
-        this.req.body = { confirmedByUser: true }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('adds the user as a read and write invited member', function () {
-        expect(
-          this.CollaboratorsHandler.promises.addUserIdToProject
-        ).to.have.been.calledWith(
-          this.project._id,
-          undefined,
-          this.user._id,
-          PrivilegeLevels.READ_AND_WRITE
-        )
-      })
-
-      it('checks the hash prefix', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          undefined,
-          'readAndWrite',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    describe('user is owner of project', function () {
-      beforeEach(function (done) {
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject.returns(
-          PrivilegeLevels.OWNER
-        )
-        this.req.params = { token: this.token }
-        this.req.body = {}
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          done
-        )
-      })
-      it('checks token hash and includes log data', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          undefined,
-          'readAndWrite',
-          this.user._id,
-          {
-            projectId: this.project._id,
-            action: 'user already has higher or same privilege',
-          }
-        )
-      })
-    })
-
-    describe('when user is not logged in', function () {
-      beforeEach(function () {
-        this.SessionManager.getLoggedInUserId.returns(null)
-        this.req.params = { token: this.token }
-        this.req.body = { tokenHashPrefix: '#prefix' }
-      })
-      describe('ANONYMOUS_READ_AND_WRITE_ENABLED is undefined', function () {
-        beforeEach(function (done) {
-          this.res.callback = done
-          this.TokenAccessController.grantTokenAccessReadAndWrite(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('redirects to restricted', function () {
-          expect(this.res.json).to.have.been.calledWith({
-            redirect: '/restricted',
-            anonWriteAccessDenied: true,
-          })
-        })
-
-        it('checks the hash prefix and includes log data', function () {
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readAndWrite',
-            null,
-            {
-              action: 'denied anonymous read-and-write token access',
-            }
-          )
-        })
-
-        it('saves redirect URL with URL fragment', function () {
-          expect(
-            this.AuthenticationController.setRedirectInSession.lastCall.args[1]
-          ).to.equal('/#prefix')
-        })
-      })
-
-      describe('ANONYMOUS_READ_AND_WRITE_ENABLED is true', function () {
-        beforeEach(function (done) {
-          this.TokenAccessHandler.ANONYMOUS_READ_AND_WRITE_ENABLED = true
-          this.res.callback = done
-
-          this.TokenAccessController.grantTokenAccessReadAndWrite(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('redirects to project', function () {
-          expect(this.res.json).to.have.been.calledWith({
-            redirect: `/project/${this.project._id}`,
-            grantAnonymousAccess: 'readAndWrite',
-          })
-        })
-
-        it('checks the hash prefix and includes log data', function () {
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readAndWrite',
-            null,
-            {
-              projectId: this.project._id,
-              action: 'granting read-write anonymous access',
-            }
-          )
-        })
-      })
-    })
-
-    describe('when Overleaf SaaS', function () {
-      beforeEach(function () {
-        this.Settings.overleaf = {}
-      })
-      describe('when token is for v1 project', function () {
-        beforeEach(function (done) {
-          this.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
-          this.TokenAccessHandler.promises.getV1DocInfo.resolves({
-            exists: true,
-            has_owner: true,
-          })
-          this.req.params = { token: this.token }
-          this.req.body = { tokenHashPrefix: '#prefix' }
-          this.res.callback = done
-          this.TokenAccessController.grantTokenAccessReadAndWrite(
-            this.req,
-            this.res,
-            done
-          )
-        })
-        it('returns v1 import data', function () {
-          expect(this.res.json).to.have.been.calledWith({
-            v1Import: {
-              status: 'canDownloadZip',
-              projectId: this.token,
-              hasOwner: true,
-              name: 'Untitled',
-              brandInfo: undefined,
-            },
-          })
-        })
-        it('checks the hash prefix and includes log data', function () {
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readAndWrite',
-            this.user._id,
-            {
-              action: 'import v1',
-            }
-          )
-        })
-      })
-
-      describe('when token is not for a v1 or v2 project', function () {
-        beforeEach(function (done) {
-          this.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
-          this.TokenAccessHandler.promises.getV1DocInfo.resolves({
-            exists: false,
-          })
-          this.req.params = { token: this.token }
-          this.req.body = { tokenHashPrefix: '#prefix' }
-          this.res.callback = done
-          this.TokenAccessController.grantTokenAccessReadAndWrite(
-            this.req,
-            this.res,
-            done
-          )
-        })
-        it('returns 404', function () {
-          expect(this.res.sendStatus).to.have.been.calledWith(404)
-        })
-        it('checks the hash prefix and includes log data', function () {
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readAndWrite',
-            this.user._id,
-            {
-              action: '404',
-            }
-          )
-        })
-      })
-    })
-
-    describe('not Overleaf SaaS', function () {
-      beforeEach(function () {
-        this.TokenAccessHandler.promises.getProjectByToken.resolves(undefined)
-        this.req.params = { token: this.token }
-        this.req.body = { tokenHashPrefix: '#prefix' }
-      })
-      it('passes Errors.NotFoundError to next when project not found and still checks token hash', function (done) {
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res,
-          args => {
-            expect(args).to.be.instanceof(this.Errors.NotFoundError)
-
-            expect(
-              this.TokenAccessHandler.checkTokenHashPrefix
-            ).to.have.been.calledWith(
-              this.token,
-              '#prefix',
-              'readAndWrite',
-              this.user._id,
-              {
-                action: '404',
-              }
-            )
-
-            done()
-          }
-        )
-      })
-    })
-
-    describe('when user is admin', function () {
-      const admin = { _id: new ObjectId(), isAdmin: true }
-      beforeEach(function () {
-        this.SessionManager.getLoggedInUserId.returns(admin._id)
-        this.SessionManager.getSessionUser.returns(admin)
-        this.AdminAuthorizationHelper.canRedirectToAdminDomain.returns(true)
-        this.req.params = { token: this.token }
-        this.req.body = { confirmedByUser: true, tokenHashPrefix: '#prefix' }
-      })
-
-      it('redirects if project owner is non-admin', function () {
-        this.UserGetter.promises.getUserConfirmedEmails = sinon
-          .stub()
-          .resolves([{ email: 'test@not-overleaf.com' }])
-        this.res.callback = () => {
-          expect(this.res.json).to.have.been.calledWith({
-            redirect: `${this.Settings.adminUrl}/#prefix`,
-          })
-        }
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res
-        )
-      })
-
-      it('grants access if project owner is an internal staff', function () {
-        const internalStaff = { _id: new ObjectId(), isAdmin: true }
-        const projectFromInternalStaff = {
-          _id: new ObjectId(),
-          name: 'test',
-          tokenAccessReadAndWrite_refs: [],
-          tokenAccessReadOnly_refs: [],
-          owner_ref: internalStaff._id,
-        }
-        this.UserGetter.promises.getUser = sinon.stub().resolves(internalStaff)
-        this.UserGetter.promises.getUserConfirmedEmails = sinon
-          .stub()
-          .resolves([{ email: 'test@overleaf.com' }])
-        this.TokenAccessHandler.promises.getProjectByToken = sinon
-          .stub()
-          .resolves(projectFromInternalStaff)
-        this.res.callback = () => {
-          expect(
-            this.CollaboratorsHandler.promises.addUserIdToProject
-          ).to.have.been.calledWith(
-            projectFromInternalStaff._id,
-            undefined,
-            admin._id,
-            PrivilegeLevels.READ_AND_WRITE
-          )
-        }
-        this.TokenAccessController.grantTokenAccessReadAndWrite(
-          this.req,
-          this.res
-        )
-      })
-    })
-
-    it('passes Errors.NotFoundError to next when token access is not enabled but still checks token hash', function (done) {
-      this.TokenAccessHandler.tokenAccessEnabledForProject.returns(false)
-      this.req.params = { token: this.token }
-      this.req.body = { tokenHashPrefix: '#prefix' }
-      this.TokenAccessController.grantTokenAccessReadAndWrite(
-        this.req,
-        this.res,
-        args => {
-          expect(args).to.be.instanceof(this.Errors.NotFoundError)
-
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readAndWrite',
-            this.user._id,
-            {
-              projectId: this.project._id,
-              action: 'token access not enabled',
-            }
-          )
-
-          done()
-        }
-      )
-    })
-
-    it('returns 400 when not using a read write token', function () {
-      this.TokenAccessHandler.isReadAndWriteToken.returns(false)
-      this.req.params = { token: this.token }
-      this.req.body = { tokenHashPrefix: '#prefix' }
-      this.TokenAccessController.grantTokenAccessReadAndWrite(
-        this.req,
-        this.res
-      )
-      expect(this.res.sendStatus).to.have.been.calledWith(400)
-    })
-  })
-
-  describe('grantTokenAccessReadOnly', function () {
-    describe('normal case', function () {
-      beforeEach(function (done) {
-        this.req.params = { token: this.token }
-        this.req.body = { confirmedByUser: true, tokenHashPrefix: '#prefix' }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadOnly(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('grants read-only access', function () {
-        expect(
-          this.TokenAccessHandler.promises.addReadOnlyUserToProject
-        ).to.have.been.calledWith(
-          this.user._id,
-          this.project._id,
-          this.project.owner_ref
-        )
-      })
-
-      it('writes a project audit log', function () {
-        expect(
-          this.ProjectAuditLogHandler.promises.addEntry
-        ).to.have.been.calledWith(
-          this.project._id,
-          'join-via-token',
-          this.user._id,
-          this.req.ip,
-          { privileges: 'readOnly' }
-        )
-      })
-
-      it('checks if hash prefix matches', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          '#prefix',
-          'readOnly',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    describe('when the access was already granted', function () {
-      beforeEach(function (done) {
-        this.project.tokenAccessReadOnly_refs.push(this.user._id)
-        this.req.params = { token: this.token }
-        this.req.body = { confirmedByUser: true }
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadOnly(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it("doesn't write a project audit log", function () {
-        expect(this.ProjectAuditLogHandler.promises.addEntry).to.not.have.been
-          .called
-      })
-
-      it('still checks if hash prefix matches', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          undefined,
-          'readOnly',
-          this.user._id,
-          { projectId: this.project._id, action: 'continue' }
-        )
-      })
-    })
-
-    it('returns 400 when not using a read only token', function () {
-      this.TokenAccessHandler.isReadOnlyToken.returns(false)
-      this.req.params = { token: this.token }
-      this.req.body = { tokenHashPrefix: '#prefix' }
-      this.TokenAccessController.grantTokenAccessReadOnly(this.req, this.res)
-      expect(this.res.sendStatus).to.have.been.calledWith(400)
-    })
-
-    describe('anonymous users', function () {
-      beforeEach(function (done) {
-        this.req.params = { token: this.token }
-        this.SessionManager.getLoggedInUserId.returns(null)
-        this.res.callback = done
-
-        this.TokenAccessController.grantTokenAccessReadOnly(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('allows anonymous users and checks the token hash', function () {
-        expect(this.res.json).to.have.been.calledWith({
-          redirect: `/project/${this.project._id}`,
-          grantAnonymousAccess: 'readOnly',
-        })
-
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(this.token, undefined, 'readOnly', null, {
-          projectId: this.project._id,
-          action: 'granting read-only anonymous access',
-        })
-      })
-    })
-
-    describe('user is owner of project', function () {
-      beforeEach(function (done) {
-        this.AuthorizationManager.promises.getPrivilegeLevelForProject.returns(
-          PrivilegeLevels.OWNER
-        )
-        this.req.params = { token: this.token }
-        this.req.body = {}
-        this.res.callback = done
-        this.TokenAccessController.grantTokenAccessReadOnly(
-          this.req,
-          this.res,
-          done
-        )
-      })
-      it('checks token hash and includes log data', function () {
-        expect(
-          this.TokenAccessHandler.checkTokenHashPrefix
-        ).to.have.been.calledWith(
-          this.token,
-          undefined,
-          'readOnly',
-          this.user._id,
-          {
-            projectId: this.project._id,
-            action: 'user already has higher or same privilege',
-          }
-        )
-      })
-    })
-
-    it('passes Errors.NotFoundError to next when token access is not enabled but still checks token hash', function (done) {
-      this.TokenAccessHandler.tokenAccessEnabledForProject.returns(false)
-      this.req.params = { token: this.token }
-      this.req.body = { tokenHashPrefix: '#prefix' }
-      this.TokenAccessController.grantTokenAccessReadOnly(
-        this.req,
-        this.res,
-        args => {
-          expect(args).to.be.instanceof(this.Errors.NotFoundError)
-
-          expect(
-            this.TokenAccessHandler.checkTokenHashPrefix
-          ).to.have.been.calledWith(
-            this.token,
-            '#prefix',
-            'readOnly',
-            this.user._id,
-            {
-              projectId: this.project._id,
-              action: 'token access not enabled',
-            }
-          )
-
-          done()
-        }
-      )
-    })
-  })
-
-  describe('ensureUserCanUseSharingUpdatesConsentPage', function () {
-    beforeEach(function () {
-      this.req.params = { Project_id: this.project._id }
-    })
-
-    describe('when not in link sharing changes test', function () {
-      beforeEach(function (done) {
-        this.AsyncFormHelper.redirect = sinon.stub().callsFake(() => done())
-        this.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('redirects to the project/editor', function () {
-        expect(this.AsyncFormHelper.redirect).to.have.been.calledWith(
-          this.req,
-          this.res,
-          `/project/${this.project._id}`
-        )
-      })
-    })
-
-    describe('when link sharing changes test active', function () {
-      beforeEach(function () {
-        this.SplitTestHandler.promises.getAssignmentForUser.resolves({
-          variant: 'active',
-        })
-      })
-
-      describe('when user is not an invited editor and is a read write token member', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsGetter.promises.isUserInvitedReadWriteMemberOfProject.resolves(
-            false
-          )
-          this.CollaboratorsGetter.promises.userIsReadWriteTokenMember.resolves(
-            true
-          )
-          this.next.callsFake(() => done())
-          this.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
-            this.req,
-            this.res,
-            this.next
-          )
-        })
-
-        it('calls next', function () {
-          expect(
-            this.CollaboratorsGetter.promises
-              .isUserInvitedReadWriteMemberOfProject
-          ).to.have.been.calledWith(this.user._id, this.project._id)
-          expect(
-            this.CollaboratorsGetter.promises.userIsReadWriteTokenMember
-          ).to.have.been.calledWith(this.user._id, this.project._id)
-          expect(this.next).to.have.been.calledOnce
-          expect(this.next.firstCall.args[0]).to.not.exist
-        })
-      })
-
-      describe('when user is already an invited editor', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsGetter.promises.isUserInvitedReadWriteMemberOfProject.resolves(
-            true
-          )
-          this.AsyncFormHelper.redirect = sinon.stub().callsFake(() => done())
-          this.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('redirects to the project/editor', function () {
-          expect(this.AsyncFormHelper.redirect).to.have.been.calledWith(
-            this.req,
-            this.res,
-            `/project/${this.project._id}`
-          )
-        })
-      })
-
-      describe('when user not a read write token member', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsGetter.promises.userIsReadWriteTokenMember.resolves(
-            false
-          )
-          this.AsyncFormHelper.redirect = sinon.stub().callsFake(() => done())
-          this.TokenAccessController.ensureUserCanUseSharingUpdatesConsentPage(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('redirects to the project/editor', function () {
-          expect(this.AsyncFormHelper.redirect).to.have.been.calledWith(
-            this.req,
-            this.res,
-            `/project/${this.project._id}`
-          )
-        })
-      })
-    })
-  })
-
-  describe('moveReadWriteToCollaborators', function () {
-    beforeEach(function () {
-      this.req.params = { Project_id: this.project._id }
-    })
-
-    describe('when there are collaborator slots available', function () {
-      beforeEach(function () {
-        this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-          true
-        )
-      })
-
-      describe('previously joined token access user moving to named collaborator', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-            false
-          )
-          this.res.callback = done
-          this.TokenAccessController.moveReadWriteToCollaborators(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('sets the privilege level to read and write for the invited viewer', function () {
-          expect(
-            this.TokenAccessHandler.promises.removeReadAndWriteUserFromProject
-          ).to.have.been.calledWith(this.user._id, this.project._id)
-          expect(
-            this.CollaboratorsHandler.promises.addUserIdToProject
-          ).to.have.been.calledWith(
-            this.project._id,
-            undefined,
-            this.user._id,
-            PrivilegeLevels.READ_AND_WRITE
-          )
-          expect(this.res.sendStatus).to.have.been.calledWith(204)
-        })
-      })
-    })
-
-    describe('when there are no edit collaborator slots available', function () {
-      beforeEach(function () {
-        this.LimitationsManager.promises.canAcceptEditCollaboratorInvite.resolves(
-          false
-        )
-      })
-
-      describe('previously joined token access user moving to named collaborator', function () {
-        beforeEach(function (done) {
-          this.CollaboratorsGetter.promises.isUserInvitedMemberOfProject.resolves(
-            false
-          )
-          this.res.callback = done
-          this.TokenAccessController.moveReadWriteToCollaborators(
-            this.req,
-            this.res,
-            done
-          )
-        })
-
-        it('sets the privilege level to read only for the invited viewer (pendingEditor)', function () {
-          expect(
-            this.TokenAccessHandler.promises.removeReadAndWriteUserFromProject
-          ).to.have.been.calledWith(this.user._id, this.project._id)
-          expect(
-            this.CollaboratorsHandler.promises.addUserIdToProject
-          ).to.have.been.calledWith(
-            this.project._id,
-            undefined,
-            this.user._id,
-            PrivilegeLevels.READ_ONLY,
-            { pendingEditor: true }
-          )
-          expect(this.res.sendStatus).to.have.been.calledWith(204)
-        })
-      })
-    })
-  })
-
-  describe('moveReadWriteToReadOnly', function () {
-    beforeEach(function () {
-      this.req.params = { Project_id: this.project._id }
-    })
-
-    describe('previously joined token access user moving to anonymous viewer', function () {
-      beforeEach(function (done) {
-        this.res.callback = done
-        this.TokenAccessController.moveReadWriteToReadOnly(
-          this.req,
-          this.res,
-          done
-        )
-      })
-
-      it('removes them from read write token access refs and adds them to read only token access refs', function () {
-        expect(
-          this.TokenAccessHandler.promises.moveReadAndWriteUserToReadOnly
-        ).to.have.been.calledWith(this.user._id, this.project._id)
-        expect(this.res.sendStatus).to.have.been.calledWith(204)
-      })
-
-      it('writes a project audit log', function () {
-        expect(
-          this.ProjectAuditLogHandler.promises.addEntry
-        ).to.have.been.calledWith(
-          this.project._id,
-          'readonly-via-sharing-updates',
-          this.user._id,
-          this.req.ip
-        )
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/Uploads/FileTypeManagerTests.js b/services/web/test/unit/src/Uploads/FileTypeManagerTests.js
index ae8645b034..032f11ed57 100644
--- a/services/web/test/unit/src/Uploads/FileTypeManagerTests.js
+++ b/services/web/test/unit/src/Uploads/FileTypeManagerTests.js
@@ -65,22 +65,25 @@ describe('FileTypeManager', function () {
     describe('when it is a directory', function () {
       beforeEach(function () {
         this.stats.isDirectory.returns(true)
-        this.FileTypeManager.isDirectory('/some/path', this.callback)
       })
 
-      it('should return true', function () {
-        this.callback.should.have.been.calledWith(null, true)
+      it('should return true', async function () {
+        const result =
+          await this.FileTypeManager.promises.isDirectory('/some/path')
+
+        expect(result).to.equal(true)
       })
     })
 
     describe('when it is not a directory', function () {
       beforeEach(function () {
         this.stats.isDirectory.returns(false)
-        this.FileTypeManager.isDirectory('/some/path', this.callback)
       })
 
-      it('should return false', function () {
-        this.callback.should.have.been.calledWith(null, false)
+      it('should return false', async function () {
+        const result =
+          await this.FileTypeManager.promises.isDirectory('/some/path')
+        expect(result).to.equal(false)
       })
     })
   })
@@ -113,223 +116,158 @@ describe('FileTypeManager', function () {
         '/GNUMakefile',
       ]
       TEXT_FILENAMES.forEach(filename => {
-        it(`should classify ${filename} as text`, function (done) {
-          this.FileTypeManager.getType(
+        it(`should classify ${filename} as text`, async function () {
+          const { binary } = await this.FileTypeManager.promises.getType(
             filename,
             'utf8.tex',
-            null,
-            (err, { binary }) => {
-              if (err) {
-                return done(err)
-              }
-              binary.should.equal(false)
-              done()
-            }
+            null
           )
+
+          binary.should.equal(false)
         })
       })
 
-      it('should not classify short text files as binary', function (done) {
+      it('should not classify short text files as binary', async function () {
         this.stats.size = 2 * 1024 * 1024 // 2MB
-        this.FileTypeManager.getType(
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'text-short.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(false)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(false)
       })
 
-      it('should not classify text files just under the size limit as binary', function (done) {
+      it('should not classify text files just under the size limit as binary', async function () {
         this.stats.size = 2 * 1024 * 1024 // 2MB
-        this.FileTypeManager.getType(
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'text-smaller.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(false)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(false)
       })
 
-      it('should classify text files at the size limit as binary', function (done) {
+      it('should classify text files at the size limit as binary', async function () {
         this.stats.size = 2 * 1024 * 1024 // 2MB
-        this.FileTypeManager.getType(
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'text-exact.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(true)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(true)
       })
 
-      it('should classify long text files as binary', function (done) {
+      it('should classify long text files as binary', async function () {
         this.stats.size = 2 * 1024 * 1024 // 2MB
-        this.FileTypeManager.getType(
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'text-long.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(true)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(true)
       })
 
-      it('should classify large text files as binary', function (done) {
+      it('should classify large text files as binary', async function () {
         this.stats.size = 8 * 1024 * 1024 // 8MB
-        this.FileTypeManager.getType(
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'utf8.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(true)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(true)
       })
 
-      it('should not try to determine the encoding of large files', function (done) {
+      it('should not try to determine the encoding of large files', async function () {
         this.stats.size = 8 * 1024 * 1024 // 8MB
-        this.FileTypeManager.getType('/file.tex', 'utf8.tex', null, err => {
-          if (err) {
-            return done(err)
-          }
-          sinon.assert.notCalled(this.isUtf8)
-          done()
-        })
-      })
-
-      it('should detect the encoding of a utf8 file', function (done) {
-        this.FileTypeManager.getType(
+        await this.FileTypeManager.promises.getType(
           '/file.tex',
           'utf8.tex',
-          null,
-          (err, { binary, encoding }) => {
-            if (err) {
-              return done(err)
-            }
-            sinon.assert.calledOnce(this.isUtf8)
-            this.isUtf8.returned(true).should.equal(true)
-            encoding.should.equal('utf-8')
-            done()
-          }
+          null
         )
+
+        sinon.assert.notCalled(this.isUtf8)
       })
 
-      it("should return 'latin1' for non-unicode encodings", function (done) {
-        this.FileTypeManager.getType(
+      it('should detect the encoding of a utf8 file', async function () {
+        const { encoding } = await this.FileTypeManager.promises.getType(
+          '/file.tex',
+          'utf8.tex',
+          null
+        )
+
+        sinon.assert.calledOnce(this.isUtf8)
+        this.isUtf8.returned(true).should.equal(true)
+        encoding.should.equal('utf-8')
+      })
+
+      it("should return 'latin1' for non-unicode encodings", async function () {
+        const { encoding } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'latin1.tex',
-          null,
-          (err, { binary, encoding }) => {
-            if (err) {
-              return done(err)
-            }
-            sinon.assert.calledOnce(this.isUtf8)
-            this.isUtf8.returned(false).should.equal(true)
-            encoding.should.equal('latin1')
-            done()
-          }
+          null
         )
+
+        sinon.assert.calledOnce(this.isUtf8)
+        this.isUtf8.returned(false).should.equal(true)
+        encoding.should.equal('latin1')
       })
 
-      it('should classify utf16 with BOM as utf-16', function (done) {
-        this.FileTypeManager.getType(
+      it('should classify utf16 with BOM as utf-16', async function () {
+        const { encoding } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'utf16.tex',
-          null,
-          (err, { binary, encoding }) => {
-            if (err) {
-              return done(err)
-            }
-            sinon.assert.calledOnce(this.isUtf8)
-            this.isUtf8.returned(false).should.equal(true)
-            encoding.should.equal('utf-16le')
-            done()
-          }
+          null
         )
+
+        sinon.assert.calledOnce(this.isUtf8)
+        this.isUtf8.returned(false).should.equal(true)
+        encoding.should.equal('utf-16le')
       })
 
-      it('should classify latin1 files with a null char as binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should classify latin1 files with a null char as binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'latin1-null.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            expect(binary).to.equal(true)
-            done()
-          }
+          null
         )
+        expect(binary).to.equal(true)
       })
 
-      it('should classify utf8 files with a null char as binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should classify utf8 files with a null char as binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'utf8-null.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            expect(binary).to.equal(true)
-            done()
-          }
+          null
         )
+
+        expect(binary).to.equal(true)
       })
 
-      it('should classify utf8 files with non-BMP chars as binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should classify utf8 files with non-BMP chars as binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.tex',
           'utf8-non-bmp.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            expect(binary).to.equal(true)
-            done()
-          }
+          null
         )
+
+        expect(binary).to.equal(true)
       })
 
-      it('should classify utf8 files with ascii control chars as utf-8', function (done) {
-        this.FileTypeManager.getType(
-          '/file.tex',
-          'utf8-control-chars.tex',
-          null,
-          (err, { binary, encoding }) => {
-            if (err) {
-              return done(err)
-            }
-            expect(binary).to.equal(false)
-            expect(encoding).to.equal('utf-8')
-            done()
-          }
-        )
+      it('should classify utf8 files with ascii control chars as utf-8', async function () {
+        const { binary, encoding } =
+          await this.FileTypeManager.promises.getType(
+            '/file.tex',
+            'utf8-control-chars.tex',
+            null
+          )
+
+        expect(binary).to.equal(false)
+        expect(encoding).to.equal('utf-8')
       })
     })
 
@@ -342,189 +280,132 @@ describe('FileTypeManager', function () {
         '/tex',
       ]
       BINARY_FILENAMES.forEach(filename => {
-        it(`should classify ${filename} as binary`, function (done) {
-          this.FileTypeManager.getType(
+        it(`should classify ${filename} as binary`, async function () {
+          const { binary } = await this.FileTypeManager.promises.getType(
             filename,
             'latin1.tex', // even if the content is not binary
-            null,
-            (err, { binary }) => {
-              if (err) {
-                return done(err)
-              }
-              binary.should.equal(true)
-              done()
-            }
+            null
           )
+
+          binary.should.equal(true)
         })
       })
 
-      it('should not try to get the character encoding', function (done) {
-        this.FileTypeManager.getType('/file.png', 'utf8.tex', null, err => {
-          if (err) {
-            return done(err)
-          }
-          sinon.assert.notCalled(this.isUtf8)
-          done()
-        })
+      it('should not try to get the character encoding', async function () {
+        await this.FileTypeManager.promises.getType(
+          '/file.png',
+          'utf8.tex',
+          null
+        )
+
+        sinon.assert.notCalled(this.isUtf8)
       })
 
-      it('should recognise new binary files as binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should recognise new binary files as binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.py',
           'latin1.tex',
-          null,
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(true)
-            done()
-          }
+          null
         )
+
+        binary.should.equal(true)
       })
 
-      it('should recognise existing binary files as binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should recognise existing binary files as binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.py',
           'latin1.tex',
-          'file',
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(true)
-            done()
-          }
+          'file'
         )
+
+        binary.should.equal(true)
       })
 
-      it('should preserve existing non-binary files as non-binary', function (done) {
-        this.FileTypeManager.getType(
+      it('should preserve existing non-binary files as non-binary', async function () {
+        const { binary } = await this.FileTypeManager.promises.getType(
           '/file.py',
           'latin1.tex',
-          'doc',
-          (err, { binary }) => {
-            if (err) {
-              return done(err)
-            }
-            binary.should.equal(false)
-            done()
-          }
+          'doc'
         )
+
+        binary.should.equal(false)
       })
     })
   })
 
   describe('shouldIgnore', function () {
-    it('should ignore tex auxiliary files', function (done) {
-      this.FileTypeManager.shouldIgnore('file.aux', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore tex auxiliary files', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('file.aux')
+      ignore.should.equal(true)
     })
 
-    it('should ignore dotfiles', function (done) {
-      this.FileTypeManager.shouldIgnore('path/.git', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore dotfiles', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('path/.git')
+
+      ignore.should.equal(true)
     })
 
-    it('should ignore .git directories and contained files', function (done) {
-      this.FileTypeManager.shouldIgnore('path/.git/info', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore .git directories and contained files', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('path/.git/info')
+
+      ignore.should.equal(true)
     })
 
-    it('should not ignore .latexmkrc dotfile', function (done) {
-      this.FileTypeManager.shouldIgnore('path/.latexmkrc', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(false)
-        done()
-      })
+    it('should not ignore .latexmkrc dotfile', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('path/.latexmkrc')
+
+      ignore.should.equal(false)
     })
 
-    it('should ignore __MACOSX', function (done) {
-      this.FileTypeManager.shouldIgnore('path/__MACOSX', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore __MACOSX', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('path/__MACOSX')
+
+      ignore.should.equal(true)
     })
 
-    it('should ignore synctex files', function (done) {
-      this.FileTypeManager.shouldIgnore('file.synctex', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore synctex files', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('file.synctex')
+
+      ignore.should.equal(true)
     })
 
-    it('should ignore synctex(busy) files', function (done) {
-      this.FileTypeManager.shouldIgnore('file.synctex(busy)', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore synctex(busy) files', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('file.synctex(busy)')
+
+      ignore.should.equal(true)
     })
 
-    it('should not ignore .tex files', function (done) {
-      this.FileTypeManager.shouldIgnore('file.tex', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(false)
-        done()
-      })
+    it('should not ignore .tex files', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('file.tex')
+
+      ignore.should.equal(false)
     })
 
-    it('should ignore the case of the extension', function (done) {
-      this.FileTypeManager.shouldIgnore('file.AUX', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(true)
-        done()
-      })
+    it('should ignore the case of the extension', async function () {
+      const ignore =
+        await this.FileTypeManager.promises.shouldIgnore('file.AUX')
+
+      ignore.should.equal(true)
     })
 
-    it('should not ignore files with an ignored extension as full name', function (done) {
-      this.FileTypeManager.shouldIgnore('dvi', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(false)
-        done()
-      })
+    it('should not ignore files with an ignored extension as full name', async function () {
+      const ignore = await this.FileTypeManager.promises.shouldIgnore('dvi')
+      ignore.should.equal(false)
     })
 
-    it('should not ignore directories with an ignored extension as full name', function (done) {
+    it('should not ignore directories with an ignored extension as full name', async function () {
       this.stats.isDirectory.returns(true)
-      this.FileTypeManager.shouldIgnore('dvi', (err, ignore) => {
-        if (err) {
-          return done(err)
-        }
-        ignore.should.equal(false)
-        done()
-      })
+      const ignore = await this.FileTypeManager.promises.shouldIgnore('dvi')
+
+      ignore.should.equal(false)
     })
   })
 })
diff --git a/services/web/test/unit/src/Uploads/ProjectUploadController.test.mjs b/services/web/test/unit/src/Uploads/ProjectUploadController.test.mjs
new file mode 100644
index 0000000000..b36d596da2
--- /dev/null
+++ b/services/web/test/unit/src/Uploads/ProjectUploadController.test.mjs
@@ -0,0 +1,367 @@
+// TODO: This file was created by bulk-decaffeinate.
+// Fix any style issues and re-enable lint.
+/*
+ * decaffeinate suggestions:
+ * DS206: Consider reworking classes to avoid initClass
+ * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
+ */
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+import ArchiveErrors from '../../../../app/src/Features/Uploads/ArchiveErrors.js'
+
+const modulePath =
+  '../../../../app/src/Features/Uploads/ProjectUploadController.mjs'
+
+describe('ProjectUploadController', function () {
+  beforeEach(async function (ctx) {
+    let Timer
+    ctx.req = new MockRequest()
+    ctx.res = new MockResponse()
+    ctx.user_id = 'user-id-123'
+    ctx.metrics = {
+      Timer: (Timer = (function () {
+        Timer = class Timer {
+          static initClass() {
+            this.prototype.done = sinon.stub()
+          }
+        }
+        Timer.initClass()
+        return Timer
+      })()),
+    }
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns(ctx.user_id),
+    }
+    ctx.ProjectLocator = {
+      promises: {},
+    }
+    ctx.EditorController = {
+      promises: {},
+    }
+
+    vi.doMock('multer', () => ({
+      default: sinon.stub(),
+    }))
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: { path: {} },
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Uploads/ProjectUploadManager',
+      () => ({
+        default: (ctx.ProjectUploadManager = {}),
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Uploads/FileSystemImportManager',
+      () => ({
+        default: (ctx.FileSystemImportManager = {}),
+      })
+    )
+
+    vi.doMock('@overleaf/metrics', () => ({
+      default: ctx.metrics,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Uploads/ArchiveErrors',
+      () => ArchiveErrors
+    )
+
+    vi.doMock('../../../../app/src/Features/Project/ProjectLocator', () => ({
+      default: ctx.ProjectLocator,
+    }))
+
+    vi.doMock('../../../../app/src/Features/Editor/EditorController', () => ({
+      default: ctx.EditorController,
+    }))
+
+    vi.doMock('fs', () => ({
+      default: (ctx.fs = {}),
+    }))
+
+    ctx.ProjectUploadController = (await import(modulePath)).default
+  })
+
+  describe('uploadProject', function () {
+    beforeEach(function (ctx) {
+      ctx.path = '/path/to/file/on/disk.zip'
+      ctx.fileName = 'filename.zip'
+      ctx.req.file = {
+        path: ctx.path,
+      }
+      ctx.req.body = {
+        name: ctx.fileName,
+      }
+      ctx.req.session = {
+        user: {
+          _id: ctx.user_id,
+        },
+      }
+      ctx.project = { _id: (ctx.project_id = 'project-id-123') }
+
+      ctx.fs.unlink = sinon.stub()
+    })
+
+    describe('successfully', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive = sinon
+          .stub()
+          .callsArgWith(3, null, ctx.project)
+        ctx.ProjectUploadController.uploadProject(ctx.req, ctx.res)
+      })
+
+      it('should create a project owned by the logged in user', function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive
+          .calledWith(ctx.user_id)
+          .should.equal(true)
+      })
+
+      it('should create a project with the same name as the zip archive', function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive
+          .calledWith(sinon.match.any, 'filename', sinon.match.any)
+          .should.equal(true)
+      })
+
+      it('should create a project from the zip archive', function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive
+          .calledWith(sinon.match.any, sinon.match.any, ctx.path)
+          .should.equal(true)
+      })
+
+      it('should return a successful response to the FileUploader client', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({
+            success: true,
+            project_id: ctx.project_id,
+          })
+        )
+      })
+
+      it('should record the time taken to do the upload', function (ctx) {
+        ctx.metrics.Timer.prototype.done.called.should.equal(true)
+      })
+
+      it('should remove the uploaded file', function (ctx) {
+        ctx.fs.unlink.calledWith(ctx.path).should.equal(true)
+      })
+    })
+
+    describe('when ProjectUploadManager.createProjectFromZipArchive fails', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive = sinon
+          .stub()
+          .callsArgWith(3, new Error('Something went wrong'), ctx.project)
+        ctx.ProjectUploadController.uploadProject(ctx.req, ctx.res)
+      })
+
+      it('should return a failed response to the FileUploader client', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({ success: false, error: 'upload_failed' })
+        )
+      })
+    })
+
+    describe('when ProjectUploadManager.createProjectFromZipArchive reports the file as invalid', function () {
+      beforeEach(function (ctx) {
+        ctx.ProjectUploadManager.createProjectFromZipArchive = sinon
+          .stub()
+          .callsArgWith(
+            3,
+            new ArchiveErrors.ZipContentsTooLargeError(),
+            ctx.project
+          )
+        ctx.ProjectUploadController.uploadProject(ctx.req, ctx.res)
+      })
+
+      it('should return the reported error to the FileUploader client', function (ctx) {
+        expect(JSON.parse(ctx.res.body)).to.deep.equal({
+          success: false,
+          error: 'zip_contents_too_large',
+        })
+      })
+
+      it("should return an 'unprocessable entity' status code", function (ctx) {
+        expect(ctx.res.statusCode).to.equal(422)
+      })
+    })
+  })
+
+  describe('uploadFile', function () {
+    beforeEach(function (ctx) {
+      ctx.project_id = 'project-id-123'
+      ctx.folder_id = 'folder-id-123'
+      ctx.path = '/path/to/file/on/disk.png'
+      ctx.fileName = 'filename.png'
+      ctx.req.file = {
+        path: ctx.path,
+      }
+      ctx.req.body = {
+        name: ctx.fileName,
+      }
+      ctx.req.session = {
+        user: {
+          _id: ctx.user_id,
+        },
+      }
+      ctx.req.params = { Project_id: ctx.project_id }
+      ctx.req.query = { folder_id: ctx.folder_id }
+      ctx.fs.unlink = sinon.stub()
+    })
+
+    describe('successfully', function () {
+      beforeEach(function (ctx) {
+        ctx.entity = {
+          _id: '1234',
+          type: 'file',
+        }
+        ctx.FileSystemImportManager.addEntity = sinon
+          .stub()
+          .callsArgWith(6, null, ctx.entity)
+        ctx.ProjectUploadController.uploadFile(ctx.req, ctx.res)
+      })
+
+      it('should insert the file', function (ctx) {
+        return ctx.FileSystemImportManager.addEntity
+          .calledWith(
+            ctx.user_id,
+            ctx.project_id,
+            ctx.folder_id,
+            ctx.fileName,
+            ctx.path
+          )
+          .should.equal(true)
+      })
+
+      it('should return a successful response to the FileUploader client', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({
+            success: true,
+            entity_id: ctx.entity._id,
+            entity_type: 'file',
+          })
+        )
+      })
+
+      it('should time the request', function (ctx) {
+        ctx.metrics.Timer.prototype.done.called.should.equal(true)
+      })
+
+      it('should remove the uploaded file', function (ctx) {
+        ctx.fs.unlink.calledWith(ctx.path).should.equal(true)
+      })
+    })
+
+    describe('with folder structure', function () {
+      beforeEach(async function (ctx) {
+        await new Promise(resolve => {
+          ctx.entity = {
+            _id: '1234',
+            type: 'file',
+          }
+          ctx.FileSystemImportManager.addEntity = sinon
+            .stub()
+            .callsArgWith(6, null, ctx.entity)
+          ctx.ProjectLocator.promises.findElement = sinon.stub().resolves({
+            path: { fileSystem: '/test' },
+          })
+          ctx.EditorController.promises.mkdirp = sinon.stub().resolves({
+            lastFolder: { _id: 'folder-id' },
+          })
+          ctx.req.body.relativePath = 'foo/bar/' + ctx.fileName
+          ctx.res.json = data => {
+            expect(data.success).to.be.true
+            resolve()
+          }
+          ctx.ProjectUploadController.uploadFile(ctx.req, ctx.res)
+        })
+      })
+
+      it('should insert the file', function (ctx) {
+        ctx.ProjectLocator.promises.findElement.should.be.calledOnceWithExactly(
+          {
+            project_id: ctx.project_id,
+            element_id: ctx.folder_id,
+            type: 'folder',
+          }
+        )
+
+        ctx.EditorController.promises.mkdirp.should.be.calledWith(
+          ctx.project_id,
+          '/test/foo/bar',
+          ctx.user_id
+        )
+
+        ctx.FileSystemImportManager.addEntity.should.be.calledOnceWith(
+          ctx.user_id,
+          ctx.project_id,
+          'folder-id',
+          ctx.fileName,
+          ctx.path
+        )
+      })
+    })
+
+    describe('when FileSystemImportManager.addEntity returns a generic error', function () {
+      beforeEach(function (ctx) {
+        ctx.FileSystemImportManager.addEntity = sinon
+          .stub()
+          .callsArgWith(6, new Error('Sorry something went wrong'))
+        ctx.ProjectUploadController.uploadFile(ctx.req, ctx.res)
+      })
+
+      it('should return an unsuccessful response to the FileUploader client', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({
+            success: false,
+          })
+        )
+      })
+    })
+
+    describe('when FileSystemImportManager.addEntity returns a too many files error', function () {
+      beforeEach(function (ctx) {
+        ctx.FileSystemImportManager.addEntity = sinon
+          .stub()
+          .callsArgWith(6, new Error('project_has_too_many_files'))
+        ctx.ProjectUploadController.uploadFile(ctx.req, ctx.res)
+      })
+
+      it('should return an unsuccessful response to the FileUploader client', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({
+            success: false,
+            error: 'project_has_too_many_files',
+          })
+        )
+      })
+    })
+
+    describe('with an invalid filename', function () {
+      beforeEach(function (ctx) {
+        ctx.req.body.name = ''
+        ctx.ProjectUploadController.uploadFile(ctx.req, ctx.res)
+      })
+
+      it('should return a a non success response', function (ctx) {
+        expect(ctx.res.body).to.deep.equal(
+          JSON.stringify({
+            success: false,
+            error: 'invalid_filename',
+          })
+        )
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/Uploads/ProjectUploadControllerTests.mjs b/services/web/test/unit/src/Uploads/ProjectUploadControllerTests.mjs
deleted file mode 100644
index 8db1e9536e..0000000000
--- a/services/web/test/unit/src/Uploads/ProjectUploadControllerTests.mjs
+++ /dev/null
@@ -1,334 +0,0 @@
-// TODO: This file was created by bulk-decaffeinate.
-// Fix any style issues and re-enable lint.
-/*
- * decaffeinate suggestions:
- * DS102: Remove unnecessary code created because of implicit returns
- * DS206: Consider reworking classes to avoid initClass
- * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
- */
-import sinon from 'sinon'
-
-import { expect } from 'chai'
-
-import esmock from 'esmock'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import ArchiveErrors from '../../../../app/src/Features/Uploads/ArchiveErrors.js'
-
-const modulePath =
-  '../../../../app/src/Features/Uploads/ProjectUploadController.mjs'
-
-describe('ProjectUploadController', function () {
-  beforeEach(async function () {
-    let Timer
-    this.req = new MockRequest()
-    this.res = new MockResponse()
-    this.user_id = 'user-id-123'
-    this.metrics = {
-      Timer: (Timer = (function () {
-        Timer = class Timer {
-          static initClass() {
-            this.prototype.done = sinon.stub()
-          }
-        }
-        Timer.initClass()
-        return Timer
-      })()),
-    }
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns(this.user_id),
-    }
-    this.ProjectLocator = {
-      promises: {},
-    }
-    this.EditorController = {
-      promises: {},
-    }
-
-    return (this.ProjectUploadController = await esmock.strict(modulePath, {
-      multer: sinon.stub(),
-      '@overleaf/settings': { path: {} },
-      '../../../../app/src/Features/Uploads/ProjectUploadManager':
-        (this.ProjectUploadManager = {}),
-      '../../../../app/src/Features/Uploads/FileSystemImportManager':
-        (this.FileSystemImportManager = {}),
-      '@overleaf/metrics': this.metrics,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/Uploads/ArchiveErrors': ArchiveErrors,
-      '../../../../app/src/Features/Project/ProjectLocator':
-        this.ProjectLocator,
-      '../../../../app/src/Features/Editor/EditorController':
-        this.EditorController,
-      fs: (this.fs = {}),
-    }))
-  })
-
-  describe('uploadProject', function () {
-    beforeEach(function () {
-      this.path = '/path/to/file/on/disk.zip'
-      this.name = 'filename.zip'
-      this.req.file = {
-        path: this.path,
-      }
-      this.req.body = {
-        name: this.name,
-      }
-      this.req.session = {
-        user: {
-          _id: this.user_id,
-        },
-      }
-      this.project = { _id: (this.project_id = 'project-id-123') }
-
-      return (this.fs.unlink = sinon.stub())
-    })
-
-    describe('successfully', function () {
-      beforeEach(function () {
-        this.ProjectUploadManager.createProjectFromZipArchive = sinon
-          .stub()
-          .callsArgWith(3, null, this.project)
-        return this.ProjectUploadController.uploadProject(this.req, this.res)
-      })
-
-      it('should create a project owned by the logged in user', function () {
-        return this.ProjectUploadManager.createProjectFromZipArchive
-          .calledWith(this.user_id)
-          .should.equal(true)
-      })
-
-      it('should create a project with the same name as the zip archive', function () {
-        return this.ProjectUploadManager.createProjectFromZipArchive
-          .calledWith(sinon.match.any, 'filename', sinon.match.any)
-          .should.equal(true)
-      })
-
-      it('should create a project from the zip archive', function () {
-        return this.ProjectUploadManager.createProjectFromZipArchive
-          .calledWith(sinon.match.any, sinon.match.any, this.path)
-          .should.equal(true)
-      })
-
-      it('should return a successful response to the FileUploader client', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({
-            success: true,
-            project_id: this.project_id,
-          })
-        )
-      })
-
-      it('should record the time taken to do the upload', function () {
-        return this.metrics.Timer.prototype.done.called.should.equal(true)
-      })
-
-      it('should remove the uploaded file', function () {
-        return this.fs.unlink.calledWith(this.path).should.equal(true)
-      })
-    })
-
-    describe('when ProjectUploadManager.createProjectFromZipArchive fails', function () {
-      beforeEach(function () {
-        this.ProjectUploadManager.createProjectFromZipArchive = sinon
-          .stub()
-          .callsArgWith(3, new Error('Something went wrong'), this.project)
-        return this.ProjectUploadController.uploadProject(this.req, this.res)
-      })
-
-      it('should return a failed response to the FileUploader client', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({ success: false, error: 'upload_failed' })
-        )
-      })
-    })
-
-    describe('when ProjectUploadManager.createProjectFromZipArchive reports the file as invalid', function () {
-      beforeEach(function () {
-        this.ProjectUploadManager.createProjectFromZipArchive = sinon
-          .stub()
-          .callsArgWith(
-            3,
-            new ArchiveErrors.ZipContentsTooLargeError(),
-            this.project
-          )
-        return this.ProjectUploadController.uploadProject(this.req, this.res)
-      })
-
-      it('should return the reported error to the FileUploader client', function () {
-        expect(JSON.parse(this.res.body)).to.deep.equal({
-          success: false,
-          error: 'zip_contents_too_large',
-        })
-      })
-
-      it("should return an 'unprocessable entity' status code", function () {
-        return expect(this.res.statusCode).to.equal(422)
-      })
-    })
-  })
-
-  describe('uploadFile', function () {
-    beforeEach(function () {
-      this.project_id = 'project-id-123'
-      this.folder_id = 'folder-id-123'
-      this.path = '/path/to/file/on/disk.png'
-      this.name = 'filename.png'
-      this.req.file = {
-        path: this.path,
-      }
-      this.req.body = {
-        name: this.name,
-      }
-      this.req.session = {
-        user: {
-          _id: this.user_id,
-        },
-      }
-      this.req.params = { Project_id: this.project_id }
-      this.req.query = { folder_id: this.folder_id }
-      return (this.fs.unlink = sinon.stub())
-    })
-
-    describe('successfully', function () {
-      beforeEach(function () {
-        this.entity = {
-          _id: '1234',
-          type: 'file',
-        }
-        this.FileSystemImportManager.addEntity = sinon
-          .stub()
-          .callsArgWith(6, null, this.entity)
-        return this.ProjectUploadController.uploadFile(this.req, this.res)
-      })
-
-      it('should insert the file', function () {
-        return this.FileSystemImportManager.addEntity
-          .calledWith(
-            this.user_id,
-            this.project_id,
-            this.folder_id,
-            this.name,
-            this.path
-          )
-          .should.equal(true)
-      })
-
-      it('should return a successful response to the FileUploader client', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({
-            success: true,
-            entity_id: this.entity._id,
-            entity_type: 'file',
-          })
-        )
-      })
-
-      it('should time the request', function () {
-        return this.metrics.Timer.prototype.done.called.should.equal(true)
-      })
-
-      it('should remove the uploaded file', function () {
-        return this.fs.unlink.calledWith(this.path).should.equal(true)
-      })
-    })
-
-    describe('with folder structure', function () {
-      beforeEach(function (done) {
-        this.entity = {
-          _id: '1234',
-          type: 'file',
-        }
-        this.FileSystemImportManager.addEntity = sinon
-          .stub()
-          .callsArgWith(6, null, this.entity)
-        this.ProjectLocator.promises.findElement = sinon.stub().resolves({
-          path: { fileSystem: '/test' },
-        })
-        this.EditorController.promises.mkdirp = sinon.stub().resolves({
-          lastFolder: { _id: 'folder-id' },
-        })
-        this.req.body.relativePath = 'foo/bar/' + this.name
-        this.res.json = data => {
-          expect(data.success).to.be.true
-          done()
-        }
-        this.ProjectUploadController.uploadFile(this.req, this.res)
-      })
-
-      it('should insert the file', function () {
-        this.ProjectLocator.promises.findElement.should.be.calledOnceWithExactly(
-          {
-            project_id: this.project_id,
-            element_id: this.folder_id,
-            type: 'folder',
-          }
-        )
-
-        this.EditorController.promises.mkdirp.should.be.calledWith(
-          this.project_id,
-          '/test/foo/bar'
-        )
-
-        this.FileSystemImportManager.addEntity.should.be.calledOnceWith(
-          this.user_id,
-          this.project_id,
-          'folder-id',
-          this.name,
-          this.path
-        )
-      })
-    })
-
-    describe('when FileSystemImportManager.addEntity returns a generic error', function () {
-      beforeEach(function () {
-        this.FileSystemImportManager.addEntity = sinon
-          .stub()
-          .callsArgWith(6, new Error('Sorry something went wrong'))
-        return this.ProjectUploadController.uploadFile(this.req, this.res)
-      })
-
-      it('should return an unsuccessful response to the FileUploader client', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({
-            success: false,
-          })
-        )
-      })
-    })
-
-    describe('when FileSystemImportManager.addEntity returns a too many files error', function () {
-      beforeEach(function () {
-        this.FileSystemImportManager.addEntity = sinon
-          .stub()
-          .callsArgWith(6, new Error('project_has_too_many_files'))
-        return this.ProjectUploadController.uploadFile(this.req, this.res)
-      })
-
-      it('should return an unsuccessful response to the FileUploader client', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({
-            success: false,
-            error: 'project_has_too_many_files',
-          })
-        )
-      })
-    })
-
-    describe('with an invalid filename', function () {
-      beforeEach(function () {
-        this.req.body.name = ''
-        return this.ProjectUploadController.uploadFile(this.req, this.res)
-      })
-
-      it('should return a a non success response', function () {
-        return expect(this.res.body).to.deep.equal(
-          JSON.stringify({
-            success: false,
-            error: 'invalid_filename',
-          })
-        )
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/User/ThirdPartyIdentityManagerTests.js b/services/web/test/unit/src/User/ThirdPartyIdentityManagerTests.js
index d944262518..2dbbf64991 100644
--- a/services/web/test/unit/src/User/ThirdPartyIdentityManagerTests.js
+++ b/services/web/test/unit/src/User/ThirdPartyIdentityManagerTests.js
@@ -2,6 +2,9 @@ const sinon = require('sinon')
 const { expect } = require('chai')
 const SandboxedModule = require('sandboxed-module')
 const OError = require('@overleaf/o-error')
+const {
+  ThirdPartyUserNotFoundError,
+} = require('../../../../app/src/Features/Errors/Errors')
 const modulePath =
   '../../../../app/src/Features/User/ThirdPartyIdentityManager.js'
 
@@ -77,16 +80,19 @@ describe('ThirdPartyIdentityManager', function () {
         expect(user).to.deep.equal(this.user)
       })
     })
-    it('should return ThirdPartyUserNotFoundError when no user linked', function (done) {
-      this.ThirdPartyIdentityManager.getUser(
-        'google',
-        'an-id-not-linked',
-        (error, user) => {
-          expect(error).to.exist
-          expect(error.name).to.equal('ThirdPartyUserNotFoundError')
-          done()
-        }
-      )
+    it('should return ThirdPartyUserNotFoundError when no user linked', async function () {
+      let error
+
+      try {
+        await this.ThirdPartyIdentityManager.promises.getUser(
+          'google',
+          'an-id-not-linked'
+        )
+      } catch (err) {
+        error = err
+      }
+
+      expect(error).to.be.instanceOf(ThirdPartyUserNotFoundError)
     })
   })
   describe('link', function () {
diff --git a/services/web/test/unit/src/User/UserDeleterTests.js b/services/web/test/unit/src/User/UserDeleterTests.js
index 7ffaaede55..0c5e00c0f5 100644
--- a/services/web/test/unit/src/User/UserDeleterTests.js
+++ b/services/web/test/unit/src/User/UserDeleterTests.js
@@ -314,6 +314,15 @@ describe('UserDeleter', function () {
               ).to.have.been.calledWith('securityAlert', emailOptions)
             })
 
+            it('should not email the user with skipEmail === true', async function () {
+              await this.UserDeleter.promises.deleteUser(this.userId, {
+                ipAddress: this.ipAddress,
+                skipEmail: true,
+              })
+              expect(this.EmailHandler.promises.sendEmail).not.to.have.been
+                .called
+            })
+
             it('should fail when the email service fails', async function () {
               this.EmailHandler.promises.sendEmail = sinon
                 .stub()
diff --git a/services/web/test/unit/src/User/UserEmailsControllerTests.js b/services/web/test/unit/src/User/UserEmailsControllerTests.js
index ae94194084..2cd7ad491f 100644
--- a/services/web/test/unit/src/User/UserEmailsControllerTests.js
+++ b/services/web/test/unit/src/User/UserEmailsControllerTests.js
@@ -101,11 +101,6 @@ describe('UserEmailsController', function () {
         '../Analytics/AnalyticsManager': this.AnalyticsManager,
         './UserAuditLogHandler': this.UserAuditLogHandler,
         '../../infrastructure/RateLimiter': this.RateLimiter,
-        '../SplitTests/SplitTestHandler': {
-          promises: {
-            getAssignment: sinon.stub().resolves('default'),
-          },
-        },
       },
     })
   })
@@ -910,7 +905,7 @@ describe('UserEmailsController', function () {
     })
   })
 
-  describe('sendExistingSecondaryEmailConfirmationCode', function () {
+  describe('sendExistingEmailConfirmationCode', function () {
     beforeEach(function () {
       this.email = 'existing-email@example.com'
       this.req.body.email = this.email
@@ -928,7 +923,7 @@ describe('UserEmailsController', function () {
     })
 
     it('should send confirmation code for existing email', async function () {
-      await this.UserEmailsController.sendExistingSecondaryEmailConfirmationCode(
+      await this.UserEmailsController.sendExistingEmailConfirmationCode(
         this.req,
         {
           sendStatus: code => {
@@ -949,7 +944,7 @@ describe('UserEmailsController', function () {
       this.UserEmailsConfirmationHandler.promises.sendConfirmationCode.resolves(
         { confirmCode, confirmCodeExpiresTimestamp }
       )
-      await this.UserEmailsController.sendExistingSecondaryEmailConfirmationCode(
+      await this.UserEmailsController.sendExistingEmailConfirmationCode(
         this.req,
         { sendStatus: sinon.stub() }
       )
@@ -963,7 +958,7 @@ describe('UserEmailsController', function () {
 
     it('should handle invalid email', async function () {
       this.EmailHelper.parseEmail.returns(null)
-      await this.UserEmailsController.sendExistingSecondaryEmailConfirmationCode(
+      await this.UserEmailsController.sendExistingEmailConfirmationCode(
         this.req,
         {
           sendStatus: code => {
@@ -980,7 +975,7 @@ describe('UserEmailsController', function () {
       this.UserGetter.promises.getUserByAnyEmail.resolves({
         _id: 'another-user-id',
       })
-      await this.UserEmailsController.sendExistingSecondaryEmailConfirmationCode(
+      await this.UserEmailsController.sendExistingEmailConfirmationCode(
         this.req,
         {
           sendStatus: code => {
diff --git a/services/web/test/unit/src/User/UserGetterTests.js b/services/web/test/unit/src/User/UserGetterTests.js
index 91df5d8c6d..315a8073d6 100644
--- a/services/web/test/unit/src/User/UserGetterTests.js
+++ b/services/web/test/unit/src/User/UserGetterTests.js
@@ -19,7 +19,7 @@ describe('UserGetter', function () {
   beforeEach(function () {
     const confirmedAt = new Date()
     this.fakeUser = {
-      _id: '12390i',
+      _id: new ObjectId(),
       email: 'email2@foo.bar',
       emails: [
         {
@@ -45,6 +45,10 @@ describe('UserGetter', function () {
     }
     this.getUserAffiliations = sinon.stub().resolves([])
 
+    this.Modules = {
+      promises: { hooks: { fire: sinon.stub().resolves() } },
+    }
+
     this.UserGetter = SandboxedModule.require(modulePath, {
       requires: {
         '../Helpers/Mongo': { normalizeQuery, normalizeMultiQuery },
@@ -63,6 +67,7 @@ describe('UserGetter', function () {
         '../../models/User': {
           User: (this.User = {}),
         },
+        '../../infrastructure/Modules': this.Modules,
       },
     })
   })
@@ -114,6 +119,17 @@ describe('UserGetter', function () {
       })
     })
 
+    it('should not call mongo with empty list', function (done) {
+      const query = []
+      const projection = { email: 1 }
+      this.UserGetter.getUsers(query, projection, (error, users) => {
+        expect(error).to.not.exist
+        expect(users).to.deep.equal([])
+        expect(this.find).to.not.have.been.called
+        done()
+      })
+    })
+
     it('should not allow null query', function (done) {
       this.UserGetter.getUser(null, {}, error => {
         error.should.exist
@@ -1259,4 +1275,56 @@ describe('UserGetter', function () {
       })
     })
   })
+
+  describe('getUserFeatures', function () {
+    beforeEach(function () {
+      this.Modules.promises.hooks.fire = sinon.stub().resolves()
+      this.fakeUser.features = {}
+    })
+
+    it('should return user features', function (done) {
+      this.fakeUser.features = { feature1: true, feature2: false }
+      this.UserGetter.getUserFeatures(new ObjectId(), (error, features) => {
+        expect(error).to.not.exist
+        expect(features).to.deep.equal(this.fakeUser.features)
+        done()
+      })
+    })
+
+    it('should return user features when using promises', async function () {
+      this.fakeUser.features = { feature1: true, feature2: false }
+      const features = await this.UserGetter.promises.getUserFeatures(
+        this.fakeUser._id
+      )
+      expect(features).to.deep.equal(this.fakeUser.features)
+    })
+
+    it('should take into account features overrides from modules', async function () {
+      // this case occurs when the user has bought the ai bundle on WF, which should include our error assistant
+      const bundleFeatures = { aiErrorAssistant: true }
+      this.fakeUser.features = { aiErrorAssistant: false }
+      this.Modules.promises.hooks.fire = sinon.stub().resolves([bundleFeatures])
+      const features = await this.UserGetter.promises.getUserFeatures(
+        this.fakeUser._id
+      )
+      expect(features).to.deep.equal(bundleFeatures)
+      this.Modules.promises.hooks.fire.should.have.been.calledWith(
+        'getModuleProvidedFeatures',
+        this.fakeUser._id
+      )
+    })
+
+    it('should handle modules not returning any features', async function () {
+      this.Modules.promises.hooks.fire = sinon.stub().resolves([])
+      this.fakeUser.features = { test: true }
+      const features = await this.UserGetter.promises.getUserFeatures(
+        this.fakeUser._id
+      )
+      expect(features).to.deep.equal({ test: true })
+      this.Modules.promises.hooks.fire.should.have.been.calledWith(
+        'getModuleProvidedFeatures',
+        this.fakeUser._id
+      )
+    })
+  })
 })
diff --git a/services/web/test/unit/src/User/UserInfoControllerTests.js b/services/web/test/unit/src/User/UserInfoControllerTests.js
index 022dbd2d7f..dd90ac3b00 100644
--- a/services/web/test/unit/src/User/UserInfoControllerTests.js
+++ b/services/web/test/unit/src/User/UserInfoControllerTests.js
@@ -10,7 +10,11 @@ describe('UserInfoController', function () {
   beforeEach(function () {
     this.UserDeleter = { deleteUser: sinon.stub().callsArgWith(1) }
     this.UserUpdater = { updatePersonalInfo: sinon.stub() }
-    this.UserGetter = {}
+    this.UserGetter = {
+      promises: {
+        getUserFeatures: sinon.stub(),
+      },
+    }
 
     this.UserInfoController = SandboxedModule.require(modulePath, {
       requires: {
@@ -148,4 +152,74 @@ describe('UserInfoController', function () {
       })
     })
   })
+
+  describe('getUserFeatures', function () {
+    describe('when the user is logged in', function () {
+      beforeEach(async function () {
+        this.user_id = new ObjectId().toString()
+        this.features = {
+          collaborators: 10,
+          trackChanges: true,
+          references: true,
+        }
+        this.SessionManager.getLoggedInUserId.returns(this.user_id)
+        this.UserGetter.promises.getUserFeatures.resolves(this.features)
+        await this.UserInfoController.getUserFeatures(
+          this.req,
+          this.res,
+          this.next
+        )
+      })
+
+      it('should fetch the user features', function () {
+        expect(this.UserGetter.promises.getUserFeatures.callCount).to.equal(1)
+        expect(
+          this.UserGetter.promises.getUserFeatures.calledWith(this.user_id)
+        ).to.equal(true)
+      })
+
+      it('should return the features as JSON', function () {
+        expect(this.res.json.callCount).to.equal(1)
+        expect(this.res.json.calledWith(this.features)).to.equal(true)
+      })
+    })
+
+    describe('when the user is not logged in', function () {
+      beforeEach(async function () {
+        this.SessionManager.getLoggedInUserId.returns(null)
+        await this.UserInfoController.getUserFeatures(
+          this.req,
+          this.res,
+          this.next
+        )
+      })
+
+      it('should call next with an error', function () {
+        expect(this.next.callCount).to.equal(1)
+        expect(this.next.firstCall.args[0]).to.be.an.instanceof(Error)
+        expect(this.next.firstCall.args[0].message).to.equal(
+          'User is not logged in'
+        )
+      })
+    })
+
+    describe('when fetching features fails', function () {
+      beforeEach(async function () {
+        this.user_id = new ObjectId().toString()
+        this.error = new Error('something went wrong')
+        this.SessionManager.getLoggedInUserId.returns(this.user_id)
+        this.UserGetter.promises.getUserFeatures.rejects(this.error)
+        await this.UserInfoController.getUserFeatures(
+          this.req,
+          this.res,
+          this.next
+        )
+      })
+
+      it('should call next with the error', function () {
+        expect(this.next.callCount).to.equal(1)
+        expect(this.next.firstCall.args[0]).to.equal(this.error)
+      })
+    })
+  })
 })
diff --git a/services/web/test/unit/src/User/UserPagesController.test.mjs b/services/web/test/unit/src/User/UserPagesController.test.mjs
new file mode 100644
index 0000000000..0a05cbfb3c
--- /dev/null
+++ b/services/web/test/unit/src/User/UserPagesController.test.mjs
@@ -0,0 +1,625 @@
+import { expect, vi } from 'vitest'
+import assert from 'assert'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+import MockRequest from '../helpers/MockRequest.js'
+
+const modulePath = '../../../../app/src/Features/User/UserPagesController'
+
+describe('UserPagesController', function () {
+  beforeEach(async function (ctx) {
+    ctx.settings = {
+      apis: {
+        v1: {
+          url: 'some.host',
+          user: 'one',
+          pass: 'two',
+        },
+      },
+    }
+    ctx.user = {
+      _id: (ctx.user_id = 'kwjewkl'),
+      features: {},
+      email: 'joe@example.com',
+      ip_address: '1.1.1.1',
+      session_created: 'timestamp',
+      thirdPartyIdentifiers: [
+        {
+          providerId: 'google',
+          externalUserId: 'testId',
+        },
+      ],
+      refProviders: {
+        mendeley: { encrypted: 'aaaa' },
+        zotero: { encrypted: 'bbbb' },
+        papers: { encrypted: 'cccc' },
+      },
+    }
+    ctx.adminEmail = 'group-admin-email@overleaf.com'
+    ctx.subscriptionViewModel = {
+      memberGroupSubscriptions: [],
+    }
+
+    ctx.UserGetter = {
+      getUser: sinon.stub(),
+      promises: { getUser: sinon.stub() },
+    }
+    ctx.UserSessionsManager = { getAllUserSessions: sinon.stub() }
+    ctx.dropboxStatus = {}
+    ctx.ErrorController = { notFound: sinon.stub() }
+    ctx.SessionManager = {
+      getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+      getSessionUser: sinon.stub().returns(ctx.user),
+    }
+    ctx.NewsletterManager = {
+      subscribed: sinon.stub().yields(),
+    }
+    ctx.AuthenticationController = {
+      getRedirectFromSession: sinon.stub(),
+      setRedirectInSession: sinon.stub(),
+    }
+    ctx.Features = {
+      hasFeature: sinon.stub().returns(false),
+    }
+    ctx.PersonalAccessTokenManager = {
+      listTokens: sinon.stub().returns([]),
+    }
+    ctx.SubscriptionLocator = {
+      promises: {
+        getAdminEmail: sinon.stub().returns(ctx.adminEmail),
+        getMemberSubscriptions: sinon.stub().resolves(),
+      },
+    }
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().returns('default'),
+      },
+    }
+    ctx.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub().resolves(),
+        },
+      },
+    }
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.settings,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserGetter', () => ({
+      default: ctx.UserGetter,
+    }))
+
+    vi.doMock('../../../../app/src/Features/User/UserSessionsManager', () => ({
+      default: ctx.UserSessionsManager,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Newsletter/NewsletterManager',
+      () => ({
+        default: ctx.NewsletterManager,
+      })
+    )
+
+    vi.doMock('../../../../app/src/Features/Errors/ErrorController', () => ({
+      default: ctx.ErrorController,
+    }))
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/AuthenticationController',
+      () => ({
+        default: ctx.AuthenticationController,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/SubscriptionLocator',
+      () => ({
+        default: ctx.SubscriptionLocator,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Features', () => ({
+      default: ctx.Features,
+    }))
+
+    vi.doMock(
+      '../../../../modules/oauth2-server/app/src/OAuthPersonalAccessTokenManager',
+      () => ({
+        default: ctx.PersonalAccessTokenManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock('../../../../app/src/infrastructure/Modules', () => ({
+      default: ctx.Modules,
+    }))
+    ctx.request = sinon.stub()
+    vi.doMock('request', () => ({
+      default: ctx.request,
+    }))
+
+    ctx.UserPagesController = (await import(modulePath)).default
+    ctx.req = new MockRequest()
+    ctx.req.capabilitySet = new Set()
+    ctx.req.session.user = ctx.user
+    ctx.res = new MockResponse()
+  })
+
+  describe('registerPage', function () {
+    it('should render the register page', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/register')
+          resolve()
+        }
+        ctx.UserPagesController.registerPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should set sharedProjectData', async function (ctx) {
+      ctx.req.session.sharedProjectData = {
+        project_name: 'myProject',
+        user_first_name: 'user_first_name_here',
+      }
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedVariables.sharedProjectData.project_name.should.equal(
+            'myProject'
+          )
+          ctx.res.renderedVariables.sharedProjectData.user_first_name.should.equal(
+            'user_first_name_here'
+          )
+          resolve()
+        }
+        ctx.UserPagesController.registerPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should set newTemplateData', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.req.session.templateData = { templateName: 'templateName' }
+
+        ctx.res.callback = () => {
+          ctx.res.renderedVariables.newTemplateData.templateName.should.equal(
+            'templateName'
+          )
+          resolve()
+        }
+        ctx.UserPagesController.registerPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should not set the newTemplateData if there is nothing in the session', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          assert.equal(
+            ctx.res.renderedVariables.newTemplateData.templateName,
+            undefined
+          )
+          resolve()
+        }
+        ctx.UserPagesController.registerPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+  })
+
+  describe('loginForm', function () {
+    it('should render the login page', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/login')
+          resolve()
+        }
+        ctx.UserPagesController.loginPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    describe('when an explicit redirect is set via query string', function () {
+      beforeEach(function (ctx) {
+        ctx.AuthenticationController.getRedirectFromSession = sinon
+          .stub()
+          .returns(null)
+        ctx.AuthenticationController.setRedirectInSession = sinon.stub()
+        ctx.req.query.redir = '/somewhere/in/particular'
+      })
+
+      it('should set a redirect', async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = page => {
+            ctx.AuthenticationController.setRedirectInSession.callCount.should.equal(
+              1
+            )
+            expect(
+              ctx.AuthenticationController.setRedirectInSession.lastCall.args[1]
+            ).to.equal(ctx.req.query.redir)
+            resolve()
+          }
+          ctx.UserPagesController.loginPage(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+    })
+  })
+
+  describe('sessionsPage', function () {
+    beforeEach(function (ctx) {
+      ctx.UserSessionsManager.getAllUserSessions.callsArgWith(2, null, [])
+    })
+
+    it('should render user/sessions', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/sessions')
+          resolve()
+        }
+        ctx.UserPagesController.sessionsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should include current session data in the view', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.res.renderedVariables.currentSession).to.deep.equal({
+            ip_address: '1.1.1.1',
+            session_created: 'timestamp',
+          })
+          resolve()
+        }
+        ctx.UserPagesController.sessionsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should have called getAllUserSessions', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = page => {
+          ctx.UserSessionsManager.getAllUserSessions.callCount.should.equal(1)
+          resolve()
+        }
+        ctx.UserPagesController.sessionsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    describe('when getAllUserSessions produces an error', function () {
+      beforeEach(function (ctx) {
+        ctx.UserSessionsManager.getAllUserSessions.callsArgWith(
+          2,
+          new Error('woops')
+        )
+      })
+
+      it('should call next with an error', async function (ctx) {
+        await new Promise(resolve => {
+          ctx.next = err => {
+            assert(err !== null)
+            assert(err instanceof Error)
+            resolve()
+          }
+          ctx.UserPagesController.sessionsPage(ctx.req, ctx.res, ctx.next)
+        })
+      })
+    })
+  })
+
+  describe('emailPreferencesPage', function () {
+    beforeEach(function (ctx) {
+      ctx.UserGetter.getUser = sinon.stub().yields(null, ctx.user)
+    })
+
+    it('render page with subscribed status', async function (ctx) {
+      ctx.NewsletterManager.subscribed.yields(null, true)
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/email-preferences')
+          ctx.res.renderedVariables.title.should.equal('newsletter_info_title')
+          ctx.res.renderedVariables.subscribed.should.equal(true)
+          resolve()
+        }
+        ctx.UserPagesController.emailPreferencesPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('render page with unsubscribed status', async function (ctx) {
+      ctx.NewsletterManager.subscribed.yields(null, false)
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/email-preferences')
+          ctx.res.renderedVariables.title.should.equal('newsletter_info_title')
+          ctx.res.renderedVariables.subscribed.should.equal(false)
+          resolve()
+        }
+        ctx.UserPagesController.emailPreferencesPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+  })
+
+  describe('settingsPage', function () {
+    beforeEach(function (ctx) {
+      ctx.request.get = sinon
+        .stub()
+        .callsArgWith(1, null, { statusCode: 200 }, { has_password: true })
+      ctx.UserGetter.promises.getUser = sinon.stub().resolves(ctx.user)
+    })
+
+    it('should render user/settings', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedTemplate.should.equal('user/settings')
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should send user', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedVariables.user.id.should.equal(ctx.user._id)
+          ctx.res.renderedVariables.user.email.should.equal(ctx.user.email)
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it("should set 'shouldAllowEditingDetails' to true", async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedVariables.shouldAllowEditingDetails.should.equal(true)
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should restructure thirdPartyIdentifiers data for template use', async function (ctx) {
+      const expectedResult = {
+        google: 'testId',
+      }
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.res.renderedVariables.thirdPartyIds).to.include(
+            expectedResult
+          )
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it("should set and clear 'projectSyncSuccessMessage'", async function (ctx) {
+      ctx.req.session.projectSyncSuccessMessage = 'Some Sync Success'
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          ctx.res.renderedVariables.projectSyncSuccessMessage.should.equal(
+            'Some Sync Success'
+          )
+          expect(ctx.req.session.projectSyncSuccessMessage).to.not.exist
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should cast refProviders to booleans', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(ctx.res.renderedVariables.user.refProviders).to.deep.equal({
+            mendeley: true,
+            papers: true,
+            zotero: true,
+          })
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should send the correct managed user admin email', async function (ctx) {
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(
+            ctx.res.renderedVariables.currentManagedUserAdminEmail
+          ).to.equal(ctx.adminEmail)
+          resolve()
+        }
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    it('should send info for groups with SSO enabled', async function (ctx) {
+      ctx.user.enrollment = {
+        sso: [
+          {
+            groupId: 'abc123abc123',
+            primary: true,
+            linkedAt: new Date(),
+          },
+        ],
+      }
+      const group1 = {
+        _id: 'abc123abc123',
+        teamName: 'Group SSO Rulz',
+        admin_id: {
+          email: 'admin.email@ssolove.com',
+        },
+        linked: true,
+      }
+      const group2 = {
+        _id: 'def456def456',
+        admin_id: {
+          email: 'someone.else@noname.co.uk',
+        },
+        linked: false,
+      }
+
+      ctx.Modules.promises.hooks.fire
+        .withArgs('getUserGroupsSSOEnrollmentStatus')
+        .resolves([[group1, group2]])
+      await new Promise((resolve, reject) => {
+        ctx.res.callback = () => {
+          expect(
+            ctx.res.renderedVariables.memberOfSSOEnabledGroups
+          ).to.deep.equal([
+            {
+              groupId: 'abc123abc123',
+              groupName: 'Group SSO Rulz',
+              adminEmail: 'admin.email@ssolove.com',
+              linked: true,
+            },
+            {
+              groupId: 'def456def456',
+              groupName: undefined,
+              adminEmail: 'someone.else@noname.co.uk',
+              linked: false,
+            },
+          ])
+          resolve()
+        }
+
+        ctx.UserPagesController.settingsPage(
+          ctx.req,
+          ctx.res,
+          ctx.rejectOnError(reject)
+        )
+      })
+    })
+
+    describe('when ldap.updateUserDetailsOnLogin is true', function () {
+      beforeEach(function (ctx) {
+        ctx.settings.ldap = { updateUserDetailsOnLogin: true }
+      })
+
+      afterEach(function (ctx) {
+        delete ctx.settings.ldap
+      })
+
+      it('should set "shouldAllowEditingDetails" to false', async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = () => {
+            ctx.res.renderedVariables.shouldAllowEditingDetails.should.equal(
+              false
+            )
+            resolve()
+          }
+          ctx.UserPagesController.settingsPage(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+    })
+
+    describe('when saml.updateUserDetailsOnLogin is true', function () {
+      beforeEach(function (ctx) {
+        ctx.settings.saml = { updateUserDetailsOnLogin: true }
+      })
+
+      afterEach(function (ctx) {
+        delete ctx.settings.saml
+      })
+
+      it('should set "shouldAllowEditingDetails" to false', async function (ctx) {
+        await new Promise((resolve, reject) => {
+          ctx.res.callback = () => {
+            ctx.res.renderedVariables.shouldAllowEditingDetails.should.equal(
+              false
+            )
+            resolve()
+          }
+          ctx.UserPagesController.settingsPage(
+            ctx.req,
+            ctx.res,
+            ctx.rejectOnError(reject)
+          )
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/User/UserPagesControllerTests.mjs b/services/web/test/unit/src/User/UserPagesControllerTests.mjs
deleted file mode 100644
index 6b19ef03f5..0000000000
--- a/services/web/test/unit/src/User/UserPagesControllerTests.mjs
+++ /dev/null
@@ -1,453 +0,0 @@
-import esmock from 'esmock'
-import assert from 'assert'
-import sinon from 'sinon'
-import { expect } from 'chai'
-import MockResponse from '../helpers/MockResponse.js'
-import MockRequest from '../helpers/MockRequest.js'
-
-const modulePath = new URL(
-  '../../../../app/src/Features/User/UserPagesController',
-  import.meta.url
-).pathname
-
-describe('UserPagesController', function () {
-  beforeEach(async function () {
-    this.settings = {
-      apis: {
-        v1: {
-          url: 'some.host',
-          user: 'one',
-          pass: 'two',
-        },
-      },
-    }
-    this.user = {
-      _id: (this.user_id = 'kwjewkl'),
-      features: {},
-      email: 'joe@example.com',
-      ip_address: '1.1.1.1',
-      session_created: 'timestamp',
-      thirdPartyIdentifiers: [
-        {
-          providerId: 'google',
-          externalUserId: 'testId',
-        },
-      ],
-      refProviders: {
-        mendeley: { encrypted: 'aaaa' },
-        zotero: { encrypted: 'bbbb' },
-        papers: { encrypted: 'cccc' },
-      },
-    }
-    this.adminEmail = 'group-admin-email@overleaf.com'
-    this.subscriptionViewModel = {
-      memberGroupSubscriptions: [],
-    }
-
-    this.UserGetter = {
-      getUser: sinon.stub(),
-      promises: { getUser: sinon.stub() },
-    }
-    this.UserSessionsManager = { getAllUserSessions: sinon.stub() }
-    this.dropboxStatus = {}
-    this.ErrorController = { notFound: sinon.stub() }
-    this.SessionManager = {
-      getLoggedInUserId: sinon.stub().returns(this.user._id),
-      getSessionUser: sinon.stub().returns(this.user),
-    }
-    this.NewsletterManager = {
-      subscribed: sinon.stub().yields(),
-    }
-    this.AuthenticationController = {
-      getRedirectFromSession: sinon.stub(),
-      setRedirectInSession: sinon.stub(),
-    }
-    this.Features = {
-      hasFeature: sinon.stub().returns(false),
-    }
-    this.PersonalAccessTokenManager = {
-      listTokens: sinon.stub().returns([]),
-    }
-    this.SubscriptionLocator = {
-      promises: {
-        getAdminEmail: sinon.stub().returns(this.adminEmail),
-        getMemberSubscriptions: sinon.stub().resolves(),
-      },
-    }
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().returns('default'),
-      },
-    }
-    this.Modules = {
-      promises: {
-        hooks: {
-          fire: sinon.stub().resolves(),
-        },
-      },
-    }
-    this.UserPagesController = await esmock.strict(modulePath, {
-      '@overleaf/settings': this.settings,
-      '../../../../app/src/Features/User/UserGetter': this.UserGetter,
-      '../../../../app/src/Features/User/UserSessionsManager':
-        this.UserSessionsManager,
-      '../../../../app/src/Features/Newsletter/NewsletterManager':
-        this.NewsletterManager,
-      '../../../../app/src/Features/Errors/ErrorController':
-        this.ErrorController,
-      '../../../../app/src/Features/Authentication/AuthenticationController':
-        this.AuthenticationController,
-      '../../../../app/src/Features/Subscription/SubscriptionLocator':
-        this.SubscriptionLocator,
-      '../../../../app/src/infrastructure/Features': this.Features,
-      '../../../../modules/oauth2-server/app/src/OAuthPersonalAccessTokenManager':
-        this.PersonalAccessTokenManager,
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-      '../../../../app/src/infrastructure/Modules': this.Modules,
-      request: (this.request = sinon.stub()),
-    })
-    this.req = new MockRequest()
-    this.req.session.user = this.user
-    this.res = new MockResponse()
-  })
-
-  describe('registerPage', function () {
-    it('should render the register page', function (done) {
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/register')
-        done()
-      }
-      this.UserPagesController.registerPage(this.req, this.res, done)
-    })
-
-    it('should set sharedProjectData', function (done) {
-      this.req.session.sharedProjectData = {
-        project_name: 'myProject',
-        user_first_name: 'user_first_name_here',
-      }
-
-      this.res.callback = () => {
-        this.res.renderedVariables.sharedProjectData.project_name.should.equal(
-          'myProject'
-        )
-        this.res.renderedVariables.sharedProjectData.user_first_name.should.equal(
-          'user_first_name_here'
-        )
-        done()
-      }
-      this.UserPagesController.registerPage(this.req, this.res, done)
-    })
-
-    it('should set newTemplateData', function (done) {
-      this.req.session.templateData = { templateName: 'templateName' }
-
-      this.res.callback = () => {
-        this.res.renderedVariables.newTemplateData.templateName.should.equal(
-          'templateName'
-        )
-        done()
-      }
-      this.UserPagesController.registerPage(this.req, this.res, done)
-    })
-
-    it('should not set the newTemplateData if there is nothing in the session', function (done) {
-      this.res.callback = () => {
-        assert.equal(
-          this.res.renderedVariables.newTemplateData.templateName,
-          undefined
-        )
-        done()
-      }
-      this.UserPagesController.registerPage(this.req, this.res, done)
-    })
-  })
-
-  describe('loginForm', function () {
-    it('should render the login page', function (done) {
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/login')
-        done()
-      }
-      this.UserPagesController.loginPage(this.req, this.res, done)
-    })
-
-    describe('when an explicit redirect is set via query string', function () {
-      beforeEach(function () {
-        this.AuthenticationController.getRedirectFromSession = sinon
-          .stub()
-          .returns(null)
-        this.AuthenticationController.setRedirectInSession = sinon.stub()
-        this.req.query.redir = '/somewhere/in/particular'
-      })
-
-      it('should set a redirect', function (done) {
-        this.res.callback = page => {
-          this.AuthenticationController.setRedirectInSession.callCount.should.equal(
-            1
-          )
-          expect(
-            this.AuthenticationController.setRedirectInSession.lastCall.args[1]
-          ).to.equal(this.req.query.redir)
-          done()
-        }
-        this.UserPagesController.loginPage(this.req, this.res, done)
-      })
-    })
-  })
-
-  describe('sessionsPage', function () {
-    beforeEach(function () {
-      this.UserSessionsManager.getAllUserSessions.callsArgWith(2, null, [])
-    })
-
-    it('should render user/sessions', function (done) {
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/sessions')
-        done()
-      }
-      this.UserPagesController.sessionsPage(this.req, this.res, done)
-    })
-
-    it('should include current session data in the view', function (done) {
-      this.res.callback = () => {
-        expect(this.res.renderedVariables.currentSession).to.deep.equal({
-          ip_address: '1.1.1.1',
-          session_created: 'timestamp',
-        })
-        done()
-      }
-      this.UserPagesController.sessionsPage(this.req, this.res, done)
-    })
-
-    it('should have called getAllUserSessions', function (done) {
-      this.res.callback = page => {
-        this.UserSessionsManager.getAllUserSessions.callCount.should.equal(1)
-        done()
-      }
-      this.UserPagesController.sessionsPage(this.req, this.res, done)
-    })
-
-    describe('when getAllUserSessions produces an error', function () {
-      beforeEach(function () {
-        this.UserSessionsManager.getAllUserSessions.callsArgWith(
-          2,
-          new Error('woops')
-        )
-      })
-
-      it('should call next with an error', function (done) {
-        this.next = err => {
-          assert(err !== null)
-          assert(err instanceof Error)
-          done()
-        }
-        this.UserPagesController.sessionsPage(this.req, this.res, this.next)
-      })
-    })
-  })
-
-  describe('emailPreferencesPage', function () {
-    beforeEach(function () {
-      this.UserGetter.getUser = sinon.stub().yields(null, this.user)
-    })
-
-    it('render page with subscribed status', function (done) {
-      this.NewsletterManager.subscribed.yields(null, true)
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/email-preferences')
-        this.res.renderedVariables.title.should.equal('newsletter_info_title')
-        this.res.renderedVariables.subscribed.should.equal(true)
-        done()
-      }
-      this.UserPagesController.emailPreferencesPage(this.req, this.res, done)
-    })
-
-    it('render page with unsubscribed status', function (done) {
-      this.NewsletterManager.subscribed.yields(null, false)
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/email-preferences')
-        this.res.renderedVariables.title.should.equal('newsletter_info_title')
-        this.res.renderedVariables.subscribed.should.equal(false)
-        done()
-      }
-      this.UserPagesController.emailPreferencesPage(this.req, this.res, done)
-    })
-  })
-
-  describe('settingsPage', function () {
-    beforeEach(function () {
-      this.request.get = sinon
-        .stub()
-        .callsArgWith(1, null, { statusCode: 200 }, { has_password: true })
-      this.UserGetter.promises.getUser = sinon.stub().resolves(this.user)
-    })
-
-    it('should render user/settings', function (done) {
-      this.res.callback = () => {
-        this.res.renderedTemplate.should.equal('user/settings')
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it('should send user', function (done) {
-      this.res.callback = () => {
-        this.res.renderedVariables.user.id.should.equal(this.user._id)
-        this.res.renderedVariables.user.email.should.equal(this.user.email)
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it("should set 'shouldAllowEditingDetails' to true", function (done) {
-      this.res.callback = () => {
-        this.res.renderedVariables.shouldAllowEditingDetails.should.equal(true)
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it('should restructure thirdPartyIdentifiers data for template use', function (done) {
-      const expectedResult = {
-        google: 'testId',
-      }
-      this.res.callback = () => {
-        expect(this.res.renderedVariables.thirdPartyIds).to.include(
-          expectedResult
-        )
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it("should set and clear 'projectSyncSuccessMessage'", function (done) {
-      this.req.session.projectSyncSuccessMessage = 'Some Sync Success'
-      this.res.callback = () => {
-        this.res.renderedVariables.projectSyncSuccessMessage.should.equal(
-          'Some Sync Success'
-        )
-        expect(this.req.session.projectSyncSuccessMessage).to.not.exist
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it('should cast refProviders to booleans', function (done) {
-      this.res.callback = () => {
-        expect(this.res.renderedVariables.user.refProviders).to.deep.equal({
-          mendeley: true,
-          papers: true,
-          zotero: true,
-        })
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it('should send the correct managed user admin email', function (done) {
-      this.res.callback = () => {
-        expect(
-          this.res.renderedVariables.currentManagedUserAdminEmail
-        ).to.equal(this.adminEmail)
-        done()
-      }
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    it('should send info for groups with SSO enabled', function (done) {
-      this.user.enrollment = {
-        sso: [
-          {
-            groupId: 'abc123abc123',
-            primary: true,
-            linkedAt: new Date(),
-          },
-        ],
-      }
-      const group1 = {
-        _id: 'abc123abc123',
-        teamName: 'Group SSO Rulz',
-        admin_id: {
-          email: 'admin.email@ssolove.com',
-        },
-        linked: true,
-      }
-      const group2 = {
-        _id: 'def456def456',
-        admin_id: {
-          email: 'someone.else@noname.co.uk',
-        },
-        linked: false,
-      }
-
-      this.Modules.promises.hooks.fire
-        .withArgs('getUserGroupsSSOEnrollmentStatus')
-        .resolves([[group1, group2]])
-
-      this.res.callback = () => {
-        expect(
-          this.res.renderedVariables.memberOfSSOEnabledGroups
-        ).to.deep.equal([
-          {
-            groupId: 'abc123abc123',
-            groupName: 'Group SSO Rulz',
-            adminEmail: 'admin.email@ssolove.com',
-            linked: true,
-          },
-          {
-            groupId: 'def456def456',
-            groupName: undefined,
-            adminEmail: 'someone.else@noname.co.uk',
-            linked: false,
-          },
-        ])
-        done()
-      }
-
-      this.UserPagesController.settingsPage(this.req, this.res, done)
-    })
-
-    describe('when ldap.updateUserDetailsOnLogin is true', function () {
-      beforeEach(function () {
-        this.settings.ldap = { updateUserDetailsOnLogin: true }
-      })
-
-      afterEach(function () {
-        delete this.settings.ldap
-      })
-
-      it('should set "shouldAllowEditingDetails" to false', function (done) {
-        this.res.callback = () => {
-          this.res.renderedVariables.shouldAllowEditingDetails.should.equal(
-            false
-          )
-          done()
-        }
-        this.UserPagesController.settingsPage(this.req, this.res, done)
-      })
-    })
-
-    describe('when saml.updateUserDetailsOnLogin is true', function () {
-      beforeEach(function () {
-        this.settings.saml = { updateUserDetailsOnLogin: true }
-      })
-
-      afterEach(function () {
-        delete this.settings.saml
-      })
-
-      it('should set "shouldAllowEditingDetails" to false', function (done) {
-        this.res.callback = () => {
-          this.res.renderedVariables.shouldAllowEditingDetails.should.equal(
-            false
-          )
-          done()
-        }
-        this.UserPagesController.settingsPage(this.req, this.res, done)
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/User/UserUpdaterTests.js b/services/web/test/unit/src/User/UserUpdaterTests.js
index 5832bc4656..2803e6d6f2 100644
--- a/services/web/test/unit/src/User/UserUpdaterTests.js
+++ b/services/web/test/unit/src/User/UserUpdaterTests.js
@@ -59,11 +59,6 @@ describe('UserUpdater', function () {
         changeEmail: sinon.stub().resolves(),
       },
     }
-    this.RecurlyWrapper = {
-      promises: {
-        updateAccountEmailAddress: sinon.stub().resolves(),
-      },
-    }
     this.AnalyticsManager = {
       recordEventForUserInBackground: sinon.stub(),
     }
@@ -264,9 +259,11 @@ describe('UserUpdater', function () {
       expect(
         this.NewsletterManager.promises.changeEmail
       ).to.have.been.calledWith(this.user, this.newEmail)
-      expect(
-        this.RecurlyWrapper.promises.updateAccountEmailAddress
-      ).to.have.been.calledWith(this.user._id, this.newEmail)
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'updateAccountEmailAddress',
+        this.user._id,
+        this.newEmail
+      )
     })
 
     it('validates email', async function () {
@@ -615,9 +612,11 @@ describe('UserUpdater', function () {
       expect(
         this.NewsletterManager.promises.changeEmail
       ).to.have.been.calledWith(this.user, this.newEmail)
-      expect(
-        this.RecurlyWrapper.promises.updateAccountEmailAddress
-      ).to.have.been.calledWith(this.user._id, this.newEmail)
+      expect(this.Modules.promises.hooks.fire).to.have.been.calledWith(
+        'updateAccountEmailAddress',
+        this.user._id,
+        this.newEmail
+      )
     })
 
     it('handles Mongo errors', async function () {
diff --git a/services/web/test/unit/src/UserMembership/UserMembershipController.test.mjs b/services/web/test/unit/src/UserMembership/UserMembershipController.test.mjs
new file mode 100644
index 0000000000..1726b2a41b
--- /dev/null
+++ b/services/web/test/unit/src/UserMembership/UserMembershipController.test.mjs
@@ -0,0 +1,561 @@
+import { expect, vi } from 'vitest'
+import sinon from 'sinon'
+import MockRequest from '../helpers/MockRequest.js'
+import MockResponse from '../helpers/MockResponse.js'
+import EntityConfigs from '../../../../app/src/Features/UserMembership/UserMembershipEntityConfigs.js'
+import Errors from '../../../../app/src/Features/Errors/Errors.js'
+import {
+  UserIsManagerError,
+  UserNotFoundError,
+  UserAlreadyAddedError,
+} from '../../../../app/src/Features/UserMembership/UserMembershipErrors.js'
+const assertCalledWith = sinon.assert.calledWith
+
+const modulePath =
+  '../../../../app/src/Features/UserMembership/UserMembershipController.mjs'
+
+vi.mock(
+  '../../../../app/src/Features/UserMembership/UserMembershipErrors.js',
+  () =>
+    vi.importActual(
+      '../../../../app/src/Features/UserMembership/UserMembershipErrors.js'
+    )
+)
+
+vi.mock('../../../../app/src/Features/Errors/Errors.js', () =>
+  vi.importActual('../../../../app/src/Features/Errors/Errors.js')
+)
+
+describe('UserMembershipController', function () {
+  beforeEach(async function (ctx) {
+    ctx.req = new MockRequest()
+    ctx.req.params.id = 'mock-entity-id'
+    ctx.user = { _id: 'mock-user-id' }
+    ctx.newUser = { _id: 'mock-new-user-id', email: 'new-user-email@foo.bar' }
+    ctx.subscription = {
+      _id: 'mock-subscription-id',
+      admin_id: 'mock-admin-id',
+      fetchV1Data: callback => callback(null, ctx.subscription),
+    }
+    ctx.institution = {
+      _id: 'mock-institution-id',
+      v1Id: 123,
+      fetchV1Data: callback => {
+        const institution = Object.assign({}, ctx.institution)
+        institution.name = 'Test Institution Name'
+        callback(null, institution)
+      },
+    }
+    ctx.users = [
+      {
+        _id: 'mock-member-id-1',
+        email: 'mock-email-1@foo.com',
+        last_logged_in_at: '2020-08-09T12:43:11.467Z',
+        last_active_at: '2021-08-09T12:43:11.467Z',
+      },
+      {
+        _id: 'mock-member-id-2',
+        email: 'mock-email-2@foo.com',
+        last_logged_in_at: '2020-05-20T10:41:11.407Z',
+        last_active_at: '2021-05-20T10:41:11.407Z',
+      },
+      {
+        _id: 'mock-member-id-3',
+        email: 'mock-email-3@foo.com',
+        last_logged_in_at: '2021-08-10T10:41:11.407Z',
+        last_active_at: '2021-08-20T10:41:11.407Z',
+        enrollment: {
+          managedBy: 'some-other-subscription-id',
+          enrolledAt: '2021-05-20T10:41:11.407Z',
+          sso: undefined,
+        },
+      },
+      {
+        _id: 'mock-member-id-4',
+        email: 'mock-email-4@foo.com',
+        last_logged_in_at: '2021-01-01T10:41:11.407Z',
+        last_active_at: '2021-01-02T10:41:11.407Z',
+        enrollment: {
+          managedBy: 'mock-subscription-id',
+          enrolledAt: '2021-01-02T10:41:11.407Z',
+          sso: undefined,
+        },
+      },
+      {
+        _id: 'mock-member-id-5',
+        email: 'mock-email-5@foo.com',
+        last_logged_in_at: '2023-01-01T10:41:11.407Z',
+        last_active_at: '2023-01-02T10:41:11.407Z',
+        enrollment: {
+          sso: [{ groupId: ctx.subscription._id }],
+        },
+      },
+      {
+        _id: 'mock-member-id-6',
+        email: 'mock-email-6@foo.com',
+        last_logged_in_at: '2024-01-01T10:41:11.407Z',
+        last_active_at: '2024-01-02T10:41:11.407Z',
+        enrollment: {
+          managedBy: 'mock-subscription-id',
+          enrolledAt: '2024-01-02T10:41:11.407Z',
+          sso: [{ groupId: ctx.subscription._id }],
+        },
+      },
+    ]
+
+    ctx.Settings = {
+      managedUsers: {
+        enabled: false,
+      },
+    }
+
+    ctx.SessionManager = {
+      getSessionUser: sinon.stub().returns(ctx.user),
+      getLoggedInUserId: sinon.stub().returns(ctx.user._id),
+    }
+    ctx.SSOConfig = {
+      findById: sinon
+        .stub()
+        .returns({ exec: sinon.stub().resolves({ enabled: true }) }),
+    }
+    ctx.UserMembershipHandler = {
+      getEntity: sinon.stub().yields(null, ctx.subscription),
+      createEntity: sinon.stub().yields(null, ctx.institution),
+      getUsers: sinon.stub().yields(null, ctx.users),
+      addUser: sinon.stub().yields(null, ctx.newUser),
+      removeUser: sinon.stub().yields(null),
+      promises: {
+        getUsers: sinon.stub().resolves(ctx.users),
+      },
+    }
+    ctx.SplitTestHandler = {
+      promises: {
+        getAssignment: sinon.stub().resolves({ variant: 'default' }),
+      },
+      getAssignment: sinon.stub().yields(null, { variant: 'default' }),
+    }
+    ctx.RecurlyClient = {
+      promises: {
+        getSubscription: sinon.stub().resolves({}),
+      },
+    }
+
+    vi.doMock(
+      '../../../../app/src/Features/UserMembership/UserMembershipErrors',
+      () => ({
+        UserIsManagerError,
+        UserNotFoundError,
+        UserAlreadyAddedError,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Authentication/SessionManager',
+      () => ({
+        default: ctx.SessionManager,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/SplitTests/SplitTestHandler',
+      () => ({
+        default: ctx.SplitTestHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/UserMembership/UserMembershipHandler',
+      () => ({
+        default: ctx.UserMembershipHandler,
+      })
+    )
+
+    vi.doMock(
+      '../../../../app/src/Features/Subscription/RecurlyClient',
+      () => ({
+        default: ctx.RecurlyClient,
+      })
+    )
+
+    vi.doMock('@overleaf/settings', () => ({
+      default: ctx.Settings,
+    }))
+
+    vi.doMock('../../../../app/src/models/SSOConfig', () => ({
+      SSOConfig: ctx.SSOConfig,
+    }))
+
+    ctx.Modules = {
+      promises: {
+        hooks: {
+          fire: sinon.stub(),
+        },
+      },
+    }
+    vi.doMock('../../../../app/src/infrastructure/Modules.js', () => ({
+      default: ctx.Modules,
+    }))
+
+    ctx.UserMembershipController = (await import(modulePath)).default
+  })
+
+  describe('index', function () {
+    beforeEach(function (ctx) {
+      ctx.req.entity = ctx.subscription
+      ctx.req.entityConfig = EntityConfigs.group
+    })
+
+    it('get users', async function (ctx) {
+      await ctx.UserMembershipController.manageGroupMembers(ctx.req, {
+        render: () => {
+          sinon.assert.calledWithMatch(
+            ctx.UserMembershipHandler.promises.getUsers,
+            ctx.subscription,
+            { modelName: 'Subscription' }
+          )
+        },
+      })
+    })
+
+    it('render group view', async function (ctx) {
+      ctx.subscription.managedUsersEnabled = false
+      await ctx.UserMembershipController.manageGroupMembers(ctx.req, {
+        render: (viewPath, viewParams) => {
+          expect(viewPath).to.equal('user_membership/group-members-react')
+          expect(viewParams.users).to.deep.equal(ctx.users)
+          expect(viewParams.groupSize).to.equal(ctx.subscription.membersLimit)
+          expect(viewParams.managedUsersActive).to.equal(false)
+        },
+      })
+    })
+
+    it('render group view with managed users', async function (ctx) {
+      ctx.subscription.managedUsersEnabled = true
+      await ctx.UserMembershipController.manageGroupMembers(ctx.req, {
+        render: (viewPath, viewParams) => {
+          expect(viewPath).to.equal('user_membership/group-members-react')
+          expect(viewParams.users).to.deep.equal(ctx.users)
+          expect(viewParams.groupSize).to.equal(ctx.subscription.membersLimit)
+          expect(viewParams.managedUsersActive).to.equal(true)
+          expect(viewParams.isUserGroupManager).to.equal(false)
+        },
+      })
+    })
+
+    it('render group managers view', async function (ctx) {
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+      await ctx.UserMembershipController.manageGroupManagers(ctx.req, {
+        render: (viewPath, viewParams) => {
+          expect(viewPath).to.equal('user_membership/group-managers-react')
+          expect(viewParams.groupSize).to.equal(undefined)
+        },
+      })
+    })
+
+    it('render institution view', async function (ctx) {
+      ctx.req.entity = ctx.institution
+      ctx.req.entityConfig = EntityConfigs.institution
+      await ctx.UserMembershipController.manageInstitutionManagers(ctx.req, {
+        render: (viewPath, viewParams) => {
+          expect(viewPath).to.equal(
+            'user_membership/institution-managers-react'
+          )
+          expect(viewParams.name).to.equal('Test Institution Name')
+          expect(viewParams.groupSize).to.equal(undefined)
+        },
+      })
+    })
+  })
+
+  describe('add', function () {
+    beforeEach(function (ctx) {
+      ctx.req.body.email = ctx.newUser.email
+      ctx.req.entity = ctx.subscription
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+    })
+
+    it('add user', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipController.add(ctx.req, {
+          json: () => {
+            sinon.assert.calledWithMatch(
+              ctx.UserMembershipHandler.addUser,
+              ctx.subscription,
+              { modelName: 'Subscription' },
+              ctx.newUser.email
+            )
+            resolve()
+          },
+        })
+      })
+    })
+
+    it('return user object', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipController.add(ctx.req, {
+          json: payload => {
+            payload.user.should.equal(ctx.newUser)
+            resolve()
+          },
+        })
+      })
+    })
+
+    it('handle readOnly entity', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.entityConfig = EntityConfigs.group
+        ctx.UserMembershipController.add(ctx.req, null, error => {
+          expect(error).to.exist
+          expect(error).to.be.an.instanceof(Errors.NotFoundError)
+          resolve()
+        })
+      })
+    })
+
+    it('handle user already added', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipHandler.addUser.yields(new UserAlreadyAddedError())
+        ctx.UserMembershipController.add(ctx.req, {
+          status: () => ({
+            json: payload => {
+              expect(payload.error.code).to.equal('user_already_added')
+              resolve()
+            },
+          }),
+        })
+      })
+    })
+
+    it('handle user not found', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipHandler.addUser.yields(new UserNotFoundError())
+        ctx.UserMembershipController.add(ctx.req, {
+          status: () => ({
+            json: payload => {
+              expect(payload.error.code).to.equal('user_not_found')
+              resolve()
+            },
+          }),
+        })
+      })
+    })
+
+    it('handle invalid email', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.body.email = 'not_valid_email'
+        ctx.UserMembershipController.add(ctx.req, {
+          status: () => ({
+            json: payload => {
+              expect(payload.error.code).to.equal('invalid_email')
+              resolve()
+            },
+          }),
+        })
+      })
+    })
+  })
+
+  describe('remove', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params.userId = ctx.newUser._id
+      ctx.req.entity = ctx.subscription
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+    })
+
+    it('remove user', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipController.remove(ctx.req, {
+          sendStatus: () => {
+            sinon.assert.calledWithMatch(
+              ctx.UserMembershipHandler.removeUser,
+              ctx.subscription,
+              { modelName: 'Subscription' },
+              ctx.newUser._id
+            )
+            resolve()
+          },
+        })
+      })
+    })
+
+    it('handle readOnly entity', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.entityConfig = EntityConfigs.group
+        ctx.UserMembershipController.remove(ctx.req, null, error => {
+          expect(error).to.exist
+          expect(error).to.be.an.instanceof(Errors.NotFoundError)
+          resolve()
+        })
+      })
+    })
+
+    it('prevent self removal', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.req.params.userId = ctx.user._id
+        ctx.UserMembershipController.remove(ctx.req, {
+          status: () => ({
+            json: payload => {
+              expect(payload.error.code).to.equal('managers_cannot_remove_self')
+              resolve()
+            },
+          }),
+        })
+      })
+    })
+
+    it('prevent admin removal', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipHandler.removeUser.yields(new UserIsManagerError())
+        ctx.UserMembershipController.remove(ctx.req, {
+          status: () => ({
+            json: payload => {
+              expect(payload.error.code).to.equal(
+                'managers_cannot_remove_admin'
+              )
+              resolve()
+            },
+          }),
+        })
+      })
+    })
+  })
+
+  describe('exportCsv', function () {
+    beforeEach(function (ctx) {
+      ctx.req.entity = ctx.subscription
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+      ctx.res = new MockResponse()
+      ctx.UserMembershipController.exportCsv(ctx.req, ctx.res)
+    })
+
+    it('get users', function (ctx) {
+      sinon.assert.calledWithMatch(
+        ctx.UserMembershipHandler.promises.getUsers,
+        ctx.subscription,
+        { modelName: 'Subscription' }
+      )
+    })
+
+    it('should set the correct content type on the request', function (ctx) {
+      assertCalledWith(ctx.res.contentType, 'text/csv; charset=utf-8')
+    })
+
+    it('should name the exported csv file', function (ctx) {
+      assertCalledWith(
+        ctx.res.header,
+        'Content-Disposition',
+        'attachment; filename="Group.csv"'
+      )
+    })
+
+    it('should export the correct csv', function (ctx) {
+      assertCalledWith(
+        ctx.res.send,
+        '"email","last_logged_in_at","last_active_at"\n"mock-email-1@foo.com","2020-08-09T12:43:11.467Z","2021-08-09T12:43:11.467Z"\n"mock-email-2@foo.com","2020-05-20T10:41:11.407Z","2021-05-20T10:41:11.407Z"\n"mock-email-3@foo.com","2021-08-10T10:41:11.407Z","2021-08-20T10:41:11.407Z"\n"mock-email-4@foo.com","2021-01-01T10:41:11.407Z","2021-01-02T10:41:11.407Z"\n"mock-email-5@foo.com","2023-01-01T10:41:11.407Z","2023-01-02T10:41:11.407Z"\n"mock-email-6@foo.com","2024-01-01T10:41:11.407Z","2024-01-02T10:41:11.407Z"'
+      )
+    })
+  })
+
+  describe('exportCsv when group is managed', function () {
+    beforeEach(function (ctx) {
+      ctx.req.entity = Object.assign(
+        { managedUsersEnabled: true },
+        ctx.subscription
+      )
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+      ctx.res = new MockResponse()
+      ctx.UserMembershipController.exportCsv(ctx.req, ctx.res)
+    })
+
+    it('should export the correct csv', function (ctx) {
+      assertCalledWith(
+        ctx.res.send,
+        '"email","last_logged_in_at","last_active_at","managed"\n"mock-email-1@foo.com","2020-08-09T12:43:11.467Z","2021-08-09T12:43:11.467Z",false\n"mock-email-2@foo.com","2020-05-20T10:41:11.407Z","2021-05-20T10:41:11.407Z",false\n"mock-email-3@foo.com","2021-08-10T10:41:11.407Z","2021-08-20T10:41:11.407Z",false\n"mock-email-4@foo.com","2021-01-01T10:41:11.407Z","2021-01-02T10:41:11.407Z",true\n"mock-email-5@foo.com","2023-01-01T10:41:11.407Z","2023-01-02T10:41:11.407Z",false\n"mock-email-6@foo.com","2024-01-01T10:41:11.407Z","2024-01-02T10:41:11.407Z",true'
+      )
+    })
+  })
+
+  describe('exportCsv when group has SSO', function () {
+    beforeEach(function (ctx) {
+      ctx.req.entity = Object.assign(
+        { ssoConfig: 'sso-config-id' },
+        ctx.subscription
+      )
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+      ctx.Modules.promises.hooks.fire.resolves([true])
+      ctx.res = new MockResponse()
+      ctx.UserMembershipController.exportCsv(ctx.req, ctx.res)
+    })
+
+    it('should export the correct csv', function (ctx) {
+      assertCalledWith(
+        ctx.res.send,
+        '"email","last_logged_in_at","last_active_at","sso"\n"mock-email-1@foo.com","2020-08-09T12:43:11.467Z","2021-08-09T12:43:11.467Z",false\n"mock-email-2@foo.com","2020-05-20T10:41:11.407Z","2021-05-20T10:41:11.407Z",false\n"mock-email-3@foo.com","2021-08-10T10:41:11.407Z","2021-08-20T10:41:11.407Z",false\n"mock-email-4@foo.com","2021-01-01T10:41:11.407Z","2021-01-02T10:41:11.407Z",false\n"mock-email-5@foo.com","2023-01-01T10:41:11.407Z","2023-01-02T10:41:11.407Z",true\n"mock-email-6@foo.com","2024-01-01T10:41:11.407Z","2024-01-02T10:41:11.407Z",true'
+      )
+    })
+  })
+
+  describe('exportCsv when group has SSO and managed users enabled', function () {
+    beforeEach(function (ctx) {
+      ctx.req.entity = Object.assign(
+        { managedUsersEnabled: true },
+        { ssoConfig: 'sso-config-id' },
+        ctx.subscription
+      )
+      ctx.req.entityConfig = EntityConfigs.groupManagers
+      ctx.Modules.promises.hooks.fire.resolves([true])
+      ctx.res = new MockResponse()
+      ctx.UserMembershipController.exportCsv(ctx.req, ctx.res)
+    })
+
+    it('should export the correct csv', function (ctx) {
+      assertCalledWith(
+        ctx.res.send,
+        '"email","last_logged_in_at","last_active_at","managed","sso"\n"mock-email-1@foo.com","2020-08-09T12:43:11.467Z","2021-08-09T12:43:11.467Z",false,false\n"mock-email-2@foo.com","2020-05-20T10:41:11.407Z","2021-05-20T10:41:11.407Z",false,false\n"mock-email-3@foo.com","2021-08-10T10:41:11.407Z","2021-08-20T10:41:11.407Z",false,false\n"mock-email-4@foo.com","2021-01-01T10:41:11.407Z","2021-01-02T10:41:11.407Z",true,false\n"mock-email-5@foo.com","2023-01-01T10:41:11.407Z","2023-01-02T10:41:11.407Z",false,true\n"mock-email-6@foo.com","2024-01-01T10:41:11.407Z","2024-01-02T10:41:11.407Z",true,true'
+      )
+    })
+  })
+
+  describe('new', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params.name = 'publisher'
+      ctx.req.params.id = 'abc'
+    })
+
+    it('renders view', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipController.new(ctx.req, {
+          render: (viewPath, data) => {
+            expect(data.entityName).to.eq('publisher')
+            expect(data.entityId).to.eq('abc')
+            resolve()
+          },
+        })
+      })
+    })
+  })
+
+  describe('create', function () {
+    beforeEach(function (ctx) {
+      ctx.req.params.name = 'institution'
+      ctx.req.entityConfig = EntityConfigs.institution
+      ctx.req.params.id = 123
+    })
+
+    it('creates institution', async function (ctx) {
+      await new Promise(resolve => {
+        ctx.UserMembershipController.create(ctx.req, {
+          redirect: path => {
+            expect(path).to.eq(EntityConfigs.institution.pathsFor(123).index)
+            sinon.assert.calledWithMatch(
+              ctx.UserMembershipHandler.createEntity,
+              123,
+              { modelName: 'Institution' }
+            )
+            resolve()
+          },
+        })
+      })
+    })
+  })
+})
diff --git a/services/web/test/unit/src/UserMembership/UserMembershipControllerTests.mjs b/services/web/test/unit/src/UserMembership/UserMembershipControllerTests.mjs
deleted file mode 100644
index f6dedf2097..0000000000
--- a/services/web/test/unit/src/UserMembership/UserMembershipControllerTests.mjs
+++ /dev/null
@@ -1,380 +0,0 @@
-import sinon from 'sinon'
-import { expect } from 'chai'
-import esmock from 'esmock'
-import MockRequest from '../helpers/MockRequest.js'
-import MockResponse from '../helpers/MockResponse.js'
-import EntityConfigs from '../../../../app/src/Features/UserMembership/UserMembershipEntityConfigs.js'
-import Errors from '../../../../app/src/Features/Errors/Errors.js'
-import {
-  UserIsManagerError,
-  UserNotFoundError,
-  UserAlreadyAddedError,
-} from '../../../../app/src/Features/UserMembership/UserMembershipErrors.js'
-const assertCalledWith = sinon.assert.calledWith
-
-const modulePath =
-  '../../../../app/src/Features/UserMembership/UserMembershipController.mjs'
-
-describe('UserMembershipController', function () {
-  beforeEach(async function () {
-    this.req = new MockRequest()
-    this.req.params.id = 'mock-entity-id'
-    this.user = { _id: 'mock-user-id' }
-    this.newUser = { _id: 'mock-new-user-id', email: 'new-user-email@foo.bar' }
-    this.subscription = {
-      _id: 'mock-subscription-id',
-      admin_id: 'mock-admin-id',
-      fetchV1Data: callback => callback(null, this.subscription),
-    }
-    this.institution = {
-      _id: 'mock-institution-id',
-      v1Id: 123,
-      fetchV1Data: callback => {
-        const institution = Object.assign({}, this.institution)
-        institution.name = 'Test Institution Name'
-        callback(null, institution)
-      },
-    }
-    this.users = [
-      {
-        _id: 'mock-member-id-1',
-        email: 'mock-email-1@foo.com',
-        last_logged_in_at: '2020-08-09T12:43:11.467Z',
-        last_active_at: '2021-08-09T12:43:11.467Z',
-      },
-      {
-        _id: 'mock-member-id-2',
-        email: 'mock-email-2@foo.com',
-        last_logged_in_at: '2020-05-20T10:41:11.407Z',
-        last_active_at: '2021-05-20T10:41:11.407Z',
-      },
-    ]
-
-    this.Settings = {
-      managedUsers: {
-        enabled: false,
-      },
-    }
-
-    this.SessionManager = {
-      getSessionUser: sinon.stub().returns(this.user),
-      getLoggedInUserId: sinon.stub().returns(this.user._id),
-    }
-    this.SSOConfig = {
-      findById: sinon
-        .stub()
-        .returns({ exec: sinon.stub().resolves({ enabled: true }) }),
-    }
-    this.UserMembershipHandler = {
-      getEntity: sinon.stub().yields(null, this.subscription),
-      createEntity: sinon.stub().yields(null, this.institution),
-      getUsers: sinon.stub().yields(null, this.users),
-      addUser: sinon.stub().yields(null, this.newUser),
-      removeUser: sinon.stub().yields(null),
-      promises: {
-        getUsers: sinon.stub().resolves(this.users),
-      },
-    }
-    this.SplitTestHandler = {
-      promises: {
-        getAssignment: sinon.stub().resolves({ variant: 'default' }),
-      },
-      getAssignment: sinon.stub().yields(null, { variant: 'default' }),
-    }
-    this.RecurlyClient = {
-      promises: {
-        getSubscription: sinon.stub().resolves({}),
-      },
-    }
-    this.UserMembershipController = await esmock.strict(modulePath, {
-      '../../../../app/src/Features/UserMembership/UserMembershipErrors': {
-        UserIsManagerError,
-        UserNotFoundError,
-        UserAlreadyAddedError,
-      },
-      '../../../../app/src/Features/Authentication/SessionManager':
-        this.SessionManager,
-      '../../../../app/src/Features/SplitTests/SplitTestHandler':
-        this.SplitTestHandler,
-      '../../../../app/src/Features/UserMembership/UserMembershipHandler':
-        this.UserMembershipHandler,
-      '../../../../app/src/Features/Subscription/RecurlyClient':
-        this.RecurlyClient,
-      '@overleaf/settings': this.Settings,
-      '../../../../app/src/models/SSOConfig': { SSOConfig: this.SSOConfig },
-    })
-  })
-
-  describe('index', function () {
-    beforeEach(function () {
-      this.req.entity = this.subscription
-      this.req.entityConfig = EntityConfigs.group
-    })
-
-    it('get users', async function () {
-      await this.UserMembershipController.manageGroupMembers(this.req, {
-        render: () => {
-          sinon.assert.calledWithMatch(
-            this.UserMembershipHandler.promises.getUsers,
-            this.subscription,
-            { modelName: 'Subscription' }
-          )
-        },
-      })
-    })
-
-    it('render group view', async function () {
-      this.subscription.managedUsersEnabled = false
-      await this.UserMembershipController.manageGroupMembers(this.req, {
-        render: (viewPath, viewParams) => {
-          expect(viewPath).to.equal('user_membership/group-members-react')
-          expect(viewParams.users).to.deep.equal(this.users)
-          expect(viewParams.groupSize).to.equal(this.subscription.membersLimit)
-          expect(viewParams.managedUsersActive).to.equal(false)
-        },
-      })
-    })
-
-    it('render group view with managed users', async function () {
-      this.subscription.managedUsersEnabled = true
-      await this.UserMembershipController.manageGroupMembers(this.req, {
-        render: (viewPath, viewParams) => {
-          expect(viewPath).to.equal('user_membership/group-members-react')
-          expect(viewParams.users).to.deep.equal(this.users)
-          expect(viewParams.groupSize).to.equal(this.subscription.membersLimit)
-          expect(viewParams.managedUsersActive).to.equal(true)
-        },
-      })
-    })
-
-    it('render group managers view', async function () {
-      this.req.entityConfig = EntityConfigs.groupManagers
-      await this.UserMembershipController.manageGroupManagers(this.req, {
-        render: (viewPath, viewParams) => {
-          expect(viewPath).to.equal('user_membership/group-managers-react')
-          expect(viewParams.groupSize).to.equal(undefined)
-        },
-      })
-    })
-
-    it('render institution view', async function () {
-      this.req.entity = this.institution
-      this.req.entityConfig = EntityConfigs.institution
-      await this.UserMembershipController.manageInstitutionManagers(this.req, {
-        render: (viewPath, viewParams) => {
-          expect(viewPath).to.equal(
-            'user_membership/institution-managers-react'
-          )
-          expect(viewParams.name).to.equal('Test Institution Name')
-          expect(viewParams.groupSize).to.equal(undefined)
-        },
-      })
-    })
-  })
-
-  describe('add', function () {
-    beforeEach(function () {
-      this.req.body.email = this.newUser.email
-      this.req.entity = this.subscription
-      this.req.entityConfig = EntityConfigs.groupManagers
-    })
-
-    it('add user', function (done) {
-      this.UserMembershipController.add(this.req, {
-        json: () => {
-          sinon.assert.calledWithMatch(
-            this.UserMembershipHandler.addUser,
-            this.subscription,
-            { modelName: 'Subscription' },
-            this.newUser.email
-          )
-          done()
-        },
-      })
-    })
-
-    it('return user object', function (done) {
-      this.UserMembershipController.add(this.req, {
-        json: payload => {
-          payload.user.should.equal(this.newUser)
-          done()
-        },
-      })
-    })
-
-    it('handle readOnly entity', function (done) {
-      this.req.entityConfig = EntityConfigs.group
-      this.UserMembershipController.add(this.req, null, error => {
-        expect(error).to.exist
-        expect(error).to.be.an.instanceof(Errors.NotFoundError)
-        done()
-      })
-    })
-
-    it('handle user already added', function (done) {
-      this.UserMembershipHandler.addUser.yields(new UserAlreadyAddedError())
-      this.UserMembershipController.add(this.req, {
-        status: () => ({
-          json: payload => {
-            expect(payload.error.code).to.equal('user_already_added')
-            done()
-          },
-        }),
-      })
-    })
-
-    it('handle user not found', function (done) {
-      this.UserMembershipHandler.addUser.yields(new UserNotFoundError())
-      this.UserMembershipController.add(this.req, {
-        status: () => ({
-          json: payload => {
-            expect(payload.error.code).to.equal('user_not_found')
-            done()
-          },
-        }),
-      })
-    })
-
-    it('handle invalid email', function (done) {
-      this.req.body.email = 'not_valid_email'
-      this.UserMembershipController.add(this.req, {
-        status: () => ({
-          json: payload => {
-            expect(payload.error.code).to.equal('invalid_email')
-            done()
-          },
-        }),
-      })
-    })
-  })
-
-  describe('remove', function () {
-    beforeEach(function () {
-      this.req.params.userId = this.newUser._id
-      this.req.entity = this.subscription
-      this.req.entityConfig = EntityConfigs.groupManagers
-    })
-
-    it('remove user', function (done) {
-      this.UserMembershipController.remove(this.req, {
-        sendStatus: () => {
-          sinon.assert.calledWithMatch(
-            this.UserMembershipHandler.removeUser,
-            this.subscription,
-            { modelName: 'Subscription' },
-            this.newUser._id
-          )
-          done()
-        },
-      })
-    })
-
-    it('handle readOnly entity', function (done) {
-      this.req.entityConfig = EntityConfigs.group
-      this.UserMembershipController.remove(this.req, null, error => {
-        expect(error).to.exist
-        expect(error).to.be.an.instanceof(Errors.NotFoundError)
-        done()
-      })
-    })
-
-    it('prevent self removal', function (done) {
-      this.req.params.userId = this.user._id
-      this.UserMembershipController.remove(this.req, {
-        status: () => ({
-          json: payload => {
-            expect(payload.error.code).to.equal('managers_cannot_remove_self')
-            done()
-          },
-        }),
-      })
-    })
-
-    it('prevent admin removal', function (done) {
-      this.UserMembershipHandler.removeUser.yields(new UserIsManagerError())
-      this.UserMembershipController.remove(this.req, {
-        status: () => ({
-          json: payload => {
-            expect(payload.error.code).to.equal('managers_cannot_remove_admin')
-            done()
-          },
-        }),
-      })
-    })
-  })
-
-  describe('exportCsv', function () {
-    beforeEach(function () {
-      this.req.entity = this.subscription
-      this.req.entityConfig = EntityConfigs.groupManagers
-      this.res = new MockResponse()
-      this.UserMembershipController.exportCsv(this.req, this.res)
-    })
-
-    it('get users', function () {
-      sinon.assert.calledWithMatch(
-        this.UserMembershipHandler.getUsers,
-        this.subscription,
-        { modelName: 'Subscription' }
-      )
-    })
-
-    it('should set the correct content type on the request', function () {
-      assertCalledWith(this.res.contentType, 'text/csv; charset=utf-8')
-    })
-
-    it('should name the exported csv file', function () {
-      assertCalledWith(
-        this.res.header,
-        'Content-Disposition',
-        'attachment; filename="Group.csv"'
-      )
-    })
-
-    it('should export the correct csv', function () {
-      assertCalledWith(
-        this.res.send,
-        '"email","last_logged_in_at","last_active_at"\n"mock-email-1@foo.com","2020-08-09T12:43:11.467Z","2021-08-09T12:43:11.467Z"\n"mock-email-2@foo.com","2020-05-20T10:41:11.407Z","2021-05-20T10:41:11.407Z"'
-      )
-    })
-  })
-
-  describe('new', function () {
-    beforeEach(function () {
-      this.req.params.name = 'publisher'
-      this.req.params.id = 'abc'
-    })
-
-    it('renders view', function (done) {
-      this.UserMembershipController.new(this.req, {
-        render: (viewPath, data) => {
-          expect(data.entityName).to.eq('publisher')
-          expect(data.entityId).to.eq('abc')
-          done()
-        },
-      })
-    })
-  })
-
-  describe('create', function () {
-    beforeEach(function () {
-      this.req.params.name = 'institution'
-      this.req.entityConfig = EntityConfigs.institution
-      this.req.params.id = 123
-    })
-
-    it('creates institution', function (done) {
-      this.UserMembershipController.create(this.req, {
-        redirect: path => {
-          expect(path).to.eq(EntityConfigs.institution.pathsFor(123).index)
-          sinon.assert.calledWithMatch(
-            this.UserMembershipHandler.createEntity,
-            123,
-            { modelName: 'Institution' }
-          )
-          done()
-        },
-      })
-    })
-  })
-})
diff --git a/services/web/test/unit/src/UserMembership/UserMembershipHandlerTests.js b/services/web/test/unit/src/UserMembership/UserMembershipHandlerTests.js
index f7b665aecd..3bf74c0ab7 100644
--- a/services/web/test/unit/src/UserMembership/UserMembershipHandlerTests.js
+++ b/services/web/test/unit/src/UserMembership/UserMembershipHandlerTests.js
@@ -48,7 +48,7 @@ describe('UserMembershipHandler', function () {
 
     this.UserMembershipViewModel = {
       promises: {
-        buildAsync: sinon.stub().resolves({ _id: 'mock-member-id' }),
+        buildAsync: sinon.stub().resolves([{ _id: 'mock-member-id' }]),
       },
       build: sinon.stub().returns(this.newUser),
     }
@@ -118,26 +118,26 @@ describe('UserMembershipHandler', function () {
           this.subscription,
           EntityConfigs.group
         )
-        const expectedCallcount =
-          this.subscription.member_ids.length +
-          this.subscription.invited_emails.length +
-          this.subscription.teamInvites.length
         expect(
-          this.UserMembershipViewModel.promises.buildAsync.callCount
-        ).to.equal(expectedCallcount)
+          this.UserMembershipViewModel.promises.buildAsync
+        ).to.be.calledOnceWith(
+          this.subscription.invited_emails.concat(
+            this.subscription.teamInvites[0].email,
+            this.subscription.member_ids
+          )
+        )
       })
     })
 
-    describe('group mamagers', function () {
+    describe('group managers', function () {
       it('build view model for all managers', async function () {
         await this.UserMembershipHandler.promises.getUsers(
           this.subscription,
           EntityConfigs.groupManagers
         )
-        const expectedCallcount = this.subscription.manager_ids.length
         expect(
-          this.UserMembershipViewModel.promises.buildAsync.callCount
-        ).to.equal(expectedCallcount)
+          this.UserMembershipViewModel.promises.buildAsync
+        ).to.be.calledOnceWith(this.subscription.manager_ids)
       })
     })
 
@@ -147,11 +147,9 @@ describe('UserMembershipHandler', function () {
           this.institution,
           EntityConfigs.institution
         )
-
-        const expectedCallcount = this.institution.managerIds.length
         expect(
-          this.UserMembershipViewModel.promises.buildAsync.callCount
-        ).to.equal(expectedCallcount)
+          this.UserMembershipViewModel.promises.buildAsync
+        ).to.be.calledOnceWith(this.institution.managerIds)
       })
     })
   })
diff --git a/services/web/test/unit/src/UserMembership/UserMembershipViewModelTests.js b/services/web/test/unit/src/UserMembership/UserMembershipViewModelTests.js
index a8ce9d158f..c5e21a5f48 100644
--- a/services/web/test/unit/src/UserMembership/UserMembershipViewModelTests.js
+++ b/services/web/test/unit/src/UserMembership/UserMembershipViewModelTests.js
@@ -25,7 +25,7 @@ const {
 
 describe('UserMembershipViewModel', function () {
   beforeEach(function () {
-    this.UserGetter = { getUser: sinon.stub() }
+    this.UserGetter = { getUsers: sinon.stub() }
     this.UserMembershipViewModel = SandboxedModule.require(modulePath, {
       requires: {
         'mongodb-legacy': { ObjectId },
@@ -87,9 +87,10 @@ describe('UserMembershipViewModel', function () {
     })
 
     it('build email', function (done) {
+      this.UserGetter.getUsers.yields(null, [])
       return this.UserMembershipViewModel.buildAsync(
-        this.email,
-        (error, viewModel) => {
+        [this.email],
+        (error, [viewModel]) => {
           assertCalledWith(this.UserMembershipViewModel.build, this.email)
           return done()
         }
@@ -97,9 +98,10 @@ describe('UserMembershipViewModel', function () {
     })
 
     it('build user', function (done) {
+      this.UserGetter.getUsers.yields(null, [])
       return this.UserMembershipViewModel.buildAsync(
-        this.user,
-        (error, viewModel) => {
+        [this.user],
+        (error, [viewModel]) => {
           assertCalledWith(this.UserMembershipViewModel.build, this.user)
           return done()
         }
@@ -107,30 +109,34 @@ describe('UserMembershipViewModel', function () {
     })
 
     it('build user id', function (done) {
-      this.UserGetter.getUser.yields(null, this.user)
+      const user = {
+        ...this.user,
+        _id: new ObjectId(),
+      }
+      this.UserGetter.getUsers.yields(null, [user])
       return this.UserMembershipViewModel.buildAsync(
-        new ObjectId(),
-        (error, viewModel) => {
+        [user._id],
+        (error, [viewModel]) => {
           expect(error).not.to.exist
           assertNotCalled(this.UserMembershipViewModel.build)
-          expect(viewModel._id).to.equal(this.user._id)
-          expect(viewModel.email).to.equal(this.user.email)
-          expect(viewModel.first_name).to.equal(this.user.first_name)
+          expect(viewModel._id.toString()).to.equal(user._id.toString())
+          expect(viewModel.email).to.equal(user.email)
+          expect(viewModel.first_name).to.equal(user.first_name)
           expect(viewModel.invite).to.equal(false)
           expect(viewModel.email).to.exist
           expect(viewModel.enrollment).to.exist
-          expect(viewModel.enrollment).to.deep.equal(this.user.enrollment)
+          expect(viewModel.enrollment).to.deep.equal(user.enrollment)
           return done()
         }
       )
     })
 
     it('build user id with error', function (done) {
-      this.UserGetter.getUser.yields(new Error('nope'))
+      this.UserGetter.getUsers.yields(new Error('nope'), [])
       const userId = new ObjectId()
       return this.UserMembershipViewModel.buildAsync(
-        userId,
-        (error, viewModel) => {
+        [userId],
+        (error, [viewModel]) => {
           expect(error).not.to.exist
           assertNotCalled(this.UserMembershipViewModel.build)
           expect(viewModel._id).to.equal(userId.toString())
diff --git a/services/web/test/unit/src/helpers/models/DeletedFile.js b/services/web/test/unit/src/helpers/models/DeletedFile.js
deleted file mode 100644
index 8e0b6a43b8..0000000000
--- a/services/web/test/unit/src/helpers/models/DeletedFile.js
+++ /dev/null
@@ -1,3 +0,0 @@
-const mockModel = require('../MockModel')
-
-module.exports = mockModel('DeletedFile')
diff --git a/services/web/test/unit/src/infrastructure/FeaturesTests.js b/services/web/test/unit/src/infrastructure/FeaturesTests.js
index dcdf1e4e62..b6d0090b3c 100644
--- a/services/web/test/unit/src/infrastructure/FeaturesTests.js
+++ b/services/web/test/unit/src/infrastructure/FeaturesTests.js
@@ -7,6 +7,7 @@ describe('Features', function () {
     this.Features = SandboxedModule.require(modulePath, {
       requires: {
         '@overleaf/settings': (this.settings = {
+          filestoreMigrationLevel: 0,
           moduleImportSequence: [],
           enabledLinkedFileTypes: [],
         }),
diff --git a/services/web/test/unit/src/infrastructure/ServeStaticWrapper.test.mjs b/services/web/test/unit/src/infrastructure/ServeStaticWrapper.test.mjs
new file mode 100644
index 0000000000..619fe74a2b
--- /dev/null
+++ b/services/web/test/unit/src/infrastructure/ServeStaticWrapper.test.mjs
@@ -0,0 +1,62 @@
+import { expect, vi } from 'vitest'
+import Path from 'node:path'
+import sinon from 'sinon'
+import MockResponse from '../helpers/MockResponse.js'
+import MockRequest from '../helpers/MockRequest.js'
+
+const modulePath = Path.join(
+  import.meta.dirname,
+  '../../../../app/src/infrastructure/ServeStaticWrapper'
+)
+
+describe('ServeStaticWrapperTests', function () {
+  let error = null
+
+  beforeEach(async function (ctx) {
+    ctx.req = new MockRequest()
+    ctx.res = new MockResponse()
+    ctx.express = {
+      static: () => (req, res, next) => {
+        if (error) {
+          next(error)
+        } else {
+          next()
+        }
+      },
+    }
+
+    vi.doMock('express', () => ({
+      default: ctx.express,
+    }))
+
+    ctx.serveStaticWrapper = (await import(modulePath)).default
+  })
+
+  afterEach(() => {
+    error = null
+  })
+
+  it('Premature close error thrown', async function (ctx) {
+    error = new Error()
+    error.code = 'ERR_STREAM_PREMATURE_CLOSE'
+    const middleware = ctx.serveStaticWrapper('test_folder', {})
+    const next = sinon.stub()
+    middleware(ctx.req, ctx.res, next)
+    expect(next.called).to.be.false
+  })
+
+  it('No error thrown', async function (ctx) {
+    const middleware = ctx.serveStaticWrapper('test_folder', {})
+    const next = sinon.stub()
+    middleware(ctx.req, ctx.res, next)
+    expect(next).to.be.calledWith()
+  })
+
+  it('Other error thrown', async function (ctx) {
+    error = new Error()
+    const middleware = ctx.serveStaticWrapper('test_folder', {})
+    const next = sinon.stub()
+    middleware(ctx.req, ctx.res, next)
+    expect(next).to.be.calledWith(error)
+  })
+})
diff --git a/services/web/test/unit/src/infrastructure/ServeStaticWrapperTests.mjs b/services/web/test/unit/src/infrastructure/ServeStaticWrapperTests.mjs
deleted file mode 100644
index 01fe5d7a0d..0000000000
--- a/services/web/test/unit/src/infrastructure/ServeStaticWrapperTests.mjs
+++ /dev/null
@@ -1,62 +0,0 @@
-import { strict as esmock } from 'esmock'
-import { expect } from 'chai'
-import Path from 'node:path'
-import { fileURLToPath } from 'node:url'
-import sinon from 'sinon'
-import MockResponse from '../helpers/MockResponse.js'
-import MockRequest from '../helpers/MockRequest.js'
-
-const __dirname = fileURLToPath(new URL('.', import.meta.url))
-const modulePath = Path.join(
-  __dirname,
-  '../../../../app/src/infrastructure/ServeStaticWrapper'
-)
-
-describe('ServeStaticWrapperTests', function () {
-  let error = null
-
-  beforeEach(async function () {
-    this.req = new MockRequest()
-    this.res = new MockResponse()
-    this.express = {
-      static: () => (req, res, next) => {
-        if (error) {
-          next(error)
-        } else {
-          next()
-        }
-      },
-    }
-    this.serveStaticWrapper = await esmock(modulePath, {
-      express: this.express,
-    })
-  })
-
-  this.afterEach(() => {
-    error = null
-  })
-
-  it('Premature close error thrown', async function () {
-    error = new Error()
-    error.code = 'ERR_STREAM_PREMATURE_CLOSE'
-    const middleware = this.serveStaticWrapper('test_folder', {})
-    const next = sinon.stub()
-    middleware(this.req, this.res, next)
-    expect(next.called).to.be.false
-  })
-
-  it('No error thrown', async function () {
-    const middleware = this.serveStaticWrapper('test_folder', {})
-    const next = sinon.stub()
-    middleware(this.req, this.res, next)
-    expect(next).to.be.calledWith()
-  })
-
-  it('Other error thrown', async function () {
-    error = new Error()
-    const middleware = this.serveStaticWrapper('test_folder', {})
-    const next = sinon.stub()
-    middleware(this.req, this.res, next)
-    expect(next).to.be.calledWith(error)
-  })
-})
diff --git a/services/web/test/unit/vitest_bootstrap.mjs b/services/web/test/unit/vitest_bootstrap.mjs
new file mode 100644
index 0000000000..e00720c5d6
--- /dev/null
+++ b/services/web/test/unit/vitest_bootstrap.mjs
@@ -0,0 +1,54 @@
+import { chai, vi } from 'vitest'
+import './common_bootstrap.js'
+import sinon from 'sinon'
+import logger from '@overleaf/logger'
+import sinonChai from 'sinon-chai'
+import chaiAsPromised from 'chai-as-promised'
+
+/*
+ * Chai configuration
+ */
+
+// add chai.should()
+chai.should()
+
+// Load sinon-chai assertions so expect(stubFn).to.have.been.calledWith('abc')
+// has a nicer failure messages
+chai.use(sinonChai)
+
+// Load promise support for chai
+chai.use(chaiAsPromised)
+
+// Do not truncate assertion errors
+chai.config.truncateThreshold = 0
+vi.mock('@overleaf/logger', async () => {
+  return {
+    default: {
+      debug: vi.fn(),
+      info: vi.fn(),
+      log: vi.fn(),
+      warn: vi.fn(),
+      err: vi.fn(),
+      error: vi.fn(),
+      fatal: vi.fn(),
+    },
+  }
+})
+
+beforeEach(ctx => {
+  // This function is a utility to duplicate the behaviour of passing `done` in place of `next` in an express route handler.
+  ctx.rejectOnError = reject => {
+    return err => {
+      if (err) {
+        reject(err)
+      }
+    }
+  }
+  ctx.logger = logger
+})
+
+afterEach(() => {
+  vi.restoreAllMocks()
+  vi.resetModules()
+  sinon.restore()
+})
diff --git a/services/web/tsconfig.json b/services/web/tsconfig.json
index 049642f997..63922ae9a7 100644
--- a/services/web/tsconfig.json
+++ b/services/web/tsconfig.json
@@ -1,13 +1,14 @@
 {
   "compilerOptions": {
     "target": "esnext" /* Specify ECMAScript target version */,
-    "module": "es2020" /* Specify module code generation */,
+    "module": "esnext" /* Specify module code generation */,
     "allowJs": true /* Allow JavaScript files to be compiled. */,
     //    "checkJs": true /* Report errors in .js files. */,
     "jsx": "preserve" /* Specify JSX code generation */,
     "noEmit": true /* Do not emit outputs. */,
     "strict": true /* Enable all strict type-checking options. */,
     "moduleResolution": "node" /* Specify module resolution strategy */,
+    "isolatedModules": true,
     "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */,
     "skipLibCheck": true /* Skip type checking of declaration files. */,
     "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
diff --git a/services/web/types/admin-capabilities.ts b/services/web/types/admin-capabilities.ts
new file mode 100644
index 0000000000..0c98d7df04
--- /dev/null
+++ b/services/web/types/admin-capabilities.ts
@@ -0,0 +1,10 @@
+export type AdminCapability = 'modify-user-email' | 'view-project'
+
+export type AdminRole =
+  | 'engagement'
+  | 'engineering'
+  | 'finance'
+  | 'product'
+  | 'sales'
+  | 'support'
+  | 'support_tier_1'
diff --git a/services/web/types/admin/subscription.ts b/services/web/types/admin/subscription.ts
index bbcdd3b953..2d23da20f2 100644
--- a/services/web/types/admin/subscription.ts
+++ b/services/web/types/admin/subscription.ts
@@ -1,7 +1,15 @@
-import { GroupPolicy } from '../subscription/dashboard/subscription'
+import {
+  GroupPolicy,
+  PaymentProvider,
+} from '../subscription/dashboard/subscription'
 import { SSOConfig } from '../subscription/sso'
 import { TeamInvite } from '../team-invite'
 
+type RecurlyAdminClientPaymentProvider = Record<string, never>
+type StripeAdminClientPaymentProvider = PaymentProvider & {
+  service: 'stripe-us' | 'stripe-uk'
+}
+
 export type Subscription = {
   _id: string
   teamInvites: TeamInvite[]
@@ -10,7 +18,15 @@ export type Subscription = {
   groupPlan: boolean
   customAccount: boolean
   ssoConfig: SSOConfig
+  domainCaptureEnabled?: boolean
   managedUsersEnabled: boolean
   v1_id: number
   salesforce_id: string
+  recurlySubscription_id?: string
+  paymentProvider:
+    | RecurlyAdminClientPaymentProvider
+    | StripeAdminClientPaymentProvider
+  features: {
+    domainCapture?: boolean
+  }
 }
diff --git a/services/web/types/capabilities.ts b/services/web/types/capabilities.ts
new file mode 100644
index 0000000000..961c554cfa
--- /dev/null
+++ b/services/web/types/capabilities.ts
@@ -0,0 +1,11 @@
+export type Capability =
+  | 'add-secondary-email'
+  | 'change-password'
+  | 'chat'
+  | 'delete-own-account'
+  | 'dropbox'
+  | 'endorse-email'
+  | 'join-subscription'
+  | 'leave-group-subscription'
+  | 'start-subscription'
+  | 'use-ai'
diff --git a/services/web/types/cms.ts b/services/web/types/cms.ts
index 6930603c83..1f9e4beebc 100644
--- a/services/web/types/cms.ts
+++ b/services/web/types/cms.ts
@@ -12,14 +12,17 @@ export type IconElementSticker =
   | 'sticker | globe | green'
   | 'sticker | house-tree | grey | large'
   | 'sticker | hub | tangerine'
+  | 'sticker | journal | grey'
   | 'sticker | lock | grey | medium'
   | 'sticker | lightning | yellow'
   | 'sticker | overleaf | green | medium'
   | 'sticker | pen | purple'
   | 'sticker | pen | tangerine'
+  | 'sticker | pen | yellow'
   | 'sticker | pi | tangerine'
   | 'sticker | rocket | yellow'
   | 'sticker | rocket | yellow | medium'
+  | 'sticker | support | green'
   | 'sticker | support | tangerine'
   | 'sticker | support | yellow'
   | 'sticker | waving-hand | purple | medium'
diff --git a/services/web/types/cobranding.ts b/services/web/types/cobranding.ts
new file mode 100644
index 0000000000..dc6ae75964
--- /dev/null
+++ b/services/web/types/cobranding.ts
@@ -0,0 +1,12 @@
+export type Cobranding = {
+  logoImgUrl: string
+  brandVariationName: string
+  brandVariationId: number
+  brandId: number
+  brandVariationHomeUrl: string
+  publishGuideHtml?: string
+  partner?: string
+  brandedMenu?: boolean
+  submitBtnHtml?: string
+  submitBtnHtmlNoBreaks?: string
+}
diff --git a/services/web/types/compile.ts b/services/web/types/compile.ts
index 11767f36ef..3038893529 100644
--- a/services/web/types/compile.ts
+++ b/services/web/types/compile.ts
@@ -1,6 +1,7 @@
 export type CompileOutputFile = {
   path: string
   url: string
+  downloadURL?: string
   type: string
   build: string
   ranges?: {
@@ -22,6 +23,7 @@ export type CompileResponseData = {
   outputFiles: CompileOutputFile[]
   compileGroup?: string
   clsiServerId?: string
+  clsiCacheShard?: string
   pdfDownloadDomain?: string
   pdfCachingMinChunkSize: number
   validationProblems: any
diff --git a/services/web/types/css-properties-with-variables.tsx b/services/web/types/css-properties-with-variables.tsx
new file mode 100644
index 0000000000..fe0e85902a
--- /dev/null
+++ b/services/web/types/css-properties-with-variables.tsx
@@ -0,0 +1,4 @@
+import { CSSProperties } from 'react'
+
+export type CSSPropertiesWithVariables = CSSProperties &
+  Record<`--${string}`, number | string>
diff --git a/services/web/types/exposed-settings.ts b/services/web/types/exposed-settings.ts
index 9656441fa9..f9d929d13a 100644
--- a/services/web/types/exposed-settings.ts
+++ b/services/web/types/exposed-settings.ts
@@ -25,6 +25,7 @@ export type ExposedSettings = {
   isOverleaf: boolean
   maxEntitiesPerProject: number
   projectUploadTimeout: number
+  propensityId?: string
   maxUploadSize: number
   recaptchaDisabled: {
     invite: boolean
diff --git a/services/web/types/group-management/group-audit-log.ts b/services/web/types/group-management/group-audit-log.ts
new file mode 100644
index 0000000000..c96c12e7cd
--- /dev/null
+++ b/services/web/types/group-management/group-audit-log.ts
@@ -0,0 +1,7 @@
+export type GroupAuditLog = {
+  groupId: string
+  operation: string
+  ipAddress?: string
+  initiatorId?: string
+  info?: object
+}
diff --git a/services/web/types/onboarding.ts b/services/web/types/onboarding.ts
new file mode 100644
index 0000000000..11ae3e51d0
--- /dev/null
+++ b/services/web/types/onboarding.ts
@@ -0,0 +1,25 @@
+export type UsedLatex = 'never' | 'occasionally' | 'often'
+export type Occupation =
+  | 'university'
+  | 'company'
+  | 'nonprofitngo'
+  | 'government'
+  | 'other'
+
+export type OnboardingFormData = {
+  firstName: string
+  lastName: string
+  primaryOccupation: Occupation | null
+  usedLatex: UsedLatex | null
+  companyDivisionDepartment: string
+  companyJobTitle: string
+  governmentJobTitle: string
+  institutionName: string
+  otherJobTitle: string
+  nonprofitDivisionDepartment: string
+  nonprofitJobTitle: string
+  role: string
+  subjectArea: string
+  updatedAt?: Date
+  shouldReceiveUpdates?: boolean
+}
diff --git a/services/web/types/project.ts b/services/web/types/project.ts
index 83a28533b3..0fc21533e2 100644
--- a/services/web/types/project.ts
+++ b/services/web/types/project.ts
@@ -25,7 +25,8 @@ export type Project = {
   owner: MongoUser
   members: ProjectMember[]
   invites: ProjectInvite[]
-  rootDoc_id?: string
+  // `rootDoc_id` in the backend; `rootDocId` in the frontend
+  rootDocId?: string
   rootFolder?: Folder[]
   deletedByExternalDataSource?: boolean
 }
diff --git a/services/web/types/project/dashboard/subscription.ts b/services/web/types/project/dashboard/subscription.ts
index 3501ad8c38..c8f8835b34 100644
--- a/services/web/types/project/dashboard/subscription.ts
+++ b/services/web/types/project/dashboard/subscription.ts
@@ -1,3 +1,8 @@
+import {
+  SubscriptionState,
+  PaymentProvider,
+} from '../../subscription/dashboard/subscription'
+
 type SubscriptionBase = {
   featuresPageURL: string
 }
@@ -9,7 +14,7 @@ export type FreePlanSubscription = {
 type FreeSubscription = FreePlanSubscription
 
 type RecurlyStatus = {
-  state: 'active' | 'canceled' | 'expired' | 'paused'
+  state: SubscriptionState
 }
 
 type PaidSubscriptionBase = {
@@ -20,6 +25,7 @@ type PaidSubscriptionBase = {
     teamName?: string
     name: string
     recurlyStatus?: RecurlyStatus
+    paymentProvider?: PaymentProvider
   }
 } & SubscriptionBase
 
diff --git a/services/web/types/project/dashboard/survey.d.ts b/services/web/types/project/dashboard/survey.d.ts
index f43b454196..2dc3d9b7ec 100644
--- a/services/web/types/project/dashboard/survey.d.ts
+++ b/services/web/types/project/dashboard/survey.d.ts
@@ -1,6 +1,7 @@
 export type Survey = {
   name: string
-  preText: string
-  linkText: string
+  title: string
+  text: string
+  cta?: string
   url: string
 }
diff --git a/services/web/types/review-panel/review-panel.ts b/services/web/types/review-panel/review-panel.ts
index 200f904430..cba5490ab0 100644
--- a/services/web/types/review-panel/review-panel.ts
+++ b/services/web/types/review-panel/review-panel.ts
@@ -20,6 +20,6 @@ export interface ReviewPanelCommentThreadMessage {
   content: string
   id: CommentId
   timestamp: Date
-  user: ReviewPanelUser
+  user?: ReviewPanelUser
   user_id: UserId
 }
diff --git a/services/web/types/share-doc.ts b/services/web/types/share-doc.ts
index d071c97f28..7c75e6d0de 100644
--- a/services/web/types/share-doc.ts
+++ b/services/web/types/share-doc.ts
@@ -1,9 +1,23 @@
 import EventEmitter from 'events'
+import { StringFileData } from 'overleaf-editor-core'
 
 // type for the Doc class in vendor/libs/sharejs.js
-export interface ShareDoc extends EventEmitter {
+export interface ShareLatexOTShareDoc extends EventEmitter {
+  otType: 'sharejs-text-ot'
+  snapshot: string
   detach_cm6?: () => void
   getText: () => string
   insert: (pos: number, insert: string, fromUndo: boolean) => void
   del: (pos: number, length: number, fromUndo: boolean) => void
+  submitOp(op: any[]): void
 }
+
+export interface HistoryOTShareDoc extends EventEmitter {
+  otType: 'history-ot'
+  snapshot: StringFileData
+  detach_cm6?: () => void
+  getText: () => string
+  submitOp(op: any[]): void
+}
+
+export type ShareDoc = ShareLatexOTShareDoc | HistoryOTShareDoc
diff --git a/services/web/types/stripe/metadata.ts b/services/web/types/stripe/metadata.ts
new file mode 100644
index 0000000000..17861d3d16
--- /dev/null
+++ b/services/web/types/stripe/metadata.ts
@@ -0,0 +1,14 @@
+import Stripe from 'stripe'
+import { RecurlyPlanCode } from '../subscription/plan'
+
+type MetadataPlanCode = Exclude<
+  RecurlyPlanCode,
+  | 'professional_free_trial_7_days'
+  | 'student_free_trial_7_days'
+  | 'collaborator_free_trial_7_days'
+>
+
+export type ProductMetadata = Stripe.Metadata & {
+  planCode: MetadataPlanCode
+  addOnCode?: Extract<RecurlyPlanCode, 'assistant'>
+}
diff --git a/services/web/types/stripe/region.ts b/services/web/types/stripe/region.ts
new file mode 100644
index 0000000000..b450afa761
--- /dev/null
+++ b/services/web/types/stripe/region.ts
@@ -0,0 +1 @@
+export type StripeRegion = 'us' | 'uk'
diff --git a/services/web/types/stripe/webhook-event.ts b/services/web/types/stripe/webhook-event.ts
new file mode 100644
index 0000000000..f0a08284ed
--- /dev/null
+++ b/services/web/types/stripe/webhook-event.ts
@@ -0,0 +1,76 @@
+import Stripe from 'stripe'
+
+export type CustomerSubscriptionUpdatedWebhookEvent = {
+  type: 'customer.subscription.updated'
+  data: {
+    object: Stripe.Subscription & {
+      metadata: {
+        adminUserId?: string
+      }
+    }
+    // https://docs.stripe.com/api/events/object?api-version=2025-04-30.basil#event_object-data-previous_attributes
+    previous_attributes: {
+      cancel_at_period_end?: boolean // will only be present if the subscription was cancelled or reactivated
+      items?: {
+        // will be present if the subscription was downgraded, upgraded, or renewed
+        data: [
+          {
+            price: {
+              id: string
+            }
+            quantity: number
+          },
+        ]
+      }
+      status?: Stripe.Subscription.Status
+    }
+  }
+}
+
+export type CustomerSubscriptionCreatedWebhookEvent = {
+  type: 'customer.subscription.created'
+  data: {
+    object: Stripe.Subscription & {
+      metadata: {
+        adminUserId?: string
+      }
+    }
+  }
+}
+
+export type CustomerSubscriptionsDeletedWebhookEvent = {
+  type: 'customer.subscription.deleted'
+  data: {
+    object: Stripe.Subscription & {
+      metadata: {
+        adminUserId?: string
+      }
+    }
+  }
+}
+
+export type InvoicePaidWebhookEvent = {
+  type: 'invoice.paid'
+  data: {
+    object: Stripe.Invoice
+  }
+  request: Stripe.Event.Request
+}
+
+export type PaymentIntentPaymentFailedWebhookEvent = {
+  type: 'payment_intent.payment_failed'
+  data: {
+    object: Stripe.PaymentIntent
+  }
+  request: Stripe.Event.Request
+}
+
+export type CustomerSubscriptionWebhookEvent =
+  | CustomerSubscriptionUpdatedWebhookEvent
+  | CustomerSubscriptionCreatedWebhookEvent
+  | CustomerSubscriptionsDeletedWebhookEvent
+
+export type WebhookEvent =
+  | CustomerSubscriptionWebhookEvent
+  | InvoicePaidWebhookEvent
+  | PaymentIntentPaymentFailedWebhookEvent
diff --git a/services/web/types/subscription/analytics-event.ts b/services/web/types/subscription/analytics-event.ts
new file mode 100644
index 0000000000..98ce12fdf1
--- /dev/null
+++ b/services/web/types/subscription/analytics-event.ts
@@ -0,0 +1,56 @@
+import { CurrencyCode } from './currency'
+import {
+  PaymentProvider,
+  StripePaymentProviderService,
+} from './dashboard/subscription'
+import { RecurlyPlanCode } from './plan'
+
+type PaymentPageFormSubmitEventBaseSegmentation = {
+  currencyCode: CurrencyCode
+  plan_code?: string
+  coupon_code: string
+  isPaypal: boolean
+  upgradeType: 'standalone'
+  referrer?: string
+}
+
+type PaymentPageFormSubmitEventStripeSegmentation =
+  PaymentPageFormSubmitEventBaseSegmentation & {
+    payment_provider: StripePaymentProviderService
+    stripe_price_id: string
+    stripe_price_lookup_key: string
+  }
+
+type PaymentPageFormSubmitEventRecurlySegmentation =
+  PaymentPageFormSubmitEventBaseSegmentation & {
+    payment_provider: Exclude<
+      PaymentProvider['service'],
+      'stripe-us' | 'stripe-uk'
+    >
+  }
+
+export type PaymentPageFormSubmitEventSegmentation =
+  | PaymentPageFormSubmitEventStripeSegmentation
+  | PaymentPageFormSubmitEventRecurlySegmentation
+
+type PaymentPageFormSuccessEventBaseSegmentation = {
+  plan?: RecurlyPlanCode
+  upgradeType: 'standalone'
+  referrer?: string
+}
+
+type PaymentPageFormSuccessEventStripeSegmentation =
+  PaymentPageFormSuccessEventBaseSegmentation & {
+    payment_provider: StripePaymentProviderService
+    stripe_price_id: string
+    stripe_price_lookup_key: string
+  }
+
+type PaymentPageFormSuccessEventRecurlySegmentation =
+  PaymentPageFormSuccessEventBaseSegmentation & {
+    payment_provider: 'recurly'
+  }
+
+export type PaymentPageFormSuccessEventSegmentation =
+  | PaymentPageFormSuccessEventStripeSegmentation
+  | PaymentPageFormSuccessEventRecurlySegmentation
diff --git a/services/web/types/subscription/currency.ts b/services/web/types/subscription/currency.ts
index 8d6b88dc0b..d63d71be74 100644
--- a/services/web/types/subscription/currency.ts
+++ b/services/web/types/subscription/currency.ts
@@ -20,3 +20,4 @@ export const currencies = <const>{
 
 type Currency = typeof currencies
 export type CurrencyCode = keyof Currency
+export type StripeCurrencyCode = Lowercase<CurrencyCode>
diff --git a/services/web/types/subscription/dashboard/modal-ids.ts b/services/web/types/subscription/dashboard/modal-ids.ts
index bbc13614c2..d878c356d7 100644
--- a/services/web/types/subscription/dashboard/modal-ids.ts
+++ b/services/web/types/subscription/dashboard/modal-ids.ts
@@ -5,5 +5,6 @@ export type SubscriptionDashModalIds =
   | 'leave-group'
   | 'change-plan'
   | 'cancel-ai-add-on'
+  | 'manage-on-writefull'
   | 'pause-subscription'
   | 'unpause-subscription'
diff --git a/services/web/types/subscription/dashboard/subscription.ts b/services/web/types/subscription/dashboard/subscription.ts
index c67f249c4c..694e5b948c 100644
--- a/services/web/types/subscription/dashboard/subscription.ts
+++ b/services/web/types/subscription/dashboard/subscription.ts
@@ -1,55 +1,57 @@
 import { CurrencyCode } from '../currency'
 import { Nullable } from '../../utils'
-import { Plan, AddOn, RecurlyAddOn } from '../plan'
+import {
+  Plan,
+  AddOn,
+  PaymentProviderAddOn,
+  PendingPaymentProviderPlan,
+} from '../plan'
 import { User } from '../../user'
 
-type SubscriptionState = 'active' | 'canceled' | 'expired' | 'paused'
+export type SubscriptionState =
+  | 'active'
+  | 'canceled'
+  | 'expired'
+  | 'paused'
+  | 'past_due'
 
 // when puchasing a new add-on in recurly, we only need to provide the code
 export type PurchasingAddOnCode = {
   code: string
 }
 
-type Recurly = {
-  tax: number
+type PaymentProviderCoupon = {
+  code: string
+  name: string
+  description: string
+}
+
+type PaymentProviderRecord = {
   taxRate: number
   billingDetailsLink: string
   accountManagementLink: string
   additionalLicenses: number
-  addOns: RecurlyAddOn[]
+  addOns: PaymentProviderAddOn[]
   totalLicenses: number
   nextPaymentDueAt: string
   nextPaymentDueDate: string
   currency: CurrencyCode
   state?: SubscriptionState
   trialEndsAtFormatted: Nullable<string>
-  trial_ends_at: Nullable<string>
-  activeCoupons: any[] // TODO: confirm type in array
-  account: {
-    email: string
-    created_at: string
-    // data via Recurly API
-    has_canceled_subscription: {
-      _: 'false' | 'true'
-      $: {
-        type: 'boolean'
-      }
-    }
-    has_past_due_invoice: {
-      _: 'false' | 'true'
-      $: {
-        type: 'boolean'
-      }
-    }
-  }
+  trialEndsAt: Nullable<string>
+  activeCoupons: PaymentProviderCoupon[]
+  accountEmail: string
+  hasPastDueInvoice: boolean
   displayPrice: string
   planOnlyDisplayPrice: string
   addOnDisplayPricesWithoutAdditionalLicense: Record<string, string>
-  currentPlanDisplayPrice?: string
   pendingAdditionalLicenses?: number
   pendingTotalLicenses?: number
   pausedAt?: Nullable<string>
   remainingPauseCycles?: Nullable<number>
+  isEligibleForPause: boolean
+  isEligibleForGroupPlan: boolean
+  isEligibleForDowngradeUpsell: boolean
 }
 
 export type GroupPolicy = {
@@ -67,21 +69,20 @@ export type Subscription = {
   membersLimit: number
   teamInvites: object[]
   planCode: string
-  recurlySubscription_id: string
   plan: Plan
-  pendingPlan?: Plan
+  pendingPlan?: PendingPaymentProviderPlan
   addOns?: AddOn[]
 }
 
-export type RecurlySubscription = Subscription & {
-  recurly: Recurly
+export type PaidSubscription = Subscription & {
+  payment: PaymentProviderRecord
 }
 
 export type CustomSubscription = Subscription & {
   customAccount: boolean
 }
 
-export type GroupSubscription = RecurlySubscription & {
+export type GroupSubscription = PaidSubscription & {
   teamName: string
   teamNotice?: string
 }
@@ -105,3 +106,22 @@ export type MemberGroupSubscription = Omit<GroupSubscription, 'admin_id'> & {
   planLevelName: string
   admin_id: User
 }
+
+type PaymentProviderService = 'stripe-us' | 'stripe-uk' | 'recurly'
+export type StripePaymentProviderService = Exclude<
+  PaymentProviderService,
+  'recurly'
+>
+
+export type PaymentProvider = {
+  service: PaymentProviderService
+  subscriptionId: string
+  state: SubscriptionState
+  trialStartedAt?: Nullable<Date>
+  trialEndsAt?: Nullable<Date>
+}
+
+export type SubscriptionRequesterData = {
+  id?: string
+  ip?: string
+}
diff --git a/services/web/types/subscription/payment-context-value.tsx b/services/web/types/subscription/payment-context-value.tsx
index 496f7e027b..2df1265270 100644
--- a/services/web/types/subscription/payment-context-value.tsx
+++ b/services/web/types/subscription/payment-context-value.tsx
@@ -73,5 +73,4 @@ export type PaymentContextValue = {
     React.SetStateAction<PaymentContextValue['studentConfirmationChecked']>
   >
   updatePlan: (newPlanCode: string) => void
-  showNudgeToAnnualText: boolean
 }
diff --git a/services/web/types/subscription/plan.ts b/services/web/types/subscription/plan.ts
index 8747663575..d6f3008a19 100644
--- a/services/web/types/subscription/plan.ts
+++ b/services/web/types/subscription/plan.ts
@@ -1,3 +1,5 @@
+import { StripeCurrencyCode } from './currency'
+
 type Features = {
   collaborators: number
   compileGroup: string
@@ -22,19 +24,21 @@ export type AddOn = {
   unitAmountInCents: number
 }
 
-// add-ons directly accessed through recurly
-export type RecurlyAddOn = {
-  add_on_code: string
+// add-ons directly accessed through payment
+export type PaymentProviderAddOn = {
+  code: string
+  name: string
   quantity: number
-  unit_amount_in_cents: number
-  displayPrice: string
+  unitPrice: number
+  amount?: number
+  displayPrice?: string
 }
 
-export type PendingRecurlyPlan = {
+export type PendingPaymentProviderPlan = {
   annual?: boolean
   displayPrice?: string
   featureDescription?: Record<string, unknown>[]
-  addOns?: RecurlyAddOn[]
+  addOns?: PaymentProviderAddOn[]
   features?: Features
   groupPlan?: boolean
   hideFromUsers?: boolean
@@ -58,6 +62,7 @@ export type Plan = {
   name: string
   planCode: string
   price_in_cents: number
+  canUseFlexibleLicensing?: boolean
 }
 
 export type PriceForDisplayData = {
@@ -79,11 +84,31 @@ export type RecurlyPlanCode =
   | 'student'
   | 'student-annual'
   | 'student_free_trial_7_days'
+  | 'group_professional'
+  | 'group_professional_educational'
+  | 'group_collaborator'
+  | 'group_collaborator_educational'
+  | 'assistant'
+  | 'assistant-annual'
 
-export type StripeLookupKey =
-  | 'collaborator_monthly'
-  | 'collaborator_annual'
+export type RecurlyAddOnCode = 'assistant'
+
+export type StripeBaseLookupKey =
+  | 'standard_monthly'
+  | 'standard_annual'
   | 'professional_monthly'
   | 'professional_annual'
   | 'student_monthly'
   | 'student_annual'
+  | 'assistant_annual'
+  | 'assistant_monthly'
+  // TODO: change all group plans' lookup_keys to match the UK account after they have been added
+  | 'group_standard_enterprise'
+  | 'group_professional_enterprise'
+  | 'group_standard_educational'
+  | 'group_professional_educational'
+
+export type StripeLookupKeyVersion = 'jun2025'
+
+export type StripeLookupKey =
+  `${StripeBaseLookupKey}_${StripeLookupKeyVersion}_${StripeCurrencyCode}`
diff --git a/services/web/types/subscription/sso.ts b/services/web/types/subscription/sso.ts
index cf869ec741..6500817407 100644
--- a/services/web/types/subscription/sso.ts
+++ b/services/web/types/subscription/sso.ts
@@ -13,6 +13,7 @@ export type SSOConfig = {
   userLastNameAttribute?: string
   validated?: boolean
   enabled?: boolean
+  useSettingsUKAMF?: boolean
 }
 
 export type GroupSSOLinkingStatus = {
diff --git a/services/web/types/subscription/subscription-change-preview.ts b/services/web/types/subscription/subscription-change-preview.ts
index 6476ebd7de..5152b80e6e 100644
--- a/services/web/types/subscription/subscription-change-preview.ts
+++ b/services/web/types/subscription/subscription-change-preview.ts
@@ -1,7 +1,8 @@
 export type SubscriptionChangePreview = {
   change: SubscriptionChangeDescription
   currency: string
-  paymentMethod: string
+  paymentMethod: string | undefined
+  netTerms: number
   nextPlan: {
     annual: boolean
   }
diff --git a/services/web/types/template.ts b/services/web/types/template.ts
new file mode 100644
index 0000000000..214c388969
--- /dev/null
+++ b/services/web/types/template.ts
@@ -0,0 +1,16 @@
+export type Template = {
+  id: string
+  version: number
+  name: string
+  lastUpdated: Date
+  author: string
+  authorMD: string
+  description: string
+  descriptionMD: string
+  license: string
+  category: string
+  compiler?: string
+  language?: string
+  owner: string
+}
+
diff --git a/services/web/types/user-settings.ts b/services/web/types/user-settings.ts
index 3e748d937e..add460edfa 100644
--- a/services/web/types/user-settings.ts
+++ b/services/web/types/user-settings.ts
@@ -17,4 +17,5 @@ export type UserSettings = {
   mathPreview: boolean
   referencesSearchMode: 'advanced' | 'simple'
   enableNewEditor: boolean
+  breadcrumbs: boolean
 }
diff --git a/services/web/types/user.ts b/services/web/types/user.ts
index d87eb6ab80..2fce1ce46b 100644
--- a/services/web/types/user.ts
+++ b/services/web/types/user.ts
@@ -39,13 +39,12 @@ export type User = {
   isAdmin?: boolean
   email: string
   allowedFreeTrial?: boolean
-  hasRecurlySubscription?: boolean
+  hasPaidSubscription?: boolean
   first_name?: string
   last_name?: string
   alphaProgram?: boolean
   betaProgram?: boolean
   labsProgram?: boolean
-  isLatexBeginner?: boolean
   signUpDate?: string // date string
   features?: Features
   refProviders?: RefProviders
@@ -53,12 +52,15 @@ export type User = {
     enabled: boolean
     autoCreatedAccount: boolean
     firstAutoLoad: boolean
+    premiumSource: string
   }
   aiErrorAssistant?: {
     enabled: boolean
   }
   featureUsage?: FeatureUsage
   planCode?: string
+  planName?: string
+  isAnnualPlan?: boolean
   isMemberOfGroupSubscription?: boolean
   hasInstitutionLicence?: boolean
 }
diff --git a/services/web/types/web-module.ts b/services/web/types/web-module.ts
index 406d03d85b..f6b59cdf6f 100644
--- a/services/web/types/web-module.ts
+++ b/services/web/types/web-module.ts
@@ -1,3 +1,5 @@
+import type { RequestHandler } from 'express'
+
 type LinkedFileAgent = {
   createLinkedFile: (
     projectId: string,
@@ -41,15 +43,23 @@ export type WebModule = {
       privateApiRouter?: any,
       publicApiRouter?: any
     ) => void
+    applyNonCsrfRouter?: (
+      webRouter: any,
+      privateApiRouter?: any,
+      publicApiRouter?: any
+    ) => void
   }
   nonCsrfRouter?: {
     apply: (webRouter: any, privateApiRouter: any, publicApiRouter: any) => void
   }
   hooks?: {
-    [name: string]: (args: any[]) => void
+    promises?: {
+      [name: string]: (...args: any[]) => Promise<any>
+    }
+    [name: string]: ((...args: any[]) => void) | any
   }
   middleware?: {
-    [name: string]: (req: any, res: any, next: any) => void
+    [name: string]: RequestHandler
   }
   sessionMiddleware?: (webRouter: any, options: any) => void
   start?: () => Promise<void>
@@ -57,4 +67,5 @@ export type WebModule = {
   linkedFileAgents?: {
     [name: string]: () => LinkedFileAgent
   }
+  viewIncludes?: Record<string, string[]>
 }
diff --git a/services/web/types/window.ts b/services/web/types/window.ts
index 1150bf1e50..6869e90957 100644
--- a/services/web/types/window.ts
+++ b/services/web/types/window.ts
@@ -1,20 +1,11 @@
 import 'recurly__recurly-js'
 import { ScopeValueStore } from './ide/scope-value-store'
 import { MetaAttributesCache } from '@/utils/meta'
-import { Socket } from '@/features/ide-react/connection/types/socket'
 
 declare global {
   // eslint-disable-next-line no-unused-vars
   interface Window {
     metaAttributesCache: MetaAttributesCache
-    _ide: Record<string, unknown> & {
-      $scope: Record<string, unknown> & {
-        pdf?: {
-          logEntryAnnotations: Record<string, unknown>
-        }
-      }
-      socket: Socket
-    }
     MathJax: Record<string, any>
     // For react-google-recaptcha
     recaptchaOptions?: {
@@ -34,5 +25,8 @@ declare global {
     }
     ga?: (...args: any) => void
     gtag?: (...args: any) => void
+
+    propensity?: (propensityId?: string) => void
+    olLoadGA?: () => void
   }
 }
diff --git a/services/web/vitest.config.js b/services/web/vitest.config.js
new file mode 100644
index 0000000000..51f4ed811f
--- /dev/null
+++ b/services/web/vitest.config.js
@@ -0,0 +1,13 @@
+const { defineConfig } = require('vitest/config')
+
+module.exports = defineConfig({
+  test: {
+    include: [
+      'modules/*/test/unit/**/*.test.mjs',
+      'test/unit/src/**/*.test.mjs',
+    ],
+    setupFiles: ['./test/unit/vitest_bootstrap.mjs'],
+    globals: true,
+    isolate: false,
+  },
+})
diff --git a/services/web/webpack.config.js b/services/web/webpack.config.js
index deb480ca36..94144eeea2 100644
--- a/services/web/webpack.config.js
+++ b/services/web/webpack.config.js
@@ -26,6 +26,7 @@ const entryPoints = {
   'main-light-style': './frontend/stylesheets/main-light-style.less',
   'main-style-bootstrap-5':
     './frontend/stylesheets/bootstrap-5/main-style.scss',
+  tracking: './frontend/js/infrastructure/tracking.ts',
 }
 
 // Add entrypoints for each "page"
@@ -380,12 +381,22 @@ module.exports = {
           context: `${dictionariesDir}/dictionaries`,
         },
         // Copy CMap files (used to provide support for non-Latin characters),
-        // fonts and images from pdfjs-dist package to build output.
+        // wasm, ICC profiles, fonts and images from pdfjs-dist package to build output.
         {
           from: 'cmaps',
           to: 'js/pdfjs-dist/cmaps',
           context: pdfjsDir,
         },
+        {
+          from: 'iccs',
+          to: 'js/pdfjs-dist/iccs',
+          context: pdfjsDir,
+        },
+        {
+          from: 'wasm',
+          to: 'js/pdfjs-dist/wasm',
+          context: pdfjsDir,
+        },
         {
           from: 'standard_fonts',
           to: 'fonts/pdfjs-dist',